@veeqo/ui 9.0.0-beta-3 → 9.0.0

package/dist/components/LoginWithAmazonButton/LoginWithAmazonButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"LoginWithAmazonButton.js","sources":["../../../src/components/LoginWithAmazonButton/LoginWithAmazonButton.tsx"],"sourcesContent":[null],"names":["buttonImg"],"mappings":"8EASA,MAAAA,EAAA"}
+{"version":3,"file":"LoginWithAmazonButton.js","sources":["../../../src/components/LoginWithAmazonButton/LoginWithAmazonButton.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;AAGA,MAAM,SAAS,GAAG,gFAAgF;AAClG,MAAM,gBAAgB,GACpB,wFAAwF;AAEnF,MAAM,iBAAiB,GAAG;AAEjC;;;AAGG;AACU,MAAA,qBAAqB,GAA4D,CAC5F,KAAK,KACH;IACF,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,SAAS,CAAC;IAE7C,MAAM,eAAe,GAAG,MAAK;QAC3B,QAAQ,CAAC,gBAAgB,CAAC;AAC5B,KAAC;IAED,MAAM,aAAa,GAAG,MAAK;QACzB,QAAQ,CAAC,SAAS,CAAC;AACrB,KAAC;AAED,IAAA,QACE,KAAA,CAAA,aAAA,CAAC,WAAW,EAAA,EACV,WAAW,EAAE,eAAe,EAC5B,SAAS,EAAE,aAAa,EACZ,YAAA,EAAA,iBAAiB,KACzB,KAAK,EAAA;QAGT,KAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,iBAAiB,EAAA,CAAI,CAC/B;AAElB;;;;"}

package/dist/components/LoginWithAmazonButton/index.d.ts

@@ -1,2 +1 @@
 export { LoginWithAmazonButton } from './LoginWithAmazonButton';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/LoginWithAmazonButton/styled.cjs

@@ -1,13 +1,12 @@
-"use strict";function t(t){return t&&t.__esModule?t:{default:t}}const e=t(require("styled-components")).default.button`
-  /* Remove default button style */
-  background: none;
-  border: none;
-  padding: 0;
-  cursor: pointer;
-
-  img {
-    width: 156px;
-    height: 32px;
-  }
-`;exports.LoginButton=e;
+'use strict';
+
+var styled = require('styled-components');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
+
+const LoginButton = styled__default.default.button.withConfig({ displayName: "vui--LoginButton", componentId: "vui--9ns5xb" }) `background:none;border:none;padding:0;cursor:pointer;img{width:156px;height:32px;}`;
+
+exports.LoginButton = LoginButton;
 //# sourceMappingURL=styled.cjs.map

package/dist/components/LoginWithAmazonButton/styled.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"styled.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
+{"version":3,"file":"styled.cjs","sources":["../../../src/components/LoginWithAmazonButton/styled.ts"],"sourcesContent":[null],"names":["styled"],"mappings":";;;;;;;;MAEa,WAAW,GAAGA,uBAAM,CAAC,MAAM;;;;"}

package/dist/components/LoginWithAmazonButton/styled.d.ts

@@ -1,2 +1 @@
 export declare const LoginButton: import("styled-components").StyledComponent<"button", any, {}, never>;
-//# sourceMappingURL=styled.d.ts.map

package/dist/components/LoginWithAmazonButton/styled.js

@@ -1,13 +1,6 @@
-import o from"styled-components";const t=o.button`
-  /* Remove default button style */
-  background: none;
-  border: none;
-  padding: 0;
-  cursor: pointer;
+import styled from 'styled-components';
 
-  img {
-    width: 156px;
-    height: 32px;
-  }
-`;export{t as LoginButton};
+const LoginButton = styled.button.withConfig({ displayName: "vui--LoginButton", componentId: "vui--9ns5xb" }) `background:none;border:none;padding:0;cursor:pointer;img{width:156px;height:32px;}`;
+
+export { LoginButton };
 //# sourceMappingURL=styled.js.map

package/dist/components/LoginWithAmazonButton/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
+{"version":3,"file":"styled.js","sources":["../../../src/components/LoginWithAmazonButton/styled.ts"],"sourcesContent":[null],"names":[],"mappings":";;MAEa,WAAW,GAAG,MAAM,CAAC,MAAM;;;;"}

package/dist/components/Modal/Modal.cjs

@@ -1,2 +1,50 @@
-"use strict";var e=require("react"),t=require("framer-motion"),l=require("./components/styled.cjs"),r=require("./types.cjs"),a=require("./components/Dialog/Dialog.cjs"),o=require("../../hooks/useIsOverflowing.cjs"),n=require("../Button/Button.cjs"),i=require("../Card/Card.cjs"),c=require("../CardHeader/CardHeader.cjs"),d=require("../Stack/Stack.cjs");function u(e){return e&&e.__esModule?e:{default:e}}var s=u(e);exports.Modal=u=>{const{shouldShow:f,showHeaderCloseButton:m=!0,fullBleed:h=!1,variant:S="base",onClose:g,children:v}=u,E=e.useRef(null),[b,C]=e.useState(null);e.useEffect((()=>{var e,t;f&&(null===(e=E.current)||void 0===e||e.removeAttribute("open"),null===(t=E.current)||void 0===t||t.showModal())}),[f]);const{isOverflowing:p,onScroll:q}=o.useIsOverflowing(b),k=()=>{var e;null===(e=E.current)||void 0===e||e.close(),g()};return s.default.createElement(t.AnimatePresence,null,f&&s.default.createElement("div",{"data-testid":"dialog-wrapper"},s.default.createElement(l.NonScrollableBody,null),s.default.createElement(a.Dialog,{ref:E,onClose:k,variant:S,"aria-describedby":"modal_title"},s.default.createElement(i.Card.Surface,null,r.hasHeaderSlot(u)?u.headerSlot:s.default.createElement(c.CardHeader,{id:"modal_title",headerVariant:"headingLarge",title:u.headerTitle,subtitle:u.headerSubtitle,...m&&{onClickClose:k}}),s.default.createElement(l.MainSection,{onScroll:q,ref:C,isScrollable:p,fullBleed:h},v),r.hasFooterSlot(u)&&u.footerSlot,!r.hasFooterSlot(u)&&(u.leftActions||u.rightActions)&&s.default.createElement(i.Card.Footer,null,s.default.createElement(d.Stack,{direction:"horizontal",alignX:u.leftActions?"between":"end"},u.leftActions&&s.default.createElement(d.Stack,{direction:"horizontal",alignX:"start","data-testid":"left-actions-container"},u.leftActions.map((({label:e,...t})=>s.default.createElement(n.Button,{key:e,type:"button",...t},e)))),u.rightActions&&s.default.createElement(d.Stack,{direction:"horizontal",alignX:"end","data-testid":"right-actions-container"},u.rightActions.map((({label:e,...t})=>s.default.createElement(n.Button,{key:e,type:"button",...t},e))))))))))};
+'use strict';
+
+var React = require('react');
+var framerMotion = require('framer-motion');
+var styled = require('./components/styled.cjs');
+var types = require('./types.cjs');
+var Dialog = require('./components/Dialog/Dialog.cjs');
+var useIsOverflowing = require('../../hooks/useIsOverflowing.cjs');
+var Button = require('../Button/Button.cjs');
+var Card = require('../Card/Card.cjs');
+var CardHeader = require('../CardHeader/CardHeader.cjs');
+var Stack = require('../Stack/Stack.cjs');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+/* eslint-disable react/destructuring-assignment */
+const Modal = (props) => {
+    const { shouldShow, showHeaderCloseButton = true, fullBleed = false, variant = 'base', onClose: parentOnClose, children, className, } = props;
+    const modalRef = React.useRef(null);
+    const [mainSectionRef, setMainSectionRef] = React.useState(null);
+    React.useEffect(() => {
+        var _a, _b;
+        if (shouldShow) {
+            (_a = modalRef.current) === null || _a === undefined ? undefined : _a.removeAttribute('open'); // Allows for conditional rendering.
+            (_b = modalRef.current) === null || _b === undefined ? undefined : _b.showModal();
+        }
+    }, [shouldShow]);
+    const { isOverflowing: isContentOverflowing, onScroll } = useIsOverflowing.useIsOverflowing(mainSectionRef);
+    const onClose = () => {
+        var _a;
+        (_a = modalRef.current) === null || _a === undefined ? undefined : _a.close();
+        parentOnClose();
+    };
+    return (React__default.default.createElement(framerMotion.AnimatePresence, null, shouldShow && (React__default.default.createElement("div", { "data-testid": "dialog-wrapper" },
+        React__default.default.createElement(styled.NonScrollableBody, null),
+        React__default.default.createElement(Dialog.Dialog, { ref: modalRef, onClose: onClose, variant: variant, "aria-describedby": "modal_title", className: className },
+            React__default.default.createElement(Card.Card.Surface, null,
+                types.hasHeaderSlot(props) ? (props.headerSlot) : (React__default.default.createElement(CardHeader.CardHeader, { id: "modal_title", headerVariant: "headingLarge", title: props.headerTitle, subtitle: props.headerSubtitle, ...(showHeaderCloseButton && { onClickClose: onClose }) })),
+                React__default.default.createElement(styled.MainSection, { onScroll: onScroll, ref: setMainSectionRef, isScrollable: isContentOverflowing, fullBleed: fullBleed }, children),
+                types.hasFooterSlot(props) && props.footerSlot,
+                !types.hasFooterSlot(props) && (props.leftActions || props.rightActions) && (React__default.default.createElement(Card.Card.Footer, null,
+                    React__default.default.createElement(Stack.Stack, { direction: "horizontal", alignX: props.leftActions ? 'between' : 'end' },
+                        props.leftActions && (React__default.default.createElement(Stack.Stack, { direction: "horizontal", alignX: "start", "data-testid": "left-actions-container" }, props.leftActions.map(({ label, ...actionProps }) => (React__default.default.createElement(Button.Button, { key: label, type: "button", ...actionProps }, label))))),
+                        props.rightActions && (React__default.default.createElement(Stack.Stack, { direction: "horizontal", alignX: "end", "data-testid": "right-actions-container" }, props.rightActions.map(({ label, ...actionProps }) => (React__default.default.createElement(Button.Button, { key: label, type: "button", ...actionProps }, label))))))))))))));
+};
+
+exports.Modal = Modal;
 //# sourceMappingURL=Modal.cjs.map

package/dist/components/Modal/Modal.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"version":3,"file":"Modal.cjs","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":[null],"names":["useRef","useState","useEffect","useIsOverflowing","React","AnimatePresence","NonScrollableBody","Dialog","Card","hasHeaderSlot","CardHeader","MainSection","hasFooterSlot","Stack","Button"],"mappings":"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"}

