dinocollab-core 2.2.8 → 2.2.10

package/dist/types/{lab/data-surface → data-surface}/index.d.ts

@@ -1,7 +1,7 @@
 export * from './types';
 export * from './helpers';
 export * from './index.create';
-export * from './view-list.types';
-export * from './view-grid.types';
+export * from './view-list';
+export * from './view-grid';
 export * from './index.dino';
 export * from './button-switch';

package/dist/types/{lab/data-surface → data-surface}/index.dino.d.ts

@@ -2,9 +2,11 @@
 import { setViewModeToURL, getViewModeFromURL, setPaginationToURL, getPaginationFromURL } from './helpers';
 import createViewGrid from './view-grid';
 import createDataSurface from './index.create';
+import createViewList from './view-list';
 export declare class DinoDataSurFace {
     createDataSurface: typeof createDataSurface;
     createViewGrid: typeof createViewGrid;
+    createViewList: typeof createViewList;
     ButtonSwitch: import("react").FC<import("./button-switch").IButtonSwitchProps>;
     createButtonSwitch: () => import("react").FC<import("./button-switch").IButtonSwitchProps>;
     setViewModeToURL: typeof setViewModeToURL;

package/dist/types/{lab/data-surface → data-surface}/types.d.ts

@@ -8,17 +8,6 @@ export type TPagination = {
     hasPrev?: boolean;
     total?: number;
 };
-/**
- * Virtualized rendering configuration.
- * Used by both grid and list views for windowing optimization.
- */
-export type TVirtualizedConfig = {
-    scrollTop: number;
-    viewportHeight: number;
-    /** Number of extra rows/columns rendered outside the viewport as a buffer. Defaults to `4` (grid) / `6` (table). */
-    overscan?: number;
-    gap?: number;
-};
 /**
  * Controls how the list is rendered into the DOM.
  * - `normal`      — all rows are mounted (suitable for small datasets)

package/dist/types/data-surface/view-grid/helpers.d.ts

@@ -0,0 +1,19 @@
+import type { TGridSizes } from './types';
+/** Default spacing between grid items in pixels. */
+export declare const DEFAULT_GRID_SPACING_PX = 8;
+/** Resolves the final grid spacing from multiple optional values. */
+export declare const resolveGridSpacing: (...spacing: (number | undefined)[]) => number;
+/** Default scrolling threshold in pixels for triggering near-end events. */
+export declare const DEFAULT_GRID_SCROLLING_THRESHOLD_PX = 80;
+/** Resolves the final scrolling threshold from multiple optional values. */
+export declare const resolveGridScrollingThreshold: (...threshold: (number | undefined)[]) => number;
+/** Default grid item height estimate in pixels, used for virtualization calculations. */
+export declare const DEFAULT_GRID_ITEM_HEIGHT_ESTIMATE = 120;
+/** Default grid item sizes for each breakpoint. */
+export declare const DEFAULT_GRID_ITEM_SIZES: TGridSizes;
+/** Returns the grid item sizes, falling back to defaults if not provided. */
+export declare const getGridItemSizes: (sizes?: TGridSizes) => TGridSizes;
+/** Normalizes grid item sizes, ensuring all breakpoints have a value. */
+export declare const normalizeGridSizes: (sizes?: TGridSizes) => Required<TGridSizes>;
+/** Resolves the number of grid columns based on the container width and item sizes. */
+export declare const resolveGridColumnsFromWidth: (width: number, sizes?: TGridSizes) => number;

package/dist/types/data-surface/view-grid/hooks.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import type { IViewGridConfig, IViewGridProps } from './types';
+/** Merges the provided props and config into a single configuration object. */
+export declare const useMergedConfig: <T>(props: IViewGridProps<T>, config: IViewGridConfig<T>) => {
+    spacing: number;
+    scrollingThreshold: number;
+    sizes: Partial<Record<import("./types").TGridSize, number>>;
+    Component: import("react").FC<import("./types").IViewGridItemProps<any>> | import("react").ComponentType<import("./types").IViewGridItemProps<T>>;
+};

package/dist/types/data-surface/view-grid/index.d.ts

@@ -0,0 +1,19 @@
+import type { ComponentType, FC } from 'react';
+import type { LoadingModeRule, TPagination } from '../types';
+import type { IViewGridConfig, IViewGridProps } from './types';
+export * from './types';
+/**
+ * Factory function to create a Grid view component that can switch between normal and virtualized rendering strategies based on props and configuration.
+ * @param config - The configuration object for the grid view, containing default settings and required properties.
+ * @returns A React functional component that renders a grid view based on the provided configuration and props, supporting both normal and virtualized rendering strategies.
+ */
+export declare function createViewGrid<T>(config: IViewGridConfig<T>): FC<IViewGridProps<T>>;
+export interface IViewGridLoadingProps<T> extends IViewGridProps<T> {
+    value: T[];
+    loadMode: LoadingModeRule;
+    loading?: boolean;
+    pagination?: TPagination;
+    onPageChange?: (page: number, pageSize: number) => void | Promise<void>;
+}
+export declare function createViewGridLoading<T>(GridComponent: ComponentType<IViewGridProps<T>>): FC<IViewGridLoadingProps<T>>;
+export default createViewGrid;

package/dist/types/data-surface/view-grid/styleds.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+export declare const viewGridClasses: {
+    root: string;
+    virtualized: string;
+    scrollContainer: string;
+    grid: string;
+    gridItem: string;
+    scrolling: string;
+};
+export declare const ViewGridStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/dist/types/data-surface/view-grid/types.d.ts

@@ -0,0 +1,39 @@
+import type { ComponentType } from 'react';
+import type { RenderStrategyRule, TGetterId } from '../types';
+export type TGridSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export type TGridSizes = Partial<Record<TGridSize, number>>;
+/**
+ * Props received by the custom render function for each card in Grid view.
+ * @template T - The shape of a single data row object.
+ */
+export interface IViewGridItemProps<T> {
+    /** The data object for this grid card. */
+    value: T;
+    /** Zero-based position of this item in the data array. */
+    index: number;
+}
+export interface IViewGridBase<T> {
+    /** Spacing between grid items in pixels. @default 8 */
+    spacing?: number;
+    /** Scroll offset threshold in pixels before the `scrolling` class is applied. @default 80 */
+    scrollingThreshold?: number;
+    sizes?: TGridSizes;
+    /**
+     * Controls how the list is rendered into the DOM.
+     * - `normal`      — all rows are mounted (suitable for small datasets)
+     * - `virtualized` — only visible rows are mounted (optimized for large datasets)
+     * @default 'normal'
+     */
+    renderStrategy?: RenderStrategyRule;
+    Component?: ComponentType<IViewGridItemProps<T>>;
+    /** Number of extra rows rendered outside the viewport as a buffer when using virtualized rendering. @default 4 */
+    overscan?: number;
+}
+export interface IViewGridConfig<T> extends IViewGridBase<T> {
+    getterId: TGetterId<T>;
+}
+export interface IViewGridProps<T> extends IViewGridBase<T> {
+    value: T[];
+    /** Called when user scrolls near the bottom of the list. Use this to trigger pagination or infinity load. */
+    onNearEnd?: () => void;
+}

package/dist/types/data-surface/view-grid/ui.units.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { IViewGridItemProps } from './types';
+export declare const GridItemDefault: FC<IViewGridItemProps<any>>;

package/dist/types/data-surface/view-list/helpers.d.ts

@@ -0,0 +1,15 @@
+import { TableCellProps } from '@mui/material';
+import { ListDensity, TListColumn, TListColumns } from './types';
+export declare const LIST_HEADER_HEIGHT = 48;
+export declare const LIST_DEFAULT_ROW_SPACING = 4;
+export declare const LIST_ROW_HEIGHT_BY_DENSITY: Record<ListDensity, number>;
+export declare const LIST_CELL_PADDING_BY_DENSITY: Record<ListDensity, string>;
+/**
+ * Converts TListColumns<T> Record type to TListColumn<T>[] array for internal use.
+ */
+export declare const columnsRecordToArray: <T>(value: T[], columnsRecord?: Partial<Record<keyof T, Omit<TListColumn<T>, "field">>> | undefined) => TListColumn<T>[];
+export declare function resolveListRowHeight(density?: number | ListDensity): number;
+export declare function resolveListCellPadding(density?: number | ListDensity): string;
+export declare function resolveListRowSpacing(spacing?: number): number;
+export declare function resolveListSpacerHeight(count: number, rowHeight: number, rowSpacing: number): number;
+export declare const mapSxTableCell: <T>(col: TListColumn<T>, totalFlex: number, sx?: TableCellProps['sx']) => TableCellProps['sx'];

package/dist/types/{lab/data-surface/view-list.units.d.ts → data-surface/view-list/hooks.d.ts}

@@ -1,8 +1,14 @@
-import { ListDensity } from './view-list.types';
-import type { TGetterId } from './types';
-export declare const LIST_HEADER_HEIGHT = 48;
-export declare const LIST_ROW_HEIGHT_BY_DENSITY: Record<ListDensity, number>;
-export declare const LIST_CELL_PADDING_BY_DENSITY: Record<ListDensity, string>;
+import { CSSProperties } from 'react';
+import type { TGetterId } from '../types';
+import type { IViewListConfig, IViewListProps } from './types';
+export declare function useMergedConfig<T>(config: IViewListConfig<T>, props: IViewListProps<T>): {
+    columns: import("./types").TListColumn<T>[];
+    selectable: boolean;
+    rowHeight: number;
+    cellPadding: string;
+    rowSpacing: number;
+    rootStyle: CSSProperties;
+};
 /**
  * Custom hook to manage list row selection logic.
  * Handles select all, individual row selection, and indeterminate state.

package/dist/types/data-surface/view-list/index.d.ts

@@ -0,0 +1,13 @@
+import type { ComponentType, FC } from 'react';
+import type { LoadingModeRule, TPagination } from '../types';
+import type { IViewListConfig, IViewListProps } from './types';
+export * from './types';
+export declare function createViewList<T>(config: IViewListConfig<T>): FC<IViewListProps<T>>;
+export interface IViewListLoadingProps<T> extends IViewListProps<T> {
+    loadMode: LoadingModeRule;
+    loading?: boolean;
+    pagination?: TPagination;
+    onPageChange?: (page: number, pageSize: number) => void | Promise<void>;
+}
+export declare function createViewListLoading<T>(ListComponent: ComponentType<IViewListProps<T>>): FC<IViewListLoadingProps<T>>;
+export default createViewList;

package/dist/types/data-surface/view-list/styled.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+export declare const VIEW_LIST_ROW_SPACING_VAR = "--DinoViewList-rowSpacing";
+export declare const viewListClasses: {
+    root: string;
+    virtualized: string;
+    scrollContainer: string;
+    table: string;
+    tableHeader: string;
+    tableHeaderCell: string;
+    tableBodyCell: string;
+    tableSpacerRow: string;
+    tableSpacerCell: string;
+    tableCellContent: string;
+};
+export declare const ViewListStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/dist/types/{lab/data-surface/view-list.types.d.ts → data-surface/view-list/types.d.ts}

@@ -1,4 +1,5 @@
 import type { ReactNode } from 'react';
+import { RenderStrategyRule, TGetterId } from '../types';
 /**
  * Props received by the custom render function for each row in List view.
  * @template T - The shape of a single data row object.
@@ -51,6 +52,7 @@ export interface TListColumn<T> {
     /** Derives a value from the row before it is passed to the render step. */
     valueGetter?: (value: string, row: T, index: number) => any;
 }
