@lifi/widget 2.4.3 → 2.4.5

package/AppDrawer.js

@@ -1,11 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import CloseIcon from '@mui/icons-material/CloseRounded';
 import KeyboardArrowLeftIcon from '@mui/icons-material/KeyboardArrowLeft';
 import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
 import { Drawer } from '@mui/material';
 import { forwardRef, useCallback, useImperativeHandle, useMemo, useRef, useState, } from 'react';
 import { useTranslation } from 'react-i18next';
 import { AppDefault } from './App';
-import { DrawerButton, DrawerButtonTypography } from './AppDrawer.style';
+import { CloseButtonLayout, DrawerButton, DrawerButtonTypography, } from './AppDrawer.style';
 import { AppProvider } from './AppProvider';
 import { HiddenUI } from './types';
 export const AppDrawer = forwardRef(({ elementRef, open, integrator, config }, ref) => {
@@ -34,7 +35,7 @@ export const AppDrawer = forwardRef(({ elementRef, open, integrator, config }, r
             height: '100%',
         },
     }), [config, integrator]);
-    return (_jsxs(AppProvider, { config: widgetConfig, children: [!widgetConfig.hiddenUI?.includes(HiddenUI.DrawerButton) ? (_jsxs(DrawerButton, { variant: "contained", onClick: toggleDrawer, open: drawerOpen, drawerProps: config?.containerStyle, children: [drawerOpen ? (_jsx(KeyboardArrowRightIcon, {})) : (_jsx(KeyboardArrowLeftIcon, {})), _jsx(DrawerButtonText, { open: drawerOpen, subvariant: config?.subvariant })] })) : null, _jsx(Drawer, { ref: elementRef, anchor: "right", open: drawerOpen, onClose: closeDrawer, BackdropProps: {
+    return (_jsxs(AppProvider, { config: widgetConfig, children: [!widgetConfig.hiddenUI?.includes(HiddenUI.DrawerButton) ? (_jsxs(DrawerButton, { variant: "contained", onClick: toggleDrawer, open: drawerOpen, drawerProps: config?.containerStyle, children: [drawerOpen ? (_jsx(KeyboardArrowRightIcon, {})) : (_jsx(KeyboardArrowLeftIcon, {})), _jsx(DrawerButtonText, { open: drawerOpen, subvariant: config?.subvariant })] })) : null, _jsxs(Drawer, { ref: elementRef, anchor: "right", open: drawerOpen, onClose: closeDrawer, BackdropProps: {
                     sx: {
                         backgroundColor: 'rgb(0 0 0 / 48%)',
                         backdropFilter: 'blur(3px)',
@@ -45,7 +46,7 @@ export const AppDrawer = forwardRef(({ elementRef, open, integrator, config }, r
                         minWidth: config?.containerStyle?.minWidth ?? 375,
                         maxWidth: config?.containerStyle?.maxWidth ?? 392,
                     },
-                }, keepMounted: true, children: _jsx(AppDefault, {}) })] }));
+                }, keepMounted: true, children: [_jsx(CloseButtonLayout, { onClick: closeDrawer, edge: "end", children: _jsx(CloseIcon, {}) }), _jsx(AppDefault, {})] })] }));
 });
 export const DrawerButtonText = ({ open, subvariant, }) => {
     const { t } = useTranslation();

package/AppDrawer.style.d.ts

@@ -1,53 +1,16 @@
 /// <reference types="react" />
-export declare const DrawerButton: import("@emotion/styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonClasses> | undefined;
-    color?: import("@mui/types").OverridableStringUnion<"inherit" | "primary" | "secondary" | "error" | "warning" | "info" | "success", import("@mui/material").ButtonPropsColorOverrides> | undefined;
-    disabled?: boolean | undefined;
-    disableElevation?: boolean | undefined;
-    disableFocusRipple?: boolean | undefined;
-    endIcon?: import("react").ReactNode;
-    fullWidth?: boolean | undefined;
-    href?: string | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "large" | "medium", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
-    startIcon?: import("react").ReactNode;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: import("@mui/types").OverridableStringUnion<"text" | "outlined" | "contained", import("@mui/material").ButtonPropsVariantOverrides> | undefined;
-} & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
-}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+export declare const DrawerButton: 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;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
+}, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "href" | "color" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     open?: boolean | undefined;
     drawerProps?: {
         width?: string | number | undefined;
         maxWidth?: string | number | undefined;
     } | undefined;
 }, {}, {}>;
