import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Option, Select } from '@citric/core';
import { LoadingCircular } from '@citric/ui';
export const RawSelectField = ({ name, onChange, value, disabled, onBlur, isLoading, options, actions, renderLabel }) => (_jsxs("div", { className: "select-box", children: [_jsxs(Select, { value: value ?? '', onChange: (e) => {
                const action = actions?.find(a => a.label === e.target.value);
                if (action) {
                    action.onSelect(e);
                    // e.target.closest('select').value = value 
                }
                else
                    onChange(e.target.value || undefined);
            }, name: name, disabled: disabled || isLoading, "aria-busy": isLoading, onBlur: onBlur, children: [_jsx(Option, { value: "" }), options.map((o) => _jsx(Option, { value: o, children: renderLabel ? renderLabel(o) : o }, o)), actions?.map(({ label }) => _jsx(Option, { value: label, children: label }, label))] }), isLoading && _jsx("div", { className: "loading", children: _jsx(LoadingCircular, { size: "sm" }) })] }));
//# sourceMappingURL=RawSelectField.js.map