matsuri-ui 9.7.2-alpha.0

package/dist/esm/Mobile/useMobile.js

@@ -0,0 +1,113 @@
+import { useCallback, useEffect, useLayoutEffect, useState } from "react";
+import ResizeObserver from "resize-observer-polyfill";
+export var useMobile = () => {
+  useLayoutEffect(() => {
+    document.body.style.cssText = "\n            height: 100%;\n            height: -moz-available;\n            height: -webkit-fill-available;  \n            height: fill-available;\n        ";
+  }, []);
+  var [header, setHeader] = useState({
+    current: null
+  });
+  var headerRef = useCallback(node => {
+    setHeader({
+      current: node
+    });
+  }, []);
+  var [headerHeight, setHeaderHeight] = useState(0);
+  useEffect(() => {
+    var element = header.current;
+    var resizeObserver = new ResizeObserver(entries => {
+      if (!Array.isArray(entries)) {
+        return;
+      }
+
+      if (!entries.length) {
+        return;
+      }
+
+      setHeaderHeight(entries[0].contentRect.height);
+    });
+
+    if (element) {
+      resizeObserver.observe(element);
+    }
+
+    return () => {
+      if (element) {
+        resizeObserver.unobserve(element);
+      }
+    };
+  }, [header]);
+  var headerProps = {
+    ref: headerRef,
+    style: {
+      position: "fixed",
+      width: "100%",
+      zIndex: 99,
+      top: 0
+    }
+  };
+  var rootProps = {
+    style: {
+      position: "absolute",
+      height: "100%",
+      width: "100%",
+      top: 0,
+      left: 0
+    }
+  };
+  var [footer, setFooter] = useState({
+    current: null
+  });
+  var footerRef = useCallback(node => {
+    setFooter({
+      current: node
+    });
+  }, []);
+  var [footerHeight, setFooterHeight] = useState(0);
+  useEffect(() => {
+    var element = footer.current;
+    var resizeObserver = new ResizeObserver(entries => {
+      if (!Array.isArray(entries)) {
+        return;
+      }
+
+      if (!entries.length) {
+        return;
+      }
+
+      setFooterHeight(entries[0].contentRect.height);
+    });
+
+    if (element) {
+      resizeObserver.observe(element);
+    }
+
+    return () => {
+      if (element) {
+        resizeObserver.unobserve(element);
+      }
+    };
+  }, [footer]);
+  var footerProps = {
+    ref: footerRef,
+    style: {
+      position: "fixed",
+      width: "100%",
+      zIndex: 99,
+      bottom: 0
+    }
+  };
+  var bodyProps = {
+    style: {
+      paddingTop: headerHeight,
+      paddingBottom: footerHeight
+    }
+  };
+  return {
+    rootProps,
+    headerProps,
+    footerProps,
+    bodyProps
+  };
+};
+//# sourceMappingURL=useMobile.js.map

package/dist/esm/Mobile/useMobile.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Mobile/useMobile.ts"],"names":["useCallback","useEffect","useLayoutEffect","useState","ResizeObserver","useMobile","document","body","style","cssText","header","setHeader","current","headerRef","node","headerHeight","setHeaderHeight","element","resizeObserver","entries","Array","isArray","length","contentRect","height","observe","unobserve","headerProps","ref","position","width","zIndex","top","rootProps","left","footer","setFooter","footerRef","footerHeight","setFooterHeight","footerProps","bottom","bodyProps","paddingTop","paddingBottom"],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useState } from \"react\"\nimport ResizeObserver from \"resize-observer-polyfill\"\n\nexport const useMobile = <\n    HeaderElement extends Element = HTMLElement,\n    FooterElement extends Element = HTMLElement\n>() => {\n    useLayoutEffect(() => {\n        document.body.style.cssText = `\n            height: 100%;\n            height: -moz-available;\n            height: -webkit-fill-available;  \n            height: fill-available;\n        `\n    }, [])\n    const [header, setHeader] = useState<{ current: HeaderElement | null }>({\n        current: null\n    })\n    const headerRef = useCallback((node: HeaderElement) => {\n        setHeader({ current: node })\n    }, [])\n    const [headerHeight, setHeaderHeight] = useState(0)\n    useEffect(() => {\n        const element: Element | null = header.current\n        const resizeObserver = new ResizeObserver((entries: ResizeObserverEntry[]) => {\n            if (!Array.isArray(entries)) {\n                return\n            }\n            if (!entries.length) {\n                return\n            }\n            setHeaderHeight(entries[0].contentRect.height)\n        })\n        if (element) {\n            resizeObserver.observe(element)\n        }\n        return () => {\n            if (element) {\n                resizeObserver.unobserve(element)\n            }\n        }\n    }, [header])\n    const headerProps = {\n        ref: headerRef,\n        style: {\n            position: \"fixed\",\n            width: \"100%\",\n            zIndex: 99,\n            top: 0\n        } as const\n    }\n    const rootProps = {\n        style: {\n            position: \"absolute\",\n            height: \"100%\",\n            width: \"100%\",\n            top: 0,\n            left: 0\n        } as const\n    }\n    const [footer, setFooter] = useState<{ current: FooterElement | null }>({\n        current: null\n    })\n    const footerRef = useCallback((node: FooterElement) => {\n        setFooter({ current: node })\n    }, [])\n    const [footerHeight, setFooterHeight] = useState(0)\n    useEffect(() => {\n        const element: Element | null = footer.current\n        const resizeObserver = new ResizeObserver((entries: ResizeObserverEntry[]) => {\n            if (!Array.isArray(entries)) {\n                return\n            }\n            if (!entries.length) {\n                return\n            }\n            setFooterHeight(entries[0].contentRect.height)\n        })\n        if (element) {\n            resizeObserver.observe(element)\n        }\n        return () => {\n            if (element) {\n                resizeObserver.unobserve(element)\n            }\n        }\n    }, [footer])\n    const footerProps = {\n        ref: footerRef,\n        style: {\n            position: \"fixed\",\n            width: \"100%\",\n            zIndex: 99,\n            bottom: 0\n        } as const\n    }\n\n    const bodyProps = {\n        style: {\n            paddingTop: headerHeight,\n            paddingBottom: footerHeight\n        }\n    }\n    return {\n        rootProps,\n        headerProps,\n        footerProps,\n        bodyProps\n    }\n}\n"],"file":"useMobile.js"}

package/dist/esm/Modal/Modal.js

