sibujs 1.0.0-beta.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.
- package/LICENSE +21 -0
- package/README.md +1630 -0
- package/dist/browser.cjs +815 -0
- package/dist/browser.d.cts +174 -0
- package/dist/browser.d.ts +174 -0
- package/dist/browser.js +458 -0
- package/dist/build.cjs +4970 -0
- package/dist/build.d.cts +630 -0
- package/dist/build.d.ts +630 -0
- package/dist/build.js +2478 -0
- package/dist/cdn.global.js +115 -0
- package/dist/chunk-27QC4FPL.js +67 -0
- package/dist/chunk-2ABBWCGC.js +65 -0
- package/dist/chunk-2MUNQYZ7.js +26 -0
- package/dist/chunk-2PSPKNUI.js +1711 -0
- package/dist/chunk-35CDLDX5.js +1758 -0
- package/dist/chunk-36MU4CFV.js +41 -0
- package/dist/chunk-3FIQOFI6.js +182 -0
- package/dist/chunk-3GHNC2BN.js +28 -0
- package/dist/chunk-3HLWWEPU.js +909 -0
- package/dist/chunk-3IVI3J54.js +252 -0
- package/dist/chunk-3KZ72WNW.js +944 -0
- package/dist/chunk-4AU64SQV.js +182 -0
- package/dist/chunk-4MOK7HAR.js +84 -0
- package/dist/chunk-4QK6FBDH.js +1429 -0
- package/dist/chunk-566Z7HXB.js +737 -0
- package/dist/chunk-5CRBB7XP.js +358 -0
- package/dist/chunk-5G67D3IZ.js +168 -0
- package/dist/chunk-5NCPAWBE.js +99 -0
- package/dist/chunk-5O2RKXR3.js +1444 -0
- package/dist/chunk-6BTBDO6A.js +633 -0
- package/dist/chunk-6IWEHW57.js +43 -0
- package/dist/chunk-6JGMNCD6.js +282 -0
- package/dist/chunk-6QRLJNXR.js +1425 -0
- package/dist/chunk-7HM5UE5T.js +270 -0
- package/dist/chunk-7JOLTGUH.js +58 -0
- package/dist/chunk-7MCWJCQK.js +909 -0
- package/dist/chunk-7RIIFP3E.js +1758 -0
- package/dist/chunk-7UASYN3G.js +254 -0
- package/dist/chunk-7W2WYHDI.js +741 -0
- package/dist/chunk-7Y35RDSJ.js +872 -0
- package/dist/chunk-A65GFJBL.js +65 -0
- package/dist/chunk-AD6ZIEDK.js +67 -0
- package/dist/chunk-AK5Y72F3.js +1426 -0
- package/dist/chunk-APOMMWH4.js +282 -0
- package/dist/chunk-ARZVTWIQ.js +1750 -0
- package/dist/chunk-AWWBM2BI.js +664 -0
- package/dist/chunk-AX5VEQTY.js +58 -0
- package/dist/chunk-AYTXVOW3.js +1708 -0
- package/dist/chunk-BG4A246G.js +1746 -0
- package/dist/chunk-BNFJJA2L.js +1425 -0
- package/dist/chunk-BPKPBVU5.js +59 -0
- package/dist/chunk-BPKPPSXC.js +282 -0
- package/dist/chunk-BPWKKK7F.js +1711 -0
- package/dist/chunk-CCKX6YTC.js +1735 -0
- package/dist/chunk-CIF5Z3MP.js +58 -0
- package/dist/chunk-CSXYU7IO.js +457 -0
- package/dist/chunk-D6JD4FDC.js +26 -0
- package/dist/chunk-E7NGA7X2.js +59 -0
- package/dist/chunk-EEPPJKAE.js +443 -0
- package/dist/chunk-EJMYGAGQ.js +717 -0
- package/dist/chunk-EL6Z5MDY.js +55 -0
- package/dist/chunk-EP7VRLEB.js +41 -0
- package/dist/chunk-ETMEC6FH.js +99 -0
- package/dist/chunk-EZ2WHYVL.js +65 -0
- package/dist/chunk-EZRVMSZK.js +67 -0
- package/dist/chunk-F2TRGINX.js +254 -0
- package/dist/chunk-F5JCIH3Q.js +642 -0
- package/dist/chunk-FGK3JKMN.js +909 -0
- package/dist/chunk-FQWPKSTD.js +1437 -0
- package/dist/chunk-FWHVLMCI.js +26 -0
- package/dist/chunk-GBEYQRO2.js +303 -0
- package/dist/chunk-GBLES3NK.js +248 -0
- package/dist/chunk-GQVGUQW6.js +1436 -0
- package/dist/chunk-HCV2T76T.js +457 -0
- package/dist/chunk-HS7ZKVPR.js +182 -0
- package/dist/chunk-HXDVV7HZ.js +909 -0
- package/dist/chunk-IB23VMO3.js +1746 -0
- package/dist/chunk-IEMZ7RTT.js +99 -0
- package/dist/chunk-IPGRSN42.js +1750 -0
- package/dist/chunk-IVMOK2QN.js +1750 -0
- package/dist/chunk-JCLGQO7T.js +443 -0
- package/dist/chunk-JDXL7KDB.js +1436 -0
- package/dist/chunk-JIIFW636.js +270 -0
- package/dist/chunk-JWGEEH7H.js +944 -0
- package/dist/chunk-K2BESAG7.js +1688 -0
- package/dist/chunk-K2U5YGF4.js +877 -0
- package/dist/chunk-K45FQ4Y4.js +175 -0
- package/dist/chunk-K7BPE427.js +1432 -0
- package/dist/chunk-KL3266RS.js +26 -0
- package/dist/chunk-KNN4P7DZ.js +84 -0
- package/dist/chunk-KP2DZH5Q.js +254 -0
- package/dist/chunk-KZHAJSQR.js +1636 -0
- package/dist/chunk-LBKGHMQV.js +1750 -0
- package/dist/chunk-LBTEPL7A.js +1731 -0
- package/dist/chunk-LEBBPTDB.js +1444 -0
- package/dist/chunk-LLH63WVQ.js +98 -0
- package/dist/chunk-LWVR2C4G.js +1711 -0
- package/dist/chunk-M3MDTVV2.js +896 -0
- package/dist/chunk-M5GNLDEO.js +303 -0
- package/dist/chunk-MFHVGKET.js +267 -0
- package/dist/chunk-MGWSG3PM.js +358 -0
- package/dist/chunk-MJNB47HB.js +19 -0
- package/dist/chunk-MLKGABMK.js +9 -0
- package/dist/chunk-MQWTY3JY.js +944 -0
- package/dist/chunk-MZZOQHNI.js +642 -0
- package/dist/chunk-NIHWGZS4.js +1426 -0
- package/dist/chunk-NSVVHQK5.js +41 -0
- package/dist/chunk-NVI2WE7D.js +443 -0
- package/dist/chunk-O7QBO3PH.js +58 -0
- package/dist/chunk-OAUPQBO2.js +270 -0
- package/dist/chunk-OB2LMD7C.js +297 -0
- package/dist/chunk-OHEYBWQU.js +58 -0
- package/dist/chunk-OI6OXUHJ.js +443 -0
- package/dist/chunk-OX2VMRMV.js +633 -0
- package/dist/chunk-P4FYE5TX.js +866 -0
- package/dist/chunk-P5KFWM4H.js +98 -0
- package/dist/chunk-PUMLE7RJ.js +1711 -0
- package/dist/chunk-Q4MFANBF.js +282 -0
- package/dist/chunk-QLEKZMMU.js +282 -0
- package/dist/chunk-RGGNGVO3.js +98 -0
- package/dist/chunk-RKJDRVV6.js +443 -0
- package/dist/chunk-S5BHU353.js +43 -0
- package/dist/chunk-SHQUSFH7.js +1426 -0
- package/dist/chunk-SMB4DBMD.js +182 -0
- package/dist/chunk-SNYHQP3D.js +743 -0
- package/dist/chunk-T24L3TBF.js +1717 -0
- package/dist/chunk-TAQNSOKT.js +692 -0
- package/dist/chunk-TDNY4SUA.js +41 -0
- package/dist/chunk-TNNF56IQ.js +1750 -0
- package/dist/chunk-TR7E6LYX.js +457 -0
- package/dist/chunk-URWUFH45.js +98 -0
- package/dist/chunk-UUSIH3XH.js +1429 -0
- package/dist/chunk-UYFNXLKR.js +1436 -0
- package/dist/chunk-V6F7KUWD.js +270 -0
- package/dist/chunk-VCZLXRMR.js +254 -0
- package/dist/chunk-VDHXSSBT.js +1426 -0
- package/dist/chunk-VM4QMKVK.js +254 -0
- package/dist/chunk-VWGYKYL2.js +737 -0
- package/dist/chunk-VX2OFBJN.js +1426 -0
- package/dist/chunk-VXVIE6DG.js +84 -0
- package/dist/chunk-W4OH7HG4.js +40 -0
- package/dist/chunk-WBVJX4GZ.js +98 -0
- package/dist/chunk-WDU2ZV4I.js +1426 -0
- package/dist/chunk-X6VUCICU.js +457 -0
- package/dist/chunk-XAY7FM7Y.js +618 -0
- package/dist/chunk-XJZ5Z2CM.js +642 -0
- package/dist/chunk-XKVFQTJJ.js +254 -0
- package/dist/chunk-XRLFASCY.js +22 -0
- package/dist/chunk-XYU6TZOW.js +182 -0
- package/dist/chunk-Y745CBVB.js +944 -0
- package/dist/chunk-YLBJSXYY.js +944 -0
- package/dist/chunk-YQJIKVPZ.js +1429 -0
- package/dist/chunk-YRM2VCZF.js +457 -0
- package/dist/chunk-YS33KBVJ.js +944 -0
- package/dist/chunk-Z27DZPDG.js +41 -0
- package/dist/chunk-ZXQ5NAEN.js +32 -0
- package/dist/contracts-B552GopR.d.cts +245 -0
- package/dist/contracts-B552GopR.d.ts +245 -0
- package/dist/contracts-Bg1ECISC.d.cts +245 -0
- package/dist/contracts-Bg1ECISC.d.ts +245 -0
- package/dist/contracts-CMriKJ6P.d.cts +245 -0
- package/dist/contracts-CMriKJ6P.d.ts +245 -0
- package/dist/contracts-DOrhwbke.d.cts +245 -0
- package/dist/contracts-DOrhwbke.d.ts +245 -0
- package/dist/data.cjs +1373 -0
- package/dist/data.d.cts +434 -0
- package/dist/data.d.ts +434 -0
- package/dist/data.js +945 -0
- package/dist/devtools.cjs +1357 -0
- package/dist/devtools.d.cts +473 -0
- package/dist/devtools.d.ts +473 -0
- package/dist/devtools.js +1084 -0
- package/dist/ecosystem.cjs +1046 -0
- package/dist/ecosystem.d.cts +247 -0
- package/dist/ecosystem.d.ts +247 -0
- package/dist/ecosystem.js +369 -0
- package/dist/extras.cjs +8457 -0
- package/dist/extras.d.cts +2356 -0
- package/dist/extras.d.ts +2356 -0
- package/dist/extras.js +5152 -0
- package/dist/index.cjs +2648 -0
- package/dist/index.d.cts +869 -0
- package/dist/index.d.ts +869 -0
- package/dist/index.js +386 -0
- package/dist/motion.cjs +604 -0
- package/dist/motion.d.cts +146 -0
- package/dist/motion.d.ts +146 -0
- package/dist/motion.js +346 -0
- package/dist/patterns.cjs +815 -0
- package/dist/patterns.d.cts +163 -0
- package/dist/patterns.d.ts +163 -0
- package/dist/patterns.js +296 -0
- package/dist/performance.cjs +927 -0
- package/dist/performance.d.cts +416 -0
- package/dist/performance.d.ts +416 -0
- package/dist/performance.js +654 -0
- package/dist/plugins.cjs +2487 -0
- package/dist/plugins.d.cts +393 -0
- package/dist/plugins.d.ts +393 -0
- package/dist/plugins.js +1504 -0
- package/dist/signal-BnWpq6WB.d.cts +5 -0
- package/dist/signal-BnWpq6WB.d.ts +5 -0
- package/dist/src/components/ErrorBoundary.d.ts +15 -0
- package/dist/src/components/ErrorBoundary.js +119 -0
- package/dist/src/core/catch.d.ts +11 -0
- package/dist/src/core/catch.js +28 -0
- package/dist/src/core/each.d.ts +13 -0
- package/dist/src/core/each.js +68 -0
- package/dist/src/core/for.d.ts +12 -0
- package/dist/src/core/for.js +67 -0
- package/dist/src/core/html.d.ts +137 -0
- package/dist/src/core/html.js +155 -0
- package/dist/src/core/htmlIf.d.ts +11 -0
- package/dist/src/core/htmlIf.js +18 -0
- package/dist/src/core/lazy.d.ts +7 -0
- package/dist/src/core/lazy.js +16 -0
- package/dist/src/core/mount.d.ts +7 -0
- package/dist/src/core/mount.js +12 -0
- package/dist/src/core/slots.d.ts +3 -0
- package/dist/src/core/slots.js +3 -0
- package/dist/src/core/suspense.d.ts +10 -0
- package/dist/src/core/suspense.js +33 -0
- package/dist/src/core/tagFactory.d.ts +13 -0
- package/dist/src/core/tagFactory.js +86 -0
- package/dist/src/core/test.d.ts +11 -0
- package/dist/src/core/test.js +28 -0
- package/dist/src/core/types.d.ts +2 -0
- package/dist/src/core/types.js +1 -0
- package/dist/src/core/useComputed.d.ts +6 -0
- package/dist/src/core/useComputed.js +30 -0
- package/dist/src/core/useEffect.d.ts +6 -0
- package/dist/src/core/useEffect.js +23 -0
- package/dist/src/core/useState.d.ts +10 -0
- package/dist/src/core/useState.js +34 -0
- package/dist/src/core/useStore.d.ts +19 -0
- package/dist/src/core/useStore.js +53 -0
- package/dist/src/core/useWatch.d.ts +8 -0
- package/dist/src/core/useWatch.js +23 -0
- package/dist/src/plugins/i18n.d.ts +6 -0
- package/dist/src/plugins/i18n.js +16 -0
- package/dist/src/plugins/router.d.ts +188 -0
- package/dist/src/plugins/router.js +1178 -0
- package/dist/src/reactivity/bindAttribute.d.ts +5 -0
- package/dist/src/reactivity/bindAttribute.js +31 -0
- package/dist/src/reactivity/bindChildNode.d.ts +10 -0
- package/dist/src/reactivity/bindChildNode.js +46 -0
- package/dist/src/reactivity/bindTextNode.d.ts +10 -0
- package/dist/src/reactivity/bindTextNode.js +27 -0
- package/dist/src/reactivity/signal.d.ts +3 -0
- package/dist/src/reactivity/signal.js +1 -0
- package/dist/src/reactivity/track.d.ts +18 -0
- package/dist/src/reactivity/track.js +73 -0
- package/dist/src/reactivity/useComputed.d.ts +6 -0
- package/dist/src/reactivity/useComputed.js +30 -0
- package/dist/src/reactivity/useEffect.d.ts +6 -0
- package/dist/src/reactivity/useEffect.js +23 -0
- package/dist/src/reactivity/useState.d.ts +10 -0
- package/dist/src/reactivity/useState.js +34 -0
- package/dist/src/reactivity/useStore.d.ts +19 -0
- package/dist/src/reactivity/useStore.js +53 -0
- package/dist/src/reactivity/useWatch.d.ts +8 -0
- package/dist/src/reactivity/useWatch.js +23 -0
- package/dist/src/utils/sanitize.d.ts +1 -0
- package/dist/src/utils/sanitize.js +8 -0
- package/dist/ssr-27FOM46T.js +35 -0
- package/dist/ssr-GFUTTSJD.js +22 -0
- package/dist/ssr-K7DCR6BZ.js +35 -0
- package/dist/ssr-O6LFMRFP.js +35 -0
- package/dist/ssr-QZEVGMMK.js +35 -0
- package/dist/ssr-SGVBCAGC.js +35 -0
- package/dist/ssr-UB2IXCYX.js +35 -0
- package/dist/ssr-XBZQNV4O.js +22 -0
- package/dist/ssr-Y76FSXDU.js +35 -0
- package/dist/ssr-YQJ4AYBD.js +35 -0
- package/dist/ssr.cjs +1757 -0
- package/dist/ssr.d.cts +478 -0
- package/dist/ssr.d.ts +478 -0
- package/dist/ssr.js +743 -0
- package/dist/tagFactory-CZPO4RXF.d.cts +34 -0
- package/dist/tagFactory-CZPO4RXF.d.ts +34 -0
- package/dist/tagFactory-CgImPVMY.d.cts +22 -0
- package/dist/tagFactory-CgImPVMY.d.ts +22 -0
- package/dist/tagFactory-Cw1iv5if.d.cts +22 -0
- package/dist/tagFactory-Cw1iv5if.d.ts +22 -0
- package/dist/tagFactory-DeAXq9ef.d.cts +30 -0
- package/dist/tagFactory-DeAXq9ef.d.ts +30 -0
- package/dist/tagFactory-SkY0a7L1.d.cts +22 -0
- package/dist/tagFactory-SkY0a7L1.d.ts +22 -0
- package/dist/testing.cjs +1919 -0
- package/dist/testing.d.cts +491 -0
- package/dist/testing.d.ts +491 -0
- package/dist/testing.js +1862 -0
- package/dist/ui.cjs +1497 -0
- package/dist/ui.d.cts +264 -0
- package/dist/ui.d.ts +264 -0
- package/dist/ui.js +900 -0
- package/dist/widgets.cjs +919 -0
- package/dist/widgets.d.cts +165 -0
- package/dist/widgets.d.ts +165 -0
- package/dist/widgets.js +545 -0
- package/package.json +134 -0
|
@@ -0,0 +1,2356 @@
|
|
|
1
|
+
export { InfiniteQueryOptions, InfiniteQueryResult, LoaderRoute, MutationOptions, MutationResult, OfflineStore, OfflineStoreOptions, QueryOptions, QueryResult, Resource, ResourceOptions, RetryOptions, RouteLoaderFn, SyncAdapter, SyncChange, SyncResult, calculateDelay, clearQueryCache, createResource, createSyncAdapter, executeLoader, getQueryData, invalidateQueries, preloadRoute, sbDebounce, sbInfiniteQuery, sbLoaderData, sbMutation, sbOfflineStore, sbPrevious, sbQuery, sbSocket, sbStream, sbThrottle, setQueryData, withRetry } from './data.cjs';
|
|
2
|
+
export { sbBattery, sbClipboard, sbColorScheme, sbDraggable, sbDropZone, sbGeo, sbIdle, sbMedia, sbOnline, sbPermissions, sbResize, sbScroll, sbTitle } from './browser.cjs';
|
|
3
|
+
export { ComponentProps, GlobalStore, MachineConfig, MachineReturn, Middleware, OptimisticAction, PersistOptions, PropDef, PropSchema, RenderProp, Selector, TimeTravelReturn, Validator, assertType, compose, createComposable, createEffect, createGlobalStore, createGuard, createMemo, createSignal, createSlots, defineComponent, defineSlottedComponent, defineStrictComponent, sbMachine, sbOptimistic, sbOptimisticList, sbPersisted, sbTimeline, validateProps, validators, withBoundary, withDefaults, withProps, withWrapper } from './patterns.cjs';
|
|
4
|
+
export { AnimationPreset, PresetOptions, SlideDirection, TransitionGroup, TransitionGroupOptions, TransitionOptions, animate, bounceIn, bounceOut, fadeIn, fadeOut, flipIn, pulse, sbReducedMotion, sbSpring, sbTransition, sbViewTransition, scaleDown, scaleUp, sequence, shake, slideIn, slideOut, stagger } from './motion.cjs';
|
|
5
|
+
import { R as ReactiveSignal, T as TagProps } from './tagFactory-CZPO4RXF.cjs';
|
|
6
|
+
|
|
7
|
+
type ValidatorFn<T = unknown> = (value: T) => string | null;
|
|
8
|
+
interface FieldConfig<T = unknown> {
|
|
9
|
+
initial: T;
|
|
10
|
+
validators?: ValidatorFn<T>[];
|
|
11
|
+
}
|
|
12
|
+
type FormConfig<T extends Record<string, unknown>> = {
|
|
13
|
+
[K in keyof T]: FieldConfig<T[K]>;
|
|
14
|
+
};
|
|
15
|
+
interface FormField<T = unknown> {
|
|
16
|
+
value: () => T;
|
|
17
|
+
set: (v: T) => void;
|
|
18
|
+
error: () => string | null;
|
|
19
|
+
touched: () => boolean;
|
|
20
|
+
touch: () => void;
|
|
21
|
+
reset: () => void;
|
|
22
|
+
}
|
|
23
|
+
interface FormReturn<T extends Record<string, unknown>> {
|
|
24
|
+
fields: {
|
|
25
|
+
[K in keyof T]: FormField<T[K]>;
|
|
26
|
+
};
|
|
27
|
+
errors: () => Partial<Record<keyof T, string | null>>;
|
|
28
|
+
isValid: () => boolean;
|
|
29
|
+
isDirty: () => boolean;
|
|
30
|
+
touched: () => Partial<Record<keyof T, boolean>>;
|
|
31
|
+
values: () => T;
|
|
32
|
+
handleSubmit: (onSubmit: (values: T) => void | Promise<void>) => (e?: Event) => void;
|
|
33
|
+
reset: () => void;
|
|
34
|
+
setError: (field: keyof T, message: string) => void;
|
|
35
|
+
}
|
|
36
|
+
declare function required(message?: string): ValidatorFn<unknown>;
|
|
37
|
+
declare function minLength(min: number, message?: string): ValidatorFn<string>;
|
|
38
|
+
declare function maxLength(max: number, message?: string): ValidatorFn<string>;
|
|
39
|
+
declare function matchesPattern(regex: RegExp, message?: string): ValidatorFn<string>;
|
|
40
|
+
declare function email(message?: string): ValidatorFn<string>;
|
|
41
|
+
declare function min(minVal: number, message?: string): ValidatorFn<number>;
|
|
42
|
+
declare function max(maxVal: number, message?: string): ValidatorFn<number>;
|
|
43
|
+
declare function custom<T>(fn: (value: T) => boolean, message: string): ValidatorFn<T>;
|
|
44
|
+
declare function sbForm<T extends Record<string, unknown>>(config: FormConfig<T>): FormReturn<T>;
|
|
45
|
+
|
|
46
|
+
interface VirtualListProps<T> {
|
|
47
|
+
items: () => T[];
|
|
48
|
+
itemHeight: number;
|
|
49
|
+
containerHeight: number;
|
|
50
|
+
overscan?: number;
|
|
51
|
+
renderItem: (item: T, index: number) => HTMLElement;
|
|
52
|
+
class?: string;
|
|
53
|
+
}
|
|
54
|
+
/**
|
|
55
|
+
* VirtualList renders only visible items for efficient large-list rendering.
|
|
56
|
+
*/
|
|
57
|
+
declare function VirtualList<T>(props: VirtualListProps<T>): HTMLElement;
|
|
58
|
+
|
|
59
|
+
interface IntersectionResult {
|
|
60
|
+
isIntersecting: () => boolean;
|
|
61
|
+
intersectionRatio: () => number;
|
|
62
|
+
observe: (element: HTMLElement) => void;
|
|
63
|
+
unobserve: () => void;
|
|
64
|
+
}
|
|
65
|
+
/**
|
|
66
|
+
* sbIntersection provides reactive intersection observer state.
|
|
67
|
+
*/
|
|
68
|
+
declare function sbIntersection(options?: IntersectionObserverInit): IntersectionResult;
|
|
69
|
+
/**
|
|
70
|
+
* Lazy-load utility using IntersectionObserver.
|
|
71
|
+
* Calls the loader function when element becomes visible.
|
|
72
|
+
*/
|
|
73
|
+
declare function lazyLoad(element: HTMLElement, loader: () => void, options?: IntersectionObserverInit): () => void;
|
|
74
|
+
|
|
75
|
+
interface MaskOptions {
|
|
76
|
+
/** Pattern: 9 = digit, A = letter, * = any, other chars are literals */
|
|
77
|
+
pattern: string;
|
|
78
|
+
/** Placeholder character for unfilled positions */
|
|
79
|
+
placeholder?: string;
|
|
80
|
+
}
|
|
81
|
+
/**
|
|
82
|
+
* sbInputMask applies a mask to an input element.
|
|
83
|
+
* Returns reactive value and ref binding.
|
|
84
|
+
*/
|
|
85
|
+
declare function sbInputMask(options: MaskOptions): {
|
|
86
|
+
value: () => string;
|
|
87
|
+
rawValue: () => string;
|
|
88
|
+
bind: (input: HTMLInputElement) => void;
|
|
89
|
+
};
|
|
90
|
+
/** Phone number mask: (999) 999-9999 */
|
|
91
|
+
declare function phoneMask(): MaskOptions;
|
|
92
|
+
/** Date mask: 99/99/9999 */
|
|
93
|
+
declare function dateMask(): MaskOptions;
|
|
94
|
+
/** Credit card mask: 9999 9999 9999 9999 */
|
|
95
|
+
declare function creditCardMask(): MaskOptions;
|
|
96
|
+
/** Time mask: 99:99 */
|
|
97
|
+
declare function timeMask(): MaskOptions;
|
|
98
|
+
/** SSN mask: 999-99-9999 */
|
|
99
|
+
declare function ssnMask(): MaskOptions;
|
|
100
|
+
/** ZIP code mask: 99999 */
|
|
101
|
+
declare function zipMask(): MaskOptions;
|
|
102
|
+
|
|
103
|
+
/**
|
|
104
|
+
* sbAria applies reactive ARIA attributes to an element.
|
|
105
|
+
*/
|
|
106
|
+
declare function sbAria(element: HTMLElement, attrs: Record<string, string | boolean | (() => string | boolean)>): void;
|
|
107
|
+
/**
|
|
108
|
+
* sbFocus manages focus state for an element.
|
|
109
|
+
*/
|
|
110
|
+
declare function sbFocus(): {
|
|
111
|
+
isFocused: () => boolean;
|
|
112
|
+
focus: () => void;
|
|
113
|
+
blur: () => void;
|
|
114
|
+
bind: (element: HTMLElement) => void;
|
|
115
|
+
};
|
|
116
|
+
/**
|
|
117
|
+
* FocusTrap traps focus within a container element.
|
|
118
|
+
* Tab cycling stays inside the container.
|
|
119
|
+
*/
|
|
120
|
+
declare function FocusTrap(nodes: HTMLElement, options?: {
|
|
121
|
+
autoFocus?: boolean;
|
|
122
|
+
restoreFocus?: boolean;
|
|
123
|
+
}): HTMLElement;
|
|
124
|
+
/**
|
|
125
|
+
* sbHotkey registers a keyboard shortcut handler.
|
|
126
|
+
* Returns a cleanup function.
|
|
127
|
+
*/
|
|
128
|
+
declare function sbHotkey(key: string, handler: (e: KeyboardEvent) => void, options?: {
|
|
129
|
+
ctrl?: boolean;
|
|
130
|
+
shift?: boolean;
|
|
131
|
+
alt?: boolean;
|
|
132
|
+
meta?: boolean;
|
|
133
|
+
global?: boolean;
|
|
134
|
+
}): () => void;
|
|
135
|
+
/**
|
|
136
|
+
* announce creates a screen reader announcement using ARIA live regions.
|
|
137
|
+
*/
|
|
138
|
+
declare function announce(message: string, priority?: "polite" | "assertive"): void;
|
|
139
|
+
|
|
140
|
+
/**
|
|
141
|
+
* scopedStyle creates component-scoped CSS by generating a unique scope ID
|
|
142
|
+
* and prefixing all selectors.
|
|
143
|
+
* Returns the scope attribute name and injects the CSS into the document.
|
|
144
|
+
*/
|
|
145
|
+
declare function scopedStyle(css: string): {
|
|
146
|
+
scope: string;
|
|
147
|
+
attr: string;
|
|
148
|
+
};
|
|
149
|
+
/**
|
|
150
|
+
* withScopedStyle wraps a component function to auto-apply scoped styles.
|
|
151
|
+
* The component and all its children get the scope attribute.
|
|
152
|
+
*/
|
|
153
|
+
declare function withScopedStyle<P>(css: string, component: (props: P) => HTMLElement): (props: P) => HTMLElement;
|
|
154
|
+
/**
|
|
155
|
+
* Removes a scoped style by its scope ID.
|
|
156
|
+
*/
|
|
157
|
+
declare function removeScopedStyle(scopeId: string): void;
|
|
158
|
+
|
|
159
|
+
/**
|
|
160
|
+
* Bind multiple reactive attributes to an element.
|
|
161
|
+
* Each attribute value can be a static value or a reactive getter.
|
|
162
|
+
* Returns a single teardown function that stops all bindings.
|
|
163
|
+
*/
|
|
164
|
+
declare function bindAttrs(el: HTMLElement, attrs: Record<string, string | number | boolean | (() => string | number | boolean)>): () => void;
|
|
165
|
+
/**
|
|
166
|
+
* Reactively toggle a boolean attribute (like disabled, readonly, hidden).
|
|
167
|
+
* When the value is truthy the attribute is present (set to ""),
|
|
168
|
+
* when falsy the attribute is removed entirely.
|
|
169
|
+
* Returns a teardown function to stop reactive tracking.
|
|
170
|
+
*/
|
|
171
|
+
declare function bindBoolAttr(el: HTMLElement, attr: string, getter: boolean | (() => boolean)): () => void;
|
|
172
|
+
/**
|
|
173
|
+
* Bind a data-* attribute reactively.
|
|
174
|
+
* Shorthand for `bindAttribute(el, "data-<key>", getter)`.
|
|
175
|
+
* Returns a teardown function to stop reactive tracking.
|
|
176
|
+
*/
|
|
177
|
+
declare function bindData(el: HTMLElement, key: string, getter: string | (() => string)): () => void;
|
|
178
|
+
|
|
179
|
+
/**
|
|
180
|
+
* sbDialog provides reactive dialog state management with escape-to-close support.
|
|
181
|
+
*/
|
|
182
|
+
declare function sbDialog(): {
|
|
183
|
+
open: () => void;
|
|
184
|
+
close: () => void;
|
|
185
|
+
isOpen: () => boolean;
|
|
186
|
+
toggle: () => void;
|
|
187
|
+
};
|
|
188
|
+
|
|
189
|
+
/**
|
|
190
|
+
* Toast notification system with auto-dismiss and max toast limits.
|
|
191
|
+
*/
|
|
192
|
+
interface Toast {
|
|
193
|
+
id: string;
|
|
194
|
+
message: string;
|
|
195
|
+
type?: "info" | "success" | "error" | "warning";
|
|
196
|
+
}
|
|
197
|
+
declare function sbToast(options?: {
|
|
198
|
+
duration?: number;
|
|
199
|
+
maxToasts?: number;
|
|
200
|
+
}): {
|
|
201
|
+
toasts: () => Toast[];
|
|
202
|
+
show: (message: string, type?: Toast["type"]) => string;
|
|
203
|
+
dismiss: (id: string) => void;
|
|
204
|
+
dismissAll: () => void;
|
|
205
|
+
};
|
|
206
|
+
|
|
207
|
+
/**
|
|
208
|
+
* sbInfiniteScroll combines IntersectionObserver with a data-fetching trigger
|
|
209
|
+
* to implement infinite scroll behavior.
|
|
210
|
+
*/
|
|
211
|
+
declare function sbInfiniteScroll(options: {
|
|
212
|
+
onLoadMore: () => Promise<void>;
|
|
213
|
+
hasMore: () => boolean;
|
|
214
|
+
threshold?: number;
|
|
215
|
+
}): {
|
|
216
|
+
sentinelRef: {
|
|
217
|
+
current: HTMLElement | null;
|
|
218
|
+
};
|
|
219
|
+
loading: () => boolean;
|
|
220
|
+
dispose: () => void;
|
|
221
|
+
};
|
|
222
|
+
|
|
223
|
+
/**
|
|
224
|
+
* sbPagination provides reactive pagination state and controls.
|
|
225
|
+
*/
|
|
226
|
+
declare function sbPagination(options: {
|
|
227
|
+
totalItems: () => number;
|
|
228
|
+
pageSize?: number;
|
|
229
|
+
initialPage?: number;
|
|
230
|
+
}): {
|
|
231
|
+
page: () => number;
|
|
232
|
+
pageSize: () => number;
|
|
233
|
+
totalPages: () => number;
|
|
234
|
+
next: () => void;
|
|
235
|
+
prev: () => void;
|
|
236
|
+
goTo: (page: number) => void;
|
|
237
|
+
startIndex: () => number;
|
|
238
|
+
endIndex: () => number;
|
|
239
|
+
};
|
|
240
|
+
|
|
241
|
+
/**
|
|
242
|
+
* createEventBus creates a typed publish/subscribe event system.
|
|
243
|
+
* No reactive state needed -- pure event dispatching.
|
|
244
|
+
*/
|
|
245
|
+
declare function createEventBus<T extends Record<string, unknown>>(): {
|
|
246
|
+
on: <K extends keyof T>(event: K, handler: (data: T[K]) => void) => () => void;
|
|
247
|
+
emit: <K extends keyof T>(event: K, data: T[K]) => void;
|
|
248
|
+
off: <K extends keyof T>(event: K, handler: (data: T[K]) => void) => void;
|
|
249
|
+
clear: () => void;
|
|
250
|
+
};
|
|
251
|
+
|
|
252
|
+
declare const Priority: {
|
|
253
|
+
readonly IMMEDIATE: 0;
|
|
254
|
+
readonly USER_BLOCKING: 1;
|
|
255
|
+
readonly NORMAL: 2;
|
|
256
|
+
readonly LOW: 3;
|
|
257
|
+
readonly IDLE: 4;
|
|
258
|
+
};
|
|
259
|
+
type PriorityLevel = (typeof Priority)[keyof typeof Priority];
|
|
260
|
+
/**
|
|
261
|
+
* Schedule an update with a given priority level.
|
|
262
|
+
* Returns a cancel function.
|
|
263
|
+
*/
|
|
264
|
+
declare function scheduleUpdate(priority: PriorityLevel, callback: () => void): () => void;
|
|
265
|
+
/**
|
|
266
|
+
* Flush all pending tasks synchronously (useful for testing).
|
|
267
|
+
*/
|
|
268
|
+
declare function flushScheduler(): void;
|
|
269
|
+
/**
|
|
270
|
+
* Get the number of pending tasks.
|
|
271
|
+
*/
|
|
272
|
+
declare function pendingTasks(): number;
|
|
273
|
+
/**
|
|
274
|
+
* Yield control back to the main thread, allowing the browser to process
|
|
275
|
+
* user input, rendering, and other high-priority work.
|
|
276
|
+
*
|
|
277
|
+
* Uses `scheduler.yield()` when available (Chrome 115+),
|
|
278
|
+
* falls back to `setTimeout(0)`.
|
|
279
|
+
*
|
|
280
|
+
* @example
|
|
281
|
+
* ```ts
|
|
282
|
+
* for (let i = 0; i < items.length; i++) {
|
|
283
|
+
* renderItem(items[i]);
|
|
284
|
+
* if (i % 50 === 0) await yieldToMain();
|
|
285
|
+
* }
|
|
286
|
+
* ```
|
|
287
|
+
*/
|
|
288
|
+
declare function yieldToMain(): Promise<void>;
|
|
289
|
+
/**
|
|
290
|
+
* Process an array in chunks, yielding to the main thread between chunks.
|
|
291
|
+
* Prevents long-running loops from blocking the UI.
|
|
292
|
+
*
|
|
293
|
+
* @param items Array of items to process
|
|
294
|
+
* @param processor Callback invoked for each item
|
|
295
|
+
* @param chunkSize Number of items per chunk before yielding (default: 50)
|
|
296
|
+
*/
|
|
297
|
+
declare function processInChunks<T>(items: T[], processor: (item: T, index: number) => void, chunkSize?: number): Promise<void>;
|
|
298
|
+
|
|
299
|
+
/**
|
|
300
|
+
* Mark a state update as non-urgent.
|
|
301
|
+
* The callback is scheduled at NORMAL priority so it won't block
|
|
302
|
+
* high-priority work like user input handling.
|
|
303
|
+
*/
|
|
304
|
+
declare function startTransition(callback: () => void): void;
|
|
305
|
+
/**
|
|
306
|
+
* Returns a deferred getter for a reactive value.
|
|
307
|
+
* The deferred value mirrors the source but updates at LOW priority,
|
|
308
|
+
* allowing the UI to remain responsive while expensive derived state
|
|
309
|
+
* catches up.
|
|
310
|
+
*/
|
|
311
|
+
declare function sbDeferredValue<T>(getter: () => T): () => T;
|
|
312
|
+
/**
|
|
313
|
+
* Provides a `startTransition` wrapper paired with a reactive
|
|
314
|
+
* `isPending` flag that is `true` while the transition is in flight.
|
|
315
|
+
*
|
|
316
|
+
* Usage:
|
|
317
|
+
* const [isPending, startTransition] = sbTransitionState();
|
|
318
|
+
* startTransition(() => { setSomeState(newValue); });
|
|
319
|
+
* if (isPending()) { // show spinner }
|
|
320
|
+
*/
|
|
321
|
+
declare function sbTransitionState(): [isPending: () => boolean, startTransition: (cb: () => void) => void];
|
|
322
|
+
/**
|
|
323
|
+
* Reset the ID counter. Call at the start of each SSR request
|
|
324
|
+
* to ensure server and client produce matching IDs.
|
|
325
|
+
*/
|
|
326
|
+
declare function resetIdCounter(): void;
|
|
327
|
+
/**
|
|
328
|
+
* Set a custom prefix for generated IDs.
|
|
329
|
+
* Useful when multiple SibuJS apps coexist on the same page.
|
|
330
|
+
*/
|
|
331
|
+
declare function setIdPrefix(prefix: string): void;
|
|
332
|
+
/**
|
|
333
|
+
* Generate a unique, stable ID for use in accessibility attributes.
|
|
334
|
+
* SSR-compatible: call resetIdCounter() at the start of each SSR render
|
|
335
|
+
* to ensure server and client produce matching IDs.
|
|
336
|
+
*
|
|
337
|
+
* @param suffix Optional suffix appended to the generated ID
|
|
338
|
+
* @returns A unique ID string like "sibu-0", "sibu-1-label"
|
|
339
|
+
*
|
|
340
|
+
* @example
|
|
341
|
+
* ```ts
|
|
342
|
+
* const id = sbId();
|
|
343
|
+
* label({ htmlFor: id, nodes: "Name" });
|
|
344
|
+
* input({ id, type: "text" });
|
|
345
|
+
* ```
|
|
346
|
+
*/
|
|
347
|
+
declare function sbId(suffix?: string): string;
|
|
348
|
+
|
|
349
|
+
/**
|
|
350
|
+
* DOMPool manages a pool of reusable DOM elements to reduce GC pressure.
|
|
351
|
+
*/
|
|
352
|
+
declare class DOMPool {
|
|
353
|
+
private pools;
|
|
354
|
+
private maxSize;
|
|
355
|
+
constructor(maxSize?: number);
|
|
356
|
+
/**
|
|
357
|
+
* Get a recycled element or create a new one.
|
|
358
|
+
*/
|
|
359
|
+
acquire(tag: string): HTMLElement;
|
|
360
|
+
/**
|
|
361
|
+
* Return an element to the pool for reuse.
|
|
362
|
+
* Clears attributes, children, and event listeners.
|
|
363
|
+
*/
|
|
364
|
+
release(element: HTMLElement): void;
|
|
365
|
+
/**
|
|
366
|
+
* Clear all pools.
|
|
367
|
+
*/
|
|
368
|
+
clear(): void;
|
|
369
|
+
/**
|
|
370
|
+
* Get pool statistics.
|
|
371
|
+
*/
|
|
372
|
+
stats(): Record<string, number>;
|
|
373
|
+
}
|
|
374
|
+
/** Default global pool instance */
|
|
375
|
+
declare const domPool: DOMPool;
|
|
376
|
+
/**
|
|
377
|
+
* Preloads a resource (script, style, or generic fetch).
|
|
378
|
+
*/
|
|
379
|
+
declare function preloadResource(url: string, type?: "script" | "style" | "fetch" | "image"): void;
|
|
380
|
+
/**
|
|
381
|
+
* Prefetches a URL for future navigation.
|
|
382
|
+
*/
|
|
383
|
+
declare function prefetch(url: string): void;
|
|
384
|
+
/**
|
|
385
|
+
* Preloads an image and returns a promise that resolves when loaded.
|
|
386
|
+
*/
|
|
387
|
+
declare function preloadImage(src: string): Promise<HTMLImageElement>;
|
|
388
|
+
|
|
389
|
+
/**
|
|
390
|
+
* Bundle size optimization utilities for SibuJS.
|
|
391
|
+
* Provides markers and utilities for tree-shaking and dead code elimination.
|
|
392
|
+
*/
|
|
393
|
+
/**
|
|
394
|
+
* Mark a function as pure for tree-shaking.
|
|
395
|
+
* Bundlers (Rollup, esbuild, webpack) use this to eliminate unused code.
|
|
396
|
+
* Wraps a factory function with the PURE annotation.
|
|
397
|
+
*/
|
|
398
|
+
declare function pure<T>(fn: () => T): T;
|
|
399
|
+
/**
|
|
400
|
+
* Conditional import helper for tree-shaking.
|
|
401
|
+
* Only includes the module in the bundle if the condition is true.
|
|
402
|
+
* In production builds, dead branches are eliminated.
|
|
403
|
+
*/
|
|
404
|
+
declare function conditional<T>(condition: boolean, loader: () => T): T | undefined;
|
|
405
|
+
/**
|
|
406
|
+
* Feature flag helper for dead code elimination.
|
|
407
|
+
* Bundlers can statically replace these with true/false to eliminate dead code.
|
|
408
|
+
*/
|
|
409
|
+
declare const Features: {
|
|
410
|
+
readonly SSR: boolean;
|
|
411
|
+
readonly DEV: boolean;
|
|
412
|
+
readonly BROWSER: boolean;
|
|
413
|
+
};
|
|
414
|
+
/**
|
|
415
|
+
* Development-only code block. Eliminated in production builds
|
|
416
|
+
* when process.env.NODE_ENV is set to 'production'.
|
|
417
|
+
*/
|
|
418
|
+
declare function devOnly(fn: () => void): void;
|
|
419
|
+
/**
|
|
420
|
+
* Marks an export as having no side effects.
|
|
421
|
+
* Used by module-level sideEffects annotation.
|
|
422
|
+
*/
|
|
423
|
+
declare function noSideEffect<T extends (...args: unknown[]) => unknown>(fn: T): T;
|
|
424
|
+
|
|
425
|
+
/**
|
|
426
|
+
* Compiled optimizations for SibuJS.
|
|
427
|
+
* Provides markers and utilities for Svelte-style compile-time optimizations.
|
|
428
|
+
* These are hints for build tools and static analyzers.
|
|
429
|
+
*/
|
|
430
|
+
/**
|
|
431
|
+
* Marks a component's template as static (no reactive bindings).
|
|
432
|
+
* A build tool can pre-render this to a static HTML string and
|
|
433
|
+
* skip reactive setup entirely.
|
|
434
|
+
*/
|
|
435
|
+
declare function staticTemplate(html: string): HTMLElement;
|
|
436
|
+
/**
|
|
437
|
+
* Clone a static template for efficient repeated rendering.
|
|
438
|
+
* Uses template.content.cloneNode(true) which is faster than createElement.
|
|
439
|
+
*/
|
|
440
|
+
declare function cloneTemplate(template: HTMLTemplateElement): DocumentFragment;
|
|
441
|
+
/**
|
|
442
|
+
* Pre-compile a component factory.
|
|
443
|
+
* Caches the template and only applies dynamic bindings on each call.
|
|
444
|
+
*/
|
|
445
|
+
declare function precompile<Props>(templateHtml: string, hydrate: (el: HTMLElement, props: Props) => void): (props: Props) => HTMLElement;
|
|
446
|
+
/**
|
|
447
|
+
* Marker for static expressions that can be hoisted out of reactive scopes.
|
|
448
|
+
* A compiler pass would extract these to module scope.
|
|
449
|
+
*/
|
|
450
|
+
declare function hoistable<T>(value: T): T;
|
|
451
|
+
/**
|
|
452
|
+
* Marks a block of DOM creation as having a known, fixed structure.
|
|
453
|
+
* Enables block-level optimization where the compiler can generate
|
|
454
|
+
* optimized creation and patching code.
|
|
455
|
+
*/
|
|
456
|
+
declare function block(factory: () => HTMLElement): HTMLElement;
|
|
457
|
+
|
|
458
|
+
/**
|
|
459
|
+
* Schema definition for entity normalization.
|
|
460
|
+
* Describes the shape of an entity type and its relationships.
|
|
461
|
+
*/
|
|
462
|
+
interface NormalizedSchema {
|
|
463
|
+
/** Name of the entity type (e.g. "user", "post") */
|
|
464
|
+
name: string;
|
|
465
|
+
/** Key used as the unique identifier. Defaults to "id" */
|
|
466
|
+
idKey?: string;
|
|
467
|
+
/** Map of relation field names to their entity type names */
|
|
468
|
+
relations?: Record<string, string>;
|
|
469
|
+
}
|
|
470
|
+
/** Internal normalized state shape, following the ids + entities pattern */
|
|
471
|
+
interface NormalizedState<T> {
|
|
472
|
+
ids: string[];
|
|
473
|
+
entities: Record<string, T>;
|
|
474
|
+
}
|
|
475
|
+
/** Actions returned by createNormalizedStore */
|
|
476
|
+
interface NormalizedStoreActions<T> {
|
|
477
|
+
/** Add a single entity to the store */
|
|
478
|
+
add(entity: T): void;
|
|
479
|
+
/** Add multiple entities to the store */
|
|
480
|
+
addMany(entities: T[]): void;
|
|
481
|
+
/** Get an entity by its id, or undefined if not found */
|
|
482
|
+
get(id: string): T | undefined;
|
|
483
|
+
/** Get all entities as an array */
|
|
484
|
+
getAll(): T[];
|
|
485
|
+
/** Update an entity by merging a partial object */
|
|
486
|
+
update(id: string, partial: Partial<T>): void;
|
|
487
|
+
/** Remove an entity by id */
|
|
488
|
+
remove(id: string): void;
|
|
489
|
+
/** Query entities matching a predicate */
|
|
490
|
+
select(predicate: (entity: T) => boolean): T[];
|
|
491
|
+
/** Get the raw normalized state (reactive getter) */
|
|
492
|
+
getState(): NormalizedState<T>;
|
|
493
|
+
}
|
|
494
|
+
/**
|
|
495
|
+
* createNormalizedStore creates a reactive normalized store for a single
|
|
496
|
+
* entity type. Internal storage uses the `{ ids, entities }` pattern
|
|
497
|
+
* (like Redux Toolkit's entity adapter) backed by sbSignal for reactivity.
|
|
498
|
+
*
|
|
499
|
+
* @param schema Schema describing the entity type
|
|
500
|
+
* @returns Store actions for CRUD and query operations
|
|
501
|
+
*
|
|
502
|
+
* @example
|
|
503
|
+
* ```ts
|
|
504
|
+
* const users = createNormalizedStore<User>({ name: "user" });
|
|
505
|
+
*
|
|
506
|
+
* users.add({ id: "1", name: "Alice" });
|
|
507
|
+
* users.addMany([
|
|
508
|
+
* { id: "2", name: "Bob" },
|
|
509
|
+
* { id: "3", name: "Charlie" },
|
|
510
|
+
* ]);
|
|
511
|
+
*
|
|
512
|
+
* const alice = users.get("1"); // { id: "1", name: "Alice" }
|
|
513
|
+
* const all = users.getAll(); // [Alice, Bob, Charlie]
|
|
514
|
+
* users.update("1", { name: "Alicia" });
|
|
515
|
+
* users.remove("3");
|
|
516
|
+
* const bobs = users.select(u => u.name.startsWith("B"));
|
|
517
|
+
* ```
|
|
518
|
+
*/
|
|
519
|
+
declare function createNormalizedStore<T extends Record<string, unknown>>(schema: NormalizedSchema): NormalizedStoreActions<T>;
|
|
520
|
+
/** A map of entity type names to their flat entity tables */
|
|
521
|
+
type NormalizedEntities = Record<string, Record<string, unknown>>;
|
|
522
|
+
/** Result of normalizing nested data */
|
|
523
|
+
interface NormalizeResult {
|
|
524
|
+
/** The top-level id (or array of ids) of the normalized data */
|
|
525
|
+
result: string | string[];
|
|
526
|
+
/** All extracted entities keyed by type name, then by id */
|
|
527
|
+
entities: NormalizedEntities;
|
|
528
|
+
}
|
|
529
|
+
/**
|
|
530
|
+
* normalize takes a nested data object (or array) and flattens it into
|
|
531
|
+
* a normalized entities map according to the provided schema.
|
|
532
|
+
*
|
|
533
|
+
* Relations defined in the schema are recursively extracted and replaced
|
|
534
|
+
* with their id references.
|
|
535
|
+
*
|
|
536
|
+
* @param data The nested data to normalize (single object or array)
|
|
537
|
+
* @param schema The schema describing entity shape and relations
|
|
538
|
+
* @returns A NormalizeResult with the top-level id(s) and all entities
|
|
539
|
+
*
|
|
540
|
+
* @example
|
|
541
|
+
* ```ts
|
|
542
|
+
* const postSchema: NormalizedSchema = {
|
|
543
|
+
* name: "post",
|
|
544
|
+
* relations: { author: "user", comments: "comment" },
|
|
545
|
+
* };
|
|
546
|
+
*
|
|
547
|
+
* const data = {
|
|
548
|
+
* id: "p1",
|
|
549
|
+
* title: "Hello",
|
|
550
|
+
* author: { id: "u1", name: "Alice" },
|
|
551
|
+
* comments: [
|
|
552
|
+
* { id: "c1", text: "Great!" },
|
|
553
|
+
* { id: "c2", text: "Thanks" },
|
|
554
|
+
* ],
|
|
555
|
+
* };
|
|
556
|
+
*
|
|
557
|
+
* const { result, entities } = normalize(data, postSchema);
|
|
558
|
+
* // result === "p1"
|
|
559
|
+
* // entities.post["p1"] === { id: "p1", title: "Hello", author: "u1", comments: ["c1", "c2"] }
|
|
560
|
+
* // entities.user["u1"] === { id: "u1", name: "Alice" }
|
|
561
|
+
* // entities.comment["c1"] === { id: "c1", text: "Great!" }
|
|
562
|
+
* ```
|
|
563
|
+
*/
|
|
564
|
+
declare function normalize<T extends Record<string, unknown>>(data: T | T[], schema: NormalizedSchema): NormalizeResult;
|
|
565
|
+
/**
|
|
566
|
+
* denormalize reconstructs a nested object from a flat normalized entities
|
|
567
|
+
* map, resolving relation references back to their full objects.
|
|
568
|
+
*
|
|
569
|
+
* @param id The id of the root entity to reconstruct
|
|
570
|
+
* @param entities The flat entities map (from normalize or manual construction)
|
|
571
|
+
* @param schema The schema describing entity shape and relations
|
|
572
|
+
* @returns The fully reconstructed nested object, or undefined if not found
|
|
573
|
+
*
|
|
574
|
+
* @example
|
|
575
|
+
* ```ts
|
|
576
|
+
* const post = denormalize("p1", entities, postSchema);
|
|
577
|
+
* // post.author is the full user object, not just "u1"
|
|
578
|
+
* // post.comments is an array of full comment objects
|
|
579
|
+
* ```
|
|
580
|
+
*/
|
|
581
|
+
declare function denormalize<T extends Record<string, unknown>>(id: string, entities: NormalizedEntities, schema: NormalizedSchema): T | undefined;
|
|
582
|
+
|
|
583
|
+
/**
|
|
584
|
+
* Advanced runtime chunk loading with caching strategies for SibuJS.
|
|
585
|
+
* Provides configurable caching, preloading, retry logic, and loading orchestration.
|
|
586
|
+
*/
|
|
587
|
+
interface ChunkConfig {
|
|
588
|
+
/** Maximum number of cached chunks */
|
|
589
|
+
maxCacheSize?: number;
|
|
590
|
+
/** Cache TTL in milliseconds (0 = no expiry) */
|
|
591
|
+
cacheTTL?: number;
|
|
592
|
+
/** Number of retry attempts on failure */
|
|
593
|
+
retries?: number;
|
|
594
|
+
/** Delay between retries in ms */
|
|
595
|
+
retryDelay?: number;
|
|
596
|
+
/** Timeout for chunk loading in ms */
|
|
597
|
+
timeout?: number;
|
|
598
|
+
/** Called when a chunk starts loading */
|
|
599
|
+
onLoadStart?: (id: string) => void;
|
|
600
|
+
/** Called when a chunk finishes loading */
|
|
601
|
+
onLoadEnd?: (id: string) => void;
|
|
602
|
+
/** Called when a chunk fails to load */
|
|
603
|
+
onLoadError?: (id: string, error: Error) => void;
|
|
604
|
+
}
|
|
605
|
+
/**
|
|
606
|
+
* Central registry for managing dynamic chunks with caching and lifecycle callbacks.
|
|
607
|
+
*/
|
|
608
|
+
declare function createChunkRegistry(config?: ChunkConfig): {
|
|
609
|
+
/**
|
|
610
|
+
* Load a chunk by ID. Uses cache if available, otherwise loads via the provided loader.
|
|
611
|
+
*/
|
|
612
|
+
load<T>(id: string, loader: () => Promise<T>): Promise<T>;
|
|
613
|
+
/**
|
|
614
|
+
* Preload a chunk without blocking. Silently caches for later use.
|
|
615
|
+
*/
|
|
616
|
+
preload<T>(id: string, loader: () => Promise<T>): void;
|
|
617
|
+
/**
|
|
618
|
+
* Preload multiple chunks in parallel.
|
|
619
|
+
*/
|
|
620
|
+
preloadAll(entries: Array<{
|
|
621
|
+
id: string;
|
|
622
|
+
loader: () => Promise<unknown>;
|
|
623
|
+
}>): void;
|
|
624
|
+
/**
|
|
625
|
+
* Check if a chunk is cached and valid.
|
|
626
|
+
*/
|
|
627
|
+
has(id: string): boolean;
|
|
628
|
+
/**
|
|
629
|
+
* Get a cached chunk synchronously. Returns undefined if not cached.
|
|
630
|
+
*/
|
|
631
|
+
get<T>(id: string): T | undefined;
|
|
632
|
+
/**
|
|
633
|
+
* Invalidate a cached chunk.
|
|
634
|
+
*/
|
|
635
|
+
invalidate(id: string): void;
|
|
636
|
+
/**
|
|
637
|
+
* Clear all cached chunks.
|
|
638
|
+
*/
|
|
639
|
+
clear(): void;
|
|
640
|
+
/**
|
|
641
|
+
* Get cache statistics.
|
|
642
|
+
*/
|
|
643
|
+
stats(): {
|
|
644
|
+
size: number;
|
|
645
|
+
maxSize: number;
|
|
646
|
+
pending: number;
|
|
647
|
+
preloaded: number;
|
|
648
|
+
};
|
|
649
|
+
};
|
|
650
|
+
/**
|
|
651
|
+
* Create a lazy-loaded component that uses the chunk registry for caching.
|
|
652
|
+
* Provides automatic retry, timeout, and cache management.
|
|
653
|
+
*/
|
|
654
|
+
declare function lazyChunk(id: string, loader: () => Promise<{
|
|
655
|
+
default: () => HTMLElement;
|
|
656
|
+
} | (() => HTMLElement)>, registry: ReturnType<typeof createChunkRegistry>, fallback?: () => HTMLElement): () => HTMLElement;
|
|
657
|
+
/**
|
|
658
|
+
* Preload ES modules using link[rel=modulepreload].
|
|
659
|
+
* Improves loading performance by informing the browser early.
|
|
660
|
+
*/
|
|
661
|
+
declare function preloadModule(url: string): void;
|
|
662
|
+
/**
|
|
663
|
+
* Preload multiple modules.
|
|
664
|
+
*/
|
|
665
|
+
declare function preloadModules(urls: string[]): void;
|
|
666
|
+
|
|
667
|
+
interface HeadProps {
|
|
668
|
+
title?: string | (() => string);
|
|
669
|
+
meta?: Record<string, string | (() => string)>[];
|
|
670
|
+
link?: Record<string, string>[];
|
|
671
|
+
script?: Record<string, string>[];
|
|
672
|
+
base?: {
|
|
673
|
+
href?: string;
|
|
674
|
+
target?: string;
|
|
675
|
+
};
|
|
676
|
+
}
|
|
677
|
+
/**
|
|
678
|
+
* Head() manages document <head> tags reactively.
|
|
679
|
+
* Supports dynamic title, meta tags, link tags, and structured data.
|
|
680
|
+
* Cleans up managed elements when called again.
|
|
681
|
+
*/
|
|
682
|
+
declare function Head(props: HeadProps): Comment;
|
|
683
|
+
/**
|
|
684
|
+
* Sets structured data (JSON-LD) for SEO.
|
|
685
|
+
*/
|
|
686
|
+
declare function setStructuredData(data: Record<string, unknown>): void;
|
|
687
|
+
/**
|
|
688
|
+
* Sets the canonical URL for the page.
|
|
689
|
+
*/
|
|
690
|
+
declare function setCanonical(url: string): void;
|
|
691
|
+
|
|
692
|
+
/**
|
|
693
|
+
* Converts an HTMLElement tree to an HTML string for server-side rendering.
|
|
694
|
+
*/
|
|
695
|
+
declare function renderToString(element: HTMLElement | DocumentFragment | Node): string;
|
|
696
|
+
/**
|
|
697
|
+
* Hydrates a server-rendered DOM tree by attaching event listeners
|
|
698
|
+
* and activating reactive bindings.
|
|
699
|
+
*/
|
|
700
|
+
declare function hydrate(component: () => HTMLElement, container: HTMLElement): void;
|
|
701
|
+
/**
|
|
702
|
+
* Renders a component to a full HTML document string.
|
|
703
|
+
*
|
|
704
|
+
* **Security warning:** `headExtra` is injected as raw HTML into the document head.
|
|
705
|
+
* Never pass unsanitized user input to `headExtra` — it is intended for trusted,
|
|
706
|
+
* developer-controlled content only (e.g. inline styles, custom meta tags).
|
|
707
|
+
*/
|
|
708
|
+
declare function renderToDocument(component: () => HTMLElement, options?: {
|
|
709
|
+
title?: string;
|
|
710
|
+
meta?: Record<string, string>[];
|
|
711
|
+
links?: Record<string, string>[];
|
|
712
|
+
scripts?: string[];
|
|
713
|
+
bodyAttrs?: Record<string, string>;
|
|
714
|
+
/** Raw HTML injected into <head>. Must not contain unsanitized user input. */
|
|
715
|
+
headExtra?: string;
|
|
716
|
+
}): string;
|
|
717
|
+
/**
|
|
718
|
+
* Renders a component tree to an async iterable of HTML chunks.
|
|
719
|
+
* Enables progressive server-side rendering — the consumer can write
|
|
720
|
+
* each chunk to a response stream as it becomes available.
|
|
721
|
+
*/
|
|
722
|
+
declare function renderToStream(element: HTMLElement | DocumentFragment | Node): AsyncGenerator<string>;
|
|
723
|
+
/**
|
|
724
|
+
* Collects the full output of renderToStream into a string.
|
|
725
|
+
*/
|
|
726
|
+
declare function collectStream(stream: AsyncGenerator<string> | AsyncIterable<string>): Promise<string>;
|
|
727
|
+
/**
|
|
728
|
+
* Renders a component tree to a Web ReadableStream<string>.
|
|
729
|
+
* Compatible with Node 18+, Deno, and edge runtimes.
|
|
730
|
+
* Uses pull-based backpressure — chunks are produced on demand.
|
|
731
|
+
*/
|
|
732
|
+
declare function renderToReadableStream(element: HTMLElement | DocumentFragment | Node): ReadableStream<string>;
|
|
733
|
+
/**
|
|
734
|
+
* Marks an element as a hydration island. During partial hydration
|
|
735
|
+
* only elements marked with `data-sibu-island` will be hydrated.
|
|
736
|
+
*/
|
|
737
|
+
declare function island(id: string, component: () => HTMLElement): HTMLElement;
|
|
738
|
+
/**
|
|
739
|
+
* Hydrate only elements marked as islands (`data-sibu-island`).
|
|
740
|
+
* Non-island content keeps its server-rendered HTML untouched.
|
|
741
|
+
*/
|
|
742
|
+
declare function hydrateIslands(container: HTMLElement, islands: Record<string, () => HTMLElement>): void;
|
|
743
|
+
/**
|
|
744
|
+
* Progressively hydrate islands only when they enter the viewport.
|
|
745
|
+
* Uses IntersectionObserver to defer hydration of off-screen islands,
|
|
746
|
+
* reducing initial JavaScript execution cost.
|
|
747
|
+
*
|
|
748
|
+
* Returns a cleanup function that disconnects all observers.
|
|
749
|
+
*/
|
|
750
|
+
declare function hydrateProgressively(container: HTMLElement, islands: Record<string, () => HTMLElement>, options?: IntersectionObserverInit): () => void;
|
|
751
|
+
/**
|
|
752
|
+
* Reset SSR state between requests. Call at the start of each SSR render
|
|
753
|
+
* to prevent ID drift in long-lived server processes.
|
|
754
|
+
*/
|
|
755
|
+
declare function resetSSRState(): void;
|
|
756
|
+
/**
|
|
757
|
+
* Create a suspense boundary for SSR streaming.
|
|
758
|
+
* Renders fallback HTML inline and returns a promise for the resolved content.
|
|
759
|
+
*
|
|
760
|
+
* The returned element contains the fallback UI with a `data-sibu-suspense-id`
|
|
761
|
+
* marker. The promise resolves to `{ id, html }` once async content is ready.
|
|
762
|
+
*/
|
|
763
|
+
declare function ssrSuspense(props: {
|
|
764
|
+
fallback: () => HTMLElement;
|
|
765
|
+
content: () => Promise<HTMLElement>;
|
|
766
|
+
}): {
|
|
767
|
+
element: HTMLElement;
|
|
768
|
+
promise: Promise<{
|
|
769
|
+
id: string;
|
|
770
|
+
html: string;
|
|
771
|
+
}>;
|
|
772
|
+
};
|
|
773
|
+
/**
|
|
774
|
+
* Generate an inline script that swaps a suspense fallback with resolved content.
|
|
775
|
+
* The id is escaped for both JS string and HTML attribute contexts to prevent injection.
|
|
776
|
+
*/
|
|
777
|
+
declare function suspenseSwapScript(id: string): string;
|
|
778
|
+
/**
|
|
779
|
+
* Renders a component tree with suspense boundaries as a stream.
|
|
780
|
+
* Yields the main tree HTML first (including fallback content for suspended
|
|
781
|
+
* boundaries), then flushes resolved content with inline swap scripts.
|
|
782
|
+
*/
|
|
783
|
+
declare function renderToSuspenseStream(element: HTMLElement | DocumentFragment | Node, pendingBoundaries?: Promise<{
|
|
784
|
+
id: string;
|
|
785
|
+
html: string;
|
|
786
|
+
}>[]): AsyncGenerator<string>;
|
|
787
|
+
/**
|
|
788
|
+
* Serialize application state into an HTML script tag for SSR.
|
|
789
|
+
* The serialized data is embedded in the document and picked up
|
|
790
|
+
* on the client with `deserializeState()`.
|
|
791
|
+
*/
|
|
792
|
+
declare function serializeState(state: Record<string, unknown>): string;
|
|
793
|
+
/**
|
|
794
|
+
* Retrieve state that was embedded by `serializeState()` during SSR.
|
|
795
|
+
*/
|
|
796
|
+
declare function deserializeState<T = Record<string, unknown>>(): T | undefined;
|
|
797
|
+
|
|
798
|
+
interface CustomElementOptions {
|
|
799
|
+
shadow?: boolean;
|
|
800
|
+
mode?: "open" | "closed";
|
|
801
|
+
styles?: string;
|
|
802
|
+
observedAttributes?: string[];
|
|
803
|
+
extends?: string;
|
|
804
|
+
}
|
|
805
|
+
/**
|
|
806
|
+
* defineElement creates a Web Component wrapping a SibuJS component function.
|
|
807
|
+
*/
|
|
808
|
+
declare function defineElement(name: string, component: (props: Record<string, unknown>, element: HTMLElement) => HTMLElement, options?: CustomElementOptions): void;
|
|
809
|
+
/**
|
|
810
|
+
* Creates an SVG element with proper namespace.
|
|
811
|
+
*/
|
|
812
|
+
declare function svgElement(tag: string, props?: Record<string, unknown>, ...nodes: (SVGElement | string)[]): SVGElement;
|
|
813
|
+
|
|
814
|
+
interface UseWorkerReturn<TInput, TOutput> {
|
|
815
|
+
post(data: TInput): void;
|
|
816
|
+
result: () => TOutput | null;
|
|
817
|
+
error: () => Error | null;
|
|
818
|
+
loading: () => boolean;
|
|
819
|
+
terminate(): void;
|
|
820
|
+
}
|
|
821
|
+
/**
|
|
822
|
+
* sbWorker creates a Web Worker from an inline function and provides
|
|
823
|
+
* reactive state for its result, error, and loading status.
|
|
824
|
+
*
|
|
825
|
+
* The workerFn receives messages via the standard `onmessage` handler
|
|
826
|
+
* and should call `postMessage` to send results back. It is serialized
|
|
827
|
+
* into a Blob URL, so it must be self-contained (no closures).
|
|
828
|
+
*
|
|
829
|
+
* @param workerFn The function body to run inside the worker.
|
|
830
|
+
* It receives `self` as the worker global scope.
|
|
831
|
+
* @returns An object with post, result, error, loading, and terminate.
|
|
832
|
+
*/
|
|
833
|
+
declare function sbWorker<TInput = unknown, TOutput = unknown>(workerFn: (e: MessageEvent<TInput>) => void): UseWorkerReturn<TInput, TOutput>;
|
|
834
|
+
interface UseWorkerFnReturn<TArgs extends unknown[], TResult> {
|
|
835
|
+
run(...args: TArgs): Promise<TResult>;
|
|
836
|
+
loading: () => boolean;
|
|
837
|
+
terminate(): void;
|
|
838
|
+
}
|
|
839
|
+
/**
|
|
840
|
+
* sbWorkerFn wraps a pure function so it runs inside a Web Worker.
|
|
841
|
+
*
|
|
842
|
+
* The function must be self-contained -- it cannot reference variables
|
|
843
|
+
* from the outer scope. Arguments are serialized via postMessage.
|
|
844
|
+
*
|
|
845
|
+
* @param fn A pure function to execute in a worker thread.
|
|
846
|
+
* @returns An object with run, loading, and terminate.
|
|
847
|
+
*/
|
|
848
|
+
declare function sbWorkerFn<TArgs extends unknown[], TResult>(fn: (...args: TArgs) => TResult): UseWorkerFnReturn<TArgs, TResult>;
|
|
849
|
+
interface WorkerPool<TInput, TOutput> {
|
|
850
|
+
execute(data: TInput): Promise<TOutput>;
|
|
851
|
+
terminate(): void;
|
|
852
|
+
}
|
|
853
|
+
/**
|
|
854
|
+
* createWorkerPool creates a pool of workers for parallel task execution.
|
|
855
|
+
*
|
|
856
|
+
* Tasks are distributed across workers using round-robin scheduling.
|
|
857
|
+
* Each worker is created from the same inline function.
|
|
858
|
+
*
|
|
859
|
+
* @param workerFn The function body to run inside each worker.
|
|
860
|
+
* @param poolSize Number of workers in the pool (defaults to navigator.hardwareConcurrency or 4).
|
|
861
|
+
* @returns An object with execute and terminate.
|
|
862
|
+
*/
|
|
863
|
+
declare function createWorkerPool<TInput = unknown, TOutput = unknown>(workerFn: (e: MessageEvent<TInput>) => void, poolSize?: number): WorkerPool<TInput, TOutput>;
|
|
864
|
+
|
|
865
|
+
/**
|
|
866
|
+
* WebAssembly integration for SibuJS.
|
|
867
|
+
* Provides hooks and utilities to load, cache, and use WASM modules
|
|
868
|
+
* for performance-critical operations.
|
|
869
|
+
*/
|
|
870
|
+
interface WasmModuleState<T extends Record<string, unknown> = Record<string, unknown>> {
|
|
871
|
+
/** The instantiated WASM module exports, null until loaded */
|
|
872
|
+
instance: T | null;
|
|
873
|
+
/** Loading state */
|
|
874
|
+
loading: boolean;
|
|
875
|
+
/** Error if loading failed */
|
|
876
|
+
error: Error | null;
|
|
877
|
+
/** Whether the module has been loaded successfully */
|
|
878
|
+
ready: boolean;
|
|
879
|
+
}
|
|
880
|
+
interface WasmConfig {
|
|
881
|
+
/** Import object passed to WebAssembly.instantiate */
|
|
882
|
+
imports?: WebAssembly.Imports;
|
|
883
|
+
/** Cache key for module caching (defaults to URL) */
|
|
884
|
+
cacheKey?: string;
|
|
885
|
+
}
|
|
886
|
+
/**
|
|
887
|
+
* Hook to load and use a WebAssembly module reactively.
|
|
888
|
+
* Returns reactive state that updates when the module loads.
|
|
889
|
+
*
|
|
890
|
+
* @example
|
|
891
|
+
* ```ts
|
|
892
|
+
* const wasm = sbWasm<{ add: (a: number, b: number) => number }>('/math.wasm');
|
|
893
|
+
* // In reactive context:
|
|
894
|
+
* if (wasm.ready()) {
|
|
895
|
+
* const result = wasm.instance()!.add(1, 2);
|
|
896
|
+
* }
|
|
897
|
+
* ```
|
|
898
|
+
*/
|
|
899
|
+
declare function sbWasm<T extends Record<string, unknown> = Record<string, unknown>>(source: string | ArrayBuffer | Uint8Array, config?: WasmConfig): {
|
|
900
|
+
instance: () => T | null;
|
|
901
|
+
loading: () => boolean;
|
|
902
|
+
error: () => Error | null;
|
|
903
|
+
ready: () => boolean;
|
|
904
|
+
reload: () => Promise<void>;
|
|
905
|
+
};
|
|
906
|
+
/**
|
|
907
|
+
* Load and instantiate a WebAssembly module.
|
|
908
|
+
* Supports loading from URL, ArrayBuffer, or Uint8Array.
|
|
909
|
+
* Caches compiled modules for reuse.
|
|
910
|
+
*/
|
|
911
|
+
declare function loadWasmModule(source: string | ArrayBuffer | Uint8Array, imports?: WebAssembly.Imports, cacheKey?: string): Promise<WebAssembly.Instance>;
|
|
912
|
+
/**
|
|
913
|
+
* Preload and compile a WASM module without instantiating it.
|
|
914
|
+
* The compiled module is cached for instant instantiation later.
|
|
915
|
+
*/
|
|
916
|
+
declare function preloadWasm(url: string): Promise<void>;
|
|
917
|
+
/**
|
|
918
|
+
* Create a type-safe bridge to a WASM module with automatic memory management.
|
|
919
|
+
* Provides helpers for passing strings and arrays between JS and WASM.
|
|
920
|
+
*/
|
|
921
|
+
declare function createWasmBridge<T extends Record<string, unknown>>(instance: WebAssembly.Instance): {
|
|
922
|
+
exports: T;
|
|
923
|
+
memory: WebAssembly.Memory;
|
|
924
|
+
/** Allocate bytes in WASM memory (requires WASM to export malloc) */
|
|
925
|
+
alloc: (size: number) => number;
|
|
926
|
+
/** Free allocated memory (requires WASM to export free) */
|
|
927
|
+
free: (ptr: number) => void;
|
|
928
|
+
/** Write a string to WASM memory, returns pointer */
|
|
929
|
+
writeString: (str: string) => {
|
|
930
|
+
ptr: number;
|
|
931
|
+
len: number;
|
|
932
|
+
};
|
|
933
|
+
/** Read a string from WASM memory */
|
|
934
|
+
readString: (ptr: number, len: number) => string;
|
|
935
|
+
/** Write a typed array to WASM memory, returns pointer */
|
|
936
|
+
writeArray: (arr: ArrayLike<number>) => {
|
|
937
|
+
ptr: number;
|
|
938
|
+
len: number;
|
|
939
|
+
};
|
|
940
|
+
/** Read a Float64Array from WASM memory */
|
|
941
|
+
readF64Array: (ptr: number, len: number) => Float64Array;
|
|
942
|
+
};
|
|
943
|
+
/**
|
|
944
|
+
* Clear all cached WASM modules and instances.
|
|
945
|
+
*/
|
|
946
|
+
declare function clearWasmCache(): void;
|
|
947
|
+
/**
|
|
948
|
+
* Check if a WASM module is cached.
|
|
949
|
+
*/
|
|
950
|
+
declare function isWasmCached(key: string): boolean;
|
|
951
|
+
|
|
952
|
+
interface MicroAppConfig {
|
|
953
|
+
/** Unique name for this micro-frontend instance */
|
|
954
|
+
name: string;
|
|
955
|
+
/** Optional host element to mount into. Defaults to a new div. */
|
|
956
|
+
container?: HTMLElement;
|
|
957
|
+
/** If true, use Shadow DOM for style isolation */
|
|
958
|
+
shadow?: boolean;
|
|
959
|
+
}
|
|
960
|
+
interface MicroApp {
|
|
961
|
+
/** Mount a component into this micro-app container */
|
|
962
|
+
mount(component: () => HTMLElement): void;
|
|
963
|
+
/** Unmount the currently rendered component and clean up */
|
|
964
|
+
unmount(): void;
|
|
965
|
+
/** The outer host element */
|
|
966
|
+
element: HTMLElement;
|
|
967
|
+
}
|
|
968
|
+
interface SharedScope<T extends Record<string, unknown>> {
|
|
969
|
+
/** Get the current value for a key */
|
|
970
|
+
get<K extends keyof T>(key: K): T[K];
|
|
971
|
+
/** Set a value for a key, notifying all subscribers */
|
|
972
|
+
set<K extends keyof T>(key: K, value: T[K]): void;
|
|
973
|
+
/** Subscribe to changes on a specific key. Returns an unsubscribe function. */
|
|
974
|
+
subscribe<K extends keyof T>(key: K, callback: (value: T[K]) => void): () => void;
|
|
975
|
+
}
|
|
976
|
+
/**
|
|
977
|
+
* Creates an isolated micro-frontend container.
|
|
978
|
+
*
|
|
979
|
+
* Each micro-app gets its own DOM boundary. When `shadow: true` is set the
|
|
980
|
+
* component renders inside a Shadow DOM root so its styles are fully isolated
|
|
981
|
+
* from the host page.
|
|
982
|
+
*
|
|
983
|
+
* @example
|
|
984
|
+
* ```ts
|
|
985
|
+
* const app = createMicroApp({ name: "widget", shadow: true });
|
|
986
|
+
* document.body.appendChild(app.element);
|
|
987
|
+
*
|
|
988
|
+
* app.mount(() => div({ nodes: "Hello from micro-app!" }));
|
|
989
|
+
*
|
|
990
|
+
* // Later, tear it down:
|
|
991
|
+
* app.unmount();
|
|
992
|
+
* ```
|
|
993
|
+
*/
|
|
994
|
+
declare function createMicroApp(config: MicroAppConfig): MicroApp;
|
|
995
|
+
/**
|
|
996
|
+
* Dynamically load a remote ES module by URL.
|
|
997
|
+
*
|
|
998
|
+
* Modules are cached by URL so repeated calls with the same URL return the
|
|
999
|
+
* same promise without issuing another network request.
|
|
1000
|
+
*
|
|
1001
|
+
* @example
|
|
1002
|
+
* ```ts
|
|
1003
|
+
* const charts = await loadRemoteModule("https://cdn.example.com/charts.js");
|
|
1004
|
+
* const el = charts.BarChart({ data: [1, 2, 3] });
|
|
1005
|
+
* ```
|
|
1006
|
+
*/
|
|
1007
|
+
declare function loadRemoteModule(url: string): Promise<unknown>;
|
|
1008
|
+
type Component = () => HTMLElement;
|
|
1009
|
+
type RemoteLoader = () => Promise<{
|
|
1010
|
+
default: Component;
|
|
1011
|
+
}>;
|
|
1012
|
+
/**
|
|
1013
|
+
* Register a remote component that loads on demand.
|
|
1014
|
+
*
|
|
1015
|
+
* Returns a component factory function. On first call it shows a loading
|
|
1016
|
+
* placeholder, fetches the remote module, then swaps in the real component.
|
|
1017
|
+
* Subsequent calls render instantly from the cached module.
|
|
1018
|
+
*
|
|
1019
|
+
* @example
|
|
1020
|
+
* ```ts
|
|
1021
|
+
* const RemoteHeader = defineRemoteComponent(
|
|
1022
|
+
* "remote-header",
|
|
1023
|
+
* () => loadRemoteModule("https://cdn.example.com/header.js")
|
|
1024
|
+
* );
|
|
1025
|
+
*
|
|
1026
|
+
* // Use it like any local component
|
|
1027
|
+
* document.body.appendChild(RemoteHeader());
|
|
1028
|
+
* ```
|
|
1029
|
+
*/
|
|
1030
|
+
declare function defineRemoteComponent(name: string, loader: RemoteLoader): Component;
|
|
1031
|
+
/**
|
|
1032
|
+
* Create a shared state scope that enables communication between independent
|
|
1033
|
+
* micro-frontend instances.
|
|
1034
|
+
*
|
|
1035
|
+
* Each key in the scope can be read, written, and subscribed to independently.
|
|
1036
|
+
* This is intentionally kept simpler than a full global store so micro-apps
|
|
1037
|
+
* can share data with minimal coupling.
|
|
1038
|
+
*
|
|
1039
|
+
* @example
|
|
1040
|
+
* ```ts
|
|
1041
|
+
* const shared = createSharedScope({ user: null, theme: "light" });
|
|
1042
|
+
*
|
|
1043
|
+
* // Micro-app A sets a value
|
|
1044
|
+
* shared.set("user", { name: "Alice" });
|
|
1045
|
+
*
|
|
1046
|
+
* // Micro-app B subscribes to changes
|
|
1047
|
+
* const unsub = shared.subscribe("user", (user) => {
|
|
1048
|
+
* console.log("User changed:", user);
|
|
1049
|
+
* });
|
|
1050
|
+
*
|
|
1051
|
+
* // Later
|
|
1052
|
+
* unsub();
|
|
1053
|
+
* ```
|
|
1054
|
+
*/
|
|
1055
|
+
declare function createSharedScope<T extends Record<string, unknown>>(initialState: T): SharedScope<T>;
|
|
1056
|
+
|
|
1057
|
+
interface ServiceWorkerState {
|
|
1058
|
+
registration: () => ServiceWorkerRegistration | null;
|
|
1059
|
+
isReady: () => boolean;
|
|
1060
|
+
isUpdateAvailable: () => boolean;
|
|
1061
|
+
error: () => Error | null;
|
|
1062
|
+
update: () => Promise<void>;
|
|
1063
|
+
unregister: () => Promise<boolean>;
|
|
1064
|
+
}
|
|
1065
|
+
/**
|
|
1066
|
+
* sbServiceWorker registers and manages a service worker.
|
|
1067
|
+
*/
|
|
1068
|
+
declare function sbServiceWorker(scriptUrl: string, options?: RegistrationOptions): ServiceWorkerState;
|
|
1069
|
+
|
|
1070
|
+
interface SSGOptions {
|
|
1071
|
+
routes: string[];
|
|
1072
|
+
renderFn: (path: string) => Promise<string>;
|
|
1073
|
+
outDir?: string;
|
|
1074
|
+
}
|
|
1075
|
+
interface SSGResult {
|
|
1076
|
+
pages: Array<{
|
|
1077
|
+
path: string;
|
|
1078
|
+
html: string;
|
|
1079
|
+
}>;
|
|
1080
|
+
errors: Array<{
|
|
1081
|
+
path: string;
|
|
1082
|
+
error: Error;
|
|
1083
|
+
}>;
|
|
1084
|
+
}
|
|
1085
|
+
/**
|
|
1086
|
+
* Generate a static site by iterating over routes and collecting rendered HTML.
|
|
1087
|
+
* This is a pure async function — it does NOT write files, only returns results.
|
|
1088
|
+
*/
|
|
1089
|
+
declare function generateStaticSite(options: SSGOptions): Promise<SSGResult>;
|
|
1090
|
+
|
|
1091
|
+
interface ISROptions<T> {
|
|
1092
|
+
revalidateAfter: number;
|
|
1093
|
+
fetcher: () => Promise<T>;
|
|
1094
|
+
initialData?: T;
|
|
1095
|
+
}
|
|
1096
|
+
/**
|
|
1097
|
+
* Creates an Incremental Static Regeneration (ISR) resource.
|
|
1098
|
+
* Data is fetched initially, then automatically revalidated after the
|
|
1099
|
+
* specified interval using setInterval.
|
|
1100
|
+
*/
|
|
1101
|
+
declare function createISR<T>(options: ISROptions<T>): {
|
|
1102
|
+
data: () => T | undefined;
|
|
1103
|
+
isStale: () => boolean;
|
|
1104
|
+
revalidate: () => Promise<void>;
|
|
1105
|
+
dispose: () => void;
|
|
1106
|
+
};
|
|
1107
|
+
|
|
1108
|
+
type ActionFn<T = unknown> = (data: FormData | Record<string, unknown>) => Promise<T>;
|
|
1109
|
+
interface ActionResult<T> {
|
|
1110
|
+
data: () => T | undefined;
|
|
1111
|
+
error: () => Error | undefined;
|
|
1112
|
+
loading: () => boolean;
|
|
1113
|
+
submit: (data: FormData | Record<string, unknown>) => Promise<T>;
|
|
1114
|
+
}
|
|
1115
|
+
/**
|
|
1116
|
+
* Creates a managed action for handling POST/PUT/DELETE-style mutations.
|
|
1117
|
+
* Provides reactive loading, error, and data state via sbSignal.
|
|
1118
|
+
* State updates are batched to avoid redundant notifications.
|
|
1119
|
+
*/
|
|
1120
|
+
declare function createAction<T>(actionFn: ActionFn<T>): ActionResult<T>;
|
|
1121
|
+
|
|
1122
|
+
interface ScrollRestorationOptions {
|
|
1123
|
+
mode?: "auto" | "manual";
|
|
1124
|
+
}
|
|
1125
|
+
/**
|
|
1126
|
+
* Manages scroll position saving and restoration keyed by route/key.
|
|
1127
|
+
* Uses a Map to store positions and window.scrollTo to restore them.
|
|
1128
|
+
*/
|
|
1129
|
+
declare function sbScrollRestoration(options?: ScrollRestorationOptions): {
|
|
1130
|
+
save: (key: string) => void;
|
|
1131
|
+
restore: (key: string) => void;
|
|
1132
|
+
getPosition: (key: string) => {
|
|
1133
|
+
x: number;
|
|
1134
|
+
y: number;
|
|
1135
|
+
} | undefined;
|
|
1136
|
+
dispose: () => void;
|
|
1137
|
+
};
|
|
1138
|
+
|
|
1139
|
+
type MiddlewareFn = (context: {
|
|
1140
|
+
path: string;
|
|
1141
|
+
params: Record<string, string>;
|
|
1142
|
+
}, next: () => void | Promise<void>) => void | Promise<void>;
|
|
1143
|
+
/**
|
|
1144
|
+
* Composes multiple middleware functions into a single middleware.
|
|
1145
|
+
* Each middleware must call next() to proceed to the next one.
|
|
1146
|
+
*/
|
|
1147
|
+
declare function composeMiddleware(...fns: MiddlewareFn[]): MiddlewareFn;
|
|
1148
|
+
/**
|
|
1149
|
+
* Creates a middleware chain with a builder API.
|
|
1150
|
+
* Use `use()` to add middleware, and `run()` to execute the chain.
|
|
1151
|
+
*/
|
|
1152
|
+
declare function createMiddlewareChain(): {
|
|
1153
|
+
use: (fn: MiddlewareFn) => void;
|
|
1154
|
+
run: (context: {
|
|
1155
|
+
path: string;
|
|
1156
|
+
params: Record<string, string>;
|
|
1157
|
+
}) => Promise<void>;
|
|
1158
|
+
};
|
|
1159
|
+
|
|
1160
|
+
interface PluginContext {
|
|
1161
|
+
/** Register a global hook */
|
|
1162
|
+
onInit: (callback: () => void) => void;
|
|
1163
|
+
onMount: (callback: (element: HTMLElement) => void) => void;
|
|
1164
|
+
onUnmount: (callback: (element: HTMLElement) => void) => void;
|
|
1165
|
+
onError: (callback: (error: Error) => void) => void;
|
|
1166
|
+
/** Provide a value globally */
|
|
1167
|
+
provide: (key: string, value: unknown) => void;
|
|
1168
|
+
}
|
|
1169
|
+
interface SibuPlugin {
|
|
1170
|
+
name: string;
|
|
1171
|
+
install: (ctx: PluginContext, options?: unknown) => void;
|
|
1172
|
+
}
|
|
1173
|
+
/**
|
|
1174
|
+
* Creates a plugin definition.
|
|
1175
|
+
*/
|
|
1176
|
+
declare function createPlugin(name: string, install: (ctx: PluginContext, options?: unknown) => void): SibuPlugin;
|
|
1177
|
+
/**
|
|
1178
|
+
* Installs a plugin into the application.
|
|
1179
|
+
*/
|
|
1180
|
+
declare function sbPlugin(plugin: SibuPlugin, options?: unknown): void;
|
|
1181
|
+
/**
|
|
1182
|
+
* Retrieve a value provided by a plugin.
|
|
1183
|
+
*/
|
|
1184
|
+
declare function inject<T = unknown>(key: string, defaultValue?: T): T;
|
|
1185
|
+
/**
|
|
1186
|
+
* Trigger mount hooks for an element.
|
|
1187
|
+
*/
|
|
1188
|
+
declare function triggerPluginMount(element: HTMLElement): void;
|
|
1189
|
+
/**
|
|
1190
|
+
* Trigger unmount hooks for an element.
|
|
1191
|
+
*/
|
|
1192
|
+
declare function triggerPluginUnmount(element: HTMLElement): void;
|
|
1193
|
+
/**
|
|
1194
|
+
* Trigger error hooks.
|
|
1195
|
+
*/
|
|
1196
|
+
declare function triggerPluginError(error: Error): void;
|
|
1197
|
+
/**
|
|
1198
|
+
* Reset all plugins (useful for testing).
|
|
1199
|
+
*/
|
|
1200
|
+
declare function resetPlugins(): void;
|
|
1201
|
+
|
|
1202
|
+
/**
|
|
1203
|
+
* Modular distribution utilities for SibuJS.
|
|
1204
|
+
* Enables granular imports and micro-package consumption patterns.
|
|
1205
|
+
*/
|
|
1206
|
+
/**
|
|
1207
|
+
* Module registry for tracking available modules and their dependencies.
|
|
1208
|
+
* Supports lazy initialization and automatic dependency resolution.
|
|
1209
|
+
*/
|
|
1210
|
+
declare function createModuleRegistry(): {
|
|
1211
|
+
/** Register a module with its factory function and optional dependencies */
|
|
1212
|
+
register(name: string, factory: () => unknown, deps?: string[]): void;
|
|
1213
|
+
/** Resolve a module, loading its dependencies first */
|
|
1214
|
+
resolve<T = unknown>(name: string): T;
|
|
1215
|
+
/** Check if a module is registered */
|
|
1216
|
+
has(name: string): boolean;
|
|
1217
|
+
/** List all registered module names */
|
|
1218
|
+
list(): string[];
|
|
1219
|
+
/** Get the full dependency graph (transitive) for a module */
|
|
1220
|
+
deps(name: string): string[];
|
|
1221
|
+
/** Reset all loaded modules back to unloaded state (useful for testing) */
|
|
1222
|
+
reset(): void;
|
|
1223
|
+
};
|
|
1224
|
+
/**
|
|
1225
|
+
* Create a subset bundle containing only specified modules.
|
|
1226
|
+
* Each key maps to a factory function that is invoked lazily on first access.
|
|
1227
|
+
* Returns an object with only the requested exports.
|
|
1228
|
+
*/
|
|
1229
|
+
declare function createBundle<T extends Record<string, unknown>>(modules: Record<string, () => unknown>): T;
|
|
1230
|
+
/**
|
|
1231
|
+
* Lazy module loader that only imports a module when first accessed.
|
|
1232
|
+
* Uses ES module dynamic import under the hood.
|
|
1233
|
+
* Caches the result after the first successful load.
|
|
1234
|
+
*/
|
|
1235
|
+
declare function lazyModule<T>(loader: () => Promise<T>): {
|
|
1236
|
+
get: () => Promise<T>;
|
|
1237
|
+
loaded: boolean;
|
|
1238
|
+
};
|
|
1239
|
+
/**
|
|
1240
|
+
* Package metadata for distribution tooling.
|
|
1241
|
+
* Provides entry point information and can generate Node.js subpath exports maps.
|
|
1242
|
+
*/
|
|
1243
|
+
declare const packageInfo: {
|
|
1244
|
+
name: string;
|
|
1245
|
+
version: string;
|
|
1246
|
+
entryPoints: Record<string, string>;
|
|
1247
|
+
/**
|
|
1248
|
+
* Generate a package.json `exports` map for Node.js subpath exports.
|
|
1249
|
+
* Maps each entry point to its import, require, and types paths.
|
|
1250
|
+
*/
|
|
1251
|
+
generateExportsMap(): Record<string, {
|
|
1252
|
+
import: string;
|
|
1253
|
+
require: string;
|
|
1254
|
+
types: string;
|
|
1255
|
+
}>;
|
|
1256
|
+
};
|
|
1257
|
+
|
|
1258
|
+
/**
|
|
1259
|
+
* Ecosystem integration utilities for SibuJS.
|
|
1260
|
+
* Provides adapters for common testing frameworks, bundlers, and CI/CD pipelines.
|
|
1261
|
+
*/
|
|
1262
|
+
/**
|
|
1263
|
+
* Create a test harness for SibuJS components.
|
|
1264
|
+
* Works with any testing framework (Vitest, Jest, Mocha).
|
|
1265
|
+
*/
|
|
1266
|
+
declare function createTestHarness(): {
|
|
1267
|
+
/** Set up a clean DOM container before each test */
|
|
1268
|
+
setup(): HTMLElement;
|
|
1269
|
+
/** Tear down the DOM container after each test */
|
|
1270
|
+
teardown(): void;
|
|
1271
|
+
/** Render a component into the test container */
|
|
1272
|
+
render(component: (() => HTMLElement) | HTMLElement): HTMLElement;
|
|
1273
|
+
/** Get the test container */
|
|
1274
|
+
getContainer(): HTMLElement;
|
|
1275
|
+
/** Wait for reactive updates to settle */
|
|
1276
|
+
flush(): Promise<void>;
|
|
1277
|
+
/** Query within the container */
|
|
1278
|
+
query(selector: string): Element | null;
|
|
1279
|
+
/** Query all matching elements within the container */
|
|
1280
|
+
queryAll(selector: string): Element[];
|
|
1281
|
+
/** Simulate a click event */
|
|
1282
|
+
click(el: Element): void;
|
|
1283
|
+
/** Simulate input value change */
|
|
1284
|
+
input(el: HTMLInputElement, value: string): void;
|
|
1285
|
+
};
|
|
1286
|
+
/**
|
|
1287
|
+
* Metadata for bundler plugins to consume.
|
|
1288
|
+
* Provides information about SibuJS module structure for tree-shaking optimization.
|
|
1289
|
+
*/
|
|
1290
|
+
declare const bundlerMetadata: {
|
|
1291
|
+
name: "sibu";
|
|
1292
|
+
sideEffects: false;
|
|
1293
|
+
modules: Record<string, string[]>;
|
|
1294
|
+
/** Generate import map for module resolution */
|
|
1295
|
+
generateImportMap(base?: string): Record<string, string>;
|
|
1296
|
+
};
|
|
1297
|
+
/**
|
|
1298
|
+
* Health check utility for CI/CD pipelines.
|
|
1299
|
+
* Verifies that the framework is properly installed and configured.
|
|
1300
|
+
*/
|
|
1301
|
+
declare function healthCheck(): {
|
|
1302
|
+
status: "ok" | "warning" | "error";
|
|
1303
|
+
checks: Array<{
|
|
1304
|
+
name: string;
|
|
1305
|
+
passed: boolean;
|
|
1306
|
+
message: string;
|
|
1307
|
+
}>;
|
|
1308
|
+
};
|
|
1309
|
+
/**
|
|
1310
|
+
* Environment detection utilities.
|
|
1311
|
+
*/
|
|
1312
|
+
declare const env: {
|
|
1313
|
+
/** True when running in a browser with a DOM */
|
|
1314
|
+
isBrowser: boolean;
|
|
1315
|
+
/** True when running in Node.js */
|
|
1316
|
+
isNode: boolean;
|
|
1317
|
+
/** True when running inside a Web Worker */
|
|
1318
|
+
isWorker: boolean;
|
|
1319
|
+
/** True when running inside Deno */
|
|
1320
|
+
isDeno: boolean;
|
|
1321
|
+
/** True when running inside Bun */
|
|
1322
|
+
isBun: boolean;
|
|
1323
|
+
/** True when no window object is available (server-side rendering) */
|
|
1324
|
+
isSSR: boolean;
|
|
1325
|
+
/** True when NODE_ENV is not "production" */
|
|
1326
|
+
isDev: boolean;
|
|
1327
|
+
/** True when NODE_ENV is "test" or VITEST is set */
|
|
1328
|
+
isTest: boolean;
|
|
1329
|
+
};
|
|
1330
|
+
|
|
1331
|
+
/**
|
|
1332
|
+
* Versioning and migration utilities for SibuJS applications.
|
|
1333
|
+
* Provides semantic version management, migration tooling, and compatibility checks.
|
|
1334
|
+
*/
|
|
1335
|
+
/** Semantic version representation */
|
|
1336
|
+
interface SemVer {
|
|
1337
|
+
major: number;
|
|
1338
|
+
minor: number;
|
|
1339
|
+
patch: number;
|
|
1340
|
+
prerelease?: string;
|
|
1341
|
+
}
|
|
1342
|
+
/** Migration definition */
|
|
1343
|
+
interface Migration {
|
|
1344
|
+
version: string;
|
|
1345
|
+
description: string;
|
|
1346
|
+
up: () => void | Promise<void>;
|
|
1347
|
+
down?: () => void | Promise<void>;
|
|
1348
|
+
}
|
|
1349
|
+
/**
|
|
1350
|
+
* Framework version constant.
|
|
1351
|
+
*/
|
|
1352
|
+
declare const VERSION = "1.0.0";
|
|
1353
|
+
/**
|
|
1354
|
+
* Parse a semantic version string into components.
|
|
1355
|
+
*/
|
|
1356
|
+
declare function parseSemVer(version: string): SemVer;
|
|
1357
|
+
/**
|
|
1358
|
+
* Compare two semantic versions.
|
|
1359
|
+
* Returns -1 if a < b, 0 if a === b, 1 if a > b.
|
|
1360
|
+
*/
|
|
1361
|
+
declare function compareSemVer(a: string | SemVer, b: string | SemVer): -1 | 0 | 1;
|
|
1362
|
+
/**
|
|
1363
|
+
* Check if a version satisfies a semver range (supports ^, ~, >=, <=, =).
|
|
1364
|
+
*/
|
|
1365
|
+
declare function satisfies(version: string, range: string): boolean;
|
|
1366
|
+
/**
|
|
1367
|
+
* Create a migration runner for managing schema/state version upgrades.
|
|
1368
|
+
*/
|
|
1369
|
+
declare function createMigrationRunner(config: {
|
|
1370
|
+
/** Current version of the app/data */
|
|
1371
|
+
currentVersion: string;
|
|
1372
|
+
/** Storage key for persisting applied migration version */
|
|
1373
|
+
storageKey?: string;
|
|
1374
|
+
/** Available migrations, sorted by version */
|
|
1375
|
+
migrations: Migration[];
|
|
1376
|
+
}): {
|
|
1377
|
+
/** Get the last applied migration version from storage */
|
|
1378
|
+
getAppliedVersion(): string | null;
|
|
1379
|
+
/** Get pending migrations that haven't been applied */
|
|
1380
|
+
getPending(): Migration[];
|
|
1381
|
+
/** Run all pending migrations in order */
|
|
1382
|
+
migrate(): Promise<{
|
|
1383
|
+
applied: string[];
|
|
1384
|
+
errors: Array<{
|
|
1385
|
+
version: string;
|
|
1386
|
+
error: Error;
|
|
1387
|
+
}>;
|
|
1388
|
+
}>;
|
|
1389
|
+
/** Rollback to a specific version */
|
|
1390
|
+
rollback(targetVersion: string): Promise<{
|
|
1391
|
+
rolledBack: string[];
|
|
1392
|
+
}>;
|
|
1393
|
+
};
|
|
1394
|
+
/**
|
|
1395
|
+
* Check compatibility between framework version and app version.
|
|
1396
|
+
*/
|
|
1397
|
+
declare function checkCompatibility(frameworkVersion: string, requiredRange: string): {
|
|
1398
|
+
compatible: boolean;
|
|
1399
|
+
message: string;
|
|
1400
|
+
};
|
|
1401
|
+
|
|
1402
|
+
/**
|
|
1403
|
+
* Critical resource preloader — ensures key assets are loaded before rendering.
|
|
1404
|
+
* Generates <link rel="preload"> tags for critical resources and appends them
|
|
1405
|
+
* to the document head.
|
|
1406
|
+
*/
|
|
1407
|
+
declare function preloadCritical(resources: Array<{
|
|
1408
|
+
href: string;
|
|
1409
|
+
as: "script" | "style" | "font" | "image" | "fetch";
|
|
1410
|
+
type?: string;
|
|
1411
|
+
crossOrigin?: "anonymous" | "use-credentials";
|
|
1412
|
+
}>): void;
|
|
1413
|
+
/**
|
|
1414
|
+
* Prerender a set of routes for instant navigation.
|
|
1415
|
+
* Renders components to HTML using `renderToString` and caches them.
|
|
1416
|
+
* Supports TTL-based expiry and maximum cache size limits.
|
|
1417
|
+
*/
|
|
1418
|
+
declare function prerenderRoutes(routes: Array<{
|
|
1419
|
+
path: string;
|
|
1420
|
+
component: () => HTMLElement;
|
|
1421
|
+
}>, options?: {
|
|
1422
|
+
maxCacheSize?: number;
|
|
1423
|
+
cacheTTL?: number;
|
|
1424
|
+
}): {
|
|
1425
|
+
/** Get cached HTML for a route, or undefined if not cached or expired */
|
|
1426
|
+
get(path: string): string | undefined;
|
|
1427
|
+
/** Check if a route has been prerendered and is still valid */
|
|
1428
|
+
has(path: string): boolean;
|
|
1429
|
+
/** Invalidate a cached route */
|
|
1430
|
+
invalidate(path: string): void;
|
|
1431
|
+
/** Clear all cached routes */
|
|
1432
|
+
clear(): void;
|
|
1433
|
+
/** Get cache statistics */
|
|
1434
|
+
stats(): {
|
|
1435
|
+
size: number;
|
|
1436
|
+
routes: string[];
|
|
1437
|
+
};
|
|
1438
|
+
};
|
|
1439
|
+
/**
|
|
1440
|
+
* SSR response cache for frequently accessed routes.
|
|
1441
|
+
* Supports TTL-based expiry and max size limits.
|
|
1442
|
+
* Tracks hit/miss statistics for monitoring.
|
|
1443
|
+
*/
|
|
1444
|
+
declare function createSSRCache(config?: {
|
|
1445
|
+
maxSize?: number;
|
|
1446
|
+
defaultTTL?: number;
|
|
1447
|
+
}): {
|
|
1448
|
+
/** Get cached HTML for a key, or undefined if not cached or expired */
|
|
1449
|
+
get(key: string): string | undefined;
|
|
1450
|
+
/** Cache an HTML string with an optional TTL override */
|
|
1451
|
+
set(key: string, html: string, ttl?: number): void;
|
|
1452
|
+
/** Check if a key exists in the cache and is still valid */
|
|
1453
|
+
has(key: string): boolean;
|
|
1454
|
+
/** Invalidate a cached entry */
|
|
1455
|
+
invalidate(key: string): void;
|
|
1456
|
+
/** Clear all cached entries and reset statistics */
|
|
1457
|
+
clear(): void;
|
|
1458
|
+
/** Get cache statistics including hit/miss counts */
|
|
1459
|
+
stats(): {
|
|
1460
|
+
size: number;
|
|
1461
|
+
hits: number;
|
|
1462
|
+
misses: number;
|
|
1463
|
+
};
|
|
1464
|
+
};
|
|
1465
|
+
/**
|
|
1466
|
+
* Measure and optimize Time to Interactive (TTI).
|
|
1467
|
+
* Defers non-critical work until after the main thread is idle.
|
|
1468
|
+
* Uses `requestIdleCallback` when available, falling back to `setTimeout`.
|
|
1469
|
+
*/
|
|
1470
|
+
declare function deferNonCritical(tasks: Array<() => void>): void;
|
|
1471
|
+
/**
|
|
1472
|
+
* Create a boot sequence that orchestrates app initialization.
|
|
1473
|
+
* Critical tasks run first in registration order. Deferred tasks run
|
|
1474
|
+
* afterward using idle scheduling. Returns timing information and
|
|
1475
|
+
* any errors that occurred.
|
|
1476
|
+
*/
|
|
1477
|
+
declare function createBootSequence(): {
|
|
1478
|
+
/** Add a critical task that runs immediately during boot */
|
|
1479
|
+
critical(name: string, task: () => void | Promise<void>): void;
|
|
1480
|
+
/** Add a deferred task that runs after all critical tasks complete */
|
|
1481
|
+
defer(name: string, task: () => void | Promise<void>): void;
|
|
1482
|
+
/** Execute the boot sequence: critical tasks first, then deferred */
|
|
1483
|
+
boot(): Promise<{
|
|
1484
|
+
timing: Record<string, number>;
|
|
1485
|
+
errors: Array<{
|
|
1486
|
+
name: string;
|
|
1487
|
+
error: Error;
|
|
1488
|
+
}>;
|
|
1489
|
+
}>;
|
|
1490
|
+
};
|
|
1491
|
+
|
|
1492
|
+
/**
|
|
1493
|
+
* Enable debug mode — enables verbose logging.
|
|
1494
|
+
*/
|
|
1495
|
+
declare function enableDebug(): void;
|
|
1496
|
+
/**
|
|
1497
|
+
* Disable debug mode.
|
|
1498
|
+
*/
|
|
1499
|
+
declare function disableDebug(): void;
|
|
1500
|
+
/**
|
|
1501
|
+
* Check if debug mode is active.
|
|
1502
|
+
*/
|
|
1503
|
+
declare function isDebugEnabled(): boolean;
|
|
1504
|
+
/**
|
|
1505
|
+
* Log a debug message (only when debug mode is enabled).
|
|
1506
|
+
*/
|
|
1507
|
+
declare function debugLog(component: string, action: string, data?: unknown): void;
|
|
1508
|
+
/**
|
|
1509
|
+
* sbPerformance tracks render timing for a component.
|
|
1510
|
+
*/
|
|
1511
|
+
declare function sbPerformance(label: string): {
|
|
1512
|
+
startMeasure: () => void;
|
|
1513
|
+
endMeasure: () => number;
|
|
1514
|
+
getAverageTime: () => number;
|
|
1515
|
+
getRenderCount: () => number;
|
|
1516
|
+
};
|
|
1517
|
+
/**
|
|
1518
|
+
* measureRender wraps a component and measures its render time.
|
|
1519
|
+
*/
|
|
1520
|
+
declare function measureRender<P>(label: string, component: (props: P) => HTMLElement): (props: P) => HTMLElement;
|
|
1521
|
+
/**
|
|
1522
|
+
* Get all collected performance data.
|
|
1523
|
+
*/
|
|
1524
|
+
declare function getPerformanceReport(): Record<string, {
|
|
1525
|
+
count: number;
|
|
1526
|
+
average: number;
|
|
1527
|
+
min: number;
|
|
1528
|
+
max: number;
|
|
1529
|
+
total: number;
|
|
1530
|
+
}>;
|
|
1531
|
+
/**
|
|
1532
|
+
* Clear all performance data.
|
|
1533
|
+
*/
|
|
1534
|
+
declare function clearPerformanceData(): void;
|
|
1535
|
+
declare function trackCleanup(component: string, cleanup: () => void): void;
|
|
1536
|
+
declare function runCleanups(component: string): void;
|
|
1537
|
+
declare function checkLeaks(): Record<string, number>;
|
|
1538
|
+
|
|
1539
|
+
/**
|
|
1540
|
+
* Sibu DevTools Bridge
|
|
1541
|
+
*
|
|
1542
|
+
* Architecture (React DevTools style):
|
|
1543
|
+
*
|
|
1544
|
+
* Sibu App Chrome Extension
|
|
1545
|
+
* ┌──────────┐ ┌──────────────┐
|
|
1546
|
+
* │ sbSignal │──emit──▶│ │ Content │
|
|
1547
|
+
* │ sbDerived │ │ │ Script │
|
|
1548
|
+
* │ sbEffect │ ▼ │ │ │
|
|
1549
|
+
* │ mount │ __SIBU_ │ ▼ │
|
|
1550
|
+
* └──────────┘ DEVTOOLS_ │ Background │
|
|
1551
|
+
* GLOBAL_ │ │ │
|
|
1552
|
+
* HOOK__ │ ▼ │
|
|
1553
|
+
* │ │ DevTools │
|
|
1554
|
+
* │ │ Panel │
|
|
1555
|
+
* ▼ └──────────────┘
|
|
1556
|
+
* Bridge
|
|
1557
|
+
* (postMessage)
|
|
1558
|
+
*
|
|
1559
|
+
* The hook is injected by the content script BEFORE the app loads.
|
|
1560
|
+
* When initDevTools() is called, the bridge connects to the existing hook
|
|
1561
|
+
* or creates one. Events are buffered until the panel connects.
|
|
1562
|
+
*/
|
|
1563
|
+
type DevToolsEvent = {
|
|
1564
|
+
type: "state-change";
|
|
1565
|
+
component: string;
|
|
1566
|
+
key: string;
|
|
1567
|
+
oldValue: unknown;
|
|
1568
|
+
newValue: unknown;
|
|
1569
|
+
timestamp: number;
|
|
1570
|
+
} | {
|
|
1571
|
+
type: "mount";
|
|
1572
|
+
component: string;
|
|
1573
|
+
element: HTMLElement;
|
|
1574
|
+
timestamp: number;
|
|
1575
|
+
} | {
|
|
1576
|
+
type: "unmount";
|
|
1577
|
+
component: string;
|
|
1578
|
+
timestamp: number;
|
|
1579
|
+
} | {
|
|
1580
|
+
type: "render";
|
|
1581
|
+
component: string;
|
|
1582
|
+
duration: number;
|
|
1583
|
+
timestamp: number;
|
|
1584
|
+
} | {
|
|
1585
|
+
type: "error";
|
|
1586
|
+
component: string;
|
|
1587
|
+
error: Error;
|
|
1588
|
+
timestamp: number;
|
|
1589
|
+
};
|
|
1590
|
+
interface DevToolsConfig {
|
|
1591
|
+
maxEvents?: number;
|
|
1592
|
+
enabled?: boolean;
|
|
1593
|
+
maxSignals?: number;
|
|
1594
|
+
}
|
|
1595
|
+
interface ComponentEntry {
|
|
1596
|
+
element: HTMLElement;
|
|
1597
|
+
state?: Record<string, unknown>;
|
|
1598
|
+
}
|
|
1599
|
+
declare function getActiveDevTools(): ReturnType<typeof initDevTools> | null;
|
|
1600
|
+
/**
|
|
1601
|
+
* Initialize Sibu DevTools.
|
|
1602
|
+
* Connects to __SIBU_DEVTOOLS_GLOBAL_HOOK__ and starts tracking signals,
|
|
1603
|
+
* computed values, effects, and components.
|
|
1604
|
+
*/
|
|
1605
|
+
declare function initDevTools(config?: DevToolsConfig): {
|
|
1606
|
+
record: (event: DevToolsEvent) => void;
|
|
1607
|
+
getEvents: (filter?: {
|
|
1608
|
+
type?: string;
|
|
1609
|
+
component?: string;
|
|
1610
|
+
}) => DevToolsEvent[];
|
|
1611
|
+
clearEvents: () => void;
|
|
1612
|
+
registerComponent: (name: string, element: HTMLElement, state?: Record<string, unknown>) => void;
|
|
1613
|
+
unregisterComponent: (name: string) => void;
|
|
1614
|
+
getComponents: () => Map<string, ComponentEntry>;
|
|
1615
|
+
getSignals: () => Array<{
|
|
1616
|
+
id: number;
|
|
1617
|
+
name: string;
|
|
1618
|
+
type: string;
|
|
1619
|
+
value: unknown;
|
|
1620
|
+
subscriberCount: number;
|
|
1621
|
+
}>;
|
|
1622
|
+
isEnabled: () => boolean;
|
|
1623
|
+
setEnabled: (v: boolean) => void;
|
|
1624
|
+
snapshot: () => Record<string, unknown>;
|
|
1625
|
+
highlightElement: (name: string) => void;
|
|
1626
|
+
destroy: () => void;
|
|
1627
|
+
};
|
|
1628
|
+
declare function sbDevState<T>(name: string, initial: T): [() => T, (value: T | ((prev: T) => T)) => void];
|
|
1629
|
+
|
|
1630
|
+
/**
|
|
1631
|
+
* Hot Module Replacement utilities for SibuJS.
|
|
1632
|
+
* Preserves component state during development reloads.
|
|
1633
|
+
*
|
|
1634
|
+
* During development the HMR runtime keeps a global store of component state
|
|
1635
|
+
* keyed by a developer-supplied ID. When a module is hot-reloaded the new
|
|
1636
|
+
* component implementation can re-use the preserved state so that the user
|
|
1637
|
+
* does not lose context (form values, scroll position, etc.).
|
|
1638
|
+
*
|
|
1639
|
+
* The utilities integrate with bundlers that expose a `module.hot` or
|
|
1640
|
+
* `import.meta.hot` API (Webpack, Vite, Parcel, etc.).
|
|
1641
|
+
*/
|
|
1642
|
+
/**
|
|
1643
|
+
* Create an HMR-aware state that persists across module reloads.
|
|
1644
|
+
* During development, state is stored in a global map keyed by a unique `id`.
|
|
1645
|
+
* On the first load the `initial` value is used; on subsequent hot reloads
|
|
1646
|
+
* the previously stored value is restored.
|
|
1647
|
+
*
|
|
1648
|
+
* @param id Unique identifier for this state (should be stable across reloads)
|
|
1649
|
+
* @param initial Initial value used on the very first load
|
|
1650
|
+
* @returns A `[getter, setter]` tuple compatible with `sbSignal`
|
|
1651
|
+
*
|
|
1652
|
+
* @example
|
|
1653
|
+
* ```ts
|
|
1654
|
+
* const [count, setCount] = sbHMRState("MyCounter.count", 0);
|
|
1655
|
+
* // After a hot reload, `count()` will still return the last known value.
|
|
1656
|
+
* ```
|
|
1657
|
+
*/
|
|
1658
|
+
declare function sbHMRState<T>(id: string, initial: T): [() => T, (value: T | ((prev: T) => T)) => void];
|
|
1659
|
+
/**
|
|
1660
|
+
* Register a component for HMR updates.
|
|
1661
|
+
* When the module is hot-reloaded the component is re-rendered with preserved
|
|
1662
|
+
* state by swapping out the old DOM element for the new one produced by the
|
|
1663
|
+
* updated component function.
|
|
1664
|
+
*
|
|
1665
|
+
* @param id Stable identifier for the component
|
|
1666
|
+
* @param component Factory function that returns the component's root element
|
|
1667
|
+
* @param container Optional container element – if provided the initial element
|
|
1668
|
+
* is automatically appended to it
|
|
1669
|
+
* @returns An object with `update` (swap implementation) and `dispose` (clean up)
|
|
1670
|
+
*
|
|
1671
|
+
* @example
|
|
1672
|
+
* ```ts
|
|
1673
|
+
* const hmr = registerHMR("MyWidget", () => MyWidget());
|
|
1674
|
+
*
|
|
1675
|
+
* // On hot update:
|
|
1676
|
+
* hmr.update(() => MyWidgetV2());
|
|
1677
|
+
*
|
|
1678
|
+
* // On full teardown:
|
|
1679
|
+
* hmr.dispose();
|
|
1680
|
+
* ```
|
|
1681
|
+
*/
|
|
1682
|
+
declare function registerHMR(id: string, component: () => HTMLElement, container?: HTMLElement): {
|
|
1683
|
+
/** Update the component implementation (called on hot reload) */
|
|
1684
|
+
update: (newComponent: () => HTMLElement) => void;
|
|
1685
|
+
/** Dispose the HMR registration */
|
|
1686
|
+
dispose: () => void;
|
|
1687
|
+
};
|
|
1688
|
+
/**
|
|
1689
|
+
* Create an HMR boundary.
|
|
1690
|
+
* Components within the boundary are hot-reloaded independently. The boundary
|
|
1691
|
+
* keeps track of accept/dispose callbacks and can wrap a component factory so
|
|
1692
|
+
* that hot updates are handled transparently.
|
|
1693
|
+
*
|
|
1694
|
+
* @param id Stable boundary identifier
|
|
1695
|
+
* @returns Boundary helpers: `wrap`, `accept`, `dispose`
|
|
1696
|
+
*
|
|
1697
|
+
* @example
|
|
1698
|
+
* ```ts
|
|
1699
|
+
* const boundary = createHMRBoundary("settings-panel");
|
|
1700
|
+
*
|
|
1701
|
+
* const el = boundary.wrap(() => SettingsPanel());
|
|
1702
|
+
* document.body.appendChild(el);
|
|
1703
|
+
*
|
|
1704
|
+
* boundary.accept(() => console.log("Hot update accepted"));
|
|
1705
|
+
* boundary.dispose(() => console.log("Cleaning up old version"));
|
|
1706
|
+
* ```
|
|
1707
|
+
*/
|
|
1708
|
+
declare function createHMRBoundary(id: string): {
|
|
1709
|
+
/** Wrap a component for HMR support */
|
|
1710
|
+
wrap: (component: () => HTMLElement) => HTMLElement;
|
|
1711
|
+
/** Accept a hot update */
|
|
1712
|
+
accept: (callback?: () => void) => void;
|
|
1713
|
+
/** Dispose callback */
|
|
1714
|
+
dispose: (callback: () => void) => void;
|
|
1715
|
+
};
|
|
1716
|
+
/**
|
|
1717
|
+
* Clear all HMR state (useful for a full page refresh or test teardown).
|
|
1718
|
+
*/
|
|
1719
|
+
declare function clearHMRState(): void;
|
|
1720
|
+
/**
|
|
1721
|
+
* Check if HMR is available in the current environment.
|
|
1722
|
+
* Returns `true` when any of the common bundler HMR APIs are detected
|
|
1723
|
+
* (`module.hot` for Webpack, `import.meta.hot` for Vite, or the SibuJS
|
|
1724
|
+
* custom hook).
|
|
1725
|
+
*/
|
|
1726
|
+
declare function isHMRAvailable(): boolean;
|
|
1727
|
+
|
|
1728
|
+
/**
|
|
1729
|
+
* Source map and debugging utilities for SibuJS.
|
|
1730
|
+
* Provides enhanced error reporting with component context and stack traces.
|
|
1731
|
+
*
|
|
1732
|
+
* These utilities do not parse `.map` files at runtime; instead they enrich
|
|
1733
|
+
* errors with SibuJS-specific component context so that developers can quickly
|
|
1734
|
+
* identify *which* component failed and *what* props were in play, regardless
|
|
1735
|
+
* of whether source maps are available in the browser.
|
|
1736
|
+
*/
|
|
1737
|
+
/**
|
|
1738
|
+
* Enhanced error class with component context.
|
|
1739
|
+
*
|
|
1740
|
+
* Extends the native `Error` to carry the component name and the props that
|
|
1741
|
+
* were active when the error was thrown. The `cause` property (ES2022) is
|
|
1742
|
+
* also forwarded so that the original error is preserved.
|
|
1743
|
+
*
|
|
1744
|
+
* @example
|
|
1745
|
+
* ```ts
|
|
1746
|
+
* throw new SibuError("Render failed", {
|
|
1747
|
+
* component: "UserCard",
|
|
1748
|
+
* props: { userId: 42 },
|
|
1749
|
+
* cause: originalError,
|
|
1750
|
+
* });
|
|
1751
|
+
* ```
|
|
1752
|
+
*/
|
|
1753
|
+
declare class SibuError extends Error {
|
|
1754
|
+
component?: string;
|
|
1755
|
+
props?: Record<string, unknown>;
|
|
1756
|
+
constructor(message: string, options?: {
|
|
1757
|
+
component?: string;
|
|
1758
|
+
props?: Record<string, unknown>;
|
|
1759
|
+
cause?: Error;
|
|
1760
|
+
});
|
|
1761
|
+
}
|
|
1762
|
+
/**
|
|
1763
|
+
* Create a component error reporter that captures stack traces and maps them
|
|
1764
|
+
* to component context.
|
|
1765
|
+
*
|
|
1766
|
+
* The reporter collects errors into an internal list, optionally logs them
|
|
1767
|
+
* to the console, and forwards them to a user-supplied `onError` handler.
|
|
1768
|
+
*
|
|
1769
|
+
* @param options Configuration options
|
|
1770
|
+
* @returns Reporter API
|
|
1771
|
+
*
|
|
1772
|
+
* @example
|
|
1773
|
+
* ```ts
|
|
1774
|
+
* const reporter = createErrorReporter({
|
|
1775
|
+
* onError: (err) => analytics.track("component_error", err),
|
|
1776
|
+
* logToConsole: true,
|
|
1777
|
+
* maxErrors: 200,
|
|
1778
|
+
* });
|
|
1779
|
+
*
|
|
1780
|
+
* reporter.report(new Error("oops"), { component: "Dashboard" });
|
|
1781
|
+
* console.log(reporter.getErrors());
|
|
1782
|
+
* ```
|
|
1783
|
+
*/
|
|
1784
|
+
declare function createErrorReporter(options?: {
|
|
1785
|
+
/** Custom error handler */
|
|
1786
|
+
onError?: (error: SibuError) => void;
|
|
1787
|
+
/** Whether to log to console (default `true`) */
|
|
1788
|
+
logToConsole?: boolean;
|
|
1789
|
+
/** Max errors to retain */
|
|
1790
|
+
maxErrors?: number;
|
|
1791
|
+
}): {
|
|
1792
|
+
/** Report an error with component context */
|
|
1793
|
+
report: (error: Error, context?: {
|
|
1794
|
+
component?: string;
|
|
1795
|
+
props?: Record<string, unknown>;
|
|
1796
|
+
}) => void;
|
|
1797
|
+
/** Get all reported errors */
|
|
1798
|
+
getErrors: () => SibuError[];
|
|
1799
|
+
/** Clear error history */
|
|
1800
|
+
clear: () => void;
|
|
1801
|
+
/** Get error count by component */
|
|
1802
|
+
getErrorsByComponent: () => Map<string, SibuError[]>;
|
|
1803
|
+
};
|
|
1804
|
+
/**
|
|
1805
|
+
* Wrap a component factory with error tracking.
|
|
1806
|
+
* Catches errors during rendering and reports them via the supplied reporter
|
|
1807
|
+
* (or a default one). If the component throws, a fallback `<div>` with the
|
|
1808
|
+
* error message is returned so the rest of the page is not broken.
|
|
1809
|
+
*
|
|
1810
|
+
* @param name Human-readable component name
|
|
1811
|
+
* @param component Factory function that returns an `HTMLElement`
|
|
1812
|
+
* @param reporter Optional error reporter (a default is created if omitted)
|
|
1813
|
+
* @returns A wrapped factory function with identical signature
|
|
1814
|
+
*
|
|
1815
|
+
* @example
|
|
1816
|
+
* ```ts
|
|
1817
|
+
* const SafeWidget = withErrorTracking("Widget", () => Widget(), reporter);
|
|
1818
|
+
* document.body.appendChild(SafeWidget());
|
|
1819
|
+
* ```
|
|
1820
|
+
*/
|
|
1821
|
+
declare function withErrorTracking(name: string, component: () => HTMLElement, reporter?: ReturnType<typeof createErrorReporter>): () => HTMLElement;
|
|
1822
|
+
/**
|
|
1823
|
+
* Format an error with enhanced stack trace information.
|
|
1824
|
+
* Adds component context markers to stack traces so that the developer can
|
|
1825
|
+
* immediately see which SibuJS component is involved.
|
|
1826
|
+
*
|
|
1827
|
+
* @param error The error to format
|
|
1828
|
+
* @param context Optional context to include in the formatted output
|
|
1829
|
+
* @returns A formatted multi-line string suitable for `console.error`
|
|
1830
|
+
*
|
|
1831
|
+
* @example
|
|
1832
|
+
* ```ts
|
|
1833
|
+
* try {
|
|
1834
|
+
* render();
|
|
1835
|
+
* } catch (e) {
|
|
1836
|
+
* console.error(formatError(e, { component: "App" }));
|
|
1837
|
+
* }
|
|
1838
|
+
* ```
|
|
1839
|
+
*/
|
|
1840
|
+
declare function formatError(error: Error, context?: {
|
|
1841
|
+
component?: string;
|
|
1842
|
+
}): string;
|
|
1843
|
+
|
|
1844
|
+
/**
|
|
1845
|
+
* Registers a reactive value for DevTools inspection.
|
|
1846
|
+
* The formatter converts the value to a display string (label).
|
|
1847
|
+
* If no formatter is provided, String() is used.
|
|
1848
|
+
*/
|
|
1849
|
+
declare function sbDebugValue<T>(value: () => T, formatter?: (value: T) => string): void;
|
|
1850
|
+
/**
|
|
1851
|
+
* Returns all currently registered debug values.
|
|
1852
|
+
*/
|
|
1853
|
+
declare function getDebugValues(): Array<{
|
|
1854
|
+
value: unknown;
|
|
1855
|
+
label: string;
|
|
1856
|
+
}>;
|
|
1857
|
+
/**
|
|
1858
|
+
* Clears all registered debug values.
|
|
1859
|
+
*/
|
|
1860
|
+
declare function clearDebugValues(): void;
|
|
1861
|
+
|
|
1862
|
+
interface ProfilerResult {
|
|
1863
|
+
renderCount: () => number;
|
|
1864
|
+
lastRenderTime: () => number;
|
|
1865
|
+
averageRenderTime: () => number;
|
|
1866
|
+
totalRenderTime: () => number;
|
|
1867
|
+
reset: () => void;
|
|
1868
|
+
}
|
|
1869
|
+
/**
|
|
1870
|
+
* Creates a component profiler that tracks render counts and timings.
|
|
1871
|
+
* Uses performance.now() for high-resolution timing.
|
|
1872
|
+
* All outputs are reactive via sbSignal.
|
|
1873
|
+
*/
|
|
1874
|
+
declare function createProfiler(_name: string): ProfilerResult;
|
|
1875
|
+
/**
|
|
1876
|
+
* Starts a render measurement for the given profiler.
|
|
1877
|
+
* Returns a stop function that records the elapsed time.
|
|
1878
|
+
*/
|
|
1879
|
+
declare function startMeasure(profiler: ProfilerResult): () => void;
|
|
1880
|
+
|
|
1881
|
+
/**
|
|
1882
|
+
* DevTools introspection utilities for SibuJS.
|
|
1883
|
+
*
|
|
1884
|
+
* These functions allow dev tools to inspect the reactive dependency graph
|
|
1885
|
+
* at runtime. They are designed to be zero-cost when not used — no overhead
|
|
1886
|
+
* is added to the hot path. Information is read from tags already placed
|
|
1887
|
+
* on signals/getters by sbSignal, sbDerived, etc.
|
|
1888
|
+
*/
|
|
1889
|
+
|
|
1890
|
+
/** Info about a reactive node in the dependency graph */
|
|
1891
|
+
interface ReactiveNodeInfo {
|
|
1892
|
+
/** Debug name if provided (e.g., sbSignal(0, { name: "count" })) */
|
|
1893
|
+
name: string | undefined;
|
|
1894
|
+
/** Internal signal reference */
|
|
1895
|
+
signal: ReactiveSignal;
|
|
1896
|
+
/** Number of subscribers */
|
|
1897
|
+
subscriberCount: number;
|
|
1898
|
+
}
|
|
1899
|
+
/**
|
|
1900
|
+
* Get the debug name of a signal getter function.
|
|
1901
|
+
* Returns undefined if no name was provided.
|
|
1902
|
+
*
|
|
1903
|
+
* @example
|
|
1904
|
+
* const [count] = sbSignal(0, { name: "count" });
|
|
1905
|
+
* getSignalName(count); // "count"
|
|
1906
|
+
*/
|
|
1907
|
+
declare function getSignalName(getter: () => unknown): string | undefined;
|
|
1908
|
+
/**
|
|
1909
|
+
* Get the number of active subscribers for a signal getter.
|
|
1910
|
+
*
|
|
1911
|
+
* @example
|
|
1912
|
+
* const [count] = sbSignal(0);
|
|
1913
|
+
* sbEffect(() => count()); // +1 subscriber
|
|
1914
|
+
* getSubscriberCount(count); // 1
|
|
1915
|
+
*/
|
|
1916
|
+
declare function getSubscriberCount(getter: () => unknown): number;
|
|
1917
|
+
/**
|
|
1918
|
+
* Get the dependency list of an effect or computed subscriber function.
|
|
1919
|
+
* Returns signal references that the subscriber depends on.
|
|
1920
|
+
*
|
|
1921
|
+
* Note: This reads the _deps Set that track.ts maintains on subscriber functions.
|
|
1922
|
+
*/
|
|
1923
|
+
declare function getDependencies(subscriberFn: () => void): ReactiveSignal[];
|
|
1924
|
+
/**
|
|
1925
|
+
* Inspect a signal getter — returns name, signal ref, and subscriber count.
|
|
1926
|
+
*/
|
|
1927
|
+
declare function inspectSignal(getter: () => unknown): ReactiveNodeInfo | null;
|
|
1928
|
+
/**
|
|
1929
|
+
* Walk the full reactive graph starting from a signal getter.
|
|
1930
|
+
* Returns a tree of signal → subscribers → their signals → etc.
|
|
1931
|
+
* Useful for devtools visualization.
|
|
1932
|
+
*
|
|
1933
|
+
* Set maxDepth to limit traversal (default: 10).
|
|
1934
|
+
*/
|
|
1935
|
+
declare function walkDependencyGraph(getter: () => unknown, maxDepth?: number): {
|
|
1936
|
+
name: string | undefined;
|
|
1937
|
+
subscribers: number;
|
|
1938
|
+
downstream: ReturnType<typeof walkDependencyGraph>[];
|
|
1939
|
+
};
|
|
1940
|
+
|
|
1941
|
+
interface DevtoolsOverlayOptions {
|
|
1942
|
+
enabled?: boolean;
|
|
1943
|
+
position?: "top-left" | "top-right" | "bottom-left" | "bottom-right";
|
|
1944
|
+
}
|
|
1945
|
+
/**
|
|
1946
|
+
* Creates an in-browser devtools overlay manager.
|
|
1947
|
+
* Manages panels and visibility state reactively.
|
|
1948
|
+
* Does NOT create actual DOM elements — that's the consumer's job.
|
|
1949
|
+
*/
|
|
1950
|
+
declare function createDevtoolsOverlay(options?: DevtoolsOverlayOptions): {
|
|
1951
|
+
isEnabled: () => boolean;
|
|
1952
|
+
toggle: () => void;
|
|
1953
|
+
addPanel: (name: string, render: () => string) => void;
|
|
1954
|
+
removePanel: (name: string) => void;
|
|
1955
|
+
getPanels: () => Array<{
|
|
1956
|
+
name: string;
|
|
1957
|
+
render: () => string;
|
|
1958
|
+
}>;
|
|
1959
|
+
dispose: () => void;
|
|
1960
|
+
};
|
|
1961
|
+
|
|
1962
|
+
interface ComboboxOptions<T> {
|
|
1963
|
+
items: T[];
|
|
1964
|
+
filterFn?: (item: T, query: string) => boolean;
|
|
1965
|
+
itemToString?: (item: T) => string;
|
|
1966
|
+
}
|
|
1967
|
+
declare function createCombobox<T>(options: ComboboxOptions<T>): {
|
|
1968
|
+
query: () => string;
|
|
1969
|
+
setQuery: (q: string) => void;
|
|
1970
|
+
filteredItems: () => T[];
|
|
1971
|
+
selectedItem: () => T | null;
|
|
1972
|
+
select: (item: T) => void;
|
|
1973
|
+
highlightedIndex: () => number;
|
|
1974
|
+
highlightNext: () => void;
|
|
1975
|
+
highlightPrev: () => void;
|
|
1976
|
+
selectHighlighted: () => void;
|
|
1977
|
+
isOpen: () => boolean;
|
|
1978
|
+
open: () => void;
|
|
1979
|
+
close: () => void;
|
|
1980
|
+
};
|
|
1981
|
+
|
|
1982
|
+
interface TabsOptions {
|
|
1983
|
+
tabs: Array<{
|
|
1984
|
+
id: string;
|
|
1985
|
+
label: string;
|
|
1986
|
+
disabled?: boolean;
|
|
1987
|
+
}>;
|
|
1988
|
+
defaultTab?: string;
|
|
1989
|
+
}
|
|
1990
|
+
declare function createTabs(options: TabsOptions): {
|
|
1991
|
+
activeTab: () => string;
|
|
1992
|
+
setActiveTab: (id: string) => void;
|
|
1993
|
+
tabs: () => Array<{
|
|
1994
|
+
id: string;
|
|
1995
|
+
label: string;
|
|
1996
|
+
disabled?: boolean;
|
|
1997
|
+
isActive: boolean;
|
|
1998
|
+
}>;
|
|
1999
|
+
nextTab: () => void;
|
|
2000
|
+
prevTab: () => void;
|
|
2001
|
+
};
|
|
2002
|
+
|
|
2003
|
+
interface AccordionOptions {
|
|
2004
|
+
items: Array<{
|
|
2005
|
+
id: string;
|
|
2006
|
+
label: string;
|
|
2007
|
+
}>;
|
|
2008
|
+
multiple?: boolean;
|
|
2009
|
+
defaultExpanded?: string[];
|
|
2010
|
+
}
|
|
2011
|
+
declare function createAccordion(options: AccordionOptions): {
|
|
2012
|
+
items: () => Array<{
|
|
2013
|
+
id: string;
|
|
2014
|
+
label: string;
|
|
2015
|
+
isExpanded: boolean;
|
|
2016
|
+
}>;
|
|
2017
|
+
toggle: (id: string) => void;
|
|
2018
|
+
expand: (id: string) => void;
|
|
2019
|
+
collapse: (id: string) => void;
|
|
2020
|
+
expandAll: () => void;
|
|
2021
|
+
collapseAll: () => void;
|
|
2022
|
+
};
|
|
2023
|
+
|
|
2024
|
+
/**
|
|
2025
|
+
* createPopover provides simple state management for positioned floating content.
|
|
2026
|
+
* Manages open/close/toggle without any DOM coupling.
|
|
2027
|
+
*/
|
|
2028
|
+
declare function createPopover(): {
|
|
2029
|
+
isOpen: () => boolean;
|
|
2030
|
+
open: () => void;
|
|
2031
|
+
close: () => void;
|
|
2032
|
+
toggle: () => void;
|
|
2033
|
+
};
|
|
2034
|
+
|
|
2035
|
+
interface SelectOptions<T> {
|
|
2036
|
+
items: T[];
|
|
2037
|
+
multiple?: boolean;
|
|
2038
|
+
itemToString?: (item: T) => string;
|
|
2039
|
+
}
|
|
2040
|
+
declare function createSelect<T>(options: SelectOptions<T>): {
|
|
2041
|
+
selectedItems: () => T[];
|
|
2042
|
+
selectedItem: () => T | null;
|
|
2043
|
+
select: (item: T) => void;
|
|
2044
|
+
deselect: (item: T) => void;
|
|
2045
|
+
toggle: (item: T) => void;
|
|
2046
|
+
isSelected: (item: T) => boolean;
|
|
2047
|
+
isOpen: () => boolean;
|
|
2048
|
+
open: () => void;
|
|
2049
|
+
close: () => void;
|
|
2050
|
+
highlightedIndex: () => number;
|
|
2051
|
+
highlightNext: () => void;
|
|
2052
|
+
highlightPrev: () => void;
|
|
2053
|
+
selectHighlighted: () => void;
|
|
2054
|
+
clear: () => void;
|
|
2055
|
+
};
|
|
2056
|
+
|
|
2057
|
+
/**
|
|
2058
|
+
* createTooltip manages tooltip visibility with optional show delay.
|
|
2059
|
+
* Timer cleanup is handled via closure variables per the framework convention.
|
|
2060
|
+
*/
|
|
2061
|
+
declare function createTooltip(options?: {
|
|
2062
|
+
delay?: number;
|
|
2063
|
+
}): {
|
|
2064
|
+
isVisible: () => boolean;
|
|
2065
|
+
show: () => void;
|
|
2066
|
+
hide: () => void;
|
|
2067
|
+
content: () => string;
|
|
2068
|
+
setContent: (text: string) => void;
|
|
2069
|
+
};
|
|
2070
|
+
|
|
2071
|
+
interface FileUploadOptions {
|
|
2072
|
+
accept?: string;
|
|
2073
|
+
multiple?: boolean;
|
|
2074
|
+
maxSize?: number;
|
|
2075
|
+
onFiles?: (files: File[]) => void;
|
|
2076
|
+
}
|
|
2077
|
+
declare function createFileUpload(options?: FileUploadOptions): {
|
|
2078
|
+
files: () => File[];
|
|
2079
|
+
addFiles: (fileList: FileList | File[]) => void;
|
|
2080
|
+
removeFile: (index: number) => void;
|
|
2081
|
+
clear: () => void;
|
|
2082
|
+
errors: () => string[];
|
|
2083
|
+
isDragOver: () => boolean;
|
|
2084
|
+
setDragOver: (v: boolean) => void;
|
|
2085
|
+
};
|
|
2086
|
+
|
|
2087
|
+
/**
|
|
2088
|
+
* sbContentEditable provides reactive binding for contenteditable elements.
|
|
2089
|
+
* Commands call document.execCommand with browser API guards for Node environments.
|
|
2090
|
+
*/
|
|
2091
|
+
declare function sbContentEditable(): {
|
|
2092
|
+
content: () => string;
|
|
2093
|
+
setContent: (html: string) => void;
|
|
2094
|
+
isFocused: () => boolean;
|
|
2095
|
+
setFocused: (v: boolean) => void;
|
|
2096
|
+
execCommand: (command: string, value?: string) => void;
|
|
2097
|
+
bold: () => void;
|
|
2098
|
+
italic: () => void;
|
|
2099
|
+
underline: () => void;
|
|
2100
|
+
};
|
|
2101
|
+
|
|
2102
|
+
interface DatePickerOptions {
|
|
2103
|
+
initialDate?: Date;
|
|
2104
|
+
minDate?: Date;
|
|
2105
|
+
maxDate?: Date;
|
|
2106
|
+
}
|
|
2107
|
+
declare function createDatePicker(options?: DatePickerOptions): {
|
|
2108
|
+
selectedDate: () => Date | null;
|
|
2109
|
+
select: (date: Date) => void;
|
|
2110
|
+
viewDate: () => Date;
|
|
2111
|
+
setViewDate: (date: Date) => void;
|
|
2112
|
+
nextMonth: () => void;
|
|
2113
|
+
prevMonth: () => void;
|
|
2114
|
+
nextYear: () => void;
|
|
2115
|
+
prevYear: () => void;
|
|
2116
|
+
daysInMonth: () => Array<{
|
|
2117
|
+
date: Date;
|
|
2118
|
+
isCurrentMonth: boolean;
|
|
2119
|
+
isToday: boolean;
|
|
2120
|
+
isSelected: boolean;
|
|
2121
|
+
isDisabled: boolean;
|
|
2122
|
+
}>;
|
|
2123
|
+
isDateDisabled: (date: Date) => boolean;
|
|
2124
|
+
};
|
|
2125
|
+
|
|
2126
|
+
/** MobX autorun disposer function type. */
|
|
2127
|
+
type MobXReactionDisposer = () => void;
|
|
2128
|
+
interface MobXAdapterOptions {
|
|
2129
|
+
/** MobX's autorun function — passed to avoid importing MobX directly. */
|
|
2130
|
+
autorun: (view: () => void) => MobXReactionDisposer;
|
|
2131
|
+
}
|
|
2132
|
+
interface MobXAdapterAPI {
|
|
2133
|
+
/**
|
|
2134
|
+
* Bridge a MobX observable into a SibuJS reactive getter.
|
|
2135
|
+
*
|
|
2136
|
+
* Takes a MobX expression (function reading MobX observables)
|
|
2137
|
+
* and returns a SibuJS getter that updates when the observables change.
|
|
2138
|
+
*/
|
|
2139
|
+
fromMobX: <T>(expression: () => T) => () => T;
|
|
2140
|
+
/**
|
|
2141
|
+
* Bridge a SibuJS getter into a MobX reaction.
|
|
2142
|
+
*
|
|
2143
|
+
* Runs a callback whenever a SibuJS signal changes.
|
|
2144
|
+
*/
|
|
2145
|
+
toMobX: (sibuGetter: () => unknown, callback: (value: unknown) => void) => () => void;
|
|
2146
|
+
/** Dispose all active bridges. */
|
|
2147
|
+
destroy: () => void;
|
|
2148
|
+
}
|
|
2149
|
+
/**
|
|
2150
|
+
* Creates a MobX adapter plugin for SibuJS.
|
|
2151
|
+
*
|
|
2152
|
+
* Unlike Redux/Zustand, MobX has distributed observables rather than
|
|
2153
|
+
* a single store. The adapter provides `fromMobX()` to bridge any
|
|
2154
|
+
* MobX expression into a SibuJS reactive getter.
|
|
2155
|
+
*
|
|
2156
|
+
* @example
|
|
2157
|
+
* ```ts
|
|
2158
|
+
* import { createMobXAdapter } from "sibu/extras";
|
|
2159
|
+
* import { autorun, makeAutoObservable } from "mobx";
|
|
2160
|
+
*
|
|
2161
|
+
* class TodoStore {
|
|
2162
|
+
* todos: string[] = [];
|
|
2163
|
+
* constructor() { makeAutoObservable(this); }
|
|
2164
|
+
* addTodo(t: string) { this.todos.push(t); }
|
|
2165
|
+
* }
|
|
2166
|
+
*
|
|
2167
|
+
* const todoStore = new TodoStore();
|
|
2168
|
+
* const plugin = createMobXAdapter({ autorun });
|
|
2169
|
+
* sbPlugin(plugin);
|
|
2170
|
+
*
|
|
2171
|
+
* const mobx = inject<MobXAdapterAPI>("mobx");
|
|
2172
|
+
* const todoCount = mobx.fromMobX(() => todoStore.todos.length);
|
|
2173
|
+
* div({ nodes: () => `Todos: ${todoCount()}` });
|
|
2174
|
+
* ```
|
|
2175
|
+
*/
|
|
2176
|
+
declare function createMobXAdapter(options: MobXAdapterOptions): SibuPlugin;
|
|
2177
|
+
|
|
2178
|
+
/** Minimal Redux store interface (peer dependency — no import from redux). */
|
|
2179
|
+
interface ReduxStore<S = unknown> {
|
|
2180
|
+
getState(): S;
|
|
2181
|
+
dispatch(action: unknown): unknown;
|
|
2182
|
+
subscribe(listener: () => void): () => void;
|
|
2183
|
+
}
|
|
2184
|
+
interface ReduxAdapterOptions<S = unknown> {
|
|
2185
|
+
store: ReduxStore<S>;
|
|
2186
|
+
}
|
|
2187
|
+
interface ReduxAdapterAPI<S = unknown> {
|
|
2188
|
+
/** Full store state as a SibuJS reactive getter */
|
|
2189
|
+
getState: () => S;
|
|
2190
|
+
/** Create a SibuJS reactive getter from a Redux selector */
|
|
2191
|
+
useSelector: <R>(selector: (state: S) => R) => () => R;
|
|
2192
|
+
/** Dispatch an action to the Redux store */
|
|
2193
|
+
dispatch: ReduxStore<S>["dispatch"];
|
|
2194
|
+
/** Unsubscribe from the Redux store */
|
|
2195
|
+
destroy: () => void;
|
|
2196
|
+
}
|
|
2197
|
+
/**
|
|
2198
|
+
* Creates a Redux adapter plugin for SibuJS.
|
|
2199
|
+
*
|
|
2200
|
+
* Bridges Redux store subscriptions into SibuJS signal-based reactivity.
|
|
2201
|
+
* Each selector becomes a reactive getter that auto-updates when Redux
|
|
2202
|
+
* state changes.
|
|
2203
|
+
*
|
|
2204
|
+
* @example
|
|
2205
|
+
* ```ts
|
|
2206
|
+
* import { createReduxAdapter } from "sibu/extras";
|
|
2207
|
+
* import { createStore } from "redux";
|
|
2208
|
+
*
|
|
2209
|
+
* const reduxStore = createStore(rootReducer);
|
|
2210
|
+
* const reduxPlugin = createReduxAdapter({ store: reduxStore });
|
|
2211
|
+
* sbPlugin(reduxPlugin);
|
|
2212
|
+
*
|
|
2213
|
+
* const redux = inject<ReduxAdapterAPI>("redux");
|
|
2214
|
+
* const count = redux.useSelector(s => s.counter);
|
|
2215
|
+
* div({ nodes: () => `Count: ${count()}` });
|
|
2216
|
+
* ```
|
|
2217
|
+
*/
|
|
2218
|
+
declare function createReduxAdapter<S>(options: ReduxAdapterOptions<S>): SibuPlugin;
|
|
2219
|
+
|
|
2220
|
+
/** Minimal Zustand store interface (peer dependency). */
|
|
2221
|
+
interface ZustandStore<S> {
|
|
2222
|
+
getState(): S;
|
|
2223
|
+
setState(partial: Partial<S> | ((state: S) => Partial<S>), replace?: boolean): void;
|
|
2224
|
+
subscribe(listener: (state: S, prevState: S) => void): () => void;
|
|
2225
|
+
destroy(): void;
|
|
2226
|
+
}
|
|
2227
|
+
interface ZustandAdapterOptions<S> {
|
|
2228
|
+
store: ZustandStore<S>;
|
|
2229
|
+
}
|
|
2230
|
+
interface ZustandAdapterAPI<S> {
|
|
2231
|
+
/** Full Zustand state as a SibuJS reactive getter */
|
|
2232
|
+
getState: () => S;
|
|
2233
|
+
/** Create a SibuJS reactive getter from a Zustand selector */
|
|
2234
|
+
useSelector: <R>(selector: (state: S) => R) => () => R;
|
|
2235
|
+
/** Set state on the Zustand store */
|
|
2236
|
+
setState: ZustandStore<S>["setState"];
|
|
2237
|
+
/** Destroy the subscription and the Zustand store */
|
|
2238
|
+
destroy: () => void;
|
|
2239
|
+
}
|
|
2240
|
+
/**
|
|
2241
|
+
* Creates a Zustand adapter plugin for SibuJS.
|
|
2242
|
+
*
|
|
2243
|
+
* @example
|
|
2244
|
+
* ```ts
|
|
2245
|
+
* import { createZustandAdapter } from "sibu/extras";
|
|
2246
|
+
* import { createStore } from "zustand/vanilla";
|
|
2247
|
+
*
|
|
2248
|
+
* const bearStore = createStore((set) => ({
|
|
2249
|
+
* bears: 0,
|
|
2250
|
+
* increase: () => set((s) => ({ bears: s.bears + 1 })),
|
|
2251
|
+
* }));
|
|
2252
|
+
*
|
|
2253
|
+
* const plugin = createZustandAdapter({ store: bearStore });
|
|
2254
|
+
* sbPlugin(plugin);
|
|
2255
|
+
*
|
|
2256
|
+
* const zs = inject<ZustandAdapterAPI>("zustand");
|
|
2257
|
+
* const bears = zs.useSelector(s => s.bears);
|
|
2258
|
+
* div({ nodes: () => `Bears: ${bears()}` });
|
|
2259
|
+
* ```
|
|
2260
|
+
*/
|
|
2261
|
+
declare function createZustandAdapter<S>(options: ZustandAdapterOptions<S>): SibuPlugin;
|
|
2262
|
+
|
|
2263
|
+
interface ThemeConfig {
|
|
2264
|
+
/** CSS class prefix for the design system (e.g., "mdc", "ant", "chakra") */
|
|
2265
|
+
prefix: string;
|
|
2266
|
+
/** CSS variables to inject as custom properties */
|
|
2267
|
+
variables?: Record<string, string>;
|
|
2268
|
+
/** Overrides for default class mappings */
|
|
2269
|
+
classOverrides?: Record<string, string>;
|
|
2270
|
+
}
|
|
2271
|
+
interface ThemeAPI {
|
|
2272
|
+
/** Get the current theme config reactively */
|
|
2273
|
+
config: () => ThemeConfig;
|
|
2274
|
+
/** Update the theme */
|
|
2275
|
+
setTheme: (config: Partial<ThemeConfig>) => void;
|
|
2276
|
+
/** Resolve a component class name using prefix and overrides */
|
|
2277
|
+
resolveClass: (component: string, variant?: string) => string;
|
|
2278
|
+
}
|
|
2279
|
+
/**
|
|
2280
|
+
* Creates a reactive theme for a UI component library adapter.
|
|
2281
|
+
*/
|
|
2282
|
+
declare function createTheme(initial: ThemeConfig): ThemeAPI;
|
|
2283
|
+
interface ComponentMapping {
|
|
2284
|
+
/** HTML tag to use (default: "div") */
|
|
2285
|
+
tag?: string;
|
|
2286
|
+
/** Base CSS class for this component */
|
|
2287
|
+
baseClass: string;
|
|
2288
|
+
/** Variant-to-class mapping */
|
|
2289
|
+
variants?: Record<string, string>;
|
|
2290
|
+
/** Size-to-class mapping */
|
|
2291
|
+
sizes?: Record<string, string>;
|
|
2292
|
+
/** Additional default props */
|
|
2293
|
+
defaultProps?: Partial<TagProps>;
|
|
2294
|
+
}
|
|
2295
|
+
interface AdapterConfig {
|
|
2296
|
+
/** Name of the CSS framework */
|
|
2297
|
+
name: string;
|
|
2298
|
+
/** CSS class prefix */
|
|
2299
|
+
prefix: string;
|
|
2300
|
+
/** Component mappings */
|
|
2301
|
+
components: Record<string, ComponentMapping>;
|
|
2302
|
+
}
|
|
2303
|
+
interface AdaptedComponentProps extends TagProps {
|
|
2304
|
+
/** Component variant (e.g., "primary", "outlined") */
|
|
2305
|
+
variant?: string;
|
|
2306
|
+
/** Component size (e.g., "sm", "md", "lg") */
|
|
2307
|
+
size?: string;
|
|
2308
|
+
}
|
|
2309
|
+
type AdaptedComponent = (props?: AdaptedComponentProps) => Element;
|
|
2310
|
+
/**
|
|
2311
|
+
* Creates a set of SibuJS components from a CSS framework's class mappings.
|
|
2312
|
+
*
|
|
2313
|
+
* @example
|
|
2314
|
+
* ```ts
|
|
2315
|
+
* const adapter = createComponentAdapter({
|
|
2316
|
+
* name: "material",
|
|
2317
|
+
* prefix: "mdc",
|
|
2318
|
+
* components: {
|
|
2319
|
+
* Button: {
|
|
2320
|
+
* tag: "button",
|
|
2321
|
+
* baseClass: "mdc-button",
|
|
2322
|
+
* variants: { raised: "mdc-button--raised" },
|
|
2323
|
+
* sizes: { sm: "mdc-button--dense" },
|
|
2324
|
+
* },
|
|
2325
|
+
* },
|
|
2326
|
+
* });
|
|
2327
|
+
*
|
|
2328
|
+
* const { Button } = adapter.components;
|
|
2329
|
+
* Button({ variant: "raised", nodes: "Click me" });
|
|
2330
|
+
* ```
|
|
2331
|
+
*/
|
|
2332
|
+
declare function createComponentAdapter(config: AdapterConfig): {
|
|
2333
|
+
name: string;
|
|
2334
|
+
components: Record<string, AdaptedComponent>;
|
|
2335
|
+
theme: ThemeAPI;
|
|
2336
|
+
};
|
|
2337
|
+
|
|
2338
|
+
declare const antdAdapter: {
|
|
2339
|
+
name: string;
|
|
2340
|
+
components: Record<string, AdaptedComponent>;
|
|
2341
|
+
theme: ThemeAPI;
|
|
2342
|
+
};
|
|
2343
|
+
|
|
2344
|
+
declare const chakraAdapter: {
|
|
2345
|
+
name: string;
|
|
2346
|
+
components: Record<string, AdaptedComponent>;
|
|
2347
|
+
theme: ThemeAPI;
|
|
2348
|
+
};
|
|
2349
|
+
|
|
2350
|
+
declare const materialAdapter: {
|
|
2351
|
+
name: string;
|
|
2352
|
+
components: Record<string, AdaptedComponent>;
|
|
2353
|
+
theme: ThemeAPI;
|
|
2354
|
+
};
|
|
2355
|
+
|
|
2356
|
+
export { type AccordionOptions, type ActionFn, type ActionResult, type AdaptedComponent, type AdaptedComponentProps, type AdapterConfig, type ChunkConfig, type ComboboxOptions, type ComponentMapping, type CustomElementOptions, DOMPool, type DatePickerOptions, type DevToolsEvent, type DevtoolsOverlayOptions, Features, type FieldConfig, type FileUploadOptions, FocusTrap, type FormConfig, type FormField, type FormReturn, Head, type ISROptions, type IntersectionResult, type MaskOptions, type MicroApp, type MicroAppConfig, type MiddlewareFn, type Migration, type MobXAdapterAPI, type MobXAdapterOptions, type MobXReactionDisposer, type NormalizeResult, type NormalizedEntities, type NormalizedSchema, type NormalizedState, type NormalizedStoreActions, type PluginContext, Priority, type PriorityLevel, type ProfilerResult, type ReactiveNodeInfo, type ReduxAdapterAPI, type ReduxAdapterOptions, type ReduxStore, type SSGOptions, type SSGResult, type ScrollRestorationOptions, type SelectOptions, type SemVer, type ServiceWorkerState, type SharedScope, SibuError, type SibuPlugin, type TabsOptions, type ThemeAPI, type ThemeConfig, type Toast, type UseWorkerFnReturn, type UseWorkerReturn, VERSION, type ValidatorFn, VirtualList, type VirtualListProps, type WasmConfig, type WasmModuleState, type WorkerPool, type ZustandAdapterAPI, type ZustandAdapterOptions, type ZustandStore, announce, antdAdapter, bindAttrs, bindBoolAttr, bindData, block, bundlerMetadata, chakraAdapter, checkCompatibility, checkLeaks, clearDebugValues, clearHMRState, clearPerformanceData, clearWasmCache, cloneTemplate, collectStream, compareSemVer, composeMiddleware, conditional, createAccordion, createAction, createBootSequence, createBundle, createChunkRegistry, createCombobox, createComponentAdapter, createDatePicker, createDevtoolsOverlay, createErrorReporter, createEventBus, createFileUpload, createHMRBoundary, createISR, createMicroApp, createMiddlewareChain, createMigrationRunner, createMobXAdapter, createModuleRegistry, createNormalizedStore, createPlugin, createPopover, createProfiler, createReduxAdapter, createSSRCache, createSelect, createSharedScope, createTabs, createTestHarness, createTheme, createTooltip, createWasmBridge, createWorkerPool, createZustandAdapter, creditCardMask, custom, dateMask, debugLog, deferNonCritical, defineElement, defineRemoteComponent, denormalize, deserializeState, devOnly, disableDebug, domPool, email, enableDebug, env, flushScheduler, formatError, generateStaticSite, getActiveDevTools, getDebugValues, getDependencies, getPerformanceReport, getSignalName, getSubscriberCount, healthCheck, hoistable, hydrate, hydrateIslands, hydrateProgressively, initDevTools, inject, inspectSignal, isDebugEnabled, isHMRAvailable, isWasmCached, island, lazyChunk, lazyLoad, lazyModule, loadRemoteModule, loadWasmModule, matchesPattern, materialAdapter, max, maxLength, measureRender, min, minLength, noSideEffect, normalize, packageInfo, parseSemVer, pendingTasks, phoneMask, precompile, prefetch, preloadCritical, preloadImage, preloadModule, preloadModules, preloadResource, preloadWasm, prerenderRoutes, processInChunks, pure, registerHMR, removeScopedStyle, renderToDocument, renderToReadableStream, renderToStream, renderToString, renderToSuspenseStream, required, resetIdCounter, resetPlugins, resetSSRState, runCleanups, satisfies, sbAria, sbContentEditable, sbDebugValue, sbDeferredValue, sbDevState, sbDialog, sbFocus, sbForm, sbHMRState, sbHotkey, sbId, sbInfiniteScroll, sbInputMask, sbIntersection, sbPagination, sbPerformance, sbPlugin, sbScrollRestoration, sbServiceWorker, sbToast, sbTransitionState, sbWasm, sbWorker, sbWorkerFn, scheduleUpdate, scopedStyle, serializeState, setCanonical, setIdPrefix, setStructuredData, ssnMask, ssrSuspense, startMeasure, startTransition, staticTemplate, suspenseSwapScript, svgElement, timeMask, trackCleanup, triggerPluginError, triggerPluginMount, triggerPluginUnmount, walkDependencyGraph, withErrorTracking, withScopedStyle, yieldToMain, zipMask };
|