@semcore/fullscreen-modal 2.0.23 → 2.1.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.
package/CHANGELOG.md CHANGED
@@ -2,6 +2,13 @@
2
2
 
3
3
  CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
4
4
 
5
+ ## [2.1.0] - 2022-10-10
6
+
7
+ ### Changed
8
+
9
+ - Added support for React 18 🔥
10
+ - Extended version range for dependency `@semcore/icons`.
11
+
5
12
  ## [2.0.23] - 2022-10-06
6
13
 
7
14
  ### Changed
@@ -56,22 +56,22 @@ var style = (
56
56
  /*__reshadow_css_start__*/
57
57
  _core.sstyled.insert(
58
58
  /*__inner_css_start__*/
59
- ":root {\n\n /* DEPRECATED START\n Deprecated variables should never be used in\n components styles but preserved for backward\n compatibility if they used in projects\n like `<Badge bg=\"red\">alpha</Badge>`\n */\n /* DEPRECATED END */\n}\n\n.___SFullscreenOverlay_8n20j_gg_ {\n padding: 0;\n}\n\n.___SFullscreenModal_8n20j_gg_ {\n height: 100%;\n display: flex;\n flex-direction: column;\n width: 100%;\n background: #ffffff;\n border-radius: 0;\n padding: 0;\n}\n\n.___SClose_8n20j_gg_,\n.___SBack_8n20j_gg_ {\n cursor: pointer;\n position: absolute;\n z-index: 1;\n}\n\n.___SClose_8n20j_gg_ {\n top: 17px;\n right: 23px;\n padding: 12px;\n color: #a9abb6\n}\n\n.___SClose_8n20j_gg_:hover {\n color: #8a8e9b;\n }\n\n.___SBack_8n20j_gg_ {\n top: 8px;\n left: 32px;\n display: flex;\n align-items: center;\n margin-bottom: 12px;\n color: #6c6e79;\n font-size: 12px;\n line-height: 1.33\n}\n\n.___SBack_8n20j_gg_:hover {\n color: #484a54;\n }\n\n.___SBackText_8n20j_gg_ {\n margin-left: 4px;\n font-size: 14px;\n line-height: 1.42;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.___STitle_8n20j_gg_,\n.___SDescription_8n20j_gg_ {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.___STitle_8n20j_gg_ {\n font-size: 24px;\n line-height: 1.17;\n font-weight: 700;\n font-family: FactorA-Bold, sans-serif;\n color: #191b23;\n}\n\n.___SDescription_8n20j_gg_ {\n display: flex;\n align-items: baseline;\n font-size: 12px;\n line-height: 1.33;\n color: #6c6e79\n}\n\n.___SDescription_8n20j_gg_::before {\n content: '';\n position: relative;\n top: 4px;\n display: block;\n margin-left: 12px;\n margin-right: 12px;\n height: 24px;\n width: 1px;\n background-color: #c4c7cf;\n }\n\n.___SHeader_8n20j_gg_ {\n display: flex;\n align-items: baseline;\n padding-left: 32px;\n padding-bottom: 8px;\n padding-right: 72px;\n padding-top: 40px;\n min-height: 76px;\n box-shadow: inset 0 -1px 0 #c4c7cf;\n box-sizing: border-box;\n}\n\n.___SFooter_8n20j_gg_ {\n min-height: 52px;\n box-shadow: inset 0 1px 1px 0 #c4c7cf;\n box-sizing: border-box;\n}\n\n.___SBody_8n20j_gg_ {\n display: flex;\n height: 100%;\n overflow: auto;\n}\n\n.___SSection_8n20j_gg_ {\n padding-top: 24px;\n padding-bottom: 24px;\n padding-left: 32px;\n padding-right: 32px;\n flex: 1 1 auto;\n}\n\n@media (prefers-reduced-motion) {\n .___SBackText_8n20j_gg_ {\n transition: none;\n }\n}\n"
59
+ ":root {\n\n /* DEPRECATED START\n Deprecated variables should never be used in\n components styles but preserved for backward\n compatibility if they used in projects\n like `<Badge bg=\"red\">alpha</Badge>`\n */\n /* DEPRECATED END */\n}\n\n.___SFullscreenOverlay_373wf_gg_ {\n padding: 0;\n}\n\n.___SFullscreenModal_373wf_gg_ {\n height: 100%;\n display: flex;\n flex-direction: column;\n width: 100%;\n background: #ffffff;\n border-radius: 0;\n padding: 0;\n}\n\n.___SClose_373wf_gg_,\n.___SBack_373wf_gg_ {\n cursor: pointer;\n position: absolute;\n z-index: 1;\n}\n\n.___SClose_373wf_gg_ {\n top: 17px;\n right: 23px;\n padding: 12px;\n color: #a9abb6\n}\n\n.___SClose_373wf_gg_:hover {\n color: #8a8e9b;\n }\n\n.___SBack_373wf_gg_ {\n top: 8px;\n left: 32px;\n display: flex;\n align-items: center;\n margin-bottom: 12px;\n color: #6c6e79;\n font-size: 12px;\n line-height: 1.33\n}\n\n.___SBack_373wf_gg_:hover {\n color: #484a54;\n }\n\n.___SBackText_373wf_gg_ {\n margin-left: 4px;\n font-size: 14px;\n line-height: 1.42;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.___STitle_373wf_gg_,\n.___SDescription_373wf_gg_ {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.___STitle_373wf_gg_ {\n font-size: 24px;\n line-height: 1.17;\n font-weight: 700;\n font-family: FactorA-Bold, sans-serif;\n color: #191b23;\n}\n\n.___SDescription_373wf_gg_ {\n display: flex;\n align-items: baseline;\n font-size: 12px;\n line-height: 1.33;\n color: #6c6e79\n}\n\n.___SDescription_373wf_gg_::before {\n content: '';\n position: relative;\n top: 4px;\n display: block;\n margin-left: 12px;\n margin-right: 12px;\n height: 24px;\n width: 1px;\n background-color: #c4c7cf;\n }\n\n.___SHeader_373wf_gg_ {\n display: flex;\n align-items: baseline;\n padding-left: 32px;\n padding-bottom: 8px;\n padding-right: 72px;\n padding-top: 40px;\n min-height: 76px;\n box-shadow: inset 0 -1px 0 #c4c7cf;\n box-sizing: border-box;\n}\n\n.___SFooter_373wf_gg_ {\n min-height: 52px;\n box-shadow: inset 0 1px 1px 0 #c4c7cf;\n box-sizing: border-box;\n}\n\n.___SBody_373wf_gg_ {\n display: flex;\n height: 100%;\n overflow: auto;\n}\n\n.___SSection_373wf_gg_ {\n padding-top: 24px;\n padding-bottom: 24px;\n padding-left: 32px;\n padding-right: 32px;\n flex: 1 1 auto;\n}\n\n@media (prefers-reduced-motion) {\n .___SBackText_373wf_gg_ {\n transition: none;\n }\n}\n"
60
60
  /*__inner_css_end__*/
61
- , "8n20j_gg_")
61
+ , "373wf_gg_")
62
62
  /*__reshadow_css_end__*/
