@instructure/ui-toggle-details 8.25.1-snapshot-7 → 8.25.1-snapshot-10

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 CHANGED
@@ -3,7 +3,7 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
- ## [8.25.1-snapshot-7](https://github.com/instructure/instructure-ui/compare/v8.25.0...v8.25.1-snapshot-7) (2022-06-13)
6
+ ## [8.25.1-snapshot-10](https://github.com/instructure/instructure-ui/compare/v8.25.0...v8.25.1-snapshot-10) (2022-06-20)
7
7
 
8
8
  **Note:** Version bump only for package @instructure/ui-toggle-details
9
9
 
@@ -1,4 +1,4 @@
1
- var _dec, _dec2, _class, _class2;
1
+ var _dec, _dec2, _class;
2
2
 
3
3
  /*
4
4
  * The MIT License (MIT)
@@ -43,26 +43,23 @@ category: components
43
43
  ---
44
44
  @tsProps
45
45
  **/
46
- let ToggleDetails = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = (_class2 = class ToggleDetails extends Component {
47
- constructor() {
48
- super(...arguments);
49
- this.ref = null;
50
- this._button = null;
51
-
52
- this.getButtonRef = el => this._button = el;
53
-
54
- this.handleToggle = (event, expanded) => {
55
- var _this$props$makeStyle, _this$props;
56
-
57
- if (typeof this.props.onToggle === 'function') {
58
- this.props.onToggle(event, expanded);
59
- }
60
-
61
- (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props, {
62
- animate: true
63
- });
64
- };
65
- }
46
+ let ToggleDetails = (_dec = withStyle(generateStyle, generateComponentTheme), _dec2 = testable(), _dec(_class = _dec2(_class = class ToggleDetails extends Component {
47
+ static displayName = "ToggleDetails";
48
+ static componentId = 'ToggleDetails';
49
+ static allowedProps = allowedProps;
50
+ static propTypes = propTypes;
51
+ static defaultProps = {
52
+ variant: 'default',
53
+ size: 'medium',
54
+ fluidWidth: false,
55
+ icon: IconArrowOpenEndSolid,
56
+ iconExpanded: IconArrowOpenDownSolid,
57
+ iconPosition: 'start',
58
+ defaultExpanded: false,
59
+ children: null
60
+ };
61
+ ref = null;
62
+ _button = null;
66
63
 
67
64
  get focused() {
68
65
  return isActiveElement(this._button);
@@ -75,27 +72,29 @@ let ToggleDetails = (_dec = withStyle(generateStyle, generateComponentTheme), _d
75
72
  }
76
73
 
77
74
  componentDidMount() {
78
- var _this$props$makeStyle2, _this$props2;
75
+ var _this$props$makeStyle, _this$props;
79
76
 
80
- (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2, {
77
+ (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props, {
81
78
  animate: false
82
79
  });
83
80
  }
84
81
 
85
82
  componentDidUpdate() {
86
- var _this$props$makeStyle3, _this$props3;
83
+ var _this$props$makeStyle2, _this$props2;
87
84
 
88
- (_this$props$makeStyle3 = (_this$props3 = this.props).makeStyles) === null || _this$props$makeStyle3 === void 0 ? void 0 : _this$props$makeStyle3.call(_this$props3, {
85
+ (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2, {
89
86
  animate: true
90
87
  });
91
88
  }
92
89
 
90
+ getButtonRef = el => this._button = el;
91
+
93
92
  renderSummary(expanded) {
94
93
  var _this$props$styles, _this$props$styles2;
95
94
 
96
- const _this$props4 = this.props,
97
- summary = _this$props4.summary,
98
- iconPosition = _this$props4.iconPosition;
95
+ const _this$props3 = this.props,
96
+ summary = _this$props3.summary,
97
+ iconPosition = _this$props3.iconPosition;
99
98
  return jsx("span", {
100
99
  css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.summary
101
100
  }, iconPosition === 'start' && this.renderIcon(expanded), jsx("span", {
@@ -167,6 +166,18 @@ let ToggleDetails = (_dec = withStyle(generateStyle, generateComponentTheme), _d
167
166
  }, this.props.children);
168
167
  }
169
168
 
169
+ handleToggle = (event, expanded) => {
170
+ var _this$props$makeStyle3, _this$props4;
171
+
172
+ if (typeof this.props.onToggle === 'function') {
173
+ this.props.onToggle(event, expanded);
174
+ }
175
+
176
+ (_this$props$makeStyle3 = (_this$props4 = this.props).makeStyles) === null || _this$props$makeStyle3 === void 0 ? void 0 : _this$props$makeStyle3.call(_this$props4, {
177
+ animate: true
178
+ });
179
+ };
180
+
170
181
  render() {
171
182
  return jsx(Expandable, Object.assign({}, pickProps(this.props, Expandable.allowedProps), {
172
183
  onToggle: this.handleToggle
@@ -185,15 +196,6 @@ let ToggleDetails = (_dec = withStyle(generateStyle, generateComponentTheme), _d
185
196
  });
186
197
  }
187
198
 
188
- }, _class2.displayName = "ToggleDetails", _class2.componentId = 'ToggleDetails', _class2.allowedProps = allowedProps, _class2.propTypes = propTypes, _class2.defaultProps = {
189
- variant: 'default',
190
- size: 'medium',
191
- fluidWidth: false,
192
- icon: IconArrowOpenEndSolid,
193
- iconExpanded: IconArrowOpenDownSolid,
194
- iconPosition: 'start',
195
- defaultExpanded: false,
196
- children: null
197
- }, _class2)) || _class) || _class);
199
+ }) || _class) || _class);
198
200
  export default ToggleDetails;
199
201
  export { ToggleDetails };
@@ -1,4 +1,4 @@
1
- var _dec, _class, _class2;
1
+ var _dec, _class;
2
2
 
3
3
  /*
4
4
  * The MIT License (MIT)
@@ -41,26 +41,34 @@ category: components
41
41
  @tsProps
42
42
  **/
43
43
 
44
- let ToggleGroup = (_dec = testable(), _dec(_class = (_class2 = class ToggleGroup extends Component {
45
- constructor() {
46
- super(...arguments);
47
- this.ref = null;
48
- this._button = null;
49
- this._shouldTransition = false;
50
-
51
- this.handleRef = el => {
52
- const elementRef = this.props.elementRef;
53
- this.ref = el;
54
-
55
- if (typeof elementRef === 'function') {
56
- elementRef(el);
57
- }
58
- };
59
-
60
- this.handleButtonRef = el => {
61
- this._button = el;
62
- };
63
- }
44
+ let ToggleGroup = (_dec = testable(), _dec(_class = class ToggleGroup extends Component {
45
+ static displayName = "ToggleGroup";
46
+ static componentId = 'ToggleGroup';
47
+ static allowedProps = allowedProps;
48
+ static propTypes = propTypes;
49
+ static defaultProps = {
50
+ size: 'medium',
51
+ icon: IconArrowOpenEndSolid,
52
+ iconExpanded: IconArrowOpenDownSolid,
53
+ defaultExpanded: false,
54
+ transition: true,
55
+ as: 'span',
56
+ border: true
57
+ };
58
+ ref = null;
59
+ _button = null;
60
+ _shouldTransition = false;
61
+ handleRef = el => {
62
+ const elementRef = this.props.elementRef;
63
+ this.ref = el;
64
+
65
+ if (typeof elementRef === 'function') {
66
+ elementRef(el);
67
+ }
68
+ };
69
+ handleButtonRef = el => {
70
+ this._button = el;
71
+ };
64
72
 
65
73
  get focused() {
66
74
  return isActiveElement(this._button);
@@ -138,14 +146,6 @@ let ToggleGroup = (_dec = testable(), _dec(_class = (_class2 = class ToggleGroup
138
146
  });
139
147
  }
140
148
 
141
- }, _class2.displayName = "ToggleGroup", _class2.componentId = 'ToggleGroup', _class2.allowedProps = allowedProps, _class2.propTypes = propTypes, _class2.defaultProps = {
142
- size: 'medium',
143
- icon: IconArrowOpenEndSolid,
144
- iconExpanded: IconArrowOpenDownSolid,
145
- defaultExpanded: false,
146
- transition: true,
147
- as: 'span',
148
- border: true
149
- }, _class2)) || _class);
149
+ }) || _class);
150
150
  export default ToggleGroup;
151
151
  export { ToggleGroup };
@@ -35,7 +35,7 @@ var _theme = _interopRequireDefault(require("./theme"));
35
35
 
36
36
  var _props = require("./props");
37
37
 
38
- var _dec, _dec2, _class, _class2;
38
+ var _dec, _dec2, _class;
39
39
 
40
40
  /**
41
41
  ---
@@ -43,26 +43,23 @@ category: components
43
43
  ---
44
44
  @tsProps
45
45
  **/
46
- let ToggleDetails = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = (_class2 = class ToggleDetails extends _react.Component {
47
- constructor() {
48
- super(...arguments);
49
- this.ref = null;
50
- this._button = null;
51
-
52
- this.getButtonRef = el => this._button = el;
53
-
54
- this.handleToggle = (event, expanded) => {
55
- var _this$props$makeStyle, _this$props;
56
-
57
- if (typeof this.props.onToggle === 'function') {
58
- this.props.onToggle(event, expanded);
59
- }
60
-
61
- (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props, {
62
- animate: true
63
- });
64
- };
65
- }
46
+ let ToggleDetails = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.default), _dec2 = (0, _testable.testable)(), _dec(_class = _dec2(_class = class ToggleDetails extends _react.Component {
47
+ static displayName = "ToggleDetails";
48
+ static componentId = 'ToggleDetails';
49
+ static allowedProps = _props.allowedProps;
50
+ static propTypes = _props.propTypes;
51
+ static defaultProps = {
52
+ variant: 'default',
53
+ size: 'medium',
54
+ fluidWidth: false,
55
+ icon: _IconArrowOpenEndSolid.IconArrowOpenEndSolid,
56
+ iconExpanded: _IconArrowOpenDownSolid.IconArrowOpenDownSolid,
57
+ iconPosition: 'start',
58
+ defaultExpanded: false,
59
+ children: null
60
+ };
61
+ ref = null;
62
+ _button = null;
66
63
 
67
64
  get focused() {
68
65
  return (0, _isActiveElement.isActiveElement)(this._button);
@@ -75,27 +72,29 @@ let ToggleDetails = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.defa
75
72
  }
76
73
 
77
74
  componentDidMount() {
78
- var _this$props$makeStyle2, _this$props2;
75
+ var _this$props$makeStyle, _this$props;
79
76
 
80
- (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2, {
77
+ (_this$props$makeStyle = (_this$props = this.props).makeStyles) === null || _this$props$makeStyle === void 0 ? void 0 : _this$props$makeStyle.call(_this$props, {
81
78
  animate: false
82
79
  });
83
80
  }
84
81
 
85
82
  componentDidUpdate() {
86
- var _this$props$makeStyle3, _this$props3;
83
+ var _this$props$makeStyle2, _this$props2;
87
84
 
88
- (_this$props$makeStyle3 = (_this$props3 = this.props).makeStyles) === null || _this$props$makeStyle3 === void 0 ? void 0 : _this$props$makeStyle3.call(_this$props3, {
85
+ (_this$props$makeStyle2 = (_this$props2 = this.props).makeStyles) === null || _this$props$makeStyle2 === void 0 ? void 0 : _this$props$makeStyle2.call(_this$props2, {
89
86
  animate: true
90
87
  });
91
88
  }
92
89
 
90
+ getButtonRef = el => this._button = el;
91
+
93
92
  renderSummary(expanded) {
94
93
  var _this$props$styles, _this$props$styles2;
95
94
 
96
- const _this$props4 = this.props,
97
- summary = _this$props4.summary,
98
- iconPosition = _this$props4.iconPosition;
95
+ const _this$props3 = this.props,
96
+ summary = _this$props3.summary,
97
+ iconPosition = _this$props3.iconPosition;
99
98
  return (0, _emotion.jsx)("span", {
100
99
  css: (_this$props$styles = this.props.styles) === null || _this$props$styles === void 0 ? void 0 : _this$props$styles.summary
101
100
  }, iconPosition === 'start' && this.renderIcon(expanded), (0, _emotion.jsx)("span", {
@@ -167,6 +166,18 @@ let ToggleDetails = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.defa
167
166
  }, this.props.children);
168
167
  }
169
168
 
169
+ handleToggle = (event, expanded) => {
170
+ var _this$props$makeStyle3, _this$props4;
171
+
172
+ if (typeof this.props.onToggle === 'function') {
173
+ this.props.onToggle(event, expanded);
174
+ }
175
+
176
+ (_this$props$makeStyle3 = (_this$props4 = this.props).makeStyles) === null || _this$props$makeStyle3 === void 0 ? void 0 : _this$props$makeStyle3.call(_this$props4, {
177
+ animate: true
178
+ });
179
+ };
180
+
170
181
  render() {
171
182
  return (0, _emotion.jsx)(_Expandable.Expandable, Object.assign({}, (0, _pickProps.pickProps)(this.props, _Expandable.Expandable.allowedProps), {
172
183
  onToggle: this.handleToggle
@@ -185,16 +196,7 @@ let ToggleDetails = (_dec = (0, _emotion.withStyle)(_styles.default, _theme.defa
185
196
  });
186
197
  }
187
198
 
188
- }, _class2.displayName = "ToggleDetails", _class2.componentId = 'ToggleDetails', _class2.allowedProps = _props.allowedProps, _class2.propTypes = _props.propTypes, _class2.defaultProps = {
189
- variant: 'default',
190
- size: 'medium',
191
- fluidWidth: false,
192
- icon: _IconArrowOpenEndSolid.IconArrowOpenEndSolid,
193
- iconExpanded: _IconArrowOpenDownSolid.IconArrowOpenDownSolid,
194
- iconPosition: 'start',
195
- defaultExpanded: false,
196
- children: null
197
- }, _class2)) || _class) || _class);
199
+ }) || _class) || _class);
198
200
  exports.ToggleDetails = ToggleDetails;
199
201
  var _default = ToggleDetails;
200
202
  exports.default = _default;
@@ -37,7 +37,7 @@ var _testable = require("@instructure/ui-testable/lib/testable.js");
37
37
 
38
38
  var _props = require("./props");
39
39
 
40
- var _dec, _class, _class2;
40
+ var _dec, _class;
41
41
 
42
42
  /**
43
43
  ---
@@ -45,26 +45,34 @@ category: components
45
45
  ---
46
46
  @tsProps
47
47
  **/
48
- let ToggleGroup = (_dec = (0, _testable.testable)(), _dec(_class = (_class2 = class ToggleGroup extends _react.Component {
49
- constructor() {
50
- super(...arguments);
51
- this.ref = null;
52
- this._button = null;
53
- this._shouldTransition = false;
54
-
55
- this.handleRef = el => {
56
- const elementRef = this.props.elementRef;
57
- this.ref = el;
58
-
59
- if (typeof elementRef === 'function') {
60
- elementRef(el);
61
- }
62
- };
63
-
64
- this.handleButtonRef = el => {
65
- this._button = el;
66
- };
67
- }
48
+ let ToggleGroup = (_dec = (0, _testable.testable)(), _dec(_class = class ToggleGroup extends _react.Component {
49
+ static displayName = "ToggleGroup";
50
+ static componentId = 'ToggleGroup';
51
+ static allowedProps = _props.allowedProps;
52
+ static propTypes = _props.propTypes;
53
+ static defaultProps = {
54
+ size: 'medium',
55
+ icon: _IconArrowOpenEndSolid.IconArrowOpenEndSolid,
56
+ iconExpanded: _IconArrowOpenDownSolid.IconArrowOpenDownSolid,
57
+ defaultExpanded: false,
58
+ transition: true,
59
+ as: 'span',
60
+ border: true
61
+ };
62
+ ref = null;
63
+ _button = null;
64
+ _shouldTransition = false;
65
+ handleRef = el => {
66
+ const elementRef = this.props.elementRef;
67
+ this.ref = el;
68
+
69
+ if (typeof elementRef === 'function') {
70
+ elementRef(el);
71
+ }
72
+ };
73
+ handleButtonRef = el => {
74
+ this._button = el;
75
+ };
68
76
 
69
77
  get focused() {
70
78
  return (0, _isActiveElement.isActiveElement)(this._button);
@@ -142,15 +150,7 @@ let ToggleGroup = (_dec = (0, _testable.testable)(), _dec(_class = (_class2 = cl
142
150
  });
143
151
  }
144
152
 
145
- }, _class2.displayName = "ToggleGroup", _class2.componentId = 'ToggleGroup', _class2.allowedProps = _props.allowedProps, _class2.propTypes = _props.propTypes, _class2.defaultProps = {
146
- size: 'medium',
147
- icon: _IconArrowOpenEndSolid.IconArrowOpenEndSolid,
148
- iconExpanded: _IconArrowOpenDownSolid.IconArrowOpenDownSolid,
149
- defaultExpanded: false,
150
- transition: true,
151
- as: 'span',
152
- border: true
153
- }, _class2)) || _class);
153
+ }) || _class);
154
154
  exports.ToggleGroup = ToggleGroup;
155
155
  var _default = ToggleGroup;
156
156
  exports.default = _default;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@instructure/ui-toggle-details",
3
- "version": "8.25.1-snapshot-7",
3
+ "version": "8.25.1-snapshot-10",
4
4
  "description": "A styled toggleable, accordion-like component.",
5
5
  "author": "Instructure, Inc. Engineering and Product Design",
6
6
  "module": "./es/index.js",
@@ -23,29 +23,29 @@
23
23
  },
24
24
  "license": "MIT",
25
25
  "devDependencies": {
26
- "@instructure/ui-babel-preset": "8.25.1-snapshot-7",
27
- "@instructure/ui-test-locator": "8.25.1-snapshot-7",
28
- "@instructure/ui-test-queries": "8.25.1-snapshot-7",
29
- "@instructure/ui-test-utils": "8.25.1-snapshot-7",
30
- "@instructure/ui-themes": "8.25.1-snapshot-7"
26
+ "@instructure/ui-babel-preset": "8.25.1-snapshot-10",
27
+ "@instructure/ui-test-locator": "8.25.1-snapshot-10",
28
+ "@instructure/ui-test-queries": "8.25.1-snapshot-10",
29
+ "@instructure/ui-test-utils": "8.25.1-snapshot-10",
30
+ "@instructure/ui-themes": "8.25.1-snapshot-10"
31
31
  },
32
32
  "dependencies": {
33
33
  "@babel/runtime": "^7.13.10",
34
- "@instructure/emotion": "8.25.1-snapshot-7",
35
- "@instructure/shared-types": "8.25.1-snapshot-7",
36
- "@instructure/ui-buttons": "8.25.1-snapshot-7",
37
- "@instructure/ui-dom-utils": "8.25.1-snapshot-7",
38
- "@instructure/ui-expandable": "8.25.1-snapshot-7",
39
- "@instructure/ui-flex": "8.25.1-snapshot-7",
40
- "@instructure/ui-icons": "8.25.1-snapshot-7",
41
- "@instructure/ui-menu": "8.25.1-snapshot-7",
42
- "@instructure/ui-motion": "8.25.1-snapshot-7",
43
- "@instructure/ui-prop-types": "8.25.1-snapshot-7",
44
- "@instructure/ui-react-utils": "8.25.1-snapshot-7",
45
- "@instructure/ui-testable": "8.25.1-snapshot-7",
46
- "@instructure/ui-utils": "8.25.1-snapshot-7",
47
- "@instructure/ui-view": "8.25.1-snapshot-7",
48
- "@instructure/uid": "8.25.1-snapshot-7",
34
+ "@instructure/emotion": "8.25.1-snapshot-10",
35
+ "@instructure/shared-types": "8.25.1-snapshot-10",
36
+ "@instructure/ui-buttons": "8.25.1-snapshot-10",
37
+ "@instructure/ui-dom-utils": "8.25.1-snapshot-10",
38
+ "@instructure/ui-expandable": "8.25.1-snapshot-10",
39
+ "@instructure/ui-flex": "8.25.1-snapshot-10",
40
+ "@instructure/ui-icons": "8.25.1-snapshot-10",
41
+ "@instructure/ui-menu": "8.25.1-snapshot-10",
42
+ "@instructure/ui-motion": "8.25.1-snapshot-10",
43
+ "@instructure/ui-prop-types": "8.25.1-snapshot-10",
44
+ "@instructure/ui-react-utils": "8.25.1-snapshot-10",
45
+ "@instructure/ui-testable": "8.25.1-snapshot-10",
46
+ "@instructure/ui-utils": "8.25.1-snapshot-10",
47
+ "@instructure/ui-view": "8.25.1-snapshot-10",
48
+ "@instructure/uid": "8.25.1-snapshot-10",
49
49
  "prop-types": "^15"
50
50
  },
51
51
  "peerDependencies": {