@rebasepro/ui 0.2.3 → 0.2.4

package/dist/components/Button.d.ts

@@ -9,6 +9,6 @@ export type ButtonProps<C extends React.ElementType = "button"> = {
     fullWidth?: boolean;
     className?: string;
     component?: C;
-    onClick?: React.MouseEventHandler<any>;
+    onClick?: React.MouseEventHandler<HTMLElement>;
 } & React.ComponentPropsWithoutRef<C>;
-export declare const Button: React.FC<ButtonProps<any>>;
+export declare const Button: React.FC<ButtonProps<React.ElementType>>;

package/dist/components/ErrorBoundary.d.ts

@@ -1,11 +1,33 @@
 import React, { ErrorInfo, PropsWithChildren } from "react";
-export declare class ErrorBoundary extends React.Component<PropsWithChildren<Record<string, unknown>>, {
+export interface ErrorBoundaryProps {
+    /**
+     * When true, renders a full-page centered error screen instead of the
+     * compact inline error. Intended for wrapping top-level app roots or
+     * major route sections.
+     */
+    fullPage?: boolean;
+    /**
+     * Optional callback invoked when the user clicks "Try again". If provided,
+     * the boundary resets its error state and calls this handler. If omitted,
+     * the "Try again" button resets the boundary state, re-mounting children.
+     */
+    onReset?: () => void;
+}
+interface ErrorBoundaryState {
     error: Error | null;
-}> {
-    constructor(props: any);
+    showDetails: boolean;
+}
+export declare class ErrorBoundary extends React.Component<PropsWithChildren<ErrorBoundaryProps>, ErrorBoundaryState> {
+    constructor(props: PropsWithChildren<ErrorBoundaryProps>);
     static getDerivedStateFromError(error: Error): {
         error: Error;
     };
     componentDidCatch(error: Error, _errorInfo: ErrorInfo): void;
+    private handleReset;
+    private handleReload;
+    private toggleDetails;
     render(): string | number | bigint | boolean | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | import("react/jsx-runtime").JSX.Element | null | undefined;
+    private renderInline;
+    private renderFullPage;
 }
+export {};

package/dist/components/VirtualTable/VirtualTable.d.ts

@@ -8,4 +8,4 @@ import { VirtualTableProps } from "./VirtualTableProps";
  *
  * @group Components
  */
-export declare const VirtualTable: React.NamedExoticComponent<VirtualTableProps<any>>;
+export declare const VirtualTable: React.NamedExoticComponent<VirtualTableProps<Record<string, unknown>>>;

package/dist/components/VirtualTable/VirtualTableCell.d.ts

@@ -4,18 +4,18 @@ type VirtualTableCellProps<T> = {
     dataKey: string;
     column: VirtualTableColumn;
     columns: VirtualTableColumn[];
-    rowData: any;
-    cellData: any;
-    rowIndex: any;
+    rowData: T;
+    cellData: unknown;
+    rowIndex: number;
     columnIndex: number;
     cellRenderer: (props: CellRendererParams<T>) => React.ReactNode;
     sortableNodeRef?: (node: HTMLElement | null) => void;
     sortableStyle?: React.CSSProperties;
-    sortableAttributes?: Record<string, any>;
+    sortableAttributes?: Record<string, unknown>;
     isDragging?: boolean;
     isDraggable?: boolean;
     frozen?: boolean;
-    extraData?: any;
+    extraData?: unknown;
 };
-export declare const VirtualTableCell: React.NamedExoticComponent<VirtualTableCellProps<any>>;
+export declare const VirtualTableCell: React.NamedExoticComponent<VirtualTableCellProps<unknown>>;
 export {};

package/dist/components/VirtualTable/VirtualTableHeader.d.ts

@@ -2,28 +2,28 @@ import React from "react";
 import { VirtualTableColumn, VirtualTableSort, VirtualTableWhereFilterOp } from "./VirtualTableProps";
 export type FilterFormFieldProps<CustomProps> = {
     id: React.Key;
-    filterValue: [VirtualTableWhereFilterOp, any] | undefined;
-    setFilterValue: (filterValue?: [VirtualTableWhereFilterOp, any]) => void;
+    filterValue: [VirtualTableWhereFilterOp, unknown] | undefined;
+    setFilterValue: (filterValue?: [VirtualTableWhereFilterOp, unknown]) => void;
     column: VirtualTableColumn<CustomProps>;
     hidden: boolean;
     setHidden: (hidden: boolean) => void;
 };
-type VirtualTableHeaderProps<M extends Record<string, any>> = {
+type VirtualTableHeaderProps<M extends Record<string, unknown>> = {
     resizeHandleRef: React.Ref<HTMLDivElement>;
     columnIndex: number;
     isResizingIndex: number;
-    column: VirtualTableColumn<any>;
+    column: VirtualTableColumn<unknown>;
     onColumnSort: (key: Extract<keyof M, string>) => void;
-    filter?: [VirtualTableWhereFilterOp, any];
+    filter?: [VirtualTableWhereFilterOp, unknown];
     sort: VirtualTableSort;
-    onFilterUpdate: (column: VirtualTableColumn, filterForProperty?: [VirtualTableWhereFilterOp, any]) => void;
+    onFilterUpdate: (column: VirtualTableColumn, filterForProperty?: [VirtualTableWhereFilterOp, unknown]) => void;
     onClickResizeColumn?: (columnIndex: number, column: VirtualTableColumn) => void;
-    createFilterField?: (props: FilterFormFieldProps<any>) => React.ReactNode;
+    createFilterField?: (props: FilterFormFieldProps<unknown>) => React.ReactNode;
     AdditionalHeaderWidget?: (props: {
         onHover: boolean;
     }) => React.ReactNode;
     isDragging?: boolean;
     isDraggable?: boolean;
 };
-export declare const VirtualTableHeader: React.FunctionComponent<VirtualTableHeaderProps<any>>;
+export declare const VirtualTableHeader: React.FunctionComponent<VirtualTableHeaderProps<Record<string, unknown>>>;
 export {};

package/dist/components/VirtualTable/VirtualTableHeaderRow.d.ts

@@ -1,2 +1,2 @@
 import { VirtualTableContextProps } from "./types";
-export declare const VirtualTableHeaderRow: ({ columns, currentSort, onColumnSort, onFilterUpdate, sortByProperty, filter, onColumnResize, onColumnResizeEnd, createFilterField, AddColumnComponent, onColumnsOrderChange, data, cellRenderer: CellRenderer, rowHeight, draggingColumnId, headerHeight }: VirtualTableContextProps<any>) => import("react/jsx-runtime").JSX.Element;
+export declare const VirtualTableHeaderRow: ({ columns, currentSort, onColumnSort, onFilterUpdate, sortByProperty, filter, onColumnResize, onColumnResizeEnd, createFilterField, AddColumnComponent, onColumnsOrderChange, data, cellRenderer: CellRenderer, rowHeight, draggingColumnId, headerHeight }: VirtualTableContextProps<Record<string, unknown>>) => import("react/jsx-runtime").JSX.Element;

package/dist/components/VirtualTable/VirtualTableProps.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { FilterFormFieldProps } from "./VirtualTableHeader";
-export type OnRowClickParams<T extends Record<string, any>> = {
+export type OnRowClickParams<T extends Record<string, unknown>> = {
     rowData: T;
     rowIndex: number;
     event: React.SyntheticEvent;
@@ -9,7 +9,7 @@ export type OnRowClickParams<T extends Record<string, any>> = {
  * @see Table
  * @group Components
  */
-export interface VirtualTableProps<T extends Record<string, any>> {
+export interface VirtualTableProps<T extends Record<string, unknown>> {
     /**
      * Array of arbitrary data
      */
@@ -61,12 +61,12 @@ export interface VirtualTableProps<T extends Record<string, any>> {
     /**
      * In case this table should have some filters set by default
      */
-    filter?: VirtualTableFilterValues<any>;
+    filter?: VirtualTableFilterValues<string>;
     /**
      * Callback used when filters are updated
      * @param filter
      */
-    onFilterUpdate?: (filter?: VirtualTableFilterValues<any> | undefined) => void;
+    onFilterUpdate?: (filter?: VirtualTableFilterValues<string> | undefined) => void;
     /**
      * Callback when the table is scrolled
      * @param props
@@ -111,7 +111,7 @@ export interface VirtualTableProps<T extends Record<string, any>> {
      * Callback to create a filter field, displayed in the header as a dropdown
      * @param props
      */
-    createFilterField?: (props: FilterFormFieldProps<any>) => React.ReactNode;
+    createFilterField?: (props: FilterFormFieldProps<unknown>) => React.ReactNode;
     /**
      * Class name applied to the table
      */
@@ -141,9 +141,9 @@ export interface VirtualTableProps<T extends Record<string, any>> {
     /**
      * Extra data passed to the cell renderer
      */
-    extraData?: any;
+    extraData?: unknown;
 }
-export type CellRendererParams<T = any> = {
+export type CellRendererParams<T = unknown> = {
     column: VirtualTableColumn;
     columns: VirtualTableColumn[];
     columnIndex: number;
@@ -153,17 +153,17 @@ export type CellRendererParams<T = any> = {
     isScrolling?: boolean;
     sortableNodeRef?: (node: HTMLElement | null) => void;
     sortableStyle?: React.CSSProperties;
-    sortableAttributes?: Record<string, any>;
+    sortableAttributes?: Record<string, unknown>;
     isDragging?: boolean;
     isDraggable?: boolean;
     frozen?: boolean;
-    extraData?: any;
+    extraData?: unknown;
 };
 /**
  * @see Table
  * @group Components
  */
-export interface VirtualTableColumn<CustomProps = any> {
+export interface VirtualTableColumn<CustomProps = unknown> {
     /**
      * Data key for the cell value, could be "a.b.c"
      */
@@ -233,7 +233,7 @@ export type VirtualTableSort = "asc" | "desc" | undefined;
  * @see Table
  * @group Components
  */
-export type VirtualTableFilterValues<Key extends string> = Partial<Record<Key, [VirtualTableWhereFilterOp, any]>>;
+export type VirtualTableFilterValues<Key extends string> = Partial<Record<Key, [VirtualTableWhereFilterOp, unknown]>>;
 /**
  * Filter conditions in a `Query.where()` clause are specified using the
  * strings `<`, `<=`, `==`, `>=`, `>`, `array-contains`, `in`, and `array-contains-any`.

package/dist/components/VirtualTable/VirtualTableRow.d.ts

@@ -1,3 +1,3 @@
 import React from "react";
 import { VirtualTableRowProps } from "./types";
-export declare const VirtualTableRow: React.NamedExoticComponent<VirtualTableRowProps<any>>;
+export declare const VirtualTableRow: React.NamedExoticComponent<VirtualTableRowProps<Record<string, unknown>>>;

package/dist/components/VirtualTable/types.d.ts

@@ -1,12 +1,12 @@
 import React from "react";
 import { CellRendererParams, OnRowClickParams, OnVirtualTableColumnResizeParams, VirtualTableColumn, VirtualTableFilterValues, VirtualTableWhereFilterOp } from "./VirtualTableProps";
 import { FilterFormFieldProps } from "./VirtualTableHeader";
-export type VirtualTableRowProps<T> = {
-    style: any;
+export type VirtualTableRowProps<T extends Record<string, unknown>> = {
+    style: React.CSSProperties;
     rowHeight: number;
     rowData: T;
     rowIndex: number;
-    onRowClick?: (props: OnRowClickParams<any>) => void;
+    onRowClick?: (props: OnRowClickParams<Record<string, unknown>>) => void;
     children: React.ReactNode[];
     columns: VirtualTableColumn[];
     hoverRow?: boolean;
@@ -19,20 +19,20 @@ export type VirtualTableContextProps<T> = {
     columns: VirtualTableColumn[];
     cellRenderer: React.ComponentType<CellRendererParams<T>>;
     currentSort: "asc" | "desc" | undefined;
-    filter?: VirtualTableFilterValues<any>;
-    onRowClick?: (props: OnRowClickParams<any>) => void;
-    onColumnSort: (key: string) => any;
+    filter?: VirtualTableFilterValues<string>;
+    onRowClick?: (props: OnRowClickParams<Record<string, unknown>>) => void;
+    onColumnSort: (key: string) => void;
     onColumnResize: (params: OnVirtualTableColumnResizeParams) => void;
     onColumnResizeEnd: (params: OnVirtualTableColumnResizeParams) => void;
-    onFilterUpdate: (column: VirtualTableColumn, filterForProperty?: [VirtualTableWhereFilterOp, any]) => void;
+    onFilterUpdate: (column: VirtualTableColumn, filterForProperty?: [VirtualTableWhereFilterOp, unknown]) => void;
     sortByProperty?: string;
     customView?: React.ReactNode;
     hoverRow: boolean;
-    createFilterField?: (props: FilterFormFieldProps<any>) => React.ReactNode;
+    createFilterField?: (props: FilterFormFieldProps<unknown>) => React.ReactNode;
     rowClassName?: (rowData: T) => string | undefined;
     endAdornment?: React.ReactNode;
     AddColumnComponent?: React.ComponentType;
     onColumnsOrderChange?: (columns: VirtualTableColumn[]) => void;
     draggingColumnId?: string | null;
-    extraData?: Record<string, any>;
+    extraData?: unknown;
 };

package/dist/hooks/useDebounceCallback.d.ts

@@ -1 +1 @@
-export declare function useDebounceCallback<T extends (...args: any[]) => any>(callback?: T, delay?: number): T;
+export declare function useDebounceCallback<T extends (...args: any[]) => unknown>(callback?: T, delay?: number): T;

package/dist/index.css

@@ -117,7 +117,7 @@
 }
 
 .typography-button {
-    @apply text-sm font-semibold;
+    @apply text-[13px] font-semibold;
 }
 
 :focus-visible {

package/dist/index.es.js

@@ -6,8 +6,8 @@ import { twMerge } from "tailwind-merge";
 import * as React from "react";
 import React__default, { createContext, useContext, useEffect, useRef, useState, Children, forwardRef, useLayoutEffect, useId, useDeferredValue, useMemo, createRef, useCallback } from "react";
 import * as Collapsible from "@radix-ui/react-collapsible";
-import { AlertCircleIcon, MinusIcon, CheckIcon, CalendarIcon, XIcon, ChevronDownIcon, ChevronRightIcon, SearchIcon, ChevronLeftIcon, ArrowUpIcon, FilterIcon } from "lucide-react";
-import { AlertCircleIcon as AlertCircleIcon2, AlertTriangleIcon, AlignLeftIcon, AppWindow, ArrowDownToLineIcon, ArrowLeftIcon, ArrowRightFromLineIcon, ArrowRightIcon, ArrowRightToLineIcon, ArrowUpToLineIcon, BoldIcon, BookOpenIcon, CalendarIcon as CalendarIcon2, CheckCircleIcon, CheckIcon as CheckIcon2, CheckSquareIcon, ChevronDownIcon as ChevronDownIcon2, ChevronLeftIcon as ChevronLeftIcon2, ChevronRightIcon as ChevronRightIcon2, ChevronUpIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpDownIcon, CircleIcon, CircleUserIcon, CodeIcon, ColumnsIcon, CopyIcon, DatabaseIcon, DownloadIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FileIcon, FileSearchIcon, FileTextIcon, FilterIcon as FilterIcon2, FilterXIcon, FlagIcon, FolderIcon, FolderPlusIcon, FolderUpIcon, FunctionSquareIcon, GitBranchIcon, GlobeIcon, HashIcon, Heading1Icon, Heading2Icon, Heading3Icon, HelpCircleIcon, HistoryIcon, HomeIcon, ImageIcon, ImageOffIcon, InfoIcon, ItalicIcon, KanbanIcon, KeyIcon, KeyRoundIcon, LanguagesIcon, LayoutGridIcon, LinkIcon, ListIcon, ListOrderedIcon, LoaderIcon, LogOutIcon, MailIcon, Maximize2Icon, MenuIcon, MinusCircleIcon, MinusIcon as MinusIcon2, MoonIcon, MoreVerticalIcon, Music2Icon, PanelLeftIcon, PauseIcon, PencilIcon, PhoneIcon, PlayIcon, PlusIcon, QuoteIcon, RefreshCcwIcon, RefreshCwIcon, RepeatIcon, Rows3Icon, SaveIcon, SearchIcon as SearchIcon2, SendIcon, SettingsIcon, ShieldIcon, ShoppingCartIcon, SlidersHorizontalIcon, SquareIcon, StarIcon, StrikethroughIcon, SunIcon, SunMoonIcon, TableIcon, TagIcon, TerminalIcon, TextIcon, Trash2Icon, TypeIcon, UnderlineIcon, UndoIcon, UploadCloudIcon, UploadIcon, UserCheckIcon, UserIcon, VideoIcon, VoteIcon, Wand2Icon, XCircleIcon, XIcon as XIcon2, icons } from "lucide-react";
+import { AlertCircleIcon, ShieldAlertIcon, ArrowLeftIcon, RefreshCwIcon, ChevronUpIcon, ChevronDownIcon, MinusIcon, CheckIcon, CalendarIcon, XIcon, ChevronRightIcon, SearchIcon, ChevronLeftIcon, ArrowUpIcon, FilterIcon } from "lucide-react";
+import { AlertCircleIcon as AlertCircleIcon2, AlertTriangleIcon, AlignLeftIcon, AppWindow, ArrowDownToLineIcon, ArrowLeftIcon as ArrowLeftIcon2, ArrowRightFromLineIcon, ArrowRightIcon, ArrowRightToLineIcon, ArrowUpToLineIcon, BoldIcon, BookOpenIcon, CalendarIcon as CalendarIcon2, CheckCircleIcon, CheckIcon as CheckIcon2, CheckSquareIcon, ChevronDownIcon as ChevronDownIcon2, ChevronLeftIcon as ChevronLeftIcon2, ChevronRightIcon as ChevronRightIcon2, ChevronUpIcon as ChevronUpIcon2, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpDownIcon, CircleIcon, CircleUserIcon, CodeIcon, ColumnsIcon, CopyIcon, DatabaseIcon, DownloadIcon, ExternalLinkIcon, EyeIcon, EyeOffIcon, FileIcon, FileSearchIcon, FileTextIcon, FilterIcon as FilterIcon2, FilterXIcon, FlagIcon, FolderIcon, FolderPlusIcon, FolderUpIcon, FunctionSquareIcon, GitBranchIcon, GlobeIcon, HashIcon, Heading1Icon, Heading2Icon, Heading3Icon, HelpCircleIcon, HistoryIcon, HomeIcon, ImageIcon, ImageOffIcon, InfoIcon, ItalicIcon, KanbanIcon, KeyIcon, KeyRoundIcon, LanguagesIcon, LayoutGridIcon, LinkIcon, ListIcon, ListOrderedIcon, LoaderIcon, LogOutIcon, MailIcon, Maximize2Icon, MenuIcon, MinusCircleIcon, MinusIcon as MinusIcon2, MoonIcon, MoreVerticalIcon, Music2Icon, PanelLeftIcon, PauseIcon, PencilIcon, PhoneIcon, PlayIcon, PlusIcon, QuoteIcon, RefreshCcwIcon, RefreshCwIcon as RefreshCwIcon2, RepeatIcon, Rows3Icon, SaveIcon, SearchIcon as SearchIcon2, SendIcon, SettingsIcon, ShieldIcon, ShoppingCartIcon, SlidersHorizontalIcon, SquareIcon, StarIcon, StrikethroughIcon, SunIcon, SunMoonIcon, TableIcon, TagIcon, TerminalIcon, TextIcon, Trash2Icon, TypeIcon, UnderlineIcon, UndoIcon, UploadCloudIcon, UploadIcon, UserCheckIcon, UserIcon, VideoIcon, VoteIcon, Wand2Icon, XCircleIcon, XIcon as XIcon2, icons } from "lucide-react";
 import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import * as DialogPrimitive from "@radix-ui/react-dialog";
@@ -985,15 +985,15 @@ const ButtonInner = React__default.memo(React__default.forwardRef((t0, ref) => {
         "border border-transparent bg-surface-300 dark:bg-surface-500 opacity-40 bg-surface-300/40 dark:bg-surface-500/40": t25
       });
       const sizeClasses2 = cls({
-        "py-1 px-2": size === "small",
-        "py-2 px-4": size === "medium",
-        "py-2.5 px-5": size === "large",
-        "py-3 px-6": size === "xl",
-        "py-4 px-10": size === "2xl"
+        "py-0.5 px-1.5": size === "small",
+        "py-1.5 px-3": size === "medium",
+        "py-2 px-4": size === "large",
+        "py-2.5 px-5": size === "xl",
+        "py-3 px-6": size === "2xl"
       });
       const iconColorClass = (color === "neutral" || color === "text") && !disabled ? "[&>svg]:text-surface-accent-500 dark:[&>svg]:text-surface-accent-300" : "";
       if (Component) {
-        t30 = /* @__PURE__ */ jsxs(Component, { ref, onClick: props.onClick, className: cls(startIcon ? "pl-3" : "", "typography-button h-fit rounded-md whitespace-nowrap inline-flex items-center justify-center p-2 px-4 focus:outline-none transition-all ease-in-out duration-150 gap-2 active:scale-[0.98]", buttonClasses2, sizeClasses2, iconColorClass, className), ...props, children: [
+        t30 = /* @__PURE__ */ jsxs(Component, { ref, onClick: props.onClick, className: cls(startIcon ? "pl-3" : "", "typography-button h-fit rounded-md whitespace-nowrap inline-flex items-center justify-center p-1.5 px-3 focus:outline-none transition-all ease-in-out duration-150 gap-1.5 active:scale-[0.98]", buttonClasses2, sizeClasses2, iconColorClass, className), ...props, children: [
           startIcon,
           children
         ] });
@@ -1002,7 +1002,7 @@ const ButtonInner = React__default.memo(React__default.forwardRef((t0, ref) => {
       t26 = ref;
       t27 = props.type ?? "button";
       t28 = props.onClick;
-      t29 = cls(startIcon ? "pl-3" : "", "typography-button h-fit rounded-md whitespace-nowrap inline-flex items-center justify-center p-2 px-4 focus:outline-none transition-all ease-in-out duration-150 gap-2 active:scale-[0.98]", buttonClasses2, sizeClasses2, iconColorClass, className);
+      t29 = cls(startIcon ? "pl-3" : "", "typography-button h-fit rounded-md whitespace-nowrap inline-flex items-center justify-center p-1.5 px-3 focus:outline-none transition-all ease-in-out duration-150 gap-1.5 active:scale-[0.98]", buttonClasses2, sizeClasses2, iconColorClass, className);
     }
     $[11] = Component;
     $[12] = children;
@@ -1548,11 +1548,18 @@ const colorClassesMapping = {
   disabled: "text-text-disabled dark:text-text-disabled-dark",
   error: "text-red-500"
 };
+function isPermissionError(error) {
+  if (!error) return false;
+  const msg = error.message?.toLowerCase() ?? "";
+  const code = error.code?.toLowerCase() ?? "";
+  return msg.includes("permission") || msg.includes("insufficient") || msg.includes("unauthorized") || msg.includes("forbidden") || msg.includes("access denied") || code === "permission_denied" || code === "insufficient_permissions" || error.status === 403;
+}
 class ErrorBoundary extends React__default.Component {
   constructor(props) {
     super(props);
     this.state = {
-      error: null
+      error: null,
+      showDetails: false
     };
   }
   static getDerivedStateFromError(error) {
@@ -1563,18 +1570,71 @@ class ErrorBoundary extends React__default.Component {
   componentDidCatch(error, _errorInfo) {
     console.error(error);
   }
+  handleReset = () => {
+    this.setState({
+      error: null,
+      showDetails: false
+    });
+    this.props.onReset?.();
+  };
+  handleReload = () => {
+    window.location.reload();
+  };
+  toggleDetails = () => {
+    this.setState((prev) => ({
+      showDetails: !prev.showDetails
+    }));
+  };
   render() {
     if (this.state.error) {
-      return /* @__PURE__ */ jsxs("div", { className: "flex flex-col m-2", children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center m-2", children: [
-          /* @__PURE__ */ jsx(AlertCircleIcon, { className: "text-red-500", size: iconSize.small }),
-          /* @__PURE__ */ jsx("div", { className: "ml-4", children: "Error" })
-        ] }),
-        /* @__PURE__ */ jsx(Typography, { variant: "caption", children: this.state.error?.message ?? "See the error in the console" })
-      ] });
+      if (this.props.fullPage) {
+        return this.renderFullPage();
+      }
+      return this.renderInline();
     }
     return this.props.children;
   }
+  renderInline() {
+    return /* @__PURE__ */ jsxs("div", { className: "flex flex-col m-2", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center m-2", children: [
+        /* @__PURE__ */ jsx(AlertCircleIcon, { className: "text-red-500", size: iconSize.small }),
+        /* @__PURE__ */ jsx("div", { className: "ml-4", children: "Error" })
+      ] }),
+      /* @__PURE__ */ jsx(Typography, { variant: "caption", children: this.state.error?.message ?? "See the error in the console" })
+    ] });
+  }
+  renderFullPage() {
+    const {
+      error,
+      showDetails
+    } = this.state;
+    const isPermission = isPermissionError(error);
+    const Icon = isPermission ? ShieldAlertIcon : AlertCircleIcon;
+    const title = isPermission ? "Access denied" : "Something went wrong";
+    const description = isPermission ? "You don't have permission to access this resource. Please check your account permissions or contact your administrator." : "An unexpected error occurred. You can try reloading the page or going back.";
+    return /* @__PURE__ */ jsx("div", { className: cls("flex items-center justify-center min-h-[400px] h-full w-full", "bg-surface-50 dark:bg-surface-950"), children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center max-w-md px-6 py-10 text-center", children: [
+      /* @__PURE__ */ jsx("div", { className: cls("flex items-center justify-center w-14 h-14 rounded-2xl mb-6", isPermission ? "bg-amber-100 dark:bg-amber-900/30" : "bg-red-100 dark:bg-red-900/30"), children: /* @__PURE__ */ jsx(Icon, { size: 28, className: isPermission ? "text-amber-600 dark:text-amber-400" : "text-red-500 dark:text-red-400" }) }),
+      /* @__PURE__ */ jsx(Typography, { variant: "h6", className: "text-text-primary dark:text-text-primary-dark mb-2", children: title }),
+      /* @__PURE__ */ jsx(Typography, { variant: "body2", className: "text-text-secondary dark:text-text-secondary-dark mb-8", children: description }),
+      /* @__PURE__ */ jsxs("div", { className: "flex gap-3", children: [
+        /* @__PURE__ */ jsxs(Button, { variant: "outlined", color: "neutral", size: "medium", onClick: this.handleReset, children: [
+          /* @__PURE__ */ jsx(ArrowLeftIcon, { size: 16 }),
+          "Try again"
+        ] }),
+        /* @__PURE__ */ jsxs(Button, { variant: "filled", color: "primary", size: "medium", onClick: this.handleReload, children: [
+          /* @__PURE__ */ jsx(RefreshCwIcon, { size: 16 }),
+          "Reload page"
+        ] })
+      ] }),
+      error?.message && /* @__PURE__ */ jsxs("div", { className: "mt-8 w-full", children: [
+        /* @__PURE__ */ jsxs("button", { onClick: this.toggleDetails, className: cls("flex items-center gap-1 mx-auto text-xs", "text-text-disabled dark:text-text-disabled-dark", "hover:text-text-secondary dark:hover:text-text-secondary-dark", "transition-colors cursor-pointer bg-transparent border-none p-0"), children: [
+          "Technical details",
+          showDetails ? /* @__PURE__ */ jsx(ChevronUpIcon, { size: 14 }) : /* @__PURE__ */ jsx(ChevronDownIcon, { size: 14 })
+        ] }),
+        showDetails && /* @__PURE__ */ jsx("div", { className: cls("mt-3 p-3 rounded-lg text-left text-xs", "bg-surface-100 dark:bg-surface-800", "text-text-secondary dark:text-text-secondary-dark", "font-mono break-all"), children: error.message })
+      ] })
+    ] }) });
+  }
 }
 const sizeClasses$2 = {
   large: "w-6 h-6 rounded flex items-center justify-center",
@@ -2087,10 +2147,10 @@ const buttonClasses = "hover:bg-surface-accent-200 hover:bg-opacity-75 hover:bg-
 const baseClasses = "inline-flex items-center justify-center p-2 text-sm font-medium focus:outline-none transition-colors ease-in-out duration-150";
 const colorClasses$1 = "text-surface-accent-500 visited:text-surface-accent-500 dark:text-surface-accent-300 dark:visited:text-surface-300";
 const sizeClasses$1 = {
-  medium: "w-10 !h-10 min-w-10 min-h-10",
-  small: "w-8 !h-8 min-w-8 min-h-8",
-  smallest: "w-6 !h-6 min-w-6 min-h-6",
-  large: "w-12 !h-12 min-w-12 min-h-12"
+  medium: "w-9 !h-9 min-w-9 min-h-9",
+  small: "w-7 !h-7 min-w-7 min-h-7",
+  smallest: "w-5 !h-5 min-w-5 min-h-5",
+  large: "w-10 !h-10 min-w-10 min-h-10"
 };
 const shapeClasses = {
   circular: "rounded-full",
@@ -4321,7 +4381,7 @@ const MultiSelect = React.forwardRef((t0, ref) => {
       if (selectedValues.some((v_0) => String(v_0) === String(newValue))) {
         newSelectedValues = selectedValues.filter((v) => String(v) !== String(newValue));
       } else {
-        newSelectedValues = [...selectedValues, newValue];
+        newSelectedValues = [...selectedValues, String(newValue)];
       }
       updateValues(newSelectedValues);
     };
@@ -5243,88 +5303,87 @@ function SearchBar(t0) {
     t10 = $[17];
   }
   const t11 = searchText ?? "";
-  const t12 = inputRef;
-  const t13 = !onTextSearch;
-  let t14;
+  const t12 = !onTextSearch;
+  let t13;
   if ($[18] !== onTextSearch) {
-    t14 = onTextSearch ? (event) => {
+    t13 = onTextSearch ? (event) => {
       setSearchText(event.target.value);
     } : void 0;
     $[18] = onTextSearch;
-    $[19] = t14;
+    $[19] = t13;
   } else {
-    t14 = $[19];
+    t13 = $[19];
   }
+  let t14;
   let t15;
-  let t16;
   if ($[20] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel")) {
-    t15 = () => setActive(true);
-    t16 = () => setActive(false);
-    $[20] = t15;
-    $[21] = t16;
+    t14 = () => setActive(true);
+    t15 = () => setActive(false);
+    $[20] = t14;
+    $[21] = t15;
   } else {
-    t15 = $[20];
-    t16 = $[21];
+    t14 = $[20];
+    t15 = $[21];
   }
-  const t17 = (disabled || loading) && "pointer-events-none";
-  const t18 = size === "small" ? "text-sm" : "";
-  const t19 = expandable ? active ? "w-[220px]" : "w-[180px]" : "";
-  let t20;
-  if ($[22] !== innerClassName || $[23] !== inputPaddingClass || $[24] !== t17 || $[25] !== t18 || $[26] !== t19) {
-    t20 = cls(t17, "placeholder-text-disabled dark:placeholder-text-disabled-dark", "relative flex items-center transition-all bg-transparent outline-none focus:outline-none focus:ring-0 appearance-none border-none focus:border-transparent", inputPaddingClass, "h-full w-full text-current", t18, t19, innerClassName);
+  const t16 = (disabled || loading) && "pointer-events-none";
+  const t17 = size === "small" ? "text-sm" : "";
+  const t18 = expandable ? active ? "w-[220px]" : "w-[180px]" : "";
+  let t19;
+  if ($[22] !== innerClassName || $[23] !== inputPaddingClass || $[24] !== t16 || $[25] !== t17 || $[26] !== t18) {
+    t19 = cls(t16, "placeholder-text-disabled dark:placeholder-text-disabled-dark", "relative flex items-center transition-all bg-transparent outline-none focus:outline-none focus:ring-0 appearance-none border-none focus:border-transparent", inputPaddingClass, "h-full w-full text-current", t17, t18, innerClassName);
     $[22] = innerClassName;
     $[23] = inputPaddingClass;
-    $[24] = t17;
-    $[25] = t18;
-    $[26] = t19;
-    $[27] = t20;
+    $[24] = t16;
+    $[25] = t17;
+    $[26] = t18;
+    $[27] = t19;
   } else {
-    t20 = $[27];
+    t19 = $[27];
   }
-  let t21;
-  if ($[28] !== autoFocus || $[29] !== onClick || $[30] !== placeholder || $[31] !== t11 || $[32] !== t12 || $[33] !== t13 || $[34] !== t14 || $[35] !== t20) {
-    t21 = /* @__PURE__ */ jsx("input", { value: t11, ref: t12, onClick, placeholder, "aria-label": placeholder, readOnly: t13, onChange: t14, autoFocus, onFocus: t15, onBlur: t16, className: t20 });
+  let t20;
+  if ($[28] !== autoFocus || $[29] !== inputRef || $[30] !== onClick || $[31] !== placeholder || $[32] !== t11 || $[33] !== t12 || $[34] !== t13 || $[35] !== t19) {
+    t20 = /* @__PURE__ */ jsx("input", { value: t11, ref: inputRef, onClick, placeholder, "aria-label": placeholder, readOnly: t12, onChange: t13, autoFocus, onFocus: t14, onBlur: t15, className: t19 });
     $[28] = autoFocus;
-    $[29] = onClick;
-    $[30] = placeholder;
-    $[31] = t11;
-    $[32] = t12;
-    $[33] = t13;
-    $[34] = t14;
-    $[35] = t20;
-    $[36] = t21;
+    $[29] = inputRef;
+    $[30] = onClick;
+    $[31] = placeholder;
+    $[32] = t11;
+    $[33] = t12;
+    $[34] = t13;
+    $[35] = t19;
+    $[36] = t20;
   } else {
-    t21 = $[36];
+    t20 = $[36];
   }
-  let t22;
+  let t21;
   if ($[37] !== clearText || $[38] !== searchText || $[39] !== size) {
-    t22 = searchText ? /* @__PURE__ */ jsx(IconButton, { className: `${size === "small" ? "mr-0 top-0" : "mr-1 top-0"} absolute right-0 z-10`, size: "small", "aria-label": "Clear search", onClick: clearText, children: /* @__PURE__ */ jsx(XIcon, { size: iconSize.smallest }) }) : /* @__PURE__ */ jsx("div", { style: {
+    t21 = searchText ? /* @__PURE__ */ jsx(IconButton, { className: `${size === "small" ? "mr-0 top-0" : "mr-1 top-0"} absolute right-0 z-10`, size: "small", "aria-label": "Clear search", onClick: clearText, children: /* @__PURE__ */ jsx(XIcon, { size: iconSize.smallest }) }) : /* @__PURE__ */ jsx("div", { style: {
       width: 26
     } });
     $[37] = clearText;
     $[38] = searchText;
     $[39] = size;
-    $[40] = t22;
+    $[40] = t21;
   } else {
-    t22 = $[40];
+    t21 = $[40];
   }
-  let t23;
-  if ($[41] !== onClick || $[42] !== t10 || $[43] !== t21 || $[44] !== t22 || $[45] !== t7) {
-    t23 = /* @__PURE__ */ jsxs("div", { role: "search", "aria-label": "Search", onClick, className: t7, children: [
+  let t22;
+  if ($[41] !== onClick || $[42] !== t10 || $[43] !== t20 || $[44] !== t21 || $[45] !== t7) {
+    t22 = /* @__PURE__ */ jsxs("div", { role: "search", "aria-label": "Search", onClick, className: t7, children: [
       t10,
-      t21,
-      t22
+      t20,
+      t21
     ] });
     $[41] = onClick;
     $[42] = t10;
-    $[43] = t21;
-    $[44] = t22;
+    $[43] = t20;
+    $[44] = t21;
     $[45] = t7;
-    $[46] = t23;
+    $[46] = t22;
   } else {
-    t23 = $[46];
+    t22 = $[46];
   }
-  return t23;
+  return t22;
 }
 const Select = forwardRef((t0, ref) => {
   const $ = c(123);
@@ -8760,7 +8819,7 @@ function MemoizedList({
           zIndex: 1
         }, children: endAdornment });
       }
-      const rowData = data && data[index];
+      const rowData = data ? data[index] : void 0;
       return /* @__PURE__ */ jsxs(VirtualTableRow, { rowData, rowIndex: index, onRowClick, columns, hoverRow, rowClassName, style: {
         ...style,
         top: `calc(${style.top}px + ${headerHeight ?? 48}px)`
@@ -8902,7 +8961,7 @@ export {
   AlignLeftIcon,
   AppWindow,
   ArrowDownToLineIcon,
-  ArrowLeftIcon,
+  ArrowLeftIcon2 as ArrowLeftIcon,
   ArrowRightFromLineIcon,
   ArrowRightIcon,
   ArrowRightToLineIcon,
@@ -8927,7 +8986,7 @@ export {
   ChevronDownIcon2 as ChevronDownIcon,
   ChevronLeftIcon2 as ChevronLeftIcon,
   ChevronRightIcon2 as ChevronRightIcon,
-  ChevronUpIcon,
+  ChevronUpIcon2 as ChevronUpIcon,
   ChevronsLeftIcon,
   ChevronsRightIcon,
   ChevronsUpDownIcon,
@@ -9042,7 +9101,7 @@ export {
   RadioGroup,
   RadioGroupItem,
   RefreshCcwIcon,
-  RefreshCwIcon,
+  RefreshCwIcon2 as RefreshCwIcon,
   RepeatIcon,
   ResizablePanels,
   Rows3Icon,