@vireo-ai/trellis-ui 0.1.8 → 0.1.10

package/packages/client/types/cdn.d.ts

@@ -1,5 +1,2 @@
-import trellisUi, { bool, className, create, createMachine, createResizable, createVisibilityMachine, cx, defineManifest, defineProps, defineStyles, json, mergeBindings, motion, number, oneOf, propsFromSchema, resolveStyle, string, ui } from './index';
+import trellisUi from './index';
 export default trellisUi;
-export { trellisUi, ui };
-export { motion };
-export { bool, className, create, createMachine, createResizable, createVisibilityMachine, cx, defineManifest, defineProps, defineStyles, json, mergeBindings, number, oneOf, propsFromSchema, resolveStyle, string, };

package/packages/client/types/component-api.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Build-time entry point for public component Alpine APIs.
+ *
+ * @packageDocumentation
+ */
+export type { UiAccordionApi } from './components/accordion';
+export type { CheckboxState, UiCheckboxApi } from './components/checkbox';
+export type { UiDatePickerApi } from './components/date-picker';
+export type { UiModalApi, UiModalTriggerApi } from './components/modal';
+export type { UiPanelsApi } from './components/panels';
+export type { UiRadioGroupApi } from './components/radio';
+export type { UiDropdownApi } from './components/dropdown';
+export type { FileTransferStatus, FileUploadMetadata, FileUploadRecord, UiFileUploadApi } from './components/file-upload';
+export type { UiInputApi } from './components/input';
+export type { UiSelectApi } from './components/select';
+export type { UiScrollAreaApi } from './components/scroll-area';
+export type { UiSidebarApi } from './components/sidebar';
+export type { UiSliderApi } from './components/slider';
+export type { UiSwitchApi } from './components/switch';
+export type { UiTabsApi } from './components/tabs';
+export type { ToastDetail, UiToastApi, UiToastOutletApi } from './components/toast';

package/packages/client/types/components/accordion/contract.d.ts

@@ -1,4 +1,4 @@
-import { type PropState } from '../../runtime';
+import { type SchemaToProps } from '../../runtime';
 import { type HeadingLevel, type Orientation } from '../common';
 declare const ACCORDION_MODES: readonly ["single", "multiple"];
 declare const ACCORDION_ORIENTATIONS: readonly ["vertical", "horizontal"];
