Resize fsrs params input to fit content (#3999)

* resize param input on value change

* resize on window resize
This commit is contained in:
llama 2025-05-15 14:41:30 +08:00 committed by GitHub
parent 8f2c708751
commit 97b12b420a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -3,11 +3,25 @@ Copyright: Ankitects Pty Ltd and contributors
License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
--> -->
<script lang="ts"> <script lang="ts">
import { tick } from "svelte";
export let value: number[]; export let value: number[];
export let defaults: number[]; export let defaults: number[];
let stringValue: string; let stringValue: string;
$: stringValue = render(value); let taRef: HTMLTextAreaElement;
function updateHeight() {
if (taRef) {
taRef.style.height = "auto";
taRef.style.height = `${taRef.scrollHeight}px`;
}
}
$: {
stringValue = render(value);
tick().then(updateHeight);
}
function render(params: number[]): string { function render(params: number[]): string {
return params.map((v) => v.toFixed(4)).join(", "); return params.map((v) => v.toFixed(4)).join(", ");
@ -22,7 +36,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
} }
</script> </script>
<svelte:window onresize={updateHeight} />
<textarea <textarea
bind:this={taRef}
value={stringValue} value={stringValue}
on:blur={update} on:blur={update}
class="w-100" class="w-100"