@samuel-charpentier/sform 0.0.7 → 0.0.8
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.
package/dist/Sform/Sfield.svelte
CHANGED
|
@@ -6,7 +6,6 @@
|
|
|
6
6
|
TypedSfieldProps
|
|
7
7
|
} from './types.js';
|
|
8
8
|
import { getSformContext } from './context.svelte.js';
|
|
9
|
-
import { tick } from 'svelte';
|
|
10
9
|
import TextInput from './inputs/TextInput.svelte';
|
|
11
10
|
import NumberInput from './inputs/NumberInput.svelte';
|
|
12
11
|
import TextareaInput from './inputs/TextareaInput.svelte';
|
|
@@ -59,14 +58,6 @@
|
|
|
59
58
|
|
|
60
59
|
async function handleBlur() {
|
|
61
60
|
context.markTouched(name);
|
|
62
|
-
// Wait a tick - if submission started, pending will be > 0 by then
|
|
63
|
-
// This prevents stale data validation when blur fires during Enter submission
|
|
64
|
-
await tick();
|
|
65
|
-
const formState = context.getFormState();
|
|
66
|
-
if (formState.pending) {
|
|
67
|
-
return;
|
|
68
|
-
}
|
|
69
|
-
// Trigger validation with includeUntouched so blur mode shows issues
|
|
70
61
|
context.triggerValidation();
|
|
71
62
|
}
|
|
72
63
|
|
|
@@ -106,6 +97,7 @@
|
|
|
106
97
|
name,
|
|
107
98
|
class: hasIssues ? `${classes.input ?? ''} sform-field-error`.trim() : classes.input,
|
|
108
99
|
labelClass: classes.label,
|
|
100
|
+
wrapperClass: classes.inputWrapper,
|
|
109
101
|
showIssues,
|
|
110
102
|
onblur: handleBlur,
|
|
111
103
|
oninput: handleInput
|
|
@@ -55,6 +55,10 @@
|
|
|
55
55
|
|
|
56
56
|
event.preventDefault();
|
|
57
57
|
|
|
58
|
+
// Focus the button to trigger blur on any focused input before submission
|
|
59
|
+
// This ensures blur validation runs with valid form data, not stale data
|
|
60
|
+
buttonElement.focus();
|
|
61
|
+
|
|
58
62
|
if (onsubmit) {
|
|
59
63
|
await onsubmit();
|
|
60
64
|
}
|
|
@@ -66,9 +70,16 @@
|
|
|
66
70
|
// Submit the form via context
|
|
67
71
|
sformContext.submitForm();
|
|
68
72
|
}
|
|
73
|
+
let buttonElement: HTMLButtonElement;
|
|
69
74
|
</script>
|
|
70
75
|
|
|
71
|
-
<button
|
|
76
|
+
<button
|
|
77
|
+
bind:this={buttonElement}
|
|
78
|
+
type={buttonType}
|
|
79
|
+
class={className}
|
|
80
|
+
disabled={isDisabled}
|
|
81
|
+
onclick={handleClick}
|
|
82
|
+
>
|
|
72
83
|
{#if children}
|
|
73
84
|
{@render children(formState)}
|
|
74
85
|
{:else}
|
package/dist/Sform/types.d.ts
CHANGED
|
@@ -35,6 +35,8 @@ export interface SfieldClasses {
|
|
|
35
35
|
wrapper?: string;
|
|
36
36
|
/** Label element class */
|
|
37
37
|
label?: string;
|
|
38
|
+
/** Input wrapper class (contains prefix, input, suffix for affix-enabled inputs) */
|
|
39
|
+
inputWrapper?: string;
|
|
38
40
|
/** Input element class */
|
|
39
41
|
input?: string;
|
|
40
42
|
/** Hint element class */
|