@rescui/collapse 0.6.1 → 0.7.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 (6) hide show
  1. package/lib/_virtual/index.css.js +12 -12
  2. package/lib/accordion.js +7 -5
  3. package/lib/collapse.js +4 -6
  4. package/lib/collapse.p.module.css.js +32 -32
  5. package/lib/index.css +73 -73
  6. package/package.json +2 -2
package/lib/_virtual/index.css.js CHANGED
@@ -1,15 +1,15 @@
1
1
  var styles = {
2
- "icon": "_icon_elnixa_4",
3
- "sizeXS": "_sizeXS_elnixa_14",
4
- "sizeS": "_sizeS_elnixa_18",
5
- "sizeM": "_sizeM_elnixa_22",
6
- "sizeL": "_sizeL_elnixa_26",
7
- "light": "_light_elnixa_30",
8
- "dark": "_dark_elnixa_34",
9
- "allVariants": "_allVariants_elnixa_48",
10
- "variant16": "_variant16_elnixa_53",
11
- "variant20": "_variant20_elnixa_54",
12
- "variant24": "_variant24_elnixa_55",
13
- "variant28": "_variant28_elnixa_58"
2
+ "icon": "_icon_1vjehu8_4",
3
+ "sizeXS": "_sizeXS_1vjehu8_14",
4
+ "sizeS": "_sizeS_1vjehu8_18",
5
+ "sizeM": "_sizeM_1vjehu8_22",
6
+ "sizeL": "_sizeL_1vjehu8_26",
7
+ "light": "_light_1vjehu8_30",
8
+ "dark": "_dark_1vjehu8_34",
9
+ "allVariants": "_allVariants_1vjehu8_48",
10
+ "variant16": "_variant16_1vjehu8_53",
11
+ "variant20": "_variant20_1vjehu8_54",
12
+ "variant24": "_variant24_1vjehu8_55",
13
+ "variant28": "_variant28_1vjehu8_58"
14
14
  };
15
15
  export { styles as default };
package/lib/accordion.js CHANGED
@@ -2,7 +2,7 @@
2
2
  import React, { useState } from 'react';
3
3
  import cn from 'classnames';
4
4
  import PropTypes from 'prop-types';
5
- import { useThemeWithUndefined, ThemeProvider } from '@rescui/ui-contexts';
5
+ import { useThemeWithUndefined } from '@rescui/ui-contexts';
6
6
  import { collapseContext } from './context.js';
7
7
  import styles from './collapse.p.module.css.js';
8
8
  const GAP_STYLES = {
@@ -13,6 +13,10 @@ const GAP_STYLES = {
13
13
  24: styles.accordionGap24,
14
14
  32: styles.accordionGap32
15
15
  };
16
+ const THEME_STYLES = {
17
+ light: styles.themeLight,
18
+ dark: styles.themeDark
19
+ };
16
20
  const Accordion = /*#__PURE__*/React.forwardRef( // eslint-disable-next-line complexity
17
21
  (_ref, ref) => {
18
22
  let {
@@ -58,14 +62,12 @@ const Accordion = /*#__PURE__*/React.forwardRef( // eslint-disable-next-line com
58
62
  disableLeftPadding,
59
63
  openedClassName
60
64
  }
61
- }, /*#__PURE__*/React.createElement(ThemeProvider, {
62
- theme: theme
63
65
  }, /*#__PURE__*/React.createElement("div", {
64
66
  "data-test": 'accordion',
65
67
  ...restProps,
66
- className: cn(styles.accordion, GAP_STYLES[gap], className),
68
+ className: cn(styles.accordion, GAP_STYLES[gap], THEME_STYLES[theme], className),
67
69
  ref: ref
68
- }, children)));
70
+ }, children));
69
71
  });
70
72
  Accordion.displayName = 'Accordion';
71
73
  Accordion.propTypes = {
package/lib/collapse.js CHANGED
@@ -2,7 +2,7 @@
2
2
  import React, { useRef, useContext, useState, useEffect } from 'react';
3
3
  import cn from 'classnames';
4
4
  import PropTypes from 'prop-types';
5
- import { useThemeWithUndefined, ThemeProvider } from '@rescui/ui-contexts';
5
+ import { useThemeWithUndefined } from '@rescui/ui-contexts';
6
6
  import { useResizeObserver } from '@rescui/use-resize-observer';
7
7
  import RightIcon from './_virtual/right.js';
8
8
  import PlusIcon from './_virtual/plus.js';
@@ -119,9 +119,7 @@ const Collapse = /*#__PURE__*/React.forwardRef( // eslint-disable-next-line comp
119
119
  setActiveKey(key);
120
120
  }
121
121
  }, []);