package/dist/components/Modal/Modal.d.ts

@@ -1,4 +1,3 @@
 import React from 'react';
 import { ModalProps } from './types';
 export declare const Modal: (props: ModalProps) => React.JSX.Element;
-//# sourceMappingURL=Modal.d.ts.map

package/dist/components/Modal/Modal.js

@@ -1,2 +1,44 @@
-import e,{useRef as t,useState as o,useEffect as r}from"react";import{AnimatePresence as l}from"framer-motion";import{NonScrollableBody as n,MainSection as a}from"./components/styled.js";import{hasHeaderSlot as i,hasFooterSlot as c}from"./types.js";import{Dialog as s}from"./components/Dialog/Dialog.js";import{useIsOverflowing as m}from"../../hooks/useIsOverflowing.js";import{Button as d}from"../Button/Button.js";import{Card as u}from"../Card/Card.js";import{CardHeader as f}from"../CardHeader/CardHeader.js";import{Stack as p}from"../Stack/Stack.js";const h=h=>{const{shouldShow:g,showHeaderCloseButton:E=!0,fullBleed:b=!1,variant:v="base",onClose:S,children:C}=h,j=t(null),[A,w]=o(null);r((()=>{var e,t;g&&(null===(e=j.current)||void 0===e||e.removeAttribute("open"),null===(t=j.current)||void 0===t||t.showModal())}),[g]);const{isOverflowing:y,onScroll:k}=m(A),B=()=>{var e;null===(e=j.current)||void 0===e||e.close(),S()};return e.createElement(l,null,g&&e.createElement("div",{"data-testid":"dialog-wrapper"},e.createElement(n,null),e.createElement(s,{ref:j,onClose:B,variant:v,"aria-describedby":"modal_title"},e.createElement(u.Surface,null,i(h)?h.headerSlot:e.createElement(f,{id:"modal_title",headerVariant:"headingLarge",title:h.headerTitle,subtitle:h.headerSubtitle,...E&&{onClickClose:B}}),e.createElement(a,{onScroll:k,ref:w,isScrollable:y,fullBleed:b},C),c(h)&&h.footerSlot,!c(h)&&(h.leftActions||h.rightActions)&&e.createElement(u.Footer,null,e.createElement(p,{direction:"horizontal",alignX:h.leftActions?"between":"end"},h.leftActions&&e.createElement(p,{direction:"horizontal",alignX:"start","data-testid":"left-actions-container"},h.leftActions.map((({label:t,...o})=>e.createElement(d,{key:t,type:"button",...o},t)))),h.rightActions&&e.createElement(p,{direction:"horizontal",alignX:"end","data-testid":"right-actions-container"},h.rightActions.map((({label:t,...o})=>e.createElement(d,{key:t,type:"button",...o},t))))))))))};export{h as Modal};
+import React, { useRef, useState, useEffect } from 'react';
+import { AnimatePresence } from 'framer-motion';
+import { NonScrollableBody, MainSection } from './components/styled.js';
+import { hasHeaderSlot, hasFooterSlot } from './types.js';
+import { Dialog } from './components/Dialog/Dialog.js';
+import { useIsOverflowing } from '../../hooks/useIsOverflowing.js';
+import { Button } from '../Button/Button.js';
+import { Card } from '../Card/Card.js';
+import { CardHeader } from '../CardHeader/CardHeader.js';
+import { Stack } from '../Stack/Stack.js';
+
+/* eslint-disable react/destructuring-assignment */
+const Modal = (props) => {
+    const { shouldShow, showHeaderCloseButton = true, fullBleed = false, variant = 'base', onClose: parentOnClose, children, className, } = props;
+    const modalRef = useRef(null);
+    const [mainSectionRef, setMainSectionRef] = useState(null);
+    useEffect(() => {
+        var _a, _b;
+        if (shouldShow) {
+            (_a = modalRef.current) === null || _a === undefined ? undefined : _a.removeAttribute('open'); // Allows for conditional rendering.
+            (_b = modalRef.current) === null || _b === undefined ? undefined : _b.showModal();
+        }
+    }, [shouldShow]);
+    const { isOverflowing: isContentOverflowing, onScroll } = useIsOverflowing(mainSectionRef);
+    const onClose = () => {
+        var _a;
+        (_a = modalRef.current) === null || _a === undefined ? undefined : _a.close();
+        parentOnClose();
+    };
+    return (React.createElement(AnimatePresence, null, shouldShow && (React.createElement("div", { "data-testid": "dialog-wrapper" },
+        React.createElement(NonScrollableBody, null),
+        React.createElement(Dialog, { ref: modalRef, onClose: onClose, variant: variant, "aria-describedby": "modal_title", className: className },
+            React.createElement(Card.Surface, null,
+                hasHeaderSlot(props) ? (props.headerSlot) : (React.createElement(CardHeader, { id: "modal_title", headerVariant: "headingLarge", title: props.headerTitle, subtitle: props.headerSubtitle, ...(showHeaderCloseButton && { onClickClose: onClose }) })),
+                React.createElement(MainSection, { onScroll: onScroll, ref: setMainSectionRef, isScrollable: isContentOverflowing, fullBleed: fullBleed }, children),
+                hasFooterSlot(props) && props.footerSlot,
+                !hasFooterSlot(props) && (props.leftActions || props.rightActions) && (React.createElement(Card.Footer, null,
+                    React.createElement(Stack, { direction: "horizontal", alignX: props.leftActions ? 'between' : 'end' },
+                        props.leftActions && (React.createElement(Stack, { direction: "horizontal", alignX: "start", "data-testid": "left-actions-container" }, props.leftActions.map(({ label, ...actionProps }) => (React.createElement(Button, { key: label, type: "button", ...actionProps }, label))))),
+                        props.rightActions && (React.createElement(Stack, { direction: "horizontal", alignX: "end", "data-testid": "right-actions-container" }, props.rightActions.map(({ label, ...actionProps }) => (React.createElement(Button, { key: label, type: "button", ...actionProps }, label))))))))))))));
+};
+
+export { Modal };
 //# sourceMappingURL=Modal.js.map

