"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.OptionsRenderer = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const uikit_1 = require("@gravity-ui/uikit");
const FormContext_1 = require("../../hooks/FormContext.js");
const cn_1 = require("../../utils/cn.js");
const AddPropertyButton_1 = require("../AddPropertyButton/AddPropertyButton.js");
const OptionHeader_1 = require("../OptionHeader/OptionHeader.js");
const SectionHeader_1 = require("../SectionHeader/SectionHeader.js");
const b = (0, cn_1.formBuilderCn)('options-renderer');
const OptionsRenderer = ({ field, fieldName: _fieldName, inputTypeMenuItems, renderNestedField, }) => {
    const { addOptionProperty, addOption, removeOption } = (0, FormContext_1.useFormContext)();
    return ((0, jsx_runtime_1.jsxs)("div", { className: b('nested-fields'), children: [(0, jsx_runtime_1.jsxs)("div", { className: b('header'), children: [(0, jsx_runtime_1.jsx)(SectionHeader_1.SectionHeader, { title: "Options:" }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "normal", size: "s", onClick: () => {
                            addOption(field.id);
                        }, className: b('add-option-button'), children: "+ Add Option" })] }), field.options.map((option, optionIndex) => ((0, jsx_runtime_1.jsxs)("div", { className: b('option'), children: [(0, jsx_runtime_1.jsxs)("div", { className: b('option-header'), children: [(0, jsx_runtime_1.jsx)(OptionHeader_1.OptionHeader, { title: option.title }), field.options.length > 1 && ((0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "normal", size: "xs", onClick: () => {
                                    removeOption(field.id, optionIndex);
                                }, className: b('remove-option-button'), children: "Remove" }))] }), (0, jsx_runtime_1.jsxs)("div", { className: b('nested-fields'), children: [(0, jsx_runtime_1.jsx)(SectionHeader_1.SectionHeader, { title: "Properties:", variant: "body-2" }), option.properties.map((property, propIndex) => renderNestedField(property, propIndex, field.id, optionIndex)), (0, jsx_runtime_1.jsx)(AddPropertyButton_1.AddPropertyButton, { inputTypeMenuItems: inputTypeMenuItems, onAdd: (type) => {
                                    addOptionProperty(field.id, optionIndex, type);
                                } })] })] }, `option_${optionIndex}`)))] }));
};
exports.OptionsRenderer = OptionsRenderer;
//# sourceMappingURL=OptionsRenderer.js.map