@@ -8,6 +8,7 @@ declare const ACCORDION_HEADING_AS: readonly ["h1", "h2", "h3", "h4", "h5", "h6"
 declare const ACCORDION_ITEM_HEADING_AS: readonly ["inherit", "h1", "h2", "h3", "h4", "h5", "h6"];
 declare const accordionSchema: {
     mode: import("../../runtime/codecs").OneOfCodec<"single" | "multiple">;
+    animate: import("../../runtime/codecs").BoolCodec;
     collapsible: import("../../runtime/codecs").BoolCodec;
     disabled: import("../../runtime/codecs").BoolCodec;
     orientation: import("../../runtime/codecs").OneOfCodec<"vertical" | "horizontal">;
@@ -26,6 +27,6 @@ type AccordionIconPosition = typeof ACCORDION_ICON_POSITIONS[number];
 type AccordionItemIconPosition = typeof ACCORDION_ITEM_ICON_POSITIONS[number];
 type AccordionHeadingAs = HeadingLevel;
 type AccordionItemHeadingAs = typeof ACCORDION_ITEM_HEADING_AS[number];
-type AccordionProps = PropState<typeof accordionSchema>;
+type AccordionProps = SchemaToProps<typeof accordionSchema>;
 export { ACCORDION_HEADING_AS, ACCORDION_ICON_POSITIONS, ACCORDION_ITEM_HEADING_AS, ACCORDION_ITEM_ICON_POSITIONS, ACCORDION_ORIENTATIONS, ACCORDION_MODES, accordionSchema, };
 export type { AccordionHeadingAs, AccordionIconPosition, AccordionItemHeadingAs, AccordionItemIconPosition, AccordionOrientation, AccordionProps, AccordionMode, };

package/packages/client/types/components/accordion/index.d.ts

@@ -1,46 +1,32 @@
 import type Alpine from 'alpinejs';
-import { type BindingObject, type CollectionNavigation, type TrellisAlpineComponent } from '../../runtime';
-import { type AccordionProps, type AccordionMode } from './contract';
-type AccordionItem = {
-    item: HTMLElement;
-    heading: HTMLElement | null;
-    trigger: HTMLButtonElement;
-    content: HTMLElement;
-    value: string;
-    isDisabled: boolean;
-};
-type AccordionData = {
-    props: AccordionProps;
-    openValues: Set<string>;
-    collection: CollectionNavigation | null;
-    cleanup: Array<() => void>;
-    root: BindingObject;
-    items(): AccordionItem[];
-    itemFromTrigger(trigger: HTMLElement): AccordionItem | null;
-    initialValues(): string[];
-    propValues(): string[];
-    normalizeValues(values: string[]): string[];
-    applyProps(changedKeys?: string[]): void;
-    isItemOpen(item: AccordionItem): boolean;
-    isItemDisabled(item: AccordionItem): boolean;
-    canCollapseOpenItem(item: AccordionItem): boolean;
-    toggleItem(item: AccordionItem, event?: Event): void;
-    setOpenValues(values: string[], dispatch?: boolean): void;
-    syncAll(): void;
-    syncRoot(): void;
-    syncItem(item: AccordionItem): void;
-    syncContent(content: HTMLElement, open: boolean): void;
-    setupTriggers(): void;
-    teardown(): void;
-    collectionNav(): CollectionNavigation;
-    handleTriggerKeydown(trigger: HTMLButtonElement, event: KeyboardEvent): void;
-    focusNext(): void;
-    focusPrevious(): void;
-    focusFirst(): void;
-    focusLast(): void;
-    dispatchChange(): void;
+import { type AlpineMachine, type BindingObject, type TrellisAlpineComponent } from '../../runtime';
+import { type AccordionMode, type AccordionProps } from './contract';
+import { accordionHooks, type AccordionContext } from './machine';
+/**
+ * Public Alpine API for `ui.accordion`.
+ *
+ * @public
+ */
+interface UiAccordionApi {
+    /** Open value in single mode, otherwise an empty string. */
+    readonly value: string;
+    /** Open values in document order. */
+    readonly values: readonly string[];
+    /** Opens an enabled item. In single mode it replaces the current value. */
+    open(value: string): void;
+    /** Closes an item when the current mode permits it. */
+    close(value: string): void;
+    /** Reverses an item's current disclosure state. */
+    toggle(value: string, event?: Event): void;
+    /** Whether an item belongs to the current open-value set. */
+    isOpen(value: string): boolean;
+}
+type AccordionData = AlpineMachine<AccordionContext, AccordionProps, typeof accordionHooks> & UiAccordionApi & {
+    readonly root: BindingObject;
+    init(): void;
+    destroy(): void;
 };
 declare const UiAccordion: () => TrellisAlpineComponent<AccordionData>;
 declare const registerAccordion: (AlpineInstance: Alpine.Alpine) => void;
-export { registerAccordion, UiAccordion, };
-export type { AccordionData, AccordionItem, AccordionMode };
+export { registerAccordion, UiAccordion };
+export type { AccordionData, AccordionMode, UiAccordionApi };

package/packages/client/types/components/accordion/machine.d.ts

@@ -0,0 +1,131 @@
+import { type Machine, type MachineScope } from '../../runtime/state-machine';
+import type { AccordionProps } from './contract';
+type AccordionContext = {
+    selection: {
+        values: string[];
+    };
+    change: {
+        openingValues: string[];
+        closingValues: string[];
+    };
+    collection: {
+        values: string[];
+        disabledValues: string[];
+    };
+};
+type AccordionTransitionData = {
+    value: string;
+};
+type AccordionMachineEffects = {
+    prepareChange(scope: MachineScope<AccordionContext, AccordionProps>): void;
+    finishChange(scope: MachineScope<AccordionContext, AccordionProps>): void;
+    syncProps(scope: MachineScope<AccordionContext, AccordionProps>): void;
+    syncItems(scope: MachineScope<AccordionContext, AccordionProps>): void;
+};
+type CreateAccordionMachineOptions = {
+    props: AccordionProps;
+    context: AccordionContext;
+    effects: AccordionMachineEffects;
+};
+declare const accordionHooks: readonly [Readonly<{
+    name: "opening";
+    state: string;
+    onDone: string;
+    onError: string;
+    required?: boolean;
+    sends?: Record<string, import("../..").TransitionEventCreator>;
+    project?: (snapshot: Readonly<{
+        value: import("../..").MachineStateValue;
+        tags: readonly string[];
+        context: Readonly<AccordionContext>;
+        props: Readonly<import("../..").SchemaToProps<{
+            mode: import("../../runtime/codecs").OneOfCodec<"single" | "multiple">;
+            animate: import("../../runtime/codecs").BoolCodec;
+            collapsible: import("../../runtime/codecs").BoolCodec;
+            disabled: import("../../runtime/codecs").BoolCodec;
+            orientation: import("../../runtime/codecs").OneOfCodec<"vertical" | "horizontal">;
+            defaultValue: import("../../runtime/codecs").StringCodec;
+            defaultValues: import("../../runtime/codecs").StringCodec;
+            value: import("../../runtime/codecs").StringCodec;
+            values: import("../../runtime/codecs").StringCodec;
+            loop: import("../../runtime/codecs").BoolCodec;
+            iconPosition: import("../../runtime/codecs").OneOfCodec<"leading" | "trailing">;
+            headingAs: import("../../runtime/codecs").OneOfCodec<"h1" | "h2" | "h3" | "h4" | "h5" | "h6">;
+            class: import("../../runtime/codecs").StringCodec;
+        }>>;
+        generations: Readonly<Record<string, number>>;
+    }>) => AccordionTransitionData;
+    projectEach?: (snapshot: Readonly<{
+        value: import("../..").MachineStateValue;
+        tags: readonly string[];
+        context: Readonly<AccordionContext>;
+        props: Readonly<import("../..").SchemaToProps<{
+            mode: import("../../runtime/codecs").OneOfCodec<"single" | "multiple">;
+            animate: import("../../runtime/codecs").BoolCodec;
+            collapsible: import("../../runtime/codecs").BoolCodec;
+            disabled: import("../../runtime/codecs").BoolCodec;
+            orientation: import("../../runtime/codecs").OneOfCodec<"vertical" | "horizontal">;
+            defaultValue: import("../../runtime/codecs").StringCodec;
+            defaultValues: import("../../runtime/codecs").StringCodec;
+            value: import("../../runtime/codecs").StringCodec;
+            values: import("../../runtime/codecs").StringCodec;
+            loop: import("../../runtime/codecs").BoolCodec;
+            iconPosition: import("../../runtime/codecs").OneOfCodec<"leading" | "trailing">;
+            headingAs: import("../../runtime/codecs").OneOfCodec<"h1" | "h2" | "h3" | "h4" | "h5" | "h6">;
+            class: import("../../runtime/codecs").StringCodec;
+        }>>;
+        generations: Readonly<Record<string, number>>;
+    }>) => readonly AccordionTransitionData[];
+}>, Readonly<{
+    name: "closing";
+    state: string;
+    onDone: string;
+    onError: string;
+    required?: boolean;
+    sends?: Record<string, import("../..").TransitionEventCreator>;
+    project?: (snapshot: Readonly<{
+        value: import("../..").MachineStateValue;
+        tags: readonly string[];
+        context: Readonly<AccordionContext>;
+        props: Readonly<import("../..").SchemaToProps<{
+            mode: import("../../runtime/codecs").OneOfCodec<"single" | "multiple">;
+            animate: import("../../runtime/codecs").BoolCodec;
+            collapsible: import("../../runtime/codecs").BoolCodec;
+            disabled: import("../../runtime/codecs").BoolCodec;
+            orientation: import("../../runtime/codecs").OneOfCodec<"vertical" | "horizontal">;
+            defaultValue: import("../../runtime/codecs").StringCodec;
+            defaultValues: import("../../runtime/codecs").StringCodec;
+            value: import("../../runtime/codecs").StringCodec;
+            values: import("../../runtime/codecs").StringCodec;
+            loop: import("../../runtime/codecs").BoolCodec;
+            iconPosition: import("../../runtime/codecs").OneOfCodec<"leading" | "trailing">;
+            headingAs: import("../../runtime/codecs").OneOfCodec<"h1" | "h2" | "h3" | "h4" | "h5" | "h6">;
+            class: import("../../runtime/codecs").StringCodec;
+        }>>;
+        generations: Readonly<Record<string, number>>;
+    }>) => AccordionTransitionData;
+    projectEach?: (snapshot: Readonly<{
+        value: import("../..").MachineStateValue;
+        tags: readonly string[];
+        context: Readonly<AccordionContext>;
+        props: Readonly<import("../..").SchemaToProps<{
+            mode: import("../../runtime/codecs").OneOfCodec<"single" | "multiple">;
+            animate: import("../../runtime/codecs").BoolCodec;
+            collapsible: import("../../runtime/codecs").BoolCodec;
+            disabled: import("../../runtime/codecs").BoolCodec;
+            orientation: import("../../runtime/codecs").OneOfCodec<"vertical" | "horizontal">;
+            defaultValue: import("../../runtime/codecs").StringCodec;
+            defaultValues: import("../../runtime/codecs").StringCodec;
+            value: import("../../runtime/codecs").StringCodec;
+            values: import("../../runtime/codecs").StringCodec;
+            loop: import("../../runtime/codecs").BoolCodec;
+            iconPosition: import("../../runtime/codecs").OneOfCodec<"leading" | "trailing">;
+            headingAs: import("../../runtime/codecs").OneOfCodec<"h1" | "h2" | "h3" | "h4" | "h5" | "h6">;
+            class: import("../../runtime/codecs").StringCodec;
+        }>>;
+        generations: Readonly<Record<string, number>>;
+    }>) => readonly AccordionTransitionData[];
+}>];
+declare const createAccordionMachine: ({ props, context, effects, }: CreateAccordionMachineOptions) => Machine<AccordionContext, AccordionProps>;
+export { accordionHooks, createAccordionMachine };
+export type { AccordionContext, AccordionMachineEffects, AccordionTransitionData, CreateAccordionMachineOptions, };

package/packages/client/types/components/accordion/runtime-docs.d.ts

@@ -0,0 +1,2 @@
+declare const accordionRuntimeDocs: import("../../docs/transition-docs").ComponentTransitionDocs;
+export { accordionRuntimeDocs };

package/packages/client/types/components/action/contract.d.ts

@@ -1,14 +1,14 @@
-import { type PropState } from '../../runtime';
+import { type SchemaToProps } from '../../runtime';
 declare const ACTION_METHODS: readonly ["get", "post", "dialog"];
 declare const actionSchema: {
     action: import("../../runtime/codecs").StringCodec;
-    method: import("../../runtime/codecs").OneOfCodec<"get" | "dialog" | "post">;
+    method: import("../../runtime/codecs").OneOfCodec<"dialog" | "get" | "post">;
     enctype: import("../../runtime/codecs").StringCodec;
     confirm: import("../../runtime/codecs").StringCodec;
     role: import("../../runtime/codecs").StringCodec;
     class: import("../../runtime/codecs").StringCodec;
 };
 type ActionMethod = typeof ACTION_METHODS[number];
-type ActionProps = PropState<typeof actionSchema>;
+type ActionProps = SchemaToProps<typeof actionSchema>;
 export { ACTION_METHODS, actionSchema };
 export type { ActionMethod, ActionProps };

package/packages/client/types/components/app/contract.d.ts

@@ -1,34 +1,47 @@
-import { type PropState } from '../../runtime';
-import { type Surface } from '../common';
+import { type SchemaToProps } from '../../runtime';
+import { type AbsoluteSurfaceReference, type ElevationReference, type SurfaceReference } from '../common';
 declare const APP_HEIGHTS: readonly ["screen", "min"];
 declare const APP_SIDEBARS: readonly ["left", "right", "both", "none"];
 declare const APP_MAIN_SCROLLS: readonly ["auto", "none"];
-declare const APP_HEADER_SURFACES: readonly ["none", "app", "chrome", "subtle", "panel", "raised", "overlay", "accent", "inverse"];
+declare const APP_SURFACES: readonly ["0", "1", "2", "3", "4", "5", "6", "7", "8"];
+declare const APP_REGION_SURFACES: readonly ["inherit", "0", "1", "2", "3", "4", "5", "6", "7", "8", "+1", "+2", "+3", "+4", "+5", "+6", "+7", "+8"];
+declare const APP_ELEVATIONS: readonly ["none", "match", "1", "2", "3", "4", "5", "6", "7", "8"];
+declare const appRegionSchema: {
+    surface: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "inherit" | "3" | "4" | "5" | "6" | "7" | "8" | "+1" | "+2" | "+3" | "+4" | "+5" | "+6" | "+7" | "+8">;
+    elevation: import("../../runtime/codecs").OneOfCodec<"1" | "match" | "2" | "none" | "3" | "4" | "5" | "6" | "7" | "8">;
+    class: import("../../runtime/codecs").StringCodec;
+};
 declare const appSchema: {
     id: import("../../runtime/codecs").StringCodec;
     height: import("../../runtime/codecs").OneOfCodec<"min" | "screen">;
     sidebar: import("../../runtime/codecs").OneOfCodec<"left" | "right" | "none" | "both">;
+    surface: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "3" | "4" | "5" | "6" | "7" | "8">;
+    elevation: import("../../runtime/codecs").OneOfCodec<"1" | "match" | "2" | "none" | "3" | "4" | "5" | "6" | "7" | "8">;
     class: import("../../runtime/codecs").StringCodec;
 };
 declare const appHeaderSchema: {
     sticky: import("../../runtime/codecs").BoolCodec;
-    surface: import("../../runtime/codecs").OneOfCodec<"none" | "subtle" | "accent" | "app" | "chrome" | "panel" | "raised" | "overlay" | "inverse">;
     divider: import("../../runtime/codecs").BoolCodec;
+    surface: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "inherit" | "3" | "4" | "5" | "6" | "7" | "8" | "+1" | "+2" | "+3" | "+4" | "+5" | "+6" | "+7" | "+8">;
+    elevation: import("../../runtime/codecs").OneOfCodec<"1" | "match" | "2" | "none" | "3" | "4" | "5" | "6" | "7" | "8">;
     class: import("../../runtime/codecs").StringCodec;
 };
 declare const appMainSchema: {
     id: import("../../runtime/codecs").StringCodec;
-    container: import("../../runtime/codecs").BoolCodec;
     scroll: import("../../runtime/codecs").OneOfCodec<"none" | "auto">;
-    class: import("../../runtime/codecs").StringCodec;
-};
-declare const appPanelSchema: {
+    surface: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "inherit" | "3" | "4" | "5" | "6" | "7" | "8" | "+1" | "+2" | "+3" | "+4" | "+5" | "+6" | "+7" | "+8">;
+    elevation: import("../../runtime/codecs").OneOfCodec<"1" | "match" | "2" | "none" | "3" | "4" | "5" | "6" | "7" | "8">;
     class: import("../../runtime/codecs").StringCodec;
 };
 type AppHeight = typeof APP_HEIGHTS[number];
-type AppHeaderSurface = Surface;
+type AppSurface = AbsoluteSurfaceReference;
+type AppRegionSurface = SurfaceReference;
+type AppElevation = ElevationReference;
 type AppMainScroll = typeof APP_MAIN_SCROLLS[number];
 type AppSidebar = typeof APP_SIDEBARS[number];
-type AppProps = PropState<typeof appSchema>;
-export { APP_HEADER_SURFACES, APP_HEIGHTS, APP_MAIN_SCROLLS, APP_SIDEBARS, appHeaderSchema, appMainSchema, appPanelSchema, appSchema, };
-export type { AppHeaderSurface, AppHeight, AppMainScroll, AppProps, AppSidebar };
+type AppProps = SchemaToProps<typeof appSchema>;
+type AppHeaderProps = SchemaToProps<typeof appHeaderSchema>;
+type AppMainProps = SchemaToProps<typeof appMainSchema>;
+type AppRegionProps = SchemaToProps<typeof appRegionSchema>;
+export { APP_ELEVATIONS, APP_HEIGHTS, APP_MAIN_SCROLLS, APP_REGION_SURFACES, APP_SIDEBARS, APP_SURFACES, appHeaderSchema, appMainSchema, appRegionSchema, appSchema, };
+export type { AppElevation, AppHeaderProps, AppHeight, AppMainProps, AppMainScroll, AppProps, AppRegionProps, AppRegionSurface, AppSidebar, AppSurface, };

package/packages/client/types/components/app/index.d.ts

@@ -1,2 +1,2 @@
-export { APP_HEIGHTS, APP_MAIN_SCROLLS, APP_SIDEBARS, appHeaderSchema, appMainSchema, appPanelSchema, appSchema } from './contract';
-export type { AppHeight, AppMainScroll, AppProps, AppSidebar } from './contract';
+export { APP_ELEVATIONS, APP_HEIGHTS, APP_MAIN_SCROLLS, APP_REGION_SURFACES, APP_SIDEBARS, APP_SURFACES, appHeaderSchema, appMainSchema, appRegionSchema, appSchema, } from './contract';
+export type { AppElevation, AppHeaderProps, AppHeight, AppMainProps, AppMainScroll, AppProps, AppRegionProps, AppRegionSurface, AppSidebar, AppSurface, } from './contract';

package/packages/client/types/components/badge/contract.d.ts

@@ -1,4 +1,4 @@
-import { type PropState } from '../../runtime';
+import { type SchemaToProps } from '../../runtime';
 import { type CommonButtonType, type ComponentRadius, type ControlSize, type IconVariant } from '../common';
 declare const BADGE_VARIANTS: readonly ["soft", "surface", "outline", "solid"];
 declare const BADGE_COLORS: readonly ["neutral", "accent", "success", "warning", "danger"];
@@ -14,7 +14,7 @@ declare const badgeSchema: {
     radius: import("../../runtime/codecs").OneOfCodec<"none" | "xs" | "sm" | "md" | "lg" | "full">;
     href: import("../../runtime/codecs").StringCodec;
     as: import("../../runtime/codecs").OneOfCodec<"button" | "span">;
-    type: import("../../runtime/codecs").OneOfCodec<"reset" | "submit" | "button">;
+    type: import("../../runtime/codecs").OneOfCodec<"button" | "submit" | "reset">;
     disabled: import("../../runtime/codecs").BoolCodec;
     icon: import("../../runtime/codecs").StringCodec;
     iconTrailing: import("../../runtime/codecs").StringCodec;
@@ -23,7 +23,7 @@ declare const badgeSchema: {
     class: import("../../runtime/codecs").StringCodec;
 };
 declare const badgeCloseSchema: {
-    type: import("../../runtime/codecs").OneOfCodec<"reset" | "submit" | "button">;
+    type: import("../../runtime/codecs").OneOfCodec<"button" | "submit" | "reset">;
     disabled: import("../../runtime/codecs").BoolCodec;
     icon: import("../../runtime/codecs").StringCodec;
     iconVariant: import("../../runtime/codecs").OneOfCodec<"outline" | "solid" | "mini" | "micro">;
@@ -38,7 +38,7 @@ type BadgeRadius = ComponentRadius;
 type BadgeAs = typeof BADGE_AS_VALUES[number];
 type BadgeType = CommonButtonType;
 type BadgeIconVariant = IconVariant;
-type BadgeProps = PropState<typeof badgeSchema>;
-type BadgeCloseProps = PropState<typeof badgeCloseSchema>;
+type BadgeProps = SchemaToProps<typeof badgeSchema>;
+type BadgeCloseProps = SchemaToProps<typeof badgeCloseSchema>;
 export { BADGE_AS_VALUES, BADGE_COLORS, BADGE_ICON_VARIANTS, BADGE_RADII, BADGE_SIZES, BADGE_TYPES, BADGE_VARIANTS, badgeCloseSchema, badgeSchema, };
 export type { BadgeAs, BadgeCloseProps, BadgeColor, BadgeIconVariant, BadgeProps, BadgeRadius, BadgeSize, BadgeType, BadgeVariant, };

package/packages/client/types/components/box/contract.d.ts

@@ -1,52 +1,49 @@
-import { type PropState } from '../../runtime';
-import { type ComponentRadius, type Elevation, type LayoutSpace, type Surface, type SurfaceTone } from '../common';
+import { type SchemaToProps } from '../../runtime';
+import { type ComponentRadius, type ElevationReference, type LayoutSpace, type SurfaceReference } from '../common';
 declare const BOX_AS_VALUES: readonly ["div", "section", "article", "aside", "header", "footer", "main", "nav", "form", "ul", "ol", "li", "span"];
 declare const BOX_LAYOUTS: readonly ["block", "stack", "row", "cluster", "grid", "center"];
-declare const BOX_SPACES: readonly ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"];
+declare const BOX_SPACES: readonly ["0", "0.5", "1", "1.5", "2", "2.5", "3", "3.5", "4", "4.5", "5", "5.5", "6", "6.5", "7", "7.5", "8", "8.5", "9", "9.5", "10", "10.5", "11", "11.5", "12"];
 declare const BOX_COLUMNS: readonly ["none", "1", "2", "3", "4", "5", "6"];
-declare const BOX_SURFACES: readonly ["none", "app", "chrome", "subtle", "panel", "raised", "overlay", "accent", "inverse"];
-declare const BOX_TONES: readonly ["solid", "alpha"];
+declare const BOX_SURFACES: readonly ["inherit", "0", "1", "2", "3", "4", "5", "6", "7", "8", "+1", "+2", "+3", "+4", "+5", "+6", "+7", "+8"];
 declare const BOX_RADII: readonly ["none", "xs", "sm", "md", "lg", "full"];
-declare const BOX_ELEVATIONS: readonly ["none", "1", "2", "3", "4", "5", "6"];
+declare const BOX_ELEVATIONS: readonly ["none", "match", "1", "2", "3", "4", "5", "6", "7", "8"];
 declare const BOX_WIDTHS: readonly ["auto", "full", "xs", "sm", "md", "lg", "xl", "prose"];
 declare const BOX_HEIGHTS: ("xs" | "sm" | "md" | "lg" | "full" | "auto" | "xl")[];
 declare const BOX_ALIGNS: readonly ["start", "center", "end", "stretch"];
 declare const BOX_JUSTIFIES: readonly ["start", "center", "end", "between"];
 declare const boxSchema: {
     as: import("../../runtime/codecs").OneOfCodec<"article" | "aside" | "div" | "footer" | "form" | "header" | "li" | "main" | "nav" | "ol" | "section" | "span" | "ul">;
-    layout: import("../../runtime/codecs").OneOfCodec<"grid" | "center" | "stack" | "block" | "row" | "cluster">;
-    gap: import("../../runtime/codecs").OneOfCodec<"0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9">;
-    gapX: import("../../runtime/codecs").OneOfCodec<"0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9">;
-    gapY: import("../../runtime/codecs").OneOfCodec<"0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9">;
-    columns: import("../../runtime/codecs").OneOfCodec<"1" | "none" | "2" | "3" | "4" | "5" | "6">;
-    padding: import("../../runtime/codecs").OneOfCodec<"0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9">;
-    paddingX: import("../../runtime/codecs").OneOfCodec<"0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9">;
-    paddingY: import("../../runtime/codecs").OneOfCodec<"0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9">;
-    margin: import("../../runtime/codecs").OneOfCodec<"0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9">;
-    marginX: import("../../runtime/codecs").OneOfCodec<"0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9">;
-    marginY: import("../../runtime/codecs").OneOfCodec<"0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9">;
-    surface: import("../../runtime/codecs").OneOfCodec<"none" | "subtle" | "accent" | "app" | "chrome" | "panel" | "raised" | "overlay" | "inverse">;
-    tone: import("../../runtime/codecs").OneOfCodec<"solid" | "alpha">;
+    layout: import("../../runtime/codecs").OneOfCodec<"center" | "grid" | "stack" | "row" | "block" | "cluster">;
+    gap: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6.5" | "7.5" | "8.5" | "9.5" | "10.5" | "11.5">;
+    gapX: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6.5" | "7.5" | "8.5" | "9.5" | "10.5" | "11.5">;
+    gapY: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6.5" | "7.5" | "8.5" | "9.5" | "10.5" | "11.5">;
+    columns: import("../../runtime/codecs").OneOfCodec<"1" | "2" | "none" | "3" | "4" | "5" | "6">;
+    padding: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6.5" | "7.5" | "8.5" | "9.5" | "10.5" | "11.5">;
+    paddingX: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6.5" | "7.5" | "8.5" | "9.5" | "10.5" | "11.5">;
+    paddingY: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6.5" | "7.5" | "8.5" | "9.5" | "10.5" | "11.5">;
+    margin: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6.5" | "7.5" | "8.5" | "9.5" | "10.5" | "11.5">;
+    marginX: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6.5" | "7.5" | "8.5" | "9.5" | "10.5" | "11.5">;
+    marginY: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6.5" | "7.5" | "8.5" | "9.5" | "10.5" | "11.5">;
+    surface: import("../../runtime/codecs").OneOfCodec<"1" | "0" | "2" | "inherit" | "3" | "4" | "5" | "6" | "7" | "8" | "+1" | "+2" | "+3" | "+4" | "+5" | "+6" | "+7" | "+8">;
     radius: import("../../runtime/codecs").OneOfCodec<"none" | "xs" | "sm" | "md" | "lg" | "full">;
-    elevation: import("../../runtime/codecs").OneOfCodec<"1" | "none" | "2" | "3" | "4" | "5" | "6">;
+    elevation: import("../../runtime/codecs").OneOfCodec<"1" | "match" | "2" | "none" | "3" | "4" | "5" | "6" | "7" | "8">;
     width: import("../../runtime/codecs").OneOfCodec<"xs" | "sm" | "md" | "lg" | "full" | "auto" | "xl" | "prose">;
     height: import("../../runtime/codecs").OneOfCodec<"xs" | "sm" | "md" | "lg" | "full" | "auto" | "xl">;
-    align: import("../../runtime/codecs").OneOfCodec<"end" | "center" | "start" | "stretch">;
-    justify: import("../../runtime/codecs").OneOfCodec<"end" | "center" | "start" | "between">;
+    align: import("../../runtime/codecs").OneOfCodec<"start" | "center" | "end" | "stretch">;
+    justify: import("../../runtime/codecs").OneOfCodec<"start" | "center" | "end" | "between">;
     class: import("../../runtime/codecs").StringCodec;
 };
 type BoxAs = typeof BOX_AS_VALUES[number];
 type BoxLayout = typeof BOX_LAYOUTS[number];
 type BoxSpace = LayoutSpace;
 type BoxColumns = typeof BOX_COLUMNS[number];
-type BoxSurface = Surface;
-type BoxTone = SurfaceTone;
+type BoxSurface = SurfaceReference;
 type BoxRadius = ComponentRadius;
-type BoxElevation = Elevation;
+type BoxElevation = ElevationReference;
 type BoxWidth = typeof BOX_WIDTHS[number];
 type BoxHeight = typeof BOX_HEIGHTS[number];
 type BoxAlign = typeof BOX_ALIGNS[number];
 type BoxJustify = typeof BOX_JUSTIFIES[number];
-type BoxProps = PropState<typeof boxSchema>;
-export { BOX_ALIGNS, BOX_AS_VALUES, BOX_COLUMNS, BOX_ELEVATIONS, BOX_HEIGHTS, BOX_JUSTIFIES, BOX_LAYOUTS, BOX_RADII, BOX_SPACES, BOX_SURFACES, BOX_TONES, BOX_WIDTHS, boxSchema, };
-export type { BoxAlign, BoxAs, BoxColumns, BoxElevation, BoxHeight, BoxJustify, BoxLayout, BoxProps, BoxRadius, BoxSpace, BoxSurface, BoxTone, BoxWidth, };
+type BoxProps = SchemaToProps<typeof boxSchema>;
+export { BOX_ALIGNS, BOX_AS_VALUES, BOX_COLUMNS, BOX_ELEVATIONS, BOX_HEIGHTS, BOX_JUSTIFIES, BOX_LAYOUTS, BOX_RADII, BOX_SPACES, BOX_SURFACES, BOX_WIDTHS, boxSchema, };
+export type { BoxAlign, BoxAs, BoxColumns, BoxElevation, BoxHeight, BoxJustify, BoxLayout, BoxProps, BoxRadius, BoxSpace, BoxSurface, BoxWidth, };

package/packages/client/types/components/brand/contract.d.ts

@@ -1,4 +1,4 @@
-import { type PropState } from '../../runtime';
+import { type SchemaToProps } from '../../runtime';
 import { type ControlSize } from '../common';
 declare const BRAND_DISPLAY_VALUES: readonly ["full", "logo", "text"];
 declare const BRAND_SIZES: readonly ["xs", "sm", "md", "lg", "xlg"];
@@ -13,6 +13,6 @@ declare const brandSchema: {
 };
 type BrandDisplay = typeof BRAND_DISPLAY_VALUES[number];
 type BrandSize = ControlSize;
-type BrandProps = PropState<typeof brandSchema>;
+type BrandProps = SchemaToProps<typeof brandSchema>;
 export { BRAND_DISPLAY_VALUES, BRAND_SIZES, brandSchema, };
 export type { BrandDisplay, BrandProps, BrandSize, };

package/packages/client/types/components/button/contract.d.ts

@@ -1,4 +1,4 @@
-import { type PropState } from '../../runtime';
+import { type SchemaToProps } from '../../runtime';
 import { BUTTON_TYPES, type Alignment, type CommonButtonType, type ComponentRadius, type ControlSize, type IconVariant } from '../common';
 declare const BUTTON_VARIANTS: readonly ["ghost", "soft", "surface", "outline", "solid", "link"];
 declare const BUTTON_COLORS: readonly ["neutral", "accent", "danger"];
@@ -8,11 +8,11 @@ declare const BUTTON_ALIGNS: readonly ["start", "center", "end"];
 declare const BUTTON_RADII: readonly ["none", "xs", "sm", "md", "lg", "full"];
 declare const BUTTON_LOADING_MODES: readonly ["auto", "true", "false"];
 declare const buttonSchema: {
-    variant: import("../../runtime/codecs").OneOfCodec<"outline" | "link" | "solid" | "ghost" | "soft" | "surface">;
+    variant: import("../../runtime/codecs").OneOfCodec<"link" | "outline" | "solid" | "ghost" | "soft" | "surface">;
     color: import("../../runtime/codecs").OneOfCodec<"accent" | "danger" | "neutral">;
     size: import("../../runtime/codecs").OneOfCodec<"xs" | "sm" | "md" | "lg" | "xlg">;
     radius: import("../../runtime/codecs").OneOfCodec<"none" | "xs" | "sm" | "md" | "lg" | "full">;
-    type: import("../../runtime/codecs").OneOfCodec<"reset" | "submit" | "button">;
+    type: import("../../runtime/codecs").OneOfCodec<"button" | "submit" | "reset">;
     href: import("../../runtime/codecs").StringCodec;
     disabled: import("../../runtime/codecs").BoolCodec;
     loading: import("../../runtime/codecs").OneOfCodec<"true" | "false" | "auto">;
@@ -20,7 +20,7 @@ declare const buttonSchema: {
     iconTrailing: import("../../runtime/codecs").StringCodec;
     iconVariant: import("../../runtime/codecs").OneOfCodec<"outline" | "solid" | "mini" | "micro">;
     square: import("../../runtime/codecs").BoolCodec;
-    align: import("../../runtime/codecs").OneOfCodec<"end" | "center" | "start">;
+    align: import("../../runtime/codecs").OneOfCodec<"start" | "center" | "end">;
     inset: import("../../runtime/codecs").StringCodec;
     class: import("../../runtime/codecs").StringCodec;
 };
@@ -32,6 +32,6 @@ type ButtonType = CommonButtonType;
 type ButtonIconVariant = IconVariant;
 type ButtonAlign = Alignment;
 type ButtonLoadingMode = typeof BUTTON_LOADING_MODES[number];
-type ButtonProps = PropState<typeof buttonSchema>;
+type ButtonProps = SchemaToProps<typeof buttonSchema>;
 export { BUTTON_ALIGNS, BUTTON_COLORS, BUTTON_ICON_VARIANTS, BUTTON_LOADING_MODES, BUTTON_RADII, BUTTON_SIZES, BUTTON_TYPES, BUTTON_VARIANTS, buttonSchema, };
 export type { ButtonAlign, ButtonColor, ButtonIconVariant, ButtonLoadingMode, ButtonProps, ButtonRadius, ButtonSize, ButtonType, ButtonVariant, };