@vimeo/iris/components/inputs/Radio/RadioSet.js

Vimeo Design System

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var tslib_es6 = require('../../../tslib.es6-3ec409b7.js');
var React = require('react');
var components_inputs_Shared = require('../Shared.js');
var utils_HOCs_withIris = require('../../../utils/HOCs/withIris.js');
var utils_general_generateUID = require('../../../utils/general/generateUID.js');
require('styled-components');
require('polished');
require('../../../color/colors.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);

var RadioSet = utils_HOCs_withIris.withIris(RadioSetComponent);
function RadioSetComponent(_a) {
    var children = _a.children, defaultValue = _a.defaultValue, forwardRef = _a.forwardRef, doChange = _a.onChange; _a.label; var props = tslib_es6.__rest(_a, ["children", "defaultValue", "forwardRef", "onChange", "label"]);
    var UID = React.useMemo(function () { return utils_general_generateUID.generateUID(); }, []);
    var UIDs = React.useMemo(function () { return children.map(function () { return utils_general_generateUID.generateUID(); }); }, [children]);
    var initialCheckedIndex = children.findIndex(function (child) { return child.props.checked; });
    var _b = tslib_es6.__read(React.useState(initialCheckedIndex), 2), checkedIndex = _b[0], checkedIndexSet = _b[1];
    components_inputs_Shared.validate(children, 'radio');
    function onChange(event) {
        if (event.target.checked) {
            var i = UIDs.indexOf(event.target.id.slice(-6));
            checkedIndexSet(i);
        }
        doChange && doChange(event);
    }
    function cloneChildren(child, i) {
        var _a;
        var checked = checkedIndex === i;
        var defaultChecked = defaultValue && defaultValue === ((_a = child.props) === null || _a === void 0 ? void 0 : _a.value);
        var id = "radio-".concat(i, "-").concat(UIDs[i]);
        var key = id;
        var name = UID;
        return React.cloneElement(child, {
            checked: defaultChecked ? null : checked,
            defaultChecked: defaultChecked,
            id: id,
            key: key,
            name: name,
            onChange: onChange,
        });
    }
    return (React__default["default"].createElement("div", tslib_es6.__assign({ ref: forwardRef }, props), children.map(cloneChildren)));
}

exports.RadioSet = RadioSet;