@getgreenline/blaze-ui 1.0.3-3.0-beta → 1.0.4-5.01-beta

package/dist/components/breadcrumb.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { Slot } from '@radix-ui/react-slot';
-import { ChevronRight, MoreHorizontal } from 'lucide-react';
+import { MoreHorizontal, ChevronRight } from 'lucide-react';
 import { cn } from '../lib/utils.js';
 
 function Breadcrumb({ ...props }) {

package/dist/components/carousel.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import * as React from 'react';
 import useEmblaCarousel from 'embla-carousel-react';
-import { ArrowLeft, ArrowRight } from 'lucide-react';
+import { ArrowRight, ArrowLeft } from 'lucide-react';
 import { cn } from '../lib/utils.js';
 import { Button } from './button.js';
 

package/dist/components/chart.d.ts

@@ -16,6 +16,37 @@ export type ChartConfig = {
         theme: Record<keyof typeof THEMES, string>;
     });
 };
+type ChartPayloadItem = {
+    color?: string;
+    dataKey?: string | number;
+    name?: string | number;
+    payload?: (Record<string, unknown> & {
+        fill?: string;
+    }) | null;
+    type?: string;
+    value?: string | number;
+    [key: string]: unknown;
+};
+type ChartTooltipContentProps = React.ComponentProps<"div"> & {
+    active?: boolean;
+    color?: string;
+    formatter?: (value: NonNullable<ChartPayloadItem["value"]>, name: NonNullable<ChartPayloadItem["name"]>, item: ChartPayloadItem, index: number, payload: ChartPayloadItem["payload"]) => React.ReactNode;
+    hideIndicator?: boolean;
+    hideLabel?: boolean;
+    indicator?: "line" | "dot" | "dashed";
+    label?: React.ReactNode;
+    labelClassName?: string;
+    labelFormatter?: (value: React.ReactNode, payload: ChartPayloadItem[]) => React.ReactNode;
+    labelKey?: string;
+    nameKey?: string;
+    payload?: ChartPayloadItem[];
+};
+type ChartLegendContentProps = React.ComponentProps<"div"> & {
+    hideIcon?: boolean;
+    nameKey?: string;
+    payload?: ChartPayloadItem[];
+    verticalAlign?: "top" | "middle" | "bottom";
+};
 declare function ChartContainer({ id, className, children, config, ...props }: React.ComponentProps<"div"> & {
     config: ChartConfig;
     children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>["children"];
@@ -25,17 +56,8 @@ declare const ChartStyle: ({ id, config }: {
     config: ChartConfig;
 }) => import("react/jsx-runtime").JSX.Element | null;
 declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
-declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: React.ComponentProps<typeof RechartsPrimitive.Tooltip> & React.ComponentProps<"div"> & {
-    hideLabel?: boolean;
-    hideIndicator?: boolean;
-    indicator?: "line" | "dot" | "dashed";
-    nameKey?: string;
-    labelKey?: string;
-}): import("react/jsx-runtime").JSX.Element | null;
-declare const ChartLegend: typeof RechartsPrimitive.Legend;
-declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, }: React.ComponentProps<"div"> & Pick<RechartsPrimitive.LegendProps, "payload" | "verticalAlign"> & {
-    hideIcon?: boolean;
-    nameKey?: string;
-}): import("react/jsx-runtime").JSX.Element | null;
+declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: ChartTooltipContentProps): import("react/jsx-runtime").JSX.Element | null;
+declare const ChartLegend: React.MemoExoticComponent<(outsideProps: RechartsPrimitive.LegendProps) => React.ReactPortal | null>;
+declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, }: ChartLegendContentProps): import("react/jsx-runtime").JSX.Element | null;
 export { ChartContainer, ChartTooltip, ChartTooltipContent, ChartLegend, ChartLegendContent, ChartStyle, };
 //# sourceMappingURL=chart.d.ts.map

package/dist/components/chart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../src/components/chart.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,iBAAiB,MAAM,UAAU,CAAA;AAK7C,QAAA,MAAM,MAAM;;;CAAwC,CAAA;AAEpD,MAAM,MAAM,WAAW,GAAG;KACvB,CAAC,IAAI,MAAM,GAAG;QACb,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;QACvB,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;KAC3B,GAAG,CACA;QAAE,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,KAAK,CAAA;KAAE,GACjC;QAAE,KAAK,CAAC,EAAE,KAAK,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC,MAAM,OAAO,MAAM,EAAE,MAAM,CAAC,CAAA;KAAE,CAChE;CACF,CAAA;AAkBD,iBAAS,cAAc,CAAC,EACtB,EAAE,EACF,SAAS,EACT,QAAQ,EACR,MAAM,EACN,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC/B,MAAM,EAAE,WAAW,CAAA;IACnB,QAAQ,EAAE,KAAK,CAAC,cAAc,CAC5B,OAAO,iBAAiB,CAAC,mBAAmB,CAC7C,CAAC,UAAU,CAAC,CAAA;CACd,2CAsBA;AAED,QAAA,MAAM,UAAU,GAAI,gBAAgB;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,WAAW,CAAA;CAAE,mDA+BtE,CAAA;AAED,QAAA,MAAM,YAAY,kCAA4B,CAAA;AAE9C,iBAAS,mBAAmB,CAAC,EAC3B,MAAM,EACN,OAAO,EACP,SAAS,EACT,SAAiB,EACjB,SAAiB,EACjB,aAAqB,EACrB,KAAK,EACL,cAAc,EACd,cAAc,EACd,SAAS,EACT,KAAK,EACL,OAAO,EACP,QAAQ,GACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,iBAAiB,CAAC,OAAO,CAAC,GACvD,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAAG;IAC5B,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,SAAS,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,QAAQ,CAAA;IACrC,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,kDA2HF;AAED,QAAA,MAAM,WAAW,iCAA2B,CAAA;AAE5C,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,QAAgB,EAChB,OAAO,EACP,aAAwB,EACxB,OAAO,GACR,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,GAC5B,IAAI,CAAC,iBAAiB,CAAC,WAAW,EAAE,SAAS,GAAG,eAAe,CAAC,GAAG;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB,kDA4CF;AAyCD,OAAO,EACL,cAAc,EACd,YAAY,EACZ,mBAAmB,EACnB,WAAW,EACX,kBAAkB,EAClB,UAAU,GACX,CAAA"}
+{"version":3,"file":"chart.d.ts","sourceRoot":"","sources":["../../src/components/chart.tsx"],"names":[],"mappings":"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"}

package/dist/components/chart.js

