UNPKG

@material-ui/core

Version:

React components that implement Google's Material Design.

139 lines (109 loc) 4.14 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")); var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties")); var _react = _interopRequireDefault(require("react")); var _propTypes = _interopRequireDefault(require("prop-types")); var _FormGroup = _interopRequireDefault(require("../FormGroup")); var _useForkRef = _interopRequireDefault(require("../utils/useForkRef")); var _RadioGroupContext = _interopRequireDefault(require("./RadioGroupContext")); var RadioGroup = _react.default.forwardRef(function RadioGroup(props, ref) { var actions = props.actions, children = props.children, name = props.name, valueProp = props.value, onChange = props.onChange, other = (0, _objectWithoutProperties2.default)(props, ["actions", "children", "name", "value", "onChange"]); var rootRef = _react.default.useRef(null); var _React$useRef = _react.default.useRef(valueProp != null), isControlled = _React$useRef.current; var _React$useState = _react.default.useState(props.defaultValue), valueState = _React$useState[0], setValue = _React$useState[1]; var value = isControlled ? valueProp : valueState; if (process.env.NODE_ENV !== 'production') { // eslint-disable-next-line react-hooks/rules-of-hooks _react.default.useEffect(function () { if (isControlled !== (valueProp != null)) { console.error(["Material-UI: A component is changing ".concat(isControlled ? 'a ' : 'an un', "controlled RadioGroup to be ").concat(isControlled ? 'un' : '', "controlled."), 'Elements should not switch from uncontrolled to controlled (or vice versa).', 'Decide between using a controlled or uncontrolled RadioGroup ' + 'element for the lifetime of the component.', 'More info: https://fb.me/react-controlled-components'].join('\n')); } }, [valueProp, isControlled]); } _react.default.useImperativeHandle(actions, function () { return { focus: function focus() { var input = rootRef.current.querySelector('input:not(:disabled):checked'); if (!input) { input = rootRef.current.querySelector('input:not(:disabled)'); } if (input) { input.focus(); } } }; }, []); var handleRef = (0, _useForkRef.default)(ref, rootRef); var handleChange = function handleChange(event) { if (!isControlled) { setValue(event.target.value); } if (onChange) { onChange(event, event.target.value); } }; return _react.default.createElement(_RadioGroupContext.default.Provider, { value: { name: name, onChange: handleChange, value: value } }, _react.default.createElement(_FormGroup.default, (0, _extends2.default)({ role: "radiogroup", ref: handleRef }, other), children)); }); process.env.NODE_ENV !== "production" ? RadioGroup.propTypes = { /** * @ignore */ actions: _propTypes.default.shape({ current: _propTypes.default.object }), /** * The content of the component. */ children: _propTypes.default.node, /** * The default `input` element value. Use when the component is not controlled. */ defaultValue: _propTypes.default.any, /** * The name used to reference the value of the control. */ name: _propTypes.default.string, /** * @ignore */ onBlur: _propTypes.default.func, /** * Callback fired when a radio button is selected. * * @param {object} event The event source of the callback. * You can pull out the new value by accessing `event.target.value` (string). */ onChange: _propTypes.default.func, /** * @ignore */ onKeyDown: _propTypes.default.func, /** * Value of the selected radio button. The DOM API casts this to a string. */ value: _propTypes.default.any } : void 0; var _default = RadioGroup; exports.default = _default;