@tap-payments/os-micro-frontend-shared 0.1.376-test.1 → 0.1.376-test.1-test.2-test.3-test.4-test.5

package/build/components/TableHeader/TableView/hooks/useViewsMenu.d.ts

@@ -0,0 +1,44 @@
+import { type MouseEvent } from 'react';
+import type { ColumnViewProps, TableMode } from '../../../../types/index.js';
+import type { ViewMenuItem, LayoutSection } from '../types';
+import type { ViewOption } from '../../type';
+export interface UseViewsMenuProps {
+    mode: TableMode;
+    onViewChange?: (selectedView?: ViewMenuItem) => void;
+    onCreateCustomView?: (data: {
+        name: string;
+        selectedColumns: ColumnViewProps[];
+        layout: LayoutSection;
+    }) => Promise<void>;
+    onEditCustomView?: (viewId: string, data: {
+        name: string;
+        selectedColumns: ColumnViewProps[];
+        layout: LayoutSection;
+    }) => Promise<void>;
+    onDeleteCustomView?: (viewId: string) => Promise<void>;
+    defaultColumns: ColumnViewProps[];
+    defaultTemplate?: ViewMenuItem;
+    allTemplates: ViewMenuItem[];
+}
+export declare const useViewsMenu: ({ mode, onViewChange, onCreateCustomView, onEditCustomView, onDeleteCustomView, defaultColumns, defaultTemplate, allTemplates, }: UseViewsMenuProps) => {
+    anchorEl: HTMLDivElement | null;
+    isCreateDialogOpen: boolean;
+    editingView: ViewMenuItem | null;
+    selectedViewInfo: ViewOption;
+    shouldUseCurrentState: boolean;
+    selectedView: ViewMenuItem | undefined;
+    currentViewColumns: ColumnViewProps[];
+    handleViewButtonClick: (event: MouseEvent<HTMLDivElement>) => void;
+    handleCloseViewDropdown: () => void;
+    handleSelectedViewInfo: (selected: ViewOption, viewMenuItem?: ViewMenuItem) => void;
+    handleOpenCreateDialog: (useCurrentState?: boolean) => void;
+    handleOpenEditDialog: (view: ViewMenuItem) => void;
+    handleCloseCreateDialog: () => void;
+    handleSaveView: (data: {
+        name: string;
+        selectedColumns: ColumnViewProps[];
+        layout: LayoutSection;
+    }) => Promise<void>;
+    handleDeleteView: (viewId: string) => Promise<void>;
+    updateSelectedView: (updatedView: ViewMenuItem) => void;
+};

package/build/components/TableHeader/TableView/hooks/useViewsMenu.js