package/dist/components/Modal/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"version":3,"file":"Modal.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/dist/components/Modal/components/Dialog/Dialog.cjs

@@ -1,2 +1,13 @@
-"use strict";var e=require("react"),r=require("./styled.cjs");function t(e){return e&&e.__esModule?e:{default:e}}var a=t(e);const l=a.default.forwardRef((({...e},t)=>a.default.createElement(r.StyledDialog,{ref:t,...e})));exports.Dialog=l;
+'use strict';
+
+var React = require('react');
+var styled = require('./styled.cjs');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+const Dialog = React__default.default.forwardRef(({ ...rest }, ref) => React__default.default.createElement(styled.StyledDialog, { ref: ref, ...rest }));
+
+exports.Dialog = Dialog;
 //# sourceMappingURL=Dialog.cjs.map

package/dist/components/Modal/components/Dialog/Dialog.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.cjs","sources":["../../../../../src/components/Modal/components/Dialog/Dialog.tsx"],"sourcesContent":[null],"names":["Dialog","React","default","forwardRef","rest","ref","createElement","StyledDialog"],"mappings":"4HAES,MAAAA,EAAaC,EAAEC,QAAAC,iBAAoBC,GAAAC,IAAAJ,EAAAC,QAAAI,cAAAC,EAAAA,aAAA,CAAAF,IAAAA,KAAAD"}
+{"version":3,"file":"Dialog.cjs","sources":["../../../../../src/components/Modal/components/Dialog/Dialog.tsx"],"sourcesContent":[null],"names":["React","StyledDialog"],"mappings":";;;;;;;;;AAQO,MAAM,MAAM,GAAGA,sBAAK,CAAC,UAAU,CACpC,CAAC,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,KAAKA,sBAAC,CAAA,aAAA,CAAAC,mBAAY,EAAC,EAAA,GAAG,EAAE,GAAG,EAAM,GAAA,IAAI,EAAI,CAAA;;;;"}

