@semcore/fullscreen-modal 17.1.0-prerelease.3 → 17.2.0-prerelease.3
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/CHANGELOG.md +10 -0
- package/lib/cjs/FullscreenModal.js +27 -18
- package/lib/cjs/FullscreenModal.js.map +1 -1
- package/lib/cjs/style/fullscreen-modal.shadow.css +0 -22
- package/lib/es6/FullscreenModal.js +26 -18
- package/lib/es6/FullscreenModal.js.map +1 -1
- package/lib/es6/style/fullscreen-modal.shadow.css +0 -22
- package/lib/esm/FullscreenModal.mjs +22 -20
- package/lib/esm/style/fullscreen-modal.shadow.css +0 -22
- package/package.json +7 -7
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,16 @@
|
|
|
2
2
|
|
|
3
3
|
CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
|
|
4
4
|
|
|
5
|
+
## [17.2.0] - 2026-06-05
|
|
6
|
+
|
|
7
|
+
### Changed
|
|
8
|
+
|
|
9
|
+
- Replaced css-ellipsis with our `Ellipsis` in `Text`.
|
|
10
|
+
|
|
11
|
+
### Added
|
|
12
|
+
|
|
13
|
+
- Links to the API and examples in the docs.
|
|
14
|
+
|
|
5
15
|
## [17.1.0] - 2026-05-13
|
|
6
16
|
|
|
7
17
|
### Added
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
3
4
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
@@ -8,7 +9,7 @@ exports.default = void 0;
|
|
|
8
9
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
10
|
var _core = require("@semcore/core");
|
|
10
11
|
var _baseComponents = require("@semcore/base-components");
|
|
11
|
-
var _button =
|
|
12
|
+
var _button = _interopRequireWildcard(require("@semcore/button"));
|
|
12
13
|
var _i18nEnhance = _interopRequireDefault(require("@semcore/core/lib/utils/enhances/i18nEnhance"));
|
|
13
14
|
var _fire = _interopRequireDefault(require("@semcore/core/lib/utils/fire"));
|
|
14
15
|
var _uniqueID = _interopRequireDefault(require("@semcore/core/lib/utils/uniqueID"));
|
|
@@ -19,20 +20,20 @@ var _typography = require("@semcore/typography");
|
|
|
19
20
|
var _react = _interopRequireDefault(require("react"));
|
|
20
21
|
var _intergalacticDynamicLocales = require("./translations/__intergalactic-dynamic-locales");
|
|
21
22
|
/*!__reshadow-styles__:"./style/fullscreen-modal.shadow.css"*/
|
|
22
|
-
const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".
|
|
23
|
+
const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SFullscreenModal_9rvfy_gg_,.___SFullscreenOverlay_9rvfy_gg_>div{padding:0;width:100%;height:100%}.___SFullscreenModal_9rvfy_gg_{display:flex;flex-direction:column;background:var(--intergalactic-bg-primary-neutral,#fff);border-radius:0}.___SClose_9rvfy_gg_{position:absolute;top:17px;right:24px}.___SBack_9rvfy_gg_{cursor:pointer;position:absolute;z-index:1;top:8px;left:32px;margin-bottom:var(--intergalactic-spacing-3x,12px)}.___SDescription_9rvfy_gg_,.___STitle_9rvfy_gg_{word-wrap:break-word}.___STitle_9rvfy_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,#010500e5)}.___SDescription_9rvfy_gg_{font-size:var(--intergalactic-fs-100,12px);line-height:var(--intergalactic-lh-100,133%);color:var(--intergalactic-text-secondary,#00030095)}@supports (color:color(display-p3 0 0 0%)){.___SDescription_9rvfy_gg_{color:var(--intergalactic-text-secondary,#00030095)}@media (color-gamut:p3){.___SDescription_9rvfy_gg_{color:var(--intergalactic-text-secondary,color(display-p3 .00228 .01289 .00252/.583))}}}.___SHeader_9rvfy_gg_{display:flex;flex-direction:column;gap:var(--intergalactic-spacing-2x,8px);align-items:flex-start;padding:var(--intergalactic-spacing-10x,40px) calc(var(--intergalactic-spacing-20x, 80px) - var(--intergalactic-spacing-2x, 8px)) var(--intergalactic-spacing-4x,16px) var(--intergalactic-spacing-8x,32px);box-shadow:inset 0 -1px 0 var(--intergalactic-border-primary,#000c0829);box-sizing:border-box}@supports (color:color(display-p3 0 0 0%)){.___SHeader_9rvfy_gg_{box-shadow:inset 0 -1px 0 var(--intergalactic-border-primary,#000c0829)}@media (color-gamut:p3){.___SHeader_9rvfy_gg_{box-shadow:inset 0 -1px 0 var(--intergalactic-border-primary,color(display-p3 .00798 .04498 .03219/.161))}}}.___SFooter_9rvfy_gg_{min-height:52px;box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary,#000c0829);box-sizing:border-box}@supports (color:color(display-p3 0 0 0%)){.___SFooter_9rvfy_gg_{box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary,#000c0829)}@media (color-gamut:p3){.___SFooter_9rvfy_gg_{box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary,color(display-p3 .00798 .04498 .03219/.161))}}}.___SBody_9rvfy_gg_{display:flex;height:100%;overflow:auto}.___SSection_9rvfy_gg_{padding:var(--intergalactic-spacing-6x,24px) var(--intergalactic-spacing-8x,32px);flex:1 1 auto}@media (prefers-reduced-motion){.___SBackText_9rvfy_gg_{transition:none}}", /*__inner_css_end__*/"9rvfy_gg_"),
|
|
23
24
|
/*__reshadow_css_end__*/
|
|
24
25
|
{
|
|
25
|
-
"__SFullscreenModal": "
|
|
26
|
-
"__SClose": "
|
|
27
|
-
"
|
|
28
|
-
"__STitle": "
|
|
29
|
-
"__SDescription": "
|
|
30
|
-
"__SHeader": "
|
|
31
|
-
"__SFooter": "
|
|
32
|
-
"__SBody": "
|
|
33
|
-
"__SSection": "
|
|
34
|
-
"
|
|
35
|
-
"
|
|
26
|
+
"__SFullscreenModal": "___SFullscreenModal_9rvfy_gg_",
|
|
27
|
+
"__SClose": "___SClose_9rvfy_gg_",
|
|
28
|
+
"__SBack": "___SBack_9rvfy_gg_",
|
|
29
|
+
"__STitle": "___STitle_9rvfy_gg_",
|
|
30
|
+
"__SDescription": "___SDescription_9rvfy_gg_",
|
|
31
|
+
"__SHeader": "___SHeader_9rvfy_gg_",
|
|
32
|
+
"__SFooter": "___SFooter_9rvfy_gg_",
|
|
33
|
+
"__SBody": "___SBody_9rvfy_gg_",
|
|
34
|
+
"__SSection": "___SSection_9rvfy_gg_",
|
|
35
|
+
"__SBackText": "___SBackText_9rvfy_gg_",
|
|
36
|
+
"__SFullscreenOverlay": "___SFullscreenOverlay_9rvfy_gg_"
|
|
36
37
|
});
|
|
37
38
|
class FullscreenModalRoot extends _core.Component {
|
|
38
39
|
constructor(...args) {
|
|
@@ -203,19 +204,27 @@ function Description(props) {
|
|
|
203
204
|
function Back(props) {
|
|
204
205
|
var _ref9 = arguments[0],
|
|
205
206
|
_ref16;
|
|
206
|
-
const SBack =
|
|
207
|
-
const SBackText = _typography.Text;
|
|
207
|
+
const SBack = _button.ButtonLink;
|
|
208
208
|
const {
|
|
209
209
|
Children,
|
|
210
210
|
styles
|
|
211
211
|
} = props;
|
|
212
212
|
return _ref16 = (0, _core.sstyled)(styles), /*#__PURE__*/_react.default.createElement(SBack, _ref16.cn("SBack", {
|
|
213
213
|
...(0, _core.assignProps)({
|
|
214
|
-
"
|
|
215
|
-
"
|
|
214
|
+
"color": 'text-hint',
|
|
215
|
+
"size": 200,
|
|
216
|
+
"addonLeft": _m.default
|
|
216
217
|
}, _ref9)
|
|
217
|
-
}), /*#__PURE__*/_react.default.createElement(
|
|
218
|
+
}), /*#__PURE__*/_react.default.createElement(_button.ButtonLink.Text, {
|
|
219
|
+
ellipsis: true
|
|
220
|
+
}, /*#__PURE__*/_react.default.createElement(Children, _ref16.cn("Children", {}))));
|
|
218
221
|
}
|
|
222
|
+
|
|
223
|
+
/**
|
|
224
|
+
* FullscreenModal
|
|
225
|
+
*
|
|
226
|
+
* {@link https://developer.semrush.com/intergalactic/components/fullscreen-modal/fullscreen-modal-api/|API} | {@link https://developer.semrush.com/intergalactic/components/fullscreen-modal/fullscreen-modal-code/|Examples}
|
|
227
|
+
*/
|
|
219
228
|
const FullscreenModal = (0, _core.createComponent)(FullscreenModalRoot, {
|
|
220
229
|
Header,
|
|
221
230
|
Footer,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FullscreenModal.js","names":["_core","require","_baseComponents","_button","_interopRequireDefault","_i18nEnhance","_fire","_uniqueID","_m","_l","_modal","_typography","_react","_intergalacticDynamicLocales","style","sstyled","insert","FullscreenModalRoot","Component","constructor","args","_defineProperty2","default","hasTitle","trigger","e","fire","getCloseProps","getI18nText","asProps","onClick","bindHandlerClose","getBackProps","getTitleProps","uid","setHasTitle","setState","id","render","_ref","_ref0","SFullscreenModal","Modal","Window","styles","Children","onClose","visible","closable","duration","disablePortal","state","SFullscreenOverlay","Overlay","createElement","cn","assignProps","undefined","FullscreenModal","Close","i18nEnhance","localizedMessages","uniqueIDEnhancement","i18n","locale","Header","props","_ref2","arguments[0]","_ref1","SHeader","Box","title","description","Title","children","Description","Body","_ref3","_ref10","SBody","Section","_ref4","_ref11","SSection","Footer","_ref5","_ref12","SFooter","Flex","_ref6","_ref13","SClose","Button","Addon","ml","mr","_ref7","_ref14","STitle","Text","React","useEffect","_ref8","_ref15","SDescription","Back","_ref9","_ref16","SBack","SBackText","createComponent","parent","_default","exports"],"sources":["../../src/FullscreenModal.jsx"],"sourcesContent":["import { Flex, Box } 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 fire from '@semcore/core/lib/utils/fire';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport ArrowLeft from '@semcore/icon/ArrowLeft/m';\nimport CloseIcon from '@semcore/icon/Close/l';\nimport Modal from '@semcore/modal';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/fullscreen-modal.shadow.css';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nclass FullscreenModalRoot extends Component {\n static displayName = 'FullscreenModal';\n static style = style;\n static enhance = [i18nEnhance(localizedMessages), uniqueIDEnhancement()];\n static defaultProps = {\n i18n: localizedMessages,\n locale: 'en',\n };\n\n state = { hasTitle: false };\n\n bindHandlerClose = (trigger) => (e) => {\n fire(this, 'onClose', trigger, e);\n };\n\n getCloseProps() {\n const { getI18nText } = this.asProps;\n return {\n onClick: this.bindHandlerClose('onCloseClick'),\n getI18nText,\n };\n }\n\n getBackProps() {\n return {\n onClick: this.bindHandlerClose('onBackClick'),\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 SFullscreenModal = Root;\n const {\n styles,\n Children,\n onClose,\n visible,\n closable,\n duration,\n disablePortal,\n getI18nText,\n uid,\n } = this.asProps;\n const { hasTitle } = this.state;\n const SFullscreenOverlay = Modal.Overlay;\n\n return sstyled(styles)(\n <Modal\n closable={false}\n visible={visible}\n onClose={onClose}\n duration={duration}\n disablePortal={disablePortal}\n >\n <SFullscreenOverlay>\n <SFullscreenModal\n render={Modal.Window}\n use:closable={false}\n aria-label={hasTitle ? undefined : getI18nText('title')}\n aria-labelledby={hasTitle ? `igc-${uid}-title` : undefined}\n >\n {closable && <FullscreenModal.Close />}\n <Children />\n </SFullscreenModal>\n </SFullscreenOverlay>\n </Modal>,\n );\n }\n}\n\nfunction Header(props) {\n const SHeader = Root;\n const { Children, styles, title, description } = props;\n return sstyled(styles)(\n <SHeader render={Box}>\n {title && <FullscreenModal.Title children={title} />}\n {description && <FullscreenModal.Description children={description} />}\n <Children />\n </SHeader>,\n );\n}\n\nfunction Body(props) {\n const SBody = Root;\n return sstyled(props.styles)(<SBody render={Box} />);\n}\n\nfunction Section(props) {\n const SSection = Root;\n return sstyled(props.styles)(<SSection render={Box} tag='section' />);\n}\n\nfunction Footer(props) {\n const SFooter = Root;\n return sstyled(props.styles)(<SFooter render={Flex} />);\n}\n\nfunction Close(props) {\n const SClose = Root;\n const { getI18nText } = props;\n return sstyled(props.styles)(\n <SClose render={Button} use='tertiary' size='l' theme='muted' aria-label={getI18nText('close')}>\n <Button.Addon ml='7px' mr='7px'>\n <CloseIcon title={getI18nText('close')} />\n </Button.Addon>\n </SClose>,\n );\n}\n\nfunction Title(props) {\n const STitle = Root;\n const { setHasTitle } = props;\n\n React.useEffect(() => setHasTitle());\n\n return sstyled(props.styles)(<STitle render={Text} tag='h2' />);\n}\n\nfunction Description(props) {\n const SDescription = Root;\n return sstyled(props.styles)(<SDescription render={Text} tag='p' />);\n}\n\nfunction Back(props) {\n const SBack = Root;\n const SBackText = Text;\n const { Children, styles } = props;\n\n return sstyled(styles)(\n <SBack render={Box} tag='button' tabIndex={0}>\n <ArrowLeft />\n <SBackText>\n <Children />\n </SBackText>\n </SBack>,\n );\n}\n\nconst FullscreenModal = createComponent(\n FullscreenModalRoot,\n {\n Header,\n Footer,\n Close,\n Back,\n Body,\n Section,\n Title,\n Description,\n },\n { parent: Modal },\n);\n\nexport default FullscreenModal;\n"],"mappings":";;;;;;;;AAEA,IAAAA,KAAA,GAAAC,OAAA;AAFA,IAAAC,eAAA,GAAAD,OAAA;AACA,IAAAE,OAAA,GAAAC,sBAAA,CAAAH,OAAA;AAEA,IAAAI,YAAA,GAAAD,sBAAA,CAAAH,OAAA;AACA,IAAAK,KAAA,GAAAF,sBAAA,CAAAH,OAAA;AACA,IAAAM,SAAA,GAAAH,sBAAA,CAAAH,OAAA;AACA,IAAAO,EAAA,GAAAJ,sBAAA,CAAAH,OAAA;AACA,IAAAQ,EAAA,GAAAL,sBAAA,CAAAH,OAAA;AACA,IAAAS,MAAA,GAAAN,sBAAA,CAAAH,OAAA;AACA,IAAAU,WAAA,GAAAV,OAAA;AACA,IAAAW,MAAA,GAAAR,sBAAA,CAAAH,OAAA;AAGA,IAAAY,4BAAA,GAAAZ,OAAA;AAAmF;AAAA,MAAAa,KAAA,8BAAAd,KAAA,CAAAe,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAEnF,MAAMC,mBAAmB,SAASC,eAAS,CAAC;EAAAC,YAAA,GAAAC,IAAA;IAAA,SAAAA,IAAA;IAAA,IAAAC,gBAAA,CAAAC,OAAA,iBASlC;MAAEC,QAAQ,EAAE;IAAM,CAAC;IAAA,IAAAF,gBAAA,CAAAC,OAAA,4BAEPE,OAAO,IAAMC,CAAC,IAAK;MACrC,IAAAC,aAAI,EAAC,IAAI,EAAE,SAAS,EAAEF,OAAO,EAAEC,CAAC,CAAC;IACnC,CAAC;EAAA;EAEDE,aAAaA,CAAA,EAAG;IACd,MAAM;MAAEC;IAAY,CAAC,GAAG,IAAI,CAACC,OAAO;IACpC,OAAO;MACLC,OAAO,EAAE,IAAI,CAACC,gBAAgB,CAAC,cAAc,CAAC;MAC9CH;IACF,CAAC;EACH;EAEAI,YAAYA,CAAA,EAAG;IACb,OAAO;MACLF,OAAO,EAAE,IAAI,CAACC,gBAAgB,CAAC,aAAa;IAC9C,CAAC;EACH;EAEAE,aAAaA,CAAA,EAAG;IACd,MAAM;MAAEC;IAAI,CAAC,GAAG,IAAI,CAACL,OAAO;IAC5B,MAAMM,WAAW,GAAGA,CAAA,KAAM,IAAI,CAACC,QAAQ,CAAC;MAAEb,QAAQ,EAAE;IAAK,CAAC,CAAC;IAE3D,OAAO;MACLc,EAAE,EAAE,OAAOH,GAAG,QAAQ;MACtBC;IACF,CAAC;EACH;EAEAG,MAAMA,CAAA,EAAG;IAAA,IAAAC,IAAA,QAAAV,OAAA;MAAAW,KAAA;IACP,MAAMC,gBAAgB,GAyBNC,cAAK,CAACC,MAAM;IAxB5B,MAAM;MACJC,MAAM;MACNC,QAAQ;MACRC,OAAO;MACPC,OAAO;MACPC,QAAQ;MACRC,QAAQ;MACRC,aAAa;MACbtB,WAAW;MACXM;IACF,CAAC,GAAG,IAAI,CAACL,OAAO;IAChB,MAAM;MAAEN;IAAS,CAAC,GAAG,IAAI,CAAC4B,KAAK;IAC/B,MAAMC,kBAAkB,GAAGV,cAAK,CAACW,OAAO;IAExC,OAAAb,KAAA,GAAO,IAAAzB,aAAO,EAAC6B,MAAM,CAAC,eACpBhC,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAAC5C,MAAA,CAAAY,OAAK,EAAAkB,KAAA,CAAAe,EAAA;MAAA,YACM,KAAK;MAAA,WACNR,OAAO;MAAA,WACPD,OAAO;MAAA,YACNG,QAAQ;MAAA,iBACHC;IAAa,iBAE5BtC,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACF,kBAAkB,EAAAZ,KAAA,CAAAe,EAAA,yCACjB3C,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACb,gBAAgB,EAAAD,KAAA,CAAAe,EAAA;MAAA,OAAAvD,KAAA,CAAAwD,WAAA;QAAA,gBAED,KAAK;QAAA,cACPjC,QAAQ,GAAGkC,SAAS,GAAG7B,WAAW,CAAC,OAAO,CAAC;QAAA,mBACtCL,QAAQ,GAAG,OAAOW,GAAG,QAAQ,GAAGuB;MAAS,GAAAlB,IAAA;IAAA,IAEzDS,QAAQ,iBAAIpC,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACI,eAAe,CAACC,KAAK,MAAE,CAAC,eACtC/C,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACT,QAAQ,EAAAL,KAAA,CAAAe,EAAA,gBAAE,CACK,CACA,CACf,CAAC;EAEZ;AACF;AAAC,IAAAlC,gBAAA,CAAAC,OAAA,EA7EKL,mBAAmB,iBACF,iBAAiB;AAAA,IAAAI,gBAAA,CAAAC,OAAA,EADlCL,mBAAmB,WAERH,KAAK;AAAA,IAAAO,gBAAA,CAAAC,OAAA,EAFhBL,mBAAmB,aAGN,CAAC,IAAA2C,oBAAW,EAACC,8CAAiB,CAAC,EAAE,IAAAC,iBAAmB,EAAC,CAAC,CAAC;AAAA,IAAAzC,gBAAA,CAAAC,OAAA,EAHpEL,mBAAmB,kBAID;EACpB8C,IAAI,EAAEF,8CAAiB;EACvBG,MAAM,EAAE;AACV,CAAC;AAwEH,SAASC,MAAMA,CAACC,KAAK,EAAE;EAAA,IAAAC,KAAA,GAAAC,YAAA;IAAAC,KAAA;EACrB,MAAMC,OAAO,GAGMC,mBAAG;EAFtB,MAAM;IAAE1B,QAAQ;IAAED,MAAM;IAAE4B,KAAK;IAAEC;EAAY,CAAC,GAAGP,KAAK;EACtD,OAAAG,KAAA,GAAO,IAAAtD,aAAO,EAAC6B,MAAM,CAAC,eACpBhC,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACgB,OAAO,EAAAD,KAAA,CAAAd,EAAA;IAAA,OAAAvD,KAAA,CAAAwD,WAAA,MAAAW,KAAA;EAAA,IACLK,KAAK,iBAAI5D,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACI,eAAe,CAACgB,KAAK;IAACC,QAAQ,EAAEH;EAAM,CAAE,CAAC,EACnDC,WAAW,iBAAI7D,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACI,eAAe,CAACkB,WAAW;IAACD,QAAQ,EAAEF;EAAY,CAAE,CAAC,eACtE7D,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACT,QAAQ,EAAAwB,KAAA,CAAAd,EAAA,gBAAE,CACJ,CAAC;AAEd;AAEA,SAASsB,IAAIA,CAACX,KAAK,EAAE;EAAA,IAAAY,KAAA,GAAAV,YAAA;IAAAW,MAAA;EACnB,MAAMC,KAAK,GACiCT,mBAAG;EAA/C,OAAAQ,MAAA,GAAO,IAAAhE,aAAO,EAACmD,KAAK,CAACtB,MAAM,CAAC,eAAChC,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAAC0B,KAAK,EAAAD,MAAA,CAAAxB,EAAA;IAAA,OAAAvD,KAAA,CAAAwD,WAAA,MAAAsB,KAAA;EAAA,EAAe,CAAC;AACrD;AAEA,SAASG,OAAOA,CAACf,KAAK,EAAE;EAAA,IAAAgB,KAAA,GAAAd,YAAA;IAAAe,MAAA;EACtB,MAAMC,QAAQ,GACiCb,mBAAG;EAAlD,OAAAY,MAAA,GAAO,IAAApE,aAAO,EAACmD,KAAK,CAACtB,MAAM,CAAC,eAAChC,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAAC8B,QAAQ,EAAAD,MAAA,CAAA5B,EAAA;IAAA,OAAAvD,KAAA,CAAAwD,WAAA;MAAA,OAAkB;IAAS,GAAA0B,KAAA;EAAA,EAAE,CAAC;AACtE;AAEA,SAASG,MAAMA,CAACnB,KAAK,EAAE;EAAA,IAAAoB,KAAA,GAAAlB,YAAA;IAAAmB,MAAA;EACrB,MAAMC,OAAO,GACiCC,oBAAI;EAAlD,OAAAF,MAAA,GAAO,IAAAxE,aAAO,EAACmD,KAAK,CAACtB,MAAM,CAAC,eAAChC,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACkC,OAAO,EAAAD,MAAA,CAAAhC,EAAA;IAAA,OAAAvD,KAAA,CAAAwD,WAAA,MAAA8B,KAAA;EAAA,EAAgB,CAAC;AACxD;AAEA,SAAS3B,KAAKA,CAACO,KAAK,EAAE;EAAA,IAAAwB,KAAA,GAAAtB,YAAA;IAAAuB,MAAA;EACpB,MAAMC,MAAM,GAGMC,eAAM;EAFxB,MAAM;IAAEjE;EAAY,CAAC,GAAGsC,KAAK;EAC7B,OAAAyB,MAAA,GAAO,IAAA5E,aAAO,EAACmD,KAAK,CAACtB,MAAM,CAAC,eAC1BhC,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACsC,MAAM,EAAAD,MAAA,CAAApC,EAAA;IAAA,OAAAvD,KAAA,CAAAwD,WAAA;MAAA,OAAqB,UAAU;MAAA,QAAM,GAAG;MAAA,SAAO,OAAO;MAAA,cAAa5B,WAAW,CAAC,OAAO;IAAC,GAAA8D,KAAA;EAAA,iBAC5F9E,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACnD,OAAA,CAAAmB,OAAM,CAACwE,KAAK;IAACC,EAAE,EAAC,KAAK;IAACC,EAAE,EAAC;EAAK,gBAC7BpF,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAAC7C,EAAA,CAAAa,OAAS,EAAAqE,MAAA,CAAApC,EAAA;IAAA,SAAQ3B,WAAW,CAAC,OAAO;EAAC,EAAG,CAC7B,CACR,CAAC;AAEb;AAEA,SAAS8C,KAAKA,CAACR,KAAK,EAAE;EAAA,IAAA+B,KAAA,GAAA7B,YAAA;IAAA8B,MAAA;EACpB,MAAMC,MAAM,GAKiCC,gBAAI;EAJjD,MAAM;IAAEjE;EAAY,CAAC,GAAG+B,KAAK;EAE7BmC,cAAK,CAACC,SAAS,CAAC,MAAMnE,WAAW,CAAC,CAAC,CAAC;EAEpC,OAAA+D,MAAA,GAAO,IAAAnF,aAAO,EAACmD,KAAK,CAACtB,MAAM,CAAC,eAAChC,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAAC6C,MAAM,EAAAD,MAAA,CAAA3C,EAAA;IAAA,OAAAvD,KAAA,CAAAwD,WAAA;MAAA,OAAmB;IAAI,GAAAyC,KAAA;EAAA,EAAE,CAAC;AAChE;AAEA,SAASrB,WAAWA,CAACV,KAAK,EAAE;EAAA,IAAAqC,KAAA,GAAAnC,YAAA;IAAAoC,MAAA;EAC1B,MAAMC,YAAY,GACiCL,gBAAI;EAAvD,OAAAI,MAAA,GAAO,IAAAzF,aAAO,EAACmD,KAAK,CAACtB,MAAM,CAAC,eAAChC,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACmD,YAAY,EAAAD,MAAA,CAAAjD,EAAA;IAAA,OAAAvD,KAAA,CAAAwD,WAAA;MAAA,OAAmB;IAAG,GAAA+C,KAAA;EAAA,EAAE,CAAC;AACrE;AAEA,SAASG,IAAIA,CAACxC,KAAK,EAAE;EAAA,IAAAyC,KAAA,GAAAvC,YAAA;IAAAwC,MAAA;EACnB,MAAMC,KAAK,GAKMtC,mBAAG;EAJpB,MAAMuC,SAAS,GAAGV,gBAAI;EACtB,MAAM;IAAEvD,QAAQ;IAAED;EAAO,CAAC,GAAGsB,KAAK;EAElC,OAAA0C,MAAA,GAAO,IAAA7F,aAAO,EAAC6B,MAAM,CAAC,eACpBhC,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACuD,KAAK,EAAAD,MAAA,CAAArD,EAAA;IAAA,OAAAvD,KAAA,CAAAwD,WAAA;MAAA,OAAkB,QAAQ;MAAA,YAAW;IAAC,GAAAmD,KAAA;EAAA,iBAC1C/F,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAAC9C,EAAA,CAAAc,OAAS,EAAAsF,MAAA,CAAArD,EAAA,iBAAE,CAAC,eACb3C,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACwD,SAAS,EAAAF,MAAA,CAAArD,EAAA,gCACR3C,MAAA,CAAAU,OAAA,CAAAgC,aAAA,CAACT,QAAQ,EAAA+D,MAAA,CAAArD,EAAA,gBAAE,CACF,CACN,CAAC;AAEZ;AAEA,MAAMG,eAAe,GAAG,IAAAqD,qBAAe,EACrC9F,mBAAmB,EACnB;EACEgD,MAAM;EACNoB,MAAM;EACN1B,KAAK;EACL+C,IAAI;EACJ7B,IAAI;EACJI,OAAO;EACPP,KAAK;EACLE;AACF,CAAC,EACD;EAAEoC,MAAM,EAAEtE;AAAM,CAClB,CAAC;AAAC,IAAAuE,QAAA,GAAAC,OAAA,CAAA5F,OAAA,GAEaoC,eAAe","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"FullscreenModal.js","names":["_core","require","_baseComponents","_button","_interopRequireWildcard","_i18nEnhance","_interopRequireDefault","_fire","_uniqueID","_m","_l","_modal","_typography","_react","_intergalacticDynamicLocales","style","sstyled","insert","FullscreenModalRoot","Component","constructor","args","_defineProperty2","default","hasTitle","trigger","e","fire","getCloseProps","getI18nText","asProps","onClick","bindHandlerClose","getBackProps","getTitleProps","uid","setHasTitle","setState","id","render","_ref","_ref0","SFullscreenModal","Modal","Window","styles","Children","onClose","visible","closable","duration","disablePortal","state","SFullscreenOverlay","Overlay","createElement","cn","assignProps","undefined","FullscreenModal","Close","i18nEnhance","localizedMessages","uniqueIDEnhancement","i18n","locale","Header","props","_ref2","arguments[0]","_ref1","SHeader","Box","title","description","Title","children","Description","Body","_ref3","_ref10","SBody","Section","_ref4","_ref11","SSection","Footer","_ref5","_ref12","SFooter","Flex","_ref6","_ref13","SClose","Button","Addon","ml","mr","_ref7","_ref14","STitle","Text","React","useEffect","_ref8","_ref15","SDescription","Back","_ref9","_ref16","SBack","ButtonLink","ArrowLeft","ellipsis","createComponent","parent","_default","exports"],"sources":["../../src/FullscreenModal.jsx"],"sourcesContent":["import { Flex, Box } from '@semcore/base-components';\nimport Button, { ButtonLink } from '@semcore/button';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';\nimport fire from '@semcore/core/lib/utils/fire';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport ArrowLeft from '@semcore/icon/ArrowLeft/m';\nimport CloseIcon from '@semcore/icon/Close/l';\nimport Modal from '@semcore/modal';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/fullscreen-modal.shadow.css';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nclass FullscreenModalRoot extends Component {\n static displayName = 'FullscreenModal';\n static style = style;\n static enhance = [i18nEnhance(localizedMessages), uniqueIDEnhancement()];\n static defaultProps = {\n i18n: localizedMessages,\n locale: 'en',\n };\n\n state = { hasTitle: false };\n\n bindHandlerClose = (trigger) => (e) => {\n fire(this, 'onClose', trigger, e);\n };\n\n getCloseProps() {\n const { getI18nText } = this.asProps;\n return {\n onClick: this.bindHandlerClose('onCloseClick'),\n getI18nText,\n };\n }\n\n getBackProps() {\n return {\n onClick: this.bindHandlerClose('onBackClick'),\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 SFullscreenModal = Root;\n const {\n styles,\n Children,\n onClose,\n visible,\n closable,\n duration,\n disablePortal,\n getI18nText,\n uid,\n } = this.asProps;\n const { hasTitle } = this.state;\n const SFullscreenOverlay = Modal.Overlay;\n\n return sstyled(styles)(\n <Modal\n closable={false}\n visible={visible}\n onClose={onClose}\n duration={duration}\n disablePortal={disablePortal}\n >\n <SFullscreenOverlay>\n <SFullscreenModal\n render={Modal.Window}\n use:closable={false}\n aria-label={hasTitle ? undefined : getI18nText('title')}\n aria-labelledby={hasTitle ? `igc-${uid}-title` : undefined}\n >\n {closable && <FullscreenModal.Close />}\n <Children />\n </SFullscreenModal>\n </SFullscreenOverlay>\n </Modal>,\n );\n }\n}\n\nfunction Header(props) {\n const SHeader = Root;\n const { Children, styles, title, description } = props;\n return sstyled(styles)(\n <SHeader render={Box}>\n {title && <FullscreenModal.Title children={title} />}\n {description && <FullscreenModal.Description children={description} />}\n <Children />\n </SHeader>,\n );\n}\n\nfunction Body(props) {\n const SBody = Root;\n return sstyled(props.styles)(<SBody render={Box} />);\n}\n\nfunction Section(props) {\n const SSection = Root;\n return sstyled(props.styles)(<SSection render={Box} tag='section' />);\n}\n\nfunction Footer(props) {\n const SFooter = Root;\n return sstyled(props.styles)(<SFooter render={Flex} />);\n}\n\nfunction Close(props) {\n const SClose = Root;\n const { getI18nText } = props;\n return sstyled(props.styles)(\n <SClose render={Button} use='tertiary' size='l' theme='muted' aria-label={getI18nText('close')}>\n <Button.Addon ml='7px' mr='7px'>\n <CloseIcon title={getI18nText('close')} />\n </Button.Addon>\n </SClose>,\n );\n}\n\nfunction Title(props) {\n const STitle = Root;\n const { setHasTitle } = props;\n\n React.useEffect(() => setHasTitle());\n\n return sstyled(props.styles)(<STitle render={Text} tag='h2' />);\n}\n\nfunction Description(props) {\n const SDescription = Root;\n return sstyled(props.styles)(<SDescription render={Text} tag='p' />);\n}\n\nfunction Back(props) {\n const SBack = Root;\n const { Children, styles } = props;\n\n return sstyled(styles)(\n <SBack render={ButtonLink} color='text-hint' size={200} addonLeft={ArrowLeft}>\n <ButtonLink.Text ellipsis>\n <Children />\n </ButtonLink.Text>\n </SBack>,\n );\n}\n\n/**\n * FullscreenModal\n *\n * {@link https://developer.semrush.com/intergalactic/components/fullscreen-modal/fullscreen-modal-api/|API} | {@link https://developer.semrush.com/intergalactic/components/fullscreen-modal/fullscreen-modal-code/|Examples}\n */\nconst FullscreenModal = createComponent(\n FullscreenModalRoot,\n {\n Header,\n Footer,\n Close,\n Back,\n Body,\n Section,\n Title,\n Description,\n },\n { parent: Modal },\n);\n\nexport default FullscreenModal;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -28,29 +28,7 @@ SBack {
|
|
|
28
28
|
z-index: 1;
|
|
29
29
|
top: 8px;
|
|
30
30
|
left: 32px;
|
|
31
|
-
display: flex;
|
|
32
|
-
align-items: center;
|
|
33
31
|
margin-bottom: var(--intergalactic-spacing-3x, 12px);
|
|
34
|
-
color: var(--intergalactic-icon-primary-neutral, oklch(0.092 0.024 152.2 / 0.526));
|
|
35
|
-
font-size: var(--intergalactic-fs-100, 12px);
|
|
36
|
-
line-height: var(--intergalactic-lh-100, 133%);
|
|
37
|
-
background: none;
|
|
38
|
-
padding: 0;
|
|
39
|
-
border: none;
|
|
40
|
-
outline: none;
|
|
41
|
-
|
|
42
|
-
&:hover {
|
|
43
|
-
color: var(--intergalactic-icon-primary-neutral-hover-active, oklch(0.088 0.026 147.7 / 0.583));
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
SBackText {
|
|
48
|
-
margin-left: var(--intergalactic-spacing-1x, 4px);
|
|
49
|
-
font-size: var(--intergalactic-fs-200, 14px);
|
|
50
|
-
line-height: var(--intergalactic-lh-200, 142%);
|
|
51
|
-
white-space: nowrap;
|
|
52
|
-
overflow: hidden;
|
|
53
|
-
text-overflow: ellipsis;
|
|
54
32
|
}
|
|
55
33
|
|
|
56
34
|
STitle,
|
|
@@ -10,7 +10,7 @@ import { assignProps as _assignProps3 } from "@semcore/core";
|
|
|
10
10
|
import { assignProps as _assignProps2 } from "@semcore/core";
|
|
11
11
|
import { assignProps as _assignProps } from "@semcore/core";
|
|
12
12
|
import { Flex, Box } from '@semcore/base-components';
|
|
13
|
-
import Button from '@semcore/button';
|
|
13
|
+
import Button, { ButtonLink } from '@semcore/button';
|
|
14
14
|
import { createComponent, Component, sstyled, Root } from '@semcore/core';
|
|
15
15
|
import i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';
|
|
16
16
|
import fire from '@semcore/core/lib/utils/fire';
|
|
@@ -21,20 +21,20 @@ import Modal from '@semcore/modal';
|
|
|
21
21
|
import { Text } from '@semcore/typography';
|
|
22
22
|
import React from 'react';
|
|
23
23
|
/*!__reshadow-styles__:"./style/fullscreen-modal.shadow.css"*/
|
|
24
|
-
const style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".
|
|
24
|
+
const style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SFullscreenModal_9rvfy_gg_,.___SFullscreenOverlay_9rvfy_gg_>div{padding:0;width:100%;height:100%}.___SFullscreenModal_9rvfy_gg_{display:flex;flex-direction:column;background:var(--intergalactic-bg-primary-neutral,#fff);border-radius:0}.___SClose_9rvfy_gg_{position:absolute;top:17px;right:24px}.___SBack_9rvfy_gg_{cursor:pointer;position:absolute;z-index:1;top:8px;left:32px;margin-bottom:var(--intergalactic-spacing-3x,12px)}.___SDescription_9rvfy_gg_,.___STitle_9rvfy_gg_{word-wrap:break-word}.___STitle_9rvfy_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,#010500e5)}.___SDescription_9rvfy_gg_{font-size:var(--intergalactic-fs-100,12px);line-height:var(--intergalactic-lh-100,133%);color:var(--intergalactic-text-secondary,#00030095)}@supports (color:color(display-p3 0 0 0%)){.___SDescription_9rvfy_gg_{color:var(--intergalactic-text-secondary,#00030095)}@media (color-gamut:p3){.___SDescription_9rvfy_gg_{color:var(--intergalactic-text-secondary,color(display-p3 .00228 .01289 .00252/.583))}}}.___SHeader_9rvfy_gg_{display:flex;flex-direction:column;gap:var(--intergalactic-spacing-2x,8px);align-items:flex-start;padding:var(--intergalactic-spacing-10x,40px) calc(var(--intergalactic-spacing-20x, 80px) - var(--intergalactic-spacing-2x, 8px)) var(--intergalactic-spacing-4x,16px) var(--intergalactic-spacing-8x,32px);box-shadow:inset 0 -1px 0 var(--intergalactic-border-primary,#000c0829);box-sizing:border-box}@supports (color:color(display-p3 0 0 0%)){.___SHeader_9rvfy_gg_{box-shadow:inset 0 -1px 0 var(--intergalactic-border-primary,#000c0829)}@media (color-gamut:p3){.___SHeader_9rvfy_gg_{box-shadow:inset 0 -1px 0 var(--intergalactic-border-primary,color(display-p3 .00798 .04498 .03219/.161))}}}.___SFooter_9rvfy_gg_{min-height:52px;box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary,#000c0829);box-sizing:border-box}@supports (color:color(display-p3 0 0 0%)){.___SFooter_9rvfy_gg_{box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary,#000c0829)}@media (color-gamut:p3){.___SFooter_9rvfy_gg_{box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary,color(display-p3 .00798 .04498 .03219/.161))}}}.___SBody_9rvfy_gg_{display:flex;height:100%;overflow:auto}.___SSection_9rvfy_gg_{padding:var(--intergalactic-spacing-6x,24px) var(--intergalactic-spacing-8x,32px);flex:1 1 auto}@media (prefers-reduced-motion){.___SBackText_9rvfy_gg_{transition:none}}", /*__inner_css_end__*/"9rvfy_gg_"),
|
|
25
25
|
/*__reshadow_css_end__*/
|
|
26
26
|
{
|
|
27
|
-
"__SFullscreenModal": "
|
|
28
|
-
"__SClose": "
|
|
29
|
-
"
|
|
30
|
-
"__STitle": "
|
|
31
|
-
"__SDescription": "
|
|
32
|
-
"__SHeader": "
|
|
33
|
-
"__SFooter": "
|
|
34
|
-
"__SBody": "
|
|
35
|
-
"__SSection": "
|
|
36
|
-
"
|
|
37
|
-
"
|
|
27
|
+
"__SFullscreenModal": "___SFullscreenModal_9rvfy_gg_",
|
|
28
|
+
"__SClose": "___SClose_9rvfy_gg_",
|
|
29
|
+
"__SBack": "___SBack_9rvfy_gg_",
|
|
30
|
+
"__STitle": "___STitle_9rvfy_gg_",
|
|
31
|
+
"__SDescription": "___SDescription_9rvfy_gg_",
|
|
32
|
+
"__SHeader": "___SHeader_9rvfy_gg_",
|
|
33
|
+
"__SFooter": "___SFooter_9rvfy_gg_",
|
|
34
|
+
"__SBody": "___SBody_9rvfy_gg_",
|
|
35
|
+
"__SSection": "___SSection_9rvfy_gg_",
|
|
36
|
+
"__SBackText": "___SBackText_9rvfy_gg_",
|
|
37
|
+
"__SFullscreenOverlay": "___SFullscreenOverlay_9rvfy_gg_"
|
|
38
38
|
});
|
|
39
39
|
import { localizedMessages } from './translations/__intergalactic-dynamic-locales';
|
|
40
40
|
class FullscreenModalRoot extends Component {
|
|
@@ -206,19 +206,27 @@ function Description(props) {
|
|
|
206
206
|
function Back(props) {
|
|
207
207
|
var _ref9 = arguments[0],
|
|
208
208
|
_ref16;
|
|
209
|
-
const SBack =
|
|
210
|
-
const SBackText = Text;
|
|
209
|
+
const SBack = ButtonLink;
|
|
211
210
|
const {
|
|
212
211
|
Children,
|
|
213
212
|
styles
|
|
214
213
|
} = props;
|
|
215
214
|
return _ref16 = sstyled(styles), /*#__PURE__*/React.createElement(SBack, _ref16.cn("SBack", {
|
|
216
215
|
..._assignProps9({
|
|
217
|
-
"
|
|
218
|
-
"
|
|
216
|
+
"color": 'text-hint',
|
|
217
|
+
"size": 200,
|
|
218
|
+
"addonLeft": ArrowLeft
|
|
219
219
|
}, _ref9)
|
|
220
|
-
}), /*#__PURE__*/React.createElement(
|
|
220
|
+
}), /*#__PURE__*/React.createElement(ButtonLink.Text, {
|
|
221
|
+
ellipsis: true
|
|
222
|
+
}, /*#__PURE__*/React.createElement(Children, _ref16.cn("Children", {}))));
|
|
221
223
|
}
|
|
224
|
+
|
|
225
|
+
/**
|
|
226
|
+
* FullscreenModal
|
|
227
|
+
*
|
|
228
|
+
* {@link https://developer.semrush.com/intergalactic/components/fullscreen-modal/fullscreen-modal-api/|API} | {@link https://developer.semrush.com/intergalactic/components/fullscreen-modal/fullscreen-modal-code/|Examples}
|
|
229
|
+
*/
|
|
222
230
|
const FullscreenModal = createComponent(FullscreenModalRoot, {
|
|
223
231
|
Header,
|
|
224
232
|
Footer,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FullscreenModal.js","names":["Flex","Box","Button","createComponent","Component","sstyled","Root","i18nEnhance","fire","uniqueIDEnhancement","ArrowLeft","CloseIcon","Modal","Text","React","style","_sstyled","insert","localizedMessages","FullscreenModalRoot","constructor","args","_defineProperty","hasTitle","trigger","e","getCloseProps","getI18nText","asProps","onClick","bindHandlerClose","getBackProps","getTitleProps","uid","setHasTitle","setState","id","render","_ref","_ref0","SFullscreenModal","Window","styles","Children","onClose","visible","closable","duration","disablePortal","state","SFullscreenOverlay","Overlay","createElement","cn","_assignProps","undefined","FullscreenModal","Close","i18n","locale","Header","props","_ref2","arguments[0]","_ref1","SHeader","title","description","_assignProps2","Title","children","Description","Body","_ref3","_ref10","SBody","_assignProps3","Section","_ref4","_ref11","SSection","_assignProps4","Footer","_ref5","_ref12","SFooter","_assignProps5","_ref6","_ref13","SClose","_assignProps6","Addon","ml","mr","_ref7","_ref14","STitle","useEffect","_assignProps7","_ref8","_ref15","SDescription","_assignProps8","Back","_ref9","_ref16","SBack","SBackText","_assignProps9","parent"],"sources":["../../src/FullscreenModal.jsx"],"sourcesContent":["import { Flex, Box } 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 fire from '@semcore/core/lib/utils/fire';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport ArrowLeft from '@semcore/icon/ArrowLeft/m';\nimport CloseIcon from '@semcore/icon/Close/l';\nimport Modal from '@semcore/modal';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/fullscreen-modal.shadow.css';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nclass FullscreenModalRoot extends Component {\n static displayName = 'FullscreenModal';\n static style = style;\n static enhance = [i18nEnhance(localizedMessages), uniqueIDEnhancement()];\n static defaultProps = {\n i18n: localizedMessages,\n locale: 'en',\n };\n\n state = { hasTitle: false };\n\n bindHandlerClose = (trigger) => (e) => {\n fire(this, 'onClose', trigger, e);\n };\n\n getCloseProps() {\n const { getI18nText } = this.asProps;\n return {\n onClick: this.bindHandlerClose('onCloseClick'),\n getI18nText,\n };\n }\n\n getBackProps() {\n return {\n onClick: this.bindHandlerClose('onBackClick'),\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 SFullscreenModal = Root;\n const {\n styles,\n Children,\n onClose,\n visible,\n closable,\n duration,\n disablePortal,\n getI18nText,\n uid,\n } = this.asProps;\n const { hasTitle } = this.state;\n const SFullscreenOverlay = Modal.Overlay;\n\n return sstyled(styles)(\n <Modal\n closable={false}\n visible={visible}\n onClose={onClose}\n duration={duration}\n disablePortal={disablePortal}\n >\n <SFullscreenOverlay>\n <SFullscreenModal\n render={Modal.Window}\n use:closable={false}\n aria-label={hasTitle ? undefined : getI18nText('title')}\n aria-labelledby={hasTitle ? `igc-${uid}-title` : undefined}\n >\n {closable && <FullscreenModal.Close />}\n <Children />\n </SFullscreenModal>\n </SFullscreenOverlay>\n </Modal>,\n );\n }\n}\n\nfunction Header(props) {\n const SHeader = Root;\n const { Children, styles, title, description } = props;\n return sstyled(styles)(\n <SHeader render={Box}>\n {title && <FullscreenModal.Title children={title} />}\n {description && <FullscreenModal.Description children={description} />}\n <Children />\n </SHeader>,\n );\n}\n\nfunction Body(props) {\n const SBody = Root;\n return sstyled(props.styles)(<SBody render={Box} />);\n}\n\nfunction Section(props) {\n const SSection = Root;\n return sstyled(props.styles)(<SSection render={Box} tag='section' />);\n}\n\nfunction Footer(props) {\n const SFooter = Root;\n return sstyled(props.styles)(<SFooter render={Flex} />);\n}\n\nfunction Close(props) {\n const SClose = Root;\n const { getI18nText } = props;\n return sstyled(props.styles)(\n <SClose render={Button} use='tertiary' size='l' theme='muted' aria-label={getI18nText('close')}>\n <Button.Addon ml='7px' mr='7px'>\n <CloseIcon title={getI18nText('close')} />\n </Button.Addon>\n </SClose>,\n );\n}\n\nfunction Title(props) {\n const STitle = Root;\n const { setHasTitle } = props;\n\n React.useEffect(() => setHasTitle());\n\n return sstyled(props.styles)(<STitle render={Text} tag='h2' />);\n}\n\nfunction Description(props) {\n const SDescription = Root;\n return sstyled(props.styles)(<SDescription render={Text} tag='p' />);\n}\n\nfunction Back(props) {\n const SBack = Root;\n const SBackText = Text;\n const { Children, styles } = props;\n\n return sstyled(styles)(\n <SBack render={Box} tag='button' tabIndex={0}>\n <ArrowLeft />\n <SBackText>\n <Children />\n </SBackText>\n </SBack>,\n );\n}\n\nconst FullscreenModal = createComponent(\n FullscreenModalRoot,\n {\n Header,\n Footer,\n Close,\n Back,\n Body,\n Section,\n Title,\n Description,\n },\n { parent: Modal },\n);\n\nexport default FullscreenModal;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"FullscreenModal.js","names":["Flex","Box","Button","ButtonLink","createComponent","Component","sstyled","Root","i18nEnhance","fire","uniqueIDEnhancement","ArrowLeft","CloseIcon","Modal","Text","React","style","_sstyled","insert","localizedMessages","FullscreenModalRoot","constructor","args","_defineProperty","hasTitle","trigger","e","getCloseProps","getI18nText","asProps","onClick","bindHandlerClose","getBackProps","getTitleProps","uid","setHasTitle","setState","id","render","_ref","_ref0","SFullscreenModal","Window","styles","Children","onClose","visible","closable","duration","disablePortal","state","SFullscreenOverlay","Overlay","createElement","cn","_assignProps","undefined","FullscreenModal","Close","i18n","locale","Header","props","_ref2","arguments[0]","_ref1","SHeader","title","description","_assignProps2","Title","children","Description","Body","_ref3","_ref10","SBody","_assignProps3","Section","_ref4","_ref11","SSection","_assignProps4","Footer","_ref5","_ref12","SFooter","_assignProps5","_ref6","_ref13","SClose","_assignProps6","Addon","ml","mr","_ref7","_ref14","STitle","useEffect","_assignProps7","_ref8","_ref15","SDescription","_assignProps8","Back","_ref9","_ref16","SBack","_assignProps9","ellipsis","parent"],"sources":["../../src/FullscreenModal.jsx"],"sourcesContent":["import { Flex, Box } from '@semcore/base-components';\nimport Button, { ButtonLink } from '@semcore/button';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';\nimport fire from '@semcore/core/lib/utils/fire';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport ArrowLeft from '@semcore/icon/ArrowLeft/m';\nimport CloseIcon from '@semcore/icon/Close/l';\nimport Modal from '@semcore/modal';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/fullscreen-modal.shadow.css';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nclass FullscreenModalRoot extends Component {\n static displayName = 'FullscreenModal';\n static style = style;\n static enhance = [i18nEnhance(localizedMessages), uniqueIDEnhancement()];\n static defaultProps = {\n i18n: localizedMessages,\n locale: 'en',\n };\n\n state = { hasTitle: false };\n\n bindHandlerClose = (trigger) => (e) => {\n fire(this, 'onClose', trigger, e);\n };\n\n getCloseProps() {\n const { getI18nText } = this.asProps;\n return {\n onClick: this.bindHandlerClose('onCloseClick'),\n getI18nText,\n };\n }\n\n getBackProps() {\n return {\n onClick: this.bindHandlerClose('onBackClick'),\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 SFullscreenModal = Root;\n const {\n styles,\n Children,\n onClose,\n visible,\n closable,\n duration,\n disablePortal,\n getI18nText,\n uid,\n } = this.asProps;\n const { hasTitle } = this.state;\n const SFullscreenOverlay = Modal.Overlay;\n\n return sstyled(styles)(\n <Modal\n closable={false}\n visible={visible}\n onClose={onClose}\n duration={duration}\n disablePortal={disablePortal}\n >\n <SFullscreenOverlay>\n <SFullscreenModal\n render={Modal.Window}\n use:closable={false}\n aria-label={hasTitle ? undefined : getI18nText('title')}\n aria-labelledby={hasTitle ? `igc-${uid}-title` : undefined}\n >\n {closable && <FullscreenModal.Close />}\n <Children />\n </SFullscreenModal>\n </SFullscreenOverlay>\n </Modal>,\n );\n }\n}\n\nfunction Header(props) {\n const SHeader = Root;\n const { Children, styles, title, description } = props;\n return sstyled(styles)(\n <SHeader render={Box}>\n {title && <FullscreenModal.Title children={title} />}\n {description && <FullscreenModal.Description children={description} />}\n <Children />\n </SHeader>,\n );\n}\n\nfunction Body(props) {\n const SBody = Root;\n return sstyled(props.styles)(<SBody render={Box} />);\n}\n\nfunction Section(props) {\n const SSection = Root;\n return sstyled(props.styles)(<SSection render={Box} tag='section' />);\n}\n\nfunction Footer(props) {\n const SFooter = Root;\n return sstyled(props.styles)(<SFooter render={Flex} />);\n}\n\nfunction Close(props) {\n const SClose = Root;\n const { getI18nText } = props;\n return sstyled(props.styles)(\n <SClose render={Button} use='tertiary' size='l' theme='muted' aria-label={getI18nText('close')}>\n <Button.Addon ml='7px' mr='7px'>\n <CloseIcon title={getI18nText('close')} />\n </Button.Addon>\n </SClose>,\n );\n}\n\nfunction Title(props) {\n const STitle = Root;\n const { setHasTitle } = props;\n\n React.useEffect(() => setHasTitle());\n\n return sstyled(props.styles)(<STitle render={Text} tag='h2' />);\n}\n\nfunction Description(props) {\n const SDescription = Root;\n return sstyled(props.styles)(<SDescription render={Text} tag='p' />);\n}\n\nfunction Back(props) {\n const SBack = Root;\n const { Children, styles } = props;\n\n return sstyled(styles)(\n <SBack render={ButtonLink} color='text-hint' size={200} addonLeft={ArrowLeft}>\n <ButtonLink.Text ellipsis>\n <Children />\n </ButtonLink.Text>\n </SBack>,\n );\n}\n\n/**\n * FullscreenModal\n *\n * {@link https://developer.semrush.com/intergalactic/components/fullscreen-modal/fullscreen-modal-api/|API} | {@link https://developer.semrush.com/intergalactic/components/fullscreen-modal/fullscreen-modal-code/|Examples}\n */\nconst FullscreenModal = createComponent(\n FullscreenModalRoot,\n {\n Header,\n Footer,\n Close,\n Back,\n Body,\n Section,\n Title,\n Description,\n },\n { parent: Modal },\n);\n\nexport default FullscreenModal;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -28,29 +28,7 @@ SBack {
|
|
|
28
28
|
z-index: 1;
|
|
29
29
|
top: 8px;
|
|
30
30
|
left: 32px;
|
|
31
|
-
display: flex;
|
|
32
|
-
align-items: center;
|
|
33
31
|
margin-bottom: var(--intergalactic-spacing-3x, 12px);
|
|
34
|
-
color: var(--intergalactic-icon-primary-neutral, oklch(0.092 0.024 152.2 / 0.526));
|
|
35
|
-
font-size: var(--intergalactic-fs-100, 12px);
|
|
36
|
-
line-height: var(--intergalactic-lh-100, 133%);
|
|
37
|
-
background: none;
|
|
38
|
-
padding: 0;
|
|
39
|
-
border: none;
|
|
40
|
-
outline: none;
|
|
41
|
-
|
|
42
|
-
&:hover {
|
|
43
|
-
color: var(--intergalactic-icon-primary-neutral-hover-active, oklch(0.088 0.026 147.7 / 0.583));
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
SBackText {
|
|
48
|
-
margin-left: var(--intergalactic-spacing-1x, 4px);
|
|
49
|
-
font-size: var(--intergalactic-fs-200, 14px);
|
|
50
|
-
line-height: var(--intergalactic-lh-200, 142%);
|
|
51
|
-
white-space: nowrap;
|
|
52
|
-
overflow: hidden;
|
|
53
|
-
text-overflow: ellipsis;
|
|
54
32
|
}
|
|
55
33
|
|
|
56
34
|
STitle,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime/helpers/
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
2
|
import { sstyled, Component, assignProps, createComponent } from "@semcore/core";
|
|
3
3
|
import { Box, Flex } from "@semcore/base-components";
|
|
4
|
-
import Button from "@semcore/button";
|
|
4
|
+
import Button, { ButtonLink } from "@semcore/button";
|
|
5
5
|
import i18nEnhance from "@semcore/core/lib/utils/enhances/i18nEnhance";
|
|
6
6
|
import fire from "@semcore/core/lib/utils/fire";
|
|
7
7
|
import uniqueIDEnhancement from "@semcore/core/lib/utils/uniqueID";
|
|
@@ -16,22 +16,22 @@ const style = (
|
|
|
16
16
|
/*__reshadow_css_start__*/
|
|
17
17
|
(sstyled.insert(
|
|
18
18
|
/*__inner_css_start__*/
|
|
19
|
-
".
|
|
19
|
+
".___SFullscreenModal_9rvfy_gg_,.___SFullscreenOverlay_9rvfy_gg_>div{padding:0;width:100%;height:100%}.___SFullscreenModal_9rvfy_gg_{display:flex;flex-direction:column;background:var(--intergalactic-bg-primary-neutral,#fff);border-radius:0}.___SClose_9rvfy_gg_{position:absolute;top:17px;right:24px}.___SBack_9rvfy_gg_{cursor:pointer;position:absolute;z-index:1;top:8px;left:32px;margin-bottom:var(--intergalactic-spacing-3x,12px)}.___SDescription_9rvfy_gg_,.___STitle_9rvfy_gg_{word-wrap:break-word}.___STitle_9rvfy_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,#010500e5)}.___SDescription_9rvfy_gg_{font-size:var(--intergalactic-fs-100,12px);line-height:var(--intergalactic-lh-100,133%);color:var(--intergalactic-text-secondary,#00030095)}@supports (color:color(display-p3 0 0 0%)){.___SDescription_9rvfy_gg_{color:var(--intergalactic-text-secondary,#00030095)}@media (color-gamut:p3){.___SDescription_9rvfy_gg_{color:var(--intergalactic-text-secondary,color(display-p3 .00228 .01289 .00252/.583))}}}.___SHeader_9rvfy_gg_{display:flex;flex-direction:column;gap:var(--intergalactic-spacing-2x,8px);align-items:flex-start;padding:var(--intergalactic-spacing-10x,40px) calc(var(--intergalactic-spacing-20x, 80px) - var(--intergalactic-spacing-2x, 8px)) var(--intergalactic-spacing-4x,16px) var(--intergalactic-spacing-8x,32px);box-shadow:inset 0 -1px 0 var(--intergalactic-border-primary,#000c0829);box-sizing:border-box}@supports (color:color(display-p3 0 0 0%)){.___SHeader_9rvfy_gg_{box-shadow:inset 0 -1px 0 var(--intergalactic-border-primary,#000c0829)}@media (color-gamut:p3){.___SHeader_9rvfy_gg_{box-shadow:inset 0 -1px 0 var(--intergalactic-border-primary,color(display-p3 .00798 .04498 .03219/.161))}}}.___SFooter_9rvfy_gg_{min-height:52px;box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary,#000c0829);box-sizing:border-box}@supports (color:color(display-p3 0 0 0%)){.___SFooter_9rvfy_gg_{box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary,#000c0829)}@media (color-gamut:p3){.___SFooter_9rvfy_gg_{box-shadow:inset 0 1px 1px 0 var(--intergalactic-border-primary,color(display-p3 .00798 .04498 .03219/.161))}}}.___SBody_9rvfy_gg_{display:flex;height:100%;overflow:auto}.___SSection_9rvfy_gg_{padding:var(--intergalactic-spacing-6x,24px) var(--intergalactic-spacing-8x,32px);flex:1 1 auto}@media (prefers-reduced-motion){.___SBackText_9rvfy_gg_{transition:none}}",
|
|
20
20
|
/*__inner_css_end__*/
|
|
21
|
-
"
|
|
21
|
+
"9rvfy_gg_"
|
|
22
22
|
), /*__reshadow_css_end__*/
|
|
23
23
|
{
|
|
24
|
-
"__SFullscreenModal": "
|
|
25
|
-
"__SClose": "
|
|
26
|
-
"
|
|
27
|
-
"__STitle": "
|
|
28
|
-
"__SDescription": "
|
|
29
|
-
"__SHeader": "
|
|
30
|
-
"__SFooter": "
|
|
31
|
-
"__SBody": "
|
|
32
|
-
"__SSection": "
|
|
33
|
-
"
|
|
34
|
-
"
|
|
24
|
+
"__SFullscreenModal": "___SFullscreenModal_9rvfy_gg_",
|
|
25
|
+
"__SClose": "___SClose_9rvfy_gg_",
|
|
26
|
+
"__SBack": "___SBack_9rvfy_gg_",
|
|
27
|
+
"__STitle": "___STitle_9rvfy_gg_",
|
|
28
|
+
"__SDescription": "___SDescription_9rvfy_gg_",
|
|
29
|
+
"__SHeader": "___SHeader_9rvfy_gg_",
|
|
30
|
+
"__SFooter": "___SFooter_9rvfy_gg_",
|
|
31
|
+
"__SBody": "___SBody_9rvfy_gg_",
|
|
32
|
+
"__SSection": "___SSection_9rvfy_gg_",
|
|
33
|
+
"__SBackText": "___SBackText_9rvfy_gg_",
|
|
34
|
+
"__SFullscreenOverlay": "___SFullscreenOverlay_9rvfy_gg_"
|
|
35
35
|
})
|
|
36
36
|
);
|
|
37
37
|
class FullscreenModalRoot extends Component {
|
|
@@ -194,18 +194,20 @@ function Description(props) {
|
|
|
194
194
|
}
|
|
195
195
|
function Back(props) {
|
|
196
196
|
var _ref9 = arguments[0], _ref16;
|
|
197
|
-
const SBack =
|
|
198
|
-
const SBackText = Text;
|
|
197
|
+
const SBack = ButtonLink;
|
|
199
198
|
const {
|
|
200
199
|
Children,
|
|
201
200
|
styles
|
|
202
201
|
} = props;
|
|
203
202
|
return _ref16 = sstyled(styles), /* @__PURE__ */ React.createElement(SBack, _ref16.cn("SBack", {
|
|
204
203
|
...assignProps({
|
|
205
|
-
"
|
|
206
|
-
"
|
|
204
|
+
"color": "text-hint",
|
|
205
|
+
"size": 200,
|
|
206
|
+
"addonLeft": ArrowLeft
|
|
207
207
|
}, _ref9)
|
|
208
|
-
}), /* @__PURE__ */ React.createElement(
|
|
208
|
+
}), /* @__PURE__ */ React.createElement(ButtonLink.Text, {
|
|
209
|
+
ellipsis: true
|
|
210
|
+
}, /* @__PURE__ */ React.createElement(Children, _ref16.cn("Children", {}))));
|
|
209
211
|
}
|
|
210
212
|
const FullscreenModal = createComponent(FullscreenModalRoot, {
|
|
211
213
|
Header,
|
|
@@ -28,29 +28,7 @@ SBack {
|
|
|
28
28
|
z-index: 1;
|
|
29
29
|
top: 8px;
|
|
30
30
|
left: 32px;
|
|
31
|
-
display: flex;
|
|
32
|
-
align-items: center;
|
|
33
31
|
margin-bottom: var(--intergalactic-spacing-3x, 12px);
|
|
34
|
-
color: var(--intergalactic-icon-primary-neutral, oklch(0.092 0.024 152.2 / 0.526));
|
|
35
|
-
font-size: var(--intergalactic-fs-100, 12px);
|
|
36
|
-
line-height: var(--intergalactic-lh-100, 133%);
|
|
37
|
-
background: none;
|
|
38
|
-
padding: 0;
|
|
39
|
-
border: none;
|
|
40
|
-
outline: none;
|
|
41
|
-
|
|
42
|
-
&:hover {
|
|
43
|
-
color: var(--intergalactic-icon-primary-neutral-hover-active, oklch(0.088 0.026 147.7 / 0.583));
|
|
44
|
-
}
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
SBackText {
|
|
48
|
-
margin-left: var(--intergalactic-spacing-1x, 4px);
|
|
49
|
-
font-size: var(--intergalactic-fs-200, 14px);
|
|
50
|
-
line-height: var(--intergalactic-lh-200, 142%);
|
|
51
|
-
white-space: nowrap;
|
|
52
|
-
overflow: hidden;
|
|
53
|
-
text-overflow: ellipsis;
|
|
54
32
|
}
|
|
55
33
|
|
|
56
34
|
STitle,
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/fullscreen-modal",
|
|
3
3
|
"description": "Semrush FullscreenModal Component",
|
|
4
|
-
"version": "17.
|
|
4
|
+
"version": "17.2.0-prerelease.3",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -14,12 +14,12 @@
|
|
|
14
14
|
"require": "./lib/cjs/index.js"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@semcore/modal": "^17.
|
|
18
|
-
"@semcore/typography": "^17.
|
|
19
|
-
"@semcore/button": "^17.
|
|
17
|
+
"@semcore/modal": "^17.2.0-prerelease.3",
|
|
18
|
+
"@semcore/typography": "^17.2.0-prerelease.3",
|
|
19
|
+
"@semcore/button": "^17.2.0-prerelease.3"
|
|
20
20
|
},
|
|
21
21
|
"peerDependencies": {
|
|
22
|
-
"@semcore/base-components": "^17.0
|
|
22
|
+
"@semcore/base-components": "^17.2.0",
|
|
23
23
|
"@semcore/icon": "^17.0.1"
|
|
24
24
|
},
|
|
25
25
|
"repository": {
|
|
@@ -28,8 +28,8 @@
|
|
|
28
28
|
"directory": "semcore/fullscreen-modal"
|
|
29
29
|
},
|
|
30
30
|
"devDependencies": {
|
|
31
|
-
"@semcore/core": "17.
|
|
32
|
-
"@semcore/base-components": "17.0
|
|
31
|
+
"@semcore/core": "17.2.0-prerelease.3",
|
|
32
|
+
"@semcore/base-components": "17.2.0-prerelease.3",
|
|
33
33
|
"@semcore/testing-utils": "1.0.0",
|
|
34
34
|
"@semcore/icon": "17.1.0"
|
|
35
35
|
},
|