-export declare const DrawerButtonTypography: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
-    align?: "center" | "left" | "right" | "inherit" | "justify" | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").TypographyClasses> | undefined;
-    gutterBottom?: boolean | undefined;
-    noWrap?: boolean | undefined;
-    paragraph?: boolean | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: import("@mui/types").OverridableStringUnion<"inherit" | import("@mui/material").TypographyVariant, import("@mui/material").TypographyPropsVariantOverrides> | undefined;
-    variantMapping?: Partial<Record<import("@mui/types").OverridableStringUnion<"inherit" | import("@mui/material").TypographyVariant, import("@mui/material").TypographyPropsVariantOverrides>, string>> | undefined;
-} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+export declare const DrawerButtonTypography: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
     ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | ("p" | "color" | "border" | "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint") | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "className" | "style" | "classes" | "children" | "sx" | "p" | "color" | "border" | "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const CloseButtonLayout: import("@emotion/styled").StyledComponent<import("@mui/material").IconButtonOwnProps & 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;
+}, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "disableFocusRipple" | "size" | "edge"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/AppDrawer.style.js

@@ -1,4 +1,4 @@
-import { Button, Typography } from '@mui/material';
+import { Button, IconButton, Typography } from '@mui/material';
 import { styled } from '@mui/material/styles';
 const getButtonTransformWidth = (drawerWidth, drawerMaxWidth) => {
     if (typeof drawerWidth === 'number') {
@@ -75,3 +75,13 @@ export const DrawerButtonTypography = styled(Typography)(({ theme }) => ({
     transform: 'rotateZ(180deg)',
     writingMode: 'vertical-rl',
 }));
+export const CloseButtonLayout = styled(IconButton)(() => ({
+    position: 'absolute',
+    top: '12px',
+    right: '26px',
+    zIndex: 1,
+    height: '40px',
+    width: '40px',
+    alignItems: 'center',
+    justifyContent: 'center',
+}));

package/cjs/AppDrawer.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DrawerButtonText = exports.AppDrawer = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
+const CloseRounded_1 = require("@mui/icons-material/CloseRounded");
 const KeyboardArrowLeft_1 = require("@mui/icons-material/KeyboardArrowLeft");
 const KeyboardArrowRight_1 = require("@mui/icons-material/KeyboardArrowRight");
 const material_1 = require("@mui/material");
@@ -37,7 +38,7 @@ exports.AppDrawer = (0, react_1.forwardRef)(({ elementRef, open, integrator, con
             height: '100%',
         },
     }), [config, integrator]);
-    return ((0, jsx_runtime_1.jsxs)(AppProvider_1.AppProvider, { config: widgetConfig, children: [!widgetConfig.hiddenUI?.includes(types_1.HiddenUI.DrawerButton) ? ((0, jsx_runtime_1.jsxs)(AppDrawer_style_1.DrawerButton, { variant: "contained", onClick: toggleDrawer, open: drawerOpen, drawerProps: config?.containerStyle, children: [drawerOpen ? ((0, jsx_runtime_1.jsx)(KeyboardArrowRight_1.default, {})) : ((0, jsx_runtime_1.jsx)(KeyboardArrowLeft_1.default, {})), (0, jsx_runtime_1.jsx)(exports.DrawerButtonText, { open: drawerOpen, subvariant: config?.subvariant })] })) : null, (0, jsx_runtime_1.jsx)(material_1.Drawer, { ref: elementRef, anchor: "right", open: drawerOpen, onClose: closeDrawer, BackdropProps: {
+    return ((0, jsx_runtime_1.jsxs)(AppProvider_1.AppProvider, { config: widgetConfig, children: [!widgetConfig.hiddenUI?.includes(types_1.HiddenUI.DrawerButton) ? ((0, jsx_runtime_1.jsxs)(AppDrawer_style_1.DrawerButton, { variant: "contained", onClick: toggleDrawer, open: drawerOpen, drawerProps: config?.containerStyle, children: [drawerOpen ? ((0, jsx_runtime_1.jsx)(KeyboardArrowRight_1.default, {})) : ((0, jsx_runtime_1.jsx)(KeyboardArrowLeft_1.default, {})), (0, jsx_runtime_1.jsx)(exports.DrawerButtonText, { open: drawerOpen, subvariant: config?.subvariant })] })) : null, (0, jsx_runtime_1.jsxs)(material_1.Drawer, { ref: elementRef, anchor: "right", open: drawerOpen, onClose: closeDrawer, BackdropProps: {
                     sx: {
                         backgroundColor: 'rgb(0 0 0 / 48%)',
                         backdropFilter: 'blur(3px)',
@@ -48,7 +49,7 @@ exports.AppDrawer = (0, react_1.forwardRef)(({ elementRef, open, integrator, con
                         minWidth: config?.containerStyle?.minWidth ?? 375,
                         maxWidth: config?.containerStyle?.maxWidth ?? 392,
                     },
-                }, keepMounted: true, children: (0, jsx_runtime_1.jsx)(App_1.AppDefault, {}) })] }));
+                }, keepMounted: true, children: [(0, jsx_runtime_1.jsx)(AppDrawer_style_1.CloseButtonLayout, { onClick: closeDrawer, edge: "end", children: (0, jsx_runtime_1.jsx)(CloseRounded_1.default, {}) }), (0, jsx_runtime_1.jsx)(App_1.AppDefault, {})] })] }));
 });
 const DrawerButtonText = ({ open, subvariant, }) => {
     const { t } = (0, react_i18next_1.useTranslation)();

package/cjs/AppDrawer.style.d.ts

@@ -1,53 +1,16 @@
 /// <reference types="react" />
-export declare const DrawerButton: import("@emotion/styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonClasses> | undefined;
-    color?: import("@mui/types").OverridableStringUnion<"inherit" | "primary" | "secondary" | "error" | "warning" | "info" | "success", import("@mui/material").ButtonPropsColorOverrides> | undefined;
-    disabled?: boolean | undefined;
-    disableElevation?: boolean | undefined;
-    disableFocusRipple?: boolean | undefined;
-    endIcon?: import("react").ReactNode;
-    fullWidth?: boolean | undefined;
-    href?: string | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "large" | "medium", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
-    startIcon?: import("react").ReactNode;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: import("@mui/types").OverridableStringUnion<"text" | "outlined" | "contained", import("@mui/material").ButtonPropsVariantOverrides> | undefined;
-} & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
-}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+export declare const DrawerButton: 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;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
+}, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "href" | "color" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     open?: boolean | undefined;
     drawerProps?: {
         width?: string | number | undefined;
         maxWidth?: string | number | undefined;
     } | undefined;
 }, {}, {}>;
