sibujs 1.4.0 → 2.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (190) hide show
  1. package/README.md +105 -119
  2. package/dist/browser.cjs +288 -80
  3. package/dist/browser.d.cts +19 -9
  4. package/dist/browser.d.ts +19 -9
  5. package/dist/browser.js +6 -6
  6. package/dist/build.cjs +1019 -313
  7. package/dist/build.d.cts +1 -1
  8. package/dist/build.d.ts +1 -1
  9. package/dist/build.js +15 -13
  10. package/dist/cdn.global.js +17 -16
  11. package/dist/chunk-2RA7SHDA.js +65 -0
  12. package/dist/chunk-2UPRY23K.js +80 -0
  13. package/dist/chunk-3JHCYHWN.js +125 -0
  14. package/dist/{chunk-ZWKZCBO6.js → chunk-3LR7GLWQ.js} +154 -33
  15. package/dist/{chunk-3AIRKM3B.js → chunk-3NSGB5JN.js} +115 -34
  16. package/dist/{chunk-3ARAQO7B.js → chunk-52YJLLRO.js} +29 -6
  17. package/dist/chunk-54EDRCEF.js +93 -0
  18. package/dist/chunk-7JDB7I65.js +1327 -0
  19. package/dist/{chunk-WZSPOOER.js → chunk-CC65Y57T.js} +8 -5
  20. package/dist/{chunk-23VV7YD3.js → chunk-DFPFITST.js} +25 -30
  21. package/dist/{chunk-WR5D4EGH.js → chunk-GTBNNBJ6.js} +14 -2
  22. package/dist/chunk-HB24TBAF.js +121 -0
  23. package/dist/{chunk-CZUGLNJS.js → chunk-ITX6OO3F.js} +3 -3
  24. package/dist/{chunk-JAKHTMQU.js → chunk-JA6667UN.js} +206 -46
  25. package/dist/{chunk-77L6NL3X.js → chunk-JXMMDLBY.js} +306 -183
  26. package/dist/{chunk-3X2YG6YM.js → chunk-JYD2PWXH.js} +59 -28
  27. package/dist/{chunk-F3FA4F32.js → chunk-KLRMB5ZS.js} +135 -79
  28. package/dist/{chunk-5X6PP2UK.js → chunk-LMLD24FC.js} +2 -2
  29. package/dist/{chunk-M4NLBH4I.js → chunk-LYTCUZ7H.js} +3 -2
  30. package/dist/{chunk-TSOKIX5Z.js → chunk-MIUAXB7K.js} +126 -74
  31. package/dist/{chunk-QWZG56ET.js → chunk-ND2664SF.js} +558 -190
  32. package/dist/{chunk-JCI5M6U6.js → chunk-O2MNQFLP.js} +261 -79
  33. package/dist/{chunk-EWFVA3TJ.js → chunk-R73P76YZ.js} +1 -1
  34. package/dist/{chunk-2BYQDGN3.js → chunk-SAHNHTFC.js} +234 -63
  35. package/dist/chunk-UCS6AMJ7.js +79 -0
  36. package/dist/{chunk-ZD6OAMTH.js → chunk-VLPPXTYG.js} +90 -35
  37. package/dist/{chunk-OUZZEE4S.js → chunk-WOMYAHHI.js} +17 -11
  38. package/dist/{contracts-xo5ckdRP.d.cts → contracts-ey_Qh8ef.d.cts} +7 -8
  39. package/dist/{contracts-xo5ckdRP.d.ts → contracts-ey_Qh8ef.d.ts} +7 -8
  40. package/dist/{customElement-D2DJp_xn.d.cts → customElement-CPfIrbvg.d.cts} +18 -9
  41. package/dist/{customElement-D2DJp_xn.d.ts → customElement-CPfIrbvg.d.ts} +18 -9
  42. package/dist/data.cjs +452 -100
  43. package/dist/data.d.cts +20 -2
  44. package/dist/data.d.ts +20 -2
  45. package/dist/data.js +11 -9
  46. package/dist/devtools.cjs +535 -247
  47. package/dist/devtools.d.cts +1 -1
  48. package/dist/devtools.d.ts +1 -1
  49. package/dist/devtools.js +34 -30
  50. package/dist/ecosystem.cjs +499 -143
  51. package/dist/ecosystem.d.cts +13 -11
  52. package/dist/ecosystem.d.ts +13 -11
  53. package/dist/ecosystem.js +12 -11
  54. package/dist/extras.cjs +3639 -1629
  55. package/dist/extras.d.cts +11 -11
  56. package/dist/extras.d.ts +11 -11
  57. package/dist/extras.js +58 -45
  58. package/dist/index.cjs +1023 -313
  59. package/dist/index.d.cts +128 -55
  60. package/dist/index.d.ts +128 -55
  61. package/dist/index.js +28 -16
  62. package/dist/{introspect-BumjnBKr.d.cts → introspect-BWNjNw64.d.cts} +22 -2
  63. package/dist/{introspect-CZrlcaYy.d.ts → introspect-cY2pg9pW.d.ts} +22 -2
  64. package/dist/motion.cjs +90 -36
  65. package/dist/motion.d.cts +1 -1
  66. package/dist/motion.d.ts +1 -1
  67. package/dist/motion.js +4 -4
  68. package/dist/patterns.cjs +414 -81
  69. package/dist/patterns.d.cts +53 -20
  70. package/dist/patterns.d.ts +53 -20
  71. package/dist/patterns.js +7 -7
  72. package/dist/performance.cjs +364 -108
  73. package/dist/performance.d.cts +29 -17
  74. package/dist/performance.d.ts +29 -17
  75. package/dist/performance.js +13 -6
  76. package/dist/plugin-D30wlGW5.d.cts +71 -0
  77. package/dist/plugin-D30wlGW5.d.ts +71 -0
  78. package/dist/plugins.cjs +652 -271
  79. package/dist/plugins.d.cts +13 -6
  80. package/dist/plugins.d.ts +13 -6
  81. package/dist/plugins.js +116 -50
  82. package/dist/{ssr-Do_SiVoL.d.cts → ssr-CrVNy6Pa.d.cts} +9 -15
  83. package/dist/{ssr-Do_SiVoL.d.ts → ssr-CrVNy6Pa.d.ts} +9 -15
  84. package/dist/{ssr-4PBXAOO3.js → ssr-FXD2PPMC.js} +4 -3
  85. package/dist/ssr.cjs +648 -219
  86. package/dist/ssr.d.cts +27 -7
  87. package/dist/ssr.d.ts +27 -7
  88. package/dist/ssr.js +12 -11
  89. package/dist/{tagFactory-DaJ0YWX6.d.ts → tagFactory-S17H2qxu.d.cts} +9 -1
  90. package/dist/{tagFactory-DaJ0YWX6.d.cts → tagFactory-S17H2qxu.d.ts} +9 -1
  91. package/dist/testing.cjs +252 -63
  92. package/dist/testing.d.cts +17 -4
  93. package/dist/testing.d.ts +17 -4
  94. package/dist/testing.js +100 -44
  95. package/dist/ui.cjs +576 -168
  96. package/dist/ui.d.cts +13 -16
  97. package/dist/ui.d.ts +13 -16
  98. package/dist/ui.js +20 -17
  99. package/dist/widgets.cjs +1001 -93
  100. package/dist/widgets.d.cts +104 -2
  101. package/dist/widgets.d.ts +104 -2
  102. package/dist/widgets.js +9 -7
  103. package/package.json +8 -2
  104. package/dist/chunk-32DY64NT.js +0 -282
  105. package/dist/chunk-3CRQALYP.js +0 -877
  106. package/dist/chunk-4EI4AG32.js +0 -482
  107. package/dist/chunk-4MYMUBRS.js +0 -21
  108. package/dist/chunk-6HLLIF3K.js +0 -398
  109. package/dist/chunk-6LSNVCS2.js +0 -937
  110. package/dist/chunk-6SA3QQES.js +0 -61
  111. package/dist/chunk-7BF6TK55.js +0 -1097
  112. package/dist/chunk-7TQKR4PP.js +0 -294
  113. package/dist/chunk-7V26P53V.js +0 -712
  114. package/dist/chunk-AZ3ISID5.js +0 -298
  115. package/dist/chunk-B7SWRFUT.js +0 -332
  116. package/dist/chunk-BGN5ZMP4.js +0 -26
  117. package/dist/chunk-BTU3TJDS.js +0 -365
  118. package/dist/chunk-BW3WT46K.js +0 -937
  119. package/dist/chunk-C6KFWOFV.js +0 -616
  120. package/dist/chunk-CHF5OHIA.js +0 -61
  121. package/dist/chunk-CHJ27IGK.js +0 -26
  122. package/dist/chunk-CMBFNA7L.js +0 -27
  123. package/dist/chunk-DAHRH4ON.js +0 -331
  124. package/dist/chunk-DKOHBI74.js +0 -924
  125. package/dist/chunk-DTCOOBMX.js +0 -725
  126. package/dist/chunk-EBGIRKQY.js +0 -616
  127. package/dist/chunk-EUZND3CB.js +0 -27
  128. package/dist/chunk-EVCZO745.js +0 -365
  129. package/dist/chunk-FGOEVHY3.js +0 -60
  130. package/dist/chunk-G3BOQPVO.js +0 -365
  131. package/dist/chunk-GCOK2LC3.js +0 -282
  132. package/dist/chunk-HGMJFBC7.js +0 -654
  133. package/dist/chunk-K5ZUMYVS.js +0 -89
  134. package/dist/chunk-KQPDEVVS.js +0 -398
  135. package/dist/chunk-L6JRBDNS.js +0 -60
  136. package/dist/chunk-LA6KQEDU.js +0 -712
  137. package/dist/chunk-MDVXJWFN.js +0 -304
  138. package/dist/chunk-MEZVEBPN.js +0 -2008
  139. package/dist/chunk-MK4ERFYL.js +0 -2249
  140. package/dist/chunk-MLKGABMK.js +0 -9
  141. package/dist/chunk-MQ5GOYPH.js +0 -2249
  142. package/dist/chunk-N6IZB6KJ.js +0 -567
  143. package/dist/chunk-NEKUBFPT.js +0 -60
  144. package/dist/chunk-NHUC2QWH.js +0 -282
  145. package/dist/chunk-NMRUZALC.js +0 -1097
  146. package/dist/chunk-NYVAC6P5.js +0 -37
  147. package/dist/chunk-OF7UZIVB.js +0 -725
  148. package/dist/chunk-P6W3STU4.js +0 -2249
  149. package/dist/chunk-PBHF5WKN.js +0 -616
  150. package/dist/chunk-PTQJDMRT.js +0 -146
  151. package/dist/chunk-PZEGYCF5.js +0 -61
  152. package/dist/chunk-QBMDLBU2.js +0 -975
  153. package/dist/chunk-RQGQSLQK.js +0 -725
  154. package/dist/chunk-SDLZDHKP.js +0 -107
  155. package/dist/chunk-TNQWPPE6.js +0 -37
  156. package/dist/chunk-UHNL42EF.js +0 -2730
  157. package/dist/chunk-UNXCEF6S.js +0 -21
  158. package/dist/chunk-V2XTI523.js +0 -347
  159. package/dist/chunk-VAU366PN.js +0 -2241
  160. package/dist/chunk-VMVDTCXB.js +0 -712
  161. package/dist/chunk-VRW3FULF.js +0 -725
  162. package/dist/chunk-WADYRCO2.js +0 -304
  163. package/dist/chunk-WILQZRO4.js +0 -282
  164. package/dist/chunk-WUHJISPP.js +0 -298
  165. package/dist/chunk-XYU6TZOW.js +0 -182
  166. package/dist/chunk-Y6GP4QGG.js +0 -276
  167. package/dist/chunk-YECR7UIA.js +0 -347
  168. package/dist/chunk-YUTWTI4B.js +0 -654
  169. package/dist/chunk-Z65KYU7I.js +0 -26
  170. package/dist/chunk-Z6POF5YC.js +0 -975
  171. package/dist/chunk-ZBJP6WFL.js +0 -482
  172. package/dist/contracts-DDrwxvJ-.d.cts +0 -245
  173. package/dist/contracts-DDrwxvJ-.d.ts +0 -245
  174. package/dist/contracts-DOrhwbke.d.cts +0 -245
  175. package/dist/contracts-DOrhwbke.d.ts +0 -245
  176. package/dist/customElement-BKQfbSZQ.d.cts +0 -262
  177. package/dist/customElement-BKQfbSZQ.d.ts +0 -262
  178. package/dist/customElement-yz8uyk-0.d.cts +0 -308
  179. package/dist/customElement-yz8uyk-0.d.ts +0 -308
  180. package/dist/introspect-Cb0zgpi2.d.cts +0 -477
  181. package/dist/introspect-Y2xNXGSf.d.ts +0 -477
  182. package/dist/plugin-Bek4RhJY.d.cts +0 -43
  183. package/dist/plugin-Bek4RhJY.d.ts +0 -43
  184. package/dist/ssr-3RXHP5ES.js +0 -38
  185. package/dist/ssr-6GIMY5MX.js +0 -38
  186. package/dist/ssr-BA6sxxUd.d.cts +0 -135
  187. package/dist/ssr-BA6sxxUd.d.ts +0 -135
  188. package/dist/ssr-WKUPVSSK.js +0 -36
  189. package/dist/tagFactory-Dl8QCLga.d.cts +0 -23
  190. package/dist/tagFactory-Dl8QCLga.d.ts +0 -23
