@samline/forms 2.4.0 → 2.7.0

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.
Files changed (58) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +11 -8
  3. package/dist/browser/global.d.ts +28 -18
  4. package/dist/browser/global.global.js +477 -66
  5. package/dist/browser/global.global.js.map +1 -1
  6. package/dist/browser/index.cjs +1450 -0
  7. package/dist/browser/index.cjs.map +1 -0
  8. package/dist/browser/index.d.cts +14 -0
  9. package/dist/browser/index.d.ts +14 -0
  10. package/dist/browser/index.js +23 -0
  11. package/dist/browser/index.js.map +1 -0
  12. package/dist/chunk-WGPAVJTK.js +1415 -0
  13. package/dist/chunk-WGPAVJTK.js.map +1 -0
  14. package/dist/index.cjs +296 -40
  15. package/dist/index.cjs.map +1 -1
  16. package/dist/index.d.cts +4 -158
  17. package/dist/index.d.ts +4 -158
  18. package/dist/index.js +7 -1148
  19. package/dist/index.js.map +1 -1
  20. package/dist/registry-GzopYPCR.d.cts +164 -0
  21. package/dist/registry-GzopYPCR.d.ts +164 -0
  22. package/docs/api/add-cleanup.md +52 -0
  23. package/docs/api/append.md +96 -0
  24. package/docs/api/auto-submit.md +91 -0
  25. package/docs/api/clear-errors.md +69 -0
  26. package/docs/api/destroy.md +80 -0
  27. package/docs/api/disable-auto-submit.md +65 -0
  28. package/docs/api/element.md +78 -0
  29. package/docs/api/form.md +156 -0
  30. package/docs/api/format.md +270 -0
  31. package/docs/api/get-data.md +90 -0
  32. package/docs/api/get-field.md +87 -0
  33. package/docs/api/get-state.md +111 -0
  34. package/docs/api/get-value.md +114 -0
  35. package/docs/api/index.md +55 -0
  36. package/docs/api/observe.md +126 -0
  37. package/docs/api/on-submit.md +94 -0
  38. package/docs/api/parse-form-data.md +94 -0
  39. package/docs/api/prefill.md +89 -0
  40. package/docs/api/regex.md +155 -0
  41. package/docs/api/reset.md +61 -0
  42. package/docs/api/revalidate.md +52 -0
  43. package/docs/api/set-errors.md +97 -0
  44. package/docs/api/set-value.md +120 -0
  45. package/docs/api/subscribe.md +107 -0
  46. package/docs/api/unwatch.md +74 -0
  47. package/docs/api/validate-field-value.md +144 -0
  48. package/docs/api/validate-values.md +103 -0
  49. package/docs/api/validate.md +102 -0
  50. package/docs/api/watch.md +117 -0
  51. package/docs/browser.md +156 -0
  52. package/docs/css-styling.md +191 -0
  53. package/docs/getting-started.md +222 -0
  54. package/docs/options.md +326 -0
  55. package/docs/recipes.md +530 -0
  56. package/docs/typescript.md +615 -0
  57. package/docs/vanilla.md +12 -0
  58. package/package.json +58 -14