-export declare const DrawerButtonTypography: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
-    align?: "center" | "left" | "right" | "inherit" | "justify" | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").TypographyClasses> | undefined;
-    gutterBottom?: boolean | undefined;
-    noWrap?: boolean | undefined;
-    paragraph?: boolean | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: import("@mui/types").OverridableStringUnion<"inherit" | import("@mui/material").TypographyVariant, import("@mui/material").TypographyPropsVariantOverrides> | undefined;
-    variantMapping?: Partial<Record<import("@mui/types").OverridableStringUnion<"inherit" | import("@mui/material").TypographyVariant, import("@mui/material").TypographyPropsVariantOverrides>, string>> | undefined;
-} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+export declare const DrawerButtonTypography: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
     ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "variant" | ("p" | "color" | "border" | "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint") | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "className" | "style" | "classes" | "children" | "sx" | "p" | "color" | "border" | "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const CloseButtonLayout: import("@emotion/styled").StyledComponent<import("@mui/material").IconButtonOwnProps & 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;
+}, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "disableFocusRipple" | "size" | "edge"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/cjs/AppDrawer.style.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DrawerButtonTypography = exports.DrawerButton = void 0;
+exports.CloseButtonLayout = exports.DrawerButtonTypography = exports.DrawerButton = void 0;
 const material_1 = require("@mui/material");
 const styles_1 = require("@mui/material/styles");
 const getButtonTransformWidth = (drawerWidth, drawerMaxWidth) => {
@@ -78,3 +78,13 @@ exports.DrawerButtonTypography = (0, styles_1.styled)(material_1.Typography)(({
     transform: 'rotateZ(180deg)',
     writingMode: 'vertical-rl',
 }));
+exports.CloseButtonLayout = (0, styles_1.styled)(material_1.IconButton)(() => ({
+    position: 'absolute',
+    top: '12px',
+    right: '26px',
+    zIndex: 1,
+    height: '40px',
+    width: '40px',
+    alignItems: 'center',
+    justifyContent: 'center',
+}));

package/cjs/components/ActiveTransactions/ActiveTransactions.style.d.ts

@@ -1,71 +1,12 @@
 /// <reference types="react" />
-export declare const ListItemButton: import("@emotion/styled").StyledComponent<import("@mui/material").ListItemButtonBaseProps & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
-}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const ListItemButton: import("@emotion/styled").StyledComponent<import("@mui/material").ListItemButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-}, "className" | "style" | "classes" | "autoFocus" | "tabIndex" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "alignItems" | "divider" | "dense" | "selected" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "autoFocus" | "alignItems" | "divider" | "dense" | "selected" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const ListItem: import("@emotion/styled").StyledComponent<{
     button?: false | undefined;
-} & import("@mui/material").ListItemBaseProps & {
-    components?: {
-        Root?: import("react").ElementType<any> | undefined;
-    } | undefined;
-    componentsProps?: {
-        root?: (import("react").HTMLAttributes<HTMLDivElement> & import("@mui/material").ListItemComponentsPropsOverrides) | undefined;
-    } | undefined;
-    slotProps?: {
-        root?: (import("react").HTMLAttributes<HTMLDivElement> & import("@mui/material").ListItemComponentsPropsOverrides) | undefined;
-    } | undefined;
-    slots?: {
-        root?: import("react").ElementType<any> | undefined;
-    } | undefined;
-} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
+} & import("@mui/material").ListItemOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
     ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