package/dist/components/Modal/components/Dialog/Dialog.d.ts

@@ -6,4 +6,3 @@ type ModifiedDialogProps = {
 } & React.ComponentProps<typeof StyledDialog>;
 export declare const Dialog: React.ForwardRefExoticComponent<Omit<ModifiedDialogProps, "ref"> & React.RefAttributes<HTMLDialogElement>>;
 export {};
-//# sourceMappingURL=Dialog.d.ts.map

package/dist/components/Modal/components/Dialog/Dialog.js

@@ -1,2 +1,7 @@
-import r from"react";import{StyledDialog as e}from"./styled.js";const t=r.forwardRef((({...t},o)=>r.createElement(e,{ref:o,...t})));export{t as Dialog};
+import React from 'react';
+import { StyledDialog } from './styled.js';
+
+const Dialog = React.forwardRef(({ ...rest }, ref) => React.createElement(StyledDialog, { ref: ref, ...rest }));
+
+export { Dialog };
 //# sourceMappingURL=Dialog.js.map

package/dist/components/Modal/components/Dialog/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sources":["../../../../../src/components/Modal/components/Dialog/Dialog.tsx"],"sourcesContent":[null],"names":["Dialog","React","forwardRef","rest","ref","createElement","StyledDialog"],"mappings":"gEAES,MAAAA,EAAaC,EAAEC,iBAAoBC,GAAAC,IAAAH,EAAAI,cAAAC,EAAA,CAAAF,IAAAA,KAAAD"}
+{"version":3,"file":"Dialog.js","sources":["../../../../../src/components/Modal/components/Dialog/Dialog.tsx"],"sourcesContent":[null],"names":[],"mappings":";;;AAQO,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CACpC,CAAC,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,KAAK,KAAC,CAAA,aAAA,CAAA,YAAY,EAAC,EAAA,GAAG,EAAE,GAAG,EAAM,GAAA,IAAI,EAAI,CAAA;;;;"}

package/dist/components/Modal/components/Dialog/constants.cjs

@@ -1,2 +1,53 @@
-"use strict";var s=require("../../../../theme/modules/breakpoints.cjs");const e={[s.breakpoints.mobile]:{xs:"60vw",sm:"72vw",base:"100vw",lg:"100vw"},[s.breakpoints.tablet]:{xs:"60vw",sm:"72vw",base:"100vw",lg:"100vw"},[s.breakpoints.lgTablet]:{xs:"48vw",sm:"56vw",base:"88vw",lg:"100vw"},[s.breakpoints.desktop]:{xs:"36vw",sm:"44vw",base:"72vw",lg:"88vw"},[s.breakpoints.lgDesktop]:{xs:"32vw",sm:"40vw",base:"52vw",lg:"80vw"}},t={xs:s.breakpoints.mobile,sm:s.breakpoints.mobile,base:s.breakpoints.tablet,lg:s.breakpoints.lgTablet};exports.fullScreenBreakpointMap=t,exports.heightMap={xs:"84vh",sm:"72vh",base:"84vh",lg:"96vh"},exports.widthMap=e;
+'use strict';
+
+var breakpoints = require('../../../../theme/modules/breakpoints.cjs');
+
+const heightMap = {
+    xs: '84vh',
+    sm: '72vh',
+    base: '84vh',
+    lg: '96vh',
+};
+const widthMap = {
+    [breakpoints.breakpoints.mobile]: {
+        xs: '60vw',
+        sm: '72vw',
+        base: '100vw',
+        lg: '100vw',
+    },
+    [breakpoints.breakpoints.tablet]: {
+        xs: '60vw',
+        sm: '72vw',
+        base: '100vw',
+        lg: '100vw',
+    },
+    [breakpoints.breakpoints.lgTablet]: {
+        xs: '48vw',
+        sm: '56vw',
+        base: '88vw',
+        lg: '100vw',
+    },
+    [breakpoints.breakpoints.desktop]: {
+        xs: '36vw',
+        sm: '44vw',
+        base: '72vw',
+        lg: '88vw',
+    },
+    [breakpoints.breakpoints.lgDesktop]: {
+        xs: '32vw',
+        sm: '40vw',
+        base: '52vw',
+        lg: '80vw',
+    },
+};
+const fullScreenBreakpointMap = {
+    xs: breakpoints.breakpoints.mobile,
+    sm: breakpoints.breakpoints.mobile,
+    base: breakpoints.breakpoints.tablet,
+    lg: breakpoints.breakpoints.lgTablet,
+};
+
+exports.fullScreenBreakpointMap = fullScreenBreakpointMap;
+exports.heightMap = heightMap;
+exports.widthMap = widthMap;
 //# sourceMappingURL=constants.cjs.map

