@vertz/ui 0.2.23 → 0.2.24

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.
@@ -117,6 +117,24 @@ declare function createContext<T>(defaultValue?: T, __stableId?: string): Contex
117
117
  * Returns the default value if no Provider is active.
118
118
  */
119
119
  declare function useContext<T>(ctx: Context<T>): UnwrapSignals<T> | undefined;
120
+ /** Props for error fallback components (shared by DefaultErrorFallback and route errorComponent). */
121
+ interface ErrorFallbackProps {
122
+ error: Error;
123
+ retry: () => void;
124
+ }
125
+ /**
126
+ * Framework-provided error fallback component.
127
+ *
128
+ * Renders a simple error display with the error message and a "Try again" button.
129
+ * Works without any theme registered — uses inline styles for a clean default look.
130
+ *
131
+ * Exported from `@vertz/ui` (not `@vertz/ui/components`) because it is a
132
+ * framework-level component, not a theme-provided one.
133
+ *
134
+ * Uses imperative DOM instead of JSX because `@vertz/ui` is a core package
135
+ * without the Vertz compiler plugin — `.ts` files don't go through JSX transforms.
136
+ */
137
+ declare function DefaultErrorFallback({ error, retry }: ErrorFallbackProps): HTMLElement;
120
138
  /** DOM element types accepted by JSX (mirrors JSX.Element). */
121
139
  type JsxElement = HTMLElement | SVGElement | DocumentFragment;
122
140
  /** Props for the ErrorBoundary component. */