+/** Columns configuration for List view. */
 export type TListColumns<T> = Partial<Record<keyof T, Omit<TListColumn<T>, 'field'>>>;
 /**
  * Row density preset for List view.
@@ -62,3 +64,39 @@ export declare const ListDensity: {
     readonly comfortable: "comfortable";
 };
 export type ListDensity = keyof typeof ListDensity;
+/** Base configuration for List view. */
+export interface IViewListBase<T> {
+    /** Custom render function for list rows. If not provided, a default row layout will be used. */
+    columns?: TListColumns<T>;
+    /** Row height preset or an explicit row height in pixels. @default 'standard' */
+    density?: number | ListDensity;
+    /** Spacing between rows in pixels. @default 4 */
+    spacing?: number;
+    /**
+     * Controls how the list is rendered into the DOM.
+     * - `normal`      — all rows are mounted (suitable for small datasets)
+     * - `virtualized` — only visible rows are mounted (optimized for large datasets)
+     * @default 'normal'
+     */
+    renderStrategy?: RenderStrategyRule;
+    /** Enable row selection with checkboxes. */
+    selectable?: boolean;
+    /** Number of extra rows rendered outside the viewport as a buffer when using virtualized rendering. @default 6 */
+    overscan?: number;
+}
+/** Configuration for List view. */
+export interface IViewListConfig<T> extends IViewListBase<T> {
+    /** Function to extract unique row ID from a data item. Required for selection and virtualization. */
+    getterId: TGetterId<T>;
+}
+/** Props for List view component. */
+export interface IViewListProps<T> extends IViewListBase<T> {
+    /** The array of data items to display in the list. */
+    value: T[];
+    /** Called when user scrolls near the bottom of the list. Use this to trigger pagination or infinity load. */
+    onNearEnd?: () => void;
+    /** Array of selected row IDs (controlled). */
+    selectedIds?: (string | number)[];
+    /** Callback when selection changes. */
+    onSelectionChange?: (selectedIds: (string | number)[]) => void;
+}