@@ -0,0 +1,71 @@
+var _excluded = ["open", "header", "body", "footer", "style", "className", "onClickOutside", "onEsc", "onEnter", "backdrop", "width", "maxWidth"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import { ModalBackdrop } from "./ModalBackdrop";
+import { ModalBody } from "./ModalBody";
+import { ModalFooter } from "./ModalFooter";
+import { ModalHeader } from "./ModalHeader";
+import { ModalProvider } from "./ModalProvider";
+import { Paper } from "../Paper";
+import { Portal } from "../Portal";
+import { css } from "@emotion/react";
+import { useKeyboard } from "../hooks/useKeyboard";
+import { useOnClickOutside } from "../hooks/useOnClickOutside";
+import { useTheme } from "../theme";
+import React, { useRef } from "react";
+import { jsx as ___EmotionJSX } from "@emotion/react";
+
+var Container = _ref => {
+  var {
+    backdrop,
+    children
+  } = _ref;
+  return backdrop ? ___EmotionJSX(ModalBackdrop, null, children) : ___EmotionJSX(React.Fragment, null, children);
+};
+
+export var Modal = props => {
+  var {
+    open = true,
+    header,
+    body,
+    footer,
+    style,
+    className,
+    onClickOutside,
+    onEsc,
+    onEnter,
+    backdrop,
+    width,
+    maxWidth = 500
+  } = props,
+      others = _objectWithoutProperties(props, _excluded);
+
+  var ref = useRef(null);
+  useOnClickOutside(ref, onClickOutside);
+  useKeyboard("Escape", onEsc);
+  useKeyboard("Enter", onEnter);
+  var theme = useTheme();
+  return ___EmotionJSX(ModalProvider, {
+    value: others
+  }, open ? ___EmotionJSX(Portal, null, ___EmotionJSX(Container, {
+    backdrop: backdrop
+  }, ___EmotionJSX(Paper, {
+    ref: ref,
+    style: _objectSpread(_objectSpread({}, style), {}, {
+      width,
+      maxWidth
+    }),
+    className: className,
+    css: /*#__PURE__*/css("z-index:", theme.zIndex.modal, ";display:flex;flex-direction:column;border:1px solid ", theme.palette.gray[300], ";border-radius:0.3em;" + (process.env.NODE_ENV === "production" ? "" : ";label:Modal;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9Nb2RhbC9Nb2RhbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUdvQyIsImZpbGUiOiIuLi8uLi8uLi9zcmMvTW9kYWwvTW9kYWwudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTW9kYWxCYWNrZHJvcCB9IGZyb20gXCIuL01vZGFsQmFja2Ryb3BcIlxuaW1wb3J0IHsgTW9kYWxCb2R5IH0gZnJvbSBcIi4vTW9kYWxCb2R5XCJcbmltcG9ydCB7IE1vZGFsRm9vdGVyIH0gZnJvbSBcIi4vTW9kYWxGb290ZXJcIlxuaW1wb3J0IHsgTW9kYWxIZWFkZXIgfSBmcm9tIFwiLi9Nb2RhbEhlYWRlclwiXG5pbXBvcnQgeyBNb2RhbFByb3ZpZGVyIH0gZnJvbSBcIi4vTW9kYWxQcm92aWRlclwiXG5pbXBvcnQgeyBQYXBlciB9IGZyb20gXCIuLi9QYXBlclwiXG5pbXBvcnQgeyBQb3J0YWwgfSBmcm9tIFwiLi4vUG9ydGFsXCJcbmltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiXG5pbXBvcnQgeyB1c2VLZXlib2FyZCB9IGZyb20gXCIuLi9ob29rcy91c2VLZXlib2FyZFwiXG5pbXBvcnQgeyB1c2VPbkNsaWNrT3V0c2lkZSB9IGZyb20gXCIuLi9ob29rcy91c2VPbkNsaWNrT3V0c2lkZVwiXG5pbXBvcnQgeyB1c2VUaGVtZSB9IGZyb20gXCIuLi90aGVtZVwiXG5pbXBvcnQgUmVhY3QsIHsgdXNlUmVmIH0gZnJvbSBcInJlYWN0XCJcblxuZXhwb3J0IGludGVyZmFjZSBNb2RhbFByb3BzIGV4dGVuZHMgUmVhY3QuSFRNTEF0dHJpYnV0ZXM8SFRNTERpdkVsZW1lbnQ+IHtcbiAgICAvKipcbiAgICAgKiBNb2RhbOOBrk1vZGFsSGVhZGVy44Gu5Y+z5YG044GuWOODnOOCv+ODs+OCkuaKvOOBmeOBqOeZuueBq+OBl+OBvuOBmeOAglxuICAgICAqXG4gICAgICog44GT44GuUHJvcOOCkuaMh+WumuOBl+OBquOBhOWgtOWQiOOAgU1vZGFsSGVhZGVy44Gu5Y+z5YG044GuWOODnOOCv+ODs+OBr+ihqOekuuOBleOCjOOBvuOBm+OCk+OAglxuICAgICAqXG4gICAgICovXG4gICAgb25DbG9zZT86ICgpID0+IHZvaWRcbiAgICAvKipcbiAgICAgKiBmYWxzZeOCkuaMh+WumuOBl+OBn+WgtOWQiOOAgU1vZGFs44Gv6KGo56S644GV44KM44G+44Gb44KT44CCXG4gICAgICpcbiAgICAgKiBAZGVmYXVsdCB0cnVlXG4gICAgICovXG4gICAgb3Blbj86IGJvb2xlYW5cbiAgICAvKipcbiAgICAgKiBNb2RhbOOBruWkluWBtOOCkuOCr+ODquODg+OCr+OBl+OBn+WgtOWQiOOAgeeZuueBq+OBl+OBvuOBmeOAglxuICAgICAqL1xuICAgIG9uQ2xpY2tPdXRzaWRlPzogKGV2ZW50OiBNb3VzZUV2ZW50IHwgVG91Y2hFdmVudCkgPT4gdm9pZFxuICAgIC8qKlxuICAgICAqIEVzY2FwZUtleeOCkuaKvOOBl+OBn+WgtOWQiOOAgeeZuueBq+OBl+OBvuOBmeOAglxuICAgICAqL1xuICAgIG9uRXNjPzogKCkgPT4gdm9pZFxuICAgIC8qKlxuICAgICAqIEVudGVyS2V544KS5oq844GX44Gf5aC05ZCI44CB55m654Gr44GX44G+44GZ44CCXG4gICAgICovXG4gICAgb25FbnRlcj86ICgpID0+IHZvaWRcbiAgICAvKipcbiAgICAgKiDlhajnlLvpnaLooajnpLrjg6Ljg7zjg4njgavjgarjgorjgb7jgZnjgIJcbiAgICAgKi9cbiAgICBiYWNrZHJvcD86IGJvb2xlYW5cbiAgICAvKipcbiAgICAgKiBNb2RhbOS4iumDqOOBq+aMh+WumuOBleOCjOOBn+imgee0oOOCkuaMv+WFpeOBl+OBvuOBmeOAglxuICAgICAqL1xuICAgIGhlYWRlcj86IEpTWC5FbGVtZW50XG4gICAgLyoqXG4gICAgICogTW9kYWzjgavmjIflrprjgZXjgozjgZ/opoHntKDjgpLmjL/lhaXjgZfjgb7jgZnjgIJcbiAgICAgKi9cbiAgICBib2R5OiBKU1guRWxlbWVudFxuICAgIC8qKlxuICAgICAqIE1vZGFs5LiL6YOo44Gr5oyH5a6a44GV44KM44Gf6KaB57Sg44KS5oy/5YWl44GX44G+44GZ44CCXG4gICAgICovXG4gICAgZm9vdGVyPzogSlNYLkVsZW1lbnRcbiAgICAvKipcbiAgICAgKiBAZGVmYXVsdCB1bmRlZmluZWRcbiAgICAgKi9cbiAgICB3aWR0aD86IHN0cmluZyB8IG51bWJlclxuICAgIC8qKlxuICAgICAqIEBkZWZhdWx0IDUwMFxuICAgICAqL1xuICAgIG1heFdpZHRoPzogc3RyaW5nIHwgbnVtYmVyXG59XG5cbmNvbnN0IENvbnRhaW5lcjogUmVhY3QuRkM8eyBiYWNrZHJvcD86IGJvb2xlYW4gfT4gPSAoeyBiYWNrZHJvcCwgY2hpbGRyZW4gfSkgPT5cbiAgICBiYWNrZHJvcCA/IDxNb2RhbEJhY2tkcm9wPntjaGlsZHJlbn08L01vZGFsQmFja2Ryb3A+IDogPFJlYWN0LkZyYWdtZW50PntjaGlsZHJlbn08L1JlYWN0LkZyYWdtZW50PlxuXG5leHBvcnQgY29uc3QgTW9kYWw6IFJlYWN0LkZDPE1vZGFsUHJvcHM+ID0gKHByb3BzKSA9PiB7XG4gICAgY29uc3Qge1xuICAgICAgICBvcGVuID0gdHJ1ZSxcbiAgICAgICAgaGVhZGVyLFxuICAgICAgICBib2R5LFxuICAgICAgICBmb290ZXIsXG4gICAgICAgIHN0eWxlLFxuICAgICAgICBjbGFzc05hbWUsXG4gICAgICAgIG9uQ2xpY2tPdXRzaWRlLFxuICAgICAgICBvbkVzYyxcbiAgICAgICAgb25FbnRlcixcbiAgICAgICAgYmFja2Ryb3AsXG4gICAgICAgIHdpZHRoLFxuICAgICAgICBtYXhXaWR0aCA9IDUwMCxcbiAgICAgICAgLi4ub3RoZXJzXG4gICAgfSA9IHByb3BzXG4gICAgY29uc3QgcmVmID0gdXNlUmVmKG51bGwpXG4gICAgdXNlT25DbGlja091dHNpZGUocmVmLCBvbkNsaWNrT3V0c2lkZSlcbiAgICB1c2VLZXlib2FyZChcIkVzY2FwZVwiLCBvbkVzYylcbiAgICB1c2VLZXlib2FyZChcIkVudGVyXCIsIG9uRW50ZXIpXG5cbiAgICBjb25zdCB0aGVtZSA9IHVzZVRoZW1lKClcbiAgICByZXR1cm4gKFxuICAgICAgICA8TW9kYWxQcm92aWRlciB2YWx1ZT17b3RoZXJzfT5cbiAgICAgICAgICAgIHtvcGVuID8gKFxuICAgICAgICAgICAgICAgIDxQb3J0YWw+XG4gICAgICAgICAgICAgICAgICAgIDxDb250YWluZXIgYmFja2Ryb3A9e2JhY2tkcm9wfT5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxQYXBlclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHJlZj17cmVmfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHN0eWxlPXt7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIC4uLnN0eWxlLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB3aWR0aCxcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgbWF4V2lkdGhcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB9fVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGNsYXNzTmFtZT17Y2xhc3NOYW1lfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB6LWluZGV4OiAke3RoZW1lLnpJbmRleC5tb2RhbH07XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGZsZXgtZGlyZWN0aW9uOiBjb2x1bW47XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGJvcmRlcjogMXB4IHNvbGlkICR7dGhlbWUucGFsZXR0ZS5ncmF5WzMwMF19O1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBib3JkZXItcmFkaXVzOiAwLjNlbTtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBgfVxuICAgICAgICAgICAgICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHtoZWFkZXIgPyA8TW9kYWxIZWFkZXI+e2hlYWRlcn08L01vZGFsSGVhZGVyPiA6IG51bGx9XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPE1vZGFsQm9keT57Ym9keX08L01vZGFsQm9keT5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB7Zm9vdGVyID8gPE1vZGFsRm9vdGVyPntmb290ZXJ9PC9Nb2RhbEZvb3Rlcj4gOiBudWxsfVxuICAgICAgICAgICAgICAgICAgICAgICAgPC9QYXBlcj5cbiAgICAgICAgICAgICAgICAgICAgPC9Db250YWluZXI+XG4gICAgICAgICAgICAgICAgPC9Qb3J0YWw+XG4gICAgICAgICAgICApIDogbnVsbH1cbiAgICAgICAgPC9Nb2RhbFByb3ZpZGVyPlxuICAgIClcbn1cbiJdfQ== */")
+  }, header ? ___EmotionJSX(ModalHeader, null, header) : null, ___EmotionJSX(ModalBody, null, body), footer ? ___EmotionJSX(ModalFooter, null, footer) : null))) : null);
+};
+//# sourceMappingURL=Modal.js.map

package/dist/esm/Modal/Modal.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Modal/Modal.tsx"],"names":["ModalBackdrop","ModalBody","ModalFooter","ModalHeader","ModalProvider","Paper","Portal","css","useKeyboard","useOnClickOutside","useTheme","React","useRef","Container","backdrop","children","Modal","props","open","header","body","footer","style","className","onClickOutside","onEsc","onEnter","width","maxWidth","others","ref","theme","zIndex","modal","palette","gray"],"mappings":";;;;;;;;;;;;AAAA,SAASA,aAAT,QAA8B,iBAA9B;AACA,SAASC,SAAT,QAA0B,aAA1B;AACA,SAASC,WAAT,QAA4B,eAA5B;AACA,SAASC,WAAT,QAA4B,eAA5B;AACA,SAASC,aAAT,QAA8B,iBAA9B;AACA,SAASC,KAAT,QAAsB,UAAtB;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,GAAT,QAAoB,gBAApB;AACA,SAASC,WAAT,QAA4B,sBAA5B;AACA,SAASC,iBAAT,QAAkC,4BAAlC;AACA,SAASC,QAAT,QAAyB,UAAzB;AACA,OAAOC,KAAP,IAAgBC,MAAhB,QAA8B,OAA9B;;;AAsDA,IAAMC,SAA2C,GAAG;AAAA,MAAC;AAAEC,IAAAA,QAAF;AAAYC,IAAAA;AAAZ,GAAD;AAAA,SAChDD,QAAQ,GAAG,cAAC,aAAD,QAAgBC,QAAhB,CAAH,GAA+C,cAAC,KAAD,CAAO,QAAP,QAAiBA,QAAjB,CADP;AAAA,CAApD;;AAGA,OAAO,IAAMC,KAA2B,GAAIC,KAAD,IAAW;AAClD,MAAM;AACFC,IAAAA,IAAI,GAAG,IADL;AAEFC,IAAAA,MAFE;AAGFC,IAAAA,IAHE;AAIFC,IAAAA,MAJE;AAKFC,IAAAA,KALE;AAMFC,IAAAA,SANE;AAOFC,IAAAA,cAPE;AAQFC,IAAAA,KARE;AASFC,IAAAA,OATE;AAUFZ,IAAAA,QAVE;AAWFa,IAAAA,KAXE;AAYFC,IAAAA,QAAQ,GAAG;AAZT,MAcFX,KAdJ;AAAA,MAaOY,MAbP,4BAcIZ,KAdJ;;AAeA,MAAMa,GAAG,GAAGlB,MAAM,CAAC,IAAD,CAAlB;AACAH,EAAAA,iBAAiB,CAACqB,GAAD,EAAMN,cAAN,CAAjB;AACAhB,EAAAA,WAAW,CAAC,QAAD,EAAWiB,KAAX,CAAX;AACAjB,EAAAA,WAAW,CAAC,OAAD,EAAUkB,OAAV,CAAX;AAEA,MAAMK,KAAK,GAAGrB,QAAQ,EAAtB;AACA,SACI,cAAC,aAAD;AAAe,IAAA,KAAK,EAAEmB;AAAtB,KACKX,IAAI,GACD,cAAC,MAAD,QACI,cAAC,SAAD;AAAW,IAAA,QAAQ,EAAEJ;AAArB,KACI,cAAC,KAAD;AACI,IAAA,GAAG,EAAEgB,GADT;AAEI,IAAA,KAAK,kCACER,KADF;AAEDK,MAAAA,KAFC;AAGDC,MAAAA;AAHC,MAFT;AAOI,IAAA,SAAS,EAAEL,SAPf;AAQI,IAAA,GAAG,eAAEhB,GAAF,aACYwB,KAAK,CAACC,MAAN,CAAaC,KADzB,2DAIqBF,KAAK,CAACG,OAAN,CAAcC,IAAd,CAAmB,GAAnB,CAJrB;AARP,KAgBKhB,MAAM,GAAG,cAAC,WAAD,QAAcA,MAAd,CAAH,GAAyC,IAhBpD,EAiBI,cAAC,SAAD,QAAYC,IAAZ,CAjBJ,EAkBKC,MAAM,GAAG,cAAC,WAAD,QAAcA,MAAd,CAAH,GAAyC,IAlBpD,CADJ,CADJ,CADC,GAyBD,IA1BR,CADJ;AA8BH,CApDM","sourcesContent":["import { ModalBackdrop } from \"./ModalBackdrop\"\nimport { ModalBody } from \"./ModalBody\"\nimport { ModalFooter } from \"./ModalFooter\"\nimport { ModalHeader } from \"./ModalHeader\"\nimport { ModalProvider } from \"./ModalProvider\"\nimport { Paper } from \"../Paper\"\nimport { Portal } from \"../Portal\"\nimport { css } from \"@emotion/react\"\nimport { useKeyboard } from \"../hooks/useKeyboard\"\nimport { useOnClickOutside } from \"../hooks/useOnClickOutside\"\nimport { useTheme } from \"../theme\"\nimport React, { useRef } from \"react\"\n\nexport interface ModalProps extends React.HTMLAttributes<HTMLDivElement> {\n    /**\n     * ModalのModalHeaderの右側のXボタンを押すと発火します。\n     *\n     * このPropを指定しない場合、ModalHeaderの右側のXボタンは表示されません。\n     *\n     */\n    onClose?: () => void\n    /**\n     * falseを指定した場合、Modalは表示されません。\n     *\n     * @default true\n     */\n    open?: boolean\n    /**\n     * Modalの外側をクリックした場合、発火します。\n     */\n    onClickOutside?: (event: MouseEvent | TouchEvent) => void\n    /**\n     * EscapeKeyを押した場合、発火します。\n     */\n    onEsc?: () => void\n    /**\n     * EnterKeyを押した場合、発火します。\n     */\n    onEnter?: () => void\n    /**\n     * 全画面表示モードになります。\n     */\n    backdrop?: boolean\n    /**\n     * Modal上部に指定された要素を挿入します。\n     */\n    header?: JSX.Element\n    /**\n     * Modalに指定された要素を挿入します。\n     */\n    body: JSX.Element\n    /**\n     * Modal下部に指定された要素を挿入します。\n     */\n    footer?: JSX.Element\n    /**\n     * @default undefined\n     */\n    width?: string | number\n    /**\n     * @default 500\n     */\n    maxWidth?: string | number\n}\n\nconst Container: React.FC<{ backdrop?: boolean }> = ({ backdrop, children }) =>\n    backdrop ? <ModalBackdrop>{children}</ModalBackdrop> : <React.Fragment>{children}</React.Fragment>\n\nexport const Modal: React.FC<ModalProps> = (props) => {\n    const {\n        open = true,\n        header,\n        body,\n        footer,\n        style,\n        className,\n        onClickOutside,\n        onEsc,\n        onEnter,\n        backdrop,\n        width,\n        maxWidth = 500,\n        ...others\n    } = props\n    const ref = useRef(null)\n    useOnClickOutside(ref, onClickOutside)\n    useKeyboard(\"Escape\", onEsc)\n    useKeyboard(\"Enter\", onEnter)\n\n    const theme = useTheme()\n    return (\n        <ModalProvider value={others}>\n            {open ? (\n                <Portal>\n                    <Container backdrop={backdrop}>\n                        <Paper\n                            ref={ref}\n                            style={{\n                                ...style,\n                                width,\n                                maxWidth\n                            }}\n                            className={className}\n                            css={css`\n                                z-index: ${theme.zIndex.modal};\n                                display: flex;\n                                flex-direction: column;\n                                border: 1px solid ${theme.palette.gray[300]};\n                                border-radius: 0.3em;\n                            `}\n                        >\n                            {header ? <ModalHeader>{header}</ModalHeader> : null}\n                            <ModalBody>{body}</ModalBody>\n                            {footer ? <ModalFooter>{footer}</ModalFooter> : null}\n                        </Paper>\n                    </Container>\n                </Portal>\n            ) : null}\n        </ModalProvider>\n    )\n}\n"],"file":"Modal.js"}