63
63
  , {
64
- "__SFullscreenOverlay": "___SFullscreenOverlay_8n20j_gg_",
65
- "__SFullscreenModal": "___SFullscreenModal_8n20j_gg_",
66
- "__SClose": "___SClose_8n20j_gg_",
67
- "__SBack": "___SBack_8n20j_gg_",
68
- "__SBackText": "___SBackText_8n20j_gg_",
69
- "__STitle": "___STitle_8n20j_gg_",
70
- "__SDescription": "___SDescription_8n20j_gg_",
71
- "__SHeader": "___SHeader_8n20j_gg_",
72
- "__SFooter": "___SFooter_8n20j_gg_",
73
- "__SBody": "___SBody_8n20j_gg_",
74
- "__SSection": "___SSection_8n20j_gg_"
64
+ "__SFullscreenOverlay": "___SFullscreenOverlay_373wf_gg_",
65
+ "__SFullscreenModal": "___SFullscreenModal_373wf_gg_",
66
+ "__SClose": "___SClose_373wf_gg_",
67
+ "__SBack": "___SBack_373wf_gg_",
68
+ "__SBackText": "___SBackText_373wf_gg_",
69
+ "__STitle": "___STitle_373wf_gg_",
70
+ "__SDescription": "___SDescription_373wf_gg_",
71
+ "__SHeader": "___SHeader_373wf_gg_",
72
+ "__SFooter": "___SFooter_373wf_gg_",
73
+ "__SBody": "___SBody_373wf_gg_",
74
+ "__SSection": "___SSection_373wf_gg_"
75
75
  });
76
76
 
