@vielzeug/refine 1.3.1 → 1.4.1

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 (138) hide show
  1. package/dist/checkbox-group.cjs +7 -7
  2. package/dist/checkbox-group.cjs.map +1 -1
  3. package/dist/checkbox-group.js +35 -26
  4. package/dist/checkbox-group.js.map +1 -1
  5. package/dist/checkbox.cjs +3 -3
  6. package/dist/checkbox.cjs.map +1 -1
  7. package/dist/checkbox.js +24 -19
  8. package/dist/checkbox.js.map +1 -1
  9. package/dist/combobox.cjs +24 -24
  10. package/dist/combobox.cjs.map +1 -1
  11. package/dist/combobox.js +133 -129
  12. package/dist/combobox.js.map +1 -1
  13. package/dist/custom-elements.json +5473 -4925
  14. package/dist/headless/auto-resize.cjs +2 -0
  15. package/dist/headless/auto-resize.cjs.map +1 -0
  16. package/dist/headless/auto-resize.d.ts +29 -0
  17. package/dist/headless/auto-resize.d.ts.map +1 -0
  18. package/dist/headless/auto-resize.js +16 -0
  19. package/dist/headless/auto-resize.js.map +1 -0
  20. package/dist/headless/checkable.cjs +1 -1
  21. package/dist/headless/checkable.cjs.map +1 -1
  22. package/dist/headless/checkable.d.ts +25 -7
  23. package/dist/headless/checkable.d.ts.map +1 -1
  24. package/dist/headless/checkable.js +19 -14
  25. package/dist/headless/checkable.js.map +1 -1
  26. package/dist/headless/choice-field.cjs +1 -1
  27. package/dist/headless/choice-field.cjs.map +1 -1
  28. package/dist/headless/choice-field.d.ts +21 -0
  29. package/dist/headless/choice-field.d.ts.map +1 -1
  30. package/dist/headless/choice-field.js +27 -19
  31. package/dist/headless/choice-field.js.map +1 -1
  32. package/dist/headless/composer.cjs +2 -0
  33. package/dist/headless/composer.cjs.map +1 -0
  34. package/dist/headless/composer.d.ts +44 -0
  35. package/dist/headless/composer.d.ts.map +1 -0
  36. package/dist/headless/composer.js +21 -0
  37. package/dist/headless/composer.js.map +1 -0
  38. package/dist/headless/field-base.cjs +1 -1
  39. package/dist/headless/field-base.cjs.map +1 -1
  40. package/dist/headless/field-base.d.ts +97 -84
  41. package/dist/headless/field-base.d.ts.map +1 -1
  42. package/dist/headless/field-base.js +43 -32
  43. package/dist/headless/field-base.js.map +1 -1
  44. package/dist/headless/index.d.ts +3 -1
  45. package/dist/headless/index.d.ts.map +1 -1
  46. package/dist/headless/text-field.cjs +1 -1
  47. package/dist/headless/text-field.cjs.map +1 -1
  48. package/dist/headless/text-field.d.ts +40 -0
  49. package/dist/headless/text-field.d.ts.map +1 -1
  50. package/dist/headless/text-field.js +30 -25
  51. package/dist/headless/text-field.js.map +1 -1
  52. package/dist/headless.cjs +1 -1
  53. package/dist/headless.js +27 -25
  54. package/dist/index.cjs +1 -1
  55. package/dist/index.js +61 -60
  56. package/dist/input.cjs +9 -9
  57. package/dist/input.cjs.map +1 -1
  58. package/dist/input.js +49 -44
  59. package/dist/input.js.map +1 -1
  60. package/dist/inputs/checkbox/checkbox.d.ts +3 -0
  61. package/dist/inputs/checkbox/checkbox.d.ts.map +1 -1
  62. package/dist/inputs/combobox/combobox.d.ts +1 -0
  63. package/dist/inputs/combobox/combobox.d.ts.map +1 -1
  64. package/dist/inputs/combobox/combobox.types.d.ts +2 -0
  65. package/dist/inputs/combobox/combobox.types.d.ts.map +1 -1
  66. package/dist/inputs/index.d.ts +2 -0
  67. package/dist/inputs/index.d.ts.map +1 -1
  68. package/dist/inputs/input/input.d.ts.map +1 -1
  69. package/dist/inputs/message-composer/message-composer.css.cjs +2 -0
  70. package/dist/inputs/message-composer/message-composer.css.cjs.map +1 -0
  71. package/dist/inputs/message-composer/message-composer.css.js +6 -0
  72. package/dist/inputs/message-composer/message-composer.css.js.map +1 -0
  73. package/dist/inputs/message-composer/message-composer.d.ts +139 -0
  74. package/dist/inputs/message-composer/message-composer.d.ts.map +1 -0
  75. package/dist/inputs/shared/field-binding.cjs +1 -1
  76. package/dist/inputs/shared/field-binding.cjs.map +1 -1
  77. package/dist/inputs/shared/field-binding.d.ts +15 -0
  78. package/dist/inputs/shared/field-binding.d.ts.map +1 -1
  79. package/dist/inputs/shared/field-binding.js +4 -3
  80. package/dist/inputs/shared/field-binding.js.map +1 -1
  81. package/dist/inputs/shared/form-context.cjs.map +1 -1
  82. package/dist/inputs/shared/form-context.d.ts +6 -0
  83. package/dist/inputs/shared/form-context.d.ts.map +1 -1
  84. package/dist/inputs/shared/form-context.js.map +1 -1
  85. package/dist/inputs/textarea/textarea.d.ts.map +1 -1
  86. package/dist/layout/navbar/navbar.css.cjs +1 -1
  87. package/dist/layout/navbar/navbar.css.cjs.map +1 -1
  88. package/dist/layout/navbar/navbar.css.js +1 -1
  89. package/dist/layout/navbar/navbar.css.js.map +1 -1
  90. package/dist/message-composer.cjs +52 -0
  91. package/dist/message-composer.cjs.map +1 -0
  92. package/dist/message-composer.js +168 -0
  93. package/dist/message-composer.js.map +1 -0
  94. package/dist/ore/dist/base-element.cjs +1 -1
  95. package/dist/ore/dist/base-element.cjs.map +1 -1
  96. package/dist/ore/dist/base-element.js +13 -3
  97. package/dist/ore/dist/base-element.js.map +1 -1
  98. package/dist/ore/dist/forms/field.cjs +1 -1
  99. package/dist/ore/dist/forms/field.cjs.map +1 -1
  100. package/dist/ore/dist/forms/field.js +29 -22
  101. package/dist/ore/dist/forms/field.js.map +1 -1
  102. package/dist/ore/dist/runtime.cjs +1 -1
  103. package/dist/ore/dist/runtime.cjs.map +1 -1
  104. package/dist/ore/dist/runtime.js +3 -1
  105. package/dist/ore/dist/runtime.js.map +1 -1
  106. package/dist/radio-group.cjs +9 -9
  107. package/dist/radio-group.cjs.map +1 -1
  108. package/dist/radio-group.js +44 -38
  109. package/dist/radio-group.js.map +1 -1
  110. package/dist/radio.cjs +3 -3
  111. package/dist/radio.cjs.map +1 -1
  112. package/dist/radio.js +23 -24
  113. package/dist/radio.js.map +1 -1
  114. package/dist/refine.cjs +228 -178
  115. package/dist/refine.cjs.map +1 -1
  116. package/dist/refine.iife.js +228 -178
  117. package/dist/refine.iife.js.map +1 -1
  118. package/dist/refine.js +251 -201
  119. package/dist/refine.js.map +1 -1
  120. package/dist/select.cjs +31 -31
  121. package/dist/select.cjs.map +1 -1
  122. package/dist/select.js +125 -122
  123. package/dist/select.js.map +1 -1
  124. package/dist/shared/size-presets.cjs +1 -1
  125. package/dist/shared/size-presets.cjs.map +1 -1
  126. package/dist/shared/size-presets.d.ts +23 -0
  127. package/dist/shared/size-presets.d.ts.map +1 -1
  128. package/dist/shared/size-presets.js +17 -1
  129. package/dist/shared/size-presets.js.map +1 -1
  130. package/dist/switch.cjs +3 -3
  131. package/dist/switch.cjs.map +1 -1
  132. package/dist/switch.js +17 -18
  133. package/dist/switch.js.map +1 -1
  134. package/dist/textarea.cjs +15 -15
  135. package/dist/textarea.cjs.map +1 -1
  136. package/dist/textarea.js +64 -60
  137. package/dist/textarea.js.map +1 -1
  138. package/package.json +22 -10
@@ -1 +1 @@
1
- {"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../src/headless/text-field.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAE9D,OAAO,EAAE,KAAK,YAAY,EAAmC,KAAK,WAAW,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAKvH,8EAA8E;AAC9E,MAAM,MAAM,eAAe,GAAG,MAAM,IAAI,CAAC;AAEzC,MAAM,MAAM,gBAAgB,GAAG,YAAY,GAAG;IAC5C,SAAS,CAAC,EAAE,QAAQ,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IACzC;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACvC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC;IACrC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC;IACtC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,wGAAwG;IACxG,MAAM,EAAE,WAAW,CAAC;IACpB,KAAK,EAAE,QAAQ,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;CACrC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,WAAW,GAAG;IAC1C,sEAAsE;IACtE,KAAK,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;IAC/B;;;OAGG;IACH,OAAO,EAAE,QAAQ,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC;IACvC,uFAAuF;IACvF,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB;;;;;;;;;;OAUG;IACH,IAAI,EAAE,CAAC,EAAE,EAAE,gBAAgB,GAAG,mBAAmB,EAAE,MAAM,CAAC,EAAE,WAAW,KAAK,eAAe,CAAC;CAC7F,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,SAAS,gBAAgB,KAAG,eA0D3D,CAAC"}
1
+ {"version":3,"file":"text-field.d.ts","sourceRoot":"","sources":["../../src/headless/text-field.ts"],"names":[],"mappings":"AAAA,OAAO,EAAY,KAAK,QAAQ,EAAE,KAAK,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAExE,OAAO,EAAE,KAAK,YAAY,EAAmC,KAAK,WAAW,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;AAKvH,8EAA8E;AAC9E,MAAM,MAAM,eAAe,GAAG,MAAM,IAAI,CAAC;AAEzC,MAAM,MAAM,gBAAgB,GAAG,YAAY,GAAG;IAC5C,SAAS,CAAC,EAAE,QAAQ,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IACzC;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACvC,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC;IACrC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,CAAC;IACtC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC,OAAO,GAAG,SAAS,CAAC,CAAC;IACzC,sFAAsF;IACtF,QAAQ,CAAC,EAAE,QAAQ,CAAC,OAAO,GAAG,SAAS,CAAC,CAAC;IACzC,oFAAoF;IACpF,eAAe,CAAC,EAAE,QAAQ,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;IAC/C,wGAAwG;IACxG,MAAM,EAAE,WAAW,CAAC;IACpB,KAAK,EAAE,QAAQ,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;CACrC,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,WAAW,GAAG;IAC1C;;;;;;;;;;;OAWG;IACH,eAAe,EAAE,CAAC,SAAS,EAAE;QAAE,cAAc,IAAI,IAAI,CAAA;KAAE,KAAK,IAAI,CAAC;IACjE,sEAAsE;IACtE,KAAK,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,IAAI,CAAC;IAC/B;;;OAGG;IACH,OAAO,EAAE,QAAQ,CAAC,YAAY,CAAC,GAAG,IAAI,CAAC;IACvC;;;;;OAKG;IACH,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,mFAAmF;IACnF,iBAAiB,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IACpC;;;OAGG;IACH,QAAQ,EAAE,QAAQ,CAAC,kBAAkB,GAAG,IAAI,CAAC,CAAC;IAC9C,uFAAuF;IACvF,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IACtB;;;;;;;;;;OAUG;IACH,IAAI,EAAE,CAAC,EAAE,EAAE,gBAAgB,GAAG,mBAAmB,EAAE,MAAM,CAAC,EAAE,WAAW,KAAK,eAAe,CAAC;CAC7F,CAAC;AAKF,eAAO,MAAM,eAAe,GAAI,SAAS,gBAAgB,KAAG,eAsE3D,CAAC"}
@@ -1,41 +1,46 @@
1
1
  import { createCounterState as e, createField as t } from "./field-base.js";
2
2
  import { syncedSignal as n } from "./signals.js";
3
- import "@vielzeug/ripple";
3
+ import { computed as r } from "@vielzeug/ripple";
4
4
  //#region src/headless/text-field.ts