package/dist/esm/Modal/ModalBackdrop.js

@@ -0,0 +1,29 @@
+function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
+
+import { css } from "@emotion/react";
+import { useTheme } from "../theme";
+import React from "react";
+import { jsx as ___EmotionJSX } from "@emotion/react";
+
+var _ref = process.env.NODE_ENV === "production" ? {
+  name: "1yy98mb",
+  styles: "display:flex;max-height:90vh"
+} : {
+  name: "1me3ajd-ModalBackdrop",
+  styles: "display:flex;max-height:90vh;label:ModalBackdrop;",
+  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9Nb2RhbC9Nb2RhbEJhY2tkcm9wLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrQ3dCIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9Nb2RhbC9Nb2RhbEJhY2tkcm9wLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiXG5pbXBvcnQgeyB1c2VUaGVtZSB9IGZyb20gXCIuLi90aGVtZVwiXG5pbXBvcnQgUmVhY3QgZnJvbSBcInJlYWN0XCJcblxuZXhwb3J0IGNvbnN0IE1vZGFsQmFja2Ryb3A6IFJlYWN0LkZDID0gKHsgY2hpbGRyZW4gfSkgPT4ge1xuICAgIGNvbnN0IHRoZW1lID0gdXNlVGhlbWUoKVxuICAgIHJldHVybiAoXG4gICAgICAgIDxkaXZcbiAgICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgICAgIHBvc2l0aW9uOiBmaXhlZDtcbiAgICAgICAgICAgICAgICB0b3A6IDA7XG4gICAgICAgICAgICAgICAgcmlnaHQ6IDA7XG4gICAgICAgICAgICAgICAgYm90dG9tOiAwO1xuICAgICAgICAgICAgICAgIGxlZnQ6IDA7XG4gICAgICAgICAgICAgICAgei1pbmRleDogMTAwMDtcbiAgICAgICAgICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICAgICAgICAgIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gICAgICAgICAgICAgICAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7XG4gICAgICAgICAgICAgICAgaGVpZ2h0OiAxMDAlO1xuICAgICAgICAgICAgICAgIG1hcmdpbjogMHB4ICFpbXBvcnRhbnQ7XG4gICAgICAgICAgICAgICAgJjo6YmVmb3JlIHtcbiAgICAgICAgICAgICAgICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgICAgICAgICAgICAgICAgICB0b3A6IDA7XG4gICAgICAgICAgICAgICAgICAgIGxlZnQ6IDA7XG4gICAgICAgICAgICAgICAgICAgIGRpc3BsYXk6IGJsb2NrO1xuICAgICAgICAgICAgICAgICAgICB3aWR0aDogMTAwJTtcbiAgICAgICAgICAgICAgICAgICAgaGVpZ2h0OiAxMDAlO1xuICAgICAgICAgICAgICAgICAgICBjb250ZW50OiBcIlwiO1xuICAgICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke3RoZW1lLnBhbGV0dGUuZ3JheVs5MDBdfTtcbiAgICAgICAgICAgICAgICAgICAgb3BhY2l0eTogMC43O1xuICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgIGB9XG4gICAgICAgID5cbiAgICAgICAgICAgIDxkaXZcbiAgICAgICAgICAgICAgICBjc3M9e2Nzc2BcbiAgICAgICAgICAgICAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgICAgICAgICAgICAgbWF4LWhlaWdodDogOTB2aDtcbiAgICAgICAgICAgICAgICBgfVxuICAgICAgICAgICAgPlxuICAgICAgICAgICAgICAgIHtjaGlsZHJlbn1cbiAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICA8L2Rpdj5cbiAgICApXG59XG4iXX0= */",
+  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
+};
+
+export var ModalBackdrop = _ref2 => {
+  var {
+    children
+  } = _ref2;
+  var theme = useTheme();
+  return ___EmotionJSX("div", {
+    css: /*#__PURE__*/css("position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:center;justify-content:center;height:100%;margin:0px!important;&::before{position:absolute;top:0;left:0;display:block;width:100%;height:100%;content:\"\";background-color:", theme.palette.gray[900], ";opacity:0.7;}" + (process.env.NODE_ENV === "production" ? "" : ";label:ModalBackdrop;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9Nb2RhbC9Nb2RhbEJhY2tkcm9wLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFRb0IiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL01vZGFsL01vZGFsQmFja2Ryb3AudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgY3NzIH0gZnJvbSBcIkBlbW90aW9uL3JlYWN0XCJcbmltcG9ydCB7IHVzZVRoZW1lIH0gZnJvbSBcIi4uL3RoZW1lXCJcbmltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIlxuXG5leHBvcnQgY29uc3QgTW9kYWxCYWNrZHJvcDogUmVhY3QuRkMgPSAoeyBjaGlsZHJlbiB9KSA9PiB7XG4gICAgY29uc3QgdGhlbWUgPSB1c2VUaGVtZSgpXG4gICAgcmV0dXJuIChcbiAgICAgICAgPGRpdlxuICAgICAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgICAgICAgcG9zaXRpb246IGZpeGVkO1xuICAgICAgICAgICAgICAgIHRvcDogMDtcbiAgICAgICAgICAgICAgICByaWdodDogMDtcbiAgICAgICAgICAgICAgICBib3R0b206IDA7XG4gICAgICAgICAgICAgICAgbGVmdDogMDtcbiAgICAgICAgICAgICAgICB6LWluZGV4OiAxMDAwO1xuICAgICAgICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICAgICAgICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICAgICAgICAgICAgICBoZWlnaHQ6IDEwMCU7XG4gICAgICAgICAgICAgICAgbWFyZ2luOiAwcHggIWltcG9ydGFudDtcbiAgICAgICAgICAgICAgICAmOjpiZWZvcmUge1xuICAgICAgICAgICAgICAgICAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgICAgICAgICAgICAgICAgIHRvcDogMDtcbiAgICAgICAgICAgICAgICAgICAgbGVmdDogMDtcbiAgICAgICAgICAgICAgICAgICAgZGlzcGxheTogYmxvY2s7XG4gICAgICAgICAgICAgICAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgICAgICAgICAgICAgICBoZWlnaHQ6IDEwMCU7XG4gICAgICAgICAgICAgICAgICAgIGNvbnRlbnQ6IFwiXCI7XG4gICAgICAgICAgICAgICAgICAgIGJhY2tncm91bmQtY29sb3I6ICR7dGhlbWUucGFsZXR0ZS5ncmF5WzkwMF19O1xuICAgICAgICAgICAgICAgICAgICBvcGFjaXR5OiAwLjc7XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgYH1cbiAgICAgICAgPlxuICAgICAgICAgICAgPGRpdlxuICAgICAgICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgICAgICAgICBkaXNwbGF5OiBmbGV4O1xuICAgICAgICAgICAgICAgICAgICBtYXgtaGVpZ2h0OiA5MHZoO1xuICAgICAgICAgICAgICAgIGB9XG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgIDwvZGl2PlxuICAgIClcbn1cbiJdfQ== */")
+  }, ___EmotionJSX("div", {
+    css: _ref
+  }, children));
+};
+//# sourceMappingURL=ModalBackdrop.js.map

package/dist/esm/Modal/ModalBackdrop.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Modal/ModalBackdrop.tsx"],"names":["css","useTheme","React","ModalBackdrop","children","theme","palette","gray"],"mappings":";;AAAA,SAASA,GAAT,QAAoB,gBAApB;AACA,SAASC,QAAT,QAAyB,UAAzB;AACA,OAAOC,KAAP,MAAkB,OAAlB;;;;;;;;;;;;;AAEA,OAAO,IAAMC,aAAuB,GAAG,SAAkB;AAAA,MAAjB;AAAEC,IAAAA;AAAF,GAAiB;AACrD,MAAMC,KAAK,GAAGJ,QAAQ,EAAtB;AACA,SACI;AACI,IAAA,GAAG,eAAED,GAAF,mQAoByBK,KAAK,CAACC,OAAN,CAAcC,IAAd,CAAmB,GAAnB,CApBzB;AADP,KA0BI;AACI,IAAA,GAAG;AADP,KAMKH,QANL,CA1BJ,CADJ;AAqCH,CAvCM","sourcesContent":["import { css } from \"@emotion/react\"\nimport { useTheme } from \"../theme\"\nimport React from \"react\"\n\nexport const ModalBackdrop: React.FC = ({ children }) => {\n    const theme = useTheme()\n    return (\n        <div\n            css={css`\n                position: fixed;\n                top: 0;\n                right: 0;\n                bottom: 0;\n                left: 0;\n                z-index: 1000;\n                display: flex;\n                align-items: center;\n                justify-content: center;\n                height: 100%;\n                margin: 0px !important;\n                &::before {\n                    position: absolute;\n                    top: 0;\n                    left: 0;\n                    display: block;\n                    width: 100%;\n                    height: 100%;\n                    content: \"\";\n                    background-color: ${theme.palette.gray[900]};\n                    opacity: 0.7;\n                }\n            `}\n        >\n            <div\n                css={css`\n                    display: flex;\n                    max-height: 90vh;\n                `}\n            >\n                {children}\n            </div>\n        </div>\n    )\n}\n"],"file":"ModalBackdrop.js"}

