@semcore/side-panel 16.1.12 → 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 (9) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/README.md +4 -4
  3. package/lib/cjs/SidePanel.js +16 -16
  4. package/lib/cjs/style/side-panel.shadow.css +10 -10
  5. package/lib/es6/SidePanel.js +16 -16
  6. package/lib/es6/style/side-panel.shadow.css +10 -10
  7. package/lib/esm/SidePanel.mjs +17 -17
  8. package/lib/esm/style/side-panel.shadow.css +10 -10
  9. package/package.json +10 -10
package/CHANGELOG.md CHANGED
@@ -2,6 +2,12 @@
2
2
 
3
3
  CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
4
4
 
5
+ ## [16.2.0] - 2026-05-07
6
+
7
+ ### Added
8
+
9
+ - New brand theme.
10
+
5
11
  ## [16.1.12] - 2025-11-17
6
12
 
7
13
  ### Changed
package/README.md CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  [![version](https://img.shields.io/npm/v/@semcore/side-panel.svg)](https://www.npmjs.com/@semcore/side-panel)
4
4
  [![downloads](https://img.shields.io/npm/dt/@semcore/side-panel.svg)](https://www.npmjs.com/package/@semcore/side-panel)
5
- [![License: MIT](https://img.shields.io/badge/License-MIT-green.svg)](https://github.com/semrush/intergalactic/blob/master/LICENSE)
5
+ [![License: MIT](https://img.shields.io/badge/License-MIT-green.svg)](https://github.com/semrush/intergalactic/blob/HEAD/LICENSE)
6
6
 
7
7
  > This component is part of the Intergalactic Design System
8
8
 
@@ -20,13 +20,13 @@ npm install @semcore/side-panel
20
20
 
21
21
  ## 👤 Author
22
22
 
23
- [UI-kit team](https://github.com/semrush/intergalactic/blob/master/MAINTAINERS) and [others ❤️](https://github.com/semrush/intergalactic/graphs/contributors)
23
+ [UI-kit team](https://github.com/semrush/intergalactic/blob/HEAD/MAINTAINERS) and [others ❤️](https://github.com/semrush/intergalactic/graphs/contributors)
24
24
 
25
25
  ## 🤝 Contributing
26
26
 
27
27
  Contributions, issues and feature requests are welcome!
28
28
 
29
- Feel free to check [issues page](https://github.com/semrush/intergalactic/issues). You can also take a look at the [contributing guide](https://github.com/semrush/intergalactic/blob/master/CONTRIBUTING.md).
29
+ Feel free to check [issues page](https://github.com/semrush/intergalactic/issues). You can also take a look at the [contributing guide](https://github.com/semrush/intergalactic/blob/HEAD/CONTRIBUTING.md).
30
30
 
31
31
  ## Show your support
32
32
 
@@ -34,4 +34,4 @@ Give a ⭐️ if this project helped you!
34
34
 
35
35
  ## 📝 License
36
36
 
37
- This project is [MIT](https://github.com/semrush/intergalactic/blob/master/LICENSE) licensed.
37
+ This project is [MIT](https://github.com/semrush/intergalactic/blob/HEAD/LICENSE) licensed.
package/lib/cjs/SidePanel.js CHANGED
@@ -34,24 +34,24 @@ var _typography = require("@semcore/typography");
34
34
  var _react = _interopRequireDefault(require("react"));
35
35
  var _intergalacticDynamicLocales = require("./translations/__intergalactic-dynamic-locales");
36
36
  /*!__reshadow-styles__:"./style/side-panel.shadow.css"*/
37
- var style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SOverlay_1jesk_gg_{position:fixed;top:0;bottom:0;left:0;right:0;margin:0;display:flex;overflow:hidden;background:var(--intergalactic-overlay-primary, rgba(25, 27, 35, 0.7));-webkit-overflow-scrolling:touch;color:var(--intergalactic-text-primary, #191b23)}.___SPanel_1jesk_gg_{display:flex;flex-direction:column;width:260px;outline:0;font-family:inherit;position:fixed;box-sizing:border-box;will-change:transform;background:var(--intergalactic-bg-primary-neutral, #ffffff);z-index:1}.___SPanel_1jesk_gg_._placement_right_1jesk_gg_,.___SPanel_1jesk_gg_._placement_top_1jesk_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));top:0}.___SPanel_1jesk_gg_._placement_top_1jesk_gg_{width:100%;margin-bottom:auto;left:0}.___SPanel_1jesk_gg_._placement_right_1jesk_gg_{height:100vh;margin-left:auto;right:0}.___SPanel_1jesk_gg_._placement_bottom_1jesk_gg_,.___SPanel_1jesk_gg_._placement_left_1jesk_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));left:0}.___SPanel_1jesk_gg_._placement_bottom_1jesk_gg_{width:100%;margin-top:auto;bottom:0}.___SPanel_1jesk_gg_._placement_left_1jesk_gg_{height:100vh;margin-right:auto;top:0}.___SClose_1jesk_gg_{position:absolute;z-index:1;right:var(--intergalactic-spacing-2x, 8px);top:var(--intergalactic-spacing-2x, 8px)}.___SClose_1jesk_gg_ .___SAddon_1jesk_gg_:only-child{margin-left:calc(var(--intergalactic-spacing-2x, 8px) - 1px);margin-right:calc(var(--intergalactic-spacing-2x, 8px) - 1px)}.___SBack_1jesk_gg_{max-width:100%}.___SBack_1jesk_gg_ .___SInner_1jesk_gg_{display:flex}.___SBack_1jesk_gg_ .___SBackText_1jesk_gg_,.___STitle_1jesk_gg_{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.___STitle_1jesk_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%);font-weight:var(--intergalactic-bold, 700);color:var(--intergalactic-text-primary, #191b23)}.___SHeader_1jesk_gg_{padding-left:var(--intergalactic-spacing-6x, 24px);margin-bottom:var(--intergalactic-spacing-1x, 4px);padding-right:calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-4x, 16px));margin-top:var(--intergalactic-spacing-1x, 4px);min-height:calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-3x, 12px));box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, #c4c7cf);box-sizing:border-box}.___SFooter_1jesk_gg_{min-height:44px;box-shadow:inset 0 1px 0 var(--intergalactic-border-primary, #c4c7cf);box-sizing:border-box}.___SBody_1jesk_gg_{height:100%;overflow:auto;padding-left:var(--intergalactic-spacing-6x, 24px);padding-bottom:var(--intergalactic-spacing-4x, 16px);padding-right:var(--intergalactic-spacing-6x, 24px);padding-top:var(--intergalactic-spacing-4x, 16px)}", /*__inner_css_end__*/"1jesk_gg_"),
37
+ var style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SOverlay_1pgnv_gg_{position:fixed;top:0;bottom:0;left:0;right:0;margin:0;display:flex;overflow:hidden;background:var(--intergalactic-overlay-primary, rgba(0, 6, 3, 0.337));-webkit-overflow-scrolling:touch;color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}@supports (color:color(display-p3 0 0 0%)){.___SOverlay_1pgnv_gg_{background:var(--intergalactic-overlay-primary, rgba(0, 6, 3, 0.337))}@media (color-gamut:p3){.___SOverlay_1pgnv_gg_{background:var(--intergalactic-overlay-primary, color(display-p3 0.00414 0.0233 0.01269 / 0.337))}}}.___SPanel_1pgnv_gg_{display:flex;flex-direction:column;width:260px;outline:0;font-family:inherit;position:fixed;box-sizing:border-box;will-change:transform;background:var(--intergalactic-bg-primary-neutral, rgb(255, 255, 255));z-index:1}.___SPanel_1pgnv_gg_._placement_top_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07));width:100%;margin-bottom:auto;top:0;left:0}@supports (color:color(display-p3 0 0 0%)){.___SPanel_1pgnv_gg_._placement_top_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SPanel_1pgnv_gg_._placement_top_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SPanel_1pgnv_gg_._placement_right_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07));height:100vh;margin-left:auto;top:0;right:0}@supports (color:color(display-p3 0 0 0%)){.___SPanel_1pgnv_gg_._placement_right_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SPanel_1pgnv_gg_._placement_right_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SPanel_1pgnv_gg_._placement_bottom_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07));width:100%;margin-top:auto;bottom:0;left:0}@supports (color:color(display-p3 0 0 0%)){.___SPanel_1pgnv_gg_._placement_bottom_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SPanel_1pgnv_gg_._placement_bottom_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SPanel_1pgnv_gg_._placement_left_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07));height:100vh;margin-right:auto;top:0;left:0}@supports (color:color(display-p3 0 0 0%)){.___SPanel_1pgnv_gg_._placement_left_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SPanel_1pgnv_gg_._placement_left_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SClose_1pgnv_gg_{position:absolute;z-index:1;right:var(--intergalactic-spacing-2x, 8px);top:var(--intergalactic-spacing-2x, 8px)}.___SClose_1pgnv_gg_ .___SAddon_1pgnv_gg_:only-child{margin-left:calc(var(--intergalactic-spacing-2x, 8px) - 1px);margin-right:calc(var(--intergalactic-spacing-2x, 8px) - 1px)}.___SBack_1pgnv_gg_{max-width:100%}.___SBack_1pgnv_gg_ .___SInner_1pgnv_gg_{display:flex}.___SBack_1pgnv_gg_ .___SBackText_1pgnv_gg_,.___STitle_1pgnv_gg_{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.___STitle_1pgnv_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%);font-weight:var(--intergalactic-bold, 700);color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}.___SHeader_1pgnv_gg_{padding-left:var(--intergalactic-spacing-6x, 24px);margin-bottom:var(--intergalactic-spacing-1x, 4px);padding-right:calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-4x, 16px));margin-top:var(--intergalactic-spacing-1x, 4px);min-height:calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-3x, 12px));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_1pgnv_gg_{box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SHeader_1pgnv_gg_{box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SFooter_1pgnv_gg_{min-height:44px;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%)){.___SFooter_1pgnv_gg_{box-shadow:inset 0 1px 0 var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SFooter_1pgnv_gg_{box-shadow:inset 0 1px 0 var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SBody_1pgnv_gg_{height:100%;overflow:auto;padding-left:var(--intergalactic-spacing-6x, 24px);padding-bottom:var(--intergalactic-spacing-4x, 16px);padding-right:var(--intergalactic-spacing-6x, 24px);padding-top:var(--intergalactic-spacing-4x, 16px)}", /*__inner_css_end__*/"1pgnv_gg_"),
38
38
  /*__reshadow_css_end__*/
39
39
  {
40
- "__SOverlay": "___SOverlay_1jesk_gg_",
41
- "__SPanel": "___SPanel_1jesk_gg_",
42
- "_placement_top": "_placement_top_1jesk_gg_",
43
- "_placement_right": "_placement_right_1jesk_gg_",
44
- "_placement_bottom": "_placement_bottom_1jesk_gg_",
45
- "_placement_left": "_placement_left_1jesk_gg_",
46
- "__STitle": "___STitle_1jesk_gg_",
47
- "__SHeader": "___SHeader_1jesk_gg_",
48
- "__SFooter": "___SFooter_1jesk_gg_",
49
- "__SBody": "___SBody_1jesk_gg_",
50
- "__SClose": "___SClose_1jesk_gg_",
51
- "__SAddon": "___SAddon_1jesk_gg_",
52
- "__SBack": "___SBack_1jesk_gg_",
53
- "__SInner": "___SInner_1jesk_gg_",
54
- "__SBackText": "___SBackText_1jesk_gg_"
40
+ "__SOverlay": "___SOverlay_1pgnv_gg_",
41
+ "__SPanel": "___SPanel_1pgnv_gg_",
42
+ "_placement_top": "_placement_top_1pgnv_gg_",
43
+ "_placement_right": "_placement_right_1pgnv_gg_",
44
+ "_placement_bottom": "_placement_bottom_1pgnv_gg_",
45
+ "_placement_left": "_placement_left_1pgnv_gg_",
46
+ "__STitle": "___STitle_1pgnv_gg_",
47
+ "__SHeader": "___SHeader_1pgnv_gg_",
48
+ "__SFooter": "___SFooter_1pgnv_gg_",
49
+ "__SBody": "___SBody_1pgnv_gg_",
50
+ "__SClose": "___SClose_1pgnv_gg_",
51
+ "__SAddon": "___SAddon_1pgnv_gg_",
52
+ "__SBack": "___SBack_1pgnv_gg_",
53
+ "__SInner": "___SInner_1pgnv_gg_",
54
+ "__SBackText": "___SBackText_1pgnv_gg_"
55
55
  });
56
56
  var RootSidePanel = /*#__PURE__*/function (_Component) {
57
57
  function RootSidePanel() {
package/lib/cjs/style/side-panel.shadow.css CHANGED
@@ -7,9 +7,9 @@ SOverlay {
7
7
  margin: 0;
8
8
  display: flex;
9
9
  overflow: hidden;
10
- background: var(--intergalactic-overlay-primary, rgba(25, 27, 35, 0.7));
10
+ background: var(--intergalactic-overlay-primary, oklch(0.109 0.023 165.5 / 0.337));
11
11
  -webkit-overflow-scrolling: touch;
12
- color: var(--intergalactic-text-primary, #191b23);
12
+ color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
13
13
  }
14
14
 
15
15
  SPanel {
@@ -21,12 +21,12 @@ SPanel {
21
21
  position: fixed;
22
22
  box-sizing: border-box;
23
23
  will-change: transform;
24
- background: var(--intergalactic-bg-primary-neutral, #ffffff);
24
+ background: var(--intergalactic-bg-primary-neutral, oklch(1 0 0));
25
25
  z-index: 1;
26
26
  }
27
27
 
28
28
  SPanel[placement='top'] {
29
- box-shadow: var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));
29
+ box-shadow: var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px oklch(0.176 0.033 175.7 / 0.07));
30
30
  width: 100%;
31
31
  margin-bottom: auto;
32
32
  top: 0;
@@ -34,7 +34,7 @@ SPanel[placement='top'] {
34
34
  }
35
35
 
36
36
  SPanel[placement='right'] {
37
- box-shadow: var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));
37
+ box-shadow: var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px oklch(0.176 0.033 175.7 / 0.07));
38
38
  height: 100vh;
39
39
  margin-left: auto;
40
40
  top: 0;
@@ -42,7 +42,7 @@ SPanel[placement='right'] {
42
42
  }
43
43
 
44
44
  SPanel[placement='bottom'] {
45
- box-shadow: var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));
45
+ box-shadow: var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px oklch(0.176 0.033 175.7 / 0.07));
46
46
  width: 100%;
47
47
  margin-top: auto;
48
48
  bottom: 0;
@@ -50,7 +50,7 @@ SPanel[placement='bottom'] {
50
50
  }
51
51
 
52
52
  SPanel[placement='left'] {
53
- box-shadow: var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));
53
+ box-shadow: var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px oklch(0.176 0.033 175.7 / 0.07));
54
54
  height: 100vh;
55
55
  margin-right: auto;
56
56
  top: 0;
@@ -87,7 +87,7 @@ STitle {
87
87
  font-size: var(--intergalactic-fs-300, 16px);
88
88
  line-height: var(--intergalactic-lh-300, 150%);
89
89
  font-weight: var(--intergalactic-bold, 700);
90
- color: var(--intergalactic-text-primary, #191b23);
90
+ color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
91
91
  white-space: nowrap;
92
92
  overflow: hidden;
93
93
  text-overflow: ellipsis;
@@ -99,13 +99,13 @@ SHeader {
99
99
  padding-right: calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-4x, 16px));
100
100
  margin-top: var(--intergalactic-spacing-1x, 4px);
101
101
  min-height: calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-3x, 12px));
102
- box-shadow: inset 0 -1px 0 var(--intergalactic-border-primary, #c4c7cf);
102
+ box-shadow: inset 0 -1px 0 var(--intergalactic-border-primary, oklch(0.137 0.026 175.7 / 0.161));
103
103
  box-sizing: border-box;
104
104
  }
105
105
 
106
106
  SFooter {
107
107
  min-height: 44px;
108
- box-shadow: inset 0 1px 0 var(--intergalactic-border-primary, #c4c7cf);
108
+ box-shadow: inset 0 1px 0 var(--intergalactic-border-primary, oklch(0.137 0.026 175.7 / 0.161));
109
109
  box-sizing: border-box;
110
110
  }
111
111
 
package/lib/es6/SidePanel.js CHANGED
@@ -35,24 +35,24 @@ import Portal, { PortalProvider } from '@semcore/portal';
35
35
  import { Text } from '@semcore/typography';
36
36
  import React from 'react';
37
37
  /*!__reshadow-styles__:"./style/side-panel.shadow.css"*/
38
- var style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SOverlay_1jesk_gg_{position:fixed;top:0;bottom:0;left:0;right:0;margin:0;display:flex;overflow:hidden;background:var(--intergalactic-overlay-primary, rgba(25, 27, 35, 0.7));-webkit-overflow-scrolling:touch;color:var(--intergalactic-text-primary, #191b23)}.___SPanel_1jesk_gg_{display:flex;flex-direction:column;width:260px;outline:0;font-family:inherit;position:fixed;box-sizing:border-box;will-change:transform;background:var(--intergalactic-bg-primary-neutral, #ffffff);z-index:1}.___SPanel_1jesk_gg_._placement_right_1jesk_gg_,.___SPanel_1jesk_gg_._placement_top_1jesk_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));top:0}.___SPanel_1jesk_gg_._placement_top_1jesk_gg_{width:100%;margin-bottom:auto;left:0}.___SPanel_1jesk_gg_._placement_right_1jesk_gg_{height:100vh;margin-left:auto;right:0}.___SPanel_1jesk_gg_._placement_bottom_1jesk_gg_,.___SPanel_1jesk_gg_._placement_left_1jesk_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));left:0}.___SPanel_1jesk_gg_._placement_bottom_1jesk_gg_{width:100%;margin-top:auto;bottom:0}.___SPanel_1jesk_gg_._placement_left_1jesk_gg_{height:100vh;margin-right:auto;top:0}.___SClose_1jesk_gg_{position:absolute;z-index:1;right:var(--intergalactic-spacing-2x, 8px);top:var(--intergalactic-spacing-2x, 8px)}.___SClose_1jesk_gg_ .___SAddon_1jesk_gg_:only-child{margin-left:calc(var(--intergalactic-spacing-2x, 8px) - 1px);margin-right:calc(var(--intergalactic-spacing-2x, 8px) - 1px)}.___SBack_1jesk_gg_{max-width:100%}.___SBack_1jesk_gg_ .___SInner_1jesk_gg_{display:flex}.___SBack_1jesk_gg_ .___SBackText_1jesk_gg_,.___STitle_1jesk_gg_{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.___STitle_1jesk_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%);font-weight:var(--intergalactic-bold, 700);color:var(--intergalactic-text-primary, #191b23)}.___SHeader_1jesk_gg_{padding-left:var(--intergalactic-spacing-6x, 24px);margin-bottom:var(--intergalactic-spacing-1x, 4px);padding-right:calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-4x, 16px));margin-top:var(--intergalactic-spacing-1x, 4px);min-height:calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-3x, 12px));box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, #c4c7cf);box-sizing:border-box}.___SFooter_1jesk_gg_{min-height:44px;box-shadow:inset 0 1px 0 var(--intergalactic-border-primary, #c4c7cf);box-sizing:border-box}.___SBody_1jesk_gg_{height:100%;overflow:auto;padding-left:var(--intergalactic-spacing-6x, 24px);padding-bottom:var(--intergalactic-spacing-4x, 16px);padding-right:var(--intergalactic-spacing-6x, 24px);padding-top:var(--intergalactic-spacing-4x, 16px)}", /*__inner_css_end__*/"1jesk_gg_"),
38
+ var style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SOverlay_1pgnv_gg_{position:fixed;top:0;bottom:0;left:0;right:0;margin:0;display:flex;overflow:hidden;background:var(--intergalactic-overlay-primary, rgba(0, 6, 3, 0.337));-webkit-overflow-scrolling:touch;color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}@supports (color:color(display-p3 0 0 0%)){.___SOverlay_1pgnv_gg_{background:var(--intergalactic-overlay-primary, rgba(0, 6, 3, 0.337))}@media (color-gamut:p3){.___SOverlay_1pgnv_gg_{background:var(--intergalactic-overlay-primary, color(display-p3 0.00414 0.0233 0.01269 / 0.337))}}}.___SPanel_1pgnv_gg_{display:flex;flex-direction:column;width:260px;outline:0;font-family:inherit;position:fixed;box-sizing:border-box;will-change:transform;background:var(--intergalactic-bg-primary-neutral, rgb(255, 255, 255));z-index:1}.___SPanel_1pgnv_gg_._placement_top_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07));width:100%;margin-bottom:auto;top:0;left:0}@supports (color:color(display-p3 0 0 0%)){.___SPanel_1pgnv_gg_._placement_top_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SPanel_1pgnv_gg_._placement_top_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SPanel_1pgnv_gg_._placement_right_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07));height:100vh;margin-left:auto;top:0;right:0}@supports (color:color(display-p3 0 0 0%)){.___SPanel_1pgnv_gg_._placement_right_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SPanel_1pgnv_gg_._placement_right_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SPanel_1pgnv_gg_._placement_bottom_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07));width:100%;margin-top:auto;bottom:0;left:0}@supports (color:color(display-p3 0 0 0%)){.___SPanel_1pgnv_gg_._placement_bottom_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SPanel_1pgnv_gg_._placement_bottom_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SPanel_1pgnv_gg_._placement_left_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07));height:100vh;margin-right:auto;top:0;left:0}@supports (color:color(display-p3 0 0 0%)){.___SPanel_1pgnv_gg_._placement_left_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SPanel_1pgnv_gg_._placement_left_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SClose_1pgnv_gg_{position:absolute;z-index:1;right:var(--intergalactic-spacing-2x, 8px);top:var(--intergalactic-spacing-2x, 8px)}.___SClose_1pgnv_gg_ .___SAddon_1pgnv_gg_:only-child{margin-left:calc(var(--intergalactic-spacing-2x, 8px) - 1px);margin-right:calc(var(--intergalactic-spacing-2x, 8px) - 1px)}.___SBack_1pgnv_gg_{max-width:100%}.___SBack_1pgnv_gg_ .___SInner_1pgnv_gg_{display:flex}.___SBack_1pgnv_gg_ .___SBackText_1pgnv_gg_,.___STitle_1pgnv_gg_{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.___STitle_1pgnv_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%);font-weight:var(--intergalactic-bold, 700);color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}.___SHeader_1pgnv_gg_{padding-left:var(--intergalactic-spacing-6x, 24px);margin-bottom:var(--intergalactic-spacing-1x, 4px);padding-right:calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-4x, 16px));margin-top:var(--intergalactic-spacing-1x, 4px);min-height:calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-3x, 12px));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_1pgnv_gg_{box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SHeader_1pgnv_gg_{box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SFooter_1pgnv_gg_{min-height:44px;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%)){.___SFooter_1pgnv_gg_{box-shadow:inset 0 1px 0 var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SFooter_1pgnv_gg_{box-shadow:inset 0 1px 0 var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SBody_1pgnv_gg_{height:100%;overflow:auto;padding-left:var(--intergalactic-spacing-6x, 24px);padding-bottom:var(--intergalactic-spacing-4x, 16px);padding-right:var(--intergalactic-spacing-6x, 24px);padding-top:var(--intergalactic-spacing-4x, 16px)}", /*__inner_css_end__*/"1pgnv_gg_"),
39
39
  /*__reshadow_css_end__*/
40
40
  {
41
- "__SOverlay": "___SOverlay_1jesk_gg_",
42
- "__SPanel": "___SPanel_1jesk_gg_",
43
- "_placement_top": "_placement_top_1jesk_gg_",
44
- "_placement_right": "_placement_right_1jesk_gg_",
45
- "_placement_bottom": "_placement_bottom_1jesk_gg_",
46
- "_placement_left": "_placement_left_1jesk_gg_",
47
- "__STitle": "___STitle_1jesk_gg_",
48
- "__SHeader": "___SHeader_1jesk_gg_",
49
- "__SFooter": "___SFooter_1jesk_gg_",
50
- "__SBody": "___SBody_1jesk_gg_",
51
- "__SClose": "___SClose_1jesk_gg_",
52
- "__SAddon": "___SAddon_1jesk_gg_",
53
- "__SBack": "___SBack_1jesk_gg_",
54
- "__SInner": "___SInner_1jesk_gg_",
55
- "__SBackText": "___SBackText_1jesk_gg_"
41
+ "__SOverlay": "___SOverlay_1pgnv_gg_",
42
+ "__SPanel": "___SPanel_1pgnv_gg_",
43
+ "_placement_top": "_placement_top_1pgnv_gg_",
44
+ "_placement_right": "_placement_right_1pgnv_gg_",
45
+ "_placement_bottom": "_placement_bottom_1pgnv_gg_",
46
+ "_placement_left": "_placement_left_1pgnv_gg_",
47
+ "__STitle": "___STitle_1pgnv_gg_",
48
+ "__SHeader": "___SHeader_1pgnv_gg_",
49
+ "__SFooter": "___SFooter_1pgnv_gg_",
50
+ "__SBody": "___SBody_1pgnv_gg_",
51
+ "__SClose": "___SClose_1pgnv_gg_",
52
+ "__SAddon": "___SAddon_1pgnv_gg_",
53
+ "__SBack": "___SBack_1pgnv_gg_",
54
+ "__SInner": "___SInner_1pgnv_gg_",
55
+ "__SBackText": "___SBackText_1pgnv_gg_"
56
56
  });
57
57
  import { localizedMessages } from './translations/__intergalactic-dynamic-locales';
58
58
  var RootSidePanel = /*#__PURE__*/function (_Component) {
package/lib/es6/style/side-panel.shadow.css CHANGED
@@ -7,9 +7,9 @@ SOverlay {
7
7
  margin: 0;
8
8
  display: flex;
9
9
  overflow: hidden;
10
- background: var(--intergalactic-overlay-primary, rgba(25, 27, 35, 0.7));
10
+ background: var(--intergalactic-overlay-primary, oklch(0.109 0.023 165.5 / 0.337));
11
11
  -webkit-overflow-scrolling: touch;
12
- color: var(--intergalactic-text-primary, #191b23);
12
+ color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
13
13
  }
14
14
 
15
15
  SPanel {
@@ -21,12 +21,12 @@ SPanel {
21
21
  position: fixed;
22
22
  box-sizing: border-box;
23
23
  will-change: transform;
24
- background: var(--intergalactic-bg-primary-neutral, #ffffff);
24
+ background: var(--intergalactic-bg-primary-neutral, oklch(1 0 0));
25
25
  z-index: 1;
26
26
  }
27
27
 
28
28
  SPanel[placement='top'] {
29
- box-shadow: var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));
29
+ box-shadow: var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px oklch(0.176 0.033 175.7 / 0.07));
30
30
  width: 100%;
31
31
  margin-bottom: auto;
32
32
  top: 0;
@@ -34,7 +34,7 @@ SPanel[placement='top'] {
34
34
  }
35
35
 
36
36
  SPanel[placement='right'] {
37
- box-shadow: var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));
37
+ box-shadow: var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px oklch(0.176 0.033 175.7 / 0.07));
38
38
  height: 100vh;
39
39
  margin-left: auto;
40
40
  top: 0;
@@ -42,7 +42,7 @@ SPanel[placement='right'] {
42
42
  }
43
43
 
44
44
  SPanel[placement='bottom'] {
45
- box-shadow: var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));
45
+ box-shadow: var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px oklch(0.176 0.033 175.7 / 0.07));
46
46
  width: 100%;
47
47
  margin-top: auto;
48
48
  bottom: 0;
@@ -50,7 +50,7 @@ SPanel[placement='bottom'] {
50
50
  }
51
51
 
52
52
  SPanel[placement='left'] {
53
- box-shadow: var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));
53
+ box-shadow: var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px oklch(0.176 0.033 175.7 / 0.07));
54
54
  height: 100vh;