77
77
  var FullscreenModalRoot = /*#__PURE__*/function (_Component) {
@@ -38,22 +38,22 @@ var style = (
38
38
  /*__reshadow_css_start__*/
39
39
  _sstyled.insert(
40
40
  /*__inner_css_start__*/
41
- ":root {\n\n /* DEPRECATED START\n Deprecated variables should never be used in\n components styles but preserved for backward\n compatibility if they used in projects\n like `<Badge bg=\"red\">alpha</Badge>`\n */\n /* DEPRECATED END */\n}\n\n.___SFullscreenOverlay_8n20j_gg_ {\n padding: 0;\n}\n\n.___SFullscreenModal_8n20j_gg_ {\n height: 100%;\n display: flex;\n flex-direction: column;\n width: 100%;\n background: #ffffff;\n border-radius: 0;\n padding: 0;\n}\n\n.___SClose_8n20j_gg_,\n.___SBack_8n20j_gg_ {\n cursor: pointer;\n position: absolute;\n z-index: 1;\n}\n\n.___SClose_8n20j_gg_ {\n top: 17px;\n right: 23px;\n padding: 12px;\n color: #a9abb6\n}\n\n.___SClose_8n20j_gg_:hover {\n color: #8a8e9b;\n }\n\n.___SBack_8n20j_gg_ {\n top: 8px;\n left: 32px;\n display: flex;\n align-items: center;\n margin-bottom: 12px;\n color: #6c6e79;\n font-size: 12px;\n line-height: 1.33\n}\n\n.___SBack_8n20j_gg_:hover {\n color: #484a54;\n }\n\n.___SBackText_8n20j_gg_ {\n margin-left: 4px;\n font-size: 14px;\n line-height: 1.42;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.___STitle_8n20j_gg_,\n.___SDescription_8n20j_gg_ {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.___STitle_8n20j_gg_ {\n font-size: 24px;\n line-height: 1.17;\n font-weight: 700;\n font-family: FactorA-Bold, sans-serif;\n color: #191b23;\n}\n\n.___SDescription_8n20j_gg_ {\n display: flex;\n align-items: baseline;\n font-size: 12px;\n line-height: 1.33;\n color: #6c6e79\n}\n\n.___SDescription_8n20j_gg_::before {\n content: '';\n position: relative;\n top: 4px;\n display: block;\n margin-left: 12px;\n margin-right: 12px;\n height: 24px;\n width: 1px;\n background-color: #c4c7cf;\n }\n\n.___SHeader_8n20j_gg_ {\n display: flex;\n align-items: baseline;\n padding-left: 32px;\n padding-bottom: 8px;\n padding-right: 72px;\n padding-top: 40px;\n min-height: 76px;\n box-shadow: inset 0 -1px 0 #c4c7cf;\n box-sizing: border-box;\n}\n\n.___SFooter_8n20j_gg_ {\n min-height: 52px;\n box-shadow: inset 0 1px 1px 0 #c4c7cf;\n box-sizing: border-box;\n}\n\n.___SBody_8n20j_gg_ {\n display: flex;\n height: 100%;\n overflow: auto;\n}\n\n.___SSection_8n20j_gg_ {\n padding-top: 24px;\n padding-bottom: 24px;\n padding-left: 32px;\n padding-right: 32px;\n flex: 1 1 auto;\n}\n\n@media (prefers-reduced-motion) {\n .___SBackText_8n20j_gg_ {\n transition: none;\n }\n}\n"
41
+ ":root {\n\n /* DEPRECATED START\n Deprecated variables should never be used in\n components styles but preserved for backward\n compatibility if they used in projects\n like `<Badge bg=\"red\">alpha</Badge>`\n */\n /* DEPRECATED END */\n}\n\n.___SFullscreenOverlay_373wf_gg_ {\n padding: 0;\n}\n\n.___SFullscreenModal_373wf_gg_ {\n height: 100%;\n display: flex;\n flex-direction: column;\n width: 100%;\n background: #ffffff;\n border-radius: 0;\n padding: 0;\n}\n\n.___SClose_373wf_gg_,\n.___SBack_373wf_gg_ {\n cursor: pointer;\n position: absolute;\n z-index: 1;\n}\n\n.___SClose_373wf_gg_ {\n top: 17px;\n right: 23px;\n padding: 12px;\n color: #a9abb6\n}\n\n.___SClose_373wf_gg_:hover {\n color: #8a8e9b;\n }\n\n.___SBack_373wf_gg_ {\n top: 8px;\n left: 32px;\n display: flex;\n align-items: center;\n margin-bottom: 12px;\n color: #6c6e79;\n font-size: 12px;\n line-height: 1.33\n}\n\n.___SBack_373wf_gg_:hover {\n color: #484a54;\n }\n\n.___SBackText_373wf_gg_ {\n margin-left: 4px;\n font-size: 14px;\n line-height: 1.42;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.___STitle_373wf_gg_,\n.___SDescription_373wf_gg_ {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n}\n\n.___STitle_373wf_gg_ {\n font-size: 24px;\n line-height: 1.17;\n font-weight: 700;\n font-family: FactorA-Bold, sans-serif;\n color: #191b23;\n}\n\n.___SDescription_373wf_gg_ {\n display: flex;\n align-items: baseline;\n font-size: 12px;\n line-height: 1.33;\n color: #6c6e79\n}\n\n.___SDescription_373wf_gg_::before {\n content: '';\n position: relative;\n top: 4px;\n display: block;\n margin-left: 12px;\n margin-right: 12px;\n height: 24px;\n width: 1px;\n background-color: #c4c7cf;\n }\n\n.___SHeader_373wf_gg_ {\n display: flex;\n align-items: baseline;\n padding-left: 32px;\n padding-bottom: 8px;\n padding-right: 72px;\n padding-top: 40px;\n min-height: 76px;\n box-shadow: inset 0 -1px 0 #c4c7cf;\n box-sizing: border-box;\n}\n\n.___SFooter_373wf_gg_ {\n min-height: 52px;\n box-shadow: inset 0 1px 1px 0 #c4c7cf;\n box-sizing: border-box;\n}\n\n.___SBody_373wf_gg_ {\n display: flex;\n height: 100%;\n overflow: auto;\n}\n\n.___SSection_373wf_gg_ {\n padding-top: 24px;\n padding-bottom: 24px;\n padding-left: 32px;\n padding-right: 32px;\n flex: 1 1 auto;\n}\n\n@media (prefers-reduced-motion) {\n .___SBackText_373wf_gg_ {\n transition: none;\n }\n}\n"
42
42
  /*__inner_css_end__*/
43
- , "8n20j_gg_")
43
+ , "373wf_gg_")
44
44
  /*__reshadow_css_end__*/
45
45
  , {
46
- "__SFullscreenOverlay": "___SFullscreenOverlay_8n20j_gg_",
47
- "__SFullscreenModal": "___SFullscreenModal_8n20j_gg_",
48
- "__SClose": "___SClose_8n20j_gg_",
49
- "__SBack": "___SBack_8n20j_gg_",
50
- "__SBackText": "___SBackText_8n20j_gg_",
51
- "__STitle": "___STitle_8n20j_gg_",
52
- "__SDescription": "___SDescription_8n20j_gg_",
53
- "__SHeader": "___SHeader_8n20j_gg_",
54
- "__SFooter": "___SFooter_8n20j_gg_",
55
- "__SBody": "___SBody_8n20j_gg_",
56
- "__SSection": "___SSection_8n20j_gg_"
46
+ "__SFullscreenOverlay": "___SFullscreenOverlay_373wf_gg_",
47
+ "__SFullscreenModal": "___SFullscreenModal_373wf_gg_",
48
+ "__SClose": "___SClose_373wf_gg_",
49
+ "__SBack": "___SBack_373wf_gg_",
50
+ "__SBackText": "___SBackText_373wf_gg_",
51
+ "__STitle": "___STitle_373wf_gg_",
52
+ "__SDescription": "___SDescription_373wf_gg_",
53
+ "__SHeader": "___SHeader_373wf_gg_",
54
+ "__SFooter": "___SFooter_373wf_gg_",
55
+ "__SBody": "___SBody_373wf_gg_",
56
+ "__SSection": "___SSection_373wf_gg_"
57
57
  });
