@lattice-php/lattice 0.17.2 → 0.18.0

package/dist/types/generated.d.ts

@@ -4,17 +4,17 @@ export type Action = {
     form: WireNode | null;
     icon: string | null;
     label: string | null;
-    lazyForm: boolean | null;
+    lazyForm: boolean;
     method: HttpMethod | null;
     ref: string | null;
     variant: ButtonVariant | null;
 };
 export type ActionGroup = {
-    label: string;
+    label: string | null;
     orientation: Orientation | null;
     ref: string | null;
 };
-export type ActionNodeType = "action" | "action.group" | "bulkAction";
+export type ActionNodeType = "action" | "action.bulk" | "action.group";
 export type ActionResult = {
     readonly ok: boolean;
     readonly data: Record<string, unknown>;
@@ -29,9 +29,24 @@ export type Badge = {
     label: string;
 };
 export type BadgeColumn = {
+    align: ColumnAlign;
     colors: Record<string | number, string> | null;
+    filter: ColumnFilter | null;
+    hiddenByDefault: boolean;
+    label: string | null;
+    sortable: boolean;
+    toggleable: boolean;
+    width: ColumnWidth;
+};
+export type BooleanColumn = {
+    align: ColumnAlign;
+    filter: ColumnFilter | null;
+    hiddenByDefault: boolean;
+    label: string | null;
+    sortable: boolean;
+    toggleable: boolean;
+    width: ColumnWidth;
 };
-export type BooleanColumn = Record<string, never>;
 export type Breadcrumbs = Record<string, never>;
 export type BrowserToken = {
     readonly accessToken: string;
@@ -55,7 +70,6 @@ export type Builder = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     layout: RowLayout;
     maxItems: number | null;
@@ -78,7 +92,7 @@ export type BulkAction = {
     form: WireNode | null;
     icon: string | null;
     label: string | null;
-    lazyForm: boolean | null;
+    lazyForm: boolean;
     method: HttpMethod | null;
     ref: string | null;
     variant: ButtonVariant | null;
@@ -89,7 +103,7 @@ export type Button = {
     effects: Effect[];
     href: string | null;
     icon: string | null;
-    label: string;
+    label: string | null;
     method: HttpMethod | null;
     variant: ButtonVariant | null;
 };
@@ -164,7 +178,6 @@ export type Checkbox = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     name: string;
     prefillRefreshOn: string[] | null;
@@ -189,7 +202,6 @@ export type Choice = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     name: string;
     options: Option[];
@@ -212,21 +224,7 @@ export type Collapsible = {
 };
 export type Color = "default" | "muted" | "primary" | "success" | "info" | "warning" | "danger";
 export type ColumnAlign = "start" | "center" | "end";
-export type ColumnData = {
-    readonly key: string;
-    readonly label: string;
-    readonly type: ColumnType | string;
-    readonly width: ColumnWidth;
-    readonly align: ColumnAlign;
-    readonly sortable: boolean | null;
-    readonly toggleable: boolean | null;
-    readonly hiddenByDefault: boolean | null;
-    readonly filter: ColumnFilter | null;
-    readonly columns: ColumnData[] | null;
-    readonly props: Record<string, unknown> | null;
-};
 export type ColumnFilter = {
-    readonly enabled: boolean;
     readonly type: FilterType;
     readonly operators: Op[];
     readonly defaultOperator: Op;
@@ -252,16 +250,17 @@ export type ColumnPropsMap = {
     "column.image": ImageColumn;
     "column.money": MoneyColumn;
     "column.number": NumberColumn;
+    "column.stack": StackColumn;
     "column.text": TextColumn;
 };
 export type ColumnType = "column.text" | "column.boolean" | "column.number" | "column.money" | "column.stack" | "column.badge" | "column.icon" | "column.image";
 export type ColumnWidth = "xs" | "sm" | "md" | "lg" | "xl";
 export type ComponentPropsMap = {
     action: Action;
+    "action.bulk": BulkAction;
     "action.group": ActionGroup;
     badge: Badge;
     breadcrumbs: Breadcrumbs;
-    bulkAction: BulkAction;
     button: Button;
     callouts: Callouts;
     card: Card;
@@ -350,7 +349,6 @@ export type DateInput = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     max: string | null;
     min: string | null;
@@ -363,6 +361,9 @@ export type DateInput = {
     tooltip: string | null;
     value: unknown;
 };
+export type DateRangeFilter = {
+    label: string | null;
+};
 export type DateTimeInput = {
     autoFocus: boolean;
     columnWidth: ColumnWidth;
@@ -378,7 +379,6 @@ export type DateTimeInput = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     max: string | null;
     min: string | null;
@@ -406,16 +406,16 @@ export type Effect = {
 } & Record<string, unknown>;
 export type EffectPropsMap = {
     callout: CalloutEffect;
-    closeModal: CloseModalEffect;
+    "close-modal": CloseModalEffect;
     download: DownloadEffect;
-    localeChange: LocaleChangeEffect;
-    openModal: OpenModalEffect;
+    "locale-change": LocaleChangeEffect;
+    "open-modal": OpenModalEffect;
     redirect: RedirectEffect;
-    reloadComponent: ReloadComponentEffect;
-    reloadPage: ReloadPageEffect;
-    resetForm: ResetFormEffect;
+    "reload-component": ReloadComponentEffect;
+    "reload-page": ReloadPageEffect;
+    "reset-form": ResetFormEffect;
     toast: ToastEffect;
-    toggleSidebar: ToggleSidebarEffect;
+    "toggle-sidebar": ToggleSidebarEffect;
 };
 export type FieldType = "field.builder" | "field.checkbox" | "field.choice" | "field.date-input" | "field.date-time-input" | "field.file-upload" | "field.hidden-input" | "field.number-input" | "field.otp" | "field.password-input" | "field.repeater" | "field.rich-editor" | "field.select" | "field.textarea" | "field.text-input" | "field.time-input" | "field.toggle";
 export type FileUpload = {
@@ -439,7 +439,6 @@ export type FileUpload = {
         token: string;
     }[] | null;
     helperText: string | null;
-    hidden: boolean;
     image: boolean;
     label: string | null;
     maxFiles: number | null;
@@ -459,12 +458,17 @@ export type FilterClause = {
     readonly operator: string;
     readonly value: string;
 };
-export type FilterControl = "select" | "ternary" | "date-range" | "toggle";
-export type FilterData = {
-    readonly key: string;
+export type FilterControl = "filter.select" | "filter.ternary" | "filter.date-range" | "filter.toggle";
+export type FilterIndicator = {
+    readonly filter: string;
     readonly label: string;
-    readonly type: FilterControl;
-    readonly props: Record<string, unknown>;
+    readonly value: string;
+};
+export type FilterPropsMap = {
+    "filter.date-range": DateRangeFilter;
+    "filter.select": SelectFilter;
+    "filter.ternary": TernaryFilter;
+    "filter.toggle": ToggleFilter;
 };
 export type FilterType = "text" | "number" | "date" | "boolean";
 export type FloatingPanel = {
@@ -493,7 +497,7 @@ export type FormFieldNodeType = "field.builder" | "field.checkbox" | "field.choi
 export type FormNodeType = "field.builder" | "field.checkbox" | "field.choice" | "field.date-input" | "field.date-time-input" | "field.file-upload" | "field.hidden-input" | "field.number-input" | "field.otp" | "field.password-input" | "field.repeater" | "field.rich-editor" | "field.select" | "field.text-input" | "field.textarea" | "field.time-input" | "field.toggle" | "form";
 export type Fragment = {
     endpoint: string | null;
-    lazy: boolean | null;
+    lazy: boolean;
     ref: string | null;
     size: Size;
 };
@@ -520,7 +524,6 @@ export type HiddenInput = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     name: string;
     prefillRefreshOn: string[] | null;
@@ -545,13 +548,27 @@ export type Icon = {
     size: Size;
 };
 export type IconColumn = {
+    align: ColumnAlign;
     colors: Record<string | number, string> | null;
+    filter: ColumnFilter | null;
+    hiddenByDefault: boolean;
     icon: string | null;
     icons: Record<string | number, string> | null;
+    label: string | null;
+    sortable: boolean;
+    toggleable: boolean;
+    width: ColumnWidth;
 };
 export type ImageColumn = {
+    align: ColumnAlign;
     circular: boolean;
+    filter: ColumnFilter | null;
+    hiddenByDefault: boolean;
+    label: string | null;
     size: number | null;
+    sortable: boolean;
+    toggleable: boolean;
+    width: ColumnWidth;
 };
 export type Justify = "start" | "center" | "end" | "between" | "around" | "evenly";
 export type Link = {
@@ -559,7 +576,7 @@ export type Link = {
     effects: Effect[];
     href: string | null;
     icon: string | null;
-    label: string;
+    label: string | null;
     method: HttpMethod | null;
     prefix: Affix | null;
     suffix: Affix | null;
@@ -580,7 +597,7 @@ export type MenuItem = {
     effects: Effect[];
     href: string | null;
     icon: string | null;
-    label: string;
+    label: string | null;
     method: HttpMethod | null;
     prefix: Affix | null;
     suffix: Affix | null;
@@ -588,17 +605,24 @@ export type MenuItem = {
 export type Modal = {
     closeLabel: string;
     description: string | null;
-    open: boolean | null;
+    open: boolean;
     ref: string | null;
     title: string | null;
 };
 export type MoneyColumn = {
+    align: ColumnAlign;
     currency: string | null;
     currencyField: string | null;
+    filter: ColumnFilter | null;
+    hiddenByDefault: boolean;
+    label: string | null;
     maximumFractionDigits: number | null;
     minimumFractionDigits: number | null;
+    sortable: boolean;
+    toggleable: boolean;
+    width: ColumnWidth;
 };
-export type NodeType = "action" | "action.group" | "badge" | "breadcrumbs" | "bulkAction" | "button" | "callouts" | "card" | "chart" | "chat.box" | "chat.part.text" | "chat.part.tool-call" | "collapsible" | "dropdown" | "field.builder" | "field.checkbox" | "field.choice" | "field.date-input" | "field.date-time-input" | "field.file-upload" | "field.hidden-input" | "field.number-input" | "field.otp" | "field.password-input" | "field.repeater" | "field.rich-editor" | "field.select" | "field.text-input" | "field.textarea" | "field.time-input" | "field.toggle" | "floating-panel" | "form" | "fragment" | "grid" | "heading" | "icon" | "link" | "menu" | "menu-item" | "modal" | "notifications" | "outlet" | "raw-block" | "remote.data-list" | "section" | "segmented-control" | "sidebar" | "stack" | "tab" | "table" | "tabs" | "text" | "tooltip" | "topbar";
+export type NodeType = "action" | "action.bulk" | "action.group" | "badge" | "breadcrumbs" | "button" | "callouts" | "card" | "chart" | "chat.box" | "chat.part.text" | "chat.part.tool-call" | "collapsible" | "dropdown" | "field.builder" | "field.checkbox" | "field.choice" | "field.date-input" | "field.date-time-input" | "field.file-upload" | "field.hidden-input" | "field.number-input" | "field.otp" | "field.password-input" | "field.repeater" | "field.rich-editor" | "field.select" | "field.text-input" | "field.textarea" | "field.time-input" | "field.toggle" | "floating-panel" | "form" | "fragment" | "grid" | "heading" | "icon" | "link" | "menu" | "menu-item" | "modal" | "notifications" | "outlet" | "raw-block" | "remote.data-list" | "section" | "segmented-control" | "sidebar" | "stack" | "tab" | "table" | "tabs" | "text" | "tooltip" | "topbar";
 export type NotificationItem = {
     readonly id: string;
     readonly title: string | null;
@@ -617,10 +641,17 @@ export type Notifications = {
     slideOut: boolean;
 };
 export type NumberColumn = {
+    align: ColumnAlign;
     compact: boolean;
+    filter: ColumnFilter | null;
+    hiddenByDefault: boolean;
+    label: string | null;
     maximumFractionDigits: number | null;
     minimumFractionDigits: number | null;
+    sortable: boolean;
+    toggleable: boolean;
     unit: NumberFormatUnit | null;
+    width: ColumnWidth;
 };
 export type NumberFormat = {
     kind: string;
@@ -645,7 +676,6 @@ export type NumberInput = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     max: number | null;
     min: number | null;
@@ -686,7 +716,6 @@ export type OtpInput = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     length: number;
     name: string;
@@ -721,7 +750,6 @@ export type PasswordInput = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     labelAction: {
         href: string;
@@ -776,7 +804,6 @@ export type Repeater = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     itemLabel: string | null;
     label: string | null;
     layout: RowLayout;
@@ -810,7 +837,6 @@ export type RichEditor = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     name: string;
     placeholder: string | null;
@@ -824,9 +850,9 @@ export type RichEditor = {
 export type RowAction = {
     type: RowActionType;
     key: string;
-    label: string | null;
-    icon: string | null;
     destructive: boolean;
+    icon: string | null;
+    label: string | null;
 };
 export type RowActionType = "duplicate" | "remove";
 export type RowLayout = "stack" | "table";
@@ -861,7 +887,6 @@ export type Select = {
     editablePrefill: boolean;
     emptyLabel: string;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     multiple: boolean;
     name: string;
@@ -877,6 +902,13 @@ export type Select = {
     tooltip: string | null;
     value: unknown;
 };
+export type SelectFilter = {
+    label: string | null;
+    multiple: boolean;
+    options: Option[];
+    placeholder: string | null;
+    searchable: boolean;
+};
 export type Side = "start" | "end";
 export type Sidebar = {
     collapsible: boolean;
@@ -893,6 +925,15 @@ export type Stack = {
     justify: Justify | null;
     width: Width | null;
 };
+export type StackColumn = {
+    align: ColumnAlign;
+    filter: ColumnFilter | null;
+    hiddenByDefault: boolean;
+    label: string | null;
+    sortable: boolean;
+    toggleable: boolean;
+    width: ColumnWidth;
+};
 export type Tab = {
     confirm: {
         required: boolean;
@@ -905,16 +946,16 @@ export type Tab = {
 export type Table = {
     actionsLabel: string;
     bulkActions: WireNode[];
-    columns: ColumnData[];
+    columns: Record<string, unknown>[];
     emptyLabel: string;
     endpoint: string | null;
-    filters: FilterData[];
+    filters: WireNode[];
     layout: string | null;
-    lazy: boolean | null;
+    lazy: boolean;
     ref: string | null;
-    resizableColumns: boolean | null;
+    resizableColumns: boolean;
     resizeIndicator: boolean;
-    striped: boolean | null;
+    striped: boolean;
 };
 export type TablePagination = {
     readonly mode: PaginationType;
@@ -932,7 +973,8 @@ export type TableQuery = {
     readonly sorts: TableSort[];
     readonly page: number;
     readonly perPage: number;
-    readonly tableFilters: Record<string, unknown>;
+    readonly tableFilters: Record<string, Record<string, unknown>>;
+    readonly tableFilterIndicators: FilterIndicator[];
 };
 export type TableSort = {
     readonly key: string;
@@ -946,14 +988,21 @@ export type Tabs = {
     queryKey: string;
 };
 export type TabsAlignment = "start" | "center" | "end" | "stretch";
+export type TernaryFilter = {
+    falseLabel: string;
+    label: string | null;
+    placeholder: string;
+    trueLabel: string;
+};
 export type Text = {
     align: Align | null;
-    color: Color;
+    color: Color | null;
     copyable: boolean;
     size: Size;
     text: string;
 };
 export type TextColumn = {
+    align: ColumnAlign;
     badge: {
         colorKey: string;
     } | null;
@@ -962,11 +1011,17 @@ export type TextColumn = {
         dateStyle: string | null;
         timeStyle: string | null;
     } | null;
+    filter: ColumnFilter | null;
+    hiddenByDefault: boolean;
+    label: string | null;
     link: {
         href: string | null;
         external: boolean;
     } | null;
     multiple: string | null;
+    sortable: boolean;
+    toggleable: boolean;
+    width: ColumnWidth;
 };
 export type TextInput = {
     autoComplete: string | null;
@@ -983,7 +1038,6 @@ export type TextInput = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     name: string;
     placeholder: string | null;
@@ -1015,7 +1069,6 @@ export type Textarea = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     name: string;
     placeholder: string | null;
@@ -1042,7 +1095,6 @@ export type TimeInput = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     max: string | null;
     min: string | null;
@@ -1081,7 +1133,6 @@ export type Toggle = {
     disabled: boolean;
     editablePrefill: boolean;
     helperText: string | null;
-    hidden: boolean;
     label: string | null;
     name: string;
     prefillRefreshOn: string[] | null;
@@ -1092,6 +1143,9 @@ export type Toggle = {
     tooltip: string | null;
     value: unknown;
 };
+export type ToggleFilter = {
+    label: string | null;
+};
 export type ToggleSidebarEffect = {
     readonly target: string | null;
 };

package/dist/types/index.d.ts

@@ -1,2 +1,2 @@
-export type { ComponentProps, DateFormat, Node, NodeProps, NumberFormat, PageContainer, PageBreadcrumb, PagePayload, PropsOf, RendererComponent, } from '..';
+export type { ComponentProps, DateFormat, Node, NodeProps, NumberFormat, PageContainer, PageBreadcrumb, PagePayload, PropsOf, RendererComponent, } from '../index.js';
 export type { Method } from '@inertiajs/core';

package/dist/{action/components → ui}/action-menu-context.js

@@ -1,6 +1,6 @@
 import { createContext, useContext } from "react";
 import { jsx } from "react/jsx-runtime";
-//#region resources/js/action/components/action-menu-context.tsx
+//#region resources/js/ui/action-menu-context.tsx
 var ActionMenuContext = createContext(false);
 var actionMenuItemClassName = "flex h-lt-control-sm w-full items-center justify-start gap-2 rounded-lt-sm px-2.5 text-left text-sm font-normal text-lt-popover-fg no-underline decoration-transparent shadow-none transition-colors hover:bg-lt-accent/70 hover:text-lt-popover-fg focus-visible:bg-lt-accent/70 focus-visible:text-lt-popover-fg focus-visible:ring-0 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-lt-icon-sm [&_svg]:text-lt-muted-fg";
 function ActionMenuProvider({ children }) {

package/dist/ui/action-menu-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"action-menu-context.js","names":[],"sources":["../../resources/js/ui/action-menu-context.tsx"],"sourcesContent":["import { createContext, useContext, type ReactNode } from \"react\";\n\nconst ActionMenuContext = createContext(false);\n\nexport const actionMenuItemClassName =\n  \"flex h-lt-control-sm w-full items-center justify-start gap-2 rounded-lt-sm px-2.5 text-left text-sm font-normal text-lt-popover-fg no-underline decoration-transparent shadow-none transition-colors hover:bg-lt-accent/70 hover:text-lt-popover-fg focus-visible:bg-lt-accent/70 focus-visible:text-lt-popover-fg focus-visible:ring-0 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:size-lt-icon-sm [&_svg]:text-lt-muted-fg\";\n\nexport function ActionMenuProvider({ children }: { children: ReactNode }) {\n  return <ActionMenuContext.Provider value={true}>{children}</ActionMenuContext.Provider>;\n}\n\nexport function useActionMenu(): boolean {\n  return useContext(ActionMenuContext);\n}\n"],"mappings":";;;AAEA,IAAM,oBAAoB,cAAc,KAAK;AAE7C,IAAa,0BACX;AAEF,SAAgB,mBAAmB,EAAE,YAAqC;CACxE,OAAO,oBAAC,kBAAkB,UAAnB;EAA4B,OAAO;EAAO;CAAqC,CAAA;AACxF;AAEA,SAAgB,gBAAyB;CACvC,OAAO,WAAW,iBAAiB;AACrC"}

package/dist/{form/components/base → ui}/affix-group.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { Affix } from '../../../types/generated';
+import { Affix } from '../types/generated.js';
 /**
  * Wraps a single-line control in a prefix/suffix input group. The control is a
  * render prop receiving the class names that square the corners adjacent to an

package/dist/{form/components/base → ui}/affix-group.js

@@ -1,7 +1,7 @@
-import { cn } from "../../../lib/utils.js";
-import { IconRenderer } from "../../../icons/icon-renderer.js";
+import { cn } from "../lib/utils.js";
+import { IconRenderer } from "../icons/icon-renderer.js";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region resources/js/form/components/base/affix-group.tsx
+//#region resources/js/ui/affix-group.tsx
 function AffixSegment({ affix, side }) {
 	return /* @__PURE__ */ jsx("span", {
 		"data-slot": `affix-${side}`,

package/dist/ui/affix-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"affix-group.js","names":[],"sources":["../../resources/js/ui/affix-group.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport type { Affix } from \"@lattice-php/lattice/types/generated\";\nimport { IconRenderer } from \"@lattice-php/lattice/icons\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\n\nfunction AffixSegment({ affix, side }: { affix: Affix; side: \"start\" | \"end\" }) {\n  return (\n    <span\n      data-slot={`affix-${side}`}\n      className={cn(\n        \"inline-flex h-lt-control-md shrink-0 items-center border border-lt-input bg-lt-muted px-3 text-base whitespace-nowrap text-lt-muted-fg\",\n        \"group-has-[:focus-visible]:border-lt-ring\",\n        side === \"start\" ? \"rounded-l-lt-sm border-r-0\" : \"rounded-r-lt-sm border-l-0\",\n      )}\n    >\n      {affix.icon ? <IconRenderer className=\"size-lt-icon-md\" icon={affix.icon} /> : affix.text}\n    </span>\n  );\n}\n\n/**\n * Wraps a single-line control in a prefix/suffix input group. The control is a\n * render prop receiving the class names that square the corners adjacent to an\n * affix; with no affixes the control renders untouched.\n *\n * The focus ring lives on the group, not the bare input, so it surrounds the\n * whole control — affixes included — instead of being clipped by the opaque\n * affix segments. The control itself stays the focus target; only its own ring\n * is suppressed.\n */\nexport function AffixGroup({\n  prefix,\n  suffix,\n  children,\n}: {\n  prefix?: Affix | null;\n  suffix?: Affix | null;\n  children: (controlClassName: string) => ReactNode;\n}) {\n  if (!prefix && !suffix) {\n    return children(\"\");\n  }\n\n  return (\n    <div\n      className=\"group flex w-full rounded-lt-sm transition-[color,box-shadow] has-[:focus-visible]:ring-[3px] has-[:focus-visible]:ring-lt-ring/50\"\n      data-slot=\"affix-group\"\n    >\n      {prefix ? <AffixSegment affix={prefix} side=\"start\" /> : null}\n      <div className=\"min-w-0 flex-1\">\n        {children(\n          cn(\"focus-visible:ring-0\", prefix && \"rounded-l-none\", suffix && \"rounded-r-none\"),\n        )}\n      </div>\n      {suffix ? <AffixSegment affix={suffix} side=\"end\" /> : null}\n    </div>\n  );\n}\n"],"mappings":";;;;AAKA,SAAS,aAAa,EAAE,OAAO,QAAiD;CAC9E,OACE,oBAAC,QAAD;EACE,aAAW,SAAS;EACpB,WAAW,GACT,0IACA,6CACA,SAAS,UAAU,+BAA+B,4BACpD;YAEC,MAAM,OAAO,oBAAC,cAAD;GAAc,WAAU;GAAkB,MAAM,MAAM;EAAO,CAAA,IAAI,MAAM;CACjF,CAAA;AAEV;;;;;;;;;;;AAYA,SAAgB,WAAW,EACzB,QACA,QACA,YAKC;CACD,IAAI,CAAC,UAAU,CAAC,QACd,OAAO,SAAS,EAAE;CAGpB,OACE,qBAAC,OAAD;EACE,WAAU;EACV,aAAU;YAFZ;GAIG,SAAS,oBAAC,cAAD;IAAc,OAAO;IAAQ,MAAK;GAAS,CAAA,IAAI;GACzD,oBAAC,OAAD;IAAK,WAAU;cACZ,SACC,GAAG,wBAAwB,UAAU,kBAAkB,UAAU,gBAAgB,CACnF;GACG,CAAA;GACJ,SAAS,oBAAC,cAAD;IAAc,OAAO;IAAQ,MAAK;GAAO,CAAA,IAAI;EACpD;;AAET"}

package/dist/{core/components → ui}/badge.d.ts

@@ -1,5 +1,5 @@
 import { VariantProps } from 'class-variance-authority';
-import { RendererComponent } from '../types';
+import { RendererComponent } from '../core/types.js';
 import * as React from "react";
 declare const badgeVariants: (props?: ({
     variant?: "default" | "destructive" | "outline" | "secondary" | null | undefined;

package/dist/{core/components → ui}/badge.js

@@ -1,9 +1,9 @@
-import { cn } from "../../lib/utils.js";
+import { cn } from "../lib/utils.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 import { Slot } from "@radix-ui/react-slot";
 import { cva } from "class-variance-authority";
-//#region resources/js/core/components/badge.tsx
+//#region resources/js/ui/badge.tsx
 var badgeVariants = cva("inline-flex items-center justify-center rounded-lt-sm border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-lt-icon-xs gap-1 [&>svg]:pointer-events-none focus-visible:border-lt-ring focus-visible:ring-lt-ring/50 focus-visible:ring-[3px] aria-invalid:ring-lt-danger/20 dark:aria-invalid:ring-lt-danger/40 aria-invalid:border-lt-danger transition-[color,box-shadow] overflow-hidden", {
 	variants: { variant: {
 		default: "border-transparent bg-lt-primary text-lt-primary-fg [a&]:hover:bg-lt-primary-hover",

package/dist/ui/badge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge.js","names":[],"sources":["../../resources/js/ui/badge.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport * as React from \"react\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\nimport type { RendererComponent } from \"@lattice-php/lattice/core/types\";\n\nconst badgeVariants = cva(\n  \"inline-flex items-center justify-center rounded-lt-sm border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-lt-icon-xs gap-1 [&>svg]:pointer-events-none focus-visible:border-lt-ring focus-visible:ring-lt-ring/50 focus-visible:ring-[3px] aria-invalid:ring-lt-danger/20 dark:aria-invalid:ring-lt-danger/40 aria-invalid:border-lt-danger transition-[color,box-shadow] overflow-hidden\",\n  {\n    variants: {\n      variant: {\n        default:\n          \"border-transparent bg-lt-primary text-lt-primary-fg [a&]:hover:bg-lt-primary-hover\",\n        secondary:\n          \"border-transparent bg-lt-secondary text-lt-secondary-fg [a&]:hover:bg-lt-secondary-hover\",\n        destructive:\n          \"border-transparent bg-lt-danger text-lt-danger-fg [a&]:hover:bg-lt-danger-hover focus-visible:ring-lt-danger/20 dark:focus-visible:ring-lt-danger/40 dark:bg-lt-danger/60\",\n        outline: \"border-lt-border text-lt-fg [a&]:hover:bg-lt-accent [a&]:hover:text-lt-accent-fg\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  },\n);\n\nfunction Badge({\n  className,\n  variant,\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"span\"> & VariantProps<typeof badgeVariants> & { asChild?: boolean }) {\n  const Comp = asChild ? Slot : \"span\";\n\n  return (\n    <Comp data-slot=\"badge\" className={cn(badgeVariants({ variant }), className)} {...props} />\n  );\n}\n\nconst BadgeComponent: RendererComponent<\"badge\"> = ({ node }) => (\n  <Badge variant=\"secondary\" className=\"w-fit px-3 py-1\">\n    {node.props.label}\n  </Badge>\n);\n\nexport default BadgeComponent;\nexport { Badge, badgeVariants };\n"],"mappings":";;;;;;AAMA,IAAM,gBAAgB,IACpB,8ZACA;CACE,UAAU,EACR,SAAS;EACP,SACE;EACF,WACE;EACF,aACE;EACF,SAAS;CACX,EACF;CACA,iBAAiB,EACf,SAAS,UACX;AACF,CACF;AAEA,SAAS,MAAM,EACb,WACA,SACA,UAAU,OACV,GAAG,SACyF;CAG5F,OACE,oBAHW,UAAU,OAAO,QAG5B;EAAM,aAAU;EAAQ,WAAW,GAAG,cAAc,EAAE,QAAQ,CAAC,GAAG,SAAS;EAAG,GAAI;CAAQ,CAAA;AAE9F;AAEA,IAAM,kBAA8C,EAAE,WACpD,oBAAC,OAAD;CAAO,SAAQ;CAAY,WAAU;WAClC,KAAK,MAAM;AACP,CAAA"}

package/dist/{core/components → ui}/button.d.ts

@@ -1,6 +1,6 @@
 import { VariantProps } from 'class-variance-authority';
-import { RendererComponent } from '../types';
-import { ButtonVariant } from '../../types/generated';
+import { RendererComponent } from '../core/types.js';
+import { ButtonVariant } from '../types/generated.js';
 import * as React from "react";
 export type { ButtonVariant };
 declare const buttonVariants: (props?: ({

package/dist/{core/components → ui}/button.js

@@ -1,13 +1,13 @@
-import { cn } from "../../lib/utils.js";
-import { IconRenderer } from "../../icons/icon-renderer.js";
-import { nodeIdentity } from "../test-id.js";
-import { ActionTrigger, useClickBehavior } from "../use-click-behavior.js";
+import { cn } from "../lib/utils.js";
+import { IconRenderer } from "../icons/icon-renderer.js";
+import { nodeIdentity } from "../core/test-id.js";
+import { ActionTrigger, useClickBehavior } from "./click-behavior.js";
 import { Link } from "@inertiajs/react";
 import "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { Slot } from "@radix-ui/react-slot";
 import { cva } from "class-variance-authority";
-//#region resources/js/core/components/button.tsx
+//#region resources/js/ui/button.tsx
 var buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-lt-sm text-base font-medium transition-[color,box-shadow] disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-lt-icon-md [&_svg]:shrink-0 outline-none focus-visible:border-lt-ring focus-visible:ring-lt-ring/50 focus-visible:ring-[3px] aria-invalid:ring-lt-danger/20 dark:aria-invalid:ring-lt-danger/40 aria-invalid:border-lt-danger", {
 	variants: {
 		variant: {

package/dist/ui/button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"button.js","names":[],"sources":["../../resources/js/ui/button.tsx"],"sourcesContent":["import { Link } from \"@inertiajs/react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport * as React from \"react\";\nimport { cn } from \"@lattice-php/lattice/lib/utils\";\nimport { IconRenderer } from \"@lattice-php/lattice/icons\";\nimport { nodeIdentity } from \"@lattice-php/lattice/core/test-id\";\nimport type { RendererComponent } from \"@lattice-php/lattice/core/types\";\nimport { ActionTrigger, type TriggerState, useClickBehavior } from \"./click-behavior\";\nimport type { ButtonVariant } from \"@lattice-php/lattice/types/generated\";\n\nexport type { ButtonVariant };\n\nconst buttonVariants = cva(\n  \"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-lt-sm text-base font-medium transition-[color,box-shadow] disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-lt-icon-md [&_svg]:shrink-0 outline-none focus-visible:border-lt-ring focus-visible:ring-lt-ring/50 focus-visible:ring-[3px] aria-invalid:ring-lt-danger/20 dark:aria-invalid:ring-lt-danger/40 aria-invalid:border-lt-danger\",\n  {\n    variants: {\n      variant: {\n        default:\n          \"bg-lt-primary text-lt-primary-fg shadow-lt-xs hover:bg-lt-primary-hover active:bg-lt-primary-active disabled:bg-lt-disabled disabled:text-lt-disabled-fg disabled:shadow-none\",\n        destructive:\n          \"bg-lt-danger text-lt-danger-fg shadow-lt-xs hover:bg-lt-danger-hover active:bg-lt-danger-active focus-visible:ring-lt-danger/20 dark:focus-visible:ring-lt-danger/40 disabled:bg-lt-disabled disabled:text-lt-disabled-fg disabled:shadow-none\",\n        success:\n          \"bg-lt-success text-lt-success-fg shadow-lt-xs hover:bg-lt-success-hover active:bg-lt-success-active disabled:bg-lt-disabled disabled:text-lt-disabled-fg disabled:shadow-none\",\n        info: \"bg-lt-info text-lt-info-fg shadow-lt-xs hover:bg-lt-info-hover active:bg-lt-info-active disabled:bg-lt-disabled disabled:text-lt-disabled-fg disabled:shadow-none\",\n        outline:\n          \"border border-lt-input bg-lt-bg shadow-lt-xs hover:bg-lt-accent hover:text-lt-accent-fg disabled:bg-lt-disabled disabled:text-lt-disabled-fg disabled:border-transparent disabled:shadow-none\",\n        secondary:\n          \"bg-lt-secondary text-lt-secondary-fg shadow-lt-xs hover:bg-lt-secondary-hover active:bg-lt-secondary-active disabled:bg-lt-disabled disabled:text-lt-disabled-fg disabled:shadow-none\",\n        ghost: \"hover:bg-lt-accent hover:text-lt-accent-fg disabled:text-lt-disabled-fg\",\n        link: \"text-lt-primary underline-offset-4 hover:underline disabled:text-lt-disabled-fg disabled:no-underline\",\n      },\n      size: {\n        default: \"h-lt-control-md px-4 py-2 has-[>svg]:px-3\",\n        sm: \"h-lt-control-sm rounded-lt-sm px-3 has-[>svg]:px-2.5\",\n        lg: \"h-lt-control-lg rounded-lt-sm px-6 has-[>svg]:px-4\",\n        icon: \"size-lt-control-md\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  },\n);\n\nfunction Button({\n  className,\n  variant,\n  size,\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"button\"> &\n  VariantProps<typeof buttonVariants> & {\n    asChild?: boolean;\n  }) {\n  const Comp = asChild ? Slot : \"button\";\n\n  return (\n    <Comp\n      data-slot=\"button\"\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  );\n}\n\nconst ButtonComponent: RendererComponent<\"button\"> = ({ node }) => {\n  const { label, icon } = node.props;\n  const variant = node.props.variant ?? \"default\";\n  const testId = nodeIdentity(node);\n  const behavior = useClickBehavior(node.props);\n  const size = icon ? \"icon\" : \"default\";\n  const content = icon ? (\n    <>\n      <IconRenderer className=\"size-lt-icon-md\" icon={icon} />\n      {label ? <span className=\"sr-only\">{label}</span> : null}\n    </>\n  ) : (\n    label\n  );\n\n  const triggerButton = ({ onClick, processing }: TriggerState) => (\n    <Button\n      data-test={testId}\n      disabled={processing}\n      onClick={onClick}\n      size={size}\n      variant={variant}\n    >\n      {content}\n    </Button>\n  );\n\n  if (behavior.kind === \"navigate\") {\n    return (\n      <Button asChild data-test={testId} variant={variant} size={size}>\n        <Link href={behavior.href} method={behavior.method}>\n          {content}\n        </Link>\n      </Button>\n    );\n  }\n\n  if (behavior.kind === \"action\") {\n    return <ActionTrigger action={behavior.action}>{triggerButton}</ActionTrigger>;\n  }\n\n  if (behavior.kind === \"effects\") {\n    return triggerButton({ onClick: behavior.onClick, processing: false });\n  }\n\n  return (\n    <Button data-test={testId} size={size} type={node.props.buttonType} variant={variant}>\n      {content}\n    </Button>\n  );\n};\n\nexport default ButtonComponent;\nexport { Button, buttonVariants };\n"],"mappings":";;;;;;;;;;AAaA,IAAM,iBAAiB,IACrB,+bACA;CACE,UAAU;EACR,SAAS;GACP,SACE;GACF,aACE;GACF,SACE;GACF,MAAM;GACN,SACE;GACF,WACE;GACF,OAAO;GACP,MAAM;EACR;EACA,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,MAAM;EACR;CACF;CACA,iBAAiB;EACf,SAAS;EACT,MAAM;CACR;AACF,CACF;AAEA,SAAS,OAAO,EACd,WACA,SACA,MACA,UAAU,OACV,GAAG,SAIA;CAGH,OACE,oBAHW,UAAU,OAAO,UAG5B;EACE,aAAU;EACV,WAAW,GAAG,eAAe;GAAE;GAAS;GAAM;EAAU,CAAC,CAAC;EAC1D,GAAI;CACL,CAAA;AAEL;AAEA,IAAM,mBAAgD,EAAE,WAAW;CACjE,MAAM,EAAE,OAAO,SAAS,KAAK;CAC7B,MAAM,UAAU,KAAK,MAAM,WAAW;CACtC,MAAM,SAAS,aAAa,IAAI;CAChC,MAAM,WAAW,iBAAiB,KAAK,KAAK;CAC5C,MAAM,OAAO,OAAO,SAAS;CAC7B,MAAM,UAAU,OACd,qBAAA,YAAA,EAAA,UAAA,CACE,oBAAC,cAAD;EAAc,WAAU;EAAwB;CAAO,CAAA,GACtD,QAAQ,oBAAC,QAAD;EAAM,WAAU;YAAW;CAAY,CAAA,IAAI,IACpD,EAAA,CAAA,IAEF;CAGF,MAAM,iBAAiB,EAAE,SAAS,iBAChC,oBAAC,QAAD;EACE,aAAW;EACX,UAAU;EACD;EACH;EACG;YAER;CACK,CAAA;CAGV,IAAI,SAAS,SAAS,YACpB,OACE,oBAAC,QAAD;EAAQ,SAAA;EAAQ,aAAW;EAAiB;EAAe;YACzD,oBAAC,MAAD;GAAM,MAAM,SAAS;GAAM,QAAQ,SAAS;aACzC;EACG,CAAA;CACA,CAAA;CAIZ,IAAI,SAAS,SAAS,UACpB,OAAO,oBAAC,eAAD;EAAe,QAAQ,SAAS;YAAS;CAA6B,CAAA;CAG/E,IAAI,SAAS,SAAS,WACpB,OAAO,cAAc;EAAE,SAAS,SAAS;EAAS,YAAY;CAAM,CAAC;CAGvE,OACE,oBAAC,QAAD;EAAQ,aAAW;EAAc;EAAM,MAAM,KAAK,MAAM;EAAqB;YAC1E;CACK,CAAA;AAEZ"}

package/dist/{core/components → ui}/card.d.ts

@@ -1,4 +1,4 @@
-import { RendererComponent } from '../types';
+import { RendererComponent } from '../core/types.js';
 import * as React from "react";
 declare function Card({ className, ...props }: React.ComponentProps<"article">): React.JSX.Element;
 declare function CardHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;

package/dist/{core/components → ui}/card.js

@@ -1,9 +1,9 @@
-import { cn } from "../../lib/utils.js";
-import { nodeIdentity } from "../test-id.js";
+import { cn } from "../lib/utils.js";
+import { nodeIdentity } from "../core/test-id.js";
 import { InfoTooltip } from "./info-tooltip.js";
 import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region resources/js/core/components/card.tsx
+//#region resources/js/ui/card.tsx
 function Card({ className, ...props }) {
 	return /* @__PURE__ */ jsx("article", {
 		"data-slot": "card",