@semcore/modal 4.57.0-prerelease.0 → 4.57.0-prerelease.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/Modal.js +61 -56
- package/lib/cjs/Modal.js.map +1 -1
- package/lib/cjs/index.d.js.map +1 -1
- package/lib/cjs/index.js +1 -1
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/style/modal.shadow.css +5 -12
- package/lib/cjs/translations/__intergalactic-dynamic-locales.js +5 -4
- package/lib/cjs/translations/__intergalactic-dynamic-locales.js.map +1 -1
- package/lib/es6/Modal.js +52 -50
- package/lib/es6/Modal.js.map +1 -1
- package/lib/es6/index.d.js.map +1 -1
- package/lib/es6/index.js.map +1 -1
- package/lib/es6/style/modal.shadow.css +5 -12
- package/lib/es6/translations/__intergalactic-dynamic-locales.js +2 -2
- package/lib/es6/translations/__intergalactic-dynamic-locales.js.map +1 -1
- package/lib/esm/Modal.mjs +57 -54
- package/lib/esm/style/modal.shadow.css +5 -12
- package/lib/esm/translations/__intergalactic-dynamic-locales.mjs +2 -2
- package/lib/types/index.d.ts +16 -7
- package/package.json +10 -10
package/lib/cjs/Modal.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
4
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
@@ -8,66 +9,71 @@ exports["default"] = void 0;
|
|
|
8
9
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
9
10
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
10
11
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
11
|
-
var
|
|
12
|
+
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
12
13
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
14
|
+
var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
|
|
13
15
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
14
|
-
var
|
|
15
|
-
var
|
|
16
|
+
var _index = require("@semcore/utils/lib/core/index");
|
|
17
|
+
var _core = _interopRequireWildcard(require("@semcore/core"));
|
|
18
|
+
var _react = _interopRequireDefault(require("react"));
|
|
19
|
+
var _animation = require("@semcore/animation");
|
|
20
|
+
var _portal = _interopRequireWildcard(require("@semcore/portal"));
|
|
16
21
|
var _button = _interopRequireDefault(require("@semcore/button"));
|
|
17
|
-
var
|
|
18
|
-
var _findComponent = require("@semcore/core/lib/utils/findComponent");
|
|
19
|
-
var _fire = _interopRequireDefault(require("@semcore/core/lib/utils/fire"));
|
|
20
|
-
var _ThemeProvider = require("@semcore/core/lib/utils/ThemeProvider");
|
|
21
|
-
var _uniqueID = _interopRequireDefault(require("@semcore/core/lib/utils/uniqueID"));
|
|
22
|
-
var _useColorResolver = require("@semcore/core/lib/utils/use/useColorResolver");
|
|
23
|
-
var _useFocusLock = require("@semcore/core/lib/utils/use/useFocusLock");
|
|
24
|
-
var _usePreventScroll = _interopRequireDefault(require("@semcore/core/lib/utils/use/usePreventScroll"));
|
|
25
|
-
var _useCssVariable = require("@semcore/core/lib/utils/useCssVariable");
|
|
26
|
-
var _zIndexStacking = require("@semcore/core/lib/utils/zIndexStacking");
|
|
22
|
+
var _outsideClick = _interopRequireDefault(require("@semcore/outside-click"));
|
|
27
23
|
var _l = _interopRequireDefault(require("@semcore/icon/Close/l"));
|
|
28
|
-
var
|
|
29
|
-
var
|
|
24
|
+
var _fire = _interopRequireDefault(require("@semcore/utils/lib/fire"));
|
|
25
|
+
var _usePreventScroll = _interopRequireDefault(require("@semcore/utils/lib/use/usePreventScroll"));
|
|
26
|
+
var _findComponent = require("@semcore/utils/lib/findComponent");
|
|
27
|
+
var _keyboardFocusEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/keyboardFocusEnhance"));
|
|
30
28
|
var _intergalacticDynamicLocales = require("./translations/__intergalactic-dynamic-locales");
|
|
29
|
+
var _i18nEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/i18nEnhance"));
|
|
30
|
+
var _typography = require("@semcore/typography");
|
|
31
|
+
var _uniqueID = _interopRequireDefault(require("@semcore/utils/lib/uniqueID"));
|
|
32
|
+
var _useCssVariable = require("@semcore/utils/lib/useCssVariable");
|
|
33
|
+
var _useFocusLock = require("@semcore/utils/lib/use/useFocusLock");
|
|
34
|
+
var _ThemeProvider = require("@semcore/utils/lib/ThemeProvider");
|
|
35
|
+
var _useColorResolver = require("@semcore/utils/lib/use/useColorResolver");
|
|
36
|
+
var _zIndexStacking = require("@semcore/utils/lib/zIndexStacking");
|
|
31
37
|
/*!__reshadow-styles__:"./style/modal.shadow.css"*/
|
|
32
|
-
var style = (/*__reshadow_css_start__*/
|
|
38
|
+
var style = ( /*__reshadow_css_start__*/_index.sstyled.insert( /*__inner_css_start__*/".___SWindow_1pibq_gg_{position:relative;border-radius:var(--intergalactic-modal-rounded, calc(12px + 2px));background:var(--intergalactic-bg-primary-neutral, rgb(255, 255, 255));box-sizing:border-box;margin:auto;padding:var(--intergalactic-spacing-10x, 40px);box-shadow:var(--intergalactic-box-shadow-modal, 0px 1px 5px 0px rgba(0, 21, 16, 0.07));color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}@supports (color:color(display-p3 0 0 0)){.___SWindow_1pibq_gg_{box-shadow:var(--intergalactic-box-shadow-modal, 0px 1px 5px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SWindow_1pibq_gg_{box-shadow:var(--intergalactic-box-shadow-modal, 0px 1px 5px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SWindow_1pibq_gg_:focus{outline:0}.___SWindow_1pibq_gg_ .___STitle_1pibq_gg_{color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899));font-size:var(--intergalactic-fs-500, 24px);line-height:var(--intergalactic-lh-500, 117%);font-weight:var(--intergalactic-semi-bold, 600);margin-bottom:var(--intergalactic-spacing-2x, 8px);margin-right:var(--intergalactic-spacing-4x, 16px)}.___SWindow_1pibq_gg_ .___STitle_1pibq_gg_.__color_1pibq_gg_{color:var(--color_1pibq)}.___SWindow_1pibq_gg_ .___SClose_1pibq_gg_{display:inline-flex;position:absolute;right:var(--intergalactic-spacing-2x, 8px);top:var(--intergalactic-spacing-2x, 8px)}.___SWindow_1pibq_gg_ .___SClose_1pibq_gg_.__ghost_1pibq_gg_{right:0;top:0}.___SWindow_1pibq_gg_.__ghost_1pibq_gg_{background:0 0;padding:0;box-shadow:none}.___SOverlay_1pibq_gg_{position:fixed;top:0;bottom:0;left:0;right:0;margin:0;display:flex;justify-content:center;align-items:center;padding:var(--intergalactic-spacing-10x, 40px);background:var(--intergalactic-overlay-primary, rgba(0, 6, 3, 0.337));overflow:auto;-webkit-overflow-scrolling:touch}@supports (color:color(display-p3 0 0 0)){.___SOverlay_1pibq_gg_{background:var(--intergalactic-overlay-primary, rgba(0, 6, 3, 0.337))}@media (color-gamut:p3){.___SOverlay_1pibq_gg_{background:var(--intergalactic-overlay-primary, color(display-p3 0.00414 0.0233 0.01269 / 0.337))}}}.___SOverlay_1pibq_gg_ .___SOverlay_1pibq_gg_{background:var(--intergalactic-overlay-secondary, rgba(0, 8, 5, 0.262))}@media (max-width:767px){.___SWindow_1pibq_gg_{min-width:60%}.___SOverlay_1pibq_gg_{padding:var(--intergalactic-spacing-3x, 12px)}}", /*__inner_css_end__*/"1pibq_gg_"),
|
|
33
39
|
/*__reshadow_css_end__*/
|
|
34
40
|
{
|
|
35
|
-
"__SWindow": "
|
|
36
|
-
"_ghost": "
|
|
37
|
-
"
|
|
38
|
-
"__STitle": "
|
|
39
|
-
"_color": "
|
|
40
|
-
"--color": "--
|
|
41
|
-
"__SClose": "
|
|
42
|
-
"__SOverlay": "___SOverlay_ryb06_gg_"
|
|
41
|
+
"__SWindow": "___SWindow_1pibq_gg_",
|
|
42
|
+
"_ghost": "__ghost_1pibq_gg_",
|
|
43
|
+
"__SOverlay": "___SOverlay_1pibq_gg_",
|
|
44
|
+
"__STitle": "___STitle_1pibq_gg_",
|
|
45
|
+
"_color": "__color_1pibq_gg_",
|
|
46
|
+
"--color": "--color_1pibq",
|
|
47
|
+
"__SClose": "___SClose_1pibq_gg_"
|
|
43
48
|
});
|
|
44
49
|
var ModalRoot = /*#__PURE__*/function (_Component) {
|
|
50
|
+
(0, _inherits2["default"])(ModalRoot, _Component);
|
|
51
|
+
var _super = (0, _createSuper2["default"])(ModalRoot);
|
|
45
52
|
function ModalRoot() {
|
|
46
53
|
var _this;
|
|
47
54
|
(0, _classCallCheck2["default"])(this, ModalRoot);
|
|
48
55
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
49
56
|
args[_key] = arguments[_key];
|
|
50
57
|
}
|
|
51
|
-
_this = (
|
|
52
|
-
(0, _defineProperty2["default"])(_this, "state", {
|
|
58
|
+
_this = _super.call.apply(_super, [this].concat(args));
|
|
59
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
|
|
53
60
|
hasTitle: false
|
|
54
61
|
});
|
|
55
|
-
(0, _defineProperty2["default"])(_this, "handleKeyDown", function (e) {
|
|
62
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleKeyDown", function (e) {
|
|
56
63
|
if (e.key === 'Escape') {
|
|
57
64
|
e.stopPropagation();
|
|
58
|
-
(0, _fire["default"])(_this, 'onClose', 'onEscape', e);
|
|
65
|
+
(0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onClose', 'onEscape', e);
|
|
59
66
|
}
|
|
60
67
|
});
|
|
61
|
-
(0, _defineProperty2["default"])(_this, "handleIconCloseClick", function (e) {
|
|
62
|
-
(0, _fire["default"])(_this, 'onClose', 'onCloseClick', e);
|
|
68
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleIconCloseClick", function (e) {
|
|
69
|
+
(0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onClose', 'onCloseClick', e);
|
|
63
70
|
});
|
|
64
|
-
(0, _defineProperty2["default"])(_this, "handleOutsideClick", function (e) {
|
|
65
|
-
(0, _fire["default"])(_this, 'onClose', 'onOutsideClick', e);
|
|
71
|
+
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleOutsideClick", function (e) {
|
|
72
|
+
(0, _fire["default"])((0, _assertThisInitialized2["default"])(_this), 'onClose', 'onOutsideClick', e);
|
|
66
73
|
});
|
|
67
74
|
return _this;
|
|
68
75
|
}
|
|
69
|
-
(0,
|
|
70
|
-
return (0, _createClass2["default"])(ModalRoot, [{
|
|
76
|
+
(0, _createClass2["default"])(ModalRoot, [{
|
|
71
77
|
key: "getOverlayProps",
|
|
72
78
|
value: function getOverlayProps() {
|
|
73
79
|
var _this$asProps = this.asProps,
|
|
@@ -97,7 +103,7 @@ var ModalRoot = /*#__PURE__*/function (_Component) {
|
|
|
97
103
|
return {
|
|
98
104
|
visible: visible,
|
|
99
105
|
closable: closable,
|
|
100
|
-
|
|
106
|
+
onKeyDown: this.handleKeyDown,
|
|
101
107
|
'aria-label': hasTitle ? undefined : getI18nText('title'),
|
|
102
108
|
'aria-labelledby': hasTitle ? "igc-".concat(uid, "-title") : undefined,
|
|
103
109
|
duration: duration,
|
|
@@ -141,12 +147,13 @@ var ModalRoot = /*#__PURE__*/function (_Component) {
|
|
|
141
147
|
forcedAdvancedMode = _this$asProps4.forcedAdvancedMode,
|
|
142
148
|
ignorePortalsStacking = _this$asProps4.ignorePortalsStacking;
|
|
143
149
|
var advancedMode = forcedAdvancedMode || (0, _findComponent.isAdvanceMode)(Children, [Modal.Overlay.displayName, Modal.Window.displayName]);
|
|
144
|
-
return /*#__PURE__*/_react["default"].createElement(
|
|
150
|
+
return /*#__PURE__*/_react["default"].createElement(_portal["default"], {
|
|
145
151
|
disablePortal: disablePortal,
|
|
146
152
|
ignorePortalsStacking: ignorePortalsStacking
|
|
147
153
|
}, advancedMode ? /*#__PURE__*/_react["default"].createElement(Children, null) : /*#__PURE__*/_react["default"].createElement(Modal.Overlay, null, /*#__PURE__*/_react["default"].createElement(Modal.Window, (0, _core.assignProps)({}, _ref))));
|
|
148
154
|
}
|
|
149
155
|
}]);
|
|
156
|
+
return ModalRoot;
|
|
150
157
|
}(_core.Component);
|
|
151
158
|
(0, _defineProperty2["default"])(ModalRoot, "displayName", 'Modal');
|
|
152
159
|
(0, _defineProperty2["default"])(ModalRoot, "style", style);
|
|
@@ -165,14 +172,14 @@ var ModalRoot = /*#__PURE__*/function (_Component) {
|
|
|
165
172
|
function Window(props) {
|
|
166
173
|
var _ref2 = arguments[0],
|
|
167
174
|
_ref6;
|
|
168
|
-
var SWindow =
|
|
175
|
+
var SWindow = _animation.Slide;
|
|
169
176
|
var Children = props.Children,
|
|
170
177
|
styles = props.styles,
|
|
171
178
|
visible = props.visible,
|
|
172
179
|
closable = props.closable,
|
|
173
180
|
duration = props.duration;
|
|
174
181
|
var windowRef = _react["default"].useRef(null);
|
|
175
|
-
(0, _useFocusLock.useFocusLock)(windowRef,
|
|
182
|
+
(0, _useFocusLock.useFocusLock)(windowRef, true, 'auto', !visible, true);
|
|
176
183
|
return _ref6 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SWindow, _ref6.cn("SWindow", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
|
|
177
184
|
"initialAnimation": true,
|
|
178
185
|
"slideOrigin": 'top',
|
|
@@ -180,36 +187,32 @@ function Window(props) {
|
|
|
180
187
|
"role": 'dialog',
|
|
181
188
|
"aria-modal": true,
|
|
182
189
|
"duration": duration,
|
|
183
|
-
"ref": windowRef
|
|
184
|
-
"tabIndex": -1
|
|
190
|
+
"ref": windowRef
|
|
185
191
|
}, _ref2))), /*#__PURE__*/_react["default"].createElement(_zIndexStacking.ZIndexStackingContextProvider, _ref6.cn("ZIndexStackingContextProvider", {
|
|
186
192
|
"designToken": 'z-index-modal'
|
|
187
|
-
}), /*#__PURE__*/_react["default"].createElement(
|
|
193
|
+
}), /*#__PURE__*/_react["default"].createElement(_portal.PortalProvider, _ref6.cn("PortalProvider", {
|
|
188
194
|
"value": windowRef
|
|
189
195
|
}), closable && /*#__PURE__*/_react["default"].createElement(Modal.Close, null), /*#__PURE__*/_react["default"].createElement(Children, _ref6.cn("Children", {})))));
|
|
190
196
|
}
|
|
191
197
|
function Overlay(props) {
|
|
192
198
|
var _ref3 = arguments[0],
|
|
193
199
|
_ref7;
|
|
194
|
-
var SOverlay =
|
|
195
|
-
var SOverlayContentWrapper = _baseComponents.Flex;
|
|
200
|
+
var SOverlay = _animation.FadeInOut;
|
|
196
201
|
var Children = props.Children,
|
|
197
202
|
styles = props.styles,
|
|
198
203
|
onOutsideClick = props.onOutsideClick,
|
|
199
204
|
visible = props.visible;
|
|
200
|
-
var
|
|
205
|
+
var overlayRef = _react["default"].useRef(null);
|
|
201
206
|
(0, _usePreventScroll["default"])(visible, props.disablePreventScroll);
|
|
202
|
-
(0, _ThemeProvider.useContextTheme)(
|
|
207
|
+
(0, _ThemeProvider.useContextTheme)(overlayRef, visible);
|
|
203
208
|
var zIndex = (0, _zIndexStacking.useZIndexStacking)('z-index-modal');
|
|
204
209
|
return _ref7 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SOverlay, _ref7.cn("SOverlay", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
|
|
210
|
+
"ref": overlayRef,
|
|
205
211
|
"zIndex": zIndex
|
|
206
|
-
}, _ref3))), /*#__PURE__*/_react["default"].createElement(
|
|
207
|
-
"
|
|
208
|
-
"ref": overlayContentWrapperRef
|
|
209
|
-
}), /*#__PURE__*/_react["default"].createElement(_baseComponents.OutsideClick, _ref7.cn("OutsideClick", {
|
|
210
|
-
"root": overlayContentWrapperRef,
|
|
212
|
+
}, _ref3))), /*#__PURE__*/_react["default"].createElement(_outsideClick["default"], _ref7.cn("OutsideClick", {
|
|
213
|
+
"root": overlayRef,
|
|
211
214
|
"onOutsideClick": onOutsideClick
|
|
212
|
-
}), /*#__PURE__*/_react["default"].createElement(Children, _ref7.cn("Children", {}))))
|
|
215
|
+
}), /*#__PURE__*/_react["default"].createElement(Children, _ref7.cn("Children", {}))));
|
|
213
216
|
}
|
|
214
217
|
function Close(props) {
|
|
215
218
|
var _ref4 = arguments[0],
|
|
@@ -225,12 +228,13 @@ function Close(props) {
|
|
|
225
228
|
"theme": ghost ? 'invert' : 'muted',
|
|
226
229
|
"aria-label": getI18nText('close')
|
|
227
230
|
}, _ref4))), hasChildren ? /*#__PURE__*/_react["default"].createElement(Children, _ref8.cn("Children", {})) : /*#__PURE__*/_react["default"].createElement(_button["default"].Addon, {
|
|
228
|
-
ml:
|
|
229
|
-
mr:
|
|
231
|
+
ml: '7px',
|
|
232
|
+
mr: '7px'
|
|
230
233
|
}, /*#__PURE__*/_react["default"].createElement(_l["default"], _ref8.cn("CloseIcon", {
|
|
231
234
|
"title": getI18nText('close')
|
|
232
235
|
}))));
|
|
233
236
|
}
|
|
237
|
+
Close.enhance = [(0, _keyboardFocusEnhance["default"])()];
|
|
234
238
|
function Title(props) {
|
|
235
239
|
var _ref5 = arguments[0],
|
|
236
240
|
_ref9;
|
|
@@ -247,11 +251,12 @@ function Title(props) {
|
|
|
247
251
|
"use:color": resolveColor(color)
|
|
248
252
|
}, _ref5))));
|
|
249
253
|
}
|
|
250
|
-
var Modal = (0, _core
|
|
254
|
+
var Modal = (0, _core["default"])(ModalRoot, {
|
|
251
255
|
Window: Window,
|
|
252
256
|
Overlay: Overlay,
|
|
253
257
|
Close: Close,
|
|
254
258
|
Title: Title
|
|
255
259
|
});
|
|
256
|
-
var _default =
|
|
260
|
+
var _default = Modal;
|
|
261
|
+
exports["default"] = _default;
|
|
257
262
|
//# sourceMappingURL=Modal.js.map
|
package/lib/cjs/Modal.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","names":["_core","require","_baseComponents","_button","_interopRequireDefault","_i18nEnhance","_findComponent","_fire","_ThemeProvider","_uniqueID","_useColorResolver","_useFocusLock","_usePreventScroll","_useCssVariable","_zIndexStacking","_l","_typography","_react","_intergalacticDynamicLocales","style","sstyled","insert","ModalRoot","_Component","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","_callSuper2","concat","_defineProperty2","hasTitle","e","key","stopPropagation","fire","_inherits2","_createClass2","value","getOverlayProps","_this$asProps","asProps","duration","visible","animationsDisabled","disablePreventScroll","onOutsideClick","handleOutsideClick","getWindowProps","_this$asProps2","closable","getI18nText","uid","state","handleKeyDown","undefined","getCloseProps","_this$asProps3","ghost","onClick","handleIconCloseClick","getTitleProps","_this2","setHasTitle","setState","id","render","_ref","_this$asProps4","Children","disablePortal","forcedAdvancedMode","ignorePortalsStacking","advancedMode","isAdvanceMode","Modal","Overlay","displayName","Window","createElement","Portal","assignProps","Component","i18nEnhance","localizedMessages","uniqueIDEnhancement","cssVariableEnhance","variable","fallback","map","Number","parseInt","prop","i18n","locale","props","_ref2","arguments[0]","_ref6","SWindow","Slide","styles","windowRef","React","useRef","useFocusLock","cn","_objectSpread2","ZIndexStackingContextProvider","PortalProvider","Close","_ref3","_ref7","SOverlay","FadeInOut","SOverlayContentWrapper","Flex","overlayContentWrapperRef","usePreventScroll","useContextTheme","zIndex","useZIndexStacking","OutsideClick","_ref4","_ref8","SClose","Button","hasChildren","children","Addon","ml","mr","Title","_ref5","_ref9","color","STitle","Text","resolveColor","useColorResolver","useEffect","createComponent","_default","exports"],"sources":["../../src/Modal.jsx"],"sourcesContent":["import { FadeInOut, Slide, Flex, OutsideClick, Portal, PortalProvider } from '@semcore/base-components';\nimport Button from '@semcore/button';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';\nimport { isAdvanceMode } from '@semcore/core/lib/utils/findComponent';\nimport fire from '@semcore/core/lib/utils/fire';\nimport { useContextTheme } from '@semcore/core/lib/utils/ThemeProvider';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport { useColorResolver } from '@semcore/core/lib/utils/use/useColorResolver';\nimport { useFocusLock } from '@semcore/core/lib/utils/use/useFocusLock';\nimport usePreventScroll from '@semcore/core/lib/utils/use/usePreventScroll';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport {\n ZIndexStackingContextProvider,\n useZIndexStacking,\n} from '@semcore/core/lib/utils/zIndexStacking';\nimport CloseIcon from '@semcore/icon/Close/l';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/modal.shadow.css';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nclass ModalRoot extends Component {\n static displayName = 'Modal';\n static style = style;\n static enhance = [\n i18nEnhance(localizedMessages),\n uniqueIDEnhancement(),\n cssVariableEnhance({\n variable: '--intergalactic-duration-modal',\n fallback: '200',\n map: Number.parseInt,\n prop: 'duration',\n }),\n ];\n\n static defaultProps = {\n closable: true,\n i18n: localizedMessages,\n locale: 'en',\n disablePreventScroll: false,\n };\n\n state = { hasTitle: false };\n\n handleKeyDown = (e) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n fire(this, 'onClose', 'onEscape', e);\n }\n };\n\n handleIconCloseClick = (e) => {\n fire(this, 'onClose', 'onCloseClick', e);\n };\n\n handleOutsideClick = (e) => {\n fire(this, 'onClose', 'onOutsideClick', e);\n };\n\n getOverlayProps() {\n const { duration, visible, animationsDisabled, disablePreventScroll } = this.asProps;\n return {\n duration,\n visible,\n onOutsideClick: this.handleOutsideClick,\n animationsDisabled,\n disablePreventScroll,\n };\n }\n\n getWindowProps() {\n const { visible, closable, getI18nText, uid, duration, animationsDisabled } = this.asProps;\n const { hasTitle } = this.state;\n return {\n visible,\n closable,\n 'onKeyDown': this.handleKeyDown,\n 'aria-label': hasTitle ? undefined : getI18nText('title'),\n 'aria-labelledby': hasTitle ? `igc-${uid}-title` : undefined,\n duration,\n animationsDisabled,\n };\n }\n\n getCloseProps() {\n const { getI18nText, ghost } = this.asProps;\n\n return {\n onClick: this.handleIconCloseClick,\n getI18nText,\n ghost,\n };\n }\n\n getTitleProps() {\n const { uid } = this.asProps;\n const setHasTitle = () => this.setState({ hasTitle: true });\n\n return {\n id: `igc-${uid}-title`,\n setHasTitle,\n };\n }\n\n render() {\n const { Children, disablePortal, forcedAdvancedMode, ignorePortalsStacking } = this.asProps;\n\n const advancedMode =\n forcedAdvancedMode ||\n isAdvanceMode(Children, [Modal.Overlay.displayName, Modal.Window.displayName]);\n\n return (\n <Portal disablePortal={disablePortal} ignorePortalsStacking={ignorePortalsStacking}>\n {advancedMode\n ? (\n <Children />\n )\n : (\n <Modal.Overlay>\n <Root render={Modal.Window} />\n </Modal.Overlay>\n )}\n </Portal>\n );\n }\n}\n\nfunction Window(props) {\n const SWindow = Root;\n const { Children, styles, visible, closable, duration } = props;\n const windowRef = React.useRef(null);\n\n useFocusLock(windowRef, 'enforced', 'auto', !visible, true);\n\n return sstyled(styles)(\n <SWindow\n render={Slide}\n initialAnimation={true}\n slideOrigin='top'\n visible={visible}\n role='dialog'\n aria-modal={true}\n duration={duration}\n ref={windowRef}\n tabIndex={-1}\n >\n <ZIndexStackingContextProvider designToken='z-index-modal'>\n <PortalProvider value={windowRef}>\n {closable && <Modal.Close />}\n <Children />\n </PortalProvider>\n </ZIndexStackingContextProvider>\n </SWindow>,\n );\n}\n\nfunction Overlay(props) {\n const SOverlay = Root;\n const SOverlayContentWrapper = Flex;\n const { Children, styles, onOutsideClick, visible } = props;\n const overlayContentWrapperRef = React.useRef(null);\n usePreventScroll(visible, props.disablePreventScroll);\n useContextTheme(overlayContentWrapperRef, visible);\n const zIndex = useZIndexStacking('z-index-modal');\n\n return sstyled(styles)(\n <SOverlay render={FadeInOut} zIndex={zIndex}>\n {/* This child component is intended to be private. Since true encapsulation isn't possible in this context, we’re applying the data-ui-name attribute directly as a workaround. */}\n <SOverlayContentWrapper data-ui-name='Modal.Overlay.ContentWrapper' ref={overlayContentWrapperRef}>\n <OutsideClick root={overlayContentWrapperRef} onOutsideClick={onOutsideClick}>\n <Children />\n </OutsideClick>\n </SOverlayContentWrapper>\n </SOverlay>,\n );\n}\n\nfunction Close(props) {\n const SClose = Root;\n const { Children, children: hasChildren, getI18nText, ghost } = props;\n return sstyled(props.styles)(\n <SClose\n render={Button}\n use='tertiary'\n size='l'\n theme={ghost ? 'invert' : 'muted'}\n aria-label={getI18nText('close')}\n >\n {hasChildren\n ? (\n <Children />\n )\n : (\n <Button.Addon ml='7px' mr='7px'>\n <CloseIcon title={getI18nText('close')} />\n </Button.Addon>\n )}\n </SClose>,\n );\n}\n\nfunction Title(props) {\n const { setHasTitle, styles, color } = props;\n const STitle = Root;\n\n const resolveColor = useColorResolver();\n React.useEffect(() => setHasTitle());\n\n return sstyled(styles)(<STitle render={Text} tag='h2' use:color={resolveColor(color)} />);\n}\n\nconst Modal = createComponent(ModalRoot, {\n Window,\n Overlay,\n Close,\n Title,\n});\n\nexport default Modal;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Modal.js","names":["_core","_interopRequireWildcard","require","_react","_interopRequireDefault","_animation","_portal","_button","_outsideClick","_l","_fire","_usePreventScroll","_findComponent","_keyboardFocusEnhance","_intergalacticDynamicLocales","_i18nEnhance","_typography","_uniqueID","_useCssVariable","_useFocusLock","_ThemeProvider","_useColorResolver","_zIndexStacking","style","_index","sstyled","insert","ModalRoot","_Component","_inherits2","_super","_createSuper2","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty2","_assertThisInitialized2","hasTitle","e","key","stopPropagation","fire","_createClass2","value","getOverlayProps","_this$asProps","asProps","duration","visible","animationsDisabled","disablePreventScroll","onOutsideClick","handleOutsideClick","getWindowProps","_this$asProps2","closable","getI18nText","uid","state","onKeyDown","handleKeyDown","undefined","getCloseProps","_this$asProps3","ghost","onClick","handleIconCloseClick","getTitleProps","_this2","setHasTitle","setState","id","render","_ref","_this$asProps4","Children","disablePortal","forcedAdvancedMode","ignorePortalsStacking","advancedMode","isAdvanceMode","Modal","Overlay","displayName","Window","createElement","assignProps","Component","i18nEnhance","localizedMessages","uniqueIDEnhancement","cssVariableEnhance","variable","fallback","map","Number","parseInt","prop","i18n","locale","props","_ref2","arguments[0]","_ref6","SWindow","Slide","styles","windowRef","React","useRef","useFocusLock","cn","_objectSpread2","ZIndexStackingContextProvider","PortalProvider","Close","_ref3","_ref7","SOverlay","FadeInOut","overlayRef","usePreventScroll","useContextTheme","zIndex","useZIndexStacking","_ref4","_ref8","SClose","Button","hasChildren","children","Addon","ml","mr","enhance","keyboardFocusEnhance","Title","_ref5","_ref9","color","STitle","Text","resolveColor","useColorResolver","useEffect","createComponent","_default","exports"],"sources":["../../src/Modal.jsx"],"sourcesContent":["import React from 'react';\nimport { FadeInOut, Slide } from '@semcore/animation';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport Portal, { PortalProvider } from '@semcore/portal';\nimport Button from '@semcore/button';\nimport OutsideClick from '@semcore/outside-click';\nimport CloseIcon from '@semcore/icon/Close/l';\nimport fire from '@semcore/utils/lib/fire';\nimport usePreventScroll from '@semcore/utils/lib/use/usePreventScroll';\nimport { isAdvanceMode } from '@semcore/utils/lib/findComponent';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport style from './style/modal.shadow.css';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\nimport i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';\nimport { Text } from '@semcore/typography';\nimport uniqueIDEnhancement from '@semcore/utils/lib/uniqueID';\nimport { cssVariableEnhance } from '@semcore/utils/lib/useCssVariable';\nimport { useFocusLock } from '@semcore/utils/lib/use/useFocusLock';\nimport { useContextTheme } from '@semcore/utils/lib/ThemeProvider';\nimport { useColorResolver } from '@semcore/utils/lib/use/useColorResolver';\nimport {\n ZIndexStackingContextProvider,\n useZIndexStacking,\n} from '@semcore/utils/lib/zIndexStacking';\n\nclass ModalRoot extends Component {\n static displayName = 'Modal';\n static style = style;\n static enhance = [\n i18nEnhance(localizedMessages),\n uniqueIDEnhancement(),\n cssVariableEnhance({\n variable: '--intergalactic-duration-modal',\n fallback: '200',\n map: Number.parseInt,\n prop: 'duration',\n }),\n ];\n static defaultProps = {\n closable: true,\n i18n: localizedMessages,\n locale: 'en',\n disablePreventScroll: false,\n };\n state = { hasTitle: false };\n\n handleKeyDown = (e) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n fire(this, 'onClose', 'onEscape', e);\n }\n };\n\n handleIconCloseClick = (e) => {\n fire(this, 'onClose', 'onCloseClick', e);\n };\n\n handleOutsideClick = (e) => {\n fire(this, 'onClose', 'onOutsideClick', e);\n };\n\n getOverlayProps() {\n const { duration, visible, animationsDisabled, disablePreventScroll } = this.asProps;\n return {\n duration,\n visible,\n onOutsideClick: this.handleOutsideClick,\n animationsDisabled,\n disablePreventScroll,\n };\n }\n\n getWindowProps() {\n const { visible, closable, getI18nText, uid, duration, animationsDisabled } = this.asProps;\n const { hasTitle } = this.state;\n return {\n visible,\n closable,\n onKeyDown: this.handleKeyDown,\n 'aria-label': hasTitle ? undefined : getI18nText('title'),\n 'aria-labelledby': hasTitle ? `igc-${uid}-title` : undefined,\n duration,\n animationsDisabled,\n };\n }\n\n getCloseProps() {\n const { getI18nText, ghost } = this.asProps;\n\n return {\n onClick: this.handleIconCloseClick,\n getI18nText,\n ghost,\n };\n }\n\n getTitleProps() {\n const { uid } = this.asProps;\n const setHasTitle = () => this.setState({ hasTitle: true });\n\n return {\n id: `igc-${uid}-title`,\n setHasTitle,\n };\n }\n\n render() {\n const { Children, disablePortal, forcedAdvancedMode, ignorePortalsStacking } = this.asProps;\n\n const advancedMode =\n forcedAdvancedMode ||\n isAdvanceMode(Children, [Modal.Overlay.displayName, Modal.Window.displayName]);\n\n return (\n <Portal disablePortal={disablePortal} ignorePortalsStacking={ignorePortalsStacking}>\n {advancedMode ? (\n <Children />\n ) : (\n <Modal.Overlay>\n <Root render={Modal.Window} />\n </Modal.Overlay>\n )}\n </Portal>\n );\n }\n}\n\nfunction Window(props) {\n const SWindow = Root;\n const { Children, styles, visible, closable, duration } = props;\n const windowRef = React.useRef(null);\n\n useFocusLock(windowRef, true, 'auto', !visible, true);\n\n return sstyled(styles)(\n <SWindow\n render={Slide}\n initialAnimation={true}\n slideOrigin='top'\n visible={visible}\n role='dialog'\n aria-modal={true}\n duration={duration}\n ref={windowRef}\n >\n <ZIndexStackingContextProvider designToken='z-index-modal'>\n <PortalProvider value={windowRef}>\n {closable && <Modal.Close />}\n <Children />\n </PortalProvider>\n </ZIndexStackingContextProvider>\n </SWindow>,\n );\n}\n\nfunction Overlay(props) {\n const SOverlay = Root;\n const { Children, styles, onOutsideClick, visible } = props;\n const overlayRef = React.useRef(null);\n usePreventScroll(visible, props.disablePreventScroll);\n useContextTheme(overlayRef, visible);\n const zIndex = useZIndexStacking('z-index-modal');\n\n return sstyled(styles)(\n <SOverlay render={FadeInOut} ref={overlayRef} zIndex={zIndex}>\n <OutsideClick root={overlayRef} onOutsideClick={onOutsideClick}>\n <Children />\n </OutsideClick>\n </SOverlay>,\n );\n}\n\nfunction Close(props) {\n const SClose = Root;\n const { Children, children: hasChildren, getI18nText, ghost } = props;\n return sstyled(props.styles)(\n <SClose\n render={Button}\n use='tertiary'\n size='l'\n theme={ghost ? 'invert' : 'muted'}\n aria-label={getI18nText('close')}\n >\n {hasChildren ? (\n <Children />\n ) : (\n <Button.Addon ml={'7px'} mr={'7px'}>\n <CloseIcon title={getI18nText('close')} />\n </Button.Addon>\n )}\n </SClose>,\n );\n}\n\nClose.enhance = [keyboardFocusEnhance()];\n\nfunction Title(props) {\n const { setHasTitle, styles, color } = props;\n const STitle = Root;\n\n const resolveColor = useColorResolver();\n React.useEffect(() => setHasTitle());\n\n return sstyled(styles)(<STitle render={Text} tag='h2' use:color={resolveColor(color)} />);\n}\n\nconst Modal = createComponent(ModalRoot, {\n Window,\n Overlay,\n Close,\n Title,\n});\n\nexport default Modal;\n"],"mappings":"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"}
|
package/lib/cjs/index.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { FadeInOutProps, SlideProps } from '@semcore/animation';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport { PortalProps } from '@semcore/portal';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport { TextProps } from '@semcore/typography';\nimport Button from '@semcore/button';\n\n/** @deprecated */\nexport interface IModalProps extends ModalProps, UnknownProperties {}\nexport type ModalProps = PortalProps &\n BoxProps &\n FadeInOutProps & {\n /** Duration of animation, ms\n * @default 200\n */\n duration?: number;\n /** This property is responsible for the visibility of the modal window */\n visible?: boolean;\n /** Function called when the component is hidden */\n onClose?: (\n trigger: 'onOutsideClick' | 'onCloseClick' | 'onEscape',\n e?: React.MouseEvent | React.KeyboardEvent,\n ) => void;\n /** Displaying the close button(x) in the upper-right corner of the modal dialog\n * @default true\n * */\n closable?: boolean;\n /**\n * Setting `true` disables mechanism that hides document body scrollbar when Modal is visible\n * @default false\n */\n disablePreventScroll?: boolean;\n\n locale?: string;\n\n /**\n * Props for render modal without background and paddings. Useful in carousel for example\n */\n ghost?: boolean;\n };\n\n/** @deprecated */\nexport interface IWindowProps extends WindowProps, UnknownProperties {}\nexport type WindowProps = BoxProps & SlideProps & {};\n\n/** @deprecated */\nexport interface IModalContext extends ModalContext, UnknownProperties {}\nexport type ModalContext = {\n getOverlayProps: PropGetterFn;\n getWindowProps: PropGetterFn;\n getCloseProps: PropGetterFn;\n};\n\ndeclare const Modal: Intergalactic.Component<'div', ModalProps, ModalContext> & {\n Window: Intergalactic.Component<'div', WindowProps>;\n Overlay: typeof Box;\n Close: typeof Button;\n Title: Intergalactic.Component<'div', TextProps>;\n};\n\nexport default Modal;\n"],"mappings":""}
|
package/lib/cjs/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
package/lib/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_Modal","_interopRequireDefault","require"],"sources":["../../src/index.js"],"sourcesContent":["export { default } from './Modal';\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA"
|
|
1
|
+
{"version":3,"file":"index.js","names":["_Modal","_interopRequireDefault","require"],"sources":["../../src/index.js"],"sourcesContent":["export { default } from './Modal';\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA"}
|
|
@@ -43,23 +43,17 @@ SWindow[ghost] {
|
|
|
43
43
|
box-shadow: none;
|
|
44
44
|
}
|
|
45
45
|
|
|
46
|
-
SOverlayContentWrapper {
|
|
47
|
-
flex: 1;
|
|
48
|
-
max-width: 100%;
|
|
49
|
-
box-sizing: border-box;
|
|
50
|
-
padding: var(--intergalactic-spacing-10x, 40px);
|
|
51
|
-
}
|
|
52
|
-
|
|
53
46
|
SOverlay {
|
|
54
|
-
display: flex;
|
|
55
|
-
justify-content: center;
|
|
56
|
-
flex-wrap: wrap;
|
|
57
47
|
position: fixed;
|
|
58
48
|
top: 0;
|
|
59
49
|
bottom: 0;
|
|
60
50
|
left: 0;
|
|
61
51
|
right: 0;
|
|
62
52
|
margin: 0;
|
|
53
|
+
display: flex;
|
|
54
|
+
justify-content: center;
|
|
55
|
+
align-items: center;
|
|
56
|
+
padding: var(--intergalactic-spacing-10x, 40px);
|
|
63
57
|
background: var(--intergalactic-overlay-primary, oklch(0.109 0.023 165.5 / 0.337));
|
|
64
58
|
overflow: auto;
|
|
65
59
|
-webkit-overflow-scrolling: touch;
|
|
@@ -67,7 +61,6 @@ SOverlay {
|
|
|
67
61
|
& SOverlay {
|
|
68
62
|
background: var(--intergalactic-overlay-secondary, oklch(0.118 0.023 170.1 / 0.262));
|
|
69
63
|
}
|
|
70
|
-
|
|
71
64
|
}
|
|
72
65
|
|
|
73
66
|
@media (max-width: 767px) {
|
|
@@ -75,7 +68,7 @@ SOverlay {
|
|
|
75
68
|
min-width: 60%;
|
|
76
69
|
}
|
|
77
70
|
|
|
78
|
-
|
|
71
|
+
SOverlay {
|
|
79
72
|
padding: var(--intergalactic-spacing-3x, 12px);
|
|
80
73
|
}
|
|
81
74
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
@@ -13,13 +13,13 @@ var _it = _interopRequireDefault(require("./it.json"));
|
|
|
13
13
|
var _ja = _interopRequireDefault(require("./ja.json"));
|
|
14
14
|
var _ko = _interopRequireDefault(require("./ko.json"));
|
|
15
15
|
var _nl = _interopRequireDefault(require("./nl.json"));
|
|
16
|
-
var _pl = _interopRequireDefault(require("./pl.json"));
|
|
17
16
|
var _pt = _interopRequireDefault(require("./pt.json"));
|
|
18
|
-
var _sv = _interopRequireDefault(require("./sv.json"));
|
|
19
17
|
var _tr = _interopRequireDefault(require("./tr.json"));
|
|
20
18
|
var _vi = _interopRequireDefault(require("./vi.json"));
|
|
21
19
|
var _zh = _interopRequireDefault(require("./zh.json"));
|
|
22
|
-
var
|
|
20
|
+
var _pl = _interopRequireDefault(require("./pl.json"));
|
|
21
|
+
var _sv = _interopRequireDefault(require("./sv.json"));
|
|
22
|
+
var localizedMessages = {
|
|
23
23
|
de: _de["default"],
|
|
24
24
|
en: _en["default"],
|
|
25
25
|
es: _es["default"],
|
|
@@ -35,4 +35,5 @@ var localizedMessages = exports.localizedMessages = {
|
|
|
35
35
|
pl: _pl["default"],
|
|
36
36
|
sv: _sv["default"]
|
|
37
37
|
};
|
|
38
|
+
exports.localizedMessages = localizedMessages;
|
|
38
39
|
//# sourceMappingURL=__intergalactic-dynamic-locales.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"__intergalactic-dynamic-locales.js","names":["_de","_interopRequireDefault","require","_en","_es","_fr","_it","_ja","_ko","_nl","
|
|
1
|
+
{"version":3,"file":"__intergalactic-dynamic-locales.js","names":["_de","_interopRequireDefault","require","_en","_es","_fr","_it","_ja","_ko","_nl","_pt","_tr","_vi","_zh","_pl","_sv","localizedMessages","de","en","es","fr","it","ja","ko","nl","pt","tr","vi","zh","pl","sv","exports"],"sources":["../../../src/translations/__intergalactic-dynamic-locales.ts"],"sourcesContent":["import de from './de.json';\nimport en from './en.json';\nimport es from './es.json';\nimport fr from './fr.json';\nimport it from './it.json';\nimport ja from './ja.json';\nimport ko from './ko.json';\nimport nl from './nl.json';\nimport pt from './pt.json';\nimport tr from './tr.json';\nimport vi from './vi.json';\nimport zh from './zh.json';\nimport pl from './pl.json';\nimport sv from './sv.json';\n\nexport const localizedMessages = {\n de,\n en,\n es,\n fr,\n it,\n ja,\n ko,\n nl,\n pt,\n tr,\n vi,\n zh,\n pl,\n sv,\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,GAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,GAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,GAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,GAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,GAAA,GAAAL,sBAAA,CAAAC,OAAA;AACA,IAAAK,GAAA,GAAAN,sBAAA,CAAAC,OAAA;AACA,IAAAM,GAAA,GAAAP,sBAAA,CAAAC,OAAA;AACA,IAAAO,GAAA,GAAAR,sBAAA,CAAAC,OAAA;AACA,IAAAQ,GAAA,GAAAT,sBAAA,CAAAC,OAAA;AACA,IAAAS,GAAA,GAAAV,sBAAA,CAAAC,OAAA;AACA,IAAAU,GAAA,GAAAX,sBAAA,CAAAC,OAAA;AACA,IAAAW,GAAA,GAAAZ,sBAAA,CAAAC,OAAA;AACA,IAAAY,GAAA,GAAAb,sBAAA,CAAAC,OAAA;AACA,IAAAa,GAAA,GAAAd,sBAAA,CAAAC,OAAA;AAEO,IAAMc,iBAAiB,GAAG;EAC/BC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA,cAAE;EACFC,EAAE,EAAFA;AACF,CAAC;AAACC,OAAA,CAAAf,iBAAA,GAAAA,iBAAA"}
|
package/lib/es6/Modal.js
CHANGED
|
@@ -1,72 +1,76 @@
|
|
|
1
1
|
import _objectSpread from "@babel/runtime/helpers/objectSpread2";
|
|
2
2
|
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
|
|
3
3
|
import _createClass from "@babel/runtime/helpers/createClass";
|
|
4
|
-
import
|
|
4
|
+
import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
|
|
5
5
|
import _inherits from "@babel/runtime/helpers/inherits";
|
|
6
|
+
import _createSuper from "@babel/runtime/helpers/createSuper";
|
|
6
7
|
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
7
|
-
import { sstyled as _sstyled } from "@semcore/core";
|
|
8
|
+
import { sstyled as _sstyled } from "@semcore/utils/lib/core/index";
|
|
8
9
|
import { assignProps as _assignProps5 } from "@semcore/core";
|
|
9
10
|
import { assignProps as _assignProps4 } from "@semcore/core";
|
|
10
11
|
import { assignProps as _assignProps3 } from "@semcore/core";
|
|
11
12
|
import { assignProps as _assignProps2 } from "@semcore/core";
|
|
12
13
|
import { assignProps as _assignProps } from "@semcore/core";
|
|
13
|
-
import
|
|
14
|
+
import React from 'react';
|
|
15
|
+
import { FadeInOut, Slide } from '@semcore/animation';
|
|
16
|
+
import createComponent, { Component, sstyled, Root } from '@semcore/core';
|
|
17
|
+
import Portal, { PortalProvider } from '@semcore/portal';
|
|
14
18
|
import Button from '@semcore/button';
|
|
15
|
-
import
|
|
16
|
-
import i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';
|
|
17
|
-
import { isAdvanceMode } from '@semcore/core/lib/utils/findComponent';
|
|
18
|
-
import fire from '@semcore/core/lib/utils/fire';
|
|
19
|
-
import { useContextTheme } from '@semcore/core/lib/utils/ThemeProvider';
|
|
20
|
-
import uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';
|
|
21
|
-
import { useColorResolver } from '@semcore/core/lib/utils/use/useColorResolver';
|
|
22
|
-
import { useFocusLock } from '@semcore/core/lib/utils/use/useFocusLock';
|
|
23
|
-
import usePreventScroll from '@semcore/core/lib/utils/use/usePreventScroll';
|
|
24
|
-
import { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';
|
|
25
|
-
import { ZIndexStackingContextProvider, useZIndexStacking } from '@semcore/core/lib/utils/zIndexStacking';
|
|
19
|
+
import OutsideClick from '@semcore/outside-click';
|
|
26
20
|
import CloseIcon from '@semcore/icon/Close/l';
|
|
27
|
-
import
|
|
28
|
-
import
|
|
21
|
+
import fire from '@semcore/utils/lib/fire';
|
|
22
|
+
import usePreventScroll from '@semcore/utils/lib/use/usePreventScroll';
|
|
23
|
+
import { isAdvanceMode } from '@semcore/utils/lib/findComponent';
|
|
24
|
+
import keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';
|
|
29
25
|
/*!__reshadow-styles__:"./style/modal.shadow.css"*/
|
|
30
|
-
var style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".
|
|
26
|
+
var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SWindow_1pibq_gg_{position:relative;border-radius:var(--intergalactic-modal-rounded, calc(12px + 2px));background:var(--intergalactic-bg-primary-neutral, rgb(255, 255, 255));box-sizing:border-box;margin:auto;padding:var(--intergalactic-spacing-10x, 40px);box-shadow:var(--intergalactic-box-shadow-modal, 0px 1px 5px 0px rgba(0, 21, 16, 0.07));color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}@supports (color:color(display-p3 0 0 0)){.___SWindow_1pibq_gg_{box-shadow:var(--intergalactic-box-shadow-modal, 0px 1px 5px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SWindow_1pibq_gg_{box-shadow:var(--intergalactic-box-shadow-modal, 0px 1px 5px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SWindow_1pibq_gg_:focus{outline:0}.___SWindow_1pibq_gg_ .___STitle_1pibq_gg_{color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899));font-size:var(--intergalactic-fs-500, 24px);line-height:var(--intergalactic-lh-500, 117%);font-weight:var(--intergalactic-semi-bold, 600);margin-bottom:var(--intergalactic-spacing-2x, 8px);margin-right:var(--intergalactic-spacing-4x, 16px)}.___SWindow_1pibq_gg_ .___STitle_1pibq_gg_.__color_1pibq_gg_{color:var(--color_1pibq)}.___SWindow_1pibq_gg_ .___SClose_1pibq_gg_{display:inline-flex;position:absolute;right:var(--intergalactic-spacing-2x, 8px);top:var(--intergalactic-spacing-2x, 8px)}.___SWindow_1pibq_gg_ .___SClose_1pibq_gg_.__ghost_1pibq_gg_{right:0;top:0}.___SWindow_1pibq_gg_.__ghost_1pibq_gg_{background:0 0;padding:0;box-shadow:none}.___SOverlay_1pibq_gg_{position:fixed;top:0;bottom:0;left:0;right:0;margin:0;display:flex;justify-content:center;align-items:center;padding:var(--intergalactic-spacing-10x, 40px);background:var(--intergalactic-overlay-primary, rgba(0, 6, 3, 0.337));overflow:auto;-webkit-overflow-scrolling:touch}@supports (color:color(display-p3 0 0 0)){.___SOverlay_1pibq_gg_{background:var(--intergalactic-overlay-primary, rgba(0, 6, 3, 0.337))}@media (color-gamut:p3){.___SOverlay_1pibq_gg_{background:var(--intergalactic-overlay-primary, color(display-p3 0.00414 0.0233 0.01269 / 0.337))}}}.___SOverlay_1pibq_gg_ .___SOverlay_1pibq_gg_{background:var(--intergalactic-overlay-secondary, rgba(0, 8, 5, 0.262))}@media (max-width:767px){.___SWindow_1pibq_gg_{min-width:60%}.___SOverlay_1pibq_gg_{padding:var(--intergalactic-spacing-3x, 12px)}}", /*__inner_css_end__*/"1pibq_gg_"),
|
|
31
27
|
/*__reshadow_css_end__*/
|
|
32
28
|
{
|
|
33
|
-
"__SWindow": "
|
|
34
|
-
"_ghost": "
|
|
35
|
-
"
|
|
36
|
-
"__STitle": "
|
|
37
|
-
"_color": "
|
|
38
|
-
"--color": "--
|
|
39
|
-
"__SClose": "
|
|
40
|
-
"__SOverlay": "___SOverlay_ryb06_gg_"
|
|
29
|
+
"__SWindow": "___SWindow_1pibq_gg_",
|
|
30
|
+
"_ghost": "__ghost_1pibq_gg_",
|
|
31
|
+
"__SOverlay": "___SOverlay_1pibq_gg_",
|
|
32
|
+
"__STitle": "___STitle_1pibq_gg_",
|
|
33
|
+
"_color": "__color_1pibq_gg_",
|
|
34
|
+
"--color": "--color_1pibq",
|
|
35
|
+
"__SClose": "___SClose_1pibq_gg_"
|
|
41
36
|
});
|
|
42
37
|
import { localizedMessages } from './translations/__intergalactic-dynamic-locales';
|
|
38
|
+
import i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';
|
|
39
|
+
import { Text } from '@semcore/typography';
|
|
40
|
+
import uniqueIDEnhancement from '@semcore/utils/lib/uniqueID';
|
|
41
|
+
import { cssVariableEnhance } from '@semcore/utils/lib/useCssVariable';
|
|
42
|
+
import { useFocusLock } from '@semcore/utils/lib/use/useFocusLock';
|
|
43
|
+
import { useContextTheme } from '@semcore/utils/lib/ThemeProvider';
|
|
44
|
+
import { useColorResolver } from '@semcore/utils/lib/use/useColorResolver';
|
|
45
|
+
import { ZIndexStackingContextProvider, useZIndexStacking } from '@semcore/utils/lib/zIndexStacking';
|
|
43
46
|
var ModalRoot = /*#__PURE__*/function (_Component) {
|
|
47
|
+
_inherits(ModalRoot, _Component);
|
|
48
|
+
var _super = _createSuper(ModalRoot);
|
|
44
49
|
function ModalRoot() {
|
|
45
50
|
var _this;
|
|
46
51
|
_classCallCheck(this, ModalRoot);
|
|
47
52
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
48
53
|
args[_key] = arguments[_key];
|
|
49
54
|
}
|
|
50
|
-
_this =
|
|
51
|
-
_defineProperty(_this, "state", {
|
|
55
|
+
_this = _super.call.apply(_super, [this].concat(args));
|
|
56
|
+
_defineProperty(_assertThisInitialized(_this), "state", {
|
|
52
57
|
hasTitle: false
|
|
53
58
|
});
|
|
54
|
-
_defineProperty(_this, "handleKeyDown", function (e) {
|
|
59
|
+
_defineProperty(_assertThisInitialized(_this), "handleKeyDown", function (e) {
|
|
55
60
|
if (e.key === 'Escape') {
|
|
56
61
|
e.stopPropagation();
|
|
57
|
-
fire(_this, 'onClose', 'onEscape', e);
|
|
62
|
+
fire(_assertThisInitialized(_this), 'onClose', 'onEscape', e);
|
|
58
63
|
}
|
|
59
64
|
});
|
|
60
|
-
_defineProperty(_this, "handleIconCloseClick", function (e) {
|
|
61
|
-
fire(_this, 'onClose', 'onCloseClick', e);
|
|
65
|
+
_defineProperty(_assertThisInitialized(_this), "handleIconCloseClick", function (e) {
|
|
66
|
+
fire(_assertThisInitialized(_this), 'onClose', 'onCloseClick', e);
|
|
62
67
|
});
|
|
63
|
-
_defineProperty(_this, "handleOutsideClick", function (e) {
|
|
64
|
-
fire(_this, 'onClose', 'onOutsideClick', e);
|
|
68
|
+
_defineProperty(_assertThisInitialized(_this), "handleOutsideClick", function (e) {
|
|
69
|
+
fire(_assertThisInitialized(_this), 'onClose', 'onOutsideClick', e);
|
|
65
70
|
});
|
|
66
71
|
return _this;
|
|
67
72
|
}
|
|
68
|
-
|
|
69
|
-
return _createClass(ModalRoot, [{
|
|
73
|
+
_createClass(ModalRoot, [{
|
|
70
74
|
key: "getOverlayProps",
|
|
71
75
|
value: function getOverlayProps() {
|
|
72
76
|
var _this$asProps = this.asProps,
|
|
@@ -96,7 +100,7 @@ var ModalRoot = /*#__PURE__*/function (_Component) {
|
|
|
96
100
|
return {
|
|
97
101
|
visible: visible,
|
|
98
102
|
closable: closable,
|
|
99
|
-
|
|
103
|
+
onKeyDown: this.handleKeyDown,
|
|
100
104
|
'aria-label': hasTitle ? undefined : getI18nText('title'),
|
|
101
105
|
'aria-labelledby': hasTitle ? "igc-".concat(uid, "-title") : undefined,
|
|
102
106
|
duration: duration,
|
|
@@ -146,6 +150,7 @@ var ModalRoot = /*#__PURE__*/function (_Component) {
|
|
|
146
150
|
}, advancedMode ? /*#__PURE__*/React.createElement(Children, null) : /*#__PURE__*/React.createElement(Modal.Overlay, null, /*#__PURE__*/React.createElement(Modal.Window, _assignProps({}, _ref))));
|
|
147
151
|
}
|
|
148
152
|
}]);
|
|
153
|
+
return ModalRoot;
|
|
149
154
|
}(Component);
|
|
150
155
|
_defineProperty(ModalRoot, "displayName", 'Modal');
|
|
151
156
|
_defineProperty(ModalRoot, "style", style);
|
|
@@ -171,7 +176,7 @@ function Window(props) {
|
|
|
171
176
|
closable = props.closable,
|
|
172
177
|
duration = props.duration;
|
|
173
178
|
var windowRef = React.useRef(null);
|
|
174
|
-
useFocusLock(windowRef,
|
|
179
|
+
useFocusLock(windowRef, true, 'auto', !visible, true);
|
|
175
180
|
return _ref6 = sstyled(styles), /*#__PURE__*/React.createElement(SWindow, _ref6.cn("SWindow", _objectSpread({}, _assignProps2({
|
|
176
181
|
"initialAnimation": true,
|
|
177
182
|
"slideOrigin": 'top',
|
|
@@ -179,8 +184,7 @@ function Window(props) {
|
|
|
179
184
|
"role": 'dialog',
|
|
180
185
|
"aria-modal": true,
|
|
181
186
|
"duration": duration,
|
|
182
|
-
"ref": windowRef
|
|
183
|
-
"tabIndex": -1
|
|
187
|
+
"ref": windowRef
|
|
184
188
|
}, _ref2))), /*#__PURE__*/React.createElement(ZIndexStackingContextProvider, _ref6.cn("ZIndexStackingContextProvider", {
|
|
185
189
|
"designToken": 'z-index-modal'
|
|
186
190
|
}), /*#__PURE__*/React.createElement(PortalProvider, _ref6.cn("PortalProvider", {
|
|
@@ -191,24 +195,21 @@ function Overlay(props) {
|
|
|
191
195
|
var _ref3 = arguments[0],
|
|
192
196
|
_ref7;
|
|
193
197
|
var SOverlay = FadeInOut;
|
|
194
|
-
var SOverlayContentWrapper = Flex;
|
|
195
198
|
var Children = props.Children,
|
|
196
199
|
styles = props.styles,
|
|
197
200
|
onOutsideClick = props.onOutsideClick,
|
|
198
201
|
visible = props.visible;
|
|
199
|
-
var
|
|
202
|
+
var overlayRef = React.useRef(null);
|
|
200
203
|
usePreventScroll(visible, props.disablePreventScroll);
|
|
201
|
-
useContextTheme(
|
|
204
|
+
useContextTheme(overlayRef, visible);
|
|
202
205
|
var zIndex = useZIndexStacking('z-index-modal');
|
|
203
206
|
return _ref7 = sstyled(styles), /*#__PURE__*/React.createElement(SOverlay, _ref7.cn("SOverlay", _objectSpread({}, _assignProps3({
|
|
207
|
+
"ref": overlayRef,
|
|
204
208
|
"zIndex": zIndex
|
|
205
|
-
}, _ref3))), /*#__PURE__*/React.createElement(
|
|
206
|
-
"
|
|
207
|
-
"ref": overlayContentWrapperRef
|
|
208
|
-
}), /*#__PURE__*/React.createElement(OutsideClick, _ref7.cn("OutsideClick", {
|
|
209
|
-
"root": overlayContentWrapperRef,
|
|
209
|
+
}, _ref3))), /*#__PURE__*/React.createElement(OutsideClick, _ref7.cn("OutsideClick", {
|
|
210
|
+
"root": overlayRef,
|
|
210
211
|
"onOutsideClick": onOutsideClick
|
|
211
|
-
}), /*#__PURE__*/React.createElement(Children, _ref7.cn("Children", {}))))
|
|
212
|
+
}), /*#__PURE__*/React.createElement(Children, _ref7.cn("Children", {}))));
|
|
212
213
|
}
|
|
213
214
|
function Close(props) {
|
|
214
215
|
var _ref4 = arguments[0],
|
|
@@ -224,12 +225,13 @@ function Close(props) {
|
|
|
224
225
|
"theme": ghost ? 'invert' : 'muted',
|
|
225
226
|
"aria-label": getI18nText('close')
|
|
226
227
|
}, _ref4))), hasChildren ? /*#__PURE__*/React.createElement(Children, _ref8.cn("Children", {})) : /*#__PURE__*/React.createElement(Button.Addon, {
|
|
227
|
-
ml:
|
|
228
|
-
mr:
|
|
228
|
+
ml: '7px',
|
|
229
|
+
mr: '7px'
|
|
229
230
|
}, /*#__PURE__*/React.createElement(CloseIcon, _ref8.cn("CloseIcon", {
|
|
230
231
|
"title": getI18nText('close')
|
|
231
232
|
}))));
|
|
232
233
|
}
|
|
234
|
+
Close.enhance = [keyboardFocusEnhance()];
|
|
233
235
|
function Title(props) {
|
|
234
236
|
var _ref5 = arguments[0],
|
|
235
237
|
_ref9;
|
package/lib/es6/Modal.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Modal.js","names":["FadeInOut","Slide","Flex","OutsideClick","Portal","PortalProvider","Button","createComponent","Component","sstyled","Root","i18nEnhance","isAdvanceMode","fire","useContextTheme","uniqueIDEnhancement","useColorResolver","useFocusLock","usePreventScroll","cssVariableEnhance","ZIndexStackingContextProvider","useZIndexStacking","CloseIcon","Text","React","style","_sstyled","insert","localizedMessages","ModalRoot","_Component","_this","_classCallCheck","_len","arguments","length","args","Array","_key","_callSuper","concat","_defineProperty","hasTitle","e","key","stopPropagation","_inherits","_createClass","value","getOverlayProps","_this$asProps","asProps","duration","visible","animationsDisabled","disablePreventScroll","onOutsideClick","handleOutsideClick","getWindowProps","_this$asProps2","closable","getI18nText","uid","state","handleKeyDown","undefined","getCloseProps","_this$asProps3","ghost","onClick","handleIconCloseClick","getTitleProps","_this2","setHasTitle","setState","id","render","_ref","_this$asProps4","Children","disablePortal","forcedAdvancedMode","ignorePortalsStacking","advancedMode","Modal","Overlay","displayName","Window","createElement","_assignProps","variable","fallback","map","Number","parseInt","prop","i18n","locale","props","_ref2","arguments[0]","_ref6","SWindow","styles","windowRef","useRef","cn","_objectSpread","_assignProps2","Close","_ref3","_ref7","SOverlay","SOverlayContentWrapper","overlayContentWrapperRef","zIndex","_assignProps3","_ref4","_ref8","SClose","hasChildren","children","_assignProps4","Addon","ml","mr","Title","_ref5","_ref9","color","STitle","resolveColor","useEffect","_assignProps5"],"sources":["../../src/Modal.jsx"],"sourcesContent":["import { FadeInOut, Slide, Flex, OutsideClick, Portal, PortalProvider } from '@semcore/base-components';\nimport Button from '@semcore/button';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';\nimport { isAdvanceMode } from '@semcore/core/lib/utils/findComponent';\nimport fire from '@semcore/core/lib/utils/fire';\nimport { useContextTheme } from '@semcore/core/lib/utils/ThemeProvider';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport { useColorResolver } from '@semcore/core/lib/utils/use/useColorResolver';\nimport { useFocusLock } from '@semcore/core/lib/utils/use/useFocusLock';\nimport usePreventScroll from '@semcore/core/lib/utils/use/usePreventScroll';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport {\n ZIndexStackingContextProvider,\n useZIndexStacking,\n} from '@semcore/core/lib/utils/zIndexStacking';\nimport CloseIcon from '@semcore/icon/Close/l';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/modal.shadow.css';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nclass ModalRoot extends Component {\n static displayName = 'Modal';\n static style = style;\n static enhance = [\n i18nEnhance(localizedMessages),\n uniqueIDEnhancement(),\n cssVariableEnhance({\n variable: '--intergalactic-duration-modal',\n fallback: '200',\n map: Number.parseInt,\n prop: 'duration',\n }),\n ];\n\n static defaultProps = {\n closable: true,\n i18n: localizedMessages,\n locale: 'en',\n disablePreventScroll: false,\n };\n\n state = { hasTitle: false };\n\n handleKeyDown = (e) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n fire(this, 'onClose', 'onEscape', e);\n }\n };\n\n handleIconCloseClick = (e) => {\n fire(this, 'onClose', 'onCloseClick', e);\n };\n\n handleOutsideClick = (e) => {\n fire(this, 'onClose', 'onOutsideClick', e);\n };\n\n getOverlayProps() {\n const { duration, visible, animationsDisabled, disablePreventScroll } = this.asProps;\n return {\n duration,\n visible,\n onOutsideClick: this.handleOutsideClick,\n animationsDisabled,\n disablePreventScroll,\n };\n }\n\n getWindowProps() {\n const { visible, closable, getI18nText, uid, duration, animationsDisabled } = this.asProps;\n const { hasTitle } = this.state;\n return {\n visible,\n closable,\n 'onKeyDown': this.handleKeyDown,\n 'aria-label': hasTitle ? undefined : getI18nText('title'),\n 'aria-labelledby': hasTitle ? `igc-${uid}-title` : undefined,\n duration,\n animationsDisabled,\n };\n }\n\n getCloseProps() {\n const { getI18nText, ghost } = this.asProps;\n\n return {\n onClick: this.handleIconCloseClick,\n getI18nText,\n ghost,\n };\n }\n\n getTitleProps() {\n const { uid } = this.asProps;\n const setHasTitle = () => this.setState({ hasTitle: true });\n\n return {\n id: `igc-${uid}-title`,\n setHasTitle,\n };\n }\n\n render() {\n const { Children, disablePortal, forcedAdvancedMode, ignorePortalsStacking } = this.asProps;\n\n const advancedMode =\n forcedAdvancedMode ||\n isAdvanceMode(Children, [Modal.Overlay.displayName, Modal.Window.displayName]);\n\n return (\n <Portal disablePortal={disablePortal} ignorePortalsStacking={ignorePortalsStacking}>\n {advancedMode\n ? (\n <Children />\n )\n : (\n <Modal.Overlay>\n <Root render={Modal.Window} />\n </Modal.Overlay>\n )}\n </Portal>\n );\n }\n}\n\nfunction Window(props) {\n const SWindow = Root;\n const { Children, styles, visible, closable, duration } = props;\n const windowRef = React.useRef(null);\n\n useFocusLock(windowRef, 'enforced', 'auto', !visible, true);\n\n return sstyled(styles)(\n <SWindow\n render={Slide}\n initialAnimation={true}\n slideOrigin='top'\n visible={visible}\n role='dialog'\n aria-modal={true}\n duration={duration}\n ref={windowRef}\n tabIndex={-1}\n >\n <ZIndexStackingContextProvider designToken='z-index-modal'>\n <PortalProvider value={windowRef}>\n {closable && <Modal.Close />}\n <Children />\n </PortalProvider>\n </ZIndexStackingContextProvider>\n </SWindow>,\n );\n}\n\nfunction Overlay(props) {\n const SOverlay = Root;\n const SOverlayContentWrapper = Flex;\n const { Children, styles, onOutsideClick, visible } = props;\n const overlayContentWrapperRef = React.useRef(null);\n usePreventScroll(visible, props.disablePreventScroll);\n useContextTheme(overlayContentWrapperRef, visible);\n const zIndex = useZIndexStacking('z-index-modal');\n\n return sstyled(styles)(\n <SOverlay render={FadeInOut} zIndex={zIndex}>\n {/* This child component is intended to be private. Since true encapsulation isn't possible in this context, we’re applying the data-ui-name attribute directly as a workaround. */}\n <SOverlayContentWrapper data-ui-name='Modal.Overlay.ContentWrapper' ref={overlayContentWrapperRef}>\n <OutsideClick root={overlayContentWrapperRef} onOutsideClick={onOutsideClick}>\n <Children />\n </OutsideClick>\n </SOverlayContentWrapper>\n </SOverlay>,\n );\n}\n\nfunction Close(props) {\n const SClose = Root;\n const { Children, children: hasChildren, getI18nText, ghost } = props;\n return sstyled(props.styles)(\n <SClose\n render={Button}\n use='tertiary'\n size='l'\n theme={ghost ? 'invert' : 'muted'}\n aria-label={getI18nText('close')}\n >\n {hasChildren\n ? (\n <Children />\n )\n : (\n <Button.Addon ml='7px' mr='7px'>\n <CloseIcon title={getI18nText('close')} />\n </Button.Addon>\n )}\n </SClose>,\n );\n}\n\nfunction Title(props) {\n const { setHasTitle, styles, color } = props;\n const STitle = Root;\n\n const resolveColor = useColorResolver();\n React.useEffect(() => setHasTitle());\n\n return sstyled(styles)(<STitle render={Text} tag='h2' use:color={resolveColor(color)} />);\n}\n\nconst Modal = createComponent(ModalRoot, {\n Window,\n Overlay,\n Close,\n Title,\n});\n\nexport default Modal;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Modal.js","names":["React","FadeInOut","Slide","createComponent","Component","sstyled","Root","Portal","PortalProvider","Button","OutsideClick","CloseIcon","fire","usePreventScroll","isAdvanceMode","keyboardFocusEnhance","style","_sstyled","insert","localizedMessages","i18nEnhance","Text","uniqueIDEnhancement","cssVariableEnhance","useFocusLock","useContextTheme","useColorResolver","ZIndexStackingContextProvider","useZIndexStacking","ModalRoot","_Component","_inherits","_super","_createSuper","_this","_classCallCheck","_len","arguments","length","args","Array","_key","call","apply","concat","_defineProperty","_assertThisInitialized","hasTitle","e","key","stopPropagation","_createClass","value","getOverlayProps","_this$asProps","asProps","duration","visible","animationsDisabled","disablePreventScroll","onOutsideClick","handleOutsideClick","getWindowProps","_this$asProps2","closable","getI18nText","uid","state","onKeyDown","handleKeyDown","undefined","getCloseProps","_this$asProps3","ghost","onClick","handleIconCloseClick","getTitleProps","_this2","setHasTitle","setState","id","render","_ref","_this$asProps4","Children","disablePortal","forcedAdvancedMode","ignorePortalsStacking","advancedMode","Modal","Overlay","displayName","Window","createElement","_assignProps","variable","fallback","map","Number","parseInt","prop","i18n","locale","props","_ref2","arguments[0]","_ref6","SWindow","styles","windowRef","useRef","cn","_objectSpread","_assignProps2","Close","_ref3","_ref7","SOverlay","overlayRef","zIndex","_assignProps3","_ref4","_ref8","SClose","hasChildren","children","_assignProps4","Addon","ml","mr","enhance","Title","_ref5","_ref9","color","STitle","resolveColor","useEffect","_assignProps5"],"sources":["../../src/Modal.jsx"],"sourcesContent":["import React from 'react';\nimport { FadeInOut, Slide } from '@semcore/animation';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport Portal, { PortalProvider } from '@semcore/portal';\nimport Button from '@semcore/button';\nimport OutsideClick from '@semcore/outside-click';\nimport CloseIcon from '@semcore/icon/Close/l';\nimport fire from '@semcore/utils/lib/fire';\nimport usePreventScroll from '@semcore/utils/lib/use/usePreventScroll';\nimport { isAdvanceMode } from '@semcore/utils/lib/findComponent';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\nimport style from './style/modal.shadow.css';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\nimport i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';\nimport { Text } from '@semcore/typography';\nimport uniqueIDEnhancement from '@semcore/utils/lib/uniqueID';\nimport { cssVariableEnhance } from '@semcore/utils/lib/useCssVariable';\nimport { useFocusLock } from '@semcore/utils/lib/use/useFocusLock';\nimport { useContextTheme } from '@semcore/utils/lib/ThemeProvider';\nimport { useColorResolver } from '@semcore/utils/lib/use/useColorResolver';\nimport {\n ZIndexStackingContextProvider,\n useZIndexStacking,\n} from '@semcore/utils/lib/zIndexStacking';\n\nclass ModalRoot extends Component {\n static displayName = 'Modal';\n static style = style;\n static enhance = [\n i18nEnhance(localizedMessages),\n uniqueIDEnhancement(),\n cssVariableEnhance({\n variable: '--intergalactic-duration-modal',\n fallback: '200',\n map: Number.parseInt,\n prop: 'duration',\n }),\n ];\n static defaultProps = {\n closable: true,\n i18n: localizedMessages,\n locale: 'en',\n disablePreventScroll: false,\n };\n state = { hasTitle: false };\n\n handleKeyDown = (e) => {\n if (e.key === 'Escape') {\n e.stopPropagation();\n fire(this, 'onClose', 'onEscape', e);\n }\n };\n\n handleIconCloseClick = (e) => {\n fire(this, 'onClose', 'onCloseClick', e);\n };\n\n handleOutsideClick = (e) => {\n fire(this, 'onClose', 'onOutsideClick', e);\n };\n\n getOverlayProps() {\n const { duration, visible, animationsDisabled, disablePreventScroll } = this.asProps;\n return {\n duration,\n visible,\n onOutsideClick: this.handleOutsideClick,\n animationsDisabled,\n disablePreventScroll,\n };\n }\n\n getWindowProps() {\n const { visible, closable, getI18nText, uid, duration, animationsDisabled } = this.asProps;\n const { hasTitle } = this.state;\n return {\n visible,\n closable,\n onKeyDown: this.handleKeyDown,\n 'aria-label': hasTitle ? undefined : getI18nText('title'),\n 'aria-labelledby': hasTitle ? `igc-${uid}-title` : undefined,\n duration,\n animationsDisabled,\n };\n }\n\n getCloseProps() {\n const { getI18nText, ghost } = this.asProps;\n\n return {\n onClick: this.handleIconCloseClick,\n getI18nText,\n ghost,\n };\n }\n\n getTitleProps() {\n const { uid } = this.asProps;\n const setHasTitle = () => this.setState({ hasTitle: true });\n\n return {\n id: `igc-${uid}-title`,\n setHasTitle,\n };\n }\n\n render() {\n const { Children, disablePortal, forcedAdvancedMode, ignorePortalsStacking } = this.asProps;\n\n const advancedMode =\n forcedAdvancedMode ||\n isAdvanceMode(Children, [Modal.Overlay.displayName, Modal.Window.displayName]);\n\n return (\n <Portal disablePortal={disablePortal} ignorePortalsStacking={ignorePortalsStacking}>\n {advancedMode ? (\n <Children />\n ) : (\n <Modal.Overlay>\n <Root render={Modal.Window} />\n </Modal.Overlay>\n )}\n </Portal>\n );\n }\n}\n\nfunction Window(props) {\n const SWindow = Root;\n const { Children, styles, visible, closable, duration } = props;\n const windowRef = React.useRef(null);\n\n useFocusLock(windowRef, true, 'auto', !visible, true);\n\n return sstyled(styles)(\n <SWindow\n render={Slide}\n initialAnimation={true}\n slideOrigin='top'\n visible={visible}\n role='dialog'\n aria-modal={true}\n duration={duration}\n ref={windowRef}\n >\n <ZIndexStackingContextProvider designToken='z-index-modal'>\n <PortalProvider value={windowRef}>\n {closable && <Modal.Close />}\n <Children />\n </PortalProvider>\n </ZIndexStackingContextProvider>\n </SWindow>,\n );\n}\n\nfunction Overlay(props) {\n const SOverlay = Root;\n const { Children, styles, onOutsideClick, visible } = props;\n const overlayRef = React.useRef(null);\n usePreventScroll(visible, props.disablePreventScroll);\n useContextTheme(overlayRef, visible);\n const zIndex = useZIndexStacking('z-index-modal');\n\n return sstyled(styles)(\n <SOverlay render={FadeInOut} ref={overlayRef} zIndex={zIndex}>\n <OutsideClick root={overlayRef} onOutsideClick={onOutsideClick}>\n <Children />\n </OutsideClick>\n </SOverlay>,\n );\n}\n\nfunction Close(props) {\n const SClose = Root;\n const { Children, children: hasChildren, getI18nText, ghost } = props;\n return sstyled(props.styles)(\n <SClose\n render={Button}\n use='tertiary'\n size='l'\n theme={ghost ? 'invert' : 'muted'}\n aria-label={getI18nText('close')}\n >\n {hasChildren ? (\n <Children />\n ) : (\n <Button.Addon ml={'7px'} mr={'7px'}>\n <CloseIcon title={getI18nText('close')} />\n </Button.Addon>\n )}\n </SClose>,\n );\n}\n\nClose.enhance = [keyboardFocusEnhance()];\n\nfunction Title(props) {\n const { setHasTitle, styles, color } = props;\n const STitle = Root;\n\n const resolveColor = useColorResolver();\n React.useEffect(() => setHasTitle());\n\n return sstyled(styles)(<STitle render={Text} tag='h2' use:color={resolveColor(color)} />);\n}\n\nconst Modal = createComponent(ModalRoot, {\n Window,\n Overlay,\n Close,\n Title,\n});\n\nexport default Modal;\n"],"mappings":"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"}
|
package/lib/es6/index.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { FadeInOutProps, SlideProps } from '@semcore/animation';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport { PortalProps } from '@semcore/portal';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport { TextProps } from '@semcore/typography';\nimport Button from '@semcore/button';\n\n/** @deprecated */\nexport interface IModalProps extends ModalProps, UnknownProperties {}\nexport type ModalProps = PortalProps &\n BoxProps &\n FadeInOutProps & {\n /** Duration of animation, ms\n * @default 200\n */\n duration?: number;\n /** This property is responsible for the visibility of the modal window */\n visible?: boolean;\n /** Function called when the component is hidden */\n onClose?: (\n trigger: 'onOutsideClick' | 'onCloseClick' | 'onEscape',\n e?: React.MouseEvent | React.KeyboardEvent,\n ) => void;\n /** Displaying the close button(x) in the upper-right corner of the modal dialog\n * @default true\n * */\n closable?: boolean;\n /**\n * Setting `true` disables mechanism that hides document body scrollbar when Modal is visible\n * @default false\n */\n disablePreventScroll?: boolean;\n\n locale?: string;\n\n /**\n * Props for render modal without background and paddings. Useful in carousel for example\n */\n ghost?: boolean;\n };\n\n/** @deprecated */\nexport interface IWindowProps extends WindowProps, UnknownProperties {}\nexport type WindowProps = BoxProps & SlideProps & {};\n\n/** @deprecated */\nexport interface IModalContext extends ModalContext, UnknownProperties {}\nexport type ModalContext = {\n getOverlayProps: PropGetterFn;\n getWindowProps: PropGetterFn;\n getCloseProps: PropGetterFn;\n};\n\ndeclare const Modal: Intergalactic.Component<'div', ModalProps, ModalContext> & {\n Window: Intergalactic.Component<'div', WindowProps>;\n Overlay: typeof Box;\n Close: typeof Button;\n Title: Intergalactic.Component<'div', TextProps>;\n};\n\nexport default Modal;\n"],"mappings":""}
|
package/lib/es6/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["default"],"sources":["../../src/index.js"],"sourcesContent":["export { default } from './Modal';\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,SAAS"
|
|
1
|
+
{"version":3,"file":"index.js","names":["default"],"sources":["../../src/index.js"],"sourcesContent":["export { default } from './Modal';\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,SAAS"}
|
|
@@ -43,23 +43,17 @@ SWindow[ghost] {
|
|
|
43
43
|
box-shadow: none;
|
|
44
44
|
}
|
|
45
45
|
|
|
46
|
-
SOverlayContentWrapper {
|
|
47
|
-
flex: 1;
|
|
48
|
-
max-width: 100%;
|
|
49
|
-
box-sizing: border-box;
|
|
50
|
-
padding: var(--intergalactic-spacing-10x, 40px);
|
|
51
|
-
}
|
|
52
|
-
|
|
53
46
|
SOverlay {
|
|
54
|
-
display: flex;
|
|
55
|
-
justify-content: center;
|
|
56
|
-
flex-wrap: wrap;
|
|
57
47
|
position: fixed;
|
|
58
48
|
top: 0;
|
|
59
49
|
bottom: 0;
|
|
60
50
|
left: 0;
|
|
61
51
|
right: 0;
|
|
62
52
|
margin: 0;
|
|
53
|
+
display: flex;
|
|
54
|
+
justify-content: center;
|
|
55
|
+
align-items: center;
|
|
56
|
+
padding: var(--intergalactic-spacing-10x, 40px);
|
|
63
57
|
background: var(--intergalactic-overlay-primary, oklch(0.109 0.023 165.5 / 0.337));
|
|
64
58
|
overflow: auto;
|
|
65
59
|
-webkit-overflow-scrolling: touch;
|
|
@@ -67,7 +61,6 @@ SOverlay {
|
|
|
67
61
|
& SOverlay {
|
|
68
62
|
background: var(--intergalactic-overlay-secondary, oklch(0.118 0.023 170.1 / 0.262));
|
|
69
63
|
}
|
|
70
|
-
|
|
71
64
|
}
|
|
72
65
|
|
|
73
66
|
@media (max-width: 767px) {
|
|
@@ -75,7 +68,7 @@ SOverlay {
|
|
|
75
68
|
min-width: 60%;
|
|
76
69
|
}
|
|
77
70
|
|
|
78
|
-
|
|
71
|
+
SOverlay {
|
|
79
72
|
padding: var(--intergalactic-spacing-3x, 12px);
|
|
80
73
|
}
|
|
81
74
|
}
|
|
@@ -6,12 +6,12 @@ import it from './it.json';
|
|
|
6
6
|
import ja from './ja.json';
|
|
7
7
|
import ko from './ko.json';
|
|
8
8
|
import nl from './nl.json';
|
|
9
|
-
import pl from './pl.json';
|
|
10
9
|
import pt from './pt.json';
|
|
11
|
-
import sv from './sv.json';
|
|
12
10
|
import tr from './tr.json';
|
|
13
11
|
import vi from './vi.json';
|
|
14
12
|
import zh from './zh.json';
|
|
13
|
+
import pl from './pl.json';
|
|
14
|
+
import sv from './sv.json';
|
|
15
15
|
export var localizedMessages = {
|
|
16
16
|
de: de,
|
|
17
17
|
en: en,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"__intergalactic-dynamic-locales.js","names":["de","en","es","fr","it","ja","ko","nl","
|
|
1
|
+
{"version":3,"file":"__intergalactic-dynamic-locales.js","names":["de","en","es","fr","it","ja","ko","nl","pt","tr","vi","zh","pl","sv","localizedMessages"],"sources":["../../../src/translations/__intergalactic-dynamic-locales.ts"],"sourcesContent":["import de from './de.json';\nimport en from './en.json';\nimport es from './es.json';\nimport fr from './fr.json';\nimport it from './it.json';\nimport ja from './ja.json';\nimport ko from './ko.json';\nimport nl from './nl.json';\nimport pt from './pt.json';\nimport tr from './tr.json';\nimport vi from './vi.json';\nimport zh from './zh.json';\nimport pl from './pl.json';\nimport sv from './sv.json';\n\nexport const localizedMessages = {\n de,\n en,\n es,\n fr,\n it,\n ja,\n ko,\n nl,\n pt,\n tr,\n vi,\n zh,\n pl,\n sv,\n};\n"],"mappings":"AAAA,OAAOA,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAC1B,OAAOC,EAAE,MAAM,WAAW;AAE1B,OAAO,IAAMC,iBAAiB,GAAG;EAC/Bd,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA;AACF,CAAC"}
|
package/lib/esm/Modal.mjs
CHANGED
|
@@ -1,73 +1,78 @@
|
|
|
1
1
|
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
2
2
|
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
|
|
3
3
|
import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
4
|
-
import
|
|
4
|
+
import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
|
|
5
5
|
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
6
|
+
import _createSuper from "@babel/runtime/helpers/esm/createSuper";
|
|
6
7
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
7
|
-
import { sstyled
|
|
8
|
-
import {
|
|
8
|
+
import { sstyled } from "@semcore/utils/lib/core/index";
|
|
9
|
+
import createComponent, { assignProps, Component, sstyled as sstyled$1 } from "@semcore/core";
|
|
10
|
+
import React from "react";
|
|
11
|
+
import { Slide, FadeInOut } from "@semcore/animation";
|
|
12
|
+
import Portal, { PortalProvider } from "@semcore/portal";
|
|
9
13
|
import Button from "@semcore/button";
|
|
10
|
-
import
|
|
11
|
-
import { isAdvanceMode } from "@semcore/core/lib/utils/findComponent";
|
|
12
|
-
import fire from "@semcore/core/lib/utils/fire";
|
|
13
|
-
import { useContextTheme } from "@semcore/core/lib/utils/ThemeProvider";
|
|
14
|
-
import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
|
|
15
|
-
import { useColorResolver } from "@semcore/core/lib/utils/use/useColorResolver";
|
|
16
|
-
import { useFocusLock } from "@semcore/core/lib/utils/use/useFocusLock";
|
|
17
|
-
import usePreventScroll from "@semcore/core/lib/utils/use/usePreventScroll";
|
|
18
|
-
import { cssVariableEnhance } from "@semcore/core/lib/utils/useCssVariable";
|
|
19
|
-
import { ZIndexStackingContextProvider, useZIndexStacking } from "@semcore/core/lib/utils/zIndexStacking";
|
|
14
|
+
import OutsideClick from "@semcore/outside-click";
|
|
20
15
|
import CloseIcon from "@semcore/icon/Close/l";
|
|
21
|
-
import
|
|
22
|
-
import
|
|
16
|
+
import fire from "@semcore/utils/lib/fire";
|
|
17
|
+
import usePreventScroll from "@semcore/utils/lib/use/usePreventScroll";
|
|
18
|
+
import { isAdvanceMode } from "@semcore/utils/lib/findComponent";
|
|
19
|
+
import keyboardFocusEnhance from "@semcore/utils/lib/enhances/keyboardFocusEnhance";
|
|
23
20
|
import { localizedMessages } from "./translations/__intergalactic-dynamic-locales.mjs";
|
|
21
|
+
import i18nEnhance from "@semcore/utils/lib/enhances/i18nEnhance";
|
|
22
|
+
import { Text } from "@semcore/typography";
|
|
23
|
+
import uniqueIDEnhancement from "@semcore/utils/lib/uniqueID";
|
|
24
|
+
import { cssVariableEnhance } from "@semcore/utils/lib/useCssVariable";
|
|
25
|
+
import { useFocusLock } from "@semcore/utils/lib/use/useFocusLock";
|
|
26
|
+
import { useContextTheme } from "@semcore/utils/lib/ThemeProvider";
|
|
27
|
+
import { useColorResolver } from "@semcore/utils/lib/use/useColorResolver";
|
|
28
|
+
import { ZIndexStackingContextProvider, useZIndexStacking } from "@semcore/utils/lib/zIndexStacking";
|
|
24
29
|
/*!__reshadow-styles__:"./style/modal.shadow.css"*/
|
|
25
30
|
var style = (
|
|
26
31
|
/*__reshadow_css_start__*/
|
|
27
32
|
(sstyled.insert(
|
|
28
33
|
/*__inner_css_start__*/
|
|
29
|
-
".
|
|
34
|
+
".___SWindow_1pibq_gg_{position:relative;border-radius:var(--intergalactic-modal-rounded, calc(12px + 2px));background:var(--intergalactic-bg-primary-neutral, rgb(255, 255, 255));box-sizing:border-box;margin:auto;padding:var(--intergalactic-spacing-10x, 40px);box-shadow:var(--intergalactic-box-shadow-modal, 0px 1px 5px 0px rgba(0, 21, 16, 0.07));color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}@supports (color:color(display-p3 0 0 0)){.___SWindow_1pibq_gg_{box-shadow:var(--intergalactic-box-shadow-modal, 0px 1px 5px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SWindow_1pibq_gg_{box-shadow:var(--intergalactic-box-shadow-modal, 0px 1px 5px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SWindow_1pibq_gg_:focus{outline:0}.___SWindow_1pibq_gg_ .___STitle_1pibq_gg_{color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899));font-size:var(--intergalactic-fs-500, 24px);line-height:var(--intergalactic-lh-500, 117%);font-weight:var(--intergalactic-semi-bold, 600);margin-bottom:var(--intergalactic-spacing-2x, 8px);margin-right:var(--intergalactic-spacing-4x, 16px)}.___SWindow_1pibq_gg_ .___STitle_1pibq_gg_.__color_1pibq_gg_{color:var(--color_1pibq)}.___SWindow_1pibq_gg_ .___SClose_1pibq_gg_{display:inline-flex;position:absolute;right:var(--intergalactic-spacing-2x, 8px);top:var(--intergalactic-spacing-2x, 8px)}.___SWindow_1pibq_gg_ .___SClose_1pibq_gg_.__ghost_1pibq_gg_{right:0;top:0}.___SWindow_1pibq_gg_.__ghost_1pibq_gg_{background:0 0;padding:0;box-shadow:none}.___SOverlay_1pibq_gg_{position:fixed;top:0;bottom:0;left:0;right:0;margin:0;display:flex;justify-content:center;align-items:center;padding:var(--intergalactic-spacing-10x, 40px);background:var(--intergalactic-overlay-primary, rgba(0, 6, 3, 0.337));overflow:auto;-webkit-overflow-scrolling:touch}@supports (color:color(display-p3 0 0 0)){.___SOverlay_1pibq_gg_{background:var(--intergalactic-overlay-primary, rgba(0, 6, 3, 0.337))}@media (color-gamut:p3){.___SOverlay_1pibq_gg_{background:var(--intergalactic-overlay-primary, color(display-p3 0.00414 0.0233 0.01269 / 0.337))}}}.___SOverlay_1pibq_gg_ .___SOverlay_1pibq_gg_{background:var(--intergalactic-overlay-secondary, rgba(0, 8, 5, 0.262))}@media (max-width:767px){.___SWindow_1pibq_gg_{min-width:60%}.___SOverlay_1pibq_gg_{padding:var(--intergalactic-spacing-3x, 12px)}}",
|
|
30
35
|
/*__inner_css_end__*/
|
|
31
|
-
"
|
|
36
|
+
"1pibq_gg_"
|
|
32
37
|
), /*__reshadow_css_end__*/
|
|
33
38
|
{
|
|
34
|
-
"__SWindow": "
|
|
35
|
-
"_ghost": "
|
|
36
|
-
"
|
|
37
|
-
"__STitle": "
|
|
38
|
-
"_color": "
|
|
39
|
-
"--color": "--
|
|
40
|
-
"__SClose": "
|
|
41
|
-
"__SOverlay": "___SOverlay_ryb06_gg_"
|
|
39
|
+
"__SWindow": "___SWindow_1pibq_gg_",
|
|
40
|
+
"_ghost": "__ghost_1pibq_gg_",
|
|
41
|
+
"__SOverlay": "___SOverlay_1pibq_gg_",
|
|
42
|
+
"__STitle": "___STitle_1pibq_gg_",
|
|
43
|
+
"_color": "__color_1pibq_gg_",
|
|
44
|
+
"--color": "--color_1pibq",
|
|
45
|
+
"__SClose": "___SClose_1pibq_gg_"
|
|
42
46
|
})
|
|
43
47
|
);
|
|
44
|
-
var ModalRoot = /* @__PURE__ */
|
|
48
|
+
var ModalRoot = /* @__PURE__ */ function(_Component) {
|
|
49
|
+
_inherits(ModalRoot2, _Component);
|
|
50
|
+
var _super = _createSuper(ModalRoot2);
|
|
45
51
|
function ModalRoot2() {
|
|
46
52
|
var _this;
|
|
47
53
|
_classCallCheck(this, ModalRoot2);
|
|
48
54
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
49
55
|
args[_key] = arguments[_key];
|
|
50
56
|
}
|
|
51
|
-
_this =
|
|
52
|
-
_defineProperty(_this, "state", {
|
|
57
|
+
_this = _super.call.apply(_super, [this].concat(args));
|
|
58
|
+
_defineProperty(_assertThisInitialized(_this), "state", {
|
|
53
59
|
hasTitle: false
|
|
54
60
|
});
|
|
55
|
-
_defineProperty(_this, "handleKeyDown", function(e) {
|
|
61
|
+
_defineProperty(_assertThisInitialized(_this), "handleKeyDown", function(e) {
|
|
56
62
|
if (e.key === "Escape") {
|
|
57
63
|
e.stopPropagation();
|
|
58
|
-
fire(_this, "onClose", "onEscape", e);
|
|
64
|
+
fire(_assertThisInitialized(_this), "onClose", "onEscape", e);
|
|
59
65
|
}
|
|
60
66
|
});
|
|
61
|
-
_defineProperty(_this, "handleIconCloseClick", function(e) {
|
|
62
|
-
fire(_this, "onClose", "onCloseClick", e);
|
|
67
|
+
_defineProperty(_assertThisInitialized(_this), "handleIconCloseClick", function(e) {
|
|
68
|
+
fire(_assertThisInitialized(_this), "onClose", "onCloseClick", e);
|
|
63
69
|
});
|
|
64
|
-
_defineProperty(_this, "handleOutsideClick", function(e) {
|
|
65
|
-
fire(_this, "onClose", "onOutsideClick", e);
|
|
70
|
+
_defineProperty(_assertThisInitialized(_this), "handleOutsideClick", function(e) {
|
|
71
|
+
fire(_assertThisInitialized(_this), "onClose", "onOutsideClick", e);
|
|
66
72
|
});
|
|
67
73
|
return _this;
|
|
68
74
|
}
|
|
69
|
-
|
|
70
|
-
return _createClass(ModalRoot2, [{
|
|
75
|
+
_createClass(ModalRoot2, [{
|
|
71
76
|
key: "getOverlayProps",
|
|
72
77
|
value: function getOverlayProps() {
|
|
73
78
|
var _this$asProps = this.asProps, duration = _this$asProps.duration, visible = _this$asProps.visible, animationsDisabled = _this$asProps.animationsDisabled, disablePreventScroll = _this$asProps.disablePreventScroll;
|
|
@@ -87,7 +92,7 @@ var ModalRoot = /* @__PURE__ */ (function(_Component) {
|
|
|
87
92
|
return {
|
|
88
93
|
visible,
|
|
89
94
|
closable,
|
|
90
|
-
|
|
95
|
+
onKeyDown: this.handleKeyDown,
|
|
91
96
|
"aria-label": hasTitle ? void 0 : getI18nText("title"),
|
|
92
97
|
"aria-labelledby": hasTitle ? "igc-".concat(uid, "-title") : void 0,
|
|
93
98
|
duration,
|
|
@@ -131,7 +136,8 @@ var ModalRoot = /* @__PURE__ */ (function(_Component) {
|
|
|
131
136
|
}, advancedMode ? /* @__PURE__ */ React.createElement(Children, null) : /* @__PURE__ */ React.createElement(Modal.Overlay, null, /* @__PURE__ */ React.createElement(Modal.Window, assignProps({}, _ref))));
|
|
132
137
|
}
|
|
133
138
|
}]);
|
|
134
|
-
|
|
139
|
+
return ModalRoot2;
|
|
140
|
+
}(Component);
|
|
135
141
|
_defineProperty(ModalRoot, "displayName", "Modal");
|
|
136
142
|
_defineProperty(ModalRoot, "style", style);
|
|
137
143
|
_defineProperty(ModalRoot, "enhance", [i18nEnhance(localizedMessages), uniqueIDEnhancement(), cssVariableEnhance({
|
|
@@ -151,16 +157,15 @@ function Window(props) {
|
|
|
151
157
|
var SWindow = Slide;
|
|
152
158
|
var Children = props.Children, styles = props.styles, visible = props.visible, closable = props.closable, duration = props.duration;
|
|
153
159
|
var windowRef = React.useRef(null);
|
|
154
|
-
useFocusLock(windowRef,
|
|
155
|
-
return _ref6 = sstyled(styles), /* @__PURE__ */ React.createElement(SWindow, _ref6.cn("SWindow", _objectSpread({}, assignProps({
|
|
160
|
+
useFocusLock(windowRef, true, "auto", !visible, true);
|
|
161
|
+
return _ref6 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SWindow, _ref6.cn("SWindow", _objectSpread({}, assignProps({
|
|
156
162
|
"initialAnimation": true,
|
|
157
163
|
"slideOrigin": "top",
|
|
158
164
|
"visible": visible,
|
|
159
165
|
"role": "dialog",
|
|
160
166
|
"aria-modal": true,
|
|
161
167
|
"duration": duration,
|
|
162
|
-
"ref": windowRef
|
|
163
|
-
"tabIndex": -1
|
|
168
|
+
"ref": windowRef
|
|
164
169
|
}, _ref2))), /* @__PURE__ */ React.createElement(ZIndexStackingContextProvider, _ref6.cn("ZIndexStackingContextProvider", {
|
|
165
170
|
"designToken": "z-index-modal"
|
|
166
171
|
}), /* @__PURE__ */ React.createElement(PortalProvider, _ref6.cn("PortalProvider", {
|
|
@@ -170,27 +175,24 @@ function Window(props) {
|
|
|
170
175
|
function Overlay(props) {
|
|
171
176
|
var _ref3 = arguments[0], _ref7;
|
|
172
177
|
var SOverlay = FadeInOut;
|
|
173
|
-
var SOverlayContentWrapper = Flex;
|
|
174
178
|
var Children = props.Children, styles = props.styles, onOutsideClick = props.onOutsideClick, visible = props.visible;
|
|
175
|
-
var
|
|
179
|
+
var overlayRef = React.useRef(null);
|
|
176
180
|
usePreventScroll(visible, props.disablePreventScroll);
|
|
177
|
-
useContextTheme(
|
|
181
|
+
useContextTheme(overlayRef, visible);
|
|
178
182
|
var zIndex = useZIndexStacking("z-index-modal");
|
|
179
|
-
return _ref7 = sstyled(styles), /* @__PURE__ */ React.createElement(SOverlay, _ref7.cn("SOverlay", _objectSpread({}, assignProps({
|
|
183
|
+
return _ref7 = sstyled$1(styles), /* @__PURE__ */ React.createElement(SOverlay, _ref7.cn("SOverlay", _objectSpread({}, assignProps({
|
|
184
|
+
"ref": overlayRef,
|
|
180
185
|
"zIndex": zIndex
|
|
181
|
-
}, _ref3))), /* @__PURE__ */ React.createElement(
|
|
182
|
-
"
|
|
183
|
-
"ref": overlayContentWrapperRef
|
|
184
|
-
}), /* @__PURE__ */ React.createElement(OutsideClick, _ref7.cn("OutsideClick", {
|
|
185
|
-
"root": overlayContentWrapperRef,
|
|
186
|
+
}, _ref3))), /* @__PURE__ */ React.createElement(OutsideClick, _ref7.cn("OutsideClick", {
|
|
187
|
+
"root": overlayRef,
|
|
186
188
|
"onOutsideClick": onOutsideClick
|
|
187
|
-
}), /* @__PURE__ */ React.createElement(Children, _ref7.cn("Children", {}))))
|
|
189
|
+
}), /* @__PURE__ */ React.createElement(Children, _ref7.cn("Children", {}))));
|
|
188
190
|
}
|
|
189
191
|
function Close(props) {
|
|
190
192
|
var _ref4 = arguments[0], _ref8;
|
|
191
193
|
var SClose = Button;
|
|
192
194
|
var Children = props.Children, hasChildren = props.children, getI18nText = props.getI18nText, ghost = props.ghost;
|
|
193
|
-
return _ref8 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SClose, _ref8.cn("SClose", _objectSpread({}, assignProps({
|
|
195
|
+
return _ref8 = sstyled$1(props.styles), /* @__PURE__ */ React.createElement(SClose, _ref8.cn("SClose", _objectSpread({}, assignProps({
|
|
194
196
|
"use": "tertiary",
|
|
195
197
|
"size": "l",
|
|
196
198
|
"theme": ghost ? "invert" : "muted",
|
|
@@ -202,6 +204,7 @@ function Close(props) {
|
|
|
202
204
|
"title": getI18nText("close")
|
|
203
205
|
}))));
|
|
204
206
|
}
|
|
207
|
+
Close.enhance = [keyboardFocusEnhance()];
|
|
205
208
|
function Title(props) {
|
|
206
209
|
var _ref5 = arguments[0], _ref9;
|
|
207
210
|
var setHasTitle = props.setHasTitle, styles = props.styles, color = props.color;
|
|
@@ -210,7 +213,7 @@ function Title(props) {
|
|
|
210
213
|
React.useEffect(function() {
|
|
211
214
|
return setHasTitle();
|
|
212
215
|
});
|
|
213
|
-
return _ref9 = sstyled(styles), /* @__PURE__ */ React.createElement(STitle, _ref9.cn("STitle", _objectSpread({}, assignProps({
|
|
216
|
+
return _ref9 = sstyled$1(styles), /* @__PURE__ */ React.createElement(STitle, _ref9.cn("STitle", _objectSpread({}, assignProps({
|
|
214
217
|
"tag": "h2",
|
|
215
218
|
"use:color": resolveColor(color)
|
|
216
219
|
}, _ref5))));
|
|
@@ -43,23 +43,17 @@ SWindow[ghost] {
|
|
|
43
43
|
box-shadow: none;
|
|
44
44
|
}
|
|
45
45
|
|
|
46
|
-
SOverlayContentWrapper {
|
|
47
|
-
flex: 1;
|
|
48
|
-
max-width: 100%;
|
|
49
|
-
box-sizing: border-box;
|
|
50
|
-
padding: var(--intergalactic-spacing-10x, 40px);
|
|
51
|
-
}
|
|
52
|
-
|
|
53
46
|
SOverlay {
|
|
54
|
-
display: flex;
|
|
55
|
-
justify-content: center;
|
|
56
|
-
flex-wrap: wrap;
|
|
57
47
|
position: fixed;
|
|
58
48
|
top: 0;
|
|
59
49
|
bottom: 0;
|
|
60
50
|
left: 0;
|
|
61
51
|
right: 0;
|
|
62
52
|
margin: 0;
|
|
53
|
+
display: flex;
|
|
54
|
+
justify-content: center;
|
|
55
|
+
align-items: center;
|
|
56
|
+
padding: var(--intergalactic-spacing-10x, 40px);
|
|
63
57
|
background: var(--intergalactic-overlay-primary, oklch(0.109 0.023 165.5 / 0.337));
|
|
64
58
|
overflow: auto;
|
|
65
59
|
-webkit-overflow-scrolling: touch;
|
|
@@ -67,7 +61,6 @@ SOverlay {
|
|
|
67
61
|
& SOverlay {
|
|
68
62
|
background: var(--intergalactic-overlay-secondary, oklch(0.118 0.023 170.1 / 0.262));
|
|
69
63
|
}
|
|
70
|
-
|
|
71
64
|
}
|
|
72
65
|
|
|
73
66
|
@media (max-width: 767px) {
|
|
@@ -75,7 +68,7 @@ SOverlay {
|
|
|
75
68
|
min-width: 60%;
|
|
76
69
|
}
|
|
77
70
|
|
|
78
|
-
|
|
71
|
+
SOverlay {
|
|
79
72
|
padding: var(--intergalactic-spacing-3x, 12px);
|
|
80
73
|
}
|
|
81
74
|
}
|
|
@@ -6,12 +6,12 @@ import it from "./it.json.mjs";
|
|
|
6
6
|
import ja from "./ja.json.mjs";
|
|
7
7
|
import ko from "./ko.json.mjs";
|
|
8
8
|
import nl from "./nl.json.mjs";
|
|
9
|
-
import pl from "./pl.json.mjs";
|
|
10
9
|
import pt from "./pt.json.mjs";
|
|
11
|
-
import sv from "./sv.json.mjs";
|
|
12
10
|
import tr from "./tr.json.mjs";
|
|
13
11
|
import vi from "./vi.json.mjs";
|
|
14
12
|
import zh from "./zh.json.mjs";
|
|
13
|
+
import pl from "./pl.json.mjs";
|
|
14
|
+
import sv from "./sv.json.mjs";
|
|
15
15
|
var localizedMessages = {
|
|
16
16
|
de,
|
|
17
17
|
en,
|
package/lib/types/index.d.ts
CHANGED
|
@@ -1,9 +1,13 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { FadeInOutProps, SlideProps } from '@semcore/animation';
|
|
3
|
+
import { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';
|
|
4
|
+
import { PortalProps } from '@semcore/portal';
|
|
5
|
+
import { Box, BoxProps } from '@semcore/flex-box';
|
|
6
|
+
import { TextProps } from '@semcore/typography';
|
|
7
|
+
import Button from '@semcore/button';
|
|
6
8
|
|
|
9
|
+
/** @deprecated */
|
|
10
|
+
export interface IModalProps extends ModalProps, UnknownProperties {}
|
|
7
11
|
export type ModalProps = PortalProps &
|
|
8
12
|
BoxProps &
|
|
9
13
|
FadeInOutProps & {
|
|
@@ -27,16 +31,21 @@ export type ModalProps = PortalProps &
|
|
|
27
31
|
* @default false
|
|
28
32
|
*/
|
|
29
33
|
disablePreventScroll?: boolean;
|
|
30
|
-
|
|
34
|
+
|
|
31
35
|
locale?: string;
|
|
36
|
+
|
|
32
37
|
/**
|
|
33
38
|
* Props for render modal without background and paddings. Useful in carousel for example
|
|
34
39
|
*/
|
|
35
40
|
ghost?: boolean;
|
|
36
41
|
};
|
|
37
42
|
|
|
43
|
+
/** @deprecated */
|
|
44
|
+
export interface IWindowProps extends WindowProps, UnknownProperties {}
|
|
38
45
|
export type WindowProps = BoxProps & SlideProps & {};
|
|
39
46
|
|
|
47
|
+
/** @deprecated */
|
|
48
|
+
export interface IModalContext extends ModalContext, UnknownProperties {}
|
|
40
49
|
export type ModalContext = {
|
|
41
50
|
getOverlayProps: PropGetterFn;
|
|
42
51
|
getWindowProps: PropGetterFn;
|
|
@@ -47,7 +56,7 @@ declare const Modal: Intergalactic.Component<'div', ModalProps, ModalContext> &
|
|
|
47
56
|
Window: Intergalactic.Component<'div', WindowProps>;
|
|
48
57
|
Overlay: typeof Box;
|
|
49
58
|
Close: typeof Button;
|
|
50
|
-
Title: Intergalactic.Component<'div',
|
|
59
|
+
Title: Intergalactic.Component<'div', TextProps>;
|
|
51
60
|
};
|
|
52
61
|
|
|
53
62
|
export default Modal;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/modal",
|
|
3
3
|
"description": "Semrush Modal Component",
|
|
4
|
-
"version": "4.57.0-prerelease.
|
|
4
|
+
"version": "4.57.0-prerelease.4",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -14,17 +14,17 @@
|
|
|
14
14
|
"types": "./lib/types/index.d.ts"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@semcore/button": "5.44.0-prerelease.
|
|
18
|
-
"@semcore/animation": "2.42.0-prerelease.
|
|
19
|
-
"@semcore/flex-box": "5.42.0-prerelease.
|
|
20
|
-
"@semcore/icon": "4.63.0-prerelease.
|
|
21
|
-
"@semcore/outside-click": "3.41.0-prerelease.
|
|
22
|
-
"@semcore/portal": "3.42.0-prerelease.
|
|
23
|
-
"@semcore/typography": "5.54.0-prerelease.
|
|
24
|
-
"@semcore/utils": "4.49.0-prerelease.
|
|
17
|
+
"@semcore/button": "5.44.0-prerelease.4",
|
|
18
|
+
"@semcore/animation": "2.42.0-prerelease.4",
|
|
19
|
+
"@semcore/flex-box": "5.42.0-prerelease.4",
|
|
20
|
+
"@semcore/icon": "4.63.0-prerelease.4",
|
|
21
|
+
"@semcore/outside-click": "3.41.0-prerelease.4",
|
|
22
|
+
"@semcore/portal": "3.42.0-prerelease.4",
|
|
23
|
+
"@semcore/typography": "5.54.0-prerelease.4",
|
|
24
|
+
"@semcore/utils": "4.49.0-prerelease.4"
|
|
25
25
|
},
|
|
26
26
|
"peerDependencies": {
|
|
27
|
-
"@semcore/core": "^2.40.0-prerelease.
|
|
27
|
+
"@semcore/core": "^2.40.0-prerelease.4",
|
|
28
28
|
"react": "16.8 - 18",
|
|
29
29
|
"react-dom": "16.8 - 18"
|
|
30
30
|
},
|