122
- return /*#__PURE__*/React.createElement(ThemeProvider, {
123
- theme: theme
124
- }, /*#__PURE__*/React.createElement("div", {
122
+ return /*#__PURE__*/React.createElement("div", {
125
123
  "data-test": 'collapse',
126
124
  ...restProps,
127
125
  className: cn(className, styles.main, isOpening && styles.opening, isOpened && styles.opened, isClosing && !isStartedClosing && styles.closingTransition, isClosing && styles.closing, isClosed && styles.closed, !isClosed && openedClassName, SIZE_STYLES[size], MODE_STYLES[mode], ICON_STYLES[icon], borderBottom && styles.hasBorderBottom, disableLeftPadding && styles.disableLeftPadding, isRightIcon ? styles.rightIcon : styles.leftIcon, THEME_STYLES[theme]),
@@ -147,7 +145,7 @@ const Collapse = /*#__PURE__*/React.forwardRef( // eslint-disable-next-line comp
147
145
  // The reason we don't leave this style for OPEN stage is because some content of the expanded Collapse may change its height dynamically
148
146
  // This will be processed by resizeObserver, but some devices may lag behind
149
147
  // And to make collapsing transition work, we need to have a frame with numbered height value before starting the collapse transition
150
- height: (isOpening || isStartedClosing) && height
148
+ height: isOpening || isStartedClosing ? height : null
151
149
  },
152
150
  ref: contentRef,
153
151
  onTransitionEnd: handleTransitionEnd,
@@ -155,7 +153,7 @@ const Collapse = /*#__PURE__*/React.forwardRef( // eslint-disable-next-line comp
155
153
  }, /*#__PURE__*/React.createElement("div", {
156
154
  ref: resizeRef,
157
155
  className: styles.innerWrapper
158
- }, children))));
156
+ }, children)));
159
157
  });
160
158
  Collapse.displayName = 'Collapse';
