"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.SelectFieldRenderer = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const React = tslib_1.__importStar(require("react"));
const uikit_1 = require("@gravity-ui/uikit");
const FormContext_1 = require("../../hooks/FormContext.js");
const cn_1 = require("../../utils/cn.js");
const b = (0, cn_1.formBuilderCn)('select-field-renderer');
const SelectFieldRenderer = ({ field }) => {
    const { updateField } = (0, FormContext_1.useFormContext)();
    if (field.type !== 'select') {
        return null;
    }
    const view = field.view;
    const mode = field.mode;
    const enumValues = (field.enum || []);
    return ((0, jsx_runtime_1.jsxs)(React.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: b('config-row'), children: [(0, jsx_runtime_1.jsx)(uikit_1.Text, { variant: "body-2", children: "View:" }), (0, jsx_runtime_1.jsx)(uikit_1.DropdownMenu, { items: [
                            {
                                action: () => updateField(field.id, { view: 'select' }),
                                text: 'Select',
                            },
                            {
                                action: () => updateField(field.id, { view: 'radiobutton' }),
                                text: 'Radio Button',
                            },
                        ], renderSwitcher: (props) => ((0, jsx_runtime_1.jsx)(uikit_1.Button, { ...props, view: "normal", size: "s", children: view === 'radiobutton' ? 'Radio Button' : 'Select' })) })] }), (0, jsx_runtime_1.jsxs)("div", { className: b('config-row'), children: [(0, jsx_runtime_1.jsx)(uikit_1.Text, { variant: "body-2", children: "Mode:" }), (0, jsx_runtime_1.jsx)(uikit_1.DropdownMenu, { items: [
                            {
                                action: () => updateField(field.id, { mode: 'single' }),
                                text: 'Single',
                            },
                            {
                                action: () => updateField(field.id, { mode: 'multiple' }),
                                text: 'Multiple',
                            },
                        ], renderSwitcher: (props) => ((0, jsx_runtime_1.jsx)(uikit_1.Button, { ...props, view: "normal", size: "s", children: mode === 'multiple' ? 'Multiple' : 'Single' })) })] }), (0, jsx_runtime_1.jsxs)("div", { className: b('config-row', { vertical: true }), children: [(0, jsx_runtime_1.jsx)(uikit_1.Text, { variant: "body-2", className: b('options-title'), children: "Options:" }), enumValues.map((option, index) => ((0, jsx_runtime_1.jsxs)("div", { className: b('enum-option'), children: [(0, jsx_runtime_1.jsxs)("div", { className: b('config-row'), children: [(0, jsx_runtime_1.jsx)(uikit_1.Text, { variant: "body-2", children: "Label:" }), (0, jsx_runtime_1.jsx)(uikit_1.TextInput, { value: option.content, onUpdate: (value) => {
                                            const newEnum = [...enumValues];
                                            newEnum[index] = {
                                                ...newEnum[index],
                                                content: value,
                                            };
                                            updateField(field.id, { enum: newEnum });
                                        }, size: "s" })] }), (0, jsx_runtime_1.jsxs)("div", { className: b('config-row'), children: [(0, jsx_runtime_1.jsx)(uikit_1.Text, { variant: "body-2", children: "Value:" }), (0, jsx_runtime_1.jsx)(uikit_1.TextInput, { value: option.value, onUpdate: (value) => {
                                            const newEnum = [...enumValues];
                                            newEnum[index] = {
                                                ...newEnum[index],
                                                value,
                                            };
                                            updateField(field.id, { enum: newEnum });
                                        }, size: "s" })] }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat-danger", size: "xs", onClick: () => {
                                    const newEnum = [...enumValues];
                                    newEnum.splice(index, 1);
                                    updateField(field.id, { enum: newEnum });
                                }, className: b('remove-button'), children: "Remove" })] }, `enum_${index}`))), (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "normal", size: "s", onClick: () => {
                            const newEnum = [...(enumValues || [])];
                            newEnum.push({
                                content: `Option ${newEnum.length + 1}`,
                                value: `option${newEnum.length + 1}`,
                            });
                            updateField(field.id, { enum: newEnum });
                        }, className: b('add-button'), children: "+ Add Option" })] })] }));
};
exports.SelectFieldRenderer = SelectFieldRenderer;
//# sourceMappingURL=SelectFieldRenderer.js.map
