@gravity-ui/page-constructor 8.5.0-alpha.1 → 8.5.0-alpha.4

package/build/cjs/form-builder-v2/components/SchemaPopup/SchemaPopup.d.ts

@@ -0,0 +1,11 @@
+import type { Fields } from "../../../form-generator-v2/types.js";
+import type { FormField } from "../../types.js";
+interface SchemaPopupProps {
+    schema: Fields;
+    onApply: (fields: FormField[]) => void;
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    anchorElement: HTMLElement | null;
+}
+export declare const SchemaPopup: ({ schema, onApply, open, onOpenChange, anchorElement, }: SchemaPopupProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/build/cjs/form-builder-v2/components/SchemaPopup/SchemaPopup.js

@@ -0,0 +1,82 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SchemaPopup = 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 cn_1 = require("../../utils/cn.js");
+const parseSchema_1 = require("../../utils/parseSchema.js");
+const b = (0, cn_1.formBuilderV2Cn)('schema-popup');
+const stringify = (schema) => JSON.stringify(schema, null, 2);
+const SchemaPopup = ({ schema, onApply, open, onOpenChange, anchorElement, }) => {
+    const textareaRef = React.useRef(null);
+    const copyTimeoutRef = React.useRef(null);
+    const [draft, setDraft] = React.useState(() => stringify(schema));
+    const [error, setError] = React.useState(null);
+    const [copied, setCopied] = React.useState(false);
+    const [isFocused, setIsFocused] = React.useState(false);
+    React.useEffect(() => {
+        if (!isFocused) {
+            setDraft(stringify(schema));
+            setError(null);
+        }
+    }, [schema, isFocused]);
+    React.useEffect(() => () => {
+        if (copyTimeoutRef.current)
+            clearTimeout(copyTimeoutRef.current);
+    }, []);
+    const applyDraft = (value) => {
+        setDraft(value);
+        const result = (0, parseSchema_1.parseSchema)(value);
+        if (result.ok) {
+            setError(null);
+            onApply(result.fields);
+        }
+        else {
+            setError(result.error);
+        }
+    };
+    const replaceSelection = (insert, caretOffset) => {
+        const t = textareaRef.current;
+        if (!t)
+            return;
+        const { selectionStart, selectionEnd } = t;
+        const next = draft.slice(0, selectionStart) + insert + draft.slice(selectionEnd);
+        const nextCaret = selectionStart + caretOffset;
+        applyDraft(next);
+        requestAnimationFrame(() => {
+            t.selectionStart = nextCaret;
+            t.selectionEnd = nextCaret;
+        });
+    };
+    const handleKeyDown = (event) => {
+        if (event.key === 'Tab') {
+            event.preventDefault();
+            replaceSelection('  ', 2);
+            return;
+        }
+        if (event.key === 'Enter') {
+            event.preventDefault();
+            const t = event.currentTarget;
+            const before = draft.slice(0, t.selectionStart);
+            const lineStart = before.lastIndexOf('\n') + 1;
+            const indent = before.slice(lineStart).match(/^[ \t]*/)?.[0] ?? '';
+            const insert = `\n${indent}`;
+            replaceSelection(insert, insert.length);
+        }
+    };
+    const handleCopy = React.useCallback(async () => {
+        try {
+            await navigator.clipboard.writeText(draft);
+            setCopied(true);
+            if (copyTimeoutRef.current)
+                clearTimeout(copyTimeoutRef.current);
+            copyTimeoutRef.current = setTimeout(() => setCopied(false), 1500);
+        }
+        catch { }
+    }, [draft]);
+    return ((0, jsx_runtime_1.jsx)(uikit_1.Popup, { anchorElement: anchorElement, open: open, onOpenChange: onOpenChange, placement: "bottom-end", children: (0, jsx_runtime_1.jsxs)(uikit_1.Card, { className: b(), view: "outlined", children: [(0, jsx_runtime_1.jsxs)("div", { className: b('header'), children: [(0, jsx_runtime_1.jsx)(uikit_1.Text, { variant: "subheader-2", children: "Form schema" }), (0, jsx_runtime_1.jsx)(uikit_1.Text, { variant: "caption-1", color: "hint", children: "Edit JSON directly \u2014 the canvas updates live. Paste your own schema to load it. Selection on canvas resets after each edit." })] }), (0, jsx_runtime_1.jsx)("textarea", { ref: textareaRef, className: b('textarea', { error: Boolean(error) }), value: draft, onChange: (event) => applyDraft(event.target.value), onKeyDown: handleKeyDown, onFocus: () => setIsFocused(true), onBlur: () => setIsFocused(false), spellCheck: false, wrap: "off" }), error && ((0, jsx_runtime_1.jsx)("div", { className: b('error-message'), children: (0, jsx_runtime_1.jsx)(uikit_1.Text, { variant: "caption-1", color: "danger", children: error }) })), (0, jsx_runtime_1.jsxs)("div", { className: b('actions'), children: [(0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "action", size: "m", onClick: handleCopy, children: copied ? '✓ Copied' : 'Copy' }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat", size: "m", onClick: () => onOpenChange(false), children: "Close" })] })] }) }));
+};
+exports.SchemaPopup = SchemaPopup;
+//# sourceMappingURL=SchemaPopup.js.map

package/build/cjs/form-builder-v2/components/SchemaPopup/SchemaPopup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SchemaPopup.js","sourceRoot":"../../../../../src","sources":["form-builder-v2/components/SchemaPopup/SchemaPopup.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {Button, Card, Popup, Text} from '@gravity-ui/uikit';\n\nimport type {Fields} from '../../../form-generator-v2/types';\nimport type {FormField} from '../../types';\nimport {formBuilderV2Cn} from '../../utils/cn';\nimport {parseSchema} from '../../utils/parseSchema';\n\nimport './SchemaPopup.scss';\n\nconst b = formBuilderV2Cn('schema-popup');\n\nconst stringify = (schema: Fields): string => JSON.stringify(schema, null, 2);\n\ninterface SchemaPopupProps {\n    schema: Fields;\n    onApply: (fields: FormField[]) => void;\n    open: boolean;\n    onOpenChange: (open: boolean) => void;\n    anchorElement: HTMLElement | null;\n}\n\nexport const SchemaPopup = ({\n    schema,\n    onApply,\n    open,\n    onOpenChange,\n    anchorElement,\n}: SchemaPopupProps) => {\n    const textareaRef = React.useRef<HTMLTextAreaElement>(null);\n    const copyTimeoutRef = React.useRef<ReturnType<typeof setTimeout> | null>(null);\n    const [draft, setDraft] = React.useState<string>(() => stringify(schema));\n    const [error, setError] = React.useState<string | null>(null);\n    const [copied, setCopied] = React.useState(false);\n    const [isFocused, setIsFocused] = React.useState(false);\n\n    React.useEffect(() => {\n        if (!isFocused) {\n            setDraft(stringify(schema));\n            setError(null);\n        }\n    }, [schema, isFocused]);\n\n    React.useEffect(\n        () => () => {\n            if (copyTimeoutRef.current) clearTimeout(copyTimeoutRef.current);\n        },\n        [],\n    );\n\n    const applyDraft = (value: string) => {\n        setDraft(value);\n        const result = parseSchema(value);\n        if (result.ok) {\n            setError(null);\n            onApply(result.fields);\n        } else {\n            setError(result.error);\n        }\n    };\n\n    const replaceSelection = (insert: string, caretOffset: number) => {\n        const t = textareaRef.current;\n        if (!t) return;\n        const {selectionStart, selectionEnd} = t;\n        const next = draft.slice(0, selectionStart) + insert + draft.slice(selectionEnd);\n        const nextCaret = selectionStart + caretOffset;\n        applyDraft(next);\n        requestAnimationFrame(() => {\n            t.selectionStart = nextCaret;\n            t.selectionEnd = nextCaret;\n        });\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n        if (event.key === 'Tab') {\n            event.preventDefault();\n            replaceSelection('  ', 2);\n            return;\n        }\n        if (event.key === 'Enter') {\n            event.preventDefault();\n            const t = event.currentTarget;\n            const before = draft.slice(0, t.selectionStart);\n            const lineStart = before.lastIndexOf('\\n') + 1;\n            const indent = before.slice(lineStart).match(/^[ \\t]*/)?.[0] ?? '';\n            const insert = `\\n${indent}`;\n            replaceSelection(insert, insert.length);\n        }\n    };\n\n    const handleCopy = React.useCallback(async () => {\n        try {\n            await navigator.clipboard.writeText(draft);\n            setCopied(true);\n            if (copyTimeoutRef.current) clearTimeout(copyTimeoutRef.current);\n            copyTimeoutRef.current = setTimeout(() => setCopied(false), 1500);\n        } catch {}\n    }, [draft]);\n\n    return (\n        <Popup\n            anchorElement={anchorElement}\n            open={open}\n            onOpenChange={onOpenChange}\n            placement=\"bottom-end\"\n        >\n            <Card className={b()} view=\"outlined\">\n                <div className={b('header')}>\n                    <Text variant=\"subheader-2\">Form schema</Text>\n                    <Text variant=\"caption-1\" color=\"hint\">\n                        Edit JSON directly — the canvas updates live. Paste your own schema to load\n                        it. Selection on canvas resets after each edit.\n                    </Text>\n                </div>\n                <textarea\n                    ref={textareaRef}\n                    className={b('textarea', {error: Boolean(error)})}\n                    value={draft}\n                    onChange={(event) => applyDraft(event.target.value)}\n                    onKeyDown={handleKeyDown}\n                    onFocus={() => setIsFocused(true)}\n                    onBlur={() => setIsFocused(false)}\n                    spellCheck={false}\n                    wrap=\"off\"\n                />\n                {error && (\n                    <div className={b('error-message')}>\n                        <Text variant=\"caption-1\" color=\"danger\">\n                            {error}\n                        </Text>\n                    </div>\n                )}\n                <div className={b('actions')}>\n                    <Button view=\"action\" size=\"m\" onClick={handleCopy}>\n                        {copied ? '✓ Copied' : 'Copy'}\n                    </Button>\n                    <Button view=\"flat\" size=\"m\" onClick={() => onOpenChange(false)}>\n                        Close\n                    </Button>\n                </div>\n            </Card>\n        </Popup>\n    );\n};\n"]}

package/build/cjs/form-builder-v2/components/WhenEditor/WhenEditor.css

@@ -0,0 +1,24 @@
+.pcformbuilderv2-when-editor {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  padding: var(--g-spacing-2);
+  border: 1px solid var(--g-color-line-generic);
+  border-radius: var(--g-border-radius-m);
+}
+.pcformbuilderv2-when-editor__condition {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr) 80px minmax(0, 1fr) auto;
+  gap: 6px;
+  align-items: center;
+}
+.pcformbuilderv2-when-editor__combinator {
+  display: flex;
+  align-items: center;
+}
+.pcformbuilderv2-when-editor__actions {
+  display: flex;
+  gap: var(--g-spacing-2);
+  align-items: center;
+  margin-top: var(--g-spacing-1);
+}

package/build/cjs/form-builder-v2/components/WhenEditor/WhenEditor.d.ts

@@ -0,0 +1,8 @@
+import type { When } from "../../../form-generator-v2/types.js";
+interface WhenEditorProps {
+    when: When | undefined;
+    availableFields: string[];
+    onChange: (next: When | undefined) => void;
+}
+export declare const WhenEditor: ({ when, availableFields, onChange }: WhenEditorProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/build/cjs/form-builder-v2/components/WhenEditor/WhenEditor.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.WhenEditor = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = tslib_1.__importStar(require("react"));
+const icons_1 = require("@gravity-ui/icons");
+const uikit_1 = require("@gravity-ui/uikit");
+const cn_1 = require("../../utils/cn.js");
+const utils_1 = require("./utils.js");
+const b = (0, cn_1.formBuilderV2Cn)('when-editor');
+const WhenEditor = ({ when, availableFields, onChange }) => {
+    const { conditions, combinators } = (0, utils_1.parse)(when);
+    const fieldOptions = React.useMemo(() => availableFields.map((name) => ({ value: name, content: name })), [availableFields]);
+    const commit = (nextConditions, nextCombinators) => {
+        onChange((0, utils_1.serialize)(nextConditions, nextCombinators));
+    };
+    const addCondition = () => {
+        const nextConditions = [
+            ...conditions,
+            { field: availableFields[0] ?? '', operator: '===', value: '' },
+        ];
+        const nextCombinators = conditions.length === 0 ? combinators : [...combinators, { operator: '&&' }];
+        commit(nextConditions, nextCombinators);
+    };
+    const removeCondition = (index) => {
+        const nextConditions = conditions.filter((_, i) => i !== index);
+        const nextCombinators = index === 0
+            ? combinators.slice(1)
+            : [...combinators.slice(0, index - 1), ...combinators.slice(index)];
+        commit(nextConditions, nextCombinators);
+    };
+    const updateCondition = (index, patch) => {
+        const nextConditions = conditions.map((c, i) => (i === index ? { ...c, ...patch } : c));
+        commit(nextConditions, combinators);
+    };
+    const updateCombinator = (index, op) => {
+        const nextCombinators = combinators.map((c, i) => (i === index ? { operator: op } : c));
+        commit(conditions, nextCombinators);
+    };
+    const clearAll = () => {
+        onChange(undefined);
+    };
+    if (conditions.length === 0) {
+        return ((0, jsx_runtime_1.jsx)("div", { className: b(), children: (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "normal", size: "s", onClick: addCondition, children: "+ Add condition" }) }));
+    }
+    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), children: [conditions.map((cond, i) => ((0, jsx_runtime_1.jsxs)(React.Fragment, { children: [i > 0 && ((0, jsx_runtime_1.jsx)("div", { className: b('combinator'), children: (0, jsx_runtime_1.jsx)(uikit_1.Select, { size: "s", value: [combinators[i - 1]?.operator ?? '&&'], options: utils_1.COMBINATOR_OPTIONS, onUpdate: (next) => updateCombinator(i - 1, next[0]), width: 80 }) })), (0, jsx_runtime_1.jsxs)("div", { className: b('condition'), children: [(0, jsx_runtime_1.jsx)(uikit_1.Select, { size: "s", value: [cond.field], options: fieldOptions, onUpdate: (next) => updateCondition(i, { field: next[0] ?? '' }), placeholder: "field", filterable: true, width: "max" }), (0, jsx_runtime_1.jsx)(uikit_1.Select, { size: "s", value: [cond.operator], options: utils_1.OPERATOR_OPTIONS, onUpdate: (next) => updateCondition(i, { operator: next[0] }), width: 80 }), (0, jsx_runtime_1.jsx)(uikit_1.TextInput, { size: "s", value: (0, utils_1.displayValue)(cond.value), onUpdate: (value) => updateCondition(i, { value: (0, utils_1.coerceValue)(value) }), placeholder: 'value ("true"/"false" \u2192 bool)' }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat-danger", size: "s", onClick: () => removeCondition(i), title: "Remove condition", children: (0, jsx_runtime_1.jsx)(uikit_1.Icon, { data: icons_1.TrashBin, size: 12 }) })] })] }, i))), (0, jsx_runtime_1.jsxs)("div", { className: b('actions'), children: [(0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "normal", size: "s", onClick: addCondition, children: "+ Add condition" }), (0, jsx_runtime_1.jsx)(uikit_1.Button, { view: "flat", size: "s", onClick: clearAll, children: "Clear" })] })] }));
+};
+exports.WhenEditor = WhenEditor;
+//# sourceMappingURL=WhenEditor.js.map

package/build/cjs/form-builder-v2/components/WhenEditor/WhenEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"WhenEditor.js","sourceRoot":"../../../../../src","sources":["form-builder-v2/components/WhenEditor/WhenEditor.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,6CAA2C;AAC3C,6CAAkE;AAGlE,0CAA+C;AAE/C,sCASiB;AAIjB,MAAM,CAAC,GAAG,IAAA,oBAAe,EAAC,aAAa,CAAC,CAAC;AAQlC,MAAM,UAAU,GAAG,CAAC,EAAC,IAAI,EAAE,eAAe,EAAE,QAAQ,EAAkB,EAAE,EAAE;IAC7E,MAAM,EAAC,UAAU,EAAE,WAAW,EAAC,GAAG,IAAA,aAAK,EAAC,IAAI,CAAC,CAAC;IAE9C,MAAM,YAAY,GAAG,KAAK,CAAC,OAAO,CAC9B,GAAG,EAAE,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,EAAC,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC,EACnE,CAAC,eAAe,CAAC,CACpB,CAAC;IAEF,MAAM,MAAM,GAAG,CAAC,cAA2B,EAAE,eAA6B,EAAE,EAAE;QAC1E,QAAQ,CAAC,IAAA,iBAAS,EAAC,cAAc,EAAE,eAAe,CAAC,CAAC,CAAC;IACzD,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,GAAG,EAAE;QACtB,MAAM,cAAc,GAAgB;YAChC,GAAG,UAAU;YACb,EAAC,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAC;SAChE,CAAC;QACF,MAAM,eAAe,GACjB,UAAU,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,GAAG,WAAW,EAAE,EAAC,QAAQ,EAAE,IAAI,EAAC,CAAC,CAAC;QAC/E,MAAM,CAAC,cAAc,EAAE,eAAe,CAAC,CAAC;IAC5C,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,KAAa,EAAE,EAAE;QACtC,MAAM,cAAc,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC;QAChE,MAAM,eAAe,GACjB,KAAK,KAAK,CAAC;YACP,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC;YACtB,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,EAAE,GAAG,WAAW,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC;QAC5E,MAAM,CAAC,cAAc,EAAE,eAAe,CAAC,CAAC;IAC5C,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,KAAa,EAAE,KAAyB,EAAE,EAAE;QACjE,MAAM,cAAc,GAAG,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC,EAAC,GAAG,CAAC,EAAE,GAAG,KAAK,EAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACtF,MAAM,CAAC,cAAc,EAAE,WAAW,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,CAAC,KAAa,EAAE,EAAe,EAAE,EAAE;QACxD,MAAM,eAAe,GAAG,WAAW,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC,EAAC,QAAQ,EAAE,EAAE,EAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACtF,MAAM,CAAC,UAAU,EAAE,eAAe,CAAC,CAAC;IACxC,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,GAAG,EAAE;QAClB,QAAQ,CAAC,SAAS,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAC1B,OAAO,CACH,gCAAK,SAAS,EAAE,CAAC,EAAE,YACf,uBAAC,cAAM,IAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,YAAY,gCAE3C,GACP,CACT,CAAC;IACN,CAAC;IAED,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,EAAE,aACd,UAAU,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,CACzB,wBAAC,KAAK,CAAC,QAAQ,eACV,CAAC,GAAG,CAAC,IAAI,CACN,gCAAK,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,YAC3B,uBAAC,cAAM,IACH,IAAI,EAAC,GAAG,EACR,KAAK,EAAE,CAAC,WAAW,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,QAAQ,IAAI,IAAI,CAAC,EAC7C,OAAO,EAAE,0BAAkB,EAC3B,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,gBAAgB,CAAC,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC,CAAC,CAAgB,CAAC,EACnE,KAAK,EAAE,EAAE,GACX,GACA,CACT,EACD,iCAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,aAC1B,uBAAC,cAAM,IACH,IAAI,EAAC,GAAG,EACR,KAAK,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,EACnB,OAAO,EAAE,YAAY,EACrB,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,eAAe,CAAC,CAAC,EAAE,EAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,EAAC,CAAC,EAC9D,WAAW,EAAC,OAAO,EACnB,UAAU,QACV,KAAK,EAAC,KAAK,GACb,EACF,uBAAC,cAAM,IACH,IAAI,EAAC,GAAG,EACR,KAAK,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,EACtB,OAAO,EAAE,wBAAgB,EACzB,QAAQ,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,eAAe,CAAC,CAAC,EAAE,EAAC,QAAQ,EAAE,IAAI,CAAC,CAAC,CAAkB,EAAC,CAAC,EAE5D,KAAK,EAAE,EAAE,GACX,EACF,uBAAC,iBAAS,IACN,IAAI,EAAC,GAAG,EACR,KAAK,EAAE,IAAA,oBAAY,EAAC,IAAI,CAAC,KAAK,CAAC,EAC/B,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,eAAe,CAAC,CAAC,EAAE,EAAC,KAAK,EAAE,IAAA,mBAAW,EAAC,KAAK,CAAC,EAAC,CAAC,EACpE,WAAW,EAAC,oCAA+B,GAC7C,EACF,uBAAC,cAAM,IACH,IAAI,EAAC,aAAa,EAClB,IAAI,EAAC,GAAG,EACR,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC,EACjC,KAAK,EAAC,kBAAkB,YAExB,uBAAC,YAAI,IAAC,IAAI,EAAE,gBAAQ,EAAE,IAAI,EAAE,EAAE,GAAI,GAC7B,IACP,KA7CW,CAAC,CA8CL,CACpB,CAAC,EACF,iCAAK,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,aACxB,uBAAC,cAAM,IAAC,IAAI,EAAC,QAAQ,EAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,YAAY,gCAE3C,EACT,uBAAC,cAAM,IAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,QAAQ,sBAErC,IACP,IACJ,CACT,CAAC;AACN,CAAC,CAAC;AApHW,QAAA,UAAU,cAoHrB","sourcesContent":["import * as React from 'react';\n\nimport {TrashBin} from '@gravity-ui/icons';\nimport {Button, Icon, Select, TextInput} from '@gravity-ui/uikit';\n\nimport type {When} from '../../../form-generator-v2/types';\nimport {formBuilderV2Cn} from '../../utils/cn';\n\nimport {\n    COMBINATOR_OPTIONS,\n    Combinator,\n    Condition,\n    OPERATOR_OPTIONS,\n    coerceValue,\n    displayValue,\n    parse,\n    serialize,\n} from './utils';\n\nimport './WhenEditor.scss';\n\nconst b = formBuilderV2Cn('when-editor');\n\ninterface WhenEditorProps {\n    when: When | undefined;\n    availableFields: string[];\n    onChange: (next: When | undefined) => void;\n}\n\nexport const WhenEditor = ({when, availableFields, onChange}: WhenEditorProps) => {\n    const {conditions, combinators} = parse(when);\n\n    const fieldOptions = React.useMemo(\n        () => availableFields.map((name) => ({value: name, content: name})),\n        [availableFields],\n    );\n\n    const commit = (nextConditions: Condition[], nextCombinators: Combinator[]) => {\n        onChange(serialize(nextConditions, nextCombinators));\n    };\n\n    const addCondition = () => {\n        const nextConditions: Condition[] = [\n            ...conditions,\n            {field: availableFields[0] ?? '', operator: '===', value: ''},\n        ];\n        const nextCombinators: Combinator[] =\n            conditions.length === 0 ? combinators : [...combinators, {operator: '&&'}];\n        commit(nextConditions, nextCombinators);\n    };\n\n    const removeCondition = (index: number) => {\n        const nextConditions = conditions.filter((_, i) => i !== index);\n        const nextCombinators =\n            index === 0\n                ? combinators.slice(1)\n                : [...combinators.slice(0, index - 1), ...combinators.slice(index)];\n        commit(nextConditions, nextCombinators);\n    };\n\n    const updateCondition = (index: number, patch: Partial<Condition>) => {\n        const nextConditions = conditions.map((c, i) => (i === index ? {...c, ...patch} : c));\n        commit(nextConditions, combinators);\n    };\n\n    const updateCombinator = (index: number, op: '&&' | '||') => {\n        const nextCombinators = combinators.map((c, i) => (i === index ? {operator: op} : c));\n        commit(conditions, nextCombinators);\n    };\n\n    const clearAll = () => {\n        onChange(undefined);\n    };\n\n    if (conditions.length === 0) {\n        return (\n            <div className={b()}>\n                <Button view=\"normal\" size=\"s\" onClick={addCondition}>\n                    + Add condition\n                </Button>\n            </div>\n        );\n    }\n\n    return (\n        <div className={b()}>\n            {conditions.map((cond, i) => (\n                <React.Fragment key={i}>\n                    {i > 0 && (\n                        <div className={b('combinator')}>\n                            <Select\n                                size=\"s\"\n                                value={[combinators[i - 1]?.operator ?? '&&']}\n                                options={COMBINATOR_OPTIONS}\n                                onUpdate={(next) => updateCombinator(i - 1, next[0] as '&&' | '||')}\n                                width={80}\n                            />\n                        </div>\n                    )}\n                    <div className={b('condition')}>\n                        <Select\n                            size=\"s\"\n                            value={[cond.field]}\n                            options={fieldOptions}\n                            onUpdate={(next) => updateCondition(i, {field: next[0] ?? ''})}\n                            placeholder=\"field\"\n                            filterable\n                            width=\"max\"\n                        />\n                        <Select\n                            size=\"s\"\n                            value={[cond.operator]}\n                            options={OPERATOR_OPTIONS}\n                            onUpdate={(next) =>\n                                updateCondition(i, {operator: next[0] as '===' | '!=='})\n                            }\n                            width={80}\n                        />\n                        <TextInput\n                            size=\"s\"\n                            value={displayValue(cond.value)}\n                            onUpdate={(value) => updateCondition(i, {value: coerceValue(value)})}\n                            placeholder='value (\"true\"/\"false\" → bool)'\n                        />\n                        <Button\n                            view=\"flat-danger\"\n                            size=\"s\"\n                            onClick={() => removeCondition(i)}\n                            title=\"Remove condition\"\n                        >\n                            <Icon data={TrashBin} size={12} />\n                        </Button>\n                    </div>\n                </React.Fragment>\n            ))}\n            <div className={b('actions')}>\n                <Button view=\"normal\" size=\"s\" onClick={addCondition}>\n                    + Add condition\n                </Button>\n                <Button view=\"flat\" size=\"s\" onClick={clearAll}>\n                    Clear\n                </Button>\n            </div>\n        </div>\n    );\n};\n"]}

package/build/cjs/form-builder-v2/components/WhenEditor/utils.d.ts

@@ -0,0 +1,24 @@
+import type { When } from "../../../form-generator-v2/types.js";
+export type Condition = {
+    field: string;
+    operator: '===' | '!==';
+    value: string | boolean;
+};
+export type Combinator = {
+    operator: '&&' | '||';
+};
+export declare const OPERATOR_OPTIONS: {
+    value: string;
+    content: string;
+}[];
+export declare const COMBINATOR_OPTIONS: {
+    value: string;
+    content: string;
+}[];
+export declare const parse: (when: When | undefined) => {
+    conditions: Condition[];
+    combinators: Combinator[];
+};
+export declare const serialize: (conditions: Condition[], combinators: Combinator[]) => When | undefined;
+export declare const coerceValue: (raw: string) => string | boolean;
+export declare const displayValue: (value: string | boolean | undefined) => string;

package/build/cjs/form-builder-v2/components/WhenEditor/utils.js

@@ -0,0 +1,83 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.displayValue = exports.coerceValue = exports.serialize = exports.parse = exports.COMBINATOR_OPTIONS = exports.OPERATOR_OPTIONS = void 0;
+exports.OPERATOR_OPTIONS = [
+    { value: '===', content: 'is' },
+    { value: '!==', content: 'is not' },
+];
+exports.COMBINATOR_OPTIONS = [
+    { value: '&&', content: 'AND' },
+    { value: '||', content: 'OR' },
+];
+const parse = (when) => {
+    const conditions = [];
+    const combinators = [];
+    if (!when)
+        return { conditions, combinators };
+    let lastWasCombinator = false;
+    for (const entry of when) {
+        const isCondition = Boolean(entry.field) && (entry.operator === '===' || entry.operator === '!==');
+        const isCombinator = !entry.field && (entry.operator === '&&' || entry.operator === '||');
+        if (isCondition) {
+            conditions.push({
+                field: entry.field,
+                operator: entry.operator,
+                value: entry.value ?? '',
+            });
+            lastWasCombinator = false;
+            continue;
+        }
+        if (isCombinator) {
+            if (conditions.length === 0 || lastWasCombinator)
+                continue;
+            combinators.push({ operator: entry.operator });
+            lastWasCombinator = true;
+        }
+    }
+    if (lastWasCombinator) {
+        combinators.pop();
+    }
+    while (combinators.length < conditions.length - 1) {
+        combinators.push({ operator: '&&' });
+    }
+    if (combinators.length > Math.max(0, conditions.length - 1)) {
+        combinators.length = Math.max(0, conditions.length - 1);
+    }
+    return { conditions, combinators };
+};
+exports.parse = parse;
+const serialize = (conditions, combinators) => {
+    if (conditions.length === 0)
+        return undefined;
+    const out = [];
+    conditions.forEach((cond, i) => {
+        if (i > 0) {
+            const combinator = combinators[i - 1] ?? { operator: '&&' };
+            out.push({ operator: combinator.operator });
+        }
+        out.push({
+            field: cond.field,
+            operator: cond.operator,
+            value: cond.value,
+        });
+    });
+    return out;
+};
+exports.serialize = serialize;
+const coerceValue = (raw) => {
+    if (raw === 'true')
+        return true;
+    if (raw === 'false')
+        return false;
+    return raw;
+};
+exports.coerceValue = coerceValue;
+const displayValue = (value) => {
+    if (value === true)
+        return 'true';
+    if (value === false)
+        return 'false';
+    return value ?? '';
+};
+exports.displayValue = displayValue;
+//# sourceMappingURL=utils.js.map

package/build/cjs/form-builder-v2/components/WhenEditor/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"../../../../../src","sources":["form-builder-v2/components/WhenEditor/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import type {When} from '../../../form-generator-v2/types';\n\nexport type Condition = {field: string; operator: '===' | '!=='; value: string | boolean};\nexport type Combinator = {operator: '&&' | '||'};\n\nexport const OPERATOR_OPTIONS = [\n    {value: '===', content: 'is'},\n    {value: '!==', content: 'is not'},\n];\n\nexport const COMBINATOR_OPTIONS = [\n    {value: '&&', content: 'AND'},\n    {value: '||', content: 'OR'},\n];\n\nexport const parse = (\n    when: When | undefined,\n): {conditions: Condition[]; combinators: Combinator[]} => {\n    const conditions: Condition[] = [];\n    const combinators: Combinator[] = [];\n    if (!when) return {conditions, combinators};\n\n    let lastWasCombinator = false;\n\n    for (const entry of when) {\n        const isCondition =\n            Boolean(entry.field) && (entry.operator === '===' || entry.operator === '!==');\n        const isCombinator = !entry.field && (entry.operator === '&&' || entry.operator === '||');\n\n        if (isCondition) {\n            conditions.push({\n                field: entry.field as string,\n                operator: entry.operator as '===' | '!==',\n                value: entry.value ?? '',\n            });\n            lastWasCombinator = false;\n            continue;\n        }\n\n        if (isCombinator) {\n            if (conditions.length === 0 || lastWasCombinator) continue;\n            combinators.push({operator: entry.operator as '&&' | '||'});\n            lastWasCombinator = true;\n        }\n    }\n\n    if (lastWasCombinator) {\n        combinators.pop();\n    }\n\n    while (combinators.length < conditions.length - 1) {\n        combinators.push({operator: '&&'});\n    }\n\n    if (combinators.length > Math.max(0, conditions.length - 1)) {\n        combinators.length = Math.max(0, conditions.length - 1);\n    }\n\n    return {conditions, combinators};\n};\n\nexport const serialize = (conditions: Condition[], combinators: Combinator[]): When | undefined => {\n    if (conditions.length === 0) return undefined;\n    const out: When = [];\n    conditions.forEach((cond, i) => {\n        if (i > 0) {\n            const combinator = combinators[i - 1] ?? {operator: '&&'};\n            out.push({operator: combinator.operator});\n        }\n        out.push({\n            field: cond.field,\n            operator: cond.operator,\n            value: cond.value,\n        });\n    });\n    return out;\n};\n\nexport const coerceValue = (raw: string): string | boolean => {\n    if (raw === 'true') return true;\n    if (raw === 'false') return false;\n    return raw;\n};\n\nexport const displayValue = (value: string | boolean | undefined): string => {\n    if (value === true) return 'true';\n    if (value === false) return 'false';\n    return value ?? '';\n};\n"]}

package/build/cjs/form-builder-v2/hooks/FormContext.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { FormContextType, FormField } from "../types.js";
+export declare const FormContext: React.Context<FormContextType | null>;
+interface FormProviderProps {
+    children: React.ReactNode;
+    formFields: FormField[];
+    onChange?: (fields: FormField[]) => void;
+}
+export declare const FormProvider: ({ children, formFields, onChange }: FormProviderProps) => import("react/jsx-runtime").JSX.Element;
+export declare const useFormContext: () => FormContextType;
+export {};

package/build/cjs/form-builder-v2/hooks/FormContext.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFormContext = exports.FormProvider = exports.FormContext = void 0;
+const tslib_1 = require("tslib");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const React = tslib_1.__importStar(require("react"));
+const useFormFields_1 = require("./useFormFields.js");
+exports.FormContext = React.createContext(null);
+const FormProvider = ({ children, formFields, onChange }) => {
+    const value = (0, useFormFields_1.useFormFields)({ initialFields: formFields, onChange });
+    return (0, jsx_runtime_1.jsx)(exports.FormContext.Provider, { value: value, children: children });
+};
+exports.FormProvider = FormProvider;
+const useFormContext = () => {
+    const context = React.useContext(exports.FormContext);
+    if (!context) {
+        throw new Error('useFormContext must be used within a FormProvider');
+    }
+    return context;
+};
+exports.useFormContext = useFormContext;
+//# sourceMappingURL=FormContext.js.map

package/build/cjs/form-builder-v2/hooks/FormContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormContext.js","sourceRoot":"../../../../src","sources":["form-builder-v2/hooks/FormContext.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAI/B,sDAA8C;AAEjC,QAAA,WAAW,GAAG,KAAK,CAAC,aAAa,CAAyB,IAAI,CAAC,CAAC;AAQtE,MAAM,YAAY,GAAG,CAAC,EAAC,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAoB,EAAE,EAAE;IAChF,MAAM,KAAK,GAAG,IAAA,6BAAa,EAAC,EAAC,aAAa,EAAE,UAAU,EAAE,QAAQ,EAAC,CAAC,CAAC;IACnE,OAAO,uBAAC,mBAAW,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,YAAG,QAAQ,GAAwB,CAAC;AACjF,CAAC,CAAC;AAHW,QAAA,YAAY,gBAGvB;AAEK,MAAM,cAAc,GAAG,GAAoB,EAAE;IAChD,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CAAC,mBAAW,CAAC,CAAC;IAC9C,IAAI,CAAC,OAAO,EAAE,CAAC;QACX,MAAM,IAAI,KAAK,CAAC,mDAAmD,CAAC,CAAC;IACzE,CAAC;IACD,OAAO,OAAO,CAAC;AACnB,CAAC,CAAC;AANW,QAAA,cAAc,kBAMzB","sourcesContent":["import * as React from 'react';\n\nimport {FormContextType, FormField} from '../types';\n\nimport {useFormFields} from './useFormFields';\n\nexport const FormContext = React.createContext<FormContextType | null>(null);\n\ninterface FormProviderProps {\n    children: React.ReactNode;\n    formFields: FormField[];\n    onChange?: (fields: FormField[]) => void;\n}\n\nexport const FormProvider = ({children, formFields, onChange}: FormProviderProps) => {\n    const value = useFormFields({initialFields: formFields, onChange});\n    return <FormContext.Provider value={value}>{children}</FormContext.Provider>;\n};\n\nexport const useFormContext = (): FormContextType => {\n    const context = React.useContext(FormContext);\n    if (!context) {\n        throw new Error('useFormContext must be used within a FormProvider');\n    }\n    return context;\n};\n"]}

package/build/cjs/form-builder-v2/hooks/useFormFields.d.ts

@@ -0,0 +1,23 @@
+import { BuilderFieldType, FieldUpdate, FormField } from "../types.js";
+interface UseFormFieldsProps {
+    initialFields: FormField[];
+    onChange?: (fields: FormField[]) => void;
+}
+export declare const useFormFields: ({ initialFields, onChange }: UseFormFieldsProps) => {
+    formFields: FormField[];
+    selectedFieldId: string | null;
+    addField: (type: BuilderFieldType) => void;
+    addFieldToSection: (sectionId: string, type: BuilderFieldType) => void;
+    insertFieldBefore: (targetId: string, type: BuilderFieldType) => void;
+    insertFieldAfter: (targetId: string, type: BuilderFieldType) => void;
+    moveFieldToSection: (fieldId: string, targetSectionId: string) => void;
+    removeField: (fieldId: string) => void;
+    duplicateField: (fieldId: string) => void;
+    updateField: (fieldId: string, updates: FieldUpdate) => void;
+    moveFieldUp: (fieldId: string) => void;
+    moveFieldDown: (fieldId: string) => void;
+    setAllFields: (next: FormField[]) => void;
+    resetForm: () => void;
+    selectField: (fieldId: string | null) => void;
+};
+export {};

package/build/cjs/form-builder-v2/hooks/useFormFields.js

@@ -0,0 +1,144 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFormFields = void 0;
+const tslib_1 = require("tslib");
+const React = tslib_1.__importStar(require("react"));
+const fieldDefaults_1 = require("../utils/fieldDefaults.js");
+const fieldNames_1 = require("../utils/fieldNames.js");
+const fieldTree_1 = require("../utils/fieldTree.js");
+const fieldTreeOps_1 = require("../utils/fieldTreeOps.js");
+const useFormFields = ({ initialFields, onChange }) => {
+    const [formFields, setFormFields] = React.useState(initialFields);
+    const [selectedFieldId, setSelectedFieldId] = React.useState(null);
+    const idCounter = React.useRef((0, fieldNames_1.maxIdNumericSuffix)(initialFields) + 1);
+    const generateId = React.useCallback(() => {
+        const id = `fb2_${idCounter.current}`;
+        idCounter.current += 1;
+        return id;
+    }, []);
+    const generateName = React.useCallback(() => `field_${idCounter.current}`, []);
+    const commit = React.useCallback((next) => {
+        setFormFields(next);
+        onChange?.(next);
+    }, [onChange]);
+    const addField = React.useCallback((type) => {
+        const id = generateId();
+        const name = generateName();
+        const newField = (0, fieldDefaults_1.createDefaultField)(type, name, id);
+        commit([...formFields, newField]);
+    }, [commit, formFields, generateId, generateName]);
+    const addFieldToSection = React.useCallback((sectionId, type) => {
+        const id = generateId();
+        const baseName = generateName();
+        const arrayMode = (0, fieldTreeOps_1.isArrayModeSection)(formFields, sectionId);
+        const name = arrayMode ? (0, fieldNames_1.prefixNameForArrayMode)(baseName) : baseName;
+        const newChild = (0, fieldDefaults_1.createDefaultField)(type, name, id);
+        commit((0, fieldTreeOps_1.addChildToSectionDeep)(formFields, sectionId, newChild));
+    }, [commit, formFields, generateId, generateName]);
+    const insertFieldRelative = React.useCallback((targetId, type, offset) => {
+        const makeField = (arrayMode) => {
+            const id = generateId();
+            const baseName = generateName();
+            const name = arrayMode ? (0, fieldNames_1.prefixNameForArrayMode)(baseName) : baseName;
+            return (0, fieldDefaults_1.createDefaultField)(type, name, id);
+        };
+        const result = (0, fieldTreeOps_1.insertAtTargetDeep)(formFields, targetId, offset, makeField);
+        if (result === null) {
+            const fallback = makeField(false);
+            commit([...formFields, fallback]);
+            return;
+        }
+        commit(result);
+    }, [commit, formFields, generateId, generateName]);
+    const insertFieldBefore = React.useCallback((targetId, type) => insertFieldRelative(targetId, type, 0), [insertFieldRelative]);
+    const insertFieldAfter = React.useCallback((targetId, type) => insertFieldRelative(targetId, type, 1), [insertFieldRelative]);
+    const removeField = React.useCallback((fieldId) => {
+        commit((0, fieldTreeOps_1.removeFieldDeep)(formFields, fieldId));
+    }, [commit, formFields]);
+    const moveFieldToSection = React.useCallback((fieldId, targetSectionId) => {
+        if (fieldId === targetSectionId)
+            return;
+        const sourceField = (0, fieldTree_1.findFieldById)(formFields, fieldId);
+        if (!sourceField)
+            return;
+        const targetField = (0, fieldTree_1.findFieldById)(formFields, targetSectionId);
+        if (!targetField || targetField.type !== 'section') {
+            return;
+        }
+        if (sourceField.type === 'section' && (0, fieldTreeOps_1.containsId)(sourceField, targetSectionId)) {
+            return;
+        }
+        const withoutField = (0, fieldTreeOps_1.removeFieldDeep)(formFields, fieldId);
+        const targetIsArray = (0, fieldTreeOps_1.isArrayModeSection)(withoutField, targetSectionId);
+        let movedField = sourceField;
+        if (sourceField.type !== 'section' && sourceField.type !== 'text') {
+            const currentHasIndex = sourceField.name.includes('{{index}}');
+            if (targetIsArray && !currentHasIndex) {
+                movedField = {
+                    ...sourceField,
+                    name: (0, fieldNames_1.prefixNameForArrayMode)(sourceField.name),
+                };
+            }
+            else if (!targetIsArray && currentHasIndex) {
+                movedField = {
+                    ...sourceField,
+                    name: (0, fieldNames_1.stripArrayModePrefix)(sourceField.name),
+                };
+            }
+        }
+        const result = (0, fieldTreeOps_1.addChildToSectionDeep)(withoutField, targetSectionId, movedField);
+        commit(result);
+    }, [commit, formFields]);
+    const duplicateField = React.useCallback((fieldId) => {
+        const existingNames = (0, fieldNames_1.collectNames)(formFields);
+        const result = (0, fieldTreeOps_1.duplicateFieldDeep)(formFields, fieldId, generateId, existingNames);
+        if (result !== null) {
+            commit(result);
+        }
+    }, [commit, formFields, generateId]);
+    const updateField = React.useCallback((fieldId, updates) => {
+        commit((0, fieldTreeOps_1.updateFieldDeep)(formFields, fieldId, updates));
+    }, [commit, formFields]);
+    const moveFieldUp = React.useCallback((fieldId) => {
+        const result = (0, fieldTreeOps_1.swapInListDeep)(formFields, fieldId, -1);
+        if (result.handled) {
+            commit(result.fields);
+        }
+    }, [commit, formFields]);
+    const moveFieldDown = React.useCallback((fieldId) => {
+        const result = (0, fieldTreeOps_1.swapInListDeep)(formFields, fieldId, 1);
+        if (result.handled) {
+            commit(result.fields);
+        }
+    }, [commit, formFields]);
+    const setAllFields = React.useCallback((next) => {
+        idCounter.current = Math.max(idCounter.current, (0, fieldNames_1.maxIdNumericSuffix)(next) + 1);
+        commit(next);
+    }, [commit]);
+    const resetForm = React.useCallback(() => {
+        commit([]);
+        setSelectedFieldId(null);
+    }, [commit]);
+    const selectField = React.useCallback((fieldId) => {
+        setSelectedFieldId(fieldId);
+    }, []);
+    return {
+        formFields,
+        selectedFieldId,
+        addField,
+        addFieldToSection,
+        insertFieldBefore,
+        insertFieldAfter,
+        moveFieldToSection,
+        removeField,
+        duplicateField,
+        updateField,
+        moveFieldUp,
+        moveFieldDown,
+        setAllFields,
+        resetForm,
+        selectField,
+    };
+};
+exports.useFormFields = useFormFields;
+//# sourceMappingURL=useFormFields.js.map

package/build/cjs/form-builder-v2/hooks/useFormFields.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFormFields.js","sourceRoot":"../../../../src","sources":["form-builder-v2/hooks/useFormFields.ts"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport {BuilderFieldType, FieldUpdate, FormField} from '../types';\nimport {createDefaultField} from '../utils/fieldDefaults';\nimport {\n    collectNames,\n    maxIdNumericSuffix,\n    prefixNameForArrayMode,\n    stripArrayModePrefix,\n} from '../utils/fieldNames';\nimport {findFieldById} from '../utils/fieldTree';\nimport {\n    addChildToSectionDeep,\n    containsId,\n    duplicateFieldDeep,\n    insertAtTargetDeep,\n    isArrayModeSection,\n    removeFieldDeep,\n    swapInListDeep,\n    updateFieldDeep,\n} from '../utils/fieldTreeOps';\n\ninterface UseFormFieldsProps {\n    initialFields: FormField[];\n    onChange?: (fields: FormField[]) => void;\n}\n\nexport const useFormFields = ({initialFields, onChange}: UseFormFieldsProps) => {\n    const [formFields, setFormFields] = React.useState<FormField[]>(initialFields);\n    const [selectedFieldId, setSelectedFieldId] = React.useState<string | null>(null);\n    const idCounter = React.useRef<number>(maxIdNumericSuffix(initialFields) + 1);\n\n    const generateId = React.useCallback(() => {\n        const id = `fb2_${idCounter.current}`;\n        idCounter.current += 1;\n        return id;\n    }, []);\n\n    const generateName = React.useCallback(() => `field_${idCounter.current}`, []);\n\n    const commit = React.useCallback(\n        (next: FormField[]) => {\n            setFormFields(next);\n            onChange?.(next);\n        },\n        [onChange],\n    );\n\n    const addField = React.useCallback(\n        (type: BuilderFieldType) => {\n            const id = generateId();\n            const name = generateName();\n            const newField = createDefaultField(type, name, id);\n            commit([...formFields, newField]);\n        },\n        [commit, formFields, generateId, generateName],\n    );\n\n    const addFieldToSection = React.useCallback(\n        (sectionId: string, type: BuilderFieldType) => {\n            const id = generateId();\n            const baseName = generateName();\n            const arrayMode = isArrayModeSection(formFields, sectionId);\n            const name = arrayMode ? prefixNameForArrayMode(baseName) : baseName;\n            const newChild = createDefaultField(type, name, id);\n            commit(addChildToSectionDeep(formFields, sectionId, newChild));\n        },\n        [commit, formFields, generateId, generateName],\n    );\n\n    const insertFieldRelative = React.useCallback(\n        (targetId: string, type: BuilderFieldType, offset: 0 | 1) => {\n            const makeField = (arrayMode: boolean): FormField => {\n                const id = generateId();\n                const baseName = generateName();\n                const name = arrayMode ? prefixNameForArrayMode(baseName) : baseName;\n                return createDefaultField(type, name, id);\n            };\n            const result = insertAtTargetDeep(formFields, targetId, offset, makeField);\n            if (result === null) {\n                const fallback = makeField(false);\n                commit([...formFields, fallback]);\n                return;\n            }\n            commit(result);\n        },\n        [commit, formFields, generateId, generateName],\n    );\n\n    const insertFieldBefore = React.useCallback(\n        (targetId: string, type: BuilderFieldType) => insertFieldRelative(targetId, type, 0),\n        [insertFieldRelative],\n    );\n\n    const insertFieldAfter = React.useCallback(\n        (targetId: string, type: BuilderFieldType) => insertFieldRelative(targetId, type, 1),\n        [insertFieldRelative],\n    );\n\n    const removeField = React.useCallback(\n        (fieldId: string) => {\n            commit(removeFieldDeep(formFields, fieldId));\n        },\n        [commit, formFields],\n    );\n\n    const moveFieldToSection = React.useCallback(\n        (fieldId: string, targetSectionId: string) => {\n            if (fieldId === targetSectionId) return;\n\n            const sourceField = findFieldById(formFields, fieldId);\n            if (!sourceField) return;\n\n            const targetField = findFieldById(formFields, targetSectionId);\n            if (!targetField || targetField.type !== 'section') {\n                return;\n            }\n\n            if (sourceField.type === 'section' && containsId(sourceField, targetSectionId)) {\n                return;\n            }\n\n            const withoutField = removeFieldDeep(formFields, fieldId);\n            const targetIsArray = isArrayModeSection(withoutField, targetSectionId);\n\n            let movedField = sourceField;\n            if (sourceField.type !== 'section' && sourceField.type !== 'text') {\n                const currentHasIndex = sourceField.name.includes('{{index}}');\n                if (targetIsArray && !currentHasIndex) {\n                    movedField = {\n                        ...sourceField,\n                        name: prefixNameForArrayMode(sourceField.name),\n                    };\n                } else if (!targetIsArray && currentHasIndex) {\n                    movedField = {\n                        ...sourceField,\n                        name: stripArrayModePrefix(sourceField.name),\n                    };\n                }\n            }\n\n            const result = addChildToSectionDeep(withoutField, targetSectionId, movedField);\n            commit(result);\n        },\n        [commit, formFields],\n    );\n\n    const duplicateField = React.useCallback(\n        (fieldId: string) => {\n            const existingNames = collectNames(formFields);\n            const result = duplicateFieldDeep(formFields, fieldId, generateId, existingNames);\n            if (result !== null) {\n                commit(result);\n            }\n        },\n        [commit, formFields, generateId],\n    );\n\n    const updateField = React.useCallback(\n        (fieldId: string, updates: FieldUpdate) => {\n            commit(updateFieldDeep(formFields, fieldId, updates));\n        },\n        [commit, formFields],\n    );\n\n    const moveFieldUp = React.useCallback(\n        (fieldId: string) => {\n            const result = swapInListDeep(formFields, fieldId, -1);\n            if (result.handled) {\n                commit(result.fields);\n            }\n        },\n        [commit, formFields],\n    );\n\n    const moveFieldDown = React.useCallback(\n        (fieldId: string) => {\n            const result = swapInListDeep(formFields, fieldId, 1);\n            if (result.handled) {\n                commit(result.fields);\n            }\n        },\n        [commit, formFields],\n    );\n\n    const setAllFields = React.useCallback(\n        (next: FormField[]) => {\n            idCounter.current = Math.max(idCounter.current, maxIdNumericSuffix(next) + 1);\n            commit(next);\n        },\n        [commit],\n    );\n\n    const resetForm = React.useCallback(() => {\n        commit([]);\n        setSelectedFieldId(null);\n    }, [commit]);\n\n    const selectField = React.useCallback((fieldId: string | null) => {\n        setSelectedFieldId(fieldId);\n    }, []);\n\n    return {\n        formFields,\n        selectedFieldId,\n        addField,\n        addFieldToSection,\n        insertFieldBefore,\n        insertFieldAfter,\n        moveFieldToSection,\n        removeField,\n        duplicateField,\n        updateField,\n        moveFieldUp,\n        moveFieldDown,\n        setAllFields,\n        resetForm,\n        selectField,\n    };\n};\n"]}

package/build/cjs/form-builder-v2/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./FormBuilderV2.js";
+export * from "./types.js";

package/build/cjs/form-builder-v2/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./FormBuilderV2.js"), exports);
+tslib_1.__exportStar(require("./types.js"), exports);
+//# sourceMappingURL=index.js.map

package/build/cjs/form-builder-v2/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"../../../src","sources":["form-builder-v2/index.ts"],"names":[],"mappings":";;;AAAA,6DAAgC;AAChC,qDAAwB","sourcesContent":["export * from './FormBuilderV2';\nexport * from './types';\n"]}