@activecollab/components 2.0.442 → 2.0.444

package/dist/cjs/components/Dialog/Styles.js

@@ -62,7 +62,7 @@ StyledDialogTitleClose.displayName = "StyledDialogTitleClose";
 var StyledDialogContent = exports.StyledDialogContent = _styledComponents.default.div.withConfig({
   displayName: "Styles__StyledDialogContent",
   componentId: "sc-jwpvgm-5"
-})(["padding:20px 30px;flex:1 1 auto;min-height:0;overflow-y:", ";", " ", ""], function (props) {
+})(["padding:20px 30px;flex:1 1 auto;min-height:0;overscroll-behavior:contain;overflow-y:", ";", " ", ""], function (props) {
   return props.$scroll ? "auto" : "visible";
 }, _FontStyle.FontStyle, _BoxSizingStyle.BoxSizingStyle);
 StyledDialogContent.displayName = "StyledDialogContent";

package/dist/cjs/components/Dialog/Styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","_BoxSizingStyle","_BreakPoints","_FontStyle","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","dialogSizes","exports","s","m","l","xl","xxl","xxxl","MIN_GAP","MAX_DIALOG_HEIGHT","StyledDialogViewport","styled","div","withConfig","displayName","componentId","screen","sm","BoxSizingStyle","StyledDialog","props","$maxWidth","$height","css","FontStyle","StyledDialogTitle","CLOSE_OFFSET","CLOSE_RESERVE","StyledDialogTitleBar","StyledDialogTitleClose","StyledDialogContent","$scroll","StyledDialogContentDivider","StyledDialogActions"],"sources":["../../../../src/components/Dialog/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { screen } from \"../BreakPoints\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const dialogSizes = {\n  s: 440,\n  m: 540,\n  l: 700,\n  xl: 840,\n  xxl: 1000,\n  xxxl: 1120,\n} as const;\n\nexport type DialogSize = keyof typeof dialogSizes;\n\nconst MIN_GAP = \"2.5vh\";\nconst MAX_DIALOG_HEIGHT = \"95vh\";\n\n// The dialog hangs at a fixed offset while there is room below it, then grows in both directions at\n// once. Two shrinkable spacers express that: only the lower one grows, and past the crossover both\n// shrink from the same basis, so the gaps stay equal down to MIN_GAP.\nexport const StyledDialogViewport = styled.div`\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding-left: 16px;\n  padding-right: 16px;\n  pointer-events: none;\n\n  --ac-dialog-offset: 60px;\n\n  ${screen.sm} {\n    --ac-dialog-offset: 126px;\n  }\n\n  &::before,\n  &::after {\n    content: \"\";\n    flex-shrink: 1;\n    flex-basis: var(--ac-dialog-offset);\n    min-height: ${MIN_GAP};\n  }\n\n  &::before {\n    flex-grow: 0;\n  }\n\n  &::after {\n    flex-grow: 1;\n  }\n\n  ${BoxSizingStyle}\n`;\n\nStyledDialogViewport.displayName = \"StyledDialogViewport\";\n\nexport const StyledDialog = styled.div<{\n  $maxWidth: number;\n  $height?: string;\n}>`\n  display: flex;\n  flex-direction: column;\n  flex: 0 0 auto;\n  pointer-events: auto;\n  width: 100%;\n  max-width: ${(props) => props.$maxWidth}px;\n  max-height: ${MAX_DIALOG_HEIGHT};\n  background-color: var(--page-paper-main);\n  color: var(--color-theme-900);\n  box-shadow: var(--shadow-primary);\n  border-radius: 8px;\n  position: relative;\n  transition: max-width 0.2s ease, height 0.2s ease;\n\n  @media (prefers-reduced-motion: reduce) {\n    transition: none;\n  }\n\n  ${(props) =>\n    props.$height &&\n    css`\n      height: ${props.$height};\n    `}\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n`;\n\nStyledDialog.displayName = \"StyledDialog\";\n\nexport const StyledDialogTitle = styled.div`\n  padding: 20px 30px;\n  flex: 0 0 auto;\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n`;\nStyledDialogTitle.displayName = \"StyledDialogTitle\";\n\n// The close button hangs 8px into the title padding, so it sits nearer the dialog edge than the\n// heading does. The bar reserves the rest, which keeps the gap to the heading unchanged.\nconst CLOSE_OFFSET = 8;\nconst CLOSE_RESERVE = 44 - CLOSE_OFFSET;\n\n// The header is as tall as its heading, with or without a close button.\nexport const StyledDialogTitleBar = styled.div`\n  position: relative;\n  display: flex;\n  align-items: center;\n  padding-right: ${CLOSE_RESERVE}px;\n`;\nStyledDialogTitleBar.displayName = \"StyledDialogTitleBar\";\n\nexport const StyledDialogTitleClose = styled.div`\n  position: absolute;\n  right: -${CLOSE_OFFSET}px;\n  top: 50%;\n  transform: translateY(-50%);\n  line-height: 0;\n`;\nStyledDialogTitleClose.displayName = \"StyledDialogTitleClose\";\n\nexport const StyledDialogContent = styled.div<{ $scroll: boolean }>`\n  padding: 20px 30px;\n  flex: 1 1 auto;\n  min-height: 0;\n  overflow-y: ${(props) => (props.$scroll ? \"auto\" : \"visible\")};\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n`;\nStyledDialogContent.displayName = \"StyledDialogContent\";\n\nexport const StyledDialogContentDivider = styled.div`\n  border-top: 1px solid var(--border-primary);\n  height: 1px;\n  flex: 0 0 auto;\n`;\nStyledDialogContentDivider.displayName = \"StyledDialogContentDivider\";\n\nexport const StyledDialogActions = styled.div`\n  padding: 20px 30px;\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  gap: 12px;\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n`;\nStyledDialogActions.displayName = \"StyledDialogActions\";\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","_BoxSizingStyle","_BreakPoints","_FontStyle","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","dialogSizes","exports","s","m","l","xl","xxl","xxxl","MIN_GAP","MAX_DIALOG_HEIGHT","StyledDialogViewport","styled","div","withConfig","displayName","componentId","screen","sm","BoxSizingStyle","StyledDialog","props","$maxWidth","$height","css","FontStyle","StyledDialogTitle","CLOSE_OFFSET","CLOSE_RESERVE","StyledDialogTitleBar","StyledDialogTitleClose","StyledDialogContent","$scroll","StyledDialogContentDivider","StyledDialogActions"],"sources":["../../../../src/components/Dialog/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { screen } from \"../BreakPoints\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const dialogSizes = {\n  s: 440,\n  m: 540,\n  l: 700,\n  xl: 840,\n  xxl: 1000,\n  xxxl: 1120,\n} as const;\n\nexport type DialogSize = keyof typeof dialogSizes;\n\nconst MIN_GAP = \"2.5vh\";\nconst MAX_DIALOG_HEIGHT = \"95vh\";\n\n// The dialog hangs at a fixed offset while there is room below it, then grows in both directions at\n// once. Two shrinkable spacers express that: only the lower one grows, and past the crossover both\n// shrink from the same basis, so the gaps stay equal down to MIN_GAP.\nexport const StyledDialogViewport = styled.div`\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  padding-left: 16px;\n  padding-right: 16px;\n  pointer-events: none;\n\n  --ac-dialog-offset: 60px;\n\n  ${screen.sm} {\n    --ac-dialog-offset: 126px;\n  }\n\n  &::before,\n  &::after {\n    content: \"\";\n    flex-shrink: 1;\n    flex-basis: var(--ac-dialog-offset);\n    min-height: ${MIN_GAP};\n  }\n\n  &::before {\n    flex-grow: 0;\n  }\n\n  &::after {\n    flex-grow: 1;\n  }\n\n  ${BoxSizingStyle}\n`;\n\nStyledDialogViewport.displayName = \"StyledDialogViewport\";\n\nexport const StyledDialog = styled.div<{\n  $maxWidth: number;\n  $height?: string;\n}>`\n  display: flex;\n  flex-direction: column;\n  flex: 0 0 auto;\n  pointer-events: auto;\n  width: 100%;\n  max-width: ${(props) => props.$maxWidth}px;\n  max-height: ${MAX_DIALOG_HEIGHT};\n  background-color: var(--page-paper-main);\n  color: var(--color-theme-900);\n  box-shadow: var(--shadow-primary);\n  border-radius: 8px;\n  position: relative;\n  transition: max-width 0.2s ease, height 0.2s ease;\n\n  @media (prefers-reduced-motion: reduce) {\n    transition: none;\n  }\n\n  ${(props) =>\n    props.$height &&\n    css`\n      height: ${props.$height};\n    `}\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n`;\n\nStyledDialog.displayName = \"StyledDialog\";\n\nexport const StyledDialogTitle = styled.div`\n  padding: 20px 30px;\n  flex: 0 0 auto;\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n`;\nStyledDialogTitle.displayName = \"StyledDialogTitle\";\n\n// The close button hangs 8px into the title padding, so it sits nearer the dialog edge than the\n// heading does. The bar reserves the rest, which keeps the gap to the heading unchanged.\nconst CLOSE_OFFSET = 8;\nconst CLOSE_RESERVE = 44 - CLOSE_OFFSET;\n\n// The header is as tall as its heading, with or without a close button.\nexport const StyledDialogTitleBar = styled.div`\n  position: relative;\n  display: flex;\n  align-items: center;\n  padding-right: ${CLOSE_RESERVE}px;\n`;\nStyledDialogTitleBar.displayName = \"StyledDialogTitleBar\";\n\nexport const StyledDialogTitleClose = styled.div`\n  position: absolute;\n  right: -${CLOSE_OFFSET}px;\n  top: 50%;\n  transform: translateY(-50%);\n  line-height: 0;\n`;\nStyledDialogTitleClose.displayName = \"StyledDialogTitleClose\";\n\nexport const StyledDialogContent = styled.div<{ $scroll: boolean }>`\n  padding: 20px 30px;\n  flex: 1 1 auto;\n  min-height: 0;\n  overscroll-behavior: contain;\n  overflow-y: ${(props) => (props.$scroll ? \"auto\" : \"visible\")};\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n`;\nStyledDialogContent.displayName = \"StyledDialogContent\";\n\nexport const StyledDialogContentDivider = styled.div`\n  border-top: 1px solid var(--border-primary);\n  height: 1px;\n  flex: 0 0 auto;\n`;\nStyledDialogContentDivider.displayName = \"StyledDialogContentDivider\";\n\nexport const StyledDialogActions = styled.div`\n  padding: 20px 30px;\n  flex: 0 0 auto;\n  display: flex;\n  align-items: center;\n  gap: 12px;\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n`;\nStyledDialogActions.displayName = \"StyledDialogActions\";\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/Overlay/Overlay.js

@@ -4,22 +4,61 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Overlay = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
+var _overlayStack = require("./overlayStack");
 var _Styles = require("./Styles");
+var _LayerContext = require("../../helpers/LayerContext/LayerContext");
+var _layers = require("../../utils/layers");
 var _excluded = ["className", "disableBackgroundColor"];
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
 function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+// Chrome samples the backdrop of every blurred overlay on every frame, and a covered one buys
+// nothing for that cost. Only the overlay on top keeps its blur.
+var useKeepsBlur = function useKeepsBlur(blurs, zIndex) {
+  var _useState = (0, _react.useState)(true),
+    _useState2 = _slicedToArray(_useState, 2),
+    isTop = _useState2[0],
+    setIsTop = _useState2[1];
+  (0, _react.useEffect)(function () {
+    if (!blurs) {
+      return undefined;
+    }
+    var id = (0, _overlayStack.pushOverlay)(zIndex);
+    var sync = function sync() {
+      return setIsTop((0, _overlayStack.isTopOverlay)(id));
+    };
+    sync();
+    var unsubscribe = (0, _overlayStack.subscribeToOverlays)(sync);
+    return function () {
+      unsubscribe();
+      (0, _overlayStack.popOverlay)(id);
+    };
+  }, [blurs, zIndex]);
+  return blurs && isTop;
+};
 var Overlay = exports.Overlay = function Overlay(_ref) {
   var className = _ref.className,
     _ref$disableBackgroun = _ref.disableBackgroundColor,
     disableBackgroundColor = _ref$disableBackgroun === void 0 ? false : _ref$disableBackgroun,
     rest = _objectWithoutProperties(_ref, _excluded);
+  var _useLayerContext = (0, _LayerContext.useLayerContext)(),
+    _useLayerContext$zInd = _useLayerContext.zIndex,
+    zIndex = _useLayerContext$zInd === void 0 ? _layers.layers.skyscraper : _useLayerContext$zInd;
+  var keepsBlur = useKeepsBlur(!disableBackgroundColor, zIndex);
   return /*#__PURE__*/_react.default.createElement(_Styles.StyledOverlay, _extends({
     className: (0, _classnames.default)("c-overlay", className),
-    $disableBackgroundColor: disableBackgroundColor
+    $disableBackgroundColor: disableBackgroundColor,
+    $blurs: keepsBlur
   }, rest));
 };
 Overlay.displayName = "Overlay";

package/dist/cjs/components/Overlay/Overlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"Overlay.js","names":["_react","_interopRequireDefault","require","_classnames","_Styles","_excluded","e","__esModule","default","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","_objectWithoutProperties","o","i","_objectWithoutPropertiesLoose","getOwnPropertySymbols","indexOf","propertyIsEnumerable","Overlay","exports","_ref","className","_ref$disableBackgroun","disableBackgroundColor","rest","createElement","StyledOverlay","classnames","$disableBackgroundColor","displayName"],"sources":["../../../../src/components/Overlay/Overlay.tsx"],"sourcesContent":["import React, { FC } from \"react\";\n\nimport classnames from \"classnames\";\n\nimport { StyledOverlay } from \"./Styles\";\n\nexport interface IOverlay {\n  disableBackgroundColor?: boolean;\n}\n\nexport const Overlay: FC<\n  IOverlay & Omit<React.ComponentPropsWithoutRef<\"div\">, keyof IOverlay>\n> = ({ className, disableBackgroundColor = false, ...rest }) => {\n  return (\n    <StyledOverlay\n      className={classnames(\"c-overlay\", className)}\n      $disableBackgroundColor={disableBackgroundColor}\n      {...rest}\n    />\n  );\n};\n\nOverlay.displayName = \"Overlay\";\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,WAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,OAAA,GAAAF,OAAA;AAAyC,IAAAG,SAAA;AAAA,SAAAJ,uBAAAK,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAG,SAAA,WAAAA,QAAA,GAAAC,MAAA,CAAAC,MAAA,GAAAD,MAAA,CAAAC,MAAA,CAAAC,IAAA,eAAAC,CAAA,aAAAP,CAAA,MAAAA,CAAA,GAAAQ,SAAA,CAAAC,MAAA,EAAAT,CAAA,UAAAU,CAAA,GAAAF,SAAA,CAAAR,CAAA,YAAAW,CAAA,IAAAD,CAAA,OAAAE,cAAA,CAAAC,IAAA,CAAAH,CAAA,EAAAC,CAAA,MAAAJ,CAAA,CAAAI,CAAA,IAAAD,CAAA,CAAAC,CAAA,aAAAJ,CAAA,KAAAJ,QAAA,CAAAW,KAAA,OAAAN,SAAA;AAAA,SAAAO,yBAAAf,CAAA,EAAAU,CAAA,gBAAAV,CAAA,iBAAAgB,CAAA,EAAAL,CAAA,EAAAM,CAAA,GAAAC,6BAAA,CAAAlB,CAAA,EAAAU,CAAA,OAAAN,MAAA,CAAAe,qBAAA,QAAAZ,CAAA,GAAAH,MAAA,CAAAe,qBAAA,CAAAnB,CAAA,QAAAW,CAAA,MAAAA,CAAA,GAAAJ,CAAA,CAAAE,MAAA,EAAAE,CAAA,IAAAK,CAAA,GAAAT,CAAA,CAAAI,CAAA,UAAAD,CAAA,CAAAU,OAAA,CAAAJ,CAAA,QAAAK,oBAAA,CAAAR,IAAA,CAAAb,CAAA,EAAAgB,CAAA,MAAAC,CAAA,CAAAD,CAAA,IAAAhB,CAAA,CAAAgB,CAAA,aAAAC,CAAA;AAAA,SAAAC,8BAAAP,CAAA,EAAAX,CAAA,gBAAAW,CAAA,iBAAAD,CAAA,gBAAAH,CAAA,IAAAI,CAAA,SAAAC,cAAA,CAAAC,IAAA,CAAAF,CAAA,EAAAJ,CAAA,gBAAAP,CAAA,CAAAoB,OAAA,CAAAb,CAAA,aAAAG,CAAA,CAAAH,CAAA,IAAAI,CAAA,CAAAJ,CAAA,YAAAG,CAAA;AAMlC,IAAMY,OAEZ,GAAAC,OAAA,CAAAD,OAAA,GAAG,SAFSA,OAEZA,CAAAE,IAAA,EAA+D;EAAA,IAAzDC,SAAS,GAAAD,IAAA,CAATC,SAAS;IAAAC,qBAAA,GAAAF,IAAA,CAAEG,sBAAsB;IAAtBA,sBAAsB,GAAAD,qBAAA,cAAG,KAAK,GAAAA,qBAAA;IAAKE,IAAI,GAAAb,wBAAA,CAAAS,IAAA,EAAAzB,SAAA;EACvD,oBACEL,MAAA,CAAAQ,OAAA,CAAA2B,aAAA,CAAC/B,OAAA,CAAAgC,aAAa,EAAA3B,QAAA;IACZsB,SAAS,EAAE,IAAAM,mBAAU,EAAC,WAAW,EAAEN,SAAS,CAAE;IAC9CO,uBAAuB,EAAEL;EAAuB,GAC5CC,IAAI,CACT,CAAC;AAEN,CAAC;AAEDN,OAAO,CAACW,WAAW,GAAG,SAAS","ignoreList":[]}
+{"version":3,"file":"Overlay.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_overlayStack","_Styles","_LayerContext","_layers","_excluded","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","_objectWithoutProperties","_objectWithoutPropertiesLoose","getOwnPropertySymbols","indexOf","propertyIsEnumerable","_slicedToArray","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","a","_arrayLikeToArray","toString","slice","constructor","name","Array","from","test","l","Symbol","iterator","u","next","done","push","value","return","isArray","useKeepsBlur","blurs","zIndex","_useState","useState","_useState2","isTop","setIsTop","useEffect","undefined","id","pushOverlay","sync","isTopOverlay","unsubscribe","subscribeToOverlays","popOverlay","Overlay","exports","_ref","className","_ref$disableBackgroun","disableBackgroundColor","rest","_useLayerContext","useLayerContext","_useLayerContext$zInd","layers","skyscraper","keepsBlur","createElement","StyledOverlay","classnames","$disableBackgroundColor","$blurs","displayName"],"sources":["../../../../src/components/Overlay/Overlay.tsx"],"sourcesContent":["import React, { FC, useEffect, useState } from \"react\";\n\nimport classnames from \"classnames\";\n\nimport {\n  isTopOverlay,\n  popOverlay,\n  pushOverlay,\n  subscribeToOverlays,\n} from \"./overlayStack\";\nimport { StyledOverlay } from \"./Styles\";\nimport { useLayerContext } from \"../../helpers/LayerContext/LayerContext\";\nimport { layers } from \"../../utils/layers\";\n\n// Chrome samples the backdrop of every blurred overlay on every frame, and a covered one buys\n// nothing for that cost. Only the overlay on top keeps its blur.\nconst useKeepsBlur = (blurs: boolean, zIndex: number): boolean => {\n  const [isTop, setIsTop] = useState(true);\n\n  useEffect(() => {\n    if (!blurs) {\n      return undefined;\n    }\n\n    const id = pushOverlay(zIndex);\n    const sync = () => setIsTop(isTopOverlay(id));\n\n    sync();\n\n    const unsubscribe = subscribeToOverlays(sync);\n\n    return () => {\n      unsubscribe();\n      popOverlay(id);\n    };\n  }, [blurs, zIndex]);\n\n  return blurs && isTop;\n};\n\nexport interface IOverlay {\n  disableBackgroundColor?: boolean;\n}\n\nexport const Overlay: FC<\n  IOverlay & Omit<React.ComponentPropsWithoutRef<\"div\">, keyof IOverlay>\n> = ({ className, disableBackgroundColor = false, ...rest }) => {\n  const { zIndex = layers.skyscraper } = useLayerContext();\n  const keepsBlur = useKeepsBlur(!disableBackgroundColor, zIndex);\n\n  return (\n    <StyledOverlay\n      className={classnames(\"c-overlay\", className)}\n      $disableBackgroundColor={disableBackgroundColor}\n      $blurs={keepsBlur}\n      {...rest}\n    />\n  );\n};\n\nOverlay.displayName = \"Overlay\";\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/Overlay/Styles.js

@@ -9,8 +9,10 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 var StyledOverlay = exports.StyledOverlay = _styledComponents.default.div.withConfig({
   displayName: "Styles__StyledOverlay",
   componentId: "sc-flnrpv-0"
-})(["position:fixed;top:0;right:0;bottom:0;left:0;", ""], function (props) {
-  return !props.$disableBackgroundColor && (0, _styledComponents.css)(["background:var(--modal-background);backdrop-filter:blur(2px);"]);
+})(["position:fixed;top:0;right:0;bottom:0;left:0;", " ", ""], function (props) {
+  return !props.$disableBackgroundColor && (0, _styledComponents.css)(["background:var(--modal-background);transform:translateZ(0);"]);
+}, function (props) {
+  return props.$blurs && (0, _styledComponents.css)(["backdrop-filter:blur(2px);"]);
 });
 StyledOverlay.displayName = "StyledOverlay";
 //# sourceMappingURL=Styles.js.map

package/dist/cjs/components/Overlay/Styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledOverlay","exports","styled","div","withConfig","displayName","componentId","props","$disableBackgroundColor","css"],"sources":["../../../../src/components/Overlay/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nexport const StyledOverlay = styled.div<{\n  $disableBackgroundColor: boolean;\n}>`\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n\n  ${(props) =>\n    !props.$disableBackgroundColor &&\n    css`\n      background: var(--modal-background);\n      backdrop-filter: blur(2px);\n    `}\n`;\n\nStyledOverlay.displayName = \"StyledOverlay\";\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAD,wBAAAE,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAJ,uBAAA,YAAAA,wBAAAE,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,cAAAM,EAAA,IAAAd,CAAA,gBAAAc,EAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,EAAA,OAAAP,CAAA,IAAAD,CAAA,GAAAW,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAnB,CAAA,EAAAc,EAAA,OAAAP,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAM,EAAA,EAAAP,CAAA,IAAAC,CAAA,CAAAM,EAAA,IAAAd,CAAA,CAAAc,EAAA,WAAAN,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAEzC,IAAMmB,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAGE,yBAAM,CAACC,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,0DASnC,UAACC,KAAK;EAAA,OACN,CAACA,KAAK,CAACC,uBAAuB,QAC9BC,qBAAG,oEAGF;AAAA,EACJ;AAEDT,aAAa,CAACK,WAAW,GAAG,eAAe","ignoreList":[]}
+{"version":3,"file":"Styles.js","names":["_styledComponents","_interopRequireWildcard","require","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledOverlay","exports","styled","div","withConfig","displayName","componentId","props","$disableBackgroundColor","css","$blurs"],"sources":["../../../../src/components/Overlay/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nexport const StyledOverlay = styled.div<{\n  $disableBackgroundColor: boolean;\n  $blurs?: boolean;\n}>`\n  position: fixed;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n\n  ${(props) =>\n    !props.$disableBackgroundColor &&\n    css`\n      background: var(--modal-background);\n      /* Chrome samples the backdrop per frame. On its own layer the sample survives a scroll above it. */\n      transform: translateZ(0);\n    `}\n\n  ${(props) =>\n    props.$blurs &&\n    css`\n      backdrop-filter: blur(2px);\n    `}\n`;\n\nStyledOverlay.displayName = \"StyledOverlay\";\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAgD,SAAAD,wBAAAE,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAJ,uBAAA,YAAAA,wBAAAE,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,cAAAM,EAAA,IAAAd,CAAA,gBAAAc,EAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,EAAA,OAAAP,CAAA,IAAAD,CAAA,GAAAW,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAnB,CAAA,EAAAc,EAAA,OAAAP,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAM,EAAA,EAAAP,CAAA,IAAAC,CAAA,CAAAM,EAAA,IAAAd,CAAA,CAAAc,EAAA,WAAAN,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAEzC,IAAMmB,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAGE,yBAAM,CAACC,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,+DAUnC,UAACC,KAAK;EAAA,OACN,CAACA,KAAK,CAACC,uBAAuB,QAC9BC,qBAAG,kEAIF;AAAA,GAED,UAACF,KAAK;EAAA,OACNA,KAAK,CAACG,MAAM,QACZD,qBAAG,iCAEF;AAAA,EACJ;AAEDT,aAAa,CAACK,WAAW,GAAG,eAAe","ignoreList":[]}

package/dist/cjs/components/Overlay/overlayStack.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.subscribeToOverlays = exports.pushOverlay = exports.popOverlay = exports.isTopOverlay = void 0;
+var listeners = new Set();
+var stack = [];
+var lastId = 0;
+var notify = function notify() {
+  return listeners.forEach(function (listener) {
+    return listener();
+  });
+};
+var pushOverlay = exports.pushOverlay = function pushOverlay(zIndex) {
+  lastId += 1;
+  stack = [...stack, {
+    id: lastId,
+    zIndex
+  }];
+  notify();
+  return lastId;
+};
+var popOverlay = exports.popOverlay = function popOverlay(id) {
+  stack = stack.filter(function (entry) {
+    return entry.id !== id;
+  });
+  notify();
+};
+
+// The overlay that covers the rest is the one on the highest layer. Mount order only breaks a tie,
+// because a lazily loaded surface can mount after the one it sits under.
+var isTopOverlay = exports.isTopOverlay = function isTopOverlay(id) {
+  if (stack.length === 0) {
+    return true;
+  }
+  var top = stack.reduce(function (highest, entry) {
+    return entry.zIndex > highest.zIndex || entry.zIndex === highest.zIndex && entry.id > highest.id ? entry : highest;
+  });
+  return top.id === id;
+};
+var subscribeToOverlays = exports.subscribeToOverlays = function subscribeToOverlays(listener) {
+  listeners.add(listener);
+  return function () {
+    listeners.delete(listener);
+  };
+};
+//# sourceMappingURL=overlayStack.js.map

package/dist/cjs/components/Overlay/overlayStack.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlayStack.js","names":["listeners","Set","stack","lastId","notify","forEach","listener","pushOverlay","exports","zIndex","id","popOverlay","filter","entry","isTopOverlay","length","top","reduce","highest","subscribeToOverlays","add","delete"],"sources":["../../../../src/components/Overlay/overlayStack.ts"],"sourcesContent":["type Listener = () => void;\n\ntype Entry = { id: number; zIndex: number };\n\nconst listeners = new Set<Listener>();\n\nlet stack: Entry[] = [];\nlet lastId = 0;\n\nconst notify = (): void => listeners.forEach((listener) => listener());\n\nexport const pushOverlay = (zIndex: number): number => {\n  lastId += 1;\n  stack = [...stack, { id: lastId, zIndex }];\n  notify();\n\n  return lastId;\n};\n\nexport const popOverlay = (id: number): void => {\n  stack = stack.filter((entry) => entry.id !== id);\n  notify();\n};\n\n// The overlay that covers the rest is the one on the highest layer. Mount order only breaks a tie,\n// because a lazily loaded surface can mount after the one it sits under.\nexport const isTopOverlay = (id: number): boolean => {\n  if (stack.length === 0) {\n    return true;\n  }\n\n  const top = stack.reduce((highest, entry) =>\n    entry.zIndex > highest.zIndex ||\n    (entry.zIndex === highest.zIndex && entry.id > highest.id)\n      ? entry\n      : highest\n  );\n\n  return top.id === id;\n};\n\nexport const subscribeToOverlays = (listener: Listener): (() => void) => {\n  listeners.add(listener);\n\n  return (): void => {\n    listeners.delete(listener);\n  };\n};\n"],"mappings":";;;;;;AAIA,IAAMA,SAAS,GAAG,IAAIC,GAAG,CAAW,CAAC;AAErC,IAAIC,KAAc,GAAG,EAAE;AACvB,IAAIC,MAAM,GAAG,CAAC;AAEd,IAAMC,MAAM,GAAG,SAATA,MAAMA,CAAA;EAAA,OAAeJ,SAAS,CAACK,OAAO,CAAC,UAACC,QAAQ;IAAA,OAAKA,QAAQ,CAAC,CAAC;EAAA,EAAC;AAAA;AAE/D,IAAMC,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAG,SAAdA,WAAWA,CAAIE,MAAc,EAAa;EACrDN,MAAM,IAAI,CAAC;EACXD,KAAK,GAAG,CAAC,GAAGA,KAAK,EAAE;IAAEQ,EAAE,EAAEP,MAAM;IAAEM;EAAO,CAAC,CAAC;EAC1CL,MAAM,CAAC,CAAC;EAER,OAAOD,MAAM;AACf,CAAC;AAEM,IAAMQ,UAAU,GAAAH,OAAA,CAAAG,UAAA,GAAG,SAAbA,UAAUA,CAAID,EAAU,EAAW;EAC9CR,KAAK,GAAGA,KAAK,CAACU,MAAM,CAAC,UAACC,KAAK;IAAA,OAAKA,KAAK,CAACH,EAAE,KAAKA,EAAE;EAAA,EAAC;EAChDN,MAAM,CAAC,CAAC;AACV,CAAC;;AAED;AACA;AACO,IAAMU,YAAY,GAAAN,OAAA,CAAAM,YAAA,GAAG,SAAfA,YAAYA,CAAIJ,EAAU,EAAc;EACnD,IAAIR,KAAK,CAACa,MAAM,KAAK,CAAC,EAAE;IACtB,OAAO,IAAI;EACb;EAEA,IAAMC,GAAG,GAAGd,KAAK,CAACe,MAAM,CAAC,UAACC,OAAO,EAAEL,KAAK;IAAA,OACtCA,KAAK,CAACJ,MAAM,GAAGS,OAAO,CAACT,MAAM,IAC5BI,KAAK,CAACJ,MAAM,KAAKS,OAAO,CAACT,MAAM,IAAII,KAAK,CAACH,EAAE,GAAGQ,OAAO,CAACR,EAAG,GACtDG,KAAK,GACLK,OAAO;EAAA,CACb,CAAC;EAED,OAAOF,GAAG,CAACN,EAAE,KAAKA,EAAE;AACtB,CAAC;AAEM,IAAMS,mBAAmB,GAAAX,OAAA,CAAAW,mBAAA,GAAG,SAAtBA,mBAAmBA,CAAIb,QAAkB,EAAmB;EACvEN,SAAS,CAACoB,GAAG,CAACd,QAAQ,CAAC;EAEvB,OAAO,YAAY;IACjBN,SAAS,CAACqB,MAAM,CAACf,QAAQ,CAAC;EAC5B,CAAC;AACH,CAAC","ignoreList":[]}

package/dist/cjs/components/Sheet/Sheet.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.Sheet = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _reactTransitionGroup = require("react-transition-group");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _Styles = require("./Styles");
 var _IconButton = require("../IconButton");
@@ -95,39 +94,7 @@ var Sheet = exports.Sheet = /*#__PURE__*/(0, _react.forwardRef)(function (_ref,
     style: bodyStyle,
     $position: position,
     $mode: mode
-  }, controls.length > 0 && /*#__PURE__*/_react.default.createElement(_Styles.StyledSheetIcons, null, controls.map(function (_ref2, index) {
-    var IconComponent = _ref2.icon,
-      tooltip = _ref2.tooltip,
-      onClick = _ref2.onClick,
-      disabled = _ref2.disabled,
-      className = _ref2.className;
-    var maxDurationIn = 4;
-    var maxDurationOut = 2;
-    var control = index + 1;
-    var durationOut = Math.max(0, maxDurationOut - control);
-    var durationIn = Math.min(control, maxDurationIn);
-    return /*#__PURE__*/_react.default.createElement(_reactTransitionGroup.Transition, {
-      appear: true,
-      in: open,
-      timeout: maxDurationIn * 100,
-      key: "c-sheet-control-".concat(index)
-    }, function (state) {
-      return /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
-        title: tooltip,
-        disable: !tooltip || disabled
-      }, /*#__PURE__*/_react.default.createElement(_Styles.StyledAnimatedSpan, {
-        onClick: onClick,
-        $disabled: disabled,
-        $mode: mode,
-        $state: state,
-        className: className,
-        $maxDurationIn: maxDurationIn / 10,
-        $maxDurationOut: maxDurationOut / 10,
-        $durationOut: durationOut / 10,
-        $durationIn: durationIn / 10
-      }, IconComponent));
-    });
-  })), /*#__PURE__*/_react.default.createElement(_Styles.StyledCssTransition, {
+  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledCssTransition, {
     appear: true,
     in: open,
     timeout: 400,
@@ -135,7 +102,22 @@ var Sheet = exports.Sheet = /*#__PURE__*/(0, _react.forwardRef)(function (_ref,
     $direction: animation,
     onEnter: handleEnter,
     onExited: handleExited
-  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledSheetWrapperPaper, {
+  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledSheetSurface, null, controls.length > 0 && /*#__PURE__*/_react.default.createElement(_Styles.StyledSheetIcons, null, controls.map(function (_ref2, index) {
+    var IconComponent = _ref2.icon,
+      tooltip = _ref2.tooltip,
+      onClick = _ref2.onClick,
+      disabled = _ref2.disabled,
+      className = _ref2.className;
+    return /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
+      title: tooltip,
+      disable: !tooltip || disabled,
+      key: "c-sheet-control-".concat(index)
+    }, /*#__PURE__*/_react.default.createElement(_Styles.StyledAnimatedSpan, {
+      onClick: onClick,
+      $disabled: disabled,
+      className: className
+    }, IconComponent));
+  })), /*#__PURE__*/_react.default.createElement(_Styles.StyledSheetWrapperPaper, {
     paperClass: "c-sheet__wrapper__paper"
   }, controls.length > 0 && /*#__PURE__*/_react.default.createElement(_Styles.StyledHeader, null, /*#__PURE__*/_react.default.createElement(_Styles.StyledIconsWrapperSmall, null, controls.map(function (_ref3, index) {
     var IconComponent = _ref3.icon,
@@ -153,7 +135,7 @@ var Sheet = exports.Sheet = /*#__PURE__*/(0, _react.forwardRef)(function (_ref,
       className: className,
       variant: "text gray"
     }, IconComponent));
-  })), /*#__PURE__*/_react.default.createElement(_Styles.StyledListSeparator, null)), children))));
+  })), /*#__PURE__*/_react.default.createElement(_Styles.StyledListSeparator, null)), children)))));
 });
 Sheet.displayName = "Sheet";
 //# sourceMappingURL=Sheet.js.map

