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

Vimeo Design System

import { b as __rest, _ as __read, c as __assign } from '../../../tslib.es6-7f0e734f.js';
import React__default, { useMemo, useState, cloneElement } from 'react';
import { validate } from '../Shared.esm.js';
import { withIris } from '../../../utils/HOCs/withIris.esm.js';
import { generateUID } from '../../../utils/general/generateUID.esm.js';
import 'styled-components';
import 'polished';
import '../../../color/colors.esm.js';

var RadioSet = withIris(RadioSetComponent);
function RadioSetComponent(_a) {
    var children = _a.children, defaultValue = _a.defaultValue, forwardRef = _a.forwardRef, doChange = _a.onChange; _a.label; var props = __rest(_a, ["children", "defaultValue", "forwardRef", "onChange", "label"]);
    var UID = useMemo(function () { return generateUID(); }, []);
    var UIDs = useMemo(function () { return children.map(function () { return generateUID(); }); }, [children]);
    var initialCheckedIndex = children.findIndex(function (child) { return child.props.checked; });
    var _b = __read(useState(initialCheckedIndex), 2), checkedIndex = _b[0], checkedIndexSet = _b[1];
    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 cloneElement(child, {
            checked: defaultChecked ? null : checked,
            defaultChecked: defaultChecked,
            id: id,
            key: key,
            name: name,
            onChange: onChange,
        });
    }
    return (React__default.createElement("div", __assign({ ref: forwardRef }, props), children.map(cloneChildren)));
}

export { RadioSet };