@movable/ui 3.0.0-alpha-v6.1 → 3.0.0

package/lib/components/Header/HeaderSubtitle.d.ts

@@ -1,5 +1,6 @@
-type HeaderSubtitleType = {
+import { TypographyProps } from '@mui/material';
+type HeaderSubtitleType = TypographyProps & {
     subtitle: string;
 };
-export declare function HeaderSubtitle({ subtitle }: HeaderSubtitleType): import("react/jsx-runtime").JSX.Element;
+export declare function HeaderSubtitle({ subtitle, sx, ...rest }: HeaderSubtitleType): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/components/Header/InkWorkflowHeader.d.ts

@@ -14,7 +14,7 @@ type InkWorkflowHeaderProps = {
     label: string;
     Stepper?: JSX.Element;
     ButtonGroup?: JSX.Element | ActionButtonPropType;
-    Subtitle?: JSX.Element;
+    subtitle?: string;
 };
-export declare function InkWorkflowHeader({ label, Stepper, ButtonGroup, Subtitle, }: InkWorkflowHeaderProps): import("react/jsx-runtime").JSX.Element;
+export declare function InkWorkflowHeader({ label, Stepper, ButtonGroup, subtitle, }: InkWorkflowHeaderProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/components/InkCard/InkCard.d.ts

@@ -0,0 +1,18 @@
+import { CardProps } from '@mui/material';
+import { InkCardHeaderProps } from './InkCardHeader';
+import { InkCardMediaProps } from './InkCardMedia';
+import { InkCardType } from './VariantStyles';
+import { GalleryContentProps } from './InkGalleryContent';
+type InkCardBaseProps = CardProps & {
+    cardHeader?: InkCardHeaderProps;
+    cardMedia?: InkCardMediaProps;
+    cardType?: InkCardType;
+};
+type InkCardProps = (InkCardBaseProps & {
+    galleryContent: GalleryContentProps;
+    cardType: 'gallery';
+}) | (InkCardBaseProps & {
+    galleryContent?: never;
+});
+export declare function InkCard({ cardMedia, cardHeader, cardType, galleryContent, children, ...rest }: InkCardProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/InkCard/InkCardHeader.d.ts

@@ -0,0 +1,11 @@
+import { CheckboxProps, TypographyProps } from '@mui/material';
+export interface InkCardHeaderProps {
+    checkboxProps?: CheckboxProps;
+    title?: string;
+    size?: 'small' | 'medium';
+    subheader?: string;
+    adornment?: JSX.Element;
+    titleProps?: TypographyProps;
+    onClose?: () => void;
+}
+export declare function InkCardHeader({ checkboxProps, title, size, subheader, adornment, titleProps, onClose, }: InkCardHeaderProps): import("react/jsx-runtime").JSX.Element | null;

package/lib/components/InkCard/InkCardMedia.d.ts

@@ -0,0 +1,7 @@
+import { CardMediaProps } from '@mui/material';
+import { InkCardType } from './VariantStyles';
+export interface InkCardMediaProps extends CardMediaProps {
+    mediaContent?: JSX.Element;
+    cardType?: InkCardType;
+}
+export declare function InkCardMedia({ mediaContent, image, cardType, sx, ...rest }: InkCardMediaProps): import("react/jsx-runtime").JSX.Element;

package/lib/components/InkCard/InkCardMediaLoader.d.ts

@@ -0,0 +1 @@
+export declare function InkCardMediaLoader(): import("react/jsx-runtime").JSX.Element;

package/lib/components/InkCard/InkGalleryContent.d.ts

@@ -0,0 +1,8 @@
+import { ButtonProps } from '@mui/material';
+export type GalleryContentProps = {
+    description?: string;
+    buttonProps?: ButtonProps & {
+        label?: string;
+    };
+};
+export declare function InkGalleryContent({ description, buttonProps, }: GalleryContentProps): import("react/jsx-runtime").JSX.Element;

package/lib/components/InkCard/VariantStyles.d.ts

@@ -0,0 +1,5 @@
+import type { SxProps, Theme } from '@mui/material/styles';
+export type InkCardType = 'default' | 'gallery' | 'metric' | 'insight';
+export declare const MAX_CARD_WIDTH = 382;
+export declare const getComposedCardStyles: (isSelectable: boolean, isSelected: boolean, isDisabled?: boolean, cardType?: InkCardType, customSx?: SxProps<Theme>) => SxProps<Theme>;
+export declare const getGalleryCardStyles: () => SxProps<Theme>;

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

@@ -0,0 +1 @@
+export { InkCard } from './InkCard';

package/lib/components/InkChart/InkChart.d.ts

@@ -0,0 +1,15 @@
+type ChartTypes = 'line' | 'bar' | 'pie';
+import type { ChartOptions, ChartData } from 'chart.js';
+export type ChartProps<T extends ChartTypes> = {
+    type: T;
+    data?: ChartData<T>;
+    chartOptions?: ChartOptions<T>;
+    legend?: boolean;
+    customColors?: string[];
+    height?: number;
+    isLoading?: boolean;
+    stacked?: boolean;
+    title?: string;
+};
+export default function InkChart<T extends ChartTypes>({ chartOptions, type, data, customColors, height, isLoading, stacked, legend, title, }: ChartProps<T>): import("react/jsx-runtime").JSX.Element | undefined;
+export {};

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

@@ -0,0 +1 @@
+export { default as InkChart } from './InkChart';

package/lib/components/InkDrawer/InkDrawer.d.ts

@@ -1,18 +1,24 @@
 import { PropsWithChildren } from 'react';
-import { BoxProps, DrawerProps } from '@mui/material';
+import { BoxProps, DrawerProps, SxProps, Theme } from '@mui/material';
 import { SvgIconTypeMap } from '@mui/material';
 import { OverridableComponent } from '@mui/material/OverridableComponent';
 type DrawerType = 'basic' | 'panel' | 'filter';
+declare const defaultDrawerWidths: {
+    md: number;
+    lg: number;
+    xl: number;
+};
 interface CommonDrawerProps extends DrawerProps {
     drawerType: DrawerType;
     drawerContent: JSX.Element;
-    drawerWidth?: number;
+    drawerWidth?: number | Partial<typeof defaultDrawerWidths>;
     leftOffset?: string;
     bottomContent?: JSX.Element;
     headerLabel?: string;
     isComponentLevelDrawer?: boolean;
     mainProps?: BoxProps;
     icon?: JSX.Element | OverridableComponent<SvgIconTypeMap<object, 'svg'>>;
+    paperSx?: SxProps<Theme> | undefined;
 }
 interface CollapsibleDrawerProps extends CommonDrawerProps {
     drawerType: 'basic' | 'filter';
@@ -23,6 +29,5 @@ interface PanelDrawerProps extends CommonDrawerProps {
     drawerType: 'panel';
 }
 type InkDrawerProps = CollapsibleDrawerProps | PanelDrawerProps;
-export declare const defaultFilterDrawerWidth = 280;
 export declare function InkDrawer(props: PropsWithChildren<InkDrawerProps>): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/components/InkGridToolBar/ExportButton.d.ts

@@ -0,0 +1,6 @@
+interface IExportButton {
+    loadingExport?: boolean;
+    onClick?: () => void;
+}
+export declare function ExportButton({ onClick, loadingExport }: IExportButton): import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/InkGridToolBar/FiltersButton.d.ts

@@ -0,0 +1,5 @@
+interface IFiltersButton {
+    onClick: () => void;
+}
+export declare function FiltersButton({ onClick }: IFiltersButton): import("react/jsx-runtime").JSX.Element;
+export {};

package/lib/components/InkGridToolBar/GridToolbarGroup.d.ts

@@ -0,0 +1,7 @@
+export interface IGridToolbarGroupProps {
+    value: string;
+    onChange: (value: string) => void;
+    options: string[];
+    children?: React.ReactNode;
+}
+export declare function GridToolbarGroup({ value, onChange, options, }: IGridToolbarGroupProps): import("react/jsx-runtime").JSX.Element;

package/lib/components/InkGridToolBar/InkGridToolBar.d.ts

@@ -0,0 +1,27 @@
+import { GridColDef, GridColumnVisibilityModel } from '@mui/x-data-grid-premium';
+import { IGridToolbarGroupProps } from './GridToolbarGroup';
+export interface IInkGridToolBarProps {
+    groupingProps?: IGridToolbarGroupProps;
+    showFilterDrawerBtn?: boolean;
+    showQuickFilter?: boolean;
+    showExportButton?: boolean;
+    showFilterButton?: boolean;
+    showDensitySelector?: boolean;
+    showColumnButton?: boolean;
+    onExportClick?: () => void;
+    loadingExport?: boolean;
+    children?: React.ReactNode;
+    columnPickerProps?: {
+        columnData: GridColDef[];
+        handleColumnFilterChange: (columnVisibilityModel: GridColumnVisibilityModel) => void;
+        customGridVisibility: GridColumnVisibilityModel;
+        lockedFields?: string[];
+        hiddenInColumnPicker?: string[];
+    };
+    filterDrawerBtnProps?: {
+        onShowFilterDrawerClick: () => void;
+        filterBtnBadgeContent?: string;
+    };
+    py?: number;
+}
+export declare function InkGridToolBar({ groupingProps, filterDrawerBtnProps, showFilterDrawerBtn, showQuickFilter, showExportButton, showDensitySelector, onExportClick, loadingExport, columnPickerProps, children, py, }: IInkGridToolBarProps): import("react/jsx-runtime").JSX.Element;

package/lib/components/InkGridToolBar/TableFilterColumnPicker.d.ts

@@ -0,0 +1,10 @@
+import { GridColDef, GridColumnVisibilityModel } from '@mui/x-data-grid-premium';
+interface ITableActionsColumnPickerProps {
+    columnData: GridColDef[];
+    handleColumnFilterChange: (columnVisibilityModel: GridColumnVisibilityModel) => void;
+    customGridVisibility: GridColumnVisibilityModel;
+    lockedFields?: string[];
+    hiddenInColumnPicker?: string[];
+}
+export declare function TableFilterColumnPicker({ columnData, handleColumnFilterChange, customGridVisibility, lockedFields, hiddenInColumnPicker, }: ITableActionsColumnPickerProps): import("react/jsx-runtime").JSX.Element;
+export {};

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

@@ -0,0 +1 @@
+export { InkGridToolBar } from './InkGridToolBar';

package/lib/components/InkSelect/InkFormSelect.d.ts

@@ -1,5 +1,5 @@
 import { UseControllerProps, FieldPath, FieldValues } from 'react-hook-form';
 import { InkSelectProps } from '.';
 type InkFormSelectProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = InkSelectProps & UseControllerProps<TFieldValues, TName>;
-export declare function InkFormSelect<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({ control, name, rules, helperText, onChange, onBlur, ...rest }: InkFormSelectProps<TFieldValues, TName>): import("react/jsx-runtime").JSX.Element;
+export declare function InkFormSelect<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({ control, name, rules, helperText, onChange, onBlur, disabled, ...rest }: InkFormSelectProps<TFieldValues, TName>): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/components/index.d.ts

@@ -21,3 +21,6 @@ export * from './InkSwitch';
 export * from './InkTextField';
 export * from './InkSelect';
 export { InternalUseOnlyLabel, InternalUseOnlyAlert, } from './InternalUseOnlyIndicators';
+export { InkChart } from './InkChart';
+export { InkCard } from './InkCard';
+export { InkGridToolBar } from './InkGridToolBar';

package/lib/index.d.ts

@@ -3,7 +3,12 @@ import { BoxProps } from '@mui/material';
 import { BoxProps as BoxProps_2 } from '@mui/material/Box';
 import { ButtonProps } from '@mui/material';
 import { ButtonProps as ButtonProps_2 } from '@mui/material/Button';
-import { CheckboxProps } from '@mui/material/Checkbox';
+import { CardMediaProps } from '@mui/material';
+import { CardProps } from '@mui/material';
+import type { ChartData } from 'chart.js';
+import type { ChartOptions } from 'chart.js';
+import { CheckboxProps } from '@mui/material';
+import { CheckboxProps as CheckboxProps_2 } from '@mui/material/Checkbox';
 import { ChipProps } from '@mui/material';
 import { CustomContentProps } from 'notistack';
 import type { DialogProps } from '@mui/material/Dialog';
@@ -16,7 +21,10 @@ import { FormControlLabelProps } from '@mui/material/FormControlLabel';
 import { FormGroupProps } from '@mui/material/FormGroup';
 import { FormLabelProps } from '@mui/material/FormLabel';
 import { ForwardRefExoticComponent } from 'react';
+import { GridColDef } from '@mui/x-data-grid-premium';
+import { GridColumnVisibilityModel } from '@mui/x-data-grid-premium';
 import { GridProps } from '@mui/material/Grid';
+import { GridProps as GridProps_2 } from '@mui/material';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { LinkProps } from '@mui/material';
 import { ListItemIconProps } from '@mui/material/ListItemIcon';
@@ -46,6 +54,7 @@ import { TextFieldProps } from '@mui/material/TextField';
 import { Theme } from '@mui/material';
 import { ToggleButtonGroupProps } from '@mui/material';
 import { ToggleButtonProps } from '@mui/material';
+import { TypographyProps } from '@mui/material';
 import { UseControllerProps } from 'react-hook-form';
 import { VariantType as VariantType_2 } from 'notistack';
 
@@ -79,6 +88,20 @@ declare type ButtonPropsType = ButtonProps & {
     label: ReactNode;
 };
 
+declare type ChartProps<T extends ChartTypes> = {
+    type: T;
+    data?: ChartData<T>;
+    chartOptions?: ChartOptions<T>;
+    legend?: boolean;
+    customColors?: string[];
+    height?: number;
+    isLoading?: boolean;
+    stacked?: boolean;
+    title?: string;
+};
+
+declare type ChartTypes = 'line' | 'bar' | 'pie';
+
 declare type closeButtonType = {
     onClick: (e?: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
 };
@@ -92,26 +115,33 @@ declare interface CollapsibleDrawerProps extends CommonDrawerProps {
 declare interface CommonDrawerProps extends DrawerProps_2 {
     drawerType: DrawerType;
     drawerContent: JSX.Element;
-    drawerWidth?: number;
+    drawerWidth?: number | Partial<typeof defaultDrawerWidths>;
     leftOffset?: string;
     bottomContent?: JSX.Element;
     headerLabel?: string;
     isComponentLevelDrawer?: boolean;
     mainProps?: BoxProps;
     icon?: JSX.Element | OverridableComponent<SvgIconTypeMap<object, 'svg'>>;
+    paperSx?: SxProps<Theme> | undefined;
 }
 
 declare type CopiedValue = string | null;
 
 declare type CopyFn = (text: string) => Promise<boolean>;
 
+declare const defaultDrawerWidths: {
+    md: number;
+    lg: number;
+    xl: number;
+};
+
 export declare function DemoComponent({ stringToDisplay }: DemoComponentProps): JSX_2.Element;
 
 declare type DemoComponentProps = {
     stringToDisplay: string;
 };
 
-export declare function DetailsLayout({ Header, children, sx, ...rest }: LayoutDetailsProps): JSX_2.Element;
+export declare function DetailsLayout({ Header, children, sx, itemProps, ...rest }: LayoutDetailsProps): JSX_2.Element;
 
 declare type DrawerType = 'basic' | 'panel' | 'filter';
 
@@ -122,8 +152,33 @@ declare type DropdownActionType = {
     internalUseOnlyItems?: ReactNode[];
 };
 
+export declare function EightColumnFullContentLayout({ children, itemProps, containerProps, }: EightColumnFullContentLayoutProps): JSX_2.Element;
+
+declare type EightColumnFullContentLayoutProps = {
+    children: React.ReactNode;
+    containerProps?: GridProps_2;
+    itemProps?: GridProps_2;
+};
+
+export declare function FiveThreeSplitContentLayout({ leftContent, rightContent, containerProps, leftProps, rightProps, }: FiveThreeSplitContentLayoutProps): JSX_2.Element;
+
+declare type FiveThreeSplitContentLayoutProps = {
+    leftContent: React.ReactNode;
+    rightContent: React.ReactNode;
+    containerProps?: GridProps_2;
+    leftProps?: GridProps_2;
+    rightProps?: GridProps_2;
+};
+
 export declare const FormSkeletonGrid: ({ skeletonRows, skeletonColumns, }: SkeletonGridType) => JSX_2.Element;
 
+declare type GalleryContentProps = {
+    description?: string;
+    buttonProps?: ButtonProps & {
+        label?: string;
+    };
+};
+
 declare type HeaderLink = {
     label: string;
     path?: string;
@@ -147,9 +202,9 @@ declare type HeaderMetadataType = {
     value: string | JSX.Element;
 };
 
-export declare function HeaderSubtitle({ subtitle }: HeaderSubtitleType): JSX_2.Element;
+export declare function HeaderSubtitle({ subtitle, sx, ...rest }: HeaderSubtitleType): JSX_2.Element;
 
-declare type HeaderSubtitleType = {
+declare type HeaderSubtitleType = TypographyProps & {
     subtitle: string;
 };
 
@@ -165,6 +220,38 @@ declare type IFilterDrawer = DrawerProps & {
     mainProps?: BoxProps;
 };
 
+declare interface IGridToolbarGroupProps {
+    value: string;
+    onChange: (value: string) => void;
+    options: string[];
+    children?: React.ReactNode;
+}
+
+declare interface IInkGridToolBarProps {
+    groupingProps?: IGridToolbarGroupProps;
+    showFilterDrawerBtn?: boolean;
+    showQuickFilter?: boolean;
+    showExportButton?: boolean;
+    showFilterButton?: boolean;
+    showDensitySelector?: boolean;
+    showColumnButton?: boolean;
+    onExportClick?: () => void;
+    loadingExport?: boolean;
+    children?: React.ReactNode;
+    columnPickerProps?: {
+        columnData: GridColDef[];
+        handleColumnFilterChange: (columnVisibilityModel: GridColumnVisibilityModel) => void;
+        customGridVisibility: GridColumnVisibilityModel;
+        lockedFields?: string[];
+        hiddenInColumnPicker?: string[];
+    };
+    filterDrawerBtnProps?: {
+        onShowFilterDrawerClick: () => void;
+        filterBtnBadgeContent?: string;
+    };
+    py?: number;
+}
+
 export declare function IndexLayout({ Header, children, sx, ...containerProps }: IndexLayoutProps): JSX_2.Element;
 
 declare type IndexLayoutProps = GridProps & {
@@ -186,6 +273,40 @@ declare type InkAttributeProps = ListItemTextProps & {
     };
 };
 
+export declare function InkCard({ cardMedia, cardHeader, cardType, galleryContent, children, ...rest }: InkCardProps): JSX_2.Element;
+
+declare type InkCardBaseProps = CardProps & {
+    cardHeader?: InkCardHeaderProps;
+    cardMedia?: InkCardMediaProps;
+    cardType?: InkCardType;
+};
+
+declare interface InkCardHeaderProps {
+    checkboxProps?: CheckboxProps;
+    title?: string;
+    size?: 'small' | 'medium';
+    subheader?: string;
+    adornment?: JSX.Element;
+    titleProps?: TypographyProps;
+    onClose?: () => void;
+}
+
+declare interface InkCardMediaProps extends CardMediaProps {
+    mediaContent?: JSX.Element;
+    cardType?: InkCardType;
+}
+
+declare type InkCardProps = (InkCardBaseProps & {
+    galleryContent: GalleryContentProps;
+    cardType: 'gallery';
+}) | (InkCardBaseProps & {
+    galleryContent?: never;
+});
+
+declare type InkCardType = 'default' | 'gallery' | 'metric' | 'insight';
+
+export declare function InkChart<T extends ChartTypes>({ chartOptions, type, data, customColors, height, isLoading, stacked, legend, title, }: ChartProps<T>): JSX_2.Element | undefined;
+
 export declare const InkCheckboxGroup: ForwardRefExoticComponent<InkCheckboxGroupProps & RefAttributes<HTMLDivElement>>;
 
 export declare class inkCheckboxGroup {
@@ -211,7 +332,7 @@ export declare type InkCheckboxGroupProps = {
     options: {
         value: string;
         label: string;
-        checkboxProps?: CheckboxProps;
+        checkboxProps?: CheckboxProps_2;
     }[];
     formGroupProps?: FormGroupProps;
     formLabel: string;
@@ -299,7 +420,7 @@ export declare function InkFormRadioGroup<TFieldValues extends FieldValues, TNam
 
 declare type InkFormRadioGroupProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = InkRadioGroupProps & UseControllerProps<TFieldValues, TName>;
 
-export declare function InkFormSelect<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({ control, name, rules, helperText, onChange, onBlur, ...rest }: InkFormSelectProps<TFieldValues, TName>): JSX_2.Element;
+export declare function InkFormSelect<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({ control, name, rules, helperText, onChange, onBlur, disabled, ...rest }: InkFormSelectProps<TFieldValues, TName>): JSX_2.Element;
 
 declare type InkFormSelectProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> = InkSelectProps & UseControllerProps<TFieldValues, TName>;
 
@@ -315,6 +436,8 @@ declare type InkFormTextFieldProps<TFieldValues extends FieldValues, TName exten
     label: string;
 } & UseControllerProps<TFieldValues, TName> & TextFieldProps;
 
+export declare function InkGridToolBar({ groupingProps, filterDrawerBtnProps, showFilterDrawerBtn, showQuickFilter, showExportButton, showDensitySelector, onExportClick, loadingExport, columnPickerProps, children, py, }: IInkGridToolBarProps): JSX_2.Element;
+
 export declare function InkImage({ src, alt, sx, imageSx, fallbackText, ...rest }: InkImageProps): JSX_2.Element;
 
 declare type InkImageProps = BoxProps_2 & {
@@ -437,6 +560,7 @@ export declare class inkSelect {
     hasDisplayValue(value: string): Cypress.Chainable<JQuery<HTMLElement>>;
     hasValue(value: string): Cypress.Chainable<JQuery<HTMLElement>>;
     hasOption(label: string, value: string, index?: number): void;
+    isDisabled(): Cypress.Chainable<JQuery<HTMLElement>>;
     closeMenu(): void;
     openMenu(): void;
 }
@@ -597,7 +721,7 @@ declare type InkToggleTextProps = ToggleButtonProps & {
     value: string | number;
 };
 
-export declare function InkWorkflowHeader({ label, Stepper, ButtonGroup, Subtitle, }: InkWorkflowHeaderProps): JSX_2.Element;
+export declare function InkWorkflowHeader({ label, Stepper, ButtonGroup, subtitle, }: InkWorkflowHeaderProps): JSX_2.Element;
 
 export declare const inkWorkflowHeader: InkWorkflowHeaderPageObject;
 
@@ -614,7 +738,7 @@ declare type InkWorkflowHeaderProps = {
     label: string;
     Stepper?: JSX.Element;
     ButtonGroup?: JSX.Element | ActionButtonPropType;
-    Subtitle?: JSX.Element;
+    subtitle?: string;
 };
 
 export declare function InternalUseOnlyAlert({ message, sx, messageSx, }: InternalUseOnlyAlertProp): JSX_2.Element;
@@ -640,6 +764,7 @@ declare type IPageWrapperProps = {
 declare type LayoutDetailsProps = GridProps & {
     Header: JSX.Element;
     children: React.ReactNode;
+    itemProps?: GridProps;
 };
 
 export declare function LinkBreadcrumbs({ breadcrumbs }: BreadcrumbProps): JSX_2.Element;
@@ -706,11 +831,32 @@ declare interface PanelDrawerProps extends CommonDrawerProps {
     drawerType: 'panel';
 }
 
+export declare function PanelWithPaperContentLayout({ children, panelContent, wrapperProps, panelProps, containerProps, itemProps, }: PanelWithPaperContentLayoutProps): JSX_2.Element;
+
+declare type PanelWithPaperContentLayoutProps = React.PropsWithChildren<{
+    panelContent: React.ReactNode;
+    children: React.ReactNode;
+    wrapperProps?: BoxProps;
+    panelProps?: BoxProps;
+    containerProps?: GridProps_2;
+    itemProps?: GridProps_2;
+}>;
+
 declare type PrimaryButtonType = ButtonProps & {
     label: string;
     loading?: boolean;
 };
 
+export declare function SevenThreeSplitContentLayout({ leftContent, rightContent, containerProps, leftProps, rightProps, }: SevenThreeSplitContentLayoutProps): JSX_2.Element;
+
+declare type SevenThreeSplitContentLayoutProps = {
+    leftContent: React.ReactNode;
+    rightContent: React.ReactNode;
+    containerProps?: GridProps_2;
+    leftProps?: GridProps_2;
+    rightProps?: GridProps_2;
+};
+
 declare type SkeletonGridType = {
     skeletonRows: number;
     skeletonColumns: number;
@@ -718,15 +864,24 @@ declare type SkeletonGridType = {
 
 export declare function SnackbarActionButton({ closeSnackbar, label, ...buttonProps }: InkSnackbarActionButtonProps): JSX_2.Element;
 
+export declare function TenColumnFullContentLayout({ children, itemProps, containerProps, }: TenColumnFullContentLayoutProps): JSX_2.Element;
+
+declare type TenColumnFullContentLayoutProps = {
+    children: React.ReactNode;
+    containerProps?: GridProps_2;
+    itemProps?: GridProps_2;
+};
+
 export declare function useCopyToClipboard(): [CopiedValue, CopyFn];
 
 declare type VariantType = 'page' | 'paper' | 'search' | 'data';
 
-export declare function WorkflowLayout({ Header, children, sx, ...rest }: WorkflowLayoutProps): JSX_2.Element;
+export declare function WorkflowLayout({ Header, children, sx, itemProps, ...rest }: WorkflowLayoutProps): JSX_2.Element;
 
 declare type WorkflowLayoutProps = GridProps & {
     Header: JSX.Element;
     children: React.ReactNode;
+    itemProps?: GridProps;
 };
 
 export { }