@vertz/ui 0.2.38 → 0.2.42

package/dist/shared/{chunk-xz8jq6w6.js → chunk-29x7mbne.js}

@@ -20,7 +20,7 @@ import {
   pushScope,
   resumeHydration,
   runCleanups
-} from "./chunk-pmyavtdp.js";
+} from "./chunk-2k26a794.js";
 
 // src/dom/dom-adapter.ts
 function createDOMAdapter() {

package/dist/shared/{chunk-pmyavtdp.js → chunk-2k26a794.js}

@@ -54,6 +54,37 @@ function wrapSignalProps(value) {
   }
   return wrapped;
 }
+function wrapSignalPropsLazy(propsObj, initial) {
+  if (initial == null || typeof initial !== "object" || Array.isArray(initial)) {
+    return wrapSignalProps(initial);
+  }
+  const source = initial;
+  const keys = Object.keys(source);
+  const wrapped = {};
+  for (const key of keys) {
+    const propValue = source[key];
+    if (isSignalLike(propValue)) {
+      Object.defineProperty(wrapped, key, {
+        get() {
+          return propValue.value;
+        },
+        enumerable: true,
+        configurable: true
+      });
+    } else if (typeof propValue === "function") {
+      wrapped[key] = propValue;
+    } else {
+      Object.defineProperty(wrapped, key, {
+        get() {
+          return propsObj.value[key];
+        },
+        enumerable: true,
+        configurable: true
+      });
+    }
+  }
+  return wrapped;
+}
 function asKey(ctx) {
   return ctx;
 }
@@ -87,8 +118,10 @@ function createContext(defaultValue, __stableId) {
         return;
       }
       const props = valueOrProps;
-      const { value: rawValue, children } = props;
-      const value = wrapSignalProps(rawValue);
+      const rawValue = props.value;
+      const { children } = props;
+      const valueDesc = Object.getOwnPropertyDescriptor(props, "value");
+      const value = valueDesc?.get ? wrapSignalPropsLazy(props, rawValue) : wrapSignalProps(rawValue);
       const parentScope = getContextScope();
       const scope = parentScope ? new Map(parentScope) : new Map;
       scope.set(asKey(ctx), value);

package/dist/shared/{chunk-9cbb9fbs.js → chunk-7479q3cz.js}

@@ -1,7 +1,7 @@
 import {
   computed,
   signal
-} from "./chunk-pmyavtdp.js";
+} from "./chunk-2k26a794.js";
 
 // src/form/field-state.ts
 function createFieldState(_name, initialValue) {

package/dist/shared/{chunk-ka8jeq0f.js → chunk-8ft6568m.js}

@@ -3,10 +3,10 @@ import {
 } from "./chunk-jrtrk5z4.js";
 import {
   registerActiveQuery
-} from "./chunk-dvzkge4z.js";
+} from "./chunk-kt7127xc.js";
 import {
   isBrowser
-} from "./chunk-g5vzhext.js";
+} from "./chunk-xs4hak0m.js";
 import {
   _tryOnCleanup,
   batch,
@@ -16,7 +16,7 @@ import {
   setReadValueCallback,
   signal,
   untrack
-} from "./chunk-pmyavtdp.js";
+} from "./chunk-2k26a794.js";
 
 // src/query/cache.ts
 class MemoryCache {

package/dist/shared/{chunk-14vwqf7c.js → chunk-96hnx5jk.js}

@@ -1,9 +1,9 @@
 import {
   injectCSS
-} from "./chunk-veqs3jgz.js";
+} from "./chunk-hgtmh07c.js";
 import {
   createContext
-} from "./chunk-pmyavtdp.js";
+} from "./chunk-2k26a794.js";
 
 // src/dom/animation.ts
 function onAnimationsComplete(el, callback) {

package/dist/shared/{chunk-5eszqmat.js → chunk-abv8ax3j.js}

@@ -3,36 +3,38 @@ import {
   beginDeferringMounts,
   discardDeferredMounts,
   flushDeferredMounts
-} from "./chunk-ksetw5t2.js";
+} from "./chunk-pbw64893.js";
 import {
   __append,
   __classList,
   __element,
   __enterChildren,
   __exitChildren,
-  __staticText
-} from "./chunk-xz8jq6w6.js";
+  __insert
+} from "./chunk-29x7mbne.js";
 import {
   RouterContext
-} from "./chunk-4an2s6d7.js";
+} from "./chunk-dxfd1ptg.js";
 import {
   isBrowser
-} from "./chunk-g5vzhext.js";
+} from "./chunk-xs4hak0m.js";
 import {
   _tryOnCleanup,
   createContext,
   domEffect,
   endHydration,
+  getContextScope,
   getIsHydrating,
   getSSRContext,
   popScope,
   pushScope,
   runCleanups,
+  setContextScope,
   signal,
   startHydration,
   untrack,
   useContext
-} from "./chunk-pmyavtdp.js";
+} from "./chunk-2k26a794.js";
 
 // src/component/error-boundary-context.ts
 var handlerStack = [];