55
55
  margin-right: auto;
56
56
  top: 0;
@@ -87,7 +87,7 @@ STitle {
87
87
  font-size: var(--intergalactic-fs-300, 16px);
88
88
  line-height: var(--intergalactic-lh-300, 150%);
89
89
  font-weight: var(--intergalactic-bold, 700);
90
- color: var(--intergalactic-text-primary, #191b23);
90
+ color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
91
91
  white-space: nowrap;
92
92
  overflow: hidden;
93
93
  text-overflow: ellipsis;
@@ -99,13 +99,13 @@ SHeader {
99
99
  padding-right: calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-4x, 16px));
100
100
  margin-top: var(--intergalactic-spacing-1x, 4px);
101
101
  min-height: calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-3x, 12px));
102
- box-shadow: inset 0 -1px 0 var(--intergalactic-border-primary, #c4c7cf);
102
+ box-shadow: inset 0 -1px 0 var(--intergalactic-border-primary, oklch(0.137 0.026 175.7 / 0.161));
103
103
  box-sizing: border-box;
104
104
  }
105
105
 
106
106
  SFooter {
107
107
  min-height: 44px;
108
- box-shadow: inset 0 1px 0 var(--intergalactic-border-primary, #c4c7cf);
108
+ box-shadow: inset 0 1px 0 var(--intergalactic-border-primary, oklch(0.137 0.026 175.7 / 0.161));
109
109
  box-sizing: border-box;
110
110
  }
111
111
 
package/lib/esm/SidePanel.mjs CHANGED
@@ -30,26 +30,26 @@ var style = (
30
30
  /*__reshadow_css_start__*/
31
31
  (sstyled.insert(
32
32
  /*__inner_css_start__*/
33
- ".___SOverlay_1jesk_gg_{position:fixed;top:0;bottom:0;left:0;right:0;margin:0;display:flex;overflow:hidden;background:var(--intergalactic-overlay-primary, rgba(25, 27, 35, 0.7));-webkit-overflow-scrolling:touch;color:var(--intergalactic-text-primary, #191b23)}.___SPanel_1jesk_gg_{display:flex;flex-direction:column;width:260px;outline:0;font-family:inherit;position:fixed;box-sizing:border-box;will-change:transform;background:var(--intergalactic-bg-primary-neutral, #ffffff);z-index:1}.___SPanel_1jesk_gg_._placement_right_1jesk_gg_,.___SPanel_1jesk_gg_._placement_top_1jesk_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));top:0}.___SPanel_1jesk_gg_._placement_top_1jesk_gg_{width:100%;margin-bottom:auto;left:0}.___SPanel_1jesk_gg_._placement_right_1jesk_gg_{height:100vh;margin-left:auto;right:0}.___SPanel_1jesk_gg_._placement_bottom_1jesk_gg_,.___SPanel_1jesk_gg_._placement_left_1jesk_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));left:0}.___SPanel_1jesk_gg_._placement_bottom_1jesk_gg_{width:100%;margin-top:auto;bottom:0}.___SPanel_1jesk_gg_._placement_left_1jesk_gg_{height:100vh;margin-right:auto;top:0}.___SClose_1jesk_gg_{position:absolute;z-index:1;right:var(--intergalactic-spacing-2x, 8px);top:var(--intergalactic-spacing-2x, 8px)}.___SClose_1jesk_gg_ .___SAddon_1jesk_gg_:only-child{margin-left:calc(var(--intergalactic-spacing-2x, 8px) - 1px);margin-right:calc(var(--intergalactic-spacing-2x, 8px) - 1px)}.___SBack_1jesk_gg_{max-width:100%}.___SBack_1jesk_gg_ .___SInner_1jesk_gg_{display:flex}.___SBack_1jesk_gg_ .___SBackText_1jesk_gg_,.___STitle_1jesk_gg_{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.___STitle_1jesk_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%);font-weight:var(--intergalactic-bold, 700);color:var(--intergalactic-text-primary, #191b23)}.___SHeader_1jesk_gg_{padding-left:var(--intergalactic-spacing-6x, 24px);margin-bottom:var(--intergalactic-spacing-1x, 4px);padding-right:calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-4x, 16px));margin-top:var(--intergalactic-spacing-1x, 4px);min-height:calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-3x, 12px));box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, #c4c7cf);box-sizing:border-box}.___SFooter_1jesk_gg_{min-height:44px;box-shadow:inset 0 1px 0 var(--intergalactic-border-primary, #c4c7cf);box-sizing:border-box}.___SBody_1jesk_gg_{height:100%;overflow:auto;padding-left:var(--intergalactic-spacing-6x, 24px);padding-bottom:var(--intergalactic-spacing-4x, 16px);padding-right:var(--intergalactic-spacing-6x, 24px);padding-top:var(--intergalactic-spacing-4x, 16px)}",
33
+ ".___SOverlay_1pgnv_gg_{position:fixed;top:0;bottom:0;left:0;right:0;margin:0;display:flex;overflow:hidden;background:var(--intergalactic-overlay-primary, rgba(0, 6, 3, 0.337));-webkit-overflow-scrolling:touch;color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}@supports (color:color(display-p3 0 0 0%)){.___SOverlay_1pgnv_gg_{background:var(--intergalactic-overlay-primary, rgba(0, 6, 3, 0.337))}@media (color-gamut:p3){.___SOverlay_1pgnv_gg_{background:var(--intergalactic-overlay-primary, color(display-p3 0.00414 0.0233 0.01269 / 0.337))}}}.___SPanel_1pgnv_gg_{display:flex;flex-direction:column;width:260px;outline:0;font-family:inherit;position:fixed;box-sizing:border-box;will-change:transform;background:var(--intergalactic-bg-primary-neutral, rgb(255, 255, 255));z-index:1}.___SPanel_1pgnv_gg_._placement_top_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07));width:100%;margin-bottom:auto;top:0;left:0}@supports (color:color(display-p3 0 0 0%)){.___SPanel_1pgnv_gg_._placement_top_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SPanel_1pgnv_gg_._placement_top_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SPanel_1pgnv_gg_._placement_right_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07));height:100vh;margin-left:auto;top:0;right:0}@supports (color:color(display-p3 0 0 0%)){.___SPanel_1pgnv_gg_._placement_right_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SPanel_1pgnv_gg_._placement_right_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SPanel_1pgnv_gg_._placement_bottom_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07));width:100%;margin-top:auto;bottom:0;left:0}@supports (color:color(display-p3 0 0 0%)){.___SPanel_1pgnv_gg_._placement_bottom_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SPanel_1pgnv_gg_._placement_bottom_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SPanel_1pgnv_gg_._placement_left_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07));height:100vh;margin-right:auto;top:0;left:0}@supports (color:color(display-p3 0 0 0%)){.___SPanel_1pgnv_gg_._placement_left_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px rgba(0, 21, 16, 0.07))}@media (color-gamut:p3){.___SPanel_1pgnv_gg_._placement_left_1pgnv_gg_{box-shadow:var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px color(display-p3 0.01753 0.08157 0.06372 / 0.07))}}}.___SClose_1pgnv_gg_{position:absolute;z-index:1;right:var(--intergalactic-spacing-2x, 8px);top:var(--intergalactic-spacing-2x, 8px)}.___SClose_1pgnv_gg_ .___SAddon_1pgnv_gg_:only-child{margin-left:calc(var(--intergalactic-spacing-2x, 8px) - 1px);margin-right:calc(var(--intergalactic-spacing-2x, 8px) - 1px)}.___SBack_1pgnv_gg_{max-width:100%}.___SBack_1pgnv_gg_ .___SInner_1pgnv_gg_{display:flex}.___SBack_1pgnv_gg_ .___SBackText_1pgnv_gg_,.___STitle_1pgnv_gg_{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.___STitle_1pgnv_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%);font-weight:var(--intergalactic-bold, 700);color:var(--intergalactic-text-primary, rgba(1, 5, 0, 0.899))}.___SHeader_1pgnv_gg_{padding-left:var(--intergalactic-spacing-6x, 24px);margin-bottom:var(--intergalactic-spacing-1x, 4px);padding-right:calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-4x, 16px));margin-top:var(--intergalactic-spacing-1x, 4px);min-height:calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-3x, 12px));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_1pgnv_gg_{box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SHeader_1pgnv_gg_{box-shadow:inset 0-1px 0 var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SFooter_1pgnv_gg_{min-height:44px;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%)){.___SFooter_1pgnv_gg_{box-shadow:inset 0 1px 0 var(--intergalactic-border-primary, rgba(0, 12, 8, 0.161))}@media (color-gamut:p3){.___SFooter_1pgnv_gg_{box-shadow:inset 0 1px 0 var(--intergalactic-border-primary, color(display-p3 0.00798 0.04498 0.03219 / 0.161))}}}.___SBody_1pgnv_gg_{height:100%;overflow:auto;padding-left:var(--intergalactic-spacing-6x, 24px);padding-bottom:var(--intergalactic-spacing-4x, 16px);padding-right:var(--intergalactic-spacing-6x, 24px);padding-top:var(--intergalactic-spacing-4x, 16px)}",
34
34
  /*__inner_css_end__*/
35
- "1jesk_gg_"
35
+ "1pgnv_gg_"
36
36
  ), /*__reshadow_css_end__*/
37
37
  {
38
- "__SOverlay": "___SOverlay_1jesk_gg_",
39
- "__SPanel": "___SPanel_1jesk_gg_",
40
- "_placement_top": "_placement_top_1jesk_gg_",
41
- "_placement_right": "_placement_right_1jesk_gg_",
42
- "_placement_bottom": "_placement_bottom_1jesk_gg_",
43
- "_placement_left": "_placement_left_1jesk_gg_",
44
- "__STitle": "___STitle_1jesk_gg_",
45
- "__SHeader": "___SHeader_1jesk_gg_",
46
- "__SFooter": "___SFooter_1jesk_gg_",
47
- "__SBody": "___SBody_1jesk_gg_",
48
- "__SClose": "___SClose_1jesk_gg_",
49
- "__SAddon": "___SAddon_1jesk_gg_",
50
- "__SBack": "___SBack_1jesk_gg_",
51
- "__SInner": "___SInner_1jesk_gg_",
52
- "__SBackText": "___SBackText_1jesk_gg_"
38
+ "__SOverlay": "___SOverlay_1pgnv_gg_",
39
+ "__SPanel": "___SPanel_1pgnv_gg_",
40
+ "_placement_top": "_placement_top_1pgnv_gg_",
41
+ "_placement_right": "_placement_right_1pgnv_gg_",
42
+ "_placement_bottom": "_placement_bottom_1pgnv_gg_",
43
+ "_placement_left": "_placement_left_1pgnv_gg_",
44
+ "__STitle": "___STitle_1pgnv_gg_",
45
+ "__SHeader": "___SHeader_1pgnv_gg_",
46
+ "__SFooter": "___SFooter_1pgnv_gg_",
47
+ "__SBody": "___SBody_1pgnv_gg_",
48
+ "__SClose": "___SClose_1pgnv_gg_",
49
+ "__SAddon": "___SAddon_1pgnv_gg_",
50
+ "__SBack": "___SBack_1pgnv_gg_",
51
+ "__SInner": "___SInner_1pgnv_gg_",
52
+ "__SBackText": "___SBackText_1pgnv_gg_"
53
53
  })
54
54
  );
55
55
  var RootSidePanel = /* @__PURE__ */ (function(_Component) {
package/lib/esm/style/side-panel.shadow.css CHANGED
@@ -7,9 +7,9 @@ SOverlay {
7
7
  margin: 0;
8
8
  display: flex;
9
9
  overflow: hidden;
10
- background: var(--intergalactic-overlay-primary, rgba(25, 27, 35, 0.7));
10
+ background: var(--intergalactic-overlay-primary, oklch(0.109 0.023 165.5 / 0.337));
11
11
  -webkit-overflow-scrolling: touch;
12
- color: var(--intergalactic-text-primary, #191b23);
12
+ color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
13
13
  }
14
14
 
15
15
  SPanel {
@@ -21,12 +21,12 @@ SPanel {
21
21
  position: fixed;
22
22
  box-sizing: border-box;
23
23
  will-change: transform;
24
- background: var(--intergalactic-bg-primary-neutral, #ffffff);
24
+ background: var(--intergalactic-bg-primary-neutral, oklch(1 0 0));
25
25
  z-index: 1;
26
26
  }
27
27
 
28
28
  SPanel[placement='top'] {
29
- box-shadow: var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));
29
+ box-shadow: var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px oklch(0.176 0.033 175.7 / 0.07));
30
30
  width: 100%;
31
31
  margin-bottom: auto;
32
32
  top: 0;
@@ -34,7 +34,7 @@ SPanel[placement='top'] {
34
34
  }
35
35
 
36
36
  SPanel[placement='right'] {
37
- box-shadow: var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));
37
+ box-shadow: var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px oklch(0.176 0.033 175.7 / 0.07));
38
38
  height: 100vh;
39
39
  margin-left: auto;
40
40
  top: 0;
@@ -42,7 +42,7 @@ SPanel[placement='right'] {
42
42
  }
43
43
 
44
44
  SPanel[placement='bottom'] {
45
- box-shadow: var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));
45
+ box-shadow: var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px oklch(0.176 0.033 175.7 / 0.07));
46
46
  width: 100%;
