@praxisui/expansion 8.0.0-beta.9 → 8.0.0-beta.90

package/fesm2022/praxisui-expansion.mjs

@@ -1,7 +1,7 @@
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { EventEmitter, inject, ChangeDetectorRef, DestroyRef, ViewChildren, ViewChild, Output, Input, ChangeDetectionStrategy, Component, Inject, ENVIRONMENT_INITIALIZER } from '@angular/core';
+import { EventEmitter, inject, ChangeDetectorRef, DestroyRef, effect, ViewChildren, ViewChild, Output, Input, ChangeDetectionStrategy, Component, Inject, ENVIRONMENT_INITIALIZER } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import * as i2 from '@angular/material/expansion';
@@ -21,9 +21,9 @@ import { MatTooltipModule } from '@angular/material/tooltip';
 import { DynamicFieldLoaderDirective } from '@praxisui/dynamic-fields';
 import { deepMerge, ASYNC_CONFIG_STORAGE, DynamicFormService, ComponentKeyService, DynamicWidgetLoaderDirective, PraxisIconDirective, ComponentMetadataRegistry } from '@praxisui/core';
 import { SettingsPanelService, SETTINGS_PANEL_DATA } from '@praxisui/settings-panel';
-import { BehaviorSubject } from 'rxjs';
+import { firstValueFrom, BehaviorSubject, Subscription } from 'rxjs';
 import { take } from 'rxjs/operators';
-import { BaseAiAdapter, PraxisAiAssistantComponent } from '@praxisui/ai';
+import { BaseAiAdapter, shouldRoutePromptToGovernedDecision, AiBackendApiService, PraxisAssistantSessionRegistryService, PraxisAssistantTurnOrchestratorService, createPraxisAssistantViewportLayout, PraxisAiAssistantShellComponent } from '@praxisui/ai';
 
 /**
  * Capabilities catalog for Praxis Expansion (ExpansionMetadata).
@@ -62,6 +62,7 @@ const CAPS = [
     { path: 'panels[].id', category: 'panels', valueKind: 'string', description: 'Panel id.' },
     { path: 'panels[].title', category: 'panels', valueKind: 'string', description: 'Panel title.' },
     { path: 'panels[].description', category: 'panels', valueKind: 'string', description: 'Panel description.' },
+    { path: 'panels[].icon', category: 'panels', valueKind: 'string', description: 'Panel header icon rendered through PraxisIconDirective.' },
     { path: 'panels[].disabled', category: 'panels', valueKind: 'boolean', description: 'Disable panel.' },
     { path: 'panels[].expanded', category: 'panels', valueKind: 'boolean', description: 'Expanded state.' },
     { path: 'panels[].hideToggle', category: 'panels', valueKind: 'boolean', description: 'Hide toggle icon for panel.' },
@@ -104,6 +105,8 @@ const EXPANSION_AI_CAPABILITIES = {
 
 class ExpansionAiAdapter extends BaseAiAdapter {
     expansion;
+    componentId = 'praxis-expansion';
+    componentType = 'expansion';
     componentName = 'Praxis Expansion';
     constructor(expansion) {
         super();
@@ -124,6 +127,43 @@ class ExpansionAiAdapter extends BaseAiAdapter {
             multi: this.expansion.config?.accordion?.multi ?? false,
         };
     }
+    getDataProfile() {
+        const panels = this.getCurrentConfig().panels || [];
+        return {
+            expansionId: this.expansion.expansionId,
+            panelCount: panels.length,
+            contentPanelCount: panels.filter((panel) => Array.isArray(panel.content) && panel.content.length > 0).length,
+            widgetPanelCount: panels.filter((panel) => Array.isArray(panel.widgets) && panel.widgets.length > 0).length,
+            actionPanelCount: panels.filter((panel) => Array.isArray(panel.actionButtons) && panel.actionButtons.length > 0).length,
+            multi: this.expansion.config?.accordion?.multi ?? false,
+            displayMode: this.expansion.config?.accordion?.displayMode || 'default',
+        };
+    }
+    getSchemaFields() {
+        return (this.getCurrentConfig().panels || []).map((panel, index) => ({
+            name: panel.id || panel.title || `panel-${index + 1}`,
+            label: panel.title || panel.id || `Painel ${index + 1}`,
+            disabled: !!panel.disabled,
+            expanded: !!panel.expanded,
+            hasContent: Array.isArray(panel.content) && panel.content.length > 0,
+            hasWidgets: Array.isArray(panel.widgets) && panel.widgets.length > 0,
+            hasActions: Array.isArray(panel.actionButtons) && panel.actionButtons.length > 0,
+        }));
+    }
+    getAuthoringContext() {
+        return {
+            authoringManifestRef: 'PRAXIS_EXPANSION_AUTHORING_MANIFEST',
+            runtimeAuthoringPolicy: {
+                mode: 'agentic-authoring',
+                enableCustomization: !!this.expansion.enableCustomization,
+                canApplyLocalPatch: false,
+                reason: 'praxis-expansion exige componentEditPlan validado pelo manifesto antes de aplicar mudancas runtime.',
+            },
+            domainCatalog: {
+                recommendedAuthoringFlow: 'component_authoring',
+            },
+        };
+    }
     createSnapshot() {
         return this.getCurrentConfig();
     }
@@ -184,6 +224,286 @@ class ExpansionAiAdapter extends BaseAiAdapter {
     }
 }
 
+class ExpansionAgenticAuthoringTurnFlow {
+    adapter;
+    aiApi;
+    mode = 'agentic-authoring';
+    constructor(adapter, aiApi) {
+        this.adapter = adapter;
+        this.aiApi = aiApi;
+    }
+    async submit(request) {
+        const prompt = (request.prompt ?? '').trim();
+        if (!prompt)
+            return { state: 'listening', phase: 'capture', statusText: '' };
+        const componentId = this.adapter.componentId || request.componentId || 'praxis-expansion';
+        const componentType = this.adapter.componentType || request.componentType || 'expansion';
+        const currentState = this.toAiJsonObject(this.adapter.getCurrentConfig());
+        const dataProfile = this.optionalJsonObject(this.adapter.getDataProfile?.());
+        const runtimeState = this.optionalJsonObject(this.adapter.getRuntimeState?.());
+        const schemaFields = this.adapter.getSchemaFields?.()
+            ?.map((field) => this.toAiJsonObject(field))
+            .filter((field) => Object.keys(field).length > 0);
+        const contextHints = this.mergeJsonObjects(this.optionalJsonObject(this.adapter.getAuthoringContext?.()), this.optionalJsonObject(request.action?.contextHints));
+        if (this.shouldRouteToGovernedDecision(prompt, contextHints)) {
+            return this.toGovernedDecisionHandoff(prompt, request);
+        }
+        const response = await firstValueFrom(this.aiApi.getPatch({
+            componentId,
+            componentType,
+            userPrompt: prompt,
+            sessionId: request.sessionId,
+            clientTurnId: request.clientTurnId,
+            messages: this.toChatMessages(request.messages, prompt),
+            currentState,
+            currentStateDigest: this.buildCurrentStateDigest(dataProfile),
+            uiContextRef: { componentId, componentType },
+            ...(dataProfile ? { dataProfile } : {}),
+            ...(runtimeState ? { runtimeState } : {}),
+            ...(schemaFields?.length ? { schemaFields } : {}),
+            ...(contextHints ? { contextHints } : {}),
+        }));
+        return this.toTurnResult(this.compileAdapterResponse(response), request);
+    }
+    async apply(_request) {
+        return {
+            state: 'error',
+            phase: 'apply',
+            assistantMessage: 'O expansion ainda exige componentEditPlan validado pelo manifesto antes de aplicar mudancas locais.',
+            errorText: 'Aplicacao local bloqueada ate existir compilacao manifest-backed para praxis-expansion.',
+            canApply: false,
+            pendingPatch: null,
+        };
+    }
+    cancel() {
+        return Promise.resolve({
+            state: 'listening',
+            phase: 'capture',
+            assistantMessage: 'Solicitacao cancelada.',
+            statusText: '',
+            canApply: false,
+            pendingPatch: null,
+            pendingClarification: null,
+        });
+    }
+    retry(request) {
+        const lastPrompt = [...(request.messages ?? [])].reverse()
+            .find((message) => message.role === 'user')?.text;
+        return this.submit({ ...request, prompt: lastPrompt ?? request.prompt, action: { kind: 'retry' } });
+    }
+    toTurnResult(response, request) {
+        if (!response) {
+            return { state: 'error', phase: 'capture', assistantMessage: 'Resposta vazia da IA.', errorText: 'Resposta vazia da IA.' };
+        }
+        if (response.type === 'clarification') {
+            return {
+                state: 'clarification',
+                phase: 'clarify',
+                sessionId: response.sessionId ?? request.sessionId,
+                observationId: response.observationId ?? request.observationId ?? null,
+                assistantMessage: response.message || 'Preciso de mais detalhes para continuar.',
+                clarificationQuestions: this.toClarificationQuestions(response),
+                quickReplies: this.toQuickReplies(response),
+                canApply: false,
+            };
+        }
+        if (response.type === 'info') {
+            const message = response.message || response.explanation || 'Informacao gerada.';
+            return { state: 'success', phase: 'summarize', sessionId: response.sessionId ?? request.sessionId, assistantMessage: message, statusText: message, canApply: false };
+        }
+        if (response.type === 'error') {
+            const message = response.message || 'Falha ao gerar alteracao de expansion.';
+            return {
+                state: 'error',
+                phase: 'capture',
+                sessionId: response.sessionId ?? request.sessionId,
+                observationId: response.observationId ?? request.observationId ?? null,
+                assistantMessage: message,
+                errorText: message,
+                diagnostics: response.warnings?.length ? { warnings: response.warnings } : undefined,
+            };
+        }
+        if (response.patch && Object.keys(response.patch).length > 0) {
+            return {
+                state: 'error',
+                phase: 'review',
+                sessionId: response.sessionId ?? request.sessionId,
+                observationId: response.observationId ?? request.observationId ?? null,
+                assistantMessage: 'O expansion rejeitou patch livre. Gere um componentEditPlan validado pelo PRAXIS_EXPANSION_AUTHORING_MANIFEST antes de propor alteracao local.',
+                errorText: 'Patch livre de expansion rejeitado.',
+                canApply: false,
+                pendingPatch: null,
+                diagnostics: {
+                    warnings: [
+                        'free-expansion-patch-rejected',
+                        'Use componentEditPlan validado contra PRAXIS_EXPANSION_AUTHORING_MANIFEST.',
+                    ],
+                },
+            };
+        }
+        return {
+            state: 'success',
+            phase: 'summarize',
+            sessionId: response.sessionId ?? request.sessionId,
+            observationId: response.observationId ?? request.observationId ?? null,
+            assistantMessage: response.message || response.explanation || 'Nenhuma alteracao necessaria.',
+            statusText: response.message || response.explanation || 'Nenhuma alteracao necessaria.',
+            canApply: false,
+        };
+    }
+    compileAdapterResponse(response) {
+        const compiled = this.adapter.compileAiResponse?.(response);
+        if (!compiled)
+            return response;
+        if (compiled.type === 'error') {
+            return {
+                type: 'error',
+                message: compiled.message || 'O componentEditPlan do expansion nao passou na validacao de capacidades.',
+                warnings: compiled.warnings,
+            };
+        }
+        const warnings = [...(response.warnings ?? []), ...(compiled.warnings ?? [])];
+        return { ...response, ...compiled, patch: compiled.patch, warnings: warnings.length ? warnings : undefined };
+    }
+    toChatMessages(messages, prompt) {
+        const supported = (messages ?? [])
+            .filter((message) => message.role === 'user' || message.role === 'assistant' || message.role === 'system')
+            .map((message) => ({ role: message.role, content: message.text }))
+            .filter((message) => message.content.trim().length > 0);
+        return supported.length ? supported : [{ role: 'user', content: prompt }];
+    }
+    toClarificationQuestions(response) {
+        const labels = response.questions?.length
+            ? response.questions
+            : response.message ? [response.message] : ['Qual ajuste voce quer aplicar nos paineis?'];
+        const options = this.toQuickReplies(response).map((reply) => ({
+            id: reply.id,
+            label: reply.label,
+            value: reply.prompt,
+            description: reply.description ?? undefined,
+            contextHints: reply.contextHints ? { ...reply.contextHints } : undefined,
+        }));
+        return labels.map((label, index) => ({
+            id: `expansion-clarification-${index + 1}`,
+            type: options.length ? 'single-choice' : 'text',
+            label,
+            allowCustom: true,
+            options,
+        }));
+    }
+    toQuickReplies(response) {
+        const payloads = response.optionPayloads ?? [];
+        if (payloads.length) {
+            return payloads.map((option, index) => {
+                const label = option.label?.trim() || option.value?.trim() || `Opcao ${index + 1}`;
+                const prompt = option.value?.trim() || option.example?.trim() || label;
+                return {
+                    id: `option-${index + 1}`,
+                    label,
+                    prompt,
+                    kind: 'clarification-option',
+                    description: option.example?.trim() || undefined,
+                    contextHints: this.optionalJsonObject(option.contextHints),
+                };
+            });
+        }
+        return (response.options ?? [])
+            .filter((option) => !!option?.trim())
+            .map((option, index) => ({ id: `option-${index + 1}`, label: option.trim(), prompt: option.trim(), kind: 'clarification-option' }));
+    }
+    buildCurrentStateDigest(dataProfile) {
+        const panelCount = typeof dataProfile?.['panelCount'] === 'number' ? dataProfile['panelCount'] : undefined;
+        return panelCount !== undefined ? { rowCount: panelCount } : {};
+    }
+    shouldRouteToGovernedDecision(prompt, contextHints) {
+        return shouldRoutePromptToGovernedDecision(prompt, contextHints);
+    }
+    toGovernedDecisionHandoff(prompt, request) {
+        const message = 'Esse pedido parece alterar uma decisao de negocio compartilhada. O expansion pode localizar o painel e a experiencia afetada, mas a regra deve seguir pelo fluxo governado de domain-rules antes de qualquer materializacao runtime.';
+        return {
+            state: 'clarification',
+            phase: 'clarify',
+            sessionId: request.sessionId,
+            assistantMessage: message,
+            statusText: 'Handoff governado necessario.',
+            canApply: false,
+            quickReplies: [
+                {
+                    id: 'shared-rule-handoff',
+                    label: 'Continuar como regra governada',
+                    prompt,
+                    kind: 'shared-rule-handoff',
+                    description: 'Criar intake de domain-rules em vez de aplicar patch local no expansion.',
+                    icon: 'rule',
+                    tone: 'warning',
+                    contextHints: {
+                        flowId: 'shared_rule_authoring',
+                        source: 'praxis-expansion',
+                        recommendedAction: 'domain-rules/intake',
+                    },
+                },
+            ],
+            clarificationQuestions: [
+                {
+                    id: 'expansion-governed-rule-confirmation',
+                    type: 'confirm',
+                    label: 'Deseja continuar pelo fluxo governado de regras compartilhadas?',
+                    description: 'Esse caminho permite intake, simulacao, aprovacao/publicacao, materializacao e validacao de enforcement.',
+                    required: true,
+                    options: [
+                        {
+                            id: 'shared-rule-handoff',
+                            label: 'Sim, continuar governado',
+                            value: prompt,
+                            description: 'Nao aplicar como patch local do expansion.',
+                            contextHints: { flowId: 'shared_rule_authoring', source: 'praxis-expansion' },
+                        },
+                    ],
+                },
+            ],
+            diagnostics: {
+                governedDecisionHandoff: {
+                    flowId: 'shared_rule_authoring',
+                    sourcePrompt: prompt,
+                    sourceComponent: 'praxis-expansion',
+                },
+            },
+        };
+    }
+    optionalJsonObject(value) {
+        if (value === undefined || value === null)
+            return undefined;
+        const object = this.toAiJsonObject(value);
+        return Object.keys(object).length ? object : undefined;
+    }
+    mergeJsonObjects(base, overlay) {
+        if (!base)
+            return overlay;
+        if (!overlay)
+            return base;
+        return {
+            ...base,
+            ...overlay,
+        };
+    }
+    toAiJsonObject(value) {
+        const record = this.toRecord(value);
+        if (!record)
+            return {};
+        try {
+            return JSON.parse(JSON.stringify(record));
+        }
+        catch {
+            return {};
+        }
+    }
+    toRecord(value) {
+        return value && typeof value === 'object' && !Array.isArray(value)
+            ? value
+            : null;
+    }
+}
+
 class PraxisExpansion {
     config;
     expansionId;
@@ -211,9 +531,35 @@ class PraxisExpansion {
     catch {
         return undefined;
     } })();
+    aiApi = inject(AiBackendApiService);
+    assistantSessions = inject(PraxisAssistantSessionRegistryService);
+    aiTurnOrchestrator = inject(PraxisAssistantTurnOrchestratorService);
+    aiAssistantSessionEffect = effect(() => {
+        const session = this.assistantSessions.activeSession();
+        if (!session || session.id !== this.resolveAiAssistantSessionId())
+            return;
+        if (!this.aiAssistantOpen) {
+            this.openAiAssistantFromSession(session);
+        }
+    }, ...(ngDevMode ? [{ debugName: "aiAssistantSessionEffect" }] : /* istanbul ignore next */ []));
     warnedMissingId = false;
     panelForms = new Map();
     aiAdapter = new ExpansionAiAdapter(this);