@@ -1,262 +0,0 @@
1
- type ValidatorFn<T = unknown> = (value: T) => string | null;
2
- interface FieldConfig<T = unknown> {
3
- initial: T;
4
- validators?: ValidatorFn<T>[];
5
- }
6
- type FormConfig<T extends Record<string, unknown>> = {
7
- [K in keyof T]: FieldConfig<T[K]>;
8
- };
9
- interface FormField<T = unknown> {
10
- value: () => T;
11
- set: (v: T) => void;
12
- error: () => string | null;
13
- touched: () => boolean;
14
- touch: () => void;
15
- reset: () => void;
16
- }
17
- interface FormReturn<T extends Record<string, unknown>> {
18
- fields: {
19
- [K in keyof T]: FormField<T[K]>;
20
- };
21
- errors: () => Partial<Record<keyof T, string | null>>;
22
- isValid: () => boolean;
23
- isDirty: () => boolean;
24
- touched: () => Partial<Record<keyof T, boolean>>;
25
- values: () => T;
26
- handleSubmit: (onSubmit: (values: T) => void | Promise<void>) => (e?: Event) => void;
27
- reset: () => void;
28
- setError: (field: keyof T, message: string) => void;
29
- }
30
- declare function required(message?: string): ValidatorFn<unknown>;
31
- declare function minLength(min: number, message?: string): ValidatorFn<string>;
32
- declare function maxLength(max: number, message?: string): ValidatorFn<string>;
33
- declare function matchesPattern(regex: RegExp, message?: string): ValidatorFn<string>;
34
- declare function email(message?: string): ValidatorFn<string>;
35
- declare function min(minVal: number, message?: string): ValidatorFn<number>;
36
- declare function max(maxVal: number, message?: string): ValidatorFn<number>;
37
- declare function custom<T>(fn: (value: T) => boolean, message: string): ValidatorFn<T>;
38
- declare function form<T extends Record<string, unknown>>(config: FormConfig<T>): FormReturn<T>;
39
-
40
- interface VirtualListProps<T> {
41
- items: () => T[];
42
- itemHeight: number;
43
- containerHeight: number;
44
- overscan?: number;
45
- renderItem: (item: T, index: number) => HTMLElement;
46
- class?: string;
47
- }
48
- /**
49
- * VirtualList renders only visible items for efficient large-list rendering.
50
- */
51
- declare function VirtualList<T>(props: VirtualListProps<T>): HTMLElement;
52
-
53
- interface IntersectionResult {
54
- isIntersecting: () => boolean;
55
- intersectionRatio: () => number;
56
- observe: (element: HTMLElement) => void;
57
- unobserve: () => void;
58
- }
59
- /**
60
- * intersection provides reactive intersection observer state.
61
- */
62
- declare function intersection(options?: IntersectionObserverInit): IntersectionResult;
63
- /**
64
- * Lazy-load utility using IntersectionObserver.
65
- * Calls the loader function when element becomes visible.
66
- */
67
- declare function lazyLoad(element: HTMLElement, loader: () => void, options?: IntersectionObserverInit): () => void;
68
-
69
- interface MaskOptions {
70
- /** Pattern: 9 = digit, A = letter, * = any, other chars are literals */
71
- pattern: string;
72
- /** Placeholder character for unfilled positions */
73
- placeholder?: string;
74
- }
75
- /**
76
- * inputMask applies a mask to an input element.
77
- * Returns reactive value and ref binding.
78
- */
79
- declare function inputMask(options: MaskOptions): {
80
- value: () => string;
81
- rawValue: () => string;
82
- bind: (input: HTMLInputElement) => void;
83
- };
84
- /** Phone number mask: (999) 999-9999 */
85
- declare function phoneMask(): MaskOptions;
86
- /** Date mask: 99/99/9999 */
87
- declare function dateMask(): MaskOptions;
88
- /** Credit card mask: 9999 9999 9999 9999 */
89
- declare function creditCardMask(): MaskOptions;
90
- /** Time mask: 99:99 */
91
- declare function timeMask(): MaskOptions;
92
- /** SSN mask: 999-99-9999 */
93
- declare function ssnMask(): MaskOptions;
94
- /** ZIP code mask: 99999 */
95
- declare function zipMask(): MaskOptions;
96
-
97
- /**
98
- * aria applies reactive ARIA attributes to an element.
99
- */
100
- declare function aria(element: HTMLElement, attrs: Record<string, string | boolean | (() => string | boolean)>): void;
101
- /**
102
- * focus manages focus state for an element.
103
- */
104
- declare function focus(): {
105
- isFocused: () => boolean;
106
- focus: () => void;
107
- blur: () => void;
108
- bind: (element: HTMLElement) => void;
109
- };
110
- /**
111
- * FocusTrap traps focus within a container element.
112
- * Tab cycling stays inside the container.
113
- */
114
- declare function FocusTrap(nodes: HTMLElement, options?: {
115
- autoFocus?: boolean;
116
- restoreFocus?: boolean;
117
- }): HTMLElement;
118
- /**
119
- * hotkey registers a keyboard shortcut handler.
120
- * Returns a cleanup function.
121
- */
122
- declare function hotkey(key: string, handler: (e: KeyboardEvent) => void, options?: {
123
- ctrl?: boolean;
124
- shift?: boolean;
125
- alt?: boolean;
126
- meta?: boolean;
127
- global?: boolean;
128
- }): () => void;
129
- /**
130
- * announce creates a screen reader announcement using ARIA live regions.
131
- */
132
- declare function announce(message: string, priority?: "polite" | "assertive"): void;
133
-
134
- /**
135
- * scopedStyle creates component-scoped CSS by generating a unique scope ID
136
- * and prefixing all selectors.
137
- * Returns the scope attribute name and injects the CSS into the document.
138
- */
139
- declare function scopedStyle(css: string): {
140
- scope: string;
141
- attr: string;
142
- };
143
- /**
144
- * withScopedStyle wraps a component function to auto-apply scoped styles.
145
- * The component and all its children get the scope attribute.
146
- */
147
- declare function withScopedStyle<P>(css: string, component: (props: P) => HTMLElement): (props: P) => HTMLElement;
148
- /**
149
- * Removes a scoped style by its scope ID.
150
- */
151
- declare function removeScopedStyle(scopeId: string): void;
152
-
153
- /**
154
- * Bind multiple reactive attributes to an element.
155
- * Each attribute value can be a static value or a reactive getter.
156
- * Returns a single teardown function that stops all bindings.
157
- */
158
- declare function bindAttrs(el: HTMLElement, attrs: Record<string, string | number | boolean | (() => string | number | boolean)>): () => void;
159
- /**
160
- * Reactively toggle a boolean attribute (like disabled, readonly, hidden).
161
- * When the value is truthy the attribute is present (set to ""),
162
- * when falsy the attribute is removed entirely.
163
- * Returns a teardown function to stop reactive tracking.
164
- */
165
- declare function bindBoolAttr(el: HTMLElement, attr: string, getter: boolean | (() => boolean)): () => void;
166
- /**
167
- * Bind a data-* attribute reactively.
168
- * Shorthand for `bindAttribute(el, "data-<key>", getter)`.
169
- * Returns a teardown function to stop reactive tracking.
170
- */
171
- declare function bindData(el: HTMLElement, key: string, getter: string | (() => string)): () => void;
172
-
173
- /**
174
- * dialog provides reactive dialog state management with escape-to-close support.
175
- */
176
- declare function dialog(): {
177
- open: () => void;
178
- close: () => void;
179
- isOpen: () => boolean;
180
- toggle: () => void;
181
- };
182
-
183
- /**
184
- * Toast notification system with auto-dismiss and max toast limits.
185
- */
186
- interface Toast {
187
- id: string;
188
- message: string;
189
- type?: "info" | "success" | "error" | "warning";
190
- }
191
- declare function toast(options?: {
192
- duration?: number;
193
- maxToasts?: number;
194
- }): {
195
- toasts: () => Toast[];
196
- show: (message: string, type?: Toast["type"]) => string;
197
- dismiss: (id: string) => void;
198
- dismissAll: () => void;
199
- };
200
-
201
- /**
202
- * infiniteScroll combines IntersectionObserver with a data-fetching trigger
203
- * to implement infinite scroll behavior.
204
- */
205
- declare function infiniteScroll(options: {
206
- onLoadMore: () => Promise<void>;
207
- hasMore: () => boolean;
208
- threshold?: number;
209
- }): {
210
- sentinelRef: {
211
- current: HTMLElement | null;
212
- };
213
- loading: () => boolean;
214
- dispose: () => void;
215
- };
216
-
217
- /**
218
- * pagination provides reactive pagination state and controls.
219
- */
220
- declare function pagination(options: {
221
- totalItems: () => number;
222
- pageSize?: number;
223
- initialPage?: number;
224
- }): {
225
- page: () => number;
226
- pageSize: () => number;
227
- totalPages: () => number;
228
- next: () => void;
229
- prev: () => void;
230
- goTo: (page: number) => void;
231
- startIndex: () => number;
232
- endIndex: () => number;
233
- };
234
-
235
- /**
236
- * eventBus creates a typed publish/subscribe event system.
237
- * No reactive state needed -- pure event dispatching.
238
- */
239
- declare function eventBus<T extends Record<string, unknown>>(): {
240
- on: <K extends keyof T>(event: K, handler: (data: T[K]) => void) => () => void;
241
- emit: <K extends keyof T>(event: K, data: T[K]) => void;
242
- off: <K extends keyof T>(event: K, handler: (data: T[K]) => void) => void;
243
- clear: () => void;
244
- };
245
-
246
- interface CustomElementOptions {
247
- shadow?: boolean;
248
- mode?: "open" | "closed";
249
- styles?: string;
250
- observedAttributes?: string[];
251
- extends?: string;
252
- }
253
- /**
254
- * defineElement creates a Web Component wrapping a SibuJS component function.
255
- */
256
- declare function defineElement(name: string, component: (props: Record<string, unknown>, element: HTMLElement) => HTMLElement, options?: CustomElementOptions): void;
257
- /**
258
- * Creates an SVG element with proper namespace.
259
- */
260
- declare function svgElement(tag: string, props?: Record<string, unknown>, ...nodes: (SVGElement | string)[]): SVGElement;
261
-
262
- export { max as A, maxLength as B, type CustomElementOptions as C, min as D, minLength as E, type FieldConfig as F, pagination as G, phoneMask as H, type IntersectionResult as I, removeScopedStyle as J, required as K, scopedStyle as L, type MaskOptions as M, ssnMask as N, svgElement as O, timeMask as P, toast as Q, withScopedStyle as R, zipMask as S, type Toast as T, type ValidatorFn as V, FocusTrap as a, type FormConfig as b, type FormField as c, type FormReturn as d, VirtualList as e, type VirtualListProps as f, announce as g, aria as h, bindAttrs as i, bindBoolAttr as j, bindData as k, creditCardMask as l, custom as m, dateMask as n, defineElement as o, dialog as p, email as q, eventBus as r, focus as s, form as t, hotkey as u, infiniteScroll as v, inputMask as w, intersection as x, lazyLoad as y, matchesPattern as z };
@@ -1,262 +0,0 @@
1
- type ValidatorFn<T = unknown> = (value: T) => string | null;
2
- interface FieldConfig<T = unknown> {
3
- initial: T;
4
- validators?: ValidatorFn<T>[];
5
- }
6
- type FormConfig<T extends Record<string, unknown>> = {
7
- [K in keyof T]: FieldConfig<T[K]>;
8
- };
9
- interface FormField<T = unknown> {
10
- value: () => T;
11
- set: (v: T) => void;
12
- error: () => string | null;
13
- touched: () => boolean;
14
- touch: () => void;
15
- reset: () => void;
16
- }
17
- interface FormReturn<T extends Record<string, unknown>> {
18
- fields: {
19
- [K in keyof T]: FormField<T[K]>;
20
- };
21
- errors: () => Partial<Record<keyof T, string | null>>;
22
- isValid: () => boolean;
23
- isDirty: () => boolean;
24
- touched: () => Partial<Record<keyof T, boolean>>;
25
- values: () => T;
26
- handleSubmit: (onSubmit: (values: T) => void | Promise<void>) => (e?: Event) => void;
27
- reset: () => void;
28
- setError: (field: keyof T, message: string) => void;
29
- }
30
- declare function required(message?: string): ValidatorFn<unknown>;
31
- declare function minLength(min: number, message?: string): ValidatorFn<string>;
32
- declare function maxLength(max: number, message?: string): ValidatorFn<string>;
33
- declare function matchesPattern(regex: RegExp, message?: string): ValidatorFn<string>;
34
- declare function email(message?: string): ValidatorFn<string>;
35
- declare function min(minVal: number, message?: string): ValidatorFn<number>;
36
- declare function max(maxVal: number, message?: string): ValidatorFn<number>;
37
- declare function custom<T>(fn: (value: T) => boolean, message: string): ValidatorFn<T>;
38
- declare function form<T extends Record<string, unknown>>(config: FormConfig<T>): FormReturn<T>;
39
-
40
- interface VirtualListProps<T> {
41
- items: () => T[];
42
- itemHeight: number;
43
- containerHeight: number;
44
- overscan?: number;
45
- renderItem: (item: T, index: number) => HTMLElement;
46
- class?: string;
47
- }
48
- /**
49
- * VirtualList renders only visible items for efficient large-list rendering.
50
- */
51
- declare function VirtualList<T>(props: VirtualListProps<T>): HTMLElement;
52
-
53
- interface IntersectionResult {
54
- isIntersecting: () => boolean;
55
- intersectionRatio: () => number;
56
- observe: (element: HTMLElement) => void;
57
- unobserve: () => void;
58
- }
59
- /**
60
- * intersection provides reactive intersection observer state.
61
- */
62
- declare function intersection(options?: IntersectionObserverInit): IntersectionResult;
63
- /**
64
- * Lazy-load utility using IntersectionObserver.
65
- * Calls the loader function when element becomes visible.
66
- */
67
- declare function lazyLoad(element: HTMLElement, loader: () => void, options?: IntersectionObserverInit): () => void;
68
-
69
- interface MaskOptions {
70
- /** Pattern: 9 = digit, A = letter, * = any, other chars are literals */
71
- pattern: string;
72
- /** Placeholder character for unfilled positions */
73
- placeholder?: string;
74
- }
75
- /**
76
- * inputMask applies a mask to an input element.
77
- * Returns reactive value and ref binding.
78
- */
79
- declare function inputMask(options: MaskOptions): {
80
- value: () => string;
81
- rawValue: () => string;
82
- bind: (input: HTMLInputElement) => void;
83
- };
84
- /** Phone number mask: (999) 999-9999 */
85
- declare function phoneMask(): MaskOptions;
86
- /** Date mask: 99/99/9999 */
87
- declare function dateMask(): MaskOptions;
88
- /** Credit card mask: 9999 9999 9999 9999 */
89
- declare function creditCardMask(): MaskOptions;
90
- /** Time mask: 99:99 */
91
- declare function timeMask(): MaskOptions;
92
- /** SSN mask: 999-99-9999 */
93
- declare function ssnMask(): MaskOptions;
94
- /** ZIP code mask: 99999 */
95
- declare function zipMask(): MaskOptions;
96
-
97
- /**
98
- * aria applies reactive ARIA attributes to an element.
99
- */
100
- declare function aria(element: HTMLElement, attrs: Record<string, string | boolean | (() => string | boolean)>): void;
101
- /**
102
- * focus manages focus state for an element.
103
- */
104
- declare function focus(): {
105
- isFocused: () => boolean;
106
- focus: () => void;
107
- blur: () => void;
108
- bind: (element: HTMLElement) => void;
109
- };
110
- /**
111
- * FocusTrap traps focus within a container element.
112
- * Tab cycling stays inside the container.
113
- */
114
- declare function FocusTrap(nodes: HTMLElement, options?: {
115
- autoFocus?: boolean;
116
- restoreFocus?: boolean;
117
- }): HTMLElement;
118
- /**
119
- * hotkey registers a keyboard shortcut handler.
120
- * Returns a cleanup function.
121
- */
122
- declare function hotkey(key: string, handler: (e: KeyboardEvent) => void, options?: {
123
- ctrl?: boolean;
124
- shift?: boolean;
125
- alt?: boolean;
126
- meta?: boolean;
127
- global?: boolean;
128
- }): () => void;
129
- /**
130
- * announce creates a screen reader announcement using ARIA live regions.
131
- */
132
- declare function announce(message: string, priority?: "polite" | "assertive"): void;
133
-
134
- /**
135
- * scopedStyle creates component-scoped CSS by generating a unique scope ID
136
- * and prefixing all selectors.
137
- * Returns the scope attribute name and injects the CSS into the document.
138
- */
139
- declare function scopedStyle(css: string): {
140
- scope: string;
141
- attr: string;
142
- };
143
- /**
144
- * withScopedStyle wraps a component function to auto-apply scoped styles.
145
- * The component and all its children get the scope attribute.
146
- */
147
- declare function withScopedStyle<P>(css: string, component: (props: P) => HTMLElement): (props: P) => HTMLElement;
148
- /**
149
- * Removes a scoped style by its scope ID.
150
- */
151
- declare function removeScopedStyle(scopeId: string): void;
152
-
153
- /**
154
- * Bind multiple reactive attributes to an element.
155
- * Each attribute value can be a static value or a reactive getter.
156
- * Returns a single teardown function that stops all bindings.
157
- */
158
- declare function bindAttrs(el: HTMLElement, attrs: Record<string, string | number | boolean | (() => string | number | boolean)>): () => void;
159
- /**
160
- * Reactively toggle a boolean attribute (like disabled, readonly, hidden).
161
- * When the value is truthy the attribute is present (set to ""),
162
- * when falsy the attribute is removed entirely.
163
- * Returns a teardown function to stop reactive tracking.
164
- */
165
- declare function bindBoolAttr(el: HTMLElement, attr: string, getter: boolean | (() => boolean)): () => void;
166
- /**
167
- * Bind a data-* attribute reactively.
168
- * Shorthand for `bindAttribute(el, "data-<key>", getter)`.
169
- * Returns a teardown function to stop reactive tracking.
170
- */
171
- declare function bindData(el: HTMLElement, key: string, getter: string | (() => string)): () => void;
172
-
173
- /**
174
- * dialog provides reactive dialog state management with escape-to-close support.
175
- */
176
- declare function dialog(): {
177
- open: () => void;
178
- close: () => void;
179
- isOpen: () => boolean;
180
- toggle: () => void;
181
- };
182
-
183
- /**
184
- * Toast notification system with auto-dismiss and max toast limits.
185
- */
186
- interface Toast {
187
- id: string;
188
- message: string;
189
- type?: "info" | "success" | "error" | "warning";
190
- }
191
- declare function toast(options?: {
192
- duration?: number;
193
- maxToasts?: number;
194
- }): {
195
- toasts: () => Toast[];
196
- show: (message: string, type?: Toast["type"]) => string;
197
- dismiss: (id: string) => void;
198
- dismissAll: () => void;
199
- };
200
-
201
- /**
202
- * infiniteScroll combines IntersectionObserver with a data-fetching trigger
203
- * to implement infinite scroll behavior.
204
- */
205
- declare function infiniteScroll(options: {
206
- onLoadMore: () => Promise<void>;
207
- hasMore: () => boolean;
208
- threshold?: number;
209
- }): {
210
- sentinelRef: {
211
- current: HTMLElement | null;
212
- };
213
- loading: () => boolean;
214
- dispose: () => void;
215
- };
216
-
217
- /**
218
- * pagination provides reactive pagination state and controls.
219
- */
220
- declare function pagination(options: {
221
- totalItems: () => number;
222
- pageSize?: number;
223
- initialPage?: number;
224
- }): {
225
- page: () => number;
226
- pageSize: () => number;
227
- totalPages: () => number;
228
- next: () => void;
229
- prev: () => void;
230
- goTo: (page: number) => void;
231
- startIndex: () => number;
232
- endIndex: () => number;
233
- };
234
-
235
- /**
236
- * eventBus creates a typed publish/subscribe event system.
237
- * No reactive state needed -- pure event dispatching.
238
- */
239
- declare function eventBus<T extends Record<string, unknown>>(): {
240
- on: <K extends keyof T>(event: K, handler: (data: T[K]) => void) => () => void;
241
- emit: <K extends keyof T>(event: K, data: T[K]) => void;
242
- off: <K extends keyof T>(event: K, handler: (data: T[K]) => void) => void;
243
- clear: () => void;
244
- };
245
-
246
- interface CustomElementOptions {
247
- shadow?: boolean;
248
- mode?: "open" | "closed";
249
- styles?: string;
250
- observedAttributes?: string[];
251
- extends?: string;
252
- }
253
- /**
254
- * defineElement creates a Web Component wrapping a SibuJS component function.
255
- */
256
- declare function defineElement(name: string, component: (props: Record<string, unknown>, element: HTMLElement) => HTMLElement, options?: CustomElementOptions): void;
257
- /**
258
- * Creates an SVG element with proper namespace.
259
- */
260
- declare function svgElement(tag: string, props?: Record<string, unknown>, ...nodes: (SVGElement | string)[]): SVGElement;
261
-
262
- export { max as A, maxLength as B, type CustomElementOptions as C, min as D, minLength as E, type FieldConfig as F, pagination as G, phoneMask as H, type IntersectionResult as I, removeScopedStyle as J, required as K, scopedStyle as L, type MaskOptions as M, ssnMask as N, svgElement as O, timeMask as P, toast as Q, withScopedStyle as R, zipMask as S, type Toast as T, type ValidatorFn as V, FocusTrap as a, type FormConfig as b, type FormField as c, type FormReturn as d, VirtualList as e, type VirtualListProps as f, announce as g, aria as h, bindAttrs as i, bindBoolAttr as j, bindData as k, creditCardMask as l, custom as m, dateMask as n, defineElement as o, dialog as p, email as q, eventBus as r, focus as s, form as t, hotkey as u, infiniteScroll as v, inputMask as w, intersection as x, lazyLoad as y, matchesPattern as z };