package/dist/cjs/components/Sheet/Sheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"Sheet.js","names":["_react","_interopRequireWildcard","require","_reactTransitionGroup","_classnames","_interopRequireDefault","_Styles","_IconButton","_Overlay","_Tooltip","_Window","_excluded","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","_slicedToArray","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","a","_arrayLikeToArray","toString","slice","constructor","name","Array","from","test","l","Symbol","iterator","u","next","done","push","value","return","isArray","_objectWithoutProperties","_objectWithoutPropertiesLoose","getOwnPropertySymbols","indexOf","propertyIsEnumerable","Sheet","exports","forwardRef","_ref","ref","children","onClose","_ref$controls","controls","_ref$open","open","defaultOpen","_ref$animation","animation","_ref$position","position","_ref$mode","mode","_ref$disableFocusLock","disableFocusLock","_ref$disableScrollLoc","disableScrollLock","_ref$disableBackgroun","disableBackgroundColor","bodyStyle","bodyClassName","_ref$disableBackgroun2","disableBackgroundClick","rest","_useState","useState","_useState2","setOpen","_useState3","_useState4","exited","setExited","useEffect","handleEnter","useCallback","handleExited","handleClose","handleBackgroundClick","event","preventDefault","useImperativeHandle","close","createElement","Window","Overlay","onClick","StyledSheetWrapper","className","classnames","style","$position","$mode","StyledSheetIcons","map","_ref2","index","IconComponent","icon","tooltip","disabled","maxDurationIn","maxDurationOut","control","durationOut","Math","max","durationIn","min","Transition","appear","in","timeout","key","concat","state","Tooltip","title","disable","StyledAnimatedSpan","$disabled","$state","$maxDurationIn","$maxDurationOut","$durationOut","$durationIn","StyledCssTransition","classNames","$direction","onEnter","onExited","StyledSheetWrapperPaper","paperClass","StyledHeader","StyledIconsWrapperSmall","_ref3","IconButton","variant","StyledListSeparator","displayName"],"sources":["../../../../src/components/Sheet/Sheet.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  forwardRef,\n  HTMLAttributes,\n  useState,\n  CSSProperties,\n  MouseEvent,\n  useImperativeHandle,\n} from \"react\";\nimport { Transition } from \"react-transition-group\";\n\nimport classnames from \"classnames\";\n\nimport {\n  StyledAnimatedSpan,\n  StyledCssTransition,\n  StyledHeader,\n  StyledIconsWrapperSmall,\n  StyledListSeparator,\n  StyledSheetIcons,\n  StyledSheetWrapper,\n  StyledSheetWrapperPaper,\n} from \"./Styles\";\nimport { IconButton } from \"../IconButton\";\nimport { Overlay } from \"../Overlay\";\nimport { Tooltip } from \"../Tooltip\";\nimport { Window } from \"../Window\";\n\ninterface ControlProps {\n  onClick: () => void;\n  icon: React.ReactElement;\n  tooltip: string;\n  disabled: boolean;\n  className: string;\n}\n\ninterface ISheet {\n  onClose?: () => void;\n  controls?: ControlProps[];\n  open?: boolean;\n  animation?: \"top\" | \"bottom\" | \"left\" | \"right\";\n  position?: \"center\" | \"left\" | \"right\";\n  mode?: \"normal\" | \"stretch\";\n  disableFocusLock?: boolean;\n  disableScrollLock?: boolean;\n  disableBackgroundColor?: boolean;\n  bodyStyle?: CSSProperties;\n  bodyClassName?: string;\n  disableBackgroundClick?: boolean;\n}\n\nexport interface SheetMethods {\n  close: () => void;\n}\n\ntype SheetProps = ISheet & HTMLAttributes<HTMLDivElement>;\n\nexport const Sheet = forwardRef<SheetMethods, SheetProps>(\n  (\n    {\n      children,\n      onClose,\n      controls = [],\n      open: defaultOpen = false,\n      animation = \"top\",\n      position = \"center\",\n      mode = \"normal\",\n      disableFocusLock = false,\n      disableScrollLock = false,\n      disableBackgroundColor = false,\n      bodyStyle,\n      bodyClassName,\n      disableBackgroundClick = false,\n      ...rest\n    },\n    ref\n  ) => {\n    const [open, setOpen] = useState(defaultOpen);\n    const [exited, setExited] = useState(true);\n\n    useEffect(() => {\n      setOpen(defaultOpen);\n    }, [defaultOpen]);\n\n    const handleEnter = useCallback(() => {\n      setExited(false);\n    }, []);\n\n    const handleExited = useCallback(() => {\n      setExited(true);\n      onClose?.();\n    }, [onClose]);\n\n    const handleClose = useCallback(() => {\n      setOpen(false);\n    }, []);\n\n    const handleBackgroundClick = useCallback(\n      (event: MouseEvent<HTMLDivElement>) => {\n        if (!disableBackgroundClick) {\n          event.preventDefault();\n          handleClose();\n        }\n      },\n      [disableBackgroundClick, handleClose]\n    );\n\n    useImperativeHandle(ref, () => ({\n      close: handleClose,\n    }));\n\n    if (!open && exited) {\n      return null;\n    }\n\n    return (\n      <Window\n        {...rest}\n        onClose={handleClose}\n        disableFocusLock={disableFocusLock}\n        disableScrollLock={disableScrollLock}\n      >\n        {open && (\n          <Overlay\n            onClick={handleBackgroundClick}\n            disableBackgroundColor={disableBackgroundColor}\n          />\n        )}\n        <StyledSheetWrapper\n          className={classnames(\"c-sheet__wrapper\", bodyClassName)}\n          style={bodyStyle}\n          $position={position}\n          $mode={mode}\n        >\n          {controls.length > 0 && (\n            <StyledSheetIcons>\n              {controls.map(\n                (\n                  {\n                    icon: IconComponent,\n                    tooltip,\n                    onClick,\n                    disabled,\n                    className,\n                  },\n                  index\n                ) => {\n                  const maxDurationIn = 4;\n                  const maxDurationOut = 2;\n                  const control = index + 1;\n                  const durationOut = Math.max(0, maxDurationOut - control);\n                  const durationIn = Math.min(control, maxDurationIn);\n\n                  return (\n                    <Transition\n                      appear\n                      in={open}\n                      timeout={maxDurationIn * 100}\n                      key={`c-sheet-control-${index}`}\n                    >\n                      {(state) => (\n                        <Tooltip title={tooltip} disable={!tooltip || disabled}>\n                          <StyledAnimatedSpan\n                            onClick={onClick}\n                            $disabled={disabled}\n                            $mode={mode}\n                            $state={state}\n                            className={className}\n                            $maxDurationIn={maxDurationIn / 10}\n                            $maxDurationOut={maxDurationOut / 10}\n                            $durationOut={durationOut / 10}\n                            $durationIn={durationIn / 10}\n                          >\n                            {IconComponent}\n                          </StyledAnimatedSpan>\n                        </Tooltip>\n                      )}\n                    </Transition>\n                  );\n                }\n              )}\n            </StyledSheetIcons>\n          )}\n          <StyledCssTransition\n            appear\n            in={open}\n            timeout={400}\n            classNames=\"c-sheet__animation\"\n            $direction={animation}\n            onEnter={handleEnter}\n            onExited={handleExited}\n          >\n            <StyledSheetWrapperPaper paperClass=\"c-sheet__wrapper__paper\">\n              {controls.length > 0 && (\n                <StyledHeader>\n                  <StyledIconsWrapperSmall>\n                    {controls.map(\n                      (\n                        {\n                          icon: IconComponent,\n                          tooltip,\n                          onClick,\n                          disabled,\n                          className,\n                        },\n                        index\n                      ) => (\n                        <Tooltip\n                          title={tooltip}\n                          disable={!tooltip || disabled}\n                          key={index}\n                        >\n                          <IconButton\n                            onClick={onClick}\n                            disabled={disabled}\n                            className={className}\n                            variant=\"text gray\"\n                          >\n                            {IconComponent}\n                          </IconButton>\n                        </Tooltip>\n                      )\n                    )}\n                  </StyledIconsWrapperSmall>\n                  <StyledListSeparator />\n                </StyledHeader>\n              )}\n              {children}\n            </StyledSheetWrapperPaper>\n          </StyledCssTransition>\n        </StyledSheetWrapper>\n      </Window>\n    );\n  }\n);\n\nSheet.displayName = \"Sheet\";\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Sheet.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_Styles","_IconButton","_Overlay","_Tooltip","_Window","_excluded","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","_slicedToArray","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","a","_arrayLikeToArray","toString","slice","constructor","name","Array","from","test","l","Symbol","iterator","u","next","done","push","value","return","isArray","_objectWithoutProperties","_objectWithoutPropertiesLoose","getOwnPropertySymbols","indexOf","propertyIsEnumerable","Sheet","exports","forwardRef","_ref","ref","children","onClose","_ref$controls","controls","_ref$open","open","defaultOpen","_ref$animation","animation","_ref$position","position","_ref$mode","mode","_ref$disableFocusLock","disableFocusLock","_ref$disableScrollLoc","disableScrollLock","_ref$disableBackgroun","disableBackgroundColor","bodyStyle","bodyClassName","_ref$disableBackgroun2","disableBackgroundClick","rest","_useState","useState","_useState2","setOpen","_useState3","_useState4","exited","setExited","useEffect","handleEnter","useCallback","handleExited","handleClose","handleBackgroundClick","event","preventDefault","useImperativeHandle","close","createElement","Window","Overlay","onClick","StyledSheetWrapper","className","classnames","style","$position","$mode","StyledCssTransition","appear","in","timeout","classNames","$direction","onEnter","onExited","StyledSheetSurface","StyledSheetIcons","map","_ref2","index","IconComponent","icon","tooltip","disabled","Tooltip","title","disable","key","concat","StyledAnimatedSpan","$disabled","StyledSheetWrapperPaper","paperClass","StyledHeader","StyledIconsWrapperSmall","_ref3","IconButton","variant","StyledListSeparator","displayName"],"sources":["../../../../src/components/Sheet/Sheet.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useEffect,\n  forwardRef,\n  HTMLAttributes,\n  useState,\n  CSSProperties,\n  MouseEvent,\n  useImperativeHandle,\n} from \"react\";\n\nimport classnames from \"classnames\";\n\nimport {\n  StyledAnimatedSpan,\n  StyledCssTransition,\n  StyledHeader,\n  StyledIconsWrapperSmall,\n  StyledListSeparator,\n  StyledSheetIcons,\n  StyledSheetWrapper,\n  StyledSheetSurface,\n  StyledSheetWrapperPaper,\n} from \"./Styles\";\nimport { IconButton } from \"../IconButton\";\nimport { Overlay } from \"../Overlay\";\nimport { Tooltip } from \"../Tooltip\";\nimport { Window } from \"../Window\";\n\ninterface ControlProps {\n  onClick: () => void;\n  icon: React.ReactElement;\n  tooltip: string;\n  disabled: boolean;\n  className: string;\n}\n\ninterface ISheet {\n  onClose?: () => void;\n  controls?: ControlProps[];\n  open?: boolean;\n  animation?: \"top\" | \"bottom\" | \"left\" | \"right\";\n  position?: \"center\" | \"left\" | \"right\";\n  mode?: \"normal\" | \"stretch\";\n  disableFocusLock?: boolean;\n  disableScrollLock?: boolean;\n  disableBackgroundColor?: boolean;\n  bodyStyle?: CSSProperties;\n  bodyClassName?: string;\n  disableBackgroundClick?: boolean;\n}\n\nexport interface SheetMethods {\n  close: () => void;\n}\n\ntype SheetProps = ISheet & HTMLAttributes<HTMLDivElement>;\n\nexport const Sheet = forwardRef<SheetMethods, SheetProps>(\n  (\n    {\n      children,\n      onClose,\n      controls = [],\n      open: defaultOpen = false,\n      animation = \"top\",\n      position = \"center\",\n      mode = \"normal\",\n      disableFocusLock = false,\n      disableScrollLock = false,\n      disableBackgroundColor = false,\n      bodyStyle,\n      bodyClassName,\n      disableBackgroundClick = false,\n      ...rest\n    },\n    ref\n  ) => {\n    const [open, setOpen] = useState(defaultOpen);\n    const [exited, setExited] = useState(true);\n\n    useEffect(() => {\n      setOpen(defaultOpen);\n    }, [defaultOpen]);\n\n    const handleEnter = useCallback(() => {\n      setExited(false);\n    }, []);\n\n    const handleExited = useCallback(() => {\n      setExited(true);\n      onClose?.();\n    }, [onClose]);\n\n    const handleClose = useCallback(() => {\n      setOpen(false);\n    }, []);\n\n    const handleBackgroundClick = useCallback(\n      (event: MouseEvent<HTMLDivElement>) => {\n        if (!disableBackgroundClick) {\n          event.preventDefault();\n          handleClose();\n        }\n      },\n      [disableBackgroundClick, handleClose]\n    );\n\n    useImperativeHandle(ref, () => ({\n      close: handleClose,\n    }));\n\n    if (!open && exited) {\n      return null;\n    }\n\n    return (\n      <Window\n        {...rest}\n        onClose={handleClose}\n        disableFocusLock={disableFocusLock}\n        disableScrollLock={disableScrollLock}\n      >\n        {open && (\n          <Overlay\n            onClick={handleBackgroundClick}\n            disableBackgroundColor={disableBackgroundColor}\n          />\n        )}\n        <StyledSheetWrapper\n          className={classnames(\"c-sheet__wrapper\", bodyClassName)}\n          style={bodyStyle}\n          $position={position}\n          $mode={mode}\n        >\n          <StyledCssTransition\n            appear\n            in={open}\n            timeout={400}\n            classNames=\"c-sheet__animation\"\n            $direction={animation}\n            onEnter={handleEnter}\n            onExited={handleExited}\n          >\n            <StyledSheetSurface>\n              {controls.length > 0 && (\n                <StyledSheetIcons>\n                  {controls.map(\n                    (\n                      {\n                        icon: IconComponent,\n                        tooltip,\n                        onClick,\n                        disabled,\n                        className,\n                      },\n                      index\n                    ) => (\n                      <Tooltip\n                        title={tooltip}\n                        disable={!tooltip || disabled}\n                        key={`c-sheet-control-${index}`}\n                      >\n                        <StyledAnimatedSpan\n                          onClick={onClick}\n                          $disabled={disabled}\n                          className={className}\n                        >\n                          {IconComponent}\n                        </StyledAnimatedSpan>\n                      </Tooltip>\n                    )\n                  )}\n                </StyledSheetIcons>\n              )}\n              <StyledSheetWrapperPaper paperClass=\"c-sheet__wrapper__paper\">\n                {controls.length > 0 && (\n                  <StyledHeader>\n                    <StyledIconsWrapperSmall>\n                      {controls.map(\n                        (\n                          {\n                            icon: IconComponent,\n                            tooltip,\n                            onClick,\n                            disabled,\n                            className,\n                          },\n                          index\n                        ) => (\n                          <Tooltip\n                            title={tooltip}\n                            disable={!tooltip || disabled}\n                            key={index}\n                          >\n                            <IconButton\n                              onClick={onClick}\n                              disabled={disabled}\n                              className={className}\n                              variant=\"text gray\"\n                            >\n                              {IconComponent}\n                            </IconButton>\n                          </Tooltip>\n                        )\n                      )}\n                    </StyledIconsWrapperSmall>\n                    <StyledListSeparator />\n                  </StyledHeader>\n                )}\n                {children}\n              </StyledSheetWrapperPaper>\n            </StyledSheetSurface>\n          </StyledCssTransition>\n        </StyledSheetWrapper>\n      </Window>\n    );\n  }\n);\n\nSheet.displayName = \"Sheet\";\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/Sheet/Styles.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StyledSheetWrapperPaper = exports.StyledSheetWrapper = exports.StyledSheetIcons = exports.StyledSheetControlsTop = exports.StyledSheetControlsCenterOut = exports.StyledSheetControlsCenterIn = exports.StyledSheetControlsBottom = exports.StyledListSeparator = exports.StyledIconsWrapperSmall = exports.StyledHeader = exports.StyledCssTransition = exports.StyledAnimatedSpan = void 0;
+exports.StyledSheetWrapperPaper = exports.StyledSheetWrapper = exports.StyledSheetSurface = exports.StyledSheetIcons = exports.StyledListSeparator = exports.StyledIconsWrapperSmall = exports.StyledHeader = exports.StyledCssTransition = exports.StyledAnimatedSpan = void 0;
 var _reactTransitionGroup = require("react-transition-group");
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 var _BoxSizingStyle = require("../BoxSizingStyle");
@@ -19,7 +19,7 @@ var StyledSheetWrapper = exports.StyledSheetWrapper = _styledComponents.default.
   displayName: "Styles__StyledSheetWrapper",
   componentId: "sc-144eyxd-1"
 })(["", " ", " position:relative;max-width:95vw;display:flex;flex-direction:row;", " ", " ", " ", " ", " ", " ", ""], _BoxSizingStyle.BoxSizingStyle, _FontStyle.FontStyle, function (props) {
-  return props.$mode === "stretch" ? (0, _styledComponents.css)(["margin-top:8px;height:calc(100vh - 16px);width:calc(100vw - 100px);max-width:1000px;", "{flex-direction:column;width:0;height:calc(100vh - 32px);& > *{margin-bottom:8px;animation-fill-mode:both;}span{top:8px;}}"], StyledSheetIcons) : (0, _styledComponents.css)(["max-height:calc(100vh - 156px);margin-top:126px;margin-bottom:30px;width:540px;flex-direction:column;", "{flex-direction:row-reverse;& > *{margin-left:8px;animation-fill-mode:both;}span{top:-48px;right:8px;}}"], StyledSheetIcons);
+  return props.$mode === "stretch" ? (0, _styledComponents.css)(["margin-top:8px;height:calc(100vh - 16px);width:calc(100vw - 100px);max-width:1000px;", "{flex-direction:column;width:0;height:calc(100vh - 32px);& > *{margin-bottom:8px;}span{top:8px;}}"], StyledSheetIcons) : (0, _styledComponents.css)(["max-height:calc(100vh - 156px);margin-top:126px;margin-bottom:30px;width:540px;flex-direction:column;", "{flex-direction:row-reverse;& > *{margin-left:8px;}span{top:-48px;right:8px;}}"], StyledSheetIcons);
 }, function (props) {
   return props.$mode === "stretch" && (0, _styledComponents.css)(["@media (max-width:640px){width:100%;height:100%;}"]);
 }, function (props) {
@@ -43,39 +43,32 @@ var StyledSheetWrapper = exports.StyledSheetWrapper = _styledComponents.default.
   return props.$mode === "stretch" && props.$position === "left" && (0, _styledComponents.css)(["flex-direction:row-reverse;", "{span{right:-8px;}}"], StyledSheetIcons);
 });
 StyledSheetWrapper.displayName = "StyledSheetWrapper";
