@movable/ui 3.0.0 → 3.1.1

package/lib/components/InkDataGrid/CreateEmptyColumns.d.ts

@@ -0,0 +1,9 @@
+import { GridColDef } from '@mui/x-data-grid-premium';
+/**
+ * Creates empty column definitions with skeleton loading placeholders.
+ * Used to maintain grid structure while showing loading state.
+ *
+ * @param columns - The original column definitions to create empty versions of
+ * @returns Array of column definitions with skeleton renderCell functions
+ */
+export declare function createEmptyColumns(columns: GridColDef[]): GridColDef[];

package/lib/components/InkDataGrid/InkDataGrid.d.ts

@@ -0,0 +1,12 @@
+import { DataGridPremiumProps } from '@mui/x-data-grid-premium';
+export interface InkDataGridProps extends DataGridPremiumProps {
+    /**
+     * Test selector for automated testing
+     */
+    testSelector?: string;
+}
+/**
+ * InkDataGrid is a customized DataGridPremium component with Movable Ink styling and behavior.
+ * It provides automatic height adjustment, hidden column separators, and transparent row hover effects.
+ */
+export declare function InkDataGrid({ testSelector, sx, rows, ...rest }: InkDataGridProps): import("react/jsx-runtime").JSX.Element;

package/lib/components/InkDataGrid/InkDataGridEmpty.d.ts

@@ -0,0 +1,16 @@
+import { GridColDef } from '@mui/x-data-grid-premium';
+export interface InkDataGridEmptyProps {
+    /**
+     * Test selector for automated testing
+     */
+    testSelector?: string;
+    /**
+     * Column definitions to display in the empty state grid
+     */
+    emptyColumns: GridColDef[];
+}
+/**
+ * InkDataGridEmpty displays an empty state grid with skeleton rows.
+ * Used to show the grid structure while data is loading.
+ */
+export declare function InkDataGridEmpty({ testSelector, emptyColumns, }: InkDataGridEmptyProps): import("react/jsx-runtime").JSX.Element;

package/lib/components/InkDataGrid/index.d.ts

@@ -0,0 +1,3 @@
+export { InkDataGrid, type InkDataGridProps } from './InkDataGrid';
+export { InkDataGridEmpty, type InkDataGridEmptyProps, } from './InkDataGridEmpty';
+export { createEmptyColumns } from './CreateEmptyColumns';

package/lib/components/index.d.ts

@@ -24,3 +24,4 @@ export { InternalUseOnlyLabel, InternalUseOnlyAlert, } from './InternalUseOnlyIn
 export { InkChart } from './InkChart';
 export { InkCard } from './InkCard';
 export { InkGridToolBar } from './InkGridToolBar';
+export { InkDataGrid, InkDataGridEmpty, createEmptyColumns, type InkDataGridProps, type InkDataGridEmptyProps, } from './InkDataGrid';

package/lib/index.d.ts

@@ -11,6 +11,7 @@ import { CheckboxProps } from '@mui/material';
 import { CheckboxProps as CheckboxProps_2 } from '@mui/material/Checkbox';
 import { ChipProps } from '@mui/material';
 import { CustomContentProps } from 'notistack';
+import { DataGridPremiumProps } from '@mui/x-data-grid-premium';
 import type { DialogProps } from '@mui/material/Dialog';
 import { DrawerProps } from '@mui/material/Drawer';
 import { DrawerProps as DrawerProps_2 } from '@mui/material';
@@ -51,7 +52,8 @@ import { SvgIconTypeMap } from '@mui/material';
 import { SwitchProps } from '@mui/material/Switch';
 import { SxProps } from '@mui/material';
 import { TextFieldProps } from '@mui/material/TextField';
-import { Theme } from '@mui/material';
+import { Theme } from '@mui/material/styles';
+import { Theme as Theme_2 } from '@mui/material';
 import { ToggleButtonGroupProps } from '@mui/material';
 import { ToggleButtonProps } from '@mui/material';
 import { TypographyProps } from '@mui/material';