-}, "button" | "className" | "style" | "classes" | "autoFocus" | "children" | "disabled" | "sx" | "alignItems" | "divider" | "components" | "dense" | "slotProps" | "slots" | "componentsProps" | "selected" | "disableGutters" | "ContainerComponent" | "ContainerProps" | "disablePadding" | "secondaryAction"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
-export declare const ShowAllButton: import("@emotion/styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonClasses> | undefined;
-    color?: import("@mui/types").OverridableStringUnion<"inherit" | "primary" | "secondary" | "error" | "warning" | "info" | "success", import("@mui/material").ButtonPropsColorOverrides> | undefined;
-    disabled?: boolean | undefined;
-    disableElevation?: boolean | undefined;
-    disableFocusRipple?: boolean | undefined;
-    endIcon?: import("react").ReactNode;
-    fullWidth?: boolean | undefined;
-    href?: string | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "large" | "medium", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
-    startIcon?: import("react").ReactNode;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: import("@mui/types").OverridableStringUnion<"text" | "outlined" | "contained", import("@mui/material").ButtonPropsVariantOverrides> | undefined;
-} & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
-}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+}, "button" | "className" | "style" | "classes" | "children" | "disabled" | "sx" | "autoFocus" | "alignItems" | "divider" | "components" | "dense" | "componentsProps" | "slots" | "slotProps" | "selected" | "disableGutters" | "ContainerComponent" | "ContainerProps" | "disablePadding" | "secondaryAction"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+export declare const ShowAllButton: 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;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "href" | "color" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/cjs/components/AmountInput/AmountInput.style.d.ts

@@ -1,21 +1,7 @@
 /// <reference types="react" />
 export declare const maxInputFontSize = 24;
 export declare const minInputFontSize = 14;
