@caffeinebounce/ui 0.62.2 → 0.63.0

package/dist/chunk-WOITB4JL.js

@@ -1,3 +1,4 @@
+"use client";
 'use strict';
 
 var chunkADIDI7AJ_js = require('./chunk-ADIDI7AJ.js');

package/dist/{chunk-E42B4GSB.js → chunk-XGJL6DLV.js}

@@ -1,8 +1,9 @@
+"use client";
 'use strict';
 
 var chunkLQCVRWVF_js = require('./chunk-LQCVRWVF.js');
+var chunkOCO3Z5YA_js = require('./chunk-OCO3Z5YA.js');
 var chunk7IKHZKAC_js = require('./chunk-7IKHZKAC.js');
-var chunkHMAMMC72_js = require('./chunk-HMAMMC72.js');
 var chunkJ6OLBSZR_js = require('./chunk-J6OLBSZR.js');
 var chunkDQWHYBV2_js = require('./chunk-DQWHYBV2.js');
 var chunkQ256HRYD_js = require('./chunk-Q256HRYD.js');
@@ -150,10 +151,10 @@ var SidebarProvider = React__namespace.forwardRef(
     ...props
   }, ref) => {
     const [machine, dispatch] = React__namespace.useReducer(sidebarReducer, {
-      viewportWidth: typeof window === "undefined" ? 1024 : window.innerWidth,
+      viewportWidth: 1024,
       desktopPref: toDesktopPreference(defaultOpen),
       openMobile: false,
-      hydrated: typeof window === "undefined"
+      hydrated: false
     });
     React__namespace.useLayoutEffect(() => {
       const syncViewport = () => {
@@ -781,14 +782,16 @@ var SidebarMenuSubButton = React__namespace.forwardRef(({ asChild = false, size
 SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
 function Avatar({
   className,
+  size = "default",
   ...props
 }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     AvatarPrimitive__namespace.Root,
     {
       "data-slot": "avatar",
+      "data-size": size,
       className: chunkADIDI7AJ_js.cn(
-        "relative flex size-10 shrink-0 overflow-hidden rounded-full",
+        "group/avatar relative flex size-8 shrink-0 overflow-hidden rounded-full select-none data-[size=lg]:size-10 data-[size=sm]:size-6",
         className
       ),
       ...props
@@ -803,7 +806,7 @@ function AvatarImage({
     AvatarPrimitive__namespace.Image,
     {
       "data-slot": "avatar-image",
-      className: chunkADIDI7AJ_js.cn("aspect-square size-full object-cover", className),
+      className: chunkADIDI7AJ_js.cn("aspect-square size-full", className),
       ...props
     }
   );
@@ -817,7 +820,52 @@ function AvatarFallback({
     {
       "data-slot": "avatar-fallback",
       className: chunkADIDI7AJ_js.cn(
-        "bg-muted flex size-full items-center justify-center rounded-full",
+        "flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AvatarBadge({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      "data-slot": "avatar-badge",
+      className: chunkADIDI7AJ_js.cn(
+        "absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground ring-2 ring-background select-none",
+        "group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden",
+        "group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2",
+        "group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AvatarGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "avatar-group",
+      className: chunkADIDI7AJ_js.cn(
+        "group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function AvatarGroupCount({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "avatar-group-count",
+      className: chunkADIDI7AJ_js.cn(
+        "relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3",
         className
       ),
       ...props
@@ -863,7 +911,7 @@ function UserAvatarMenu({
       "div",
       {
         className: `inline-flex items-center justify-center rounded-md ${sizeClass} ${className}`,
-        children: /* @__PURE__ */ jsxRuntime.jsx(chunkHMAMMC72_js.Spinner, { size: "sm" })
+        children: /* @__PURE__ */ jsxRuntime.jsx(chunkOCO3Z5YA_js.SizedSpinner, { size: "sm" })
       }
     );
   }
@@ -961,7 +1009,10 @@ function UserAvatarMenu({
 }
 
 exports.Avatar = Avatar;
+exports.AvatarBadge = AvatarBadge;
 exports.AvatarFallback = AvatarFallback;
+exports.AvatarGroup = AvatarGroup;
+exports.AvatarGroupCount = AvatarGroupCount;
 exports.AvatarImage = AvatarImage;
 exports.Kbd = Kbd;
 exports.KbdGroup = KbdGroup;

package/dist/chunk-YKZEKJMZ.mjs

@@ -1,3 +1,4 @@
+"use client";
 import { cn } from './chunk-IMKLN273.mjs';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import { jsx } from 'react/jsx-runtime';

package/dist/chunk-YRIBFIQ5.js

@@ -0,0 +1,116 @@
+"use client";
+'use strict';
+
+var chunkADIDI7AJ_js = require('./chunk-ADIDI7AJ.js');
+var TabsPrimitive = require('@radix-ui/react-tabs');
+var classVarianceAuthority = require('class-variance-authority');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var TabsPrimitive__namespace = /*#__PURE__*/_interopNamespace(TabsPrimitive);
+
+function Tabs({
+  className,
+  orientation = "horizontal",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Root,
+    {
+      "data-slot": "tabs",
+      "data-orientation": orientation,
+      orientation,
+      className: chunkADIDI7AJ_js.cn(
+        "group/tabs flex gap-2 data-[orientation=horizontal]:flex-col",
+        className
+      ),
+      ...props
+    }
+  );
+}
+var tabsListVariants = classVarianceAuthority.cva(
+  "group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-[orientation=horizontal]/tabs:h-9 group-data-[orientation=vertical]/tabs:h-fit group-data-[orientation=vertical]/tabs:flex-col data-[variant=line]:rounded-none",
+  {
+    variants: {
+      variant: {
+        default: "bg-muted",
+        line: "gap-1 bg-transparent"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function TabsList({
+  className,
+  // Local change over shadcn: consumers were built on the underline look, so
+  // "line" stays the default; pass variant="default" for the upstream pill.
+  variant = "line",
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.List,
+    {
+      "data-slot": "tabs-list",
+      "data-variant": variant,
+      className: chunkADIDI7AJ_js.cn(tabsListVariants({ variant }), className),
+      ...props
+    }
+  );
+}
+function TabsTrigger({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Trigger,
+    {
+      "data-slot": "tabs-trigger",
+      className: chunkADIDI7AJ_js.cn(
+        "relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 text-sm font-medium whitespace-nowrap text-foreground/60 transition-all group-data-[orientation=vertical]/tabs:w-full group-data-[orientation=vertical]/tabs:justify-start hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 group-data-[variant=default]/tabs-list:data-[state=active]:shadow-sm group-data-[variant=line]/tabs-list:data-[state=active]:shadow-none dark:text-muted-foreground dark:hover:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:border-transparent dark:group-data-[variant=line]/tabs-list:data-[state=active]:bg-transparent",
+        "data-[state=active]:bg-background data-[state=active]:text-foreground dark:data-[state=active]:border-input dark:data-[state=active]:bg-input/30 dark:data-[state=active]:text-foreground",
+        "after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-[orientation=horizontal]/tabs:after:inset-x-0 group-data-[orientation=horizontal]/tabs:after:bottom-[-5px] group-data-[orientation=horizontal]/tabs:after:h-0.5 group-data-[orientation=vertical]/tabs:after:inset-y-0 group-data-[orientation=vertical]/tabs:after:-right-1 group-data-[orientation=vertical]/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-[state=active]:after:opacity-100",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function TabsContent({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    TabsPrimitive__namespace.Content,
+    {
+      "data-slot": "tabs-content",
+      className: chunkADIDI7AJ_js.cn("flex-1 outline-none", className),
+      ...props
+    }
+  );
+}
+
+exports.Tabs = Tabs;
+exports.TabsContent = TabsContent;
+exports.TabsList = TabsList;
+exports.TabsTrigger = TabsTrigger;
+exports.tabsListVariants = tabsListVariants;

package/dist/chunk-ZFLZA7UP.mjs

@@ -1,3 +1,4 @@
+"use client";
 import { cx } from './chunk-T5R6HUDG.mjs';
 import { Button } from './chunk-VBD4Q5LL.mjs';
 import { Input } from './chunk-STEP6C4C.mjs';

package/dist/chunk-ZKUIUE7W.mjs

@@ -1,3 +1,4 @@
+"use client";
 import { cn } from './chunk-IMKLN273.mjs';
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
 import { jsx } from 'react/jsx-runtime';

package/dist/chunk-ZWWJ3RRA.js

@@ -0,0 +1,15 @@
+'use strict';
+
+// src/blocks/table/addons/data-table-styles.ts
+var dataTableTopperButtonProps = {
+  variant: "ghost-icon",
+  size: "icon-sm"
+};
+var dataTableTopperResponsiveClasses = "w-8 @min-[450px]:w-auto @min-[450px]:px-2";
+var dataTableTopperOpenStateClasses = "data-[state=open]:text-foreground";
+var dataTableTopperIconClasses = "text-icon hover:text-icon-hover [&_svg]:transition-transform [&_svg]:duration-200 hover:[&_svg]:scale-110";
+
+exports.dataTableTopperButtonProps = dataTableTopperButtonProps;
+exports.dataTableTopperIconClasses = dataTableTopperIconClasses;
+exports.dataTableTopperOpenStateClasses = dataTableTopperOpenStateClasses;
+exports.dataTableTopperResponsiveClasses = dataTableTopperResponsiveClasses;

package/dist/data-grid.d.cts

@@ -0,0 +1,241 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React$1 from 'react';
+import { RowData, Cell, TableMeta, TableOptions, ColumnDef, Column } from '@tanstack/react-table';
+import * as _tanstack_virtual_core from '@tanstack/virtual-core';
+import * as _tanstack_table_core from '@tanstack/table-core';
+
+type Direction = "ltr" | "rtl";
+type RowHeightValue = "short" | "medium" | "tall" | "extra-tall";
+interface CellSelectOption {
+    label: string;
+    value: string;
+    icon?: React.ComponentType<React.ComponentProps<"svg">>;
+    count?: number;
+}
+type CellOpts = {
+    variant: "short-text";
+} | {
+    variant: "long-text";
+} | {
+    variant: "number";
+    min?: number;
+    max?: number;
+    step?: number;
+} | {
+    variant: "select";
+    options: CellSelectOption[];
+} | {
+    variant: "multi-select";
+    options: CellSelectOption[];
+} | {
+    variant: "checkbox";
+} | {
+    variant: "date";
+} | {
+    variant: "url";
+} | {
+    variant: "file";
+    maxFileSize?: number;
+    maxFiles?: number;
+    accept?: string;
+    multiple?: boolean;
+};
+interface CellUpdate {
+    rowIndex: number;
+    columnId: string;
+    value: unknown;
+}
+declare module "@tanstack/react-table" {
+    interface ColumnMeta<TData extends RowData, TValue> {
+        label?: string;
+        cell?: CellOpts;
+    }
+    interface TableMeta<TData extends RowData> {
+        dataGridRef?: React.RefObject<HTMLElement | null>;
+        cellMapRef?: React.RefObject<Map<string, HTMLDivElement>>;
+        focusedCell?: CellPosition | null;
+        editingCell?: CellPosition | null;
+        selectionState?: SelectionState;
+        searchOpen?: boolean;
+        getIsCellSelected?: (rowIndex: number, columnId: string) => boolean;
+        getIsSearchMatch?: (rowIndex: number, columnId: string) => boolean;
+        getIsActiveSearchMatch?: (rowIndex: number, columnId: string) => boolean;
+        getVisualRowIndex?: (rowId: string) => number | undefined;
+        scrollToCell?: (rowIndex: number, columnId: string, align?: "auto" | "start" | "center" | "end") => void;
+        rowHeight?: RowHeightValue;
+        onRowHeightChange?: (value: RowHeightValue) => void;
+        onRowSelect?: (rowId: string, checked: boolean, shiftKey: boolean) => void;
+        onDataUpdate?: (params: CellUpdate | Array<CellUpdate>) => void;
+        onRowsDelete?: (rowIndices: number[]) => void | Promise<void>;
+        onColumnClick?: (columnId: string) => void;
+        onCellClick?: (rowIndex: number, columnId: string, event?: React.MouseEvent) => void;
+        onCellDoubleClick?: (rowIndex: number, columnId: string) => void;
+        onCellMouseDown?: (rowIndex: number, columnId: string, event: React.MouseEvent) => void;
+        onCellMouseEnter?: (rowIndex: number, columnId: string) => void;
+        onCellMouseUp?: () => void;
+        onCellContextMenu?: (rowIndex: number, columnId: string, event: React.MouseEvent) => void;
+        onCellEditingStart?: (rowIndex: number, columnId: string) => void;
+        onCellEditingStop?: (opts?: {
+            direction?: NavigationDirection;
+            moveToNextRow?: boolean;
+        }) => void;
+        onCellsCopy?: () => void;
+        onCellsCut?: () => void;
+        onCellsPaste?: (expand?: boolean) => void;
+        onSelectionClear?: () => void;
+        onFilesUpload?: (params: {
+            files: File[];
+            rowIndex: number;
+            columnId: string;
+        }) => Promise<FileCellData[]>;
+        onFilesDelete?: (params: {
+            fileIds: string[];
+            rowIndex: number;
+            columnId: string;
+        }) => void | Promise<void>;
+        contextMenu?: ContextMenuState;
+        onContextMenuOpenChange?: (open: boolean) => void;
+        pasteDialog?: PasteDialogState;
+        onPasteDialogOpenChange?: (open: boolean) => void;
+        readOnly?: boolean;
+    }
+}
+interface CellPosition {
+    rowIndex: number;
+    columnId: string;
+}
+interface CellRange {
+    start: CellPosition;
+    end: CellPosition;
+}
+interface SelectionState {
+    selectedCells: Set<string>;
+    selectionRange: CellRange | null;
+    isSelecting: boolean;
+}
+interface ContextMenuState {
+    open: boolean;
+    x: number;
+    y: number;
+}
+interface PasteDialogState {
+    open: boolean;
+    rowsNeeded: number;
+    clipboardText: string;
+}
+type NavigationDirection = "up" | "down" | "left" | "right" | "home" | "end" | "ctrl+up" | "ctrl+down" | "ctrl+home" | "ctrl+end" | "pageup" | "pagedown" | "pageleft" | "pageright";
+interface SearchState {
+    searchMatches: CellPosition[];
+    matchIndex: number;
+    searchOpen: boolean;
+    onSearchOpenChange: (open: boolean) => void;
+    searchQuery: string;
+    onSearchQueryChange: (query: string) => void;
+    onSearch: (query: string) => void;
+    onNavigateToNextMatch: () => void;
+    onNavigateToPrevMatch: () => void;
+}
+interface DataGridCellProps<TData> {
+    cell: Cell<TData, unknown>;
+    tableMeta: TableMeta<TData>;
+    rowIndex: number;
+    columnId: string;
+    rowHeight: RowHeightValue;
+    isEditing: boolean;
+    isFocused: boolean;
+    isSelected: boolean;
+    isSearchMatch: boolean;
+    isActiveSearchMatch: boolean;
+    readOnly: boolean;
+}
+interface FileCellData {
+    id: string;
+    name: string;
+    size: number;
+    type: string;
+    url?: string;
+}
+type TextFilterOperator = "contains" | "notContains" | "equals" | "notEquals" | "startsWith" | "endsWith" | "isEmpty" | "isNotEmpty";
+type NumberFilterOperator = "equals" | "notEquals" | "lessThan" | "lessThanOrEqual" | "greaterThan" | "greaterThanOrEqual" | "isBetween" | "isEmpty" | "isNotEmpty";
+type DateFilterOperator = "equals" | "notEquals" | "before" | "after" | "onOrBefore" | "onOrAfter" | "isBetween" | "isEmpty" | "isNotEmpty";
+type SelectFilterOperator = "is" | "isNot" | "isAnyOf" | "isNoneOf" | "isEmpty" | "isNotEmpty";
+type BooleanFilterOperator = "isTrue" | "isFalse";
+type FilterOperator = TextFilterOperator | NumberFilterOperator | DateFilterOperator | SelectFilterOperator | BooleanFilterOperator;
+interface FilterValue {
+    operator: FilterOperator;
+    value?: string | number | string[];
+    endValue?: string | number;
+}
+
+interface UseDataGridProps<TData> extends Omit<TableOptions<TData>, "pageCount" | "getCoreRowModel"> {
+    onDataChange?: (data: TData[]) => void;
+    onRowAdd?: (event?: React$1.MouseEvent<HTMLDivElement>) => Partial<CellPosition> | Promise<Partial<CellPosition> | null> | null;
+    onRowsAdd?: (count: number) => void | Promise<void>;
+    onRowsDelete?: (rows: TData[], rowIndices: number[]) => void | Promise<void>;
+    onPaste?: (updates: Array<CellUpdate>) => void | Promise<void>;
+    onFilesUpload?: (params: {
+        files: File[];
+        rowIndex: number;
+        columnId: string;
+    }) => Promise<FileCellData[]>;
+    onFilesDelete?: (params: {
+        fileIds: string[];
+        rowIndex: number;
+        columnId: string;
+    }) => void | Promise<void>;
+    rowHeight?: RowHeightValue;
+    onRowHeightChange?: (rowHeight: RowHeightValue) => void;
+    overscan?: number;
+    dir?: Direction;
+    autoFocus?: boolean | Partial<CellPosition>;
+    enableSingleCellSelection?: boolean;
+    enableColumnSelection?: boolean;
+    enableSearch?: boolean;
+    enablePaste?: boolean;
+    readOnly?: boolean;
+}
+declare function useDataGrid<TData>({ data, columns, rowHeight: rowHeightProp, overscan, dir: dirProp, initialState, ...props }: UseDataGridProps<TData>): {
+    dataGridRef: React$1.RefObject<HTMLDivElement | null>;
+    headerRef: React$1.RefObject<HTMLDivElement | null>;
+    rowMapRef: React$1.RefObject<Map<number, HTMLDivElement>>;
+    footerRef: React$1.RefObject<HTMLDivElement | null>;
+    dir: "ltr" | "rtl";
+    table: _tanstack_table_core.Table<TData>;
+    tableMeta: TableMeta<TData>;
+    virtualTotalSize: number;
+    virtualItems: _tanstack_virtual_core.VirtualItem[];
+    measureElement: (node: Element | null) => void;
+    columns: ColumnDef<TData, any>[];
+    columnSizeVars: {
+        [key: string]: number;
+    };
+    searchState: SearchState | undefined;
+    searchMatchesByRow: Map<number, Set<string>> | null;
+    activeSearchMatch: CellPosition | null;
+    cellSelectionMap: Map<number, Set<string>> | null;
+    focusedCell: CellPosition | null;
+    editingCell: CellPosition | null;
+    rowHeight: RowHeightValue;
+    contextMenu: ContextMenuState;
+    pasteDialog: PasteDialogState;
+    onRowAdd: ((event?: React$1.MouseEvent<HTMLDivElement>) => Promise<void>) | undefined;
+    adjustLayout: boolean;
+};
+
+interface DataGridProps<TData> extends Omit<ReturnType<typeof useDataGrid<TData>>, "dir">, Omit<React$1.ComponentProps<"div">, "contextMenu"> {
+    dir?: Direction;
+    height?: number;
+    stretchColumns?: boolean;
+}
+declare function DataGrid<TData>({ dataGridRef, headerRef, rowMapRef, footerRef, dir, table, tableMeta, virtualTotalSize, virtualItems, measureElement, columns, columnSizeVars, searchState, searchMatchesByRow, activeSearchMatch, cellSelectionMap, focusedCell, editingCell, rowHeight, contextMenu, pasteDialog, onRowAdd: onRowAddProp, height, stretchColumns, adjustLayout, className, ...props }: DataGridProps<TData>): react_jsx_runtime.JSX.Element;
+
+declare function getCellKey(rowIndex: number, columnId: string): string;
+declare function parseCellKey(cellKey: string): Required<CellPosition>;
+declare function getRowHeightValue(rowHeight: RowHeightValue): number;
+declare function getColumnPinningStyle<TData>(params: {
+    column: Column<TData>;
+    withBorder?: boolean;
+    dir?: Direction;
+}): React$1.CSSProperties;
+
+export { type BooleanFilterOperator, type CellOpts, type CellPosition, type CellRange, type CellSelectOption, type CellUpdate, type ContextMenuState, DataGrid, type DataGridCellProps, type DateFilterOperator, type Direction, type FileCellData, type FilterOperator, type FilterValue, type NavigationDirection, type NumberFilterOperator, type PasteDialogState, type RowHeightValue, type SearchState, type SelectFilterOperator, type SelectionState, type TextFilterOperator, type UseDataGridProps, getCellKey, getColumnPinningStyle as getGridColumnPinningStyle, getRowHeightValue, parseCellKey, useDataGrid };