@keycloakify/keycloak-account-ui/ui-shared/user-profile/OptionsComponent.js

<p align="center"> <img src="https://github.com/user-attachments/assets/e31c4910-7205-441c-9a35-e134b806b3a8"> </p> <p align="center"> <i>Repackaged Keycloak Account UI</i> <br> <br> <a href="https://github.com/keycloakify/keycloak-a

import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
import { Checkbox, Radio } from "@patternfly/react-core";
import { Controller } from "react-hook-form";
import { UserProfileGroup } from "../../ui-shared/user-profile/UserProfileGroup";
import { fieldName, isRequiredAttribute, label } from "../../ui-shared/user-profile/utils";
export const OptionComponent = (props) => {
    var _a, _b, _c;
    const { form, inputType, attribute } = props;
    const isRequired = isRequiredAttribute(attribute);
    const isMultiSelect = inputType.startsWith("multiselect");
    const Component = isMultiSelect ? Checkbox : Radio;
    const options = ((_b = (_a = attribute.validators) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.options) || [];
    const optionLabel = ((_c = attribute.annotations) === null || _c === void 0 ? void 0 : _c["inputOptionLabels"]) || {};
    return (_jsx(UserProfileGroup, Object.assign({}, props, { children: _jsx(Controller, { name: fieldName(attribute.name), control: form.control, defaultValue: "", render: ({ field }) => (_jsx(_Fragment, { children: options.map((option) => (_jsx(Component, { id: option, "data-testid": option, label: label(props.t, optionLabel[option], option), value: option, isChecked: field.value.includes(option), onChange: () => {
                        if (isMultiSelect) {
                            if (field.value.includes(option)) {
                                field.onChange(field.value.filter((item) => item !== option));
                            }
                            else {
                                field.onChange([...field.value, option]);
                            }
                        }
                        else {
                            field.onChange([option]);
                        }
                    }, readOnly: attribute.readOnly, isRequired: isRequired }, option))) })) }) })));
};
//# sourceMappingURL=OptionsComponent.js.map