5
- var r = (r) => {
6
- let i = n(r.value, r.signal, (e) => String(e ?? "")), a = t(r), o = r.maxLength ? e({
7
- maxLength: r.maxLength,
8
- value: i
9
- }) : null, s = (e) => {
10
- e?.preventDefault?.(), i.value = "", r.onInput?.(e ?? new InputEvent("input", { bubbles: !0 }), ""), r.onChange?.(e ?? new Event("change", { bubbles: !0 }), ""), a.triggerValidation("change");
11
- }, c = (e, t) => {
12
- let n = [], o = (t, r) => {
5
+ var i = (e) => e.trim() === "", a = (e) => String(e ?? ""), o = (o) => {
6
+ let s = n(o.value, o.signal, a), c = t(o), l = o.maxLength ? e({
7
+ maxLength: o.maxLength,
8
+ value: s
9
+ }) : null, u = r(() => !o.readonly?.value && o.required?.value && i(s.value) ? { valueMissing: !0 } : null), d = r(() => u.value ? o.requiredMessage?.value || "This field is required." : ""), f = () => {
10
+ s.value = a(o.value.value), c.triggerValidation("change");
11
+ }, p = (e) => {
12
+ e?.preventDefault?.(), s.value = "", o.onInput?.(e ?? new InputEvent("input", { bubbles: !0 }), ""), o.onChange?.(e ?? new Event("change", { bubbles: !0 }), ""), c.triggerValidation("change");
13
+ }, m = (e, t) => {
14
+ let n = [], r = (t, r) => {
13
15
  e.addEventListener(t, r), n.push(() => e.removeEventListener(t, r));
14
16
  };
15
- r.onFocus && o("focus", (e) => r.onFocus(e)), o("input", (t) => {
16
- t.stopPropagation(), r.onBeforeInput?.(t), i.value = e.value, r.onInput?.(t, e.value);
17
- }), o("change", (t) => {
18
- t.stopPropagation(), i.value = e.value, r.onChange?.(t, e.value), a.triggerValidation("change");
19
- }), o("blur", (e) => {
20
- r.onBlur?.(e), a.triggerValidation("blur");
17
+ o.onFocus && r("focus", (e) => o.onFocus(e)), r("input", (t) => {
18
+ t.stopPropagation(), o.onBeforeInput?.(t), s.value = e.value, o.onInput?.(t, e.value);
19
+ }), r("change", (t) => {
20
+ t.stopPropagation(), s.value = e.value, o.onChange?.(t, e.value), c.triggerValidation("change");
21
+ }), r("blur", (e) => {
22
+ o.onBlur?.(e), c.triggerValidation("blur");
21
23
  });
22
- let s = !1, c = () => {
23
- if (!s) {
24
- s = !0;
24
+ let i = !1, a = () => {
25
+ if (!i) {
26
+ i = !0;
25
27
  for (let e of n) e();
26
28
  }
27
29
  };
28
- return t?.addEventListener("abort", c, { once: !0 }), c;
30
+ return t?.addEventListener("abort", a, { once: !0 }), a;
29
31
  };
30
32
  return {
31
- ...a,
32
- clear: s,
33
- counter: o,
34
- value: i,
35
- wire: c
33
+ ...c,
34
+ clear: p,
35
+ counter: l,
36
+ reset: f,
37
+ validationMessage: d,
38
+ validity: u,
39
+ value: s,
40
+ wire: m
36
41
  };
37
42
  };
38
43
  //#endregion
39
- export { r as createTextField };
44
+ export { o as createTextField };
40
45
 
41
46
  //# sourceMappingURL=text-field.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"text-field.js","names":[],"sources":["../../src/headless/text-field.ts"],"sourcesContent":["import { type Readable, type Signal } from '@vielzeug/ripple';\n\nimport { type CounterState, createCounterState, createField, type FieldHandle, type FieldOptions } from './field-base';\nimport { syncedSignal } from './signals';\n\n// ── Text field ────────────────────────────────────────────────────────────────\n\n/** Detach function returned by `wire()`. Call to remove element listeners. */\nexport type TextFieldDetach = () => void;\n\nexport type TextFieldOptions = FieldOptions & {\n maxLength?: Readable<number | undefined>;\n /**\n * Called synchronously before value extraction on every input event.\n * Use only for DOM side-effects (e.g. auto-resize measurement) that must\n * run before the reactive value is updated.\n */\n onBeforeInput?: (event: Event) => void;\n onBlur?: (event: FocusEvent) => void;\n onChange?: (event: Event, value: string) => void;\n onFocus?: (event: FocusEvent) => void;\n onInput?: (event: Event, value: string) => void;\n /** `AbortSignal` from the component lifecycle. The internal value-sync watcher is disposed on abort. */\n signal: AbortSignal;\n value: Readable<string | undefined>;\n};\n\nexport type TextFieldHandle = FieldHandle & {\n /** Clears the field value and fires synthetic input/change events. */\n clear: (event?: Event) => void;\n /**\n * Reactive counter state. Non-null when `maxLength` was provided; `null` otherwise.\n * Components should only render a counter element when this is non-null.\n */\n counter: Readable<CounterState> | null;\n /** The local mutable field value (two-way bound to the input element via `wire()`). */\n value: Signal<string>;\n /**\n * Attaches event listeners to the underlying input or textarea element.\n *\n * When `signal` is provided, the listeners are detached automatically when\n * the signal's controller calls `abort()`. Without a signal the returned\n * `TextFieldDetach` must be called manually.\n *\n * Safe to call multiple times — each call attaches a fresh set of listeners\n * and returns a distinct detach function. Calling detach multiple times is\n * a no-op (guarded internally).\n */\n wire: (el: HTMLInputElement | HTMLTextAreaElement, signal?: AbortSignal) => TextFieldDetach;\n};\n\nexport const createTextField = (options: TextFieldOptions): TextFieldHandle => {\n const value = syncedSignal(options.value, options.signal, (v) => String(v ?? ''));\n\n const field = createField(options);\n const counter = options.maxLength ? createCounterState({ maxLength: options.maxLength, value }) : null;\n\n const clear = (event?: Event): void => {\n event?.preventDefault?.();\n value.value = '';\n options.onInput?.(event ?? new InputEvent('input', { bubbles: true }), '');\n options.onChange?.(event ?? new Event('change', { bubbles: true }), '');\n field.triggerValidation('change');\n };\n\n const wire = (element: HTMLInputElement | HTMLTextAreaElement, signal?: AbortSignal): TextFieldDetach => {\n const cleanups: Array<() => void> = [];\n const on = (type: string, handler: EventListener): void => {\n element.addEventListener(type, handler);\n cleanups.push(() => element.removeEventListener(type, handler));\n };\n\n if (options.onFocus) {\n on('focus', (e) => options.onFocus!(e as FocusEvent));\n }\n\n on('input', (e) => {\n e.stopPropagation();\n options.onBeforeInput?.(e);\n value.value = element.value;\n options.onInput?.(e, element.value);\n });\n\n on('change', (e) => {\n e.stopPropagation();\n value.value = element.value;\n options.onChange?.(e, element.value);\n field.triggerValidation('change');\n });\n\n on('blur', (e) => {\n options.onBlur?.(e as FocusEvent);\n field.triggerValidation('blur');\n });\n\n let detached = false;\n const detach = (): void => {\n if (detached) return;\n\n detached = true;\n for (const dispose of cleanups) dispose();\n };\n\n signal?.addEventListener('abort', detach, { once: true });\n\n return detach;\n };\n\n return { ...field, clear, counter, value, wire };\n};\n"],"mappings":";;;;AAmDA,IAAa,KAAmB,MAA+C;CAC7E,IAAM,IAAQ,EAAa,EAAQ,OAAO,EAAQ,SAAS,MAAM,OAAO,KAAK,EAAE,CAAC,GAE1E,IAAQ,EAAY,CAAO,GAC3B,IAAU,EAAQ,YAAY,EAAmB;EAAE,WAAW,EAAQ;EAAW;CAAM,CAAC,IAAI,MAE5F,KAAS,MAAwB;EAKrC,AAJA,GAAO,iBAAiB,GACxB,EAAM,QAAQ,IACd,EAAQ,UAAU,KAAS,IAAI,WAAW,SAAS,EAAE,SAAS,GAAK,CAAC,GAAG,EAAE,GACzE,EAAQ,WAAW,KAAS,IAAI,MAAM,UAAU,EAAE,SAAS,GAAK,CAAC,GAAG,EAAE,GACtE,EAAM,kBAAkB,QAAQ;CAClC,GAEM,KAAQ,GAAiD,MAA0C;EACvG,IAAM,IAA8B,CAAC,GAC/B,KAAM,GAAc,MAAiC;GAEzD,AADA,EAAQ,iBAAiB,GAAM,CAAO,GACtC,EAAS,WAAW,EAAQ,oBAAoB,GAAM,CAAO,CAAC;EAChE;EAoBA,AAlBI,EAAQ,WACV,EAAG,UAAU,MAAM,EAAQ,QAAS,CAAe,CAAC,GAGtD,EAAG,UAAU,MAAM;GAIjB,AAHA,EAAE,gBAAgB,GAClB,EAAQ,gBAAgB,CAAC,GACzB,EAAM,QAAQ,EAAQ,OACtB,EAAQ,UAAU,GAAG,EAAQ,KAAK;EACpC,CAAC,GAED,EAAG,WAAW,MAAM;GAIlB,AAHA,EAAE,gBAAgB,GAClB,EAAM,QAAQ,EAAQ,OACtB,EAAQ,WAAW,GAAG,EAAQ,KAAK,GACnC,EAAM,kBAAkB,QAAQ;EAClC,CAAC,GAED,EAAG,SAAS,MAAM;GAEhB,AADA,EAAQ,SAAS,CAAe,GAChC,EAAM,kBAAkB,MAAM;EAChC,CAAC;EAED,IAAI,IAAW,IACT,UAAqB;GACrB,QAEJ;QAAW;IACX,KAAK,IAAM,KAAW,GAAU,EAAQ;GAD7B;EAEb;EAIA,OAFA,GAAQ,iBAAiB,SAAS,GAAQ,EAAE,MAAM,GAAK,CAAC,GAEjD;CACT;CAEA,OAAO;EAAE,GAAG;EAAO;EAAO;EAAS;EAAO;CAAK;AACjD"}
1
+ {"version":3,"file":"text-field.js","names":[],"sources":["../../src/headless/text-field.ts"],"sourcesContent":["import { computed, type Readable, type Signal } from '@vielzeug/ripple';\n\nimport { type CounterState, createCounterState, createField, type FieldHandle, type FieldOptions } from './field-base';\nimport { syncedSignal } from './signals';\n\n// ── Text field ────────────────────────────────────────────────────────────────\n\n/** Detach function returned by `wire()`. Call to remove element listeners. */\nexport type TextFieldDetach = () => void;\n\nexport type TextFieldOptions = FieldOptions & {\n maxLength?: Readable<number | undefined>;\n /**\n * Called synchronously before value extraction on every input event.\n * Use only for DOM side-effects (e.g. auto-resize measurement) that must\n * run before the reactive value is updated.\n */\n onBeforeInput?: (event: Event) => void;\n onBlur?: (event: FocusEvent) => void;\n onChange?: (event: Event, value: string) => void;\n onFocus?: (event: FocusEvent) => void;\n onInput?: (event: Event, value: string) => void;\n /**\n * Bars the field from constraint validation while true — matches the native HTML rule that a\n * `readonly` field is never a candidate for constraint validation (a `readonly required`\n * field is always valid, per spec), so `validity`/`validationMessage` don't feed a false\n * `valueMissing` into `useField()` just because a read-only field happens to be blank.\n */\n readonly?: Readable<boolean | undefined>;\n /** Marks a blank value invalid — feeds `validity`/`validationMessage` (see below). */\n required?: Readable<boolean | undefined>;\n /** Message for the blank+required case. Defaults to `'This field is required.'`. */\n requiredMessage?: Readable<string | undefined>;\n /** `AbortSignal` from the component lifecycle. The internal value-sync watcher is disposed on abort. */\n signal: AbortSignal;\n value: Readable<string | undefined>;\n};\n\nexport type TextFieldHandle = FieldHandle & {\n /**\n * Registers the real form field handle (the return value of `useField()`) so that\n * `triggerValidation()` — called internally on blur/change — can call its\n * `reportValidity()`. `useField()` itself needs `value` (below) to exist first, so this\n * is a two-step wiring rather than a constructor option:\n *\n * ```ts\n * const tf = createTextField({ value: props.value, ... });\n * const formField = useField({ value: tf.value, ... });\n * tf.attachFormField(formField);\n * ```\n */\n attachFormField: (formField: { reportValidity(): void }) => void;\n /** Clears the field value and fires synthetic input/change events. */\n clear: (event?: Event) => void;\n /**\n * Reactive counter state. Non-null when `maxLength` was provided; `null` otherwise.\n * Components should only render a counter element when this is non-null.\n */\n counter: Readable<CounterState> | null;\n /**\n * Restores the value to whatever the `value` option currently holds (native form\n * `reset()` semantics: a `<input>` reverts to its *current* `value` content attribute,\n * not a frozen snapshot from element creation — so setting the attribute programmatically\n * after mount changes what a later reset reverts to). Wire into `useField({ onReset: tf.reset })`.\n */\n reset: () => void;\n /** Reactive validation message paired with `validity`. Empty string when valid. */\n validationMessage: Readable<string>;\n /**\n * Reactive `ValidityStateFlags` — `{ valueMissing: true }` while `required` and blank,\n * `null` (valid) otherwise. Pass straight to `useField({ validity: tf.validity })`.\n */\n validity: Readable<ValidityStateFlags | null>;\n /** The local mutable field value (two-way bound to the input element via `wire()`). */\n value: Signal<string>;\n /**\n * Attaches event listeners to the underlying input or textarea element.\n *\n * When `signal` is provided, the listeners are detached automatically when\n * the signal's controller calls `abort()`. Without a signal the returned\n * `TextFieldDetach` must be called manually.\n *\n * Safe to call multiple times — each call attaches a fresh set of listeners\n * and returns a distinct detach function. Calling detach multiple times is\n * a no-op (guarded internally).\n */\n wire: (el: HTMLInputElement | HTMLTextAreaElement, signal?: AbortSignal) => TextFieldDetach;\n};\n\nconst isBlank = (value: string): boolean => value.trim() === '';\nconst toFieldValue = (v: string | undefined): string => String(v ?? '');\n\nexport const createTextField = (options: TextFieldOptions): TextFieldHandle => {\n const value = syncedSignal(options.value, options.signal, toFieldValue);\n\n const field = createField(options);\n const counter = options.maxLength ? createCounterState({ maxLength: options.maxLength, value }) : null;\n\n const validity = computed<ValidityStateFlags | null>(() =>\n !options.readonly?.value && options.required?.value && isBlank(value.value) ? { valueMissing: true } : null,\n );\n const validationMessage = computed(() =>\n validity.value ? options.requiredMessage?.value || 'This field is required.' : '',\n );\n\n const reset = (): void => {\n value.value = toFieldValue(options.value.value);\n field.triggerValidation('change');\n };\n\n const clear = (event?: Event): void => {\n event?.preventDefault?.();\n value.value = '';\n options.onInput?.(event ?? new InputEvent('input', { bubbles: true }), '');\n options.onChange?.(event ?? new Event('change', { bubbles: true }), '');\n field.triggerValidation('change');\n };\n\n const wire = (element: HTMLInputElement | HTMLTextAreaElement, signal?: AbortSignal): TextFieldDetach => {\n const cleanups: Array<() => void> = [];\n const on = (type: string, handler: EventListener): void => {\n element.addEventListener(type, handler);\n cleanups.push(() => element.removeEventListener(type, handler));\n };\n\n if (options.onFocus) {\n on('focus', (e) => options.onFocus!(e as FocusEvent));\n }\n\n on('input', (e) => {\n e.stopPropagation();\n options.onBeforeInput?.(e);\n value.value = element.value;\n options.onInput?.(e, element.value);\n });\n\n on('change', (e) => {\n e.stopPropagation();\n value.value = element.value;\n options.onChange?.(e, element.value);\n field.triggerValidation('change');\n });\n\n on('blur', (e) => {\n options.onBlur?.(e as FocusEvent);\n field.triggerValidation('blur');\n });\n\n let detached = false;\n const detach = (): void => {\n if (detached) return;\n\n detached = true;\n for (const dispose of cleanups) dispose();\n };\n\n signal?.addEventListener('abort', detach, { once: true });\n\n return detach;\n };\n\n return { ...field, clear, counter, reset, validationMessage, validity, value, wire };\n};\n"],"mappings":";;;;AAyFA,IAAM,KAAW,MAA2B,EAAM,KAAK,MAAM,IACvD,KAAgB,MAAkC,OAAO,KAAK,EAAE,GAEzD,KAAmB,MAA+C;CAC7E,IAAM,IAAQ,EAAa,EAAQ,OAAO,EAAQ,QAAQ,CAAY,GAEhE,IAAQ,EAAY,CAAO,GAC3B,IAAU,EAAQ,YAAY,EAAmB;EAAE,WAAW,EAAQ;EAAW;CAAM,CAAC,IAAI,MAE5F,IAAW,QACf,CAAC,EAAQ,UAAU,SAAS,EAAQ,UAAU,SAAS,EAAQ,EAAM,KAAK,IAAI,EAAE,cAAc,GAAK,IAAI,IACzG,GACM,IAAoB,QACxB,EAAS,QAAQ,EAAQ,iBAAiB,SAAS,4BAA4B,EACjF,GAEM,UAAoB;EAExB,AADA,EAAM,QAAQ,EAAa,EAAQ,MAAM,KAAK,GAC9C,EAAM,kBAAkB,QAAQ;CAClC,GAEM,KAAS,MAAwB;EAKrC,AAJA,GAAO,iBAAiB,GACxB,EAAM,QAAQ,IACd,EAAQ,UAAU,KAAS,IAAI,WAAW,SAAS,EAAE,SAAS,GAAK,CAAC,GAAG,EAAE,GACzE,EAAQ,WAAW,KAAS,IAAI,MAAM,UAAU,EAAE,SAAS,GAAK,CAAC,GAAG,EAAE,GACtE,EAAM,kBAAkB,QAAQ;CAClC,GAEM,KAAQ,GAAiD,MAA0C;EACvG,IAAM,IAA8B,CAAC,GAC/B,KAAM,GAAc,MAAiC;GAEzD,AADA,EAAQ,iBAAiB,GAAM,CAAO,GACtC,EAAS,WAAW,EAAQ,oBAAoB,GAAM,CAAO,CAAC;EAChE;EAoBA,AAlBI,EAAQ,WACV,EAAG,UAAU,MAAM,EAAQ,QAAS,CAAe,CAAC,GAGtD,EAAG,UAAU,MAAM;GAIjB,AAHA,EAAE,gBAAgB,GAClB,EAAQ,gBAAgB,CAAC,GACzB,EAAM,QAAQ,EAAQ,OACtB,EAAQ,UAAU,GAAG,EAAQ,KAAK;EACpC,CAAC,GAED,EAAG,WAAW,MAAM;GAIlB,AAHA,EAAE,gBAAgB,GAClB,EAAM,QAAQ,EAAQ,OACtB,EAAQ,WAAW,GAAG,EAAQ,KAAK,GACnC,EAAM,kBAAkB,QAAQ;EAClC,CAAC,GAED,EAAG,SAAS,MAAM;GAEhB,AADA,EAAQ,SAAS,CAAe,GAChC,EAAM,kBAAkB,MAAM;EAChC,CAAC;EAED,IAAI,IAAW,IACT,UAAqB;GACrB,QAEJ;QAAW;IACX,KAAK,IAAM,KAAW,GAAU,EAAQ;GAD7B;EAEb;EAIA,OAFA,GAAQ,iBAAiB,SAAS,GAAQ,EAAE,MAAM,GAAK,CAAC,GAEjD;CACT;CAEA,OAAO;EAAE,GAAG;EAAO;EAAO;EAAS;EAAO;EAAmB;EAAU;EAAO;CAAK;AACrF"}
package/dist/headless.cjs CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./headless/ore.cjs"),t=require("./headless/field-base.cjs"),n=require("./headless/signals.cjs"),r=require("./headless/text-field.cjs"),i=require("./headless/choice-field.cjs"),a=require("./headless/keyboard.cjs"),o=require("./headless/checkable.cjs"),s=require("./headless/typeahead.cjs"),c=require("./headless/nav.cjs"),l=require("./headless/overlay.cjs"),u=require("./headless/positioner.cjs"),d=require("./headless/option-list.cjs"),f=require("./headless/paginated-list.cjs"),p=require("./headless/numbers.cjs"),m=require("./headless/spinner.cjs"),h=require("./headless/slider.cjs"),g=require("./headless/swipe.cjs"),_=require("./headless/announcer.cjs"),v=require("./headless/date-picker.cjs"),y=require("./headless/dialog-focus.cjs"),b=require("./headless/light-dom.cjs"),x=require("./headless/selection-control.cjs"),S=require("./headless/sort-control.cjs"),C=require("./headless/datagrid.cjs"),w=require("./headless/parse.cjs");exports.announce=_.announce,exports.createCheckable=o.createCheckable,exports.createChoiceField=i.createChoiceField,exports.createDataGridControl=C.createDataGridControl,exports.createDatePickerControl=v.createDatePickerControl,exports.createDialogFocusControl=y.createDialogFocusControl,exports.createDropdownPositioner=u.createDropdownPositioner,exports.createErrorHelperState=t.createErrorHelperState,exports.createInteraction=a.createInteraction,exports.createListControl=c.createListControl,exports.createOptionList=d.createOptionList,exports.createOverlayControl=l.createOverlayControl,exports.createPaginatedList=f.createPaginatedList,exports.createSelectionControl=x.createSelectionControl,exports.createSliderControl=h.createSliderControl,exports.createSortControl=S.createSortControl,exports.createSpinnerControl=m.createSpinnerControl,exports.createSwipeControl=g.createSwipeControl,exports.createTextField=r.createTextField,exports.createTypeahead=s.createTypeahead,exports.dispatchKeyboardAction=a.dispatchKeyboardAction,exports.formatDisplayDate=v.formatDisplayDate,exports.getChoiceLabel=b.getChoiceLabel,exports.getLightChildrenByTag=b.getLightChildrenByTag,exports.lifecycleSignal=e.lifecycleSignal,exports.parseIso=v.parseIso,exports.parseStringTriggers=w.parseStringTriggers,exports.syncedSignal=n.syncedSignal,exports.toFiniteNumber=p.toFiniteNumber,exports.toFiniteNumberOr=p.toFiniteNumberOr,exports.toIsoString=v.toIsoString,exports.toPositiveStep=p.toPositiveStep;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./headless/ore.cjs"),t=require("./headless/auto-resize.cjs"),n=require("./headless/field-base.cjs"),r=require("./headless/signals.cjs"),i=require("./headless/text-field.cjs"),a=require("./headless/choice-field.cjs"),o=require("./headless/keyboard.cjs"),s=require("./headless/checkable.cjs"),c=require("./headless/composer.cjs"),l=require("./headless/typeahead.cjs"),u=require("./headless/nav.cjs"),d=require("./headless/overlay.cjs"),f=require("./headless/positioner.cjs"),p=require("./headless/option-list.cjs"),m=require("./headless/paginated-list.cjs"),h=require("./headless/numbers.cjs"),g=require("./headless/spinner.cjs"),_=require("./headless/slider.cjs"),v=require("./headless/swipe.cjs"),y=require("./headless/announcer.cjs"),b=require("./headless/date-picker.cjs"),x=require("./headless/dialog-focus.cjs"),S=require("./headless/light-dom.cjs"),C=require("./headless/selection-control.cjs"),w=require("./headless/sort-control.cjs"),T=require("./headless/datagrid.cjs"),E=require("./headless/parse.cjs");exports.announce=y.announce,exports.counterClassName=n.counterClassName,exports.createAssistiveState=n.createAssistiveState,exports.createAutoResize=t.createAutoResize,exports.createCheckable=s.createCheckable,exports.createChoiceField=a.createChoiceField,exports.createComposerControl=c.createComposerControl,exports.createDataGridControl=T.createDataGridControl,exports.createDatePickerControl=b.createDatePickerControl,exports.createDialogFocusControl=x.createDialogFocusControl,exports.createDropdownPositioner=f.createDropdownPositioner,exports.createErrorHelperState=n.createErrorHelperState,exports.createField=n.createField,exports.createInteraction=o.createInteraction,exports.createLabelState=n.createLabelState,exports.createListControl=u.createListControl,exports.createOptionList=p.createOptionList,exports.createOverlayControl=d.createOverlayControl,exports.createPaginatedList=m.createPaginatedList,exports.createSelectionControl=C.createSelectionControl,exports.createSliderControl=_.createSliderControl,exports.createSortControl=w.createSortControl,exports.createSpinnerControl=g.createSpinnerControl,exports.createSwipeControl=v.createSwipeControl,exports.createTextField=i.createTextField,exports.createTypeahead=l.createTypeahead,exports.dispatchKeyboardAction=o.dispatchKeyboardAction,exports.formatDisplayDate=b.formatDisplayDate,exports.getChoiceLabel=S.getChoiceLabel,exports.getLightChildrenByTag=S.getLightChildrenByTag,exports.lifecycleSignal=e.lifecycleSignal,exports.parseIso=b.parseIso,exports.parseStringTriggers=E.parseStringTriggers,exports.syncedSignal=r.syncedSignal,exports.toFiniteNumber=h.toFiniteNumber,exports.toFiniteNumberOr=h.toFiniteNumberOr,exports.toIsoString=b.toIsoString,exports.toPositiveStep=h.toPositiveStep;
package/dist/headless.js CHANGED
@@ -1,26 +1,28 @@
1
1
  import { lifecycleSignal as e } from "./headless/ore.js";
2
- import { createErrorHelperState as t } from "./headless/field-base.js";
3
- import { syncedSignal as n } from "./headless/signals.js";
4
- import { createTextField as r } from "./headless/text-field.js";
5
- import { createChoiceField as i } from "./headless/choice-field.js";
6
- import { createInteraction as a, dispatchKeyboardAction as o } from "./headless/keyboard.js";
7
- import { createCheckable as s } from "./headless/checkable.js";
8
- import { createTypeahead as c } from "./headless/typeahead.js";
9
- import { createListControl as l } from "./headless/nav.js";
10
- import { createOverlayControl as u } from "./headless/overlay.js";
11
- import { createDropdownPositioner as d } from "./headless/positioner.js";
12
- import { createOptionList as f } from "./headless/option-list.js";
13
- import { createPaginatedList as p } from "./headless/paginated-list.js";
14
- import { toFiniteNumber as m, toFiniteNumberOr as h, toPositiveStep as g } from "./headless/numbers.js";
15
- import { createSpinnerControl as _ } from "./headless/spinner.js";
16
- import { createSliderControl as v } from "./headless/slider.js";
17
- import { createSwipeControl as y } from "./headless/swipe.js";
18
- import { announce as b } from "./headless/announcer.js";
19
- import { createDatePickerControl as x, formatDisplayDate as S, parseIso as C, toIsoString as w } from "./headless/date-picker.js";
20
- import { createDialogFocusControl as T } from "./headless/dialog-focus.js";
21
- import { getChoiceLabel as E, getLightChildrenByTag as D } from "./headless/light-dom.js";
22
- import { createSelectionControl as O } from "./headless/selection-control.js";
23
- import { createSortControl as k } from "./headless/sort-control.js";
24
- import { createDataGridControl as A } from "./headless/datagrid.js";
25
- import { parseStringTriggers as j } from "./headless/parse.js";
26
- export { b as announce, s as createCheckable, i as createChoiceField, A as createDataGridControl, x as createDatePickerControl, T as createDialogFocusControl, d as createDropdownPositioner, t as createErrorHelperState, a as createInteraction, l as createListControl, f as createOptionList, u as createOverlayControl, p as createPaginatedList, O as createSelectionControl, v as createSliderControl, k as createSortControl, _ as createSpinnerControl, y as createSwipeControl, r as createTextField, c as createTypeahead, o as dispatchKeyboardAction, S as formatDisplayDate, E as getChoiceLabel, D as getLightChildrenByTag, e as lifecycleSignal, C as parseIso, j as parseStringTriggers, n as syncedSignal, m as toFiniteNumber, h as toFiniteNumberOr, w as toIsoString, g as toPositiveStep };
2
+ import { createAutoResize as t } from "./headless/auto-resize.js";
3
+ import { counterClassName as n, createAssistiveState as r, createErrorHelperState as i, createField as a, createLabelState as o } from "./headless/field-base.js";
4
+ import { syncedSignal as s } from "./headless/signals.js";
5
+ import { createTextField as c } from "./headless/text-field.js";
6
+ import { createChoiceField as l } from "./headless/choice-field.js";
7
+ import { createInteraction as u, dispatchKeyboardAction as d } from "./headless/keyboard.js";
8
+ import { createCheckable as f } from "./headless/checkable.js";
9
+ import { createComposerControl as p } from "./headless/composer.js";
10
+ import { createTypeahead as m } from "./headless/typeahead.js";
11
+ import { createListControl as h } from "./headless/nav.js";
12
+ import { createOverlayControl as g } from "./headless/overlay.js";
13
+ import { createDropdownPositioner as _ } from "./headless/positioner.js";
14
+ import { createOptionList as v } from "./headless/option-list.js";
15
+ import { createPaginatedList as y } from "./headless/paginated-list.js";
16
+ import { toFiniteNumber as b, toFiniteNumberOr as x, toPositiveStep as S } from "./headless/numbers.js";
17
+ import { createSpinnerControl as C } from "./headless/spinner.js";
18
+ import { createSliderControl as w } from "./headless/slider.js";
19
+ import { createSwipeControl as T } from "./headless/swipe.js";
20
+ import { announce as E } from "./headless/announcer.js";
21
+ import { createDatePickerControl as D, formatDisplayDate as O, parseIso as k, toIsoString as A } from "./headless/date-picker.js";
22
+ import { createDialogFocusControl as j } from "./headless/dialog-focus.js";
23
+ import { getChoiceLabel as M, getLightChildrenByTag as N } from "./headless/light-dom.js";
24
+ import { createSelectionControl as P } from "./headless/selection-control.js";
25
+ import { createSortControl as F } from "./headless/sort-control.js";
26
+ import { createDataGridControl as I } from "./headless/datagrid.js";
27
+ import { parseStringTriggers as L } from "./headless/parse.js";
28
+ export { E as announce, n as counterClassName, r as createAssistiveState, t as createAutoResize, f as createCheckable, l as createChoiceField, p as createComposerControl, I as createDataGridControl, D as createDatePickerControl, j as createDialogFocusControl, _ as createDropdownPositioner, i as createErrorHelperState, a as createField, u as createInteraction, o as createLabelState, h as createListControl, v as createOptionList, g as createOverlayControl, y as createPaginatedList, P as createSelectionControl, w as createSliderControl, F as createSortControl, C as createSpinnerControl, T as createSwipeControl, c as createTextField, m as createTypeahead, d as dispatchKeyboardAction, O as formatDisplayDate, M as getChoiceLabel, N as getLightChildrenByTag, e as lifecycleSignal, k as parseIso, L as parseStringTriggers, s as syncedSignal, b as toFiniteNumber, x as toFiniteNumberOr, A as toIsoString, S as toPositiveStep };
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./code-window.cjs"),t=require("./icon.cjs"),n=require("./copy-command.cjs"),r=require("./shared/prop-bundles.cjs"),i=require("./shared/size-presets.cjs"),a=require("./progress.cjs"),o=require("./errors.cjs"),ee=require("./content/carousel/carousel-slide.cjs"),s=require("./carousel.cjs"),c=require("./avatar.cjs"),l=require("./breadcrumb.cjs"),u=require("./card.cjs"),d=require("./chat-message.cjs"),f=require("./button-group.cjs"),te=require("./inputs/shared/form-context.cjs"),ne=require("./button.cjs"),re=require("./pagination.cjs"),p=require("./separator.cjs"),m=require("./table.cjs"),h=require("./text.cjs"),g=require("./accordion.cjs"),_=require("./tabs.cjs"),v=require("./accordion-item.cjs"),y=require("./tab-item.cjs"),b=require("./tab-panel.cjs"),x=require("./async.cjs"),S=require("./alert.cjs"),C=require("./badge.cjs"),w=require("./chip.cjs"),T=require("./password-strength.cjs"),E=require("./skeleton.cjs"),D=require("./typing-indicator.cjs"),O=require("./toast.cjs"),k=require("./checkbox-group.cjs"),A=require("./checkbox.cjs"),j=require("./input.cjs"),M=require("./combobox.cjs"),ie=require("./select.cjs"),N=require("./popover.cjs"),P=require("./datagrid.cjs"),F=require("./calendar.cjs"),I=require("./date-picker.cjs"),L=require("./file-input.cjs"),R=require("./form.cjs"),z=require("./number-input.cjs"),B=require("./otp-input.cjs"),V=require("./radio-group.cjs"),H=require("./radio.cjs"),U=require("./rating.cjs"),W=require("./slider.cjs"),G=require("./switch.cjs"),K=require("./textarea.cjs"),q=require("./time-picker.cjs"),J=require("./box.cjs"),Y=require("./grid-item.cjs"),ae=require("./grid.cjs"),X=require("./navbar.cjs"),Z=require("./sidebar.cjs"),Q=require("./command-palette.cjs"),oe=require("./dialog.cjs"),se=require("./drawer.cjs"),$=require("./menu.cjs"),ce=require("./tooltip.cjs");exports.ACCORDION_CTX=g.ACCORDION_CTX,exports.ACCORDION_ITEM_TAG=v.ACCORDION_ITEM_TAG,exports.ACCORDION_TAG=g.ACCORDION_TAG,exports.ALERT_TAG=S.ALERT_TAG,exports.ASYNC_TAG=x.ASYNC_TAG,exports.AVATAR_GROUP_TAG=c.AVATAR_GROUP_TAG,exports.AVATAR_TAG=c.AVATAR_TAG,exports.BADGE_TAG=C.BADGE_TAG,exports.BOX_TAG=J.BOX_TAG,exports.BREADCRUMB_ITEM_TAG=l.BREADCRUMB_ITEM_TAG,exports.BREADCRUMB_TAG=l.BREADCRUMB_TAG,exports.BUTTON_GROUP_CTX=f.BUTTON_GROUP_CTX,exports.BUTTON_GROUP_TAG=f.BUTTON_GROUP_TAG,exports.BUTTON_TAG=ne.BUTTON_TAG,exports.CALENDAR_TAG=F.CALENDAR_TAG,exports.CARD_TAG=u.CARD_TAG,exports.CAROUSEL_SLIDE_TAG=ee.CAROUSEL_SLIDE_TAG,exports.CAROUSEL_TAG=s.CAROUSEL_TAG,exports.CHAT_MESSAGE_TAG=d.CHAT_MESSAGE_TAG,exports.CHECKBOX_GROUP_CTX=k.CHECKBOX_GROUP_CTX,exports.CHECKBOX_GROUP_TAG=k.CHECKBOX_GROUP_TAG,exports.CHECKBOX_TAG=A.CHECKBOX_TAG,exports.CHIP_TAG=w.CHIP_TAG,exports.CODE_WINDOW_TAG=e.CODE_WINDOW_TAG,exports.COMBOBOX_TAG=M.COMBOBOX_TAG,exports.COMMAND_PALETTE_ITEM_TAG=Q.COMMAND_PALETTE_ITEM_TAG,exports.COMMAND_PALETTE_TAG=Q.COMMAND_PALETTE_TAG,exports.CONTROL_SIZE_PRESET=i.CONTROL_SIZE_PRESET,exports.COPY_COMMAND_TAG=n.COPY_COMMAND_TAG,exports.DATAGRID_TAG=P.DATAGRID_TAG,exports.DATE_PICKER_TAG=I.DATE_PICKER_TAG,exports.DIALOG_TAG=oe.DIALOG_TAG,exports.DRAWER_TAG=se.DRAWER_TAG,exports.FIELD_SIZE_PRESET=i.FIELD_SIZE_PRESET,exports.FILE_INPUT_SIZE_PRESET=i.FILE_INPUT_SIZE_PRESET,exports.FILE_INPUT_TAG=L.FILE_INPUT_TAG,exports.FORM_CTX=te.FORM_CTX,exports.FORM_TAG=R.FORM_TAG,exports.GRID_ITEM_TAG=Y.GRID_ITEM_TAG,exports.GRID_TAG=ae.GRID_TAG,exports.ICON_TAG=t.ICON_TAG,exports.INPUT_TAG=j.INPUT_TAG,exports.MENU_ITEM_TAG=$.MENU_ITEM_TAG,exports.MENU_TAG=$.MENU_TAG,exports.NAVBAR_CTX=X.NAVBAR_CTX,exports.NAVBAR_ITEM_TAG=X.NAVBAR_ITEM_TAG,exports.NAVBAR_TAG=X.NAVBAR_TAG,exports.NUMBER_INPUT_TAG=z.NUMBER_INPUT_TAG,exports.OTP_INPUT_TAG=B.OTP_INPUT_TAG,exports.PAGINATION_TAG=re.PAGINATION_TAG,exports.PASSWORD_STRENGTH_TAG=T.PASSWORD_STRENGTH_TAG,exports.POPOVER_TAG=N.POPOVER_TAG,exports.PROGRESS_TAG=a.PROGRESS_TAG,exports.RADIO_GROUP_CTX=V.RADIO_GROUP_CTX,exports.RADIO_GROUP_TAG=V.RADIO_GROUP_TAG,exports.RADIO_TAG=H.RADIO_TAG,exports.RATING_TAG=U.RATING_TAG,exports.RefineConfigError=o.RefineConfigError,exports.RefineError=o.RefineError,exports.SELECT_TAG=ie.SELECT_TAG,exports.SEPARATOR_TAG=p.SEPARATOR_TAG,exports.SIDEBAR_CTX=Z.SIDEBAR_CTX,exports.SIDEBAR_GROUP_TAG=Z.SIDEBAR_GROUP_TAG,exports.SIDEBAR_ITEM_TAG=Z.SIDEBAR_ITEM_TAG,exports.SIDEBAR_TAG=Z.SIDEBAR_TAG,exports.SKELETON_TAG=E.SKELETON_TAG,exports.SLIDER_SIZE_PRESET=i.SLIDER_SIZE_PRESET,exports.SLIDER_TAG=W.SLIDER_TAG,exports.SWITCH_SIZE_PRESET=i.SWITCH_SIZE_PRESET,exports.SWITCH_TAG=G.SWITCH_TAG,exports.TABLE_TAG=m.TABLE_TAG,exports.TABS_CTX=_.TABS_CTX,exports.TABS_TAG=_.TABS_TAG,exports.TAB_ITEM_TAG=y.TAB_ITEM_TAG,exports.TAB_PANEL_TAG=b.TAB_PANEL_TAG,exports.TEXTAREA_SIZE_PRESET=i.TEXTAREA_SIZE_PRESET,exports.TEXTAREA_TAG=K.TEXTAREA_TAG,exports.TEXT_TAG=h.TEXT_TAG,exports.TIME_PICKER_TAG=q.TIME_PICKER_TAG,exports.TOAST_TAG=O.TOAST_TAG,exports.TOOLTIP_TAG=ce.TOOLTIP_TAG,exports.TYPING_INDICATOR_TAG=D.TYPING_INDICATOR_TAG,exports.commonProps=r.commonProps,exports.createToastService=O.createToastService,exports.disablableBundle=r.disablableBundle,exports.elevatableBundle=r.elevatableBundle,exports.loadableBundle=r.loadableBundle,exports.registerIcons=t.registerIcons,exports.roundableBundle=r.roundableBundle,exports.sizableBundle=r.sizableBundle,exports.themableBundle=r.themableBundle,exports.toast=O.toast;
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./code-window.cjs"),t=require("./icon.cjs"),n=require("./copy-command.cjs"),r=require("./shared/prop-bundles.cjs"),i=require("./shared/size-presets.cjs"),a=require("./progress.cjs"),o=require("./errors.cjs"),ee=require("./content/carousel/carousel-slide.cjs"),s=require("./carousel.cjs"),c=require("./avatar.cjs"),l=require("./breadcrumb.cjs"),u=require("./card.cjs"),d=require("./chat-message.cjs"),f=require("./button-group.cjs"),te=require("./inputs/shared/form-context.cjs"),ne=require("./button.cjs"),re=require("./pagination.cjs"),p=require("./separator.cjs"),m=require("./table.cjs"),h=require("./text.cjs"),g=require("./accordion.cjs"),_=require("./tabs.cjs"),v=require("./accordion-item.cjs"),y=require("./tab-item.cjs"),b=require("./tab-panel.cjs"),x=require("./async.cjs"),S=require("./alert.cjs"),C=require("./badge.cjs"),w=require("./chip.cjs"),T=require("./password-strength.cjs"),E=require("./skeleton.cjs"),D=require("./typing-indicator.cjs"),O=require("./toast.cjs"),k=require("./checkbox-group.cjs"),A=require("./checkbox.cjs"),j=require("./input.cjs"),M=require("./combobox.cjs"),ie=require("./select.cjs"),N=require("./popover.cjs"),P=require("./datagrid.cjs"),F=require("./calendar.cjs"),I=require("./date-picker.cjs"),L=require("./file-input.cjs"),R=require("./form.cjs"),z=require("./message-composer.cjs"),B=require("./number-input.cjs"),V=require("./otp-input.cjs"),H=require("./radio-group.cjs"),U=require("./radio.cjs"),W=require("./rating.cjs"),G=require("./slider.cjs"),K=require("./switch.cjs"),q=require("./textarea.cjs"),J=require("./time-picker.cjs"),Y=require("./box.cjs"),ae=require("./grid-item.cjs"),oe=require("./grid.cjs"),X=require("./navbar.cjs"),Z=require("./sidebar.cjs"),Q=require("./command-palette.cjs"),se=require("./dialog.cjs"),ce=require("./drawer.cjs"),$=require("./menu.cjs"),le=require("./tooltip.cjs");exports.ACCORDION_CTX=g.ACCORDION_CTX,exports.ACCORDION_ITEM_TAG=v.ACCORDION_ITEM_TAG,exports.ACCORDION_TAG=g.ACCORDION_TAG,exports.ALERT_TAG=S.ALERT_TAG,exports.ASYNC_TAG=x.ASYNC_TAG,exports.AVATAR_GROUP_TAG=c.AVATAR_GROUP_TAG,exports.AVATAR_TAG=c.AVATAR_TAG,exports.BADGE_TAG=C.BADGE_TAG,exports.BOX_TAG=Y.BOX_TAG,exports.BREADCRUMB_ITEM_TAG=l.BREADCRUMB_ITEM_TAG,exports.BREADCRUMB_TAG=l.BREADCRUMB_TAG,exports.BUTTON_GROUP_CTX=f.BUTTON_GROUP_CTX,exports.BUTTON_GROUP_TAG=f.BUTTON_GROUP_TAG,exports.BUTTON_TAG=ne.BUTTON_TAG,exports.CALENDAR_TAG=F.CALENDAR_TAG,exports.CARD_TAG=u.CARD_TAG,exports.CAROUSEL_SLIDE_TAG=ee.CAROUSEL_SLIDE_TAG,exports.CAROUSEL_TAG=s.CAROUSEL_TAG,exports.CHAT_MESSAGE_TAG=d.CHAT_MESSAGE_TAG,exports.CHECKBOX_GROUP_CTX=k.CHECKBOX_GROUP_CTX,exports.CHECKBOX_GROUP_TAG=k.CHECKBOX_GROUP_TAG,exports.CHECKBOX_TAG=A.CHECKBOX_TAG,exports.CHIP_TAG=w.CHIP_TAG,exports.CODE_WINDOW_TAG=e.CODE_WINDOW_TAG,exports.COMBOBOX_TAG=M.COMBOBOX_TAG,exports.COMMAND_PALETTE_ITEM_TAG=Q.COMMAND_PALETTE_ITEM_TAG,exports.COMMAND_PALETTE_TAG=Q.COMMAND_PALETTE_TAG,exports.CONTROL_SIZE_PRESET=i.CONTROL_SIZE_PRESET,exports.COPY_COMMAND_TAG=n.COPY_COMMAND_TAG,exports.DATAGRID_TAG=P.DATAGRID_TAG,exports.DATE_PICKER_TAG=I.DATE_PICKER_TAG,exports.DIALOG_TAG=se.DIALOG_TAG,exports.DRAWER_TAG=ce.DRAWER_TAG,exports.FIELD_SIZE_PRESET=i.FIELD_SIZE_PRESET,exports.FILE_INPUT_SIZE_PRESET=i.FILE_INPUT_SIZE_PRESET,exports.FILE_INPUT_TAG=L.FILE_INPUT_TAG,exports.FORM_CTX=te.FORM_CTX,exports.FORM_TAG=R.FORM_TAG,exports.GRID_ITEM_TAG=ae.GRID_ITEM_TAG,exports.GRID_TAG=oe.GRID_TAG,exports.ICON_TAG=t.ICON_TAG,exports.INPUT_TAG=j.INPUT_TAG,exports.MENU_ITEM_TAG=$.MENU_ITEM_TAG,exports.MENU_TAG=$.MENU_TAG,exports.MESSAGE_COMPOSER_SIZE_PRESET=i.MESSAGE_COMPOSER_SIZE_PRESET,exports.MESSAGE_COMPOSER_TAG=z.MESSAGE_COMPOSER_TAG,exports.NAVBAR_CTX=X.NAVBAR_CTX,exports.NAVBAR_ITEM_TAG=X.NAVBAR_ITEM_TAG,exports.NAVBAR_TAG=X.NAVBAR_TAG,exports.NUMBER_INPUT_TAG=B.NUMBER_INPUT_TAG,exports.OTP_INPUT_TAG=V.OTP_INPUT_TAG,exports.PAGINATION_TAG=re.PAGINATION_TAG,exports.PASSWORD_STRENGTH_TAG=T.PASSWORD_STRENGTH_TAG,exports.POPOVER_TAG=N.POPOVER_TAG,exports.PROGRESS_TAG=a.PROGRESS_TAG,exports.RADIO_GROUP_CTX=H.RADIO_GROUP_CTX,exports.RADIO_GROUP_TAG=H.RADIO_GROUP_TAG,exports.RADIO_TAG=U.RADIO_TAG,exports.RATING_TAG=W.RATING_TAG,exports.RefineConfigError=o.RefineConfigError,exports.RefineError=o.RefineError,exports.SELECT_TAG=ie.SELECT_TAG,exports.SEPARATOR_TAG=p.SEPARATOR_TAG,exports.SIDEBAR_CTX=Z.SIDEBAR_CTX,exports.SIDEBAR_GROUP_TAG=Z.SIDEBAR_GROUP_TAG,exports.SIDEBAR_ITEM_TAG=Z.SIDEBAR_ITEM_TAG,exports.SIDEBAR_TAG=Z.SIDEBAR_TAG,exports.SKELETON_TAG=E.SKELETON_TAG,exports.SLIDER_SIZE_PRESET=i.SLIDER_SIZE_PRESET,exports.SLIDER_TAG=G.SLIDER_TAG,exports.SWITCH_SIZE_PRESET=i.SWITCH_SIZE_PRESET,exports.SWITCH_TAG=K.SWITCH_TAG,exports.TABLE_TAG=m.TABLE_TAG,exports.TABS_CTX=_.TABS_CTX,exports.TABS_TAG=_.TABS_TAG,exports.TAB_ITEM_TAG=y.TAB_ITEM_TAG,exports.TAB_PANEL_TAG=b.TAB_PANEL_TAG,exports.TEXTAREA_SIZE_PRESET=i.TEXTAREA_SIZE_PRESET,exports.TEXTAREA_TAG=q.TEXTAREA_TAG,exports.TEXT_TAG=h.TEXT_TAG,exports.TIME_PICKER_TAG=J.TIME_PICKER_TAG,exports.TOAST_TAG=O.TOAST_TAG,exports.TOOLTIP_TAG=le.TOOLTIP_TAG,exports.TYPING_INDICATOR_TAG=D.TYPING_INDICATOR_TAG,exports.commonProps=r.commonProps,exports.createToastService=O.createToastService,exports.disablableBundle=r.disablableBundle,exports.elevatableBundle=r.elevatableBundle,exports.loadableBundle=r.loadableBundle,exports.registerIcons=t.registerIcons,exports.roundableBundle=r.roundableBundle,exports.sizableBundle=r.sizableBundle,exports.themableBundle=r.themableBundle,exports.toast=O.toast;
package/dist/index.js CHANGED
@@ -2,63 +2,64 @@ import { CODE_WINDOW_TAG as e } from "./code-window.js";
2
2
  import { ICON_TAG as t, registerIcons as n } from "./icon.js";
3
3
  import { COPY_COMMAND_TAG as r } from "./copy-command.js";
4
4
  import { commonProps as i, disablableBundle as a, elevatableBundle as o, loadableBundle as s, roundableBundle as c, sizableBundle as l, themableBundle as u } from "./shared/prop-bundles.js";
5
- import { CONTROL_SIZE_PRESET as d, FIELD_SIZE_PRESET as f, FILE_INPUT_SIZE_PRESET as p, SLIDER_SIZE_PRESET as m, SWITCH_SIZE_PRESET as h, TEXTAREA_SIZE_PRESET as g } from "./shared/size-presets.js";
6
- import { PROGRESS_TAG as _ } from "./progress.js";
7
- import { RefineConfigError as v, RefineError as y } from "./errors.js";
8
- import { CAROUSEL_SLIDE_TAG as b } from "./content/carousel/carousel-slide.js";
9
- import { CAROUSEL_TAG as x } from "./carousel.js";
10
- import { AVATAR_GROUP_TAG as S, AVATAR_TAG as C } from "./avatar.js";
11
- import { BREADCRUMB_ITEM_TAG as w, BREADCRUMB_TAG as T } from "./breadcrumb.js";
12
- import { CARD_TAG as E } from "./card.js";
13
- import { CHAT_MESSAGE_TAG as D } from "./chat-message.js";
14
- import { BUTTON_GROUP_CTX as O, BUTTON_GROUP_TAG as k } from "./button-group.js";
15
- import { FORM_CTX as A } from "./inputs/shared/form-context.js";
16
- import { BUTTON_TAG as j } from "./button.js";
17
- import { PAGINATION_TAG as M } from "./pagination.js";
18
- import { SEPARATOR_TAG as N } from "./separator.js";
19
- import { TABLE_TAG as P } from "./table.js";
20
- import { TEXT_TAG as F } from "./text.js";
21
- import { ACCORDION_CTX as I, ACCORDION_TAG as L } from "./accordion.js";
22
- import { TABS_CTX as R, TABS_TAG as z } from "./tabs.js";
23
- import { ACCORDION_ITEM_TAG as B } from "./accordion-item.js";
24
- import { TAB_ITEM_TAG as V } from "./tab-item.js";
25
- import { TAB_PANEL_TAG as H } from "./tab-panel.js";
26
- import { ASYNC_TAG as U } from "./async.js";
27
- import { ALERT_TAG as W } from "./alert.js";
28
- import { BADGE_TAG as G } from "./badge.js";
29
- import { CHIP_TAG as K } from "./chip.js";
30
- import { PASSWORD_STRENGTH_TAG as q } from "./password-strength.js";
31
- import { SKELETON_TAG as J } from "./skeleton.js";
32
- import { TYPING_INDICATOR_TAG as Y } from "./typing-indicator.js";
33
- import { TOAST_TAG as X, createToastService as Z, toast as Q } from "./toast.js";
34
- import { CHECKBOX_GROUP_CTX as $, CHECKBOX_GROUP_TAG as ee } from "./checkbox-group.js";
35
- import { CHECKBOX_TAG as te } from "./checkbox.js";
36
- import { INPUT_TAG as ne } from "./input.js";
37
- import { COMBOBOX_TAG as re } from "./combobox.js";
38
- import { SELECT_TAG as ie } from "./select.js";
39
- import { POPOVER_TAG as ae } from "./popover.js";
40
- import { DATAGRID_TAG as oe } from "./datagrid.js";
41
- import { CALENDAR_TAG as se } from "./calendar.js";
42
- import { DATE_PICKER_TAG as ce } from "./date-picker.js";
43
- import { FILE_INPUT_TAG as le } from "./file-input.js";
44
- import { FORM_TAG as ue } from "./form.js";
45
- import { NUMBER_INPUT_TAG as de } from "./number-input.js";
46
- import { OTP_INPUT_TAG as fe } from "./otp-input.js";
47
- import { RADIO_GROUP_CTX as pe, RADIO_GROUP_TAG as me } from "./radio-group.js";
48
- import { RADIO_TAG as he } from "./radio.js";
49
- import { RATING_TAG as ge } from "./rating.js";
50
- import { SLIDER_TAG as _e } from "./slider.js";
51
- import { SWITCH_TAG as ve } from "./switch.js";
52
- import { TEXTAREA_TAG as ye } from "./textarea.js";
53
- import { TIME_PICKER_TAG as be } from "./time-picker.js";
54
- import { BOX_TAG as xe } from "./box.js";
55
- import { GRID_ITEM_TAG as Se } from "./grid-item.js";
56
- import { GRID_TAG as Ce } from "./grid.js";
57
- import { NAVBAR_CTX as we, NAVBAR_ITEM_TAG as Te, NAVBAR_TAG as Ee } from "./navbar.js";
58
- import { SIDEBAR_CTX as De, SIDEBAR_GROUP_TAG as Oe, SIDEBAR_ITEM_TAG as ke, SIDEBAR_TAG as Ae } from "./sidebar.js";
59
- import { COMMAND_PALETTE_ITEM_TAG as je, COMMAND_PALETTE_TAG as Me } from "./command-palette.js";
60
- import { DIALOG_TAG as Ne } from "./dialog.js";
61
- import { DRAWER_TAG as Pe } from "./drawer.js";
62
- import { MENU_ITEM_TAG as Fe, MENU_TAG as Ie } from "./menu.js";
63
- import { TOOLTIP_TAG as Le } from "./tooltip.js";
64
- export { I as ACCORDION_CTX, B as ACCORDION_ITEM_TAG, L as ACCORDION_TAG, W as ALERT_TAG, U as ASYNC_TAG, S as AVATAR_GROUP_TAG, C as AVATAR_TAG, G as BADGE_TAG, xe as BOX_TAG, w as BREADCRUMB_ITEM_TAG, T as BREADCRUMB_TAG, O as BUTTON_GROUP_CTX, k as BUTTON_GROUP_TAG, j as BUTTON_TAG, se as CALENDAR_TAG, E as CARD_TAG, b as CAROUSEL_SLIDE_TAG, x as CAROUSEL_TAG, D as CHAT_MESSAGE_TAG, $ as CHECKBOX_GROUP_CTX, ee as CHECKBOX_GROUP_TAG, te as CHECKBOX_TAG, K as CHIP_TAG, e as CODE_WINDOW_TAG, re as COMBOBOX_TAG, je as COMMAND_PALETTE_ITEM_TAG, Me as COMMAND_PALETTE_TAG, d as CONTROL_SIZE_PRESET, r as COPY_COMMAND_TAG, oe as DATAGRID_TAG, ce as DATE_PICKER_TAG, Ne as DIALOG_TAG, Pe as DRAWER_TAG, f as FIELD_SIZE_PRESET, p as FILE_INPUT_SIZE_PRESET, le as FILE_INPUT_TAG, A as FORM_CTX, ue as FORM_TAG, Se as GRID_ITEM_TAG, Ce as GRID_TAG, t as ICON_TAG, ne as INPUT_TAG, Fe as MENU_ITEM_TAG, Ie as MENU_TAG, we as NAVBAR_CTX, Te as NAVBAR_ITEM_TAG, Ee as NAVBAR_TAG, de as NUMBER_INPUT_TAG, fe as OTP_INPUT_TAG, M as PAGINATION_TAG, q as PASSWORD_STRENGTH_TAG, ae as POPOVER_TAG, _ as PROGRESS_TAG, pe as RADIO_GROUP_CTX, me as RADIO_GROUP_TAG, he as RADIO_TAG, ge as RATING_TAG, v as RefineConfigError, y as RefineError, ie as SELECT_TAG, N as SEPARATOR_TAG, De as SIDEBAR_CTX, Oe as SIDEBAR_GROUP_TAG, ke as SIDEBAR_ITEM_TAG, Ae as SIDEBAR_TAG, J as SKELETON_TAG, m as SLIDER_SIZE_PRESET, _e as SLIDER_TAG, h as SWITCH_SIZE_PRESET, ve as SWITCH_TAG, P as TABLE_TAG, R as TABS_CTX, z as TABS_TAG, V as TAB_ITEM_TAG, H as TAB_PANEL_TAG, g as TEXTAREA_SIZE_PRESET, ye as TEXTAREA_TAG, F as TEXT_TAG, be as TIME_PICKER_TAG, X as TOAST_TAG, Le as TOOLTIP_TAG, Y as TYPING_INDICATOR_TAG, i as commonProps, Z as createToastService, a as disablableBundle, o as elevatableBundle, s as loadableBundle, n as registerIcons, c as roundableBundle, l as sizableBundle, u as themableBundle, Q as toast };
5
+ import { CONTROL_SIZE_PRESET as d, FIELD_SIZE_PRESET as f, FILE_INPUT_SIZE_PRESET as p, MESSAGE_COMPOSER_SIZE_PRESET as m, SLIDER_SIZE_PRESET as h, SWITCH_SIZE_PRESET as g, TEXTAREA_SIZE_PRESET as _ } from "./shared/size-presets.js";
6
+ import { PROGRESS_TAG as v } from "./progress.js";
7
+ import { RefineConfigError as y, RefineError as b } from "./errors.js";
8
+ import { CAROUSEL_SLIDE_TAG as x } from "./content/carousel/carousel-slide.js";
9
+ import { CAROUSEL_TAG as S } from "./carousel.js";
10
+ import { AVATAR_GROUP_TAG as C, AVATAR_TAG as w } from "./avatar.js";
11
+ import { BREADCRUMB_ITEM_TAG as T, BREADCRUMB_TAG as E } from "./breadcrumb.js";
12
+ import { CARD_TAG as D } from "./card.js";
13
+ import { CHAT_MESSAGE_TAG as O } from "./chat-message.js";
14
+ import { BUTTON_GROUP_CTX as k, BUTTON_GROUP_TAG as A } from "./button-group.js";
15
+ import { FORM_CTX as j } from "./inputs/shared/form-context.js";
16
+ import { BUTTON_TAG as M } from "./button.js";
17
+ import { PAGINATION_TAG as N } from "./pagination.js";
18
+ import { SEPARATOR_TAG as P } from "./separator.js";
19
+ import { TABLE_TAG as F } from "./table.js";
20
+ import { TEXT_TAG as I } from "./text.js";
21
+ import { ACCORDION_CTX as L, ACCORDION_TAG as R } from "./accordion.js";
22
+ import { TABS_CTX as z, TABS_TAG as B } from "./tabs.js";
23
+ import { ACCORDION_ITEM_TAG as V } from "./accordion-item.js";
24
+ import { TAB_ITEM_TAG as H } from "./tab-item.js";
25
+ import { TAB_PANEL_TAG as U } from "./tab-panel.js";
26
+ import { ASYNC_TAG as W } from "./async.js";
27
+ import { ALERT_TAG as G } from "./alert.js";
28
+ import { BADGE_TAG as K } from "./badge.js";
29
+ import { CHIP_TAG as q } from "./chip.js";
30
+ import { PASSWORD_STRENGTH_TAG as J } from "./password-strength.js";
31
+ import { SKELETON_TAG as Y } from "./skeleton.js";
32
+ import { TYPING_INDICATOR_TAG as X } from "./typing-indicator.js";
33
+ import { TOAST_TAG as Z, createToastService as Q, toast as $ } from "./toast.js";
34
+ import { CHECKBOX_GROUP_CTX as ee, CHECKBOX_GROUP_TAG as te } from "./checkbox-group.js";
35
+ import { CHECKBOX_TAG as ne } from "./checkbox.js";
36
+ import { INPUT_TAG as re } from "./input.js";
37
+ import { COMBOBOX_TAG as ie } from "./combobox.js";
38
+ import { SELECT_TAG as ae } from "./select.js";
39
+ import { POPOVER_TAG as oe } from "./popover.js";
40
+ import { DATAGRID_TAG as se } from "./datagrid.js";
41
+ import { CALENDAR_TAG as ce } from "./calendar.js";
42
+ import { DATE_PICKER_TAG as le } from "./date-picker.js";
43
+ import { FILE_INPUT_TAG as ue } from "./file-input.js";
44
+ import { FORM_TAG as de } from "./form.js";
45
+ import { MESSAGE_COMPOSER_TAG as fe } from "./message-composer.js";
46
+ import { NUMBER_INPUT_TAG as pe } from "./number-input.js";
47
+ import { OTP_INPUT_TAG as me } from "./otp-input.js";
48
+ import { RADIO_GROUP_CTX as he, RADIO_GROUP_TAG as ge } from "./radio-group.js";
49
+ import { RADIO_TAG as _e } from "./radio.js";
50
+ import { RATING_TAG as ve } from "./rating.js";
51
+ import { SLIDER_TAG as ye } from "./slider.js";
52
+ import { SWITCH_TAG as be } from "./switch.js";
53
+ import { TEXTAREA_TAG as xe } from "./textarea.js";
54
+ import { TIME_PICKER_TAG as Se } from "./time-picker.js";
55
+ import { BOX_TAG as Ce } from "./box.js";
56
+ import { GRID_ITEM_TAG as we } from "./grid-item.js";
57
+ import { GRID_TAG as Te } from "./grid.js";
58
+ import { NAVBAR_CTX as Ee, NAVBAR_ITEM_TAG as De, NAVBAR_TAG as Oe } from "./navbar.js";
59
+ import { SIDEBAR_CTX as ke, SIDEBAR_GROUP_TAG as Ae, SIDEBAR_ITEM_TAG as je, SIDEBAR_TAG as Me } from "./sidebar.js";
60
+ import { COMMAND_PALETTE_ITEM_TAG as Ne, COMMAND_PALETTE_TAG as Pe } from "./command-palette.js";
61
+ import { DIALOG_TAG as Fe } from "./dialog.js";
62
+ import { DRAWER_TAG as Ie } from "./drawer.js";
63
+ import { MENU_ITEM_TAG as Le, MENU_TAG as Re } from "./menu.js";
64
+ import { TOOLTIP_TAG as ze } from "./tooltip.js";
65
+ export { L as ACCORDION_CTX, V as ACCORDION_ITEM_TAG, R as ACCORDION_TAG, G as ALERT_TAG, W as ASYNC_TAG, C as AVATAR_GROUP_TAG, w as AVATAR_TAG, K as BADGE_TAG, Ce as BOX_TAG, T as BREADCRUMB_ITEM_TAG, E as BREADCRUMB_TAG, k as BUTTON_GROUP_CTX, A as BUTTON_GROUP_TAG, M as BUTTON_TAG, ce as CALENDAR_TAG, D as CARD_TAG, x as CAROUSEL_SLIDE_TAG, S as CAROUSEL_TAG, O as CHAT_MESSAGE_TAG, ee as CHECKBOX_GROUP_CTX, te as CHECKBOX_GROUP_TAG, ne as CHECKBOX_TAG, q as CHIP_TAG, e as CODE_WINDOW_TAG, ie as COMBOBOX_TAG, Ne as COMMAND_PALETTE_ITEM_TAG, Pe as COMMAND_PALETTE_TAG, d as CONTROL_SIZE_PRESET, r as COPY_COMMAND_TAG, se as DATAGRID_TAG, le as DATE_PICKER_TAG, Fe as DIALOG_TAG, Ie as DRAWER_TAG, f as FIELD_SIZE_PRESET, p as FILE_INPUT_SIZE_PRESET, ue as FILE_INPUT_TAG, j as FORM_CTX, de as FORM_TAG, we as GRID_ITEM_TAG, Te as GRID_TAG, t as ICON_TAG, re as INPUT_TAG, Le as MENU_ITEM_TAG, Re as MENU_TAG, m as MESSAGE_COMPOSER_SIZE_PRESET, fe as MESSAGE_COMPOSER_TAG, Ee as NAVBAR_CTX, De as NAVBAR_ITEM_TAG, Oe as NAVBAR_TAG, pe as NUMBER_INPUT_TAG, me as OTP_INPUT_TAG, N as PAGINATION_TAG, J as PASSWORD_STRENGTH_TAG, oe as POPOVER_TAG, v as PROGRESS_TAG, he as RADIO_GROUP_CTX, ge as RADIO_GROUP_TAG, _e as RADIO_TAG, ve as RATING_TAG, y as RefineConfigError, b as RefineError, ae as SELECT_TAG, P as SEPARATOR_TAG, ke as SIDEBAR_CTX, Ae as SIDEBAR_GROUP_TAG, je as SIDEBAR_ITEM_TAG, Me as SIDEBAR_TAG, Y as SKELETON_TAG, h as SLIDER_SIZE_PRESET, ye as SLIDER_TAG, g as SWITCH_SIZE_PRESET, be as SWITCH_TAG, F as TABLE_TAG, z as TABS_CTX, B as TABS_TAG, H as TAB_ITEM_TAG, U as TAB_PANEL_TAG, _ as TEXTAREA_SIZE_PRESET, xe as TEXTAREA_TAG, I as TEXT_TAG, Se as TIME_PICKER_TAG, Z as TOAST_TAG, ze as TOOLTIP_TAG, X as TYPING_INDICATOR_TAG, i as commonProps, Q as createToastService, a as disablableBundle, o as elevatableBundle, s as loadableBundle, n as registerIcons, c as roundableBundle, l as sizableBundle, u as themableBundle, $ as toast };
package/dist/input.cjs CHANGED
@@ -1,4 +1,4 @@
1
- Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./ore/dist/directives/live.cjs");require("./ore/dist/directives.cjs");const t=require("./styles/mixins/shape.css.cjs"),n=require("./styles/mixins/theme.css.cjs"),r=require("./styles/index.cjs"),i=require("./shared/prop-bundles.cjs"),a=require("./shared/size-presets.cjs"),o=require("./headless/ore.cjs"),s=require("./headless/text-field.cjs"),c=require("./ore/dist/forms/field.cjs");require("./ore/dist/forms.cjs");const l=require("./inputs/shared/form-context.cjs"),u=require("./inputs/input/input.css.cjs");let d=require("@vielzeug/ore"),f=require("@vielzeug/ripple");var p=[`text`,`email`,`password`,`search`,`url`,`tel`,`number`,`date`,`time`,`datetime-local`,`month`,`week`],m=`ore-input`;(0,d.define)(m,{formAssociated:!0,props:{...i.themableBundle,...i.sizableBundle,...i.disablableBundle,...i.roundableBundle,autocomplete:d.prop.string(),clearable:d.prop.bool(!1),error:d.prop.string(),fullwidth:d.prop.bool(!1),helper:d.prop.string(),inputmode:d.prop.string(),label:d.prop.string(),"label-placement":d.prop.oneOf([`inset`,`outside`],`inset`),maxlength:d.prop.json(void 0),minlength:d.prop.json(void 0),name:d.prop.string(),pattern:d.prop.string(),placeholder:d.prop.string(),readonly:d.prop.bool(!1),ref:d.prop.json(void 0),required:d.prop.bool(!1),type:d.prop.oneOf(p,`text`),value:d.prop.string(),variant:d.prop.string()},setup(t){let n=(0,d.useEmit)(),r=(0,d.useSlots)(),i=(0,d.inject)(l.FORM_CTX),a=l.useFormContext(t,i),u=(0,f.signal)(!1),p=(0,d.ref)(),m=(0,f.computed)(()=>!!t.label.value||r.has(`label`).value),h=o.lifecycleSignal(d.onCleanup),g=null,_=s.createTextField({disabled:a.disabled,error:t.error,getFormField:()=>g,hasLabel:m,helper:t.helper,label:t.label,labelPlacement:t[`label-placement`],maxLength:t.maxlength,onChange:(e,t)=>{n(`change`,{originalEvent:e,value:t})},onInput:(e,t)=>{n(`input`,{originalEvent:e,value:t})},prefix:`input`,signal:h,validateOn:i?.validateOn,value:t.value});g=c.useField({disabled:_.disabled,toFormValue:e=>e,value:_.value});let{ariaDescribedBy:v,ariaErrorMessage:y,ariaInvalid:b,ariaLabelledBy:x,assistiveId:S,clear:C,counter:w,errorId:T,errorText:E,fieldId:D,helperText:O,labelId:k,labelVisible:A,value:j,wire:M}=_;return(0,d.onElement)(p,e=>{M(e,h),t.ref.value?.(e);let n=(0,f.watch)(t.ref,t=>{t?.(e)});return()=>{n.dispose(),t.ref.value?.(null)}}),(0,d.bind)({attr:{error:()=>E.value||void 0,"has-value":()=>j.value?!0:void 0,size:a.size,variant:a.variant}}),d.html`
1
+ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("./ore/dist/directives/live.cjs");require("./ore/dist/directives.cjs");const t=require("./styles/mixins/shape.css.cjs"),n=require("./styles/mixins/theme.css.cjs"),r=require("./styles/index.cjs"),i=require("./shared/prop-bundles.cjs"),a=require("./shared/size-presets.cjs"),o=require("./headless/ore.cjs"),s=require("./headless/text-field.cjs"),c=require("./ore/dist/forms/field.cjs");require("./ore/dist/forms.cjs");const l=require("./inputs/shared/field-binding.cjs"),u=require("./inputs/shared/form-context.cjs"),d=require("./inputs/input/input.css.cjs");let f=require("@vielzeug/ore"),p=require("@vielzeug/ripple");var m=[`text`,`email`,`password`,`search`,`url`,`tel`,`number`,`date`,`time`,`datetime-local`,`month`,`week`],h=`ore-input`;(0,f.define)(h,{formAssociated:!0,props:{...i.themableBundle,...i.sizableBundle,...i.disablableBundle,...i.roundableBundle,autocomplete:f.prop.string(),clearable:f.prop.bool(!1),error:f.prop.string(),fullwidth:f.prop.bool(!1),helper:f.prop.string(),inputmode:f.prop.string(),label:f.prop.string(),"label-placement":f.prop.oneOf([`inset`,`outside`],`inset`),maxlength:f.prop.json(void 0),minlength:f.prop.json(void 0),name:f.prop.string(),pattern:f.prop.string(),placeholder:f.prop.string(),readonly:f.prop.bool(!1),ref:f.prop.json(void 0),required:f.prop.bool(!1),type:f.prop.oneOf(m,`text`),value:f.prop.string(),variant:f.prop.string()},setup(t){let n=(0,f.useEmit)(),r=(0,f.useSlots)(),i=(0,f.inject)(u.FORM_CTX),a=u.useFormContext(t,i),d=(0,p.signal)(!1),m=(0,f.ref)(),h=(0,p.computed)(()=>!!t.label.value||r.has(`label`).value),g=o.lifecycleSignal(f.onCleanup),_=s.createTextField({disabled:a.disabled,error:t.error,hasLabel:h,helper:t.helper,label:t.label,labelPlacement:t[`label-placement`],maxLength:t.maxlength,onChange:(e,t)=>{n(`change`,{originalEvent:e,value:t})},onInput:(e,t)=>{n(`input`,{originalEvent:e,value:t})},prefix:`input`,readonly:t.readonly,required:t.required,signal:g,validateOn:i?.validateOn,value:t.value});_.attachFormField(c.useField({disabled:_.disabled,onReset:_.reset,toFormValue:e=>e,validationMessage:_.validationMessage,validity:_.validity,value:_.value}));let{ariaDescribedBy:v,ariaErrorMessage:y,ariaInvalid:b,ariaLabelledBy:x,assistiveId:S,clear:C,counter:w,errorId:T,errorText:E,fieldId:D,helperText:O,labelId:k,labelVisible:A,value:j,wire:M}=_;return(0,f.onElement)(m,e=>{M(e,g),t.ref.value?.(e);let n=(0,p.watch)(t.ref,t=>{t?.(e)});return()=>{n.dispose(),t.ref.value?.(null)}}),(0,f.bind)({attr:{error:l.errorAttr(E),"has-value":()=>j.value?!0:void 0,size:a.size,variant:a.variant}}),f.html`
2
2
  <div class="input-wrapper" part="wrapper">
3
3
  <label class="label" for="${D}" id="${k}" part="label" ?hidden="${()=>!A.value}"
4
4
  ><slot name="label">${t.label}</slot></label
@@ -9,7 +9,7 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
9
9
  <input
10
10
  part="input"
11
11
  id="${D}"
12
- :type="${()=>t.type.value===`password`&&u.value?`text`:t.type.value??`text`}"
12
+ :type="${()=>t.type.value===`password`&&d.value?`text`:t.type.value??`text`}"
13
13
  :name="${t.name}"
14
14
  :placeholder="${t.placeholder}"
15
15
  :autocomplete="${t.autocomplete}"
@@ -25,17 +25,17 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
25
25
  :aria-describedby="${v}"
26
26
  :aria-errormessage="${y}"
27
27
  :aria-invalid="${b}"
28
- ref="${p}" />
28
+ ref="${m}" />
29
29
  <slot name="suffix"></slot>
30
30
  <button
31
31
  class="pwd-toggle-btn"
32
32
  part="pwd-toggle"
33
33
  type="button"
34
- :aria-label="${()=>u.value?`Hide password`:`Show password`}"
35
- :aria-pressed="${()=>String(u.value)}"
34
+ :aria-label="${()=>d.value?`Hide password`:`Show password`}"
35
+ :aria-pressed="${()=>String(d.value)}"
36
36
  :tabindex="${()=>t.type.value===`password`?`0`:`-1`}"
37
- @click="${()=>{u.value=!u.value,p.value?.focus()}}">
38
- ${()=>u.value?d.html`<ore-icon name="eye-off" size="14" stroke-width="2" aria-hidden="true"></ore-icon>`:d.html`<ore-icon name="eye" size="14" stroke-width="2" aria-hidden="true"></ore-icon>`}
37
+ @click="${()=>{d.value=!d.value,m.value?.focus()}}">
38
+ ${()=>d.value?f.html`<ore-icon name="eye-off" size="14" stroke-width="2" aria-hidden="true"></ore-icon>`:f.html`<ore-icon name="eye" size="14" stroke-width="2" aria-hidden="true"></ore-icon>`}
39
39
  </button>
40
40
  <button
41
41
  aria-label="Clear"
@@ -43,7 +43,7 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
43
43
  part="clear"
44
44
  type="button"
45
45
  :tabindex="${()=>j.value?`0`:`-1`}"
46
- @click="${e=>{C(e),p.value?.focus()}}">
46
+ @click="${e=>{C(e),m.value?.focus()}}">
47
47
  <ore-icon aria-hidden="true" name="x" size="12" stroke-width="2.5"></ore-icon>
48
48
  </button>
49
49
  </div>
@@ -63,5 +63,5 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=requi
63
63
  ${()=>w?.value.counterText??``}
64
64
  </div>
65
65
  </div>
66
- `},shadow:{delegatesFocus:!0},styles:[...r.fieldMixins,t.sizeVariantMixin(a.FIELD_SIZE_PRESET),n.forcedColorsFocusMixin(`input`),u.default]}),exports.INPUT_TAG=m;
66
+ `},shadow:{delegatesFocus:!0},styles:[...r.fieldMixins,t.sizeVariantMixin(a.FIELD_SIZE_PRESET),n.forcedColorsFocusMixin(`input`),d.default]}),exports.INPUT_TAG=h;
67
67
  //# sourceMappingURL=input.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"input.cjs","names":[],"sources":["../src/inputs/input/input.ts"],"sourcesContent":["import { define, html, inject, prop, ref, bind, onCleanup, onElement, useEmit, useSlots } from '@vielzeug/ore';\nimport { live } from '@vielzeug/ore/directives';\nimport { useField } from '@vielzeug/ore/forms';\nimport { computed, signal, watch } from '@vielzeug/ripple';\n\nimport type { TextFieldProps } from '../../shared';\nimport type { InputType, VisualVariant } from '../../types';\n\nimport { lifecycleSignal, createTextField } from '../../headless';\nimport { disablableBundle, FIELD_SIZE_PRESET, roundableBundle, sizableBundle, themableBundle } from '../../shared';\nimport '../../content/icon/icon';\nimport { fieldMixins, forcedColorsFocusMixin, sizeVariantMixin } from '../../styles';\nimport { FORM_CTX, useFormContext } from '../shared/form-context';\nimport componentStyles from './input.css?inline';\n\n/** Input component properties */\n\nexport type OreInputEvents = {\n change: { originalEvent: Event; value: string };\n input: { originalEvent: Event; value: string };\n};\n\nexport type OreInputProps = TextFieldProps<Exclude<VisualVariant, 'frost'>> & {\n /** Autocomplete hint */\n autocomplete?: string;\n /** Show a clear (×) button when the field has a value */\n clearable?: boolean;\n /** Virtual keyboard hint for mobile devices */\n inputmode?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';\n /** Maximum character length — shows a counter below the input */\n maxlength?: number;\n /** Minimum character length */\n minlength?: number;\n /** HTML pattern attribute for client-side validation */\n pattern?: string;\n /**\n * JS-only callback fired with the inner `<input>` element when it mounts,\n * and with `null` when it unmounts. Intended for composed components that\n * need imperative access to the raw input element.\n * Set as a JS property: `bitInput.ref = (el) => { ... }`.\n */\n ref?: ((el: HTMLInputElement | null) => void) | null;\n /** HTML input type */\n type?: InputType;\n};\n\nconst VALID_INPUT_TYPES = [\n 'text',\n 'email',\n 'password',\n 'search',\n 'url',\n 'tel',\n 'number',\n 'date',\n 'time',\n 'datetime-local',\n 'month',\n 'week',\n] as const;\n\n/**\n * A customizable text input component with multiple variants, label placements, and form features.\n *\n * @element ore-input\n *\n * @attr {string} label - Label text\n * @attr {string} label-placement - Label placement: 'inset' | 'outside'\n * @attr {string} type - HTML input type: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url' | 'search'\n * @attr {string} value - Current input value\n * @attr {string} placeholder - Placeholder text\n * @attr {string} name - Form field name\n * @attr {string} helper - Helper text displayed below the input (fallback when the `helper` slot is empty)\n * @attr {string} error - Error message — marks the field as invalid (fallback when the `error` slot is empty)\n * @attr {boolean} disabled - Disable input interaction\n * @attr {boolean} readonly - Make the input read-only\n * @attr {boolean} required - Mark the field as required\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} variant - Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost' | 'text'\n * @attr {string} size - Input size: 'sm' | 'md' | 'lg'\n * @attr {string} rounded - Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n *\n * @fires input - Emitted when input value changes (on every keystroke). detail: { value: string; originalEvent: Event }\n * @fires change - Emitted when input loses focus with changed value. detail: { value: string; originalEvent: Event }\n *\n * @slot prefix - Content before the input (e.g., icons)\n * @slot suffix - Content after the input (e.g., clear button, validation icon)\n * @slot label - Replaces the label text — slotted content takes precedence over the `label` prop\n * @slot helper - Replaces the helper text — slotted content takes precedence over the `helper` prop\n * @slot error - Replaces the error text — slotted content takes precedence over the `error` prop\n *\n * @part wrapper - The input wrapper element\n * @part label - The label element (inset or outside)\n * @part field - The field container element\n * @part input-row - The input row container element\n * @part input - The input element\n * @part helper - The helper text element\n *\n * @cssprop --input-bg - Background color\n * @cssprop --input-color - Text color\n * @cssprop --input-border-color - Border color\n * @cssprop --input-placeholder-color - Placeholder text color\n * @cssprop --input-radius - Border radius\n * @cssprop --input-padding - Inner padding (block inline)\n * @cssprop --input-gap - Gap between prefix/suffix icons and input text\n * @cssprop --input-font-size - Font size\n * @cssprop --input-height - Field height\n * @cssprop --input-hover-bg - Field background on hover (flat/ghost variants)\n * @cssprop --input-hover-border-color - Field border on hover (flat/bordered variants)\n * @cssprop --input-focus-bg - Field background when focused (flat variant)\n * @cssprop --input-focus-border-color - Field border when focused (flat/text variants)\n *\n * @example\n * ```html\n * <ore-input type=\"email\" label=\"Email\" placeholder=\"you@example.com\" />\n * <ore-input label=\"Name\" variant=\"bordered\" color=\"primary\" />\n * ```\n */\nexport const INPUT_TAG = 'ore-input' as const;\ndefine<OreInputProps>(INPUT_TAG, {\n formAssociated: true,\n props: {\n ...themableBundle,\n ...sizableBundle,\n ...disablableBundle,\n ...roundableBundle,\n autocomplete: prop.string(),\n clearable: prop.bool(false),\n error: prop.string(),\n fullwidth: prop.bool(false),\n helper: prop.string(),\n inputmode: prop.string<'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'>(),\n label: prop.string(),\n 'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n maxlength: prop.json(undefined as number | undefined),\n minlength: prop.json(undefined as number | undefined),\n name: prop.string(),\n pattern: prop.string(),\n placeholder: prop.string(),\n readonly: prop.bool(false),\n ref: prop.json(undefined as ((el: HTMLInputElement | null) => void) | null | undefined),\n required: prop.bool(false),\n type: prop.oneOf(VALID_INPUT_TYPES, 'text'),\n value: prop.string(),\n variant: prop.string<'flat' | 'text' | 'solid' | 'bordered' | 'outline' | 'ghost'>(),\n },\n setup(props) {\n const emit = useEmit<OreInputEvents>();\n const slots = useSlots();\n\n const formCtx = inject(FORM_CTX);\n const fCtxProps = useFormContext(props, formCtx);\n const showPassword = signal(false);\n const inputRef = ref<HTMLInputElement>();\n\n const hasLabel = computed(() => !!props.label.value || slots.has('label').value);\n\n const abortSignal = lifecycleSignal(onCleanup);\n let _formField: { reportValidity(): void } | null = null;\n const tf = createTextField({\n disabled: fCtxProps.disabled,\n error: props.error,\n getFormField: () => _formField,\n hasLabel,\n helper: props.helper,\n label: props.label,\n labelPlacement: props['label-placement'],\n maxLength: props.maxlength,\n onChange: (event: Event, value: string) => {\n emit('change', { originalEvent: event, value });\n },\n onInput: (event: Event, value: string) => {\n emit('input', { originalEvent: event, value });\n },\n prefix: 'input',\n signal: abortSignal,\n validateOn: formCtx?.validateOn,\n value: props.value,\n });\n\n _formField = useField<string>({ disabled: tf.disabled, toFormValue: (v) => v, value: tf.value });\n\n const {\n ariaDescribedBy,\n ariaErrorMessage,\n ariaInvalid,\n ariaLabelledBy,\n assistiveId,\n clear: clearValue,\n counter,\n errorId,\n errorText,\n fieldId: inputId,\n helperText,\n labelId,\n labelVisible,\n value: fieldValue,\n wire,\n } = tf;\n\n onElement(inputRef, (el) => {\n wire(el, abortSignal);\n\n // Immediate fire for when the prop is already set on mount.\n props.ref.value?.(el);\n\n // Reactive watcher so that if props.ref is set *after* the inner\n // <input> mounts (e.g. parent sets it via a ref callback after render),\n // the new callback still receives the live element.\n const sub = watch(props.ref, (cb) => {\n cb?.(el);\n });\n\n return () => {\n sub.dispose();\n props.ref.value?.(null);\n };\n });\n\n const clear = (event?: Event): void => {\n clearValue(event);\n inputRef.value?.focus();\n };\n\n const resolvedInputType = (): string =>\n props.type.value === 'password' && showPassword.value ? 'text' : (props.type.value ?? 'text');\n\n bind({\n attr: {\n error: () => errorText.value || undefined,\n 'has-value': () => (fieldValue.value ? true : undefined),\n size: fCtxProps.size,\n variant: fCtxProps.variant,\n },\n });\n\n const labelHidden = () => !labelVisible.value;\n const passwordToggleLabel = () => (showPassword.value ? 'Hide password' : 'Show password');\n const passwordTogglePressed = () => String(showPassword.value);\n const passwordToggleIcon = () =>\n showPassword.value\n ? html`<ore-icon name=\"eye-off\" size=\"14\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>`\n : html`<ore-icon name=\"eye\" size=\"14\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>`;\n const helperHidden = () => !!errorText.value || !helperText.value;\n const errorHidden = () => !errorText.value;\n const counterNearLimit = () => (counter?.value.counterNearLimit && !counter?.value.counterAtLimit ? '' : null);\n const counterAtLimit = () => (counter?.value.counterAtLimit ? '' : null);\n const counterHidden = () => !counter;\n const counterText = () => counter?.value.counterText ?? '';\n\n const clearTabIndex = () => (fieldValue.value ? '0' : '-1');\n const pwdToggleTabIndex = () => (props.type.value === 'password' ? '0' : '-1');\n\n const togglePassword = () => {\n showPassword.value = !showPassword.value;\n inputRef.value?.focus();\n };\n\n return html`\n <div class=\"input-wrapper\" part=\"wrapper\">\n <label class=\"label\" for=\"${inputId}\" id=\"${labelId}\" part=\"label\" ?hidden=\"${labelHidden}\"\n ><slot name=\"label\">${props.label}</slot></label\n >\n <div class=\"field\" part=\"field\">\n <div class=\"input-row\" part=\"input-row\">\n <slot name=\"prefix\"></slot>\n <input\n part=\"input\"\n id=\"${inputId}\"\n :type=\"${resolvedInputType}\"\n :name=\"${props.name}\"\n :placeholder=\"${props.placeholder}\"\n :autocomplete=\"${props.autocomplete}\"\n :inputmode=\"${props.inputmode}\"\n :maxlength=\"${props.maxlength}\"\n :minlength=\"${props.minlength}\"\n :pattern=\"${props.pattern}\"\n ?disabled=\"${props.disabled}\"\n ?readonly=\"${props.readonly}\"\n ?required=\"${props.required}\"\n :value=\"${live(fieldValue)}\"\n :aria-labelledby=\"${ariaLabelledBy}\"\n :aria-describedby=\"${ariaDescribedBy}\"\n :aria-errormessage=\"${ariaErrorMessage}\"\n :aria-invalid=\"${ariaInvalid}\"\n ref=\"${inputRef}\" />\n <slot name=\"suffix\"></slot>\n <button\n class=\"pwd-toggle-btn\"\n part=\"pwd-toggle\"\n type=\"button\"\n :aria-label=\"${passwordToggleLabel}\"\n :aria-pressed=\"${passwordTogglePressed}\"\n :tabindex=\"${pwdToggleTabIndex}\"\n @click=\"${togglePassword}\">\n ${passwordToggleIcon}\n </button>\n <button\n aria-label=\"Clear\"\n class=\"clear-btn\"\n part=\"clear\"\n type=\"button\"\n :tabindex=\"${clearTabIndex}\"\n @click=\"${clear}\">\n <ore-icon aria-hidden=\"true\" name=\"x\" size=\"12\" stroke-width=\"2.5\"></ore-icon>\n </button>\n </div>\n </div>\n <div class=\"helper-text\" aria-live=\"polite\" id=\"${assistiveId}\" part=\"helper\" ?hidden=\"${helperHidden}\">\n <slot name=\"helper\">${() => helperText.value}</slot>\n </div>\n <div class=\"helper-text\" id=\"${errorId}\" role=\"alert\" part=\"error\" ?hidden=\"${errorHidden}\">\n <slot name=\"error\">${() => errorText.value}</slot>\n </div>\n <div\n class=\"char-counter\"\n part=\"char-counter\"\n :data-near-limit=\"${counterNearLimit}\"\n :data-at-limit=\"${counterAtLimit}\"\n ?hidden=\"${counterHidden}\">\n ${counterText}\n </div>\n </div>\n `;\n },\n shadow: { delegatesFocus: true },\n styles: [...fieldMixins, sizeVariantMixin(FIELD_SIZE_PRESET), forcedColorsFocusMixin('input'), componentStyles],\n});\n"],"mappings":"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"}
1
+ {"version":3,"file":"input.cjs","names":[],"sources":["../src/inputs/input/input.ts"],"sourcesContent":["import { define, html, inject, prop, ref, bind, onCleanup, onElement, useEmit, useSlots } from '@vielzeug/ore';\nimport { live } from '@vielzeug/ore/directives';\nimport { useField } from '@vielzeug/ore/forms';\nimport { computed, signal, watch } from '@vielzeug/ripple';\n\nimport type { TextFieldProps } from '../../shared';\nimport type { InputType, VisualVariant } from '../../types';\n\nimport { lifecycleSignal, createTextField } from '../../headless';\nimport { disablableBundle, FIELD_SIZE_PRESET, roundableBundle, sizableBundle, themableBundle } from '../../shared';\nimport '../../content/icon/icon';\nimport { fieldMixins, forcedColorsFocusMixin, sizeVariantMixin } from '../../styles';\nimport { errorAttr } from '../shared/field-binding';\nimport { FORM_CTX, useFormContext } from '../shared/form-context';\nimport componentStyles from './input.css?inline';\n\n/** Input component properties */\n\nexport type OreInputEvents = {\n change: { originalEvent: Event; value: string };\n input: { originalEvent: Event; value: string };\n};\n\nexport type OreInputProps = TextFieldProps<Exclude<VisualVariant, 'frost'>> & {\n /** Autocomplete hint */\n autocomplete?: string;\n /** Show a clear (×) button when the field has a value */\n clearable?: boolean;\n /** Virtual keyboard hint for mobile devices */\n inputmode?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';\n /** Maximum character length — shows a counter below the input */\n maxlength?: number;\n /** Minimum character length */\n minlength?: number;\n /** HTML pattern attribute for client-side validation */\n pattern?: string;\n /**\n * JS-only callback fired with the inner `<input>` element when it mounts,\n * and with `null` when it unmounts. Intended for composed components that\n * need imperative access to the raw input element.\n * Set as a JS property: `bitInput.ref = (el) => { ... }`.\n */\n ref?: ((el: HTMLInputElement | null) => void) | null;\n /** HTML input type */\n type?: InputType;\n};\n\nconst VALID_INPUT_TYPES = [\n 'text',\n 'email',\n 'password',\n 'search',\n 'url',\n 'tel',\n 'number',\n 'date',\n 'time',\n 'datetime-local',\n 'month',\n 'week',\n] as const;\n\n/**\n * A customizable text input component with multiple variants, label placements, and form features.\n *\n * @element ore-input\n *\n * @attr {string} label - Label text\n * @attr {string} label-placement - Label placement: 'inset' | 'outside'\n * @attr {string} type - HTML input type: 'text' | 'email' | 'password' | 'number' | 'tel' | 'url' | 'search'\n * @attr {string} value - Current input value\n * @attr {string} placeholder - Placeholder text\n * @attr {string} name - Form field name\n * @attr {string} helper - Helper text displayed below the input (fallback when the `helper` slot is empty)\n * @attr {string} error - Error message — marks the field as invalid (fallback when the `error` slot is empty)\n * @attr {boolean} disabled - Disable input interaction\n * @attr {boolean} readonly - Make the input read-only\n * @attr {boolean} required - Mark the field as required\n * @attr {string} color - Theme color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'error'\n * @attr {string} variant - Visual variant: 'solid' | 'flat' | 'bordered' | 'outline' | 'ghost' | 'text'\n * @attr {string} size - Input size: 'sm' | 'md' | 'lg'\n * @attr {string} rounded - Border radius: 'none' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n *\n * @fires input - Emitted when input value changes (on every keystroke). detail: { value: string; originalEvent: Event }\n * @fires change - Emitted when input loses focus with changed value. detail: { value: string; originalEvent: Event }\n *\n * @slot prefix - Content before the input (e.g., icons)\n * @slot suffix - Content after the input (e.g., clear button, validation icon)\n * @slot label - Replaces the label text — slotted content takes precedence over the `label` prop\n * @slot helper - Replaces the helper text — slotted content takes precedence over the `helper` prop\n * @slot error - Replaces the error text — slotted content takes precedence over the `error` prop\n *\n * @part wrapper - The input wrapper element\n * @part label - The label element (inset or outside)\n * @part field - The field container element\n * @part input-row - The input row container element\n * @part input - The input element\n * @part helper - The helper text element\n *\n * @cssprop --input-bg - Background color\n * @cssprop --input-color - Text color\n * @cssprop --input-border-color - Border color\n * @cssprop --input-placeholder-color - Placeholder text color\n * @cssprop --input-radius - Border radius\n * @cssprop --input-padding - Inner padding (block inline)\n * @cssprop --input-gap - Gap between prefix/suffix icons and input text\n * @cssprop --input-font-size - Font size\n * @cssprop --input-height - Field height\n * @cssprop --input-hover-bg - Field background on hover (flat/ghost variants)\n * @cssprop --input-hover-border-color - Field border on hover (flat/bordered variants)\n * @cssprop --input-focus-bg - Field background when focused (flat variant)\n * @cssprop --input-focus-border-color - Field border when focused (flat/text variants)\n *\n * @example\n * ```html\n * <ore-input type=\"email\" label=\"Email\" placeholder=\"you@example.com\" />\n * <ore-input label=\"Name\" variant=\"bordered\" color=\"primary\" />\n * ```\n */\nexport const INPUT_TAG = 'ore-input' as const;\ndefine<OreInputProps>(INPUT_TAG, {\n formAssociated: true,\n props: {\n ...themableBundle,\n ...sizableBundle,\n ...disablableBundle,\n ...roundableBundle,\n autocomplete: prop.string(),\n clearable: prop.bool(false),\n error: prop.string(),\n fullwidth: prop.bool(false),\n helper: prop.string(),\n inputmode: prop.string<'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'>(),\n label: prop.string(),\n 'label-placement': prop.oneOf(['inset', 'outside'] as const, 'inset'),\n maxlength: prop.json(undefined as number | undefined),\n minlength: prop.json(undefined as number | undefined),\n name: prop.string(),\n pattern: prop.string(),\n placeholder: prop.string(),\n readonly: prop.bool(false),\n ref: prop.json(undefined as ((el: HTMLInputElement | null) => void) | null | undefined),\n required: prop.bool(false),\n type: prop.oneOf(VALID_INPUT_TYPES, 'text'),\n value: prop.string(),\n variant: prop.string<'flat' | 'text' | 'solid' | 'bordered' | 'outline' | 'ghost'>(),\n },\n setup(props) {\n const emit = useEmit<OreInputEvents>();\n const slots = useSlots();\n\n const formCtx = inject(FORM_CTX);\n const fCtxProps = useFormContext(props, formCtx);\n const showPassword = signal(false);\n const inputRef = ref<HTMLInputElement>();\n\n const hasLabel = computed(() => !!props.label.value || slots.has('label').value);\n\n const abortSignal = lifecycleSignal(onCleanup);\n const tf = createTextField({\n disabled: fCtxProps.disabled,\n error: props.error,\n hasLabel,\n helper: props.helper,\n label: props.label,\n labelPlacement: props['label-placement'],\n maxLength: props.maxlength,\n onChange: (event: Event, value: string) => {\n emit('change', { originalEvent: event, value });\n },\n onInput: (event: Event, value: string) => {\n emit('input', { originalEvent: event, value });\n },\n prefix: 'input',\n readonly: props.readonly,\n required: props.required,\n signal: abortSignal,\n validateOn: formCtx?.validateOn,\n value: props.value,\n });\n\n tf.attachFormField(\n useField<string>({\n disabled: tf.disabled,\n onReset: tf.reset,\n toFormValue: (v) => v,\n validationMessage: tf.validationMessage,\n validity: tf.validity,\n value: tf.value,\n }),\n );\n\n const {\n ariaDescribedBy,\n ariaErrorMessage,\n ariaInvalid,\n ariaLabelledBy,\n assistiveId,\n clear: clearValue,\n counter,\n errorId,\n errorText,\n fieldId: inputId,\n helperText,\n labelId,\n labelVisible,\n value: fieldValue,\n wire,\n } = tf;\n\n onElement(inputRef, (el) => {\n wire(el, abortSignal);\n\n // Immediate fire for when the prop is already set on mount.\n props.ref.value?.(el);\n\n // Reactive watcher so that if props.ref is set *after* the inner\n // <input> mounts (e.g. parent sets it via a ref callback after render),\n // the new callback still receives the live element.\n const sub = watch(props.ref, (cb) => {\n cb?.(el);\n });\n\n return () => {\n sub.dispose();\n props.ref.value?.(null);\n };\n });\n\n const clear = (event?: Event): void => {\n clearValue(event);\n inputRef.value?.focus();\n };\n\n const resolvedInputType = (): string =>\n props.type.value === 'password' && showPassword.value ? 'text' : (props.type.value ?? 'text');\n\n bind({\n attr: {\n error: errorAttr(errorText),\n 'has-value': () => (fieldValue.value ? true : undefined),\n size: fCtxProps.size,\n variant: fCtxProps.variant,\n },\n });\n\n const labelHidden = () => !labelVisible.value;\n const passwordToggleLabel = () => (showPassword.value ? 'Hide password' : 'Show password');\n const passwordTogglePressed = () => String(showPassword.value);\n const passwordToggleIcon = () =>\n showPassword.value\n ? html`<ore-icon name=\"eye-off\" size=\"14\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>`\n : html`<ore-icon name=\"eye\" size=\"14\" stroke-width=\"2\" aria-hidden=\"true\"></ore-icon>`;\n const helperHidden = () => !!errorText.value || !helperText.value;\n const errorHidden = () => !errorText.value;\n const counterNearLimit = () => (counter?.value.counterNearLimit && !counter?.value.counterAtLimit ? '' : null);\n const counterAtLimit = () => (counter?.value.counterAtLimit ? '' : null);\n const counterHidden = () => !counter;\n const counterText = () => counter?.value.counterText ?? '';\n\n const clearTabIndex = () => (fieldValue.value ? '0' : '-1');\n const pwdToggleTabIndex = () => (props.type.value === 'password' ? '0' : '-1');\n\n const togglePassword = () => {\n showPassword.value = !showPassword.value;\n inputRef.value?.focus();\n };\n\n return html`\n <div class=\"input-wrapper\" part=\"wrapper\">\n <label class=\"label\" for=\"${inputId}\" id=\"${labelId}\" part=\"label\" ?hidden=\"${labelHidden}\"\n ><slot name=\"label\">${props.label}</slot></label\n >\n <div class=\"field\" part=\"field\">\n <div class=\"input-row\" part=\"input-row\">\n <slot name=\"prefix\"></slot>\n <input\n part=\"input\"\n id=\"${inputId}\"\n :type=\"${resolvedInputType}\"\n :name=\"${props.name}\"\n :placeholder=\"${props.placeholder}\"\n :autocomplete=\"${props.autocomplete}\"\n :inputmode=\"${props.inputmode}\"\n :maxlength=\"${props.maxlength}\"\n :minlength=\"${props.minlength}\"\n :pattern=\"${props.pattern}\"\n ?disabled=\"${props.disabled}\"\n ?readonly=\"${props.readonly}\"\n ?required=\"${props.required}\"\n :value=\"${live(fieldValue)}\"\n :aria-labelledby=\"${ariaLabelledBy}\"\n :aria-describedby=\"${ariaDescribedBy}\"\n :aria-errormessage=\"${ariaErrorMessage}\"\n :aria-invalid=\"${ariaInvalid}\"\n ref=\"${inputRef}\" />\n <slot name=\"suffix\"></slot>\n <button\n class=\"pwd-toggle-btn\"\n part=\"pwd-toggle\"\n type=\"button\"\n :aria-label=\"${passwordToggleLabel}\"\n :aria-pressed=\"${passwordTogglePressed}\"\n :tabindex=\"${pwdToggleTabIndex}\"\n @click=\"${togglePassword}\">\n ${passwordToggleIcon}\n </button>\n <button\n aria-label=\"Clear\"\n class=\"clear-btn\"\n part=\"clear\"\n type=\"button\"\n :tabindex=\"${clearTabIndex}\"\n @click=\"${clear}\">\n <ore-icon aria-hidden=\"true\" name=\"x\" size=\"12\" stroke-width=\"2.5\"></ore-icon>\n </button>\n </div>\n </div>\n <div class=\"helper-text\" aria-live=\"polite\" id=\"${assistiveId}\" part=\"helper\" ?hidden=\"${helperHidden}\">\n <slot name=\"helper\">${() => helperText.value}</slot>\n </div>\n <div class=\"helper-text\" id=\"${errorId}\" role=\"alert\" part=\"error\" ?hidden=\"${errorHidden}\">\n <slot name=\"error\">${() => errorText.value}</slot>\n </div>\n <div\n class=\"char-counter\"\n part=\"char-counter\"\n :data-near-limit=\"${counterNearLimit}\"\n :data-at-limit=\"${counterAtLimit}\"\n ?hidden=\"${counterHidden}\">\n ${counterText}\n </div>\n </div>\n `;\n },\n shadow: { delegatesFocus: true },\n styles: [...fieldMixins, sizeVariantMixin(FIELD_SIZE_PRESET), forcedColorsFocusMixin('input'), componentStyles],\n});\n"],"mappings":"6rBA+CA,IAAM,EAAoB,CACxB,OACA,QACA,WACA,SACA,MACA,MACA,SACA,OACA,OACA,iBACA,QACA,MACF,EA2Da,EAAY,yBACH,EAAW,CAC/B,eAAgB,GAChB,MAAO,CACL,GAAG,EAAA,eACH,GAAG,EAAA,cACH,GAAG,EAAA,iBACH,GAAG,EAAA,gBACH,aAAc,EAAA,KAAK,OAAO,EAC1B,UAAW,EAAA,KAAK,KAAK,EAAK,EAC1B,MAAO,EAAA,KAAK,OAAO,EACnB,UAAW,EAAA,KAAK,KAAK,EAAK,EAC1B,OAAQ,EAAA,KAAK,OAAO,EACpB,UAAW,EAAA,KAAK,OAAqF,EACrG,MAAO,EAAA,KAAK,OAAO,EACnB,kBAAmB,EAAA,KAAK,MAAM,CAAC,QAAS,SAAS,EAAY,OAAO,EACpE,UAAW,EAAA,KAAK,KAAK,IAAA,EAA+B,EACpD,UAAW,EAAA,KAAK,KAAK,IAAA,EAA+B,EACpD,KAAM,EAAA,KAAK,OAAO,EAClB,QAAS,EAAA,KAAK,OAAO,EACrB,YAAa,EAAA,KAAK,OAAO,EACzB,SAAU,EAAA,KAAK,KAAK,EAAK,EACzB,IAAK,EAAA,KAAK,KAAK,IAAA,EAAuE,EACtF,SAAU,EAAA,KAAK,KAAK,EAAK,EACzB,KAAM,EAAA,KAAK,MAAM,EAAmB,MAAM,EAC1C,MAAO,EAAA,KAAK,OAAO,EACnB,QAAS,EAAA,KAAK,OAAqE,CACrF,EACA,MAAM,EAAO,CACX,IAAM,GAAA,EAAA,EAAA,QAAA,CAA+B,EAC/B,GAAA,EAAA,EAAA,SAAA,CAAiB,EAEjB,GAAA,EAAA,EAAA,OAAA,CAAiB,EAAA,QAAQ,EACzB,EAAY,EAAA,eAAe,EAAO,CAAO,EACzC,GAAA,EAAA,EAAA,OAAA,CAAsB,EAAK,EAC3B,GAAA,EAAA,EAAA,IAAA,CAAiC,EAEjC,GAAA,EAAA,EAAA,SAAA,KAA0B,CAAC,CAAC,EAAM,MAAM,OAAS,EAAM,IAAI,OAAO,CAAC,CAAC,KAAK,EAEzE,EAAc,EAAA,gBAAgB,EAAA,SAAS,EACvC,EAAK,EAAA,gBAAgB,CACzB,SAAU,EAAU,SACpB,MAAO,EAAM,MACb,WACA,OAAQ,EAAM,OACd,MAAO,EAAM,MACb,eAAgB,EAAM,mBACtB,UAAW,EAAM,UACjB,UAAW,EAAc,IAAkB,CACzC,EAAK,SAAU,CAAE,cAAe,EAAO,OAAM,CAAC,CAChD,EACA,SAAU,EAAc,IAAkB,CACxC,EAAK,QAAS,CAAE,cAAe,EAAO,OAAM,CAAC,CAC/C,EACA,OAAQ,QACR,SAAU,EAAM,SAChB,SAAU,EAAM,SAChB,OAAQ,EACR,WAAY,GAAS,WACrB,MAAO,EAAM,KACf,CAAC,EAED,EAAG,gBACD,EAAA,SAAiB,CACf,SAAU,EAAG,SACb,QAAS,EAAG,MACZ,YAAc,GAAM,EACpB,kBAAmB,EAAG,kBACtB,SAAU,EAAG,SACb,MAAO,EAAG,KACZ,CAAC,CACH,EAEA,GAAM,CACJ,kBACA,mBACA,cACA,iBACA,cACA,MAAO,EACP,UACA,UACA,YACA,QAAS,EACT,aACA,UACA,eACA,MAAO,EACP,QACE,EA4DJ,OA1DA,EAAA,EAAA,UAAA,CAAU,EAAW,GAAO,CAC1B,EAAK,EAAI,CAAW,EAGpB,EAAM,IAAI,QAAQ,CAAE,EAKpB,IAAM,GAAA,EAAA,EAAA,MAAA,CAAY,EAAM,IAAM,GAAO,CACnC,IAAK,CAAE,CACT,CAAC,EAED,UAAa,CACX,EAAI,QAAQ,EACZ,EAAM,IAAI,QAAQ,IAAI,CACxB,CACF,CAAC,GAUD,EAAA,EAAA,KAAA,CAAK,CACH,KAAM,CACJ,MAAO,EAAA,UAAU,CAAS,EAC1B,gBAAoB,EAAW,MAAQ,GAAO,IAAA,GAC9C,KAAM,EAAU,KAChB,QAAS,EAAU,OACrB,CACF,CAAC,EAwBM,EAAA,IAAI;;oCAEqB,EAAQ,QAAQ,EAAQ,8BAxB9B,CAAC,EAAa,MAwBsD;gCAClE,EAAM,MAAM;;;;;;;oBAOxB,EAAQ;2BA3CtB,EAAM,KAAK,QAAU,YAAc,EAAa,MAAQ,OAAU,EAAM,KAAK,OAAS,OA4CnD;uBAClB,EAAM,KAAK;8BACJ,EAAM,YAAY;+BACjB,EAAM,aAAa;4BACtB,EAAM,UAAU;4BAChB,EAAM,UAAU;4BAChB,EAAM,UAAU;0BAClB,EAAM,QAAQ;2BACb,EAAM,SAAS;2BACf,EAAM,SAAS;2BACf,EAAM,SAAS;wBAClB,EAAA,KAAK,CAAU,EAAE;kCACP,EAAe;mCACd,EAAgB;oCACf,EAAiB;+BACtB,EAAY;qBACtB,EAAS;;;;;;iCAhDS,EAAa,MAAQ,gBAAkB,gBAsD7B;mCArDT,OAAO,EAAa,KAAK,EAsDZ;+BAzChB,EAAM,KAAK,QAAU,WAAa,IAAM,KA0ChC;4BAxCZ,CAC3B,EAAa,MAAQ,CAAC,EAAa,MACnC,EAAS,OAAO,MAAM,CACxB,EAsCmC;oBAtDjC,EAAa,MACT,EAAA,IAAI,qFACJ,EAAA,IAAI,iFAqDqB;;;;;;;+BA7CF,EAAW,MAAQ,IAAM,KAoDjB;wBAnFtB,GAAwB,CACrC,EAAW,CAAK,EAChB,EAAS,OAAO,MAAM,CACxB,EAiF0B;;;;;0DAK4B,EAAY,+BAjEvC,CAAC,CAAC,EAAU,OAAS,CAAC,EAAW,MAiE8C;oCACxE,EAAW,MAAM;;uCAEhB,EAAQ,2CAnEjB,CAAC,EAAU,MAmEyD;mCAC7D,EAAU,MAAM;;;;;kCAnEjB,GAAS,MAAM,kBAAoB,CAAC,GAAS,MAAM,eAAiB,GAAK,KAwE9D;gCAvEb,GAAS,MAAM,eAAiB,GAAK,KAwE5B;yBAvEX,CAAC,EAwEE;gBAvEL,GAAS,MAAM,aAAe,GAwEpC;;;KAItB,EACA,OAAQ,CAAE,eAAgB,EAAK,EAC/B,OAAQ,CAAC,GAAG,EAAA,YAAa,EAAA,iBAAiB,EAAA,iBAAiB,EAAG,EAAA,uBAAuB,OAAO,EAAG,EAAA,OAAe,CAChH,CAAC"}