package/dist/esm/Modal/ModalBody.js

@@ -0,0 +1,14 @@
+import { css } from "@emotion/react";
+import { useTheme } from "../theme";
+import React from "react";
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var ModalBody = _ref => {
+  var {
+    children
+  } = _ref;
+  var theme = useTheme();
+  return ___EmotionJSX("div", {
+    css: /*#__PURE__*/css("flex:1;padding:", theme.spacing * 3, "px ", theme.spacing * 4, "px;overflow-y:scroll;" + (process.env.NODE_ENV === "production" ? "" : ";label:ModalBody;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9Nb2RhbC9Nb2RhbEJvZHkudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVFvQiIsImZpbGUiOiIuLi8uLi8uLi9zcmMvTW9kYWwvTW9kYWxCb2R5LnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiXG5pbXBvcnQgeyB1c2VUaGVtZSB9IGZyb20gXCIuLi90aGVtZVwiXG5pbXBvcnQgUmVhY3QgZnJvbSBcInJlYWN0XCJcblxuZXhwb3J0IGNvbnN0IE1vZGFsQm9keTogUmVhY3QuRkMgPSAoeyBjaGlsZHJlbiB9KSA9PiB7XG4gICAgY29uc3QgdGhlbWUgPSB1c2VUaGVtZSgpXG4gICAgcmV0dXJuIChcbiAgICAgICAgPGRpdlxuICAgICAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgICAgICAgZmxleDogMTtcbiAgICAgICAgICAgICAgICBwYWRkaW5nOiAke3RoZW1lLnNwYWNpbmcgKiAzfXB4ICR7dGhlbWUuc3BhY2luZyAqIDR9cHg7XG4gICAgICAgICAgICAgICAgb3ZlcmZsb3cteTogc2Nyb2xsO1xuICAgICAgICAgICAgYH1cbiAgICAgICAgPlxuICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICA8L2Rpdj5cbiAgICApXG59XG4iXX0= */")
+  }, children);
+};
+//# sourceMappingURL=ModalBody.js.map

package/dist/esm/Modal/ModalBody.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Modal/ModalBody.tsx"],"names":["css","useTheme","React","ModalBody","children","theme","spacing"],"mappings":"AAAA,SAASA,GAAT,QAAoB,gBAApB;AACA,SAASC,QAAT,QAAyB,UAAzB;AACA,OAAOC,KAAP,MAAkB,OAAlB;;AAEA,OAAO,IAAMC,SAAmB,GAAG,QAAkB;AAAA,MAAjB;AAAEC,IAAAA;AAAF,GAAiB;AACjD,MAAMC,KAAK,GAAGJ,QAAQ,EAAtB;AACA,SACI;AACI,IAAA,GAAG,eAAED,GAAF,oBAEYK,KAAK,CAACC,OAAN,GAAgB,CAF5B,SAEmCD,KAAK,CAACC,OAAN,GAAgB,CAFnD;AADP,KAOKF,QAPL,CADJ;AAWH,CAbM","sourcesContent":["import { css } from \"@emotion/react\"\nimport { useTheme } from \"../theme\"\nimport React from \"react\"\n\nexport const ModalBody: React.FC = ({ children }) => {\n    const theme = useTheme()\n    return (\n        <div\n            css={css`\n                flex: 1;\n                padding: ${theme.spacing * 3}px ${theme.spacing * 4}px;\n                overflow-y: scroll;\n            `}\n        >\n            {children}\n        </div>\n    )\n}\n"],"file":"ModalBody.js"}

