@vireo-ai/trellis-ui 0.1.8 → 0.1.10

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

@@ -1,4 +1,4 @@
-import { type PropState } from '../../runtime';
+import { type SchemaToProps } from '../../runtime';
 declare const TABLE_LAYOUTS: readonly ["auto", "fixed"];
 declare const TABLE_DENSITIES: readonly ["compact", "default", "comfortable"];
 declare const TABLE_VARIANTS: readonly ["ghost", "surface"];
@@ -14,7 +14,7 @@ declare const tableSchema: {
     layout: import("../../runtime/codecs").OneOfCodec<"fixed" | "auto">;
     density: import("../../runtime/codecs").OneOfCodec<"default" | "compact" | "comfortable">;
     variant: import("../../runtime/codecs").OneOfCodec<"ghost" | "surface">;
-    border: import("../../runtime/codecs").OneOfCodec<"grid" | "none" | "row">;
+    border: import("../../runtime/codecs").OneOfCodec<"none" | "grid" | "row">;
     flush: import("../../runtime/codecs").BoolCodec;
     zebra: import("../../runtime/codecs").BoolCodec;
     hover: import("../../runtime/codecs").BoolCodec;
@@ -25,7 +25,7 @@ declare const tableSchema: {
     tableClass: import("../../runtime/codecs").StringCodec;
 };
 declare const tableCaptionSchema: {
-    side: import("../../runtime/codecs").OneOfCodec<"bottom" | "top">;
+    side: import("../../runtime/codecs").OneOfCodec<"top" | "bottom">;
     class: import("../../runtime/codecs").StringCodec;
 };
 declare const tableSectionSchema: {
@@ -39,8 +39,8 @@ declare const tableRowSchema: {
     class: import("../../runtime/codecs").StringCodec;
 };
 declare const tableColumnSchema: {
-    align: import("../../runtime/codecs").OneOfCodec<"end" | "center" | "start">;
-    valign: import("../../runtime/codecs").OneOfCodec<"bottom" | "top" | "baseline" | "middle">;
+    align: import("../../runtime/codecs").OneOfCodec<"start" | "center" | "end">;
+    valign: import("../../runtime/codecs").OneOfCodec<"top" | "bottom" | "baseline" | "middle">;
     key: import("../../runtime/codecs").StringCodec;
     target: import("../../runtime/codecs").StringCodec;
     width: import("../../runtime/codecs").StringCodec;
@@ -61,14 +61,14 @@ declare const tableColumnFilterSchema: {
     class: import("../../runtime/codecs").StringCodec;
 };
 declare const tableRowHeaderSchema: {
-    align: import("../../runtime/codecs").OneOfCodec<"end" | "center" | "start">;
-    valign: import("../../runtime/codecs").OneOfCodec<"bottom" | "top" | "baseline" | "middle">;
+    align: import("../../runtime/codecs").OneOfCodec<"start" | "center" | "end">;
+    valign: import("../../runtime/codecs").OneOfCodec<"top" | "bottom" | "baseline" | "middle">;
     scope: import("../../runtime/codecs").OneOfCodec<"row" | "rowgroup">;
     class: import("../../runtime/codecs").StringCodec;
 };
 declare const tableCellSchema: {
-    align: import("../../runtime/codecs").OneOfCodec<"end" | "center" | "start">;
-    valign: import("../../runtime/codecs").OneOfCodec<"bottom" | "top" | "baseline" | "middle">;
+    align: import("../../runtime/codecs").OneOfCodec<"start" | "center" | "end">;
+    valign: import("../../runtime/codecs").OneOfCodec<"top" | "bottom" | "baseline" | "middle">;
     class: import("../../runtime/codecs").StringCodec;
 };
 declare const tableEmptySchema: {
@@ -87,14 +87,14 @@ type TableSort = typeof TABLE_SORTS[number];
 type TableColumnScope = typeof TABLE_COLUMN_SCOPES[number];
 type TableRowHeaderScope = typeof TABLE_ROW_HEADER_SCOPES[number];
 type TableFilterAs = typeof TABLE_FILTER_AS_VALUES[number];
-type TableProps = PropState<typeof tableSchema>;
-type TableCaptionProps = PropState<typeof tableCaptionSchema>;
-type TableSectionProps = PropState<typeof tableSectionSchema>;
-type TableRowProps = PropState<typeof tableRowSchema>;
-type TableColumnProps = PropState<typeof tableColumnSchema>;
-type TableColumnFilterProps = PropState<typeof tableColumnFilterSchema>;
-type TableRowHeaderProps = PropState<typeof tableRowHeaderSchema>;
-type TableCellProps = PropState<typeof tableCellSchema>;
-type TableEmptyProps = PropState<typeof tableEmptySchema>;
+type TableProps = SchemaToProps<typeof tableSchema>;
+type TableCaptionProps = SchemaToProps<typeof tableCaptionSchema>;
+type TableSectionProps = SchemaToProps<typeof tableSectionSchema>;
+type TableRowProps = SchemaToProps<typeof tableRowSchema>;
+type TableColumnProps = SchemaToProps<typeof tableColumnSchema>;
+type TableColumnFilterProps = SchemaToProps<typeof tableColumnFilterSchema>;
+type TableRowHeaderProps = SchemaToProps<typeof tableRowHeaderSchema>;
+type TableCellProps = SchemaToProps<typeof tableCellSchema>;
+type TableEmptyProps = SchemaToProps<typeof tableEmptySchema>;
 export { TABLE_ALIGNS, TABLE_BORDERS, TABLE_COLUMN_SCOPES, TABLE_DENSITIES, TABLE_FILTER_AS_VALUES, TABLE_LAYOUTS, TABLE_ROW_HEADER_SCOPES, TABLE_SORTS, TABLE_VALIGNS, TABLE_VARIANTS, TABLE_WIDTHS, tableCaptionSchema, tableCellSchema, tableColumnFilterSchema, tableColumnSchema, tableEmptySchema, tableRowHeaderSchema, tableRowSchema, tableSchema, tableSectionSchema, };
 export type { TableAlign, TableBorder, TableCaptionProps, TableCellProps, TableColumnFilterProps, TableColumnProps, TableColumnScope, TableDensity, TableEmptyProps, TableFilterAs, TableLayout, TableProps, TableRowHeaderProps, TableRowHeaderScope, TableRowProps, TableSectionProps, TableSort, TableValign, TableVariant, TableWidth, };

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

@@ -1,25 +1,30 @@
-import { type PropState } from '../../runtime';
-import { type Orientation } from '../common';
+import { type SchemaToProps } from '../../runtime';
+import { type LayoutSpace, type Orientation } from '../common';
 declare const TABS_ACTIVATIONS: readonly ["manual", "automatic"];
 declare const TABS_ORIENTATIONS: readonly ["vertical", "horizontal"];
 declare const TABS_LIST_ORIENTATIONS: readonly ["inherit", "vertical", "horizontal"];
+declare const TABS_LIST_GAPS: readonly ["auto", "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 TABS_VARIANTS: readonly ["subtle", "line", "segmented", "pills"];
 declare const TABS_SIZES: readonly ["sm", "md"];
 declare const tabsSchema: {
     id: import("../../runtime/codecs").StringCodec;
+    animate: import("../../runtime/codecs").BoolCodec;
     defaultValue: import("../../runtime/codecs").StringCodec;
     value: import("../../runtime/codecs").StringCodec;
     activation: import("../../runtime/codecs").OneOfCodec<"manual" | "automatic">;
     orientation: import("../../runtime/codecs").OneOfCodec<"vertical" | "horizontal">;
+    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" | "auto">;
     loop: import("../../runtime/codecs").BoolCodec;
     panels: import("../../runtime/codecs").StringCodec;
     class: import("../../runtime/codecs").StringCodec;
 };
 type TabsActivation = typeof TABS_ACTIVATIONS[number];
 type TabsOrientation = Orientation;
+type TabsGap = 'auto' | LayoutSpace;
 type TabsListOrientation = typeof TABS_LIST_ORIENTATIONS[number];
+type TabsListGap = TabsGap;
 type TabsVariant = typeof TABS_VARIANTS[number];
 type TabsSize = typeof TABS_SIZES[number];
-type TabsProps = PropState<typeof tabsSchema>;
-export { TABS_ACTIVATIONS, TABS_LIST_ORIENTATIONS, TABS_ORIENTATIONS, TABS_SIZES, TABS_VARIANTS, tabsSchema, };
-export type { TabsActivation, TabsListOrientation, TabsOrientation, TabsProps, TabsSize, TabsVariant, };
+type TabsProps = SchemaToProps<typeof tabsSchema>;
+export { TABS_ACTIVATIONS, TABS_LIST_ORIENTATIONS, TABS_LIST_GAPS, TABS_ORIENTATIONS, TABS_SIZES, TABS_VARIANTS, tabsSchema, };
+export type { TabsActivation, TabsGap, TabsListOrientation, TabsListGap, TabsOrientation, TabsProps, TabsSize, TabsVariant, };

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

@@ -1,13 +1,8 @@
 import type Alpine from 'alpinejs';
-import { type BindingObject, type CollectionNavigation, type TrellisAlpineComponent } from '../../runtime';
-import { type TabsOrientation, type TabsProps, type TabsVariant, type TabsSize } from './contract';
-type TabsTabElement = HTMLButtonElement | HTMLAnchorElement;
-type TabsItem = {
-    tab: TabsTabElement;
-    value: string;
-    isDisabled: boolean;
-    panel: HTMLElement | null;
-};
+import { type AlpineMachine, type BindingObject, type TrellisAlpineComponent } from '../../runtime';
+import { type MotionHandle, type MotionTransitionSubject } from '../../motion';
+import { type TabsProps } from './contract';
+import { type TabsContext, tabsHooks } from './machine';
 type TabsChangeDetail = {
     value: string;
 };
@@ -15,48 +10,35 @@ type TabsActivateDetail = {
     value: string;
     panelId: string;
 };
-type TabsData = {
-    props: TabsProps;
-    activeValue: string;
-    collection: CollectionNavigation | null;
-    cleanup: Array<() => void>;
-    root: BindingObject;
-    owner(): string;
-    ownsElement(element: Element): boolean;
-    lists(): HTMLElement[];
-    primaryList(): HTMLElement | null;
-    listVariant(): TabsVariant;
-    listSize(): TabsSize;
-    listOrientation(list?: HTMLElement | null): TabsOrientation;
-    tabs(): TabsItem[];
-    panels(): HTMLElement[];
-    panelForValue(value: string): HTMLElement | null;
-    initialValue(): string;
-    fallbackValue(): string;
-    applyProps(changedKeys?: string[]): void;
-    setActiveValue(value: string, tab?: TabsTabElement): void;
-    syncAll(): void;
-    syncRoot(): void;
-    syncList(list: HTMLElement): void;
-    syncTab(item: TabsItem): void;
-    syncPanel(panel: HTMLElement): void;
-    setupEvents(): void;
-    teardown(): void;
-    tabFromEvent(event: Event): TabsTabElement | null;
-    itemFromTab(tab: TabsTabElement): TabsItem | null;
-    collectionNav(): CollectionNavigation;
-    handleClick(event: Event): void;
-    handleFocus(event: Event): void;
-    handleKeydown(event: KeyboardEvent): void;
-    focusNext(): void;
-    focusPrevious(): void;
-    focusFirst(): void;
-    focusLast(): void;
-    activateFocused(): void;
-    dispatchChange(): void;
-    dispatchActivate(tab: TabsTabElement, panel: HTMLElement | null): void;
+/**
+ * Public Alpine API for `ui.tabs`.
+ *
+ * @public
+ */
+interface UiTabsApi {
+    /** Currently selected tab value. */
+    readonly value: string;
+    /** Select an enabled tab that belongs to this Tabs owner. */
+    select(value: string): void;
+    /** Whether `value` is currently selected. */
+    isActive(value: string): boolean;
+}
+type TabsData = AlpineMachine<TabsContext, TabsProps, typeof tabsHooks> & UiTabsApi & {
+    readonly root: BindingObject;
+    init(): void;
+    destroy(): void;
+    transitionIndicator(transition: TabsMotionTransition): MotionHandle | Promise<void>;
 };
+type TabsMotionTransition = MotionTransitionSubject & Readonly<{
+    el: unknown;
+    event: {
+        motion?: boolean;
+    };
+    props: {
+        animate: boolean;
+    };
+}>;
 declare const UiTabs: () => TrellisAlpineComponent<TabsData>;
 declare const registerTabs: (AlpineInstance: Alpine.Alpine) => void;
-export { registerTabs, UiTabs, };
-export type { TabsActivateDetail, TabsChangeDetail, TabsData, TabsItem };
+export { registerTabs, UiTabs };
+export type { TabsActivateDetail, TabsChangeDetail, UiTabsApi };

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

@@ -0,0 +1,84 @@
+import { type Machine, type MachineScope } from '../../runtime/state-machine';
+import type { TabsProps } from './contract';
+type TabsContext = {
+    selection: {
+        value: string;
+    };
+    change: {
+        previousValue: string;
+        value: string;
+        panelId: string;
+    };
+    collection: {
+        values: string[];
+        disabledValues: string[];
+        panelIds: Record<string, string>;
+    };
+};
+type TabsTransitionData = TabsContext['change'];
+type TabsMachineEffects = {
+    prepareSwitch(scope: MachineScope<TabsContext, TabsProps>): void;
+    finishSwitch(scope: MachineScope<TabsContext, TabsProps>): void;
+    syncProps(scope: MachineScope<TabsContext, TabsProps>): void;
+    syncItems(scope: MachineScope<TabsContext, TabsProps>): void;
+};
+type CreateTabsMachineOptions = {
+    props: TabsProps;
+    context: TabsContext;
+    effects: TabsMachineEffects;
+};
+declare const tabsHooks: readonly [Readonly<{
+    name: "switching";
+    state: string;
+    onDone: string;
+    onError: string;
+    required?: boolean;
+    sends?: Record<string, import("../..").TransitionEventCreator>;
+    project?: (snapshot: Readonly<{
+        value: import("../..").MachineStateValue;
+        tags: readonly string[];
+        context: Readonly<TabsContext>;
+        props: Readonly<import("../..").SchemaToProps<{
+            id: import("../../runtime/codecs").StringCodec;
+            animate: import("../../runtime/codecs").BoolCodec;
+            defaultValue: import("../../runtime/codecs").StringCodec;
+            value: import("../../runtime/codecs").StringCodec;
+            activation: import("../../runtime/codecs").OneOfCodec<"manual" | "automatic">;
+            orientation: import("../../runtime/codecs").OneOfCodec<"vertical" | "horizontal">;
+            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" | "auto">;
+            loop: import("../../runtime/codecs").BoolCodec;
+            panels: import("../../runtime/codecs").StringCodec;
+            class: import("../../runtime/codecs").StringCodec;
+        }>>;
+        generations: Readonly<Record<string, number>>;
+    }>) => {
+        previousValue: string;
+        value: string;
+        panelId: string;
+    };
+    projectEach?: (snapshot: Readonly<{
+        value: import("../..").MachineStateValue;
+        tags: readonly string[];
+        context: Readonly<TabsContext>;
+        props: Readonly<import("../..").SchemaToProps<{
+            id: import("../../runtime/codecs").StringCodec;
+            animate: import("../../runtime/codecs").BoolCodec;
+            defaultValue: import("../../runtime/codecs").StringCodec;
+            value: import("../../runtime/codecs").StringCodec;
+            activation: import("../../runtime/codecs").OneOfCodec<"manual" | "automatic">;
+            orientation: import("../../runtime/codecs").OneOfCodec<"vertical" | "horizontal">;
+            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" | "auto">;
+            loop: import("../../runtime/codecs").BoolCodec;
+            panels: import("../../runtime/codecs").StringCodec;
+            class: import("../../runtime/codecs").StringCodec;
+        }>>;
+        generations: Readonly<Record<string, number>>;
+    }>) => readonly {
+        previousValue: string;
+        value: string;
+        panelId: string;
+    }[];
+}>];
+declare const createTabsMachine: ({ props, context, effects, }: CreateTabsMachineOptions) => Machine<TabsContext, TabsProps>;
+export { createTabsMachine, tabsHooks };
+export type { CreateTabsMachineOptions, TabsContext, TabsMachineEffects, TabsTransitionData, };

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

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

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

@@ -1,6 +1,6 @@
 import { type TypographyColor } from '../common';
 declare const TEXT_AS_VALUES: readonly ["span", "p", "div", "label", "kbd", "code", "strong"];
-declare const TEXT_SIZE_VALUES: readonly ["xs", "sm", "base", "lg", "xl", "2xl"];
+declare const TEXT_SIZE_VALUES: readonly ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13"];
 declare const TEXT_WEIGHT_VALUES: readonly ["normal", "medium", "semibold", "bold"];
 declare const TEXT_COLOR_VALUES: readonly ["inherit", "muted", "subtle", "accent", "danger"];
 type TextAs = typeof TEXT_AS_VALUES[number];

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

@@ -1,4 +1,4 @@
-import { type PropState } from '../../runtime';
+import { type SchemaToProps } from '../../runtime';
 declare const TEXTAREA_RESIZE_VALUES: readonly ["vertical", "horizontal", "both", "none"];
 type TextareaResize = typeof TEXTAREA_RESIZE_VALUES[number];
 declare const textareaSchema: {
@@ -18,6 +18,6 @@ declare const textareaSchema: {
     controlClass: import("../../runtime/codecs").StringCodec;
     class: import("../../runtime/codecs").StringCodec;
 };
-type TextareaProps = PropState<typeof textareaSchema>;
+type TextareaProps = SchemaToProps<typeof textareaSchema>;
 export { textareaSchema, TEXTAREA_RESIZE_VALUES };
 export type { TextareaProps, TextareaResize };

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

@@ -1,4 +1,4 @@
-import { type PropState } from '../../runtime';
+import { type PropState, type SchemaToProps } from '../../runtime';
 declare const TOAST_LEVELS: readonly ["info", "success", "warning", "danger", "debug"];
 declare const TOAST_COLORS: readonly ["auto", "neutral", "accent", "success", "warning", "danger"];
 declare const TOAST_RESOLVED_COLORS: readonly ["neutral", "accent", "success", "warning", "danger"];
@@ -6,8 +6,8 @@ declare const TOAST_VARIANTS: readonly ["default", "soft", "surface", "solid", "
 declare const TOAST_POSITIONS: readonly ["top-right", "top-left", "top-center", "bottom-right", "bottom-left", "bottom-center"];
 declare const toastSchema: {
     level: import("../../runtime/codecs").OneOfCodec<"danger" | "success" | "warning" | "info" | "debug">;
-    color: import("../../runtime/codecs").OneOfCodec<"accent" | "danger" | "neutral" | "success" | "warning" | "auto">;
-    variant: import("../../runtime/codecs").OneOfCodec<"outline" | "default" | "solid" | "soft" | "surface">;
+    color: import("../../runtime/codecs").OneOfCodec<"accent" | "danger" | "neutral" | "auto" | "success" | "warning">;
+    variant: import("../../runtime/codecs").OneOfCodec<"default" | "outline" | "solid" | "soft" | "surface">;
     title: import("../../runtime/codecs").StringCodec;
     description: import("../../runtime/codecs").StringCodec;
     duration: import("../../runtime/codecs").NumberCodec;
@@ -21,6 +21,7 @@ declare const toastOutletSchema: {
     position: import("../../runtime/codecs").OneOfCodec<"top-right" | "top-left" | "top-center" | "bottom-right" | "bottom-left" | "bottom-center">;
     duration: import("../../runtime/codecs").NumberCodec;
     includeMessages: import("../../runtime/codecs").BoolCodec;
+    maxItems: import("../../runtime/codecs").NumberCodec;
     class: import("../../runtime/codecs").StringCodec;
 };
 type ToastLevel = typeof TOAST_LEVELS[number];
@@ -28,7 +29,7 @@ type ToastColor = typeof TOAST_COLORS[number];
 type ToastResolvedColor = typeof TOAST_RESOLVED_COLORS[number];
 type ToastVariant = typeof TOAST_VARIANTS[number];
 type ToastPosition = typeof TOAST_POSITIONS[number];
-type ToastProps = PropState<typeof toastSchema>;
+type ToastProps = SchemaToProps<typeof toastSchema>;
 type ToastOutletProps = PropState<typeof toastOutletSchema>;
 export { TOAST_COLORS, TOAST_LEVELS, TOAST_POSITIONS, TOAST_RESOLVED_COLORS, TOAST_VARIANTS, toastOutletSchema, toastSchema };
 export type { ToastColor, ToastLevel, ToastOutletProps, ToastPosition, ToastProps, ToastResolvedColor, ToastVariant };

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

@@ -1,6 +1,8 @@
 import type Alpine from 'alpinejs';
-import { type CleanupStack, type TrellisAlpineComponent } from '../../runtime';
+import { type AlpineMachine, type TrellisAlpineComponent } from '../../runtime';
+import { type CleanupStack } from '../../utils';
 import { type ToastOutletProps, type ToastProps } from './contract';
+import { toastHooks, type ToastContext } from './machine';
 type ToastDetail = {
     description?: unknown;
     title?: unknown;
@@ -10,23 +12,47 @@ type ToastDetail = {
     duration?: unknown;
     dismissible?: unknown;
 };
-type ToastData = {
-    props: ToastProps;
-    cleanup: CleanupStack;
-    timer: number | null;
-    applyProps(changedKeys?: string[]): void;
-    sync(): void;
-    resetTimer(): void;
+/**
+ * Public Alpine API for `ui.toast`.
+ *
+ * @public
+ */
+interface UiToastApi {
+    /** Whether the opening transition has settled. */
+    readonly isOpen: boolean;
+    /** Whether any pause source currently holds the lifetime timer. */
+    readonly isPaused: boolean;
+    /** Auto-dismiss lifetime remaining in milliseconds. */
+    readonly remaining: number;
+    /** Dismisses the notification through its closing transition. */
     dismiss(): void;
+    /** Adds the consumer pause source. */
+    pause(): void;
+    /** Releases the consumer pause source. */
+    resume(): void;
+}
+/**
+ * Public Alpine API for `ui.toast.outlet`.
+ *
+ * @public
+ */
+interface UiToastOutletApi {
+    /** Adds a notification using the same lifecycle as server-rendered markup. */
+    add(detail: ToastDetail): void;
+}
+type ToastData = AlpineMachine<ToastContext, ToastProps, typeof toastHooks> & UiToastApi & {
+    init(): void;
+    destroy(): void;
 };
-type ToastOutletData = {
+type ToastOutletData = UiToastOutletApi & {
     props: ToastOutletProps;
     cleanup: CleanupStack;
     sync(): void;
-    add(detail: ToastDetail): void;
+    init(): void;
+    destroy(): void;
 };
 declare const UiToast: () => TrellisAlpineComponent<ToastData>;
-declare const UiToastOutlet: () => TrellisAlpineComponent<ToastOutletData>;
+declare const UiToastOutlet: (AlpineInstance: Alpine.Alpine) => TrellisAlpineComponent<ToastOutletData>;
 declare const registerToast: (AlpineInstance: Alpine.Alpine) => void;
 export { registerToast, UiToast, UiToastOutlet };
-export type { ToastData, ToastDetail, ToastOutletData };
+export type { ToastData, ToastDetail, ToastOutletData, UiToastApi, UiToastOutletApi };

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

@@ -0,0 +1,115 @@
+import { type Machine } from '../../runtime/state-machine';
+import type { ToastProps } from './contract';
+type ToastDismissReason = 'timeout' | 'close' | 'api' | 'swipe';
+type ToastContext = {
+    timer: {
+        remaining: number;
+        paused: boolean;
+    };
+    dismissal: {
+        reason: ToastDismissReason;
+    };
+};
+type ToastMachineEffects = {
+    prepareOpen(): void;
+    finishOpen(): void;
+    startTimer(): void;
+    stopTimer(): void;
+    prepareClose(): void;
+    finishClose(reason: ToastDismissReason): void;
+    syncProps(): void;
+};
+declare const toastHooks: 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<ToastContext>;
+        props: Readonly<import("../..").SchemaToProps<{
+            level: import("../../runtime/codecs").OneOfCodec<"danger" | "success" | "warning" | "info" | "debug">;
+            color: import("../../runtime/codecs").OneOfCodec<"accent" | "danger" | "neutral" | "auto" | "success" | "warning">;
+            variant: import("../../runtime/codecs").OneOfCodec<"default" | "outline" | "solid" | "soft" | "surface">;
+            title: import("../../runtime/codecs").StringCodec;
+            description: import("../../runtime/codecs").StringCodec;
+            duration: import("../../runtime/codecs").NumberCodec;
+            dismissible: import("../../runtime/codecs").BoolCodec;
+            class: import("../../runtime/codecs").StringCodec;
+            contentClass: import("../../runtime/codecs").StringCodec;
+            closeClass: import("../../runtime/codecs").StringCodec;
+        }>>;
+        generations: Readonly<Record<string, number>>;
+    }>) => Record<string, never>;
+    projectEach?: (snapshot: Readonly<{
+        value: import("../..").MachineStateValue;
+        tags: readonly string[];
+        context: Readonly<ToastContext>;
+        props: Readonly<import("../..").SchemaToProps<{
+            level: import("../../runtime/codecs").OneOfCodec<"danger" | "success" | "warning" | "info" | "debug">;
+            color: import("../../runtime/codecs").OneOfCodec<"accent" | "danger" | "neutral" | "auto" | "success" | "warning">;
+            variant: import("../../runtime/codecs").OneOfCodec<"default" | "outline" | "solid" | "soft" | "surface">;
+            title: import("../../runtime/codecs").StringCodec;
+            description: import("../../runtime/codecs").StringCodec;
+            duration: import("../../runtime/codecs").NumberCodec;
+            dismissible: import("../../runtime/codecs").BoolCodec;
+            class: import("../../runtime/codecs").StringCodec;
+            contentClass: import("../../runtime/codecs").StringCodec;
+            closeClass: import("../../runtime/codecs").StringCodec;
+        }>>;
+        generations: Readonly<Record<string, number>>;
+    }>) => readonly Record<string, never>[];
+}>, 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<ToastContext>;
+        props: Readonly<import("../..").SchemaToProps<{
+            level: import("../../runtime/codecs").OneOfCodec<"danger" | "success" | "warning" | "info" | "debug">;
+            color: import("../../runtime/codecs").OneOfCodec<"accent" | "danger" | "neutral" | "auto" | "success" | "warning">;
+            variant: import("../../runtime/codecs").OneOfCodec<"default" | "outline" | "solid" | "soft" | "surface">;
+            title: import("../../runtime/codecs").StringCodec;
+            description: import("../../runtime/codecs").StringCodec;
+            duration: import("../../runtime/codecs").NumberCodec;
+            dismissible: import("../../runtime/codecs").BoolCodec;
+            class: import("../../runtime/codecs").StringCodec;
+            contentClass: import("../../runtime/codecs").StringCodec;
+            closeClass: import("../../runtime/codecs").StringCodec;
+        }>>;
+        generations: Readonly<Record<string, number>>;
+    }>) => {
+        reason: ToastDismissReason;
+    };
+    projectEach?: (snapshot: Readonly<{
+        value: import("../..").MachineStateValue;
+        tags: readonly string[];
+        context: Readonly<ToastContext>;
+        props: Readonly<import("../..").SchemaToProps<{
+            level: import("../../runtime/codecs").OneOfCodec<"danger" | "success" | "warning" | "info" | "debug">;
+            color: import("../../runtime/codecs").OneOfCodec<"accent" | "danger" | "neutral" | "auto" | "success" | "warning">;
+            variant: import("../../runtime/codecs").OneOfCodec<"default" | "outline" | "solid" | "soft" | "surface">;
+            title: import("../../runtime/codecs").StringCodec;
+            description: import("../../runtime/codecs").StringCodec;
+            duration: import("../../runtime/codecs").NumberCodec;
+            dismissible: import("../../runtime/codecs").BoolCodec;
+            class: import("../../runtime/codecs").StringCodec;
+            contentClass: import("../../runtime/codecs").StringCodec;
+            closeClass: import("../../runtime/codecs").StringCodec;
+        }>>;
+        generations: Readonly<Record<string, number>>;
+    }>) => readonly {
+        reason: ToastDismissReason;
+    }[];
+}>];
+declare const createToastMachine: (props: ToastProps, effects: ToastMachineEffects) => Machine<ToastContext, ToastProps>;
+export { createToastMachine, toastHooks };
+export type { ToastContext, ToastDismissReason, ToastMachineEffects };

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

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

package/packages/client/types/directives/index.d.ts

@@ -1 +1,3 @@
-export { registerRequestDirective, registerRequestMagic } from './request';
+export { registerLayoutDirective } from './layout';
+export { registerRequestDirective } from './request';
+export { registerTransitionDirective } from './transition';

package/packages/client/types/directives/layout.d.ts

@@ -0,0 +1,3 @@
+import type Alpine from 'alpinejs';
+declare const registerLayoutDirective: (Alpine: Alpine.Alpine) => void;
+export { registerLayoutDirective };

package/packages/client/types/directives/request.d.ts

@@ -1,5 +1,4 @@
 import type Alpine from 'alpinejs';
 declare const REQUEST_ROOT_SELECTOR = "[x-ui-request], [x-ui-request\\.navigate]";
-declare const registerRequestMagic: (AlpineInstance: Alpine.Alpine) => void;
 declare const registerRequestDirective: (AlpineInstance: Alpine.Alpine) => void;
-export { REQUEST_ROOT_SELECTOR, registerRequestDirective, registerRequestMagic };
+export { REQUEST_ROOT_SELECTOR, registerRequestDirective };

package/packages/client/types/directives/transition.d.ts

@@ -0,0 +1,3 @@
+import type Alpine from 'alpinejs';
+declare const registerTransitionDirective: (AlpineInstance: Alpine.Alpine) => void;
+export { registerTransitionDirective };

package/packages/client/types/docs/transition-docs.d.ts

@@ -0,0 +1,30 @@
+type TransitionHookLike = {
+    name: string;
+    state: string;
+    sends?: Record<string, (...args: never[]) => unknown>;
+};
+type TransitionDocDetails = {
+    description: string;
+    default?: string;
+};
+type TransitionDetails<THooks extends readonly TransitionHookLike[]> = {
+    [THook in THooks[number] as THook['name']]: TransitionDocDetails;
+};
+type DefineTransitionDocsOptions<THooks extends readonly TransitionHookLike[]> = {
+    component: string;
+    hooks: THooks;
+    details: TransitionDetails<THooks>;
+};
+type ComponentTransitionDocs = {
+    component: string;
+    transitions: Array<{
+        name: string;
+        state: string;
+        description: string;
+        default?: string;
+        sends: string[];
+    }>;
+};
+declare const defineTransitionDocs: <const THooks extends readonly TransitionHookLike[]>({ component, hooks, details, }: DefineTransitionDocsOptions<THooks>) => ComponentTransitionDocs;
+export { defineTransitionDocs };
+export type { ComponentTransitionDocs, DefineTransitionDocsOptions, TransitionDocDetails, TransitionDetails, TransitionHookLike, };