@parhelia/core 0.1.12325 → 0.1.12337

package/dist/editor/template-wizard/TemplateStructureInlineEditor.js

@@ -0,0 +1,1336 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { Bot, Check, ChevronDown, ChevronRight, GripVertical, Plus, Search, Settings2, Trash2, X, } from "lucide-react";
+import { AgentTerminal } from "../ai/AgentTerminal";
+import { useEditContext } from "../client/editContext";
+import TreeListSelector from "../ui/TreeListSelector";
+import { parseTemplateBuilderSuggestionText, TEMPLATE_BUILDER_AGENT_PROFILE_ID, TEMPLATE_BUILDER_AGENT_PROFILE_NAME, TEMPLATE_BUILDER_SUGGESTION_SCHEMA_DESCRIPTION, templateBuilderCreate, templateBuilderFieldTypes, templateBuilderGet, templateBuilderUpdate, } from "../services/templateBuilderService";
+import { loadAiProfiles } from "../services/aiService";
+import { normalizeGuid } from "../utils";
+const TEMPLATE_TEMPLATE_ID = "AB86861A-6030-46C5-B394-E8F99E8B87DB";
+const TEMPLATES_ROOT_ID = "{3C1715FE-6A13-4FCF-845F-DE308BA9741D}";
+const defaultFieldTypeOptions = [
+    "Single-Line Text",
+    "Multi-Line Text",
+    "Rich Text",
+    "Checkbox",
+    "Date",
+    "Datetime",
+    "Droplink",
+    "Droplist",
+    "Treelist",
+    "Image",
+    "General Link",
+];
+const normalizeName = (value) => (value || "").trim().toLowerCase();
+const createGuid = () => {
+    if (typeof crypto !== "undefined" && "randomUUID" in crypto) {
+        return crypto.randomUUID();
+    }
+    return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (character) => {
+        const random = Math.floor(Math.random() * 16);
+        const value = character === "x" ? random : (random & 0x3) | 0x8;
+        return value.toString(16);
+    });
+};
+const createLocalId = (prefix) => {
+    if (typeof crypto !== "undefined" && "randomUUID" in crypto) {
+        return `${prefix}-${crypto.randomUUID()}`;
+    }
+    return `${prefix}-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`;
+};
+const createEmptyField = () => ({
+    localId: createLocalId("field"),
+    name: "",
+    type: "Single-Line Text",
+    source: "",
+    title: "",
+    shortDescription: "",
+    defaultValue: "",
+    sortOrder: "",
+    shared: false,
+    unversioned: false,
+});
+const toWizardField = (field) => ({
+    ...createEmptyField(),
+    name: field?.name || "",
+    type: field?.type || "Single-Line Text",
+    source: field?.source || "",
+    title: field?.title || "",
+    shortDescription: field?.shortDescription || "",
+    defaultValue: field?.defaultValue || "",
+    sortOrder: field?.sortOrder || "",
+    shared: !!field?.shared,
+    unversioned: !!field?.unversioned,
+});
+const toWizardSection = (section) => ({
+    localId: createLocalId("section"),
+    name: section?.name || "",
+    fields: (section?.fields || []).map((field) => toWizardField(field)),
+});
+function toRequestSections(sections) {
+    return sections
+        .filter((section) => section.name.trim())
+        .map((section) => ({
+        name: section.name.trim(),
+        fields: section.fields
+            .filter((field) => field.name.trim())
+            .map((field, index) => ({
+            name: field.name.trim(),
+            type: field.type,
+            source: field.source?.trim() || undefined,
+            title: field.title?.trim() || undefined,
+            shortDescription: field.shortDescription?.trim() || undefined,
+            defaultValue: field.defaultValue || undefined,
+            sortOrder: String(index),
+            shared: field.shared,
+            unversioned: field.unversioned,
+        })),
+    }));
+}
+export function TemplateStructureInlineEditor({ item, parentItem, initialName, initialBaseTemplates, onCreated, onClose, }) {
+    const editContext = useEditContext();
+    const editContextRef = useRef(editContext);
+    useEffect(() => {
+        editContextRef.current = editContext;
+    }, [editContext]);
+    const isCreateMode = !item && !!parentItem;
+    const activeLanguage = item?.language || parentItem?.language || "en";
+    const [isLoading, setIsLoading] = useState(true);
+    const [isSaving, setIsSaving] = useState(false);
+    const [fieldTypeGroups, setFieldTypeGroups] = useState([{ name: "General", types: defaultFieldTypeOptions }]);
+    const [templateName, setTemplateName] = useState(initialName || "New Template");
+    const [baseTemplates, setBaseTemplates] = useState([]);
+    const [selectedTemplateNodesInTree, setSelectedTemplateNodesInTree] = useState([]);
+    const [fieldSearchQuery, setFieldSearchQuery] = useState("");
+    const [hasStandardValues, setHasStandardValues] = useState(false);
+    const [sections, setSections] = useState([]);
+    const [newSectionName, setNewSectionName] = useState("");
+    const [newFieldDrafts, setNewFieldDrafts] = useState({});
+    const [selectedSectionIndex, setSelectedSectionIndex] = useState(0);
+    const [selectedFieldKey, setSelectedFieldKey] = useState(null);
+    const [collapsedSections, setCollapsedSections] = useState({});
+    const [draggedSectionIdx, setDraggedSectionIdx] = useState(null);
+    const [dragOverSectionIdx, setDragOverSectionIdx] = useState(null);
+    const [isDragOverSectionEnd, setIsDragOverSectionEnd] = useState(false);
+    const [sectionDeleteConfirmIdx, setSectionDeleteConfirmIdx] = useState(null);
+    const [draggedFieldRef, setDraggedFieldRef] = useState(null);
+    const [dragOverFieldRef, setDragOverFieldRef] = useState(null);
+    const [dragOverFieldEndSectionIdx, setDragOverFieldEndSectionIdx] = useState(null);
+    const [focusFieldDraftSectionIndex, setFocusFieldDraftSectionIndex] = useState(null);
+    const [aiProfiles, setAiProfiles] = useState([]);
+    const [pendingSuggestions, setPendingSuggestions] = useState([]);
+    const [latestSuggestionSummary, setLatestSuggestionSummary] = useState(null);
+    const [suggestionParseError, setSuggestionParseError] = useState(null);
+    const [suggestionStatus, setSuggestionStatus] = useState(null);
+    const newFieldNameInputRefs = useRef({});
+    const processedSuggestionMessageIdsRef = useRef(new Set());
+    const flatFieldTypeOptions = fieldTypeGroups.flatMap((group) => group.types || []);
+    const createEmptyFieldWithDefaultType = () => ({
+        ...createEmptyField(),
+        type: flatFieldTypeOptions[0] || "Single-Line Text",
+    });
+    const createEmptySectionWithDefaultType = () => ({
+        localId: createLocalId("section"),
+        name: "",
+        fields: [createEmptyFieldWithDefaultType()],
+    });
+    const [templateBuilderAgent] = useState(() => ({
+        id: createGuid(),
+        name: "Template Builder",
+        userId: "",
+        updatedDate: new Date().toISOString(),
+        status: "new",
+        profileId: TEMPLATE_BUILDER_AGENT_PROFILE_ID,
+        profileName: TEMPLATE_BUILDER_AGENT_PROFILE_NAME,
+    }));
+    const getDefaultType = () => "Single-Line Text";
+    const getFieldDraft = (sectionIndex) => {
+        return (newFieldDrafts[sectionIndex] || {
+            ...createEmptyField(),
+            type: getDefaultType(),
+        });
+    };
+    const updateFieldDraft = (sectionIndex, updates) => {
+        setNewFieldDrafts((prev) => ({
+            ...prev,
+            [sectionIndex]: {
+                ...(prev[sectionIndex] || {
+                    ...createEmptyField(),
+                    type: getDefaultType(),
+                }),
+                ...updates,
+            },
+        }));
+    };
+    const resetFieldDraft = (sectionIndex) => {
+        setNewFieldDrafts((prev) => ({
+            ...prev,
+            [sectionIndex]: {
+                ...createEmptyField(),
+                type: getDefaultType(),
+            },
+        }));
+    };
+    const hasDuplicateSectionName = (name, ignoreIndex) => {
+        const normalized = name.trim().toLowerCase();
+        if (!normalized)
+            return false;
+        return sections.some((section, index) => index !== ignoreIndex && section.name.trim().toLowerCase() === normalized);
+    };
+    const hasDuplicateFieldNameInSection = (sectionIndex, name, ignoreIndex) => {
+        const normalized = name.trim().toLowerCase();
+        if (!normalized)
+            return false;
+        const section = sections[sectionIndex];
+        if (!section)
+            return false;
+        return section.fields.some((field, index) => index !== ignoreIndex && field.name.trim().toLowerCase() === normalized);
+    };
+    const appendFieldToSection = (sectionIndex) => {
+        const draft = getFieldDraft(sectionIndex);
+        if (!draft.name.trim())
+            return;
+        if (hasDuplicateFieldNameInSection(sectionIndex, draft.name)) {
+            editContext?.showErrorToast({
+                summary: "Duplicate field name",
+                details: "Field names must be unique within a section.",
+            });
+            return;
+        }
+        setSections((prev) => prev.map((section, idx) => idx !== sectionIndex
+            ? section
+            : {
+                ...section,
+                fields: [
+                    ...section.fields,
+                    { ...draft, localId: createLocalId("field"), name: draft.name.trim() },
+                ],
+            }));
+        resetFieldDraft(sectionIndex);
+    };
+    const appendSection = () => {
+        if (!newSectionName.trim())
+            return;
+        if (hasDuplicateSectionName(newSectionName)) {
+            editContext?.showErrorToast({
+                summary: "Duplicate section name",
+                details: "Section names must be unique.",
+            });
+            return;
+        }
+        const nextSectionIndex = sections.length;
+        setSections((prev) => [
+            ...prev,
+            { localId: createLocalId("section"), name: newSectionName.trim(), fields: [] },
+        ]);
+        setNewSectionName("");
+        setFocusFieldDraftSectionIndex(nextSectionIndex);
+        setSelectedSectionIndex(nextSectionIndex);
+    };
+    const updateSectionName = (sectionIndex, name) => {
+        if (name.trim() && hasDuplicateSectionName(name, sectionIndex)) {
+            return;
+        }
+        setSections((prev) => prev.map((x, i) => (i === sectionIndex ? { ...x, name } : x)));
+    };
+    const removeSection = (sectionIndex) => {
+        setSections((prev) => prev.filter((_, i) => i !== sectionIndex));
+        setSelectedSectionIndex((prev) => Math.max(0, Math.min(prev, sectionIndex - 1)));
+        setSelectedFieldKey((prev) => {
+            if (!prev)
+                return prev;
+            if (prev.si === sectionIndex)
+                return null;
+            if (prev.si > sectionIndex)
+                return { ...prev, si: prev.si - 1 };
+            return prev;
+        });
+        setNewFieldDrafts((prev) => {
+            const next = {};
+            for (const [key, value] of Object.entries(prev)) {
+                const idx = Number.parseInt(key, 10);
+                if (Number.isNaN(idx) || idx === sectionIndex)
+                    continue;
+                next[idx > sectionIndex ? idx - 1 : idx] = value;
+            }
+            return next;
+        });
+        setCollapsedSections((prev) => {
+            const next = {};
+            for (const [key, value] of Object.entries(prev)) {
+                const idx = Number.parseInt(key, 10);
+                if (Number.isNaN(idx) || idx === sectionIndex)
+                    continue;
+                next[idx > sectionIndex ? idx - 1 : idx] = value;
+            }
+            return next;
+        });
+    };
+    const updateField = (sectionIndex, fieldIndex, updates) => {
+        if (updates.name !== undefined &&
+            updates.name.trim() &&
+            hasDuplicateFieldNameInSection(sectionIndex, updates.name, fieldIndex)) {
+            return;
+        }
+        setSections((prev) => prev.map((s, si) => si !== sectionIndex
+            ? s
+            : {
+                ...s,
+                fields: s.fields.map((f, fi) => (fi === fieldIndex ? { ...f, ...updates } : f)),
+            }));
+    };
+    const removeField = (sectionIndex, fieldIndex) => {
+        setSections((prev) => prev.map((s, si) => si !== sectionIndex
+            ? s
+            : {
+                ...s,
+                fields: s.fields.filter((_, fi) => fi !== fieldIndex),
+            }));
+    };
+    const moveField = (sectionIndex, fromIdx, toIdx) => {
+        if (fromIdx === toIdx)
+            return;
+        setSections((prev) => prev.map((s, si) => {
+            if (si !== sectionIndex)
+                return s;
+            const newFields = [...s.fields];
+            const moved = newFields[fromIdx];
+            if (!moved)
+                return s;
+            newFields.splice(fromIdx, 1);
+            newFields.splice(toIdx, 0, moved);
+            return { ...s, fields: newFields };
+        }));
+        // Update selection if the moved field was selected
+        if (selectedFieldKey?.si === sectionIndex && selectedFieldKey.fi === fromIdx) {
+            setSelectedFieldKey({ si: sectionIndex, fi: toIdx });
+        }
+        else if (selectedFieldKey?.si === sectionIndex) {
+            // Adjust selection if other fields moved around it
+            let newFi = selectedFieldKey.fi;
+            if (fromIdx < newFi && toIdx >= newFi)
+                newFi--;
+            else if (fromIdx > newFi && toIdx <= newFi)
+                newFi++;
+            setSelectedFieldKey({ si: sectionIndex, fi: newFi });
+        }
+    };
+    const moveSection = (fromIdx, toIdx) => {
+        if (fromIdx === toIdx)
+            return;
+        setSections((prev) => {
+            const next = [...prev];
+            const moved = next[fromIdx];
+            if (!moved)
+                return prev;
+            next.splice(fromIdx, 1);
+            next.splice(toIdx, 0, moved);
+            return next;
+        });
+        setSelectedSectionIndex((prev) => {
+            if (prev === fromIdx)
+                return toIdx;
+            if (fromIdx < prev && toIdx >= prev)
+                return prev - 1;
+            if (fromIdx > prev && toIdx <= prev)
+                return prev + 1;
+            return prev;
+        });
+        setSelectedFieldKey((prev) => {
+            if (!prev)
+                return prev;
+            if (prev.si === fromIdx)
+                return { ...prev, si: toIdx };
+            if (fromIdx < prev.si && toIdx >= prev.si)
+                return { ...prev, si: prev.si - 1 };
+            if (fromIdx > prev.si && toIdx <= prev.si)
+                return { ...prev, si: prev.si + 1 };
+            return prev;
+        });
+        setNewFieldDrafts((prev) => {
+            const next = {};
+            for (const [key, value] of Object.entries(prev)) {
+                const idx = Number.parseInt(key, 10);
+                if (Number.isNaN(idx))
+                    continue;
+                let newIdx = idx;
+                if (idx === fromIdx)
+                    newIdx = toIdx;
+                else if (fromIdx < idx && idx <= toIdx)
+                    newIdx = idx - 1;
+                else if (toIdx <= idx && idx < fromIdx)
+                    newIdx = idx + 1;
+                next[newIdx] = value;
+            }
+            return next;
+        });
+        setCollapsedSections((prev) => {
+            const next = {};
+            for (const [key, value] of Object.entries(prev)) {
+                const idx = Number.parseInt(key, 10);
+                if (Number.isNaN(idx))
+                    continue;
+                let newIdx = idx;
+                if (idx === fromIdx)
+                    newIdx = toIdx;
+                else if (fromIdx < idx && idx <= toIdx)
+                    newIdx = idx - 1;
+                else if (toIdx <= idx && idx < fromIdx)
+                    newIdx = idx + 1;
+                next[newIdx] = value;
+            }
+            return next;
+        });
+    };
+    const toggleSectionCollapsed = (sectionIndex) => {
+        setCollapsedSections((prev) => ({
+            ...prev,
+            [sectionIndex]: !prev[sectionIndex],
+        }));
+    };
+    const moveFieldToSection = (fromSi, fromFi, toSi, toFi) => {
+        if (fromSi === toSi) {
+            moveField(fromSi, fromFi, toFi);
+            return;
+        }
+        const movedField = sections[fromSi]?.fields[fromFi];
+        if (!movedField)
+            return;
+        if (movedField.name.trim() && hasDuplicateFieldNameInSection(toSi, movedField.name)) {
+            editContext?.showErrorToast({
+                summary: "Duplicate field name",
+                details: "Field names must be unique within a section.",
+            });
+            return;
+        }
+        const targetLength = sections[toSi]?.fields.length ?? 0;
+        const insertAt = Math.max(0, Math.min(toFi, targetLength));
+        setSections((prev) => {
+            const next = prev.map((s) => ({ ...s, fields: [...s.fields] }));
+            const source = next[fromSi];
+            const target = next[toSi];
+            if (!source || !target)
+                return prev;
+            const moved = source.fields[fromFi];
+            if (!moved)
+                return prev;
+            source.fields.splice(fromFi, 1);
+            target.fields.splice(insertAt, 0, moved);
+            return next;
+        });
+        setSelectedFieldKey((prev) => {
+            if (!prev)
+                return prev;
+            if (prev.si === fromSi && prev.fi === fromFi) {
+                return { si: toSi, fi: insertAt };
+            }
+            if (prev.si === fromSi && prev.fi > fromFi) {
+                return { ...prev, fi: prev.fi - 1 };
+            }
+            if (prev.si === toSi && prev.fi >= insertAt) {
+                return { ...prev, fi: prev.fi + 1 };
+            }
+            return prev;
+        });
+    };
+    const normalizedFieldSearchQuery = fieldSearchQuery.trim().toLowerCase();
+    const isSearching = normalizedFieldSearchQuery.length > 0;
+    const fieldMatchesSearch = (field) => {
+        if (!normalizedFieldSearchQuery)
+            return true;
+        return [
+            field.name,
+            field.title,
+            field.shortDescription,
+            field.type,
+            field.source,
+        ]
+            .join(" ")
+            .toLowerCase()
+            .includes(normalizedFieldSearchQuery);
+    };
+    const sectionMatchesSearch = (sectionName) => {
+        if (!normalizedFieldSearchQuery)
+            return true;
+        return sectionName.toLowerCase().includes(normalizedFieldSearchQuery);
+    };
+    useEffect(() => {
+        if (!isSearching)
+            return;
+        setDraggedSectionIdx(null);
+        setDragOverSectionIdx(null);
+        setIsDragOverSectionEnd(false);
+        setDraggedFieldRef(null);
+        setDragOverFieldRef(null);
+        setDragOverFieldEndSectionIdx(null);
+    }, [isSearching]);
+    useEffect(() => {
+        if (focusFieldDraftSectionIndex == null)
+            return;
+        const fieldNameInput = newFieldNameInputRefs.current[focusFieldDraftSectionIndex];
+        if (!fieldNameInput)
+            return;
+        fieldNameInput.focus();
+        fieldNameInput.select();
+        setFocusFieldDraftSectionIndex(null);
+    }, [sections, focusFieldDraftSectionIndex]);
+    useEffect(() => {
+        if (sections.length === 0) {
+            setSelectedSectionIndex(0);
+            return;
+        }
+        if (selectedSectionIndex > sections.length - 1) {
+            setSelectedSectionIndex(sections.length - 1);
+        }
+    }, [sections, selectedSectionIndex]);
+    useEffect(() => {
+        const load = async () => {
+            setIsLoading(true);
+            setPendingSuggestions([]);
+            setLatestSuggestionSummary(null);
+            setSuggestionParseError(null);
+            setSuggestionStatus(null);
+            processedSuggestionMessageIdsRef.current = new Set();
+            try {
+                const liveFieldTypeGroups = await templateBuilderFieldTypes();
+                if (liveFieldTypeGroups.length > 0) {
+                    setFieldTypeGroups(liveFieldTypeGroups);
+                }
+                if (isCreateMode) {
+                    setTemplateName(initialName || "New Template");
+                    setBaseTemplates(initialBaseTemplates || []);
+                    setSelectedTemplateNodesInTree([]);
+                    setHasStandardValues(false);
+                    setSections([createEmptySectionWithDefaultType()]);
+                    return;
+                }
+                if (!item) {
+                    setSections([createEmptySectionWithDefaultType()]);
+                    return;
+                }
+                const result = await templateBuilderGet({ template: item.descriptor });
+                if (result.type !== "success" || !result.data) {
+                    editContextRef.current?.showErrorToast({
+                        summary: result.summary || "Failed to load template structure.",
+                        details: result.details,
+                    });
+                    setSections([createEmptySectionWithDefaultType()]);
+                    return;
+                }
+                const loadedBaseTemplateIds = result.data.baseTemplateIds || [];
+                if (loadedBaseTemplateIds.length > 0) {
+                    const loadedItems = await editContextRef.current.itemsRepository.getItems(loadedBaseTemplateIds.map((id) => ({
+                        id,
+                        language: item.language,
+                        version: 0,
+                    })));
+                    setBaseTemplates(loadedItems.map((x) => ({
+                        id: x.id,
+                        name: x.name,
+                        path: x.path,
+                        icon: x.icon,
+                        idPath: x.idPath,
+                    })));
+                }
+                else {
+                    setBaseTemplates([]);
+                }
+                setHasStandardValues(!!result.data.hasStandardValues);
+                const parseSortOrder = (value) => {
+                    const parsed = Number.parseInt(value || "", 10);
+                    return Number.isFinite(parsed) ? parsed : Number.MAX_SAFE_INTEGER;
+                };
+                const loadedSections = result.data.sections?.map((section) => ({
+                    localId: createLocalId("section"),
+                    name: section.name || "",
+                    fields: [...(section.fields || [])]
+                        .sort((a, b) => parseSortOrder(a.sortOrder) - parseSortOrder(b.sortOrder))
+                        .map((field) => ({
+                        localId: createLocalId("field"),
+                        name: field.name || "",
+                        type: field.type ||
+                            (liveFieldTypeGroups.flatMap((x) => x.types || [])[0] ||
+                                defaultFieldTypeOptions[0] ||
+                                "Single-Line Text"),
+                        source: field.source || "",
+                        title: field.title || "",
+                        shortDescription: field.shortDescription || "",
+                        defaultValue: field.defaultValue || "",
+                        sortOrder: field.sortOrder || "",
+                        shared: !!field.shared,
+                        unversioned: !!field.unversioned,
+                    })) || [createEmptyFieldWithDefaultType()],
+                })) || [];
+                setSections(loadedSections.length > 0
+                    ? loadedSections
+                    : [createEmptySectionWithDefaultType()]);
+            }
+            finally {
+                setIsLoading(false);
+            }
+        };
+        load();
+    }, [
+        initialBaseTemplates,
+        initialName,
+        isCreateMode,
+        item,
+    ]);
+    const save = async () => {
+        if (isCreateMode && !templateName.trim()) {
+            editContext?.showErrorToast({
+                summary: "Template name is required",
+            });
+            return;
+        }
+        const normalizedSectionNames = new Set();
+        for (const section of sections) {
+            const sectionName = section.name.trim().toLowerCase();
+            if (!sectionName)
+                continue;
+            if (normalizedSectionNames.has(sectionName)) {
+                editContext?.showErrorToast({
+                    summary: "Duplicate section names",
+                    details: "Section names must be unique before saving.",
+                });
+                return;
+            }
+            normalizedSectionNames.add(sectionName);
+        }
+        for (const section of sections) {
+            const normalizedFieldNames = new Set();
+            for (const field of section.fields) {
+                const fieldName = field.name.trim().toLowerCase();
+                if (!fieldName)
+                    continue;
+                if (normalizedFieldNames.has(fieldName)) {
+                    editContext?.showErrorToast({
+                        summary: "Duplicate field names",
+                        details: `Field names in section "${section.name || "Unnamed"}" must be unique before saving.`,
+                    });
+                    return;
+                }
+                normalizedFieldNames.add(fieldName);
+            }
+        }
+        setIsSaving(true);
+        try {
+            const baseTemplateIds = baseTemplates.map((x) => x.id);
+            if (isCreateMode) {
+                if (!parentItem) {
+                    editContext?.showErrorToast({
+                        summary: "Parent item is required",
+                    });
+                    return;
+                }
+                const result = await templateBuilderCreate({
+                    parent: parentItem.descriptor,
+                    name: templateName.trim(),
+                    baseTemplateIds,
+                    sections: toRequestSections(sections),
+                    createStandardValues: hasStandardValues,
+                    openStandardValues: false,
+                });
+                if (result.type !== "success") {
+                    editContext?.showErrorToast({
+                        summary: result.summary || "Failed to create template.",
+                        details: result.details,
+                    });
+                    return;
+                }
+                if (!result.data?.template) {
+                    editContext?.showErrorToast({
+                        summary: "Failed to create template.",
+                    });
+                    return;
+                }
+                if (result.data.warnings?.length) {
+                    editContext?.showInfoToast({
+                        summary: "Template created with warnings",
+                        details: result.data.warnings.join(" | "),
+                    });
+                }
+                else {
+                    editContext?.showInfoToast({ summary: "Template created" });
+                }
+                await editContext?.itemsRepository.refreshItems([parentItem.descriptor], {
+                    properties: true,
+                    children: true,
+                });
+                editContext?.requestRefresh("immediate");
+                await editContext?.loadItem(result.data.template);
+                onCreated?.(result.data.template);
+                if (!onCreated)
+                    onClose?.();
+                return;
+            }
+            if (!item) {
+                editContext?.showErrorToast({
+                    summary: "Template item is required",
+                });
+                return;
+            }
+            const result = await templateBuilderUpdate({
+                template: item.descriptor,
+                baseTemplateIds,
+                sections: toRequestSections(sections),
+                createStandardValues: hasStandardValues,
+            });
+            if (result.type !== "success") {
+                editContext?.showErrorToast({
+                    summary: result.summary || "Failed to save template structure.",
+                    details: result.details,
+                });
+                return;
+            }
+            if (result.data?.warnings?.length) {
+                editContext?.showInfoToast({
+                    summary: "Template updated with warnings",
+                    details: result.data.warnings.join(" | "),
+                });
+            }
+            else {
+                editContext?.showInfoToast({ summary: "Template structure saved" });
+            }
+            await editContext?.itemsRepository.refreshItems([item.descriptor], {
+                properties: true,
+                children: true,
+            });
+            editContext?.requestRefresh("immediate");
+            onClose?.();
+        }
+        finally {
+            setIsSaving(false);
+        }
+    };
+    const addBaseTemplates = (templatesToAdd) => {
+        if (templatesToAdd.length === 0)
+            return;
+        const merged = [...baseTemplates];
+        const existing = new Set(baseTemplates.map((x) => normalizeGuid(x.id)));
+        let blockedSelfInheritance = false;
+        for (const template of templatesToAdd) {
+            const key = normalizeGuid(template.id);
+            if (currentTemplateId && key === currentTemplateId) {
+                blockedSelfInheritance = true;
+                continue;
+            }
+            if (!existing.has(key)) {
+                existing.add(key);
+                merged.push(template);
+            }
+        }
+        setBaseTemplates(merged);
+        setSelectedTemplateNodesInTree([]);
+        if (blockedSelfInheritance) {
+            editContext?.showErrorToast({
+                summary: "A template cannot inherit from itself",
+            });
+        }
+    };
+    const removeBaseTemplates = (templatesToRemove) => {
+        if (templatesToRemove.length === 0)
+            return;
+        const idsToRemove = new Set(templatesToRemove.map((x) => normalizeGuid(x.id)));
+        setBaseTemplates((prev) => prev.filter((x) => !idsToRemove.has(normalizeGuid(x.id))));
+    };
+    useEffect(() => {
+        let cancelled = false;
+        loadAiProfiles()
+            .then((loadedProfiles) => {
+            if (cancelled)
+                return;
+            setAiProfiles(loadedProfiles);
+        })
+            .catch(() => {
+            if (!cancelled) {
+                setAiProfiles([]);
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, []);
+    const currentTemplateBuilderState = useMemo(() => ({
+        mode: isCreateMode ? "create" : "edit",
+        templateName: templateName.trim() || "New Template",
+        template: item?.descriptor,
+        parent: parentItem?.descriptor,
+        baseTemplates: baseTemplates.map((template) => ({
+            id: template.id,
+            name: template.name,
+            path: template.path,
+            icon: template.icon,
+        })),
+        sections: sections.map((sectionItem) => ({
+            name: sectionItem.name,
+            fields: sectionItem.fields.map((field) => ({
+                name: field.name,
+                type: field.type,
+                source: field.source || undefined,
+                title: field.title || undefined,
+                shortDescription: field.shortDescription || undefined,
+                defaultValue: field.defaultValue || undefined,
+                sortOrder: field.sortOrder || undefined,
+                shared: field.shared,
+                unversioned: field.unversioned,
+            })),
+        })),
+    }), [baseTemplates, isCreateMode, item, parentItem, sections, templateName]);
+    const currentTemplateId = useMemo(() => (item?.id ? normalizeGuid(item.id) : ""), [item?.id]);
+    const templateBuilderAgentMetadata = useMemo(() => ({
+        mode: "read-only",
+        profile: TEMPLATE_BUILDER_AGENT_PROFILE_NAME,
+        additionalData: {
+            profileId: TEMPLATE_BUILDER_AGENT_PROFILE_ID,
+            profileName: TEMPLATE_BUILDER_AGENT_PROFILE_NAME,
+            outputSchema: TEMPLATE_BUILDER_SUGGESTION_SCHEMA_DESCRIPTION,
+            templateBuilderState: currentTemplateBuilderState,
+        },
+    }), [currentTemplateBuilderState]);
+    const effectiveAiProfiles = useMemo(() => {
+        if (aiProfiles.some((profile) => normalizeGuid(profile.id) === normalizeGuid(TEMPLATE_BUILDER_AGENT_PROFILE_ID))) {
+            return aiProfiles;
+        }
+        return [
+            {
+                id: TEMPLATE_BUILDER_AGENT_PROFILE_ID,
+                name: TEMPLATE_BUILDER_AGENT_PROFILE_NAME,
+                defaultModelId: "",
+                models: [],
+                prompts: [],
+                hiddenFromOverview: true,
+            },
+            ...aiProfiles,
+        ];
+    }, [aiProfiles]);
+    const hydrateFieldFromPatch = useCallback((patch, fallback) => ({
+        localId: createLocalId("field"),
+        name: patch.name ?? fallback?.name ?? "",
+        type: patch.type ??
+            fallback?.type ??
+            flatFieldTypeOptions[0] ??
+            defaultFieldTypeOptions[0] ??
+            "Single-Line Text",
+        source: patch.source ?? fallback?.source ?? "",
+        title: patch.title ?? fallback?.title ?? "",
+        shortDescription: patch.shortDescription ?? fallback?.shortDescription ?? "",
+        defaultValue: patch.defaultValue ?? fallback?.defaultValue ?? "",
+        sortOrder: patch.sortOrder ?? fallback?.sortOrder ?? "",
+        shared: patch.shared ?? fallback?.shared ?? false,
+        unversioned: patch.unversioned ?? fallback?.unversioned ?? false,
+    }), [flatFieldTypeOptions]);
+    const convertSuggestionToPendingChanges = useCallback((suggestion) => {
+        const nextChanges = [];
+        for (const baseTemplateChange of suggestion.baseTemplates || []) {
+            nextChanges.push({
+                id: createLocalId("base-template-suggestion"),
+                kind: "baseTemplate",
+                action: baseTemplateChange.action,
+                templateId: baseTemplateChange.templateId,
+                templateName: baseTemplateChange.templateName,
+                templatePath: baseTemplateChange.templatePath,
+                reason: baseTemplateChange.reason,
+            });
+        }
+        for (const sectionChange of suggestion.sections || []) {
+            if (sectionChange.action === "add") {
+                nextChanges.push({
+                    id: createLocalId("section-suggestion"),
+                    kind: "section",
+                    action: "add",
+                    section: {
+                        ...toWizardSection(sectionChange.section),
+                        fields: (sectionChange.section.fields || []).map((field) => hydrateFieldFromPatch(field)),
+                    },
+                    reason: sectionChange.reason,
+                });
+                continue;
+            }
+            const matchedSection = sections.find((sectionItem) => normalizeName(sectionItem.name) ===
+                normalizeName(sectionChange.targetSectionName));
+            if (!matchedSection)
+                continue;
+            if (sectionChange.action === "update") {
+                nextChanges.push({
+                    id: createLocalId("section-suggestion"),
+                    kind: "section",
+                    action: "update",
+                    section: {
+                        ...matchedSection,
+                        name: sectionChange.section.name ?? matchedSection.name,
+                        fields: matchedSection.fields,
+                    },
+                    targetSectionLocalId: matchedSection.localId,
+                    targetSectionName: matchedSection.name,
+                    reason: sectionChange.reason,
+                });
+                continue;
+            }
+            nextChanges.push({
+                id: createLocalId("section-suggestion"),
+                kind: "section",
+                action: "remove",
+                section: matchedSection,
+                targetSectionLocalId: matchedSection.localId,
+                targetSectionName: matchedSection.name,
+                reason: sectionChange.reason,
+            });
+        }
+        for (const fieldChange of suggestion.fields || []) {
+            const matchedSection = sections.find((sectionItem) => normalizeName(sectionItem.name) === normalizeName(fieldChange.targetSectionName));
+            if (!matchedSection)
+                continue;
+            if (fieldChange.action === "add") {
+                nextChanges.push({
+                    id: createLocalId("field-suggestion"),
+                    kind: "field",
+                    action: "add",
+                    sectionLocalId: matchedSection.localId,
+                    targetSectionName: matchedSection.name,
+                    field: hydrateFieldFromPatch(fieldChange.field),
+                    reason: fieldChange.reason,
+                });
+                continue;
+            }
+            const matchedField = matchedSection.fields.find((fieldItem) => normalizeName(fieldItem.name) === normalizeName(fieldChange.targetFieldName));
+            if (!matchedField)
+                continue;
+            if (fieldChange.action === "update") {
+                nextChanges.push({
+                    id: createLocalId("field-suggestion"),
+                    kind: "field",
+                    action: "update",
+                    sectionLocalId: matchedSection.localId,
+                    targetSectionName: matchedSection.name,
+                    field: hydrateFieldFromPatch(fieldChange.field, matchedField),
+                    targetFieldLocalId: matchedField.localId,
+                    targetFieldName: matchedField.name,
+                    reason: fieldChange.reason,
+                });
+                continue;
+            }
+            nextChanges.push({
+                id: createLocalId("field-suggestion"),
+                kind: "field",
+                action: "remove",
+                sectionLocalId: matchedSection.localId,
+                targetSectionName: matchedSection.name,
+                field: matchedField,
+                targetFieldLocalId: matchedField.localId,
+                targetFieldName: matchedField.name,
+                reason: fieldChange.reason,
+            });
+        }
+        return nextChanges;
+    }, [hydrateFieldFromPatch, sections]);
+    const handleAgentMessage = useCallback((message) => {
+        if (!message.id ||
+            !message.isCompleted ||
+            message.role === "user" ||
+            message.messageType === "user" ||
+            processedSuggestionMessageIdsRef.current.has(message.id)) {
+            return;
+        }
+        processedSuggestionMessageIdsRef.current.add(message.id);
+        const content = message.content?.trim();
+        if (!content)
+            return;
+        try {
+            const suggestion = parseTemplateBuilderSuggestionText(content);
+            if (!suggestion)
+                return;
+            const changes = convertSuggestionToPendingChanges(suggestion);
+            if (changes.length === 0)
+                return;
+            setPendingSuggestions((prev) => [...prev, ...changes]);
+            setLatestSuggestionSummary(suggestion.summary || null);
+            setSuggestionStatus(`${changes.length} AI suggestion${changes.length === 1 ? "" : "s"} ready for review.`);
+            setSuggestionParseError(null);
+        }
+        catch (error) {
+            setSuggestionParseError(error instanceof Error
+                ? error.message
+                : "Failed to parse template builder suggestion.");
+        }
+    }, [convertSuggestionToPendingChanges]);
+    const clearSuggestion = useCallback((suggestionId) => {
+        setPendingSuggestions((prev) => prev.filter((entry) => entry.id !== suggestionId));
+    }, []);
+    const approveSuggestion = useCallback(async (suggestionId) => {
+        const change = pendingSuggestions.find((entry) => entry.id === suggestionId);
+        if (!change)
+            return;
+        if (change.kind === "baseTemplate") {
+            if (change.action === "remove") {
+                const matches = baseTemplates.filter((template) => (!!change.templateId &&
+                    normalizeGuid(template.id) === normalizeGuid(change.templateId)) ||
+                    normalizeName(template.name) === normalizeName(change.templateName) ||
+                    (!!change.templatePath &&
+                        normalizeName(template.path) === normalizeName(change.templatePath)));
+                removeBaseTemplates(matches);
+                clearSuggestion(suggestionId);
+                return;
+            }
+            let resolvedTemplate = selectedTemplateNodesInTree.find((template) => (!!change.templateId &&
+                normalizeGuid(template.id) === normalizeGuid(change.templateId)) ||
+                normalizeName(template.name) === normalizeName(change.templateName) ||
+                (!!change.templatePath &&
+                    normalizeName(template.path) === normalizeName(change.templatePath))) || null;
+            if (!resolvedTemplate && change.templateId) {
+                const loadedItem = await editContext?.itemsRepository.getItem({
+                    id: change.templateId,
+                    language: activeLanguage,
+                    version: 0,
+                });
+                if (loadedItem) {
+                    resolvedTemplate = {
+                        id: loadedItem.id,
+                        name: loadedItem.name,
+                        path: loadedItem.path,
+                        icon: loadedItem.icon,
+                        idPath: loadedItem.idPath,
+                    };
+                }
+            }
+            if (!resolvedTemplate) {
+                editContext?.showErrorToast({
+                    summary: "Unable to resolve suggested base template",
+                    details: "Ask the AI to include a concrete template id or select the template in the tree before approving.",
+                });
+                return;
+            }
+            addBaseTemplates([resolvedTemplate]);
+            clearSuggestion(suggestionId);
+            return;
+        }
+        if (change.kind === "section") {
+            if (change.action === "add") {
+                setSections((prev) => [...prev, toWizardSection(change.section)]);
+                clearSuggestion(suggestionId);
+                return;
+            }
+            const sectionIndex = sections.findIndex((sectionItem) => sectionItem.localId === change.targetSectionLocalId);
+            if (sectionIndex === -1) {
+                clearSuggestion(suggestionId);
+                return;
+            }
+            if (change.action === "remove") {
+                removeSection(sectionIndex);
+                clearSuggestion(suggestionId);
+                return;
+            }
+            updateSectionName(sectionIndex, change.section.name);
+            clearSuggestion(suggestionId);
+            return;
+        }
+        const sectionIndex = sections.findIndex((sectionItem) => sectionItem.localId === change.sectionLocalId);
+        if (sectionIndex === -1) {
+            clearSuggestion(suggestionId);
+            return;
+        }
+        if (change.action === "add") {
+            setSections((prev) => prev.map((sectionItem, idx) => idx !== sectionIndex
+                ? sectionItem
+                : {
+                    ...sectionItem,
+                    fields: [...sectionItem.fields, hydrateFieldFromPatch(change.field)],
+                }));
+            clearSuggestion(suggestionId);
+            return;
+        }
+        const fieldIndex = sections[sectionIndex]?.fields.findIndex((fieldItem) => fieldItem.localId === change.targetFieldLocalId);
+        if (fieldIndex === undefined || fieldIndex < 0) {
+            clearSuggestion(suggestionId);
+            return;
+        }
+        if (change.action === "remove") {
+            removeField(sectionIndex, fieldIndex);
+            clearSuggestion(suggestionId);
+            return;
+        }
+        updateField(sectionIndex, fieldIndex, {
+            name: change.field.name,
+            type: change.field.type,
+            source: change.field.source,
+            title: change.field.title,
+            shortDescription: change.field.shortDescription,
+            defaultValue: change.field.defaultValue,
+            sortOrder: change.field.sortOrder,
+            shared: change.field.shared,
+            unversioned: change.field.unversioned,
+        });
+        clearSuggestion(suggestionId);
+    }, [
+        activeLanguage,
+        addBaseTemplates,
+        baseTemplates,
+        clearSuggestion,
+        editContext,
+        hydrateFieldFromPatch,
+        removeBaseTemplates,
+        removeField,
+        removeSection,
+        pendingSuggestions,
+        sections,
+        selectedTemplateNodesInTree,
+        updateField,
+        updateSectionName,
+    ]);
+    const pendingSectionAdditions = pendingSuggestions.filter((entry) => entry.kind === "section" && entry.action === "add");
+    const pendingBaseTemplateAdditions = pendingSuggestions.filter((entry) => entry.kind === "baseTemplate" && entry.action === "add");
+    const getBaseTemplateSuggestions = useCallback((template) => pendingSuggestions.filter((entry) => entry.kind === "baseTemplate" &&
+        ((!!entry.templateId &&
+            normalizeGuid(entry.templateId) === normalizeGuid(template.id)) ||
+            normalizeName(entry.templateName) === normalizeName(template.name) ||
+            (!!entry.templatePath &&
+                normalizeName(entry.templatePath) === normalizeName(template.path)))), [pendingSuggestions]);
+    const getSectionSuggestions = useCallback((sectionLocalId) => pendingSuggestions.filter((entry) => entry.kind === "section" &&
+        entry.action !== "add" &&
+        entry.targetSectionLocalId === sectionLocalId), [pendingSuggestions]);
+    const getFieldSuggestions = useCallback((fieldLocalId) => pendingSuggestions.filter((entry) => entry.kind === "field" &&
+        entry.action !== "add" &&
+        entry.targetFieldLocalId === fieldLocalId), [pendingSuggestions]);
+    const getFieldAdditionsForSection = useCallback((sectionLocalId) => pendingSuggestions.filter((entry) => entry.kind === "field" &&
+        entry.action === "add" &&
+        entry.sectionLocalId === sectionLocalId), [pendingSuggestions]);
+    if (isLoading) {
+        return _jsx("div", { className: "p-4 text-sm text-gray-500", children: "Loading template structure..." });
+    }
+    /* ────────────────────────────────────────────────────────────
+     *  Shared sub-renderers
+     * ──────────────────────────────────────────────────────────── */
+    const cls = {
+        input: "w-full rounded-md border border-gray-200 bg-white px-3 py-2 text-sm outline-none transition focus:border-blue-400 focus:ring-2 focus:ring-blue-100",
+        select: "w-full rounded-md border border-gray-200 bg-white px-3 py-2 text-sm outline-none transition focus:border-blue-400 focus:ring-2 focus:ring-blue-100",
+    };
+    const renderToggle = (checked, onClick) => (_jsx("button", { type: "button", role: "switch", "aria-checked": checked, className: `relative inline-flex h-5 w-9 shrink-0 items-center rounded-full transition ${checked ? "bg-blue-600" : "bg-gray-300"}`, onClick: onClick, children: _jsx("span", { className: `inline-block h-4 w-4 transform rounded-full bg-white transition ${checked ? "translate-x-4" : "translate-x-0.5"}` }) }));
+    const renderTypeSelect = (value, onChange) => (_jsx("select", { className: cls.select, value: value, onChange: (e) => onChange(e.target.value), children: fieldTypeGroups.map((group) => (_jsx("optgroup", { label: group.name, children: (group.types || []).map((t) => (_jsx("option", { value: t, children: t }, `${group.name}-${t}`))) }, group.name))) }));
+    const renderSuggestionActions = (change) => (_jsxs("div", { className: "flex items-center gap-1", children: [_jsx("button", { type: "button", className: "rounded border border-violet-200 bg-white px-2 py-0.5 text-[10px] font-semibold text-violet-700 transition hover:bg-violet-50", onClick: (event) => {
+                    event.stopPropagation();
+                    void approveSuggestion(change.id);
+                }, children: "Approve" }), _jsx("button", { type: "button", className: "rounded border border-gray-200 bg-white px-2 py-0.5 text-[10px] font-semibold text-gray-600 transition hover:bg-gray-50", onClick: (event) => {
+                    event.stopPropagation();
+                    clearSuggestion(change.id);
+                }, children: "Reject" })] }));
+    const renderFooter = () => (_jsxs("div", { className: "mt-auto flex items-center justify-between border-t border-gray-200 px-4 pt-4 pb-1", children: [_jsxs("label", { className: "inline-flex items-center gap-2 text-[11px] text-gray-500 font-medium", children: ["Standard Values", renderToggle(hasStandardValues, () => setHasStandardValues((v) => !v))] }), _jsxs("div", { className: "flex items-center gap-2", children: [onClose && (_jsxs("button", { className: "inline-flex items-center gap-2 rounded border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 transition hover:bg-gray-50", onClick: onClose, disabled: isSaving, children: [_jsx(X, { className: "h-4 w-4" }), "Cancel"] })), _jsxs("button", { className: "inline-flex items-center gap-2 rounded bg-blue-600 px-6 py-2.5 text-sm font-semibold text-white shadow-md transition-all hover:bg-blue-700 hover:shadow-lg active:scale-95 disabled:opacity-50", onClick: save, disabled: isSaving, children: [_jsx(Check, { className: "h-4 w-4" }), isSaving ? "Confirming..." : "Confirm"] })] })] }));
+    /* ────────────────────────────────────────────────────────────
+     *  Studio Layout
+     *  Three-column: left = inheritance tree, center = field list,
+     *  right = property inspector for selected field
+     * ──────────────────────────────────────────────────────────── */
+    const selectedFieldRef = (() => {
+        if (!selectedFieldKey)
+            return null;
+        const section = sections[selectedFieldKey.si];
+        if (!section)
+            return null;
+        const field = section.fields[selectedFieldKey.fi];
+        if (!field)
+            return null;
+        return {
+            si: selectedFieldKey.si,
+            fi: selectedFieldKey.fi,
+            field,
+            section,
+        };
+    })();
+    const field = selectedFieldRef?.field;
+    const section = selectedFieldRef?.section;
+    const si = selectedFieldRef?.si;
+    const fi = selectedFieldRef?.fi;
+    return (_jsxs("div", { className: "flex h-full min-h-0 flex-col gap-0 overflow-hidden rounded-lg border border-gray-200 bg-white text-gray-900", children: [isCreateMode && (_jsx("div", { className: "border-b border-gray-100 bg-gray-50/40 px-4 py-3", children: _jsxs("div", { className: "max-w-md", children: [_jsx("div", { className: "mb-1 text-[10px] font-bold uppercase tracking-wider text-gray-400", children: "Template name" }), _jsx("input", { className: cls.input, value: templateName, onChange: (e) => setTemplateName(e.target.value), placeholder: "New Template" })] }) })), _jsxs("div", { className: "grid min-h-0 flex-1 grid-cols-1 gap-0 lg:grid-cols-[240px_1fr_280px_420px]", children: [_jsx("div", { className: "flex flex-col gap-0 overflow-y-auto border-r border-gray-100 bg-gray-50/30", children: _jsxs("div", { className: "flex-1 overflow-y-auto p-3", children: [_jsx("div", { className: "mb-1.5 text-[10px] font-bold uppercase tracking-widest text-gray-400", children: "Template tree" }), _jsx("div", { className: "h-[240px] rounded border border-gray-200 bg-white shadow-inner", children: _jsx(TreeListSelector, { language: activeLanguage, rootItemIds: [TEMPLATES_ROOT_ID], selectedItemIds: selectedTemplateNodesInTree.map((x) => x.id), onSelectionChange: (nodes) => {
+                                            const selected = nodes
+                                                .filter((n) => normalizeGuid(n.templateId) === normalizeGuid(TEMPLATE_TEMPLATE_ID))
+                                                .map((n) => ({ id: n.id, name: n.name, path: n.path, icon: n.icon, idPath: n.idPath }));
+                                            setSelectedTemplateNodesInTree(selected);
+                                        }, onDoubleClick: (node) => {
+                                            if (normalizeGuid(node.templateId) === normalizeGuid(TEMPLATE_TEMPLATE_ID)) {
+                                                addBaseTemplates([{ id: node.id, name: node.name, path: node.path, icon: node.icon, idPath: node.idPath }]);
+                                            }
+                                        }, onItemSelected: async (node) => {
+                                            const sel = await editContext.itemsRepository.getItem({ id: node.id, language: activeLanguage, version: 0 });
+                                            if (sel && normalizeGuid(sel.templateId) === normalizeGuid(TEMPLATE_TEMPLATE_ID)) {
+                                                addBaseTemplates([{ id: sel.id, name: sel.name, path: sel.path, icon: sel.icon, idPath: sel.idPath }]);
+                                            }
+                                        } }) }), _jsxs("div", { className: "mt-3", children: [_jsx("div", { className: "mb-1.5 text-[10px] font-bold uppercase tracking-widest text-gray-400", children: "Inherited templates" }), baseTemplates.length === 0 ? (_jsx("div", { className: "text-[10px] text-gray-400 italic", children: "None" })) : (_jsxs("div", { className: "space-y-1", children: [baseTemplates.map((t) => {
+                                                    const templateSuggestions = getBaseTemplateSuggestions(t);
+                                                    const hasRemoveSuggestion = templateSuggestions.some((entry) => entry.action === "remove");
+                                                    return (_jsxs("div", { className: `space-y-1 rounded border px-2 py-1 text-[11px] ${hasRemoveSuggestion
+                                                            ? "border-violet-200 bg-violet-50/80 text-violet-900"
+                                                            : "border-gray-200 bg-white text-gray-700"}`, children: [_jsxs("div", { className: "group flex items-center gap-1", children: [t.icon && _jsx("img", { src: t.icon, className: "h-3 w-3 shrink-0" }), _jsx("span", { className: `flex-1 truncate ${hasRemoveSuggestion ? "line-through" : ""}`, children: t.name }), _jsx("button", { className: "text-gray-400 transition hover:text-red-500", onClick: () => removeBaseTemplates([t]), children: _jsx(X, { className: "h-2.5 w-2.5" }) })] }), templateSuggestions.map((entry) => (_jsxs("div", { className: "flex items-center justify-between gap-2 rounded border border-violet-200 bg-white/80 px-2 py-1 text-[10px] text-violet-700", children: [_jsxs("span", { className: "min-w-0 flex-1 truncate", children: ["AI suggests ", entry.action === "remove" ? "removing" : "adding", " this base template", entry.reason ? ` · ${entry.reason}` : ""] }), renderSuggestionActions(entry)] }, entry.id)))] }, t.id));
+                                                }), pendingBaseTemplateAdditions.map((entry) => (_jsx("div", { className: "rounded border border-dashed border-violet-300 bg-violet-50 px-2 py-1 text-[11px] text-violet-800", children: _jsxs("div", { className: "flex items-center justify-between gap-2", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "truncate font-semibold", children: entry.templateName }), _jsxs("div", { className: "truncate text-[10px] text-violet-600", children: ["AI suggestion", entry.reason ? ` · ${entry.reason}` : ""] })] }), renderSuggestionActions(entry)] }) }, entry.id)))] }))] })] }) }), _jsxs("div", { className: "flex flex-col overflow-y-auto bg-white", children: [_jsx("div", { className: "border-b border-gray-100 bg-gray-50/30 px-3 py-2", children: _jsxs("div", { className: "flex items-center gap-2 rounded border border-gray-200 bg-white px-2 py-1.5", children: [_jsx(Search, { className: "h-3.5 w-3.5 text-gray-400" }), _jsx("input", { className: "w-full bg-transparent text-xs text-gray-800 outline-none placeholder:text-gray-400", placeholder: "Search fields or sections...", value: fieldSearchQuery, onChange: (e) => setFieldSearchQuery(e.target.value) })] }) }), _jsxs("div", { className: "flex-1 overflow-y-auto", children: [sections.map((sectionItem, si_idx) => {
+                                        const isSectionDragging = draggedSectionIdx === si_idx;
+                                        const isSectionDragOver = dragOverSectionIdx === si_idx;
+                                        const sectionSuggestions = getSectionSuggestions(sectionItem.localId);
+                                        const pendingFieldAdditions = getFieldAdditionsForSection(sectionItem.localId);
+                                        const sectionMatches = sectionMatchesSearch(sectionItem.name || "");
+                                        const matchingFields = sectionItem.fields
+                                            .map((fld, fi_idx) => ({ fld, fi_idx }))
+                                            .filter(({ fld }) => fieldMatchesSearch(fld));
+                                        const hasSearchMatch = sectionMatches || matchingFields.length > 0;
+                                        const isCollapsed = isSearching ? !hasSearchMatch : !!collapsedSections[si_idx];
+                                        const visibleFields = isSearching && sectionMatches
+                                            ? sectionItem.fields.map((fld, fi_idx) => ({ fld, fi_idx }))
+                                            : matchingFields;
+                                        return (_jsxs("div", { className: "border-b border-gray-100", children: [_jsxs("div", { draggable: !isSearching, onDragStart: (e) => {
+                                                        if (isSearching)
+                                                            return;
+                                                        setDraggedSectionIdx(si_idx);
+                                                        setSectionDeleteConfirmIdx(null);
+                                                        setIsDragOverSectionEnd(false);
+                                                        e.dataTransfer.effectAllowed = "move";
+                                                    }, onDragEnd: () => {
+                                                        setDraggedSectionIdx(null);
+                                                        setDragOverSectionIdx(null);
+                                                        setIsDragOverSectionEnd(false);
+                                                    }, onDragOver: (e) => {
+                                                        if (isSearching)
+                                                            return;
+                                                        e.preventDefault();
+                                                        if (draggedSectionIdx === null)
+                                                            return;
+                                                        if (draggedSectionIdx === si_idx) {
+                                                            setDragOverSectionIdx(null);
+                                                            setIsDragOverSectionEnd(false);
+                                                            return;
+                                                        }
+                                                        setDragOverSectionIdx(si_idx);
+                                                        setIsDragOverSectionEnd(si_idx === sections.length - 1);
+                                                    }, onDrop: (e) => {
+                                                        if (isSearching)
+                                                            return;
+                                                        e.preventDefault();
+                                                        if (draggedFieldRef) {
+                                                            moveFieldToSection(draggedFieldRef.si, draggedFieldRef.fi, si_idx, sectionItem.fields.length);
+                                                            setDraggedFieldRef(null);
+                                                            setDragOverFieldRef(null);
+                                                            return;
+                                                        }
+                                                        if (draggedSectionIdx !== null && draggedSectionIdx !== si_idx) {
+                                                            moveSection(draggedSectionIdx, si_idx);
+                                                        }
+                                                        setDraggedSectionIdx(null);
+                                                        setDragOverSectionIdx(null);
+                                                        setIsDragOverSectionEnd(false);
+                                                    }, className: `group flex items-center gap-2 px-3 py-2 transition ${isSectionDragOver && draggedSectionIdx !== null
+                                                        ? draggedSectionIdx < si_idx
+                                                            ? "border-b-2 border-blue-500"
+                                                            : "border-t-2 border-blue-500"
+                                                        : ""} ${isSectionDragging ? "opacity-40" : ""} ${sectionSuggestions.length > 0 ? "bg-violet-50/70" : ""}`, onClick: () => {
+                                                        setSelectedSectionIndex(si_idx);
+                                                        setSelectedFieldKey(null);
+                                                    }, children: [_jsx(GripVertical, { className: "h-3.5 w-3.5 cursor-grab text-gray-300 active:cursor-grabbing" }), _jsx("button", { className: "text-gray-400 hover:text-gray-600", onClick: (e) => {
+                                                                e.stopPropagation();
+                                                                toggleSectionCollapsed(si_idx);
+                                                            }, children: isCollapsed ? (_jsx(ChevronRight, { className: "h-3.5 w-3.5" })) : (_jsx(ChevronDown, { className: "h-3.5 w-3.5" })) }), _jsx("input", { className: `flex-1 rounded-md border bg-white px-3 py-1.5 text-sm font-semibold shadow-sm outline-none placeholder:text-gray-400 focus:border-blue-400 focus:ring-2 focus:ring-blue-100 ${sectionSuggestions.length > 0
+                                                                ? "border-violet-200 text-violet-900"
+                                                                : "border-gray-200 text-gray-900"}`, value: sectionItem.name || "", placeholder: `Section ${si_idx + 1}`, onChange: (e) => updateSectionName(si_idx, e.target.value), onClick: (e) => e.stopPropagation() }), _jsx("span", { className: "text-[10px] text-gray-400", children: sectionItem.fields.length }), _jsxs("div", { className: "relative h-5 w-12 shrink-0", children: [_jsx("div", { className: `absolute inset-0 flex items-center justify-center transition-all duration-150 ${sectionDeleteConfirmIdx === si_idx
+                                                                        ? "scale-90 opacity-0 pointer-events-none"
+                                                                        : "scale-100 opacity-100"}`, children: _jsx("button", { className: "text-gray-300 transition hover:text-red-500", onClick: (e) => {
+                                                                            e.stopPropagation();
+                                                                            setSectionDeleteConfirmIdx(si_idx);
+                                                                        }, title: "Delete section", "aria-label": "Delete section", children: _jsx(Trash2, { className: "h-3.5 w-3.5" }) }) }), _jsxs("div", { className: `absolute inset-0 flex items-center justify-center gap-1 transition-all duration-150 ${sectionDeleteConfirmIdx === si_idx
+                                                                        ? "scale-100 opacity-100"
+                                                                        : "scale-90 opacity-0 pointer-events-none"}`, children: [_jsx("button", { className: "text-green-600 transition hover:text-green-700", onClick: (e) => {
+                                                                                e.stopPropagation();
+                                                                                removeSection(si_idx);
+                                                                                setSectionDeleteConfirmIdx(null);
+                                                                            }, title: "Confirm section delete", "aria-label": "Confirm section delete", children: _jsx(Check, { className: "h-3.5 w-3.5" }) }), _jsx("button", { className: "text-red-500 transition hover:text-red-600", onClick: (e) => {
+                                                                                e.stopPropagation();
+                                                                                setSectionDeleteConfirmIdx(null);
+                                                                            }, title: "Cancel section delete", "aria-label": "Cancel section delete", children: _jsx(X, { className: "h-3.5 w-3.5" }) })] })] })] }), sectionSuggestions.length > 0 && (_jsx("div", { className: "mx-3 mb-2 rounded border border-violet-200 bg-violet-50 px-3 py-2 text-[11px] text-violet-800", children: sectionSuggestions.map((entry) => (_jsxs("div", { className: "flex items-center justify-between gap-3 py-1", children: [_jsxs("span", { className: "min-w-0 flex-1 truncate", children: [entry.action === "remove"
+                                                                        ? "AI suggests removing this section"
+                                                                        : `AI suggests renaming this section to "${entry.section.name}"`, entry.reason ? ` · ${entry.reason}` : ""] }), renderSuggestionActions(entry)] }, entry.id))) })), !isCollapsed && (_jsxs("div", { className: "pb-2", children: [_jsxs("div", { className: "space-y-1 px-3", children: [visibleFields.map(({ fld, fi_idx }) => {
+                                                                    const isSelected = selectedFieldKey?.si === si_idx && selectedFieldKey?.fi === fi_idx;
+                                                                    const isDragging = draggedFieldRef?.si === si_idx && draggedFieldRef?.fi === fi_idx;
+                                                                    const isDragOver = dragOverFieldRef?.si === si_idx && dragOverFieldRef?.fi === fi_idx;
+                                                                    const fieldSuggestions = getFieldSuggestions(fld.localId);
+                                                                    const hasFieldRemovalSuggestion = fieldSuggestions.some((entry) => entry.action === "remove");
+                                                                    const fieldUpdateSuggestion = fieldSuggestions.find((entry) => entry.action === "update");
+                                                                    return (_jsxs("div", { draggable: !isSearching, onDragStart: (e) => {
+                                                                            if (isSearching)
+                                                                                return;
+                                                                            setDraggedFieldRef({ si: si_idx, fi: fi_idx });
+                                                                            setDragOverFieldRef(null);
+                                                                            setDragOverFieldEndSectionIdx(null);
+                                                                            e.dataTransfer.effectAllowed = "move";
+                                                                        }, onDragEnd: () => {
+                                                                            setDraggedFieldRef(null);
+                                                                            setDragOverFieldRef(null);
+                                                                            setDragOverFieldEndSectionIdx(null);
+                                                                        }, onDragOver: (e) => {
+                                                                            if (isSearching)
+                                                                                return;
+                                                                            e.preventDefault();
+                                                                            if (!draggedFieldRef)
+                                                                                return;
+                                                                            const isOwnRow = draggedFieldRef.si === si_idx && draggedFieldRef.fi === fi_idx;
+                                                                            if (isOwnRow) {
+                                                                                setDragOverFieldRef(null);
+                                                                                setDragOverFieldEndSectionIdx(null);
+                                                                                return;
+                                                                            }
+                                                                            setDragOverFieldRef({ si: si_idx, fi: fi_idx });
+                                                                            setDragOverFieldEndSectionIdx(null);
+                                                                        }, onDrop: (e) => {
+                                                                            if (isSearching)
+                                                                                return;
+                                                                            e.preventDefault();
+                                                                            if (draggedFieldRef &&
+                                                                                (draggedFieldRef.si !== si_idx || draggedFieldRef.fi !== fi_idx)) {
+                                                                                moveFieldToSection(draggedFieldRef.si, draggedFieldRef.fi, si_idx, fi_idx);
+                                                                            }
+                                                                            setDraggedFieldRef(null);
+                                                                            setDragOverFieldRef(null);
+                                                                            setDragOverFieldEndSectionIdx(null);
+                                                                        }, className: `ml-8 flex cursor-pointer items-center gap-3 rounded px-3 py-2 transition ${isSelected
+                                                                            ? "bg-blue-50/70 ring-1 ring-inset ring-blue-200"
+                                                                            : "hover:bg-gray-50"} ${isDragging ? "bg-gray-100 opacity-30" : ""} ${isDragOver && draggedFieldRef
+                                                                            ? draggedFieldRef.si === si_idx && draggedFieldRef.fi < fi_idx
+                                                                                ? "shadow-[inset_0_-2px_0_0_#3b82f6]"
+                                                                                : "shadow-[inset_0_2px_0_0_#3b82f6]"
+                                                                            : ""} ${fieldSuggestions.length > 0 ? "bg-violet-50/60 ring-1 ring-violet-200" : ""} ${hasFieldRemovalSuggestion ? "opacity-80" : ""}`, onClick: () => setSelectedFieldKey({ si: si_idx, fi: fi_idx }), children: [_jsx(GripVertical, { className: "h-3.5 w-3.5 cursor-grab text-gray-300 active:cursor-grabbing" }), _jsxs("div", { className: "flex-1", children: [_jsx("div", { className: `text-sm font-semibold ${fieldSuggestions.length > 0
+                                                                                            ? "text-violet-800"
+                                                                                            : isSelected
+                                                                                                ? "text-blue-700"
+                                                                                                : "text-gray-700"} ${hasFieldRemovalSuggestion ? "line-through" : ""}`, children: fieldUpdateSuggestion?.field.name ||
+                                                                                            fld.name || (_jsx("span", { className: "font-normal italic text-gray-400", children: "Unnamed" })) }), _jsxs("div", { className: "text-[11px] text-gray-500", children: [fld.type, fld.source ? ` · ${fld.source}` : ""] }), fieldSuggestions.map((entry) => (_jsxs("div", { className: "mt-1 flex items-center justify-between gap-2 text-[10px] text-violet-700", children: [_jsx("span", { className: "min-w-0 flex-1 truncate", children: entry.action === "remove"
+                                                                                                    ? "AI suggests removing this field"
+                                                                                                    : `AI suggests updating this field${entry.reason ? ` · ${entry.reason}` : ""}` }), renderSuggestionActions(entry)] }, entry.id)))] }), _jsxs("div", { className: "flex items-center gap-2", children: [fld.shared && _jsx("span", { className: "rounded border border-blue-100 bg-blue-50 px-1.5 py-0.5 text-[10px] font-bold text-blue-600", children: "S" }), fld.unversioned && _jsx("span", { className: "rounded border border-amber-100 bg-amber-50 px-1.5 py-0.5 text-[10px] font-bold text-amber-600", children: "U" })] }), _jsx("button", { className: "text-gray-300 transition hover:text-red-500", onClick: (e) => { e.stopPropagation(); removeField(si_idx, fi_idx); }, children: _jsx(Trash2, { className: "h-3.5 w-3.5" }) })] }, fld.localId));
+                                                                }), visibleFields.length === 0 && normalizedFieldSearchQuery ? (_jsx("div", { className: "ml-8 px-3 py-2 text-[11px] text-gray-400 italic", children: "No matching fields" })) : null] }), !isSearching &&
+                                                            pendingFieldAdditions.map((entry) => (_jsx("div", { className: "mt-2 mr-3 ml-11 rounded border border-dashed border-violet-300 bg-violet-50 px-3 py-2 text-[11px] text-violet-800", children: _jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "truncate font-semibold", children: entry.field.name || "Suggested field" }), _jsxs("div", { className: "truncate text-[10px] text-violet-600", children: [entry.field.type, entry.reason ? ` · ${entry.reason}` : ""] })] }), renderSuggestionActions(entry)] }) }, entry.id))), !isSearching && draggedFieldRef ? (_jsx("div", { className: `mt-2 mr-3 ml-11 rounded border border-dashed px-2 py-1.5 text-[10px] transition ${dragOverFieldEndSectionIdx === si_idx
+                                                                ? "border-blue-300 bg-blue-50 text-blue-600"
+                                                                : "border-gray-200 bg-white text-gray-400"}`, onDragOver: (e) => {
+                                                                e.preventDefault();
+                                                                setDragOverFieldRef(null);
+                                                                setDragOverFieldEndSectionIdx(si_idx);
+                                                            }, onDrop: (e) => {
+                                                                e.preventDefault();
+                                                                moveFieldToSection(draggedFieldRef.si, draggedFieldRef.fi, si_idx, sectionItem.fields.length);
+                                                                setDraggedFieldRef(null);
+                                                                setDragOverFieldRef(null);
+                                                                setDragOverFieldEndSectionIdx(null);
+                                                            }, children: "Drop field here to place at end" })) : !isSearching ? (_jsxs("div", { className: "mt-2 mr-3 ml-11 flex items-center gap-2", children: [_jsx("input", { ref: (el) => { newFieldNameInputRefs.current[si_idx] = el; }, className: "flex-1 rounded border border-gray-200 bg-white px-2 py-1.5 text-xs text-gray-800 outline-none placeholder:text-gray-400 focus:border-blue-400", placeholder: "Add field...", value: getFieldDraft(si_idx).name, onChange: (e) => updateFieldDraft(si_idx, { name: e.target.value }), onKeyDown: (e) => { if (e.key === "Enter")
+                                                                        appendFieldToSection(si_idx); } }), _jsx("button", { className: "rounded bg-blue-600 p-1.5 text-white transition hover:bg-blue-700 shadow-sm", onClick: () => appendFieldToSection(si_idx), children: _jsx(Plus, { className: "h-3.5 w-3.5" }) })] })) : null] }))] }, sectionItem.localId));
+                                    }), !isSearching &&
+                                        pendingSectionAdditions.map((entry) => (_jsx("div", { className: "mx-3 mt-2 rounded border border-dashed border-violet-300 bg-violet-50 px-3 py-3 text-violet-900", children: _jsxs("div", { className: "flex items-start justify-between gap-3", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "truncate text-sm font-semibold", children: entry.section.name || "Suggested section" }), _jsxs("div", { className: "text-[11px] text-violet-700", children: ["AI section suggestion", entry.reason ? ` · ${entry.reason}` : ""] }), entry.section.fields.length > 0 && (_jsx("div", { className: "mt-2 space-y-1", children: entry.section.fields.map((field) => (_jsxs("div", { className: "rounded border border-violet-200 bg-white/70 px-2 py-1 text-[10px] text-violet-700", children: [field.name || "Suggested field", " \u00B7 ", field.type] }, field.localId))) }))] }), renderSuggestionActions(entry)] }) }, entry.id))), !isSearching && draggedSectionIdx !== null ? (_jsx("div", { className: `mx-3 mt-2 mb-3 rounded border border-dashed px-2 py-1.5 text-[10px] transition ${isDragOverSectionEnd
+                                            ? "border-blue-300 bg-blue-50 text-blue-600"
+                                            : "border-gray-200 bg-white text-gray-400"}`, onDragOver: (e) => {
+                                            e.preventDefault();
+                                            setDragOverSectionIdx(sections.length > 0 ? sections.length - 1 : null);
+                                            setIsDragOverSectionEnd(true);
+                                        }, onDrop: (e) => {
+                                            e.preventDefault();
+                                            if (draggedSectionIdx !== null) {
+                                                moveSection(draggedSectionIdx, sections.length - 1);
+                                            }
+                                            setDraggedSectionIdx(null);
+                                            setDragOverSectionIdx(null);
+                                            setIsDragOverSectionEnd(false);
+                                        }, children: "Drop section here to place at end" })) : !isSearching ? (_jsxs("div", { className: "mx-3 mt-2 mb-3 flex items-center gap-2", children: [_jsx("input", { className: "flex-1 rounded border border-gray-200 bg-white px-2 py-1 text-xs text-gray-800 outline-none placeholder:text-gray-400 focus:border-blue-400", placeholder: "New section...", value: newSectionName, onChange: (e) => setNewSectionName(e.target.value), onKeyDown: (e) => { if (e.key === "Enter")
+                                                    appendSection(); } }), _jsx("button", { className: "rounded bg-blue-600 p-1 text-white transition hover:bg-blue-700 shadow-sm", onClick: appendSection, children: _jsx(Plus, { className: "h-3.5 w-3.5" }) })] })) : null] })] }), _jsxs("div", { className: "flex flex-col overflow-y-auto border-l border-gray-100 bg-gray-50/20", children: [_jsx("div", { className: "border-b border-gray-100 px-4 py-2 bg-gray-50/30", children: _jsxs("div", { className: "flex items-center gap-2 text-xs font-bold text-gray-500 uppercase tracking-wider", children: [_jsx(Settings2, { className: "h-3.5 w-3.5" }), " Properties"] }) }), field && section && si !== undefined && fi !== undefined ? (_jsxs("div", { className: "space-y-4 p-4", children: [_jsxs("div", { children: [_jsx("div", { className: "mb-1 text-[10px] font-bold uppercase tracking-wider text-gray-400", children: "Name" }), _jsx("input", { className: cls.input, value: field.name, onChange: (e) => updateField(si, fi, { name: e.target.value }) })] }), _jsxs("div", { children: [_jsx("div", { className: "mb-1 text-[10px] font-bold uppercase tracking-wider text-gray-400", children: "Type" }), renderTypeSelect(field.type, (v) => updateField(si, fi, { type: v }))] }), _jsxs("div", { children: [_jsx("div", { className: "mb-1 text-[10px] font-bold uppercase tracking-wider text-gray-400", children: "Source" }), _jsx("input", { className: cls.input, placeholder: "Optional", value: field.source, onChange: (e) => updateField(si, fi, { source: e.target.value }) })] }), _jsxs("div", { children: [_jsx("div", { className: "mb-1 text-[10px] font-bold uppercase tracking-wider text-gray-400", children: "Short description" }), _jsx("input", { className: cls.input, placeholder: "Optional", value: field.shortDescription, onChange: (e) => updateField(si, fi, { shortDescription: e.target.value }) })] }), _jsxs("div", { children: [_jsx("div", { className: "mb-1 text-[10px] font-bold uppercase tracking-wider text-gray-400", children: "Default value" }), _jsx("input", { className: cls.input, placeholder: "Optional", value: field.defaultValue, onChange: (e) => updateField(si, fi, { defaultValue: e.target.value }) })] }), _jsxs("div", { className: "space-y-3 border-t border-gray-100 pt-3", children: [_jsxs("label", { className: "flex items-center justify-between text-xs text-gray-600 font-medium", children: [_jsx("span", { children: "Shared" }), renderToggle(field.shared, () => updateField(si, fi, { shared: !field.shared }))] }), _jsxs("label", { className: "flex items-center justify-between text-xs text-gray-600 font-medium", children: [_jsx("span", { children: "Unversioned" }), renderToggle(field.unversioned, () => updateField(si, fi, { unversioned: !field.unversioned }))] })] }), _jsxs("button", { className: "mt-2 flex w-full items-center justify-center gap-1.5 rounded-md border border-red-200 bg-red-50 py-2 text-xs font-semibold text-red-600 transition hover:bg-red-100", onClick: () => { removeField(si, fi); setSelectedFieldKey(null); }, children: [_jsx(Trash2, { className: "h-3.5 w-3.5" }), " Remove field"] })] })) : (_jsxs("div", { className: "flex flex-1 flex-col items-center justify-center gap-2 p-6 text-gray-300", children: [_jsx(Settings2, { className: "h-8 w-8" }), _jsx("p", { className: "text-xs font-medium", children: "Select a field to inspect" })] }))] }), _jsxs("div", { className: "flex min-h-0 flex-col border-l border-gray-100 bg-white", children: [_jsx("div", { className: "border-b border-gray-100 bg-gray-50/30 px-4 py-2", children: _jsxs("div", { className: "flex items-center gap-2 text-xs font-bold uppercase tracking-wider text-gray-500", children: [_jsx(Bot, { className: "h-3.5 w-3.5" }), " Template Builder AI"] }) }), _jsxs("div", { className: "border-b border-gray-100 px-4 py-3", children: [latestSuggestionSummary && (_jsxs("div", { className: "rounded border border-violet-200 bg-violet-50 px-3 py-2 text-[11px] text-violet-800", children: [_jsx("span", { className: "font-semibold", children: "Latest suggestion:" }), " ", latestSuggestionSummary] })), suggestionStatus && (_jsx("div", { className: "mt-2 text-[11px] text-gray-500", children: suggestionStatus })), suggestionParseError && (_jsxs("div", { className: "mt-2 rounded border border-red-200 bg-red-50 px-3 py-2 text-[11px] text-red-700", children: ["Failed to parse AI response: ", suggestionParseError] })), pendingSuggestions.length > 0 && (_jsxs("div", { className: "mt-2 text-[11px] text-gray-600", children: [pendingSuggestions.length, " pending suggestion", pendingSuggestions.length === 1 ? "" : "s", " highlighted in purple."] }))] }), _jsx("div", { className: "min-h-0 flex-1", children: _jsx(AgentTerminal, { agentStub: templateBuilderAgent, profiles: effectiveAiProfiles, compact: true, simpleMode: true, hideContext: true, defaultCollapseJson: true, initialMetadata: templateBuilderAgentMetadata, onMessage: handleAgentMessage, className: "h-full" }) })] })] }), renderFooter()] }));
+}
+//# sourceMappingURL=TemplateStructureInlineEditor.js.map