-export declare const FormControl: import("@emotion/styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").FormControlClasses> | undefined;
-    color?: import("@mui/types").OverridableStringUnion<"primary" | "secondary" | "error" | "warning" | "info" | "success", import("@mui/material").FormControlPropsColorOverrides> | undefined;
-    disabled?: boolean | undefined;
-    error?: boolean | undefined;
-    fullWidth?: boolean | undefined;
-    focused?: boolean | undefined;
-    hiddenLabel?: boolean | undefined;
-    margin?: "normal" | "none" | "dense" | undefined;
-    required?: boolean | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "medium", import("@mui/material").FormControlPropsSizeOverrides> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: "outlined" | "filled" | "standard" | undefined;
-} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const FormControl: import("@emotion/styled").StyledComponent<import("@mui/material").FormControlOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "color" | "children" | "disabled" | "sx" | "margin" | "fullWidth" | "size" | "variant" | "error" | "required" | "focused" | "hiddenLabel"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "className" | "style" | "classes" | "children" | "disabled" | "sx" | "color" | "margin" | "fullWidth" | "size" | "variant" | "error" | "required" | "focused" | "hiddenLabel"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const Input: import("@emotion/styled").StyledComponent<import("@mui/material").InputBaseProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/cjs/components/AmountInput/AmountInputAdornment.style.d.ts

@@ -1,34 +1,4 @@
 /// <reference types="react" />
-export declare const Button: import("@emotion/styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonClasses> | undefined;
-    color?: import("@mui/types").OverridableStringUnion<"inherit" | "primary" | "secondary" | "error" | "warning" | "info" | "success", import("@mui/material").ButtonPropsColorOverrides> | undefined;
-    disabled?: boolean | undefined;
-    disableElevation?: boolean | undefined;
-    disableFocusRipple?: boolean | undefined;
-    endIcon?: import("react").ReactNode;
-    fullWidth?: boolean | undefined;
-    href?: string | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "large" | "medium", import("@mui/material").ButtonPropsSizeOverrides> | undefined;
-    startIcon?: import("react").ReactNode;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    variant?: import("@mui/types").OverridableStringUnion<"text" | "outlined" | "contained", import("@mui/material").ButtonPropsVariantOverrides> | undefined;
-} & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
-}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+export declare const Button: 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;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "href" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "href" | "color" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/cjs/components/AppContainer.d.ts

@@ -1,24 +1,12 @@
 import type { PropsWithChildren } from 'react';
 import type { WidgetVariant } from '../types';
 export declare const maxHeight = 680;
-export declare const AppExpandedContainer: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<import("@mui/material").Theme> & {
-    children?: import("react").ReactNode;
-    component?: import("react").ElementType<any> | undefined;
-    ref?: import("react").Ref<unknown> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-} & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const AppExpandedContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-}, "children" | "sx" | "ref" | ("p" | "color" | "border" | "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint") | "component"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     variant?: WidgetVariant | undefined;
 }, {}, {}>;
-export declare const FlexContainer: import("@emotion/styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ContainerClasses> | undefined;
-    disableGutters?: boolean | undefined;
-    fixed?: boolean | undefined;
-    maxWidth?: false | import("@mui/material").Breakpoint | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const FlexContainer: import("@emotion/styled").StyledComponent<import("@mui/material").ContainerOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "maxWidth" | "fixed" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "className" | "style" | "classes" | "children" | "sx" | "maxWidth" | "fixed" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const AppContainer: React.FC<PropsWithChildren<{}>>;

package/cjs/components/Card/Card.d.ts

@@ -8,14 +8,9 @@ export type CardProps = {
     onClick?: MouseEventHandler<HTMLDivElement>;
     pointerEvents?: 'auto' | 'none';
 } & BoxProps;
-export declare const Card: import("@emotion/styled").StyledComponent<import("@mui/system").SystemProps<Theme> & {
-    children?: import("react").ReactNode;
-    component?: import("react").ElementType<any> | undefined;
-    ref?: import("react").Ref<unknown> | undefined;
-    sx?: import("@mui/material").SxProps<Theme> | undefined;
-} & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const Card: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-}, "children" | "sx" | "ref" | ("p" | "color" | "border" | "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint") | "component"> & import("@mui/system").MUIStyledCommonProps<Theme> & {
+}, keyof import("@mui/system").BoxOwnProps<Theme>> & import("@mui/system").MUIStyledCommonProps<Theme> & {
     variant?: CardVariant | undefined;
     selectionColor?: "primary" | "secondary" | undefined;
     indented?: boolean | undefined;
@@ -23,5 +18,5 @@ export declare const Card: import("@emotion/styled").StyledComponent<import("@mu
     pointerEvents?: "none" | "auto" | undefined;
 } & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "children" | "sx" | "ref" | ("p" | "color" | "border" | "boxShadow" | "fontWeight" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "fontFamily" | "fontSize" | "fontStyle" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "lineHeight" | "marginBottom" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBottom" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "overflow" | "padding" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint") | "component">, {}, {}>;
+}, keyof import("@mui/material/OverridableComponent").CommonProps | keyof import("@mui/system").BoxOwnProps<Theme>>, {}, {}>;
 export {};