161
159
  Collapse.propTypes = {
package/lib/collapse.p.module.css.js CHANGED
@@ -1,35 +1,35 @@
1
1
  var styles = {
2
- "themeLight": "_themeLight_1tk2g0g_6",
3
- "themeDark": "_themeDark_1tk2g0g_9",
4
- "sizeS": "_sizeS_1tk2g0g_13",
5
- "sizeM": "_sizeM_1tk2g0g_16",
6
- "sizeL": "_sizeL_1tk2g0g_19",
7
- "classic": "_classic_1tk2g0g_23",
8
- "rock": "_rock_1tk2g0g_26",
9
- "clear": "_clear_1tk2g0g_29",
10
- "hasBorderBottom": "_hasBorderBottom_1tk2g0g_33",
11
- "leftIcon": "_leftIcon_1tk2g0g_37",
12
- "rightIcon": "_rightIcon_1tk2g0g_40",
13
- "disableLeftPadding": "_disableLeftPadding_1tk2g0g_44",
14
- "main": "_main_1tk2g0g_48",
15
- "opening": "_opening_1tk2g0g_59",
16
- "opened": "_opened_1tk2g0g_60",
17
- "closing": "_closing_1tk2g0g_61",
18
- "title": "_title_1tk2g0g_95",
19
- "content": "_content_1tk2g0g_103",
20
- "closed": "_closed_1tk2g0g_111",
21
- "closingTransition": "_closingTransition_1tk2g0g_120",
22
- "innerWrapper": "_innerWrapper_1tk2g0g_127",
23
- "button": "_button_1tk2g0g_133",
24
- "icon": "_icon_1tk2g0g_186",
25
- "iconPlus": "_iconPlus_1tk2g0g_202",
26
- "iconArrow": "_iconArrow_1tk2g0g_207",
27
- "accordion": "_accordion_1tk2g0g_213",
28
- "accordionGap0": "_accordionGap0_1tk2g0g_218",
29
- "accordionGap8": "_accordionGap8_1tk2g0g_221",
30
- "accordionGap12": "_accordionGap12_1tk2g0g_224",
31
- "accordionGap16": "_accordionGap16_1tk2g0g_227",
32
- "accordionGap24": "_accordionGap24_1tk2g0g_230",
33
- "accordionGap32": "_accordionGap32_1tk2g0g_233"
2
+ "themeLight": "_themeLight_swbn7y_6",
3
+ "themeDark": "_themeDark_swbn7y_9",
4
+ "sizeS": "_sizeS_swbn7y_13",
5
+ "sizeM": "_sizeM_swbn7y_16",
6
+ "sizeL": "_sizeL_swbn7y_19",
7
+ "classic": "_classic_swbn7y_23",
8
+ "rock": "_rock_swbn7y_26",
9
+ "clear": "_clear_swbn7y_29",
10
+ "hasBorderBottom": "_hasBorderBottom_swbn7y_33",
11
+ "leftIcon": "_leftIcon_swbn7y_37",
12
+ "rightIcon": "_rightIcon_swbn7y_40",
13
+ "disableLeftPadding": "_disableLeftPadding_swbn7y_44",
14
+ "main": "_main_swbn7y_48",
15
+ "opening": "_opening_swbn7y_59",
16
+ "opened": "_opened_swbn7y_60",
17
+ "closing": "_closing_swbn7y_61",
18
+ "title": "_title_swbn7y_95",
19
+ "content": "_content_swbn7y_103",
20
+ "closed": "_closed_swbn7y_111",
21
+ "closingTransition": "_closingTransition_swbn7y_120",
22
+ "innerWrapper": "_innerWrapper_swbn7y_127",
23
+ "button": "_button_swbn7y_133",
24
+ "icon": "_icon_swbn7y_186",
25
+ "iconPlus": "_iconPlus_swbn7y_202",
26
+ "iconArrow": "_iconArrow_swbn7y_207",
27
+ "accordion": "_accordion_swbn7y_213",
28
+ "accordionGap0": "_accordionGap0_swbn7y_218",
29
+ "accordionGap8": "_accordionGap8_swbn7y_221",
30
+ "accordionGap12": "_accordionGap12_swbn7y_224",
31
+ "accordionGap16": "_accordionGap16_swbn7y_227",
32
+ "accordionGap24": "_accordionGap24_swbn7y_230",
33
+ "accordionGap32": "_accordionGap32_swbn7y_233"
34
34
  };
35
35
  export { styles as default };
package/lib/index.css CHANGED
@@ -1,4 +1,4 @@
1
- ._icon_elnixa_4{
1
+ ._icon_1vjehu8_4{
2
2
  --_rs-theme-dark:var(
3
3
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
4
4
  var(--rs-theme-dark, 0)
@@ -8,7 +8,7 @@
8
8
  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
9
9
  }
10
10
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
11
- ._icon_elnixa_4{
11
+ ._icon_1vjehu8_4{
12
12
  --_rs-color-primary:color-mix(in srgb, var(--rs-color-primary-light-theme, #6B57FF) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dark-theme, #8473FF) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
13
13
  --_rs-color-primary-dim:color-mix(in srgb, var(--rs-color-primary-dim-light-theme, #8979ff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dim-dark-theme, #6f61d2) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
14
14
  --_rs-color-primary-fog:color-mix(in srgb, var(--rs-color-primary-fog-light-theme, #e1ddff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-fog-dark-theme, #2e2b49) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
@@ -17,7 +17,7 @@
17
17
  }
18
18
  }
19
19
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
20
- ._icon_elnixa_4{
20
+ ._icon_1vjehu8_4{
21
21
  --_rs-color-primary:rgb(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255);
22
22
  --_rs-color-primary-dim:rgb(calc(var(--_rs-theme-light-coefficient, 1)*137 + var(--_rs-theme-dark-coefficient, 0)*111), calc(var(--_rs-theme-light-coefficient, 1)*121 + var(--_rs-theme-dark-coefficient, 0)*97), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*210));
23
23
  --_rs-color-primary-fog:rgb(calc(var(--_rs-theme-light-coefficient, 1)*225 + var(--_rs-theme-dark-coefficient, 0)*46), calc(var(--_rs-theme-light-coefficient, 1)*221 + var(--_rs-theme-dark-coefficient, 0)*43), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*73));
@@ -25,30 +25,30 @@
25
25
  --_rs-color-primary-t-fog:rgba(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255, calc(var(--_rs-theme-light-coefficient, 1)*0.2 + var(--_rs-theme-dark-coefficient, 0)*0.3));
26
26
  }
27
27
  }
28
- ._icon_elnixa_4{
28
+ ._icon_1vjehu8_4{
29
29
 
30
30
  fill:var(--_rs-icons-themed-fill-or-initial, currentcolor);
31
31
 
32
32
  width:var(--rs-icons-width, auto);
33
33
  height:var(--rs-icons-height, var(--_rs-icons-height));
34
34
  }
35
- ._sizeXS_elnixa_14{
35
+ ._sizeXS_1vjehu8_14{
36
36
  --_rs-icons-height:16px;
37
37
  }
38
- ._sizeS_elnixa_18{
38
+ ._sizeS_1vjehu8_18{
39
39
  --_rs-icons-height:20px;
40
40
  }
41
- ._sizeM_elnixa_22{
41
+ ._sizeM_1vjehu8_22{
42
42
  --_rs-icons-height:24px;
43
43
  }
44
- ._sizeL_elnixa_26{
44
+ ._sizeL_1vjehu8_26{
45
45
  --_rs-icons-height:28px;
46
46
  }
47
- ._light_elnixa_30{
47
+ ._light_1vjehu8_30{
48
48
  --rs-theme-dark:0;
49
49
  --_rs-icons-themed-fill-or-initial:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
50
50
  }
51
- ._dark_elnixa_34{
51
+ ._dark_1vjehu8_34{
52
52
  --rs-theme-dark:1;
53
53
  --_rs-icons-themed-fill-or-initial:rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227));
54
54
  }
@@ -60,54 +60,54 @@
60
60
  transform:rotate(360deg);
61
61
  }
62
62
  }
63
- ._allVariants_elnixa_48{
63
+ ._allVariants_1vjehu8_48{
64
64
  aspect-ratio:var(--rs-icon-ar-width, 1) / var(--rs-icon-ar-height, 1);
65
65
  container:rs-icon / size;
66
66
  }
67
- ._variant16_elnixa_53,
68
- ._variant20_elnixa_54,
69
- ._variant24_elnixa_55{
67
+ ._variant16_1vjehu8_53,
68
+ ._variant20_1vjehu8_54,
69
+ ._variant24_1vjehu8_55{
70
70
  display:none;
71
71
  }
72
- ._variant28_elnixa_58{
72
+ ._variant28_1vjehu8_58{
73
73
  display:block;
74
74
  }
75
75
  @container rs-icon (max-height: 24px){
76
- ._variant24_elnixa_55{
76
+ ._variant24_1vjehu8_55{
77
77
  display:block;
78
78
  }
79
- ._variant28_elnixa_58{
79
+ ._variant28_1vjehu8_58{
80
80
  display:none;
81
81
  }
82
82
  }
83
83
  @container rs-icon (max-height: 20px){
84
- ._variant20_elnixa_54{
84
+ ._variant20_1vjehu8_54{
85
85
  display:block;
86
86
  }
87
- ._variant24_elnixa_55{
87
+ ._variant24_1vjehu8_55{
88
88
  display:none;
89
89
  }
90
90
  }
91
91
  @container rs-icon (max-height: 16px){
92
- ._variant16_elnixa_53{
92
+ ._variant16_1vjehu8_53{
93
93
  display:block;
94
94
  }
95
- ._variant20_elnixa_54{
95
+ ._variant20_1vjehu8_54{
96
96
  display:none;
97
97
  }
98
98
  }
99
- ._themeLight_1tk2g0g_6{
99
+ ._themeLight_swbn7y_6{
100
100
  --rs-theme-dark:0;
101
101
  }
102
- ._themeDark_1tk2g0g_9{
102
+ ._themeDark_swbn7y_9{
103
103
  --rs-theme-dark:1;
104
104
  }
105
- ._sizeS_1tk2g0g_13{
105
+ ._sizeS_swbn7y_13{
106
106
  --_rs-collapse-vertical-padding:6px;
107
107
  --_rs-collapse-horizontal-padding:8px;
108
108
  --_rs-collapse-icon-size:20px;
109
109
  }
110
- ._sizeS_1tk2g0g_13 > [data-rs-internal='collapse__button'] > [data-rs-internal='collapse__title']{
110
+ ._sizeS_swbn7y_13 > [data-rs-internal='collapse__button'] > [data-rs-internal='collapse__title']{
111
111
  --_rs-typography-letter-spacing:var(--rs-h5-letter-spacing, normal);
112
112
  --_rs-typography-text-transform:initial;
113
113
  --_rs-typography-font-variant-numeric:initial;
@@ -138,7 +138,7 @@
138
138
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
139
139
  --_rs-typography-link-border-bottom-width-from-text:2px;
140
140
  }
141
- ._sizeS_1tk2g0g_13 > [data-rs-internal='collapse__content']{
141
+ ._sizeS_swbn7y_13 > [data-rs-internal='collapse__content']{
142
142
  --_rs-typography-letter-spacing:var(--rs-text-3-letter-spacing, 0.0045em);
143
143
  --_rs-typography-text-transform:initial;
144
144
  --_rs-typography-font-variant-numeric:initial;
@@ -172,12 +172,12 @@
172
172
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
173
173
  --_rs-typography-link-border-bottom-width-from-text:1px;
174
174
  }
175
- ._sizeM_1tk2g0g_16{
175
+ ._sizeM_swbn7y_16{
176
176
  --_rs-collapse-vertical-padding:8px;
177
177
  --_rs-collapse-horizontal-padding:8px;
178
178
  --_rs-collapse-icon-size:24px;
179
179
  }
180
- ._sizeM_1tk2g0g_16 > [data-rs-internal='collapse__button'] > [data-rs-internal='collapse__title']{
180
+ ._sizeM_swbn7y_16 > [data-rs-internal='collapse__button'] > [data-rs-internal='collapse__title']{
181
181
  --_rs-typography-letter-spacing:var(--rs-h4-letter-spacing, normal);
182
182
  --_rs-typography-text-transform:initial;
183
183
  --_rs-typography-font-variant-numeric:initial;
@@ -208,7 +208,7 @@
208
208
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
209
209
  --_rs-typography-link-border-bottom-width-from-text:2px;
210
210
  }
211
- ._sizeM_1tk2g0g_16 > [data-rs-internal='collapse__content']{
211
+ ._sizeM_swbn7y_16 > [data-rs-internal='collapse__content']{
212
212
  --_rs-typography-letter-spacing:var(--rs-text-2-letter-spacing, 0.0015em);
213
213
  --_rs-typography-text-transform:initial;
214
214
  --_rs-typography-font-variant-numeric:initial;
@@ -246,16 +246,16 @@
246
246
  --_rs-typography-link-border-bottom-width-from-text:1px;
247
247
  }
248
248
  @media screen and (max-width: 640px){
249
- ._sizeM_1tk2g0g_16 > [data-rs-internal='collapse__content']{
249
+ ._sizeM_swbn7y_16 > [data-rs-internal='collapse__content']{
250
250
  --_rs-typography-text-2-sm-list-li-margin-top-from-text:12px;
251
251
  }
252
252
  }
253
- ._sizeL_1tk2g0g_19{
253
+ ._sizeL_swbn7y_19{
254
254
  --_rs-collapse-vertical-padding:12px;
255
255
  --_rs-collapse-horizontal-padding:16px;
256
256
  --_rs-collapse-icon-size:28px;
257
257
  }
258
- ._sizeL_1tk2g0g_19 > [data-rs-internal='collapse__button'] > [data-rs-internal='collapse__title']{
258
+ ._sizeL_swbn7y_19 > [data-rs-internal='collapse__button'] > [data-rs-internal='collapse__title']{
259
259
  --_rs-typography-letter-spacing:var(--rs-h3-letter-spacing, normal);
260
260
  --_rs-typography-text-transform:initial;
261
261
  --_rs-typography-font-variant-numeric:initial;
@@ -286,7 +286,7 @@
286
286
  --_rs-typography-link-external-standalone-border-offset-from-text-base:1.02em;
287
287
  --_rs-typography-link-border-bottom-width-from-text:2px;
288
288
  }
289
- ._sizeL_1tk2g0g_19 > [data-rs-internal='collapse__content']{
289
+ ._sizeL_swbn7y_19 > [data-rs-internal='collapse__content']{
290
290
  --_rs-typography-letter-spacing:var(--rs-text-1-letter-spacing, normal);
291
291
  --_rs-typography-text-transform:initial;
292
292
  --_rs-typography-font-variant-numeric:initial;
@@ -324,11 +324,11 @@
324
324
  --_rs-typography-link-border-bottom-width-from-text:1px;
325
325
  }
326
326
  @media screen and (max-width: 640px){
327
- ._sizeL_1tk2g0g_19 > [data-rs-internal='collapse__content']{
327
+ ._sizeL_swbn7y_19 > [data-rs-internal='collapse__content']{
328
328
  --_rs-typography-text-1-sm-list-li-margin-top-from-text:16px;
329
329
  }
330
330
  }
331
- ._classic_1tk2g0g_23{
331
+ ._classic_swbn7y_23{
332
332
  --_rs-collapse-active-theme-flip:0;
333
333
  --_rs-collapse-active-background:rgba(
334
334
  calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227),
@@ -342,7 +342,7 @@
342
342
  );
343
343
  --_rs-collapse-button-hover-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 1);
344
344
  }
345
- ._rock_1tk2g0g_26{
345
+ ._rock_swbn7y_26{
346
346
  --_rs-collapse-active-theme-flip:1;
347
347
  --_rs-collapse-active-background:rgb(calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*230), calc(255 - var(--_rs-theme-dark-coefficient, 0)*227));
348
348
  --_rs-collapse-active-border-bottom-to-padding-multiplier:1;
@@ -353,7 +353,7 @@
353
353
  );
354
354
  --_rs-collapse-button-hover-color:rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 1);
355
355
  }
356
- ._clear_1tk2g0g_29{
356
+ ._clear_swbn7y_29{
357
357
  --_rs-collapse-active-theme-flip:0;
358
358
  --_rs-collapse-active-background:transparent;
359
359
  --_rs-collapse-active-border-bottom-to-padding-multiplier:0;
@@ -364,27 +364,27 @@
364
364
  0.7
365
365
  );
366
366
  }
367
- ._hasBorderBottom_1tk2g0g_33{
367
+ ._hasBorderBottom_swbn7y_33{
368
368
  --_rs-collapse-border-bottom-width-or-initial:1px;
369
369
  }
370
- ._leftIcon_1tk2g0g_37{
370
+ ._leftIcon_swbn7y_37{
371
371
  --_rs-collapse-button-flex-direction:row;
372
372
  --_rs-collapse-icon-margin:0 var(--_rs-collapse-horizontal-padding) 0 0;
373
373
  --_rs-collapse-inner-wrapper-padding-left-base:calc(var(--_rs-collapse-horizontal-padding)*2 + var(--_rs-collapse-icon-size));
374
374
  }
375
- ._rightIcon_1tk2g0g_40{
375
+ ._rightIcon_swbn7y_40{
376
376
  --_rs-collapse-button-flex-direction:row-reverse;
377
377
  --_rs-collapse-icon-margin:0 0 0 var(--_rs-collapse-horizontal-padding);
378
378
  --_rs-collapse-inner-wrapper-padding-left-base:var(
379
379
  --_rs-collapse-horizontal-padding
380
380
  );
381
381
  }
382
- ._disableLeftPadding_1tk2g0g_44{
382
+ ._disableLeftPadding_swbn7y_44{
383
383
  --_rs-collapse-inner-wrapper-padding-left-from-disable-left-padding-or-initial:var(
384
384
  --_rs-collapse-horizontal-padding
385
385
  );
386
386
  }
387
- ._main_1tk2g0g_48{
387
+ ._main_swbn7y_48{
388
388
  --_rs-theme-dark:var(
389
389
  --_rs-internal-force-theme-dark-consult-rescui-before-using,
390
390
  var(--rs-theme-dark, 0)
@@ -394,7 +394,7 @@
394
394
  --_rs-theme-light-coefficient:calc(1 - var(--_rs-theme-dark-coefficient));
395
395
  }
396
396
  @supports (color: color-mix(in srgb, #fff 50%, #000 50%)){
397
- ._main_1tk2g0g_48{
397
+ ._main_swbn7y_48{
398
398
  --_rs-color-primary:color-mix(in srgb, var(--rs-color-primary-light-theme, #6B57FF) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dark-theme, #8473FF) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
399
399
  --_rs-color-primary-dim:color-mix(in srgb, var(--rs-color-primary-dim-light-theme, #8979ff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-dim-dark-theme, #6f61d2) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
400
400
  --_rs-color-primary-fog:color-mix(in srgb, var(--rs-color-primary-fog-light-theme, #e1ddff) calc(100%*var(--_rs-theme-light-coefficient, 1)), var(--rs-color-primary-fog-dark-theme, #2e2b49) calc(100%*var(--_rs-theme-dark-coefficient, 0)));
@@ -403,7 +403,7 @@
403
403
  }
404
404
  }
405
405
  @supports not (color: color-mix(in srgb, #fff 50%, #000 50%)){
406
- ._main_1tk2g0g_48{
406
+ ._main_swbn7y_48{
407
407
  --_rs-color-primary:rgb(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255);
408
408
  --_rs-color-primary-dim:rgb(calc(var(--_rs-theme-light-coefficient, 1)*137 + var(--_rs-theme-dark-coefficient, 0)*111), calc(var(--_rs-theme-light-coefficient, 1)*121 + var(--_rs-theme-dark-coefficient, 0)*97), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*210));
409
409
  --_rs-color-primary-fog:rgb(calc(var(--_rs-theme-light-coefficient, 1)*225 + var(--_rs-theme-dark-coefficient, 0)*46), calc(var(--_rs-theme-light-coefficient, 1)*221 + var(--_rs-theme-dark-coefficient, 0)*43), calc(var(--_rs-theme-light-coefficient, 1)*255 + var(--_rs-theme-dark-coefficient, 0)*73));
@@ -411,7 +411,7 @@
411
411
  --_rs-color-primary-t-fog:rgba(calc(var(--_rs-theme-light-coefficient, 1)*107 + var(--_rs-theme-dark-coefficient, 0)*132), calc(var(--_rs-theme-light-coefficient, 1)*87 + var(--_rs-theme-dark-coefficient, 0)*115), 255, calc(var(--_rs-theme-light-coefficient, 1)*0.2 + var(--_rs-theme-dark-coefficient, 0)*0.3));
412
412
  }
413
413
  }
414
- ._main_1tk2g0g_48 {
414
+ ._main_swbn7y_48 {
415
415
  --_rs-collapse-border-bottom-width:var(
416
416
  --_rs-collapse-border-bottom-width-or-initial,
417
417
  0px
@@ -426,9 +426,9 @@
426
426
  border-bottom:var(--_rs-collapse-border-bottom-width) solid rgba(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227), 0.2);
427
427
  border-radius:var(--rs-collapse-border-radius, 0px);
428
428
  }
429
- ._main_1tk2g0g_48._opening_1tk2g0g_59,
430
- ._main_1tk2g0g_48._opened_1tk2g0g_60,
431
- ._main_1tk2g0g_48._closing_1tk2g0g_61{
429
+ ._main_swbn7y_48._opening_swbn7y_59,
430
+ ._main_swbn7y_48._opened_swbn7y_60,
431
+ ._main_swbn7y_48._closing_swbn7y_61{
432
432
  --rs-theme-flip:var(--_rs-collapse-active-theme-flip);
433
433
 
434
434
  padding-bottom:calc(var(--_rs-collapse-border-bottom-width)*var(--_rs-collapse-active-border-bottom-to-padding-multiplier));
@@ -438,7 +438,7 @@
438
438
  background:var(--_rs-collapse-active-background);
439
439
  }
440
440
  @media (hover: hover){
441
- ._main_1tk2g0g_48:hover{
441
+ ._main_swbn7y_48:hover{
442
442
  --rs-theme-flip:var(--_rs-collapse-active-theme-flip);
443
443
 
444
444
  padding-bottom:calc(var(--_rs-collapse-border-bottom-width)*var(--_rs-collapse-active-border-bottom-to-padding-multiplier));
@@ -448,7 +448,7 @@
448
448
  background:var(--_rs-collapse-active-background);
449
449
  }
450
450
  }
451
- ._title_1tk2g0g_95{
451
+ ._title_swbn7y_95{
452
452
  letter-spacing:var(
453
453
  --rs-text-base-letter-spacing,
454
454
  var(--_rs-typography-letter-spacing)
@@ -465,7 +465,7 @@
465
465
 
466
466
  color:inherit;
467
467
  }
468
- ._content_1tk2g0g_103{
468
+ ._content_swbn7y_103{
469
469
  letter-spacing:var(
470
470
  --rs-text-base-letter-spacing,
471
471
  var(--_rs-typography-letter-spacing)
@@ -486,22 +486,22 @@
486
486
 
487
487
  height:0;
488
488
  }
489
- ._closed_1tk2g0g_111 > ._content_1tk2g0g_103{
489
+ ._closed_swbn7y_111 > ._content_swbn7y_103{
490
490
  display:none;
491
491
  }
492
- ._opened_1tk2g0g_60 > ._content_1tk2g0g_103{
492
+ ._opened_swbn7y_60 > ._content_swbn7y_103{
493
493
  height:initial;
494
494
  }
495
- ._opening_1tk2g0g_59 > ._content_1tk2g0g_103,
496
- ._closingTransition_1tk2g0g_120 > ._content_1tk2g0g_103{
495
+ ._opening_swbn7y_59 > ._content_swbn7y_103,
496
+ ._closingTransition_swbn7y_120 > ._content_swbn7y_103{
497
497
  overflow:hidden;
498
498
 
499
499
  transition:height 300ms;
500
500
  }
501
- ._innerWrapper_1tk2g0g_127{
501
+ ._innerWrapper_swbn7y_127{
502
502
  padding:0 var(--_rs-collapse-horizontal-padding) var(--_rs-collapse-horizontal-padding) var(--_rs-collapse-inner-wrapper-padding-left);
503
503
  }
504
- ._button_1tk2g0g_133{
504
+ ._button_swbn7y_133{
505
505
  color:var(
506
506
  --rs-color-hard,
507
507
  rgb(calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(25 + var(--_rs-theme-dark-coefficient, 0)*230), calc(28 + var(--_rs-theme-dark-coefficient, 0)*227))
@@ -534,24 +534,24 @@
534
534
  -moz-osx-font-smoothing:inherit;
535
535
  -webkit-appearance:none;
536
536
  }
537
- ._button_1tk2g0g_133::-moz-focus-inner{
537
+ ._button_swbn7y_133::-moz-focus-inner{
538
538
  padding:0;
539
539
 
540
540
  border:0;
541
541
  }
542
- ._button_1tk2g0g_133:focus{
542
+ ._button_swbn7y_133:focus{
543
543
  outline:none;
544
544
  }
545
- ._button_1tk2g0g_133:focus[data-focus-method='key']{
545
+ ._button_swbn7y_133:focus[data-focus-method='key']{
546
546
  box-shadow:var(--_rs-color-primary-t-dim) 0 0 0 4px;
547
547
  }
548
548
  @media (hover: hover){
549
- ._button_1tk2g0g_133:hover{
549
+ ._button_swbn7y_133:hover{
550
550
  color:var(--_rs-collapse-button-hover-color);
551
551
  background:var(--_rs-collapse-button-hover-background);
552
552
  }
553
553
  }
554
- ._icon_1tk2g0g_186{
554
+ ._icon_swbn7y_186{
555
555
  position:relative;
556
556
  top:0;
557
557
  left:0;
@@ -567,34 +567,34 @@
567
567
 
568
568
  will-change:transform;
569
569
  }
570
- ._opening_1tk2g0g_59._iconPlus_1tk2g0g_202 > ._button_1tk2g0g_133 > ._icon_1tk2g0g_186,
571
- ._opened_1tk2g0g_60._iconPlus_1tk2g0g_202 > ._button_1tk2g0g_133 > ._icon_1tk2g0g_186{
570
+ ._opening_swbn7y_59._iconPlus_swbn7y_202 > ._button_swbn7y_133 > ._icon_swbn7y_186,
571
+ ._opened_swbn7y_60._iconPlus_swbn7y_202 > ._button_swbn7y_133 > ._icon_swbn7y_186{
572
572
  transform:rotate(45deg);
573
573
  }
574
- ._opening_1tk2g0g_59._iconArrow_1tk2g0g_207 > ._button_1tk2g0g_133 > ._icon_1tk2g0g_186,
575
- ._opened_1tk2g0g_60._iconArrow_1tk2g0g_207 > ._button_1tk2g0g_133 > ._icon_1tk2g0g_186{
574
+ ._opening_swbn7y_59._iconArrow_swbn7y_207 > ._button_swbn7y_133 > ._icon_swbn7y_186,
575
+ ._opened_swbn7y_60._iconArrow_swbn7y_207 > ._button_swbn7y_133 > ._icon_swbn7y_186{
576
576
  transform:rotate(90deg);
577
577
  }
578
- ._accordion_1tk2g0g_213{
578
+ ._accordion_swbn7y_213{
579
579
  display:flex;
580
580
  flex-direction:column;
581
581
  row-gap:var(--_rs-collapse-accordion-gap);
582
582
  }
583
- ._accordionGap0_1tk2g0g_218{
583
+ ._accordionGap0_swbn7y_218{
584
584
  --_rs-collapse-accordion-gap:0px;
585
585
  }
586
- ._accordionGap8_1tk2g0g_221{
586
+ ._accordionGap8_swbn7y_221{
587
587
  --_rs-collapse-accordion-gap:8px;
588
588
  }
589
- ._accordionGap12_1tk2g0g_224{
589
+ ._accordionGap12_swbn7y_224{
590
590
  --_rs-collapse-accordion-gap:12px;
591
591
  }
592
- ._accordionGap16_1tk2g0g_227{
592
+ ._accordionGap16_swbn7y_227{
593
593
  --_rs-collapse-accordion-gap:16px;
594
594
  }
595
- ._accordionGap24_1tk2g0g_230{
595
+ ._accordionGap24_swbn7y_230{
596
596
  --_rs-collapse-accordion-gap:24px;
597
597
  }
598
- ._accordionGap32_1tk2g0g_233{
598
+ ._accordionGap32_swbn7y_233{
599
599
  --_rs-collapse-accordion-gap:32px;
600
600
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/collapse",
3
- "version": "0.6.1",
3
+ "version": "0.7.0",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -36,5 +36,5 @@
36
36
  "build-pcss-api": "rescui-scripts build-pcss-api --file public-api.p.css"
37
37
  },
38
38
  "nx": {},
39
- "gitHead": "b2b55fdf195d7c1ebc651969df9918e452da7267"
39
+ "gitHead": "3426ad41a01573e7c1c1f3862ce853ada33dfea3"
40
40
  }