@stackframe/stack-ui 2.6.15 → 2.6.17

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @stackframe/stack-ui
 
+## 2.6.17
+
+### Patch Changes
+
+- Loading skeletons
+- Updated dependencies
+  - @stackframe/stack-shared@2.6.17
+
+## 2.6.16
+
+### Patch Changes
+
+- - list user pagination
+  - fixed visual glitches
+- Updated dependencies
+  - @stackframe/stack-shared@2.6.16
+
 ## 2.6.15
 
 ### Patch Changes

package/dist/components/action-dialog.d.ts

@@ -22,5 +22,6 @@ export type ActionDialogProps = {
     }>;
     confirmText?: string;
     children?: React.ReactNode;
+    preventClose?: boolean;
 };
 export declare function ActionDialog(props: ActionDialogProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/action-dialog.js

@@ -25,7 +25,7 @@ export function ActionDialog(props) {
         setOpenState(open);
         props.onOpenChange?.(open);
     };
-    return (_jsxs(Dialog, { open: open, onOpenChange: onOpenChange, children: [props.trigger && _jsx(DialogTrigger, { asChild: true, children: props.trigger }), _jsxs(DialogContent, { children: [_jsxs(DialogHeader, { children: [_jsxs(DialogTitle, { className: "flex items-center", children: [_jsx(TitleIcon, { className: "h-4 w-4 mr-2" }), title] }), _jsx(DialogDescription, { children: props.description })] }), _jsxs(DialogBody, { className: "pb-2", children: [_jsx("div", { children: props.children }), props.confirmText && _jsx(Alert, { children: _jsxs(Label, { className: "flex gap-4 items-center", children: [_jsx(Checkbox, { id: confirmId, checked: confirmed, onCheckedChange: (v) => setConfirmed(!!v) }), props.confirmText] }) })] }), anyButton && _jsxs(DialogFooter, { className: "gap-2", children: [cancelButton && (_jsx(Button, { variant: "secondary", color: "neutral", onClick: async () => {
+    return (_jsxs(Dialog, { open: open, onOpenChange: onOpenChange, children: [props.trigger && _jsx(DialogTrigger, { asChild: true, children: props.trigger }), _jsxs(DialogContent, { onInteractOutside: props.preventClose ? (e) => e.preventDefault() : undefined, className: props.preventClose ? "[&>button]:hidden" : "", children: [_jsxs(DialogHeader, { children: [_jsxs(DialogTitle, { className: "flex items-center", children: [_jsx(TitleIcon, { className: "h-4 w-4 mr-2" }), title] }), _jsx(DialogDescription, { children: props.description })] }), _jsxs(DialogBody, { className: "pb-2", children: [_jsx("div", { children: props.children }), props.confirmText && _jsx(Alert, { children: _jsxs(Label, { className: "flex gap-4 items-center", children: [_jsx(Checkbox, { id: confirmId, checked: confirmed, onCheckedChange: (v) => setConfirmed(!!v) }), props.confirmText] }) })] }), anyButton && _jsxs(DialogFooter, { className: "gap-2", children: [cancelButton && (_jsx(Button, { variant: "secondary", color: "neutral", onClick: async () => {
                                     if (await cancelButton.onClick?.() !== "prevent-close") {
                                         onOpenChange(false);
                                     }

package/dist/components/data-table/cells.js

@@ -32,7 +32,7 @@ export function DateCell(props) {
     return (_jsx(TextCell, { size: 140, children: ignore ? 'Never' : timeString }));
 }
 export function ActionCell(props) {
-    return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", className: cn("flex h-8 w-8 p-0 data-[state=open]:bg-muted", props.invisible && "invisible"), children: [_jsx(DotsHorizontalIcon, { className: "h-4 w-4" }), _jsx("span", { className: "sr-only", children: "Open menu" })] }) }), _jsx(DropdownMenuContent, { align: "end", className: "min-w-[150px] max-w-[300px]", children: props.items?.map((item, index) => {
+    return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", className: cn("flex h-8 w-8 p-0 data-[state=open]:bg-muted", props.invisible && "invisible"), children: [_jsx(DotsHorizontalIcon, { className: "h-4 w-4" }), _jsx("span", { className: "sr-only", children: "Open menu" })] }) }), _jsx(DropdownMenuContent, { align: "end", className: "min-w-[150px] max-w-[300px] stack-scope", children: props.items?.map((item, index) => {
                     if (item === '-') {
                         return _jsx(DropdownMenuSeparator, {}, index);
                     }

package/dist/components/data-table/column-header.js

@@ -6,5 +6,5 @@ function Item(props) {
     return (_jsx(DropdownMenuItem, { onClick: props.onClick, children: _jsxs("div", { className: "flex items-center", children: [_jsx(props.icon, { className: "mr-2 h-3.5 w-3.5 text-muted-foreground/70" }), props.children] }) }));
 }
 export function DataTableColumnHeader({ column, columnTitle, className, }) {
-    return (_jsx("div", { className: cn("flex items-center space-x-2", className), children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "sm", className: "-ml-3 h-8 data-[state=open]:bg-accent", children: [_jsx("span", { children: columnTitle }), column.getIsSorted() === "desc" ? (_jsx(ArrowDown, { className: "ml-2 h-4 w-4" })) : column.getIsSorted() === "asc" ? (_jsx(ArrowUp, { className: "ml-2 h-4 w-4" })) : null] }) }), _jsxs(DropdownMenuContent, { align: "start", children: [column.getCanSort() && (_jsxs(_Fragment, { children: [_jsx(Item, { icon: ArrowUp, onClick: () => column.toggleSorting(false), children: "Asc" }), _jsx(Item, { icon: ArrowDown, onClick: () => column.toggleSorting(true), children: "Desc" })] })), _jsx(Item, { icon: EyeOff, onClick: () => column.toggleVisibility(false), children: "Hide" })] })] }) }));
+    return (_jsx("div", { className: cn("flex items-center space-x-2", className), children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "sm", className: "-ml-3 h-8 data-[state=open]:bg-accent", children: [_jsx("span", { children: columnTitle }), column.getIsSorted() === "desc" ? (_jsx(ArrowDown, { className: "ml-2 h-4 w-4" })) : column.getIsSorted() === "asc" ? (_jsx(ArrowUp, { className: "ml-2 h-4 w-4" })) : null] }) }), _jsxs(DropdownMenuContent, { align: "start", className: "stack-scope", children: [column.getCanSort() && (_jsxs(_Fragment, { children: [_jsx(Item, { icon: ArrowUp, onClick: () => column.toggleSorting(false), children: "Asc" }), _jsx(Item, { icon: ArrowDown, onClick: () => column.toggleSorting(true), children: "Desc" })] })), _jsx(Item, { icon: EyeOff, onClick: () => column.toggleVisibility(false), children: "Hide" })] })] }) }));
 }

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

@@ -1,10 +1,29 @@
-import { ColumnDef, Table as TableType, VisibilityState } from "@tanstack/react-table";
+import { ColumnDef, ColumnFiltersState, OnChangeFn, PaginationState, SortingState, Table as TableType, VisibilityState } from "@tanstack/react-table";
 import React from "react";
-interface DataTableProps<TData, TValue> {
+export declare function TableView<TData, TValue>(props: {
+    table: TableType<TData>;
+    columns: ColumnDef<TData, TValue>[];
+    toolbarRender?: (table: TableType<TData>) => React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+type DataTableProps<TData, TValue> = {
     columns: ColumnDef<TData, TValue>[];
     data: TData[];
     toolbarRender?: (table: TableType<TData>) => React.ReactNode;
     defaultVisibility?: VisibilityState;
-}
+};
 export declare function DataTable<TData, TValue>({ columns, data, toolbarRender, defaultVisibility, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
+type DataTableServerProps<TData, TValue> = DataTableProps<TData, TValue> & {
+    sorting?: SortingState;
+    setSorting?: OnChangeFn<SortingState>;
+    pagination?: PaginationState;
+    setPagination?: OnChangeFn<PaginationState>;
+    rowCount?: number;
+    columnFilters?: ColumnFiltersState;
+    setColumnFilters?: OnChangeFn<ColumnFiltersState>;
+    manualPagination?: boolean;
+    manualFiltering?: boolean;
+    globalFilter?: any;
+    setGlobalFilter?: OnChangeFn<any>;
+};
+export declare function DataTableManual<TData, TValue>({ columns, data, toolbarRender, defaultVisibility, sorting, setSorting, pagination, setPagination, rowCount, columnFilters, setColumnFilters, globalFilter, setGlobalFilter, manualPagination, manualFiltering, }: DataTableServerProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/data-table/data-table.js

@@ -5,11 +5,26 @@ import { GlobalFiltering, flexRender, getCoreRowModel, getFacetedRowModel, getFa
 import React from "react";
 import { DataTablePagination } from "./pagination";
 import { DataTableToolbar } from "./toolbar";
+export function TableView(props) {
+    return (_jsxs("div", { className: "space-y-4", children: [_jsx(DataTableToolbar, { table: props.table, toolbarRender: props.toolbarRender }), _jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: props.table.getHeaderGroups().map((headerGroup) => (_jsx(TableRow, { children: headerGroup.headers.map((header) => {
+                                    return (_jsx(TableHead, { colSpan: header.colSpan, children: header.isPlaceholder
+                                            ? null
+                                            : flexRender(header.column.columnDef.header, header.getContext()) }, header.id));
+                                }) }, headerGroup.id))) }), _jsx(TableBody, { children: props.table.getRowModel().rows.length ? (props.table.getRowModel().rows.map((row) => (_jsx(TableRow, { "data-state": row.getIsSelected() && "selected", children: row.getVisibleCells().map((cell) => (_jsx(TableCell, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))) }, row.id)))) : (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: props.columns.length, className: "h-24 text-center", children: "No results." }) })) })] }) }), _jsx(DataTablePagination, { table: props.table })] }));
+}
 export function DataTable({ columns, data, toolbarRender, defaultVisibility, }) {
+    const [sorting, setSorting] = React.useState([]);
+    const [columnFilters, setColumnFilters] = React.useState([]);
+    const [pagination, setPagination] = React.useState({
+        pageIndex: 0,
+        pageSize: 10,
+    });
+    const [globalFilter, setGlobalFilter] = React.useState();
+    return _jsx(DataTableManual, { columns: columns, data: data, toolbarRender: toolbarRender, defaultVisibility: defaultVisibility, sorting: sorting, setSorting: setSorting, columnFilters: columnFilters, setColumnFilters: setColumnFilters, manualPagination: false, manualFiltering: false, pagination: pagination, setPagination: setPagination, globalFilter: globalFilter, setGlobalFilter: setGlobalFilter });
+}
+export function DataTableManual({ columns, data, toolbarRender, defaultVisibility, sorting, setSorting, pagination, setPagination, rowCount, columnFilters, setColumnFilters, globalFilter, setGlobalFilter, manualPagination = true, manualFiltering = true, }) {
     const [rowSelection, setRowSelection] = React.useState({});
     const [columnVisibility, setColumnVisibility] = React.useState(defaultVisibility || {});
-    const [columnFilters, setColumnFilters] = React.useState([]);
-    const [sorting, setSorting] = React.useState([]);
     const table = useReactTable({
         data,
         columns,
@@ -18,12 +33,16 @@ export function DataTable({ columns, data, toolbarRender, defaultVisibility, })
             columnVisibility,
             rowSelection,
             columnFilters,
+            pagination,
+            globalFilter: globalFilter,
         },
         enableRowSelection: true,
+        onGlobalFilterChange: setGlobalFilter,
         onRowSelectionChange: setRowSelection,
         onSortingChange: setSorting,
         onColumnFiltersChange: setColumnFilters,
         onColumnVisibilityChange: setColumnVisibility,
+        onPaginationChange: setPagination,
         getColumnCanGlobalFilter: (c) => c.columnDef.enableGlobalFilter ?? GlobalFiltering.getDefaultOptions(table).getColumnCanGlobalFilter(c),
         getCoreRowModel: getCoreRowModel(),
         getFilteredRowModel: getFilteredRowModel(),
@@ -32,10 +51,9 @@ export function DataTable({ columns, data, toolbarRender, defaultVisibility, })
         getFacetedRowModel: getFacetedRowModel(),
         getFacetedUniqueValues: getFacetedUniqueValues(),
         autoResetAll: false,
+        manualPagination,
+        manualFiltering,
+        rowCount,
     });
-    return (_jsxs("div", { className: "space-y-4", children: [_jsx(DataTableToolbar, { table: table, toolbarRender: toolbarRender }), _jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => (_jsx(TableRow, { children: headerGroup.headers.map((header) => {
-                                    return (_jsx(TableHead, { colSpan: header.colSpan, children: header.isPlaceholder
-                                            ? null
-                                            : flexRender(header.column.columnDef.header, header.getContext()) }, header.id));
-                                }) }, headerGroup.id))) }), _jsx(TableBody, { children: table.getRowModel().rows.length ? (table.getRowModel().rows.map((row) => (_jsx(TableRow, { "data-state": row.getIsSelected() && "selected", children: row.getVisibleCells().map((cell) => (_jsx(TableCell, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))) }, row.id)))) : (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: columns.length, className: "h-24 text-center", children: "No results." }) })) })] }) }), _jsx(DataTablePagination, { table: table })] }));
+    return _jsx(TableView, { table: table, columns: columns, toolbarRender: toolbarRender });
 }

