@spaethtech/svelte-ui 0.21.2 → 0.21.3-dev.142.aa5d0fa
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
|
+
import { onMount } from "svelte";
|
|
2
3
|
import type { Snippet } from "svelte";
|
|
3
4
|
import type { HTMLInputAttributes } from "svelte/elements";
|
|
4
5
|
import type { Size } from "../types/sizes.js";
|
|
@@ -99,6 +100,19 @@
|
|
|
99
100
|
element = inputElement;
|
|
100
101
|
});
|
|
101
102
|
|
|
103
|
+
// Recover text typed (or autofilled) BEFORE hydration. With a one-way `value` binding Svelte
|
|
104
|
+
// overwrites the DOM input with the initial prop value on hydration, so anything entered on the
|
|
105
|
+
// SSR'd page before the client took over is lost and never flows back into `value` (no input event
|
|
106
|
+
// fires for it). Once mounted, if the live DOM value differs from the prop, adopt it — matching what
|
|
107
|
+
// a native `<input bind:value>` does, without touching steady-state semantics: a wrapper that drives
|
|
108
|
+
// `value` from derived/formatted state (e.g. NumberInput's `stringValue`) sees a matching value and
|
|
109
|
+
// no write happens. Fixes dropped input on slow devices, autofill, and password managers.
|
|
110
|
+
onMount(() => {
|
|
111
|
+
if (inputElement && inputElement.value !== String(value ?? "")) {
|
|
112
|
+
value = inputElement.value;
|
|
113
|
+
}
|
|
114
|
+
});
|
|
115
|
+
|
|
102
116
|
// Validation logic
|
|
103
117
|
let validationResult = $state<boolean | string>(true);
|
|
104
118
|
|