@vireo-ai/trellis-ui 0.1.25 → 0.1.29

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

@@ -1,7 +1,10 @@
-import type Alpine from 'alpinejs';
-import { type AlpineMachine, type BindingObject, type TrellisAlpineComponent } from '../../runtime';
+import { type AlpineMachine, type BindingObject, type TransitionForHook, type TrellisAlpineComponent } from '../../runtime';
 import { type AccordionMode, type AccordionProps } from './contract';
 import { accordionHooks, type AccordionContext } from './machine';
+type AccordionTransitionName = (typeof accordionHooks)[number]['name'];
+type AccordionTransition<TName extends AccordionTransitionName = AccordionTransitionName> = TransitionForHook<Extract<(typeof accordionHooks)[number], {
+    name: TName;
+}>, HTMLElement>;
 /**
  * Public Alpine API for `ui.accordion`.
  *
@@ -27,6 +30,6 @@ type AccordionData = AlpineMachine<AccordionContext, AccordionProps, typeof acco
     destroy(): void;
 };
 declare const UiAccordion: () => TrellisAlpineComponent<AccordionData>;
-declare const registerAccordion: (AlpineInstance: Alpine.Alpine) => void;
+declare const registerAccordion: import("../../runtime").AlpineDataRegistrar;
 export { registerAccordion, UiAccordion };
-export type { AccordionData, AccordionMode, UiAccordionApi };
+export type { AccordionData, AccordionMode, AccordionTransition, UiAccordionApi };

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

@@ -27,35 +27,10 @@ type CreateAccordionMachineOptions = {
     context: AccordionContext;
     effects: AccordionMachineEffects;
 };
-declare const accordionHooks: readonly [Readonly<{
+declare const accordionHooks: 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<{
+    projectEach: (snapshot: Readonly<{
         value: import("../..").MachineStateValue;
         tags: readonly string[];
         context: Readonly<AccordionContext>;
@@ -75,36 +50,33 @@ declare const accordionHooks: readonly [Readonly<{
             class: import("../../runtime/codecs").StringCodec;
         }>>;
         generations: Readonly<Record<string, number>>;
-    }>) => readonly AccordionTransitionData[];
-}>, Readonly<{
-    name: "closing";
-    state: string;
+    }>) => {
+        value: 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<{
+    sends: {
+        open: (value: string) => {
+            type: string;
+            value: string;
+        };
+        close: (value: string) => {
+            type: string;
+            value: string;
+        };
+        toggle: (value: string) => {
+            type: string;
+            value: string;
+        };
+        setValues: (values: string[]) => {
+            type: string;
+            values: string[];
+        };
+    };
+}, {
+    name: "closing";
+    state: string;
+    projectEach: (snapshot: Readonly<{
         value: import("../..").MachineStateValue;
         tags: readonly string[];
         context: Readonly<AccordionContext>;
@@ -124,8 +96,30 @@ declare const accordionHooks: readonly [Readonly<{
             class: import("../../runtime/codecs").StringCodec;
         }>>;
         generations: Readonly<Record<string, number>>;
-    }>) => readonly AccordionTransitionData[];
-}>];
+    }>) => {
+        value: string;
+    }[];
+    onDone: string;
+    onError: string;
+    sends: {
+        open: (value: string) => {
+            type: string;
+            value: string;
+        };
+        close: (value: string) => {
+            type: string;
+            value: string;
+        };
+        toggle: (value: string) => {
+            type: string;
+            value: string;
+        };
+        setValues: (values: string[]) => {
+            type: string;
+            values: string[];
+        };
+    };
+}];
 declare const createAccordionMachine: ({ props, context, effects, }: CreateAccordionMachineOptions) => Machine<AccordionContext, AccordionProps>;
 export { accordionHooks, createAccordionMachine };
 export type { AccordionContext, AccordionMachineEffects, AccordionTransitionData, CreateAccordionMachineOptions, };

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

@@ -1,6 +1,8 @@
 import { type SchemaToProps } from '../../runtime';
 import { type ElevationReference, type LayoutSpace, type SurfaceReference } from '../common';
 declare const CARD_AS_VALUES: readonly ["div", "section", "article", "aside", "label"];
+declare const CARD_INTERACTIONS: readonly ["none", "tonal", "edge", "combined"];
+declare const CARD_COLORS: readonly ["neutral", "accent"];
 declare const CARD_SURFACES: readonly ["inherit", "0", "1", "2", "3", "4", "5", "6", "7", "8", "+1", "+2", "+3", "+4", "+5", "+6", "+7", "+8"];
 declare const CARD_ELEVATIONS: readonly ["none", "match", "1", "2", "3", "4", "5", "6", "7", "8"];
 declare const CARD_SIZES: readonly ["sm", "md"];
@@ -12,7 +14,9 @@ declare const cardSchema: {
     as: import("../../runtime/codecs").OneOfCodec<"article" | "aside" | "div" | "label" | "section">;
     href: import("../../runtime/codecs").StringCodec;
     label: import("../../runtime/codecs").StringCodec;
-    interactive: import("../../runtime/codecs").BoolCodec;
+    color: import("../../runtime/codecs").OneOfCodec<"accent" | "neutral">;
+    interaction: import("../../runtime/codecs").OneOfCodec<"none" | "edge" | "tonal" | "combined">;
+    selected: import("../../runtime/codecs").BoolCodec;
     surface: import("../../runtime/codecs").OneOfCodec<"inherit" | "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "+1" | "+2" | "+3" | "+4" | "+5" | "+6" | "+7" | "+8">;
     elevation: import("../../runtime/codecs").OneOfCodec<"match" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "none">;
     size: import("../../runtime/codecs").OneOfCodec<"sm" | "md">;
@@ -49,6 +53,8 @@ declare const cardFooterSchema: {
     class: import("../../runtime/codecs").StringCodec;
 };
 type CardAs = typeof CARD_AS_VALUES[number];
+type CardInteraction = typeof CARD_INTERACTIONS[number];
+type CardColor = typeof CARD_COLORS[number];
 type CardSurface = SurfaceReference;
 type CardElevation = ElevationReference;
 type CardSize = typeof CARD_SIZES[number];
@@ -63,5 +69,5 @@ type CardDescriptionProps = SchemaToProps<typeof cardDescriptionSchema>;
 type CardActionProps = SchemaToProps<typeof cardActionSchema>;
 type CardContentProps = SchemaToProps<typeof cardContentSchema>;
 type CardFooterProps = SchemaToProps<typeof cardFooterSchema>;
-export { CARD_AS_VALUES, CARD_ELEVATIONS, CARD_FOOTER_ALIGNS, CARD_FOOTER_LAYOUTS, CARD_SIZES, CARD_SPACES, CARD_SURFACES, CARD_TITLE_AS_VALUES, cardActionSchema, cardContentSchema, cardDescriptionSchema, cardFooterSchema, cardHeaderSchema, cardSchema, cardTitleSchema, };
-export type { CardActionProps, CardAs, CardContentProps, CardDescriptionProps, CardElevation, CardFooterAlign, CardFooterLayout, CardFooterProps, CardHeaderProps, CardProps, CardSize, CardSpace, CardSurface, CardTitleAs, CardTitleProps, };
+export { CARD_AS_VALUES, CARD_COLORS, CARD_ELEVATIONS, CARD_FOOTER_ALIGNS, CARD_FOOTER_LAYOUTS, CARD_INTERACTIONS, CARD_SIZES, CARD_SPACES, CARD_SURFACES, CARD_TITLE_AS_VALUES, cardActionSchema, cardContentSchema, cardDescriptionSchema, cardFooterSchema, cardHeaderSchema, cardSchema, cardTitleSchema, };
+export type { CardActionProps, CardAs, CardColor, CardContentProps, CardDescriptionProps, CardElevation, CardFooterAlign, CardFooterLayout, CardFooterProps, CardHeaderProps, CardInteraction, CardProps, CardSize, CardSpace, CardSurface, CardTitleAs, CardTitleProps, };

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

@@ -1,15 +1,19 @@
 import { type SchemaToProps } from '../../runtime';
-import { type ControlSize, type DefaultVariant, type IndicatorPlacement, type Orientation } from '../common';
+import { type ControlSize, type IndicatorPlacement, type Orientation } from '../common';
 declare const CHECKBOX_GROUP_ORIENTATIONS: readonly ["vertical", "horizontal"];
-declare const CHECKBOX_GROUP_VARIANTS: readonly ["default"];
+declare const CHECKBOX_GROUP_VARIANTS: readonly ["default", "cards", "pills"];
 declare const CHECKBOX_PLACEMENTS: readonly ["leading", "trailing", "center", "top-leading", "top-trailing", "bottom-leading", "bottom-trailing"];
 declare const CHECKBOX_SIZES: readonly ["xs", "sm", "md", "lg", "xlg"];
-declare const CHECKBOX_VARIANTS: readonly ["default"];
+declare const CHECKBOX_VARIANTS: readonly ["default", "cards", "pills"];
+declare const CHECKBOX_COLORS: readonly ["neutral", "accent"];
+declare const CHECKBOX_INTERACTIONS: readonly ["tonal", "edge", "combined"];
 type CheckboxGroupOrientation = Orientation;
-type CheckboxGroupVariant = DefaultVariant;
+type CheckboxGroupVariant = (typeof CHECKBOX_GROUP_VARIANTS)[number];
 type CheckboxPlacement = IndicatorPlacement;
 type CheckboxSize = ControlSize;
-type CheckboxVariant = DefaultVariant;
+type CheckboxVariant = (typeof CHECKBOX_VARIANTS)[number];
+type CheckboxColor = (typeof CHECKBOX_COLORS)[number];
+type CheckboxInteraction = (typeof CHECKBOX_INTERACTIONS)[number];
 declare const checkboxControlSchema: {
     value: import("../../runtime/codecs").StringCodec;
     name: import("../../runtime/codecs").StringCodec;
@@ -23,7 +27,9 @@ declare const checkboxControlSchema: {
     indicator: import("../../runtime/codecs").BoolCodec;
     placement: import("../../runtime/codecs").OneOfCodec<"center" | "leading" | "trailing" | "top-leading" | "top-trailing" | "bottom-leading" | "bottom-trailing">;
     icon: import("../../runtime/codecs").StringCodec;
-    variant: import("../../runtime/codecs").OneOfCodec<"default">;
+    variant: import("../../runtime/codecs").OneOfCodec<"default" | "cards" | "pills">;
+    color: import("../../runtime/codecs").OneOfCodec<"accent" | "neutral">;
+    interaction: import("../../runtime/codecs").OneOfCodec<"edge" | "tonal" | "combined">;
     size: import("../../runtime/codecs").OneOfCodec<"xs" | "sm" | "md" | "lg" | "xlg">;
     inputClass: import("../../runtime/codecs").StringCodec;
     indicatorClass: import("../../runtime/codecs").StringCodec;
@@ -52,7 +58,9 @@ declare const checkboxSchema: {
     indicator: import("../../runtime/codecs").BoolCodec;
     placement: import("../../runtime/codecs").OneOfCodec<"center" | "leading" | "trailing" | "top-leading" | "top-trailing" | "bottom-leading" | "bottom-trailing">;
     icon: import("../../runtime/codecs").StringCodec;
-    variant: import("../../runtime/codecs").OneOfCodec<"default">;
+    variant: import("../../runtime/codecs").OneOfCodec<"default" | "cards" | "pills">;
+    color: import("../../runtime/codecs").OneOfCodec<"accent" | "neutral">;
+    interaction: import("../../runtime/codecs").OneOfCodec<"edge" | "tonal" | "combined">;
     size: import("../../runtime/codecs").OneOfCodec<"xs" | "sm" | "md" | "lg" | "xlg">;
     inputClass: import("../../runtime/codecs").StringCodec;
     indicatorClass: import("../../runtime/codecs").StringCodec;
@@ -66,7 +74,9 @@ declare const checkboxSchema: {
 declare const checkboxGroupSchema: {
     name: import("../../runtime/codecs").StringCodec;
     orientation: import("../../runtime/codecs").OneOfCodec<"vertical" | "horizontal">;
-    variant: import("../../runtime/codecs").OneOfCodec<"default">;
+    variant: import("../../runtime/codecs").OneOfCodec<"default" | "cards" | "pills">;
+    color: import("../../runtime/codecs").OneOfCodec<"accent" | "neutral">;
+    interaction: import("../../runtime/codecs").OneOfCodec<"edge" | "tonal" | "combined">;
     indicator: import("../../runtime/codecs").BoolCodec;
     placement: import("../../runtime/codecs").OneOfCodec<"center" | "leading" | "trailing" | "top-leading" | "top-trailing" | "bottom-leading" | "bottom-trailing">;
     disabled: import("../..").CodecFn<boolean>;
@@ -81,5 +91,5 @@ declare const checkboxIndicatorSchema: {
 type CheckboxControlProps = SchemaToProps<typeof checkboxControlSchema>;
 type CheckboxGroupProps = SchemaToProps<typeof checkboxGroupSchema>;
 type CheckboxProps = SchemaToProps<typeof checkboxSchema>;
-export { CHECKBOX_GROUP_ORIENTATIONS, CHECKBOX_GROUP_VARIANTS, CHECKBOX_PLACEMENTS, CHECKBOX_SIZES, CHECKBOX_VARIANTS, checkboxControlSchema, checkboxGroupSchema, checkboxIndicatorSchema, checkboxSchema, };
-export type { CheckboxControlProps, CheckboxGroupOrientation, CheckboxGroupProps, CheckboxGroupVariant, CheckboxPlacement, CheckboxProps, CheckboxSize, CheckboxVariant, };
+export { CHECKBOX_GROUP_ORIENTATIONS, CHECKBOX_GROUP_VARIANTS, CHECKBOX_COLORS, CHECKBOX_INTERACTIONS, CHECKBOX_PLACEMENTS, CHECKBOX_SIZES, CHECKBOX_VARIANTS, checkboxControlSchema, checkboxGroupSchema, checkboxIndicatorSchema, checkboxSchema, };
+export type { CheckboxControlProps, CheckboxColor, CheckboxGroupOrientation, CheckboxGroupProps, CheckboxGroupVariant, CheckboxInteraction, CheckboxPlacement, CheckboxProps, CheckboxSize, CheckboxVariant, };

package/packages/client/types/components/common.d.ts

@@ -97,6 +97,8 @@ declare const FIELD_CONTROL_ACTION_CLASSES: string[];
 declare const FIELD_CONTROL_NATIVE_CLASSES: string[];
 declare const POPOVER_GEOMETRY_CLASSES: string[];
 declare const INTERACTIVE_ITEM_CLASSES: string[];
+declare const SELECTION_COLORS: readonly ["neutral", "accent"];
+declare const INTERACTION_TREATMENTS: readonly ["tonal", "edge", "combined"];
 declare const OPTION_ITEM_CLASSES: string[];
 declare const OPTION_ICON_CLASSES = "size-icon shrink-0 fill-current text-current opacity-70";
 declare const OPTION_INDICATOR_CLASSES = "ml-auto size-icon shrink-0 fill-current text-current opacity-0 data-selected:opacity-100";
@@ -109,8 +111,11 @@ type Position = typeof POSITIONS[number];
 type EdgePosition = typeof EDGE_POSITIONS[number];
 type Orientation = typeof ORIENTATIONS[number];
 type IndicatorPlacement = typeof INDICATOR_PLACEMENTS[number];
+type SelectionColor = typeof SELECTION_COLORS[number];
+type InteractionTreatment = typeof INTERACTION_TREATMENTS[number];
 type DefaultVariant = typeof DEFAULT_VARIANTS[number];
 type HeadingLevel = typeof HEADING_LEVELS[number];
 type ComponentRadius = typeof COMPONENT_RADII[number];
-export { ABSOLUTE_SURFACE_REFERENCES, ALIGNMENTS, BUTTON_TYPES, COMPONENT_RADII, CONTROL_RADIUS_CLASSES, CONTROL_MIN_SIZE_CLASSES, CONTROL_MULTILINE_SIZE_CLASSES, CONTROL_SIZES, CONTROL_SIZE_CLASSES, CONTROL_TYPOGRAPHY_CLASSES, CONTROL_VARIANTS, DEFAULT_VARIANTS, EDGE_POSITIONS, ELEVATION_REFERENCES, FIELD_CONTROL_ACTION_CLASSES, FIELD_CONTROL_INPUT_CLASSES, FIELD_CONTROL_MULTILINE_ROOT_CLASSES, FIELD_CONTROL_NATIVE_CLASSES, FIELD_CONTROL_ROOT_CLASSES, elevationReferenceClasses, HEADING_LEVELS, ICON_COLORS, ICON_COLOR_CLASSES, ICON_VARIANTS, INDICATOR_PLACEMENTS, INTERACTIVE_ITEM_CLASSES, LAYOUT_GAP_CLASSES, LAYOUT_GAP_X_CLASSES, LAYOUT_GAP_Y_CLASSES, LAYOUT_MARGIN_CLASSES, LAYOUT_MARGIN_X_CLASSES, LAYOUT_MARGIN_Y_CLASSES, LAYOUT_PADDING_CLASSES, LAYOUT_PADDING_X_CLASSES, LAYOUT_PADDING_Y_CLASSES, LAYOUT_SPACES, OPTION_ICON_CLASSES, OPTION_INDICATOR_CLASSES, OPTION_ITEM_CLASSES, ORIENTATIONS, POPOVER_GEOMETRY_CLASSES, POSITIONS, SURFACE_RADIUS_CLASSES, SURFACE_REFERENCES, TYPOGRAPHY_COLOR_CLASSES, TYPOGRAPHY_COLORS, };
+export { ABSOLUTE_SURFACE_REFERENCES, ALIGNMENTS, BUTTON_TYPES, COMPONENT_RADII, CONTROL_RADIUS_CLASSES, CONTROL_MIN_SIZE_CLASSES, CONTROL_MULTILINE_SIZE_CLASSES, CONTROL_SIZES, CONTROL_SIZE_CLASSES, CONTROL_TYPOGRAPHY_CLASSES, CONTROL_VARIANTS, DEFAULT_VARIANTS, EDGE_POSITIONS, ELEVATION_REFERENCES, FIELD_CONTROL_ACTION_CLASSES, FIELD_CONTROL_INPUT_CLASSES, FIELD_CONTROL_MULTILINE_ROOT_CLASSES, FIELD_CONTROL_NATIVE_CLASSES, FIELD_CONTROL_ROOT_CLASSES, elevationReferenceClasses, HEADING_LEVELS, ICON_COLORS, ICON_COLOR_CLASSES, ICON_VARIANTS, INDICATOR_PLACEMENTS, INTERACTION_TREATMENTS, INTERACTIVE_ITEM_CLASSES, LAYOUT_GAP_CLASSES, LAYOUT_GAP_X_CLASSES, LAYOUT_GAP_Y_CLASSES, LAYOUT_MARGIN_CLASSES, LAYOUT_MARGIN_X_CLASSES, LAYOUT_MARGIN_Y_CLASSES, LAYOUT_PADDING_CLASSES, LAYOUT_PADDING_X_CLASSES, LAYOUT_PADDING_Y_CLASSES, LAYOUT_SPACES, OPTION_ICON_CLASSES, OPTION_INDICATOR_CLASSES, OPTION_ITEM_CLASSES, ORIENTATIONS, POPOVER_GEOMETRY_CLASSES, POSITIONS, SELECTION_COLORS, SURFACE_RADIUS_CLASSES, SURFACE_REFERENCES, TYPOGRAPHY_COLOR_CLASSES, TYPOGRAPHY_COLORS, };
+export type { InteractionTreatment, SelectionColor };
 export type { AbsoluteSurfaceReference, Alignment, CommonButtonType, ComponentRadius, ControlSize, ControlVariant, DefaultVariant, EdgePosition, ElevationReference, HeadingLevel, IconColor, IconVariant, IndicatorPlacement, LayoutSpace, Orientation, Position, SurfaceReference, TypographyColor, };

package/packages/client/types/components/date-picker/index.d.ts

@@ -1,8 +1,11 @@
-import type Alpine from 'alpinejs';
-import { type AlpineMachine, type TrellisAlpineComponent } from '../../runtime';
+import { type AlpineMachine, type TransitionForHook, type TrellisAlpineComponent } from '../../runtime';
 import { type BindingObject } from '../../runtime/merge-bindings';
 import { type DatePickerProps } from './contract';
 import { type DatePickerContext, datePickerHooks } from './machine';
+type DatePickerTransitionName = (typeof datePickerHooks)[number]['name'];
+type DatePickerTransition<TName extends DatePickerTransitionName = DatePickerTransitionName> = TransitionForHook<Extract<(typeof datePickerHooks)[number], {
+    name: TName;
+}>, HTMLElement>;
 /**
  * Public Alpine API for `ui.datePicker`.
  *
@@ -43,6 +46,6 @@ type DatePickerData = AlpineMachine<DatePickerContext, DatePickerProps, typeof d
     destroy(): void;
 };
 declare const UiDatePicker: () => TrellisAlpineComponent<DatePickerData>;
-declare const registerDatePicker: (AlpineInstance: Alpine.Alpine) => void;
+declare const registerDatePicker: import("../../runtime").AlpineDataRegistrar;
 export { registerDatePicker, UiDatePicker };
-export type { DatePickerData, UiDatePickerApi };
+export type { DatePickerData, DatePickerTransition, UiDatePickerApi };