react-miui 0.34.0 → 0.36.0

package/dist/components/ui/modal/Modal.js

@@ -32,54 +32,117 @@ var __importStar = (this && this.__importStar) || (function () {
         return result;
     };
 })();
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ModalRemovePaddingSelector = exports.ModalTitleSelector = exports.ModalContainerSelector = exports.Modal = void 0;
 const react_1 = __importStar(require("react"));
 const react_dom_1 = require("react-dom");
 const use_forwarded_ref_1 = require("@bedrock-layout/use-forwarded-ref");
 const fnWithProps_1 = require("../../../types/fnWithProps");
+const HandleEsc_1 = require("../../utils/HandleEsc");
 const Modal_styled_1 = require("./Modal.styled");
-const ModalBase = (0, react_1.forwardRef)(({ children, onClose, isOpen, title, className, onOverlayClick = "close", closeOnEsc = true, portal = true, position, full, }, ref) => {
+const FOCUSABLE_SELECTOR = [
+    "a[href]",
+    "button:not([disabled])",
+    "input:not([disabled])",
+    "select:not([disabled])",
+    "textarea:not([disabled])",
+    "[tabindex]:not([tabindex=\"-1\"])",
+].join(",");
+const prefersReducedMotion = () => {
+    if (typeof window === "undefined") {
+        return false;
+    }
+    return window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+};
+const ModalBase = (0, react_1.forwardRef)((_a, ref) => {
+    var { children, onClose, isOpen, title, className, onOverlayClick = "close", closeOnEsc = true, portal = true, position, full } = _a, rest = __rest(_a, ["children", "onClose", "isOpen", "title", "className", "onOverlayClick", "closeOnEsc", "portal", "position", "full"]);
     const [isClosing, setIsClosing] = (0, react_1.useState)(false);
     const [isRendered, setIsRendered] = (0, react_1.useState)(false);
     const overlayRef = (0, react_1.useRef)(null);
     const containerRef = (0, use_forwarded_ref_1.useForwardedRef)(ref);
+    const previouslyFocusedRef = (0, react_1.useRef)(null);
+    const titleId = (0, react_1.useId)();
     (0, react_1.useEffect)(() => {
-        if (!isOpen || !closeOnEsc) {
+        if (isOpen) {
+            setIsRendered(true);
+            setIsClosing(false);
             return;
         }
-        const onKeyDown = (e) => {
-            if (e.key === "Escape") {
-                onClose();
-            }
-        };
-        document.addEventListener("keydown", onKeyDown);
-        return () => {
-            document.removeEventListener("keydown", onKeyDown);
-        };
-    }, [isOpen, closeOnEsc, onClose]);
-    (0, react_1.useEffect)(() => {
-        if (!isOpen) {
-            setIsClosing(true);
+        if (prefersReducedMotion()) {
+            setIsRendered(false);
+            setIsClosing(false);
             return;
         }
-        setIsRendered(true);
-        setIsClosing(false);
+        setIsClosing(true);
     }, [isOpen]);
     (0, react_1.useEffect)(() => {
         if (!isClosing) {
             return;
         }
-        if (!overlayRef.current || !containerRef.current) {
+        const overlay = overlayRef.current;
+        const container = containerRef.current;
+        if (!overlay || !container) {
             return;
         }
-        overlayRef.current.style.animation = "none";
-        containerRef.current.style.animation = "none";
-        overlayRef.current.offsetHeight;
-        overlayRef.current.style.removeProperty("animation");
-        containerRef.current.style.removeProperty("animation");
+        overlay.style.animation = "none";
+        container.style.animation = "none";
+        overlay.offsetHeight;
+        overlay.style.removeProperty("animation");
+        container.style.removeProperty("animation");
     }, [isClosing, containerRef]);
-    const titleElem = title ? react_1.default.createElement(Modal_styled_1.TitleStyled, null, title) : null;
+    (0, react_1.useEffect)(() => {
+        var _a;
+        if (!isOpen || !isRendered) {
+            return;
+        }
+        const container = containerRef.current;
+        const overlay = overlayRef.current;
+        if (!container || !overlay) {
+            return;
+        }
+        previouslyFocusedRef.current = document.activeElement instanceof HTMLElement
+            ? document.activeElement
+            : null;
+        const focusables = container.querySelectorAll(FOCUSABLE_SELECTOR);
+        ((_a = focusables[0]) !== null && _a !== void 0 ? _a : container).focus();
+        const inerted = [];
+        let cursor = overlay;
+        while (cursor !== document.body) {
+            const parentEl = cursor.parentElement;
+            if (!parentEl) {
+                break;
+            }
+            for (const child of Array.from(parentEl.children)) {
+                if (child === cursor || !(child instanceof HTMLElement)) {
+                    continue;
+                }
+                if (!child.hasAttribute("inert")) {
+                    child.setAttribute("inert", "");
+                    inerted.push(child);
+                }
+            }
+            cursor = parentEl;
+        }
+        return () => {
+            var _a;
+            inerted.forEach((el) => {
+                el.removeAttribute("inert");
+            });
+            (_a = previouslyFocusedRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        };
+    }, [isOpen, isRendered, containerRef]);
+    const titleElem = title ? react_1.default.createElement(Modal_styled_1.TitleStyled, { id: titleId }, title) : null;
     const handleOverlayClick = (0, react_1.useCallback)((e) => {
         if (e.target !== e.currentTarget) {
             return;
@@ -87,11 +150,14 @@ const ModalBase = (0, react_1.forwardRef)(({ children, onClose, isOpen, title, c
         if (onOverlayClick === "close") {
             onClose();
         }
-        if (typeof onOverlayClick === "function") {
+        else if (typeof onOverlayClick === "function") {
             onOverlayClick();
         }
     }, [onOverlayClick, onClose]);
-    const handleAnimationEnd = (0, react_1.useCallback)(() => {
+    const handleAnimationEnd = (0, react_1.useCallback)((e) => {
+        if (e.target !== e.currentTarget) {
+            return;
+        }
         if (isOpen) {
             return;
         }
@@ -101,31 +167,37 @@ const ModalBase = (0, react_1.forwardRef)(({ children, onClose, isOpen, title, c
         return null;
     }
     const overlayVariants = {};
-    isClosing && (overlayVariants.isClosing = true);
-    position != null && (overlayVariants.position = position);
+    if (isClosing) {
+        overlayVariants.isClosing = true;
+    }
+    if (position != null) {
+        overlayVariants.position = position;
+    }
     const containerVariants = {};
-    isClosing && (containerVariants.isClosing = true);
-    full != null && (containerVariants.full = full);
+    if (isClosing) {
+        containerVariants.isClosing = true;
+    }
+    if (full != null) {
+        containerVariants.full = full;
+    }
     const childrenCount = react_1.default.Children.count(children);
     const chld = react_1.default.Children.map(children, (child, index) => {
         var _a;
-        if (react_1.default.isValidElement(child)) {
-            if (child.type === Modal_styled_1.RemovePadding) {
-                const css = (_a = child.props.css) !== null && _a !== void 0 ? _a : {};
-                if (index === 0 && titleElem == null) {
-                    css.marginTop = Modal_styled_1.NEGATIVE_PADDING;
-                }
-                if (index === childrenCount - 1) {
-                    css.marginBottom = Modal_styled_1.NEGATIVE_PADDING;
-                }
-                return react_1.default.cloneElement(child, { css });
+        if (react_1.default.isValidElement(child) && child.type === Modal_styled_1.RemovePadding) {
+            const css = Object.assign({}, ((_a = child.props.css) !== null && _a !== void 0 ? _a : {}));
+            if (index === 0 && titleElem == null) {
+                css.marginTop = Modal_styled_1.NEGATIVE_PADDING;
+            }
+            if (index === childrenCount - 1) {
+                css.marginBottom = Modal_styled_1.NEGATIVE_PADDING;
             }
-            return child;
+            return react_1.default.cloneElement(child, { css });
         }
         return child;
     });
     const tree = (react_1.default.createElement(Modal_styled_1.OverlayStyled, Object.assign({}, overlayVariants, { onClick: handleOverlayClick, ref: overlayRef, onAnimationEnd: handleAnimationEnd }),
-        react_1.default.createElement(Modal_styled_1.ContainerStyled, Object.assign({ className: className }, containerVariants, { ref: containerRef }),
+        closeOnEsc ? react_1.default.createElement(HandleEsc_1.HandleEsc, { onPress: onClose }) : null,
+        react_1.default.createElement(Modal_styled_1.ContainerStyled, Object.assign({ role: "dialog", "aria-modal": true, "aria-labelledby": titleElem ? titleId : undefined, tabIndex: -1, className: className }, containerVariants, { ref: containerRef }, rest),
             titleElem,
             chld)));
     if (portal) {

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

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

package/dist/components/ui/modal/Modal.styled.d.ts

@@ -260,7 +260,7 @@ declare const ContainerStyled: import("../../../../node_modules/@stitches/react/
         height: string | number;
     };
 }>>;
-declare const TitleStyled: import("../../../../node_modules/@stitches/react/types/styled-component").StyledComponent<"div", {}, {}, import("../../../../node_modules/@stitches/react/types/css-util").CSS<{}, {
+declare const TitleStyled: import("../../../../node_modules/@stitches/react/types/styled-component").StyledComponent<"h2", {}, {}, import("../../../../node_modules/@stitches/react/types/css-util").CSS<{}, {
     colors: {
         background: "white";
         mainColor: "#008ad2";

package/dist/components/ui/modal/Modal.styled.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.styled.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/modal/Modal.styled.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,gBAAgB,QAAe,CAAC;AAWtC,QAAA,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BjB,CAAC;AAaH,QAAA,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAEjB,CAAC;AAEH,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BnB,CAAC;AAEH,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAKf,CAAC;AAEH,OAAO,EACH,aAAa,EACb,aAAa,EACb,eAAe,EACf,WAAW,EAEX,gBAAgB,GACnB,CAAC"}
+{"version":3,"file":"Modal.styled.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/modal/Modal.styled.ts"],"names":[],"mappings":"AAGA,QAAA,MAAM,gBAAgB,QAAe,CAAC;AAWtC,QAAA,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCjB,CAAC;AAaH,QAAA,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAEjB,CAAC;AAEH,QAAA,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyCnB,CAAC;AAEH,QAAA,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAMf,CAAC;AAEH,OAAO,EACH,aAAa,EACb,aAAa,EACb,eAAe,EACf,WAAW,EAEX,gBAAgB,GACnB,CAAC"}

package/dist/components/ui/modal/Modal.styled.js

@@ -14,19 +14,23 @@ const overlay = (0, theme_1.keyframes)({
     },
 });
 const OverlayStyled = (0, theme_1.styled)("div", {
-    position: "fixed",
-    zIndex: 4,
-    top: 0,
-    bottom: 0,
-    left: 0,
-    right: 0,
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    animation: `${overlay.toString()} 300ms`,
-    animationFillMode: "forwards",
-    backdropFilter: "blur(5px)",
-    variants: {
+    "position": "fixed",
+    "zIndex": 4,
+    "top": 0,
+    "bottom": 0,
+    "left": 0,
+    "right": 0,
+    "display": "flex",
+    "alignItems": "center",
+    "justifyContent": "center",
+    "animation": `${overlay.toString()} 300ms`,
+    "animationFillMode": "forwards",
+    "backdropFilter": "blur(5px)",
+    "@media (prefers-reduced-motion: reduce)": {
+        animation: "none",
+        background: "rgba($background, 0.3)",
+    },
+    "variants": {
         position: {
             bottom: {
                 alignItems: "flex-end",
@@ -56,17 +60,27 @@ const RemovePadding = (0, theme_1.styled)("div", {
 });
 exports.RemovePadding = RemovePadding;
 const ContainerStyled = (0, theme_1.styled)("div", {
-    background: "$modalBg",
-    borderRadius: (0, theme_1.dimensionsPxToRem)(12),
-    maxWidth: (0, theme_1.pxToRem)(333),
-    maxHeight: "100%",
-    width: "calc(100% - 30px)",
-    padding: PADDING,
-    position: "relative",
-    boxSizing: "border-box",
-    animation: `${container.toString()} 300ms`,
-    animationFillMode: "forwards",
-    variants: {
+    "background": "$modalBg",
+    "borderRadius": (0, theme_1.dimensionsPxToRem)(12),
+    "maxWidth": (0, theme_1.pxToRem)(333),
+    "maxHeight": "100%",
+    "width": "calc(100% - 30px)",
+    "padding": PADDING,
+    "position": "relative",
+    "boxSizing": "border-box",
+    "overflowY": "auto",
+    "overscrollBehavior": "contain",
+    "animation": `${container.toString()} 300ms`,
+    "animationFillMode": "forwards",
+    "&:focus": {
+        outline: "none",
+    },
+    "@media (prefers-reduced-motion: reduce)": {
+        animation: "none",
+        opacity: 1,
+        transform: "none",
+    },
+    "variants": {
         full: {
             true: {
                 width: "calc(100vw - 30px)",
@@ -81,11 +95,12 @@ const ContainerStyled = (0, theme_1.styled)("div", {
     },
 });
 exports.ContainerStyled = ContainerStyled;
-const TitleStyled = (0, theme_1.styled)("div", {
+const TitleStyled = (0, theme_1.styled)("h2", {
     fontSize: (0, theme_1.fontPxToRem)(40),
     textAlign: "center",
     color: "$text3",
     margin: `${(0, theme_1.dimensionsPxToRem)(90)} 0`,
+    fontWeight: "inherit",
 });
 exports.TitleStyled = TitleStyled;
 //# sourceMappingURL=Modal.styled.js.map

package/dist/components/ui/modal/Modal.styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.styled.js","sourceRoot":"","sources":["../../../../src/components/ui/modal/Modal.styled.ts"],"names":[],"mappings":";;;AAAA,0CAA4F;AAE5F,MAAM,OAAO,GAAG,IAAA,eAAO,EAAC,EAAE,CAAC,CAAC;AAC5B,MAAM,gBAAgB,GAAG,IAAA,eAAO,EAAC,CAAC,EAAE,CAAC,CAAC;AAgGlC,4CAAgB;AA9FpB,MAAM,OAAO,GAAG,IAAA,iBAAS,EAAC;IACtB,IAAI,EAAE;QACF,UAAU,EAAE,sBAAsB;KACrC;IACD,EAAE,EAAE;QACA,UAAU,EAAE,wBAAwB;KACvC;CACJ,CAAC,CAAC;AAEH,MAAM,aAAa,GAAG,IAAA,cAAM,EAAC,KAAK,EAAE;IAChC,QAAQ,EAAE,OAAO;IACjB,MAAM,EAAE,CAAC;IACT,GAAG,EAAE,CAAC;IACN,MAAM,EAAE,CAAC;IACT,IAAI,EAAE,CAAC;IACP,KAAK,EAAE,CAAC;IACR,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,cAAc,EAAE,QAAQ;IACxB,SAAS,EAAE,GAAG,OAAO,CAAC,QAAQ,EAAE,QAAQ;IACxC,iBAAiB,EAAE,UAAU;IAC7B,cAAc,EAAE,WAAW;IAE3B,QAAQ,EAAE;QACN,QAAQ,EAAE;YACN,MAAM,EAAE;gBACJ,UAAU,EAAE,UAAU;gBACtB,aAAa,EAAE,IAAA,yBAAiB,EAAC,EAAE,CAAC;aACvC;SACJ;QACD,SAAS,EAAE;YACP,IAAI,EAAE;gBACF,kBAAkB,EAAE,SAAS;aAChC;SACJ;KACJ;CACJ,CAAC,CAAC;AAqDC,sCAAa;AAnDjB,MAAM,SAAS,GAAG,IAAA,iBAAS,EAAC;IACxB,IAAI,EAAE;QACF,SAAS,EAAE,kBAAkB;QAC7B,OAAO,EAAE,CAAC;KACb;IACD,EAAE,EAAE;QACA,SAAS,EAAE,eAAe;QAC1B,OAAO,EAAE,CAAC;KACb;CACJ,CAAC,CAAC;AAEH,MAAM,aAAa,GAAG,IAAA,cAAM,EAAC,KAAK,EAAE;IAChC,EAAE,EAAE,gBAAgB;CACvB,CAAC,CAAC;AAuCC,sCAAa;AArCjB,MAAM,eAAe,GAAG,IAAA,cAAM,EAAC,KAAK,EAAE;IAClC,UAAU,EAAE,UAAU;IACtB,YAAY,EAAE,IAAA,yBAAiB,EAAC,EAAE,CAAC;IACnC,QAAQ,EAAE,IAAA,eAAO,EAAC,GAAG,CAAC;IACtB,SAAS,EAAE,MAAM;IACjB,KAAK,EAAE,mBAAmB;IAC1B,OAAO,EAAE,OAAO;IAChB,QAAQ,EAAE,UAAU;IACpB,SAAS,EAAE,YAAY;IACvB,SAAS,EAAE,GAAG,SAAS,CAAC,QAAQ,EAAE,QAAQ;IAC1C,iBAAiB,EAAE,UAAU;IAE7B,QAAQ,EAAE;QAEN,IAAI,EAAE;YACF,IAAI,EAAE;gBACF,KAAK,EAAE,oBAAoB;gBAC3B,QAAQ,EAAE,IAAA,yBAAiB,EAAC,IAAI,CAAC;aACpC;SACJ;QACD,SAAS,EAAE;YACP,IAAI,EAAE;gBACF,kBAAkB,EAAE,SAAS;aAChC;SACJ;KACJ;CACJ,CAAC,CAAC;AAYC,0CAAe;AAVnB,MAAM,WAAW,GAAG,IAAA,cAAM,EAAC,KAAK,EAAE;IAC9B,QAAQ,EAAE,IAAA,mBAAW,EAAC,EAAE,CAAC;IACzB,SAAS,EAAE,QAAQ;IACnB,KAAK,EAAE,QAAQ;IACf,MAAM,EAAE,GAAG,IAAA,yBAAiB,EAAC,EAAE,CAAC,IAAI;CACvC,CAAC,CAAC;AAMC,kCAAW"}
+{"version":3,"file":"Modal.styled.js","sourceRoot":"","sources":["../../../../src/components/ui/modal/Modal.styled.ts"],"names":[],"mappings":"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"}

package/dist/components/ui/modal/ModalButtons.d.ts

@@ -1,2 +1,180 @@
-export { ModalButtons } from "./ModalButtons.styled";
+import React from "react";
+declare const ModalButtons: import("../../../../node_modules/@stitches/react/types/styled-component").StyledComponent<"div", {}, {}, import("../../../../node_modules/@stitches/react/types/css-util").CSS<{}, {
+    colors: {
+        background: "white";
+        mainColor: "#008ad2";
+        mainColorAlt: "#006AA9";
+        activeBg: "#e7e7e7";
+        inactiveBg: "#d3d3de";
+        inactiveDarkBg: "#999";
+        toggleHandleBg: "#e0e0e0";
+        toggleHandleBorder: "#cdcdcd";
+        toggleBgDisabled: "#f0f0f0";
+        toggleHandleBorderDisabled: "#c29f7d";
+        toggleHandleBgDisabled: "#deae84";
+        icon: "#636363";
+        border: "#d5d5d5";
+        buttonBorder: "#bababa";
+        headerBorder: "#c8c8c9";
+        headerBg: "#efeff0";
+        headerText: "#484848";
+        text: "#323232";
+        text2: "#181818";
+        text3: "#000000";
+        sub: "#959595";
+        popText: "#666";
+        toolbarBorder: "#ababab";
+        toolbarBg: "#f8f8f8";
+        modalBg: "#f7f7f7";
+        modalButtonBg: "#f8f8f8";
+        modalButtonBorder: "#c2c2c2";
+        inputDisabledBg: "#f3f3f3";
+        inputDisabledText: "#959595";
+        choiceBg: "#ffffff";
+        choiceText: "#999999";
+        choiceActiveBg: "#f3f3f3";
+        choiceActiveText: "#313131";
+        choiceBorder: "#cfcfcf";
+        selectorText: "#606060";
+        selectorActive: "#008ad2";
+        blue1: "#038bf4";
+        blue2: "#b7d6f5";
+        blue3: "#dbe6ff";
+        blue4: "#33b4ff";
+        blue5: "#30a2e6";
+        orange1: "#ff7200";
+        orange1Darker: "#cc5b00";
+        purple1: "#7357e8";
+        green1: "#3ec234";
+        green1Darker: "#38af2f";
+        pink1: "#ff388f";
+        red1: "#ea2700";
+        yellow1: "#ffde9d";
+        yellow2: "#e4a429";
+        yellow3: "#fff5db";
+        pinky1: "#f5c0b7";
+        pinky2: "#e07b67";
+        pinky3: "#ffe1db";
+        grey1: "#737373";
+        focusColor: "#dcaf00";
+        scrollbarsThumb: "#737373";
+        scrollbarsBg: "transparent";
+        tableStripedBg: "#fafafa";
+        toolButtonText: "#666e80";
+    };
+}, import("../../../../node_modules/@stitches/react/types/config").DefaultThemeMap, {
+    mx: (value: string | number) => {
+        marginLeft: string | number;
+        marginRight: string | number;
+    };
+    my: (value: string | number) => {
+        marginTop: string | number;
+        marginBottom: string | number;
+    };
+    px: (value: string | number) => {
+        paddingLeft: string | number;
+        paddingRight: string | number;
+    };
+    py: (value: string | number) => {
+        paddingTop: string | number;
+        paddingBottom: string | number;
+    };
+    size: (value: string | number) => {
+        width: string | number;
+        height: string | number;
+    };
+}>> & {
+    Button: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | React.RefObject<HTMLButtonElement> | null | undefined;
+    }, "css" | "variant"> & import("../../../../node_modules/@stitches/react/types/styled-component").TransformProps<{
+        variant?: "main";
+    }, {}> & {
+        css?: import("../../../../node_modules/@stitches/react/types/css-util").CSS<{}, {
+            colors: {
+                background: "white";
+                mainColor: "#008ad2";
+                mainColorAlt: "#006AA9";
+                activeBg: "#e7e7e7";
+                inactiveBg: "#d3d3de";
+                inactiveDarkBg: "#999";
+                toggleHandleBg: "#e0e0e0";
+                toggleHandleBorder: "#cdcdcd";
+                toggleBgDisabled: "#f0f0f0";
+                toggleHandleBorderDisabled: "#c29f7d";
+                toggleHandleBgDisabled: "#deae84";
+                icon: "#636363";
+                border: "#d5d5d5";
+                buttonBorder: "#bababa";
+                headerBorder: "#c8c8c9";
+                headerBg: "#efeff0";
+                headerText: "#484848";
+                text: "#323232";
+                text2: "#181818";
+                text3: "#000000";
+                sub: "#959595";
+                popText: "#666";
+                toolbarBorder: "#ababab";
+                toolbarBg: "#f8f8f8";
+                modalBg: "#f7f7f7";
+                modalButtonBg: "#f8f8f8";
+                modalButtonBorder: "#c2c2c2";
+                inputDisabledBg: "#f3f3f3";
+                inputDisabledText: "#959595";
+                choiceBg: "#ffffff";
+                choiceText: "#999999";
+                choiceActiveBg: "#f3f3f3";
+                choiceActiveText: "#313131";
+                choiceBorder: "#cfcfcf";
+                selectorText: "#606060";
+                selectorActive: "#008ad2";
+                blue1: "#038bf4";
+                blue2: "#b7d6f5";
+                blue3: "#dbe6ff";
+                blue4: "#33b4ff";
+                blue5: "#30a2e6";
+                orange1: "#ff7200";
+                orange1Darker: "#cc5b00";
+                purple1: "#7357e8";
+                green1: "#3ec234";
+                green1Darker: "#38af2f";
+                pink1: "#ff388f";
+                red1: "#ea2700";
+                yellow1: "#ffde9d";
+                yellow2: "#e4a429";
+                yellow3: "#fff5db";
+                pinky1: "#f5c0b7";
+                pinky2: "#e07b67";
+                pinky3: "#ffe1db";
+                grey1: "#737373";
+                focusColor: "#dcaf00";
+                scrollbarsThumb: "#737373";
+                scrollbarsBg: "transparent";
+                tableStripedBg: "#fafafa";
+                toolButtonText: "#666e80";
+            };
+        }, import("../../../../node_modules/@stitches/react/types/config").DefaultThemeMap, {
+            mx: (value: string | number) => {
+                marginLeft: string | number;
+                marginRight: string | number;
+            };
+            my: (value: string | number) => {
+                marginTop: string | number;
+                marginBottom: string | number;
+            };
+            px: (value: string | number) => {
+                paddingLeft: string | number;
+                paddingRight: string | number;
+            };
+            py: (value: string | number) => {
+                paddingTop: string | number;
+                paddingBottom: string | number;
+            };
+            size: (value: string | number) => {
+                width: string | number;
+                height: string | number;
+            };
+        }>;
+    }, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+};
+export { ModalButtons, };
 //# sourceMappingURL=ModalButtons.d.ts.map

package/dist/components/ui/modal/ModalButtons.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalButtons.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/modal/ModalButtons.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC"}
+{"version":3,"file":"ModalButtons.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/modal/ModalButtons.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AA+B1C,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEhB,CAAC;AAEH,OAAO,EACH,YAAY,GACf,CAAC"}

package/dist/components/ui/modal/ModalButtons.js

@@ -1,6 +1,67 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ModalButtons = void 0;
-var ModalButtons_styled_1 = require("./ModalButtons.styled");
-Object.defineProperty(exports, "ModalButtons", { enumerable: true, get: function () { return ModalButtons_styled_1.ModalButtons; } });
+const react_1 = __importStar(require("react"));
+const use_forwarded_ref_1 = require("@bedrock-layout/use-forwarded-ref");
+const fnWithProps_1 = require("../../../types/fnWithProps");
+const useRipple_1 = require("../../../utils/useRipple");
+const ModalButtons_styled_1 = require("./ModalButtons.styled");
+const Button = (0, react_1.forwardRef)((props, ref) => {
+    const { children, onPointerDown, onKeyDown } = props, rest = __rest(props, ["children", "onPointerDown", "onKeyDown"]);
+    const innerRef = (0, use_forwarded_ref_1.useForwardedRef)(ref);
+    const ripple = (0, useRipple_1.useRipple)({ ref: innerRef, onPointerDown, onKeyDown });
+    return (react_1.default.createElement(ModalButtons_styled_1.StyledButton, Object.assign({ ref: innerRef, onPointerDown: ripple.onPointerDown, onKeyDown: ripple.onKeyDown }, rest),
+        children,
+        ripple.ripples));
+});
+Button.displayName = "ModalButtons.Button";
+Button.toString = () => ModalButtons_styled_1.StyledButton.toString();
+const ModalButtons = (0, fnWithProps_1.fnWithProps)(ModalButtons_styled_1.Container, {
+    Button,
+});
+exports.ModalButtons = ModalButtons;
 //# sourceMappingURL=ModalButtons.js.map

package/dist/components/ui/modal/ModalButtons.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalButtons.js","sourceRoot":"","sources":["../../../../src/components/ui/modal/ModalButtons.tsx"],"names":[],"mappings":";;;AAAA,6DAAqD;AAA5C,mHAAA,YAAY,OAAA"}
+{"version":3,"file":"ModalButtons.js","sourceRoot":"","sources":["../../../../src/components/ui/modal/ModalButtons.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAE1C,yEAAoE;AAEpE,4DAAyD;AACzD,wDAAqD;AACrD,+DAAgE;AAIhE,MAAM,MAAM,GAAG,IAAA,kBAAU,EAAiC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACrE,MAAM,EAAE,QAAQ,EAAE,aAAa,EAAE,SAAS,KAAc,KAAK,EAAd,IAAI,UAAK,KAAK,EAAvD,0CAA+C,CAAQ,CAAC;IAC9D,MAAM,QAAQ,GAAG,IAAA,mCAAe,EAAC,GAAG,CAAC,CAAC;IACtC,MAAM,MAAM,GAAG,IAAA,qBAAS,EAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,aAAa,EAAE,SAAS,EAAE,CAAC,CAAC;IAEtE,OAAO,CACH,8BAAC,kCAAY,kBACT,GAAG,EAAE,QAAQ,EACb,aAAa,EAAE,MAAM,CAAC,aAAa,EACnC,SAAS,EAAE,MAAM,CAAC,SAAS,IACvB,IAAI;QAEP,QAAQ;QACR,MAAM,CAAC,OAAO,CACJ,CAClB,CAAC;AACN,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,WAAW,GAAG,qBAAqB,CAAC;AAC3C,MAAM,CAAC,QAAQ,GAAG,GAAG,EAAE,CAAC,kCAAY,CAAC,QAAQ,EAAE,CAAC;AAEhD,MAAM,YAAY,GAAG,IAAA,yBAAW,EAAC,+BAAS,EAAE;IACxC,MAAM;CACT,CAAC,CAAC;AAGC,oCAAY"}