package/dist/types/data-view/dino.d.ts

@@ -22,7 +22,7 @@ declare class DinoDataViewBase {
         seedKey: string;
     } | null;
     getSeedKeyFromURL: <T>(params: import("./query-param-url").IViewDataHandlerParams<T, "defaultSeedKey">) => string;
-    syncViewModeToURL: <T>(params: import("./query-param-url").IViewDataHandlerParams<T, "viewMode" | "defaultViewMode">) => void;
+    syncViewModeToURL: <T>(params: import("./query-param-url").IViewDataHandlerParams<T, "defaultViewMode" | "viewMode">) => void;
     getViewModeFromURL: <T>(params: import("./query-param-url").IViewDataHandlerParams<T, "defaultViewMode">) => import("./view-mode.types").EViewMode | undefined;
     convertFilterToQueryParam: <T>(filterState?: import("./types").IFilterState<T> | undefined) => string;
     formatterDate: (value: any, options?: IFormatterDateOptions) => string;

package/dist/types/data-view/query-param-url.d.ts

@@ -21,6 +21,6 @@ export declare const getQueryFromURL: <T>(params: IViewDataHandlerParams<T, "def
     seedKey: string;
 } | null;
 export declare const getSeedKeyFromURL: <T>(params: IViewDataHandlerParams<T, "defaultSeedKey">) => string;
-export declare const syncViewModeToURL: <T>(params: IViewDataHandlerParams<T, "viewMode" | "defaultViewMode">) => void;
+export declare const syncViewModeToURL: <T>(params: IViewDataHandlerParams<T, "defaultViewMode" | "viewMode">) => void;
 export declare const getViewModeFromURL: <T>(params: IViewDataHandlerParams<T, "defaultViewMode">) => EViewMode | undefined;
 export declare const convertFilterToQueryParam: <T>(filterState?: IFilterState<T> | undefined) => string;

package/dist/types/filter-bar/components/filter-menu.types.d.ts