package/dist/components/Modal/components/Dialog/constants.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"constants.cjs","sources":["../../../../../src/components/Modal/components/Dialog/constants.ts"],"sourcesContent":[null],"names":["lg","breakpoints","lgTablet"],"mappings":"yfA+CWA,GAAAC,EAAAA,YAAAC,+FAxCAF,GAAA"}
+{"version":3,"file":"constants.cjs","sources":["../../../../../src/components/Modal/components/Dialog/constants.ts"],"sourcesContent":[null],"names":["breakpoints"],"mappings":";;;;AAEa,MAAA,SAAS,GAAG;AACvB,IAAA,EAAE,EAAE,MAAM;AACV,IAAA,EAAE,EAAE,MAAM;AACV,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,EAAE,EAAE,MAAM;;AAGC,MAAA,QAAQ,GAAG;AACtB,IAAA,CAACA,uBAAW,CAAC,MAAM,GAAG;AACpB,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,EAAE,EAAE,OAAO;AACZ,KAAA;AACD,IAAA,CAACA,uBAAW,CAAC,MAAM,GAAG;AACpB,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,EAAE,EAAE,OAAO;AACZ,KAAA;AACD,IAAA,CAACA,uBAAW,CAAC,QAAQ,GAAG;AACtB,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,IAAI,EAAE,MAAM;AACZ,QAAA,EAAE,EAAE,OAAO;AACZ,KAAA;AACD,IAAA,CAACA,uBAAW,CAAC,OAAO,GAAG;AACrB,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,IAAI,EAAE,MAAM;AACZ,QAAA,EAAE,EAAE,MAAM;AACX,KAAA;AACD,IAAA,CAACA,uBAAW,CAAC,SAAS,GAAG;AACvB,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,IAAI,EAAE,MAAM;AACZ,QAAA,EAAE,EAAE,MAAM;AACX,KAAA;;AAGU,MAAA,uBAAuB,GAAG;IACrC,EAAE,EAAEA,uBAAW,CAAC,MAAM;IACtB,EAAE,EAAEA,uBAAW,CAAC,MAAM;IACtB,IAAI,EAAEA,uBAAW,CAAC,MAAM;IACxB,EAAE,EAAEA,uBAAW,CAAC,QAAQ;;;;;;;"}

package/dist/components/Modal/components/Dialog/constants.d.ts

@@ -42,4 +42,3 @@ export declare const fullScreenBreakpointMap: {
     readonly base: "720px";
     readonly lg: "960px";
 };
-//# sourceMappingURL=constants.d.ts.map

package/dist/components/Modal/components/Dialog/constants.js

@@ -1,2 +1,49 @@
-import{breakpoints as s}from"../../../../theme/modules/breakpoints.js";const v={xs:"84vh",sm:"72vh",base:"84vh",lg:"96vh"},e={[s.mobile]:{xs:"60vw",sm:"72vw",base:"100vw",lg:"100vw"},[s.tablet]:{xs:"60vw",sm:"72vw",base:"100vw",lg:"100vw"},[s.lgTablet]:{xs:"48vw",sm:"56vw",base:"88vw",lg:"100vw"},[s.desktop]:{xs:"36vw",sm:"44vw",base:"72vw",lg:"88vw"},[s.lgDesktop]:{xs:"32vw",sm:"40vw",base:"52vw",lg:"80vw"}},w={xs:s.mobile,sm:s.mobile,base:s.tablet,lg:s.lgTablet};export{w as fullScreenBreakpointMap,v as heightMap,e as widthMap};
+import { breakpoints } from '../../../../theme/modules/breakpoints.js';
+
+const heightMap = {
+    xs: '84vh',
+    sm: '72vh',
+    base: '84vh',
+    lg: '96vh',
+};
+const widthMap = {
+    [breakpoints.mobile]: {
+        xs: '60vw',
+        sm: '72vw',
+        base: '100vw',
+        lg: '100vw',
+    },
+    [breakpoints.tablet]: {
+        xs: '60vw',
+        sm: '72vw',
+        base: '100vw',
+        lg: '100vw',
+    },
+    [breakpoints.lgTablet]: {
+        xs: '48vw',
+        sm: '56vw',
+        base: '88vw',
+        lg: '100vw',
+    },
+    [breakpoints.desktop]: {
+        xs: '36vw',
+        sm: '44vw',
+        base: '72vw',
+        lg: '88vw',
+    },
+    [breakpoints.lgDesktop]: {
+        xs: '32vw',
+        sm: '40vw',
+        base: '52vw',
+        lg: '80vw',
+    },
+};
+const fullScreenBreakpointMap = {
+    xs: breakpoints.mobile,
+    sm: breakpoints.mobile,
+    base: breakpoints.tablet,
+    lg: breakpoints.lgTablet,
+};
+
+export { fullScreenBreakpointMap, heightMap, widthMap };
 //# sourceMappingURL=constants.js.map