58
58
 
59
59
  var FullscreenModalRoot = /*#__PURE__*/function (_Component) {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/fullscreen-modal",
3
3
  "description": "Semrush FullscreenModal Component",
4
- "version": "2.0.23",
4
+ "version": "2.1.0",
5
5
  "main": "lib/cjs/index.js",
6
6
  "module": "lib/es6/index.js",
7
7
  "typings": "lib/types/index.d.ts",
@@ -10,14 +10,14 @@
10
10
  "license": "MIT",
11
11
  "dependencies": {
12
12
  "@semcore/utils": "^3.21",
13
- "@semcore/icon": "^2.16",
13
+ "@semcore/icon": "2.16 - 3",
14
14
  "@semcore/modal": "^3.0.1",
15
15
  "@semcore/typography": "^4",
16
16
  "@semcore/flex-box": "^4"
17
17
  },
18
18
  "peerDependencies": {
19
19
  "@semcore/core": "^1.11",
20
- "react": "16.8 - 17"
20
+ "react": "16.8 - 18"
21
21
  },
22
22
  "jest": {
23
23
  "preset": "@semcore/jest-preset-ui"
@@ -28,7 +28,7 @@
28
28
  "directory": "semcore/fullscreen-modal"
29
29
  },
30
30
  "devDependencies": {
31
- "@types/react": "16.8 - 17",
31
+ "@types/react": "18.0.21",
32
32
  "@semcore/jest-preset-ui": "1.0.0"
33
33
  },
34
34
  "scripts": {