package/dist/index.d.cts CHANGED
@@ -1,167 +1,13 @@
1
- type FormatType = 'general' | 'phone' | 'numeral' | 'date' | 'time' | 'creditCard' | 'creditCardType';
2
- interface FieldFormatConfig {
3
- /** One of the supported `@samline/formatter` `FormatType` values. */
4
- type: FormatType;
5
- /**
6
- * Canonical name of the formatted field. The value the backend
7
- * ultimately receives (the `raw` output of the formatter) is
8
- * exposed under this name; the formatter is responsible for
9
- * keeping it in sync with the visible input.
10
- */
11
- field: string | string[];
12
- /**
13
- * Name of the visible input that shows the formatted value to
14
- * the user. Defaults to `${fieldName}_displayed`.
15
- *
16
- * The visible is **renamed** from `field` to `displayField` on
17
- * the first `format()` call (idempotent on re-binding). A hidden
18
- * `<input type="hidden" name="<field>">` is created next to it
19
- * to carry the raw value. Both names are first-class in the
20
- * controller's API (`getValue`, `getField`, `setValue`, `watch`,
21
- * `getData`) — see `docs/api/format.md` for the full contract.
22
- */
23
- displayField?: string;
24
- /**
25
- * Format-specific options forwarded to `@samline/formatter`.
26
- * Any key documented for the chosen `type` is accepted (e.g.
27
- * `country`, `delimiter`, `numeralDecimalMark`, `datePattern`).
28
- */
29
- options?: Record<string, unknown>;
30
- }
31
- type FieldFormatConfigMap = Record<string, FieldFormatConfig>;
32
- type FormDataPrimitive = FormDataEntryValue;
33
- type SerializedFormValue = FormDataPrimitive | FormDataPrimitive[];
34
- type FormFieldValue = string | string[] | File[] | undefined;
35
- type FormValues = Record<string, FormFieldValue>;
36
- type FormErrors = Record<string, string[]>;
37
- type RuleConfig<T> = T | {
38
- value: T;
39
- message?: string;
40
- };
41
- interface FieldValidationContext {
42
- field: string;
43
- value: FormFieldValue;
44
- values: FormValues;
45
- }
46
- type FieldValidator = (context: FieldValidationContext) => string | undefined | null | false | true;
47
- interface FieldValidationRules {
48
- required?: RuleConfig<boolean>;
49
- minLength?: RuleConfig<number>;
50
- maxLength?: RuleConfig<number>;
51
- pattern?: RuleConfig<RegExp>;
52
- validate?: FieldValidator | FieldValidator[];
53
- }
54
- type ValidationSchema = Record<string, FieldValidationRules>;
55
- interface VisualAttributes {
56
- filled: string;
57
- error: string;
58
- }
59
- interface AutoSubmitOptions {
60
- debounce?: number;
61
- }
62
- interface FormControllerOptions {
63
- attributes?: Partial<VisualAttributes>;
64
- autoValidate?: boolean;
65
- autoSubmit?: boolean | AutoSubmitOptions;
66
- clearManualErrorsOnChange?: boolean;
67
- clearErrorsOnSubmit?: boolean;
68
- validators?: ValidationSchema;
69
- /**
70
- * Declarative format configuration. Each entry is applied during
71
- * `form()` initialization using the same logic as `controller.format(...)`.
72
- * The key is just an identifier — the visible field name lives in
73
- * `FieldFormatConfig.field`.
74
- */
75
- formats?: FieldFormatConfigMap;
76
- }
77
- interface SerializedFormResult {
78
- data: Record<string, SerializedFormValue>;
79
- formData: FormData;
80
- }
81
- interface ValidationResult {
82
- isValid: boolean;
83
- errors: FormErrors;
84
- }
85
- interface FormStateSnapshot {
86
- values: FormValues;
87
- errors: FormErrors;
88
- filledFields: string[];
89
- isValid: boolean;
90
- isValidated: boolean;
91
- autoSubmit: boolean;
92
- submitCount: number;
93
- }
94
- type FormStateListener = (state: FormStateSnapshot) => void;
95
- type FormFieldElement = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
96
- type FormTarget = string | HTMLFormElement | {
97
- current: HTMLFormElement | null;
98
- } | null | undefined;
99
- interface AppendContentOptions {
100
- tag: keyof HTMLElementTagNameMap;
101
- content: string;
102
- class?: string;
103
- atStart?: boolean;
104
- }
105
- type FormFieldWatcher = (value: FormFieldValue, field: FormFieldElement | FormFieldElement[] | null, form: HTMLFormElement, state: FormStateSnapshot) => void;
106
- type FormSubmitHandler = (form: HTMLFormElement, data: Record<string, SerializedFormValue>, formData: FormData, state: FormStateSnapshot) => void;
107
- interface FormController {
108
- readonly element: HTMLFormElement | null;
109
- readonly f: HTMLFormElement | null;
110
- readonly options: FormControllerOptions;
111
- onSubmit: (callback: FormSubmitHandler, preventDefault?: boolean) => FormController;
112
- watch: (field: string, callback: FormFieldWatcher) => FormController;
113
- observe: (field: string, callback: FormFieldWatcher) => () => void;
114
- unwatch: (field?: string, callback?: FormFieldWatcher) => FormController;
115
- subscribe: (listener: FormStateListener) => () => void;
116
- prefill: (fieldName?: string) => FormController;
117
- append: (options: AppendContentOptions) => HTMLElement | null;
118
- setErrors: (fields: string[] | FormErrors) => FormController;
119
- clearErrors: (fields?: string[]) => FormController;
120
- setValue: (name: string, value: unknown) => FormController;
121
- validate: (fields?: string[]) => ValidationResult;
122
- revalidate: (fields?: string[]) => ValidationResult;
123
- /**
124
- * Apply the same `@samline/formatter` pipeline to a single field or
125
- * to a list of fields sharing one configuration. Chainable.
126
- *
127
- * Requires the optional peer dependency `@samline/formatter`. When
128
- * the peer is not installed the call logs a single `console.error`
129
- * and returns the controller unchanged.
130
- */
131
- format: (config: FieldFormatConfig) => FormController;
132
- formatAll: (config: FieldFormatConfig) => FormController;
133
- reset: () => FormController;
134
- autoSubmit: (options?: boolean | AutoSubmitOptions) => FormController;
135
- disableAutoSubmit: () => FormController;
136
- getValue: (name: string) => FormFieldValue;
137
- getField: (name: string) => FormFieldElement | FormFieldElement[] | null;
138
- getData: () => SerializedFormResult;
139
- getState: () => FormStateSnapshot;
140
- destroy: () => void;
141
- }
1
+ import { F as FormTarget, a as FormControllerOptions, b as FormController, S as SerializedFormResult, c as FormFieldValue, d as FieldValidationRules, e as FormValues, V as ValidationSchema, f as ValidationResult } from './registry-GzopYPCR.cjs';
2
+ export { A as AppendContentOptions, g as AutoSubmitOptions, h as FieldFormatConfig, i as FieldFormatConfigMap, j as FieldValidationContext, k as FieldValidator, l as FormCleanup, m as FormDataPrimitive, n as FormErrors, o as FormFieldElement, p as FormFieldWatcher, q as FormStateListener, r as FormStateSnapshot, s as FormSubmitHandler, t as FormatType, u as FormsApi, v as FormsAvailable, N as NewFormInput, R as RuleConfig, w as SerializedFormValue, x as ValueValidationRules, y as VisualAttributes, z as browser } from './registry-GzopYPCR.cjs';
142
3
 