package/dist/components/Modal/components/Dialog/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../../../../../src/components/Modal/components/Dialog/constants.ts"],"sourcesContent":[null],"names":["lg","breakpoints","lgTablet"],"mappings":"gHAOWA,GAAA,mVAwCAA,GAAAC,EAAAC"}
+{"version":3,"file":"constants.js","sources":["../../../../../src/components/Modal/components/Dialog/constants.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAEa,MAAA,SAAS,GAAG;AACvB,IAAA,EAAE,EAAE,MAAM;AACV,IAAA,EAAE,EAAE,MAAM;AACV,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,EAAE,EAAE,MAAM;;AAGC,MAAA,QAAQ,GAAG;AACtB,IAAA,CAAC,WAAW,CAAC,MAAM,GAAG;AACpB,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,EAAE,EAAE,OAAO;AACZ,KAAA;AACD,IAAA,CAAC,WAAW,CAAC,MAAM,GAAG;AACpB,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,IAAI,EAAE,OAAO;AACb,QAAA,EAAE,EAAE,OAAO;AACZ,KAAA;AACD,IAAA,CAAC,WAAW,CAAC,QAAQ,GAAG;AACtB,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,IAAI,EAAE,MAAM;AACZ,QAAA,EAAE,EAAE,OAAO;AACZ,KAAA;AACD,IAAA,CAAC,WAAW,CAAC,OAAO,GAAG;AACrB,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,IAAI,EAAE,MAAM;AACZ,QAAA,EAAE,EAAE,MAAM;AACX,KAAA;AACD,IAAA,CAAC,WAAW,CAAC,SAAS,GAAG;AACvB,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,EAAE,EAAE,MAAM;AACV,QAAA,IAAI,EAAE,MAAM;AACZ,QAAA,EAAE,EAAE,MAAM;AACX,KAAA;;AAGU,MAAA,uBAAuB,GAAG;IACrC,EAAE,EAAE,WAAW,CAAC,MAAM;IACtB,EAAE,EAAE,WAAW,CAAC,MAAM;IACtB,IAAI,EAAE,WAAW,CAAC,MAAM;IACxB,EAAE,EAAE,WAAW,CAAC,QAAQ;;;;;"}

package/dist/components/Modal/components/Dialog/styled.cjs

@@ -1,89 +1,24 @@
-"use strict";var e=require("styled-components"),t=require("framer-motion"),a=require("../../../../utils/color.cjs"),i=require("../../../Card/Card.cjs"),o=require("../../../../theme/index.cjs"),r=require("./constants.cjs"),d=require("../styled.cjs");function n(e){return e&&e.__esModule?e:{default:e}}var s=n(e);const{breakpoints:m}=o.theme,l=s.default(t.motion.dialog).attrs({initial:{opacity:0,y:-50,bounce:0},exit:{opacity:0,y:-50,bounce:0},animate:{opacity:1,y:0,bounce:0},transition:{type:"tween",duration:.25}})`
-  padding: 0;
-  border: none;
-  border-radius: ${o.theme.sizes.sm};
-  box-shadow: ${o.theme.shadows.lg};
+'use strict';
 
-  min-width: 464px;
+var styled = require('styled-components');
+var framerMotion = require('framer-motion');
+var color = require('../../../../utils/color.cjs');
+var Card = require('../../../Card/Card.cjs');
+var index = require('../../../../theme/index.cjs');
+var constants = require('./constants.cjs');
+var styled$1 = require('../styled.cjs');
 
-  &::backdrop {
-    animation: fadeIn 0.25s ease forwards;
-  }
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
-  & > ${i.Card.Surface} {
-    display: flex;
-    flex-direction: column;
+var styled__default = /*#__PURE__*/_interopDefaultCompat(styled);
 
-    ${({variant:e})=>`max-height: ${r.heightMap[e]};`}
+const { breakpoints } = index.theme;
+const StyledDialog = styled__default.default(framerMotion.motion.dialog).attrs({
+    initial: { opacity: 0, y: -50, bounce: 0 },
+    exit: { opacity: 0, y: -50, bounce: 0 },
+    animate: { opacity: 1, y: 0, bounce: 0 },
+    transition: { type: 'tween', duration: 0.25 },
+}).withConfig({ displayName: "vui--StyledDialog", componentId: "vui--1ohvs0u" }) `padding:0;border:none;border-radius:${index.theme.sizes.sm};box-shadow:${index.theme.shadows.lg};min-width:464px;&::backdrop{animation:fadeIn 0.25s ease forwards;}& > ${Card.Card.Surface}{display:flex;flex-direction:column;${({ variant }) => `max-height: ${constants.heightMap[variant]};`} ${styled$1.MainSection}{padding-bottom:${index.theme.sizes.md};}${Card.Card.Footer}{margin-top:0;}}@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}@media (min-width: calc(${breakpoints.mobile} + 1px))and (max-width: ${breakpoints.tablet}){max-width:${({ variant }) => constants.widthMap[breakpoints.tablet][variant]};}@media (min-width: ${breakpoints.tablet})and (max-width: ${breakpoints.lgTablet}){max-width:${({ variant }) => constants.widthMap[breakpoints.lgTablet][variant]};}@media (min-width: ${breakpoints.lgTablet})and (max-width: ${breakpoints.desktop}){max-width:${({ variant }) => constants.widthMap[breakpoints.desktop][variant]};}@media (min-width: ${breakpoints.desktop}){max-width:${({ variant }) => constants.widthMap[breakpoints.lgDesktop][variant]};}@media (max-width: ${({ variant }) => constants.fullScreenBreakpointMap[variant]}){margin:0;width:100%;max-width:100vw;max-height:100vh;&,& > ${Card.Card.Surface}{border-radius:0;height:100%;width:100%;max-height:unset;}}&::backdrop{background-color:${color.getOpaqueHexColor(index.theme.colors.neutral.ink.base, 0.5)};}&:not([open]){display:block;position:fixed;top:0;left:0;right:0;bottom:0;transform:translate(-50%, -50%);}`;
 
-    ${d.MainSection} {
-      padding-bottom: ${o.theme.sizes.md};
-    }
-
-    ${i.Card.Footer} {
-      margin-top: 0;
-    }
-  }
-
-  @keyframes fadeIn {
-    from {
-      opacity: 0;
-    }
-    to {
-      opacity: 1;
-    }
-  }
-
-  // ** Responsive Design ** //
-
-  // Tablet
-  @media (min-width: calc(${m.mobile} + 1px)) and (max-width: ${m.tablet}) {
-    max-width: ${({variant:e})=>r.widthMap[m.tablet][e]};
-  }
-
-  // Lg Tablet
-  @media (min-width: ${m.tablet}) and (max-width: ${m.lgTablet}) {
-    max-width: ${({variant:e})=>r.widthMap[m.lgTablet][e]};
-  }
-
-  // Desktop
-  @media (min-width: ${m.lgTablet}) and (max-width: ${m.desktop}) {
-    max-width: ${({variant:e})=>r.widthMap[m.desktop][e]};
-  }
-
-  // Lg Desktop
-  @media (min-width: ${m.desktop}) {
-    max-width: ${({variant:e})=>r.widthMap[m.lgDesktop][e]};
-  }
-
-  // Full Screen Mode
-  @media (max-width: ${({variant:e})=>r.fullScreenBreakpointMap[e]}) {
-    margin: 0;
-    width: 100%;
-    max-width: 100vw;
-    max-height: 100vh;
-
-    &,
-    & > ${i.Card.Surface} {
-      border-radius: 0;
-      height: 100%;
-      width: 100%;
-      max-height: unset;
-    }
-  }
-
-  &::backdrop {
-    background-color: ${a.getOpaqueHexColor(o.theme.colors.neutral.ink.base,.5)};
-  }
-
-  &:not([open]) {
-    display: block;
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    transform: translate(-50%, -50%);
-  }
-`;exports.StyledDialog=l;
+exports.StyledDialog = StyledDialog;
 //# sourceMappingURL=styled.cjs.map