@@ -130,18 +132,7 @@ function createLink(currentPath, navigate, factoryOptions) {
     const el = __element("a", props);
     __on(el, "click", handleClick);
     __enterChildren(el);
-    if (typeof children === "function") {
-      const result = children();
-      if (typeof result === "string") {
-        __append(el, __staticText(result));
-      } else {
-        __append(el, result);
-      }
-    } else if (typeof children === "string") {
-      __append(el, __staticText(children));
-    } else {
-      __append(el, children);
-    }
+    __insert(el, children);
     __exitChildren();
     if (activeClass) {
       __classList(el, {
@@ -190,18 +181,7 @@ function Link({
   const el = __element("a", props);
   __on(el, "click", handleClick);
   __enterChildren(el);
-  if (typeof children === "function") {
-    const result = children();
-    if (typeof result === "string") {
-      __append(el, __staticText(result));
-    } else {
-      __append(el, result);
-    }
-  } else if (typeof children === "string") {
-    __append(el, __staticText(children));
-  } else {
-    __append(el, children);
-  }
+  __insert(el, children);
   __exitChildren();
   if (activeClass) {
     __classList(el, {
@@ -243,6 +223,7 @@ function Outlet() {
       const gen = ++renderGen;
       childCleanups = pushScope();
       if (factory) {
+        const capturedScope = getContextScope();
         const result = factory();
         if (result instanceof Promise) {
           const router = ctx.router;
@@ -252,6 +233,7 @@ function Outlet() {
               return;
             let node;
             childCleanups = pushScope();
+            const prevScope = setContextScope(capturedScope);
             try {
               if (wasHydrating) {
                 beginDeferringMounts();
@@ -287,9 +269,10 @@ function Outlet() {
                 });
               }
             } finally {
+              setContextScope(prevScope);
               popScope();
             }
-          });
+          }).catch(() => {});
         } else {
           __append(container, result);
           if (getIsHydrating() && !container.contains(result)) {
@@ -376,6 +359,7 @@ function RouterView({ router, fallback, errorFallback }) {
         const lazyFallback = match ? match.route.errorComponent ?? errorFallback : undefined;
         let asyncRoute = false;
         RouterContext.Provider(router, () => {
+          const capturedScope = getContextScope();
           const result = rootFactory();
           if (result instanceof Promise) {
             asyncRoute = true;
@@ -385,6 +369,7 @@ function RouterView({ router, fallback, errorFallback }) {
                 return;
               let node;
               pageCleanups = pushScope();
+              const prevScope = setContextScope(capturedScope);
               try {
                 if (wasHydrating) {
                   beginDeferringMounts();
@@ -441,8 +426,24 @@ function RouterView({ router, fallback, errorFallback }) {
                   throw thrown;
                 }
               } finally {
+                setContextScope(prevScope);
                 popScope();
               }
+            }).catch((thrown) => {
+              if (gen !== renderGen)
+                return;
+              if (lazyFallback) {
+                pageCleanups = pushScope();
+                try {
+                  const error = thrown instanceof Error ? thrown : new Error(String(thrown));
+                  while (container.firstChild) {
+                    container.removeChild(container.firstChild);
+                  }
+                  container.appendChild(lazyFallback({ error, retry: () => {} }));
+                } finally {
+                  popScope();
+                }
+              }
             });
           } else {
             if (gen !== renderGen) {

package/dist/shared/{chunk-4an2s6d7.js → chunk-dxfd1ptg.js}

@@ -1,7 +1,7 @@
 import {
   createContext,
   useContext
-} from "./chunk-pmyavtdp.js";
+} from "./chunk-2k26a794.js";
 
 // src/router/router-context.ts
 var RouterContext = createContext(undefined, "@vertz/ui::RouterContext");

package/dist/shared/{chunk-khtsbadc.js → chunk-f0f80gxe.js}

@@ -7,14 +7,14 @@ import {
 } from "./chunk-jrtrk5z4.js";
 import {
   isBrowser
-} from "./chunk-g5vzhext.js";
+} from "./chunk-xs4hak0m.js";
 import {
   batch,
   getReadValueCallback,
   getSSRContext,
   getSubscriber,
   signal
-} from "./chunk-pmyavtdp.js";
+} from "./chunk-2k26a794.js";
 
 // src/router/reactive-search-params.ts
 function shallowEqual(a, b) {

package/dist/shared/{chunk-veqs3jgz.js → chunk-hgtmh07c.js}

@@ -4,10 +4,10 @@ import {
   __element,
   __enterChildren,
   __exitChildren
-} from "./chunk-xz8jq6w6.js";
+} from "./chunk-29x7mbne.js";
 import {
   getSSRContext
-} from "./chunk-pmyavtdp.js";
+} from "./chunk-2k26a794.js";
 
 // src/component/children.ts
 var MAX_RESOLVE_DEPTH = 100;
@@ -88,6 +88,12 @@ var PROPERTY_MAP = {
   overflow: { properties: ["overflow"], valueType: "raw" },
   "overflow-x": { properties: ["overflow-x"], valueType: "raw" },
   "overflow-y": { properties: ["overflow-y"], valueType: "raw" },
+  top: { properties: ["top"], valueType: "raw" },
+  right: { properties: ["right"], valueType: "raw" },
+  bottom: { properties: ["bottom"], valueType: "raw" },
+  left: { properties: ["left"], valueType: "raw" },
+  object: { properties: ["object-fit"], valueType: "raw" },
+  aspect: { properties: ["aspect-ratio"], valueType: "raw" },
   cursor: { properties: ["cursor"], valueType: "raw" },
   transition: { properties: ["transition"], valueType: "raw" },
   resize: { properties: ["resize"], valueType: "raw" },
@@ -655,12 +661,20 @@ function resolveRaw(value, property) {
       return `repeat(${num}, minmax(0, 1fr))`;
     return value;
   }
-  if (property === "inset") {
+  if (property === "inset" || property === "top" || property === "right" || property === "bottom" || property === "left") {
     const spaced = SPACING_SCALE[value];
     if (spaced !== undefined)
       return spaced;
     return value;
   }
+  if (property === "aspect") {
+    const ASPECT_MAP = {
+      square: "1 / 1",
+      video: "16 / 9",
+      photo: "4 / 3"
+    };
+    return ASPECT_MAP[value] ?? value;
+  }
   return value;
 }
 function formatShorthand(parsed) {
@@ -958,6 +972,33 @@ ${cssVars.join(`
   return { fontFaceCss, cssVarsCss, cssVarLines, preloadTags, preloadItems };
 }
 
+// src/css/google-font.ts
+function googleFont(family, options) {
+  const style = options.style ?? "normal";
+  const styles = Array.isArray(style) ? style : [style];
+  const display = options.display ?? "swap";
+  const subsets = options.subsets ?? ["latin"];
+  const weight = typeof options.weight === "number" ? String(options.weight) : options.weight;
+  return {
+    __brand: "FontDescriptor",
+    family,
+    weight: Array.isArray(weight) ? weight.join(";") : String(weight),
+    style: styles[0] ?? "normal",
+    display,
+    src: undefined,
+    fallback: options.fallback ?? [],
+    subsets,
+    adjustFontFallback: options.adjustFontFallback ?? true,
+    __google: {
+      family,
+      weight: options.weight,
+      style: styles,
+      subsets,
+      display
+    }
+  };
+}
+
 // src/css/global-css.ts
 function globalCss(input) {
   const rules = [];
@@ -1247,4 +1288,4 @@ function variants(config) {
   return fn;
 }
 
-export { resolveChildren, children, PROPERTY_MAP, KEYWORD_MAP, DISPLAY_MAP, SPACING_SCALE, RADIUS_SCALE, SHADOW_SCALE, FONT_SIZE_SCALE, FONT_WEIGHT_SCALE, LINE_HEIGHT_SCALE, ALIGNMENT_MAP, SIZE_KEYWORDS, HEIGHT_AXIS_PROPERTIES, COLOR_NAMESPACES, CSS_COLOR_KEYWORDS, CONTENT_MAP, PSEUDO_PREFIXES, PSEUDO_MAP, injectCSS, resetInjectedStyles, getInjectedCSS, css, font, compileFonts, globalCss, s, defineTheme, compileTheme, ThemeProvider, variants };
+export { resolveChildren, children, PROPERTY_MAP, KEYWORD_MAP, DISPLAY_MAP, SPACING_SCALE, RADIUS_SCALE, SHADOW_SCALE, FONT_SIZE_SCALE, FONT_WEIGHT_SCALE, LINE_HEIGHT_SCALE, ALIGNMENT_MAP, SIZE_KEYWORDS, HEIGHT_AXIS_PROPERTIES, COLOR_NAMESPACES, CSS_COLOR_KEYWORDS, CONTENT_MAP, PSEUDO_PREFIXES, PSEUDO_MAP, injectCSS, resetInjectedStyles, getInjectedCSS, css, font, compileFonts, googleFont, globalCss, s, defineTheme, compileTheme, ThemeProvider, variants };

package/dist/shared/{chunk-dvzkge4z.js → chunk-kt7127xc.js}

@@ -1,6 +1,6 @@
 import {
   getSSRContext
-} from "./chunk-pmyavtdp.js";
+} from "./chunk-2k26a794.js";
 
 // src/query/invalidate.ts
 var registry = new Set;

package/dist/shared/{chunk-ksetw5t2.js → chunk-pbw64893.js}

@@ -5,7 +5,7 @@ import {
   pushScope,
   runCleanups,
   untrack
-} from "./chunk-pmyavtdp.js";
+} from "./chunk-2k26a794.js";
 
 // src/component/lifecycle.ts
 var mountFrames = [];

package/dist/shared/{chunk-mwc4v48d.js → chunk-w6a0t2xs.js}

@@ -1,8 +1,7 @@
 // src/theme/registry.ts
-var _components = null;
-var _primitives = null;
+var _resolved = null;
 function registerTheme(resolved) {
-  if (!resolved || typeof resolved !== "object" || !resolved.components || typeof resolved.components !== "object") {
+  if (!resolved || typeof resolved !== "object" || !("components" in resolved) || !resolved.components) {
     throw new Error(`registerTheme() expects an object with a "components" property.
 
 ` + `Example:
@@ -11,11 +10,10 @@ function registerTheme(resolved) {
 ` + `  registerTheme(configureTheme({ palette: 'zinc' }));
 `);
   }
-  _components = resolved.components;
-  _primitives = resolved.components.primitives ?? {};
+  _resolved = resolved;
 }
 function _getComponent(name) {
-  if (!_components) {
+  if (!_resolved) {
     throw new Error(`No theme registered. Call registerTheme() before using components from @vertz/ui/components.
 
 ` + `Example:
@@ -24,13 +22,16 @@ function _getComponent(name) {
 ` + `  registerTheme(configureTheme({ palette: 'zinc' }));
 `);
   }
-  return Reflect.get(_components, name);
+  return Reflect.get(_resolved.components, name);
 }
 function _getPrimitive(name) {
-  if (!_primitives) {
+  if (!_resolved) {
     throw new Error(`No theme registered. Call registerTheme() before using components from @vertz/ui/components.`);
   }
-  return Reflect.get(_primitives, name);
+  const primitives = _resolved.components.primitives;
+  if (!primitives)
+    return;
+  return Reflect.get(primitives, name);
 }
 
 export { registerTheme, _getComponent, _getPrimitive };

package/dist/shared/{chunk-g5vzhext.js → chunk-xs4hak0m.js}

@@ -1,6 +1,6 @@
 import {
   hasSSRResolver
-} from "./chunk-pmyavtdp.js";
+} from "./chunk-2k26a794.js";
 
 // src/env/is-browser.ts
 function isBrowser() {

package/dist/src/auth/public.d.ts

@@ -164,13 +164,22 @@ declare function can(entitlement: Entitlement, entity?: {
 declare function canSignals(entitlement: Entitlement, entity?: {
 	__access?: Record<string, AccessCheckData>;
 }): RawAccessCheck;
-/** Client-side access events (no orgId/userId — server scopes the broadcast) */
+/**
+* Client-side access events.
+*
+* Includes resourceType/resourceId for client-side resource-level filtering.
+* orgId is stripped (routing is server-side only via WebSocket connection keying).
+*/
 type ClientAccessEvent = {
 	type: "access:flag_toggled";
+	resourceType: string;
+	resourceId: string;
 	flag: string;
 	enabled: boolean;
 } | {
 	type: "access:limit_updated";
+	resourceType: string;
+	resourceId: string;
 	entitlement: string;
 	consumed: number;
 	remaining: number;
@@ -179,17 +188,27 @@ type ClientAccessEvent = {
 	type: "access:role_changed";
 } | {
 	type: "access:plan_changed";
+	resourceType: string;
+	resourceId: string;
 } | {
 	type: "access:plan_assigned";
+	resourceType: string;
+	resourceId: string;
 	planId: string;
 } | {
 	type: "access:addon_attached";
+	resourceType: string;
+	resourceId: string;
 	addonId: string;
 } | {
 	type: "access:addon_detached";
+	resourceType: string;
+	resourceId: string;
 	addonId: string;
 } | {
 	type: "access:limit_reset";
+	resourceType: string;
+	resourceId: string;
 	entitlement: string;
 	max: number;
 };

package/dist/src/auth/public.js

@@ -1,12 +1,12 @@
 import {
   RouterContext
-} from "../../shared/chunk-4an2s6d7.js";
+} from "../../shared/chunk-dxfd1ptg.js";
 import {
   invalidateTenantQueries
-} from "../../shared/chunk-dvzkge4z.js";
+} from "../../shared/chunk-kt7127xc.js";
 import {
   isBrowser
-} from "../../shared/chunk-g5vzhext.js";
+} from "../../shared/chunk-xs4hak0m.js";
 import {
   _tryOnCleanup,
   computed,
@@ -14,7 +14,7 @@ import {
   getSSRContext,
   signal,
   useContext
-} from "../../shared/chunk-pmyavtdp.js";
+} from "../../shared/chunk-2k26a794.js";
 
 // src/auth/access-context.ts
 var AccessContext = createContext(undefined, "@vertz/ui::AccessContext");

package/dist/src/components/index.js

@@ -1,7 +1,7 @@
 import {
   _getComponent,
   _getPrimitive
-} from "../../shared/chunk-mwc4v48d.js";
+} from "../../shared/chunk-w6a0t2xs.js";
 
 // src/components/index.ts
 function createComponentProxy(name) {

package/dist/src/css/public.d.ts

@@ -103,6 +103,14 @@ interface FontOptions {
 }
 type FontStyle = "normal" | "italic";
 type FontDisplay = "auto" | "block" | "swap" | "fallback" | "optional";
+/** @internal Metadata for Google Fonts descriptors. Present only on googleFont() results. */
+interface GoogleFontMeta {
+	readonly family: string;
+	readonly weight: string | number | number[];
+	readonly style: FontStyle[];
+	readonly subsets: string[];
+	readonly display: FontDisplay;
+}
 interface FontDescriptor {
 	readonly __brand: "FontDescriptor";
 	readonly family: string;
@@ -114,6 +122,8 @@ interface FontDescriptor {
 	readonly subsets: string[];
 	readonly unicodeRange?: string;
 	readonly adjustFontFallback: boolean | FallbackFontName;
+	/** @internal — Google Fonts metadata. Present only for googleFont() descriptors. */
+	readonly __google?: GoogleFontMeta;
 }
 /** Structured description of a resource to preload. */
 interface PreloadItem {
@@ -150,6 +160,29 @@ declare function font(family: string, options: FontOptions): FontDescriptor;
 * @returns Compiled @font-face CSS, CSS var lines, and preload link tags.
 */
 declare function compileFonts(fonts: Record<string, FontDescriptor>, options?: CompileFontsOptions): CompiledFonts;
+type FontStyle2 = "normal" | "italic";
+type FontDisplay2 = "auto" | "block" | "swap" | "fallback" | "optional";
+interface GoogleFontOptions {
+	/** Weight range ('100..900') or specific weights ([400, 700]). */
+	weight: string | number | number[];
+	/** Font style(s). Default: 'normal'. */
+	style?: FontStyle2 | FontStyle2[];
+	/** font-display strategy. Default: 'swap'. */
+	display?: FontDisplay2;
+	/** Character subsets. Default: ['latin']. */
+	subsets?: string[];
+	/** Fallback fonts. Auto-detected from Google's font category if omitted. */
+	fallback?: string[];
+	/** Enable metric-adjusted fallback @font-face. Default: true. */
+	adjustFontFallback?: boolean;
+}
+/**
+* Declare a Google Font for auto-fetch at dev/build time.
+*
+* Returns a FontDescriptor with `src: undefined` and `__google` metadata.
+* The dev server / build pipeline resolves the metadata to local .woff2 files.
+*/
+declare function googleFont(family: string, options: GoogleFontOptions): FontDescriptor;
 /** Input to globalCss(): selector → property-value map. */
 type GlobalCSSInput = Record<string, Record<string, string>>;
 /** Output of globalCss(): extracted CSS string. */
@@ -301,4 +334,4 @@ interface VariantFunction<V extends VariantDefinitions> {
 * @returns A function that accepts variant props and returns a className string.
 */
 declare function variants<V extends VariantDefinitions>(config: VariantsConfig<V>): VariantFunction<V>;
-export { variants, s, globalCss, font, defineTheme, css, compileTheme, compileFonts, VariantsConfig, VariantProps, VariantFunction, UtilityClass, ThemeProviderProps, ThemeProvider, ThemeInput, Theme, StyleValue, StyleEntry, PreloadItem, GlobalCSSOutput, GlobalCSSInput, FontSrc, FontOptions, FontFallbackMetrics, FontDescriptor, FallbackFontName, CompiledTheme, CompiledFonts, CompileThemeOptions, CompileFontsOptions, CSSOutput, CSSInput };
+export { variants, s, googleFont, globalCss, font, defineTheme, css, compileTheme, compileFonts, VariantsConfig, VariantProps, VariantFunction, UtilityClass, ThemeProviderProps, ThemeProvider, ThemeInput, Theme, StyleValue, StyleEntry, PreloadItem, GoogleFontOptions, GoogleFontMeta, GlobalCSSOutput, GlobalCSSInput, FontSrc, FontOptions, FontFallbackMetrics, FontDescriptor, FallbackFontName, CompiledTheme, CompiledFonts, CompileThemeOptions, CompileFontsOptions, CSSOutput, CSSInput };

package/dist/src/css/public.js

@@ -6,15 +6,17 @@ import {
   defineTheme,
   font,
   globalCss,
+  googleFont,
   s,
   variants
-} from "../../shared/chunk-veqs3jgz.js";
-import"../../shared/chunk-xz8jq6w6.js";
+} from "../../shared/chunk-hgtmh07c.js";
+import"../../shared/chunk-29x7mbne.js";
 import"../../shared/chunk-h1fsr8kv.js";
-import"../../shared/chunk-pmyavtdp.js";
+import"../../shared/chunk-2k26a794.js";
 export {
   variants,
   s,
+  googleFont,
   globalCss,
   font,
   defineTheme,

package/dist/src/form/public.js

@@ -3,8 +3,8 @@ import {
   form,
   formDataToObject,
   validate
-} from "../../shared/chunk-9cbb9fbs.js";
-import"../../shared/chunk-pmyavtdp.js";
+} from "../../shared/chunk-7479q3cz.js";
+import"../../shared/chunk-2k26a794.js";
 export {
   validate,
   formDataToObject,

package/dist/src/index.d.ts

@@ -400,6 +400,14 @@ interface FontOptions {
 }
 type FontStyle = "normal" | "italic";
 type FontDisplay = "auto" | "block" | "swap" | "fallback" | "optional";
+/** @internal Metadata for Google Fonts descriptors. Present only on googleFont() results. */
+interface GoogleFontMeta {
+	readonly family: string;
+	readonly weight: string | number | number[];
+	readonly style: FontStyle[];
+	readonly subsets: string[];
+	readonly display: FontDisplay;
+}
 interface FontDescriptor {
 	readonly __brand: "FontDescriptor";
 	readonly family: string;
@@ -411,6 +419,8 @@ interface FontDescriptor {
 	readonly subsets: string[];
 	readonly unicodeRange?: string;
 	readonly adjustFontFallback: boolean | FallbackFontName;
+	/** @internal — Google Fonts metadata. Present only for googleFont() descriptors. */
+	readonly __google?: GoogleFontMeta;
 }
 /** Structured description of a resource to preload. */
 interface PreloadItem {
@@ -1543,8 +1553,8 @@ declare function defineRoutes<const T extends Record<string, RouteConfigLike>>(m
 interface LinkProps<T extends Record<string, RouteConfigLike> = RouteDefinitionMap> {
 	/** The target URL path. */
 	href: RoutePaths<T>;
-	/** Text or content for the link. Accepts string, Node, or a thunk returning either. */
-	children: string | Node | (() => string | Node);
+	/** Content for the link. Accepts string, Node, arrays, or thunks — same as JSX children. */
+	children: ChildValue;
 	/** Class applied when the link's href matches the current path. */
 	activeClass?: string;
 	/** Static class name for the anchor element. */
@@ -2140,6 +2150,11 @@ interface RegisterThemeInput {
 * Call once at app startup, before any component from `@vertz/ui/components` is used.
 * Calling again replaces the previously registered theme.
 *
+* IMPORTANT: This stores the resolved theme WITHOUT accessing `.components`.
+* Accessing `.components` would trigger eager compilation of all ~40 component
+* styles (~74KB CSS) at startup time. Instead, styles are compiled lazily
+* per-component when first accessed via _getComponent()/_getPrimitive(). (#1979)
+*
 * @example
 * ```ts
 * import { registerTheme } from '@vertz/ui';

package/dist/src/index.js

@@ -1,6 +1,6 @@
 import {
   registerTheme
-} from "../shared/chunk-mwc4v48d.js";
+} from "../shared/chunk-w6a0t2xs.js";
 import {
   ANIMATION_DURATION,
   ANIMATION_EASING,
@@ -25,7 +25,7 @@ import {
   slideOutToTop,
   zoomIn,
   zoomOut
-} from "../shared/chunk-14vwqf7c.js";
+} from "../shared/chunk-96hnx5jk.js";
 import {
   ErrorBoundary,
   Link,
@@ -36,16 +36,16 @@ import {
   getCurrentErrorHandler,
   parseSearchParams,
   useSearchParams
-} from "../shared/chunk-5eszqmat.js";
+} from "../shared/chunk-abv8ax3j.js";
 import {
   beginDeferringMounts,
   discardDeferredMounts,
   flushDeferredMounts,
   onMount
-} from "../shared/chunk-ksetw5t2.js";
+} from "../shared/chunk-pbw64893.js";
 import {
   createRouter
-} from "../shared/chunk-khtsbadc.js";
+} from "../shared/chunk-f0f80gxe.js";
 import {
   defineRoutes
 } from "../shared/chunk-ah86rm07.js";
@@ -54,7 +54,7 @@ import {
   form,
   formDataToObject,
   validate
-} from "../shared/chunk-9cbb9fbs.js";
+} from "../shared/chunk-7479q3cz.js";
 import {
   EntityStore,
   FieldSelectionTracker,
@@ -66,7 +66,7 @@ import {
   query,
   registerRelationSchema,
   resetRelationSchemas_TEST_ONLY
-} from "../shared/chunk-ka8jeq0f.js";
+} from "../shared/chunk-8ft6568m.js";
 import"../shared/chunk-jrtrk5z4.js";
 import {
   ThemeProvider,
@@ -83,7 +83,7 @@ import {
   resolveChildren,
   s,
   variants
-} from "../shared/chunk-veqs3jgz.js";
+} from "../shared/chunk-hgtmh07c.js";
 import {
   RENDER_NODE_BRAND,
   __append,
@@ -96,20 +96,20 @@ import {
   getAdapter,
   isRenderNode,
   setAdapter
-} from "../shared/chunk-xz8jq6w6.js";
+} from "../shared/chunk-29x7mbne.js";
 import"../shared/chunk-h1fsr8kv.js";
 import {
   RouterContext,
   useParams,
   useRouter
-} from "../shared/chunk-4an2s6d7.js";
+} from "../shared/chunk-dxfd1ptg.js";
 import {
   invalidate,
   invalidateTenantQueries
-} from "../shared/chunk-dvzkge4z.js";
+} from "../shared/chunk-kt7127xc.js";
 import {
   isBrowser
-} from "../shared/chunk-g5vzhext.js";
+} from "../shared/chunk-xs4hak0m.js";
 import {
   DisposalScopeError,
   _tryOnCleanup,
@@ -134,7 +134,7 @@ import {
   startHydration,
   untrack,
   useContext
-} from "../shared/chunk-pmyavtdp.js";
+} from "../shared/chunk-2k26a794.js";
 // src/component/default-error-fallback.ts
 function DefaultErrorFallback({ error, retry }) {
   const container = document.createElement("div");

package/dist/src/internals.d.ts

@@ -197,6 +197,14 @@ interface CompileFontsOptions {
 }
 type FontStyle = "normal" | "italic";
 type FontDisplay = "auto" | "block" | "swap" | "fallback" | "optional";
+/** @internal Metadata for Google Fonts descriptors. Present only on googleFont() results. */
+interface GoogleFontMeta {
+	readonly family: string;
+	readonly weight: string | number | number[];
+	readonly style: FontStyle[];
+	readonly subsets: string[];
+	readonly display: FontDisplay;
+}
 interface FontDescriptor {
 	readonly __brand: "FontDescriptor";
 	readonly family: string;
@@ -208,6 +216,8 @@ interface FontDescriptor {
 	readonly subsets: string[];
 	readonly unicodeRange?: string;
 	readonly adjustFontFallback: boolean | FallbackFontName;
+	/** @internal — Google Fonts metadata. Present only for googleFont() descriptors. */
+	readonly __google?: GoogleFontMeta;
 }
 /** Structured description of a resource to preload. */
 interface PreloadItem {
@@ -492,10 +502,13 @@ declare function clearChildren(container: Node): void;
 *   also accepts a raw Signal for direct use in tests.
 * @param keyFn - Extracts a unique key from each item (receives item and index).
 *   Pass `null` for unkeyed lists — triggers full-replacement mode (safe but slower).
-* @param renderFn - Creates a DOM node for an item (called once per key)
+* @param renderFn - Creates a DOM node for an item (called once per key).
+*   Receives the item and its index in the array. Note: for keyed lists,
+*   the index is the position at creation time and is NOT updated when
+*   items reorder — use a key-based approach for stable ordering display.
 * @returns A dispose function to stop the reactive list reconciliation
 */
-declare function __list<T>(container: HTMLElement, items: Signal<T[]> | (() => T[]), keyFn: ((item: T, index: number) => string | number) | null, renderFn: (item: T) => Node): DisposeFn;
+declare function __list<T>(container: HTMLElement, items: Signal<T[]> | (() => T[]), keyFn: ((item: T, index: number) => string | number) | null, renderFn: (item: T, index: number) => Node): DisposeFn;
 /**
 * Lifecycle hooks for list animation (enter/exit/reorder).
 *
@@ -533,21 +546,29 @@ declare const ListAnimationContext: Context<ListAnimationHooks | undefined>;
 *
 * @param items - A signal or getter function containing the array of items
 * @param keyFn - Extracts a unique key from each item. Pass null for unkeyed mode.
-* @param renderFn - Creates a DOM node for an item (called once per key)
+* @param renderFn - Creates a DOM node for an item (called once per key).
+*   Receives the item and its index in the array. Note: for keyed lists,
+*   the index is the position at creation time and is NOT updated when
+*   items reorder — use a key-based approach for stable ordering display.
 * @returns A DisposableNode (DocumentFragment with dispose method)
 */
-declare function __listValue<T>(items: Signal<T[]> | (() => T[]), keyFn: ((item: T, index: number) => string | number) | null, renderFn: (item: T) => Node): DisposableNode;
+declare function __listValue<T>(items: Signal<T[]> | (() => T[]), keyFn: ((item: T, index: number) => string | number) | null, renderFn: (item: T, index: number) => Node): DisposableNode;
 /**
 * Apply a spread props object to a DOM element.
 *
 * Compiler output target for JSX spread attributes on intrinsic elements:
 *   <button {...rest} /> → __spread(el, rest)
+*   <button {...rest} /> → __spread(el, rest, __props)  (inside components)
+*
+* When `source` is provided (the original __props with getter descriptors),
+* keys that have getters on source get reactive effects (like __attr/__prop).
+* Keys without getters are set one-shot from the `props` rest object.
 *
 * Handles event handlers (on*), ref, style, class/className, htmlFor,
 * SVG attribute normalization, and standard HTML attributes.
 * Uses replace (not merge) semantics — last-wins, matching source order.
 */
-declare function __spread(el: Element, props: Record<string, unknown>): void;
+declare function __spread(el: Element, props: Record<string, unknown>, source?: Record<string, unknown>): void;
 declare function styleObjectToString(style: Record<string, string | number | null | undefined>): string;
 /**
 * Returns true when running in a real browser environment.
@@ -1146,6 +1167,12 @@ interface SSRRenderContext {
 	* response only includes CSS for components actually rendered.
 	*/
 	cssTracker?: Set<string>;
+	/**
+	* Request cookies (from the `Cookie` header).
+	* Set by the SSR handler before rendering so that `document.cookie`
+	* reads the real request cookies during SSR — same as in a browser.
+	*/
+	cookies?: string;
 }
 /** Auth state injected into SSRRenderContext by the server. */
 type SSRAuth = ({

package/dist/src/internals.js

@@ -3,13 +3,13 @@ import {
   deserializeProps,
   onAnimationsComplete,
   resolveComponent
-} from "../shared/chunk-14vwqf7c.js";
+} from "../shared/chunk-96hnx5jk.js";
 import {
   __discardMountFrame,
   __flushMountFrame,
   __on,
   __pushMountFrame
-} from "../shared/chunk-ksetw5t2.js";
+} from "../shared/chunk-pbw64893.js";
 import {
   executeLoaders,
   matchPath,
@@ -20,7 +20,7 @@ import {
   MemoryCache,
   QueryEnvelopeStore,
   deriveKey
-} from "../shared/chunk-ka8jeq0f.js";
+} from "../shared/chunk-8ft6568m.js";
 import"../shared/chunk-jrtrk5z4.js";
 import {
   ALIGNMENT_MAP,
@@ -41,7 +41,7 @@ import {
   SIZE_KEYWORDS,
   SPACING_SCALE,
   compileTheme
-} from "../shared/chunk-veqs3jgz.js";
+} from "../shared/chunk-hgtmh07c.js";
 import {
   RENDER_NODE_BRAND,
   __append,
@@ -60,20 +60,21 @@ import {
   getAdapter,
   isRenderNode,
   setAdapter
-} from "../shared/chunk-xz8jq6w6.js";
+} from "../shared/chunk-29x7mbne.js";
 import {
   SVG_NS,
   normalizeSVGAttr,
   styleObjectToString
 } from "../shared/chunk-h1fsr8kv.js";
-import"../shared/chunk-dvzkge4z.js";
+import"../shared/chunk-kt7127xc.js";
 import {
   isBrowser
-} from "../shared/chunk-g5vzhext.js";
+} from "../shared/chunk-xs4hak0m.js";
 import {
   _tryOnCleanup,
   claimComment,
   claimText,
+  deferredDomEffect,
   domEffect,
   getContextScope,
   getIsHydrating,
@@ -90,7 +91,7 @@ import {
   startSignalCollection,
   stopSignalCollection,
   useContext
-} from "../shared/chunk-pmyavtdp.js";
+} from "../shared/chunk-2k26a794.js";
 // src/dom/conditional.ts
 function clearBetween(start, end) {
   let current = start.nextSibling;
@@ -300,11 +301,11 @@ function __list(container, items, keyFn, renderFn) {
         if (keyFn) {
           const itemSig = signal(item);
           const proxy = createItemProxy(itemSig);
-          const node = renderFn(proxy);
+          const node = renderFn(proxy, i);
           itemSignalMap.set(key, itemSig);
           nodeMap.set(key, node);
         } else {
-          const node = renderFn(item);
+          const node = renderFn(item, i);
           nodeMap.set(key, node);
         }
         popScope();
@@ -324,9 +325,9 @@ function __list(container, items, keyFn, renderFn) {
       }
       nodeMap.clear();
       itemSignalMap.clear();
-      for (const item of newItems) {
+      for (const [i, item] of newItems.entries()) {
         const scope = pushScope();
-        const node = renderFn(item);
+        const node = renderFn(item, i);
         popScope();
         container.appendChild(node);
         const internalKey = nodeMap.size;
@@ -357,7 +358,7 @@ function __list(container, items, keyFn, renderFn) {
         const itemSig = signal(item);
         const proxy = createItemProxy(itemSig);
         const scope = pushScope();
-        node = renderFn(proxy);
+        node = renderFn(proxy, i);
         popScope();
         nodeMap.set(key, node);
         scopeMap.set(key, scope);
@@ -479,7 +480,7 @@ function __listValue(items, keyFn, renderFn) {
         itemSignalMap.clear();
         for (const [i, item] of newItems.entries()) {
           const scope = pushScope();
-          const node = renderFn(item);
+          const node = renderFn(item, i);
           popScope();
           endMarker.parentNode?.insertBefore(node, endMarker);
           nodeMap.set(i, node);
@@ -494,7 +495,7 @@ function __listValue(items, keyFn, renderFn) {
           const itemSig = signal(item);
           const proxy = createItemProxy2(itemSig);
           const scope = pushScope();
-          const node = renderFn(proxy);
+          const node = renderFn(proxy, i);
           popScope();
           nodeMap.set(key, node);
           scopeMap.set(key, scope);
@@ -548,7 +549,7 @@ function __listValue(items, keyFn, renderFn) {
           const itemSig = signal(item);
           const proxy = createItemProxy2(itemSig);
           const scope = pushScope();
-          node = renderFn(proxy);
+          node = renderFn(proxy, i);
           popScope();
           nodeMap.set(key, node);
           scopeMap.set(key, scope);
@@ -609,7 +610,12 @@ var PROP_ALIASES = {
   className: "class",
   htmlFor: "for"
 };
-function __spread(el, props) {
+var IDL_PROPS = {
+  INPUT: new Set(["value", "checked"]),
+  SELECT: new Set(["value"]),
+  TEXTAREA: new Set(["value"])
+};
+function __spread(el, props, source) {
   const isSvg = el.namespaceURI === SVG_NS;
   for (const key of Object.keys(props)) {
     if (SKIP_KEYS.has(key))
@@ -626,8 +632,47 @@ function __spread(el, props) {
       el.addEventListener(eventName, value);
       continue;
     }
-    if (value == null || value === false)
+    const descriptor = source && Object.getOwnPropertyDescriptor(source, key);
+    if (descriptor?.get) {
+      const getter = descriptor.get;
+      const isIdl = IDL_PROPS[el.tagName]?.has(key);
+      if (isIdl) {
+        deferredDomEffect(() => {
+          const v = getter();
+          if (v == null) {
+            Reflect.set(el, key, typeof Reflect.get(el, key) === "boolean" ? false : "");
+          } else {
+            Reflect.set(el, key, v);
+          }
+        });
+      } else {
+        const attrName2 = PROP_ALIASES[key] ?? key;
+        const finalName2 = isSvg ? normalizeSVGAttr(attrName2) : attrName2;
+        deferredDomEffect(() => {
+          const v = getter();
+          if (v == null || v === false) {
+            el.removeAttribute(finalName2);
+          } else if (v === true) {
+            el.setAttribute(finalName2, "");
+          } else if (finalName2 === "style" && typeof v === "object") {
+            el.setAttribute("style", styleObjectToString(v));
+          } else {
+            el.setAttribute(finalName2, String(v));
+          }
+        });
+      }
+      continue;
+    }
+    if (value == null || value === false) {
+      if (value === false && IDL_PROPS[el.tagName]?.has(key)) {
+        Reflect.set(el, key, false);
+      }
       continue;
+    }
+    if (IDL_PROPS[el.tagName]?.has(key)) {
+      Reflect.set(el, key, value);
+      continue;
+    }
     const attrName = PROP_ALIASES[key] ?? key;
     if (attrName === "style") {
       if (typeof value === "object") {

package/dist/src/query/public.js

@@ -1,10 +1,10 @@
 import {
   query
-} from "../../shared/chunk-ka8jeq0f.js";
+} from "../../shared/chunk-8ft6568m.js";
 import"../../shared/chunk-jrtrk5z4.js";
-import"../../shared/chunk-dvzkge4z.js";
-import"../../shared/chunk-g5vzhext.js";
-import"../../shared/chunk-pmyavtdp.js";
+import"../../shared/chunk-kt7127xc.js";
+import"../../shared/chunk-xs4hak0m.js";
+import"../../shared/chunk-2k26a794.js";
 
 // src/query/public.ts
 import { isQueryDescriptor } from "@vertz/fetch";

package/dist/src/router/public.d.ts

@@ -267,6 +267,8 @@ type LoaderData<T> = T extends {
 * Returns an array of compiled routes preserving definition order.
 */
 declare function defineRoutes<const T extends Record<string, RouteConfigLike>>(map: T): TypedRoutes<T>;
+/** A single child value: DOM node, string, number, null, undefined, thunk, or nested array. */
+type ChildValue = Node | string | number | null | undefined | ChildValue[] | (() => ChildValue);
 /**
 * A reactive signal that holds a value and notifies subscribers on change.
 */
@@ -320,8 +322,8 @@ type UnwrapSignals<T> = T extends object ? { [K in keyof T] : Unwrapped<T[K]> }
 interface LinkProps<T extends Record<string, RouteConfigLike> = RouteDefinitionMap> {
 	/** The target URL path. */
 	href: RoutePaths<T>;
-	/** Text or content for the link. Accepts string, Node, or a thunk returning either. */
-	children: string | Node | (() => string | Node);
+	/** Content for the link. Accepts string, Node, arrays, or thunks — same as JSX children. */
+	children: ChildValue;
 	/** Class applied when the link's href matches the current path. */
 	activeClass?: string;
 	/** Static class name for the anchor element. */

package/dist/src/router/public.js

@@ -6,24 +6,24 @@ import {
   createLink,
   parseSearchParams,
   useSearchParams
-} from "../../shared/chunk-5eszqmat.js";
-import"../../shared/chunk-ksetw5t2.js";
+} from "../../shared/chunk-abv8ax3j.js";
+import"../../shared/chunk-pbw64893.js";
 import {
   createRouter
-} from "../../shared/chunk-khtsbadc.js";
+} from "../../shared/chunk-f0f80gxe.js";
 import {
   defineRoutes
 } from "../../shared/chunk-ah86rm07.js";
 import"../../shared/chunk-jrtrk5z4.js";
-import"../../shared/chunk-xz8jq6w6.js";
+import"../../shared/chunk-29x7mbne.js";
 import"../../shared/chunk-h1fsr8kv.js";
 import {
   RouterContext,
   useParams,
   useRouter
-} from "../../shared/chunk-4an2s6d7.js";
-import"../../shared/chunk-g5vzhext.js";
-import"../../shared/chunk-pmyavtdp.js";
+} from "../../shared/chunk-dxfd1ptg.js";
+import"../../shared/chunk-xs4hak0m.js";
+import"../../shared/chunk-2k26a794.js";
 export {
   useSearchParams,
   useRouter,

package/dist/src/test/index.js

@@ -1,12 +1,12 @@
 import {
   createRouter
-} from "../../shared/chunk-khtsbadc.js";
+} from "../../shared/chunk-f0f80gxe.js";
 import {
   defineRoutes
 } from "../../shared/chunk-ah86rm07.js";
 import"../../shared/chunk-jrtrk5z4.js";
-import"../../shared/chunk-g5vzhext.js";
-import"../../shared/chunk-pmyavtdp.js";
+import"../../shared/chunk-xs4hak0m.js";
+import"../../shared/chunk-2k26a794.js";
 
 // src/test/interactions.ts
 async function click(el) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vertz/ui",
-  "version": "0.2.38",
+  "version": "0.2.42",
   "description": "Vertz UI framework — signals, components, JSX runtime",
   "license": "MIT",
   "repository": {
@@ -77,11 +77,11 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@vertz/fetch": "^0.2.35"
+    "@vertz/fetch": "^0.2.41"
   },
   "devDependencies": {
     "@happy-dom/global-registrator": "^20.7.0",
-    "@vertz/schema": "^0.2.35",
+    "@vertz/schema": "^0.2.41",
     "bunup": "^0.16.31",
     "happy-dom": "^20.7.0",
     "typescript": "^5.7.0"