@@ -77,7 +77,7 @@ function ChartTooltipContent({ active, payload, className, indicator = "dot", hi
                     .map((item, index) => {
                     const key = `${nameKey || item.name || item.dataKey || "value"}`;
                     const itemConfig = getPayloadConfigFromPayload(config, item, key);
-                    const indicatorColor = color || item.payload.fill || item.color;
+                    const indicatorColor = color || item.payload?.fill || item.color;
                     return (jsx("div", { className: cn("[&>svg]:tw:text-muted-foreground tw:flex tw:w-full tw:flex-wrap tw:items-stretch tw:gap-2 [&>svg]:tw:h-2.5 [&>svg]:tw:w-2.5", indicator === "dot" && "tw:items-center"), children: formatter && item?.value !== undefined && item.name ? (formatter(item.value, item.name, item, index, item.payload)) : (jsxs(Fragment, { children: [itemConfig?.icon ? (jsx(itemConfig.icon, {})) : (!hideIndicator && (jsx("div", { className: cn("tw:shrink-0 tw:rounded-[2px] tw:border-(--color-border) tw:bg-(--color-bg)", {
                                         "tw:h-2.5 tw:w-2.5": indicator === "dot",
                                         "tw:w-1": indicator === "line",
@@ -86,7 +86,7 @@ function ChartTooltipContent({ active, payload, className, indicator = "dot", hi
                                     }), style: {
                                         "--color-bg": indicatorColor,
                                         "--color-border": indicatorColor,
-                                    } }))), jsxs("div", { className: cn("tw:flex tw:flex-1 tw:justify-between tw:leading-none", nestLabel ? "tw:items-end" : "tw:items-center"), children: [jsxs("div", { className: "tw:grid tw:gap-1.5", children: [nestLabel ? tooltipLabel : null, jsx("span", { className: "tw:text-muted-foreground", children: itemConfig?.label || item.name })] }), item.value && (jsx("span", { className: "tw:text-foreground tw:font-mono tw:font-medium tw:tabular-nums", children: item.value.toLocaleString() }))] })] })) }, item.dataKey));
+                                    } }))), jsxs("div", { className: cn("tw:flex tw:flex-1 tw:justify-between tw:leading-none", nestLabel ? "tw:items-end" : "tw:items-center"), children: [jsxs("div", { className: "tw:grid tw:gap-1.5", children: [nestLabel ? tooltipLabel : null, jsx("span", { className: "tw:text-muted-foreground", children: itemConfig?.label || item.name })] }), item.value && (jsx("span", { className: "tw:text-foreground tw:font-mono tw:font-medium tw:tabular-nums", children: item.value.toLocaleString() }))] })] })) }, String(item.dataKey ?? item.name ?? index)));
                 }) })] }));
 }
 const ChartLegend = RechartsPrimitive.Legend;
@@ -102,7 +102,7 @@ function ChartLegendContent({ className, hideIcon = false, payload, verticalAlig
             const itemConfig = getPayloadConfigFromPayload(config, item, key);
             return (jsxs("div", { className: cn("[&>svg]:tw:text-muted-foreground tw:flex tw:items-center tw:gap-1.5 [&>svg]:tw:h-3 [&>svg]:tw:w-3"), children: [itemConfig?.icon && !hideIcon ? (jsx(itemConfig.icon, {})) : (jsx("div", { className: "tw:h-2 tw:w-2 tw:shrink-0 tw:rounded-[2px]", style: {
                             backgroundColor: item.color,
-                        } })), itemConfig?.label] }, item.value));
+                        } })), itemConfig?.label] }, String(item.value ?? item.dataKey ?? item.name)));
         }) }));
 }
 // Helper to extract item config from a payload.

package/dist/components/checkbox.js

@@ -4,7 +4,7 @@ import { CheckIcon } from 'lucide-react';
 import { cn } from '../lib/utils.js';
 
 function Checkbox({ className, ...props }) {
-    return (jsx(CheckboxPrimitive.Root, { "data-slot": "checkbox", className: cn("tw:!peer tw:!border-border dark:tw:!bg-input/30 data-[state=checked]:tw:!bg-primary data-[state=checked]:tw:!text-primary-foreground dark:data-[state=checked]:tw:!bg-primary data-[state=checked]:tw:!border-primary focus-visible:tw:!border-ring focus-visible:tw:!ring-ring/50 aria-invalid:tw:!ring-destructive/20 dark:aria-invalid:tw:!ring-destructive/40 aria-invalid:tw:!border-destructive tw:!size-4 tw:!shrink-0 tw:!rounded-[4px] tw:!border tw:!shadow-xs tw:!transition-shadow tw:!outline-none focus-visible:tw:!ring-[3px] disabled:tw:!cursor-not-allowed disabled:tw:!opacity-50 tw:!align-middle", className), ...props, children: jsx(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: "tw:flex tw:items-center tw:justify-center tw:text-current tw:transition-none", children: jsx(CheckIcon, { className: "tw:size-[80%]" }) }) }));
+    return (jsx(CheckboxPrimitive.Root, { "data-slot": "checkbox", className: cn("tw:peer tw:!border-border tw:dark:!bg-input/30 tw:data-[state=checked]:!bg-primary tw:data-[state=checked]:!text-primary-foreground tw:dark:data-[state=checked]:!bg-primary tw:data-[state=checked]:!border-primary tw:focus-visible:!border-ring tw:focus-visible:!ring-ring/50 tw:aria-invalid:!ring-destructive/20 tw:dark:aria-invalid:!ring-destructive/40 tw:aria-invalid:!border-destructive tw:!size-4 tw:!shrink-0 tw:!rounded-[4px] tw:!border tw:!shadow-xs tw:!transition-shadow tw:!outline-none tw:focus-visible:!ring-[3px] tw:disabled:!cursor-not-allowed tw:disabled:!opacity-50 tw:data-[disabled]:!cursor-not-allowed tw:data-[disabled]:!opacity-50 tw:aria-disabled:!cursor-not-allowed tw:aria-disabled:!opacity-50 tw:!align-middle", className), ...props, children: jsx(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: "tw:flex tw:items-center tw:justify-center tw:text-current tw:transition-none", children: jsx(CheckIcon, { className: "tw:size-[80%]" }) }) }));
 }
 
 export { Checkbox };

package/dist/components/collapsible.d.ts