47
47
  margin-top: auto;
48
48
  bottom: 0;
@@ -50,7 +50,7 @@ SPanel[placement='bottom'] {
50
50
  }
51
51
 
52
52
  SPanel[placement='left'] {
53
- box-shadow: var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));
53
+ box-shadow: var(--intergalactic-box-shadow-popper, 1px 1px 10px 0px oklch(0.176 0.033 175.7 / 0.07));
54
54
  height: 100vh;
55
55
  margin-right: auto;
56
56
  top: 0;
@@ -87,7 +87,7 @@ STitle {
87
87
  font-size: var(--intergalactic-fs-300, 16px);
88
88
  line-height: var(--intergalactic-lh-300, 150%);
89
89
  font-weight: var(--intergalactic-bold, 700);
90
- color: var(--intergalactic-text-primary, #191b23);
90
+ color: var(--intergalactic-text-primary, oklch(0.1 0.03 137 / 0.899));
91
91
  white-space: nowrap;
92
92
  overflow: hidden;
93
93
  text-overflow: ellipsis;
@@ -99,13 +99,13 @@ SHeader {
99
99
  padding-right: calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-4x, 16px));
100
100
  margin-top: var(--intergalactic-spacing-1x, 4px);
101
101
  min-height: calc(var(--intergalactic-spacing-10x, 40px) + var(--intergalactic-spacing-3x, 12px));
102
- box-shadow: inset 0 -1px 0 var(--intergalactic-border-primary, #c4c7cf);
102
+ box-shadow: inset 0 -1px 0 var(--intergalactic-border-primary, oklch(0.137 0.026 175.7 / 0.161));
103
103
  box-sizing: border-box;
104
104
  }
105
105
 
106
106
  SFooter {
107
107
  min-height: 44px;
108
- box-shadow: inset 0 1px 0 var(--intergalactic-border-primary, #c4c7cf);
108
+ box-shadow: inset 0 1px 0 var(--intergalactic-border-primary, oklch(0.137 0.026 175.7 / 0.161));
109
109
  box-sizing: border-box;
110
110
  }
111
111
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@semcore/side-panel",
3
3
  "description": "Semrush SidePanel Component",
4
- "version": "16.1.12",
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,16 +14,16 @@
14
14
  "types": "./lib/types/index.d.ts"
15
15
  },
16
16
  "dependencies": {
17
- "@semcore/animation": "16.0.7",
18
- "@semcore/button": "16.0.12",
19
- "@semcore/flex-box": "16.0.11",
20
- "@semcore/portal": "16.0.11",
21
- "@semcore/outside-click": "16.0.11",
22
- "@semcore/typography": "16.3.2",
23
- "@semcore/icon": "16.7.3"
17
+ "@semcore/animation": "16.1.0-prerelease.0",
18
+ "@semcore/button": "16.1.0-prerelease.0",
19
+ "@semcore/flex-box": "16.1.0-prerelease.0",
20
+ "@semcore/portal": "16.1.0-prerelease.0",
21
+ "@semcore/outside-click": "16.1.0-prerelease.0",
22
+ "@semcore/typography": "16.4.0-prerelease.0",
23
+ "@semcore/icon": "16.8.0-prerelease.0"
24
24
  },
25
25
  "peerDependencies": {
26
- "@semcore/base-components": "^16.0.0"
26
+ "@semcore/base-components": "^16.6.0-prerelease.0"
27
27
  },
28
28
  "repository": {
29
29
  "type": "git",
@@ -31,7 +31,7 @@
31
31
  "directory": "semcore/side-panel"
32
32
  },
33
33
  "devDependencies": {
34
- "@semcore/core": "16.5.1",
34
+ "@semcore/core": "16.6.0-prerelease.0",
35
35
  "@semcore/testing-utils": "1.0.0"
36
36
  },
37
37
  "scripts": {