package/dist/components/data-table/faceted-filter.js

@@ -21,6 +21,6 @@ export function DataTableFacetedFilter({ column, title, options, }) {
                                                 column?.setFilterValue(filterValues.length ? filterValues : undefined);
                                             }, children: [_jsx("div", { className: cn("mr-2 flex h-4 w-4 items-center justify-center rounded-sm border border-primary", isSelected
                                                         ? "bg-primary text-primary-foreground"
-                                                        : "opacity-50 [&_svg]:invisible"), children: _jsx(CheckIcon, { className: cn("h-4 w-4") }) }), option.icon && (_jsx(option.icon, { className: "mr-2 h-4 w-4 text-muted-foreground" })), _jsx("span", { children: option.label }), facets?.get(option.value) && (_jsx("span", { className: "ml-auto flex h-4 w-4 items-center justify-center font-mono text-xs", children: facets.get(option.value) }))] }, option.value));
+                                                        : "opacity-50 [&_svg]:invisible"), children: _jsx(CheckIcon, { className: cn("h-4 w-4") }) }), option.icon && (_jsx(option.icon, { className: "mr-2 h-4 w-4 text-muted-foreground" })), _jsx("span", { children: option.label })] }, option.value));
                                     }) }), selectedValues.size > 0 && (_jsxs(_Fragment, { children: [_jsx(CommandSeparator, {}), _jsx(CommandGroup, { children: _jsx(CommandItem, { onSelect: () => column?.setFilterValue(undefined), className: "justify-center text-center", children: "Clear filters" }) })] }))] })] }) })] }));
 }