+    aiAssistantOpen = false;
+    aiAssistantPrompt = '';
+    aiAssistantViewState = null;
+    aiAssistantLayout = createPraxisAssistantViewportLayout();
+    aiAssistantLabels = {
+        title: 'Copiloto semantico Praxis',
+        subtitle: 'Converse, revise e governe ajustes dos paineis.',
+        prompt: 'Mensagem',
+        promptPlaceholder: 'Descreva o ajuste que voce precisa nos paineis.',
+        emptyConversation: 'Diga o que voce quer alterar no expansion.',
+        submit: 'Interpretar pedido',
+        apply: 'Aplicar ajuste',
+    };
+    aiAssistantController = null;
+    aiAssistantStateSubscription = null;
     accordionRef;
     panels;
     injectedDefaults = inject(MAT_EXPANSION_PANEL_DEFAULT_OPTIONS, { optional: true });
@@ -237,6 +583,10 @@ class PraxisExpansion {
             this.persistConfig(this.config);
         }
     }
+    ngOnDestroy() {
+        this.assistantSessions.removeContextSession(this.buildAiAssistantContextSnapshot().identity);
+        this.aiAssistantStateSubscription?.unsubscribe();
+    }
     styleCss() {
         const t = this.config?.appearance?.tokens;
         const appearance = this.config?.appearance;
@@ -476,6 +826,315 @@ class PraxisExpansion {
         }
         this.cdr.markForCheck();
     }