package/dist/esm/Modal/ModalContext.js

@@ -0,0 +1,3 @@
+import { createContext } from "react";
+export var ModalContext = /*#__PURE__*/createContext({});
+//# sourceMappingURL=ModalContext.js.map

package/dist/esm/Modal/ModalContext.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Modal/ModalContext.tsx"],"names":["createContext","ModalContext"],"mappings":"AACA,SAASA,aAAT,QAA8B,OAA9B;AACA,OAAO,IAAMC,YAAY,gBAAGD,aAAa,CAAsB,EAAtB,CAAlC","sourcesContent":["import { ModalProps } from \"./\"\nimport { createContext } from \"react\"\nexport const ModalContext = createContext<Partial<ModalProps>>({})\n"],"file":"ModalContext.js"}

package/dist/esm/Modal/ModalFooter.js

@@ -0,0 +1,14 @@
+import { css } from "@emotion/react";
+import { useTheme } from "../theme";
+import React from "react";
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var ModalFooter = _ref => {
+  var {
+    children
+  } = _ref;
+  var theme = useTheme();
+  return ___EmotionJSX("footer", {
+    css: /*#__PURE__*/css("padding:", theme.spacing * 2, "px ", theme.spacing * 4, "px;border-top:1px solid ", theme.palette.gray[300], ";border-bottom-right-radius:0.3em;border-bottom-left-radius:0.3em;" + (process.env.NODE_ENV === "production" ? "" : ";label:ModalFooter;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9Nb2RhbC9Nb2RhbEZvb3Rlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBUW9CIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9Nb2RhbC9Nb2RhbEZvb3Rlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIlxuaW1wb3J0IHsgdXNlVGhlbWUgfSBmcm9tIFwiLi4vdGhlbWVcIlxuaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiXG5cbmV4cG9ydCBjb25zdCBNb2RhbEZvb3RlcjogUmVhY3QuRkMgPSAoeyBjaGlsZHJlbiB9KSA9PiB7XG4gICAgY29uc3QgdGhlbWUgPSB1c2VUaGVtZSgpXG4gICAgcmV0dXJuIChcbiAgICAgICAgPGZvb3RlclxuICAgICAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgICAgICAgcGFkZGluZzogJHt0aGVtZS5zcGFjaW5nICogMn1weCAke3RoZW1lLnNwYWNpbmcgKiA0fXB4O1xuICAgICAgICAgICAgICAgIGJvcmRlci10b3A6IDFweCBzb2xpZCAke3RoZW1lLnBhbGV0dGUuZ3JheVszMDBdfTtcbiAgICAgICAgICAgICAgICBib3JkZXItYm90dG9tLXJpZ2h0LXJhZGl1czogMC4zZW07XG4gICAgICAgICAgICAgICAgYm9yZGVyLWJvdHRvbS1sZWZ0LXJhZGl1czogMC4zZW07XG4gICAgICAgICAgICBgfVxuICAgICAgICA+XG4gICAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgIDwvZm9vdGVyPlxuICAgIClcbn1cbiJdfQ== */")
+  }, children);
+};
+//# sourceMappingURL=ModalFooter.js.map

package/dist/esm/Modal/ModalFooter.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Modal/ModalFooter.tsx"],"names":["css","useTheme","React","ModalFooter","children","theme","spacing","palette","gray"],"mappings":"AAAA,SAASA,GAAT,QAAoB,gBAApB;AACA,SAASC,QAAT,QAAyB,UAAzB;AACA,OAAOC,KAAP,MAAkB,OAAlB;;AAEA,OAAO,IAAMC,WAAqB,GAAG,QAAkB;AAAA,MAAjB;AAAEC,IAAAA;AAAF,GAAiB;AACnD,MAAMC,KAAK,GAAGJ,QAAQ,EAAtB;AACA,SACI;AACI,IAAA,GAAG,eAAED,GAAF,aACYK,KAAK,CAACC,OAAN,GAAgB,CAD5B,SACmCD,KAAK,CAACC,OAAN,GAAgB,CADnD,8BAEyBD,KAAK,CAACE,OAAN,CAAcC,IAAd,CAAmB,GAAnB,CAFzB;AADP,KAQKJ,QARL,CADJ;AAYH,CAdM","sourcesContent":["import { css } from \"@emotion/react\"\nimport { useTheme } from \"../theme\"\nimport React from \"react\"\n\nexport const ModalFooter: React.FC = ({ children }) => {\n    const theme = useTheme()\n    return (\n        <footer\n            css={css`\n                padding: ${theme.spacing * 2}px ${theme.spacing * 4}px;\n                border-top: 1px solid ${theme.palette.gray[300]};\n                border-bottom-right-radius: 0.3em;\n                border-bottom-left-radius: 0.3em;\n            `}\n        >\n            {children}\n        </footer>\n    )\n}\n"],"file":"ModalFooter.js"}

package/dist/esm/Modal/ModalHeader.js