package/dist/components/data-table/pagination.js

@@ -1,10 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ChevronLeftIcon, ChevronRightIcon, DoubleArrowLeftIcon, DoubleArrowRightIcon, } from "@radix-ui/react-icons";
+import { ChevronLeftIcon, ChevronRightIcon } from "@radix-ui/react-icons";
 import { Button, Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@stackframe/stack-ui";
 export function DataTablePagination({ table, }) {
-    return (_jsxs("div", { className: "flex items-center justify-between px-2 flex-col sm:flex-row gap-y-4 sm:gap-y-0", children: [_jsx("div", { className: "flex-1 text-sm text-muted-foreground", children: table.getFilteredSelectedRowModel().rows.length === 0 ?
-                    `${table.getFilteredRowModel().rows.length} row(s) found` :
-                    `${table.getFilteredSelectedRowModel().rows.length} of ${table.getFilteredRowModel().rows.length} row(s) selected` }), _jsxs("div", { className: "flex items-center gap-x-6 lg:gap-x-8 flex-col sm:flex-row gap-y-4 sm:gap-y-0", children: [_jsxs("div", { className: "flex items-center space-x-2", children: [_jsx("p", { className: "text-sm font-medium", children: "Rows per page" }), _jsxs(Select, { value: `${table.getState().pagination.pageSize}`, onValueChange: (value) => {
+    return (_jsxs("div", { className: "flex items-center justify-between px-2 flex-col sm:flex-row gap-y-4 sm:gap-y-0", children: [_jsx("div", { className: "flex-1 text-sm text-muted-foreground", children: table.getFilteredSelectedRowModel().rows.length !== 0 ?
+                    `${table.getFilteredSelectedRowModel().rows.length} of ${table.getFilteredRowModel().rows.length} row(s) selected` :
+                    undefined }), _jsxs("div", { className: "flex items-center gap-x-6 lg:gap-x-8 flex-col sm:flex-row gap-y-4 sm:gap-y-0", children: [_jsxs("div", { className: "flex items-center space-x-2", children: [_jsx("p", { className: "text-sm font-medium", children: "Rows per page" }), _jsxs(Select, { value: `${table.getState().pagination.pageSize}`, onValueChange: (value) => {
                                     table.setPageSize(Number(value));
-                                }, children: [_jsx(SelectTrigger, { className: "h-8 w-[70px]", children: _jsx(SelectValue, { placeholder: table.getState().pagination.pageSize }) }), _jsx(SelectContent, { side: "top", children: [10, 20, 30, 40, 50].map((pageSize) => (_jsx(SelectItem, { value: `${pageSize}`, children: pageSize }, pageSize))) })] })] }), _jsxs("div", { className: "flex items-center gap-4", children: [_jsxs("div", { className: "flex items-center justify-center text-sm font-medium", children: ["Page ", table.getState().pagination.pageIndex + 1, " of", " ", table.getPageCount()] }), _jsxs("div", { className: "flex items-center space-x-2", children: [_jsxs(Button, { variant: "outline", className: "hidden h-8 w-8 p-0 lg:flex", onClick: () => table.setPageIndex(0), disabled: !table.getCanPreviousPage(), children: [_jsx("span", { className: "sr-only", children: "Go to first page" }), _jsx(DoubleArrowLeftIcon, { className: "h-4 w-4" })] }), _jsxs(Button, { variant: "outline", className: "h-8 w-8 p-0", onClick: () => table.previousPage(), disabled: !table.getCanPreviousPage(), children: [_jsx("span", { className: "sr-only", children: "Go to previous page" }), _jsx(ChevronLeftIcon, { className: "h-4 w-4" })] }), _jsxs(Button, { variant: "outline", className: "h-8 w-8 p-0", onClick: () => table.nextPage(), disabled: !table.getCanNextPage(), children: [_jsx("span", { className: "sr-only", children: "Go to next page" }), _jsx(ChevronRightIcon, { className: "h-4 w-4" })] }), _jsxs(Button, { variant: "outline", className: "hidden h-8 w-8 p-0 lg:flex", onClick: () => table.setPageIndex(table.getPageCount() - 1), disabled: !table.getCanNextPage(), children: [_jsx("span", { className: "sr-only", children: "Go to last page" }), _jsx(DoubleArrowRightIcon, { className: "h-4 w-4" })] })] })] })] })] }));
+                                }, children: [_jsx(SelectTrigger, { className: "h-8 w-[70px]", children: _jsx(SelectValue, { placeholder: table.getState().pagination.pageSize }) }), _jsx(SelectContent, { side: "top", children: [10, 20, 30, 40, 50].map((pageSize) => (_jsx(SelectItem, { value: `${pageSize}`, children: pageSize }, pageSize))) })] })] }), _jsxs("div", { className: "flex items-center gap-4", children: [_jsx("div", { className: "flex items-center justify-center text-sm font-medium", children: table.getState().pagination.pageIndex + 1 }), _jsxs("div", { className: "flex items-center space-x-2", children: [_jsxs(Button, { variant: "outline", className: "h-8 w-8 p-0", onClick: () => table.previousPage(), disabled: !table.getCanPreviousPage(), children: [_jsx("span", { className: "sr-only", children: "Go to previous page" }), _jsx(ChevronLeftIcon, { className: "h-4 w-4" })] }), _jsxs(Button, { variant: "outline", className: "h-8 w-8 p-0", onClick: () => table.nextPage(), disabled: !table.getCanNextPage(), children: [_jsx("span", { className: "sr-only", children: "Go to next page" }), _jsx(ChevronRightIcon, { className: "h-4 w-4" })] })] })] })] })] }));
 }

package/dist/components/ui/skeleton.d.ts

@@ -1,5 +1,3 @@
 import React from "react";
-declare const Skeleton: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
-    deactivated?: boolean | undefined;
-} & React.RefAttributes<HTMLSpanElement>>;
+declare function Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
 export { Skeleton };