+    openAiAssistant() {
+        this.initializeAiAssistantController();
+        this.aiAssistantOpen = true;
+        this.aiAssistantController?.setContextItems(this.buildAiAssistantContextItems());
+        this.syncAiAssistantSession('active');
+        this.cdr.markForCheck();
+    }
+    openAiAssistantFromSession(session) {
+        if (session.id !== this.resolveAiAssistantSessionId())
+            return;
+        this.initializeAiAssistantController();
+        this.aiAssistantOpen = true;
+        this.aiAssistantController?.setContextItems(this.buildAiAssistantContextItems());
+        this.syncAiAssistantSession('active');
+        this.cdr.markForCheck();
+    }
+    closeAiAssistant() {
+        this.aiAssistantOpen = false;
+        this.syncAiAssistantSession('minimized');
+        this.cdr.markForCheck();
+    }
+    onAiAssistantPromptChange(prompt) {
+        this.aiAssistantPrompt = prompt;
+        this.syncAiAssistantSession();
+    }
+    onAiAssistantSubmit(prompt) {
+        this.aiAssistantController?.submitPrompt(prompt).subscribe((state) => {
+            this.aiAssistantPrompt = '';
+            this.aiAssistantViewState = state;
+            this.syncAiAssistantSession();
+            this.cdr.markForCheck();
+        });
+    }
+    onAiAssistantApply() {
+        this.aiAssistantController?.apply().subscribe((state) => {
+            this.aiAssistantViewState = state;
+            this.syncAiAssistantSession();
+            this.cdr.markForCheck();
+        });
+    }
+    onAiAssistantRetry() {
+        this.aiAssistantController?.retry().subscribe((state) => {
+            this.aiAssistantViewState = state;
+            this.syncAiAssistantSession();
+            this.cdr.markForCheck();
+        });
+    }
+    onAiAssistantCancel() {
+        this.aiAssistantController?.cancel().subscribe((state) => {
+            this.aiAssistantPrompt = '';
+            this.aiAssistantViewState = state;
+            this.syncAiAssistantSession();
+            this.cdr.markForCheck();
+        });
+    }
+    onAiAssistantQuickReply(reply) {
+        const controller = this.aiAssistantController;
+        if (!controller)
+            return;
+        const state = controller.snapshot();
+        const contextHints = reply.contextHints ? { ...reply.contextHints } : undefined;
+        const next$ = state.state === 'clarification'
+            ? controller.answerClarification({
+                id: reply.id,
+                label: reply.label,
+                value: reply.prompt,
+                description: reply.description ?? undefined,
+                contextHints,
+            })
+            : controller.submitPrompt(reply.prompt, {
+                kind: reply.kind || 'quick-reply',
+                id: reply.id,
+                value: reply.prompt,
+                displayPrompt: reply.label,
+                contextHints,
+            });
+        next$.subscribe((nextState) => {
+            this.aiAssistantPrompt = '';
+            this.aiAssistantViewState = nextState;
+            this.syncAiAssistantSession();
+            this.cdr.markForCheck();
+        });
+    }
+    onAiAssistantEditMessage(message) {
+        this.aiAssistantPrompt = message.text;
+        this.cdr.markForCheck();
+    }
+    onAiAssistantResendMessage(message) {
+        this.aiAssistantController?.resendMessage(message.id).subscribe((state) => {
+            this.aiAssistantPrompt = '';
+            this.aiAssistantViewState = state;
+            this.syncAiAssistantSession();
+            this.cdr.markForCheck();
+        });
+    }
+    onAiAssistantLayoutChange(layout) {
+        this.aiAssistantLayout = layout;
+    }
+    buildAiAssistantContextItems() {
+        const panels = this.config?.panels ?? [];
+        const items = [
+            {
+                id: 'component',
+                label: 'Componente',
+                value: 'Expansion',
+                kind: 'component',
+                icon: 'unfold_more',
+            },
+            {
+                id: 'expansion-id',
+                label: 'Expansion',
+                value: this.safeAiAssistantExpansionId(),
+                kind: 'custom',
+                icon: 'tag',
+            },
+            {
+                id: 'panels',
+                label: 'Paineis',
+                value: String(panels.length),
+                kind: 'custom',
+                icon: 'view_agenda',
+            },
+        ];
+        const expanded = panels.filter((panel) => panel.expanded).length;
+        if (expanded > 0) {
+            items.push({
+                id: 'expanded-panels',
+                label: 'Expandidos',
+                value: String(expanded),
+                kind: 'custom',
+                icon: 'expand_less',
+            });
+        }
+        return items;
+    }
+    initializeAiAssistantController() {
+        if (this.aiAssistantController)
+            return;
+        const flow = new ExpansionAgenticAuthoringTurnFlow(this.aiAdapter, this.aiApi);
+        const controller = this.aiTurnOrchestrator.createController(flow, {
+            componentId: this.aiAdapter.componentId || 'praxis-expansion',
+            componentType: this.aiAdapter.componentType || 'expansion',
+            contextItems: this.buildAiAssistantContextItems(),
+        });
+        this.aiAssistantController = controller;
+        this.aiAssistantViewState = controller.snapshot();
+        this.aiAssistantStateSubscription?.unsubscribe();
+        this.aiAssistantStateSubscription = controller.state$.subscribe((state) => {
+            this.aiAssistantViewState = state;
+            this.syncAiAssistantSession();
+            this.cdr.markForCheck();
+        });
+        this.cdr.markForCheck();
+    }
+    buildAiAssistantContextSnapshot() {
+        const counts = this.collectAiAssistantCounts();
+        const panelNames = this.collectAiAssistantPanelNames();
+        return {
+            identity: {
+                sessionId: this.resolveAiAssistantSessionId(),
+                ownerId: this.resolveAiAssistantOwnerId(),
+                ownerType: 'expansion',
+                componentId: 'praxis-expansion',
+                componentType: 'expansion',
+                routeKey: this.resolveAiAssistantRouteKey(),
+            },
+            target: {
+                kind: 'component',
+                id: this.resolveAiAssistantOwnerId(),
+                label: this.safeAiAssistantExpansionId(),
+                metadata: {
+                    expansionId: this.safeAiAssistantExpansionId(),
+                    hasCustomization: !!this.enableCustomization,
+                },
+            },
+            contextItems: this.buildAiAssistantContextItems().map((item) => ({
+                id: item.id,
+                label: item.label,
+                value: item.value || '',
+                kind: item.kind,
+            })),
+            mode: 'agentic-authoring',
+            authoringManifestRef: {
+                componentId: 'praxis-expansion',
+                source: 'PRAXIS_EXPANSION_AUTHORING_MANIFEST',
+            },
+            schemaFields: panelNames.length ? panelNames : undefined,
+            dataProfileDigest: {
+                summary: `${counts.panelCount} painel(is), ${counts.contentPanelCount} com campo(s), ${counts.widgetPanelCount} com widget(s)`,
+                counts,
+            },
+            runtimeStateDigest: {
+                summary: `Expansion ${this.config?.accordion?.multi ? 'multi' : 'single'}, ${counts.expandedCount} painel(is) expandido(s)`,
+                fields: [
+                    'panels',
+                    'accordion',
+                    'content',
+                    'widgets',
+                ],
+            },
+            capabilityRefs: [
+                {
+                    id: 'expansion.component-edit-plan',
+                    label: 'Plano de edicao de paineis',
+                    source: 'PRAXIS_EXPANSION_AUTHORING_MANIFEST',
+                    risk: 'medium',
+                },
+            ],
+            governanceHints: [
+                {
+                    kind: 'business-rule-boundary',
+                    label: 'Regras compartilhadas exigem governanca',
+                    reason: 'Politicas de acesso, validacoes reutilizaveis e compliance nao devem ser aplicadas como patch local do expansion.',
+                    risk: 'high',
+                },
+            ],
+        };
+    }
+    syncAiAssistantSession(visibility = null) {
+        if (!this.enableCustomization)
+            return;
+        if (!this.aiAssistantOpen && !this.hasAiAssistantSessionState() && visibility !== 'minimized')
+            return;
+        const state = this.aiAssistantViewState;
+        this.assistantSessions.upsertContextSession(this.buildAiAssistantContextSnapshot(), {
+            title: 'Copiloto semantico Praxis',
+            summary: this.resolveAiAssistantSummary(),
+            mode: state?.mode || 'agentic-authoring',
+            state: state?.state || 'idle',
+            visibility: visibility ?? (this.aiAssistantOpen ? 'active' : 'minimized'),
+            badge: this.resolveAiAssistantBadge(),
+            icon: this.resolveAiAssistantIcon(),
+        });
+    }
+    hasAiAssistantSessionState() {
+        return !!this.aiAssistantPrompt.trim()
+            || !!this.aiAssistantViewState?.messages?.length
+            || !!this.aiAssistantViewState?.quickReplies?.length
+            || !!this.aiAssistantViewState?.pendingPatch
+            || !!this.aiAssistantViewState?.statusText?.trim()
+            || !!this.aiAssistantViewState?.errorText?.trim();
+    }
+    resolveAiAssistantSessionId() {
+        return `expansion:${this.resolveAiAssistantRouteKey()}:${this.resolveAiAssistantOwnerId()}`;
+    }
+    resolveAiAssistantOwnerId() {
+        return (this.componentInstanceId || this.safeAiAssistantExpansionId() || 'expansion').trim() || 'expansion';
+    }
+    safeAiAssistantExpansionId() {
+        return String(this.expansionId || '').trim();
+    }
+    resolveAiAssistantRouteKey() {
+        const routePath = this.route?.snapshot?.routeConfig?.path?.trim();
+        return routePath || 'local';
+    }
+    resolveAiAssistantSummary() {
+        const status = this.aiAssistantViewState?.statusText?.trim();
+        if (status)
+            return status;
+        const error = this.aiAssistantViewState?.errorText?.trim();
+        if (error)
+            return error;
+        const prompt = this.aiAssistantPrompt.trim();
+        if (prompt)
+            return prompt.length > 96 ? `${prompt.slice(0, 93)}...` : prompt;
+        const lastMessage = [...(this.aiAssistantViewState?.messages ?? [])].reverse()
+            .find((message) => message.role === 'assistant' || message.role === 'user');
+        if (lastMessage?.text) {
+            return lastMessage.text.length > 96 ? `${lastMessage.text.slice(0, 93)}...` : lastMessage.text;
+        }
+        return 'Assistente contextual dos paineis.';
+    }
+    resolveAiAssistantBadge() {
+        const state = this.aiAssistantViewState?.state;
+        if (state === 'error')
+            return 'erro';
+        if (state === 'clarification')
+            return 'revisar';
+        if (state === 'review')
+            return 'preview';
+        if (state === 'success')
+            return 'ok';
+        return undefined;
+    }
+    resolveAiAssistantIcon() {
+        const state = this.aiAssistantViewState?.state;
+        if (state === 'error')
+            return 'error';
+        if (state === 'clarification')
+            return 'rule';
+        if (state === 'review')
+            return 'rate_review';
+        return 'auto_awesome';
+    }
+    collectAiAssistantPanelNames() {
+        return Array.from(new Set((this.config?.panels ?? [])
+            .map((panel, index) => panel.id || panel.title || `panel-${index + 1}`)
+            .filter((name) => typeof name === 'string' && !!name.trim())));
+    }
+    collectAiAssistantCounts() {
+        const panels = this.config?.panels ?? [];
+        return {
+            panelCount: panels.length,
+            contentPanelCount: panels.filter((panel) => Array.isArray(panel.content) && panel.content.length > 0).length,
+            widgetPanelCount: panels.filter((panel) => Array.isArray(panel.widgets) && panel.widgets.length > 0).length,
+            actionPanelCount: panels.filter((panel) => Array.isArray(panel.actionButtons) && panel.actionButtons.length > 0).length,
+            expandedCount: panels.filter((panel) => !!panel.expanded).length,
+        };
+    }
     openEditor() {
         const key = this.storageKey() || this.expansionId || 'default';
         const ref = this.settings.open({
@@ -558,8 +1217,8 @@ class PraxisExpansion {
         this.warnedMissingId = true;
         console.warn('[PraxisExpansion] expansionId is required for config persistence.');
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: PraxisExpansion, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.17", type: PraxisExpansion, isStandalone: true, selector: "praxis-expansion", inputs: { config: "config", expansionId: "expansionId", componentInstanceId: "componentInstanceId", context: "context", strictValidation: "strictValidation", enableCustomization: "enableCustomization", defaultOptions: "defaultOptions" }, outputs: { opened: "opened", closed: "closed", expandedChange: "expandedChange", afterExpand: "afterExpand", afterCollapse: "afterCollapse", destroyed: "destroyed", widgetEvent: "widgetEvent" }, viewQueries: [{ propertyName: "accordionRef", first: true, predicate: ["accordion"], descendants: true }, { propertyName: "panels", predicate: ["panel"], descendants: true, read: MatExpansionPanel }], usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PraxisExpansion, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: PraxisExpansion, isStandalone: true, selector: "praxis-expansion", inputs: { config: "config", expansionId: "expansionId", componentInstanceId: "componentInstanceId", context: "context", strictValidation: "strictValidation", enableCustomization: "enableCustomization", defaultOptions: "defaultOptions" }, outputs: { opened: "opened", closed: "closed", expandedChange: "expandedChange", afterExpand: "afterExpand", afterCollapse: "afterCollapse", destroyed: "destroyed", widgetEvent: "widgetEvent" }, viewQueries: [{ propertyName: "accordionRef", first: true, predicate: ["accordion"], descendants: true }, { propertyName: "panels", predicate: ["panel"], descendants: true, read: MatExpansionPanel }], usesOnChanges: true, ngImport: i0, template: `
     <div
       class="praxis-expansion-root"
       [class.density-compact]="config?.appearance?.density === 'compact'"
@@ -567,16 +1226,59 @@ class PraxisExpansion {
       [class.density-spacious]="config?.appearance?.density === 'spacious'"
       [ngClass]="config?.appearance?.themeClass || ''"
       [attr.data-expansion-id]="expansionId || 'default'"
-    >
-      <style *ngIf="config?.appearance?.customCss" [innerHTML]="config?.appearance?.customCss"></style>
-      <style *ngIf="styleCss() as s" [innerHTML]="s"></style>
-
+      >
+      @if (config?.appearance?.customCss) {
+        <style [innerHTML]="config?.appearance?.customCss"></style>
+      }
+      @if (styleCss(); as s) {
+        <style [innerHTML]="s"></style>
+      }
+    
       @if (enableCustomization) {
         <div class="expansion-ai-assistant">
-          <praxis-ai-assistant [adapter]="aiAdapter"></praxis-ai-assistant>
+          <button
+            mat-mini-fab
+            color="primary"
+            type="button"
+            class="expansion-ai-assistant-trigger"
+            aria-label="Abrir copiloto semantico Praxis dos paineis"
+            data-testid="praxis-expansion-ai-assistant-trigger"
+            (click)="openAiAssistant()"
+            >
+            <mat-icon [praxisIcon]="'auto_awesome'"></mat-icon>
+          </button>
         </div>
       }
-
+    
+      @if (aiAssistantOpen && aiAssistantViewState) {
+        <praxis-ai-assistant-shell
+          [labels]="aiAssistantLabels"
+          [mode]="aiAssistantViewState.mode"
+          [state]="aiAssistantViewState.state"
+          [contextItems]="aiAssistantViewState.contextItems"
+          [attachments]="aiAssistantViewState.attachments"
+          [messages]="aiAssistantViewState.messages"
+          [quickReplies]="aiAssistantViewState.quickReplies"
+          [prompt]="aiAssistantPrompt"
+          [statusText]="aiAssistantViewState.statusText"
+          [errorText]="aiAssistantViewState.errorText"
+          [busy]="aiAssistantViewState.state === 'processing' || aiAssistantViewState.state === 'applying'"
+          [canApply]="aiAssistantViewState.canApply"
+          [layout]="aiAssistantLayout"
+          testIdPrefix="praxis-expansion-ai-assistant"
+          (promptChange)="onAiAssistantPromptChange($event)"
+          (submitPrompt)="onAiAssistantSubmit($event)"
+          (apply)="onAiAssistantApply()"
+          (retryTurn)="onAiAssistantRetry()"
+          (cancelTurn)="onAiAssistantCancel()"
+          (quickReply)="onAiAssistantQuickReply($event)"
+          (editMessage)="onAiAssistantEditMessage($event)"
+          (resendMessage)="onAiAssistantResendMessage($event)"
+          (layoutChange)="onAiAssistantLayoutChange($event)"
+          (close)="closeAiAssistant()"
+        ></praxis-ai-assistant-shell>
+      }
+    
       @if (hasMultiple()) {
         <mat-accordion
           #accordion
@@ -585,7 +1287,7 @@ class PraxisExpansion {
           [displayMode]="config?.accordion?.displayMode || 'default'"
           [togglePosition]="config?.accordion?.togglePosition || 'after'"
           [hideToggle]="config?.accordion?.hideToggle || false"
-        >
+          >
           @for (p of (config?.panels || []); let i = $index; track p.id ?? i) {
             @let id = panelDomId(p, i);
             <mat-expansion-panel
@@ -600,15 +1302,20 @@ class PraxisExpansion {
               (afterExpand)="emitAfterExpand(p, i)"
               (afterCollapse)="emitAfterCollapse(p, i)"
               (destroyed)="emitDestroyed(p, i)"
-            >
+              >
               <mat-expansion-panel-header
                 [collapsedHeight]="p.collapsedHeight || (defaultOptions?.collapsedHeight || injectedDefaults?.collapsedHeight) || ''"
                 [expandedHeight]="p.expandedHeight || (defaultOptions?.expandedHeight || injectedDefaults?.expandedHeight) || ''"
-              >
+                >
+                @if (p.icon) {
+                  <mat-icon [praxisIcon]="p.icon"></mat-icon>
+                }
                 <mat-panel-title>{{ p.title }}</mat-panel-title>
-                <mat-panel-description *ngIf="p.description">{{ p.description }}</mat-panel-description>
+                @if (p.description) {
+                  <mat-panel-description>{{ p.description }}</mat-panel-description>
+                }
               </mat-expansion-panel-header>
-
+    
               <ng-template matExpansionPanelContent>
                 @if (p.content?.length) {
                   <ng-container
@@ -617,7 +1324,7 @@ class PraxisExpansion {
                     [formGroup]="panelFormFor(p, i)"
                   ></ng-container>
                 }
-
+    
                 @if (p.widgets?.length) {
                   @for (w of p.widgets; let wi = $index; track wi) {
                     <ng-container
@@ -628,12 +1335,14 @@ class PraxisExpansion {
                     ></ng-container>
                   }
                 }
-
+    
                 @if (p.actionButtons?.length) {
                   <mat-action-row>
                     @for (a of p.actionButtons; track a.label) {
                       <button mat-stroked-button (click)="emitAction(p, i, a.action)">
-                        <mat-icon *ngIf="a.icon" [praxisIcon]="a.icon"></mat-icon>
+                        @if (a.icon) {
+                          <mat-icon [praxisIcon]="a.icon"></mat-icon>
+                        }
                         {{ a.label }}
                       </button>
                     }
@@ -657,15 +1366,20 @@ class PraxisExpansion {
             (afterExpand)="emitAfterExpand(p, 0)"
             (afterCollapse)="emitAfterCollapse(p, 0)"
             (destroyed)="emitDestroyed(p, 0)"
-          >
+            >
             <mat-expansion-panel-header
               [collapsedHeight]="p.collapsedHeight || (defaultOptions?.collapsedHeight || injectedDefaults?.collapsedHeight) || ''"
               [expandedHeight]="p.expandedHeight || (defaultOptions?.expandedHeight || injectedDefaults?.expandedHeight) || ''"
-            >
+              >
+              @if (p.icon) {
+                <mat-icon [praxisIcon]="p.icon"></mat-icon>
+              }
               <mat-panel-title>{{ p.title }}</mat-panel-title>
-              <mat-panel-description *ngIf="p.description">{{ p.description }}</mat-panel-description>
+              @if (p.description) {
+                <mat-panel-description>{{ p.description }}</mat-panel-description>
+              }
             </mat-expansion-panel-header>
-
+    
             <ng-template matExpansionPanelContent>
               @if (p.content?.length) {
                 <ng-container
@@ -674,7 +1388,7 @@ class PraxisExpansion {
                   [formGroup]="panelFormFor(p, 0)"
                 ></ng-container>
               }
-
+    
               @if (p.widgets?.length) {
                 @for (w of p.widgets; let wi = $index; track wi) {
                   <ng-container
@@ -685,12 +1399,14 @@ class PraxisExpansion {
                   ></ng-container>
                 }
               }
-
+    
               @if (p.actionButtons?.length) {
                 <mat-action-row>
                   @for (a of p.actionButtons; track a.label) {
                     <button mat-stroked-button (click)="emitAction(p, 0, a.action)">
-                      <mat-icon *ngIf="a.icon" [praxisIcon]="a.icon"></mat-icon>
+                      @if (a.icon) {
+                        <mat-icon [praxisIcon]="a.icon"></mat-icon>
+                      }
                       {{ a.label }}
                     </button>
                   }
@@ -701,26 +1417,29 @@ class PraxisExpansion {
         } @else {
           <div class="praxis-expansion-empty">
             <span>Nenhum painel configurado</span>
-            <button mat-stroked-button color="primary" *ngIf="enableCustomization" (click)="openEditor()">
-              <mat-icon [praxisIcon]="'tune'"></mat-icon> Configurar
-            </button>
+            @if (enableCustomization) {
+              <button mat-stroked-button color="primary" (click)="openEditor()">
+                <mat-icon [praxisIcon]="'tune'"></mat-icon> Configurar
+              </button>
+            }
           </div>
         }
       }
     </div>
     <!-- Edit button -->
-    <button
-      *ngIf="enableCustomization"
-      mat-fab
-      class="edit-fab"
-      aria-label="Editar painéis"
-      (click)="openEditor()"
-    >
-      <mat-icon fontIcon="edit"></mat-icon>
-    </button>
-  `, isInline: true, styles: [":host{display:block;position:relative;color:var(--md-sys-color-on-surface)}.praxis-expansion-root{display:block;--p-exp-surface: var(--md-sys-color-surface);--p-exp-surface-container: var(--md-sys-color-surface-container);--p-exp-border: var(--md-sys-color-outline-variant);--p-exp-text: var(--md-sys-color-on-surface);--p-exp-text-muted: var(--md-sys-color-on-surface-variant);--p-exp-focus: var(--md-sys-color-primary);--p-exp-radius: 12px}.mat-expansion-panel{background:var(--p-exp-surface);border:1px solid var(--p-exp-border);border-radius:var(--p-exp-radius);overflow:hidden}.mat-expansion-panel:not(:last-child){margin-bottom:var(--p-exp-panel-gap, 12px)}.mat-expansion-panel-header{background:var(--p-exp-surface-container);color:var(--p-exp-text)}.mat-expansion-panel-header:focus-visible{outline:2px solid var(--p-exp-focus);outline-offset:-2px}.mat-expansion-panel-header-title{font-weight:600}.mat-expansion-panel-header-description{color:var(--p-exp-text-muted)}.mat-expansion-panel-body{padding:12px 16px 16px}.mat-action-row{border-top:1px solid var(--p-exp-border)}.density-compact .mat-expansion-panel-body{padding:8px 12px 12px}.density-compact .mat-expansion-panel-header{min-height:40px;padding:0 12px}.density-comfortable .mat-expansion-panel-body{padding:12px 16px 16px}.density-comfortable .mat-expansion-panel-header{min-height:48px;padding:0 16px}.density-spacious .mat-expansion-panel-body{padding:16px 20px 20px}.density-spacious .mat-expansion-panel-header{min-height:56px;padding:0 20px}.praxis-expansion-empty{display:flex;gap:8px;align-items:center;padding:8px 12px;color:var(--p-exp-text-muted)}.edit-fab{position:absolute;right:12px;bottom:12px;z-index:2}.expansion-ai-assistant{position:absolute;right:12px;bottom:72px;z-index:3}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i2.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i2.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: i2.MatExpansionPanelActionRow, selector: "mat-action-row" }, { kind: "component", type: i2.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i2.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i2.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "directive", type: i2.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: DynamicFieldLoaderDirective, selector: "[dynamicFieldLoader]", inputs: ["fields", "formGroup", "enableExternalControlBinding", "itemTemplate", "debugTrace", "debugTraceLabel", "readonlyMode", "disabledMode", "presentationMode", "visible", "canvasMode"], outputs: ["componentsCreated", "fieldCreated", "fieldDestroyed", "renderError", "canvasMouseEnter", "canvasMouseLeave", "canvasClick"] }, { kind: "directive", type: DynamicWidgetLoaderDirective, selector: "[dynamicWidgetLoader]", inputs: ["dynamicWidgetLoader", "ownerWidgetKey", "context", "strictValidation", "autoWireOutputs"], outputs: ["widgetEvent", "widgetDiagnostic"], exportAs: ["dynamicWidgetLoader"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "component", type: PraxisAiAssistantComponent, selector: "praxis-ai-assistant", inputs: ["adapter", "riskPolicy", "allowManualPatchEdit"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    @if (enableCustomization) {
+      <button
+        mat-fab
+        class="edit-fab"
+        aria-label="Editar painéis"
+        (click)="openEditor()"
+        >
+        <mat-icon fontIcon="edit"></mat-icon>
+      </button>
+    }
+    `, isInline: true, styles: [":host{display:block;position:relative;color:var(--md-sys-color-on-surface)}.praxis-expansion-root{display:block;--p-exp-surface: var(--md-sys-color-surface);--p-exp-surface-container: var(--md-sys-color-surface-container);--p-exp-border: var(--md-sys-color-outline-variant);--p-exp-text: var(--md-sys-color-on-surface);--p-exp-text-muted: var(--md-sys-color-on-surface-variant);--p-exp-focus: var(--md-sys-color-primary);--p-exp-radius: 12px}.mat-expansion-panel{background:var(--p-exp-surface);border:1px solid var(--p-exp-border);border-radius:var(--p-exp-radius);overflow:hidden}.mat-expansion-panel:not(:last-child){margin-bottom:var(--p-exp-panel-gap, 12px)}.mat-expansion-panel-header{background:var(--p-exp-surface-container);color:var(--p-exp-text)}.mat-expansion-panel-header:focus-visible{outline:2px solid var(--p-exp-focus);outline-offset:-2px}.mat-expansion-panel-header-title{font-weight:600}.mat-expansion-panel-header-description{color:var(--p-exp-text-muted)}.mat-expansion-panel-body{padding:12px 16px 16px}.mat-action-row{border-top:1px solid var(--p-exp-border)}.density-compact .mat-expansion-panel-body{padding:8px 12px 12px}.density-compact .mat-expansion-panel-header{min-height:40px;padding:0 12px}.density-comfortable .mat-expansion-panel-body{padding:12px 16px 16px}.density-comfortable .mat-expansion-panel-header{min-height:48px;padding:0 16px}.density-spacious .mat-expansion-panel-body{padding:16px 20px 20px}.density-spacious .mat-expansion-panel-header{min-height:56px;padding:0 20px}.praxis-expansion-empty{display:flex;gap:8px;align-items:center;padding:8px 12px;color:var(--p-exp-text-muted)}.edit-fab{position:absolute;right:12px;bottom:12px;z-index:2}.expansion-ai-assistant{position:absolute;right:12px;bottom:72px;z-index:3}.expansion-ai-assistant-trigger{box-shadow:var(--md-sys-elevation-level2, 0 4px 12px rgba(0, 0, 0, .18))}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "directive", type: i2.MatAccordion, selector: "mat-accordion", inputs: ["hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i2.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: i2.MatExpansionPanelActionRow, selector: "mat-action-row" }, { kind: "component", type: i2.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i2.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i2.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "directive", type: i2.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatMiniFabButton, selector: "button[mat-mini-fab], a[mat-mini-fab], button[matMiniFab], a[matMiniFab]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatFabButton, selector: "button[mat-fab], a[mat-fab], button[matFab], a[matFab]", inputs: ["extended"], exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: DynamicFieldLoaderDirective, selector: "[dynamicFieldLoader]", inputs: ["fields", "formGroup", "enableExternalControlBinding", "itemTemplate", "debugTrace", "debugTraceLabel", "readonlyMode", "disabledMode", "presentationMode", "visible", "canvasMode"], outputs: ["componentsCreated", "fieldCreated", "fieldDestroyed", "renderError", "canvasMouseEnter", "canvasMouseLeave", "canvasClick", "canvasFocus"] }, { kind: "directive", type: DynamicWidgetLoaderDirective, selector: "[dynamicWidgetLoader]", inputs: ["dynamicWidgetLoader", "ownerWidgetKey", "context", "strictValidation", "autoWireOutputs"], outputs: ["widgetEvent", "widgetDiagnostic"], exportAs: ["dynamicWidgetLoader"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "component", type: PraxisAiAssistantShellComponent, selector: "praxis-ai-assistant-shell", inputs: ["labels", "mode", "state", "contextItems", "attachments", "messages", "quickReplies", "recommendedIntents", "prompt", "statusText", "errorText", "testIdPrefix", "panelTestId", "submitTestId", "applyTestId", "primaryAction", "secondaryActions", "governanceActions", "busy", "canSubmit", "canApply", "submitOnEnter", "showAttachAction", "enablePastedAttachments", "enableFileAttachments", "attachmentAccept", "attachmentMultiple", "voiceInputMode", "voiceLanguage", "draggable", "resizable", "minWidth", "minHeight", "margin", "layout"], outputs: ["promptChange", "submitPrompt", "apply", "retryTurn", "cancelTurn", "shellAction", "close", "attach", "attachmentsPasted", "attachmentsSelected", "removeAttachment", "messageAction", "editMessage", "resendMessage", "quickReply", "recommendedIntent", "layoutChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: PraxisExpansion, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PraxisExpansion, decorators: [{
             type: Component,
             args: [{ selector: 'praxis-expansion', standalone: true, imports: [
                         CommonModule,
@@ -730,7 +1449,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
                         DynamicFieldLoaderDirective,
                         DynamicWidgetLoaderDirective,
                         PraxisIconDirective,
-                        PraxisAiAssistantComponent,
+                        PraxisAiAssistantShellComponent,
                     ], template: `
     <div
       class="praxis-expansion-root"
@@ -739,16 +1458,59 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
       [class.density-spacious]="config?.appearance?.density === 'spacious'"
       [ngClass]="config?.appearance?.themeClass || ''"
       [attr.data-expansion-id]="expansionId || 'default'"
-    >
-      <style *ngIf="config?.appearance?.customCss" [innerHTML]="config?.appearance?.customCss"></style>
-      <style *ngIf="styleCss() as s" [innerHTML]="s"></style>
-
+      >
+      @if (config?.appearance?.customCss) {
+        <style [innerHTML]="config?.appearance?.customCss"></style>
+      }
+      @if (styleCss(); as s) {
+        <style [innerHTML]="s"></style>
+      }
+    
       @if (enableCustomization) {
         <div class="expansion-ai-assistant">
-          <praxis-ai-assistant [adapter]="aiAdapter"></praxis-ai-assistant>
+          <button
+            mat-mini-fab
+            color="primary"
+            type="button"
+            class="expansion-ai-assistant-trigger"
+            aria-label="Abrir copiloto semantico Praxis dos paineis"
+            data-testid="praxis-expansion-ai-assistant-trigger"
+            (click)="openAiAssistant()"
+            >
+            <mat-icon [praxisIcon]="'auto_awesome'"></mat-icon>
+          </button>
         </div>
       }
-
+    
+      @if (aiAssistantOpen && aiAssistantViewState) {
+        <praxis-ai-assistant-shell
+          [labels]="aiAssistantLabels"
+          [mode]="aiAssistantViewState.mode"
+          [state]="aiAssistantViewState.state"
+          [contextItems]="aiAssistantViewState.contextItems"
+          [attachments]="aiAssistantViewState.attachments"
+          [messages]="aiAssistantViewState.messages"
+          [quickReplies]="aiAssistantViewState.quickReplies"
+          [prompt]="aiAssistantPrompt"
+          [statusText]="aiAssistantViewState.statusText"
+          [errorText]="aiAssistantViewState.errorText"
+          [busy]="aiAssistantViewState.state === 'processing' || aiAssistantViewState.state === 'applying'"
+          [canApply]="aiAssistantViewState.canApply"
+          [layout]="aiAssistantLayout"
+          testIdPrefix="praxis-expansion-ai-assistant"
+          (promptChange)="onAiAssistantPromptChange($event)"
+          (submitPrompt)="onAiAssistantSubmit($event)"
+          (apply)="onAiAssistantApply()"
+          (retryTurn)="onAiAssistantRetry()"
+          (cancelTurn)="onAiAssistantCancel()"
+          (quickReply)="onAiAssistantQuickReply($event)"
+          (editMessage)="onAiAssistantEditMessage($event)"
+          (resendMessage)="onAiAssistantResendMessage($event)"
+          (layoutChange)="onAiAssistantLayoutChange($event)"
+          (close)="closeAiAssistant()"
+        ></praxis-ai-assistant-shell>
+      }
+    
       @if (hasMultiple()) {
         <mat-accordion
           #accordion
@@ -757,7 +1519,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
           [displayMode]="config?.accordion?.displayMode || 'default'"
           [togglePosition]="config?.accordion?.togglePosition || 'after'"
           [hideToggle]="config?.accordion?.hideToggle || false"
-        >
+          >
           @for (p of (config?.panels || []); let i = $index; track p.id ?? i) {
             @let id = panelDomId(p, i);
             <mat-expansion-panel
@@ -772,15 +1534,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
               (afterExpand)="emitAfterExpand(p, i)"
               (afterCollapse)="emitAfterCollapse(p, i)"
               (destroyed)="emitDestroyed(p, i)"
-            >
+              >
               <mat-expansion-panel-header
                 [collapsedHeight]="p.collapsedHeight || (defaultOptions?.collapsedHeight || injectedDefaults?.collapsedHeight) || ''"
                 [expandedHeight]="p.expandedHeight || (defaultOptions?.expandedHeight || injectedDefaults?.expandedHeight) || ''"
-              >
+                >
+                @if (p.icon) {
+                  <mat-icon [praxisIcon]="p.icon"></mat-icon>
+                }
                 <mat-panel-title>{{ p.title }}</mat-panel-title>
-                <mat-panel-description *ngIf="p.description">{{ p.description }}</mat-panel-description>
+                @if (p.description) {
+                  <mat-panel-description>{{ p.description }}</mat-panel-description>
+                }
               </mat-expansion-panel-header>
-
+    
               <ng-template matExpansionPanelContent>
                 @if (p.content?.length) {
                   <ng-container
@@ -789,7 +1556,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
                     [formGroup]="panelFormFor(p, i)"
                   ></ng-container>
                 }
-
+    
                 @if (p.widgets?.length) {
                   @for (w of p.widgets; let wi = $index; track wi) {
                     <ng-container
@@ -800,12 +1567,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
                     ></ng-container>
                   }
                 }
-
+    
                 @if (p.actionButtons?.length) {
                   <mat-action-row>
                     @for (a of p.actionButtons; track a.label) {
                       <button mat-stroked-button (click)="emitAction(p, i, a.action)">
-                        <mat-icon *ngIf="a.icon" [praxisIcon]="a.icon"></mat-icon>
+                        @if (a.icon) {
+                          <mat-icon [praxisIcon]="a.icon"></mat-icon>
+                        }
                         {{ a.label }}
                       </button>
                     }
@@ -829,15 +1598,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
             (afterExpand)="emitAfterExpand(p, 0)"
             (afterCollapse)="emitAfterCollapse(p, 0)"
             (destroyed)="emitDestroyed(p, 0)"
-          >
+            >
             <mat-expansion-panel-header
               [collapsedHeight]="p.collapsedHeight || (defaultOptions?.collapsedHeight || injectedDefaults?.collapsedHeight) || ''"
               [expandedHeight]="p.expandedHeight || (defaultOptions?.expandedHeight || injectedDefaults?.expandedHeight) || ''"
-            >
+              >
+              @if (p.icon) {
+                <mat-icon [praxisIcon]="p.icon"></mat-icon>
+              }
               <mat-panel-title>{{ p.title }}</mat-panel-title>
-              <mat-panel-description *ngIf="p.description">{{ p.description }}</mat-panel-description>
+              @if (p.description) {
+                <mat-panel-description>{{ p.description }}</mat-panel-description>
+              }
             </mat-expansion-panel-header>
-
+    
             <ng-template matExpansionPanelContent>
               @if (p.content?.length) {
                 <ng-container
@@ -846,7 +1620,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
                   [formGroup]="panelFormFor(p, 0)"
                 ></ng-container>
               }
-
+    
               @if (p.widgets?.length) {
                 @for (w of p.widgets; let wi = $index; track wi) {
                   <ng-container
@@ -857,12 +1631,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
                   ></ng-container>
                 }
               }
-
+    
               @if (p.actionButtons?.length) {
                 <mat-action-row>
                   @for (a of p.actionButtons; track a.label) {
                     <button mat-stroked-button (click)="emitAction(p, 0, a.action)">
-                      <mat-icon *ngIf="a.icon" [praxisIcon]="a.icon"></mat-icon>
+                      @if (a.icon) {
+                        <mat-icon [praxisIcon]="a.icon"></mat-icon>
+                      }
                       {{ a.label }}
                     </button>
                   }
@@ -873,24 +1649,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
         } @else {
           <div class="praxis-expansion-empty">
             <span>Nenhum painel configurado</span>
-            <button mat-stroked-button color="primary" *ngIf="enableCustomization" (click)="openEditor()">
-              <mat-icon [praxisIcon]="'tune'"></mat-icon> Configurar
-            </button>
+            @if (enableCustomization) {
+              <button mat-stroked-button color="primary" (click)="openEditor()">
+                <mat-icon [praxisIcon]="'tune'"></mat-icon> Configurar
+              </button>
+            }
           </div>
         }
       }
     </div>
     <!-- Edit button -->
-    <button
-      *ngIf="enableCustomization"
-      mat-fab
-      class="edit-fab"
-      aria-label="Editar painéis"
-      (click)="openEditor()"
-    >
-      <mat-icon fontIcon="edit"></mat-icon>
-    </button>
-  `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;position:relative;color:var(--md-sys-color-on-surface)}.praxis-expansion-root{display:block;--p-exp-surface: var(--md-sys-color-surface);--p-exp-surface-container: var(--md-sys-color-surface-container);--p-exp-border: var(--md-sys-color-outline-variant);--p-exp-text: var(--md-sys-color-on-surface);--p-exp-text-muted: var(--md-sys-color-on-surface-variant);--p-exp-focus: var(--md-sys-color-primary);--p-exp-radius: 12px}.mat-expansion-panel{background:var(--p-exp-surface);border:1px solid var(--p-exp-border);border-radius:var(--p-exp-radius);overflow:hidden}.mat-expansion-panel:not(:last-child){margin-bottom:var(--p-exp-panel-gap, 12px)}.mat-expansion-panel-header{background:var(--p-exp-surface-container);color:var(--p-exp-text)}.mat-expansion-panel-header:focus-visible{outline:2px solid var(--p-exp-focus);outline-offset:-2px}.mat-expansion-panel-header-title{font-weight:600}.mat-expansion-panel-header-description{color:var(--p-exp-text-muted)}.mat-expansion-panel-body{padding:12px 16px 16px}.mat-action-row{border-top:1px solid var(--p-exp-border)}.density-compact .mat-expansion-panel-body{padding:8px 12px 12px}.density-compact .mat-expansion-panel-header{min-height:40px;padding:0 12px}.density-comfortable .mat-expansion-panel-body{padding:12px 16px 16px}.density-comfortable .mat-expansion-panel-header{min-height:48px;padding:0 16px}.density-spacious .mat-expansion-panel-body{padding:16px 20px 20px}.density-spacious .mat-expansion-panel-header{min-height:56px;padding:0 20px}.praxis-expansion-empty{display:flex;gap:8px;align-items:center;padding:8px 12px;color:var(--p-exp-text-muted)}.edit-fab{position:absolute;right:12px;bottom:12px;z-index:2}.expansion-ai-assistant{position:absolute;right:12px;bottom:72px;z-index:3}\n"] }]
+    @if (enableCustomization) {
+      <button
+        mat-fab
+        class="edit-fab"
+        aria-label="Editar painéis"
+        (click)="openEditor()"
+        >
+        <mat-icon fontIcon="edit"></mat-icon>
+      </button>
+    }
+    `, changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;position:relative;color:var(--md-sys-color-on-surface)}.praxis-expansion-root{display:block;--p-exp-surface: var(--md-sys-color-surface);--p-exp-surface-container: var(--md-sys-color-surface-container);--p-exp-border: var(--md-sys-color-outline-variant);--p-exp-text: var(--md-sys-color-on-surface);--p-exp-text-muted: var(--md-sys-color-on-surface-variant);--p-exp-focus: var(--md-sys-color-primary);--p-exp-radius: 12px}.mat-expansion-panel{background:var(--p-exp-surface);border:1px solid var(--p-exp-border);border-radius:var(--p-exp-radius);overflow:hidden}.mat-expansion-panel:not(:last-child){margin-bottom:var(--p-exp-panel-gap, 12px)}.mat-expansion-panel-header{background:var(--p-exp-surface-container);color:var(--p-exp-text)}.mat-expansion-panel-header:focus-visible{outline:2px solid var(--p-exp-focus);outline-offset:-2px}.mat-expansion-panel-header-title{font-weight:600}.mat-expansion-panel-header-description{color:var(--p-exp-text-muted)}.mat-expansion-panel-body{padding:12px 16px 16px}.mat-action-row{border-top:1px solid var(--p-exp-border)}.density-compact .mat-expansion-panel-body{padding:8px 12px 12px}.density-compact .mat-expansion-panel-header{min-height:40px;padding:0 12px}.density-comfortable .mat-expansion-panel-body{padding:12px 16px 16px}.density-comfortable .mat-expansion-panel-header{min-height:48px;padding:0 16px}.density-spacious .mat-expansion-panel-body{padding:16px 20px 20px}.density-spacious .mat-expansion-panel-header{min-height:56px;padding:0 20px}.praxis-expansion-empty{display:flex;gap:8px;align-items:center;padding:8px 12px;color:var(--p-exp-text-muted)}.edit-fab{position:absolute;right:12px;bottom:12px;z-index:2}.expansion-ai-assistant{position:absolute;right:12px;bottom:72px;z-index:3}.expansion-ai-assistant-trigger{box-shadow:var(--md-sys-elevation-level2, 0 4px 12px rgba(0, 0, 0, .18))}\n"] }]
         }], propDecorators: { config: [{
                 type: Input
             }], expansionId: [{
@@ -1097,9 +1876,9 @@ class PraxisExpansionConfigEditor {
         const current = JSON.stringify(this.config || {});
         this.isDirty$.next(current !== this.initialJson);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: PraxisExpansionConfigEditor, deps: [{ token: SETTINGS_PANEL_DATA }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.17", type: PraxisExpansionConfigEditor, isStandalone: true, selector: "praxis-expansion-config-editor", inputs: { config: "config", expansionId: "expansionId" }, usesOnChanges: true, ngImport: i0, template: `
-    <div class="pdx-expansion-editor">
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PraxisExpansionConfigEditor, deps: [{ token: SETTINGS_PANEL_DATA }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: PraxisExpansionConfigEditor, isStandalone: true, selector: "praxis-expansion-config-editor", inputs: { config: "config", expansionId: "expansionId" }, usesOnChanges: true, ngImport: i0, template: `
+    <div class="pdx-expansion-editor" data-testid="expansion-config-editor">
       <section class="sec">
         <h4>Aparência</h4>
         <div class="grid two">
@@ -1117,7 +1896,7 @@ class PraxisExpansionConfigEditor {
             </select>
           </mat-form-field>
         </div>
-
+    
         <h5>Container</h5>
         <div class="grid two">
           <mat-form-field appearance="outline">
@@ -1159,7 +1938,7 @@ class PraxisExpansionConfigEditor {
             <input matInput [value]="config?.appearance?.container?.panelGap || ''" (input)="setContainer('panelGap', $any($event.target).value)" placeholder="12px" />
           </mat-form-field>
         </div>
-
+    
         <h5>Cabeçalho</h5>
         <div class="grid two">
           <mat-form-field appearance="outline">
@@ -1219,7 +1998,7 @@ class PraxisExpansionConfigEditor {
             <input matInput [value]="config?.appearance?.header?.toggleIconSize || ''" (input)="setHeader('toggleIconSize', $any($event.target).value)" placeholder="12px" />
           </mat-form-field>
         </div>
-
+    
         <h5>Estados</h5>
         <div class="grid two">
           <mat-form-field appearance="outline">
@@ -1265,13 +2044,15 @@ class PraxisExpansionConfigEditor {
             type="button"
             [matTooltip]="'Use tokens M3, por exemplo: var(--md-sys-color-primary)'"
             matTooltipPosition="above"
-          >
+            >
             <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
           </button>
         </mat-form-field>
-        <div class="error" *ngIf="tokensError">{{ tokensError }}</div>
+        @if (tokensError) {
+          <div class="error">{{ tokensError }}</div>
+        }
       </section>
-
+    
       <section class="sec">
         <h4>Configuração do acordeão</h4>
         <div class="grid two">
@@ -1302,42 +2083,47 @@ class PraxisExpansionConfigEditor {
           <button mat-stroked-button color="primary" (click)="addPanel()"><mat-icon [praxisIcon]="'add'"></mat-icon>Adicionar painel</button>
         </div>
       </section>
-
-      <section class="sec" *ngFor="let p of (config?.panels || []); let i = index">
-        <div class="panel-row">
-          <strong>{{ p.title || ('Painel ' + (i + 1)) }}</strong>
-          <span class="grow"></span>
-          <button mat-button (click)="move(i, -1)" [disabled]="i===0"><mat-icon [praxisIcon]="'arrow_upward'"></mat-icon>Subir</button>
-          <button mat-button (click)="move(i, 1)" [disabled]="i>=(config!.panels!.length-1)"><mat-icon [praxisIcon]="'arrow_downward'"></mat-icon>Descer</button>
-          <button mat-button color="warn" (click)="removePanel(i)"><mat-icon [praxisIcon]="'delete'"></mat-icon>Remover</button>
-        </div>
-        <div class="grid two">
-          <mat-form-field appearance="outline"><mat-label>ID</mat-label>
+    
+      @for (p of (config?.panels || []); track p; let i = $index) {
+        <section class="sec">
+          <div class="panel-row">
+            <strong>{{ p.title || ('Painel ' + (i + 1)) }}</strong>
+            <span class="grow"></span>
+            <button mat-button (click)="move(i, -1)" [disabled]="i===0"><mat-icon [praxisIcon]="'arrow_upward'"></mat-icon>Subir</button>
+            <button mat-button (click)="move(i, 1)" [disabled]="i>=(config!.panels!.length-1)"><mat-icon [praxisIcon]="'arrow_downward'"></mat-icon>Descer</button>
+            <button mat-button color="warn" (click)="removePanel(i)"><mat-icon [praxisIcon]="'delete'"></mat-icon>Remover</button>
+          </div>
+          <div class="grid two">
+            <mat-form-field appearance="outline"><mat-label>ID</mat-label>
             <input matInput [value]="p.id || ''" (input)="setPanel(i, 'id', $any($event.target).value)" />
           </mat-form-field>
           <mat-form-field appearance="outline"><mat-label>Título</mat-label>
-            <input matInput [value]="p.title || ''" (input)="setPanel(i, 'title', $any($event.target).value)" />
-          </mat-form-field>
-          <mat-form-field appearance="outline"><mat-label>Descrição</mat-label>
-            <input matInput [value]="p.description || ''" (input)="setPanel(i, 'description', $any($event.target).value)" />
-          </mat-form-field>
-          <mat-form-field appearance="outline"><mat-label>Altura recolhida</mat-label>
-            <input matInput placeholder="48px" [value]="p.collapsedHeight || ''" (input)="setPanel(i, 'collapsedHeight', $any($event.target).value)" />
-          </mat-form-field>
-          <mat-form-field appearance="outline"><mat-label>Altura expandida</mat-label>
-            <input matInput placeholder="64px" [value]="p.expandedHeight || ''" (input)="setPanel(i, 'expandedHeight', $any($event.target).value)" />
-          </mat-form-field>
-          <div class="row wrap">
-            <mat-slide-toggle [checked]="p.disabled || false" (change)="setPanel(i, 'disabled', $event.checked)">Desativado</mat-slide-toggle>
-            <mat-slide-toggle [checked]="p.expanded || false" (change)="setPanel(i, 'expanded', $event.checked)">Expandido</mat-slide-toggle>
-            <mat-slide-toggle [checked]="p.hideToggle || false" (change)="setPanel(i, 'hideToggle', $event.checked)">Ocultar toggle</mat-slide-toggle>
-          </div>
-        </div>
-      </section>
+          <input matInput [value]="p.title || ''" (input)="setPanel(i, 'title', $any($event.target).value)" />
+        </mat-form-field>
+        <mat-form-field appearance="outline"><mat-label>Descrição</mat-label>
+        <input matInput [value]="p.description || ''" (input)="setPanel(i, 'description', $any($event.target).value)" />
+      </mat-form-field>
+      <mat-form-field appearance="outline"><mat-label>Ícone</mat-label>
+      <input matInput [value]="p.icon || ''" (input)="setPanel(i, 'icon', $any($event.target).value)" placeholder="info" />
+    </mat-form-field>
+    <mat-form-field appearance="outline"><mat-label>Altura recolhida</mat-label>
+    <input matInput placeholder="48px" [value]="p.collapsedHeight || ''" (input)="setPanel(i, 'collapsedHeight', $any($event.target).value)" />
+    </mat-form-field>
+    <mat-form-field appearance="outline"><mat-label>Altura expandida</mat-label>
+    <input matInput placeholder="64px" [value]="p.expandedHeight || ''" (input)="setPanel(i, 'expandedHeight', $any($event.target).value)" />
+    </mat-form-field>
+    <div class="row wrap">
+      <mat-slide-toggle [checked]="p.disabled || false" (change)="setPanel(i, 'disabled', $event.checked)">Desativado</mat-slide-toggle>
+      <mat-slide-toggle [checked]="p.expanded || false" (change)="setPanel(i, 'expanded', $event.checked)">Expandido</mat-slide-toggle>
+      <mat-slide-toggle [checked]="p.hideToggle || false" (change)="setPanel(i, 'hideToggle', $event.checked)">Ocultar toggle</mat-slide-toggle>
+    </div>
     </div>
-  `, isInline: true, styles: [":host{display:block;color:var(--md-sys-color-on-surface)}.pdx-expansion-editor{display:grid;gap:16px}.sec{border:1px solid var(--md-sys-color-outline-variant);padding:12px;border-radius:10px;background:var(--md-sys-color-surface-container-lowest);display:grid;gap:12px}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row.wrap{flex-wrap:wrap}.panel-row{display:flex;gap:8px;align-items:center;width:100%}.grow{flex:1 1 auto}.grid{display:grid;gap:10px;align-items:center}.grid.two{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.full{width:100%}.error{color:var(--md-sys-color-error);font-size:12px}.pdx-expansion-editor .mat-mdc-form-field{width:100%;--mdc-outlined-text-field-container-height: 48px;--mdc-outlined-text-field-outline-color: var(--md-sys-color-outline-variant);--mdc-outlined-text-field-hover-outline-color: var(--md-sys-color-outline);--mdc-outlined-text-field-focus-outline-color: var(--md-sys-color-primary);--mdc-outlined-text-field-error-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-error-focus-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-error-hover-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-label-text-color: var(--md-sys-color-on-surface-variant);--mdc-outlined-text-field-input-text-color: var(--md-sys-color-on-surface);--mdc-outlined-text-field-supporting-text-color: var(--md-sys-color-on-surface-variant)}.help-icon-button{--mdc-icon-button-state-layer-size: 28px;--mdc-icon-button-icon-size: 18px;width:28px;height:28px;padding:0;display:inline-flex;align-items:center;justify-content:center;margin-right:-4px}.help-icon-button mat-icon{font-size:18px;width:18px;height:18px}.mat-mdc-form-field-icon-suffix{align-self:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i7.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    </section>
+    }
+    </div>
+    `, isInline: true, styles: [":host{display:block;color:var(--md-sys-color-on-surface)}.pdx-expansion-editor{display:grid;gap:16px}.sec{border:1px solid var(--md-sys-color-outline-variant);padding:12px;border-radius:10px;background:var(--md-sys-color-surface-container-lowest);display:grid;gap:12px}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row.wrap{flex-wrap:wrap}.panel-row{display:flex;gap:8px;align-items:center;width:100%}.grow{flex:1 1 auto}.grid{display:grid;gap:10px;align-items:center}.grid.two{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.full{width:100%}.error{color:var(--md-sys-color-error);font-size:12px}.pdx-expansion-editor .mat-mdc-form-field{width:100%;--mdc-outlined-text-field-container-height: 48px;--mdc-outlined-text-field-outline-color: var(--md-sys-color-outline-variant);--mdc-outlined-text-field-hover-outline-color: var(--md-sys-color-outline);--mdc-outlined-text-field-focus-outline-color: var(--md-sys-color-primary);--mdc-outlined-text-field-error-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-error-focus-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-error-hover-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-label-text-color: var(--md-sys-color-on-surface-variant);--mdc-outlined-text-field-input-text-color: var(--md-sys-color-on-surface);--mdc-outlined-text-field-supporting-text-color: var(--md-sys-color-on-surface-variant)}.help-icon-button{--mdc-icon-button-state-layer-size: 28px;--mdc-icon-button-icon-size: 18px;width:28px;height:28px;padding:0;display:inline-flex;align-items:center;justify-content:center;margin-right:-4px}.help-icon-button mat-icon{font-size:18px;width:18px;height:18px}.mat-mdc-form-field-icon-suffix{align-self:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i5.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSlideToggleModule }, { kind: "component", type: i7.MatSlideToggle, selector: "mat-slide-toggle", inputs: ["name", "id", "labelPosition", "aria-label", "aria-labelledby", "aria-describedby", "required", "color", "disabled", "disableRipple", "tabIndex", "checked", "hideIcon", "disabledInteractive"], outputs: ["change", "toggleChange"], exportAs: ["matSlideToggle"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i8.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImport: i0, type: PraxisExpansionConfigEditor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PraxisExpansionConfigEditor, decorators: [{
             type: Component,
             args: [{ selector: 'praxis-expansion-config-editor', standalone: true, imports: [
                         CommonModule,
@@ -1349,7 +2135,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
                         MatTooltipModule,
                         PraxisIconDirective,
                     ], changeDetection: ChangeDetectionStrategy.OnPush, template: `
-    <div class="pdx-expansion-editor">
+    <div class="pdx-expansion-editor" data-testid="expansion-config-editor">
       <section class="sec">
         <h4>Aparência</h4>
         <div class="grid two">
@@ -1367,7 +2153,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
             </select>
           </mat-form-field>
         </div>
-
+    
         <h5>Container</h5>
         <div class="grid two">
           <mat-form-field appearance="outline">
@@ -1409,7 +2195,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
             <input matInput [value]="config?.appearance?.container?.panelGap || ''" (input)="setContainer('panelGap', $any($event.target).value)" placeholder="12px" />
           </mat-form-field>
         </div>
-
+    
         <h5>Cabeçalho</h5>
         <div class="grid two">
           <mat-form-field appearance="outline">
@@ -1469,7 +2255,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
             <input matInput [value]="config?.appearance?.header?.toggleIconSize || ''" (input)="setHeader('toggleIconSize', $any($event.target).value)" placeholder="12px" />
           </mat-form-field>
         </div>
-
+    
         <h5>Estados</h5>
         <div class="grid two">
           <mat-form-field appearance="outline">
@@ -1515,13 +2301,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
             type="button"
             [matTooltip]="'Use tokens M3, por exemplo: var(--md-sys-color-primary)'"
             matTooltipPosition="above"
-          >
+            >
             <mat-icon [praxisIcon]="'help_outline'"></mat-icon>
           </button>
         </mat-form-field>
-        <div class="error" *ngIf="tokensError">{{ tokensError }}</div>
+        @if (tokensError) {
+          <div class="error">{{ tokensError }}</div>
+        }
       </section>
-
+    
       <section class="sec">
         <h4>Configuração do acordeão</h4>
         <div class="grid two">
@@ -1552,40 +2340,45 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
           <button mat-stroked-button color="primary" (click)="addPanel()"><mat-icon [praxisIcon]="'add'"></mat-icon>Adicionar painel</button>
         </div>
       </section>
-
-      <section class="sec" *ngFor="let p of (config?.panels || []); let i = index">
-        <div class="panel-row">
-          <strong>{{ p.title || ('Painel ' + (i + 1)) }}</strong>
-          <span class="grow"></span>
-          <button mat-button (click)="move(i, -1)" [disabled]="i===0"><mat-icon [praxisIcon]="'arrow_upward'"></mat-icon>Subir</button>
-          <button mat-button (click)="move(i, 1)" [disabled]="i>=(config!.panels!.length-1)"><mat-icon [praxisIcon]="'arrow_downward'"></mat-icon>Descer</button>
-          <button mat-button color="warn" (click)="removePanel(i)"><mat-icon [praxisIcon]="'delete'"></mat-icon>Remover</button>
-        </div>
-        <div class="grid two">
-          <mat-form-field appearance="outline"><mat-label>ID</mat-label>
+    
+      @for (p of (config?.panels || []); track p; let i = $index) {
+        <section class="sec">
+          <div class="panel-row">
+            <strong>{{ p.title || ('Painel ' + (i + 1)) }}</strong>
+            <span class="grow"></span>
+            <button mat-button (click)="move(i, -1)" [disabled]="i===0"><mat-icon [praxisIcon]="'arrow_upward'"></mat-icon>Subir</button>
+            <button mat-button (click)="move(i, 1)" [disabled]="i>=(config!.panels!.length-1)"><mat-icon [praxisIcon]="'arrow_downward'"></mat-icon>Descer</button>
+            <button mat-button color="warn" (click)="removePanel(i)"><mat-icon [praxisIcon]="'delete'"></mat-icon>Remover</button>
+          </div>
+          <div class="grid two">
+            <mat-form-field appearance="outline"><mat-label>ID</mat-label>
             <input matInput [value]="p.id || ''" (input)="setPanel(i, 'id', $any($event.target).value)" />
           </mat-form-field>
           <mat-form-field appearance="outline"><mat-label>Título</mat-label>
-            <input matInput [value]="p.title || ''" (input)="setPanel(i, 'title', $any($event.target).value)" />
-          </mat-form-field>
-          <mat-form-field appearance="outline"><mat-label>Descrição</mat-label>
-            <input matInput [value]="p.description || ''" (input)="setPanel(i, 'description', $any($event.target).value)" />
-          </mat-form-field>
-          <mat-form-field appearance="outline"><mat-label>Altura recolhida</mat-label>
-            <input matInput placeholder="48px" [value]="p.collapsedHeight || ''" (input)="setPanel(i, 'collapsedHeight', $any($event.target).value)" />
-          </mat-form-field>
-          <mat-form-field appearance="outline"><mat-label>Altura expandida</mat-label>
-            <input matInput placeholder="64px" [value]="p.expandedHeight || ''" (input)="setPanel(i, 'expandedHeight', $any($event.target).value)" />
-          </mat-form-field>
-          <div class="row wrap">
-            <mat-slide-toggle [checked]="p.disabled || false" (change)="setPanel(i, 'disabled', $event.checked)">Desativado</mat-slide-toggle>
-            <mat-slide-toggle [checked]="p.expanded || false" (change)="setPanel(i, 'expanded', $event.checked)">Expandido</mat-slide-toggle>
-            <mat-slide-toggle [checked]="p.hideToggle || false" (change)="setPanel(i, 'hideToggle', $event.checked)">Ocultar toggle</mat-slide-toggle>
-          </div>
-        </div>
-      </section>
+          <input matInput [value]="p.title || ''" (input)="setPanel(i, 'title', $any($event.target).value)" />
+        </mat-form-field>
+        <mat-form-field appearance="outline"><mat-label>Descrição</mat-label>
+        <input matInput [value]="p.description || ''" (input)="setPanel(i, 'description', $any($event.target).value)" />
+      </mat-form-field>
+      <mat-form-field appearance="outline"><mat-label>Ícone</mat-label>
+      <input matInput [value]="p.icon || ''" (input)="setPanel(i, 'icon', $any($event.target).value)" placeholder="info" />
+    </mat-form-field>
+    <mat-form-field appearance="outline"><mat-label>Altura recolhida</mat-label>
+    <input matInput placeholder="48px" [value]="p.collapsedHeight || ''" (input)="setPanel(i, 'collapsedHeight', $any($event.target).value)" />
+    </mat-form-field>
+    <mat-form-field appearance="outline"><mat-label>Altura expandida</mat-label>
+    <input matInput placeholder="64px" [value]="p.expandedHeight || ''" (input)="setPanel(i, 'expandedHeight', $any($event.target).value)" />
+    </mat-form-field>
+    <div class="row wrap">
+      <mat-slide-toggle [checked]="p.disabled || false" (change)="setPanel(i, 'disabled', $event.checked)">Desativado</mat-slide-toggle>
+      <mat-slide-toggle [checked]="p.expanded || false" (change)="setPanel(i, 'expanded', $event.checked)">Expandido</mat-slide-toggle>
+      <mat-slide-toggle [checked]="p.hideToggle || false" (change)="setPanel(i, 'hideToggle', $event.checked)">Ocultar toggle</mat-slide-toggle>
+    </div>
+    </div>
+    </section>
+    }
     </div>
-  `, styles: [":host{display:block;color:var(--md-sys-color-on-surface)}.pdx-expansion-editor{display:grid;gap:16px}.sec{border:1px solid var(--md-sys-color-outline-variant);padding:12px;border-radius:10px;background:var(--md-sys-color-surface-container-lowest);display:grid;gap:12px}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row.wrap{flex-wrap:wrap}.panel-row{display:flex;gap:8px;align-items:center;width:100%}.grow{flex:1 1 auto}.grid{display:grid;gap:10px;align-items:center}.grid.two{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.full{width:100%}.error{color:var(--md-sys-color-error);font-size:12px}.pdx-expansion-editor .mat-mdc-form-field{width:100%;--mdc-outlined-text-field-container-height: 48px;--mdc-outlined-text-field-outline-color: var(--md-sys-color-outline-variant);--mdc-outlined-text-field-hover-outline-color: var(--md-sys-color-outline);--mdc-outlined-text-field-focus-outline-color: var(--md-sys-color-primary);--mdc-outlined-text-field-error-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-error-focus-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-error-hover-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-label-text-color: var(--md-sys-color-on-surface-variant);--mdc-outlined-text-field-input-text-color: var(--md-sys-color-on-surface);--mdc-outlined-text-field-supporting-text-color: var(--md-sys-color-on-surface-variant)}.help-icon-button{--mdc-icon-button-state-layer-size: 28px;--mdc-icon-button-icon-size: 18px;width:28px;height:28px;padding:0;display:inline-flex;align-items:center;justify-content:center;margin-right:-4px}.help-icon-button mat-icon{font-size:18px;width:18px;height:18px}.mat-mdc-form-field-icon-suffix{align-self:center}\n"] }]
+    `, styles: [":host{display:block;color:var(--md-sys-color-on-surface)}.pdx-expansion-editor{display:grid;gap:16px}.sec{border:1px solid var(--md-sys-color-outline-variant);padding:12px;border-radius:10px;background:var(--md-sys-color-surface-container-lowest);display:grid;gap:12px}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row.wrap{flex-wrap:wrap}.panel-row{display:flex;gap:8px;align-items:center;width:100%}.grow{flex:1 1 auto}.grid{display:grid;gap:10px;align-items:center}.grid.two{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.full{width:100%}.error{color:var(--md-sys-color-error);font-size:12px}.pdx-expansion-editor .mat-mdc-form-field{width:100%;--mdc-outlined-text-field-container-height: 48px;--mdc-outlined-text-field-outline-color: var(--md-sys-color-outline-variant);--mdc-outlined-text-field-hover-outline-color: var(--md-sys-color-outline);--mdc-outlined-text-field-focus-outline-color: var(--md-sys-color-primary);--mdc-outlined-text-field-error-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-error-focus-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-error-hover-outline-color: var(--md-sys-color-error);--mdc-outlined-text-field-label-text-color: var(--md-sys-color-on-surface-variant);--mdc-outlined-text-field-input-text-color: var(--md-sys-color-on-surface);--mdc-outlined-text-field-supporting-text-color: var(--md-sys-color-on-surface-variant)}.help-icon-button{--mdc-icon-button-state-layer-size: 28px;--mdc-icon-button-icon-size: 18px;width:28px;height:28px;padding:0;display:inline-flex;align-items:center;justify-content:center;margin-right:-4px}.help-icon-button mat-icon{font-size:18px;width:18px;height:18px}.mat-mdc-form-field-icon-suffix{align-self:center}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: [SETTINGS_PANEL_DATA]
@@ -1595,6 +2388,116 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.17", ngImpo
                 type: Input
             }] } });
 
+class PraxisExpansionWidgetConfigEditor {
+    inputs = null;
+    widgetKey;
+    expansionEditor;
+    isDirty$ = new BehaviorSubject(false);
+    isValid$ = new BehaviorSubject(true);
+    isBusy$ = new BehaviorSubject(false);
+    subscription = new Subscription();
+    emptyConfig = {};
+    get config() {
+        return this.inputs?.config ?? this.emptyConfig;
+    }
+    get expansionId() {
+        return this.inputs?.expansionId ?? this.widgetKey;
+    }
+    ngAfterViewInit() {
+        if (!this.expansionEditor) {
+            return;
+        }
+        this.subscription.add(this.expansionEditor.isDirty$.subscribe((value) => this.isDirty$.next(value)));
+        this.subscription.add(this.expansionEditor.isValid$.subscribe((value) => this.isValid$.next(value)));
+        this.subscription.add(this.expansionEditor.isBusy$.subscribe((value) => this.isBusy$.next(value)));
+    }
+    ngOnDestroy() {
+        this.subscription.unsubscribe();
+    }
+    getSettingsValue() {
+        return this.buildValue(this.expansionEditor?.getSettingsValue());
+    }
+    onSave() {
+        return this.buildValue(this.expansionEditor?.getSettingsValue());
+    }
+    reset() {
+        this.expansionEditor?.reset();
+    }
+    buildValue(config) {
+        return {
+            inputs: {
+                ...(this.inputs ?? {}),
+                config: config ?? this.config,
+                ...(this.expansionId ? { expansionId: this.expansionId } : {}),
+            },
+        };
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PraxisExpansionWidgetConfigEditor, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.14", type: PraxisExpansionWidgetConfigEditor, isStandalone: true, selector: "praxis-expansion-widget-config-editor", inputs: { inputs: "inputs", widgetKey: "widgetKey" }, viewQueries: [{ propertyName: "expansionEditor", first: true, predicate: ["expansionEditor"], descendants: true }], ngImport: i0, template: `
+    <section data-testid="expansion-widget-config-editor">
+      <praxis-expansion-config-editor
+        #expansionEditor
+        [config]="config"
+        [expansionId]="expansionId"
+      />
+    </section>
+  `, isInline: true, dependencies: [{ kind: "component", type: PraxisExpansionConfigEditor, selector: "praxis-expansion-config-editor", inputs: ["config", "expansionId"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PraxisExpansionWidgetConfigEditor, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'praxis-expansion-widget-config-editor',
+                    standalone: true,
+                    imports: [PraxisExpansionConfigEditor],
+                    template: `
+    <section data-testid="expansion-widget-config-editor">
+      <praxis-expansion-config-editor
+        #expansionEditor
+        [config]="config"
+        [expansionId]="expansionId"
+      />
+    </section>
+  `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                }]
+        }], propDecorators: { inputs: [{
+                type: Input
+            }], widgetKey: [{
+                type: Input
+            }], expansionEditor: [{
+                type: ViewChild,
+                args: ['expansionEditor']
+            }] } });
+
+const PRAXIS_EXPANSION_PORTS = [
+    {
+        id: 'config',
+        label: 'Configuracao',
+        direction: 'input',
+        semanticKind: 'config-fragment',
+        schema: {
+            id: 'ExpansionMetadata',
+            kind: 'ts-type',
+            ref: 'ExpansionMetadata',
+        },
+        description: 'Fragmento canonico de configuracao dos paineis e dos widgets internos.',
+        exposure: { public: true, group: 'config' },
+    },
+    {
+        id: 'widgetEvent',
+        label: 'Evento interno de widget',
+        direction: 'output',
+        semanticKind: 'event',
+        schema: {
+            id: 'WidgetEventEnvelope',
+            kind: 'ts-type',
+            ref: 'WidgetEventEnvelope',
+        },
+        cardinality: 'stream',
+        description: 'Bridge composta para transporte de eventos internos. As portas canonicas dos filhos sao resolvidas por component-port + nestedPath.',
+        exposure: { public: true, advanced: true, group: 'composite' },
+    },
+];
 const PRAXIS_EXPANSION_COMPONENT_METADATA = {
     id: 'praxis-expansion',
     selector: 'praxis-expansion',
@@ -1602,6 +2505,14 @@ const PRAXIS_EXPANSION_COMPONENT_METADATA = {
     friendlyName: 'Praxis Expansion Panel',
     description: 'Acordeão/Painéis de expansão configuráveis por metadata, com aparência e tokens M3.',
     icon: 'unfold_more',
+    authoringManifestRef: {
+        componentId: 'praxis-expansion',
+        source: 'PRAXIS_EXPANSION_AUTHORING_MANIFEST',
+    },
+    configEditor: {
+        component: PraxisExpansionWidgetConfigEditor,
+        title: 'Configure expansion',
+    },
     inputs: [
         { name: 'config', type: 'ExpansionMetadata', label: 'Configuração', description: 'Configuração JSON (acordeão, aparência e painéis)' },
         { name: 'expansionId', type: 'string', label: 'ID', description: 'Identificador para persistência (obrigatório)' },
@@ -1676,6 +2587,7 @@ const PRAXIS_EXPANSION_COMPONENT_METADATA = {
     ],
     tags: ['widget', 'expansion', 'accordion', 'configurable'],
     lib: '@praxisui/expansion',
+    ports: PRAXIS_EXPANSION_PORTS,
 };
 function providePraxisExpansionMetadata() {
     return {
@@ -1691,6 +2603,315 @@ function providePraxisExpansionDefaults(opts) {
     return { provide: MAT_EXPANSION_PANEL_DEFAULT_OPTIONS, useValue: opts };
 }
 
+const panelItemSchema = {
+    type: 'object',
+    required: ['id', 'title'],
+    properties: {
+        id: { type: 'string' },
+        title: { type: 'string' },
+        description: { type: 'string' },
+        icon: { type: 'string' },
+        disabled: { type: 'boolean' },
+        expanded: { type: 'boolean' },
+        hideToggle: { type: 'boolean' },
+        collapsedHeight: { type: 'string' },
+        expandedHeight: { type: 'string' },
+        content: { type: 'array', items: { type: 'object' } },
+        widgets: { type: 'array', items: { type: 'object' } },
+        actionButtons: { type: 'array', items: { type: 'object' } },
+    },
+};
+const panelPatchSchema = {
+    type: 'object',
+    minProperties: 1,
+    properties: {
+        id: { type: 'string' },
+        title: { type: 'string' },
+        description: { type: 'string' },
+        icon: { type: 'string' },
+        disabled: { type: 'boolean' },
+        expanded: { type: 'boolean' },
+        hideToggle: { type: 'boolean' },
+        collapsedHeight: { type: 'string' },
+        expandedHeight: { type: 'string' },
+        content: { type: 'array', items: { type: 'object' } },
+        widgets: { type: 'array', items: { type: 'object' } },
+        actionButtons: { type: 'array', items: { type: 'object' } },
+    },
+};
+const PRAXIS_EXPANSION_AUTHORING_MANIFEST = {
+    schemaVersion: '1.0.0',
+    componentId: 'praxis-expansion',
+    ownerPackage: '@praxisui/expansion',
+    configSchemaId: 'ExpansionMetadata',
+    manifestVersion: '1.0.0',
+    runtimeInputs: [
+        { name: 'config', type: 'ExpansionMetadata', description: 'Canonical accordion and panel configuration.' },
+        { name: 'expansionId', type: 'string', description: 'Stable id used to derive expansion config persistence scope.' },
+        { name: 'componentInstanceId', type: 'string', description: 'Optional instance discriminator for persistence scope.' },
+        { name: 'context', type: 'Record<string, any>', description: 'Context passed to nested widgets.' },
+        { name: 'strictValidation', type: 'boolean', description: 'Controls nested widget validation strictness.' },
+        { name: 'defaultOptions', type: 'MatExpansionPanelDefaultOptions', description: 'Instance-level Material expansion defaults.' },
+        { name: 'enableCustomization', type: 'boolean', description: 'Enables Settings Panel authoring surfaces.' },
+    ],
+    editableTargets: [
+        { kind: 'panel', resolver: 'panel-by-id-or-title', description: 'A panel in config.panels[].' },
+        { kind: 'panelHeader', resolver: 'panel-by-id-or-title', description: 'Header title, description, icon and heights for a panel.' },
+        { kind: 'panelContent', resolver: 'panel-content-by-id', description: 'Lazy panel content hosted through fields, widgets or action buttons.' },
+        { kind: 'expandedState', resolver: 'panel-by-id-or-title', description: 'Panel expanded state and default expanded selection.' },
+        { kind: 'disabledState', resolver: 'panel-by-id-or-title', description: 'Panel disabled state.' },
+        { kind: 'layout', resolver: 'expansion-layout-config', description: 'Accordion display mode, toggle position, density and visual layout.' },
+        { kind: 'behavior', resolver: 'expansion-behavior-config', description: 'Accordion multi-expand and hide-toggle behavior.' },
+    ],
+    operations: [
+        {
+            operationId: 'panel.add',
+            title: 'Add panel',
+            scope: 'global',
+            targetKind: 'panel',
+            target: { kind: 'panel', resolver: 'panels-array', ambiguityPolicy: 'fail', required: false },
+            inputSchema: panelItemSchema,
+            effects: [{ kind: 'append-unique', path: 'panels[]', key: 'id' }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['panel-id-unique', 'panel-order-deterministic', 'panel-content-valid'],
+            affectedPaths: ['panels[]'],
+            submissionImpact: 'config-only',
+            preconditions: ['config-initialized'],
+        },
+        {
+            operationId: 'panel.remove',
+            title: 'Remove panel',
+            scope: 'layout',
+            targetKind: 'panel',
+            target: { kind: 'panel', resolver: 'panel-by-id-or-title', ambiguityPolicy: 'fail', required: true },
+            inputSchema: {
+                type: 'object',
+                properties: {
+                    replacementExpandedPanelId: { type: 'string' },
+                },
+            },
+            effects: [{
+                    kind: 'compile-domain-patch',
+                    handler: 'expansion-panel-remove',
+                    handlerContract: {
+                        reads: ['accordion.multi', 'panels[]', 'panels[].id', 'panels[].expanded'],
+                        writes: ['panels[]', 'panels[].expanded'],
+                        identityKeys: ['panels[].id'],
+                        inputSchema: {
+                            type: 'object',
+                            properties: {
+                                replacementExpandedPanelId: { type: 'string' },
+                            },
+                        },
+                        failureModes: ['panel-not-found', 'replacement-panel-not-found', 'content-removal-not-confirmed', 'single-expand-conflict'],
+                        description: 'Removes the target panel by stable id and applies replacement expanded state when the removed panel was expanded.',
+                    },
+                }],
+            destructive: true,
+            requiresConfirmation: true,
+            validators: ['panel-exists', 'default-expanded-removal-safe', 'panel-content-removal-confirmed'],
+            affectedPaths: ['panels[]', 'panels[].expanded'],
+            submissionImpact: 'config-only',
+            preconditions: ['config-initialized', 'target-panel-exists', 'confirmation-collected'],
+        },
+        {
+            operationId: 'panel.title.set',
+            title: 'Set panel title',
+            scope: 'layout',
+            targetKind: 'panelHeader',
+            target: { kind: 'panelHeader', resolver: 'panel-by-id-or-title', ambiguityPolicy: 'fail', required: true },
+            inputSchema: { type: 'object', required: ['title'], properties: { title: { type: 'string' } } },
+            effects: [{ kind: 'merge-by-key', path: 'panels[]', key: 'id' }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['panel-exists', 'panel-title-valid'],
+            affectedPaths: ['panels[].title'],
+            submissionImpact: 'config-only',
+            preconditions: ['config-initialized', 'target-panel-exists'],
+        },
+        {
+            operationId: 'panel.description.set',
+            title: 'Set panel description',
+            scope: 'layout',
+            targetKind: 'panelHeader',
+            target: { kind: 'panelHeader', resolver: 'panel-by-id-or-title', ambiguityPolicy: 'fail', required: true },
+            inputSchema: { type: 'object', required: ['description'], properties: { description: { type: 'string' } } },
+            effects: [{ kind: 'merge-by-key', path: 'panels[]', key: 'id' }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['panel-exists', 'panel-description-valid'],
+            affectedPaths: ['panels[].description'],
+            submissionImpact: 'config-only',
+            preconditions: ['config-initialized', 'target-panel-exists'],
+        },
+        {
+            operationId: 'panel.icon.set',
+            title: 'Set panel icon',
+            scope: 'layout',
+            targetKind: 'panelHeader',
+            target: { kind: 'panelHeader', resolver: 'panel-by-id-or-title', ambiguityPolicy: 'fail', required: true },
+            inputSchema: { type: 'object', required: ['icon'], properties: { icon: { type: 'string' } } },
+            effects: [{ kind: 'merge-by-key', path: 'panels[]', key: 'id' }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['panel-exists', 'panel-icon-valid', 'editor-runtime-round-trip'],
+            affectedPaths: ['panels[].icon'],
+            submissionImpact: 'config-only',
+            preconditions: ['config-initialized', 'target-panel-exists'],
+        },
+        {
+            operationId: 'panel.order.set',
+            title: 'Reorder panels',
+            scope: 'layout',
+            targetKind: 'panel',
+            target: { kind: 'panel', resolver: 'panel-by-id-or-title', ambiguityPolicy: 'fail', required: true },
+            inputSchema: { type: 'object', required: ['beforePanelId'], properties: { beforePanelId: { type: 'string' } } },
+            effects: [{ kind: 'reorder-by-key', path: 'panels[]', key: 'id' }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['panel-exists', 'panel-order-deterministic'],
+            affectedPaths: ['panels[]'],
+            submissionImpact: 'config-only',
+            preconditions: ['config-initialized', 'target-panel-exists'],
+        },
+        {
+            operationId: 'panel.disabled.set',
+            title: 'Set disabled state',
+            scope: 'interaction',
+            targetKind: 'disabledState',
+            target: { kind: 'disabledState', resolver: 'panel-by-id-or-title', ambiguityPolicy: 'fail', required: true },
+            inputSchema: { type: 'object', required: ['disabled'], properties: { disabled: { type: 'boolean' } } },
+            effects: [{ kind: 'merge-by-key', path: 'panels[]', key: 'id' }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['panel-exists', 'disabled-expanded-compatible'],
+            affectedPaths: ['panels[].disabled', 'panels[].expanded'],
+            submissionImpact: 'config-only',
+            preconditions: ['config-initialized', 'target-panel-exists'],
+        },
+        {
+            operationId: 'behavior.multiExpand.set',
+            title: 'Set multi-expand behavior',
+            scope: 'interaction',
+            targetKind: 'behavior',
+            target: { kind: 'behavior', resolver: 'expansion-behavior-config', ambiguityPolicy: 'fail', required: true },
+            inputSchema: { type: 'object', required: ['multi'], properties: { multi: { type: 'boolean' } } },
+            effects: [{
+                    kind: 'compile-domain-patch',
+                    handler: 'expansion-multi-expand-set',
+                    handlerContract: {
+                        reads: ['accordion.multi', 'panels[]', 'panels[].id', 'panels[].expanded'],
+                        writes: ['accordion.multi', 'panels[].expanded'],
+                        identityKeys: ['panels[].id'],
+                        inputSchema: { type: 'object', required: ['multi'], properties: { multi: { type: 'boolean' } } },
+                        failureModes: ['multiple-expanded-panels-conflict', 'panel-id-missing'],
+                        description: 'Sets accordion.multi and collapses competing expanded panels when switching to single-expand behavior.',
+                    },
+                }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['multi-expand-default-compatible', 'accordion-values-valid', 'editor-runtime-round-trip'],
+            affectedPaths: ['accordion.multi', 'panels[].expanded'],
+            submissionImpact: 'config-only',
+            preconditions: ['config-initialized'],
+        },
+        {
+            operationId: 'behavior.defaultExpanded.set',
+            title: 'Set default expanded panel',
+            scope: 'interaction',
+            targetKind: 'expandedState',
+            target: { kind: 'expandedState', resolver: 'panel-by-id-or-title', ambiguityPolicy: 'fail', required: true },
+            inputSchema: {
+                type: 'object',
+                required: ['expanded'],
+                properties: {
+                    expanded: { type: 'boolean' },
+                    collapseOthers: { type: 'boolean' },
+                },
+            },
+            effects: [{
+                    kind: 'compile-domain-patch',
+                    handler: 'expansion-default-expanded-upsert',
+                    handlerContract: {
+                        reads: ['accordion.multi', 'panels[]', 'panels[].id', 'panels[].expanded', 'panels[].disabled'],
+                        writes: ['panels[].expanded'],
+                        identityKeys: ['panels[].id'],
+                        inputSchema: {
+                            type: 'object',
+                            required: ['panelId', 'expanded'],
+                            properties: {
+                                panelId: { type: 'string' },
+                                expanded: { type: 'boolean' },
+                                collapseOthers: { type: 'boolean' },
+                            },
+                        },
+                        failureModes: ['panel-not-found', 'panel-disabled', 'single-expand-conflict'],
+                        description: 'Sets a panel expanded state and collapses competing panels when accordion.multi is false.',
+                    },
+                }],
+            validators: ['panel-exists', 'default-expanded-panel-exists', 'multi-expand-default-compatible', 'disabled-expanded-compatible'],
+            destructive: false,
+            requiresConfirmation: false,
+            affectedPaths: ['panels[].expanded', 'accordion.multi'],
+            submissionImpact: 'config-only',
+            preconditions: ['config-initialized', 'target-panel-exists'],
+        },
+        {
+            operationId: 'panel.content.set',
+            title: 'Set panel content',
+            scope: 'layout',
+            targetKind: 'panelContent',
+            target: { kind: 'panelContent', resolver: 'panel-content-by-id', ambiguityPolicy: 'fail', required: true },
+            inputSchema: panelPatchSchema,
+            effects: [{ kind: 'merge-by-key', path: 'panels[]', key: 'id' }],
+            destructive: false,
+            requiresConfirmation: false,
+            validators: ['panel-exists', 'panel-content-valid', 'lazy-content-compatible', 'nested-widget-contract-delegated'],
+            affectedPaths: ['panels[].content', 'panels[].widgets', 'panels[].actionButtons'],
+            submissionImpact: 'affects-schema-backed-data',
+            preconditions: ['config-initialized', 'target-panel-exists'],
+        },
+    ],
+    validators: [
+        { validatorId: 'panel-id-unique', level: 'error', code: 'PEXP001', description: 'Panel ids must be unique and stable within config.panels[].' },
+        { validatorId: 'panel-exists', level: 'error', code: 'PEXP002', description: 'Target panel must exist before applying the operation.' },
+        { validatorId: 'panel-order-deterministic', level: 'error', code: 'PEXP003', description: 'Panel ordering must use stable ids, not transient array index as identity.' },
+        { validatorId: 'panel-title-valid', level: 'error', code: 'PEXP004', description: 'Panel title must be a non-empty text value after localization/domain projection.' },
+        { validatorId: 'panel-description-valid', level: 'warning', code: 'PEXP005', description: 'Panel description should remain plain header-support text and not replace panel content.' },
+        { validatorId: 'panel-icon-valid', level: 'warning', code: 'PEXP006', description: 'Panel icon metadata must remain compatible with PraxisIconDirective and editor round-trip.' },
+        { validatorId: 'panel-content-valid', level: 'error', code: 'PEXP007', description: 'Panel content must remain valid FieldMetadata[], WidgetDefinition[] or action button metadata.' },
+        { validatorId: 'panel-content-removal-confirmed', level: 'error', code: 'PEXP008', description: 'Removing a panel with fields, widgets or action buttons is destructive and requires confirmation.' },
+        { validatorId: 'default-expanded-panel-exists', level: 'error', code: 'PEXP009', description: 'Default expanded state must reference an existing panel id.' },
+        { validatorId: 'default-expanded-removal-safe', level: 'error', code: 'PEXP010', description: 'Removing an expanded panel requires deterministic replacement state or explicit confirmation.' },
+        { validatorId: 'multi-expand-default-compatible', level: 'error', code: 'PEXP011', description: 'When accordion.multi is false, at most one panel may be marked expanded by default.' },
+        { validatorId: 'disabled-expanded-compatible', level: 'warning', code: 'PEXP012', description: 'A disabled panel should not be the only expanded/default focus target without explicit intent.' },
+        { validatorId: 'accordion-values-valid', level: 'error', code: 'PEXP013', description: 'Accordion behavior values must match ExpansionMetadata and Angular Material expansion bindings.' },
+        { validatorId: 'lazy-content-compatible', level: 'info', code: 'PEXP015', description: 'Panel content remains lazy through matExpansionPanelContent and should not require eager child runtime state.' },
+        { validatorId: 'nested-widget-contract-delegated', level: 'info', code: 'PEXP016', description: 'Nested widget content remains governed by child component contracts and component-port nestedPath semantics.' },
+        { validatorId: 'editor-runtime-round-trip', level: 'error', code: 'PEXP017', description: 'Settings Panel editor, runtime persistence and registry projection must preserve panel ids, order, icons and expanded state.' },
+    ],
+    roundTripRequirements: [
+        'Operations must preserve stable panel ids; array index may be used only as a resolver fallback, never as canonical identity.',
+        'Settings Panel editor, runtime persistence and registry projection must round-trip ExpansionMetadata without losing panel ids, order, icons or expanded state.',
+        'When accordion.multi is false, authoring must collapse competing panels or fail validation instead of producing multiple default-expanded panels.',
+        'Lazy panel content remains represented by panels[].content, panels[].widgets and panels[].actionButtons; authoring cannot require eager child component instances.',
+        'Nested widgets remain delegated through WidgetDefinition and component-port nestedPath semantics instead of being redefined by the expansion contract.',
+    ],
+    examples: [
+        { id: 'add-summary-panel', request: 'Add a summary panel before the audit panel.', operationId: 'panel.add', params: { id: 'summary', title: 'Summary' }, isPositive: true },
+        { id: 'rename-details-panel', request: 'Rename details to Account details.', operationId: 'panel.title.set', target: 'details', params: { title: 'Account details' }, isPositive: true },
+        { id: 'describe-audit-panel', request: 'Set audit panel description to Recent changes.', operationId: 'panel.description.set', target: 'audit', params: { description: 'Recent changes' }, isPositive: true },
+        { id: 'set-panel-icon', request: 'Use the info icon on the summary panel.', operationId: 'panel.icon.set', target: 'summary', params: { icon: 'info' }, isPositive: true },
+        { id: 'set-default-expanded-panel', request: 'Open the summary panel by default.', operationId: 'behavior.defaultExpanded.set', target: 'summary', params: { expanded: true, collapseOthers: true }, isPositive: true },
+        { id: 'enable-multi-expand', request: 'Allow multiple panels to stay open.', operationId: 'behavior.multiExpand.set', params: { multi: true }, isPositive: true },
+        { id: 'disable-archive-panel', request: 'Disable the archive panel.', operationId: 'panel.disabled.set', target: 'archive', params: { disabled: true }, isPositive: true },
+        { id: 'reject-missing-default-expanded', request: 'Open the missing panel by default.', operationId: 'behavior.defaultExpanded.set', target: 'missing', params: { expanded: true }, isPositive: false },
+        { id: 'reject-duplicate-panel-id', request: 'Add another panel with id summary.', operationId: 'panel.add', params: { id: 'summary', title: 'Duplicate summary' }, isPositive: false },
+        { id: 'confirm-remove-content-panel', request: 'Remove the details panel that contains widgets.', operationId: 'panel.remove', target: 'details', params: { replacementExpandedPanelId: 'summary' }, isPositive: true },
+    ],
+};
+
 /*
  * Public API Surface of praxis-expansion
  */
@@ -1699,4 +2920,4 @@ function providePraxisExpansionDefaults(opts) {
  * Generated bundle index. Do not edit.
  */
 
-export { EXPANSION_AI_CAPABILITIES, PRAXIS_EXPANSION_COMPONENT_METADATA, PraxisExpansion, PraxisExpansionConfigEditor, providePraxisExpansionDefaults, providePraxisExpansionMetadata };
+export { EXPANSION_AI_CAPABILITIES, PRAXIS_EXPANSION_AUTHORING_MANIFEST, PRAXIS_EXPANSION_COMPONENT_METADATA, PraxisExpansion, PraxisExpansionConfigEditor, PraxisExpansionWidgetConfigEditor, providePraxisExpansionDefaults, providePraxisExpansionMetadata };