@reidelsaltres/pureper 0.1.160 → 0.1.162

package/out/foundation/engine/TemplateInstance.js

@@ -1,53 +1,107 @@
 import { MutationObserver } from '../api/Observer.js';
+import Expression from './Expression.js';
 /**
- * PageTemplate - динамический шаблон страницы.
- * Хранит обработанные Rule и поддерживает реактивное обновление.
+ * TemplateInstance - динамический шаблон страницы.
  *
- * При изменении Observable все зависимые секции обновляются
- * одновременно в одном событии onTemplateChange.
+ * Поддерживает:
+ * - Множество мелких фрагментов, каждый обновляется независимо
+ * - Множество container bindings
+ * - Автоматическое обновление DOM при изменении Observable
+ * - bind/unbind для refs и events
  */
 export default class TemplateInstance {
-    template;
     scope;
     sections = [];
-    fragment = null;
-    /** Observers for template changes */
-    changeObserver = new MutationObserver();
+    /** Все фрагменты шаблона */
+    fragments = new Map();
+    /** ID корневого фрагмента */
+    rootFragmentId = null;
+    /** Счётчик для генерации ID фрагментов */
+    fragmentIdCounter = 0;
+    /** Observers for fragment changes */
+    fragmentChangeObserver = new MutationObserver();
     /** Группировка секций по Observable */
     observableTrackings = new Map();
-    constructor(template, scope) {
-        this.template = template;
+    /** Привязки к контейнерам */
+    containerBindings = new Map();
+    constructor(scope) {
         this.scope = scope;
     }
+    // ========================================
+    // Public API - Getters
+    // ========================================
     /**
-     * Получить текущий шаблон
+     * Получить Scope
      */
-    getTemplate() {
-        return this.template;
+    getScope() {
+        return this.scope;
     }
     /**
-     * Установить новый шаблон (вызывает событие изменения)
+     * Получить все секции
      */
-    setTemplate(newTemplate) {
-        const oldTemplate = this.template;
-        this.template = newTemplate;
-        this.changeObserver.notify({ oldValue: null, newValue: null, oldTemplate, newTemplate }, { oldValue: null, newValue: null, oldTemplate, newTemplate });
+    getSections() {
+        return this.sections;
     }
     /**
-     * Получить Scope
+     * Получить все фрагменты
      */
-    getScope() {
-        return this.scope;
+    getAllFragments() {
+        return this.fragments;
+    }
+    /**
+     * Получить фрагмент по ID
+     */
+    getFragmentBinding(id) {
+        return this.fragments.get(id);
+    }
+    /**
+     * Получить финальный HTML (собранный из всех фрагментов)
+     */
+    getTemplate() {
+        if (!this.rootFragmentId)
+            return '';
+        return this.buildHtmlFromFragment(this.rootFragmentId);
     }
+    // ========================================
+    // Public API - Fragment Management
+    // ========================================
     /**
-     * Подписаться на изменения шаблона
+     * Создать новый фрагмент и вернуть его ID
      */
-    onTemplateChange(listener) {
-        const wrapper = (oldEvent, newEvent) => {
-            listener(newEvent.oldValue, newEvent.newValue, newEvent.oldTemplate, newEvent.newTemplate);
+    createFragment(html, sourceTemplate, sections = [], parentId = null) {
+        const id = `f${this.fragmentIdCounter++}`;
+        const binding = {
+            id,
+            html,
+            sourceTemplate,
+            sections,
+            observables: new Set(),
+            parentId,
+            childIds: []
         };
-        this.changeObserver.subscribe(wrapper);
-        return () => this.changeObserver.unsubscribe(wrapper);
+        // Привязываем секции к фрагменту
+        for (const section of sections) {
+            section.fragmentId = id;
+        }
+        this.fragments.set(id, binding);
+        // Если нет корневого фрагмента, это первый
+        if (this.rootFragmentId === null) {
+            this.rootFragmentId = id;
+        }
+        // Добавляем в дочерние родителя
+        if (parentId) {
+            const parent = this.fragments.get(parentId);
+            if (parent) {
+                parent.childIds.push(id);
+            }
+        }
+        return id;
+    }
+    /**
+     * Установить корневой фрагмент
+     */
+    setRootFragment(id) {
+        this.rootFragmentId = id;
     }
     /**
      * Добавить секцию шаблона
@@ -56,38 +110,86 @@ export default class TemplateInstance {
         this.sections.push(section);
     }
     /**
-     * Получить все секции
+     * Вставить добавленный фрагмент во все привязанные контейнеры.
+     * Вызывается после appendTemplate.
      */
-    getSections() {
-        return this.sections;
+    insertAppendedFragment(fragmentId) {
+        const fragment = this.fragments.get(fragmentId);
+        if (!fragment)
+            return;
+        for (const [container, binding] of this.containerBindings) {
+            // Вставляем фрагмент в конец контейнера
+            this.insertFragmentRecursive(fragmentId, container, binding);
+            // Привязываем refs, events и injections для новых элементов
+            this.bindRefsForContainer(container);
+            this.processInjectionsForContainer(container);
+            this.bindEventsForNewFragment(fragmentId, binding);
+        }
+    }
+    /**
+     * Привязать события только для нового фрагмента
+     */
+    bindEventsForNewFragment(fragmentId, binding) {
+        const markerInfo = binding.markers.get(fragmentId);
+        if (!markerInfo)
+            return;
+        for (const node of markerInfo.nodes) {
+            if (node instanceof Element) {
+                const unbinders = this.bindEventsToElement(node);
+                binding.eventUnbinders.push(...unbinders);
+                const children = node.querySelectorAll('*');
+                for (const child of Array.from(children)) {
+                    const childUnbinders = this.bindEventsToElement(child);
+                    binding.eventUnbinders.push(...childUnbinders);
+                }
+            }
+        }
     }
+    // ========================================
+    // Public API - Events
+    // ========================================
     /**
-     * Подписаться на Observable и автоматически пересоздавать секцию.
-     * Все секции, зависящие от одного Observable, обновляются разом.
+     * Подписаться на изменения фрагментов
+     */
+    onFragmentChange(listener) {
+        const wrapper = (_oldEvent, newEvent) => {
+            listener(newEvent);
+        };
+        this.fragmentChangeObserver.subscribe(wrapper);
+        return () => this.fragmentChangeObserver.unsubscribe(wrapper);
+    }
+    // ========================================
+    // Public API - Observable Tracking
+    // ========================================
+    /**
+     * Подписаться на Observable и автоматически пересоздавать секцию
      */
     trackObservable(observable, section, rebuild) {
-        // Проверяем, есть ли уже отслеживание для этого Observable
         let tracking = this.observableTrackings.get(observable);
         if (!tracking) {
-            // Создаём новое отслеживание
-            const listener = (newValue) => {
-                this.rebuildAllSectionsForObservable(observable, newValue);
+            const listener = (_newValue) => {
+                this.rebuildFragmentsForObservable(observable);
             };
             observable.subscribe(listener);
             tracking = {
                 observable,
                 sections: [],
+                fragmentIds: new Set(),
                 unsubscribe: () => observable.unsubscribe(listener)
             };
             this.observableTrackings.set(observable, tracking);
         }
-        // Добавляем секцию в отслеживание
         tracking.sections.push({ section, rebuild });
-        // Возвращаем функцию отписки для этой конкретной секции
+        if (section.fragmentId) {
+            tracking.fragmentIds.add(section.fragmentId);
+            const binding = this.fragments.get(section.fragmentId);
+            if (binding) {
+                binding.observables.add(observable);
+            }
+        }
         return () => {
             if (tracking) {
                 tracking.sections = tracking.sections.filter(s => s.section !== section);
-                // Если больше нет секций, отписываемся от Observable
                 if (tracking.sections.length === 0) {
                     tracking.unsubscribe();
                     this.observableTrackings.delete(observable);
@@ -95,95 +197,120 @@ export default class TemplateInstance {
             }
         };
     }
+    // ========================================
+    // Public API - Container Binding
+    // ========================================
     /**
-     * Перестроить все секции, зависящие от Observable, за один раз
+     * Привязать к контейнеру.
+     * Вставляет DOM, вызывает bindRefs, processInjections и bindEvents.
      */
-    rebuildAllSectionsForObservable(observable, newValue) {
-        const tracking = this.observableTrackings.get(observable);
-        if (!tracking || tracking.sections.length === 0)
+    bind(container) {
+        if (this.containerBindings.has(container)) {
+            console.warn('[TemplateInstance] Container already bound');
             return;
-        const oldTemplate = this.template;
-        let currentTemplate = this.template;
-        // Собираем все замены: старый output -> новый output
-        // Сортируем по позиции в шаблоне (с конца), чтобы замены не сбивали индексы
-        const replacements = [];
-        for (const { section, rebuild } of tracking.sections) {
-            // Unsubscribe old nested observables
-            this.unsubscribeSectionNested(section);
-            // Rebuild section
-            const newResult = rebuild(section);
-            const oldOutput = section.result.output;
-            replacements.push({
-                oldOutput,
-                newOutput: newResult.output,
-                section
-            });
-            section.result = newResult;
-        }
-        // Применяем все замены
-        for (const { oldOutput, newOutput } of replacements) {
-            currentTemplate = currentTemplate.replace(oldOutput, newOutput);
         }
-        this.template = currentTemplate;
-        // Одно событие для всех изменений
-        this.changeObserver.notify({ oldValue: null, newValue, oldTemplate, newTemplate: this.template }, { oldValue: null, newValue, oldTemplate, newTemplate: this.template });
+        const binding = {
+            container,
+            markers: new Map(),
+            eventUnbinders: []
+        };
+        this.containerBindings.set(container, binding);
+        // Вставляем DOM с маркерами
+        this.insertFragmentsIntoContainer(container, binding);
+        // Привязываем refs, обрабатываем injections, привязываем events
+        this.bindRefsForContainer(container);
+        this.processInjectionsForContainer(container);
+        this.bindEventsForContainer(container, binding);
     }
     /**
-     * Отписаться от вложенных Observable в секции (но не от главного)
+     * Отвязать от контейнера.
+     * Отвязывает refs и events, но оставляет DOM.
      */
-    unsubscribeSectionNested(section) {
-        // Отписываемся только от подписок, сохранённых непосредственно в секции
-        for (const sub of section.subscriptions) {
-            sub.unsubscribe();
+    unbind(container) {
+        const binding = this.containerBindings.get(container);
+        if (!binding) {
+            console.warn('[TemplateInstance] Container not bound');
+            return;
         }
-        section.subscriptions = [];
-        // Recursively unsubscribe children
-        for (const child of section.children) {
-            this.unsubscribeSectionNested(child);
+        // Отвязываем события для этого контейнера
+        for (const unbind of binding.eventUnbinders) {
+            unbind();
         }
+        binding.eventUnbinders = [];
+        // Отвязываем refs
+        this.unbindRefsForContainer(container);
+        // Удаляем binding
+        this.containerBindings.delete(container);
     }
     /**
-     * Отписаться от всех Observable в секции
+     * Привязать refs к элементам.
+     * Если есть контейнеры - привязывает для них.
+     * Если нет - создаёт временный DocumentFragment и привязывает refs из него.
      */
-    unsubscribeSection(section) {
-        for (const sub of section.subscriptions) {
-            sub.unsubscribe();
+    bindRefs() {
+        if (this.containerBindings.size > 0) {
+            for (const [container] of this.containerBindings) {
+                this.bindRefsForContainer(container);
+            }
         }
-        section.subscriptions = [];
-        // Recursively unsubscribe children
-        for (const child of section.children) {
-            this.unsubscribeSection(child);
+        else {
+            // Нет контейнеров - создаём временный fragment
+            const fragment = this.createDOMFragment();
+            this.bindRefsForFragment(fragment);
         }
     }
     /**
-     * Создать DocumentFragment из текущего шаблона
+     * Привязать refs из DocumentFragment (без контейнера)
      */
-    createFragment() {
-        if (typeof document === 'undefined') {
-            throw new Error('PageTemplate.createFragment() requires DOM environment');
+    bindRefsForFragment(fragment) {
+        const refElements = fragment.querySelectorAll('[data-ref]');
+        for (const element of Array.from(refElements)) {
+            const refName = element.getAttribute('data-ref');
+            if (refName) {
+                this.scope.set(refName, element);
+            }
         }
-        const template = document.createElement('template');
-        template.innerHTML = this.template;
-        this.fragment = template.content.cloneNode(true);
-        return this.fragment;
     }
     /**
-     * Получить кэшированный DocumentFragment
+     * Отвязать refs (для всех контейнеров)
      */
-    getFragment() {
-        return this.fragment;
+    unbindRefs() {
+        for (const section of this.sections) {
+            if (section.rule.name === 'ref' && section.result.data?.refName) {
+                const refName = section.result.data.refName;
+                if (this.scope.has(refName)) {
+                    this.scope.set(refName, null);
+                }
+            }
+        }
+    }
+    /**
+     * Привязать события (для всех контейнеров)
+     */
+    bindEvents() {
+        for (const [container, binding] of this.containerBindings) {
+            this.bindEventsForContainer(container, binding);
+        }
     }
     /**
-     * Пересоздать fragment
+     * Отвязать события (для всех контейнеров)
      */
-    rebuildFragment() {
-        this.fragment = null;
-        return this.createFragment();
+    unbindEvents() {
+        for (const [_, binding] of this.containerBindings) {
+            for (const unbind of binding.eventUnbinders) {
+                unbind();
+            }
+            binding.eventUnbinders = [];
+        }
     }
     /**
-     * Очистить все подписки
+     * Очистить все подписки и bindings
      */
     dispose() {
+        // Отвязываем все контейнеры
+        for (const [container] of this.containerBindings) {
+            this.unbind(container);
+        }
         // Отписываемся от всех Observable
         for (const tracking of this.observableTrackings.values()) {
             tracking.unsubscribe();
@@ -194,13 +321,90 @@ export default class TemplateInstance {
             this.unsubscribeSection(section);
         }
         this.sections = [];
-        this.fragment = null;
+        // Очищаем фрагменты
+        this.fragments.clear();
+        this.rootFragmentId = null;
+    }
+    // ========================================
+    // Private - DOM Operations
+    // ========================================
+    /**
+     * Вставить все фрагменты в контейнер с маркерами
+     */
+    insertFragmentsIntoContainer(container, binding) {
+        if (!this.rootFragmentId)
+            return;
+        // Рекурсивно вставляем фрагменты
+        this.insertFragmentRecursive(this.rootFragmentId, container, binding);
+    }
+    /**
+     * Рекурсивно вставить фрагмент и его дочерние
+     */
+    insertFragmentRecursive(fragmentId, parent, containerBinding) {
+        const fragment = this.fragments.get(fragmentId);
+        if (!fragment)
+            return;
+        // Создаём маркеры
+        const startMarker = document.createComment(`fragment:${fragmentId}`);
+        const endMarker = document.createComment(`/fragment:${fragmentId}`);
+        parent.appendChild(startMarker);
+        // Парсим HTML и вставляем, заменяя placeholder-ы на дочерние фрагменты
+        const nodes = this.createNodesFromHtml(fragment.html);
+        const insertedNodes = [];
+        // Node.COMMENT_NODE = 8
+        const COMMENT_NODE = 8;
+        for (const node of nodes) {
+            // Проверяем на placeholder комментарии
+            if (node.nodeType === COMMENT_NODE) {
+                const comment = node;
+                const match = comment.data.match(/^placeholder:(.+)$/);
+                if (match) {
+                    const childId = match[1];
+                    // Рекурсивно вставляем дочерний фрагмент
+                    this.insertFragmentRecursive(childId, parent, containerBinding);
+                    continue;
+                }
+            }
+            parent.appendChild(node);
+            insertedNodes.push(node);
+        }
+        parent.appendChild(endMarker);
+        // Сохраняем маркеры
+        containerBinding.markers.set(fragmentId, {
+            startMarker,
+            endMarker,
+            nodes: insertedNodes
+        });
+    }
+    /**
+     * Создать ноды из HTML строки
+     */
+    createNodesFromHtml(html) {
+        const template = document.createElement('template');
+        template.innerHTML = html;
+        return Array.from(template.content.childNodes);
+    }
+    /**
+     * Собрать HTML из фрагмента (рекурсивно заменяя placeholder-ы)
+     */
+    buildHtmlFromFragment(fragmentId) {
+        const fragment = this.fragments.get(fragmentId);
+        if (!fragment)
+            return '';
+        let html = fragment.html;
+        // Заменяем placeholder-ы на контент дочерних фрагментов
+        for (const childId of fragment.childIds) {
+            const placeholder = `<!--placeholder:${childId}-->`;
+            const childHtml = this.buildHtmlFromFragment(childId);
+            html = html.replace(placeholder, childHtml);
+        }
+        return html;
     }
     /**
-     * Привязать refs после вставки в DOM
+     * Привязать refs для конкретного контейнера
      */
-    bindRefs(root) {
-        const refElements = root.querySelectorAll('[data-ref]');
+    bindRefsForContainer(container) {
+        const refElements = container.querySelectorAll('[data-ref]');
         for (const element of Array.from(refElements)) {
             const refName = element.getAttribute('data-ref');
             if (refName) {
@@ -209,27 +413,30 @@ export default class TemplateInstance {
         }
     }
     /**
-     * Обработать инжекции (@injection[head/tail])
-     * Должен вызываться после bindRefs
+     * Обработать инжекции для конкретного контейнера.
+     * Находит элементы с data-injection-* атрибутами и перемещает их в целевые элементы.
      */
-    processInjections(root) {
-        // Find all elements with injection attributes
-        const injectElements = root.querySelectorAll('[data-injection-type][data-injection-target]');
+    processInjectionsForContainer(container) {
+        const injectElements = container.querySelectorAll('[data-injection-type][data-injection-target]');
         for (const element of Array.from(injectElements)) {
             const type = element.getAttribute('data-injection-type');
             const targetRefName = decodeURIComponent(element.getAttribute('data-injection-target') || '');
-            if (!targetRefName)
+            if (!targetRefName) {
+                // Нет target - удаляем элемент из DOM
+                element.remove();
                 continue;
-            // Get target element from scope
+            }
+            // Получаем целевой элемент из scope
             const targetElement = this.scope.get(targetRefName);
             if (!targetElement || !(targetElement instanceof Element)) {
-                console.warn(`[PageTemplate] Injection target "${targetRefName}" not found in scope or is not an Element`);
+                // Target не найден - удаляем элемент из DOM
+                element.remove();
                 continue;
             }
-            // Remove injection attributes
+            // Удаляем атрибуты инжекции
             element.removeAttribute('data-injection-type');
             element.removeAttribute('data-injection-target');
-            // Perform injection
+            // Выполняем инжекцию
             if (type === 'head') {
                 targetElement.prepend(element);
             }
@@ -239,17 +446,192 @@ export default class TemplateInstance {
         }
     }
     /**
-     * Отвязать refs (установить null)
+     * Отвязать refs для конкретного контейнера
      */
-    unbindRefs() {
+    unbindRefsForContainer(_container) {
+        // Устанавливаем все refs в null
         for (const section of this.sections) {
-            if (section.rule.name === 'ref' && section.match.data?.expression) {
-                const refName = section.match.data.expression;
+            if (section.rule.name === 'ref' && section.result.data?.refName) {
+                const refName = section.result.data.refName;
                 if (this.scope.has(refName)) {
                     this.scope.set(refName, null);
                 }
             }
         }
     }
+    /**
+     * Привязать события для конкретного контейнера
+     */
+    bindEventsForContainer(container, binding) {
+        const allElements = container.querySelectorAll('*');
+        for (const element of Array.from(allElements)) {
+            const unbinders = this.bindEventsToElement(element);
+            binding.eventUnbinders.push(...unbinders);
+        }
+    }
+    /**
+     * Привязать события к одному элементу
+     */
+    bindEventsToElement(element) {
+        const unbinders = [];
+        const attributes = Array.from(element.attributes);
+        for (const attr of attributes) {
+            if (attr.name.startsWith('data-event-')) {
+                const eventName = attr.name.slice('data-event-'.length);
+                const exprCode = decodeURIComponent(attr.value);
+                const handler = (event) => {
+                    const localScope = this.scope.createChild({ event });
+                    const expr = new Expression(exprCode);
+                    try {
+                        expr.execute(localScope);
+                    }
+                    catch (error) {
+                        console.error(`[TemplateInstance] Error executing handler for ${eventName}:`, error);
+                    }
+                };
+                element.addEventListener(eventName, handler);
+                unbinders.push(() => element.removeEventListener(eventName, handler));
+            }
+        }
+        return unbinders;
+    }
+    // ========================================
+    // Private - Observable Rebuild
+    // ========================================
+    /**
+     * Перестроить фрагменты при изменении Observable
+     */
+    rebuildFragmentsForObservable(observable) {
+        const tracking = this.observableTrackings.get(observable);
+        if (!tracking || tracking.sections.length === 0)
+            return;
+        // Собираем затронутые фрагменты
+        const affectedFragmentIds = new Set();
+        // Перестраиваем секции и обновляем результаты
+        for (const { section, rebuild } of tracking.sections) {
+            this.unsubscribeSectionNested(section);
+            const newResult = rebuild(section);
+            section.result = newResult;
+            if (section.fragmentId) {
+                affectedFragmentIds.add(section.fragmentId);
+            }
+        }
+        // Перестраиваем HTML затронутых фрагментов
+        for (const fragmentId of affectedFragmentIds) {
+            const fragment = this.fragments.get(fragmentId);
+            if (!fragment)
+                continue;
+            // Собираем новый HTML из результатов всех секций фрагмента
+            let newHtml = fragment.sourceTemplate;
+            for (const section of fragment.sections) {
+                // Заменяем исходный match на новый output
+                newHtml = newHtml.replace(section.match.fullMatch, section.result.output);
+            }
+            fragment.html = newHtml;
+        }
+        // Обновляем DOM во всех контейнерах
+        for (const fragmentId of affectedFragmentIds) {
+            this.updateFragmentInAllContainers(fragmentId, observable);
+        }
+    }
+    /**
+     * Обновить фрагмент во всех контейнерах
+     */
+    updateFragmentInAllContainers(fragmentId, observable) {
+        const fragment = this.fragments.get(fragmentId);
+        if (!fragment)
+            return;
+        for (const [container, binding] of this.containerBindings) {
+            const markerInfo = binding.markers.get(fragmentId);
+            if (!markerInfo)
+                continue;
+            const { startMarker, endMarker, nodes: oldNodes } = markerInfo;
+            const parent = startMarker.parentNode;
+            if (!parent)
+                continue;
+            // Отвязываем события от старых элементов
+            this.unbindEventsFromNodes(oldNodes, binding);
+            // Удаляем старые ноды (проверяем что node всё ещё child, т.к. injection мог переместить)
+            for (const node of oldNodes) {
+                if (node.parentNode === parent) {
+                    parent.removeChild(node);
+                }
+            }
+            // Создаём новые ноды
+            const newNodes = this.createNodesFromHtml(fragment.html);
+            const insertedNodes = [];
+            for (const node of newNodes) {
+                parent.insertBefore(node, endMarker);
+                insertedNodes.push(node);
+            }
+            // Сохраняем новые ноды
+            markerInfo.nodes = insertedNodes;
+            // Привязываем refs, обрабатываем injections и events к новым элементам
+            this.bindRefsForContainer(container);
+            this.processInjectionsForContainer(container);
+            for (const node of insertedNodes) {
+                if (node instanceof Element) {
+                    const unbinders = this.bindEventsToElement(node);
+                    binding.eventUnbinders.push(...unbinders);
+                    // И для всех дочерних
+                    const children = node.querySelectorAll('*');
+                    for (const child of Array.from(children)) {
+                        const childUnbinders = this.bindEventsToElement(child);
+                        binding.eventUnbinders.push(...childUnbinders);
+                    }
+                }
+            }
+            // Уведомляем об изменении
+            this.fragmentChangeObserver.notify({ fragmentId, oldNodes, newNodes: insertedNodes, affectedObservables: [observable] }, { fragmentId, oldNodes, newNodes: insertedNodes, affectedObservables: [observable] });
+        }
+    }
+    /**
+     * Отвязать события от нод
+     */
+    unbindEventsFromNodes(nodes, binding) {
+        // Простая реализация: очищаем все unbinders
+        // В идеале нужно отслеживать какие unbinders к каким элементам относятся
+        // Но для простоты пока так
+        for (const unbind of binding.eventUnbinders) {
+            unbind();
+        }
+        binding.eventUnbinders = [];
+    }
+    /**
+     * Отписаться от вложенных Observable в секции
+     */
+    unsubscribeSectionNested(section) {
+        for (const sub of section.subscriptions) {
+            sub.unsubscribe();
+        }
+        section.subscriptions = [];
+        for (const child of section.children) {
+            this.unsubscribeSectionNested(child);
+        }
+    }
+    /**
+     * Отписаться от всех Observable в секции
+     */
+    unsubscribeSection(section) {
+        for (const sub of section.subscriptions) {
+            sub.unsubscribe();
+        }
+        section.subscriptions = [];
+        for (const child of section.children) {
+            this.unsubscribeSection(child);
+        }
+    }
+    // ========================================
+    // Legacy API (для обратной совместимости)
+    // ========================================
+    /**
+     * @deprecated Используйте bind(container)
+     */
+    createDOMFragment() {
+        const html = this.getTemplate();
+        const template = document.createElement('template');
+        template.innerHTML = html;
+        return template.content;
+    }
 }
 //# sourceMappingURL=TemplateInstance.js.map