@semcore/accordion 16.8.0-prerelease.4 → 17.0.0-prerelease.18
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 +14 -2
- package/README.md +4 -4
- package/lib/cjs/Accordion.js +183 -205
- package/lib/cjs/Accordion.js.map +1 -1
- package/lib/cjs/index.d.js.map +1 -1
- package/lib/cjs/index.js +4 -4
- package/lib/cjs/index.js.map +1 -1
- package/lib/cjs/style/accordion.shadow.css +1 -0
- package/lib/es6/Accordion.js +170 -194
- package/lib/es6/Accordion.js.map +1 -1
- package/lib/es6/index.d.js.map +1 -1
- package/lib/es6/style/accordion.shadow.css +1 -0
- package/lib/esm/Accordion.mjs +166 -168
- package/lib/esm/style/accordion.shadow.css +1 -0
- package/lib/types/index.d.ts +2 -20
- package/package.json +8 -8
package/CHANGELOG.md
CHANGED
|
@@ -2,11 +2,23 @@
|
|
|
2
2
|
|
|
3
3
|
CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
|
|
4
4
|
|
|
5
|
-
## [
|
|
5
|
+
## [17.0.0] - 2026-02-18
|
|
6
|
+
|
|
7
|
+
### BREAK
|
|
8
|
+
|
|
9
|
+
- New major version.
|
|
10
|
+
|
|
11
|
+
## [16.7.2] - 2025-11-17
|
|
12
|
+
|
|
13
|
+
### Changed
|
|
14
|
+
|
|
15
|
+
- Version patch update due to children dependencies update (`@semcore/icon` [16.7.2 ~> 16.7.3], `@semcore/button` [16.0.11 ~> 16.0.12]).
|
|
16
|
+
|
|
17
|
+
## [16.7.1] - 2025-10-29
|
|
6
18
|
|
|
7
19
|
### Changed
|
|
8
20
|
|
|
9
|
-
- Version
|
|
21
|
+
- Version patch update due to children dependencies update (`@semcore/icon` [16.5.1 ~> 16.7.2], `@semcore/base-components` [16.4.0 ~> 16.4.1]).
|
|
10
22
|
|
|
11
23
|
## [16.7.0] - 2025-10-06
|
|
12
24
|
|
package/README.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
[](https://www.npmjs.com/@semcore/accordion)
|
|
4
4
|
[](https://www.npmjs.com/package/@semcore/accordion)
|
|
5
|
-
[](https://github.com/semrush/intergalactic/blob/
|
|
5
|
+
[](https://github.com/semrush/intergalactic/blob/HEAD/LICENSE)
|
|
6
6
|
|
|
7
7
|
> This component is part of the Intergalactic Design System
|
|
8
8
|
|
|
@@ -20,7 +20,7 @@ npm install @semcore/accordion
|
|
|
20
20
|
|
|
21
21
|
## 👤 Author
|
|
22
22
|
|
|
23
|
-
[UI-kit team](https://github.com/semrush/intergalactic/blob/
|
|
23
|
+
[UI-kit team](https://github.com/semrush/intergalactic/blob/HEAD/MAINTAINERS)
|
|
24
24
|
and [others ❤️](https://github.com/semrush/intergalactic/graphs/contributors)
|
|
25
25
|
|
|
26
26
|
## 🤝 Contributing
|
|
@@ -28,7 +28,7 @@ and [others ❤️](https://github.com/semrush/intergalactic/graphs/contributors
|
|
|
28
28
|
Contributions, issues and feature requests are welcome!
|
|
29
29
|
|
|
30
30
|
Feel free to check [issues page](https://github.com/semrush/intergalactic/issues). You can also take a look at
|
|
31
|
-
the [contributing guide](https://github.com/semrush/intergalactic/blob/
|
|
31
|
+
the [contributing guide](https://github.com/semrush/intergalactic/blob/HEAD/CONTRIBUTING.md).
|
|
32
32
|
|
|
33
33
|
## Show your support
|
|
34
34
|
|
|
@@ -36,4 +36,4 @@ Give a ⭐️ if this project helped you!
|
|
|
36
36
|
|
|
37
37
|
## 📝 License
|
|
38
38
|
|
|
39
|
-
This project is [MIT](https://github.com/semrush/intergalactic/blob/
|
|
39
|
+
This project is [MIT](https://github.com/semrush/intergalactic/blob/HEAD/LICENSE) licensed.
|
package/lib/cjs/Accordion.js
CHANGED
|
@@ -1,273 +1,251 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.wrapAccordion = exports
|
|
8
|
-
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
9
|
-
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
|
|
10
|
-
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
11
|
-
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
12
|
-
var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSuper"));
|
|
13
|
-
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
7
|
+
exports.wrapAccordion = exports.default = exports.RootItem = void 0;
|
|
14
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
15
9
|
var _core = require("@semcore/core");
|
|
16
|
-
var
|
|
10
|
+
var _baseComponents = require("@semcore/base-components");
|
|
17
11
|
var _uniqueID = _interopRequireDefault(require("@semcore/core/lib/utils/uniqueID"));
|
|
18
12
|
var _useCssVariable = require("@semcore/core/lib/utils/useCssVariable");
|
|
19
|
-
var _flexBox = require("@semcore/flex-box");
|
|
20
13
|
var _l = _interopRequireDefault(require("@semcore/icon/ChevronRight/l"));
|
|
21
14
|
var _m = _interopRequireDefault(require("@semcore/icon/ChevronRight/m"));
|
|
22
15
|
var _typography = require("@semcore/typography");
|
|
23
16
|
var _react = _interopRequireDefault(require("react"));
|
|
24
17
|
/*!__reshadow-styles__:"./style/accordion.shadow.css"*/
|
|
25
|
-
|
|
18
|
+
const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SItemToggle_1vyp0_gg_{display:flex;align-items:center;position:relative;cursor:pointer;outline:0}.___SItemToggle_1vyp0_gg_.__use_1vyp0_gg_.__use_1vyp0_gg_{color:var(--intergalactic-text-primary, #191b23);font-weight:var(--intergalactic-regular, 400)}.___SItemToggle_1vyp0_gg_.__use_1vyp0_gg_._use_primary_1vyp0_gg_{background-color:var(--intergalactic-bg-secondary-neutral, #f4f5f9);padding:var(--intergalactic-spacing-2x, 8px) var(--intergalactic-spacing-3x, 12px);margin-bottom:var(--intergalactic-spacing-05x, 2px)}@media (hover:hover){.___SItemToggle_1vyp0_gg_.__use_1vyp0_gg_._use_primary_1vyp0_gg_:hover{background-color:var(--intergalactic-bg-secondary-neutral-hover, #e0e1e9)}}.___SItemToggle_1vyp0_gg_.__disabled_1vyp0_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default}.___SItemChevron_1vyp0_gg_{margin-right:var(--intergalactic-spacing-2x, 8px);transform:rotate(0deg);transition:transform calc(var(--intergalactic-duration-accordion, 200)*1ms) ease-out;fill:var(--intergalactic-icon-primary-neutral, #6c6e79)}.___SItemChevron_1vyp0_gg_.__selected_1vyp0_gg_{transform:rotate(90deg)}@media (prefers-reduced-motion){.___SItemChevron_1vyp0_gg_{transition:none}}", /*__inner_css_end__*/"1vyp0_gg_"),
|
|
26
19
|
/*__reshadow_css_end__*/
|
|
27
20
|
{
|
|
28
|
-
"__SItemToggle": "
|
|
29
|
-
"_use": "
|
|
30
|
-
"_use_primary": "
|
|
31
|
-
"_disabled": "
|
|
32
|
-
"__SItemChevron": "
|
|
33
|
-
"_selected": "
|
|
21
|
+
"__SItemToggle": "___SItemToggle_1vyp0_gg_",
|
|
22
|
+
"_use": "__use_1vyp0_gg_",
|
|
23
|
+
"_use_primary": "_use_primary_1vyp0_gg_",
|
|
24
|
+
"_disabled": "__disabled_1vyp0_gg_",
|
|
25
|
+
"__SItemChevron": "___SItemChevron_1vyp0_gg_",
|
|
26
|
+
"_selected": "__selected_1vyp0_gg_"
|
|
34
27
|
});
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
(0,
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
_this = (0, _callSuper2["default"])(this, RootAccordion, [].concat(args));
|
|
43
|
-
(0, _defineProperty2["default"])(_this, "handleToggleInteraction", function (newValue) {
|
|
44
|
-
var value = _this.asProps.value;
|
|
28
|
+
class RootAccordion extends _core.Component {
|
|
29
|
+
constructor(...args) {
|
|
30
|
+
super(...args);
|
|
31
|
+
(0, _defineProperty2.default)(this, "handleToggleInteraction", newValue => {
|
|
32
|
+
const {
|
|
33
|
+
value
|
|
34
|
+
} = this.asProps;
|
|
45
35
|
if (Array.isArray(value)) {
|
|
46
|
-
|
|
47
|
-
|
|
36
|
+
const indexOfNewValue = value.indexOf(newValue);
|
|
37
|
+
const result = [...value];
|
|
48
38
|
// eslint-disable-next-line @typescript-eslint/no-unused-expressions
|
|
49
39
|
indexOfNewValue === -1 ? result.push(newValue) : result.splice(indexOfNewValue, 1);
|
|
50
|
-
|
|
40
|
+
this.handlers.value(result);
|
|
51
41
|
} else {
|
|
52
|
-
|
|
42
|
+
this.handlers.value(value === newValue ? null : newValue);
|
|
53
43
|
}
|
|
54
44
|
});
|
|
55
|
-
return _this;
|
|
56
45
|
}
|
|
57
|
-
(
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
}(_core.Component);
|
|
89
|
-
(0, _defineProperty2["default"])(RootAccordion, "displayName", 'Accordion');
|
|
90
|
-
(0, _defineProperty2["default"])(RootAccordion, "style", style);
|
|
91
|
-
(0, _defineProperty2["default"])(RootAccordion, "defaultProps", {
|
|
46
|
+
uncontrolledProps() {
|
|
47
|
+
return {
|
|
48
|
+
value: null
|
|
49
|
+
};
|
|
50
|
+
}
|
|
51
|
+
getItemProps({
|
|
52
|
+
value
|
|
53
|
+
}) {
|
|
54
|
+
const {
|
|
55
|
+
value: selectedValue,
|
|
56
|
+
duration,
|
|
57
|
+
use
|
|
58
|
+
} = this.asProps;
|
|
59
|
+
const selected = Array.isArray(selectedValue) ? selectedValue.includes(value) : selectedValue === value;
|
|
60
|
+
return {
|
|
61
|
+
selected,
|
|
62
|
+
duration,
|
|
63
|
+
use,
|
|
64
|
+
$handleInteraction: this.handleToggleInteraction
|
|
65
|
+
};
|
|
66
|
+
}
|
|
67
|
+
render() {
|
|
68
|
+
const {
|
|
69
|
+
Children
|
|
70
|
+
} = this.asProps;
|
|
71
|
+
return /*#__PURE__*/_react.default.createElement(Children, null);
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
(0, _defineProperty2.default)(RootAccordion, "displayName", 'Accordion');
|
|
75
|
+
(0, _defineProperty2.default)(RootAccordion, "style", style);
|
|
76
|
+
(0, _defineProperty2.default)(RootAccordion, "defaultProps", {
|
|
92
77
|
defaultValue: [],
|
|
93
78
|
use: 'secondary'
|
|
94
79
|
});
|
|
95
|
-
(0, _defineProperty2
|
|
80
|
+
(0, _defineProperty2.default)(RootAccordion, "enhance", [(0, _useCssVariable.cssVariableEnhance)({
|
|
96
81
|
variable: '--intergalactic-duration-accordion',
|
|
97
82
|
fallback: '200',
|
|
98
83
|
map: Number.parseInt,
|
|
99
84
|
prop: 'duration'
|
|
100
85
|
})]);
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
(0,
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
(0, _defineProperty2["default"])(_this2, "handleClick", function () {
|
|
110
|
-
var _this2$asProps = _this2.asProps,
|
|
111
|
-
value = _this2$asProps.value,
|
|
112
|
-
$handleInteraction = _this2$asProps.$handleInteraction;
|
|
86
|
+
class RootItem extends _core.Component {
|
|
87
|
+
constructor(...args) {
|
|
88
|
+
super(...args);
|
|
89
|
+
(0, _defineProperty2.default)(this, "handleClick", () => {
|
|
90
|
+
const {
|
|
91
|
+
value,
|
|
92
|
+
$handleInteraction
|
|
93
|
+
} = this.asProps;
|
|
113
94
|
$handleInteraction(value);
|
|
114
95
|
});
|
|
115
|
-
return _this2;
|
|
116
96
|
}
|
|
117
|
-
(
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
}
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
(
|
|
187
|
-
(0, _defineProperty2
|
|
188
|
-
(0, _defineProperty2
|
|
189
|
-
var Toggle = /*#__PURE__*/function (_Component3) {
|
|
190
|
-
function Toggle() {
|
|
191
|
-
var _this3;
|
|
192
|
-
(0, _classCallCheck2["default"])(this, Toggle);
|
|
193
|
-
for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
|
|
194
|
-
args[_key3] = arguments[_key3];
|
|
195
|
-
}
|
|
196
|
-
_this3 = (0, _callSuper2["default"])(this, Toggle, [].concat(args));
|
|
197
|
-
(0, _defineProperty2["default"])(_this3, "toggleRef", /*#__PURE__*/_react["default"].createRef());
|
|
198
|
-
(0, _defineProperty2["default"])(_this3, "handleKeyDown", function (event) {
|
|
97
|
+
getToggleProps() {
|
|
98
|
+
const {
|
|
99
|
+
value,
|
|
100
|
+
uid,
|
|
101
|
+
disabled,
|
|
102
|
+
use
|
|
103
|
+
} = this.asProps;
|
|
104
|
+
return {
|
|
105
|
+
use,
|
|
106
|
+
disabled,
|
|
107
|
+
onClick: disabled ? undefined : this.handleClick,
|
|
108
|
+
id: `igc-${uid}-${value}-toggle`,
|
|
109
|
+
tag: 'h3',
|
|
110
|
+
size: 300,
|
|
111
|
+
tabIndex: disabled ? -1 : 0
|
|
112
|
+
};
|
|
113
|
+
}
|
|
114
|
+
getToggleButtonProps() {
|
|
115
|
+
const {
|
|
116
|
+
value,
|
|
117
|
+
uid,
|
|
118
|
+
selected,
|
|
119
|
+
disabled
|
|
120
|
+
} = this.asProps;
|
|
121
|
+
return {
|
|
122
|
+
disabled,
|
|
123
|
+
'id': `igc-${uid}-${value}-toggle-button`,
|
|
124
|
+
'aria-expanded': selected ? 'true' : 'false',
|
|
125
|
+
'aria-controls': selected ? `igc-${uid}-${value}-collapse` : undefined
|
|
126
|
+
};
|
|
127
|
+
}
|
|
128
|
+
getCollapseProps() {
|
|
129
|
+
const {
|
|
130
|
+
selected,
|
|
131
|
+
uid,
|
|
132
|
+
duration,
|
|
133
|
+
value
|
|
134
|
+
} = this.asProps;
|
|
135
|
+
return {
|
|
136
|
+
selected,
|
|
137
|
+
duration,
|
|
138
|
+
'id': `igc-${uid}-${value}-collapse`,
|
|
139
|
+
'role': 'region',
|
|
140
|
+
'aria-labelledby': `igc-${uid}-${value}-toggle-button`
|
|
141
|
+
};
|
|
142
|
+
}
|
|
143
|
+
getChevronProps() {
|
|
144
|
+
const {
|
|
145
|
+
selected,
|
|
146
|
+
size
|
|
147
|
+
} = this.asProps;
|
|
148
|
+
return {
|
|
149
|
+
selected,
|
|
150
|
+
size
|
|
151
|
+
};
|
|
152
|
+
}
|
|
153
|
+
render() {
|
|
154
|
+
const {
|
|
155
|
+
Children
|
|
156
|
+
} = this.asProps;
|
|
157
|
+
return /*#__PURE__*/_react.default.createElement(Children, null);
|
|
158
|
+
}
|
|
159
|
+
}
|
|
160
|
+
exports.RootItem = RootItem;
|
|
161
|
+
(0, _defineProperty2.default)(RootItem, "displayName", 'Item');
|
|
162
|
+
(0, _defineProperty2.default)(RootItem, "style", style);
|
|
163
|
+
(0, _defineProperty2.default)(RootItem, "enhance", [(0, _uniqueID.default)()]);
|
|
164
|
+
class Toggle extends _core.Component {
|
|
165
|
+
constructor(...args) {
|
|
166
|
+
super(...args);
|
|
167
|
+
(0, _defineProperty2.default)(this, "toggleRef", /*#__PURE__*/_react.default.createRef());
|
|
168
|
+
(0, _defineProperty2.default)(this, "handleKeyDown", event => {
|
|
199
169
|
if (event.key === 'Enter') {
|
|
200
|
-
if (
|
|
170
|
+
if (this.toggleRef.current === event.target) {
|
|
201
171
|
event.currentTarget.click();
|
|
202
172
|
}
|
|
203
173
|
} else if (event.key === ' ') {
|
|
204
174
|
event.preventDefault();
|
|
205
|
-
if (
|
|
175
|
+
if (this.toggleRef.current === event.target) {
|
|
206
176
|
event.currentTarget.click();
|
|
207
177
|
}
|
|
208
178
|
}
|
|
209
179
|
});
|
|
210
|
-
return _this3;
|
|
211
180
|
}
|
|
212
|
-
(
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
return _ref5 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SItemToggle, _ref5.cn("SItemToggle", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
|
|
181
|
+
render() {
|
|
182
|
+
var _ref = this.asProps,
|
|
183
|
+
_ref5;
|
|
184
|
+
const {
|
|
185
|
+
styles,
|
|
186
|
+
use
|
|
187
|
+
} = this.asProps;
|
|
188
|
+
const SItemToggle = _typography.Text;
|
|
189
|
+
return _ref5 = (0, _core.sstyled)(styles), /*#__PURE__*/_react.default.createElement(SItemToggle, _ref5.cn("SItemToggle", {
|
|
190
|
+
...(0, _core.assignProps)({
|
|
223
191
|
"use": use,
|
|
224
192
|
"ref": this.toggleRef,
|
|
225
193
|
"innerOutline": true,
|
|
226
194
|
"onKeyDown": this.handleKeyDown
|
|
227
|
-
}, _ref)
|
|
228
|
-
}
|
|
229
|
-
}
|
|
230
|
-
}
|
|
195
|
+
}, _ref)
|
|
196
|
+
}));
|
|
197
|
+
}
|
|
198
|
+
}
|
|
231
199
|
function Chevron(props) {
|
|
232
200
|
var _ref2 = arguments[0],
|
|
233
201
|
_ref6;
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
202
|
+
const {
|
|
203
|
+
styles,
|
|
204
|
+
size
|
|
205
|
+
} = props;
|
|
206
|
+
const SItemChevron = size === 'l' ? _l.default : _m.default;
|
|
207
|
+
return _ref6 = (0, _core.sstyled)(styles), /*#__PURE__*/_react.default.createElement(SItemChevron, _ref6.cn("SItemChevron", {
|
|
208
|
+
...(0, _core.assignProps)({}, _ref2)
|
|
209
|
+
}));
|
|
238
210
|
}
|
|
239
211
|
function ToggleButton(props) {
|
|
240
212
|
var _ref3 = arguments[0],
|
|
241
213
|
_ref7;
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
214
|
+
const {
|
|
215
|
+
styles
|
|
216
|
+
} = props;
|
|
217
|
+
const SToggleButton = _baseComponents.Flex;
|
|
218
|
+
return _ref7 = (0, _core.sstyled)(styles), /*#__PURE__*/_react.default.createElement(SToggleButton, _ref7.cn("SToggleButton", {
|
|
219
|
+
...(0, _core.assignProps)({
|
|
220
|
+
"alignItems": 'center',
|
|
221
|
+
"role": 'button',
|
|
222
|
+
...props
|
|
223
|
+
}, _ref3)
|
|
224
|
+
}));
|
|
248
225
|
}
|
|
249
226
|
function Collapse(props) {
|
|
250
227
|
var _ref4 = arguments[0];
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
228
|
+
const {
|
|
229
|
+
selected
|
|
230
|
+
} = props;
|
|
231
|
+
const visible = selected;
|
|
232
|
+
return /*#__PURE__*/_react.default.createElement(_baseComponents.Collapse, (0, _core.assignProps)({
|
|
254
233
|
"visible": visible,
|
|
255
234
|
"interactive": true,
|
|
256
235
|
"inert": !visible ? '' : undefined,
|
|
257
236
|
"aria-hidden": !visible
|
|
258
237
|
}, _ref4));
|
|
259
238
|
}
|
|
260
|
-
|
|
261
|
-
Toggle
|
|
262
|
-
Chevron
|
|
263
|
-
ToggleButton
|
|
264
|
-
Collapse
|
|
239
|
+
const Item = (0, _core.createComponent)(RootItem, {
|
|
240
|
+
Toggle,
|
|
241
|
+
Chevron,
|
|
242
|
+
ToggleButton,
|
|
243
|
+
Collapse
|
|
265
244
|
});
|
|
266
|
-
|
|
267
|
-
Item
|
|
245
|
+
const Accordion = (0, _core.createComponent)(RootAccordion, {
|
|
246
|
+
Item
|
|
268
247
|
});
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
var _default = exports["default"] = Accordion;
|
|
248
|
+
const wrapAccordion = wrapper => wrapper;
|
|
249
|
+
exports.wrapAccordion = wrapAccordion;
|
|
250
|
+
var _default = exports.default = Accordion;
|
|
273
251
|
//# sourceMappingURL=Accordion.js.map
|
package/lib/cjs/Accordion.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.js","names":["_core","require","_animation","_uniqueID","_interopRequireDefault","_useCssVariable","_flexBox","_l","_m","_typography","_react","style","sstyled","insert","RootAccordion","_Component","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","_callSuper2","concat","_defineProperty2","newValue","value","asProps","isArray","indexOfNewValue","indexOf","result","_toConsumableArray2","push","splice","handlers","_inherits2","_createClass2","key","uncontrolledProps","getItemProps","_ref8","_this$asProps","selectedValue","duration","use","selected","includes","$handleInteraction","handleToggleInteraction","render","Children","createElement","Component","defaultValue","cssVariableEnhance","variable","fallback","map","Number","parseInt","prop","RootItem","exports","_Component2","_this2","_len2","_key2","_this2$asProps","getToggleProps","_this$asProps2","uid","disabled","onClick","undefined","handleClick","id","tag","size","tabIndex","getToggleButtonProps","_this$asProps3","getCollapseProps","_this$asProps4","getChevronProps","_this$asProps5","uniqueIDEnhancement","Toggle","_Component3","_this3","_len3","_key3","React","createRef","event","toggleRef","current","target","currentTarget","click","preventDefault","_ref","_ref5","_this$asProps6","styles","SItemToggle","Text","cn","_objectSpread2","assignProps","handleKeyDown","Chevron","props","_ref2","arguments[0]","_ref6","SItemChevron","ChevronRightL","ChevronRightM","ToggleButton","_ref3","_ref7","SToggleButton","Flex","Collapse","_ref4","visible","CollapseAnimate","Item","createComponent","Accordion","wrapAccordion","wrapper","_default"],"sources":["../../src/Accordion.jsx"],"sourcesContent":["import { Collapse as CollapseAnimate } from '@semcore/animation';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport { Flex } from '@semcore/flex-box';\nimport ChevronRightL from '@semcore/icon/ChevronRight/l';\nimport ChevronRightM from '@semcore/icon/ChevronRight/m';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/accordion.shadow.css';\n\nclass RootAccordion extends Component {\n static displayName = 'Accordion';\n static style = style;\n static defaultProps = {\n defaultValue: [],\n use: 'secondary',\n };\n\n static enhance = [\n cssVariableEnhance({\n variable: '--intergalactic-duration-accordion',\n fallback: '200',\n map: Number.parseInt,\n prop: 'duration',\n }),\n ];\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n handleToggleInteraction = (newValue) => {\n const { value } = this.asProps;\n\n if (Array.isArray(value)) {\n const indexOfNewValue = value.indexOf(newValue);\n const result = [...value];\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n indexOfNewValue === -1 ? result.push(newValue) : result.splice(indexOfNewValue, 1);\n this.handlers.value(result);\n } else {\n this.handlers.value(value === newValue ? null : newValue);\n }\n };\n\n getItemProps({ value }) {\n const { value: selectedValue, duration, use } = this.asProps;\n const selected = Array.isArray(selectedValue)\n ? selectedValue.includes(value)\n : selectedValue === value;\n return {\n selected,\n duration,\n use,\n $handleInteraction: this.handleToggleInteraction,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\n\nexport class RootItem extends Component {\n static displayName = 'Item';\n static style = style;\n static enhance = [uniqueIDEnhancement()];\n\n handleClick = () => {\n const { value, $handleInteraction } = this.asProps;\n\n $handleInteraction(value);\n };\n\n getToggleProps() {\n const { value, uid, disabled, use } = this.asProps;\n return {\n use,\n disabled,\n onClick: disabled ? undefined : this.handleClick,\n id: `igc-${uid}-${value}-toggle`,\n tag: 'h3',\n size: 300,\n tabIndex: disabled ? -1 : 0,\n };\n }\n\n getToggleButtonProps() {\n const { value, uid, selected, disabled } = this.asProps;\n return {\n disabled,\n 'id': `igc-${uid}-${value}-toggle-button`,\n 'aria-expanded': selected ? 'true' : 'false',\n 'aria-controls': selected ? `igc-${uid}-${value}-collapse` : undefined,\n };\n }\n\n getCollapseProps() {\n const { selected, uid, duration, value } = this.asProps;\n return {\n selected,\n duration,\n 'id': `igc-${uid}-${value}-collapse`,\n 'role': 'region',\n 'aria-labelledby': `igc-${uid}-${value}-toggle-button`,\n };\n }\n\n getChevronProps() {\n const { selected, size } = this.asProps;\n return {\n selected,\n size,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\n\nclass Toggle extends Component {\n toggleRef = React.createRef();\n\n handleKeyDown = (event) => {\n if (event.key === 'Enter') {\n if (this.toggleRef.current === event.target) {\n event.currentTarget.click();\n }\n } else if (event.key === ' ') {\n event.preventDefault();\n if (this.toggleRef.current === event.target) {\n event.currentTarget.click();\n }\n }\n };\n\n render() {\n const { styles, use } = this.asProps;\n const SItemToggle = Root;\n\n return sstyled(styles)(\n <SItemToggle\n use={use}\n ref={this.toggleRef}\n render={Text}\n innerOutline\n onKeyDown={this.handleKeyDown}\n />,\n );\n }\n}\n\nfunction Chevron(props) {\n const { styles, size } = props;\n\n const SItemChevron = Root;\n return sstyled(styles)(<SItemChevron render={size === 'l' ? ChevronRightL : ChevronRightM} />);\n}\n\nfunction ToggleButton(props) {\n const { styles } = props;\n\n const SToggleButton = Root;\n return sstyled(styles)(\n <SToggleButton alignItems='center' render={Flex} role='button' {...props} />,\n );\n}\n\nfunction Collapse(props) {\n const { selected } = props;\n const visible = selected;\n\n return (\n <Root\n render={CollapseAnimate}\n visible={visible}\n interactive\n inert={!visible ? '' : undefined}\n aria-hidden={!visible}\n />\n );\n}\n\nconst Item = createComponent(RootItem, {\n Toggle,\n Chevron,\n ToggleButton,\n Collapse,\n});\n\nconst Accordion = createComponent(RootAccordion, {\n Item,\n});\n\nexport const wrapAccordion = (wrapper) => wrapper;\n\nexport default Accordion;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Accordion.js","names":["_core","require","_baseComponents","_uniqueID","_interopRequireDefault","_useCssVariable","_l","_m","_typography","_react","style","sstyled","insert","RootAccordion","Component","constructor","args","_defineProperty2","default","newValue","value","asProps","Array","isArray","indexOfNewValue","indexOf","result","push","splice","handlers","uncontrolledProps","getItemProps","selectedValue","duration","use","selected","includes","$handleInteraction","handleToggleInteraction","render","Children","createElement","defaultValue","cssVariableEnhance","variable","fallback","map","Number","parseInt","prop","RootItem","getToggleProps","uid","disabled","onClick","undefined","handleClick","id","tag","size","tabIndex","getToggleButtonProps","getCollapseProps","getChevronProps","exports","uniqueIDEnhancement","Toggle","React","createRef","event","key","toggleRef","current","target","currentTarget","click","preventDefault","_ref","_ref5","styles","SItemToggle","Text","cn","assignProps","handleKeyDown","Chevron","props","_ref2","arguments[0]","_ref6","SItemChevron","ChevronRightL","ChevronRightM","ToggleButton","_ref3","_ref7","SToggleButton","Flex","Collapse","_ref4","visible","CollapseAnimate","Item","createComponent","Accordion","wrapAccordion","wrapper","_default"],"sources":["../../src/Accordion.jsx"],"sourcesContent":["import { Collapse as CollapseAnimate, Flex } from '@semcore/base-components';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport ChevronRightL from '@semcore/icon/ChevronRight/l';\nimport ChevronRightM from '@semcore/icon/ChevronRight/m';\nimport { Text } from '@semcore/typography';\nimport React from 'react';\n\nimport style from './style/accordion.shadow.css';\n\nclass RootAccordion extends Component {\n static displayName = 'Accordion';\n static style = style;\n static defaultProps = {\n defaultValue: [],\n use: 'secondary',\n };\n\n static enhance = [\n cssVariableEnhance({\n variable: '--intergalactic-duration-accordion',\n fallback: '200',\n map: Number.parseInt,\n prop: 'duration',\n }),\n ];\n\n uncontrolledProps() {\n return {\n value: null,\n };\n }\n\n handleToggleInteraction = (newValue) => {\n const { value } = this.asProps;\n\n if (Array.isArray(value)) {\n const indexOfNewValue = value.indexOf(newValue);\n const result = [...value];\n // eslint-disable-next-line @typescript-eslint/no-unused-expressions\n indexOfNewValue === -1 ? result.push(newValue) : result.splice(indexOfNewValue, 1);\n this.handlers.value(result);\n } else {\n this.handlers.value(value === newValue ? null : newValue);\n }\n };\n\n getItemProps({ value }) {\n const { value: selectedValue, duration, use } = this.asProps;\n const selected = Array.isArray(selectedValue)\n ? selectedValue.includes(value)\n : selectedValue === value;\n return {\n selected,\n duration,\n use,\n $handleInteraction: this.handleToggleInteraction,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\n\nexport class RootItem extends Component {\n static displayName = 'Item';\n static style = style;\n static enhance = [uniqueIDEnhancement()];\n\n handleClick = () => {\n const { value, $handleInteraction } = this.asProps;\n\n $handleInteraction(value);\n };\n\n getToggleProps() {\n const { value, uid, disabled, use } = this.asProps;\n return {\n use,\n disabled,\n onClick: disabled ? undefined : this.handleClick,\n id: `igc-${uid}-${value}-toggle`,\n tag: 'h3',\n size: 300,\n tabIndex: disabled ? -1 : 0,\n };\n }\n\n getToggleButtonProps() {\n const { value, uid, selected, disabled } = this.asProps;\n return {\n disabled,\n 'id': `igc-${uid}-${value}-toggle-button`,\n 'aria-expanded': selected ? 'true' : 'false',\n 'aria-controls': selected ? `igc-${uid}-${value}-collapse` : undefined,\n };\n }\n\n getCollapseProps() {\n const { selected, uid, duration, value } = this.asProps;\n return {\n selected,\n duration,\n 'id': `igc-${uid}-${value}-collapse`,\n 'role': 'region',\n 'aria-labelledby': `igc-${uid}-${value}-toggle-button`,\n };\n }\n\n getChevronProps() {\n const { selected, size } = this.asProps;\n return {\n selected,\n size,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\n\nclass Toggle extends Component {\n toggleRef = React.createRef();\n\n handleKeyDown = (event) => {\n if (event.key === 'Enter') {\n if (this.toggleRef.current === event.target) {\n event.currentTarget.click();\n }\n } else if (event.key === ' ') {\n event.preventDefault();\n if (this.toggleRef.current === event.target) {\n event.currentTarget.click();\n }\n }\n };\n\n render() {\n const { styles, use } = this.asProps;\n const SItemToggle = Root;\n\n return sstyled(styles)(\n <SItemToggle\n use={use}\n ref={this.toggleRef}\n render={Text}\n innerOutline\n onKeyDown={this.handleKeyDown}\n />,\n );\n }\n}\n\nfunction Chevron(props) {\n const { styles, size } = props;\n\n const SItemChevron = Root;\n return sstyled(styles)(<SItemChevron render={size === 'l' ? ChevronRightL : ChevronRightM} />);\n}\n\nfunction ToggleButton(props) {\n const { styles } = props;\n\n const SToggleButton = Root;\n return sstyled(styles)(\n <SToggleButton alignItems='center' render={Flex} role='button' {...props} />,\n );\n}\n\nfunction Collapse(props) {\n const { selected } = props;\n const visible = selected;\n\n return (\n <Root\n render={CollapseAnimate}\n visible={visible}\n interactive\n inert={!visible ? '' : undefined}\n aria-hidden={!visible}\n />\n );\n}\n\nconst Item = createComponent(RootItem, {\n Toggle,\n Chevron,\n ToggleButton,\n Collapse,\n});\n\nconst Accordion = createComponent(RootAccordion, {\n Item,\n});\n\nexport const wrapAccordion = (wrapper) => wrapper;\n\nexport default Accordion;\n"],"mappings":"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","ignoreList":[]}
|
package/lib/cjs/index.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type {
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { BoxProps, FlexProps, Flex } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\nimport type { Text } from '@semcore/typography';\nimport type { Property } from 'csstype';\n\nexport type AccordionValue = null | number | string | Array<number | string | null>;\n\nexport type AccordionProps<T extends AccordionValue = AccordionValue> = FlexProps & {\n /** Value for the active tab. Can be set as stroke, number, null or as array.\n * @type AccordionValue\n * */\n value?: T;\n /**\n * Value of the active tabs selected by default\n * @type AccordionValue\n * @default []\n */\n defaultValue?: T;\n /** Called when the selection is changed\n * @type (value: AccordionValue, event?: React.SyntheticEvent) => void\n * */\n onChange?:\n | ((value: T, event?: React.SyntheticEvent) => void)\n | React.Dispatch<React.SetStateAction<T>>;\n /** Animation duration of each Accordion.Item inside\n * @default 350 */\n duration?: number;\n\n /**\n * Changes the visual appearance of the component\n * @default secondary\n */\n use?: 'primary' | 'secondary';\n};\n\nexport interface IAccordionProps<T extends AccordionValue = AccordionValue>\n extends AccordionProps<T> {}\n\nexport type AccordionContext = {\n getItemProps: PropGetterFn;\n};\n\nexport type AccordionHandlers = {\n value: (value: AccordionValue) => void;\n};\n\nexport type AccordionItemProps = {\n /** Tab value */\n value: string | number;\n /** Disabling selection changes */\n disabled?: boolean;\n /** Animation duration\n * @default 350 */\n duration?: number;\n};\n\nexport type AccordionItemContext = {\n getToggleProps?: PropGetterFn;\n getCollapseProps?: PropGetterFn;\n getChevronProps?: PropGetterFn;\n selected?: boolean;\n};\n\nexport type AccordionItemToggleProps = BoxProps & {\n tag?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n};\nexport type ChevronItemProps = BoxProps & {\n /**\n * Chevron size\n * @default m\n */\n size?: 'm' | 'l';\n};\n\nexport type CollapseAnimationProps = {\n /** Animation titles */\n keyframes?: [string, string];\n /** Enables animation on first rendering\n * @default false\n */\n initialAnimation?: boolean;\n /**\n * @default ease-out\n */\n timingFunction?: Property.AnimationTimingFunction;\n /**\n * @default false\n */\n animationsDisabled?: boolean;\n};\n\nexport type AccordionCollapseProps = BoxProps & CollapseAnimationProps & {\n /** Animation duration in ms\n * @default 0\n */\n duration?: number | [number, number];\n /** If it set to `true`, animated node is persisted in dom even if `visible=false` */\n preserveNode?: boolean;\n /**\n * Add overflow=clip when passing animation\n * @default true\n * */\n overflowHidden?: boolean;\n /**\n * Value for height after animation\n * @default auto\n */\n defaultHeight?: 'auto' | '100%';\n};\n\ntype IntergalacticAccordionComponent<PropsExtending = {}> = (<\n Value extends AccordionValue,\n Tag extends Intergalactic.Tag = 'div',\n>(\n props: Intergalactic.InternalTypings.ComponentProps<\n Tag,\n 'div',\n AccordionProps<Value>,\n AccordionContext & { value: Value },\n [handlers: AccordionHandlers]\n > &\n PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\nIntergalactic.InternalTypings.ComponentAdditive<'div', 'div', AccordionProps>;\n\ndeclare const Accordion: IntergalacticAccordionComponent & {\n Item: Intergalactic.Component<\n 'div',\n AccordionItemProps,\n AccordionItemContext,\n [handlers: AccordionHandlers]\n > & {\n Toggle: Intergalactic.Component<typeof Text, AccordionItemToggleProps>;\n ToggleButton: Intergalactic.Component<typeof Flex, {}>;\n Chevron: Intergalactic.Component<'div', ChevronItemProps>;\n Collapse: Intergalactic.Component<'div', AccordionCollapseProps>;\n };\n};\n\ndeclare const wrapAccordion: <PropsExtending extends {}>(\n wrapper: (\n props: Intergalactic.InternalTypings.UntypeRefAndTag<\n Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticAccordionComponent>\n > &\n PropsExtending,\n ) => React.ReactNode,\n) => IntergalacticAccordionComponent<PropsExtending>;\nexport { wrapAccordion };\n\nexport default Accordion;\n"],"mappings":"","ignoreList":[]}
|