package/dist/components/Modal/components/Dialog/styled.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"styled.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"styled.cjs","sources":["../../../../../src/components/Modal/components/Dialog/styled.ts"],"sourcesContent":[null],"names":["theme","styled","motion","Card","heightMap","MainSection","widthMap","fullScreenBreakpointMap","getOpaqueHexColor"],"mappings":";;;;;;;;;;;;;;AASA,MAAM,EAAE,WAAW,EAAE,GAAGA,WAAK;AAEtB,MAAM,YAAY,GAAGC,uBAAM,CAACC,mBAAM,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC;AACtD,IAAA,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC,EAAE;AAC1C,IAAA,IAAI,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC,EAAE;AACvC,IAAA,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE;IACxC,UAAU,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE;AAC9C,CAAA,CAAC,sHAGiBF,WAAK,CAAC,KAAK,CAAC,EAAE,CACjB,YAAA,EAAAA,WAAK,CAAC,OAAO,CAAC,EAAE,CAAA,uEAAA,EAQxBG,SAAI,CAAC,OAAO,uCAId,CAAC,EAAE,OAAO,EAAE,KAAK,eAAeC,mBAAS,CAAC,OAAO,CAAC,CAAA,CAAA,CAAG,CAErD,CAAA,EAAAC,oBAAW,mBACOL,WAAK,CAAC,KAAK,CAAC,EAAE,KAGhCG,SAAI,CAAC,MAAM,CAAA,yFAAA,EAiBW,WAAW,CAAC,MAAM,2BAA4B,WAAW,CAAC,MAAM,CAC3E,YAAA,EAAA,CAAC,EAAE,OAAO,EAAE,KAAKG,kBAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA,qBAAA,EAIhD,WAAW,CAAC,MAAM,oBAAqB,WAAW,CAAC,QAAQ,CAAA,YAAA,EACjE,CAAC,EAAE,OAAO,EAAE,KAAKA,kBAAQ,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,wBAIlD,WAAW,CAAC,QAAQ,CAAA,iBAAA,EAAqB,WAAW,CAAC,OAAO,eAClE,CAAC,EAAE,OAAO,EAAE,KAAKA,kBAAQ,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAIjD,qBAAA,EAAA,WAAW,CAAC,OAAO,CAAA,YAAA,EACzB,CAAC,EAAE,OAAO,EAAE,KAAKA,kBAAQ,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,CAAA,qBAAA,EAInD,CAAC,EAAE,OAAO,EAAE,KAAKC,iCAAuB,CAAC,OAAO,CAAC,CAO9D,6DAAA,EAAAJ,SAAI,CAAC,OAAO,CAAA,wFAAA,EASEK,uBAAiB,CAACR,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC;;;;"}

package/dist/components/Modal/components/Dialog/styled.d.ts

@@ -22,4 +22,3 @@ export declare const StyledDialog: import("styled-components").StyledComponent<i
 } & {
     variant: ModalVariants;
 }, "animate" | "initial" | "exit" | "transition">;
-//# sourceMappingURL=styled.d.ts.map

package/dist/components/Modal/components/Dialog/styled.js

