@salutejs/plasma-new-hope 0.162.1-dev.0 → 0.162.2-dev.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (87) hide show
  1. package/cjs/components/Drawer/Drawer.css +3 -2
  2. package/cjs/components/Drawer/Drawer.styles.js +2 -0
  3. package/cjs/components/Drawer/Drawer.styles.js.map +1 -1
  4. package/cjs/components/Modal/Modal.css +3 -2
  5. package/cjs/components/Notification/NotificationsProvider.css +3 -2
  6. package/cjs/components/Popup/Popup.js +30 -41
  7. package/cjs/components/Popup/Popup.js.map +1 -1
  8. package/cjs/components/Popup/Popup.styles.js +35 -16
  9. package/cjs/components/Popup/Popup.styles.js.map +1 -1
  10. package/cjs/components/Popup/Popup.styles_gq4luz.css +4 -0
  11. package/cjs/components/Popup/PopupContext.css +4 -0
  12. package/cjs/components/Popup/PopupContext.js +23 -10
  13. package/cjs/components/Popup/PopupContext.js.map +1 -1
  14. package/cjs/components/Popup/PopupRoot.js +3 -1
  15. package/cjs/components/Popup/PopupRoot.js.map +1 -1
  16. package/cjs/components/Popup/hooks/usePopup.js +3 -2
  17. package/cjs/components/Popup/hooks/usePopup.js.map +1 -1
  18. package/cjs/index.css +3 -2
  19. package/emotion/cjs/components/Popup/Popup.js +29 -41
  20. package/emotion/cjs/components/Popup/Popup.styles.js +32 -17
  21. package/emotion/cjs/components/Popup/PopupContext.js +22 -10
  22. package/emotion/cjs/components/Popup/PopupRoot.js +3 -3
  23. package/emotion/cjs/components/Popup/hooks/usePopup.js +3 -2
  24. package/emotion/cjs/examples/plasma_b2c/components/Modal/Modal.stories.tsx +3 -0
  25. package/emotion/cjs/examples/plasma_b2c/components/Popup/Popup.stories.tsx +3 -0
  26. package/emotion/cjs/examples/plasma_web/components/Modal/Modal.stories.tsx +3 -0
  27. package/emotion/cjs/examples/plasma_web/components/Popup/Popup.stories.tsx +3 -0
  28. package/emotion/es/components/Popup/Popup.js +31 -43
  29. package/emotion/es/components/Popup/Popup.styles.js +31 -16
  30. package/emotion/es/components/Popup/PopupContext.js +23 -11
  31. package/emotion/es/components/Popup/PopupRoot.js +3 -3
  32. package/emotion/es/components/Popup/hooks/usePopup.js +3 -2
  33. package/emotion/es/examples/plasma_b2c/components/Modal/Modal.stories.tsx +3 -0
  34. package/emotion/es/examples/plasma_b2c/components/Popup/Popup.stories.tsx +3 -0
  35. package/emotion/es/examples/plasma_web/components/Modal/Modal.stories.tsx +3 -0
  36. package/emotion/es/examples/plasma_web/components/Popup/Popup.stories.tsx +3 -0
  37. package/es/components/Drawer/Drawer.css +3 -2
  38. package/es/components/Drawer/Drawer.styles.js +2 -0
  39. package/es/components/Drawer/Drawer.styles.js.map +1 -1
  40. package/es/components/Modal/Modal.css +3 -2
  41. package/es/components/Notification/NotificationsProvider.css +3 -2
  42. package/es/components/Popup/Popup.js +32 -43
  43. package/es/components/Popup/Popup.js.map +1 -1
  44. package/es/components/Popup/Popup.styles.js +34 -17
  45. package/es/components/Popup/Popup.styles.js.map +1 -1
  46. package/es/components/Popup/Popup.styles_gq4luz.css +4 -0
  47. package/es/components/Popup/PopupContext.css +4 -0
  48. package/es/components/Popup/PopupContext.js +24 -11
  49. package/es/components/Popup/PopupContext.js.map +1 -1
  50. package/es/components/Popup/PopupRoot.js +3 -1
  51. package/es/components/Popup/PopupRoot.js.map +1 -1
  52. package/es/components/Popup/hooks/usePopup.js +3 -2
  53. package/es/components/Popup/hooks/usePopup.js.map +1 -1
  54. package/es/index.css +3 -2
  55. package/package.json +2 -2
  56. package/styled-components/cjs/components/Popup/Popup.js +29 -41
  57. package/styled-components/cjs/components/Popup/Popup.styles.js +17 -11
  58. package/styled-components/cjs/components/Popup/PopupContext.js +22 -10
  59. package/styled-components/cjs/components/Popup/PopupRoot.js +3 -3
  60. package/styled-components/cjs/components/Popup/hooks/usePopup.js +3 -2
  61. package/styled-components/cjs/examples/plasma_b2c/components/Modal/Modal.stories.tsx +3 -0
  62. package/styled-components/cjs/examples/plasma_b2c/components/Popup/Popup.stories.tsx +3 -0
  63. package/styled-components/cjs/examples/plasma_web/components/Modal/Modal.stories.tsx +3 -0
  64. package/styled-components/cjs/examples/plasma_web/components/Popup/Popup.stories.tsx +3 -0
  65. package/styled-components/es/components/Popup/Popup.js +31 -43
  66. package/styled-components/es/components/Popup/Popup.styles.js +16 -10
  67. package/styled-components/es/components/Popup/PopupContext.js +23 -11
  68. package/styled-components/es/components/Popup/PopupRoot.js +3 -3
  69. package/styled-components/es/components/Popup/hooks/usePopup.js +3 -2
  70. package/styled-components/es/examples/plasma_b2c/components/Modal/Modal.stories.tsx +3 -0
  71. package/styled-components/es/examples/plasma_b2c/components/Popup/Popup.stories.tsx +3 -0
  72. package/styled-components/es/examples/plasma_web/components/Modal/Modal.stories.tsx +3 -0
  73. package/styled-components/es/examples/plasma_web/components/Popup/Popup.stories.tsx +3 -0
  74. package/types/components/Popup/Popup.d.ts +1 -1
  75. package/types/components/Popup/Popup.d.ts.map +1 -1
  76. package/types/components/Popup/Popup.styles.d.ts +1 -0
  77. package/types/components/Popup/Popup.styles.d.ts.map +1 -1
  78. package/types/components/Popup/Popup.types.d.ts +1 -0
  79. package/types/components/Popup/Popup.types.d.ts.map +1 -1
  80. package/types/components/Popup/PopupContext.d.ts.map +1 -1
  81. package/types/components/Popup/PopupRoot.d.ts.map +1 -1
  82. package/types/components/Popup/hooks/usePopup.d.ts +1 -0
  83. package/types/components/Popup/hooks/usePopup.d.ts.map +1 -1
  84. package/cjs/components/Popup/Popup.css +0 -3
  85. package/cjs/components/Popup/Popup.styles_141jyqa.css +0 -3
  86. package/es/components/Popup/Popup.css +0 -3
  87. package/es/components/Popup/Popup.styles_141jyqa.css +0 -3
package/cjs/index.css CHANGED
@@ -282,8 +282,9 @@
282
282
  .Subtitle_styles_1plleej_b810c19__d9c54bce{font-family:var(--typo-font-family);font-size:var(--typo-font-size);font-style:var(--typo-font-style);-webkit-letter-spacing:var(--typo-font-letter-spacing);-moz-letter-spacing:var(--typo-font-letter-spacing);-ms-letter-spacing:var(--typo-font-letter-spacing);letter-spacing:var(--typo-font-letter-spacing);line-height:var(--typo-font-line-height);font-weight:var(--typo-font-weight);overflow-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;}