@@ -0,0 +1,34 @@
+var _excluded = ["children"];
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import { Icon } from "../Icon";
+import { ModalContext } from "./ModalContext";
+import { css } from "@emotion/react";
+import { useTheme } from "../theme";
+import React, { useContext } from "react";
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var ModalHeader = /*#__PURE__*/React.forwardRef((_ref, ref) => {
+  var {
+    children
+  } = _ref,
+      others = _objectWithoutProperties(_ref, _excluded);
+
+  var {
+    onClose
+  } = useContext(ModalContext);
+  var theme = useTheme();
+  return ___EmotionJSX("header", _extends({
+    css: /*#__PURE__*/css("position:relative;padding:", theme.spacing * 3, "px ", theme.spacing * 4, "px;background-color:", theme.palette.gray[100], ";border-bottom:1px solid ", theme.palette.gray[300], ";border-top-left-radius:0.3em;border-top-right-radius:0.3em;" + (process.env.NODE_ENV === "production" ? "" : ";label:ModalHeader;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9Nb2RhbC9Nb2RhbEhlYWRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBWXdCIiwiZmlsZSI6Ii4uLy4uLy4uL3NyYy9Nb2RhbC9Nb2RhbEhlYWRlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBJY29uIH0gZnJvbSBcIi4uL0ljb25cIlxuaW1wb3J0IHsgTW9kYWxDb250ZXh0IH0gZnJvbSBcIi4vTW9kYWxDb250ZXh0XCJcbmltcG9ydCB7IGNzcyB9IGZyb20gXCJAZW1vdGlvbi9yZWFjdFwiXG5pbXBvcnQgeyB1c2VUaGVtZSB9IGZyb20gXCIuLi90aGVtZVwiXG5pbXBvcnQgUmVhY3QsIHsgdXNlQ29udGV4dCB9IGZyb20gXCJyZWFjdFwiXG5cbmV4cG9ydCBjb25zdCBNb2RhbEhlYWRlciA9IFJlYWN0LmZvcndhcmRSZWY8SFRNTERpdkVsZW1lbnQsIFJlYWN0LkhUTUxBdHRyaWJ1dGVzPEhUTUxEaXZFbGVtZW50Pj4oXG4gICAgKHsgY2hpbGRyZW4sIC4uLm90aGVycyB9LCByZWYpID0+IHtcbiAgICAgICAgY29uc3QgeyBvbkNsb3NlIH0gPSB1c2VDb250ZXh0KE1vZGFsQ29udGV4dClcbiAgICAgICAgY29uc3QgdGhlbWUgPSB1c2VUaGVtZSgpXG4gICAgICAgIHJldHVybiAoXG4gICAgICAgICAgICA8aGVhZGVyXG4gICAgICAgICAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgICAgICAgICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICAgICAgICAgICAgICAgICAgcGFkZGluZzogJHt0aGVtZS5zcGFjaW5nICogM31weCAke3RoZW1lLnNwYWNpbmcgKiA0fXB4O1xuICAgICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke3RoZW1lLnBhbGV0dGUuZ3JheVsxMDBdfTtcbiAgICAgICAgICAgICAgICAgICAgYm9yZGVyLWJvdHRvbTogMXB4IHNvbGlkICR7dGhlbWUucGFsZXR0ZS5ncmF5WzMwMF19O1xuICAgICAgICAgICAgICAgICAgICBib3JkZXItdG9wLWxlZnQtcmFkaXVzOiAwLjNlbTtcbiAgICAgICAgICAgICAgICAgICAgYm9yZGVyLXRvcC1yaWdodC1yYWRpdXM6IDAuM2VtO1xuICAgICAgICAgICAgICAgIGB9XG4gICAgICAgICAgICAgICAgcmVmPXtyZWZ9XG4gICAgICAgICAgICAgICAgey4uLm90aGVyc31cbiAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICB7Y2hpbGRyZW59XG4gICAgICAgICAgICAgICAge29uQ2xvc2UgJiYgKFxuICAgICAgICAgICAgICAgICAgICA8c3BhblxuICAgICAgICAgICAgICAgICAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgcG9zaXRpb246IGFic29sdXRlO1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHRvcDogMTAwJTtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICByaWdodDogMXJlbTtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBib3R0b206IDEwMCU7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgZGlzcGxheTogZmxleDtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBhbGlnbi1pdGVtczogY2VudGVyO1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHBhZGRpbmctdG9wOiAke3RoZW1lLnNwYWNpbmd9cHg7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgcGFkZGluZy1ib3R0b206ICR7dGhlbWUuc3BhY2luZ31weDtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBtYXJnaW46IGF1dG87XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgZm9udC1zaXplOiAke3RoZW1lLnR5cG9ncmFwaHkuYm9keS5mb250U2l6ZX07XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgY29sb3I6ICR7dGhlbWUucGFsZXR0ZS5hY3Rpb24uZGlzYWJsZWR9O1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB0cmFuc2l0aW9uOiAwLjNzO1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICY6aG92ZXIge1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBjb2xvcjogJHt0aGVtZS5wYWxldHRlLmdyYXlbNTAwXX07XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICY6Zm9jdXMge1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBvdXRsaW5lOiBub25lO1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgICAgICAgICAgIGB9XG4gICAgICAgICAgICAgICAgICAgICAgICBvbkNsaWNrPXtvbkNsb3NlfVxuICAgICAgICAgICAgICAgICAgICAgICAgcm9sZT1cImJ1dHRvblwiXG4gICAgICAgICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxJY29uLkNsb3NlIC8+XG4gICAgICAgICAgICAgICAgICAgIDwvc3Bhbj5cbiAgICAgICAgICAgICAgICApfVxuICAgICAgICAgICAgPC9oZWFkZXI+XG4gICAgICAgIClcbiAgICB9XG4pXG4iXX0= */"),
+    ref: ref
+  }, others), children, onClose && ___EmotionJSX("span", {
+    css: /*#__PURE__*/css("position:absolute;top:100%;right:1rem;bottom:100%;display:flex;align-items:center;justify-content:center;padding-top:", theme.spacing, "px;padding-bottom:", theme.spacing, "px;margin:auto;font-size:", theme.typography.body.fontSize, ";color:", theme.palette.action.disabled, ";cursor:pointer;transition:0.3s;&:hover{color:", theme.palette.gray[500], ";}&:focus{outline:none;}" + (process.env.NODE_ENV === "production" ? "" : ";label:ModalHeader;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9Nb2RhbC9Nb2RhbEhlYWRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMEJnQyIsImZpbGUiOiIuLi8uLi8uLi9zcmMvTW9kYWwvTW9kYWxIZWFkZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSWNvbiB9IGZyb20gXCIuLi9JY29uXCJcbmltcG9ydCB7IE1vZGFsQ29udGV4dCB9IGZyb20gXCIuL01vZGFsQ29udGV4dFwiXG5pbXBvcnQgeyBjc3MgfSBmcm9tIFwiQGVtb3Rpb24vcmVhY3RcIlxuaW1wb3J0IHsgdXNlVGhlbWUgfSBmcm9tIFwiLi4vdGhlbWVcIlxuaW1wb3J0IFJlYWN0LCB7IHVzZUNvbnRleHQgfSBmcm9tIFwicmVhY3RcIlxuXG5leHBvcnQgY29uc3QgTW9kYWxIZWFkZXIgPSBSZWFjdC5mb3J3YXJkUmVmPEhUTUxEaXZFbGVtZW50LCBSZWFjdC5IVE1MQXR0cmlidXRlczxIVE1MRGl2RWxlbWVudD4+KFxuICAgICh7IGNoaWxkcmVuLCAuLi5vdGhlcnMgfSwgcmVmKSA9PiB7XG4gICAgICAgIGNvbnN0IHsgb25DbG9zZSB9ID0gdXNlQ29udGV4dChNb2RhbENvbnRleHQpXG4gICAgICAgIGNvbnN0IHRoZW1lID0gdXNlVGhlbWUoKVxuICAgICAgICByZXR1cm4gKFxuICAgICAgICAgICAgPGhlYWRlclxuICAgICAgICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgICAgICAgICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gICAgICAgICAgICAgICAgICAgIHBhZGRpbmc6ICR7dGhlbWUuc3BhY2luZyAqIDN9cHggJHt0aGVtZS5zcGFjaW5nICogNH1weDtcbiAgICAgICAgICAgICAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogJHt0aGVtZS5wYWxldHRlLmdyYXlbMTAwXX07XG4gICAgICAgICAgICAgICAgICAgIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAke3RoZW1lLnBhbGV0dGUuZ3JheVszMDBdfTtcbiAgICAgICAgICAgICAgICAgICAgYm9yZGVyLXRvcC1sZWZ0LXJhZGl1czogMC4zZW07XG4gICAgICAgICAgICAgICAgICAgIGJvcmRlci10b3AtcmlnaHQtcmFkaXVzOiAwLjNlbTtcbiAgICAgICAgICAgICAgICBgfVxuICAgICAgICAgICAgICAgIHJlZj17cmVmfVxuICAgICAgICAgICAgICAgIHsuLi5vdGhlcnN9XG4gICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAge2NoaWxkcmVufVxuICAgICAgICAgICAgICAgIHtvbkNsb3NlICYmIChcbiAgICAgICAgICAgICAgICAgICAgPHNwYW5cbiAgICAgICAgICAgICAgICAgICAgICAgIGNzcz17Y3NzYFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB0b3A6IDEwMCU7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgcmlnaHQ6IDFyZW07XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgYm90dG9tOiAxMDAlO1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGRpc3BsYXk6IGZsZXg7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgYWxpZ24taXRlbXM6IGNlbnRlcjtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBwYWRkaW5nLXRvcDogJHt0aGVtZS5zcGFjaW5nfXB4O1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHBhZGRpbmctYm90dG9tOiAke3RoZW1lLnNwYWNpbmd9cHg7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgbWFyZ2luOiBhdXRvO1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGZvbnQtc2l6ZTogJHt0aGVtZS50eXBvZ3JhcGh5LmJvZHkuZm9udFNpemV9O1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGNvbG9yOiAke3RoZW1lLnBhbGV0dGUuYWN0aW9uLmRpc2FibGVkfTtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgdHJhbnNpdGlvbjogMC4zcztcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAmOmhvdmVyIHtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY29sb3I6ICR7dGhlbWUucGFsZXR0ZS5ncmF5WzUwMF19O1xuICAgICAgICAgICAgICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAmOmZvY3VzIHtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgb3V0bGluZTogbm9uZTtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICAgICAgICAgICAgICBgfVxuICAgICAgICAgICAgICAgICAgICAgICAgb25DbGljaz17b25DbG9zZX1cbiAgICAgICAgICAgICAgICAgICAgICAgIHJvbGU9XCJidXR0b25cIlxuICAgICAgICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAgICAgICAgICA8SWNvbi5DbG9zZSAvPlxuICAgICAgICAgICAgICAgICAgICA8L3NwYW4+XG4gICAgICAgICAgICAgICAgKX1cbiAgICAgICAgICAgIDwvaGVhZGVyPlxuICAgICAgICApXG4gICAgfVxuKVxuIl19 */"),
+    onClick: onClose,
+    role: "button"
+  }, ___EmotionJSX(Icon.Close, null)));
+});
+//# sourceMappingURL=ModalHeader.js.map

package/dist/esm/Modal/ModalHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Modal/ModalHeader.tsx"],"names":["Icon","ModalContext","css","useTheme","React","useContext","ModalHeader","forwardRef","ref","children","others","onClose","theme","spacing","palette","gray","typography","body","fontSize","action","disabled"],"mappings":";;;;;;;;AAAA,SAASA,IAAT,QAAqB,SAArB;AACA,SAASC,YAAT,QAA6B,gBAA7B;AACA,SAASC,GAAT,QAAoB,gBAApB;AACA,SAASC,QAAT,QAAyB,UAAzB;AACA,OAAOC,KAAP,IAAgBC,UAAhB,QAAkC,OAAlC;;AAEA,OAAO,IAAMC,WAAW,gBAAGF,KAAK,CAACG,UAAN,CACvB,OAA0BC,GAA1B,KAAkC;AAAA,MAAjC;AAAEC,IAAAA;AAAF,GAAiC;AAAA,MAAlBC,MAAkB;;AAC9B,MAAM;AAAEC,IAAAA;AAAF,MAAcN,UAAU,CAACJ,YAAD,CAA9B;AACA,MAAMW,KAAK,GAAGT,QAAQ,EAAtB;AACA,SACI;AACI,IAAA,GAAG,eAAED,GAAF,+BAEYU,KAAK,CAACC,OAAN,GAAgB,CAF5B,SAEmCD,KAAK,CAACC,OAAN,GAAgB,CAFnD,0BAGqBD,KAAK,CAACE,OAAN,CAAcC,IAAd,CAAmB,GAAnB,CAHrB,+BAI4BH,KAAK,CAACE,OAAN,CAAcC,IAAd,CAAmB,GAAnB,CAJ5B,w/GADP;AASI,IAAA,GAAG,EAAEP;AATT,KAUQE,MAVR,GAYKD,QAZL,EAaKE,OAAO,IACJ;AACI,IAAA,GAAG,eAAET,GAAF,0HAQgBU,KAAK,CAACC,OARtB,wBASmBD,KAAK,CAACC,OATzB,+BAWcD,KAAK,CAACI,UAAN,CAAiBC,IAAjB,CAAsBC,QAXpC,aAYUN,KAAK,CAACE,OAAN,CAAcK,MAAd,CAAqBC,QAZ/B,oDAgBcR,KAAK,CAACE,OAAN,CAAcC,IAAd,CAAmB,GAAnB,CAhBd,o9GADP;AAuBI,IAAA,OAAO,EAAEJ,OAvBb;AAwBI,IAAA,IAAI,EAAC;AAxBT,KA0BI,cAAC,IAAD,CAAM,KAAN,OA1BJ,CAdR,CADJ;AA8CH,CAlDsB,CAApB","sourcesContent":["import { Icon } from \"../Icon\"\nimport { ModalContext } from \"./ModalContext\"\nimport { css } from \"@emotion/react\"\nimport { useTheme } from \"../theme\"\nimport React, { useContext } from \"react\"\n\nexport const ModalHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n    ({ children, ...others }, ref) => {\n        const { onClose } = useContext(ModalContext)\n        const theme = useTheme()\n        return (\n            <header\n                css={css`\n                    position: relative;\n                    padding: ${theme.spacing * 3}px ${theme.spacing * 4}px;\n                    background-color: ${theme.palette.gray[100]};\n                    border-bottom: 1px solid ${theme.palette.gray[300]};\n                    border-top-left-radius: 0.3em;\n                    border-top-right-radius: 0.3em;\n                `}\n                ref={ref}\n                {...others}\n            >\n                {children}\n                {onClose && (\n                    <span\n                        css={css`\n                            position: absolute;\n                            top: 100%;\n                            right: 1rem;\n                            bottom: 100%;\n                            display: flex;\n                            align-items: center;\n                            justify-content: center;\n                            padding-top: ${theme.spacing}px;\n                            padding-bottom: ${theme.spacing}px;\n                            margin: auto;\n                            font-size: ${theme.typography.body.fontSize};\n                            color: ${theme.palette.action.disabled};\n                            cursor: pointer;\n                            transition: 0.3s;\n                            &:hover {\n                                color: ${theme.palette.gray[500]};\n                            }\n                            &:focus {\n                                outline: none;\n                            }\n                        `}\n                        onClick={onClose}\n                        role=\"button\"\n                    >\n                        <Icon.Close />\n                    </span>\n                )}\n            </header>\n        )\n    }\n)\n"],"file":"ModalHeader.js"}