@@ -160,6 +178,15 @@ interface ForeignProps {
160
178
  * For SVG tags, cast to the appropriate SVG element type.
161
179
  */
162
180
  onReady?: (container: HTMLElement | SVGElement) => (() => void) | void;
181
+ /**
182
+ * Pre-rendered HTML content to inject during SSR.
183
+ * Only takes effect during server-side rendering — on the client,
184
+ * the SSR content is already in the DOM and preserved by hydration.
185
+ *
186
+ * Use this for content that can be pre-rendered on the server
187
+ * (e.g. syntax-highlighted code) to avoid a flash on first paint.
188
+ */
189
+ html?: string;
163
190
  /** Element id */
164
191
  id?: string;
165
192
  /** CSS class name */
@@ -182,7 +209,7 @@ interface ForeignProps {
182
209
  * Implemented as a hand-written `.ts` component (no JSX, no compiler transforms)
183
210
  * because it's a framework primitive that uses `__element()` directly.
184
211
  */
185
- declare function Foreign({ tag, onReady, id, className, style }: ForeignProps): Element;
212
+ declare function Foreign({ tag, onReady, html, id, className, style }: ForeignProps): Element;
186
213
  /**
187
214
  * Runs callback once on mount. Never re-executes.
188
215
  * Return a function to register cleanup that runs on unmount.
@@ -585,8 +612,12 @@ interface ThemeProviderProps {
585
612
  *
586
613
  * Uses __element() directly (instead of jsx()) so the hydration cursor
587
614
  * walker can claim the existing SSR node during mount().
615
+ *
616
+ * Accepts `props` without destructuring so that the compiler-generated
617
+ * getter for `theme` stays alive — `__attr()` reads it inside a domEffect,
618
+ * making the attribute reactive when the parent passes a signal-backed value.
588
619
  */
589
- declare function ThemeProvider({ theme, children }: ThemeProviderProps): HTMLElement;
620
+ declare function ThemeProvider(props: ThemeProviderProps): HTMLElement;
590
621
  /**
591
622
  * A record of variant names to their possible values (each value maps to style entries).
592
623
  *
@@ -626,6 +657,9 @@ interface VariantFunction<V extends VariantDefinitions> {
626
657
  */
627
658
  declare function variants<V extends VariantDefinitions>(config: VariantsConfig<V>): VariantFunction<V>;
628
659
  declare const DialogStackContext: Context<DialogStack>;
660
+ declare const DialogHandleContext: Context<DialogHandle<unknown>>;
661
+ declare const DialogIdContext: Context<string>;
662
+ declare function useDialog<T = void>(): DialogHandle<T>;
629
663
  declare function useDialogStack(): DialogStack;
630
664
  interface DialogHandle<TResult> {
631
665
  close(...args: void extends TResult ? [] : [result: TResult]): void;
@@ -642,19 +676,42 @@ type DialogResult<T> = {
642
676
  } | {
643
677
  readonly ok: false;
644
678
  };
679
+ interface DialogOpenOptions {
680
+ /** Whether the dialog can be dismissed by backdrop click or Escape. Default: true */
681
+ dismissible?: boolean;
682
+ }
683
+ interface ConfirmOptions {
684
+ title: string;
685
+ description?: string;
686
+ confirm?: string;
687
+ cancel?: string;
688
+ intent?: "primary" | "danger";
689
+ dismissible?: boolean;
690
+ }
645
691
  interface DialogStack {
646
692
  open<
647
693
  TResult,
648
694
  TProps
649
- >(component: DialogComponent<TResult, TProps>, props: TProps): Promise<DialogResult<TResult>>;
695
+ >(component: DialogComponent<TResult, TProps>, props: TProps, options?: DialogOpenOptions): Promise<DialogResult<TResult>>;
650
696
  /** @internal — used by useDialogStack() to pass captured context scope */
651
697
  openWithScope<
652
698
  TResult,
653
699
  TProps
654
- >(component: DialogComponent<TResult, TProps>, props: TProps, scope: ContextScope | null): Promise<DialogResult<TResult>>;
700
+ >(component: DialogComponent<TResult, TProps>, props: TProps, scope: ContextScope | null, options?: DialogOpenOptions): Promise<DialogResult<TResult>>;
701
+ confirm(options: ConfirmOptions): Promise<boolean>;
655
702
  readonly size: number;
656
703
  closeAll(): void;
657
704
  }
705
+ /**
706
+ * Manages the dialog container element and provides DialogStack via context.
707
+ *
708
+ * Creates a hydration-safe container div via `__element`, initializes the
709
+ * dialog stack, and wraps children in `DialogStackContext.Provider`.
710
+ * The container renders after children — dialogs portal into it.
711
+ */
712
+ declare function DialogStackProvider({ children }: {
713
+ children?: unknown;
714
+ }): HTMLElement;
658
715
  declare function createDialogStack(container: HTMLElement): DialogStack;
659
716
  /**
660
717
  * Brand symbol for render nodes.
@@ -930,6 +987,37 @@ interface FormDataOptions {
930
987
  * "true"/"false" become booleans.
931
988
  */
932
989
  declare function formDataToObject(formData: FormData, options?: FormDataOptions): Record<string, unknown>;
990
+ type DateInput = Date | string | number;
991
+ interface FormatRelativeTimeOptions {
992
+ /** BCP 47 locale tag. Defaults to user's locale via Intl defaults. */
993
+ locale?: string;
994
+ /** Intl.RelativeTimeFormat numeric option. Defaults to 'auto'. */
995
+ numeric?: "auto" | "always";
996
+ /** Reference time for "now". Defaults to `new Date()`. Useful for testing. */
997
+ now?: Date;
998
+ }
999
+ declare function formatRelativeTime(date: DateInput, options?: FormatRelativeTimeOptions): string;
1000
+ interface RelativeTimeProps {
1001
+ /** The date to format. Accepts Date, ISO string, or epoch ms. */
1002
+ date: DateInput;
1003
+ /** BCP 47 locale tag. */
1004
+ locale?: string;
1005
+ /** Intl.RelativeTimeFormat numeric option. Defaults to 'auto'. */
1006
+ numeric?: "auto" | "always";
1007
+ /** Update interval in ms. Defaults to adaptive. */
1008
+ updateInterval?: number;
1009
+ /** CSS class name for the <time> element. */
1010
+ className?: string;
1011
+ /** Title attribute (shown on hover). Defaults to full formatted date. Set to false to disable. */
1012
+ title?: string | false;
1013
+ }
1014
+ /**
1015
+ * Auto-updating relative time component.
1016
+ * Renders a `<time>` element with the formatted relative time.
1017
+ * Uses `setTimeout` chains with adaptive intervals for live updates.
1018
+ * Timer starts in `onMount()` — safe for SSR (skipped on server).
1019
+ */
1020
+ declare function RelativeTime({ date, locale, numeric, updateInterval, className, title }: RelativeTimeProps): HTMLTimeElement;
933
1021
  /** A function returning a dynamic import of a component module. */
934
1022
  type ComponentLoader = () => Promise<{
935
1023
  default: ComponentFunction;
@@ -1072,6 +1160,16 @@ declare function invalidate<
1072
1160
  T,
1073
1161
  E
1074
1162
  >(descriptor: QueryDescriptor<T, E>): void;
1163
+ /**
1164
+ * Invalidate all active queries targeting tenant-scoped entities.
1165
+ * Clears cached data first (no SWR stale window), then refetches.
1166
+ *
1167
+ * Called automatically by TenantProvider after switchTenant() succeeds.
1168
+ * Can also be called manually if needed.
1169
+ *
1170
+ * No-op during SSR.
1171
+ */
1172
+ declare function invalidateTenantQueries(): void;
1075
1173
  import { EntityQueryMeta as EntityQueryMeta2, QueryDescriptor as QueryDescriptor2 } from "@vertz/fetch";
1076
1174
  /** Options for query(). */
1077
1175
  interface QueryOptions<T> {
@@ -1079,8 +1177,6 @@ interface QueryOptions<T> {
1079
1177
  initialData?: T;
1080
1178
  /** Debounce re-fetches triggered by reactive dependency changes (ms). */
1081
1179
  debounce?: number;
1082
- /** When false, the query will not fetch. Defaults to true. */
1083
- enabled?: boolean;
1084
1180
  /** Explicit cache key. When omitted, derived from the thunk. */
1085
1181
  key?: string;
1086
1182
  /** Custom cache store. Defaults to a shared in-memory Map. */
@@ -1114,6 +1210,8 @@ interface QueryResult<
1114
1210
  readonly revalidating: Unwrapped<ReadonlySignal<boolean>>;
1115
1211
  /** The error from the latest failed fetch, or undefined. */
1116
1212
  readonly error: Unwrapped<ReadonlySignal<E | undefined>>;
1213
+ /** True when the query has never fetched (thunk returned null or not yet run). */
1214
+ readonly idle: Unwrapped<ReadonlySignal<boolean>>;
1117
1215
  /** Manually trigger a refetch (clears cache for this key). */
1118
1216
  refetch: () => void;
1119
1217
  /** Alias for refetch — revalidate the cached data. */
@@ -1135,7 +1233,11 @@ declare function query<
1135
1233
  T,
1136
1234
  E
1137
1235
  >(descriptor: QueryDescriptor2<T, E>, options?: Omit<QueryOptions<T>, "key">): QueryResult<T, E>;
1138
- declare function query<T>(thunk: () => Promise<T>, options?: QueryOptions<T>): QueryResult<T>;
1236
+ declare function query<
1237
+ T,
1238
+ E
1239
+ >(thunk: () => QueryDescriptor2<T, E> | null, options?: Omit<QueryOptions<T>, "key">): QueryResult<T, E>;
1240
+ declare function query<T>(thunk: () => Promise<T> | null, options?: QueryOptions<T>): QueryResult<T>;
1139
1241
  interface QueryMatchHandlers<
1140
1242
  T,
1141
1243
  E
@@ -1260,7 +1362,10 @@ interface RouteConfig<
1260
1362
  signal: AbortSignal;
1261
1363
  }) => Promise<TLoaderData> | TLoaderData;
1262
1364
  /** Optional error component rendered when loader throws. */
1263
- errorComponent?: (error: Error) => Node;
1365
+ errorComponent?: (props: {
1366
+ error: Error;
1367
+ retry: () => void;
1368
+ }) => Node;
1264
1369
  /** Optional path params schema for validation/parsing. */
1265
1370
  params?: ParamSchema<TParams>;
1266
1371
  /** Optional search params schema for validation/coercion. */
@@ -1298,7 +1403,10 @@ interface RouteConfigLike {
1298
1403
  params: Record<string, string>;
1299
1404
  signal: AbortSignal;
1300
1405
  }): unknown;
1301
- errorComponent?: (error: Error) => Node;
1406
+ errorComponent?: (props: {
1407
+ error: Error;
1408
+ retry: () => void;
1409
+ }) => Node;
1302
1410
  params?: ParamSchema<unknown>;
1303
1411
  searchParams?: SearchParamSchema<unknown>;
1304
1412
  children?: Record<string, RouteConfigLike>;
@@ -1332,7 +1440,10 @@ interface CompiledRoute {
1332
1440
  params: Record<string, string>;
1333
1441
  signal: AbortSignal;
1334
1442
  }) => Promise<unknown> | unknown;
1335
- errorComponent?: RouteConfig["errorComponent"];
1443
+ errorComponent?: (props: {
1444
+ error: Error;
1445
+ retry: () => void;
1446
+ }) => Node;
1336
1447
  /** Optional path params schema for validation/parsing. */
1337
1448
  params?: ParamSchema<unknown>;
1338
1449
  searchParams?: RouteConfig["searchParams"];
@@ -1550,9 +1661,18 @@ declare function useRouter<T extends Record<string, RouteConfigLike> = RouteDefi
1550
1661
  */
1551
1662
  declare function useParams<TPath extends string = string>(): ExtractParams<TPath>;
1552
1663
  declare function useParams<T extends Record<string, unknown>>(): T;
1664
+ /** Error fallback component signature, reuses ErrorFallbackProps from DefaultErrorFallback. */
1665
+ type ErrorFallbackFn = (props: ErrorFallbackProps) => Node;
1553
1666
  interface RouterViewProps {
1554
1667
  router: Router;
1668
+ /** Rendered when no route matches (404). */
1555
1669
  fallback?: () => Node;
1670
+ /**
1671
+ * Global error fallback for all routes. When set, every route component is
1672
+ * automatically wrapped in an ErrorBoundary using this fallback.
1673
+ * Per-route `errorComponent` takes precedence over this.
1674
+ */
1675
+ errorFallback?: ErrorFallbackFn;
1556
1676
  }
1557
1677
  /**
1558
1678
  * Renders the matched route's component inside a container div.
@@ -1565,7 +1685,7 @@ interface RouterViewProps {
1565
1685
  * domEffect runs the component factory (to attach reactivity/event handlers)
1566
1686
  * but skips clearing the container.
1567
1687
  */
1568
- declare function RouterView({ router, fallback }: RouterViewProps): HTMLElement;
1688
+ declare function RouterView({ router, fallback, errorFallback }: RouterViewProps): HTMLElement;
1569
1689
  /**
1570
1690
  * Parse URLSearchParams into a typed object, optionally through a schema.
1571
1691
  *
@@ -1591,6 +1711,12 @@ declare class DisposalScopeError extends Error {
1591
1711
  constructor();
1592
1712
  }
1593
1713
  /**
1714
+ * Register a cleanup function with the current disposal scope.
1715
+ * Throws `DisposalScopeError` if no scope is active — fail-fast
1716
+ * so developers know their cleanup callback was not registered.
1717
+ */
1718
+ declare function onCleanup(fn: DisposeFn): void;
1719
+ /**
1594
1720
  * Group multiple signal writes into a single update flush.
1595
1721
  * Nested batches are supported — only the outermost batch triggers the flush.
1596
1722
  */
@@ -1830,6 +1956,7 @@ declare class QueryEnvelopeStore {
1830
1956
  private _envelopes;
1831
1957
  get(queryKey: string): QueryEnvelope | undefined;
1832
1958
  set(queryKey: string, envelope: QueryEnvelope): void;
1959
+ delete(queryKey: string): void;
1833
1960
  clear(): void;
1834
1961
  }
1835
1962
  /** Get the global EntityStore singleton. */
@@ -1954,4 +2081,4 @@ interface RegisterThemeInput {
1954
2081
  * ```
1955
2082
  */
1956
2083
  declare function registerTheme(resolved: RegisterThemeInput): void;
1957
- export { zoomOut, zoomIn, variants, validate, useSearchParams, useRouter, useParams, useDialogStack, useContext, untrack, slideOutToTop, slideOutToRight, slideOutToLeft, slideOutToBottom, slideInFromTop, slideInFromRight, slideInFromLeft, slideInFromBottom, signal, setAdapter, s, resolveChildren, resetRelationSchemas_TEST_ONLY, resetInjectedStyles, registerTheme, registerRelationSchema, ref, queryMatch, query, parseSearchParams, palettes, onMount2 as onMount, onAnimationsComplete, mount, keyframes, isRenderNode, isQueryDescriptor, isBrowser, invalidate, injectCSS, hydrateIslands, hydrate, globalCss, getRelationSchema, getQueryEnvelopeStore, getInjectedCSS, getEntityStore, getAdapter, formDataToObject, form, font, fadeOut, fadeIn, defineTheme, defineRoutes, css, createTestStore, createRouter, createOptimisticHandler, createLink, createFieldState, createDialogStack, createDOMAdapter, createContext, configureImageOptimizer, computed, compileTheme, compileFonts, children, buildOptimizedUrl, batch, accordionUp, accordionDown, __staticText, __exitChildren, __enterChildren, __element, __append, VariantsConfig, VariantProps, VariantFunction, ValidationResult, UnwrapSignals, TypedRoutes, TypedRouter, ThemeProviderProps, ThemeProvider, ThemeInput, Theme, SuspenseProps, Suspense, StyleValue, StyleEntry, Signal, SerializedStore, SearchParamSchema, SdkMethodWithMeta, SdkMethod, RouterViewProps, RouterView, RouterOptions, RouterContext, Router, RoutePattern, RoutePaths, RouteMatch, RouteDefinitionMap, RouteConfig, RenderText, RenderNode, RenderElement, RenderAdapter, RelationSchema, RelationFieldDef, RegisterThemeInput, Ref, ReadonlySignal, RENDER_NODE_BRAND, QueryResult, QueryOptions, QueryMatchHandlers, QueryEnvelopeStore, QueryEnvelope, QueryDescriptor3 as QueryDescriptor, PresenceProps, Presence, PreloadItem, PathWithParams, ParamSchema, OutletContextValue, OutletContext, Outlet, NavigateOptions, NavigateInput, MountOptions, MountHandle, MergeSelectOptions, MatchedRoute, LoaderData, ListTransitionProps, ListTransition, LinkProps, LinkFactoryOptions, Link, IslandRegistry, IslandProps, Island, InferRouteMap, ImageProps, Image, GlobalCSSOutput, GlobalCSSInput, FormSchema, FormOptions, FormInstance, FormDataOptions, ForeignProps, Foreign, FontSrc, FontOptions, FontFallbackMetrics, FontDescriptor, FieldState, FieldSelectionTracker, FallbackFontName, ExtractParams, ErrorBoundaryProps, ErrorBoundary, EntityStoreOptions, EntityStore, DisposeFn, DisposalScopeError, DialogStackContext, DialogStack, DialogResult, DialogHandle, DialogComponent, Context, Computed, ComponentRegistry, ComponentLoader, ComponentFunction, CompiledTheme, CompiledRoute, CompiledFonts, CompileThemeOptions, CompileFontsOptions, ColorPalette, ChildrenAccessor, ChildValue, CacheStore, CSSOutput, CSSInput, ANIMATION_EASING, ANIMATION_DURATION };
2084
+ export { zoomOut, zoomIn, variants, validate, useSearchParams, useRouter, useParams, useDialogStack, useDialog, useContext, untrack, slideOutToTop, slideOutToRight, slideOutToLeft, slideOutToBottom, slideInFromTop, slideInFromRight, slideInFromLeft, slideInFromBottom, signal, setAdapter, s, resolveChildren, resetRelationSchemas_TEST_ONLY, resetInjectedStyles, registerTheme, registerRelationSchema, ref, queryMatch, query, parseSearchParams, palettes, onMount2 as onMount, onCleanup, onAnimationsComplete, mount, keyframes, isRenderNode, isQueryDescriptor, isBrowser, invalidateTenantQueries, invalidate, injectCSS, hydrateIslands, hydrate, globalCss, getRelationSchema, getQueryEnvelopeStore, getInjectedCSS, getEntityStore, getAdapter, formatRelativeTime, formDataToObject, form, font, fadeOut, fadeIn, defineTheme, defineRoutes, css, createTestStore, createRouter, createOptimisticHandler, createLink, createFieldState, createDialogStack, createDOMAdapter, createContext, configureImageOptimizer, computed, compileTheme, compileFonts, children, buildOptimizedUrl, batch, accordionUp, accordionDown, __staticText, __exitChildren, __enterChildren, __element, __append, VariantsConfig, VariantProps, VariantFunction, ValidationResult, UnwrapSignals, TypedRoutes, TypedRouter, ThemeProviderProps, ThemeProvider, ThemeInput, Theme, SuspenseProps, Suspense, StyleValue, StyleEntry, Signal, SerializedStore, SearchParamSchema, SdkMethodWithMeta, SdkMethod, RouterViewProps, RouterView, RouterOptions, RouterContext, Router, RoutePattern, RoutePaths, RouteMatch, RouteDefinitionMap, RouteConfig, RenderText, RenderNode, RenderElement, RenderAdapter, RelativeTimeProps, RelativeTime, RelationSchema, RelationFieldDef, RegisterThemeInput, Ref, ReadonlySignal, RENDER_NODE_BRAND, QueryResult, QueryOptions, QueryMatchHandlers, QueryEnvelopeStore, QueryEnvelope, QueryDescriptor3 as QueryDescriptor, PresenceProps, Presence, PreloadItem, PathWithParams, ParamSchema, OutletContextValue, OutletContext, Outlet, NavigateOptions, NavigateInput, MountOptions, MountHandle, MergeSelectOptions, MatchedRoute, LoaderData, ListTransitionProps, ListTransition, LinkProps, LinkFactoryOptions, Link, IslandRegistry, IslandProps, Island, InferRouteMap, ImageProps, Image, GlobalCSSOutput, GlobalCSSInput, FormatRelativeTimeOptions, FormSchema, FormOptions, FormInstance, FormDataOptions, ForeignProps, Foreign, FontSrc, FontOptions, FontFallbackMetrics, FontDescriptor, FieldState, FieldSelectionTracker, FallbackFontName, ExtractParams, ErrorFallbackProps, ErrorBoundaryProps, ErrorBoundary, EntityStoreOptions, EntityStore, DisposeFn, DisposalScopeError, DialogStackProvider, DialogStackContext, DialogStack, DialogResult, DialogOpenOptions, DialogIdContext, DialogHandleContext, DialogHandle, DialogComponent, DefaultErrorFallback, DateInput, Context, ConfirmOptions, Computed, ComponentRegistry, ComponentLoader, ComponentFunction, CompiledTheme, CompiledRoute, CompiledFonts, CompileThemeOptions, CompileFontsOptions, ColorPalette, ChildrenAccessor, ChildValue, CacheStore, CSSOutput, CSSInput, ANIMATION_EASING, ANIMATION_DURATION };