@semcore/fullscreen-modal 16.1.13-prerelease.9 → 16.2.0-prerelease.0

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.
Files changed (19) hide show
  1. package/CHANGELOG.md +3 -3
  2. package/lib/cjs/FullscreenModal.js +154 -161
  3. package/lib/cjs/FullscreenModal.js.map +1 -1
  4. package/lib/cjs/index.d.js.map +1 -1
  5. package/lib/cjs/index.js +3 -3
  6. package/lib/cjs/style/fullscreen-modal.shadow.css +27 -12
  7. package/lib/cjs/translations/__intergalactic-dynamic-locales.js +16 -16
  8. package/lib/cjs/translations/__intergalactic-dynamic-locales.js.map +1 -1
  9. package/lib/es6/FullscreenModal.js +143 -150
  10. package/lib/es6/FullscreenModal.js.map +1 -1
  11. package/lib/es6/index.d.js.map +1 -1
  12. package/lib/es6/style/fullscreen-modal.shadow.css +27 -12
  13. package/lib/es6/translations/__intergalactic-dynamic-locales.js +15 -15
  14. package/lib/es6/translations/__intergalactic-dynamic-locales.js.map +1 -1
  15. package/lib/esm/FullscreenModal.mjs +124 -144
  16. package/lib/esm/style/fullscreen-modal.shadow.css +27 -12
  17. package/lib/esm/translations/__intergalactic-dynamic-locales.mjs +1 -1
  18. package/lib/types/index.d.ts +10 -2
  19. package/package.json +9 -10
package/lib/es6/translations/__intergalactic-dynamic-locales.js CHANGED
@@ -12,20 +12,20 @@ import sv from './sv.json';
12
12
  import tr from './tr.json';
13
13
  import vi from './vi.json';
14
14
  import zh from './zh.json';