package/dist/esm/Modal/ModalProvider.js

@@ -0,0 +1,3 @@
+import { ModalContext } from "./ModalContext";
+export var ModalProvider = ModalContext.Provider;
+//# sourceMappingURL=ModalProvider.js.map

package/dist/esm/Modal/ModalProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Modal/ModalProvider.tsx"],"names":["ModalContext","ModalProvider","Provider"],"mappings":"AAAA,SAASA,YAAT,QAA6B,gBAA7B;AACA,OAAO,IAAMC,aAAa,GAAGD,YAAY,CAACE,QAAnC","sourcesContent":["import { ModalContext } from \"./ModalContext\"\nexport const ModalProvider = ModalContext.Provider\n"],"file":"ModalProvider.js"}

package/dist/esm/Modal/index.js

@@ -0,0 +1,2 @@
+export * from "./Modal";
+//# sourceMappingURL=index.js.map

package/dist/esm/Modal/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/Modal/index.tsx"],"names":[],"mappings":"AAAA,cAAc,SAAd","sourcesContent":["export * from \"./Modal\"\n"],"file":"index.js"}

package/dist/esm/MultipleTextField/index.js

@@ -0,0 +1,73 @@
+var _excluded = ["label", "style", "className", "onChange", "validationMessages", "customValidations", "disabled", "bottomGutter", "helperText", "invalid"];
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import { FormControl } from "../FormControl";
+import { FormHelperText } from "../FormHelperText";
+import { InputLabel } from "../InputLabel";
+import { TextareaBase } from "../TextareaBase";
+import { useDitectInputTouched } from "../TextField/useDitectInputTouched";
+import { useValidation } from "../TextField/useValidation";
+import React, { useCallback, useRef, useState } from "react";
+import { jsx as ___EmotionJSX } from "@emotion/react";
+export var MultipleTextField = /*#__PURE__*/React.forwardRef((_ref, rootRef) => {
+  var {
+    label,
+    style,
+    className,
+    onChange,
+    validationMessages,
+    customValidations,
+    disabled,
+    bottomGutter,
+    helperText,
+    invalid
+  } = _ref,
+      props = _objectWithoutProperties(_ref, _excluded);
+
+  var [value, setValue] = useState(props.value || props.defaultValue);
+  var ref = useRef(null);
+  var validation = useValidation({
+    ref,
+    validationMessages,
+    customValidations,
+    value
+  });
+  var handleChange = useCallback(event => {
+    var {
+      value
+    } = event.currentTarget;
+    setValue(value);
+
+    if (onChange) {
+      onChange(value, event);
+    }
+  }, [onChange]);
+  var [touched, additionalProps] = useDitectInputTouched();
+  return ___EmotionJSX(FormControl, {
+    style: style,
+    className: className,
+    ref: rootRef
+  }, ___EmotionJSX(InputLabel, {
+    "aria-disabled": disabled,
+    required: props.required
+  }, label), ___EmotionJSX(TextareaBase, _extends({
+    disabled: disabled
+  }, props, {
+    onChange: handleChange,
+    ref: ref
+  }, additionalProps)), touched && validation.message ? ___EmotionJSX(FormHelperText, {
+    bottomGutter: bottomGutter,
+    invalid: !validation.valid
+  }, validation.message) : ___EmotionJSX(FormHelperText, {
+    bottomGutter: bottomGutter,
+    invalid: invalid
+  }, typeof helperText === "function" ? helperText({
+    value
+  }) : helperText));
+});
+//# sourceMappingURL=index.js.map