@@ -122,13 +124,22 @@ declare interface CommonDrawerProps extends DrawerProps_2 {
     isComponentLevelDrawer?: boolean;
     mainProps?: BoxProps;
     icon?: JSX.Element | OverridableComponent<SvgIconTypeMap<object, 'svg'>>;
-    paperSx?: SxProps<Theme> | undefined;
+    paperSx?: SxProps<Theme_2> | undefined;
 }
 
 declare type CopiedValue = string | null;
 
 declare type CopyFn = (text: string) => Promise<boolean>;
 
+/**
+ * Creates empty column definitions with skeleton loading placeholders.
+ * Used to maintain grid structure while showing loading state.
+ *
+ * @param columns - The original column definitions to create empty versions of
+ * @returns Array of column definitions with skeleton renderCell functions
+ */
+export declare function createEmptyColumns(columns: GridColDef[]): GridColDef[];
+
 declare const defaultDrawerWidths: {
     md: number;
     lg: number;
@@ -364,6 +375,36 @@ declare type InkChipPropType = {
     truncation?: 'end' | 'middle';
 };
 
+/**
+ * InkDataGrid is a customized DataGridPremium component with Movable Ink styling and behavior.
+ * It provides automatic height adjustment, hidden column separators, and transparent row hover effects.
+ */
+export declare function InkDataGrid({ testSelector, sx, rows, ...rest }: InkDataGridProps): JSX_2.Element;
+
+/**
+ * InkDataGridEmpty displays an empty state grid with skeleton rows.
+ * Used to show the grid structure while data is loading.
+ */
+export declare function InkDataGridEmpty({ testSelector, emptyColumns, }: InkDataGridEmptyProps): JSX_2.Element;
+
+export declare interface InkDataGridEmptyProps {
+    /**
+     * Test selector for automated testing
+     */
+    testSelector?: string;
+    /**
+     * Column definitions to display in the empty state grid
+     */
+    emptyColumns: GridColDef[];
+}
+
+export declare interface InkDataGridProps extends DataGridPremiumProps {
+    /**
+     * Test selector for automated testing
+     */
+    testSelector?: string;
+}
+
 export declare function InkDialog({ Title, Content, Actions, onClose, hideCloseButton, ActionsProp, ...props }: InkDialogProps): JSX_2.Element;
 
 export declare const inkDialog: InkDialogPageObject;
@@ -409,7 +450,7 @@ declare type InkEmptyStateProps = {
     action?: ActionType;
     variant: VariantType;
     icon?: JSX.Element | OverridableComponent<SvgIconTypeMap<object, 'svg'>>;
-    sx?: SxProps<Theme>;
+    sx?: SxProps<Theme_2>;
 };
 
 export declare function InkFormCheckboxGroup<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({ control, name, rules, onChange, ...rest }: InkFormCheckboxGroupProps<TFieldValues, TName>): JSX_2.Element;
@@ -467,7 +508,7 @@ declare type InkPageHeaderProps = {
     ButtonGroup?: JSX.Element;
     Chips?: JSX.Element;
     Tabs?: JSX.Element;
-    sx?: SxProps<Theme>;
+    sx?: SxProps<Theme_2>;
 };
 
 export declare function InkPaper({ Header, Description, Icon, CTA, children, shouldShowFullDescription, isLoading, loadingSkeleton, ...props }: InkPaperProps): JSX_2.Element;
@@ -535,7 +576,7 @@ export declare type InkRadioTilesProps = {
     value: string | number;
     ref?: Ref<HTMLDivElement>;
     direction?: 'row' | 'column';
-    cardSx?: SxProps<Theme>;
+    cardSx?: SxProps<Theme_2>;
     fullWidth?: boolean;
     disabled?: boolean;
 };