@@ -1,89 +1,18 @@
-import t from"styled-components";import{motion as a}from"framer-motion";import{getOpaqueHexColor as i}from"../../../../utils/color.js";import{Card as o}from"../../../Card/Card.js";import{theme as e}from"../../../../theme/index.js";import{heightMap as r,widthMap as d,fullScreenBreakpointMap as n}from"./constants.js";import{MainSection as m}from"../styled.js";const{breakpoints:s}=e,p=t(a.dialog).attrs({initial:{opacity:0,y:-50,bounce:0},exit:{opacity:0,y:-50,bounce:0},animate:{opacity:1,y:0,bounce:0},transition:{type:"tween",duration:.25}})`
-  padding: 0;
-  border: none;
-  border-radius: ${e.sizes.sm};
-  box-shadow: ${e.shadows.lg};
-
-  min-width: 464px;
-
-  &::backdrop {
-    animation: fadeIn 0.25s ease forwards;
-  }
-
-  & > ${o.Surface} {
-    display: flex;
-    flex-direction: column;
-
-    ${({variant:t})=>`max-height: ${r[t]};`}
-
-    ${m} {
-      padding-bottom: ${e.sizes.md};
-    }
-
-    ${o.Footer} {
-      margin-top: 0;
-    }
-  }
-
-  @keyframes fadeIn {
-    from {
-      opacity: 0;
-    }
-    to {
-      opacity: 1;
-    }
-  }
-
-  // ** Responsive Design ** //
-
-  // Tablet
-  @media (min-width: calc(${s.mobile} + 1px)) and (max-width: ${s.tablet}) {
-    max-width: ${({variant:t})=>d[s.tablet][t]};
-  }
-
-  // Lg Tablet
-  @media (min-width: ${s.tablet}) and (max-width: ${s.lgTablet}) {
-    max-width: ${({variant:t})=>d[s.lgTablet][t]};
-  }
-
-  // Desktop
-  @media (min-width: ${s.lgTablet}) and (max-width: ${s.desktop}) {
-    max-width: ${({variant:t})=>d[s.desktop][t]};
-  }
-
-  // Lg Desktop
-  @media (min-width: ${s.desktop}) {
-    max-width: ${({variant:t})=>d[s.lgDesktop][t]};
-  }
-
-  // Full Screen Mode
-  @media (max-width: ${({variant:t})=>n[t]}) {
-    margin: 0;
-    width: 100%;
-    max-width: 100vw;
-    max-height: 100vh;
-
-    &,
-    & > ${o.Surface} {
-      border-radius: 0;
-      height: 100%;
-      width: 100%;
-      max-height: unset;
-    }
-  }
-
-  &::backdrop {
-    background-color: ${i(e.colors.neutral.ink.base,.5)};
-  }
-
-  &:not([open]) {
-    display: block;
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    transform: translate(-50%, -50%);
-  }
-`;export{p as StyledDialog};
+import styled from 'styled-components';
+import { motion } from 'framer-motion';
+import { getOpaqueHexColor } from '../../../../utils/color.js';
+import { Card } from '../../../Card/Card.js';
+import { theme } from '../../../../theme/index.js';
+import { heightMap, widthMap, fullScreenBreakpointMap } from './constants.js';
+import { MainSection } from '../styled.js';
+
+const { breakpoints } = theme;
+const StyledDialog = styled(motion.dialog).attrs({
+    initial: { opacity: 0, y: -50, bounce: 0 },
+    exit: { opacity: 0, y: -50, bounce: 0 },
+    animate: { opacity: 1, y: 0, bounce: 0 },
+    transition: { type: 'tween', duration: 0.25 },
+}).withConfig({ displayName: "vui--StyledDialog", componentId: "vui--1ohvs0u" }) `padding:0;border:none;border-radius:${theme.sizes.sm};box-shadow:${theme.shadows.lg};min-width:464px;&::backdrop{animation:fadeIn 0.25s ease forwards;}& > ${Card.Surface}{display:flex;flex-direction:column;${({ variant }) => `max-height: ${heightMap[variant]};`} ${MainSection}{padding-bottom:${theme.sizes.md};}${Card.Footer}{margin-top:0;}}@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}@media (min-width: calc(${breakpoints.mobile} + 1px))and (max-width: ${breakpoints.tablet}){max-width:${({ variant }) => widthMap[breakpoints.tablet][variant]};}@media (min-width: ${breakpoints.tablet})and (max-width: ${breakpoints.lgTablet}){max-width:${({ variant }) => widthMap[breakpoints.lgTablet][variant]};}@media (min-width: ${breakpoints.lgTablet})and (max-width: ${breakpoints.desktop}){max-width:${({ variant }) => widthMap[breakpoints.desktop][variant]};}@media (min-width: ${breakpoints.desktop}){max-width:${({ variant }) => widthMap[breakpoints.lgDesktop][variant]};}@media (max-width: ${({ variant }) => fullScreenBreakpointMap[variant]}){margin:0;width:100%;max-width:100vw;max-height:100vh;&,& > ${Card.Surface}{border-radius:0;height:100%;width:100%;max-height:unset;}}&::backdrop{background-color:${getOpaqueHexColor(theme.colors.neutral.ink.base, 0.5)};}&:not([open]){display:block;position:fixed;top:0;left:0;right:0;bottom:0;transform:translate(-50%, -50%);}`;
+
+export { StyledDialog };
 //# sourceMappingURL=styled.js.map

package/dist/components/Modal/components/Dialog/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"styled.js","sources":["../../../../../src/components/Modal/components/Dialog/styled.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;AASA,MAAM,EAAE,WAAW,EAAE,GAAG,KAAK;AAEtB,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC;AACtD,IAAA,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC,EAAE;AAC1C,IAAA,IAAI,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC,EAAE;AACvC,IAAA,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE;IACxC,UAAU,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE;AAC9C,CAAA,CAAC,sHAGiB,KAAK,CAAC,KAAK,CAAC,EAAE,CACjB,YAAA,EAAA,KAAK,CAAC,OAAO,CAAC,EAAE,CAAA,uEAAA,EAQxB,IAAI,CAAC,OAAO,uCAId,CAAC,EAAE,OAAO,EAAE,KAAK,eAAe,SAAS,CAAC,OAAO,CAAC,CAAA,CAAA,CAAG,CAErD,CAAA,EAAA,WAAW,mBACO,KAAK,CAAC,KAAK,CAAC,EAAE,KAGhC,IAAI,CAAC,MAAM,CAAA,yFAAA,EAiBW,WAAW,CAAC,MAAM,2BAA4B,WAAW,CAAC,MAAM,CAC3E,YAAA,EAAA,CAAC,EAAE,OAAO,EAAE,KAAK,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA,qBAAA,EAIhD,WAAW,CAAC,MAAM,oBAAqB,WAAW,CAAC,QAAQ,CAAA,YAAA,EACjE,CAAC,EAAE,OAAO,EAAE,KAAK,QAAQ,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,OAAO,CAAC,wBAIlD,WAAW,CAAC,QAAQ,CAAA,iBAAA,EAAqB,WAAW,CAAC,OAAO,eAClE,CAAC,EAAE,OAAO,EAAE,KAAK,QAAQ,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,OAAO,CAAC,CAIjD,qBAAA,EAAA,WAAW,CAAC,OAAO,CAAA,YAAA,EACzB,CAAC,EAAE,OAAO,EAAE,KAAK,QAAQ,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,OAAO,CAAC,CAAA,qBAAA,EAInD,CAAC,EAAE,OAAO,EAAE,KAAK,uBAAuB,CAAC,OAAO,CAAC,CAO9D,6DAAA,EAAA,IAAI,CAAC,OAAO,CAAA,wFAAA,EASE,iBAAiB,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC;;;;"}