package/dist/esm/MultipleTextField/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/MultipleTextField/index.tsx"],"names":["FormControl","FormHelperText","InputLabel","TextareaBase","useDitectInputTouched","useValidation","React","useCallback","useRef","useState","MultipleTextField","forwardRef","rootRef","label","style","className","onChange","validationMessages","customValidations","disabled","bottomGutter","helperText","invalid","props","value","setValue","defaultValue","ref","validation","handleChange","event","currentTarget","touched","additionalProps","required","message","valid"],"mappings":";;;;;;;;AACA,SAASA,WAAT,QAA4B,gBAA5B;AACA,SAASC,cAAT,QAAuD,mBAAvD;AACA,SAASC,UAAT,QAA2B,eAA3B;AACA,SAASC,YAAT,QAA6B,iBAA7B;AACA,SAASC,qBAAT,QAAsC,oCAAtC;AACA,SAASC,aAAT,QAA8B,4BAA9B;AACA,OAAOC,KAAP,IAAgBC,WAAhB,EAA6BC,MAA7B,EAAqCC,QAArC,QAAqD,OAArD;;AASA,OAAO,IAAMC,iBAAiB,gBAAGJ,KAAK,CAACK,UAAN,CAC7B,OAcIC,OAdJ,KAeK;AAAA,MAdD;AACIC,IAAAA,KADJ;AAEIC,IAAAA,KAFJ;AAGIC,IAAAA,SAHJ;AAIIC,IAAAA,QAJJ;AAKIC,IAAAA,kBALJ;AAMIC,IAAAA,iBANJ;AAOIC,IAAAA,QAPJ;AAQIC,IAAAA,YARJ;AASIC,IAAAA,UATJ;AAUIC,IAAAA;AAVJ,GAcC;AAAA,MAHMC,KAGN;;AACD,MAAM,CAACC,KAAD,EAAQC,QAAR,IAAoBhB,QAAQ,CAACc,KAAK,CAACC,KAAN,IAAeD,KAAK,CAACG,YAAtB,CAAlC;AACA,MAAMC,GAAG,GAAGnB,MAAM,CAAsB,IAAtB,CAAlB;AACA,MAAMoB,UAAU,GAAGvB,aAAa,CAAC;AAC7BsB,IAAAA,GAD6B;AAE7BV,IAAAA,kBAF6B;AAG7BC,IAAAA,iBAH6B;AAI7BM,IAAAA;AAJ6B,GAAD,CAAhC;AAMA,MAAMK,YAAY,GAAGtB,WAAW,CAC3BuB,KAAD,IAAmD;AAC/C,QAAM;AAAEN,MAAAA;AAAF,QAAYM,KAAK,CAACC,aAAxB;AACAN,IAAAA,QAAQ,CAACD,KAAD,CAAR;;AACA,QAAIR,QAAJ,EAAc;AACVA,MAAAA,QAAQ,CAACQ,KAAD,EAAQM,KAAR,CAAR;AACH;AACJ,GAP2B,EAQ5B,CAACd,QAAD,CAR4B,CAAhC;AAUA,MAAM,CAACgB,OAAD,EAAUC,eAAV,IAA6B7B,qBAAqB,EAAxD;AACA,SACI,cAAC,WAAD;AAAa,IAAA,KAAK,EAAEU,KAApB;AAA2B,IAAA,SAAS,EAAEC,SAAtC;AAAiD,IAAA,GAAG,EAAEH;AAAtD,KACI,cAAC,UAAD;AAAY,qBAAeO,QAA3B;AAAqC,IAAA,QAAQ,EAAEI,KAAK,CAACW;AAArD,KACKrB,KADL,CADJ,EAII,cAAC,YAAD;AAAc,IAAA,QAAQ,EAAEM;AAAxB,KAAsCI,KAAtC;AAA6C,IAAA,QAAQ,EAAEM,YAAvD;AAAqE,IAAA,GAAG,EAAEF;AAA1E,KAAmFM,eAAnF,EAJJ,EAKKD,OAAO,IAAIJ,UAAU,CAACO,OAAtB,GACG,cAAC,cAAD;AAAgB,IAAA,YAAY,EAAEf,YAA9B;AAA4C,IAAA,OAAO,EAAE,CAACQ,UAAU,CAACQ;AAAjE,KACKR,UAAU,CAACO,OADhB,CADH,GAKG,cAAC,cAAD;AAAgB,IAAA,YAAY,EAAEf,YAA9B;AAA4C,IAAA,OAAO,EAAEE;AAArD,KACK,OAAOD,UAAP,KAAsB,UAAtB,GAAmCA,UAAU,CAAC;AAAEG,IAAAA;AAAF,GAAD,CAA7C,GAA2DH,UADhE,CAVR,CADJ;AAiBH,CArD4B,CAA1B","sourcesContent":["import { FieldProps } from \"../TextField\"\nimport { FormControl } from \"../FormControl\"\nimport { FormHelperText, InputBottomGutterProps } from \"../FormHelperText\"\nimport { InputLabel } from \"../InputLabel\"\nimport { TextareaBase } from \"../TextareaBase\"\nimport { useDitectInputTouched } from \"../TextField/useDitectInputTouched\"\nimport { useValidation } from \"../TextField/useValidation\"\nimport React, { useCallback, useRef, useState } from \"react\"\n\nexport interface MultipleTextFieldProps\n    extends FieldProps<string>,\n        Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, \"onChange\" | \"defaultValue\" | \"value\" | \"css\">,\n        InputBottomGutterProps {\n    children?: never\n}\n\nexport const MultipleTextField = React.forwardRef<HTMLDivElement, MultipleTextFieldProps>(\n    (\n        {\n            label,\n            style,\n            className,\n            onChange,\n            validationMessages,\n            customValidations,\n            disabled,\n            bottomGutter,\n            helperText,\n            invalid,\n            ...props\n        },\n        rootRef\n    ) => {\n        const [value, setValue] = useState(props.value || props.defaultValue)\n        const ref = useRef<HTMLTextAreaElement>(null)\n        const validation = useValidation({\n            ref,\n            validationMessages,\n            customValidations,\n            value\n        })\n        const handleChange = useCallback(\n            (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n                const { value } = event.currentTarget\n                setValue(value)\n                if (onChange) {\n                    onChange(value, event)\n                }\n            },\n            [onChange]\n        )\n        const [touched, additionalProps] = useDitectInputTouched()\n        return (\n            <FormControl style={style} className={className} ref={rootRef}>\n                <InputLabel aria-disabled={disabled} required={props.required}>\n                    {label}\n                </InputLabel>\n                <TextareaBase disabled={disabled} {...props} onChange={handleChange} ref={ref} {...additionalProps} />\n                {touched && validation.message ? (\n                    <FormHelperText bottomGutter={bottomGutter} invalid={!validation.valid}>\n                        {validation.message}\n                    </FormHelperText>\n                ) : (\n                    <FormHelperText bottomGutter={bottomGutter} invalid={invalid}>\n                        {typeof helperText === \"function\" ? helperText({ value }) : helperText}\n                    </FormHelperText>\n                )}\n            </FormControl>\n        )\n    }\n)\n"],"file":"index.js"}

package/dist/esm/NumberField/NumberField.js

@@ -0,0 +1,139 @@
+var _excluded = ["validationMessages", "customValidations", "style", "className", "label", "options", "onChange", "defaultValue", "name", "disabled", "value", "readOnly", "bottomGutter", "helperText", "invalid"];
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import { FormControl } from "../FormControl";
+import { FormHelperText } from "../FormHelperText";
+import { InputBase } from "../InputBase";
+import { InputLabel } from "../InputLabel";
+import { LocaleContext } from "../LocaleProvider";
+import { useDitectInputTouched } from "../TextField/useDitectInputTouched";
+import { useValidation } from "../TextField/useValidation";
+import React, { useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
+import { jsx as ___EmotionJSX } from "@emotion/react";
+
+var toLocaleValue = (value, locale, options) => {
+  return value === undefined ? "" : value.toLocaleString(locale, options);
+};
+/**
+ *
+ * ## コントロール状態とアンコントロール状態における差異
+ *
+ * コントロール状態つまり`onChange`が指定されている場合は、Input要素の入力値は数値以外の値を持ちません。
+ * 一方、アンコントロール状態では、Input要素の入力値は空文字を許容します。
+ */
+
+
+export var NumberField = props => {
+  var {
+    validationMessages,
+    customValidations,
+    style,
+    className,
+    label,
+    options,
+    onChange,
+    defaultValue,
+    name,
+    disabled,
+    value: propsValue,
+    readOnly,
+    bottomGutter,
+    helperText,
+    invalid
+  } = props,
+      others = _objectWithoutProperties(props, _excluded);
+
+  var locale = useContext(LocaleContext);
+  var ref = useRef(null);
+  /**
+   * NumberFieldではFocus時とBlur時に値を変更するため、input要素本来のdefaultValueを用いることが出来ません。
+   */
+
+  var [value, setValue] = useState(propsValue || defaultValue);
+  var [valueText, setValueText] = useState(value === null || value === void 0 ? void 0 : value.toString());
+  var validation = useValidation({
+    ref,
+    validationMessages,
+    customValidations,
+    value
+  });
+  /**
+   * Switch type by focus event
+   */
+
+  var [type, setType] = useState("text");
+  var [touched, touchedProps] = useDitectInputTouched();
+  var handleFocus = useCallback(() => {
+    setType("number");
+
+    if (touchedProps.onFocus) {
+      touchedProps.onFocus();
+    }
+  }, [touchedProps]);
+  var handleBlur = useCallback(event => {
+    setType("text");
+
+    if (onChange) {
+      onChange(value || 0, event);
+    }
+  }, [onChange, value]);
+  var handleChange = useCallback(event => {
+    var {
+      value
+    } = event.currentTarget;
+    setValueText(value);
+    setValue(value ? Number(value) : 0);
+  }, []);
+  useEffect(() => {
+    if (propsValue !== undefined) {
+      setValue(prev => prev === propsValue ? prev : propsValue);
+    }
+  }, [propsValue]);
+  var isFocus = useMemo(() => type === "number", [type]);
+  var handleWheel = useCallback(event => {
+    event.currentTarget.blur();
+  }, []);
+  return ___EmotionJSX(FormControl, {
+    style: style,
+    className: className
+  }, ___EmotionJSX(InputLabel, {
+    "aria-disabled": disabled,
+    required: props.required
+  }, label), ___EmotionJSX(InputBase, _extends({
+    "data-touched": touched,
+    disabled: disabled,
+    ref: ref,
+    type: type,
+    value: isFocus ? valueText : toLocaleValue(value, locale, options),
+    onChange: handleChange,
+    onFocus: readOnly ? undefined : handleFocus,
+    onBlur: readOnly ? undefined : handleBlur,
+    onWheel: handleWheel,
+    readOnly: readOnly,
+    name: isFocus ? name : undefined,
+    "data-invalid": !validation.valid
+  }, others)), ___EmotionJSX("input", {
+    type: "hidden",
+    name: isFocus ? undefined : name,
+    value: valueText
+  }), touched && validation.message ? ___EmotionJSX(FormHelperText, {
+    bottomGutter: bottomGutter,
+    invalid: !validation.valid
+  }, validation.message) : ___EmotionJSX(FormHelperText, {
+    bottomGutter: bottomGutter,
+    invalid: invalid
+  }, typeof helperText === "function" ? helperText({
+    value
+  }) : helperText));
+};
+NumberField.defaultProps = {
+  max: Number.MAX_SAFE_INTEGER,
+  min: Number.MIN_SAFE_INTEGER,
+  step: 1
+};
+//# sourceMappingURL=NumberField.js.map