"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ContentTab = 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 FormGenerator_1 = tslib_1.__importDefault(require("../../../form-generator-v2/FormGenerator.js"));
const CanvasContentContext_1 = require("../../CanvasContentContext.js");
const FormContext_1 = require("../../hooks/FormContext.js");
const cn_1 = require("../../utils/cn.js");
const stripIds_1 = require("../../utils/stripIds.js");
const b = (0, cn_1.formBuilderV2Cn)('content-tab');
const ContentTab = () => {
    const { formFields } = (0, FormContext_1.useFormContext)();
    const { content, setContent } = (0, CanvasContentContext_1.useCanvasContent)();
    const schema = React.useMemo(() => (0, stripIds_1.stripIds)(formFields), [formFields]);
    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), children: [(0, jsx_runtime_1.jsxs)(uikit_1.Card, { className: b('column'), view: "outlined", children: [(0, jsx_runtime_1.jsx)(uikit_1.Text, { variant: "subheader-2", className: b('title'), children: "Live form" }), schema.length > 0 ? ((0, jsx_runtime_1.jsx)(FormGenerator_1.default, { blockConfig: schema, contentConfig: content, onUpdate: setContent })) : ((0, jsx_runtime_1.jsx)(uikit_1.Text, { variant: "body-2", color: "hint", children: "Add fields on the Visual tab to see the form here." }))] }), (0, jsx_runtime_1.jsxs)(uikit_1.Card, { className: b('column'), view: "outlined", children: [(0, jsx_runtime_1.jsx)(uikit_1.Text, { variant: "subheader-2", className: b('title'), children: "Content JSON" }), (0, jsx_runtime_1.jsx)("pre", { className: b('json'), children: JSON.stringify(content, null, 2) })] })] }));
};
exports.ContentTab = ContentTab;
//# sourceMappingURL=ContentTab.js.map
