@semcore/accordion 3.3.4 → 3.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/lib/cjs/Accordion.js +8 -8
- package/lib/cjs/Accordion.js.map +1 -1
- package/lib/es6/Accordion.js +8 -8
- package/lib/es6/Accordion.js.map +1 -1
- package/package.json +2 -2
- package/src/Accordion.js +2 -2
package/CHANGELOG.md
CHANGED
package/lib/cjs/Accordion.js
CHANGED
|
@@ -33,7 +33,7 @@ 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
|
|
|
@@ -50,16 +50,16 @@ var style = (
|
|
|
50
50
|
/*__reshadow_css_start__*/
|
|
51
51
|
_core.sstyled.insert(
|
|
52
52
|
/*__inner_css_start__*/
|
|
53
|
-
".
|
|
53
|
+
".___SItemToggle_1heyk_gg_{cursor:pointer;outline:0}.___SItemToggle_1heyk_gg_.__keyboardFocused_1heyk_gg_{box-shadow:0 0 0 3px rgba(43,148,225,.3)}.___SItemToggle_1heyk_gg_.__disabled_1heyk_gg_{opacity:.3;cursor:default;pointer-events:none}.___SItemChevron_1heyk_gg_{transform:rotate(0deg);transition:transform .25s ease-out}.___SItemChevron_1heyk_gg_.__selected_1heyk_gg_{transform:rotate(90deg)}"
|
|
54
54
|
/*__inner_css_end__*/
|
|
55
55
|
, "rn2j0n_gg_")
|
|
56
56
|
/*__reshadow_css_end__*/
|
|
57
57
|
, {
|
|
58
|
-
"__SItemToggle": "
|
|
59
|
-
"_keyboardFocused": "
|
|
60
|
-
"_disabled": "
|
|
61
|
-
"__SItemChevron": "
|
|
62
|
-
"_selected": "
|
|
58
|
+
"__SItemToggle": "___SItemToggle_1heyk_gg_",
|
|
59
|
+
"_keyboardFocused": "__keyboardFocused_1heyk_gg_",
|
|
60
|
+
"_disabled": "__disabled_1heyk_gg_",
|
|
61
|
+
"__SItemChevron": "___SItemChevron_1heyk_gg_",
|
|
62
|
+
"_selected": "__selected_1heyk_gg_"
|
|
63
63
|
});
|
|
64
64
|
|
|
65
65
|
var RootAccordion = /*#__PURE__*/function (_Component) {
|
|
@@ -250,7 +250,7 @@ function Chevron(props) {
|
|
|
250
250
|
_ref5;
|
|
251
251
|
|
|
252
252
|
var styles = props.styles;
|
|
253
|
-
var SItemChevron =
|
|
253
|
+
var SItemChevron = _m["default"];
|
|
254
254
|
return _ref5 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SItemChevron, _ref5.cn("SItemChevron", _objectSpread({}, (0, _core.assignProps)({}, _ref2))));
|
|
255
255
|
}
|
|
256
256
|
|
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 '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/es6/Accordion.js
CHANGED
|
@@ -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_1heyk_gg_{cursor:pointer;outline:0}.___SItemToggle_1heyk_gg_.__keyboardFocused_1heyk_gg_{box-shadow:0 0 0 3px rgba(43,148,225,.3)}.___SItemToggle_1heyk_gg_.__disabled_1heyk_gg_{opacity:.3;cursor:default;pointer-events:none}.___SItemChevron_1heyk_gg_{transform:rotate(0deg);transition:transform .25s ease-out}.___SItemChevron_1heyk_gg_.__selected_1heyk_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_1heyk_gg_",
|
|
40
|
+
"_keyboardFocused": "__keyboardFocused_1heyk_gg_",
|
|
41
|
+
"_disabled": "__disabled_1heyk_gg_",
|
|
42
|
+
"__SItemChevron": "___SItemChevron_1heyk_gg_",
|
|
43
|
+
"_selected": "__selected_1heyk_gg_"
|
|
44
44
|
});
|
|
45
45
|
|
|
46
46
|
var RootAccordion = /*#__PURE__*/function (_Component) {
|
|
@@ -243,7 +243,7 @@ function Chevron(props) {
|
|
|
243
243
|
_ref5;
|
|
244
244
|
|
|
245
245
|
var styles = props.styles;
|
|
246
|
-
var SItemChevron =
|
|
246
|
+
var SItemChevron = ChevronRight;
|
|
247
247
|
return _ref5 = sstyled(styles), /*#__PURE__*/React.createElement(SItemChevron, _ref5.cn("SItemChevron", _objectSpread({}, _assignProps2({}, _ref2))));
|
|
248
248
|
}
|
|
249
249
|
|
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 '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,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/accordion",
|
|
3
3
|
"description": "SEMRush Accordion Component",
|
|
4
|
-
"version": "3.
|
|
4
|
+
"version": "3.4.0",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
"@semcore/utils": "^3.17",
|
|
17
17
|
"@semcore/animation": "^1.2",
|
|
18
18
|
"@semcore/flex-box": "^4",
|
|
19
|
-
"@semcore/icon": "^2"
|
|
19
|
+
"@semcore/icon": "^2.16"
|
|
20
20
|
},
|
|
21
21
|
"peerDependencies": {
|
|
22
22
|
"@semcore/core": "^1.11",
|
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';
|
|
@@ -120,7 +120,7 @@ class Toggle extends Component {
|
|
|
120
120
|
function Chevron(props) {
|
|
121
121
|
const { styles } = props;
|
|
122
122
|
const SItemChevron = Root;
|
|
123
|
-
return sstyled(styles)(<SItemChevron render={
|
|
123
|
+
return sstyled(styles)(<SItemChevron render={ChevronRight} />);
|
|
124
124
|
}
|
|
125
125
|
|
|
126
126
|
function Collapse(props) {
|