package/dist/components/ui/skeleton.js

@@ -1,48 +1,7 @@
 "use client";
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import React from "react";
+import { jsx as _jsx } from "react/jsx-runtime";
 import { cn } from "../..";
-// TODO: add this to the generated global CSS
-const styleSheet = `
-@keyframes animation-light {
-0% {
-  filter: grayscale(1) contrast(0) brightness(0) invert(1) brightness(0.8);
+function Skeleton({ className, ...props }) {
+    return (_jsx("div", { className: cn("animate-pulse rounded-md bg-primary/10", className), ...props }));
 }
-100% {
-  filter: grayscale(1) contrast(0) brightness(0) invert(1) brightness(0.9);
-}
-
-@keyframes animation-dark {
-0% {
-  filter: grayscale(1) contrast(0) brightness(0) invert(1) brightness(0.2);
-}
-100% {
-  filter: grayscale(1) contrast(0) brightness(0) invert(1) brightness(0.1);
-}
-
-.stack-skeleton[data-stack-state="activated"],
-.stack-skeleton[data-stack-state="activated"] * {
-  pointer-events: none !important;
-  -webkit-user-select: none !important;
-  -moz-user-select: none !important;
-  user-select: none !important;
-  cursor: default !important;
-}
-
-.stack-skeleton[data-stack-state="activated"] {
-  animation: animation-light 1s infinite alternate-reverse !important;
-}
-
-html[data-stack-theme='dark'] .stack-skeleton[data-stack-state="activated"] {
-  animation: animation-dark 1s infinite alternate-reverse !important;
-}
-
-html[data-stack-theme='dark'] .stack-skeleton[data-stack-state="activated"] {
-  animation: animation-dark 1s infinite alternate-reverse !important;
-}
-`;
-const Skeleton = React.forwardRef((props, ref) => {
-    return (_jsxs(_Fragment, { children: [_jsx("style", { children: styleSheet }), _jsx("span", { ...props, ref: ref, "data-stack-state": props.deactivated ? "deactivated" : "activated", className: cn(props.className, "stack-skeleton") })] }));
-});
-Skeleton.displayName = "Skeleton";
 export { Skeleton };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stackframe/stack-ui",
-  "version": "2.6.15",
+  "version": "2.6.17",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "files": [
@@ -68,7 +68,7 @@
     "react-hook-form": "^7.51.4",
     "react-resizable-panels": "^2.0.19",
     "tailwind-merge": "^2.3.0",
-    "@stackframe/stack-shared": "2.6.15"
+    "@stackframe/stack-shared": "2.6.17"
   },
   "devDependencies": {
     "@types/react": "^18.2.66",