+var StyledSheetSurface = exports.StyledSheetSurface = _styledComponents.default.div.withConfig({
+  displayName: "Styles__StyledSheetSurface",
+  componentId: "sc-144eyxd-2"
+})(["display:flex;flex-direction:inherit;flex:1 1 auto;min-width:0;min-height:0;"]);
+StyledSheetSurface.displayName = "StyledSheetSurface";
 var StyledSheetWrapperPaper = exports.StyledSheetWrapperPaper = _styledComponents.default.div.attrs(function (props) {
   return {
     className: props.paperClass
   };
 }).withConfig({
   displayName: "Styles__StyledSheetWrapperPaper",
-  componentId: "sc-144eyxd-2"
-})(["background-color:var(--page-paper-main);color:var(--color-theme-900);box-shadow:var(--shadow-primary);border-radius:6px;overflow:auto;animation:0.3s linear ease-out;", ""], {
+  componentId: "sc-144eyxd-3"
+})(["background-color:var(--page-paper-main);color:var(--color-theme-900);box-shadow:var(--shadow-primary);border-radius:6px;overflow:auto;animation:0.3s linear ease-out;transform:translateZ(0);contain:paint;overscroll-behavior:contain;", ""], {
   "flex": "1 1 auto"
 });
 StyledSheetWrapperPaper.displayName = "StyledSheetWrapperPaper";