143
4
  declare const form: (target: FormTarget, options?: FormControllerOptions) => FormController;
144
5
 
145
6
  declare const createFormController: (target: FormTarget, options?: FormControllerOptions) => FormController;
146
7
 
147
- interface NewFormInput {
148
- id: string;
149
- options?: FormControllerOptions;
150
- }
151
- interface FormsAvailable {
152
- [id: string]: FormController;
153
- }
154
- interface FormsApi {
155
- form: (target: FormTarget, options?: FormControllerOptions) => FormController;
156
- newForm: (input: NewFormInput) => FormController | undefined;
157
- destroyForm: (id: string) => void;
158
- available: FormsAvailable;
159
- }
160
- declare const browser: FormsApi;
161
-
162
- declare const parseFormData: (formElement: HTMLFormElement) => SerializedFormResult;
8
+ declare const parseFormData: (formElement: HTMLFormElement, submitter?: HTMLElement | null) => SerializedFormResult;
163
9
 
164
10
  declare const validateFieldValue: (field: string, value: FormFieldValue, rules: FieldValidationRules, values: FormValues) => string[];
165
11
  declare const validateValues: (values: FormValues, schema: ValidationSchema) => ValidationResult;
166
12
 
167
- export { type AppendContentOptions, type AutoSubmitOptions, type FieldFormatConfig, type FieldFormatConfigMap, type FieldValidationContext, type FieldValidationRules, type FieldValidator, type FormController, type FormControllerOptions, type FormErrors, type FormFieldElement, type FormFieldValue, type FormStateListener, type FormStateSnapshot, type FormSubmitHandler, type FormTarget, type FormValues, type FormatType, type FormsApi, type FormsAvailable, type NewFormInput, type RuleConfig, type SerializedFormResult, type SerializedFormValue, type ValidationResult, type ValidationSchema, type VisualAttributes, browser, createFormController, form, parseFormData, validateFieldValue, validateValues };
13
+ export { FieldValidationRules, FormController, FormControllerOptions, FormFieldValue, FormTarget, FormValues, SerializedFormResult, ValidationResult, ValidationSchema, createFormController, form, parseFormData, validateFieldValue, validateValues };
package/dist/index.d.ts CHANGED
@@ -1,167 +1,13 @@
1
- type FormatType = 'general' | 'phone' | 'numeral' | 'date' | 'time' | 'creditCard' | 'creditCardType';
2
- interface FieldFormatConfig {
3
- /** One of the supported `@samline/formatter` `FormatType` values. */
4
- type: FormatType;
5
- /**
6
- * Canonical name of the formatted field. The value the backend
7
- * ultimately receives (the `raw` output of the formatter) is
8
- * exposed under this name; the formatter is responsible for
9
- * keeping it in sync with the visible input.
10
- */
11
- field: string | string[];
12
- /**
13
- * Name of the visible input that shows the formatted value to
14
- * the user. Defaults to `${fieldName}_displayed`.
15
- *
16
- * The visible is **renamed** from `field` to `displayField` on
17
- * the first `format()` call (idempotent on re-binding). A hidden
18
- * `<input type="hidden" name="<field>">` is created next to it
19
- * to carry the raw value. Both names are first-class in the
20
- * controller's API (`getValue`, `getField`, `setValue`, `watch`,
21
- * `getData`) — see `docs/api/format.md` for the full contract.
22
- */
23
- displayField?: string;
24
- /**
25
- * Format-specific options forwarded to `@samline/formatter`.
26
- * Any key documented for the chosen `type` is accepted (e.g.
27
- * `country`, `delimiter`, `numeralDecimalMark`, `datePattern`).
28
- */
29
- options?: Record<string, unknown>;
30
- }
31
- type FieldFormatConfigMap = Record<string, FieldFormatConfig>;
32
- type FormDataPrimitive = FormDataEntryValue;
33
- type SerializedFormValue = FormDataPrimitive | FormDataPrimitive[];
34
- type FormFieldValue = string | string[] | File[] | undefined;
35
- type FormValues = Record<string, FormFieldValue>;
36
- type FormErrors = Record<string, string[]>;
37
- type RuleConfig<T> = T | {
38
- value: T;
39
- message?: string;
40
- };
41
- interface FieldValidationContext {
42
- field: string;
43
- value: FormFieldValue;
44
- values: FormValues;
45
- }
46
- type FieldValidator = (context: FieldValidationContext) => string | undefined | null | false | true;
47
- interface FieldValidationRules {
48
- required?: RuleConfig<boolean>;
49
- minLength?: RuleConfig<number>;
50
- maxLength?: RuleConfig<number>;
51
- pattern?: RuleConfig<RegExp>;
52
- validate?: FieldValidator | FieldValidator[];
53
- }
54
- type ValidationSchema = Record<string, FieldValidationRules>;
55
- interface VisualAttributes {
56
- filled: string;
57
- error: string;
58
- }
59
- interface AutoSubmitOptions {
60
- debounce?: number;
61
- }
62
- interface FormControllerOptions {
63
- attributes?: Partial<VisualAttributes>;
64
- autoValidate?: boolean;
65
- autoSubmit?: boolean | AutoSubmitOptions;
66
- clearManualErrorsOnChange?: boolean;
67
- clearErrorsOnSubmit?: boolean;
68
- validators?: ValidationSchema;
69
- /**
70
- * Declarative format configuration. Each entry is applied during
71
- * `form()` initialization using the same logic as `controller.format(...)`.
72
- * The key is just an identifier — the visible field name lives in
73
- * `FieldFormatConfig.field`.
74
- */
75
- formats?: FieldFormatConfigMap;
76
- }
77
- interface SerializedFormResult {
78
- data: Record<string, SerializedFormValue>;
79
- formData: FormData;
80
- }
81
- interface ValidationResult {
82
- isValid: boolean;
83
- errors: FormErrors;
84
- }
85
- interface FormStateSnapshot {
86
- values: FormValues;
87
- errors: FormErrors;
88
- filledFields: string[];
89
- isValid: boolean;
90
- isValidated: boolean;
91
- autoSubmit: boolean;
92
- submitCount: number;
93
- }
94
- type FormStateListener = (state: FormStateSnapshot) => void;
95
- type FormFieldElement = HTMLInputElement | HTMLSelectElement | HTMLTextAreaElement;
96
- type FormTarget = string | HTMLFormElement | {
97
- current: HTMLFormElement | null;
98
- } | null | undefined;
99
- interface AppendContentOptions {
100
- tag: keyof HTMLElementTagNameMap;
101
- content: string;
102
- class?: string;
103
- atStart?: boolean;
104
- }
105
- type FormFieldWatcher = (value: FormFieldValue, field: FormFieldElement | FormFieldElement[] | null, form: HTMLFormElement, state: FormStateSnapshot) => void;
106
- type FormSubmitHandler = (form: HTMLFormElement, data: Record<string, SerializedFormValue>, formData: FormData, state: FormStateSnapshot) => void;
107
- interface FormController {
108
- readonly element: HTMLFormElement | null;
109
- readonly f: HTMLFormElement | null;
110
- readonly options: FormControllerOptions;
111
- onSubmit: (callback: FormSubmitHandler, preventDefault?: boolean) => FormController;
112
- watch: (field: string, callback: FormFieldWatcher) => FormController;
113
- observe: (field: string, callback: FormFieldWatcher) => () => void;
114
- unwatch: (field?: string, callback?: FormFieldWatcher) => FormController;
115
- subscribe: (listener: FormStateListener) => () => void;
116
- prefill: (fieldName?: string) => FormController;
117
- append: (options: AppendContentOptions) => HTMLElement | null;
118
- setErrors: (fields: string[] | FormErrors) => FormController;
119
- clearErrors: (fields?: string[]) => FormController;
120
- setValue: (name: string, value: unknown) => FormController;
121
- validate: (fields?: string[]) => ValidationResult;
122
- revalidate: (fields?: string[]) => ValidationResult;
123
- /**
124
- * Apply the same `@samline/formatter` pipeline to a single field or
125
- * to a list of fields sharing one configuration. Chainable.
126
- *
127
- * Requires the optional peer dependency `@samline/formatter`. When
128
- * the peer is not installed the call logs a single `console.error`
129
- * and returns the controller unchanged.
130
- */
131
- format: (config: FieldFormatConfig) => FormController;
132
- formatAll: (config: FieldFormatConfig) => FormController;
133
- reset: () => FormController;
134
- autoSubmit: (options?: boolean | AutoSubmitOptions) => FormController;
135
- disableAutoSubmit: () => FormController;
136
- getValue: (name: string) => FormFieldValue;
137
- getField: (name: string) => FormFieldElement | FormFieldElement[] | null;
138
- getData: () => SerializedFormResult;
139
- getState: () => FormStateSnapshot;
140
- destroy: () => void;
141
- }
1
+ import { F as FormTarget, a as FormControllerOptions, b as FormController, S as SerializedFormResult, c as FormFieldValue, d as FieldValidationRules, e as FormValues, V as ValidationSchema, f as ValidationResult } from './registry-GzopYPCR.js';
2
+ export { A as AppendContentOptions, g as AutoSubmitOptions, h as FieldFormatConfig, i as FieldFormatConfigMap, j as FieldValidationContext, k as FieldValidator, l as FormCleanup, m as FormDataPrimitive, n as FormErrors, o as FormFieldElement, p as FormFieldWatcher, q as FormStateListener, r as FormStateSnapshot, s as FormSubmitHandler, t as FormatType, u as FormsApi, v as FormsAvailable, N as NewFormInput, R as RuleConfig, w as SerializedFormValue, x as ValueValidationRules, y as VisualAttributes, z as browser } from './registry-GzopYPCR.js';
142
3
 
