@vertz/ui 0.2.13 → 0.2.15

package/dist/shared/{chunk-c9xxsrat.js → chunk-1wby7nex.js}

@@ -82,6 +82,7 @@ var PROPERTY_MAP = {
   leading: { properties: ["line-height"], valueType: "line-height" },
   tracking: { properties: ["letter-spacing"], valueType: "raw" },
   decoration: { properties: ["text-decoration"], valueType: "raw" },
+  list: { properties: ["list-style"], valueType: "raw" },
   ring: { properties: ["outline"], valueType: "ring" },
   cursor: { properties: ["cursor"], valueType: "raw" },
   transition: { properties: ["transition"], valueType: "raw" },
@@ -115,7 +116,9 @@ var KEYWORD_MAP = {
   "select-none": [{ property: "user-select", value: "none" }],
   "pointer-events-none": [{ property: "pointer-events", value: "none" }],
   "whitespace-nowrap": [{ property: "white-space", value: "nowrap" }],
-  "shrink-0": [{ property: "flex-shrink", value: "0" }]
+  "shrink-0": [{ property: "flex-shrink", value: "0" }],
+  italic: [{ property: "font-style", value: "italic" }],
+  "not-italic": [{ property: "font-style", value: "normal" }]
 };
 var DISPLAY_MAP = {
   flex: "flex",
@@ -399,6 +402,9 @@ function resolveToken(parsed) {
   if (property === "ring") {
     return { declarations: resolveRingMulti(value), pseudo };
   }
+  if (property === "list") {
+    return { declarations: resolveList(value), pseudo };
+  }
   const resolvedValue = resolveValue(value, mapping.valueType, property);
   const declarations = mapping.properties.map((prop) => ({
     property: prop,
@@ -551,6 +557,17 @@ function resolveRingMulti(value) {
   }
   return [{ property: "outline-color", value: resolveColor(value, "ring") }];
 }
+var LIST_STYLE_KEYWORDS = new Set(["none", "disc", "decimal"]);
+var LIST_POSITION_KEYWORDS = new Set(["inside", "outside"]);
+function resolveList(value) {
+  if (LIST_STYLE_KEYWORDS.has(value)) {
+    return [{ property: "list-style", value }];
+  }
+  if (LIST_POSITION_KEYWORDS.has(value)) {
+    return [{ property: "list-style-position", value }];
+  }
+  throw new TokenResolveError(`Invalid list value '${value}'. Use: none, disc, decimal, inside, outside.`, `list:${value}`);
+}
 function resolveRaw(value, property) {
   if (property === "border-r" || property === "border-l" || property === "border-t" || property === "border-b") {
     const num = Number(value);

package/dist/shared/{chunk-2sth83bd.js → chunk-4txc67nd.js}

@@ -1,6 +1,6 @@
 import {
   injectCSS
-} from "./chunk-c9xxsrat.js";
+} from "./chunk-1wby7nex.js";
 
 // src/dom/animation.ts
 function onAnimationsComplete(el, callback) {

package/dist/shared/{chunk-c30eg6wn.js → chunk-5dbq8jp9.js}

@@ -206,6 +206,13 @@ function form(sdkMethod, options) {
     submitting,
     dirty,
     valid,
+    fields: new Proxy(Object.create(null), {
+      get(_target, prop) {
+        if (typeof prop === "string")
+          return prop;
+        return;
+      }
+    }),
     __bindElement: (el) => {
       boundElement = el;
       el.addEventListener("input", handleInputOrChange);

package/dist/shared/{chunk-mj7b4t40.js → chunk-wymw818z.js}

@@ -12,6 +12,53 @@ import {
 
 // src/router/navigate.ts
 var DEFAULT_NAV_THRESHOLD_MS = 500;
+function interpolatePath(path, params) {
+  const segments = path.split("/");
+  return segments.map((segment) => {
+    if (segment.startsWith(":")) {
+      const paramName = segment.slice(1);
+      const value = params?.[paramName];
+      if (value === undefined) {
+        throw new TypeError(`Missing route param "${paramName}" for path "${path}"`);
+      }
+      return encodeURIComponent(value);
+    }
+    if (segment === "*") {
+      const value = params?.["*"];
+      if (value === undefined) {
+        throw new TypeError(`Missing wildcard param "*" for path "${path}"`);
+      }
+      return value.replace(/^\/+|\/+$/g, "").split("/").map((part) => encodeURIComponent(part)).join("/");
+    }
+    return segment;
+  }).join("/");
+}
+function buildSearch(search) {
+  if (!search)
+    return "";
+  if (typeof search === "string") {
+    if (search === "")
+      return "";
+    return search.startsWith("?") ? search : `?${search}`;
+  }
+  const params = search instanceof URLSearchParams ? new URLSearchParams(search) : new URLSearchParams;
+  if (!(search instanceof URLSearchParams)) {
+    const entries = Object.entries(search).sort(([left], [right]) => left.localeCompare(right));
+    for (const [key, rawValue] of entries) {
+      const values = Array.isArray(rawValue) ? rawValue : [rawValue];
+      for (const value of values) {
+        if (value === undefined || value === null)
+          continue;
+        params.append(key, String(value));
+      }
+    }
+  }
+  const query = params.toString();
+  return query ? `?${query}` : "";
+}
+function buildNavigationUrl(to, options) {
+  return `${interpolatePath(to, options?.params)}${buildSearch(options?.search)}`;
+}
 function createRouter(routes, initialUrl, options) {
   const ssrCtx = getSSRContext();
   const isSSR = ssrCtx !== undefined;
@@ -195,10 +242,11 @@ function createRouter(routes, initialUrl, options) {
       }
     }
   }
-  async function navigate(navUrl, navOptions) {
+  async function navigate(input) {
+    const navUrl = buildNavigationUrl(input.to, input);
     const gen = ++navigateGen;
     const handle = startPrefetch(navUrl);
-    if (navOptions?.replace) {
+    if (input.replace) {
       window.history.replaceState(null, "", navUrl);
     } else {
       window.history.pushState(null, "", navUrl);

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

@@ -150,6 +150,19 @@ type ClientAccessEvent = {
 	type: "access:role_changed";
 } | {
 	type: "access:plan_changed";
+} | {
+	type: "access:plan_assigned";
+	planId: string;
+} | {
+	type: "access:addon_attached";
+	addonId: string;
+} | {
+	type: "access:addon_detached";
+	addonId: string;
+} | {
+	type: "access:limit_reset";
+	entitlement: string;
+	max: number;
 };
 interface AccessEventClientOptions {
 	/** WebSocket URL. Defaults to deriving from window.location. */

package/dist/src/auth/public.js

@@ -171,8 +171,16 @@ function handleAccessEvent(accessSet, event, flagEntitlementMap) {
     case "access:limit_updated":
       handleLimitUpdate(accessSet, current, event.entitlement, event.consumed, event.remaining, event.max);
       break;
+    case "access:plan_assigned":
+      handlePlanAssigned(accessSet, current, event.planId);
+      break;
+    case "access:limit_reset":
+      handleLimitReset(accessSet, current, event.entitlement, event.max);
+      break;
     case "access:role_changed":
     case "access:plan_changed":
+    case "access:addon_attached":
+    case "access:addon_detached":
       break;
   }
 }
@@ -200,6 +208,26 @@ function handleFlagToggle(accessSet, current, flag, enabled, flagEntitlementMap)
   }
   accessSet.value = { ...current, flags: newFlags, entitlements: newEntitlements };
 }
+function handlePlanAssigned(accessSet, current, planId) {
+  accessSet.value = { ...current, plan: planId };
+}
+function handleLimitReset(accessSet, current, entitlement, max) {
+  const existingEntry = current.entitlements[entitlement];
+  if (!existingEntry)
+    return;
+  const newLimit = { max, consumed: 0, remaining: max };
+  const newEntitlements = { ...current.entitlements };
+  const reasons = existingEntry.reasons.filter((r) => r !== "limit_reached");
+  const wasOnlyLimitBlocked = existingEntry.reasons.length > 0 && existingEntry.reasons.every((r) => r === "limit_reached");
+  newEntitlements[entitlement] = {
+    ...existingEntry,
+    allowed: wasOnlyLimitBlocked ? true : existingEntry.allowed || reasons.length === 0,
+    reasons,
+    reason: reasons[0],
+    meta: { ...existingEntry.meta, limit: newLimit }
+  };
+  accessSet.value = { ...current, entitlements: newEntitlements };
+}
 function handleLimitUpdate(accessSet, current, entitlement, consumed, remaining, max) {
   const existingEntry = current.entitlements[entitlement];
   if (!existingEntry)

package/dist/src/css/public.js

@@ -6,7 +6,7 @@ import {
   globalCss,
   s,
   variants
-} from "../../shared/chunk-c9xxsrat.js";
+} from "../../shared/chunk-1wby7nex.js";
 import"../../shared/chunk-j6qyxfdc.js";
 import"../../shared/chunk-prj7nm08.js";
 import"../../shared/chunk-h89w580h.js";

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

@@ -89,9 +89,11 @@ interface SdkMethodWithMeta<
 	};
 }
 /** Reserved property names that cannot be used as field names on FormInstance. */
-type ReservedFormNames = "submitting" | "dirty" | "valid" | "action" | "method" | "onSubmit" | "reset" | "setFieldError" | "submit" | "__bindElement";
+type ReservedFormNames = "submitting" | "dirty" | "valid" | "action" | "method" | "onSubmit" | "reset" | "setFieldError" | "submit" | "fields" | "__bindElement";
 /** Mapped type providing FieldState for each field in TBody. */
 type FieldAccessors<TBody> = { [K in keyof TBody] : FieldState<TBody[K]> };
+/** Mapped type providing typed field name strings for compile-time input validation. */
+type FieldNames<TBody> = { readonly [K in keyof TBody & string] : K };
 /** Base properties available on every form instance. */
 interface FormBaseProperties<TBody> {
 	action: string;
@@ -103,6 +105,7 @@ interface FormBaseProperties<TBody> {
 	submitting: Signal<boolean>;
 	dirty: ReadonlySignal<boolean>;
 	valid: ReadonlySignal<boolean>;
+	fields: FieldNames<TBody>;
 	__bindElement: (el: HTMLFormElement) => void;
 }
 /**
@@ -164,4 +167,4 @@ interface FormDataOptions {
 *   "true"/"false" become booleans.
 */
 declare function formDataToObject(formData: FormData, options?: FormDataOptions): Record<string, unknown>;
-export { validate, formDataToObject, form, createFieldState, ValidationResult, SdkMethodWithMeta, SdkMethod, FormSchema, FormOptions, FormInstance, FormDataOptions, FieldState };
+export { validate, formDataToObject, form, createFieldState, ValidationResult, SdkMethodWithMeta, SdkMethod, FormSchema, FormOptions, FormInstance, FormDataOptions, FieldState, FieldNames };

package/dist/src/form/public.js

@@ -3,7 +3,7 @@ import {
   form,
   formDataToObject,
   validate
-} from "../../shared/chunk-c30eg6wn.js";
+} from "../../shared/chunk-5dbq8jp9.js";
 import"../../shared/chunk-8hsz5y4a.js";
 export {
   validate,

package/dist/src/index.d.ts

@@ -620,9 +620,11 @@ interface SdkMethodWithMeta<
 	};
 }
 /** Reserved property names that cannot be used as field names on FormInstance. */
-type ReservedFormNames = "submitting" | "dirty" | "valid" | "action" | "method" | "onSubmit" | "reset" | "setFieldError" | "submit" | "__bindElement";
+type ReservedFormNames = "submitting" | "dirty" | "valid" | "action" | "method" | "onSubmit" | "reset" | "setFieldError" | "submit" | "fields" | "__bindElement";
 /** Mapped type providing FieldState for each field in TBody. */
 type FieldAccessors<TBody> = { [K in keyof TBody] : FieldState<TBody[K]> };
+/** Mapped type providing typed field name strings for compile-time input validation. */
+type FieldNames<TBody> = { readonly [K in keyof TBody & string] : K };
 /** Base properties available on every form instance. */
 interface FormBaseProperties<TBody> {
 	action: string;
@@ -634,6 +636,7 @@ interface FormBaseProperties<TBody> {
 	submitting: Signal<boolean>;
 	dirty: ReadonlySignal<boolean>;
 	valid: ReadonlySignal<boolean>;
+	fields: FieldNames<TBody>;
 	__bindElement: (el: HTMLFormElement) => void;
 }
 /**
@@ -915,6 +918,8 @@ type ExtractParams<T extends string> = [ExtractParamsFromSegments<WithoutWildcar
 * - Fallback: `string` → `string` (backward compat)
 */
 type PathWithParams<T extends string> = T extends `${infer Before}*` ? `${PathWithParams<Before>}${string}` : T extends `${infer Before}:${string}/${infer After}` ? `${Before}${string}/${PathWithParams<`${After}`>}` : T extends `${infer Before}:${string}` ? `${Before}${string}` : T;
+/** Union of route pattern keys from a route map. */
+type RoutePattern<TRouteMap extends Record<string, unknown>> = keyof TRouteMap & string;
 /**
 * Union of all valid URL shapes for a route map.
 * Maps each route pattern key through `PathWithParams` to produce the accepted URL shapes.
@@ -924,7 +929,7 @@ type PathWithParams<T extends string> = T extends `${infer Before}*` ? `${PathWi
 * RoutePaths<{ '/': ..., '/tasks/:id': ... }> = '/' | `/tasks/${string}`
 * ```
 */
-type RoutePaths<TRouteMap extends Record<string, unknown>> = { [K in keyof TRouteMap & string] : PathWithParams<K> }[keyof TRouteMap & string];
+type RoutePaths<TRouteMap extends Record<string, unknown>> = { [K in RoutePattern<TRouteMap>] : PathWithParams<K> }[RoutePattern<TRouteMap>];
 /** Schema interface for parsing and validating values (search params, path params). */
 interface SearchParamSchema<T> {
 	parse(data: unknown): {
@@ -1089,11 +1094,25 @@ interface LinkFactoryOptions {
 * @returns A Link component function
 */
 declare function createLink(currentPath: ReadonlySignal<string>, navigate: (url: string) => void, factoryOptions?: LinkFactoryOptions): (props: LinkProps) => HTMLAnchorElement;
+type NavigateSearchValue = string | number | boolean | null | undefined;
+type NavigateSearch = string | URLSearchParams | Record<string, NavigateSearchValue | readonly NavigateSearchValue[]>;
 /** Options for router.navigate(). */
 interface NavigateOptions {
 	/** Use history.replaceState instead of pushState. */
 	replace?: boolean;
-}
+	/** Route params used to interpolate dynamic segments in the route pattern. */
+	params?: Record<string, string>;
+	/** Search params appended to the final URL. */
+	search?: NavigateSearch;
+}
+type NavigateOptionsFor<TPath extends string> = string extends TPath ? NavigateOptions : TPath extends `${string}:${string}` | `${string}*` ? Omit<NavigateOptions, "params"> & {
+	params: ExtractParams<TPath>;
+} : Omit<NavigateOptions, "params"> & {
+	params?: never;
+};
+type NavigateInput<TPath extends string = string> = {
+	to: TPath;
+} & NavigateOptionsFor<TPath>;
 /** Handle returned by prefetchNavData for cancellation. */
 interface PrefetchHandle {
 	abort: () => void;
@@ -1118,13 +1137,14 @@ interface RouterOptions {
 *
 * Generic over the route map `T`. Defaults to `RouteDefinitionMap` (string
 * index signature) for backward compatibility — unparameterized `Router`
-* accepts any string in `navigate()`.
+* accepts any string in `navigate().to`.
 *
 * Method syntax on `navigate`, `revalidate`, and `dispose` enables bivariant
 * parameter checking under `strictFunctionTypes`. This means `Router<T>` is
 * assignable to `Router` (the unparameterized default), which is required for
 * storing typed routers in the `RouterContext` without contravariance errors.
-* At call sites, TypeScript still enforces the `RoutePaths<T>` constraint.
+* At call sites, TypeScript still enforces the `RoutePattern<T>` constraint and
+* the params required for each route pattern.
 */
 interface Router<T extends Record<string, RouteConfigLike> = RouteDefinitionMap> {
 	/** Current matched route (reactive signal). */
@@ -1135,8 +1155,8 @@ interface Router<T extends Record<string, RouteConfigLike> = RouteDefinitionMap>
 	loaderError: Signal<Error | null>;
 	/** Parsed search params from the current route (reactive signal). */
 	searchParams: Signal<Record<string, unknown>>;
-	/** Navigate to a new URL path. */
-	navigate(url: RoutePaths<T>, options?: NavigateOptions): Promise<void>;
+	/** Navigate to a route pattern, interpolating params and search into the final URL. */
+	navigate<TPath extends RoutePattern<T>>(input: NavigateInput<TPath>): Promise<void>;
 	/** Re-run all loaders for the current route. */
 	revalidate(): Promise<void>;
 	/** Remove popstate listener and clean up the router. */
@@ -1503,4 +1523,4 @@ declare function resetRelationSchemas_TEST_ONLY(): void;
 * ```
 */
 declare function createTestStore(data: Record<string, Record<string, unknown>>): EntityStore;
-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, registerRelationSchema, ref, queryMatch, query, parseSearchParams, palettes, onMount2 as onMount, mount, keyframes, isRenderNode, isQueryDescriptor, invalidate, injectCSS, hydrate, globalCss, getRelationSchema, getQueryEnvelopeStore, getInjectedCSS, getEntityStore, getAdapter, formDataToObject, form, fadeOut, fadeIn, defineTheme, defineRoutes, css, createTestStore, createRouter, createOptimisticHandler, createLink, createFieldState, createDialogStack, createDOMAdapter, createContext, computed, compileTheme, children, 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, RoutePaths, RouteMatch, RouteDefinitionMap, RouteConfig, RenderText, RenderNode, RenderElement, RenderAdapter, RelationSchema, RelationFieldDef, Ref, ReadonlySignal, RawDeclaration, RENDER_NODE_BRAND, QueryResult, QueryOptions, QueryMatchHandlers, QueryEnvelopeStore, QueryEnvelope, QueryDescriptor3 as QueryDescriptor, PresenceProps, Presence, PathWithParams, ParamSchema, OutletContextValue, OutletContext, Outlet, NavigateOptions, MountOptions, MountHandle, MatchedRoute, LoaderData, ListTransitionProps, ListTransition, LinkProps, LinkFactoryOptions, InferRouteMap, GlobalCSSOutput, GlobalCSSInput, FormSchema, FormOptions, FormInstance, FormDataOptions, FieldState, ExtractParams, ErrorBoundaryProps, ErrorBoundary, EntityStoreOptions, EntityStore, DisposeFn, DisposalScopeError, DialogStackContext, DialogStack, DialogHandle, DialogDismissedError, DialogComponent, Context, Computed, ComponentRegistry, ComponentLoader, ComponentFunction, CompiledTheme, CompiledRoute, ColorPalette, ChildrenAccessor, ChildValue, CacheStore, CSSOutput, CSSInput, ANIMATION_EASING, ANIMATION_DURATION };
+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, registerRelationSchema, ref, queryMatch, query, parseSearchParams, palettes, onMount2 as onMount, mount, keyframes, isRenderNode, isQueryDescriptor, invalidate, injectCSS, hydrate, globalCss, getRelationSchema, getQueryEnvelopeStore, getInjectedCSS, getEntityStore, getAdapter, formDataToObject, form, fadeOut, fadeIn, defineTheme, defineRoutes, css, createTestStore, createRouter, createOptimisticHandler, createLink, createFieldState, createDialogStack, createDOMAdapter, createContext, computed, compileTheme, children, 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, Ref, ReadonlySignal, RawDeclaration, RENDER_NODE_BRAND, QueryResult, QueryOptions, QueryMatchHandlers, QueryEnvelopeStore, QueryEnvelope, QueryDescriptor3 as QueryDescriptor, PresenceProps, Presence, PathWithParams, ParamSchema, OutletContextValue, OutletContext, Outlet, NavigateOptions, NavigateInput, MountOptions, MountHandle, MatchedRoute, LoaderData, ListTransitionProps, ListTransition, LinkProps, LinkFactoryOptions, InferRouteMap, GlobalCSSOutput, GlobalCSSInput, FormSchema, FormOptions, FormInstance, FormDataOptions, FieldState, ExtractParams, ErrorBoundaryProps, ErrorBoundary, EntityStoreOptions, EntityStore, DisposeFn, DisposalScopeError, DialogStackContext, DialogStack, DialogHandle, DialogDismissedError, DialogComponent, Context, Computed, ComponentRegistry, ComponentLoader, ComponentFunction, CompiledTheme, CompiledRoute, ColorPalette, ChildrenAccessor, ChildValue, CacheStore, CSSOutput, CSSInput, ANIMATION_EASING, ANIMATION_DURATION };

package/dist/src/index.js

@@ -20,7 +20,7 @@ import {
   slideOutToTop,
   zoomIn,
   zoomOut
-} from "../shared/chunk-2sth83bd.js";
+} from "../shared/chunk-4txc67nd.js";
 import {
   Outlet,
   OutletContext,
@@ -35,7 +35,7 @@ import {
 import"../shared/chunk-dksg08fq.js";
 import {
   createRouter
-} from "../shared/chunk-mj7b4t40.js";
+} from "../shared/chunk-wymw818z.js";
 import {
   defineRoutes
 } from "../shared/chunk-83g4h38e.js";
@@ -44,7 +44,7 @@ import {
   form,
   formDataToObject,
   validate
-} from "../shared/chunk-c30eg6wn.js";
+} from "../shared/chunk-5dbq8jp9.js";
 import {
   EntityStore,
   QueryEnvelopeStore,
@@ -72,7 +72,7 @@ import {
   resolveChildren,
   s,
   variants
-} from "../shared/chunk-c9xxsrat.js";
+} from "../shared/chunk-1wby7nex.js";
 import {
   __append,
   __element,

package/dist/src/internals.js

@@ -2,7 +2,7 @@ import {
   deserializeProps,
   onAnimationsComplete,
   resolveComponent
-} from "../shared/chunk-2sth83bd.js";
+} from "../shared/chunk-4txc67nd.js";
 import {
   __attr,
   __classList,
@@ -40,7 +40,7 @@ import {
   SIZE_KEYWORDS,
   SPACING_SCALE,
   compileTheme
-} from "../shared/chunk-c9xxsrat.js";
+} from "../shared/chunk-1wby7nex.js";
 import {
   __append,
   __child,

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

@@ -34,6 +34,8 @@ type ExtractParams<T extends string> = [ExtractParamsFromSegments<WithoutWildcar
 * - Fallback: `string` → `string` (backward compat)
 */
 type PathWithParams<T extends string> = T extends `${infer Before}*` ? `${PathWithParams<Before>}${string}` : T extends `${infer Before}:${string}/${infer After}` ? `${Before}${string}/${PathWithParams<`${After}`>}` : T extends `${infer Before}:${string}` ? `${Before}${string}` : T;
+/** Union of route pattern keys from a route map. */
+type RoutePattern<TRouteMap extends Record<string, unknown>> = keyof TRouteMap & string;
 /**
 * Union of all valid URL shapes for a route map.
 * Maps each route pattern key through `PathWithParams` to produce the accepted URL shapes.
@@ -43,7 +45,7 @@ type PathWithParams<T extends string> = T extends `${infer Before}*` ? `${PathWi
 * RoutePaths<{ '/': ..., '/tasks/:id': ... }> = '/' | `/tasks/${string}`
 * ```
 */
-type RoutePaths<TRouteMap extends Record<string, unknown>> = { [K in keyof TRouteMap & string] : PathWithParams<K> }[keyof TRouteMap & string];
+type RoutePaths<TRouteMap extends Record<string, unknown>> = { [K in RoutePattern<TRouteMap>] : PathWithParams<K> }[RoutePattern<TRouteMap>];
 /** Schema interface for parsing and validating values (search params, path params). */
 interface SearchParamSchema<T> {
 	parse(data: unknown): {
@@ -251,11 +253,25 @@ interface LinkFactoryOptions {
 * @returns A Link component function
 */
 declare function createLink(currentPath: ReadonlySignal<string>, navigate: (url: string) => void, factoryOptions?: LinkFactoryOptions): (props: LinkProps) => HTMLAnchorElement;
+type NavigateSearchValue = string | number | boolean | null | undefined;
+type NavigateSearch = string | URLSearchParams | Record<string, NavigateSearchValue | readonly NavigateSearchValue[]>;
 /** Options for router.navigate(). */
 interface NavigateOptions {
 	/** Use history.replaceState instead of pushState. */
 	replace?: boolean;
+	/** Route params used to interpolate dynamic segments in the route pattern. */
+	params?: Record<string, string>;
+	/** Search params appended to the final URL. */
+	search?: NavigateSearch;
 }
+type NavigateOptionsFor<TPath extends string> = string extends TPath ? NavigateOptions : TPath extends `${string}:${string}` | `${string}*` ? Omit<NavigateOptions, "params"> & {
+	params: ExtractParams<TPath>;
+} : Omit<NavigateOptions, "params"> & {
+	params?: never;
+};
+type NavigateInput<TPath extends string = string> = {
+	to: TPath;
+} & NavigateOptionsFor<TPath>;
 /** Handle returned by prefetchNavData for cancellation. */
 interface PrefetchHandle {
 	abort: () => void;
@@ -280,13 +296,14 @@ interface RouterOptions {
 *
 * Generic over the route map `T`. Defaults to `RouteDefinitionMap` (string
 * index signature) for backward compatibility — unparameterized `Router`
-* accepts any string in `navigate()`.
+* accepts any string in `navigate().to`.
 *
 * Method syntax on `navigate`, `revalidate`, and `dispose` enables bivariant
 * parameter checking under `strictFunctionTypes`. This means `Router<T>` is
 * assignable to `Router` (the unparameterized default), which is required for
 * storing typed routers in the `RouterContext` without contravariance errors.
-* At call sites, TypeScript still enforces the `RoutePaths<T>` constraint.
+* At call sites, TypeScript still enforces the `RoutePattern<T>` constraint and
+* the params required for each route pattern.
 */
 interface Router<T extends Record<string, RouteConfigLike> = RouteDefinitionMap> {
 	/** Current matched route (reactive signal). */
@@ -297,8 +314,8 @@ interface Router<T extends Record<string, RouteConfigLike> = RouteDefinitionMap>
 	loaderError: Signal<Error | null>;
 	/** Parsed search params from the current route (reactive signal). */
 	searchParams: Signal<Record<string, unknown>>;
-	/** Navigate to a new URL path. */
-	navigate(url: RoutePaths<T>, options?: NavigateOptions): Promise<void>;
+	/** Navigate to a route pattern, interpolating params and search into the final URL. */
+	navigate<TPath extends RoutePattern<T>>(input: NavigateInput<TPath>): Promise<void>;
 	/** Re-run all loaders for the current route. */
 	revalidate(): Promise<void>;
 	/** Remove popstate listener and clean up the router. */
@@ -405,4 +422,4 @@ declare function parseSearchParams<T = Record<string, string>>(urlParams: URLSea
 * @returns The current search params value
 */
 declare function useSearchParams<T>(searchSignal: ReadonlySignal<T>): T;
-export { useSearchParams, useRouter, useParams, parseSearchParams, defineRoutes, createRouter, createLink, TypedRoutes, TypedRouter, SearchParamSchema, RouterViewProps, RouterView, RouterContext, Router, RoutePaths, RouteMatch, RouteDefinitionMap, RouteConfig, PathWithParams, ParamSchema, OutletContextValue, OutletContext, Outlet, NavigateOptions, MatchedRoute, LoaderData, LinkProps, InferRouteMap, ExtractParams, CompiledRoute };
+export { useSearchParams, useRouter, useParams, parseSearchParams, defineRoutes, createRouter, createLink, TypedRoutes, TypedRouter, SearchParamSchema, RouterViewProps, RouterView, RouterContext, Router, RoutePattern, RoutePaths, RouteMatch, RouteDefinitionMap, RouteConfig, PathWithParams, ParamSchema, OutletContextValue, OutletContext, Outlet, NavigateOptions, NavigateInput, MatchedRoute, LoaderData, LinkProps, InferRouteMap, ExtractParams, CompiledRoute };

package/dist/src/router/public.js

@@ -12,7 +12,7 @@ import {
 import"../../shared/chunk-dksg08fq.js";
 import {
   createRouter
-} from "../../shared/chunk-mj7b4t40.js";
+} from "../../shared/chunk-wymw818z.js";
 import {
   defineRoutes
 } from "../../shared/chunk-83g4h38e.js";

package/dist/src/test/index.d.ts

@@ -138,25 +138,8 @@ type ExtractParams<T extends string> = [ExtractParamsFromSegments<WithoutWildcar
 } : Record<string, never> : HasWildcard<T> extends true ? { [K in ExtractParamsFromSegments<WithoutWildcard<T>>] : string } & {
 	"*": string;
 } : { [K in ExtractParamsFromSegments<WithoutWildcard<T>>] : string };
-/**
-* Convert a route pattern to the union of URL shapes it accepts.
-* - Static: `'/'` → `'/'`
-* - Param: `'/tasks/:id'` → `` `/tasks/${string}` ``
-* - Wildcard: `'/files/*'` → `` `/files/${string}` ``
-* - Multi: `'/users/:id/posts/:postId'` → `` `/users/${string}/posts/${string}` ``
-* - Fallback: `string` → `string` (backward compat)
-*/
-type PathWithParams<T extends string> = T extends `${infer Before}*` ? `${PathWithParams<Before>}${string}` : T extends `${infer Before}:${string}/${infer After}` ? `${Before}${string}/${PathWithParams<`${After}`>}` : T extends `${infer Before}:${string}` ? `${Before}${string}` : T;
-/**
-* Union of all valid URL shapes for a route map.
-* Maps each route pattern key through `PathWithParams` to produce the accepted URL shapes.
-*
-* Example:
-* ```
-* RoutePaths<{ '/': ..., '/tasks/:id': ... }> = '/' | `/tasks/${string}`
-* ```
-*/
-type RoutePaths<TRouteMap extends Record<string, unknown>> = { [K in keyof TRouteMap & string] : PathWithParams<K> }[keyof TRouteMap & string];
+/** Union of route pattern keys from a route map. */
+type RoutePattern<TRouteMap extends Record<string, unknown>> = keyof TRouteMap & string;
 /** Schema interface for parsing and validating values (search params, path params). */
 interface SearchParamSchema<T> {
 	parse(data: unknown): {
@@ -273,23 +256,38 @@ interface Signal<T> {
 	/** Manually notify all subscribers (useful after mutating the value in place). */
 	notify(): void;
 }
+type NavigateSearchValue = string | number | boolean | null | undefined;
+type NavigateSearch = string | URLSearchParams | Record<string, NavigateSearchValue | readonly NavigateSearchValue[]>;
 /** Options for router.navigate(). */
 interface NavigateOptions {
 	/** Use history.replaceState instead of pushState. */
 	replace?: boolean;
+	/** Route params used to interpolate dynamic segments in the route pattern. */
+	params?: Record<string, string>;
+	/** Search params appended to the final URL. */
+	search?: NavigateSearch;
 }
+type NavigateOptionsFor<TPath extends string> = string extends TPath ? NavigateOptions : TPath extends `${string}:${string}` | `${string}*` ? Omit<NavigateOptions, "params"> & {
+	params: ExtractParams<TPath>;
+} : Omit<NavigateOptions, "params"> & {
+	params?: never;
+};
+type NavigateInput<TPath extends string = string> = {
+	to: TPath;
+} & NavigateOptionsFor<TPath>;
 /**
 * The router instance returned by createRouter.
 *
 * Generic over the route map `T`. Defaults to `RouteDefinitionMap` (string
 * index signature) for backward compatibility — unparameterized `Router`
-* accepts any string in `navigate()`.
+* accepts any string in `navigate().to`.
 *
 * Method syntax on `navigate`, `revalidate`, and `dispose` enables bivariant
 * parameter checking under `strictFunctionTypes`. This means `Router<T>` is
 * assignable to `Router` (the unparameterized default), which is required for
 * storing typed routers in the `RouterContext` without contravariance errors.
-* At call sites, TypeScript still enforces the `RoutePaths<T>` constraint.
+* At call sites, TypeScript still enforces the `RoutePattern<T>` constraint and
+* the params required for each route pattern.
 */
 interface Router<T extends Record<string, RouteConfigLike> = RouteDefinitionMap> {
 	/** Current matched route (reactive signal). */
@@ -300,8 +298,8 @@ interface Router<T extends Record<string, RouteConfigLike> = RouteDefinitionMap>
 	loaderError: Signal<Error | null>;
 	/** Parsed search params from the current route (reactive signal). */
 	searchParams: Signal<Record<string, unknown>>;
-	/** Navigate to a new URL path. */
-	navigate(url: RoutePaths<T>, options?: NavigateOptions): Promise<void>;
+	/** Navigate to a route pattern, interpolating params and search into the final URL. */
+	navigate<TPath extends RoutePattern<T>>(input: NavigateInput<TPath>): Promise<void>;
 	/** Re-run all loaders for the current route. */
 	revalidate(): Promise<void>;
 	/** Remove popstate listener and clean up the router. */

package/dist/src/test/index.js

@@ -1,6 +1,6 @@
 import {
   createRouter
-} from "../../shared/chunk-mj7b4t40.js";
+} from "../../shared/chunk-wymw818z.js";
 import {
   defineRoutes
 } from "../../shared/chunk-83g4h38e.js";
@@ -199,7 +199,7 @@ async function createTestRouter(routes, opts) {
   container.setAttribute("data-testid", "test-router-container");
   await renderCurrentRoute(router, container);
   async function navigate(path) {
-    await router.navigate(path);
+    await router.navigate({ to: path });
     await renderCurrentRoute(router, container);
   }
   return { component: container, navigate, router };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vertz/ui",
-  "version": "0.2.13",
+  "version": "0.2.15",
   "type": "module",
   "license": "MIT",
   "description": "Vertz UI framework — signals, components, JSX runtime",
@@ -69,11 +69,11 @@
     "typecheck": "tsc --noEmit"
   },
   "dependencies": {
-    "@vertz/fetch": "^0.2.12"
+    "@vertz/fetch": "^0.2.14"
   },
   "devDependencies": {
     "@happy-dom/global-registrator": "^20.7.0",
-    "@vertz/schema": "^0.2.12",
+    "@vertz/schema": "^0.2.14",
     "bunup": "^0.16.31",
     "happy-dom": "^20.7.0",
     "typescript": "^5.7.0"