@semcore/accordion 3.3.2 → 3.4.1
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 +18 -0
- package/lib/cjs/Accordion.js +17 -12
- package/lib/cjs/Accordion.js.map +1 -1
- package/lib/cjs/index.js +5 -1
- package/lib/es6/Accordion.js +11 -10
- package/lib/es6/Accordion.js.map +1 -1
- package/package.json +9 -3
- package/src/Accordion.js +3 -2
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,24 @@
|
|
|
2
2
|
|
|
3
3
|
CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
|
|
4
4
|
|
|
5
|
+
## [3.4.1] - 2022-02-24
|
|
6
|
+
|
|
7
|
+
### Added
|
|
8
|
+
|
|
9
|
+
- Added repository field to package.json file.
|
|
10
|
+
|
|
11
|
+
## [3.4.0] - 2022-01-18
|
|
12
|
+
|
|
13
|
+
### Changed
|
|
14
|
+
|
|
15
|
+
- Up version icons and use new icon.
|
|
16
|
+
|
|
17
|
+
## [3.3.4] - 2021-8-26
|
|
18
|
+
|
|
19
|
+
### Changed
|
|
20
|
+
|
|
21
|
+
- Add 'sideEffect=false' for more optimal build via webpack
|
|
22
|
+
|
|
5
23
|
## [3.3.2] - 2021-07-05
|
|
6
24
|
|
|
7
25
|
### Fixed
|
package/lib/cjs/Accordion.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
|
|
4
|
-
|
|
5
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
6
4
|
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
7
7
|
Object.defineProperty(exports, "__esModule", {
|
|
8
8
|
value: true
|
|
9
9
|
});
|
|
@@ -33,13 +33,17 @@ var _flexBox = require("@semcore/flex-box");
|
|
|
33
33
|
|
|
34
34
|
var _animation = require("@semcore/animation");
|
|
35
35
|
|
|
36
|
-
var
|
|
36
|
+
var _m = _interopRequireDefault(require("@semcore/icon/ChevronRight/m"));
|
|
37
37
|
|
|
38
38
|
var _keyboardFocusEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/keyboardFocusEnhance"));
|
|
39
39
|
|
|
40
|
-
function
|
|
40
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
41
|
+
|
|
42
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
43
|
+
|
|
44
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
41
45
|
|
|
42
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
46
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
43
47
|
|
|
44
48
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
|
|
45
49
|
|
|
@@ -50,16 +54,16 @@ var style = (
|
|
|
50
54
|
/*__reshadow_css_start__*/
|
|
51
55
|
_core.sstyled.insert(
|
|
52
56
|
/*__inner_css_start__*/
|
|
53
|
-
".
|
|
57
|
+
".___SItemToggle_1e5om_gg_{cursor:pointer;outline:0}.___SItemToggle_1e5om_gg_.__keyboardFocused_1e5om_gg_{box-shadow:0 0 0 3px rgba(43, 148, 225, 0.3)}.___SItemToggle_1e5om_gg_.__disabled_1e5om_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SItemChevron_1e5om_gg_{transform:rotate(0deg);transition:transform .25s ease-out}.___SItemChevron_1e5om_gg_.__selected_1e5om_gg_{transform:rotate(90deg)}"
|
|
54
58
|
/*__inner_css_end__*/
|
|
55
59
|
, "rn2j0n_gg_")
|
|
56
60
|
/*__reshadow_css_end__*/
|
|
57
61
|
, {
|
|
58
|
-
"__SItemToggle": "
|
|
59
|
-
"_keyboardFocused": "
|
|
60
|
-
"_disabled": "
|
|
61
|
-
"__SItemChevron": "
|
|
62
|
-
"_selected": "
|
|
62
|
+
"__SItemToggle": "___SItemToggle_1e5om_gg_",
|
|
63
|
+
"_keyboardFocused": "__keyboardFocused_1e5om_gg_",
|
|
64
|
+
"_disabled": "__disabled_1e5om_gg_",
|
|
65
|
+
"__SItemChevron": "___SItemChevron_1e5om_gg_",
|
|
66
|
+
"_selected": "__selected_1e5om_gg_"
|
|
63
67
|
});
|
|
64
68
|
|
|
65
69
|
var RootAccordion = /*#__PURE__*/function (_Component) {
|
|
@@ -166,6 +170,7 @@ var RootItem = /*#__PURE__*/function (_Component2) {
|
|
|
166
170
|
disabled: disabled,
|
|
167
171
|
onClick: this.handleClick,
|
|
168
172
|
id: "trigger-".concat(value),
|
|
173
|
+
role: 'button',
|
|
169
174
|
'aria-expanded': selected,
|
|
170
175
|
'aria-controls': "content-".concat(value)
|
|
171
176
|
};
|
|
@@ -250,7 +255,7 @@ function Chevron(props) {
|
|
|
250
255
|
_ref5;
|
|
251
256
|
|
|
252
257
|
var styles = props.styles;
|
|
253
|
-
var SItemChevron =
|
|
258
|
+
var SItemChevron = _m["default"];
|
|
254
259
|
return _ref5 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SItemChevron, _ref5.cn("SItemChevron", _objectSpread({}, (0, _core.assignProps)({}, _ref2))));
|
|
255
260
|
}
|
|
256
261
|
|
package/lib/cjs/Accordion.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Accordion.js"],"names":["RootAccordion","newValue","value","asProps","Array","isArray","indexOfNewValue","indexOf","result","push","splice","handlers","selectedValue","duration","selected","includes","$handleInteraction","handleToggleInteraction","Children","Component","style","defaultValue","RootItem","disabled","onClick","handleClick","id","role","Toggle","e","key","preventDefault","currentTarget","click","styles","SItemToggle","Box","handleKeyDown","Chevron","props","SItemChevron","
|
|
1
|
+
{"version":3,"sources":["../../src/Accordion.js"],"names":["RootAccordion","newValue","value","asProps","Array","isArray","indexOfNewValue","indexOf","result","push","splice","handlers","selectedValue","duration","selected","includes","$handleInteraction","handleToggleInteraction","Children","Component","style","defaultValue","RootItem","disabled","onClick","handleClick","id","role","Toggle","e","key","preventDefault","currentTarget","click","styles","SItemToggle","Box","handleKeyDown","Chevron","props","SItemChevron","ChevronRight","Collapse","CollapseAnimate","Item","Accordion"],"mappings":"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","sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport { Collapse as CollapseAnimate } from '@semcore/animation';\nimport ChevronRight from '@semcore/icon/ChevronRight/m';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\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 duration: 350,\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 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 } = this.asProps;\n const selected = Array.isArray(selectedValue)\n ? selectedValue.includes(value)\n : selectedValue === value;\n return {\n selected,\n duration,\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\n handleClick = () => {\n const { value, $handleInteraction } = this.asProps;\n\n $handleInteraction(value);\n };\n\n getToggleProps() {\n const { value, selected, disabled } = this.asProps;\n return {\n disabled,\n onClick: this.handleClick,\n id: `trigger-${value}`,\n role: 'button',\n 'aria-expanded': selected,\n 'aria-controls': `content-${value}`,\n };\n }\n\n getCollapseProps() {\n const { selected, duration, value } = this.asProps;\n return {\n selected,\n duration,\n id: `content-${value}`,\n role: 'region',\n 'aria-labelledby': `trigger-${value}`,\n };\n }\n\n getChevronProps() {\n const { selected } = this.asProps;\n return {\n selected,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\n\nclass Toggle extends Component {\n static enhance = [keyboardFocusEnhance()];\n\n handleKeyDown(e) {\n switch (e.key) {\n case 'Enter':\n case ' ':\n e.preventDefault();\n e.currentTarget.click();\n }\n }\n\n render() {\n const { styles } = this.asProps;\n const SItemToggle = Root;\n\n return sstyled(styles)(<SItemToggle render={Box} onKeyDown={this.handleKeyDown} />);\n }\n}\n\nfunction Chevron(props) {\n const { styles } = props;\n const SItemChevron = Root;\n return sstyled(styles)(<SItemChevron render={ChevronRight} />);\n}\n\nfunction Collapse(props) {\n const { selected } = props;\n return <Root render={CollapseAnimate} visible={selected} interactive />;\n}\n\nconst Item = createComponent(RootItem, {\n Toggle,\n Chevron,\n Collapse,\n});\n\nconst Accordion = createComponent(RootAccordion, {\n Item,\n});\n\nexport default Accordion;\n"],"file":"Accordion.js"}
|
package/lib/cjs/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var
|
|
3
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
4
4
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
@@ -26,4 +26,8 @@ Object.keys(_Accordion).forEach(function (key) {
|
|
|
26
26
|
}
|
|
27
27
|
});
|
|
28
28
|
});
|
|
29
|
+
|
|
30
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
31
|
+
|
|
32
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
29
33
|
//# sourceMappingURL=index.js.map
|
package/lib/es6/Accordion.js
CHANGED
|
@@ -11,9 +11,9 @@ import { assignProps as _assignProps3 } from "@semcore/core";
|
|
|
11
11
|
import { assignProps as _assignProps2 } from "@semcore/core";
|
|
12
12
|
import { assignProps as _assignProps } from "@semcore/core";
|
|
13
13
|
|
|
14
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
14
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
15
15
|
|
|
16
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
16
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
17
17
|
|
|
18
18
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
19
19
|
|
|
@@ -23,7 +23,7 @@ import React from 'react';
|
|
|
23
23
|
import createComponent, { Component, sstyled, Root } from '@semcore/core';
|
|
24
24
|
import { Box } from '@semcore/flex-box';
|
|
25
25
|
import { Collapse as CollapseAnimate } from '@semcore/animation';
|
|
26
|
-
import
|
|
26
|
+
import ChevronRight from '@semcore/icon/ChevronRight/m';
|
|
27
27
|
import keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';
|
|
28
28
|
|
|
29
29
|
/*__reshadow-styles__:"./style/accordion.shadow.css"*/
|
|
@@ -31,16 +31,16 @@ var style = (
|
|
|
31
31
|
/*__reshadow_css_start__*/
|
|
32
32
|
_sstyled.insert(
|
|
33
33
|
/*__inner_css_start__*/
|
|
34
|
-
".
|
|
34
|
+
".___SItemToggle_1e5om_gg_{cursor:pointer;outline:0}.___SItemToggle_1e5om_gg_.__keyboardFocused_1e5om_gg_{box-shadow:0 0 0 3px rgba(43, 148, 225, 0.3)}.___SItemToggle_1e5om_gg_.__disabled_1e5om_gg_{opacity:0.3;cursor:default;pointer-events:none}.___SItemChevron_1e5om_gg_{transform:rotate(0deg);transition:transform .25s ease-out}.___SItemChevron_1e5om_gg_.__selected_1e5om_gg_{transform:rotate(90deg)}"
|
|
35
35
|
/*__inner_css_end__*/
|
|
36
36
|
, "rn2j0n_gg_")
|
|
37
37
|
/*__reshadow_css_end__*/
|
|
38
38
|
, {
|
|
39
|
-
"__SItemToggle": "
|
|
40
|
-
"_keyboardFocused": "
|
|
41
|
-
"_disabled": "
|
|
42
|
-
"__SItemChevron": "
|
|
43
|
-
"_selected": "
|
|
39
|
+
"__SItemToggle": "___SItemToggle_1e5om_gg_",
|
|
40
|
+
"_keyboardFocused": "__keyboardFocused_1e5om_gg_",
|
|
41
|
+
"_disabled": "__disabled_1e5om_gg_",
|
|
42
|
+
"__SItemChevron": "___SItemChevron_1e5om_gg_",
|
|
43
|
+
"_selected": "__selected_1e5om_gg_"
|
|
44
44
|
});
|
|
45
45
|
|
|
46
46
|
var RootAccordion = /*#__PURE__*/function (_Component) {
|
|
@@ -156,6 +156,7 @@ export var RootItem = /*#__PURE__*/function (_Component2) {
|
|
|
156
156
|
disabled: disabled,
|
|
157
157
|
onClick: this.handleClick,
|
|
158
158
|
id: "trigger-".concat(value),
|
|
159
|
+
role: 'button',
|
|
159
160
|
'aria-expanded': selected,
|
|
160
161
|
'aria-controls': "content-".concat(value)
|
|
161
162
|
};
|
|
@@ -243,7 +244,7 @@ function Chevron(props) {
|
|
|
243
244
|
_ref5;
|
|
244
245
|
|
|
245
246
|
var styles = props.styles;
|
|
246
|
-
var SItemChevron =
|
|
247
|
+
var SItemChevron = ChevronRight;
|
|
247
248
|
return _ref5 = sstyled(styles), /*#__PURE__*/React.createElement(SItemChevron, _ref5.cn("SItemChevron", _objectSpread({}, _assignProps2({}, _ref2))));
|
|
248
249
|
}
|
|
249
250
|
|
package/lib/es6/Accordion.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Accordion.js"],"names":["React","createComponent","Component","sstyled","Root","Box","Collapse","CollapseAnimate","
|
|
1
|
+
{"version":3,"sources":["../../src/Accordion.js"],"names":["React","createComponent","Component","sstyled","Root","Box","Collapse","CollapseAnimate","ChevronRight","keyboardFocusEnhance","RootAccordion","newValue","value","asProps","Array","isArray","indexOfNewValue","indexOf","result","push","splice","handlers","selectedValue","duration","selected","includes","$handleInteraction","handleToggleInteraction","Children","style","defaultValue","RootItem","disabled","onClick","handleClick","id","role","Toggle","e","key","preventDefault","currentTarget","click","styles","SItemToggle","handleKeyDown","Chevron","props","SItemChevron","Item","Accordion"],"mappings":"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","sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport { Collapse as CollapseAnimate } from '@semcore/animation';\nimport ChevronRight from '@semcore/icon/ChevronRight/m';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\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 duration: 350,\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 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 } = this.asProps;\n const selected = Array.isArray(selectedValue)\n ? selectedValue.includes(value)\n : selectedValue === value;\n return {\n selected,\n duration,\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\n handleClick = () => {\n const { value, $handleInteraction } = this.asProps;\n\n $handleInteraction(value);\n };\n\n getToggleProps() {\n const { value, selected, disabled } = this.asProps;\n return {\n disabled,\n onClick: this.handleClick,\n id: `trigger-${value}`,\n role: 'button',\n 'aria-expanded': selected,\n 'aria-controls': `content-${value}`,\n };\n }\n\n getCollapseProps() {\n const { selected, duration, value } = this.asProps;\n return {\n selected,\n duration,\n id: `content-${value}`,\n role: 'region',\n 'aria-labelledby': `trigger-${value}`,\n };\n }\n\n getChevronProps() {\n const { selected } = this.asProps;\n return {\n selected,\n };\n }\n\n render() {\n const { Children } = this.asProps;\n return <Children />;\n }\n}\n\nclass Toggle extends Component {\n static enhance = [keyboardFocusEnhance()];\n\n handleKeyDown(e) {\n switch (e.key) {\n case 'Enter':\n case ' ':\n e.preventDefault();\n e.currentTarget.click();\n }\n }\n\n render() {\n const { styles } = this.asProps;\n const SItemToggle = Root;\n\n return sstyled(styles)(<SItemToggle render={Box} onKeyDown={this.handleKeyDown} />);\n }\n}\n\nfunction Chevron(props) {\n const { styles } = props;\n const SItemChevron = Root;\n return sstyled(styles)(<SItemChevron render={ChevronRight} />);\n}\n\nfunction Collapse(props) {\n const { selected } = props;\n return <Root render={CollapseAnimate} visible={selected} interactive />;\n}\n\nconst Item = createComponent(RootItem, {\n Toggle,\n Chevron,\n Collapse,\n});\n\nconst Accordion = createComponent(RootAccordion, {\n Item,\n});\n\nexport default Accordion;\n"],"file":"Accordion.js"}
|
package/package.json
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/accordion",
|
|
3
3
|
"description": "SEMRush Accordion Component",
|
|
4
|
-
"version": "3.
|
|
4
|
+
"version": "3.4.1",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
8
|
+
"sideEffects": false,
|
|
8
9
|
"author": "Roman Lysov <r.lysov@semrush.com>",
|
|
9
10
|
"license": "MIT",
|
|
10
11
|
"scripts": {
|
|
@@ -15,13 +16,18 @@
|
|
|
15
16
|
"@semcore/utils": "^3.17",
|
|
16
17
|
"@semcore/animation": "^1.2",
|
|
17
18
|
"@semcore/flex-box": "^4",
|
|
18
|
-
"@semcore/icon": "^2"
|
|
19
|
+
"@semcore/icon": "^2.16"
|
|
19
20
|
},
|
|
20
21
|
"peerDependencies": {
|
|
21
22
|
"@semcore/core": "^1.11",
|
|
22
23
|
"react": "16.8 - 17"
|
|
23
24
|
},
|
|
24
25
|
"jest": {
|
|
25
|
-
"preset": "jest-preset-ui"
|
|
26
|
+
"preset": "@semcore/jest-preset-ui"
|
|
27
|
+
},
|
|
28
|
+
"repository": {
|
|
29
|
+
"type": "git",
|
|
30
|
+
"url": "https://github.com/semrush/intergalactic.git",
|
|
31
|
+
"directory": "semcore/accordion"
|
|
26
32
|
}
|
|
27
33
|
}
|
package/src/Accordion.js
CHANGED
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import createComponent, { Component, sstyled, Root } from '@semcore/core';
|
|
3
3
|
import { Box } from '@semcore/flex-box';
|
|
4
4
|
import { Collapse as CollapseAnimate } from '@semcore/animation';
|
|
5
|
-
import
|
|
5
|
+
import ChevronRight from '@semcore/icon/ChevronRight/m';
|
|
6
6
|
import keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';
|
|
7
7
|
|
|
8
8
|
import style from './style/accordion.shadow.css';
|
|
@@ -68,6 +68,7 @@ export class RootItem extends Component {
|
|
|
68
68
|
disabled,
|
|
69
69
|
onClick: this.handleClick,
|
|
70
70
|
id: `trigger-${value}`,
|
|
71
|
+
role: 'button',
|
|
71
72
|
'aria-expanded': selected,
|
|
72
73
|
'aria-controls': `content-${value}`,
|
|
73
74
|
};
|
|
@@ -120,7 +121,7 @@ class Toggle extends Component {
|
|
|
120
121
|
function Chevron(props) {
|
|
121
122
|
const { styles } = props;
|
|
122
123
|
const SItemChevron = Root;
|
|
123
|
-
return sstyled(styles)(<SItemChevron render={
|
|
124
|
+
return sstyled(styles)(<SItemChevron render={ChevronRight} />);
|
|
124
125
|
}
|
|
125
126
|
|
|
126
127
|
function Collapse(props) {
|