283
283
 
284
284
 
285
- .Popup_styles_141jyqa_p1cjo3us__ed39c2a3{position:relative;max-width:100%;pointer-events:all;}
286
- .Popup_styles_141jyqa_p5u7tqa__ed39c2a3{position:absolute;z-index:var(--p5u7tqa-0);left:var(--p5u7tqa-1);right:var(--p5u7tqa-2);top:var(--p5u7tqa-3);bottom:var(--p5u7tqa-4);-webkit-transform:var(--p5u7tqa-5);-ms-transform:var(--p5u7tqa-5);transform:var(--p5u7tqa-5);}
285
+ .Popup_styles_gq4luz_s1cjo3us__bb610b96{width:0;}
286
+ .Popup_styles_gq4luz_p5u7tqa__bb610b96{position:relative;max-width:100%;pointer-events:all;}
287
+ .Popup_styles_gq4luz_p1f40oul__bb610b96{position:var(--p1f40oul-0);z-index:var(--p1f40oul-1);left:var(--p1f40oul-2);right:var(--p1f40oul-3);top:var(--p1f40oul-4);bottom:var(--p1f40oul-5);-webkit-transform:var(--p1f40oul-6);-ms-transform:var(--p1f40oul-6);transform:var(--p1f40oul-6);}
287
288
 
288
289
  .NotificationsPortal_6417q6_s19gbs9t__4166aeb6 > .NotificationsPortal_6417q6_popupBaseRoot__4166aeb6{overflow:hidden;}
289
290
 
@@ -9,10 +9,10 @@ var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react")
9
9
  var _plasmaCore = /*#__PURE__*/require("@salutejs/plasma-core");
10
10
  var _utils = /*#__PURE__*/require("../../utils");
11
11
  var _Portal = /*#__PURE__*/require("../Portal");
12
- var _PopupContext = /*#__PURE__*/require("./PopupContext");
13
12
  var _PopupRoot = /*#__PURE__*/require("./PopupRoot");
14
13
  var _hooks = /*#__PURE__*/require("./hooks");
15
14
  var _Popup = /*#__PURE__*/require("./Popup.tokens");
15
+ var _Popup2 = /*#__PURE__*/require("./Popup.styles");
16
16
  var _excluded = ["id", "isOpen", "opened", "placement", "offset", "frame", "children", "overlay", "role", "zIndex", "popupInfo", "withAnimation", "className"];
