@instructure/ui-radio-input 8.33.1 → 8.33.2-snapshot-5
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 +8 -0
- package/es/RadioInput/RadioInputLocator.js +3 -1
- package/es/RadioInput/index.js +7 -26
- package/es/RadioInput/locator.js +1 -0
- package/es/RadioInput/props.js +1 -0
- package/es/RadioInput/styles.js +6 -10
- package/es/RadioInput/theme.js +8 -8
- package/es/RadioInputGroup/RadioInputGroupLocator.js +3 -1
- package/es/RadioInputGroup/index.js +14 -24
- package/es/RadioInputGroup/locator.js +1 -0
- package/es/RadioInputGroup/props.js +1 -0
- package/lib/RadioInput/RadioInputLocator.js +1 -3
- package/lib/RadioInput/index.js +6 -37
- package/lib/RadioInput/locator.js +0 -2
- package/lib/RadioInput/props.js +1 -3
- package/lib/RadioInput/styles.js +6 -11
- package/lib/RadioInput/theme.js +8 -9
- package/lib/RadioInputGroup/RadioInputGroupLocator.js +1 -3
- package/lib/RadioInputGroup/index.js +13 -35
- package/lib/RadioInputGroup/locator.js +0 -2
- package/lib/RadioInputGroup/props.js +1 -5
- package/lib/index.js +0 -2
- package/package.json +13 -13
- package/tsconfig.build.tsbuildinfo +1 -1
|
@@ -1,34 +1,21 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.default = exports.RadioInputGroup = void 0;
|
|
9
|
-
|
|
10
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
-
|
|
12
9
|
var _FormFieldGroup = require("@instructure/ui-form-field/lib/FormFieldGroup");
|
|
13
|
-
|
|
14
10
|
var _testable = require("@instructure/ui-testable/lib/testable.js");
|
|
15
|
-
|
|
16
11
|
var _matchComponentTypes = require("@instructure/ui-react-utils/lib/matchComponentTypes.js");
|
|
17
|
-
|
|
18
12
|
var _safeCloneElement = require("@instructure/ui-react-utils/lib/safeCloneElement.js");
|
|
19
|
-
|
|
20
13
|
var _omitProps = require("@instructure/ui-react-utils/lib/omitProps.js");
|
|
21
|
-
|
|
22
14
|
var _pickProps = require("@instructure/ui-react-utils/lib/pickProps.js");
|
|
23
|
-
|
|
24
15
|
var _withDeterministicId = require("@instructure/ui-react-utils/lib/DeterministicIdContext/withDeterministicId.js");
|
|
25
|
-
|
|
26
16
|
var _RadioInput = require("../RadioInput");
|
|
27
|
-
|
|
28
17
|
var _props = require("./props");
|
|
29
|
-
|
|
30
18
|
var _dec, _dec2, _class, _class2;
|
|
31
|
-
|
|
32
19
|
/**
|
|
33
20
|
---
|
|
34
21
|
category: components
|
|
@@ -40,57 +27,48 @@ let RadioInputGroup = (_dec = (0, _withDeterministicId.withDeterministicId)(), _
|
|
|
40
27
|
super(props);
|
|
41
28
|
this.ref = null;
|
|
42
29
|
this._messagesId = void 0;
|
|
43
|
-
|
|
44
30
|
this.handleRef = el => {
|
|
45
31
|
this.ref = el;
|
|
46
32
|
};
|
|
47
|
-
|
|
48
33
|
this.handleChange = e => {
|
|
49
34
|
const value = e.target.value;
|
|
50
|
-
|
|
51
35
|
if (this.props.disabled || this.props.readOnly) {
|
|
52
36
|
e.preventDefault();
|
|
53
37
|
return;
|
|
54
38
|
}
|
|
55
|
-
|
|
56
39
|
if (typeof this.props.value === 'undefined') {
|
|
57
40
|
this.setState({
|
|
58
41
|
value
|
|
59
42
|
});
|
|
60
43
|
}
|
|
61
|
-
|
|
62
44
|
if (typeof this.props.onChange === 'function') {
|
|
63
45
|
this.props.onChange(e, value);
|
|
64
46
|
}
|
|
65
47
|
};
|
|
66
|
-
|
|
67
48
|
if (typeof props.value === 'undefined') {
|
|
68
49
|
this.state = {
|
|
69
50
|
value: props.defaultValue
|
|
70
51
|
};
|
|
71
52
|
}
|
|
72
|
-
|
|
73
53
|
this._messagesId = props.deterministicId('RadioInputGroup-messages');
|
|
74
54
|
}
|
|
75
|
-
|
|
76
55
|
get hasMessages() {
|
|
77
56
|
return !!this.props.messages && this.props.messages.length > 0;
|
|
78
57
|
}
|
|
79
|
-
|
|
80
58
|
get value() {
|
|
81
59
|
return typeof this.props.value === 'undefined' ? this.state.value : this.props.value;
|
|
82
60
|
}
|
|
83
|
-
|
|
84
61
|
renderChildren() {
|
|
85
62
|
const _this$props = this.props,
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
63
|
+
children = _this$props.children,
|
|
64
|
+
name = _this$props.name,
|
|
65
|
+
variant = _this$props.variant,
|
|
66
|
+
size = _this$props.size,
|
|
67
|
+
disabled = _this$props.disabled,
|
|
68
|
+
readOnly = _this$props.readOnly;
|
|
69
|
+
|
|
70
|
+
// This adds the passed in name property to each RadioInput component
|
|
92
71
|
// and checks the input whose value matches the value property
|
|
93
|
-
|
|
94
72
|
return _react.Children.map(children, (child, index) => {
|
|
95
73
|
if ((0, _matchComponentTypes.matchComponentTypes)(child, [_RadioInput.RadioInput])) {
|
|
96
74
|
const isChecked = this.value === child.props.value;
|
|
@@ -119,11 +97,12 @@ let RadioInputGroup = (_dec = (0, _withDeterministicId.withDeterministicId)(), _
|
|
|
119
97
|
|
|
120
98
|
render() {
|
|
121
99
|
const _this$props2 = this.props,
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
100
|
+
variant = _this$props2.variant,
|
|
101
|
+
layout = _this$props2.layout,
|
|
102
|
+
description = _this$props2.description;
|
|
125
103
|
return /*#__PURE__*/_react.default.createElement(_FormFieldGroup.FormFieldGroup, Object.assign({}, (0, _omitProps.omitProps)(this.props, RadioInputGroup.allowedProps), (0, _pickProps.pickProps)(this.props, _FormFieldGroup.FormFieldGroup.allowedProps), {
|
|
126
|
-
description: description
|
|
104
|
+
description: description
|
|
105
|
+
// TODO: split out toggle variant into its own component
|
|
127
106
|
,
|
|
128
107
|
layout: layout === 'columns' && variant === 'toggle' ? 'stacked' : layout // toggles already display in cols
|
|
129
108
|
,
|
|
@@ -136,7 +115,6 @@ let RadioInputGroup = (_dec = (0, _withDeterministicId.withDeterministicId)(), _
|
|
|
136
115
|
elementRef: this.handleRef
|
|
137
116
|
}), this.renderChildren());
|
|
138
117
|
}
|
|
139
|
-
|
|
140
118
|
}, _class2.displayName = "RadioInputGroup", _class2.componentId = 'RadioInputGroup', _class2.allowedProps = _props.allowedProps, _class2.propTypes = _props.propTypes, _class2.defaultProps = {
|
|
141
119
|
disabled: false,
|
|
142
120
|
variant: 'simple',
|
|
@@ -1,18 +1,13 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports.propTypes = exports.allowedProps = void 0;
|
|
9
|
-
|
|
10
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
|
-
|
|
12
9
|
var _controllable = require("@instructure/ui-prop-types/lib/controllable.js");
|
|
13
|
-
|
|
14
10
|
var _FormPropTypes = require("@instructure/ui-form-field/lib/FormPropTypes.js");
|
|
15
|
-
|
|
16
11
|
/*
|
|
17
12
|
* The MIT License (MIT)
|
|
18
13
|
*
|
|
@@ -36,6 +31,7 @@ var _FormPropTypes = require("@instructure/ui-form-field/lib/FormPropTypes.js");
|
|
|
36
31
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
37
32
|
* SOFTWARE.
|
|
38
33
|
*/
|
|
34
|
+
|
|
39
35
|
const propTypes = {
|
|
40
36
|
name: _propTypes.default.string.isRequired,
|
|
41
37
|
description: _propTypes.default.node.isRequired,
|
package/lib/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@instructure/ui-radio-input",
|
|
3
|
-
"version": "8.33.
|
|
3
|
+
"version": "8.33.2-snapshot-5",
|
|
4
4
|
"description": "A styled HTML input type='radio' element",
|
|
5
5
|
"author": "Instructure, Inc. Engineering and Product Design",
|
|
6
6
|
"module": "./es/index.js",
|
|
@@ -24,21 +24,21 @@
|
|
|
24
24
|
"license": "MIT",
|
|
25
25
|
"dependencies": {
|
|
26
26
|
"@babel/runtime": "^7.13.10",
|
|
27
|
-
"@instructure/emotion": "8.33.
|
|
28
|
-
"@instructure/shared-types": "8.33.
|
|
29
|
-
"@instructure/ui-dom-utils": "8.33.
|
|
30
|
-
"@instructure/ui-form-field": "8.33.
|
|
31
|
-
"@instructure/ui-prop-types": "8.33.
|
|
32
|
-
"@instructure/ui-react-utils": "8.33.
|
|
33
|
-
"@instructure/ui-testable": "8.33.
|
|
27
|
+
"@instructure/emotion": "8.33.2-snapshot-5",
|
|
28
|
+
"@instructure/shared-types": "8.33.2-snapshot-5",
|
|
29
|
+
"@instructure/ui-dom-utils": "8.33.2-snapshot-5",
|
|
30
|
+
"@instructure/ui-form-field": "8.33.2-snapshot-5",
|
|
31
|
+
"@instructure/ui-prop-types": "8.33.2-snapshot-5",
|
|
32
|
+
"@instructure/ui-react-utils": "8.33.2-snapshot-5",
|
|
33
|
+
"@instructure/ui-testable": "8.33.2-snapshot-5",
|
|
34
34
|
"prop-types": "^15"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
37
|
-
"@instructure/ui-babel-preset": "8.33.
|
|
38
|
-
"@instructure/ui-color-utils": "8.33.
|
|
39
|
-
"@instructure/ui-test-locator": "8.33.
|
|
40
|
-
"@instructure/ui-test-utils": "8.33.
|
|
41
|
-
"@instructure/ui-themes": "8.33.
|
|
37
|
+
"@instructure/ui-babel-preset": "8.33.2-snapshot-5",
|
|
38
|
+
"@instructure/ui-color-utils": "8.33.2-snapshot-5",
|
|
39
|
+
"@instructure/ui-test-locator": "8.33.2-snapshot-5",
|
|
40
|
+
"@instructure/ui-test-utils": "8.33.2-snapshot-5",
|
|
41
|
+
"@instructure/ui-themes": "8.33.2-snapshot-5"
|
|
42
42
|
},
|
|
43
43
|
"peerDependencies": {
|
|
44
44
|
"react": ">=16.8 <=18"
|