@@ -0,0 +1,177 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { useState, useCallback, useEffect, useRef } from 'react';
+import { deepCloneColumns } from '../utils';
+export const useViewsMenu = ({ mode, onViewChange, onCreateCustomView, onEditCustomView, onDeleteCustomView, defaultColumns, defaultTemplate, allTemplates, }) => {
+    const [anchorEl, setAnchorEl] = useState(null);
+    const [isCreateDialogOpen, setIsCreateDialogOpen] = useState(false);
+    const [editingView, setEditingView] = useState(null);
+    const [selectedViewInfo, setSelectedViewInfo] = useState({ id: 'default', label: 'Default' });
+    const [shouldUseCurrentState, setShouldUseCurrentState] = useState(false);
+    const [selectedView, setSelectedView] = useState(undefined);
+    const [currentViewColumns, setCurrentViewColumns] = useState([]);
+    const hasInitializedRef = useRef(false);
+    const getViewForParent = useCallback((view) => {
+        var _a;
+        const selectedColumns = ((_a = view.submenu) === null || _a === void 0 ? void 0 : _a.filter((col) => col.selected)) || [];
+        return Object.assign(Object.assign({}, view), { submenu: selectedColumns, columns: selectedColumns.map((col) => col.name) });
+    }, []);
+    useEffect(() => {
+        if (hasInitializedRef.current)
+            return;
+        if (!defaultTemplate)
+            return;
+        setSelectedView(defaultTemplate);
+        setCurrentViewColumns(deepCloneColumns(defaultColumns));
+        onViewChange === null || onViewChange === void 0 ? void 0 : onViewChange(getViewForParent(defaultTemplate));
+        hasInitializedRef.current = true;
+    }, [defaultTemplate, defaultColumns, onViewChange, getViewForParent]);
+    useEffect(() => {
+        if (!hasInitializedRef.current)
+            return;
+        if ((selectedView === null || selectedView === void 0 ? void 0 : selectedView.default) && defaultColumns.length > 0) {
+            setCurrentViewColumns(deepCloneColumns(defaultColumns));
+        }
+    }, [defaultColumns, selectedView === null || selectedView === void 0 ? void 0 : selectedView.default]);
+    const lastSyncedModeRef = useRef(null);
+    useEffect(() => {
+        if (!hasInitializedRef.current)
+            return;
+        if (!selectedView)
+            return;
+        const needsSync = lastSyncedModeRef.current !== mode;
+        if (!needsSync)
+            return;
+        if (selectedView.default) {
+            if (defaultColumns.length === 0)
+                return;
+            const newView = Object.assign(Object.assign({}, selectedView), { submenu: deepCloneColumns(defaultColumns), columns: defaultColumns.map((col) => col.name) });
+            setSelectedView(newView);
+            setCurrentViewColumns(deepCloneColumns(defaultColumns));
+            lastSyncedModeRef.current = mode;
+            onViewChange === null || onViewChange === void 0 ? void 0 : onViewChange(getViewForParent(newView));
+        }
+        else {
+            const updatedTemplate = allTemplates.find((t) => t.templateId === selectedView.templateId || t.id === selectedView.id);
+            if (updatedTemplate && updatedTemplate.submenu && updatedTemplate.submenu.length > 0) {
+                const newView = Object.assign(Object.assign({}, updatedTemplate), { submenu: deepCloneColumns(updatedTemplate.submenu) });
+                setSelectedView(newView);
+                setCurrentViewColumns(deepCloneColumns(updatedTemplate.submenu));
+                lastSyncedModeRef.current = mode;
+                onViewChange === null || onViewChange === void 0 ? void 0 : onViewChange(getViewForParent(newView));
+            }
+        }
+    }, [mode, defaultColumns, selectedView, allTemplates, onViewChange]);
+    useEffect(() => {
+        if (!hasInitializedRef.current)
+            return;
+        if (!selectedView)
+            return;
+        const updatedTemplate = allTemplates.find((t) => {
+            const templateId = t.templateId || t.id;
+            const selectedId = selectedView.templateId || selectedView.id;
+            return templateId === selectedId;
+        });
+        if (!updatedTemplate)
+            return;
+        const currentSubmenu = selectedView.submenu || [];
+        const updatedSubmenu = updatedTemplate.submenu || [];
+        const hasChanged = currentSubmenu.length !== updatedSubmenu.length ||
+            currentSubmenu.some((col, idx) => {
+                const updatedCol = updatedSubmenu[idx];
+                if (!updatedCol)
+                    return true;
+                return col.selected !== updatedCol.selected || col.name !== updatedCol.name;
+            });
+        if (hasChanged) {
+            const fullView = Object.assign(Object.assign({}, updatedTemplate), { submenu: deepCloneColumns(updatedTemplate.submenu || []) });
+            setSelectedView(fullView);
+            setCurrentViewColumns(deepCloneColumns(updatedTemplate.submenu || []));
+            const viewForParent = getViewForParent(fullView);
+            onViewChange === null || onViewChange === void 0 ? void 0 : onViewChange(viewForParent);
+        }
+    }, [allTemplates, selectedView, onViewChange]);
+    const handleViewButtonClick = useCallback((event) => {
+        setAnchorEl((current) => (current ? null : event.currentTarget));
+    }, []);
+    const handleCloseViewDropdown = useCallback(() => {
+        setAnchorEl(null);
+    }, []);
+    const handleSelectedViewInfo = useCallback((selected, viewMenuItem) => {
+        setSelectedViewInfo(selected);
+        const newSelectedView = viewMenuItem || undefined;
+        setSelectedView(newSelectedView);
+        setCurrentViewColumns(deepCloneColumns((newSelectedView === null || newSelectedView === void 0 ? void 0 : newSelectedView.submenu) || []));
+        onViewChange === null || onViewChange === void 0 ? void 0 : onViewChange(newSelectedView ? getViewForParent(newSelectedView) : undefined);
+        handleCloseViewDropdown();
+    }, [handleCloseViewDropdown, onViewChange, getViewForParent]);
+    const updateSelectedView = useCallback((updatedView) => {
+        const viewWithNewRefs = Object.assign(Object.assign({}, updatedView), { submenu: updatedView.submenu ? [...updatedView.submenu] : undefined, columns: updatedView.columns ? [...updatedView.columns] : undefined });
+        setSelectedView(viewWithNewRefs);
+        setCurrentViewColumns(deepCloneColumns(viewWithNewRefs.submenu || []));
+        setSelectedViewInfo({ id: viewWithNewRefs.id, label: viewWithNewRefs.label });
+        onViewChange === null || onViewChange === void 0 ? void 0 : onViewChange(getViewForParent(viewWithNewRefs));
+    }, [onViewChange, getViewForParent]);
+    const handleOpenCreateDialog = useCallback((useCurrentState = false) => {
+        setEditingView(null);
+        setShouldUseCurrentState(useCurrentState);
+        setIsCreateDialogOpen(true);
+        setAnchorEl(null);
+    }, []);
+    const handleOpenEditDialog = useCallback((view) => {
+        setEditingView(view);
+        setShouldUseCurrentState(true);
+        setIsCreateDialogOpen(true);
+    }, []);
+    const handleCloseCreateDialog = useCallback(() => {
+        setIsCreateDialogOpen(false);
+        setEditingView(null);
+        setShouldUseCurrentState(false);
+    }, []);
+    const handleSaveView = useCallback((data) => __awaiter(void 0, void 0, void 0, function* () {
+        if (editingView) {
+            const templateId = editingView.templateId || editingView.id;
+            yield (onEditCustomView === null || onEditCustomView === void 0 ? void 0 : onEditCustomView(templateId, data));
+        }
+        else {
+            yield (onCreateCustomView === null || onCreateCustomView === void 0 ? void 0 : onCreateCustomView(data));
+        }
+    }), [editingView, onEditCustomView, onCreateCustomView]);
+    const handleDeleteView = useCallback((viewId) => __awaiter(void 0, void 0, void 0, function* () {
+        const viewToDelete = allTemplates.find((view) => view.id === viewId || view.templateId === viewId);
+        const templateId = (viewToDelete === null || viewToDelete === void 0 ? void 0 : viewToDelete.templateId) || viewId;
+        yield (onDeleteCustomView === null || onDeleteCustomView === void 0 ? void 0 : onDeleteCustomView(templateId));
+        if ((selectedView === null || selectedView === void 0 ? void 0 : selectedView.id) === viewId || (selectedView === null || selectedView === void 0 ? void 0 : selectedView.templateId) === viewId) {
+            setSelectedView(defaultTemplate);
+            setCurrentViewColumns(deepCloneColumns(defaultColumns));
+            if (defaultTemplate) {
+                onViewChange === null || onViewChange === void 0 ? void 0 : onViewChange(getViewForParent(defaultTemplate));
+            }
+        }
+    }), [allTemplates, onDeleteCustomView, selectedView, defaultTemplate, defaultColumns, onViewChange, getViewForParent]);
+    return {
+        anchorEl,
+        isCreateDialogOpen,
+        editingView,
+        selectedViewInfo,
+        shouldUseCurrentState,
+        selectedView,
+        currentViewColumns,
+        handleViewButtonClick,
+        handleCloseViewDropdown,
+        handleSelectedViewInfo,
+        handleOpenCreateDialog,
+        handleOpenEditDialog,
+        handleCloseCreateDialog,
+        handleSaveView,
+        handleDeleteView,
+        updateSelectedView,
+    };
+};

