@keycloakify/keycloak-account-ui/ui-shared/controls/select-control/SingleSelectControl.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

var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx } from "react/jsx-runtime";
import { MenuToggle, MenuToggleStatus, Select, SelectList, SelectOption, } from "@patternfly/react-core";
import { get } from "lodash-es";
import { useState } from "react";
import { Controller, useFormContext, } from "react-hook-form";
import { FormLabel } from "../../../ui-shared/controls/FormLabel";
import { isSelectBasedOptions, isString, key, } from "../../../ui-shared/controls/select-control/SelectControl";
export const SingleSelectControl = (_a) => {
    var _b;
    var { id, name, label, options, controller, labelIcon } = _a, rest = __rest(_a, ["id", "name", "label", "options", "controller", "labelIcon"]);
    const { control, formState: { errors }, } = useFormContext();
    const [open, setOpen] = useState(false);
    return (_jsx(FormLabel, { name: name, label: label, isRequired: !!((_b = controller.rules) === null || _b === void 0 ? void 0 : _b.required), error: get(errors, name), labelIcon: labelIcon, children: _jsx(Controller, Object.assign({}, controller, { name: name, control: control, render: ({ field: { onChange, value } }) => (_jsx(Select, Object.assign({}, rest, { onClick: () => setOpen(!open), onOpenChange: () => setOpen(false), selected: isSelectBasedOptions(options)
                    ? options
                        .filter((o) => Array.isArray(value)
                        ? value.includes(o.key)
                        : value === o.key)
                        .map((o) => o.value)
                    : value, toggle: (ref) => {
                    var _a;
                    return (_jsx(MenuToggle, { id: id || name.slice(name.lastIndexOf(".") + 1), ref: ref, onClick: () => setOpen(!open), isExpanded: open, isFullWidth: true, status: get(errors, name) ? MenuToggleStatus.danger : undefined, "aria-label": "toggle", children: isSelectBasedOptions(options)
                            ? (_a = options.find((o) => o.key === (Array.isArray(value) ? value[0] : value))) === null || _a === void 0 ? void 0 : _a.value
                            : value }));
                }, onSelect: (_event, v) => {
                    const option = v === null || v === void 0 ? void 0 : v.toString();
                    onChange(Array.isArray(value) ? [option] : option);
                    setOpen(false);
                }, isOpen: open, children: _jsx(SelectList, { children: options.map((option) => (_jsx(SelectOption, { value: key(option), children: isString(option) ? option : option.value }, key(option)))) }) }))) })) }));
};
//# sourceMappingURL=SingleSelectControl.js.map