15
- export const localizedMessages = {
16
- de,
17
- en,
18
- es,
19
- fr,
20
- it,
21
- ja,
22
- ko,
23
- nl,
24
- pt,
25
- tr,
26
- vi,
27
- zh,
28
- pl,
29
- sv
15
+ export var localizedMessages = {
16
+ de: de,
17
+ en: en,
18
+ es: es,
19
+ fr: fr,
20
+ it: it,
21
+ ja: ja,
22
+ ko: ko,
23
+ nl: nl,
24
+ pt: pt,
25
+ tr: tr,
26
+ vi: vi,
27
+ zh: zh,
28
+ pl: pl,
29
+ sv: sv
30
30
  };
31
31
  //# sourceMappingURL=__intergalactic-dynamic-locales.js.map
package/lib/es6/translations/__intergalactic-dynamic-locales.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"__intergalactic-dynamic-locales.js","names":["de","en","es","fr","it","ja","ko","nl","pl","pt","sv","tr","vi","zh","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 pl from './pl.json';\nimport pt from './pt.json';\nimport sv from './sv.json';\nimport tr from './tr.json';\nimport vi from './vi.json';\nimport zh from './zh.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,MAAMC,iBAAiB,GAAG;EAC/Bd,EAAE;EACFC,EAAE;EACFC,EAAE;EACFC,EAAE;EACFC,EAAE;EACFC,EAAE;EACFC,EAAE;EACFC,EAAE;EACFE,EAAE;EACFE,EAAE;EACFC,EAAE;EACFC,EAAE;EACFL,EAAE;EACFE;AACF,CAAC","ignoreList":[]}
1
+ {"version":3,"file":"__intergalactic-dynamic-locales.js","names":["de","en","es","fr","it","ja","ko","nl","pl","pt","sv","tr","vi","zh","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 pl from './pl.json';\nimport pt from './pt.json';\nimport sv from './sv.json';\nimport tr from './tr.json';\nimport vi from './vi.json';\nimport zh from './zh.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;EACFE,EAAE,EAAFA,EAAE;EACFE,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFL,EAAE,EAAFA,EAAE;EACFE,EAAE,EAAFA;AACF,CAAC","ignoreList":[]}
package/lib/esm/FullscreenModal.mjs CHANGED
@@ -1,10 +1,15 @@
1
+ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
2
+ import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
3
+ import _createClass from "@babel/runtime/helpers/esm/createClass";
4
+ import _callSuper from "@babel/runtime/helpers/esm/callSuper";
5
+ import _inherits from "@babel/runtime/helpers/esm/inherits";
1
6
  import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
2
- import { createComponent, sstyled, Component, assignProps } from "@semcore/core";
3
- import { Box, Flex } from "@semcore/base-components";
7
+ import { createComponent, sstyled, assignProps, Component } from "@semcore/core";
4
8
  import Button from "@semcore/button";
5
9
  import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
6
10
  import fire from "@semcore/core/lib/utils/fire";
7
11
  import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
12
+ import { Box, Flex } from "@semcore/flex-box";
8
13
  import ArrowLeft from "@semcore/icon/ArrowLeft/m";
9
14
  import CloseIcon from "@semcore/icon/Close/l";
10
15
  import Modal from "@semcore/modal";
@@ -12,97 +17,100 @@ import { Text } from "@semcore/typography";
12
17
  import React from "react";
13
18
  import { localizedMessages } from "./translations/__intergalactic-dynamic-locales.mjs";
14
19
  /*!__reshadow-styles__:"./style/fullscreen-modal.shadow.css"*/
15
- const style = (
20
+ var style = (
16
21
  /*__reshadow_css_start__*/
17
22
  (sstyled.insert(
18
23
  /*__inner_css_start__*/
19
- ".___SFullscreenModal_16ww4_gg_,.___SFullscreenOverlay_16ww4_gg_>div{padding:0;width:100%;height:100%}.___SFullscreenModal_16ww4_gg_{display:flex;flex-direction:column;background:var(--intergalactic-bg-primary-neutral, #ffffff);border-radius:0}.___SClose_16ww4_gg_{position:absolute;top:17px;right:24px}.___SBack_16ww4_gg_{cursor:pointer;position:absolute;z-index:1;top:8px;left:32px;display:flex;align-items:center;margin-bottom:var(--intergalactic-spacing-3x, 12px);color:var(--intergalactic-icon-primary-neutral, #6c6e79);font-size:var(--intergalactic-fs-100, 12px);line-height:var(--intergalactic-lh-100, 133%);background:0 0;padding:0;border:0;outline:0}@media (hover:hover){.___SBack_16ww4_gg_:hover{color:var(--intergalactic-icon-primary-neutral-hover-active, #565861)}}.___SBackText_16ww4_gg_{margin-left:var(--intergalactic-spacing-1x, 4px);font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.___SDescription_16ww4_gg_,.___STitle_16ww4_gg_{word-wrap:break-word}.___STitle_16ww4_gg_{font-size:var(--intergalactic-fs-500, 24px);line-height:var(--intergalactic-lh-500, 117%);font-weight:var(--intergalactic-bold, 700);color:var(--intergalactic-text-primary, #191b23)}.___SDescription_16ww4_gg_{font-size:var(--intergalactic-fs-100, 12px);line-height:var(--intergalactic-lh-100, 133%);color:var(--intergalactic-text-secondary, #6c6e79)}.___SHeader_16ww4_gg_{display:flex;flex-direction:column;gap:var(--intergalactic-spacing-2x, 8px);align-items:flex-start;padding-left:var(--intergalactic-spacing-8x, 32px);padding-bottom:var(--intergalactic-spacing-4x, 16px);padding-right:calc(var(--intergalactic-spacing-20x, 80px) - var(--intergalactic-spacing-2x, 8px));padding-top:var(--intergalactic-spacing-10x, 40px);box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, #c4c7cf);box-sizing:border-box}.___SFooter_16ww4_gg_{min-height:52px;box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary, #c4c7cf);box-sizing:border-box}.___SBody_16ww4_gg_{display:flex;height:100%;overflow:auto}.___SSection_16ww4_gg_{padding-top:var(--intergalactic-spacing-6x, 24px);padding-bottom:var(--intergalactic-spacing-6x, 24px);padding-left:var(--intergalactic-spacing-8x, 32px);padding-right:var(--intergalactic-spacing-8x, 32px);flex:1 1 auto}@media (prefers-reduced-motion){.___SBackText_16ww4_gg_{transition:none}}",
24
+ '.___SFullscreenModal_1hufr_gg_,.___SFullscreenOverlay_1hufr_gg_>div{padding:0;width:100%;height:100%}.___SFullscreenModal_1hufr_gg_{display:flex;flex-direction:column;background:var(--intergalactic-bg-primary-neutral, rgb(255, 255, 255));border-radius:0}.___SClose_1hufr_gg_{position:absolute;top:17px;right:24px}.___SBack_1hufr_gg_{cursor:pointer;position:absolute;z-index:1;top:8px;left:32px;display:flex;align-items:center;margin-bottom:var(--intergalactic-spacing-3x, 12px);color:var(--intergalactic-icon-primary-neutral, rgba(0, 4, 1, 0.526));font-size:var(--intergalactic-fs-100, 12px);line-height:var(--intergalactic-lh-100, 133%);background:0 0;padding:0;border:0;outline:0}@media (hover:hover){.___SBack_1hufr_gg_:hover{color:var(--intergalactic-icon-primary-neutral-hover-active, rgba(0, 3, 0, 0.583))}@supports (color:color(display-p3 0 0 0%)){.___SBack_1hufr_gg_:hover{color:var(--intergalactic-icon-primary-neutral-hover-active, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___SBack_1hufr_gg_:hover{color:var(--intergalactic-icon-primary-neutral-hover-active, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}}.___SBackText_1hufr_gg_{margin-left:var(--intergalactic-spacing-1x, 4px);font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___SBackText_1hufr_gg_,.___SDescription_1hufr_gg_,.___STitle_1hufr_gg_{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.___STitle_1hufr_gg_{font-size:var(--intergalactic-fs-500, 24px);line-height:var(--intergalactic-lh-500, 117%);font-weight:var(--intergalactic-bold, 700);color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}.___SDescription_1hufr_gg_{display:flex;align-items:baseline;font-size:var(--intergalactic-fs-100, 12px);line-height:var(--intergalactic-lh-100, 133%);color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583))}@supports (color:color(display-p3 0 0 0%)){.___SDescription_1hufr_gg_{color:var(--intergalactic-text-secondary, rgba(0, 3, 0, 0.583))}@media (color-gamut:p3){.___SDescription_1hufr_gg_{color:var(--intergalactic-text-secondary, color(display-p3 0.00228 0.01289 0.00252 / 0.583))}}}.___SDescription_1hufr_gg_::before{content:"";position:relative;top:var(--intergalactic-spacing-1x, 4px);display:block;margin-left:var(--intergalactic-spacing-3x, 12px);margin-right:var(--intergalactic-spacing-3x, 12px);height:24px;width:1px;background-color:var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@supports (color:color(display-p3 0 0 0%)){.___SDescription_1hufr_gg_::before{background-color:var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SDescription_1hufr_gg_::before{background-color:var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SHeader_1hufr_gg_{display:flex;align-items:baseline;padding-left:var(--intergalactic-spacing-8x, 32px);padding-bottom:var(--intergalactic-spacing-2x, 8px);padding-right:calc(var(--intergalactic-spacing-20x, 80px) - var(--intergalactic-spacing-2x, 8px));padding-top:var(--intergalactic-spacing-10x, 40px);min-height:76px;box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161));box-sizing:border-box}@supports (color:color(display-p3 0 0 0%)){.___SHeader_1hufr_gg_{box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SHeader_1hufr_gg_{box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SFooter_1hufr_gg_{min-height:52px;box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161));box-sizing:border-box}@supports (color:color(display-p3 0 0 0%)){.___SFooter_1hufr_gg_{box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SFooter_1hufr_gg_{box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SBody_1hufr_gg_{display:flex;height:100%;overflow:auto}.___SSection_1hufr_gg_{padding-top:var(--intergalactic-spacing-6x, 24px);padding-bottom:var(--intergalactic-spacing-6x, 24px);padding-left:var(--intergalactic-spacing-8x, 32px);padding-right:var(--intergalactic-spacing-8x, 32px);flex:1 1 auto}@media (prefers-reduced-motion){.___SBackText_1hufr_gg_{transition:none}}',
20
25
  /*__inner_css_end__*/
21
- "16ww4_gg_"
26
+ "1hufr_gg_"
22
27
  ), /*__reshadow_css_end__*/
23
28
  {
24
- "__SFullscreenModal": "___SFullscreenModal_16ww4_gg_",
25
- "__SClose": "___SClose_16ww4_gg_",
26
- "__SBackText": "___SBackText_16ww4_gg_",
27
- "__STitle": "___STitle_16ww4_gg_",
28
- "__SDescription": "___SDescription_16ww4_gg_",
29
- "__SHeader": "___SHeader_16ww4_gg_",
30
- "__SFooter": "___SFooter_16ww4_gg_",
31
- "__SBody": "___SBody_16ww4_gg_",
32
- "__SSection": "___SSection_16ww4_gg_",
33
- "__SFullscreenOverlay": "___SFullscreenOverlay_16ww4_gg_",
34
- "__SBack": "___SBack_16ww4_gg_"
29
+ "__SFullscreenModal": "___SFullscreenModal_1hufr_gg_",
30
+ "__SClose": "___SClose_1hufr_gg_",
31
+ "__SBackText": "___SBackText_1hufr_gg_",
32
+ "__STitle": "___STitle_1hufr_gg_",
33
+ "__SDescription": "___SDescription_1hufr_gg_",
34
+ "__SHeader": "___SHeader_1hufr_gg_",
35
+ "__SFooter": "___SFooter_1hufr_gg_",
36
+ "__SBody": "___SBody_1hufr_gg_",
37
+ "__SSection": "___SSection_1hufr_gg_",
38
+ "__SFullscreenOverlay": "___SFullscreenOverlay_1hufr_gg_",
39
+ "__SBack": "___SBack_1hufr_gg_"
35
40
  })
36
41
  );
37
- class FullscreenModalRoot extends Component {
38
- constructor(...args) {
39
- super(...args);
40
- _defineProperty(this, "state", {
42
+ var FullscreenModalRoot = /* @__PURE__ */ (function(_Component) {
43
+ function FullscreenModalRoot2() {
44
+ var _this;
45
+ _classCallCheck(this, FullscreenModalRoot2);
46
+ for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
47
+ args[_key] = arguments[_key];
48
+ }
49
+ _this = _callSuper(this, FullscreenModalRoot2, [].concat(args));
50
+ _defineProperty(_this, "state", {
41
51
  hasTitle: false
42
52
  });
43
- _defineProperty(this, "bindHandlerClose", (trigger) => (e) => {
44
- fire(this, "onClose", trigger, e);
53
+ _defineProperty(_this, "bindHandlerClose", function(trigger) {
54
+ return function(e) {
55
+ fire(_this, "onClose", trigger, e);
56
+ };
45
57
  });
58
+ return _this;
46
59
  }
47
- getCloseProps() {
48
- const {
49
- getI18nText
50
- } = this.asProps;
51
- return {
52
- onClick: this.bindHandlerClose("onCloseClick"),
53
- getI18nText
54
- };
55
- }
56
- getBackProps() {
57
- return {
58
- onClick: this.bindHandlerClose("onBackClick")
59
- };
60
- }
61
- getTitleProps() {
62
- const {
63
- uid
64
- } = this.asProps;
65
- const setHasTitle = () => this.setState({
66
- hasTitle: true
67
- });
68
- return {
69
- id: `igc-${uid}-title`,
70
- setHasTitle
71
- };
72
- }
73
- render() {
74
- var _ref = this.asProps, _ref0;
75
- const SFullscreenModal = Modal.Window;
76
- const {
77
- styles,
78
- Children,
79
- onClose,
80
- visible,
81
- closable,
82
- duration,
83
- disablePortal,
84
- getI18nText,
85
- uid
86
- } = this.asProps;
87
- const {
88
- hasTitle
89
- } = this.state;
90
- const SFullscreenOverlay = Modal.Overlay;
91
- return _ref0 = sstyled(styles), /* @__PURE__ */ React.createElement(Modal, _ref0.cn("Modal", {
92
- "closable": false,
93
- "visible": visible,
94
- "onClose": onClose,
95
- "duration": duration,
96
- "disablePortal": disablePortal
97
- }), /* @__PURE__ */ React.createElement(SFullscreenOverlay, _ref0.cn("SFullscreenOverlay", {}), /* @__PURE__ */ React.createElement(SFullscreenModal, _ref0.cn("SFullscreenModal", {
98
- ...assignProps({
60
+ _inherits(FullscreenModalRoot2, _Component);
61
+ return _createClass(FullscreenModalRoot2, [{
62
+ key: "getCloseProps",
63
+ value: function getCloseProps() {
64
+ var getI18nText = this.asProps.getI18nText;
65
+ return {
66
+ onClick: this.bindHandlerClose("onCloseClick"),
67
+ getI18nText
68
+ };
69
+ }
70
+ }, {
71
+ key: "getBackProps",
72
+ value: function getBackProps() {
73
+ return {
74
+ onClick: this.bindHandlerClose("onBackClick")
75
+ };
76
+ }
77
+ }, {
78
+ key: "getTitleProps",
79
+ value: function getTitleProps() {
80
+ var _this2 = this;
81
+ var uid = this.asProps.uid;
82
+ var setHasTitle = function setHasTitle2() {
83
+ return _this2.setState({
84
+ hasTitle: true
85
+ });
86
+ };
87
+ return {
88
+ id: "igc-".concat(uid, "-title"),
89
+ setHasTitle
90
+ };
91
+ }
92
+ }, {
93
+ key: "render",
94
+ value: function render() {
95
+ var _ref = this.asProps, _ref0;
96
+ var SFullscreenModal = Modal.Window;
97
+ var _this$asProps = this.asProps, styles = _this$asProps.styles, Children = _this$asProps.Children, onClose = _this$asProps.onClose, visible = _this$asProps.visible, closable = _this$asProps.closable, duration = _this$asProps.duration, disablePortal = _this$asProps.disablePortal, getI18nText = _this$asProps.getI18nText, uid = _this$asProps.uid;
98
+ var hasTitle = this.state.hasTitle;
99
+ var SFullscreenOverlay = Modal.Overlay;
100
+ return _ref0 = sstyled(styles), /* @__PURE__ */ React.createElement(Modal, _ref0.cn("Modal", {
101
+ "closable": false,
102
+ "visible": visible,
103
+ "onClose": onClose,
104
+ "duration": duration,
105
+ "disablePortal": disablePortal
106
+ }), /* @__PURE__ */ React.createElement(SFullscreenOverlay, _ref0.cn("SFullscreenOverlay", {}), /* @__PURE__ */ React.createElement(SFullscreenModal, _ref0.cn("SFullscreenModal", _objectSpread({}, assignProps({
99
107
  "use:closable": false,
100
108
  "aria-label": hasTitle ? void 0 : getI18nText("title"),
101
- "aria-labelledby": hasTitle ? `igc-${uid}-title` : void 0
102
- }, _ref)
103
- }), closable && /* @__PURE__ */ React.createElement(FullscreenModal.Close, null), /* @__PURE__ */ React.createElement(Children, _ref0.cn("Children", {})))));
104
- }
105
- }
109
+ "aria-labelledby": hasTitle ? "igc-".concat(uid, "-title") : void 0
110
+ }, _ref))), closable && /* @__PURE__ */ React.createElement(FullscreenModal.Close, null), /* @__PURE__ */ React.createElement(Children, _ref0.cn("Children", {})))));
111
+ }
112
+ }]);
113
+ })(Component);
106
114
  _defineProperty(FullscreenModalRoot, "displayName", "FullscreenModal");
107
115
  _defineProperty(FullscreenModalRoot, "style", style);
108
116
  _defineProperty(FullscreenModalRoot, "enhance", [i18nEnhance(localizedMessages), uniqueIDEnhancement()]);
@@ -112,16 +120,9 @@ _defineProperty(FullscreenModalRoot, "defaultProps", {
112
120
  });
113
121
  function Header(props) {
114
122
  var _ref2 = arguments[0], _ref1;
115
- const SHeader = Box;
116
- const {
117
- Children,
118
- styles,
119
- title,
120
- description
121
- } = props;
122
- return _ref1 = sstyled(styles), /* @__PURE__ */ React.createElement(SHeader, _ref1.cn("SHeader", {
123
- ...assignProps({}, _ref2)
124
- }), title && /* @__PURE__ */ React.createElement(FullscreenModal.Title, {
123
+ var SHeader = Box;
124
+ var Children = props.Children, styles = props.styles, title = props.title, description = props.description;
125
+ return _ref1 = sstyled(styles), /* @__PURE__ */ React.createElement(SHeader, _ref1.cn("SHeader", _objectSpread({}, assignProps({}, _ref2))), title && /* @__PURE__ */ React.createElement(FullscreenModal.Title, {
125
126
  children: title
126
127
  }), description && /* @__PURE__ */ React.createElement(FullscreenModal.Description, {
127
128
  children: description
@@ -129,41 +130,31 @@ function Header(props) {
129
130
  }
130
131
  function Body(props) {
131
132
  var _ref3 = arguments[0], _ref10;
132
- const SBody = Box;
133
- return _ref10 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SBody, _ref10.cn("SBody", {
134
- ...assignProps({}, _ref3)
135
- }));
133
+ var SBody = Box;
134
+ return _ref10 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SBody, _ref10.cn("SBody", _objectSpread({}, assignProps({}, _ref3))));
136
135
  }
137
136
  function Section(props) {
138
137
  var _ref4 = arguments[0], _ref11;
139
- const SSection = Box;
140
- return _ref11 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SSection, _ref11.cn("SSection", {
141
- ...assignProps({
142
- "tag": "section"
143
- }, _ref4)
144
- }));
138
+ var SSection = Box;
139
+ return _ref11 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SSection, _ref11.cn("SSection", _objectSpread({}, assignProps({
140
+ "tag": "section"
141
+ }, _ref4))));
145
142
  }
146
143
  function Footer(props) {
147
144
  var _ref5 = arguments[0], _ref12;
148
- const SFooter = Flex;
149
- return _ref12 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SFooter, _ref12.cn("SFooter", {
150
- ...assignProps({}, _ref5)
151
- }));
145
+ var SFooter = Flex;
146
+ return _ref12 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SFooter, _ref12.cn("SFooter", _objectSpread({}, assignProps({}, _ref5))));
152
147
  }
153
148
  function Close(props) {
154
149
  var _ref6 = arguments[0], _ref13;
155
- const SClose = Button;
156
- const {
157
- getI18nText
158
- } = props;
159
- return _ref13 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SClose, _ref13.cn("SClose", {
160
- ...assignProps({
161
- "use": "tertiary",
162
- "size": "l",
163
- "theme": "muted",
164
- "aria-label": getI18nText("close")
165
- }, _ref6)
166
- }), /* @__PURE__ */ React.createElement(Button.Addon, {
150
+ var SClose = Button;
151
+ var getI18nText = props.getI18nText;
152
+ return _ref13 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SClose, _ref13.cn("SClose", _objectSpread({}, assignProps({
153
+ "use": "tertiary",
154
+ "size": "l",
155
+ "theme": "muted",
156
+ "aria-label": getI18nText("close")
157
+ }, _ref6))), /* @__PURE__ */ React.createElement(Button.Addon, {
167
158
  ml: "7px",
168
159
  mr: "7px"
169
160
  }, /* @__PURE__ */ React.createElement(CloseIcon, _ref13.cn("CloseIcon", {
@@ -172,42 +163,31 @@ function Close(props) {
172
163
  }
173
164
  function Title(props) {
174
165
  var _ref7 = arguments[0], _ref14;
175
- const STitle = Text;
176
- const {
177
- setHasTitle
178
- } = props;
179
- React.useEffect(() => setHasTitle());
180
- return _ref14 = sstyled(props.styles), /* @__PURE__ */ React.createElement(STitle, _ref14.cn("STitle", {
181
- ...assignProps({
182
- "tag": "h2"
183
- }, _ref7)
184
- }));
166
+ var STitle = Text;
167
+ var setHasTitle = props.setHasTitle;
168
+ React.useEffect(function() {
169
+ return setHasTitle();
170
+ });
171
+ return _ref14 = sstyled(props.styles), /* @__PURE__ */ React.createElement(STitle, _ref14.cn("STitle", _objectSpread({}, assignProps({
172
+ "tag": "h2"
173
+ }, _ref7))));
185
174
  }
186
175
  function Description(props) {
187
176
  var _ref8 = arguments[0], _ref15;
188
- const SDescription = Text;
189
- return _ref15 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SDescription, _ref15.cn("SDescription", {
190
- ...assignProps({
191
- "tag": "p"
192
- }, _ref8)
193
- }));
177
+ var SDescription = Text;
178
+ return _ref15 = sstyled(props.styles), /* @__PURE__ */ React.createElement(SDescription, _ref15.cn("SDescription", _objectSpread({}, assignProps({}, _ref8))));
194
179
  }
195
180
  function Back(props) {
196
181
  var _ref9 = arguments[0], _ref16;
197
- const SBack = Box;
198
- const SBackText = Text;
199
- const {
200
- Children,
201
- styles
202
- } = props;
203
- return _ref16 = sstyled(styles), /* @__PURE__ */ React.createElement(SBack, _ref16.cn("SBack", {
204
- ...assignProps({
205
- "tag": "button",
206
- "tabIndex": 0
207
- }, _ref9)
208
- }), /* @__PURE__ */ React.createElement(ArrowLeft, _ref16.cn("ArrowLeft", {})), /* @__PURE__ */ React.createElement(SBackText, _ref16.cn("SBackText", {}), /* @__PURE__ */ React.createElement(Children, _ref16.cn("Children", {}))));
182
+ var SBack = Box;
183
+ var SBackText = Text;
184
+ var Children = props.Children, styles = props.styles;
185
+ return _ref16 = sstyled(styles), /* @__PURE__ */ React.createElement(SBack, _ref16.cn("SBack", _objectSpread({}, assignProps({
186
+ "tag": "button",
187
+ "tabIndex": 0
188
+ }, _ref9))), /* @__PURE__ */ React.createElement(ArrowLeft, _ref16.cn("ArrowLeft", {})), /* @__PURE__ */ React.createElement(SBackText, _ref16.cn("SBackText", {}), /* @__PURE__ */ React.createElement(Children, _ref16.cn("Children", {}))));
209
189
  }
210
- const FullscreenModal = createComponent(FullscreenModalRoot, {
190
+ var FullscreenModal = createComponent(FullscreenModalRoot, {
211
191
  Header,
212
192
  Footer,
213
193
  Close,
package/lib/esm/style/fullscreen-modal.shadow.css CHANGED
@@ -11,7 +11,7 @@ SFullscreenModal {
11
11
  display: flex;
12
12
  flex-direction: column;
13
13
  width: 100%;
14
- background: var(--intergalactic-bg-primary-neutral, #ffffff);
14
+ background: var(--intergalactic-bg-primary-neutral, oklch(1 0 0));
15
15
  border-radius: 0;
16
16
  padding: 0;
17
17
  }
@@ -31,7 +31,7 @@ SBack {
31
31
  display: flex;
32
32
  align-items: center;
33
33
  margin-bottom: var(--intergalactic-spacing-3x, 12px);
34
- color: var(--intergalactic-icon-primary-neutral, #6c6e79);
34
+ color: var(--intergalactic-icon-primary-neutral, oklch(0.092 0.024 152.2 / 0.526));
35
35
  font-size: var(--intergalactic-fs-100, 12px);
36
36
  line-height: var(--intergalactic-lh-100, 133%);
37
37
  background: none;
@@ -40,7 +40,7 @@ SBack {
40
40
  outline: none;
41
41
 
42
42
  &:hover {
43
- color: var(--intergalactic-icon-primary-neutral-hover-active, #565861);
43
+ color: var(--intergalactic-icon-primary-neutral-hover-active, oklch(0.088 0.026 147.7 / 0.583));
44
44
  }
45
45
  }
46
46
 
@@ -55,40 +55,55 @@ SBackText {
55
55
 
56
56
  STitle,
57
57
  SDescription {
58
- overflow-wrap: break-word;
58
+ white-space: nowrap;
59
+ overflow: hidden;
60
+ text-overflow: ellipsis;
59
61
  }
60
62
 
61
63
  STitle {
62
64
  font-size: var(--intergalactic-fs-500, 24px);
63
65
  line-height: var(--intergalactic-lh-500, 117%);
64
66
  font-weight: var(--intergalactic-bold, 700);
65
- color: var(--intergalactic-text-primary, #191b23);
67
+ color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
66
68
  }
67
69
 
68
70
  SDescription {
71
+ display: flex;
72
+ align-items: baseline;
69
73
  font-size: var(--intergalactic-fs-100, 12px);
70
74
  line-height: var(--intergalactic-lh-100, 133%);
71
- color: var(--intergalactic-text-secondary, #6c6e79);
75
+ color: var(--intergalactic-text-secondary, oklch(0.088 0.026 147.7 / 0.583));
76
+
77
+ &::before {
78
+ content: '';
79
+ position: relative;
80
+ top: var(--intergalactic-spacing-1x, 4px);
81
+ display: block;
82
+ margin-left: var(--intergalactic-spacing-3x, 12px);
83
+ margin-right: var(--intergalactic-spacing-3x, 12px);
84
+ height: 24px;
85
+ width: 1px;
86
+ background-color: var(--intergalactic-border-primary, oklch(0.137 0.026 175.7 / 0.161));
87
+ }
72
88
  }
73
89
 
74
90
  SHeader {
75
91
  display: flex;
76
- flex-direction: column;
77
- gap: var(--intergalactic-spacing-2x, 8px);
78
- align-items: flex-start;
92
+ align-items: baseline;
79
93
  padding-left: var(--intergalactic-spacing-8x, 32px);
80
- padding-bottom: var(--intergalactic-spacing-4x, 16px);
94
+ padding-bottom: var(--intergalactic-spacing-2x, 8px);
81
95
  padding-right: calc(
82
96
  var(--intergalactic-spacing-20x, 80px) - var(--intergalactic-spacing-2x, 8px)
83
97
  );
84
98
  padding-top: var(--intergalactic-spacing-10x, 40px);
85
- box-shadow: inset 0 -1px 0 var(--intergalactic-border-primary, #c4c7cf);
99
+ min-height: 76px;
100
+ box-shadow: inset 0 -1px 0 var(--intergalactic-border-primary, oklch(0.137 0.026 175.7 / 0.161));
86
101
  box-sizing: border-box;
87
102
  }
88
103
 
89
104
  SFooter {
90
105
  min-height: 52px;
91
- box-shadow: inset 0 1px 1px 0 var(--intergalactic-border-primary, #c4c7cf);
106
+ box-shadow: inset 0 1px 1px 0 var(--intergalactic-border-primary, oklch(0.137 0.026 175.7 / 0.161));
92
107
  box-sizing: border-box;
93
108
  }
94
109
 
package/lib/esm/translations/__intergalactic-dynamic-locales.mjs CHANGED
@@ -12,7 +12,7 @@ import sv from "./sv.json.mjs";
12
12
  import tr from "./tr.json.mjs";
13
13
  import vi from "./vi.json.mjs";
14
14
  import zh from "./zh.json.mjs";
15
- const localizedMessages = {
15
+ var localizedMessages = {
16
16
  de,
17
17
  en,
18
18
  es,
package/lib/types/index.d.ts CHANGED
@@ -1,9 +1,11 @@
1
- import type { Flex, Box, BoxProps } from '@semcore/base-components';
2
1
  import type Button from '@semcore/button';
3
- import type { PropGetterFn, Intergalactic } from '@semcore/core';
2
+ import type { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';
3
+ import type { Flex, Box, BoxProps } from '@semcore/flex-box';
4
4
  import type { ModalProps } from '@semcore/modal';
5
5
  import type { Text } from '@semcore/typography';
6
6
 
7
+ /** @deprecated */
8
+ export interface IFullscreenModalProps extends FullscreenModalProps, UnknownProperties {}
7
9
  export type FullscreenModalProps = ModalProps & {
8
10
  /** Function that is invoked when hiding a component */
9
11
  onClose?: (
@@ -12,6 +14,10 @@ export type FullscreenModalProps = ModalProps & {
12
14
  ) => void;
13
15
  };
14
16
 
17
+ /** @deprecated */
18
+ export interface IFullscreenModalHeaderProps
19
+ extends FullscreenModalHeaderProps,
20
+ UnknownProperties {}
15
21
  export type FullscreenModalHeaderProps = BoxProps & {
16
22
  /** Title content displayed in the modal header */
17
23
  title?: React.ReactNode;
@@ -19,6 +25,8 @@ export type FullscreenModalHeaderProps = BoxProps & {
19
25
  description?: React.ReactNode;
20
26
  };
21
27
 
28
+ /** @deprecated */
29
+ export interface IFullscreenModalContext extends FullscreenModalContext, UnknownProperties {}
22
30
  export type FullscreenModalContext = {
23
31
  getBackProps: PropGetterFn;
24
32
  getCloseProps: PropGetterFn;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/fullscreen-modal",
3
3
  "description": "Semrush FullscreenModal Component",
4
- "version": "16.1.13-prerelease.9",
4
+ "version": "16.2.0-prerelease.0",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es6/index.js",
7
7
  "typings": "lib/types/index.d.ts",
@@ -14,13 +14,14 @@
14
14
  "types": "./lib/types/index.d.ts"
15
15
  },
16
16
  "dependencies": {
17
- "@semcore/modal": "16.1.12",
18
- "@semcore/typography": "16.3.3-prerelease.9",
19
- "@semcore/button": "16.0.13-prerelease.9"
17
+ "@semcore/icon": "16.8.0-prerelease.0",
18
+ "@semcore/modal": "16.2.0-prerelease.0",
19
+ "@semcore/typography": "16.4.0-prerelease.0",
20
+ "@semcore/button": "16.1.0-prerelease.0",
21
+ "@semcore/flex-box": "16.1.0-prerelease.0"
20
22
  },
21
23
  "peerDependencies": {
22
- "@semcore/base-components": "^16.4.3-prerelease.9",
23
- "@semcore/icon": "^16.7.2-prerelease.9"
24
+ "@semcore/base-components": "^16.6.0-prerelease.0"
24
25
  },
25
26
  "repository": {
26
27
  "type": "git",
@@ -28,10 +29,8 @@
28
29
  "directory": "semcore/fullscreen-modal"
29
30
  },
30
31
  "devDependencies": {
31
- "@semcore/core": "16.5.1",
32
- "@semcore/base-components": "16.4.3-prerelease.9",
33
- "@semcore/testing-utils": "1.0.0",
34
- "@semcore/icon": "16.7.2-prerelease.9"
32
+ "@semcore/core": "16.6.0-prerelease.0",
33
+ "@semcore/testing-utils": "1.0.0"
35
34
  },
36
35
  "scripts": {
37
36
  "build": "pnpm semcore-builder --source=js && pnpm vite build"