-var StyledSheetControlsTop = exports.StyledSheetControlsTop = (0, _styledComponents.keyframes)(["0%{opacity:0;transform:translateY(-200px);}100%{opacity:1;transform:translateY(0);}"]);
-var StyledSheetControlsBottom = exports.StyledSheetControlsBottom = (0, _styledComponents.keyframes)(["0%{opacity:1;transform:translateY(0);}100%{opacity:0;transform:translateY(-200px);}"]);
-var StyledSheetControlsCenterIn = exports.StyledSheetControlsCenterIn = (0, _styledComponents.keyframes)(["0%{transform:translateY(-150px);opacity:0;}100%{transform:translateY(0);opacity:1;}"]);
-var StyledSheetControlsCenterOut = exports.StyledSheetControlsCenterOut = (0, _styledComponents.keyframes)(["0%{transform:translateY(0);opacity:1;}100%{transform:translateY(-150px);opacity:0;}"]);
 var StyledAnimatedSpan = exports.StyledAnimatedSpan = _styledComponents.default.span.withConfig({
   displayName: "Styles__StyledAnimatedSpan",
-  componentId: "sc-144eyxd-3"
-})(["&:hover svg{fill:var(--color-primary);}", " ", " ", " ", " ", ""], function (props) {
-  return props.$state === "entering" && (0, _styledComponents.css)(["opacity:1;", ""], props.$mode === "stretch" ? (0, _styledComponents.css)(["animation-name:", ";animation-duration:", ";animation-delay:", ";"], StyledSheetControlsTop, "".concat(props.$durationIn, "s"), "".concat(props.$durationIn, "s")) : (0, _styledComponents.css)(["animation-name:", ";animation-duration:", ";animation-delay:0s;"], StyledSheetControlsCenterIn, "".concat(props.$maxDurationIn, "s")));
-}, function (props) {
-  return props.$state === "entered" && (0, _styledComponents.css)(["opacity:1;"]);
-}, function (props) {
+  componentId: "sc-144eyxd-4"
+})(["&:hover svg{fill:var(--color-primary);}", ""], function (props) {
   return props.$disabled && (0, _styledComponents.css)(["pointer-events:none;svg{opacity:0.5;}"]);
-}, function (props) {
-  return props.$state === "exiting" && (0, _styledComponents.css)(["opacity:0;", ""], props.$mode === "stretch" ? (0, _styledComponents.css)(["animation-name:", ";animation-duration:", ";animation-delay:", ";"], StyledSheetControlsBottom, "".concat(props.$durationOut, "s"), "".concat(props.$durationOut, "s")) : (0, _styledComponents.css)(["animation-name:", ";animation-duration:", ";animation-delay:0;"], StyledSheetControlsCenterOut, "".concat(props.$maxDurationOut, "s")));
-}, function (props) {
-  return props.$state === "exited" && (0, _styledComponents.css)(["opacity:0;"]);
 });
 StyledAnimatedSpan.displayName = "StyledAnimatedSpan";
 var StyledCssTransition = exports.StyledCssTransition = (0, _styledComponents.default)(_reactTransitionGroup.CSSTransition).withConfig({
   displayName: "Styles__StyledCssTransition",
-  componentId: "sc-144eyxd-4"
+  componentId: "sc-144eyxd-5"
 })(["", " ", " ", " ", ""], function (props) {
   return props.$direction === "top" && (0, _styledComponents.css)(["&.c-sheet__animation-enter{opacity:0;transform:translateY(-100%);}&.c-sheet__animation-enter-active{opacity:1;transform:translateY(0);transition:opacity 400ms,transform 400ms;}&.c-sheet__animation-appear{opacity:0;transform:translateY(-100%);}&.c-sheet__animation-appear-active{opacity:1;transform:translateY(0);transition:opacity 400ms,transform 400ms;}&.c-sheet__animation-exit{opacity:1;}&.c-sheet__animation-exit-active{opacity:0;transform:translateY(-100%);transition:opacity 200ms,transform 200ms;}"]);
 }, function (props) {
@@ -88,17 +81,17 @@ var StyledCssTransition = exports.StyledCssTransition = (0, _styledComponents.de
 StyledCssTransition.displayName = "StyledCssTransition";
 var StyledListSeparator = exports.StyledListSeparator = (0, _styledComponents.default)(_List.ListSeparator).withConfig({
   displayName: "Styles__StyledListSeparator",
-  componentId: "sc-144eyxd-5"
+  componentId: "sc-144eyxd-6"
 })(["margin:0;"]);
 StyledListSeparator.displayName = "StyledListSeparator";
 var StyledIconsWrapperSmall = exports.StyledIconsWrapperSmall = _styledComponents.default.div.withConfig({
   displayName: "Styles__StyledIconsWrapperSmall",
-  componentId: "sc-144eyxd-6"
+  componentId: "sc-144eyxd-7"
 })(["height:40px;display:flex;gap:8px;padding-left:16px;padding-right:16px;align-items:center;place-content:end;flex-direction:row-reverse;"]);
 StyledIconsWrapperSmall.displayName = "StyledIconsWrapperSmall";
 var StyledHeader = exports.StyledHeader = _styledComponents.default.div.withConfig({
   displayName: "Styles__StyledHeader",
-  componentId: "sc-144eyxd-7"
+  componentId: "sc-144eyxd-8"
 })(["@media (min-width:640px){display:none;}"]);
 StyledHeader.displayName = "StyledHeader";
 //# sourceMappingURL=Styles.js.map

package/dist/cjs/components/Sheet/Styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Styles.js","names":["_reactTransitionGroup","require","_styledComponents","_interopRequireWildcard","_BoxSizingStyle","_FontStyle","_List","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledSheetIcons","exports","styled","div","withConfig","displayName","componentId","StyledSheetWrapper","BoxSizingStyle","FontStyle","props","$mode","css","$position","StyledSheetWrapperPaper","attrs","className","paperClass","StyledSheetControlsTop","keyframes","StyledSheetControlsBottom","StyledSheetControlsCenterIn","StyledSheetControlsCenterOut","StyledAnimatedSpan","span","$state","concat","$durationIn","$maxDurationIn","$disabled","$durationOut","$maxDurationOut","StyledCssTransition","CSSTransition","$direction","StyledListSeparator","ListSeparator","StyledIconsWrapperSmall","StyledHeader"],"sources":["../../../../src/components/Sheet/Styles.ts"],"sourcesContent":["import { CSSTransition } from \"react-transition-group\";\n\nimport styled, { css, keyframes } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport { ListSeparator } from \"../List\";\n\nexport const StyledSheetIcons = styled.div`\n  display: flex;\n  height: 0;\n  position: relative;\n\n  span {\n    position: relative;\n    background-color: var(--page-paper-main);\n    box-shadow: var(--shadow-secondary);\n    cursor: pointer;\n    border-radius: 100%;\n    width: 40px;\n    height: 40px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    & > * {\n      height: 40px;\n      width: 40px;\n      padding: 8px;\n      fill: var(--color-theme-600);\n    }\n  }\n\n  @media (max-width: 640px) {\n    display: none;\n  }\n`;\n\nStyledSheetIcons.displayName = \"StyledSheetIcons\";\n\ninterface IStyledSheetWrapper {\n  $position?: \"center\" | \"left\" | \"right\";\n  $mode?: \"normal\" | \"stretch\";\n}\n\nexport const StyledSheetWrapper = styled.div<IStyledSheetWrapper>`\n  ${BoxSizingStyle}\n  ${FontStyle}\n\n  position: relative;\n  max-width: 95vw;\n  display: flex;\n  flex-direction: row;\n\n  ${(props) =>\n    props.$mode === \"stretch\"\n      ? css`\n          margin-top: 8px;\n          height: calc(100vh - 16px);\n          width: calc(100vw - 100px);\n          max-width: 1000px;\n          ${StyledSheetIcons} {\n            flex-direction: column;\n            width: 0;\n            height: calc(100vh - 32px);\n            & > * {\n              margin-bottom: 8px;\n              animation-fill-mode: both;\n            }\n            span {\n              top: 8px;\n            }\n          }\n        `\n      : css`\n          max-height: calc(100vh - 156px);\n          margin-top: 126px;\n          margin-bottom: 30px;\n          width: 540px;\n          flex-direction: column;\n\n          ${StyledSheetIcons} {\n            flex-direction: row-reverse;\n            & > * {\n              margin-left: 8px;\n              animation-fill-mode: both;\n            }\n            span {\n              top: -48px;\n              right: 8px;\n            }\n          }\n        `}\n\n  ${(props) =>\n    props.$mode === \"stretch\" &&\n    css`\n      @media (max-width: 640px) {\n        width: 100%;\n        height: 100%;\n      }\n    `}\n\n  ${(props) =>\n    props.$position === \"center\" &&\n    css`\n      ${tw`tw-mx-auto`}\n    `}\n\n  ${(props) =>\n    props.$position === \"left\" &&\n    css`\n      ${tw`tw-ml-2 tw-mr-auto`}\n    `}\n\n  ${(props) =>\n    props.$position === \"right\" &&\n    css`\n      ${tw`tw-mr-2 tw-ml-auto`}\n    `}\n\n  ${(props) =>\n    props.$mode === \"stretch\" &&\n    props.$position !== \"left\" &&\n    css`\n      ${StyledSheetIcons} {\n        span {\n          right: 48px;\n        }\n      }\n    `}\n\n  ${(props) =>\n    props.$mode === \"stretch\" &&\n    props.$position === \"left\" &&\n    css`\n      flex-direction: row-reverse;\n\n      ${StyledSheetIcons} {\n        span {\n          right: -8px;\n        }\n      }\n    `}\n`;\n\nStyledSheetWrapper.displayName = \"StyledSheetWrapper\";\n\ninterface IStyledSheetWrapperPaper {\n  paperClass?: string;\n}\n\nexport const StyledSheetWrapperPaper = styled.div.attrs<IStyledSheetWrapperPaper>(\n  (props) => ({\n    className: props.paperClass,\n  })\n)<IStyledSheetWrapperPaper>`\n  background-color: var(--page-paper-main);\n  color: var(--color-theme-900);\n  box-shadow: var(--shadow-primary);\n  border-radius: 6px;\n  overflow: auto;\n  animation: 0.3s linear ease-out;\n\n  ${tw`tw-flex-auto`}\n`;\n\nStyledSheetWrapperPaper.displayName = \"StyledSheetWrapperPaper\";\n\nexport const StyledSheetControlsTop = keyframes`\n  0% {\n    opacity: 0;\n    transform: translateY(-200px);\n  }\n  100% {\n    opacity: 1;\n    transform: translateY(0);\n  }\n`;\n\nexport const StyledSheetControlsBottom = keyframes`\n  0% {\n    opacity: 1;\n    transform: translateY(0);\n  }\n  100% {\n    opacity: 0;\n    transform: translateY(-200px);\n}\n`;\n\nexport const StyledSheetControlsCenterIn = keyframes`\n  0% {\n    transform: translateY(-150px);\n    opacity: 0;\n  }\n  100% {\n    transform: translateY(0);\n    opacity: 1;\n  }\n`;\n\nexport const StyledSheetControlsCenterOut = keyframes`\n  0% {\n    transform: translateY(0);\n    opacity: 1;\n  }\n  100% {\n    transform: translateY(-150px);\n    opacity: 0;\n  }\n`;\n\ninterface IStyledAnimatedSpan {\n  $mode: string;\n  $state?: string;\n  $maxDurationIn: number;\n  $maxDurationOut: number;\n  $durationOut: number;\n  $durationIn: number;\n  $disabled?: boolean;\n}\n\nexport const StyledAnimatedSpan = styled.span<IStyledAnimatedSpan>`\n  &:hover svg {\n    fill: var(--color-primary);\n  }\n  ${(props) =>\n    props.$state === \"entering\" &&\n    css`\n      opacity: 1;\n\n      ${props.$mode === \"stretch\"\n        ? css`\n            animation-name: ${StyledSheetControlsTop};\n            animation-duration: ${`${props.$durationIn}s`};\n            animation-delay: ${`${props.$durationIn}s`};\n          `\n        : css`\n            animation-name: ${StyledSheetControlsCenterIn};\n            animation-duration: ${`${props.$maxDurationIn}s`};\n            animation-delay: 0s;\n          `}\n    `}\n\n  ${(props) =>\n    props.$state === \"entered\" &&\n    css`\n      opacity: 1;\n    `}\n\n    ${(props) =>\n    props.$disabled &&\n    css`\n      pointer-events: none;\n\n      svg {\n        opacity: 0.5;\n      }\n    `}\n\n  ${(props) =>\n    props.$state === \"exiting\" &&\n    css`\n      opacity: 0;\n\n      ${props.$mode === \"stretch\"\n        ? css`\n            animation-name: ${StyledSheetControlsBottom};\n            animation-duration: ${`${props.$durationOut}s`};\n            animation-delay: ${`${props.$durationOut}s`};\n          `\n        : css`\n            animation-name: ${StyledSheetControlsCenterOut};\n            animation-duration: ${`${props.$maxDurationOut}s`};\n            animation-delay: 0;\n          `}\n    `}\n\n  ${(props) =>\n    props.$state === \"exited\" &&\n    css`\n      opacity: 0;\n    `}\n`;\n\nStyledAnimatedSpan.displayName = \"StyledAnimatedSpan\";\n\nexport const StyledCssTransition = styled(CSSTransition)<{\n  $direction: string;\n}>`\n  ${(props) =>\n    props.$direction === \"top\" &&\n    css`\n      &.c-sheet__animation-enter {\n        opacity: 0;\n        transform: translateY(-100%);\n      }\n      &.c-sheet__animation-enter-active {\n        opacity: 1;\n        transform: translateY(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-appear {\n        opacity: 0;\n        transform: translateY(-100%);\n      }\n      &.c-sheet__animation-appear-active {\n        opacity: 1;\n        transform: translateY(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-exit {\n        opacity: 1;\n      }\n      &.c-sheet__animation-exit-active {\n        opacity: 0;\n        transform: translateY(-100%);\n        transition: opacity 200ms, transform 200ms;\n      }\n    `}\n\n  ${(props) =>\n    props.$direction === \"bottom\" &&\n    css`\n      &.c-sheet__animation-enter {\n        opacity: 0;\n        transform: translateY(100%);\n      }\n      &.c-sheet__animation-enter-active {\n        opacity: 1;\n        transform: translateY(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-appear {\n        opacity: 0;\n        transform: translateY(100%);\n      }\n      &.c-sheet__animation-appear-active {\n        opacity: 1;\n        transform: translateY(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-exit {\n        opacity: 1;\n      }\n      &.c-sheet__animation-exit-active {\n        opacity: 0;\n        transform: translateY(100%);\n        transition: opacity 200ms, transform 200ms;\n      }\n    `}\n\n  ${(props) =>\n    props.$direction === \"left\" &&\n    css`\n      &.c-sheet__animation-enter {\n        opacity: 0;\n        transform: translateX(-100%);\n      }\n      &.c-sheet__animation-enter-active {\n        opacity: 1;\n        transform: translateX(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-appear {\n        opacity: 0;\n        transform: translateX(-100%);\n      }\n      &.c-sheet__animation-appear-active {\n        opacity: 1;\n        transform: translateX(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-exit {\n        opacity: 1;\n      }\n      &.c-sheet__animation-exit-active {\n        opacity: 0;\n        transform: translateX(-100%);\n        transition: opacity 200ms, transform 200ms;\n      }\n    `}\n\n  ${(props) =>\n    props.$direction === \"right\" &&\n    css`\n      &.c-sheet__animation-enter {\n        opacity: 0;\n        transform: translateX(100%);\n      }\n      &.c-sheet__animation-enter-active {\n        opacity: 1;\n        transform: translateX(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-appear {\n        opacity: 0;\n        transform: translateX(100%);\n      }\n      &.c-sheet__animation-appear-active {\n        opacity: 1;\n        transform: translateX(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-exit {\n        opacity: 1;\n      }\n      &.c-sheet__animation-exit-active {\n        opacity: 0;\n        transform: translateX(100%);\n        transition: opacity 200ms, transform 200ms;\n      }\n    `}\n`;\n\nStyledCssTransition.displayName = \"StyledCssTransition\";\n\nexport const StyledListSeparator = styled(ListSeparator)`\n  margin: 0;\n`;\n\nStyledListSeparator.displayName = \"StyledListSeparator\";\n\nexport const StyledIconsWrapperSmall = styled.div`\n  height: 40px;\n  display: flex;\n  gap: 8px;\n  padding-left: 16px;\n  padding-right: 16px;\n  align-items: center;\n  place-content: end;\n  flex-direction: row-reverse;\n`;\n\nStyledIconsWrapperSmall.displayName = \"StyledIconsWrapperSmall\";\n\nexport const StyledHeader = styled.div`\n  @media (min-width: 640px) {\n    display: none;\n  }\n`;\n\nStyledHeader.displayName = \"StyledHeader\";\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Styles.js","names":["_reactTransitionGroup","require","_styledComponents","_interopRequireWildcard","_BoxSizingStyle","_FontStyle","_List","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledSheetIcons","exports","styled","div","withConfig","displayName","componentId","StyledSheetWrapper","BoxSizingStyle","FontStyle","props","$mode","css","$position","StyledSheetSurface","StyledSheetWrapperPaper","attrs","className","paperClass","StyledAnimatedSpan","span","$disabled","StyledCssTransition","CSSTransition","$direction","StyledListSeparator","ListSeparator","StyledIconsWrapperSmall","StyledHeader"],"sources":["../../../../src/components/Sheet/Styles.ts"],"sourcesContent":["import { CSSTransition } from \"react-transition-group\";\n\nimport styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { FontStyle } from \"../FontStyle\";\nimport { ListSeparator } from \"../List\";\n\nexport const StyledSheetIcons = styled.div`\n  display: flex;\n  height: 0;\n  position: relative;\n\n  span {\n    position: relative;\n    background-color: var(--page-paper-main);\n    box-shadow: var(--shadow-secondary);\n    cursor: pointer;\n    border-radius: 100%;\n    width: 40px;\n    height: 40px;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    & > * {\n      height: 40px;\n      width: 40px;\n      padding: 8px;\n      fill: var(--color-theme-600);\n    }\n  }\n\n  @media (max-width: 640px) {\n    display: none;\n  }\n`;\n\nStyledSheetIcons.displayName = \"StyledSheetIcons\";\n\ninterface IStyledSheetWrapper {\n  $position?: \"center\" | \"left\" | \"right\";\n  $mode?: \"normal\" | \"stretch\";\n}\n\nexport const StyledSheetWrapper = styled.div<IStyledSheetWrapper>`\n  ${BoxSizingStyle}\n  ${FontStyle}\n\n  position: relative;\n  max-width: 95vw;\n  display: flex;\n  flex-direction: row;\n\n  ${(props) =>\n    props.$mode === \"stretch\"\n      ? css`\n          margin-top: 8px;\n          height: calc(100vh - 16px);\n          width: calc(100vw - 100px);\n          max-width: 1000px;\n          ${StyledSheetIcons} {\n            flex-direction: column;\n            width: 0;\n            height: calc(100vh - 32px);\n            & > * {\n              margin-bottom: 8px;\n            }\n            span {\n              top: 8px;\n            }\n          }\n        `\n      : css`\n          max-height: calc(100vh - 156px);\n          margin-top: 126px;\n          margin-bottom: 30px;\n          width: 540px;\n          flex-direction: column;\n\n          ${StyledSheetIcons} {\n            flex-direction: row-reverse;\n            & > * {\n              margin-left: 8px;\n            }\n            span {\n              top: -48px;\n              right: 8px;\n            }\n          }\n        `}\n\n  ${(props) =>\n    props.$mode === \"stretch\" &&\n    css`\n      @media (max-width: 640px) {\n        width: 100%;\n        height: 100%;\n      }\n    `}\n\n  ${(props) =>\n    props.$position === \"center\" &&\n    css`\n      ${tw`tw-mx-auto`}\n    `}\n\n  ${(props) =>\n    props.$position === \"left\" &&\n    css`\n      ${tw`tw-ml-2 tw-mr-auto`}\n    `}\n\n  ${(props) =>\n    props.$position === \"right\" &&\n    css`\n      ${tw`tw-mr-2 tw-ml-auto`}\n    `}\n\n  ${(props) =>\n    props.$mode === \"stretch\" &&\n    props.$position !== \"left\" &&\n    css`\n      ${StyledSheetIcons} {\n        span {\n          right: 48px;\n        }\n      }\n    `}\n\n  ${(props) =>\n    props.$mode === \"stretch\" &&\n    props.$position === \"left\" &&\n    css`\n      flex-direction: row-reverse;\n\n      ${StyledSheetIcons} {\n        span {\n          right: -8px;\n        }\n      }\n    `}\n`;\n\nStyledSheetWrapper.displayName = \"StyledSheetWrapper\";\n\ninterface IStyledSheetWrapperPaper {\n  paperClass?: string;\n}\n\nexport const StyledSheetSurface = styled.div`\n  display: flex;\n  flex-direction: inherit;\n  flex: 1 1 auto;\n  min-width: 0;\n  min-height: 0;\n`;\n\nStyledSheetSurface.displayName = \"StyledSheetSurface\";\n\nexport const StyledSheetWrapperPaper = styled.div.attrs<IStyledSheetWrapperPaper>(\n  (props) => ({\n    className: props.paperClass,\n  })\n)<IStyledSheetWrapperPaper>`\n  background-color: var(--page-paper-main);\n  color: var(--color-theme-900);\n  box-shadow: var(--shadow-primary);\n  border-radius: 6px;\n  overflow: auto;\n  animation: 0.3s linear ease-out;\n  /* Scrolling here must not dirty the blurred overlays below, which already clip to this box. */\n  transform: translateZ(0);\n  contain: paint;\n  /* A scroll that runs off the end must stop here. Chained to the page, it moves what the blur samples. */\n  overscroll-behavior: contain;\n\n  ${tw`tw-flex-auto`}\n`;\n\nStyledSheetWrapperPaper.displayName = \"StyledSheetWrapperPaper\";\n\ninterface IStyledAnimatedSpan {\n  $disabled?: boolean;\n}\n\nexport const StyledAnimatedSpan = styled.span<IStyledAnimatedSpan>`\n  &:hover svg {\n    fill: var(--color-primary);\n  }\n\n  ${(props) =>\n    props.$disabled &&\n    css`\n      pointer-events: none;\n\n      svg {\n        opacity: 0.5;\n      }\n    `}\n`;\n\nStyledAnimatedSpan.displayName = \"StyledAnimatedSpan\";\n\nexport const StyledCssTransition = styled(CSSTransition)<{\n  $direction: string;\n}>`\n  ${(props) =>\n    props.$direction === \"top\" &&\n    css`\n      &.c-sheet__animation-enter {\n        opacity: 0;\n        transform: translateY(-100%);\n      }\n      &.c-sheet__animation-enter-active {\n        opacity: 1;\n        transform: translateY(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-appear {\n        opacity: 0;\n        transform: translateY(-100%);\n      }\n      &.c-sheet__animation-appear-active {\n        opacity: 1;\n        transform: translateY(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-exit {\n        opacity: 1;\n      }\n      &.c-sheet__animation-exit-active {\n        opacity: 0;\n        transform: translateY(-100%);\n        transition: opacity 200ms, transform 200ms;\n      }\n    `}\n\n  ${(props) =>\n    props.$direction === \"bottom\" &&\n    css`\n      &.c-sheet__animation-enter {\n        opacity: 0;\n        transform: translateY(100%);\n      }\n      &.c-sheet__animation-enter-active {\n        opacity: 1;\n        transform: translateY(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-appear {\n        opacity: 0;\n        transform: translateY(100%);\n      }\n      &.c-sheet__animation-appear-active {\n        opacity: 1;\n        transform: translateY(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-exit {\n        opacity: 1;\n      }\n      &.c-sheet__animation-exit-active {\n        opacity: 0;\n        transform: translateY(100%);\n        transition: opacity 200ms, transform 200ms;\n      }\n    `}\n\n  ${(props) =>\n    props.$direction === \"left\" &&\n    css`\n      &.c-sheet__animation-enter {\n        opacity: 0;\n        transform: translateX(-100%);\n      }\n      &.c-sheet__animation-enter-active {\n        opacity: 1;\n        transform: translateX(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-appear {\n        opacity: 0;\n        transform: translateX(-100%);\n      }\n      &.c-sheet__animation-appear-active {\n        opacity: 1;\n        transform: translateX(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-exit {\n        opacity: 1;\n      }\n      &.c-sheet__animation-exit-active {\n        opacity: 0;\n        transform: translateX(-100%);\n        transition: opacity 200ms, transform 200ms;\n      }\n    `}\n\n  ${(props) =>\n    props.$direction === \"right\" &&\n    css`\n      &.c-sheet__animation-enter {\n        opacity: 0;\n        transform: translateX(100%);\n      }\n      &.c-sheet__animation-enter-active {\n        opacity: 1;\n        transform: translateX(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-appear {\n        opacity: 0;\n        transform: translateX(100%);\n      }\n      &.c-sheet__animation-appear-active {\n        opacity: 1;\n        transform: translateX(0);\n        transition: opacity 400ms, transform 400ms;\n      }\n      &.c-sheet__animation-exit {\n        opacity: 1;\n      }\n      &.c-sheet__animation-exit-active {\n        opacity: 0;\n        transform: translateX(100%);\n        transition: opacity 200ms, transform 200ms;\n      }\n    `}\n`;\n\nStyledCssTransition.displayName = \"StyledCssTransition\";\n\nexport const StyledListSeparator = styled(ListSeparator)`\n  margin: 0;\n`;\n\nStyledListSeparator.displayName = \"StyledListSeparator\";\n\nexport const StyledIconsWrapperSmall = styled.div`\n  height: 40px;\n  display: flex;\n  gap: 8px;\n  padding-left: 16px;\n  padding-right: 16px;\n  align-items: center;\n  place-content: end;\n  flex-direction: row-reverse;\n`;\n\nStyledIconsWrapperSmall.displayName = \"StyledIconsWrapperSmall\";\n\nexport const StyledHeader = styled.div`\n  @media (min-width: 640px) {\n    display: none;\n  }\n`;\n\nStyledHeader.displayName = \"StyledHeader\";\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/components/Dialog/Styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Dialog/Styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,WAAW;;;;;;;CAOd,CAAC;AAEX,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,WAAW,CAAC;AAQlD,eAAO,MAAM,oBAAoB,oEAoChC,CAAC;AAIF,eAAO,MAAM,YAAY;eACZ,MAAM;cACP,MAAM;SA4BjB,CAAC;AAIF,eAAO,MAAM,iBAAiB,oEAM7B,CAAC;AASF,eAAO,MAAM,oBAAoB,oEAKhC,CAAC;AAGF,eAAO,MAAM,sBAAsB,oEAMlC,CAAC;AAGF,eAAO,MAAM,mBAAmB;aAAyB,OAAO;SAQ/D,CAAC;AAGF,eAAO,MAAM,0BAA0B,oEAItC,CAAC;AAGF,eAAO,MAAM,mBAAmB,oEAS/B,CAAC"}
+{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Dialog/Styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,WAAW;;;;;;;CAOd,CAAC;AAEX,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,WAAW,CAAC;AAQlD,eAAO,MAAM,oBAAoB,oEAoChC,CAAC;AAIF,eAAO,MAAM,YAAY;eACZ,MAAM;cACP,MAAM;SA4BjB,CAAC;AAIF,eAAO,MAAM,iBAAiB,oEAM7B,CAAC;AASF,eAAO,MAAM,oBAAoB,oEAKhC,CAAC;AAGF,eAAO,MAAM,sBAAsB,oEAMlC,CAAC;AAGF,eAAO,MAAM,mBAAmB;aAAyB,OAAO;SAS/D,CAAC;AAGF,eAAO,MAAM,0BAA0B,oEAItC,CAAC;AAGF,eAAO,MAAM,mBAAmB,oEAS/B,CAAC"}

package/dist/esm/components/Dialog/Styles.js

@@ -51,7 +51,7 @@ StyledDialogTitleClose.displayName = "StyledDialogTitleClose";
 export const StyledDialogContent = styled.div.withConfig({
   displayName: "Styles__StyledDialogContent",
   componentId: "sc-jwpvgm-5"
-})(["padding:20px 30px;flex:1 1 auto;min-height:0;overflow-y:", ";", " ", ""], props => props.$scroll ? "auto" : "visible", FontStyle, BoxSizingStyle);
+})(["padding:20px 30px;flex:1 1 auto;min-height:0;overscroll-behavior:contain;overflow-y:", ";", " ", ""], props => props.$scroll ? "auto" : "visible", FontStyle, BoxSizingStyle);
 StyledDialogContent.displayName = "StyledDialogContent";
 export const StyledDialogContentDivider = styled.div.withConfig({
   displayName: "Styles__StyledDialogContentDivider",