1 | "use strict";
|
2 |
|
3 | var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4 |
|
5 | exports.__esModule = true;
|
6 | exports["default"] = void 0;
|
7 |
|
8 | var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
9 |
|
10 | var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
|
11 |
|
12 | var _core = require("@emotion/core");
|
13 |
|
14 | var _autoId = require("@reach/auto-id");
|
15 |
|
16 | var _react = require("react");
|
17 |
|
18 | var _Box = _interopRequireDefault(require("../Box"));
|
19 |
|
20 | var _utils = require("../utils");
|
21 |
|
22 |
|
23 | var RadioGroup = (0, _react.forwardRef)(function (_ref, ref) {
|
24 | var onChange = _ref.onChange,
|
25 | name = _ref.name,
|
26 | variantColor = _ref.variantColor,
|
27 | size = _ref.size,
|
28 | defaultValue = _ref.defaultValue,
|
29 | isInline = _ref.isInline,
|
30 | valueProp = _ref.value,
|
31 | _ref$spacing = _ref.spacing,
|
32 | spacing = _ref$spacing === void 0 ? 2 : _ref$spacing,
|
33 | children = _ref.children,
|
34 | rest = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["onChange", "name", "variantColor", "size", "defaultValue", "isInline", "value", "spacing", "children"]);
|
35 |
|
36 | var _useRef = (0, _react.useRef)(valueProp != null),
|
37 | isControlled = _useRef.current;
|
38 |
|
39 | var _useState = (0, _react.useState)(defaultValue || null),
|
40 | value = _useState[0],
|
41 | setValue = _useState[1];
|
42 |
|
43 | var _value = isControlled ? valueProp : value;
|
44 |
|
45 | var rootRef = (0, _react.useRef)();
|
46 |
|
47 | var _onChange = function _onChange(event) {
|
48 | if (!isControlled) {
|
49 | setValue(event.target.value);
|
50 | }
|
51 |
|
52 | if (onChange) {
|
53 | onChange(event, event.target.value);
|
54 | }
|
55 | };
|
56 |
|
57 |
|
58 | var fallbackName = "radio-" + (0, _autoId.useId)();
|
59 |
|
60 | var _name = name || fallbackName;
|
61 |
|
62 | var validChildren = (0, _utils.cleanChildren)(children);
|
63 | var clones = validChildren.map(function (child, index) {
|
64 | var isLastRadio = validChildren.length === index + 1;
|
65 | var spacingProps = isInline ? {
|
66 | mr: spacing
|
67 | } : {
|
68 | mb: spacing
|
69 | };
|
70 | return (0, _core.jsx)(_Box["default"], (0, _extends2["default"])({
|
71 | key: index,
|
72 | display: isInline ? "inline-block" : "block"
|
73 | }, !isLastRadio && spacingProps), (0, _react.cloneElement)(child, {
|
74 | size: child.props.size || size,
|
75 | variantColor: child.props.variantColor || variantColor,
|
76 | name: _name,
|
77 | onChange: _onChange,
|
78 | isChecked: child.props.value === _value
|
79 | }));
|
80 | });
|
81 |
|
82 | (0, _react.useImperativeHandle)(ref, function () {
|
83 | return {
|
84 | focus: function focus() {
|
85 | var input = rootRef.current.querySelector("input:not(:disabled):checked");
|
86 |
|
87 | if (!input) {
|
88 | input = rootRef.current.querySelector("input:not(:disabled)");
|
89 | }
|
90 |
|
91 | if (input) {
|
92 | input.focus();
|
93 | }
|
94 | }
|
95 | };
|
96 | }, []);
|
97 | return (0, _core.jsx)(_Box["default"], (0, _extends2["default"])({
|
98 | ref: rootRef,
|
99 | role: "radiogroup"
|
100 | }, rest), clones);
|
101 | });
|
102 | RadioGroup.displayName = "RadioGroup";
|
103 | var _default = RadioGroup;
|
104 | exports["default"] = _default; |
\ | No newline at end of file |