143
4
  declare const form: (target: FormTarget, options?: FormControllerOptions) => FormController;
144
5
 
145
6
  declare const createFormController: (target: FormTarget, options?: FormControllerOptions) => FormController;
146
7
 
147
- interface NewFormInput {
148
- id: string;
149
- options?: FormControllerOptions;
150
- }
151
- interface FormsAvailable {
152
- [id: string]: FormController;
153
- }
154
- interface FormsApi {
155
- form: (target: FormTarget, options?: FormControllerOptions) => FormController;
156
- newForm: (input: NewFormInput) => FormController | undefined;
157
- destroyForm: (id: string) => void;
158
- available: FormsAvailable;
159
- }
160
- declare const browser: FormsApi;
161
-
162
- declare const parseFormData: (formElement: HTMLFormElement) => SerializedFormResult;
8
+ declare const parseFormData: (formElement: HTMLFormElement, submitter?: HTMLElement | null) => SerializedFormResult;
163
9
 
164
10
  declare const validateFieldValue: (field: string, value: FormFieldValue, rules: FieldValidationRules, values: FormValues) => string[];
165
11
  declare const validateValues: (values: FormValues, schema: ValidationSchema) => ValidationResult;
166
12
 
167
- export { type AppendContentOptions, type AutoSubmitOptions, type FieldFormatConfig, type FieldFormatConfigMap, type FieldValidationContext, type FieldValidationRules, type FieldValidator, type FormController, type FormControllerOptions, type FormErrors, type FormFieldElement, type FormFieldValue, type FormStateListener, type FormStateSnapshot, type FormSubmitHandler, type FormTarget, type FormValues, type FormatType, type FormsApi, type FormsAvailable, type NewFormInput, type RuleConfig, type SerializedFormResult, type SerializedFormValue, type ValidationResult, type ValidationSchema, type VisualAttributes, browser, createFormController, form, parseFormData, validateFieldValue, validateValues };
13
+ export { FieldValidationRules, FormController, FormControllerOptions, FormFieldValue, FormTarget, FormValues, SerializedFormResult, ValidationResult, ValidationSchema, createFormController, form, parseFormData, validateFieldValue, validateValues };