@@ -1,6 +1,6 @@
 import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
 declare function Collapsible({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.Root>): import("react/jsx-runtime").JSX.Element;
-declare function CollapsibleTrigger({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>): import("react/jsx-runtime").JSX.Element;
+declare function CollapsibleTrigger({ className, ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>): import("react/jsx-runtime").JSX.Element;
 declare function CollapsibleContent({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>): import("react/jsx-runtime").JSX.Element;
 export { Collapsible, CollapsibleTrigger, CollapsibleContent };
 //# sourceMappingURL=collapsible.d.ts.map

package/dist/components/collapsible.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"collapsible.d.ts","sourceRoot":"","sources":["../../src/components/collapsible.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,oBAAoB,MAAM,6BAA6B,CAAA;AAEnE,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,2CAExD;AAED,iBAAS,kBAAkB,CAAC,EAC1B,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,kBAAkB,CAAC,2CAOtE;AAED,iBAAS,kBAAkB,CAAC,EAC1B,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,kBAAkB,CAAC,2CAOtE;AAED,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,CAAA"}
+{"version":3,"file":"collapsible.d.ts","sourceRoot":"","sources":["../../src/components/collapsible.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,oBAAoB,MAAM,6BAA6B,CAAA;AAInE,iBAAS,WAAW,CAAC,EACnB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,IAAI,CAAC,2CAExD;AAED,iBAAS,kBAAkB,CAAC,EAC1B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,kBAAkB,CAAC,2CAWtE;AAED,iBAAS,kBAAkB,CAAC,EAC1B,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,oBAAoB,CAAC,kBAAkB,CAAC,2CAOtE;AAED,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,CAAA"}

package/dist/components/collapsible.js

@@ -1,11 +1,12 @@
 import { jsx } from 'react/jsx-runtime';
 import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+import { cn } from '../lib/utils.js';
 
 function Collapsible({ ...props }) {
     return jsx(CollapsiblePrimitive.Root, { "data-slot": "collapsible", ...props });
 }
-function CollapsibleTrigger({ ...props }) {
-    return (jsx(CollapsiblePrimitive.CollapsibleTrigger, { "data-slot": "collapsible-trigger", ...props }));
+function CollapsibleTrigger({ className, ...props }) {
+    return (jsx(CollapsiblePrimitive.CollapsibleTrigger, { "data-slot": "collapsible-trigger", className: cn("tw:cursor-pointer tw:transition-colors tw:hover:bg-accent/60", className), ...props }));
 }
 function CollapsibleContent({ ...props }) {
     return (jsx(CollapsiblePrimitive.CollapsibleContent, { "data-slot": "collapsible-content", ...props }));

package/dist/components/data-table.d.ts

@@ -1,6 +1,7 @@
 import * as React from "react";
 import { CheckIcon, XIcon } from "lucide-react";
 export type SortDirection = "asc" | "desc" | null;
+export type DataTableCellValue = React.ReactNode | Record<string, unknown> | DataTableRow[];
 export interface DataTableColumn<T> {
     key: string;
     label: string;
@@ -8,14 +9,14 @@ export interface DataTableColumn<T> {
     align?: "left" | "center" | "right";
     width?: string;
     className?: string;
-    render?: (value: any, row: T, index: number, depth: number) => React.ReactNode;
+    render?: (value: DataTableCellValue, row: T, index: number, depth: number) => React.ReactNode;
 }
 export interface DataTableRow {
     id: string;
     children?: DataTableRow[];
-    [key: string]: any;
+    [key: string]: DataTableCellValue;
 }
-export interface IClickableField<T = any> {
+export interface IClickableField<T = DataTableRow> {
     field: string;
     onClick: (row: T) => void;
 }
@@ -44,6 +45,7 @@ export interface DataTablePaginationProps {
 export interface DataTableProps<T extends DataTableRow> {
     columns: DataTableColumn<T>[];
     data: T[];
+    onRowClick?: (row: T) => void;
     onSelectionChange?: (selectedIds: string[]) => void;
     selectedRowIds?: string[];
     onSort?: (key: string, direction: SortDirection) => void;
@@ -78,6 +80,6 @@ export interface DataTableProps<T extends DataTableRow> {
     selectContentClassName?: string;
     menuPopupClassName?: string;
 }
-export declare function DataTable<T extends DataTableRow>({ columns, data, onSelectionChange, selectedRowIds, onSort, sortState, expandable, renderExpandedRow, actions, className, pagination, treeData, reorderable, onReorder, onDragReorder, customFilterColumnsWhiteList, loading, loadingRows, emptyState, clickableFields, showColumnVisibility, footerContent, expandedRowIds, onExpandedChange, reservePaginationSpace, striped, selectContentClassName, menuPopupClassName, }: DataTableProps<T>): import("react/jsx-runtime").JSX.Element;
+export declare function DataTable<T extends DataTableRow>({ columns, data, onRowClick, onSelectionChange, selectedRowIds, onSort, sortState, expandable, renderExpandedRow, actions, className, pagination, treeData, reorderable, onReorder, onDragReorder, customFilterColumnsWhiteList, loading, loadingRows, emptyState, clickableFields, showColumnVisibility, footerContent, expandedRowIds, onExpandedChange, reservePaginationSpace, striped, selectContentClassName, menuPopupClassName, }: DataTableProps<T>): import("react/jsx-runtime").JSX.Element;
 export { CheckIcon, XIcon };
 //# sourceMappingURL=data-table.d.ts.map

package/dist/components/data-table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../src/components/data-table.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"data-table.d.ts","sourceRoot":"","sources":["../../src/components/data-table.tsx"],"names":[],"mappings":"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"}

package/dist/components/data-table.js

@@ -10,7 +10,16 @@ import { Button } from './button.js';
 import { Pagination, PaginationContent, PaginationItem, PaginationPrevious, PaginationNext, PaginationLink, PaginationEllipsis } from './pagination.js';
 
 const DEFAULT_PAGE_SIZE_OPTIONS = [5, 10, 25, 50];
-function DataTable({ columns, data, onSelectionChange, selectedRowIds, onSort, sortState, expandable = false, renderExpandedRow, actions, className, pagination, treeData = false, reorderable = false, onReorder, onDragReorder, customFilterColumnsWhiteList, loading = false, loadingRows = 5, emptyState, clickableFields, showColumnVisibility = true, footerContent, expandedRowIds, onExpandedChange, reservePaginationSpace = false, striped = true, selectContentClassName, menuPopupClassName, }) {
+function renderCellValue(value) {
+    if (value == null || React.isValidElement(value))
+        return value;
+    if (typeof value !== "object")
+        return value;
+    if (Array.isArray(value))
+        return value.length;
+    return String(value);
+}
+function DataTable({ columns, data, onRowClick, onSelectionChange, selectedRowIds, onSort, sortState, expandable = false, renderExpandedRow, actions, className, pagination, treeData = false, reorderable = false, onReorder, onDragReorder, customFilterColumnsWhiteList, loading = false, loadingRows = 5, emptyState, clickableFields, showColumnVisibility = true, footerContent, expandedRowIds, onExpandedChange, reservePaginationSpace = false, striped = true, selectContentClassName, menuPopupClassName, }) {
     const [internalSelectedRows, setInternalSelectedRows] = React.useState(new Set());
     const [internalExpandedRows, setInternalExpandedRows] = React.useState(new Set());
     const [internalSortConfig, setInternalSortConfig] = React.useState({ key: "", direction: null });
@@ -108,15 +117,19 @@ function DataTable({ columns, data, onSelectionChange, selectedRowIds, onSort, s
         }
         onSort?.(key, direction);
     };
-    React.useMemo(() => {
-        let result = [...data];
+    const processedData = React.useMemo(() => {
+        const result = [...data];
         if (!onSort && sortConfig.key && sortConfig.direction) {
             result.sort((a, b) => {
                 const aValue = a[sortConfig.key];
                 const bValue = b[sortConfig.key];
                 if (aValue === bValue)
                     return 0;
-                const comparison = aValue < bValue ? -1 : 1;
+                const comparison = typeof aValue === "number" && typeof bValue === "number"
+                    ? aValue - bValue
+                    : String(aValue ?? "").localeCompare(String(bValue ?? ""), undefined, {
+                        numeric: true,
+                    });
                 return sortConfig.direction === "asc" ? comparison : -comparison;
             });
         }
@@ -172,6 +185,22 @@ function DataTable({ columns, data, onSelectionChange, selectedRowIds, onSort, s
         const isDragging = draggedRowId === row.id;
         const isDragOver = dragOverRowId === row.id;
         const totalSiblings = siblingCount ?? data.length;
+        const isRowClickable = !!onRowClick;
+        const handleRowClick = (event) => {
+            const target = event.target;
+            if (target?.closest('button, a, input, select, textarea, [role="button"], [role="checkbox"], [role="menuitem"]')) {
+                return;
+            }
+            onRowClick?.(row);
+        };
+        const handleRowKeyDown = (event) => {
+            if (event.target !== event.currentTarget)
+                return;
+            if (event.key !== "Enter" && event.key !== " ")
+                return;
+            event.preventDefault();
+            onRowClick?.(row);
+        };
         const handleDragStart = (e) => {
             setDraggedRowId(row.id);
             e.dataTransfer.effectAllowed = "move";
@@ -200,11 +229,12 @@ function DataTable({ columns, data, onSelectionChange, selectedRowIds, onSort, s
             setDraggedRowId(null);
             setDragOverRowId(null);
         };
-        return (jsxs(React.Fragment, { children: [jsxs("tr", { className: cn("tw:border-b tw:transition-colors hover:tw:bg-accent/50", rowBgClass, isDragging && "tw:opacity-50", isDragOver && "tw:ring-2 tw:ring-primary tw:ring-inset"), draggable: reorderable, onDragStart: reorderable ? handleDragStart : undefined, onDragEnd: reorderable ? handleDragEnd : undefined, onDragOver: reorderable ? handleDragOver : undefined, onDragLeave: reorderable ? handleDragLeave : undefined, onDrop: reorderable ? handleDrop : undefined, children: [isExpandable && (jsx("td", { className: cn("tw:p-2 tw:w-12", rowBgClass), children: jsx("div", { style: { paddingLeft: indentPadding }, children: canExpand ? (jsx("button", { onClick: () => toggleRowExpansion(row.id), className: "tw:flex tw:items-center tw:justify-center hover:tw:bg-accent tw:rounded tw:p-1", "aria-label": isExpanded ? "Collapse row" : "Expand row", "aria-expanded": isExpanded, children: isExpanded ? (jsx(ChevronDownIcon, { className: "tw:text-muted-foreground tw:size-4 tw:shrink-0 tw:transition-transform tw:duration-200" })) : (jsx(ChevronRightIcon, { className: "tw:text-muted-foreground tw:size-4 tw:shrink-0 tw:transition-transform tw:duration-200" })) })) : (jsx("span", { className: "tw:w-6" })) }) })), hasRowSelection && (jsx("td", { className: cn("tw:p-2 tw:w-12", rowBgClass), children: jsx("div", { className: "tw:flex tw:items-center tw:justify-center", children: jsx(Checkbox, { checked: selectedRows.has(row.id), onCheckedChange: () => toggleRowSelection(row.id), "aria-label": `Select row ${rowIndex + 1}`, className: "tw:h-[22px] tw:w-[22px]" }) }) })), reorderable && (jsx("td", { className: cn("tw:p-2 tw:w-12", rowBgClass), children: jsxs("div", { className: "tw:flex tw:flex-col tw:items-center tw:gap-0.5", children: [jsx("button", { onClick: () => onReorder?.(row.id, "up", parentRow?.id), className: "tw:flex tw:items-center tw:justify-center hover:tw:bg-accent tw:rounded tw:p-0.5 tw:text-muted-foreground hover:tw:text-foreground tw:transition-colors", disabled: rowIndex === 0, "aria-label": "Move row up", children: jsx(ChevronUpIcon, { className: cn("tw:size-4", rowIndex === 0 && "tw:opacity-30") }) }), jsx("button", { onClick: () => onReorder?.(row.id, "down", parentRow?.id), className: "tw:flex tw:items-center tw:justify-center hover:tw:bg-accent tw:rounded tw:p-0.5 tw:text-muted-foreground hover:tw:text-foreground tw:transition-colors", disabled: rowIndex === totalSiblings - 1, "aria-label": "Move row down", children: jsx(ChevronDownIcon, { className: cn("tw:size-4", rowIndex === totalSiblings - 1 && "tw:opacity-30") }) })] }) })), visibleColumns.map((column, colIndex) => {
+        return (jsxs(React.Fragment, { children: [jsxs("tr", { className: cn("tw:border-b tw:transition-colors hover:tw:bg-accent/50", isRowClickable &&
+                        "tw:cursor-pointer tw:focus-visible:outline-none tw:focus-visible:ring-2 tw:focus-visible:ring-ring tw:focus-visible:ring-inset", rowBgClass, isDragging && "tw:opacity-50", isDragOver && "tw:ring-2 tw:ring-primary tw:ring-inset"), tabIndex: isRowClickable ? 0 : undefined, onClick: isRowClickable ? handleRowClick : undefined, onKeyDown: isRowClickable ? handleRowKeyDown : undefined, draggable: reorderable, onDragStart: reorderable ? handleDragStart : undefined, onDragEnd: reorderable ? handleDragEnd : undefined, onDragOver: reorderable ? handleDragOver : undefined, onDragLeave: reorderable ? handleDragLeave : undefined, onDrop: reorderable ? handleDrop : undefined, children: [isExpandable && (jsx("td", { className: cn("tw:p-2 tw:w-12", rowBgClass), onClick: (event) => event.stopPropagation(), children: jsx("div", { style: { paddingLeft: indentPadding }, children: canExpand ? (jsx("button", { onClick: () => toggleRowExpansion(row.id), className: "tw:flex tw:items-center tw:justify-center hover:tw:bg-accent tw:rounded tw:p-1", "aria-label": isExpanded ? "Collapse row" : "Expand row", "aria-expanded": isExpanded, children: isExpanded ? (jsx(ChevronDownIcon, { className: "tw:text-muted-foreground tw:size-4 tw:shrink-0 tw:transition-transform tw:duration-200" })) : (jsx(ChevronRightIcon, { className: "tw:text-muted-foreground tw:size-4 tw:shrink-0 tw:transition-transform tw:duration-200" })) })) : (jsx("span", { className: "tw:w-6" })) }) })), hasRowSelection && (jsx("td", { className: cn("tw:p-2 tw:w-12", rowBgClass), onClick: (event) => event.stopPropagation(), children: jsx("div", { className: "tw:flex tw:items-center tw:justify-center", children: jsx(Checkbox, { checked: selectedRows.has(row.id), onCheckedChange: () => toggleRowSelection(row.id), "aria-label": `Select row ${rowIndex + 1}`, className: "tw:h-[22px] tw:w-[22px]" }) }) })), reorderable && (jsx("td", { className: cn("tw:p-2 tw:w-12", rowBgClass), onClick: (event) => event.stopPropagation(), children: jsxs("div", { className: "tw:flex tw:flex-col tw:items-center tw:gap-0.5", children: [jsx("button", { onClick: () => onReorder?.(row.id, "up", parentRow?.id), className: "tw:flex tw:items-center tw:justify-center hover:tw:bg-accent tw:rounded tw:p-0.5 tw:text-muted-foreground hover:tw:text-foreground tw:transition-colors", disabled: rowIndex === 0, "aria-label": "Move row up", children: jsx(ChevronUpIcon, { className: cn("tw:size-4", rowIndex === 0 && "tw:opacity-30") }) }), jsx("button", { onClick: () => onReorder?.(row.id, "down", parentRow?.id), className: "tw:flex tw:items-center tw:justify-center hover:tw:bg-accent tw:rounded tw:p-0.5 tw:text-muted-foreground hover:tw:text-foreground tw:transition-colors", disabled: rowIndex === totalSiblings - 1, "aria-label": "Move row down", children: jsx(ChevronDownIcon, { className: cn("tw:size-4", rowIndex === totalSiblings - 1 && "tw:opacity-30") }) })] }) })), visibleColumns.map((column, colIndex) => {
                             const clickableField = getClickableField(column.key);
                             const cellContent = column.render
                                 ? column.render(row[column.key], row, rowIndex, depth)
-                                : row[column.key];
+                                : renderCellValue(row[column.key]);
                             return (jsx("td", { className: cn("tw:p-4 tw:align-middle tw:max-w-0 tw:overflow-hidden", column.align === "center" && "tw:text-center", column.align === "right" && "tw:text-right", column.className, rowBgClass), children: jsx("div", { className: cn("tw:truncate", clickableField && "tw:!text-primary"), style: {
                                         paddingLeft: colIndex === 0
                                             ? isExpandable
@@ -213,8 +243,11 @@ function DataTable({ columns, data, onSelectionChange, selectedRowIds, onSort, s
                                                     : 0
                                                 : indentPadding
                                             : 0,
-                                    }, children: clickableField ? (jsx("span", { onClick: () => clickableField.onClick(row), className: "hover:tw:!text-primary/80 hover:tw:underline tw:cursor-pointer tw:transition-colors", children: cellContent })) : (cellContent) }) }, column.key));
-                        }), showActionsColumn && (jsx("td", { className: cn("tw:p-2 tw:text-right tw:sticky tw:right-0", rowBgClass), children: visibleActionsForRow.length > 0 && (jsxs(Menu.Root, { modal: false, children: [jsx(Menu.Trigger, { id: `base-ui-row-action-${row.id}`, render: (props) => (jsx(Button, { variant: "ghost", size: "icon", className: "tw:h-8 tw:w-8", "aria-label": "Row actions", ...props, id: `base-ui-row-action-${row.id}`, children: jsx(MoreHorizontalIcon, { className: "tw:size-4" }) })) }), jsx(Menu.Portal, { children: jsx(Menu.Positioner, { side: "bottom", align: "end", sideOffset: 4, collisionPadding: 8, children: jsx(Menu.Popup, { "aria-labelledby": "base-ui-toggle-columns-trigger", className: cn("tw:bg-popover tw:font-sans tw:text-popover-foreground tw:data-[state=open]:animate-in tw:data-[state=closed]:animate-out tw:data-[state=closed]:fade-out-0 tw:data-[state=open]:fade-in-0 tw:data-[state=closed]:zoom-out-95 tw:data-[state=open]:zoom-in-95 tw:data-[side=bottom]:slide-in-from-top-2 tw:data-[side=left]:slide-in-from-right-2 tw:data-[side=right]:slide-in-from-left-2 tw:data-[side=top]:slide-in-from-bottom-2 tw:z-50 tw:min-w-[8rem] tw:overflow-x-hidden tw:overflow-y-auto tw:rounded-md tw:border tw:p-1 tw:shadow-md"), children: visibleActionsForRow.map((action, index) => (jsxs(Menu.Item, { onClick: () => action.onClick(row), className: cn("tw:focus:bg-accent tw:focus:text-accent-foreground tw:relative tw:flex tw:cursor-default tw:items-center tw:gap-2 tw:rounded-sm tw:px-2 tw:py-1.5 tw:text-[14px] tw:outline-hidden tw:select-none tw:data-[disabled]:pointer-events-none tw:data-[disabled]:opacity-50", action.variant === "destructive" &&
+                                    }, children: clickableField ? (jsx("button", { type: "button", onClick: (event) => {
+                                            event.stopPropagation();
+                                            clickableField.onClick(row);
+                                        }, className: "tw:inline tw:cursor-pointer tw:appearance-none tw:border-0 tw:bg-transparent tw:p-0 tw:text-inherit tw:font-[inherit] tw:transition-colors hover:tw:!text-primary/80 hover:tw:underline", children: cellContent })) : (cellContent) }) }, column.key));
+                        }), showActionsColumn && (jsx("td", { className: cn("tw:p-2 tw:text-right tw:sticky tw:right-0", rowBgClass), onClick: (event) => event.stopPropagation(), children: visibleActionsForRow.length > 0 && (jsxs(Menu.Root, { modal: false, children: [jsx(Menu.Trigger, { id: `base-ui-row-action-${row.id}`, render: (props) => (jsx(Button, { variant: "ghost", size: "icon", className: "tw:h-8 tw:w-8", "aria-label": "Row actions", ...props, id: `base-ui-row-action-${row.id}`, children: jsx(MoreHorizontalIcon, { className: "tw:size-4" }) })) }), jsx(Menu.Portal, { children: jsx(Menu.Positioner, { side: "bottom", align: "end", sideOffset: 4, collisionPadding: 8, children: jsx(Menu.Popup, { "aria-labelledby": "base-ui-toggle-columns-trigger", className: cn("tw:bg-popover tw:font-sans tw:text-popover-foreground tw:data-[state=open]:animate-in tw:data-[state=closed]:animate-out tw:data-[state=closed]:fade-out-0 tw:data-[state=open]:fade-in-0 tw:data-[state=closed]:zoom-out-95 tw:data-[state=open]:zoom-in-95 tw:data-[side=bottom]:slide-in-from-top-2 tw:data-[side=left]:slide-in-from-right-2 tw:data-[side=right]:slide-in-from-left-2 tw:data-[side=top]:slide-in-from-bottom-2 tw:z-50 tw:min-w-[8rem] tw:overflow-x-hidden tw:overflow-y-auto tw:rounded-md tw:border tw:p-1 tw:shadow-md"), children: visibleActionsForRow.map((action, index) => (jsxs(Menu.Item, { onClick: () => action.onClick(row), className: cn("tw:focus:bg-accent tw:focus:text-accent-foreground tw:relative tw:flex tw:cursor-default tw:items-center tw:gap-2 tw:rounded-sm tw:px-2 tw:py-1.5 tw:text-[14px] tw:outline-hidden tw:select-none tw:data-[disabled]:pointer-events-none tw:data-[disabled]:opacity-50", action.variant === "destructive" &&
                                                         "tw:text-destructive focus:tw:text-destructive"), children: [action.icon && (jsx("span", { className: "tw:mr-2", children: action.icon })), action.label] }, index))) }) }) })] })) }))] }), expandable && !treeData && isExpanded && renderExpandedRow && (jsx("tr", { className: "tw:border-b tw:bg-muted/30", children: jsx("td", { colSpan: visibleColumns.length +
                             (showActionsColumn ? 1 : 0) +
                             (hasRowSelection ? 1 : 0) +
@@ -302,7 +335,7 @@ function DataTable({ columns, data, onSelectionChange, selectedRowIds, onSort, s
                                                         : sortConfig.direction === "desc"
                                                             ? "descending"
                                                             : "none"
-                                                    : undefined, className: cn("tw:!h-[40px] tw:px-4 tw:text-left tw:align-middle tw:font-medium tw:text-foreground tw:whitespace-nowrap", column.align === "center" && "tw:text-center", column.align === "right" && "tw:text-right"), style: { width: column.width }, children: column.sortable && onSort ? (jsxs("button", { onClick: () => !loading && handleSort(column.key), disabled: loading, "aria-label": `Sort by ${column.label}${sortConfig.key === column.key
+                                                    : undefined, className: cn("tw:!h-[40px] tw:px-4 tw:text-left tw:align-middle tw:font-medium tw:text-foreground tw:whitespace-nowrap", column.align === "center" && "tw:text-center", column.align === "right" && "tw:text-right"), style: { width: column.width }, children: column.sortable ? (jsxs("button", { onClick: () => !loading && handleSort(column.key), disabled: loading, "aria-label": `Sort by ${column.label}${sortConfig.key === column.key
                                                         ? sortConfig.direction === "asc"
                                                             ? ", currently sorted ascending"
                                                             : sortConfig.direction === "desc"
@@ -316,7 +349,7 @@ function DataTable({ columns, data, onSelectionChange, selectedRowIds, onSort, s
                                                 (hasRowSelection ? 1 : 0) +
                                                 (isExpandable ? 1 : 0) +
                                                 (reorderable ? 1 : 0), className: "tw:h-48", children: jsxs("div", { className: "tw:flex tw:flex-col tw:items-center tw:justify-center tw:h-full tw:text-center", children: [emptyState?.icon || (jsx("div", { className: "tw:h-12 tw:w-12 tw:rounded-full tw:bg-muted tw:flex tw:items-center tw:justify-center tw:mb-3", children: jsx(InboxIcon, { className: "tw:size-6 tw:text-muted-foreground" }) })), jsx("p", { className: "tw:text-base tw:font-medium tw:text-foreground", children: emptyState?.title || "No results found" }), jsx("p", { className: "tw:text-sm tw:text-muted-foreground tw:mt-1", children: emptyState?.description ||
-                                                            "There are no items to display." })] }) }) })) : (data.map((row, rowIndex) => renderRow(row, rowIndex, 0))) })] }) }), loading && (jsx("div", { className: "tw:absolute tw:inset-0 tw:z-20 tw:flex tw:items-center tw:justify-center tw:bg-card/50 tw:backdrop-blur-[1px]", children: jsxs("div", { className: "tw:flex tw:flex-col tw:items-center", children: [jsx(Loader2Icon, { className: "tw:size-8 tw:animate-spin tw:text-primary" }), data.length === 0 && (jsx("p", { className: "tw:text-sm tw:text-muted-foreground tw:mt-3", children: "Loading..." }))] }) }))] }), footerContent && (jsx("div", { className: "tw:border-t tw:px-4 tw:py-3 tw:bg-card", children: footerContent })), pagination &&
+                                                            "There are no items to display." })] }) }) })) : (processedData.map((row, rowIndex) => renderRow(row, rowIndex, 0))) })] }) }), loading && (jsx("div", { className: "tw:absolute tw:inset-0 tw:z-20 tw:flex tw:items-center tw:justify-center tw:bg-card/50 tw:backdrop-blur-[1px]", children: jsxs("div", { className: "tw:flex tw:flex-col tw:items-center", children: [jsx(Loader2Icon, { className: "tw:size-8 tw:animate-spin tw:text-primary" }), data.length === 0 && (jsx("p", { className: "tw:text-sm tw:text-muted-foreground tw:mt-3", children: "Loading..." }))] }) }))] }), footerContent && (jsx("div", { className: "tw:border-t tw:px-4 tw:py-3 tw:bg-card", children: footerContent })), pagination &&
                 (pagination.totalPages > 1 ||
                     pagination.mode === "cursor" ||
                     pagination.showTotalItems ||

package/dist/components/field.js

@@ -41,10 +41,10 @@ function FieldContent({ className, ...props }) {
     return (jsx("div", { "data-slot": "field-content", className: cn("group/field-content tw:flex tw:flex-1 tw:flex-col tw:gap-1.5 tw:leading-snug", className), ...props }));
 }
 function FieldLabel({ className, ...props }) {
-    return (jsx(Label, { "data-slot": "field-label", className: cn("group/field-label peer/field-label tw:flex tw:w-fit tw:gap-2 tw:leading-snug group-data-[disabled=true]/field:tw:opacity-50", "has-[>[data-slot=field]]:tw:w-full has-[>[data-slot=field]]:tw:flex-col has-[>[data-slot=field]]:tw:rounded-md has-[>[data-slot=field]]:tw:border [&>*]:data-[slot=field]:tw:p-4", "has-data-[state=checked]:tw:bg-primary/5 has-data-[state=checked]:tw:border-primary dark:has-data-[state=checked]:tw:bg-primary/10", className), ...props }));
+    return (jsx(Label, { "data-slot": "field-label", className: cn("group/field-label peer/field-label tw:flex tw:w-fit tw:gap-2 tw:leading-snug group-data-[disabled=true]/field:tw:!cursor-not-allowed group-data-[disabled=true]/field:tw:!opacity-50", "has-[>[data-slot=field]]:tw:w-full has-[>[data-slot=field]]:tw:flex-col has-[>[data-slot=field]]:tw:rounded-md has-[>[data-slot=field]]:tw:border [&>*]:data-[slot=field]:tw:p-4", "has-data-[state=checked]:tw:bg-primary/5 has-data-[state=checked]:tw:border-primary dark:has-data-[state=checked]:tw:bg-primary/10", className), ...props }));
 }
 function FieldTitle({ className, ...props }) {
-    return (jsx("div", { "data-slot": "field-label", className: cn("tw:flex tw:w-fit tw:items-center tw:gap-2 tw:text-sm tw:leading-snug tw:font-medium group-data-[disabled=true]/field:tw:opacity-50", className), ...props }));
+    return (jsx("div", { "data-slot": "field-label", className: cn("tw:flex tw:w-fit tw:items-center tw:gap-2 tw:text-sm tw:leading-snug tw:font-medium group-data-[disabled=true]/field:tw:!cursor-not-allowed group-data-[disabled=true]/field:tw:!opacity-50", className), ...props }));
 }
 function FieldDescription({ className, ...props }) {
     return (jsx("p", { "data-slot": "field-description", className: cn("tw:text-muted-foreground tw:text-sm tw:leading-normal tw:font-normal group-has-[[data-orientation=horizontal]]/field:tw:text-balance", "last:tw:mt-0 nth-last-2:tw:-mt-1 [[data-variant=legend]+&]:tw:-mt-1.5", "[&>a:hover]:tw:text-primary [&>a]:tw:underline [&>a]:tw:underline-offset-4", className), ...props }));

package/dist/components/form.js

@@ -1,7 +1,7 @@
 import { jsx } from 'react/jsx-runtime';
 import * as React from 'react';
 import { Slot } from '@radix-ui/react-slot';
-import { FormProvider, useFormContext, useFormState, Controller } from 'react-hook-form';
+import { FormProvider, Controller, useFormContext, useFormState } from 'react-hook-form';
 import { cn } from '../lib/utils.js';
 import { Label } from './label.js';
 

package/dist/components/header-app-switcher.d.ts

@@ -10,32 +10,29 @@ declare const AppsConfig: readonly [{
     readonly name: "Ecom";
     readonly logo: import("react/jsx-runtime").JSX.Element;
     readonly subdomain: "ecom-beta";
-}, {
-    readonly name: "Lighthouse";
-    readonly logo: import("react/jsx-runtime").JSX.Element;
-    readonly subdomain: "lighthouse";
 }, {
     readonly name: "Sites";
     readonly logo: import("react/jsx-runtime").JSX.Element;
     readonly subdomain: "cms";
 }, {
-    readonly name: "Pay";
+    readonly name: "Lighthouse";
+    readonly logo: import("react/jsx-runtime").JSX.Element;
+    readonly subdomain: "lighthouse";
+}, {
+    readonly name: "Growth";
     readonly logo: import("react/jsx-runtime").JSX.Element;
-    readonly badge: "Soon";
-    readonly disabled: true;
-    readonly subdomain: null;
+    readonly subdomain: "growth";
 }, {
-    readonly name: "Insight";
+    readonly name: "Billing";
     readonly logo: import("react/jsx-runtime").JSX.Element;
-    readonly disabled: true;
-    readonly subdomain: null;
+    readonly subdomain: "billing";
 }, {
-    readonly name: "Dispatch";
+    readonly name: "Settings";
     readonly logo: import("react/jsx-runtime").JSX.Element;
-    readonly disabled: true;
-    readonly subdomain: null;
+    readonly subdomain: "settings";
 }];
 type AppName = (typeof AppsConfig)[number]["name"];
+type AppSubdomain = NonNullable<(typeof AppsConfig)[number]["subdomain"]>;
 type HeaderAppSwitcherProps = {
     /**
      * Optional base host string (e.g. "https://blaze.me" or "staging.blaze.me").
@@ -44,7 +41,13 @@ type HeaderAppSwitcherProps = {
     commonHost?: string;
     /** Which app is currently active. Defaults to "Retail". */
     currentApp?: AppName;
+    /** Filter apps by subdomain. When omitted, all apps are shown. */
+    visibleApps?: AppSubdomain[];
+    /** Number of grid columns. Defaults to 3. */
+    columns?: 1 | 2 | 3 | 4;
+    /** When true, appends ?sso=true to all app URLs to trigger SSO login on the target app. */
+    ssoRedirect?: boolean;
 };
-declare function HeaderAppSwitcher({ commonHost, currentApp, }: HeaderAppSwitcherProps): import("react/jsx-runtime").JSX.Element;
-export { HeaderAppSwitcher, type HeaderAppSwitcherProps, type AppName };
+declare function HeaderAppSwitcher({ commonHost, currentApp, visibleApps, columns, ssoRedirect, }: HeaderAppSwitcherProps): import("react/jsx-runtime").JSX.Element;
+export { HeaderAppSwitcher, type HeaderAppSwitcherProps, type AppName, type AppSubdomain, };
 //# sourceMappingURL=header-app-switcher.d.ts.map

package/dist/components/header-app-switcher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"header-app-switcher.d.ts","sourceRoot":"","sources":["../../src/components/header-app-switcher.tsx"],"names":[],"mappings":"AAqBA,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6BN,CAAA;AAEV,KAAK,OAAO,GAAG,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAA;AAgHlD,KAAK,sBAAsB,GAAG;IAC5B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,2DAA2D;IAC3D,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB,CAAA;AAYD,iBAAS,iBAAiB,CAAC,EACzB,UAAU,EACV,UAAqB,GACtB,EAAE,sBAAsB,2CA4ExB;AAED,OAAO,EAAE,iBAAiB,EAAE,KAAK,sBAAsB,EAAE,KAAK,OAAO,EAAE,CAAA"}
+{"version":3,"file":"header-app-switcher.d.ts","sourceRoot":"","sources":["../../src/components/header-app-switcher.tsx"],"names":[],"mappings":"AAsBA,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyBN,CAAA;AAEV,KAAK,OAAO,GAAG,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAA;AAClD,KAAK,YAAY,GAAG,WAAW,CAAC,CAAC,OAAO,UAAU,CAAC,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,CAAC,CAAA;AAiGzE,KAAK,sBAAsB,GAAG;IAC5B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,2DAA2D;IAC3D,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,kEAAkE;IAClE,WAAW,CAAC,EAAE,YAAY,EAAE,CAAA;IAC5B,6CAA6C;IAC7C,OAAO,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAA;IACvB,2FAA2F;IAC3F,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB,CAAA;AAmBD,iBAAS,iBAAiB,CAAC,EACzB,UAAU,EACV,UAAqB,EACrB,WAAW,EACX,OAAO,EACP,WAAW,GACZ,EAAE,sBAAsB,2CA+FxB;AAED,OAAO,EACL,iBAAiB,EACjB,KAAK,sBAAsB,EAC3B,KAAK,OAAO,EACZ,KAAK,YAAY,GAClB,CAAA"}

package/dist/components/header-app-switcher.js

@@ -1,45 +1,35 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as React from 'react';
+import { TrendingUp, CreditCard, Settings } from 'lucide-react';
 import { Button } from './button.js';
 import { Popover, PopoverTrigger, PopoverContent } from './popover.js';
-import { BlazeDispatchLogo } from '../svgs/blaze-dispatch-logo.js';
-import { BlazeRetailLogo } from '../svgs/blaze-retail-logo.js';
-import { BlazePosLogo } from '../svgs/blaze-pos-logo.js';
-import { BlazeEcomLogo } from '../svgs/blaze-ecom-logo.js';
-import { BlazeLighthouseLogo } from '../svgs/blaze-lighthouse-logo.js';
-import { BlazeSitesLogo } from '../svgs/blaze-sites-logo.js';
-import { BlazePayLogo } from '../svgs/blaze-pay-logo.js';
-import { BlazeInsightsLogo } from '../svgs/blaze-insights-logo.js';
+import { RetailLogo, PosLogo, EcomLogo, SitesLogo, PlaceholderAppIcon, AppsGridIcon } from '../svgs/header-app-switcher-logos.js';
 import { cn } from '../lib/utils.js';
 
 const AppsConfig = [
-    { name: "Retail", logo: jsx(BlazeRetailLogo, {}), subdomain: "retail-beta" },
-    { name: "POS", logo: jsx(BlazePosLogo, {}), subdomain: "pos" },
-    { name: "Ecom", logo: jsx(BlazeEcomLogo, {}), subdomain: "ecom-beta" },
+    { name: "Retail", logo: jsx(RetailLogo, {}), subdomain: "retail-beta" },
+    { name: "POS", logo: jsx(PosLogo, {}), subdomain: "pos" },
+    { name: "Ecom", logo: jsx(EcomLogo, {}), subdomain: "ecom-beta" },
+    { name: "Sites", logo: jsx(SitesLogo, {}), subdomain: "cms" },
     {
         name: "Lighthouse",
-        logo: jsx(BlazeLighthouseLogo, {}),
+        logo: jsx(PosLogo, {}),
         subdomain: "lighthouse",
     },
-    { name: "Sites", logo: jsx(BlazeSitesLogo, {}), subdomain: "cms" },
     {
-        name: "Pay",
-        logo: jsx(BlazePayLogo, {}),
-        badge: "Soon",
-        disabled: true,
-        subdomain: null,
+        name: "Growth",
+        logo: jsx(PlaceholderAppIcon, { icon: TrendingUp }),
+        subdomain: "growth",
     },
     {
-        name: "Insight",
-        logo: jsx(BlazeInsightsLogo, {}),
-        disabled: true,
-        subdomain: null,
+        name: "Billing",
+        logo: jsx(PlaceholderAppIcon, { icon: CreditCard }),
+        subdomain: "billing",
     },
     {
-        name: "Dispatch",
-        logo: jsx(BlazeDispatchLogo, {}),
-        disabled: true,
-        subdomain: null,
+        name: "Settings",
+        logo: jsx(PlaceholderAppIcon, { icon: Settings }),
+        subdomain: "settings",
     },
 ];
 const trimSlashes = (value) => value.trim().replace(/\/+$/, "");
@@ -105,43 +95,53 @@ const resolveHostInfo = (commonHost) => {
         host: "blaze.me",
     };
 };
-const buildAppUrl = (subdomain, base) => {
+const buildAppUrl = (subdomain, base, ssoRedirect) => {
     if (!subdomain)
         return "#";
-    return `${base.protocol}//${subdomain}.${base.host}`;
+    const url = new URL(`${base.protocol}//${subdomain}.${base.host}`);
+    if (ssoRedirect)
+        url.searchParams.set("sso", "true");
+    return url.toString();
 };
-function AppsGridIcon() {
-    return (jsxs("svg", { "aria-hidden": true, viewBox: "0 0 24 24", fill: "currentColor", className: "tw:h-5 tw:w-5", children: [jsx("circle", { cx: "5", cy: "5", r: "1.5" }), jsx("circle", { cx: "12", cy: "5", r: "1.5" }), jsx("circle", { cx: "19", cy: "5", r: "1.5" }), jsx("circle", { cx: "5", cy: "12", r: "1.5" }), jsx("circle", { cx: "12", cy: "12", r: "1.5" }), jsx("circle", { cx: "19", cy: "12", r: "1.5" }), jsx("circle", { cx: "5", cy: "19", r: "1.5" }), jsx("circle", { cx: "12", cy: "19", r: "1.5" }), jsx("circle", { cx: "19", cy: "19", r: "1.5" })] }));
-}
 const getTileClassName = (isCurrent, isDisabled) => {
-    if (isCurrent) {
-        return "tw:bg-primary/10 tw:ring-2 tw:ring-primary/20";
-    }
     if (isDisabled) {
         return "tw:cursor-not-allowed tw:opacity-60";
     }
+    if (isCurrent) {
+        return "tw:cursor-default";
+    }
     return "hover:tw:bg-accent tw:cursor-pointer";
 };
-function HeaderAppSwitcher({ commonHost, currentApp = "Retail", }) {
+const gridColsClass = {
+    1: "tw:grid-cols-1",
+    2: "tw:grid-cols-2",
+    3: "tw:grid-cols-3",
+    4: "tw:grid-cols-4",
+};
+function HeaderAppSwitcher({ commonHost, currentApp = "Retail", visibleApps, columns, ssoRedirect, }) {
     const apps = React.useMemo(() => {
         const base = resolveHostInfo(commonHost);
-        return AppsConfig.map((app) => ({
+        const filtered = visibleApps
+            ? AppsConfig.filter((app) => app.subdomain && visibleApps.includes(app.subdomain))
+            : AppsConfig;
+        return filtered.map((app) => ({
             ...app,
             isCurrent: currentApp === app.name,
-            href: buildAppUrl(app.subdomain, base),
+            href: buildAppUrl(app.subdomain, base, ssoRedirect),
         }));
-    }, [commonHost, currentApp]);
-    return (jsxs(Popover, { children: [jsx(PopoverTrigger, { asChild: true, children: jsxs(Button, { variant: "ghost", size: "icon", children: [jsx(AppsGridIcon, {}), jsx("span", { className: "tw:sr-only", children: "Switch apps" })] }) }), jsxs(PopoverContent, { align: "end", sideOffset: 8, className: "tw:w-72 tw:p-4", children: [jsx("p", { className: "tw:mb-3 tw:text-sm tw:font-medium tw:text-muted-foreground", children: "Blaze Apps" }), jsx("div", { className: "tw:grid tw:grid-cols-3 tw:gap-1", children: apps.map((app) => {
+    }, [commonHost, currentApp, visibleApps, ssoRedirect]);
+    const resolvedColumns = columns ?? 3;
+    return (jsxs(Popover, { children: [jsx(PopoverTrigger, { asChild: true, children: jsxs(Button, { variant: "ghost", size: "icon", children: [jsx(AppsGridIcon, {}), jsx("span", { className: "tw:sr-only", children: "Switch apps" })] }) }), jsxs(PopoverContent, { align: "end", sideOffset: 8, className: "tw:!w-[286px] tw:!rounded tw:!border-border tw:!p-4 tw:!font-sans tw:!shadow-xl", children: [jsx("p", { className: "tw:mb-5 tw:text-sm tw:font-medium tw:leading-5 tw:text-popover-foreground", children: "Blaze Apps" }), jsx("div", { className: cn("tw:grid tw:gap-x-5 tw:gap-y-7", gridColsClass[resolvedColumns]), children: apps.map((app) => {
                             const isDisabled = Boolean(app.disabled);
                             const isCurrent = Boolean(app.isCurrent);
                             const tileClassName = getTileClassName(isCurrent, isDisabled);
-                            const tileContent = (jsxs(Fragment, { children: [app.badge ? (jsx("span", { className: "tw:absolute tw:right-1 tw:top-1 tw:rounded-full tw:bg-primary tw:px-1.5 tw:py-0.5 tw:text-[10px] tw:font-semibold tw:leading-none tw:text-primary-foreground", children: app.badge })) : null, app.logo, jsx("span", { className: cn("tw:text-center tw:text-[11px] tw:font-medium tw:leading-tight", isCurrent
-                                            ? "tw:font-semibold tw:text-primary"
-                                            : "tw:text-foreground"), children: app.name })] }));
-                            const baseClassName = `tw:relative tw:flex tw:flex-col tw:items-center tw:gap-2 tw:rounded-lg tw:p-3 tw:transition-colors ${tileClassName}`;
+                            const tileContent = (jsxs(Fragment, { children: [app.badge ? (jsx("span", { className: "tw:absolute tw:right-1 tw:top-1 tw:rounded-full tw:bg-primary tw:px-1.5 tw:py-0.5 tw:text-[10px] tw:font-semibold tw:leading-none tw:text-primary-foreground", children: app.badge })) : null, jsx("span", { className: "tw:flex tw:size-9 tw:items-center tw:justify-center tw:[&>svg]:tw:size-9 tw:[&>svg]:tw:shrink-0", children: app.logo }), jsx("span", { className: cn("tw:text-center tw:text-xs tw:font-normal tw:leading-4 tw:text-popover-foreground", isDisabled && "tw:text-muted-foreground"), children: app.name })] }));
+                            const baseClassName = `tw:relative tw:flex tw:min-h-14 tw:flex-col tw:items-center tw:gap-2 tw:rounded-md tw:p-0 tw:transition-colors ${tileClassName}`;
                             const Wrapper = isDisabled || isCurrent ? "div" : "a";
                             const wrapperProps = isDisabled || isCurrent
-                                ? {}
+                                ? isCurrent
+                                    ? { "aria-current": "page" }
+                                    : {}
                                 : {
                                     href: app.href,
                                     target: "_blank",