package/build/components/TableHeader/TableView/index.d.ts

@@ -1,3 +1,12 @@
-import TableView from './TableView';
-export * from './TableView';
-export default TableView;
+export { default } from './TableView';
+export { default as TableView } from './TableView';
+export { default as DefaultViews } from './DefaultViews';
+export { default as CustomViews } from './CustomViews';
+export { default as ViewsMenu } from './ViewsMenu';
+export { default as ViewsDropdown } from './ViewsDropdown';
+export { default as CreateViewDialog } from './CreateViewDialog';
+export type { ViewMenuItem, CreateCustomViewDialogProps, LayoutSection, ColumnItem, FieldItem, Template, CreateTemplatePayload, UpdateTemplatePayload, } from './types';
+export { transformLayoutToColumns, getColumnsByMode, createCustomViewMenuItem, setViewAsDefault, transformTemplatesToViewMenuItems, convertColumnsToLayoutSection, isDateColumn, getColumnCheckState, } from './utils';
+export { useSubmenuHover, useViewsManager, useViewsMenu } from './hooks';
+export { DIALOG_WIDTH, DIALOG_HEIGHT, MAX_CUSTOM_VIEWS, TEMPLATE_NAME_MAX_LENGTH } from './constants';
+export { defaultViewList, advancedColumns, sheetColumns } from './data';