package/cjs/components/Card/CardHeader.d.ts

@@ -1,18 +1,4 @@
 /// <reference types="react" />
-export declare const CardHeader: import("@emotion/styled").StyledComponent<{
-    action?: import("react").ReactNode;
-    avatar?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").CardHeaderClasses> | undefined;
-    disableTypography?: boolean | undefined;
-    subheader?: import("react").ReactNode;
-    subheaderTypographyProps?: import("@mui/material").TypographyProps<"span", {
-        component?: "span" | undefined;
-    }> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    title?: import("react").ReactNode;
-    titleTypographyProps?: import("@mui/material").TypographyProps<"span", {
-        component?: "span" | undefined;
-    }> | undefined;
-} & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const CardHeader: import("@emotion/styled").StyledComponent<import("@mui/material").CardHeaderOwnProps<"span", "span"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: import("react").RefObject<HTMLDivElement> | ((instance: HTMLDivElement | null) => void) | null | undefined;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "title" | "action" | "sx" | "disableTypography" | "avatar" | "subheader" | "subheaderTypographyProps" | "titleTypographyProps"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "className" | "style" | "classes" | "action" | "sx" | "title" | "disableTypography" | "avatar" | "subheader" | "subheaderTypographyProps" | "titleTypographyProps"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/cjs/components/Card/CardIconButton.d.ts

@@ -1,29 +1,4 @@
 /// <reference types="react" />
-export declare const CardIconButton: import("@emotion/styled").StyledComponent<{
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").IconButtonClasses> | undefined;
-    color?: import("@mui/types").OverridableStringUnion<"inherit" | "default" | "primary" | "secondary" | "error" | "warning" | "info" | "success", import("@mui/material").IconButtonPropsColorOverrides> | undefined;
-    disabled?: boolean | undefined;
-    disableFocusRipple?: boolean | undefined;
-    edge?: false | "end" | "start" | undefined;
-    size?: import("@mui/types").OverridableStringUnion<"small" | "large" | "medium", import("@mui/material").IconButtonPropsSizeOverrides> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-} & Omit<{
-    action?: import("react").Ref<import("@mui/material").ButtonBaseActions> | undefined;
-    centerRipple?: boolean | undefined;
-    children?: import("react").ReactNode;
-    classes?: Partial<import("@mui/material").ButtonBaseClasses> | undefined;
-    disabled?: boolean | undefined;
-    disableRipple?: boolean | undefined;
-    disableTouchRipple?: boolean | undefined;
-    focusRipple?: boolean | undefined;
-    focusVisibleClassName?: string | undefined;
-    LinkComponent?: import("react").ElementType<any> | undefined;
-    onFocusVisible?: import("react").FocusEventHandler<any> | undefined;
-    sx?: import("@mui/material").SxProps<import("@mui/material").Theme> | undefined;
-    tabIndex?: number | undefined;
-    TouchRippleProps?: Partial<import("@mui/material/ButtonBase/TouchRipple").TouchRippleProps> | undefined;
-    touchRippleRef?: import("react").Ref<import("@mui/material/ButtonBase/TouchRipple").TouchRippleActions> | undefined;
-}, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+export declare const CardIconButton: import("@emotion/styled").StyledComponent<import("@mui/material").IconButtonOwnProps & 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;
-}, keyof import("@mui/material/OverridableComponent").CommonProps | "tabIndex" | "color" | "children" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "size" | "edge"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "className" | "style" | "classes" | "action" | "centerRipple" | "children" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "disableFocusRipple" | "size" | "edge"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;