@@ -28,6 +28,8 @@ export interface IFilterMenuConfig<T> extends IFilterMenuSlots {
     fields: TFieldMenuConfigs<T>;
     validation?: IFormValidatorConfig<Partial<TFieldModelValid<T>>>;
     element?: ComponentType<IFilterMenuProps<T>>;
+    quickSearchHint?: string | ((currentHint: string) => string);
+    /** Option to enable or disable quick search @default true */
     enableQuickSearch?: boolean;
 }
 export interface IFilterMenuProps<T> {

package/dist/types/filter-bar/components/filter-sort.types.d.ts

@@ -1,30 +1,47 @@
 import type { ComponentType } from 'react';
-import type { BoxProps, PopperProps } from '@mui/material';
+import type { BoxProps, IconButtonProps, PopperProps } from '@mui/material';
 import type { TFieldType } from '../types';
 export declare const FieldSortDirection: {
     readonly asc: "asc";
     readonly desc: "desc";
 };
 export type FieldSortDirection = keyof typeof FieldSortDirection;
-export interface IFieldSort<T> {
+export interface TFieldSort<T> {
     field: TFieldType<T>;
     label?: string;
-    /** Default is true, set to false to disable direction selection for this field (e.g. random sort doesn't have direction) */
-    enableDirection?: boolean;
-    /** Default is true, set to false to hide this field from the sort options */
-    visible?: boolean;
 }
-export type TFieldSorts<T> = Partial<Record<TFieldType<T>, Omit<IFieldSort<T>, 'field'>>>;
+export type TFieldSorts<T> = Partial<Record<TFieldType<T>, Omit<TFieldSort<T>, 'field'>>>;
 export interface IFilterSortSlots {
     popperProps?: Partial<PopperProps>;
     rootProps?: BoxProps;
+    buttonSortProps?: IconButtonProps;
+    buttonShuffleProps?: IconButtonProps;
 }
 export interface IFilterSortProps<T> {
     sx?: BoxProps['sx'];
     slots?: IFilterSortSlots;
 }
+/**
+ * Configuration interface for filter and sort functionality.
+ * Extends slot definitions to provide sorting and shuffling capabilities.
+ *
+ * @template T - The type of data being filtered and sorted.
+ *
+ * @property {TFieldSorts<T>} fields - Available fields for sorting with optional labels.
+ *                                      Note: Special keys 'quickSearch' and 'sortShuffle' are excluded.
+ * @property {boolean} [enableShuffle] - Optional flag to enable shuffle functionality.
+ * @property {'left' | 'right'} [shufflePosition='right'] - The horizontal position of the shuffle icon.
+ *                                                          Defaults to 'right' if not specified.
+ * @property {ComponentType<IFilterSortProps<T>>} [element] - Optional custom component for rendering
+ *                                                            the filter sort interface.
+ */
 export interface IFilterSortConfig<T> extends IFilterSortSlots {
+    /** Available fields for sorting with optional labels. Note: Special keys 'quickSearch' and 'sortShuffle' are excluded. */
     fields: TFieldSorts<T>;
-    enableSortRandom?: boolean;
+    /** Optional flag to enable shuffle functionality. */
+    enableShuffle?: boolean;
+    /** The position of the shuffle icon. @default 'right' */
+    shufflePosition?: 'left' | 'right';
+    /** Optional custom component for rendering the filter sort interface. */
     element?: ComponentType<IFilterSortProps<T>>;
 }

package/dist/types/filter-bar/components/hint-icon.d.ts

@@ -1,7 +1,11 @@
+import { IRichTooltipProps } from '../../components/rich-tooltip';
 import type { FC, ReactNode } from 'react';
 interface IHintIconProps {
     title: ReactNode;
     content: ReactNode;
+    slots?: {
+        richTooltipProps?: IRichTooltipProps;
+    };
 }
 export declare const HintIcon: FC<IHintIconProps>;
 export declare function createHintIcon(param: IHintIconProps): FC<Partial<IHintIconProps>>;

package/dist/types/filter-bar/components/units.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { SvgIconProps } from '@mui/material';
+export declare const ShufffleIcon: FC<SvgIconProps>;

package/dist/types/filter-bar/helpers.d.ts

@@ -1,4 +1,7 @@
 import { KeySpecial, TFilterState } from './types';
+export declare const mapSpecialTexts: {
+    qsTooltip: string;
+};
 export declare const mapSpecialLabel: Record<KeySpecial, string>;
 export interface IFilterStateQueryParams {
     filter?: string;
@@ -35,14 +38,14 @@ export declare function setFilterToURL<T>(state?: TFilterState<T>, defaultState?
  */
 export declare function getFilterFromURL<T>(defaultState?: TFilterState<T>): TFilterState<T> | undefined;
 /**
- * @en Set seed value to URL for random sorting. If seed is undefined, remove from URL.
- * @vi Dat gia tri seed vao URL de sap xep ngau nhien. Neu seed khong xac dinh, xoa khoi URL.
- * @param seed - Seed value for random sorting
+ * @en Set seed value to URL for shuffle sorting. If seed is undefined, remove from URL.
+ * @vi Dat gia tri seed vao URL de sap xep shuffle. Neu seed khong xac dinh, xoa khoi URL.
+ * @param seed - Seed value for shuffle sorting
  */
 export declare const setSeedToURL: (seed?: string) => void;
 /**
- * @en Get seed value from URL for random sorting. Returns undefined if not set or on error.
- * @vi Lay gia tri seed tu URL de sap xep ngau nhien. Tra ve undefined neu khong duoc dat hoac co loi.
+ * @en Get seed value from URL for shuffle sorting. Returns undefined if not set or on error.
+ * @vi Lay gia tri seed tu URL de sap xep shuffle. Tra ve undefined neu khong duoc dat hoac co loi.
  * @returns Seed value from URL or undefined
  */
 export declare const getSeedFromURL: () => string | undefined;

package/dist/types/filter-bar/{components/hooks.d.ts → hooks.d.ts}

@@ -1,5 +1,5 @@
-import type { IFilterBarContext } from '../index.context';
-import type { TFieldSort, TFieldStore, TFieldType, TFieldValid, TFieldValue, TLogic } from '../types';
+import type { IFilterBarContext } from './index.context';
+import type { TFieldSort, TFieldStore, TFieldType, TFieldValid, TFieldValue, TLogic } from './types';
 type TOptions = {
     logic?: TLogic;
 };

package/dist/types/filter-bar/index.context.d.ts

@@ -6,6 +6,7 @@ export interface IFilterBarContextActions<T> {
 export interface IFilterBarContextState<T> {
     isLoading?: boolean;
     filterState: TFilterState<T>;
+    defaultFilterState?: TFilterState<T>;
 }
 export interface IFilterBarContext<T> extends IFilterBarContextState<T>, IFilterBarContextActions<T> {
 }

package/dist/types/filter-bar/index.create.d.ts

@@ -6,7 +6,9 @@ import type { IFilterSortConfig, IFilterSortProps } from './components/filter-so
 import type { IFilterInputConfig, IFilterInputProps } from './components/filter-input.types';
 import type { IFilterSummaryConfig, IFilterSummaryProps } from './components/filter-summary.types';
 export interface IFilterBarConfigs<T> {
-    initialFilterState?: TFilterState<T>;
+    /** Debounce delay for filter input changes in milliseconds @default 300 */
+    debounceDelay?: number;
+    defaultFilterState?: TFilterState<T>;
     /** Default filter logic, can be overridden by individual filters @default "and" */
     defaultFilterLogic?: 'and' | 'or';
     InputComponent?: ComponentType<IFilterInputProps<T>>;
@@ -30,6 +32,7 @@ export interface IFilterBarSlots {
 export interface IFilterBarProps<T> {
     sx?: BoxProps['sx'];
     value?: TFilterState<T>;
+    defaultValue?: TFilterState<T>;
     onChange?: (state: TFilterState<T>) => Promise<void> | void;
     slots?: IFilterBarSlots;
 }

package/dist/types/filter-bar/types.d.ts

@@ -19,7 +19,7 @@ export type TFieldValid = string | number | boolean;
  */
 export declare const KeySpecial: {
     readonly quickSearch: "quickSearch";
-    readonly sortRandom: "sortRandom";
+    readonly sortShuffle: "sortShuffle";
 };
 export type KeySpecial = keyof typeof KeySpecial;
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dinocollab-core",
-  "version": "2.2.8",
+  "version": "2.2.10",
   "description": "Dinocollab core - libraries for building collaborative applications with React 18",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -32,12 +32,18 @@
       "filter-bar": [
         "./dist/types/filter-bar/index.d.ts"
       ],
-      "lab/data-surface": [
-        "./dist/types/lab/data-surface/index.d.ts"
+      "table": [
+        "./dist/types/table/index.d.ts"
+      ],
+      "table-grid": [
+        "./dist/types/table-grid/index.d.ts"
       ],
       "data-view": [
         "./dist/types/data-view/index.d.ts"
       ],
+      "data-surface": [
+        "./dist/types/data-surface/index.d.ts"
+      ],
       "form": [
         "./dist/types/form/index.d.ts"
       ],
@@ -56,12 +62,6 @@
       "redux": [
         "./dist/types/redux/index.d.ts"
       ],
-      "table": [
-        "./dist/types/table/index.d.ts"
-      ],
-      "table-grid": [
-        "./dist/types/table-grid/index.d.ts"
-      ],
       "utils": [
         "./dist/types/utils/index.d.ts"
       ]
@@ -84,14 +84,22 @@
       "import": "./dist/filter-bar/index.js",
       "types": "./dist/types/filter-bar/index.d.ts"
     },
-    "./lab/data-surface": {
-      "import": "./dist/lab/data-surface/index.js",
-      "types": "./dist/types/lab/data-surface/index.d.ts"
+    "./table": {
+      "import": "./dist/table/index.js",
+      "types": "./dist/types/table/index.d.ts"
+    },
+    "./table-grid": {
+      "import": "./dist/table-grid/index.js",
+      "types": "./dist/types/table-grid/index.d.ts"
     },
     "./data-view": {
       "import": "./dist/data-view/index.js",
       "types": "./dist/types/data-view/index.d.ts"
     },
+    "./data-surface": {
+      "import": "./dist/data-surface/index.js",
+      "types": "./dist/types/data-surface/index.d.ts"
+    },
     "./form": {
       "import": "./dist/form/index.js",
       "types": "./dist/types/form/index.d.ts"
@@ -116,14 +124,6 @@
       "import": "./dist/redux/index.js",
       "types": "./dist/types/redux/index.d.ts"
     },
-    "./table": {
-      "import": "./dist/table/index.js",
-      "types": "./dist/types/table/index.d.ts"
-    },
-    "./table-grid": {
-      "import": "./dist/table-grid/index.js",
-      "types": "./dist/types/table-grid/index.d.ts"
-    },
     "./utils": {
       "import": "./dist/utils/index.js",
       "types": "./dist/types/utils/index.d.ts"

package/dist/lab/data-surface/index.js

@@ -1,2 +0,0 @@
-export{DataSurfaceViewMode,LoadingModeRule,RenderStrategyRule}from"../../src/lab/data-surface/types.js";export{getPaginationFromURL,getViewModeFromURL,setPaginationToURL,setViewModeToURL}from"../../src/lab/data-surface/helpers.js";export{createDataSurface}from"../../src/lab/data-surface/index.create.js";export{ListDensity}from"../../src/lab/data-surface/view-list.types.js";export{DinoDataSurFace,dinoDataSurface}from"../../src/lab/data-surface/index.dino.js";export{ButtonSwitch}from"../../src/lab/data-surface/button-switch.js";
-//# sourceMappingURL=index.js.map

package/dist/src/filter-bar/components/hooks.js

@@ -1,2 +0,0 @@
-import{objectSpread2 as t,defineProperty as e,toConsumableArray as r}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{KeySpecial as i}from"../types.js";var l=function(t,e,r){if(!t)return!1;var i=t[e];if(!i)return!1;var l=r.logic!==i.logic,o=new Set(i.values.map(function(t){return JSON.stringify(t)}).filter(Boolean));return r.values.some(function(t){return o.has(JSON.stringify(t))})&&!l},o=function(t,i,l){var o=null==t?void 0:t[i],n={values:Array.from(new Set([].concat(r((null==o?void 0:o.values)||[]),r(l.values)).filter(Boolean))),logic:l.logic||(null==o?void 0:o.logic)};return Object.assign({},t,e({},i,n))},n=function(r){return{addFilter:function(e,i,n){var a=r.filterState.storeFilter,s=t(t({},i),{},{logic:(null==n?void 0:n.logic)||i.logic});if(!l(a,e,s)){var u=o(a,e,s),f=Object.assign({},a,u);r.setFilterState(t(t({},r.filterState),{},{storeFilter:f}))}},replaceFilter:function(i,l,o){var n=t(t({},l),{},{logic:(null==o?void 0:o.logic)||l.logic}),a=Object.assign({},r.filterState.storeFilter,e({},i,n));r.setFilterState(t(t({},r.filterState),{},{storeFilter:a}))},upsertManyFilter:function(e,i,n){if(0!==i.values.length){var a=Object.assign({},r.filterState.storeFilter);i.values.forEach(function(t){var r={values:[t],logic:(null==n?void 0:n.logic)||i.logic};l(a,e,r)||(a=o(a,e,r))}),r.setFilterState(t(t({},r.filterState),{},{storeFilter:a}))}},removeFilter:function(e){var i=Object.assign({},r.filterState.storeFilter);delete i[e],r.setFilterState(t(t({},r.filterState),{},{storeFilter:i}))},removeFilterByFieldValue:function(e,i){var l=Object.assign({},r.filterState.storeFilter),o=l[e];o&&(l[e]=t(t({},o),{},{values:o.values.filter(function(t){return t.toString()!==i.toString()})}),l[e]&&0===l[e].values.length&&delete l[e],r.setFilterState(t(t({},r.filterState),{},{storeFilter:l})))},clearAllFilters:function(){r.setFilterState(t(t({},r.filterState),{},{storeFilter:{}}))},getFieldInfo:function(t){var e;return null===(e=r.filterState.storeFilter)||void 0===e?void 0:e[t]},getTotalCount:function(){var t=r.filterState.storeFilter;return t?Object.keys(t).reduce(function(e,r){var i=t[r];return e+(i?i.values.length:0)},0):0},hasSortByField:function(t){var e=r.filterState.storeSort;return(null==e?void 0:e.field)===t},getSort:function(){return r.filterState.storeSort},changeSort:function(e){var l=r.filterState.storeSort,o=e===i.sortRandom,n=(null==l?void 0:l.field)===e;if(o){var a=void 0;return n||(a={field:e}),void r.setFilterState(t(t({},r.filterState),{},{storeSort:a}))}var s="desc";n&&(s="desc"===l.direction?"asc":"desc"),r.setFilterState(t(t({},r.filterState),{},{storeSort:{field:e,direction:s}}))},removeSort:function(){r.setFilterState(t(t({},r.filterState),{},{storeSort:void 0}))}}};export{n as useFilterActions};
-//# sourceMappingURL=hooks.js.map

package/dist/src/filter-bar/components/hooks.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"hooks.js","sources":["../../../../src/filter-bar/components/hooks.ts"],"sourcesContent":["// Copyright (c) 2024-present, Dinocollab Technologies, Inc. and its affiliates. All rights reserved.\r\n\r\n// types\r\nimport { KeySpecial } from '../types'\r\nimport type { IFilterBarContext } from '../index.context'\r\nimport type { TFieldSort, TFieldStore, TFieldType, TFieldValid, TFieldValue, TLogic } from '../types'\r\n\r\ntype TOptions = {\r\n  logic?: TLogic\r\n}\r\n\r\n/**\r\n * Check if a given filter value already exists in the store for a specific field.\r\n * @param storeFilter - The current filter store.\r\n * @param field - The field to check for duplicate values.\r\n * @param value - The filter value to check for duplicates.\r\n * @returns True if a duplicate value exists, false otherwise.\r\n */\r\nconst checkDuplicateValue = <T>(storeFilter: TFieldStore<T> | undefined, field: keyof TFieldStore<T>, value: TFieldValue): boolean => {\r\n  // If there is no filter store or no filter values for the field, there can be no duplicates\r\n  if (!storeFilter) return false\r\n  const fieldValue = storeFilter[field]\r\n  // If there are no filter values for the field, there can be no duplicates\r\n  if (!fieldValue) return false\r\n  const isLogicChange = value.logic !== fieldValue.logic\r\n  // Create a set of existing values for the field to efficiently check for duplicates\r\n  const fieldSet = new Set(fieldValue.values.map((v) => JSON.stringify(v)).filter(Boolean))\r\n  return value.values.some((v) => fieldSet.has(JSON.stringify(v))) && !isLogicChange\r\n}\r\n/**\r\n * Merge a filter value into the store for a specific field.\r\n * @param storeFilter - The current filter store.\r\n * @param field - The field to merge the value into.\r\n * @param value - The filter value to merge.\r\n * @returns The updated filter store.\r\n */\r\nconst mergeValueToStoreFilter = <T>(storeFilter: TFieldStore<T> | undefined, field: keyof TFieldStore<T>, value: TFieldValue): TFieldStore<T> => {\r\n  const fieldValue: TFieldValue | undefined = storeFilter?.[field]\r\n  const values = Array.from(new Set([...(fieldValue?.values || []), ...value.values].filter(Boolean)))\r\n  const newData: TFieldValue = { values, logic: value.logic || fieldValue?.logic }\r\n  return Object.assign({}, storeFilter, { [field]: newData }) as TFieldStore<T>\r\n}\r\n\r\nexport const useFilterActions = <T>(context: IFilterBarContext<T>) => {\r\n  /**\r\n   * Add a filter value to the store for a specific field.\r\n   * @param field - The field to add the filter value to.\r\n   * @param value - The filter value to add.\r\n   * @returns void\r\n   */\r\n  const addFilter = (field: keyof TFieldStore<T>, value: TFieldValue, options?: TOptions) => {\r\n    // Check for duplicate value before adding\r\n    const { storeFilter } = context.filterState\r\n    const valueObj: TFieldValue = { ...value, logic: options?.logic || value.logic }\r\n    // If the value already exists in the store for the field, do not add it again\r\n    if (checkDuplicateValue(storeFilter, field, valueObj)) return\r\n    // Merge the new value into the store filter for the field\r\n    const newData = mergeValueToStoreFilter(storeFilter, field, valueObj)\r\n    const newStoreFilter = Object.assign({}, storeFilter, newData)\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter })\r\n  }\r\n  /**\r\n   * Replace all filter values for a specific field in the store with a new value.\r\n   * Value will be replaced instead of merged, which is useful for single-value filters or when you want to reset the filter values for a field.\r\n   * @param field - The field to update the filter value for.\r\n   * @param value - The new filter value to set.\r\n   */\r\n  const replaceFilter = (field: keyof TFieldStore<T>, value: TFieldValue, options?: TOptions) => {\r\n    const valueObj: TFieldValue = { ...value, logic: options?.logic || value.logic }\r\n    const newStoreFilter = Object.assign({}, context.filterState.storeFilter, { [field]: valueObj })\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter as TFieldStore<T> })\r\n  }\r\n  /**\r\n   * Add multiple filter values to the store for a specific field, ensuring no duplicates are added.\r\n   * @param field - The field to add the filter values to.\r\n   * @param values - The filter values to add.\r\n   * @returns void\r\n   */\r\n  const upsertManyFilter = (field: keyof TFieldStore<T>, value: TFieldValue, options?: TOptions) => {\r\n    // If there are no values to add, return early\r\n    if (value.values.length === 0) return\r\n    let newStoreFilter = Object.assign({}, context.filterState.storeFilter)\r\n    // Iterate through each value and add it to the store filter for the field, checking for duplicates\r\n    value.values.forEach((val) => {\r\n      const valueObj: TFieldValue = { values: [val], logic: options?.logic || value.logic }\r\n      if (checkDuplicateValue(newStoreFilter, field, valueObj)) return\r\n      newStoreFilter = mergeValueToStoreFilter(newStoreFilter, field, valueObj)\r\n    })\r\n    // Update the filter state with the new store filter after adding all values\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter })\r\n  }\r\n  /**\r\n   * Remove all filter values for a specific field from the store.\r\n   * @param field - The field to remove filters from.\r\n   * @returns void\r\n   */\r\n  const removeFilter = (field: TFieldType<T>) => {\r\n    const newStoreFilter = Object.assign({}, context.filterState.storeFilter)\r\n    delete newStoreFilter[field]\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter })\r\n  }\r\n\r\n  const removeFilterByFieldValue = (field: TFieldType<T>, value: TFieldValid) => {\r\n    const newStoreFilter = Object.assign({}, context.filterState.storeFilter)\r\n    const fieldVal: TFieldValue | undefined = newStoreFilter[field]\r\n    if (!fieldVal) return\r\n    newStoreFilter[field] = { ...fieldVal, values: fieldVal.values.filter((v) => v.toString() !== value.toString()) }\r\n    if (newStoreFilter[field] && newStoreFilter[field]!.values.length === 0) {\r\n      delete newStoreFilter[field]\r\n    }\r\n    context.setFilterState({ ...context.filterState, storeFilter: newStoreFilter })\r\n  }\r\n\r\n  const clearAllFilters = () => {\r\n    context.setFilterState({ ...context.filterState, storeFilter: {} as TFieldStore<T> })\r\n  }\r\n\r\n  const getFieldInfo = (field: TFieldType<T>): TFieldValue | undefined => {\r\n    const fieldVal = context.filterState.storeFilter?.[field]\r\n    return fieldVal\r\n  }\r\n\r\n  const getTotalCount = (): number => {\r\n    const storeFilter = context.filterState.storeFilter\r\n    if (!storeFilter) return 0\r\n    const keys = Object.keys(storeFilter) as (keyof TFieldStore<T>)[]\r\n    return keys.reduce((acc, key) => {\r\n      const fieldVal = storeFilter[key]\r\n      return acc + (fieldVal ? fieldVal.values.length : 0)\r\n    }, 0)\r\n  }\r\n\r\n  const hasSortByField = (field: TFieldType<T>): boolean => {\r\n    const sort = context.filterState.storeSort\r\n    return sort?.field === field\r\n  }\r\n\r\n  const getSort = (): TFieldSort<T> | undefined => {\r\n    return context.filterState.storeSort\r\n  }\r\n\r\n  const changeSort = (field: TFieldType<T>) => {\r\n    const currentSort = context.filterState.storeSort\r\n    const isRandom = field === KeySpecial.sortRandom\r\n    const isEqualField = currentSort?.field === field\r\n    if (isRandom) {\r\n      // if current sort is random and user click random again, we remove the sort\r\n      let newValue: TFieldSort<T> | undefined = undefined\r\n      if (!isEqualField) newValue = { field }\r\n      context.setFilterState({ ...context.filterState, storeSort: newValue })\r\n      return\r\n    }\r\n    let newDirection: 'asc' | 'desc' = 'desc'\r\n    if (isEqualField) newDirection = currentSort.direction === 'desc' ? 'asc' : 'desc'\r\n    context.setFilterState({ ...context.filterState, storeSort: { field, direction: newDirection } })\r\n  }\r\n\r\n  const removeSort = () => {\r\n    context.setFilterState({ ...context.filterState, storeSort: undefined })\r\n  }\r\n\r\n  return {\r\n    addFilter,\r\n    replaceFilter,\r\n    upsertManyFilter,\r\n    removeFilter,\r\n    removeFilterByFieldValue,\r\n    clearAllFilters,\r\n    getFieldInfo,\r\n    getTotalCount,\r\n    hasSortByField,\r\n    getSort,\r\n    changeSort,\r\n    removeSort\r\n  }\r\n}\r\n"],"names":["checkDuplicateValue","storeFilter","field","value","fieldValue","isLogicChange","logic","fieldSet","Set","values","map","v","JSON","stringify","filter","Boolean","some","has","mergeValueToStoreFilter","newData","Array","from","concat","_toConsumableArray","Object","assign","_defineProperty","useFilterActions","context","addFilter","options","filterState","valueObj","_objectSpread","newStoreFilter","setFilterState","replaceFilter","upsertManyFilter","length","forEach","val","removeFilter","removeFilterByFieldValue","fieldVal","toString","clearAllFilters","getFieldInfo","_context$filterState$","getTotalCount","keys","reduce","acc","key","hasSortByField","sort","storeSort","getSort","changeSort","currentSort","isRandom","KeySpecial","sortRandom","isEqualField","newValue","undefined","newDirection","direction","removeSort"],"mappings":"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"}

package/dist/src/lab/data-surface/button-switch.js

@@ -1,2 +0,0 @@
-import{jsx as o}from"react/jsx-runtime";import{useRef as e,useCallback as r}from"react";import{styled as l,ToggleButtonGroup as a,colors as i,Tooltip as n,ToggleButton as t}from"@mui/material";import u from"@mui/icons-material/ViewList";import c from"@mui/icons-material/GridView";import{DataSurfaceViewMode as m}from"./types.js";var s={sm:"small",md:"medium"},d=[{value:m.list,icon:o(u,{fontSize:"small"}),label:"List View"},{value:m.grid,icon:o(c,{fontSize:"small"}),label:"Grid View"}],v=function(l){var a=l.value,i=l.onChange,u=l.size,c=void 0===u?"md":u,m=l.className,v=l.onlyIcon,f=void 0!==v&&v,g=l.reverse,p=void 0!==g&&g,h=s[c]||"small",w=e(null),x=r(function(o){w.current&&clearTimeout(w.current),w.current=setTimeout(function(){null!==o&&o!==a&&(null==i||i(o))},250)},[a,i]),C=p?[].concat(d).reverse():d;return o(b,{className:m,size:h,value:a,exclusive:!0,onChange:function(o,e){return x(e)},"aria-label":"view mode",children:C.map(function(e){return o(n,{title:e.label,arrow:!0,children:o(t,{value:e.value,"aria-label":e.label,size:h,sx:{p:f?"5px":void 0,minWidth:f?"small"===h?36:44:void 0},children:f?e.icon:e.label})},e.value)})})},b=l(a)({flex:"0 0 auto",".MuiToggleButtonGroup-grouped":{"&.Mui-selected":{color:i.common.white,backgroundColor:"var(--color-orange, ".concat(i.blue[600],")"),borderColor:"var(--color-orange, ".concat(i.blue[600],")"),"&.MuiToggleButtonGroup-lastButton":{borderColor:"var(--color-orange, ".concat(i.blue[600],")")},"&:hover":{backgroundColor:"var(--color-orange, ".concat(i.blue[600],")")}}}});export{v as ButtonSwitch,v as default};
-//# sourceMappingURL=button-switch.js.map

package/dist/src/lab/data-surface/button-switch.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"button-switch.js","sources":["../../../../src/lab/data-surface/button-switch.tsx"],"sourcesContent":["import { FC, useCallback, useRef } from 'react'\r\nimport { colors, styled, ToggleButton, ToggleButtonGroup, Tooltip } from '@mui/material'\r\nimport ViewListIcon from '@mui/icons-material/ViewList'\r\nimport GridViewIcon from '@mui/icons-material/GridView'\r\nimport { DataSurfaceViewMode } from './types'\r\n\r\nexport interface IButtonSwitchProps {\r\n  value?: DataSurfaceViewMode\r\n  onChange?: (value: DataSurfaceViewMode) => void\r\n  size?: 'sm' | 'md'\r\n  className?: string\r\n  onlyIcon?: boolean\r\n  reverse?: boolean\r\n}\r\n\r\nconst sizeMap = { sm: 'small', md: 'medium' } as const\r\n\r\nconst viewModes = [\r\n  { value: DataSurfaceViewMode.list, icon: <ViewListIcon fontSize='small' />, label: 'List View' },\r\n  { value: DataSurfaceViewMode.grid, icon: <GridViewIcon fontSize='small' />, label: 'Grid View' }\r\n]\r\n\r\nexport const ButtonSwitch: FC<IButtonSwitchProps> = (props) => {\r\n  const { value, onChange, size = 'md', className, onlyIcon = false, reverse = false } = props\r\n  const muiSize = sizeMap[size] || 'small'\r\n\r\n  const changeTimeoutRef = useRef<NodeJS.Timeout | null>(null)\r\n  const handleChange = useCallback(\r\n    (newValue: DataSurfaceViewMode | null) => {\r\n      if (changeTimeoutRef.current) {\r\n        clearTimeout(changeTimeoutRef.current)\r\n      }\r\n      changeTimeoutRef.current = setTimeout(() => {\r\n        if (newValue !== null && newValue !== value) {\r\n          onChange?.(newValue)\r\n        }\r\n      }, 250)\r\n    },\r\n    [value, onChange]\r\n  )\r\n\r\n  const displayModes = reverse ? [...viewModes].reverse() : viewModes\r\n\r\n  return (\r\n    <StyledToggleButtonGroup className={className} size={muiSize} value={value} exclusive onChange={(_, v) => handleChange(v)} aria-label='view mode'>\r\n      {displayModes.map((mode) => (\r\n        <Tooltip key={mode.value} title={mode.label} arrow>\r\n          <ToggleButton\r\n            value={mode.value}\r\n            aria-label={mode.label}\r\n            size={muiSize}\r\n            sx={{\r\n              p: onlyIcon ? '5px' : undefined,\r\n              minWidth: onlyIcon ? (muiSize === 'small' ? 36 : 44) : undefined\r\n            }}\r\n          >\r\n            {onlyIcon ? mode.icon : mode.label}\r\n          </ToggleButton>\r\n        </Tooltip>\r\n      ))}\r\n    </StyledToggleButtonGroup>\r\n  )\r\n}\r\n\r\nexport default ButtonSwitch\r\n\r\nconst StyledToggleButtonGroup = styled(ToggleButtonGroup)({\r\n  flex: '0 0 auto',\r\n  '.MuiToggleButtonGroup-grouped': {\r\n    '&.Mui-selected': {\r\n      color: colors.common.white,\r\n      backgroundColor: `var(--color-orange, ${colors.blue[600]})`,\r\n      borderColor: `var(--color-orange, ${colors.blue[600]})`,\r\n      '&.MuiToggleButtonGroup-lastButton': {\r\n        borderColor: `var(--color-orange, ${colors.blue[600]})`\r\n      },\r\n      '&:hover': {\r\n        backgroundColor: `var(--color-orange, ${colors.blue[600]})`\r\n      }\r\n    }\r\n  }\r\n})\r\n"],"names":["sizeMap","sm","md","viewModes","value","DataSurfaceViewMode","list","icon","_jsx","ViewListIcon","fontSize","label","grid","GridViewIcon","ButtonSwitch","props","onChange","_props$size","size","className","_props$onlyIcon","onlyIcon","_props$reverse","reverse","muiSize","changeTimeoutRef","useRef","handleChange","useCallback","newValue","current","clearTimeout","setTimeout","displayModes","concat","StyledToggleButtonGroup","exclusive","_","v","map","mode","Tooltip","title","arrow","children","ToggleButton","sx","p","undefined","minWidth","styled","ToggleButtonGroup","flex","color","colors","common","white","backgroundColor","blue","borderColor"],"mappings":"0UAeA,IAAMA,EAAU,CAAEC,GAAI,QAASC,GAAI,UAE7BC,EAAY,CAChB,CAAEC,MAAOC,EAAoBC,KAAMC,KAAMC,EAACC,EAAa,CAAAC,SAAS,UAAYC,MAAO,aACnF,CAAEP,MAAOC,EAAoBO,KAAML,KAAMC,EAACK,EAAa,CAAAH,SAAS,UAAYC,MAAO,cAGxEG,EAAuC,SAACC,GACnD,IAAQX,EAA+EW,EAA/EX,MAAOY,EAAwED,EAAxEC,SAAQC,EAAgEF,EAA9DG,KAAAA,OAAO,IAAHD,EAAG,KAAIA,EAAEE,EAAiDJ,EAAjDI,UAASC,EAAwCL,EAAtCM,SAAAA,OAAW,IAAHD,GAAQA,EAAAE,EAAsBP,EAApBQ,QAAAA,OAAU,IAAHD,GAAQA,EAC5EE,EAAUxB,EAAQkB,IAAS,QAE3BO,EAAmBC,EAA8B,MACjDC,EAAeC,EACnB,SAACC,GACKJ,EAAiBK,SACnBC,aAAaN,EAAiBK,SAEhCL,EAAiBK,QAAUE,WAAW,WACnB,OAAbH,GAAqBA,IAAazB,IACpCY,SAAAA,EAAWa,GAEd,EAAE,IACL,EACA,CAACzB,EAAOY,IAGJiB,EAAeV,EAAU,GAAAW,OAAI/B,GAAWoB,UAAYpB,EAE1D,OACEK,EAAC2B,EAAuB,CAAChB,UAAWA,EAAWD,KAAMM,EAASpB,MAAOA,EAAOgC,WAAU,EAAApB,SAAU,SAACqB,EAAGC,GAAC,OAAKX,EAAaW,EAAE,EAAa,aAAA,qBACnIL,EAAaM,IAAI,SAACC,GAAI,OACrBhC,EAACiC,EAAO,CAAkBC,MAAOF,EAAK7B,MAAOgC,OAAK,EAAAC,SAChDpC,EAACqC,GACCzC,MAAOoC,EAAKpC,MACA,aAAAoC,EAAK7B,MACjBO,KAAMM,EACNsB,GAAI,CACFC,EAAG1B,EAAW,WAAQ2B,EACtBC,SAAU5B,EAAwB,UAAZG,EAAsB,GAAK,QAAMwB,GAGxDJ,SAAAvB,EAAWmB,EAAKjC,KAAOiC,EAAK7B,SAVnB6B,EAAKpC,MAapB,IAGP,EAIM+B,EAA0Be,EAAOC,EAAPD,CAA0B,CACxDE,KAAM,WACN,gCAAiC,CAC/B,iBAAkB,CAChBC,MAAOC,EAAOC,OAAOC,MACrBC,gBAAe,uBAAAvB,OAAyBoB,EAAOI,KAAK,KAAO,KAC3DC,YAAW,uBAAAzB,OAAyBoB,EAAOI,KAAK,KAAO,KACvD,oCAAqC,CACnCC,YAAW,uBAAAzB,OAAyBoB,EAAOI,KAAK,KAAI,MAEtD,UAAW,CACTD,gBAAe,uBAAAvB,OAAyBoB,EAAOI,KAAK,KAAI"}

package/dist/src/lab/data-surface/helpers.js

@@ -1,2 +0,0 @@
-import{objectSpread2 as e}from"../../../_virtual/_rollupPluginBabelHelpers.js";import{QueryParam as r}from"../../utils/query-param.js";function i(e,i){if("undefined"!=typeof window)try{var o={mode:e===i?void 0:e};o.mode?r.replacePatch(o):r.replaceDeletes("mode")}catch(e){console.error("Error syncing view mode to URL:",e)}}function o(e){if("undefined"==typeof window)return e;try{var i=r.gets("mode");return i.mode?i.mode:e}catch(r){return console.error("Error getting view mode from URL:",r),e}}function a(e,i){var o,a;if("undefined"!=typeof window)try{if((o=e)===(a=i)||!o&&!a||o&&a&&o.page===a.page&&o.pageSize===a.pageSize)return void r.replaceDeletes("page","pageSize");if(!e)return void r.replaceDeletes("page","pageSize");var n={};void 0!==e.page&&e.page!==(null==i?void 0:i.page)&&(n.page=String(e.page)),void 0!==e.pageSize&&e.pageSize!==(null==i?void 0:i.pageSize)&&(n.pageSize=String(e.pageSize)),0===Object.keys(n).length?r.replaceDeletes("page","pageSize"):r.replacePatch(n)}catch(e){console.error("Error syncing pagination to URL:",e)}}function n(i){if("undefined"==typeof window)return i;try{var o=r.gets("page","pageSize"),a=o.page?parseInt(o.page,10):void 0,n=o.pageSize?parseInt(o.pageSize,10):void 0;return void 0===a&&void 0===n?i:e(e({},i),{},{page:void 0===a||isNaN(a)?null==i?void 0:i.page:a,pageSize:void 0===n||isNaN(n)?null==i?void 0:i.pageSize:n})}catch(e){return console.error("Error getting pagination from URL:",e),i}}export{n as getPaginationFromURL,o as getViewModeFromURL,a as setPaginationToURL,i as setViewModeToURL};
-//# sourceMappingURL=helpers.js.map