package/build/components/TableHeader/TableView/index.js

@@ -1,3 +1,11 @@
-import TableView from './TableView';
-export * from './TableView';
-export default TableView;
+export { default } from './TableView';
+export { default as TableView } from './TableView';
+export { default as DefaultViews } from './DefaultViews';
+export { default as CustomViews } from './CustomViews';
+export { default as ViewsMenu } from './ViewsMenu';
+export { default as ViewsDropdown } from './ViewsDropdown';
+export { default as CreateViewDialog } from './CreateViewDialog';
+export { transformLayoutToColumns, getColumnsByMode, createCustomViewMenuItem, setViewAsDefault, transformTemplatesToViewMenuItems, convertColumnsToLayoutSection, isDateColumn, getColumnCheckState, } from './utils';
+export { useSubmenuHover, useViewsManager, useViewsMenu } from './hooks';
+export { DIALOG_WIDTH, DIALOG_HEIGHT, MAX_CUSTOM_VIEWS, TEMPLATE_NAME_MAX_LENGTH } from './constants';
+export { defaultViewList, advancedColumns, sheetColumns } from './data';

package/build/components/TableHeader/TableView/styles.d.ts

@@ -0,0 +1,127 @@
+/// <reference types="react" />
+import type { SxProps, Theme } from '@mui/material/styles';
+export declare const ButtonStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const ViewWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const ListStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const DropdownStyled: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const MenuItem: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme> & {
+    addColumnViewEl?: boolean | undefined;
+}, {}, {}>;
+export declare const Space: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const SpaceAfter: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const DialogContentWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const ScrollableContent: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const TitleSection: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const ColumnListContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const SelectAllHeader: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const ColumnItemRow: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme> & {
+    isHovered?: boolean | undefined;
+    isDate?: boolean | undefined;
+}, {}, {}>;
+export declare const DragIconWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const CheckboxWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const FooterBar: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const CreateButtonWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const SubmenuPaper: import("@emotion/styled").StyledComponent<import("@mui/material").PaperOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, "classes" | "className" | "style" | "children" | "sx" | "variant" | "square" | "elevation"> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const SubmenuItem: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const DeleteButton: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+}, "color" | "disabled" | "classes" | "className" | "style" | "tabIndex" | "children" | "sx" | "variant" | "size" | "fullWidth" | "href" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const CreateButton: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+}, "color" | "disabled" | "classes" | "className" | "style" | "tabIndex" | "children" | "sx" | "variant" | "size" | "fullWidth" | "href" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableElevation" | "disableFocusRipple" | "endIcon" | "startIcon"> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const NameTextField: import("@emotion/styled").StyledComponent<{
+    variant?: import("@mui/material").TextFieldVariants | undefined;
+} & Omit<import("@mui/material").FilledTextFieldProps | import("@mui/material").OutlinedTextFieldProps | import("@mui/material").StandardTextFieldProps, "variant"> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const checkboxSx: SxProps<Theme>;
+export declare const getDialogPaperStyle: (width: number, height: number) => {
+    margin: number;
+    maxHeight: string;
+    maxWidth: string;
+    width: number;
+    height: number;
+    borderRadius: number;
+    overflow: string;
+    boxShadow: string;
+};
+export declare const dialogSx: {
+    backgroundColor: string;
+    pointerEvents: string;
+    zIndex: number;
+    '& .MuiDialog-container': {
+        transition: string;
+        zIndex: number;
+    };
+    '& .MuiDialog-paper': {
+        transition: string;
+        pointerEvents: string;
+        zIndex: number;
+    };
+};
+export declare const ResetHeaderBox: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const ResetCheckboxSx: SxProps<Theme>;
+export declare const SubmenuContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const ColumnItemsContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const SaveCustomViewBox: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const SaveCustomViewInnerBox: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme> & {
+    disabled?: boolean | undefined;
+}, {}, {}>;
+export declare const ButtonsContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<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<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme>, {}, {}>;
+export declare const CancelButtonSx: SxProps<Theme>;
+export declare const OkayButtonSx: SxProps<Theme>;
+export declare const ModifiedTextSx: {
+    readonly color: "#20232B80";
+    readonly fontSize: "9px";
+    readonly fontWeight: 500;
+    readonly marginLeft: "4px";
+};