17
17
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
18
18
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
@@ -48,8 +48,8 @@ var handlePosition = exports.handlePosition = function handlePosition(placement,
48
48
  var bottom;
49
49
  var transform;
50
50
  var placements = placement.split('-');
51
- placements.forEach(function (placement) {
52
- switch (placement) {
51
+ placements.forEach(function (placementValue) {
52
+ switch (placementValue) {
53
53
  case 'left':
54
54
  left = x;
55
55
  break;
@@ -84,7 +84,7 @@ var handlePosition = exports.handlePosition = function handlePosition(placement,
84
84
  };
85
85
 
86
86
  /**
87
- * Базовый копмонент Popup.
87
+ * Базовый компонент Popup.
88
88
  */
89
89
  var popupRoot = exports.popupRoot = function popupRoot(Root) {
90
90
  return /*#__PURE__*/(0, _react.forwardRef)(function (_ref, outerRootRef) {
@@ -119,58 +119,46 @@ var popupRoot = exports.popupRoot = function popupRoot(Root) {
119
119
  }),
120
120
  isVisible = _usePopup.isVisible,
121
121
  animationInfo = _usePopup.animationInfo,
122
- setVisible = _usePopup.setVisible;
122
+ setVisible = _usePopup.setVisible,
123
+ rootId = _usePopup.rootId;
123
124
  var portalRef = (0, _react.useRef)(null);
124
125
  var contentRef = (0, _react.useRef)(null);
125
126
  var innerRef = (0, _plasmaCore.useForkRef)(contentRef, outerRootRef);
126
- var _useState = (0, _react.useState)(false),
127
- _useState2 = _slicedToArray(_useState, 2),
128
- forceRender = _useState2[1];
129
- (0, _react.useEffect)(function () {
130
- var portal = document.getElementById(_PopupContext.POPUP_PORTAL_ID);
131
- if (typeof frame !== 'string' && frame && frame.current) {
132
- portal = frame.current;
133
- }
134
- if (!portal) {
135
- portal = document.createElement('div');
136
- portal.setAttribute('id', _PopupContext.POPUP_PORTAL_ID);
137
- /**
138
- * Нужно для того, чтобы во фрейме не происходило скачков контента
139
- * при анимации через transform, если есть элемент с шириной/высотой в 100% (Overlay)
140
- */
141
- portal.style.width = '0';
142
- if (typeof frame === 'string' && frame !== 'document') {
143
- var _document$getElementB;
144
- (_document$getElementB = document.getElementById(frame)) === null || _document$getElementB === void 0 || _document$getElementB.appendChild(portal);
145
- } else {
146
- document.body.appendChild(portal);
147
- }
148
- }
149
- portalRef.current = portal;
150
-
151
- /**
152
- * Изменение стейта нужно для того, чтобы Popup
153
- * отобразился после записи DOM элемента в portalRef.current
154
- */
155
- forceRender(true);
156
- }, []);
157
127
  if (!isVisible && !innerIsOpen) {
158
128
  return null;
159
129
  }
160
130
  var cls = (0, _utils.cx)(className, animationInfo !== null && animationInfo !== void 0 && animationInfo.endAnimation ? _Popup.classes.endAnimation : '', animationInfo !== null && animationInfo !== void 0 && animationInfo.endTransition ? _Popup.classes.endTransition : '');
161
- return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, portalRef.current && /*#__PURE__*/_react["default"].createElement(_Portal.Portal, {
162
- container: portalRef.current
163
- }, /*#__PURE__*/_react["default"].createElement(Root, _extends({
131
+ var rootNode = /*#__PURE__*/_react["default"].createElement(Root, _extends({
164
132
  className: cls
165
133
  }, rest), overlay, /*#__PURE__*/_react["default"].createElement(_PopupRoot.PopupRoot, {
166
134
  id: innerId,
167
135
  ref: innerRef,
168
136
  position: handlePosition(placement, offset),
169
- frame: frame,
170
137
  zIndex: zIndex,
138
+ frame: frame,
171
139
  animationInfo: animationInfo,
172
140
  setVisible: setVisible
173
- }, children))));
141
+ }, children));
142
+ if (typeof frame !== 'string' && frame && frame.current) {
143
+ return /*#__PURE__*/_react["default"].createElement(_Portal.Portal, {
144
+ container: frame.current
145
+ }, rootNode);
146
+ }
147
+ var withFrameId = typeof frame === 'string' && frame !== 'document';
148
+ var containerElement = withFrameId && _utils.canUseDOM && document.getElementById(frame);
149
+ if (containerElement) {
150
+ return /*#__PURE__*/_react["default"].createElement(_Portal.Portal, {
151
+ container: containerElement
152
+ }, /*#__PURE__*/_react["default"].createElement(_Popup2.StyledPortalContainer, {
153
+ ref: portalRef
154
+ }, portalRef.current && /*#__PURE__*/_react["default"].createElement(_Portal.Portal, {
155
+ container: portalRef.current
156
+ }, rootNode)), ' ');
157
+ }
158
+ var globalPortal = _utils.canUseDOM && document.getElementById(rootId);
159
+ return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, globalPortal && /*#__PURE__*/_react["default"].createElement(_Portal.Portal, {
160
+ container: globalPortal
161
+ }, rootNode));
174
162
  });
175
163
  };
176
164
  var popupConfig = exports.popupConfig = {
@@ -3,15 +3,27 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.StyledPortal = exports.PopupView = exports.PopupRootContainer = void 0;
6
+ exports.StyledPortalContainer = exports.StyledPortal = exports.PopupView = exports.PopupRootContainer = void 0;
7
7
  var _base = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("@emotion/styled/base"));
8
8
  var _utils = /*#__PURE__*/require("./utils");
9
9
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
10
10
  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)."; }
11
11
  var StyledPortal = exports.StyledPortal = /*#__PURE__*/(0, _base["default"])("div", {
12
- target: "eaqy7mk2",
12
+ target: "eaqy7mk3",
13
13
  label: "plasma-new-hope__StyledPortal"
14
- })(process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUtzQyIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1BvcHVwL1BvcHVwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHR5cGUgeyBQb3B1cFJvb3RDb250YWluZXJQcm9wcyB9IGZyb20gJy4vUG9wdXAudHlwZXMnO1xuaW1wb3J0IHsgREVGQVVMVF9aX0lOREVYIH0gZnJvbSAnLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWwgPSBzdHlsZWQuZGl2YGA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFZpZXcgPSBzdHlsZWQuZGl2YFxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBtYXgtd2lkdGg6IDEwMCU7XG4gICAgcG9pbnRlci1ldmVudHM6IGFsbDtcbmA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFJvb3RDb250YWluZXIgPSBzdHlsZWQuZGl2PFBvcHVwUm9vdENvbnRhaW5lclByb3BzPmBcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgei1pbmRleDogJHsoeyB6SW5kZXggfSkgPT4gekluZGV4IHx8IERFRkFVTFRfWl9JTkRFWH07XG4gICAgbGVmdDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5sZWZ0IHx8ICcnfTtcbiAgICByaWdodDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5yaWdodCB8fCAnJ307XG4gICAgdG9wOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRvcCB8fCAnJ307XG4gICAgYm90dG9tOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLmJvdHRvbSB8fCAnJ307XG4gICAgdHJhbnNmb3JtOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRyYW5zZm9ybSB8fCAnJ307XG5gO1xuIl19 */");
14
+ })(process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUtzQyIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1BvcHVwL1BvcHVwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHR5cGUgeyBQb3B1cFJvb3RDb250YWluZXJQcm9wcyB9IGZyb20gJy4vUG9wdXAudHlwZXMnO1xuaW1wb3J0IHsgREVGQVVMVF9aX0lOREVYIH0gZnJvbSAnLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWwgPSBzdHlsZWQuZGl2YGA7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWxDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAgIHdpZHRoOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IFBvcHVwVmlldyA9IHN0eWxlZC5kaXZgXG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIG1heC13aWR0aDogMTAwJTtcbiAgICBwb2ludGVyLWV2ZW50czogYWxsO1xuYDtcblxuZXhwb3J0IGNvbnN0IFBvcHVwUm9vdENvbnRhaW5lciA9IHN0eWxlZC5kaXY8UG9wdXBSb290Q29udGFpbmVyUHJvcHM+YFxuICAgIHBvc2l0aW9uOiAkeyh7IGZyYW1lIH0pID0+IChmcmFtZSA9PT0gJ2RvY3VtZW50JyA/ICdmaXhlZCcgOiAnYWJzb2x1dGUnKX07XG4gICAgei1pbmRleDogJHsoeyB6SW5kZXggfSkgPT4gekluZGV4IHx8IERFRkFVTFRfWl9JTkRFWH07XG4gICAgbGVmdDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5sZWZ0IHx8ICcnfTtcbiAgICByaWdodDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5yaWdodCB8fCAnJ307XG4gICAgdG9wOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRvcCB8fCAnJ307XG4gICAgYm90dG9tOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLmJvdHRvbSB8fCAnJ307XG4gICAgdHJhbnNmb3JtOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRyYW5zZm9ybSB8fCAnJ307XG5gO1xuIl19 */");
15
+ var StyledPortalContainer = exports.StyledPortalContainer = /*#__PURE__*/(0, _base["default"])("div", {
16
+ target: "eaqy7mk2",
17
+ label: "plasma-new-hope__StyledPortalContainer"
18
+ })(process.env.NODE_ENV === "production" ? {
19
+ name: "k2uqvh",
20
+ styles: "width:0"
21
+ } : {
22
+ name: "k2uqvh",
23
+ styles: "width:0",
24
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU8rQyIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1BvcHVwL1BvcHVwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHR5cGUgeyBQb3B1cFJvb3RDb250YWluZXJQcm9wcyB9IGZyb20gJy4vUG9wdXAudHlwZXMnO1xuaW1wb3J0IHsgREVGQVVMVF9aX0lOREVYIH0gZnJvbSAnLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWwgPSBzdHlsZWQuZGl2YGA7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWxDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAgIHdpZHRoOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IFBvcHVwVmlldyA9IHN0eWxlZC5kaXZgXG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIG1heC13aWR0aDogMTAwJTtcbiAgICBwb2ludGVyLWV2ZW50czogYWxsO1xuYDtcblxuZXhwb3J0IGNvbnN0IFBvcHVwUm9vdENvbnRhaW5lciA9IHN0eWxlZC5kaXY8UG9wdXBSb290Q29udGFpbmVyUHJvcHM+YFxuICAgIHBvc2l0aW9uOiAkeyh7IGZyYW1lIH0pID0+IChmcmFtZSA9PT0gJ2RvY3VtZW50JyA/ICdmaXhlZCcgOiAnYWJzb2x1dGUnKX07XG4gICAgei1pbmRleDogJHsoeyB6SW5kZXggfSkgPT4gekluZGV4IHx8IERFRkFVTFRfWl9JTkRFWH07XG4gICAgbGVmdDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5sZWZ0IHx8ICcnfTtcbiAgICByaWdodDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5yaWdodCB8fCAnJ307XG4gICAgdG9wOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRvcCB8fCAnJ307XG4gICAgYm90dG9tOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLmJvdHRvbSB8fCAnJ307XG4gICAgdHJhbnNmb3JtOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRyYW5zZm9ybSB8fCAnJ307XG5gO1xuIl19 */",
25
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
26
+ });
15
27
  var PopupView = exports.PopupView = /*#__PURE__*/(0, _base["default"])("div", {
16
28
  target: "eaqy7mk1",
17
29
  label: "plasma-new-hope__PopupView"
@@ -21,28 +33,31 @@ var PopupView = exports.PopupView = /*#__PURE__*/(0, _base["default"])("div", {
21
33
  } : {
22
34
  name: "1m82nn4",
23
35
  styles: "position:relative;max-width:100%;pointer-events:all",
24
- map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU9tQyIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1BvcHVwL1BvcHVwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHR5cGUgeyBQb3B1cFJvb3RDb250YWluZXJQcm9wcyB9IGZyb20gJy4vUG9wdXAudHlwZXMnO1xuaW1wb3J0IHsgREVGQVVMVF9aX0lOREVYIH0gZnJvbSAnLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWwgPSBzdHlsZWQuZGl2YGA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFZpZXcgPSBzdHlsZWQuZGl2YFxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBtYXgtd2lkdGg6IDEwMCU7XG4gICAgcG9pbnRlci1ldmVudHM6IGFsbDtcbmA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFJvb3RDb250YWluZXIgPSBzdHlsZWQuZGl2PFBvcHVwUm9vdENvbnRhaW5lclByb3BzPmBcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgei1pbmRleDogJHsoeyB6SW5kZXggfSkgPT4gekluZGV4IHx8IERFRkFVTFRfWl9JTkRFWH07XG4gICAgbGVmdDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5sZWZ0IHx8ICcnfTtcbiAgICByaWdodDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5yaWdodCB8fCAnJ307XG4gICAgdG9wOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRvcCB8fCAnJ307XG4gICAgYm90dG9tOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLmJvdHRvbSB8fCAnJ307XG4gICAgdHJhbnNmb3JtOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRyYW5zZm9ybSB8fCAnJ307XG5gO1xuIl19 */",
36
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVdtQyIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1BvcHVwL1BvcHVwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHR5cGUgeyBQb3B1cFJvb3RDb250YWluZXJQcm9wcyB9IGZyb20gJy4vUG9wdXAudHlwZXMnO1xuaW1wb3J0IHsgREVGQVVMVF9aX0lOREVYIH0gZnJvbSAnLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWwgPSBzdHlsZWQuZGl2YGA7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWxDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAgIHdpZHRoOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IFBvcHVwVmlldyA9IHN0eWxlZC5kaXZgXG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIG1heC13aWR0aDogMTAwJTtcbiAgICBwb2ludGVyLWV2ZW50czogYWxsO1xuYDtcblxuZXhwb3J0IGNvbnN0IFBvcHVwUm9vdENvbnRhaW5lciA9IHN0eWxlZC5kaXY8UG9wdXBSb290Q29udGFpbmVyUHJvcHM+YFxuICAgIHBvc2l0aW9uOiAkeyh7IGZyYW1lIH0pID0+IChmcmFtZSA9PT0gJ2RvY3VtZW50JyA/ICdmaXhlZCcgOiAnYWJzb2x1dGUnKX07XG4gICAgei1pbmRleDogJHsoeyB6SW5kZXggfSkgPT4gekluZGV4IHx8IERFRkFVTFRfWl9JTkRFWH07XG4gICAgbGVmdDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5sZWZ0IHx8ICcnfTtcbiAgICByaWdodDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5yaWdodCB8fCAnJ307XG4gICAgdG9wOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRvcCB8fCAnJ307XG4gICAgYm90dG9tOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLmJvdHRvbSB8fCAnJ307XG4gICAgdHJhbnNmb3JtOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRyYW5zZm9ybSB8fCAnJ307XG5gO1xuIl19 */",
25
37
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
26
38
  });
27
39
  var PopupRootContainer = exports.PopupRootContainer = /*#__PURE__*/(0, _base["default"])("div", {
28
40
  target: "eaqy7mk0",
29
41
  label: "plasma-new-hope__PopupRootContainer"
30
- })("position:absolute;z-index:", function (_ref) {
31
- var zIndex = _ref.zIndex;
42
+ })("position:", function (_ref) {
43
+ var frame = _ref.frame;
44
+ return frame === 'document' ? 'fixed' : 'absolute';
45
+ }, ";z-index:", function (_ref2) {
46
+ var zIndex = _ref2.zIndex;
32
47
  return zIndex || _utils.DEFAULT_Z_INDEX;
33
- }, ";left:", function (_ref2) {
34
- var position = _ref2.position;
35
- return position.left || '';
36
- }, ";right:", function (_ref3) {
48
+ }, ";left:", function (_ref3) {
37
49
  var position = _ref3.position;
38
- return position.right || '';
39
- }, ";top:", function (_ref4) {
50
+ return position.left || '';
51
+ }, ";right:", function (_ref4) {
40
52
  var position = _ref4.position;
41
- return position.top || '';
42
- }, ";bottom:", function (_ref5) {
53
+ return position.right || '';
54
+ }, ";top:", function (_ref5) {
43
55
  var position = _ref5.position;
44
- return position.bottom || '';
45
- }, ";transform:", function (_ref6) {
56
+ return position.top || '';
57
+ }, ";bottom:", function (_ref6) {
46
58
  var position = _ref6.position;
59
+ return position.bottom || '';
60
+ }, ";transform:", function (_ref7) {
61
+ var position = _ref7.position;
47
62
  return position.transform || '';
48
- }, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWFxRSIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1BvcHVwL1BvcHVwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHR5cGUgeyBQb3B1cFJvb3RDb250YWluZXJQcm9wcyB9IGZyb20gJy4vUG9wdXAudHlwZXMnO1xuaW1wb3J0IHsgREVGQVVMVF9aX0lOREVYIH0gZnJvbSAnLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWwgPSBzdHlsZWQuZGl2YGA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFZpZXcgPSBzdHlsZWQuZGl2YFxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBtYXgtd2lkdGg6IDEwMCU7XG4gICAgcG9pbnRlci1ldmVudHM6IGFsbDtcbmA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFJvb3RDb250YWluZXIgPSBzdHlsZWQuZGl2PFBvcHVwUm9vdENvbnRhaW5lclByb3BzPmBcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgei1pbmRleDogJHsoeyB6SW5kZXggfSkgPT4gekluZGV4IHx8IERFRkFVTFRfWl9JTkRFWH07XG4gICAgbGVmdDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5sZWZ0IHx8ICcnfTtcbiAgICByaWdodDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5yaWdodCB8fCAnJ307XG4gICAgdG9wOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRvcCB8fCAnJ307XG4gICAgYm90dG9tOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLmJvdHRvbSB8fCAnJ307XG4gICAgdHJhbnNmb3JtOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRyYW5zZm9ybSB8fCAnJ307XG5gO1xuIl19 */"));
63
+ }, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWlCcUUiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjLWVtb3Rpb24vY29tcG9uZW50cy9Qb3B1cC9Qb3B1cC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmltcG9ydCB0eXBlIHsgUG9wdXBSb290Q29udGFpbmVyUHJvcHMgfSBmcm9tICcuL1BvcHVwLnR5cGVzJztcbmltcG9ydCB7IERFRkFVTFRfWl9JTkRFWCB9IGZyb20gJy4vdXRpbHMnO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUG9ydGFsID0gc3R5bGVkLmRpdmBgO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUG9ydGFsQ29udGFpbmVyID0gc3R5bGVkLmRpdmBcbiAgICB3aWR0aDogMDtcbmA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFZpZXcgPSBzdHlsZWQuZGl2YFxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBtYXgtd2lkdGg6IDEwMCU7XG4gICAgcG9pbnRlci1ldmVudHM6IGFsbDtcbmA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFJvb3RDb250YWluZXIgPSBzdHlsZWQuZGl2PFBvcHVwUm9vdENvbnRhaW5lclByb3BzPmBcbiAgICBwb3NpdGlvbjogJHsoeyBmcmFtZSB9KSA9PiAoZnJhbWUgPT09ICdkb2N1bWVudCcgPyAnZml4ZWQnIDogJ2Fic29sdXRlJyl9O1xuICAgIHotaW5kZXg6ICR7KHsgekluZGV4IH0pID0+IHpJbmRleCB8fCBERUZBVUxUX1pfSU5ERVh9O1xuICAgIGxlZnQ6ICR7KHsgcG9zaXRpb24gfSkgPT4gcG9zaXRpb24ubGVmdCB8fCAnJ307XG4gICAgcmlnaHQ6ICR7KHsgcG9zaXRpb24gfSkgPT4gcG9zaXRpb24ucmlnaHQgfHwgJyd9O1xuICAgIHRvcDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi50b3AgfHwgJyd9O1xuICAgIGJvdHRvbTogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5ib3R0b20gfHwgJyd9O1xuICAgIHRyYW5zZm9ybTogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi50cmFuc2Zvcm0gfHwgJyd9O1xuYDtcbiJdfQ== */"));
@@ -7,6 +7,9 @@ Object.defineProperty(exports, "__esModule", {
7
7
  exports.usePopupContext = exports.PopupProvider = exports.POPUP_PORTAL_ID = void 0;
8
8
  var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
9
9
  var _ModalContext = /*#__PURE__*/require("../Modal/ModalContext");
10
+ var _utils = /*#__PURE__*/require("../../utils");
11
+ var _Portal = /*#__PURE__*/require("../Portal");
12
+ var _Popup = /*#__PURE__*/require("./Popup.styles");
10
13
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
11
14
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
12
15
  function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
@@ -23,9 +26,12 @@ var POPUP_PORTAL_ID = exports.POPUP_PORTAL_ID = 'plasma-popup-root';
23
26
  var items = [];
24
27
  var PopupContext = /*#__PURE__*/(0, _react.createContext)({
25
28
  items: items,
29
+ rootId: POPUP_PORTAL_ID,
30
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
26
31
  register: function register(_info) {
27
32
  throw new Error('Function not implemented. Add PopupProvider');
28
33
  },
34
+ // eslint-disable-next-line @typescript-eslint/no-unused-vars
29
35
  unregister: function unregister(_id) {
30
36
  throw new Error('Function not implemented. Add PopupProvider');
31
37
  }
@@ -35,12 +41,18 @@ var usePopupContext = exports.usePopupContext = function usePopupContext() {
35
41
  };
36
42
  var PopupProvider = exports.PopupProvider = function PopupProvider(_ref) {
37
43
  var children = _ref.children;
38
- var prevBodyOverflowY = (0, _react.useRef)(typeof document !== 'undefined' ? document.body.style.overflowY : '');
44
+ var prevBodyOverflowY = (0, _react.useRef)(_utils.canUseDOM ? document.body.style.overflowY : '');
45
+ // eslint-disable-next-line no-shadow
39
46
  var _useState = (0, _react.useState)([]),
40
47
  _useState2 = _slicedToArray(_useState, 2),
41
48
  items = _useState2[0],
42
49
  setItems = _useState2[1];
50
+ var uuid = (0, _utils.safeUseId)();
51
+ var rootId = "".concat(POPUP_PORTAL_ID, "-").concat(uuid);
43
52
  var register = function register(info) {
53
+ if (!_utils.canUseDOM) {
54
+ return;
55
+ }
44
56
  setItems(function (prevItems) {
45
57
  var _info$info;
46
58
  if ((_info$info = info.info) !== null && _info$info !== void 0 && _info$info.isModal && !(0, _ModalContext.hasModals)(prevItems)) {
@@ -51,6 +63,9 @@ var PopupProvider = exports.PopupProvider = function PopupProvider(_ref) {
51
63
  });
52
64
  };
53
65
  var unregister = function unregister(id) {
66
+ if (!_utils.canUseDOM) {
67
+ return;
68
+ }
54
69
  setItems(function (prevItems) {
55
70
  var index = prevItems.findIndex(function (item) {
56
71
  return id === item.id;
@@ -70,18 +85,15 @@ var PopupProvider = exports.PopupProvider = function PopupProvider(_ref) {
70
85
  };
71
86
  var context = {
72
87
  items: items,
88
+ rootId: rootId,
73
89
  register: register,
74
90
  unregister: unregister
75
91
  };
76
- (0, _react.useEffect)(function () {
77
- return function () {
78
- var portal = document.createElement('div');
79
- if (portal && document.body.contains(portal)) {
80
- document.body.removeChild(portal);
81
- }
82
- };
83
- }, []);
84
92
  return /*#__PURE__*/_react["default"].createElement(PopupContext.Provider, {
85
93
  value: context
86
- }, children);
94
+ }, children, /*#__PURE__*/_react["default"].createElement(_Portal.Portal, {
95
+ container: document.body
96
+ }, /*#__PURE__*/_react["default"].createElement(_Popup.StyledPortal, {
97
+ id: rootId
98
+ })));
87
99
  };
@@ -10,7 +10,7 @@ var _plasmaCore = /*#__PURE__*/require("@salutejs/plasma-core");
10
10
  var _PopupContext = /*#__PURE__*/require("./PopupContext");
11
11
  var _Popup = /*#__PURE__*/require("./Popup.styles");
12
12
  var _Popup2 = /*#__PURE__*/require("./Popup.tokens");
13
- var _excluded = ["id", "placement", "offset", "frame", "setVisible", "children", "role", "zIndex", "animationInfo", "className"];
13
+ var _excluded = ["id", "placement", "offset", "setVisible", "children", "role", "frame", "zIndex", "animationInfo"];
14
14
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
15
15
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
16
16
  function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
@@ -24,13 +24,12 @@ var PopupRoot = exports.PopupRoot = /*#__PURE__*/(0, _react.forwardRef)(function
24
24
  var id = _ref.id,
25
25
  placement = _ref.placement,
26
26
  offset = _ref.offset,
27
- frame = _ref.frame,
28
27
  setVisible = _ref.setVisible,
29
28
  children = _ref.children,
30
29
  role = _ref.role,
30
+ frame = _ref.frame,
31
31
  zIndex = _ref.zIndex,
32
32
  animationInfo = _ref.animationInfo,
33
- className = _ref.className,
34
33
  rest = _objectWithoutProperties(_ref, _excluded);
35
34
  var contentRef = (0, _react.useRef)(null);
36
35
  var innerRef = (0, _plasmaCore.useForkRef)(contentRef, ref);
@@ -52,6 +51,7 @@ var PopupRoot = exports.PopupRoot = /*#__PURE__*/(0, _react.forwardRef)(function
52
51
  placement: placement,
53
52
  offset: offset,
54
53
  zIndex: zIndex,
54
+ frame: frame,
55
55
  onAnimationEnd: handleAnimationEnd,
56
56
  onTransitionEnd: handleAnimationEnd
57
57
  }, rest), /*#__PURE__*/_react["default"].createElement(_Popup.PopupView, {
@@ -18,7 +18,7 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
18
18
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
19
19
  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; } }
20
20
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
21
- // Хук для поключения анимации
21
+ // Хук для подключения анимации
22
22
  var usePopupAnimation = function usePopupAnimation() {
23
23
  var _useState = (0, _react.useState)(false),
24
24
  _useState2 = _slicedToArray(_useState, 2),
@@ -90,6 +90,7 @@ var usePopup = exports.usePopup = function usePopup(_ref) {
90
90
  isVisible: isVisible,
91
91
  setVisible: setVisible,
92
92
  animationInfo: animationInfo,
93
- withAnimation: withAnimation
93
+ withAnimation: withAnimation,
94
+ rootId: popupController.rootId
94
95
  };
95
96
  };
@@ -14,6 +14,9 @@ import { Modal, modalClasses } from './Modal';
14
14
  export default {
15
15
  title: 'plasma_b2c/Modal',
16
16
  decorators: [WithTheme],
17
+ parameters: {
18
+ docs: { story: { inline: false, iframeHeight: '30rem' } },
19
+ },
17
20
  argTypes: {
18
21
  placement: {
19
22
  options: [
@@ -12,6 +12,9 @@ import { Popup, popupClasses, PopupProvider } from './Popup';
12
12
  const meta: Meta<typeof Popup> = {
13
13
  title: 'plasma_b2c/Popup',
14
14
  decorators: [WithTheme],
15
+ parameters: {
16
+ docs: { story: { inline: false, iframeHeight: '30rem' } },
17
+ },
15
18
  argTypes: {
16
19
  placement: {
17
20
  options: [
@@ -14,6 +14,9 @@ import { Modal, modalClasses } from './Modal';
14
14
  export default {
15
15
  title: 'plasma_web/Modal',
16
16
  decorators: [WithTheme],
17
+ parameters: {
18
+ docs: { story: { inline: false, iframeHeight: '30rem' } },
19
+ },
17
20
  argTypes: {
18
21
  placement: {
19
22
  options: [
@@ -12,6 +12,9 @@ import { Popup, popupClasses, PopupProvider } from './Popup';
12
12
  const meta: Meta<typeof Popup> = {
13
13
  title: 'plasma_web/Popup',
14
14
  decorators: [WithTheme],
15
+ parameters: {
16
+ docs: { story: { inline: false, iframeHeight: '30rem' } },
17
+ },
15
18
  argTypes: {
16
19
  placement: {
17
20
  options: [
@@ -8,14 +8,14 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
8
8
  function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
9
9
  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; } }
10
10
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
11
- import React, { forwardRef, useEffect, useRef, useState } from 'react';
11
+ import React, { forwardRef, useRef } from 'react';
12
12
  import { useForkRef, safeUseId } from '@salutejs/plasma-core';
13
- import { cx } from '../../utils';
13
+ import { canUseDOM, cx } from '../../utils';
14
14
  import { Portal } from '../Portal';
15
- import { POPUP_PORTAL_ID } from './PopupContext';
16
15
  import { PopupRoot } from './PopupRoot';
17
16
  import { usePopup } from './hooks';
18
17
  import { classes } from './Popup.tokens';
18
+ import { StyledPortalContainer } from './Popup.styles';
19
19
  export var handlePosition = function handlePosition(placement, offset) {
20
20
  var x = '0rem';
21
21
  var y = '0rem';
@@ -39,8 +39,8 @@ export var handlePosition = function handlePosition(placement, offset) {
39
39
  var bottom;
40
40
  var transform;
41
41
  var placements = placement.split('-');
42
- placements.forEach(function (placement) {
43
- switch (placement) {
42
+ placements.forEach(function (placementValue) {
43
+ switch (placementValue) {
44
44
  case 'left':
45
45
  left = x;
46
46
  break;
@@ -75,7 +75,7 @@ export var handlePosition = function handlePosition(placement, offset) {
75
75
  };
76
76
 
77
77
  /**
78
- * Базовый копмонент Popup.
78
+ * Базовый компонент Popup.
79
79
  */
80
80
  export var popupRoot = function popupRoot(Root) {
81
81
  return /*#__PURE__*/forwardRef(function (_ref, outerRootRef) {
@@ -110,58 +110,46 @@ export var popupRoot = function popupRoot(Root) {
110
110
  }),
111
111
  isVisible = _usePopup.isVisible,
112
112
  animationInfo = _usePopup.animationInfo,
113
- setVisible = _usePopup.setVisible;
113
+ setVisible = _usePopup.setVisible,
114
+ rootId = _usePopup.rootId;
114
115
  var portalRef = useRef(null);
115
116
  var contentRef = useRef(null);
116
117
  var innerRef = useForkRef(contentRef, outerRootRef);
117
- var _useState = useState(false),
118
- _useState2 = _slicedToArray(_useState, 2),
119
- forceRender = _useState2[1];
120
- useEffect(function () {
121
- var portal = document.getElementById(POPUP_PORTAL_ID);
122
- if (typeof frame !== 'string' && frame && frame.current) {
123
- portal = frame.current;
124
- }
125
- if (!portal) {
126
- portal = document.createElement('div');
127
- portal.setAttribute('id', POPUP_PORTAL_ID);
128
- /**
129
- * Нужно для того, чтобы во фрейме не происходило скачков контента
130
- * при анимации через transform, если есть элемент с шириной/высотой в 100% (Overlay)
131
- */
132
- portal.style.width = '0';
133
- if (typeof frame === 'string' && frame !== 'document') {
134
- var _document$getElementB;
135
- (_document$getElementB = document.getElementById(frame)) === null || _document$getElementB === void 0 || _document$getElementB.appendChild(portal);
136
- } else {
137
- document.body.appendChild(portal);
138
- }
139
- }
140
- portalRef.current = portal;
141
-
142
- /**
143
- * Изменение стейта нужно для того, чтобы Popup
144
- * отобразился после записи DOM элемента в portalRef.current
145
- */
146
- forceRender(true);
147
- }, []);
148
118
  if (!isVisible && !innerIsOpen) {
149
119
  return null;
150
120
  }
151
121
  var cls = cx(className, animationInfo !== null && animationInfo !== void 0 && animationInfo.endAnimation ? classes.endAnimation : '', animationInfo !== null && animationInfo !== void 0 && animationInfo.endTransition ? classes.endTransition : '');
152
- return /*#__PURE__*/React.createElement(React.Fragment, null, portalRef.current && /*#__PURE__*/React.createElement(Portal, {
153
- container: portalRef.current
154
- }, /*#__PURE__*/React.createElement(Root, _extends({
122
+ var rootNode = /*#__PURE__*/React.createElement(Root, _extends({
155
123
  className: cls
156
124
  }, rest), overlay, /*#__PURE__*/React.createElement(PopupRoot, {
157
125
  id: innerId,
158
126
  ref: innerRef,
159
127
  position: handlePosition(placement, offset),
160
- frame: frame,
161
128
  zIndex: zIndex,
129
+ frame: frame,
162
130
  animationInfo: animationInfo,
163
131
  setVisible: setVisible
164
- }, children))));
132
+ }, children));
133
+ if (typeof frame !== 'string' && frame && frame.current) {
134
+ return /*#__PURE__*/React.createElement(Portal, {
135
+ container: frame.current
136
+ }, rootNode);
137
+ }
138
+ var withFrameId = typeof frame === 'string' && frame !== 'document';
139
+ var containerElement = withFrameId && canUseDOM && document.getElementById(frame);
140
+ if (containerElement) {
141
+ return /*#__PURE__*/React.createElement(Portal, {
142
+ container: containerElement
143
+ }, /*#__PURE__*/React.createElement(StyledPortalContainer, {
144
+ ref: portalRef
145
+ }, portalRef.current && /*#__PURE__*/React.createElement(Portal, {
146
+ container: portalRef.current
147
+ }, rootNode)), ' ');
148
+ }
149
+ var globalPortal = canUseDOM && document.getElementById(rootId);
150
+ return /*#__PURE__*/React.createElement(React.Fragment, null, globalPortal && /*#__PURE__*/React.createElement(Portal, {
151
+ container: globalPortal
152
+ }, rootNode));
165
153
  });
166
154
  };
167
155
  export var popupConfig = {
@@ -2,9 +2,21 @@ import _styled from "@emotion/styled/base";
2
2
  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)."; }
3
3
  import { DEFAULT_Z_INDEX } from './utils';
4
4
  export var StyledPortal = /*#__PURE__*/_styled("div", {
5
- target: "eaqy7mk2",
5
+ target: "eaqy7mk3",
6
6
  label: "plasma-new-hope__StyledPortal"
7
- })(process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUtzQyIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1BvcHVwL1BvcHVwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHR5cGUgeyBQb3B1cFJvb3RDb250YWluZXJQcm9wcyB9IGZyb20gJy4vUG9wdXAudHlwZXMnO1xuaW1wb3J0IHsgREVGQVVMVF9aX0lOREVYIH0gZnJvbSAnLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWwgPSBzdHlsZWQuZGl2YGA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFZpZXcgPSBzdHlsZWQuZGl2YFxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBtYXgtd2lkdGg6IDEwMCU7XG4gICAgcG9pbnRlci1ldmVudHM6IGFsbDtcbmA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFJvb3RDb250YWluZXIgPSBzdHlsZWQuZGl2PFBvcHVwUm9vdENvbnRhaW5lclByb3BzPmBcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgei1pbmRleDogJHsoeyB6SW5kZXggfSkgPT4gekluZGV4IHx8IERFRkFVTFRfWl9JTkRFWH07XG4gICAgbGVmdDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5sZWZ0IHx8ICcnfTtcbiAgICByaWdodDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5yaWdodCB8fCAnJ307XG4gICAgdG9wOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRvcCB8fCAnJ307XG4gICAgYm90dG9tOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLmJvdHRvbSB8fCAnJ307XG4gICAgdHJhbnNmb3JtOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRyYW5zZm9ybSB8fCAnJ307XG5gO1xuIl19 */");
7
+ })(process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUtzQyIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1BvcHVwL1BvcHVwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHR5cGUgeyBQb3B1cFJvb3RDb250YWluZXJQcm9wcyB9IGZyb20gJy4vUG9wdXAudHlwZXMnO1xuaW1wb3J0IHsgREVGQVVMVF9aX0lOREVYIH0gZnJvbSAnLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWwgPSBzdHlsZWQuZGl2YGA7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWxDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAgIHdpZHRoOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IFBvcHVwVmlldyA9IHN0eWxlZC5kaXZgXG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIG1heC13aWR0aDogMTAwJTtcbiAgICBwb2ludGVyLWV2ZW50czogYWxsO1xuYDtcblxuZXhwb3J0IGNvbnN0IFBvcHVwUm9vdENvbnRhaW5lciA9IHN0eWxlZC5kaXY8UG9wdXBSb290Q29udGFpbmVyUHJvcHM+YFxuICAgIHBvc2l0aW9uOiAkeyh7IGZyYW1lIH0pID0+IChmcmFtZSA9PT0gJ2RvY3VtZW50JyA/ICdmaXhlZCcgOiAnYWJzb2x1dGUnKX07XG4gICAgei1pbmRleDogJHsoeyB6SW5kZXggfSkgPT4gekluZGV4IHx8IERFRkFVTFRfWl9JTkRFWH07XG4gICAgbGVmdDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5sZWZ0IHx8ICcnfTtcbiAgICByaWdodDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5yaWdodCB8fCAnJ307XG4gICAgdG9wOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRvcCB8fCAnJ307XG4gICAgYm90dG9tOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLmJvdHRvbSB8fCAnJ307XG4gICAgdHJhbnNmb3JtOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRyYW5zZm9ybSB8fCAnJ307XG5gO1xuIl19 */");
8
+ export var StyledPortalContainer = /*#__PURE__*/_styled("div", {
9
+ target: "eaqy7mk2",
10
+ label: "plasma-new-hope__StyledPortalContainer"
11
+ })(process.env.NODE_ENV === "production" ? {
12
+ name: "k2uqvh",
13
+ styles: "width:0"
14
+ } : {
15
+ name: "k2uqvh",
16
+ styles: "width:0",
17
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU8rQyIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1BvcHVwL1BvcHVwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHR5cGUgeyBQb3B1cFJvb3RDb250YWluZXJQcm9wcyB9IGZyb20gJy4vUG9wdXAudHlwZXMnO1xuaW1wb3J0IHsgREVGQVVMVF9aX0lOREVYIH0gZnJvbSAnLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWwgPSBzdHlsZWQuZGl2YGA7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWxDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAgIHdpZHRoOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IFBvcHVwVmlldyA9IHN0eWxlZC5kaXZgXG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIG1heC13aWR0aDogMTAwJTtcbiAgICBwb2ludGVyLWV2ZW50czogYWxsO1xuYDtcblxuZXhwb3J0IGNvbnN0IFBvcHVwUm9vdENvbnRhaW5lciA9IHN0eWxlZC5kaXY8UG9wdXBSb290Q29udGFpbmVyUHJvcHM+YFxuICAgIHBvc2l0aW9uOiAkeyh7IGZyYW1lIH0pID0+IChmcmFtZSA9PT0gJ2RvY3VtZW50JyA/ICdmaXhlZCcgOiAnYWJzb2x1dGUnKX07XG4gICAgei1pbmRleDogJHsoeyB6SW5kZXggfSkgPT4gekluZGV4IHx8IERFRkFVTFRfWl9JTkRFWH07XG4gICAgbGVmdDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5sZWZ0IHx8ICcnfTtcbiAgICByaWdodDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5yaWdodCB8fCAnJ307XG4gICAgdG9wOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRvcCB8fCAnJ307XG4gICAgYm90dG9tOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLmJvdHRvbSB8fCAnJ307XG4gICAgdHJhbnNmb3JtOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRyYW5zZm9ybSB8fCAnJ307XG5gO1xuIl19 */",
18
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
19
+ });
8
20
  export var PopupView = /*#__PURE__*/_styled("div", {
9
21
  target: "eaqy7mk1",
10
22
  label: "plasma-new-hope__PopupView"
@@ -14,28 +26,31 @@ export var PopupView = /*#__PURE__*/_styled("div", {
14
26
  } : {
15
27
  name: "1m82nn4",
16
28
  styles: "position:relative;max-width:100%;pointer-events:all",
17
- map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQU9tQyIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1BvcHVwL1BvcHVwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHR5cGUgeyBQb3B1cFJvb3RDb250YWluZXJQcm9wcyB9IGZyb20gJy4vUG9wdXAudHlwZXMnO1xuaW1wb3J0IHsgREVGQVVMVF9aX0lOREVYIH0gZnJvbSAnLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWwgPSBzdHlsZWQuZGl2YGA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFZpZXcgPSBzdHlsZWQuZGl2YFxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBtYXgtd2lkdGg6IDEwMCU7XG4gICAgcG9pbnRlci1ldmVudHM6IGFsbDtcbmA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFJvb3RDb250YWluZXIgPSBzdHlsZWQuZGl2PFBvcHVwUm9vdENvbnRhaW5lclByb3BzPmBcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgei1pbmRleDogJHsoeyB6SW5kZXggfSkgPT4gekluZGV4IHx8IERFRkFVTFRfWl9JTkRFWH07XG4gICAgbGVmdDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5sZWZ0IHx8ICcnfTtcbiAgICByaWdodDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5yaWdodCB8fCAnJ307XG4gICAgdG9wOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRvcCB8fCAnJ307XG4gICAgYm90dG9tOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLmJvdHRvbSB8fCAnJ307XG4gICAgdHJhbnNmb3JtOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRyYW5zZm9ybSB8fCAnJ307XG5gO1xuIl19 */",
29
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVdtQyIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1BvcHVwL1BvcHVwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHR5cGUgeyBQb3B1cFJvb3RDb250YWluZXJQcm9wcyB9IGZyb20gJy4vUG9wdXAudHlwZXMnO1xuaW1wb3J0IHsgREVGQVVMVF9aX0lOREVYIH0gZnJvbSAnLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWwgPSBzdHlsZWQuZGl2YGA7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWxDb250YWluZXIgPSBzdHlsZWQuZGl2YFxuICAgIHdpZHRoOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IFBvcHVwVmlldyA9IHN0eWxlZC5kaXZgXG4gICAgcG9zaXRpb246IHJlbGF0aXZlO1xuICAgIG1heC13aWR0aDogMTAwJTtcbiAgICBwb2ludGVyLWV2ZW50czogYWxsO1xuYDtcblxuZXhwb3J0IGNvbnN0IFBvcHVwUm9vdENvbnRhaW5lciA9IHN0eWxlZC5kaXY8UG9wdXBSb290Q29udGFpbmVyUHJvcHM+YFxuICAgIHBvc2l0aW9uOiAkeyh7IGZyYW1lIH0pID0+IChmcmFtZSA9PT0gJ2RvY3VtZW50JyA/ICdmaXhlZCcgOiAnYWJzb2x1dGUnKX07XG4gICAgei1pbmRleDogJHsoeyB6SW5kZXggfSkgPT4gekluZGV4IHx8IERFRkFVTFRfWl9JTkRFWH07XG4gICAgbGVmdDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5sZWZ0IHx8ICcnfTtcbiAgICByaWdodDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5yaWdodCB8fCAnJ307XG4gICAgdG9wOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRvcCB8fCAnJ307XG4gICAgYm90dG9tOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLmJvdHRvbSB8fCAnJ307XG4gICAgdHJhbnNmb3JtOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRyYW5zZm9ybSB8fCAnJ307XG5gO1xuIl19 */",
18
30
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
19
31
  });
20
32
  export var PopupRootContainer = /*#__PURE__*/_styled("div", {
21
33
  target: "eaqy7mk0",
22
34
  label: "plasma-new-hope__PopupRootContainer"
23
- })("position:absolute;z-index:", function (_ref) {
24
- var zIndex = _ref.zIndex;
35
+ })("position:", function (_ref) {
36
+ var frame = _ref.frame;
37
+ return frame === 'document' ? 'fixed' : 'absolute';
38
+ }, ";z-index:", function (_ref2) {
39
+ var zIndex = _ref2.zIndex;
25
40
  return zIndex || DEFAULT_Z_INDEX;
26
- }, ";left:", function (_ref2) {
27
- var position = _ref2.position;
28
- return position.left || '';
29
- }, ";right:", function (_ref3) {
41
+ }, ";left:", function (_ref3) {
30
42
  var position = _ref3.position;
31
- return position.right || '';
32
- }, ";top:", function (_ref4) {
43
+ return position.left || '';
44
+ }, ";right:", function (_ref4) {
33
45
  var position = _ref4.position;
34
- return position.top || '';
35
- }, ";bottom:", function (_ref5) {
46
+ return position.right || '';
47
+ }, ";top:", function (_ref5) {
36
48
  var position = _ref5.position;
37
- return position.bottom || '';
38
- }, ";transform:", function (_ref6) {
49
+ return position.top || '';
50
+ }, ";bottom:", function (_ref6) {
39
51
  var position = _ref6.position;
52
+ return position.bottom || '';
53
+ }, ";transform:", function (_ref7) {
54
+ var position = _ref7.position;
40
55
  return position.transform || '';
41
- }, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWFxRSIsImZpbGUiOiIuLi8uLi8uLi8uLi9zcmMtZW1vdGlvbi9jb21wb25lbnRzL1BvcHVwL1BvcHVwLnN0eWxlcy50cyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuaW1wb3J0IHR5cGUgeyBQb3B1cFJvb3RDb250YWluZXJQcm9wcyB9IGZyb20gJy4vUG9wdXAudHlwZXMnO1xuaW1wb3J0IHsgREVGQVVMVF9aX0lOREVYIH0gZnJvbSAnLi91dGlscyc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRQb3J0YWwgPSBzdHlsZWQuZGl2YGA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFZpZXcgPSBzdHlsZWQuZGl2YFxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBtYXgtd2lkdGg6IDEwMCU7XG4gICAgcG9pbnRlci1ldmVudHM6IGFsbDtcbmA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFJvb3RDb250YWluZXIgPSBzdHlsZWQuZGl2PFBvcHVwUm9vdENvbnRhaW5lclByb3BzPmBcbiAgICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gICAgei1pbmRleDogJHsoeyB6SW5kZXggfSkgPT4gekluZGV4IHx8IERFRkFVTFRfWl9JTkRFWH07XG4gICAgbGVmdDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5sZWZ0IHx8ICcnfTtcbiAgICByaWdodDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5yaWdodCB8fCAnJ307XG4gICAgdG9wOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRvcCB8fCAnJ307XG4gICAgYm90dG9tOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLmJvdHRvbSB8fCAnJ307XG4gICAgdHJhbnNmb3JtOiAkeyh7IHBvc2l0aW9uIH0pID0+IHBvc2l0aW9uLnRyYW5zZm9ybSB8fCAnJ307XG5gO1xuIl19 */"));
56
+ }, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy1lbW90aW9uL2NvbXBvbmVudHMvUG9wdXAvUG9wdXAuc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWlCcUUiLCJmaWxlIjoiLi4vLi4vLi4vLi4vc3JjLWVtb3Rpb24vY29tcG9uZW50cy9Qb3B1cC9Qb3B1cC5zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmltcG9ydCB0eXBlIHsgUG9wdXBSb290Q29udGFpbmVyUHJvcHMgfSBmcm9tICcuL1BvcHVwLnR5cGVzJztcbmltcG9ydCB7IERFRkFVTFRfWl9JTkRFWCB9IGZyb20gJy4vdXRpbHMnO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUG9ydGFsID0gc3R5bGVkLmRpdmBgO1xuXG5leHBvcnQgY29uc3QgU3R5bGVkUG9ydGFsQ29udGFpbmVyID0gc3R5bGVkLmRpdmBcbiAgICB3aWR0aDogMDtcbmA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFZpZXcgPSBzdHlsZWQuZGl2YFxuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBtYXgtd2lkdGg6IDEwMCU7XG4gICAgcG9pbnRlci1ldmVudHM6IGFsbDtcbmA7XG5cbmV4cG9ydCBjb25zdCBQb3B1cFJvb3RDb250YWluZXIgPSBzdHlsZWQuZGl2PFBvcHVwUm9vdENvbnRhaW5lclByb3BzPmBcbiAgICBwb3NpdGlvbjogJHsoeyBmcmFtZSB9KSA9PiAoZnJhbWUgPT09ICdkb2N1bWVudCcgPyAnZml4ZWQnIDogJ2Fic29sdXRlJyl9O1xuICAgIHotaW5kZXg6ICR7KHsgekluZGV4IH0pID0+IHpJbmRleCB8fCBERUZBVUxUX1pfSU5ERVh9O1xuICAgIGxlZnQ6ICR7KHsgcG9zaXRpb24gfSkgPT4gcG9zaXRpb24ubGVmdCB8fCAnJ307XG4gICAgcmlnaHQ6ICR7KHsgcG9zaXRpb24gfSkgPT4gcG9zaXRpb24ucmlnaHQgfHwgJyd9O1xuICAgIHRvcDogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi50b3AgfHwgJyd9O1xuICAgIGJvdHRvbTogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi5ib3R0b20gfHwgJyd9O1xuICAgIHRyYW5zZm9ybTogJHsoeyBwb3NpdGlvbiB9KSA9PiBwb3NpdGlvbi50cmFuc2Zvcm0gfHwgJyd9O1xuYDtcbiJdfQ== */"));