@praxisui/settings-panel 9.0.5 → 9.0.6

package/README.md

@@ -49,6 +49,9 @@ export class SettingsContentComponent implements SettingsValueProvider {
 
 Open this standalone content with `SettingsPanelService.open(...)`; the host
 observes `SettingsPanelRef.applied$` and `saved$` to apply or persist changes.
+When that content needs to open a subordinate authoring editor, use
+`SettingsPanelService.openChild(...)`. The child receives its own lifecycle
+while the parent panel and its unsaved draft remain mounted.
 
 Peer dependencies (Angular v21):
 
@@ -80,6 +83,7 @@ Peer dependencies (Angular v21):
 - `expanded: true` abre o painel ja expandido de forma efetiva, respeitando `maxWidth`.
 - Expandir temporariamente o painel nao substitui a preferencia persistida do usuario; apenas o resize manual continua sendo persistido.
 - Quando um editor autoral tentar abrir outro painel sobre o atual, o shell passa pela mesma mediacao de fechamento do proprio painel. Se `onBeforeClose` vetar o fechamento, a substituicao nao acontece.
+- Para composicao intencional de editores, use `openChild(...)`: o painel filho fica acima do pai e, ao fechar, devolve o controle ao draft pai sem emitir fechamento ou descarte nele.
 
 ### 2. Drawer runtime
 
@@ -155,6 +159,12 @@ Regra de integracao:
   - `config.maxWidth?: string`
   - `config.diagnostics?: SettingsPanelDiagnosticsConfig`
   - `config.content: { component: Type<any>; inputs?: Record<string, any> }`
+- `openChild(config: SettingsPanelConfig): SettingsPanelRef`
+  - use somente para delegar uma parte do mesmo documento autoral a um editor subordinado
+  - preserva o draft do pai, mas torna sua superfície inerte e suspende seus atalhos globais
+  - ao fechar o filho, restaura foco/interação do pai sem emitir `closed$` nele
+- `close(reason?: SettingsPanelCloseReason): void`
+  - fecha o painel atualmente ativo; em uma composição pai/filho, fecha primeiro o filho
 
 ### Ref
 

package/ai/component-registry.json

@@ -1,8 +1,8 @@
 {
   "schemaVersion": "1.0.0",
-  "generatedAt": "2026-08-18T02:12:19.525Z",
+  "generatedAt": "2026-08-19T23:21:15.260Z",
   "packageName": "@praxisui/settings-panel",
-  "packageVersion": "9.0.5",
+  "packageVersion": "9.0.6",
   "sourceRegistry": "praxis-component-registry-ingestion",
   "sourceRegistryVersion": "1.0.0",
   "componentCount": 1,
@@ -191,7 +191,7 @@
           {
             "name": "config",
             "type": "SettingsPanelConfig",
-            "description": "Canonical settings panel shell config passed to SettingsPanelService.open."
+            "description": "Canonical settings panel shell config passed to SettingsPanelService.open or to openChild for a subordinate editor of the same authoring document."
           },
           {
             "name": "config.diagnostics",
@@ -862,7 +862,8 @@
               "editor-component-registered",
               "settings-value-provider-contract-present",
               "consumer-config-delegated",
-              "editor-inputs-serializable"
+              "editor-inputs-serializable",
+              "child-panel-isolates-parent-interaction"
             ],
             "affectedPaths": [
               "config.content.component",
@@ -949,6 +950,12 @@
             "code": "SETTINGS_PANEL_REPLACEMENT_MEDIATES_CLOSE",
             "description": "Opening a replacement panel must consult the current editor onBeforeClose before closing."
           },
+          {
+            "validatorId": "child-panel-isolates-parent-interaction",
+            "level": "error",
+            "code": "SETTINGS_PANEL_CHILD_ISOLATES_PARENT",
+            "description": "A subordinate authoring panel must preserve the parent draft while making the parent inert and preventing parent keyboard shortcuts until the child closes."
+          },
           {
             "validatorId": "title-i18n-compatible",
             "level": "warning",
@@ -1081,7 +1088,8 @@
           "SettingsValueProvider owns apply/save/reset payload extraction, while consumer config semantics stay delegated to the owning component manifest.",
           "Apply must emit applied$ without closing; Save must emit saved$ and close with reason save; Reset must be confirmed and emit reset$.",
           "Busy, dirty and valid state must gate Apply and Save consistently and remain visible through diagnostics.",
-          "Opening a replacement panel must pass through the current editor onBeforeClose and dirty-discard mediation."
+          "Opening a replacement panel must pass through the current editor onBeforeClose and dirty-discard mediation.",
+          "Opening a subordinate editor with openChild must preserve the parent draft, isolate parent focus and shortcuts, and reactivate the parent only after the child closes."
         ],
         "examples": [
           {
@@ -1287,9 +1295,9 @@
         {
           "chunkIndex": 8,
           "chunkKind": "authoring_manifest",
-          "content": "{\"operationId\":\"editor.host.configure\",\"schemaVersion\":\"1.0.0\",\"manifestVersion\":\"1.0.0\",\"componentId\":\"praxis-settings-panel\",\"ownerPackage\":\"@praxisui/settings-panel\",\"configSchemaId\":\"SettingsPanelConfig\",\"chunkSection\":\"operation_card\",\"semanticSummary\":\"Configure hosted editor Effects: compile-domain-patch. Open the table settings editor in the settings panel. Use settings-panel to rename a table column directly. Host a component that has no dirty, valid, busy or getSettingsValue contract.\",\"scope\":\"templating\",\"target\":{\"kind\":\"editorHost\",\"resolver\":\"settings-panel-editor-host\",\"required\":true},\"inputContract\":{\"required\":[\"componentId\"],\"properties\":[\"componentId\",\"inputs\",\"configManifestComponentId\",\"editorContract\"],\"semanticTerms\":[\"componentId\",\"inputs\",\"configManifestComponentId\",\"editorContract\",\"SettingsValueProvider\"]},\"effects\":[\"compile-domain-patch\"],\"affectedPaths\":[\"config.content.component\",\"config.content.inputs\",\"delegatedConsumerPatch\"],\"validators\":[{\"validatorId\":\"editor-component-registered\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_EDITOR_REGISTERED\",\"description\":\"Hosted editor component must resolve from governed component metadata or host registration.\"},{\"validatorId\":\"settings-value-provider-contract-present\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_PROVIDER_CONTRACT_PRESENT\",\"description\":\"Hosted authoring editors must implement SettingsValueProvider state and value contract.\"},{\"validatorId\":\"consumer-config-delegated\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_CONSUMER_CONFIG_DELEGATED\",\"description\":\"Consumer-specific config operations must delegate to the owning component manifest.\"},{\"validatorId\":\"editor-inputs-serializable\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_EDITOR_INPUTS_SERIALIZABLE\",\"description\":\"Persisted editor host inputs must be serializable safe values.\"}],\"preconditions\":[\"component-metadata-resolved\"],\"submissionImpact\":\"config-only\",\"presentationAffordances\":[],\"positiveExamples\":[{\"id\":\"open-component-editor\",\"request\":\"Open the table settings editor in the settings panel.\",\"operationId\":\"editor.host.configure\",\"params\":{\"componentId\":\"praxis-table\",\"inputs\":{\"tableId\":\"orders\"},\"configManifestComponentId\":\"praxis-table\",\"editorContract\":\"SettingsValueProvider\"},\"isPositive\":true}],\"negativeExamples\":[{\"id\":\"reject-table-column-direct-edit\",\"request\":\"Use settings-panel to rename a table column directly.\",\"operationId\":\"editor.host.configure\",\"params\":{\"componentId\":\"praxis-settings-panel\",\"inputs\":{\"columns\":[{\"field\":\"name\",\"label\":\"Name\"}]}},\"isPositive\":false},{\"id\":\"reject-missing-provider\",\"request\":\"Host a component that has no dirty, valid, busy or getSettingsValue contract.\",\"operationId\":\"editor.host.configure\",\"params\":{\"componentId\":\"plain-info-card\"},\"isPositive\":false}]}",
+          "content": "{\"operationId\":\"editor.host.configure\",\"schemaVersion\":\"1.0.0\",\"manifestVersion\":\"1.0.0\",\"componentId\":\"praxis-settings-panel\",\"ownerPackage\":\"@praxisui/settings-panel\",\"configSchemaId\":\"SettingsPanelConfig\",\"chunkSection\":\"operation_card\",\"semanticSummary\":\"Configure hosted editor Effects: compile-domain-patch. Open the table settings editor in the settings panel. Use settings-panel to rename a table column directly. Host a component that has no dirty, valid, busy or getSettingsValue contract.\",\"scope\":\"templating\",\"target\":{\"kind\":\"editorHost\",\"resolver\":\"settings-panel-editor-host\",\"required\":true},\"inputContract\":{\"required\":[\"componentId\"],\"properties\":[\"componentId\",\"inputs\",\"configManifestComponentId\",\"editorContract\"],\"semanticTerms\":[\"componentId\",\"inputs\",\"configManifestComponentId\",\"editorContract\",\"SettingsValueProvider\"]},\"effects\":[\"compile-domain-patch\"],\"affectedPaths\":[\"config.content.component\",\"config.content.inputs\",\"delegatedConsumerPatch\"],\"validators\":[{\"validatorId\":\"editor-component-registered\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_EDITOR_REGISTERED\",\"description\":\"Hosted editor component must resolve from governed component metadata or host registration.\"},{\"validatorId\":\"settings-value-provider-contract-present\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_PROVIDER_CONTRACT_PRESENT\",\"description\":\"Hosted authoring editors must implement SettingsValueProvider state and value contract.\"},{\"validatorId\":\"consumer-config-delegated\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_CONSUMER_CONFIG_DELEGATED\",\"description\":\"Consumer-specific config operations must delegate to the owning component manifest.\"},{\"validatorId\":\"editor-inputs-serializable\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_EDITOR_INPUTS_SERIALIZABLE\",\"description\":\"Persisted editor host inputs must be serializable safe values.\"},{\"validatorId\":\"child-panel-isolates-parent-interaction\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_CHILD_ISOLATES_PARENT\",\"description\":\"A subordinate authoring panel must preserve the parent draft while making the parent inert and preventing parent keyboard shortcuts until the child closes.\"}],\"preconditions\":[\"component-metadata-resolved\"],\"submissionImpact\":\"config-only\",\"presentationAffordances\":[],\"positiveExamples\":[{\"id\":\"open-component-editor\",\"request\":\"Open the table settings editor in the settings panel.\",\"operationId\":\"editor.host.configure\",\"params\":{\"componentId\":\"praxis-table\",\"inputs\":{\"tableId\":\"orders\"},\"configManifestComponentId\":\"praxis-table\",\"editorContract\":\"SettingsValueProvider\"},\"isPositive\":true}],\"negativeExamples\":[{\"id\":\"reject-table-column-direct-edit\",\"request\":\"Use settings-panel to rename a table column directly.\",\"operationId\":\"editor.host.configure\",\"params\":{\"componentId\":\"praxis-settings-panel\",\"inputs\":{\"columns\":[{\"field\":\"name\",\"label\":\"Name\"}]}},\"isPositive\":false},{\"id\":\"reject-missing-provider\",\"request\":\"Host a component that has no dirty, valid, busy or getSettingsValue contract.\",\"operationId\":\"editor.host.configure\",\"params\":{\"componentId\":\"plain-info-card\"},\"isPositive\":false}]}",
           "sourcePointer": "projects/praxis-settings-panel/src/lib/ai/praxis-settings-panel-authoring-manifest.ts",
-          "contentHash": "c8d462760a6bd9a86f89e0856c2395b58dc314f8a10f8571168ba02cf20add9e",
+          "contentHash": "1c6fc7fe58a3d14fc9e0b9e3040d6935d68bc3b3239338b8c9a8f4bc78659845",
           "sourceKind": "component_definition",
           "sourceId": "praxis-settings-panel",
           "corpusVersion": "1.0.0"
@@ -1317,9 +1325,9 @@
         {
           "chunkIndex": 11,
           "chunkKind": "authoring_manifest",
-          "content": "{\"schemaVersion\":\"1.0.0\",\"manifestVersion\":\"1.0.0\",\"componentId\":\"praxis-settings-panel\",\"ownerPackage\":\"@praxisui/settings-panel\",\"configSchemaId\":\"SettingsPanelConfig\",\"chunkSection\":\"runtimeInputs\",\"runtimeInputs\":[{\"name\":\"config\",\"type\":\"SettingsPanelConfig\",\"description\":\"Canonical settings panel shell config passed to SettingsPanelService.open.\"},{\"name\":\"config.diagnostics\",\"type\":\"SettingsPanelDiagnosticsConfig\",\"description\":\"Optional shell diagnostics visibility config for status, disabled reason, busy state and validation state.\"},{\"name\":\"content.component\",\"type\":\"Type<SettingsValueProvider>\",\"description\":\"Standalone editor component hosted inside the authoring shell.\"},{\"name\":\"content.inputs\",\"type\":\"Record<string, unknown>\",\"description\":\"Initial editor inputs owned by the consumer component manifest.\"},{\"name\":\"ref\",\"type\":\"SettingsPanelRef\",\"description\":\"Panel ref that emits applied, saved, reset, closed and sizeChanged events.\"},{\"name\":\"provider\",\"type\":\"SettingsValueProvider\",\"description\":\"Editor protocol for dirty, valid, busy, getSettingsValue, onSave, reset and close hooks.\"}]}",
+          "content": "{\"schemaVersion\":\"1.0.0\",\"manifestVersion\":\"1.0.0\",\"componentId\":\"praxis-settings-panel\",\"ownerPackage\":\"@praxisui/settings-panel\",\"configSchemaId\":\"SettingsPanelConfig\",\"chunkSection\":\"runtimeInputs\",\"runtimeInputs\":[{\"name\":\"config\",\"type\":\"SettingsPanelConfig\",\"description\":\"Canonical settings panel shell config passed to SettingsPanelService.open or to openChild for a subordinate editor of the same authoring document.\"},{\"name\":\"config.diagnostics\",\"type\":\"SettingsPanelDiagnosticsConfig\",\"description\":\"Optional shell diagnostics visibility config for status, disabled reason, busy state and validation state.\"},{\"name\":\"content.component\",\"type\":\"Type<SettingsValueProvider>\",\"description\":\"Standalone editor component hosted inside the authoring shell.\"},{\"name\":\"content.inputs\",\"type\":\"Record<string, unknown>\",\"description\":\"Initial editor inputs owned by the consumer component manifest.\"},{\"name\":\"ref\",\"type\":\"SettingsPanelRef\",\"description\":\"Panel ref that emits applied, saved, reset, closed and sizeChanged events.\"},{\"name\":\"provider\",\"type\":\"SettingsValueProvider\",\"description\":\"Editor protocol for dirty, valid, busy, getSettingsValue, onSave, reset and close hooks.\"}]}",
           "sourcePointer": "projects/praxis-settings-panel/src/lib/ai/praxis-settings-panel-authoring-manifest.ts",
-          "contentHash": "a5bb1979f05c7cdb7696331f4f3f6a4cd6d2be4f557caf76effbb9165fd0263e",
+          "contentHash": "6aefd3c8ddd901bf20faa01aab1d3b34a570a06f9485e926f380a5b52230005b",
           "sourceKind": "component_definition",
           "sourceId": "praxis-settings-panel",
           "corpusVersion": "1.0.0"
@@ -1347,9 +1355,9 @@
         {
           "chunkIndex": 14,
           "chunkKind": "authoring_manifest",
-          "content": "{\"schemaVersion\":\"1.0.0\",\"manifestVersion\":\"1.0.0\",\"componentId\":\"praxis-settings-panel\",\"ownerPackage\":\"@praxisui/settings-panel\",\"configSchemaId\":\"SettingsPanelConfig\",\"chunkSection\":\"operations\",\"operations\":[{\"operationId\":\"panel.resetBehavior.set\",\"title\":\"Set reset behavior\",\"scope\":\"interaction\",\"targetKind\":\"resetBehavior\",\"target\":{\"kind\":\"resetBehavior\",\"resolver\":\"settings-value-provider-reset-contract\",\"ambiguityPolicy\":\"fail\",\"required\":false},\"inputSchema\":{\"type\":\"object\",\"minProperties\":1,\"properties\":{\"requireConfirmation\":{\"type\":\"boolean\"},\"callProviderReset\":{\"type\":\"boolean\"},\"emitResetEvent\":{\"type\":\"boolean\"},\"clearSavedStatus\":{\"type\":\"boolean\"}}},\"effects\":[{\"kind\":\"compile-domain-patch\",\"handler\":\"settings-panel-reset-behavior-set\",\"handlerContract\":{\"reads\":[\"SettingsValueProvider.reset\",\"SettingsPanelRef.reset$\",\"ConfirmDialogComponent\"],\"writes\":[\"provider.reset()\",\"SettingsPanelRef.reset$\",\"panel.lastSavedAt\"],\"identityKeys\":[\"config.id\",\"provider.reset\"],\"inputSchema\":{\"type\":\"object\",\"properties\":{\"requireConfirmation\":{\"type\":\"boolean\"},\"callProviderReset\":{\"type\":\"boolean\"},\"emitResetEvent\":{\"type\":\"boolean\"}}},\"failureModes\":[\"reset-confirmation-missing\",\"provider-reset-failed\",\"reset-event-not-emitted\"],\"description\":\"Preserves Reset as a confirmed shell action that calls the provider reset hook and emits SettingsPanelRef.reset$.\"}}],\"destructive\":true,\"requiresConfirmation\":true,\"validators\":[\"reset-requires-confirmation\",\"reset-calls-provider-reset\",\"reset-event-emitted\",\"settings-panel-round-trip\"],\"affectedPaths\":[\"provider.reset\",\"ref.reset$\",\"panel.lastSavedAt\"],\"submissionImpact\":\"config-only\",\"preconditions\":[\"settings-value-provider-attached\",\"confirmation-collected\"]},{\"operationId\":\"editor.host.configure\",\"title\":\"Configure hosted editor\",\"scope\":\"templating\",\"targetKind\":\"editorHost\",\"target\":{\"kind\":\"editorHost\",\"resolver\":\"settings-panel-editor-host\",\"ambiguityPolicy\":\"fail\",\"required\":true},\"inputSchema\":{\"type\":\"object\",\"required\":[\"componentId\"],\"properties\":{\"componentId\":{\"type\":\"string\"},\"inputs\":{\"type\":\"object\"},\"configManifestComponentId\":{\"type\":\"string\"},\"editorContract\":{\"enum\":[\"SettingsValueProvider\"]}}},\"effects\":[{\"kind\":\"compile-domain-patch\",\"handler\":\"settings-panel-editor-host-configure\",\"handlerContract\":{\"reads\":[\"ComponentMetadataRegistry\",\"SettingsPanelConfig.content\",\"SettingsValueProvider\",\"component.authoringManifest\"],\"writes\":[\"config.content.component\",\"config.content.inputs\",\"delegatedConsumerPatch\"],\"identityKeys\":[\"componentId\",\"configManifestComponentId\"],\"inputSchema\":{\"type\":\"object\",\"required\":[\"componentId\"],\"properties\":{\"componentId\":{\"type\":\"string\"},\"inputs\":{\"type\":\"object\"},\"configManifestComponentId\":{\"type\":\"string\"},\"editorContract\":{\"enum\":[\"SettingsValueProvider\"]}}},\"failureModes\":[\"editor-component-not-registered\",\"settings-value-provider-missing\",\"consumer-manifest-required\",\"consumer-config-boundary-violation\"],\"description\":\"Configures the hosted editor component and input envelope while delegating consumer-specific config edits to the owning component manifest.\"}}],\"validators\":[\"editor-component-registered\",\"settings-value-provider-contract-present\",\"consumer-config-delegated\",\"editor-inputs-serializable\"],\"affectedPaths\":[\"config.content.component\",\"config.content.inputs\",\"delegatedConsumerPatch\"],\"submissionImpact\":\"config-only\",\"destructive\":false,\"requiresConfirmation\":false,\"preconditions\":[\"component-metadata-resolved\"]},{\"operationId\":\"diagnostics.visibility.set\",\"title\":\"Set panel diagnostics visibility\",\"scope\":\"interaction\",\"targetKind\":\"diagnostics\",\"target\":{\"kind\":\"diagnostics\",\"resolver\":\"settings-panel-state-diagnostics\",\"ambiguityPolicy\":\"fail\",\"required\":false},\"inputSchema\":{\"type\":\"object\",\"minProperties\":1,\"properties\":{\"showStatusMessage\":{\"type\":\"boolean\"},\"showDisabledReason\":{\"type\":\"boolean\"},\"showBusyState\":{\"type\":\"boolean\"},\"exposeValidationState\":{\"type\":\"boolean\"}}},\"effects\":[{\"kind\":\"merge-object\",\"path\":\"config.diagnostics\"}],\"validators\":[\"diagnostics-follow-provider-state\",\"diagnostics-i18n-compatible\",\"busy-valid-dirty-visible-when-needed\",\"settings-panel-round-trip\"],\"affectedPaths\":[\"config.diagnostics.showStatusMessage\",\"config.diagnostics.showDisabledReason\",\"config.diagnostics.showBusyState\",\"config.diagnostics.exposeValidationState\",\"panel.statusMessage\",\"panel.disabledReason\",\"panel.isDirty\",\"panel.isValid\",\"panel.isBusy\"],\"submissionImpact\":\"visual-only\",\"destructive\":false,\"requiresConfirmation\":false,\"preconditions\":[\"settings-value-provider-attached\"]}]}",
+          "content": "{\"schemaVersion\":\"1.0.0\",\"manifestVersion\":\"1.0.0\",\"componentId\":\"praxis-settings-panel\",\"ownerPackage\":\"@praxisui/settings-panel\",\"configSchemaId\":\"SettingsPanelConfig\",\"chunkSection\":\"operations\",\"operations\":[{\"operationId\":\"panel.resetBehavior.set\",\"title\":\"Set reset behavior\",\"scope\":\"interaction\",\"targetKind\":\"resetBehavior\",\"target\":{\"kind\":\"resetBehavior\",\"resolver\":\"settings-value-provider-reset-contract\",\"ambiguityPolicy\":\"fail\",\"required\":false},\"inputSchema\":{\"type\":\"object\",\"minProperties\":1,\"properties\":{\"requireConfirmation\":{\"type\":\"boolean\"},\"callProviderReset\":{\"type\":\"boolean\"},\"emitResetEvent\":{\"type\":\"boolean\"},\"clearSavedStatus\":{\"type\":\"boolean\"}}},\"effects\":[{\"kind\":\"compile-domain-patch\",\"handler\":\"settings-panel-reset-behavior-set\",\"handlerContract\":{\"reads\":[\"SettingsValueProvider.reset\",\"SettingsPanelRef.reset$\",\"ConfirmDialogComponent\"],\"writes\":[\"provider.reset()\",\"SettingsPanelRef.reset$\",\"panel.lastSavedAt\"],\"identityKeys\":[\"config.id\",\"provider.reset\"],\"inputSchema\":{\"type\":\"object\",\"properties\":{\"requireConfirmation\":{\"type\":\"boolean\"},\"callProviderReset\":{\"type\":\"boolean\"},\"emitResetEvent\":{\"type\":\"boolean\"}}},\"failureModes\":[\"reset-confirmation-missing\",\"provider-reset-failed\",\"reset-event-not-emitted\"],\"description\":\"Preserves Reset as a confirmed shell action that calls the provider reset hook and emits SettingsPanelRef.reset$.\"}}],\"destructive\":true,\"requiresConfirmation\":true,\"validators\":[\"reset-requires-confirmation\",\"reset-calls-provider-reset\",\"reset-event-emitted\",\"settings-panel-round-trip\"],\"affectedPaths\":[\"provider.reset\",\"ref.reset$\",\"panel.lastSavedAt\"],\"submissionImpact\":\"config-only\",\"preconditions\":[\"settings-value-provider-attached\",\"confirmation-collected\"]},{\"operationId\":\"editor.host.configure\",\"title\":\"Configure hosted editor\",\"scope\":\"templating\",\"targetKind\":\"editorHost\",\"target\":{\"kind\":\"editorHost\",\"resolver\":\"settings-panel-editor-host\",\"ambiguityPolicy\":\"fail\",\"required\":true},\"inputSchema\":{\"type\":\"object\",\"required\":[\"componentId\"],\"properties\":{\"componentId\":{\"type\":\"string\"},\"inputs\":{\"type\":\"object\"},\"configManifestComponentId\":{\"type\":\"string\"},\"editorContract\":{\"enum\":[\"SettingsValueProvider\"]}}},\"effects\":[{\"kind\":\"compile-domain-patch\",\"handler\":\"settings-panel-editor-host-configure\",\"handlerContract\":{\"reads\":[\"ComponentMetadataRegistry\",\"SettingsPanelConfig.content\",\"SettingsValueProvider\",\"component.authoringManifest\"],\"writes\":[\"config.content.component\",\"config.content.inputs\",\"delegatedConsumerPatch\"],\"identityKeys\":[\"componentId\",\"configManifestComponentId\"],\"inputSchema\":{\"type\":\"object\",\"required\":[\"componentId\"],\"properties\":{\"componentId\":{\"type\":\"string\"},\"inputs\":{\"type\":\"object\"},\"configManifestComponentId\":{\"type\":\"string\"},\"editorContract\":{\"enum\":[\"SettingsValueProvider\"]}}},\"failureModes\":[\"editor-component-not-registered\",\"settings-value-provider-missing\",\"consumer-manifest-required\",\"consumer-config-boundary-violation\"],\"description\":\"Configures the hosted editor component and input envelope while delegating consumer-specific config edits to the owning component manifest.\"}}],\"validators\":[\"editor-component-registered\",\"settings-value-provider-contract-present\",\"consumer-config-delegated\",\"editor-inputs-serializable\",\"child-panel-isolates-parent-interaction\"],\"affectedPaths\":[\"config.content.component\",\"config.content.inputs\",\"delegatedConsumerPatch\"],\"submissionImpact\":\"config-only\",\"destructive\":false,\"requiresConfirmation\":false,\"preconditions\":[\"component-metadata-resolved\"]},{\"operationId\":\"diagnostics.visibility.set\",\"title\":\"Set panel diagnostics visibility\",\"scope\":\"interaction\",\"targetKind\":\"diagnostics\",\"target\":{\"kind\":\"diagnostics\",\"resolver\":\"settings-panel-state-diagnostics\",\"ambiguityPolicy\":\"fail\",\"required\":false},\"inputSchema\":{\"type\":\"object\",\"minProperties\":1,\"properties\":{\"showStatusMessage\":{\"type\":\"boolean\"},\"showDisabledReason\":{\"type\":\"boolean\"},\"showBusyState\":{\"type\":\"boolean\"},\"exposeValidationState\":{\"type\":\"boolean\"}}},\"effects\":[{\"kind\":\"merge-object\",\"path\":\"config.diagnostics\"}],\"validators\":[\"diagnostics-follow-provider-state\",\"diagnostics-i18n-compatible\",\"busy-valid-dirty-visible-when-needed\",\"settings-panel-round-trip\"],\"affectedPaths\":[\"config.diagnostics.showStatusMessage\",\"config.diagnostics.showDisabledReason\",\"config.diagnostics.showBusyState\",\"config.diagnostics.exposeValidationState\",\"panel.statusMessage\",\"panel.disabledReason\",\"panel.isDirty\",\"panel.isValid\",\"panel.isBusy\"],\"submissionImpact\":\"visual-only\",\"destructive\":false,\"requiresConfirmation\":false,\"preconditions\":[\"settings-value-provider-attached\"]}]}",
           "sourcePointer": "projects/praxis-settings-panel/src/lib/ai/praxis-settings-panel-authoring-manifest.ts",
-          "contentHash": "f241c2fdcbb24c343dd55e42191c1edfd147dceff22135635d4321a07027e133",
+          "contentHash": "9d55ed7aad2a6a94e5c55c4beb83f7c7459e2c9fcc180fb4043bfb13be2de5c0",
           "sourceKind": "component_definition",
           "sourceId": "praxis-settings-panel",
           "corpusVersion": "1.0.0"
@@ -1357,9 +1365,9 @@
         {
           "chunkIndex": 15,
           "chunkKind": "authoring_manifest",
-          "content": "{\"schemaVersion\":\"1.0.0\",\"manifestVersion\":\"1.0.0\",\"componentId\":\"praxis-settings-panel\",\"ownerPackage\":\"@praxisui/settings-panel\",\"configSchemaId\":\"SettingsPanelConfig\",\"chunkSection\":\"validators\",\"validators\":[{\"validatorId\":\"panel-id-stable\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_ID_STABLE\",\"description\":\"Panel id must remain stable for replacement, persistence and diagnostics.\"},{\"validatorId\":\"replacement-mediates-before-close\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_REPLACEMENT_MEDIATES_CLOSE\",\"description\":\"Opening a replacement panel must consult the current editor onBeforeClose before closing.\"},{\"validatorId\":\"title-i18n-compatible\",\"level\":\"warning\",\"code\":\"SETTINGS_PANEL_TITLE_I18N_COMPATIBLE\",\"description\":\"Authoring chrome text must remain compatible with the settings panel i18n namespace.\"},{\"validatorId\":\"panel-size-safe\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_SIZE_SAFE\",\"description\":\"Panel sizes must be finite numbers or safe CSS size strings.\"},{\"validatorId\":\"panel-min-max-consistent\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_MIN_MAX_CONSISTENT\",\"description\":\"Minimum width must not exceed maximum width.\"},{\"validatorId\":\"resize-persistence-explicit\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_RESIZE_PERSISTENCE_EXPLICIT\",\"description\":\"Persisted resize must use a stable persistSizeKey or be explicitly transient.\"},{\"validatorId\":\"apply-requires-provider-value\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_APPLY_REQUIRES_PROVIDER_VALUE\",\"description\":\"Apply must obtain payloads from SettingsValueProvider.getSettingsValue().\"},{\"validatorId\":\"apply-does-not-close-panel\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_APPLY_DOES_NOT_CLOSE\",\"description\":\"Apply emits preview payloads without closing the panel.\"},{\"validatorId\":\"dirty-valid-busy-gates-preserved\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_STATE_GATES_PRESERVED\",\"description\":\"Apply and Save remain gated by dirty, valid and busy state.\"},{\"validatorId\":\"save-prefers-provider-hook\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_SAVE_PREFERS_PROVIDER_HOOK\",\"description\":\"Save must call onSave when provided before falling back to getSettingsValue().\"},{\"validatorId\":\"save-fallback-value-preserved\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_SAVE_FALLBACK_PRESERVED\",\"description\":\"Save fallback must preserve getSettingsValue payload semantics.\"},{\"validatorId\":\"save-closes-with-save-reason\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_SAVE_CLOSE_REASON\",\"description\":\"Successful save must emit saved$ and close with reason save.\"},{\"validatorId\":\"reset-requires-confirmation\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_RESET_REQUIRES_CONFIRMATION\",\"description\":\"Reset is destructive and must remain confirmed before provider reset is called.\"},{\"validatorId\":\"reset-calls-provider-reset\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_RESET_CALLS_PROVIDER\",\"description\":\"Reset must call the hosted provider reset hook when present.\"},{\"validatorId\":\"reset-event-emitted\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_RESET_EVENT_EMITTED\",\"description\":\"Reset must emit SettingsPanelRef.reset$ so hosts can coordinate state.\"},{\"validatorId\":\"editor-component-registered\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_EDITOR_REGISTERED\",\"description\":\"Hosted editor component must resolve from governed component metadata or host registration.\"},{\"validatorId\":\"settings-value-provider-contract-present\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_PROVIDER_CONTRACT_PRESENT\",\"description\":\"Hosted authoring editors must implement SettingsValueProvider state and value contract.\"},{\"validatorId\":\"consumer-config-delegated\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_CONSUMER_CONFIG_DELEGATED\",\"description\":\"Consumer-specific config operations must delegate to the owning component manifest.\"},{\"validatorId\":\"editor-inputs-serializable\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_EDITOR_INPUTS_SERIALIZABLE\",\"description\":\"Persisted editor host inputs must be serializable safe values.\"},{\"validatorId\":\"diagnostics-follow-provider-state\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_DIAGNOSTICS_PROVIDER_STATE\",\"description\":\"Diagnostics must reflect provider dirty, valid and busy state.\"},{\"validatorId\":\"diagnostics-i18n-compatible\",\"level\":\"warning\",\"code\":\"SETTINGS_PANEL_DIAGNOSTICS_I18N_COMPATIBLE\",\"description\":\"Diagnostics copy must use the settings panel i18n namespace.\"},{\"validatorId\":\"busy-valid-dirty-visible-when-needed\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_STATE_VISIBLE\",\"description\":\"Busy, invalid and dirty states must remain visible or explain disabled actions.\"},{\"validatorId\":\"settings-panel-round-trip\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_ROUND_TRIP\",\"description\":\"Open, edit, apply, save, reset and reopen must preserve the shell protocol without mutating consumer config semantics.\"}]}",
+          "content": "{\"schemaVersion\":\"1.0.0\",\"manifestVersion\":\"1.0.0\",\"componentId\":\"praxis-settings-panel\",\"ownerPackage\":\"@praxisui/settings-panel\",\"configSchemaId\":\"SettingsPanelConfig\",\"chunkSection\":\"validators\",\"validators\":[{\"validatorId\":\"panel-id-stable\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_ID_STABLE\",\"description\":\"Panel id must remain stable for replacement, persistence and diagnostics.\"},{\"validatorId\":\"replacement-mediates-before-close\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_REPLACEMENT_MEDIATES_CLOSE\",\"description\":\"Opening a replacement panel must consult the current editor onBeforeClose before closing.\"},{\"validatorId\":\"child-panel-isolates-parent-interaction\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_CHILD_ISOLATES_PARENT\",\"description\":\"A subordinate authoring panel must preserve the parent draft while making the parent inert and preventing parent keyboard shortcuts until the child closes.\"},{\"validatorId\":\"title-i18n-compatible\",\"level\":\"warning\",\"code\":\"SETTINGS_PANEL_TITLE_I18N_COMPATIBLE\",\"description\":\"Authoring chrome text must remain compatible with the settings panel i18n namespace.\"},{\"validatorId\":\"panel-size-safe\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_SIZE_SAFE\",\"description\":\"Panel sizes must be finite numbers or safe CSS size strings.\"},{\"validatorId\":\"panel-min-max-consistent\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_MIN_MAX_CONSISTENT\",\"description\":\"Minimum width must not exceed maximum width.\"},{\"validatorId\":\"resize-persistence-explicit\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_RESIZE_PERSISTENCE_EXPLICIT\",\"description\":\"Persisted resize must use a stable persistSizeKey or be explicitly transient.\"},{\"validatorId\":\"apply-requires-provider-value\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_APPLY_REQUIRES_PROVIDER_VALUE\",\"description\":\"Apply must obtain payloads from SettingsValueProvider.getSettingsValue().\"},{\"validatorId\":\"apply-does-not-close-panel\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_APPLY_DOES_NOT_CLOSE\",\"description\":\"Apply emits preview payloads without closing the panel.\"},{\"validatorId\":\"dirty-valid-busy-gates-preserved\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_STATE_GATES_PRESERVED\",\"description\":\"Apply and Save remain gated by dirty, valid and busy state.\"},{\"validatorId\":\"save-prefers-provider-hook\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_SAVE_PREFERS_PROVIDER_HOOK\",\"description\":\"Save must call onSave when provided before falling back to getSettingsValue().\"},{\"validatorId\":\"save-fallback-value-preserved\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_SAVE_FALLBACK_PRESERVED\",\"description\":\"Save fallback must preserve getSettingsValue payload semantics.\"},{\"validatorId\":\"save-closes-with-save-reason\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_SAVE_CLOSE_REASON\",\"description\":\"Successful save must emit saved$ and close with reason save.\"},{\"validatorId\":\"reset-requires-confirmation\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_RESET_REQUIRES_CONFIRMATION\",\"description\":\"Reset is destructive and must remain confirmed before provider reset is called.\"},{\"validatorId\":\"reset-calls-provider-reset\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_RESET_CALLS_PROVIDER\",\"description\":\"Reset must call the hosted provider reset hook when present.\"},{\"validatorId\":\"reset-event-emitted\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_RESET_EVENT_EMITTED\",\"description\":\"Reset must emit SettingsPanelRef.reset$ so hosts can coordinate state.\"},{\"validatorId\":\"editor-component-registered\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_EDITOR_REGISTERED\",\"description\":\"Hosted editor component must resolve from governed component metadata or host registration.\"},{\"validatorId\":\"settings-value-provider-contract-present\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_PROVIDER_CONTRACT_PRESENT\",\"description\":\"Hosted authoring editors must implement SettingsValueProvider state and value contract.\"},{\"validatorId\":\"consumer-config-delegated\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_CONSUMER_CONFIG_DELEGATED\",\"description\":\"Consumer-specific config operations must delegate to the owning component manifest.\"},{\"validatorId\":\"editor-inputs-serializable\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_EDITOR_INPUTS_SERIALIZABLE\",\"description\":\"Persisted editor host inputs must be serializable safe values.\"},{\"validatorId\":\"diagnostics-follow-provider-state\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_DIAGNOSTICS_PROVIDER_STATE\",\"description\":\"Diagnostics must reflect provider dirty, valid and busy state.\"},{\"validatorId\":\"diagnostics-i18n-compatible\",\"level\":\"warning\",\"code\":\"SETTINGS_PANEL_DIAGNOSTICS_I18N_COMPATIBLE\",\"description\":\"Diagnostics copy must use the settings panel i18n namespace.\"},{\"validatorId\":\"busy-valid-dirty-visible-when-needed\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_STATE_VISIBLE\",\"description\":\"Busy, invalid and dirty states must remain visible or explain disabled actions.\"},{\"validatorId\":\"settings-panel-round-trip\",\"level\":\"error\",\"code\":\"SETTINGS_PANEL_ROUND_TRIP\",\"description\":\"Open, edit, apply, save, reset and reopen must preserve the shell protocol without mutating consumer config semantics.\"}]}",
           "sourcePointer": "projects/praxis-settings-panel/src/lib/ai/praxis-settings-panel-authoring-manifest.ts",
-          "contentHash": "a2f66de090eae4c731f69cf673551a0420af3625ab81bcfb4d41c4e6821efe24",
+          "contentHash": "113367420fed3529b93de6f8f978657063d01fb96686feb8ee276c047bd1fe64",
           "sourceKind": "component_definition",
           "sourceId": "praxis-settings-panel",
           "corpusVersion": "1.0.0"
@@ -1367,9 +1375,9 @@
         {
           "chunkIndex": 16,
           "chunkKind": "authoring_manifest",
-          "content": "{\"schemaVersion\":\"1.0.0\",\"manifestVersion\":\"1.0.0\",\"componentId\":\"praxis-settings-panel\",\"ownerPackage\":\"@praxisui/settings-panel\",\"configSchemaId\":\"SettingsPanelConfig\",\"chunkSection\":\"roundTripRequirements\",\"roundTripRequirements\":[\"SettingsPanelConfig owns only shell fields: identity, title, size, resize persistence and hosted editor envelope.\",\"SettingsValueProvider owns apply/save/reset payload extraction, while consumer config semantics stay delegated to the owning component manifest.\",\"Apply must emit applied$ without closing; Save must emit saved$ and close with reason save; Reset must be confirmed and emit reset$.\",\"Busy, dirty and valid state must gate Apply and Save consistently and remain visible through diagnostics.\",\"Opening a replacement panel must pass through the current editor onBeforeClose and dirty-discard mediation.\"]}",
+          "content": "{\"schemaVersion\":\"1.0.0\",\"manifestVersion\":\"1.0.0\",\"componentId\":\"praxis-settings-panel\",\"ownerPackage\":\"@praxisui/settings-panel\",\"configSchemaId\":\"SettingsPanelConfig\",\"chunkSection\":\"roundTripRequirements\",\"roundTripRequirements\":[\"SettingsPanelConfig owns only shell fields: identity, title, size, resize persistence and hosted editor envelope.\",\"SettingsValueProvider owns apply/save/reset payload extraction, while consumer config semantics stay delegated to the owning component manifest.\",\"Apply must emit applied$ without closing; Save must emit saved$ and close with reason save; Reset must be confirmed and emit reset$.\",\"Busy, dirty and valid state must gate Apply and Save consistently and remain visible through diagnostics.\",\"Opening a replacement panel must pass through the current editor onBeforeClose and dirty-discard mediation.\",\"Opening a subordinate editor with openChild must preserve the parent draft, isolate parent focus and shortcuts, and reactivate the parent only after the child closes.\"]}",
           "sourcePointer": "projects/praxis-settings-panel/src/lib/ai/praxis-settings-panel-authoring-manifest.ts",
-          "contentHash": "75c07611e26a30925189ba8fc8f2a69ef4405adc96da811ead2d218a0e37d8cb",
+          "contentHash": "ab20146fd5fcac4be16991700131c38043e36b38d9518c1db8a7fe9b71e55930",
           "sourceKind": "component_definition",
           "sourceId": "praxis-settings-panel",
           "corpusVersion": "1.0.0"

package/fesm2022/praxisui-settings-panel.mjs

@@ -509,6 +509,25 @@ function paneContainsOrMatches(pane, ownerElement) {
     return pane === ownerElement || pane.contains(ownerElement);
 }
 
+function resolveExpandedPanelWidth(options) {
+    const current = parsePixelWidth(options.currentWidth) ?? 720;
+    const viewport = options.viewportWidth ??
+        (typeof window !== 'undefined' ? window.innerWidth : current);
+    const min = parsePixelWidth(options.minWidth) ?? 320;
+    const max = Math.min(parsePixelWidth(options.maxWidth) ?? viewport, viewport);
+    const desired = viewport * 0.95;
+    const clamped = Math.min(Math.max(Math.round(desired), min), Math.max(min, max));
+    return `${clamped}px`;
+}
+function parsePixelWidth(value) {
+    const normalized = value?.trim().toLowerCase();
+    if (!normalized?.endsWith('px')) {
+        return null;
+    }
+    const parsed = Number.parseFloat(normalized.slice(0, -2));
+    return Number.isFinite(parsed) ? parsed : null;
+}
+
 const DEFAULT_DIAGNOSTICS = {
     showStatusMessage: true,
     showDisabledReason: true,
@@ -528,6 +547,7 @@ class SettingsPanelComponent {
     resizable = false;
     persistSizeKey;
     expanded = false;
+    interactionActive = true;
     ref;
     contentRef;
     static nextId = 0;
@@ -555,13 +575,13 @@ class SettingsPanelComponent {
         this.overlayContainer = overlayContainer;
     }
     get canApply() {
-        return this.isDirty && this.isValid && !this.isBusy;
+        return this.interactionActive && this.isDirty && this.isValid && !this.isBusy;
     }
     get panelInlineStyles() {
         return {
-            width: this.width ?? null,
-            minWidth: this.minWidth ?? null,
-            maxWidth: this.maxWidth ?? null,
+            width: '100%',
+            minWidth: '0',
+            maxWidth: '100%',
         };
     }
     get showResizeHandle() {
@@ -571,7 +591,11 @@ class SettingsPanelComponent {
         return this.tx('Resize panel');
     }
     get canSave() {
-        return this.isDirty && this.isValid && !this.isBusy;
+        return this.interactionActive && this.isDirty && this.isValid && !this.isBusy;
+    }
+    setInteractionActive(active) {
+        this.interactionActive = active;
+        this.cdr.detectChanges();
     }
     get disabledReason() {
         if (this.isBusy) {
@@ -884,6 +908,9 @@ class SettingsPanelComponent {
         }));
     }
     handleKeydown(event) {
+        if (!this.interactionActive) {
+            return;
+        }
         if (event.key === 'Escape') {
             if (this.shouldDeferEscape(event)) {
                 return;
@@ -936,11 +963,11 @@ class SettingsPanelComponent {
         return Math.min(Math.max(Math.round(value), min), Math.max(min, max));
     }
     computeExpandedWidth() {
-        const viewportWidth = typeof window !== 'undefined'
-            ? window.innerWidth
-            : this.getCurrentWidthPx();
-        const desired = viewportWidth * 0.95;
-        return `${this.clampWidthPx(desired)}px`;
+        return resolveExpandedPanelWidth({
+            currentWidth: this.width,
+            minWidth: this.minWidth,
+            maxWidth: this.maxWidth,
+        });
     }
     parseWidthPx(value) {
         if (!value) {
@@ -990,7 +1017,7 @@ class SettingsPanelComponent {
             .afterClosed();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: SettingsPanelComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.MatDialog }, { token: i0.ElementRef }, { token: i1$1.OverlayContainer }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: SettingsPanelComponent, isStandalone: true, selector: "praxis-settings-panel", host: { listeners: { "document:keydown": "handleKeydown($event)", "document:pointermove": "onDocumentPointerMove($event)", "document:pointerup": "onDocumentPointerEnd($event)", "document:pointercancel": "onDocumentPointerEnd($event)" } }, providers: [providePraxisSettingsPanelI18n()], viewQueries: [{ propertyName: "contentHost", first: true, predicate: ["contentHost"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<div\n  class=\"settings-panel\"\n  data-testid=\"settings-panel-root\"\n  [class.expanded]=\"expanded\"\n  [class.is-resizable]=\"showResizeHandle\"\n  [ngStyle]=\"panelInlineStyles\"\n  role=\"dialog\"\n  aria-modal=\"true\"\n  [attr.aria-labelledby]=\"titleId\"\n  cdkTrapFocus\n  cdkTrapFocusAutoCapture\n  >\n  @if (showResizeHandle) {\n    <div\n      class=\"settings-panel__resize-handle\"\n      role=\"separator\"\n      tabindex=\"0\"\n      aria-orientation=\"vertical\"\n      [attr.aria-label]=\"resizeHandleLabel\"\n      (pointerdown)=\"onResizeHandlePointerDown($event)\"\n      (keydown)=\"onResizeHandleKeydown($event)\"\n    ></div>\n  }\n  <header class=\"settings-panel-header\">\n    <h2 class=\"settings-panel-title\" [id]=\"titleId\">\n      @if (titleIcon) {\n        <mat-icon class=\"title-icon\" [praxisIcon]=\"titleIcon\"></mat-icon>\n      }\n      <span>{{ title }}</span>\n    </h2>\n    <span class=\"spacer\"></span>\n    <button\n      [praxisIconButton]=\"expanded ? 'close_fullscreen' : 'open_in_full'\"\n      size=\"compact\"\n      type=\"button\"\n      data-testid=\"settings-panel-toggle-expand\"\n      [attr.aria-label]=\"expanded ? tx('Collapse panel') : tx('Expand panel')\"\n      [attr.aria-expanded]=\"expanded\"\n      [matTooltip]=\"expanded ? tx('Collapse panel') : tx('Expand panel')\"\n      (click)=\"toggleExpand()\"\n    ></button>\n    <button\n      praxisIconButton=\"close\"\n      size=\"compact\"\n      type=\"button\"\n      data-testid=\"settings-panel-close-icon\"\n      [attr.aria-label]=\"tx('Close')\"\n      [matTooltip]=\"tx('Close')\"\n      (click)=\"onCancel()\"\n    ></button>\n  </header>\n  @if (showStatusMessage) {\n    <div\n      class=\"settings-panel-status\"\n      [attr.data-status]=\"statusTone\"\n      role=\"status\"\n      aria-live=\"polite\"\n      >\n      <mat-icon\n        aria-hidden=\"true\"\n        [praxisIcon]=\"\n          statusTone === 'dirty' || statusTone === 'invalid'\n            ? 'warning'\n            : statusTone === 'saved'\n              ? 'check_circle'\n              : statusTone === 'busy'\n                ? 'autorenew'\n                : 'info'\n        \"\n      ></mat-icon>\n      <span>{{ statusMessage }}</span>\n    </div>\n  }\n  <div class=\"settings-panel-body\">\n    <ng-template #contentHost></ng-template>\n  </div>\n  <footer class=\"settings-panel-footer\">\n    <button\n      mat-button\n      type=\"button\"\n      data-testid=\"settings-panel-reset\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onReset()\"\n      [disabled]=\"isBusy\"\n      >\n      <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'restart_alt'\"></mat-icon>\n      <span>{{ tx('Reset') }}</span>\n    </button>\n    <span class=\"spacer\"></span>\n    <button\n      mat-button\n      type=\"button\"\n      data-testid=\"settings-panel-cancel\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onCancel()\"\n      [disabled]=\"isBusy\"\n      >\n      <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'close'\"></mat-icon>\n      <span>{{ tx('Cancel') }}</span>\n    </button>\n    <button\n      mat-stroked-button\n      type=\"button\"\n      data-testid=\"settings-panel-apply\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onApply()\"\n      [disabled]=\"!canApply\"\n      [matTooltip]=\"applySaveDisabledReason\"\n      [matTooltipDisabled]=\"canApply || !diagnostics.showDisabledReason\"\n      [attr.aria-busy]=\"isBusy\"\n      [attr.aria-label]=\"applyActionLabel || 'Apply'\"\n      >\n      @if (showBusyIndicator) {\n        <mat-progress-spinner\n          mode=\"indeterminate\"\n          diameter=\"20\"\n        ></mat-progress-spinner>\n      }\n      @if (!showBusyIndicator) {\n        <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'done'\"></mat-icon>\n        <span class=\"settings-panel-action-label settings-panel-action-label--apply\">{{ applyActionLabel }}</span>\n      }\n    </button>\n    <button\n      mat-flat-button\n      color=\"primary\"\n      type=\"button\"\n      data-testid=\"settings-panel-save\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onSave()\"\n      [disabled]=\"!canSave\"\n      [matTooltip]=\"applySaveDisabledReason\"\n      [matTooltipDisabled]=\"canSave || !diagnostics.showDisabledReason\"\n      [attr.aria-busy]=\"isBusy\"\n      [attr.aria-label]=\"saveActionLabel || 'Save & Close'\"\n      >\n      @if (showBusyIndicator) {\n        <mat-progress-spinner\n          mode=\"indeterminate\"\n          diameter=\"20\"\n        ></mat-progress-spinner>\n      }\n      @if (!showBusyIndicator) {\n        <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'save'\"></mat-icon>\n        <span class=\"settings-panel-action-label settings-panel-action-label--save\">{{ saveActionLabel }}</span>\n      }\n    </button>\n  </footer>\n</div>\n", styles: ["@charset \"UTF-8\";praxis-settings-panel{display:block;height:100%;width:100%;min-width:0;flex:1 1 auto}praxis-settings-panel .settings-panel{position:relative;--pfx-settings-panel-surface-container: var( --md-sys-color-surface-container, #ffffff );--pfx-settings-panel-surface-container-high: var( --md-sys-color-surface-container-high, #f7f7f7 );--pfx-settings-panel-surface-container-low: var( --md-sys-color-surface-container-low, #f2f4f7 );--pfx-settings-panel-surface: var(--md-sys-color-surface, #ffffff);--pfx-settings-panel-on-surface: var(--md-sys-color-on-surface, #111827);--pfx-settings-panel-on-surface-variant: var( --md-sys-color-on-surface-variant, rgba(17, 24, 39, .72) );--pfx-settings-panel-outline: var( --md-sys-color-outline, rgba(15, 23, 42, .24) );--pfx-settings-panel-outline-variant: var( --md-sys-color-outline-variant, rgba(15, 23, 42, .12) );--pfx-settings-panel-primary: var(--md-sys-color-primary, #2563eb);--pfx-settings-panel-primary-container: var( --md-sys-color-primary-container, rgba(37, 99, 235, .14) );--pfx-settings-panel-on-primary-container: var( --md-sys-color-on-primary-container, #0f172a );--pfx-settings-panel-secondary: var( --md-sys-color-secondary, var(--pfx-settings-panel-primary) );--pfx-settings-panel-error: var(--md-sys-color-error, #b3261e);--pfx-settings-panel-error-container: var( --md-sys-color-error-container, rgba(179, 38, 30, .14) );display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto 1fr auto;grid-template-areas:\"header\" \"status\" \"body\" \"footer\";height:100%;max-width:100%;background:var(--pfx-settings-panel-surface-container);color:var(--pfx-settings-panel-on-surface);border-left:1px solid var(--pfx-settings-panel-outline-variant);width:min(var(--pfx-settings-panel-width, 720px),100%);max-width:min(100%,100vw);min-width:0;transition:width .3s ease;box-shadow:var(--pfx-settings-panel-elevation, var(--md-sys-elevation-level2, 0 8px 24px rgba(0, 0, 0, .16)));overflow:hidden}praxis-settings-panel .settings-panel.expanded{width:min(var(--pfx-settings-panel-width-expanded, 95vw),var(--pfx-settings-panel-max-width, 2400px),100%)}praxis-settings-panel .settings-panel__resize-handle{position:absolute;inset:0 auto 0 0;width:12px;cursor:col-resize;touch-action:none;z-index:3;outline:none}praxis-settings-panel .settings-panel__resize-handle:before{content:\"\";position:absolute;inset:0 auto 0 4px;width:2px;background:transparent;transition:background-color var(--pfx-side-panel-motion-duration, .16s) ease,opacity var(--pfx-side-panel-motion-duration, .16s) ease;opacity:0}praxis-settings-panel .settings-panel.is-resizable:hover .settings-panel__resize-handle:before,praxis-settings-panel .settings-panel__resize-handle:focus-visible:before{opacity:1;background:var(--pfx-settings-panel-outline)}praxis-settings-panel .settings-panel-header{grid-area:header;display:flex;align-items:center;gap:var(--pfx-settings-panel-header-gap, 8px);padding:12px var(--pfx-settings-panel-header-padding-x, 20px);min-height:var(--pfx-settings-panel-header-height, 64px);border-bottom:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-high);box-shadow:var(--pfx-settings-panel-header-shadow, var(--md-sys-elevation-level1, 0 2px 6px rgba(0, 0, 0, .08)));flex-shrink:0;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-header .spacer{flex:1 1 auto;min-width:0}praxis-settings-panel .settings-panel-status{grid-area:status;display:flex;align-items:center;gap:8px;min-height:36px;padding:6px var(--pfx-settings-panel-status-padding-x, 20px);border-bottom:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-high);color:var(--pfx-settings-panel-on-surface);font-size:.85rem;font-weight:500;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-status mat-icon{width:18px;height:18px;font-size:18px}praxis-settings-panel .settings-panel-status[data-status=dirty],praxis-settings-panel .settings-panel-status[data-status=invalid]{color:var(--pfx-settings-panel-error);background:color-mix(in srgb,var(--pfx-settings-panel-error-container) 30%,var(--pfx-settings-panel-surface-container-high))}praxis-settings-panel .settings-panel-status[data-status=saved]{color:var(--pfx-settings-panel-primary);background:color-mix(in srgb,var(--pfx-settings-panel-primary-container) 28%,var(--pfx-settings-panel-surface-container-high))}praxis-settings-panel .settings-panel-body{grid-area:body;overflow-y:auto;overflow-x:hidden;scroll-padding-top:var(--pfx-settings-panel-scroll-padding-start, 16px);scroll-padding-bottom:var(--pfx-settings-panel-scroll-padding-end, 88px);min-height:0;padding:var(--pfx-settings-panel-body-padding, 8px 16px 24px);background:var(--pfx-settings-panel-surface);display:flex;flex-direction:column;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-body>*{min-width:0;max-width:100%}praxis-settings-panel .settings-panel-content{display:block;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-content>*{min-width:0;max-width:100%;box-sizing:border-box}praxis-settings-panel .settings-panel-footer{grid-area:footer;border-top:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-high);box-shadow:var(--pfx-settings-panel-footer-shadow, var(--md-sys-elevation-level1, 0 -2px 6px rgba(0, 0, 0, .08)));display:flex;align-items:center;flex-wrap:wrap;padding:var(--pfx-settings-panel-footer-padding, 12px 20px);column-gap:var(--pfx-settings-panel-footer-gap, 12px);row-gap:8px;flex-shrink:0;min-width:0;max-width:100%}praxis-settings-panel .spacer{flex:1}praxis-settings-panel .settings-panel-title{display:inline-flex;align-items:center;flex:1 1 auto;gap:var(--pfx-settings-panel-title-gap, 8px);font-weight:700;line-height:1.2;letter-spacing:.2px;margin:0;min-width:0;overflow:visible;white-space:normal}praxis-settings-panel .settings-panel-title span{min-width:0;overflow:visible;white-space:normal}praxis-settings-panel .settings-panel-title mat-icon{color:var(--pfx-settings-panel-primary)}praxis-settings-panel .settings-panel-title .title-icon{width:20px;height:20px;font-size:20px}praxis-settings-panel .settings-panel-footer button+button{margin-left:var(--pfx-settings-panel-footer-gap, 12px)}praxis-settings-panel .settings-panel-footer button{display:inline-flex;align-items:center}praxis-settings-panel .settings-panel-footer button .mat-icon{flex:0 0 20px;font-size:20px;width:20px;height:20px;line-height:1;display:inline-flex;align-items:center;justify-content:center;overflow:hidden}praxis-settings-panel .settings-panel-footer .mat-button-wrapper{display:inline-flex;align-items:center;gap:var(--pfx-settings-panel-button-gap, 8px)}praxis-settings-panel .settings-panel-footer .mat-progress-spinner{margin-right:8px}praxis-settings-panel .settings-panel-footer .mat-flat-button[color=primary]{font-weight:600}praxis-settings-panel .settings-panel .mdc-button__label{display:inline-flex;align-items:center;gap:var(--pfx-settings-panel-button-gap, 8px);line-height:1}praxis-settings-panel .settings-panel .mdc-button__label>span{display:inline-flex;align-items:center;line-height:1}praxis-settings-panel .settings-panel .mdc-button__label .mat-icon{display:inline-flex;align-items:center;justify-content:center;line-height:1}@media(max-width:520px){praxis-settings-panel .settings-panel-footer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch}praxis-settings-panel .settings-panel-footer .spacer{display:none}praxis-settings-panel .settings-panel-footer button{justify-content:center;width:100%;min-width:0}praxis-settings-panel .settings-panel-footer button+button{margin-left:0}}praxis-settings-panel .settings-panel .mat-divider{background-color:var(--pfx-settings-panel-outline-variant)!important}praxis-settings-panel .settings-panel .mat-expansion-panel{background:var(--pfx-settings-panel-surface-container)!important;border:1px solid var(--pfx-settings-panel-outline-variant);border-radius:var(--md-sys-shape-corner-medium, 12px);box-shadow:var(--md-sys-elevation-level1, 0 2px 8px rgba(0, 0, 0, .08));color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-expansion-panel-header{background:var(--pfx-settings-panel-surface-container)!important;color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-content{color:var(--pfx-settings-panel-on-surface);flex-wrap:wrap;gap:4px 12px;min-width:0;overflow:visible}praxis-settings-panel .settings-panel .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:hover{background:color-mix(in srgb,var(--pfx-settings-panel-surface-container-high) 84%,var(--pfx-settings-panel-primary) 16%)}praxis-settings-panel .settings-panel .mat-expansion-panel.mat-expanded>.mat-expansion-panel-header{background:var(--pfx-settings-panel-surface-container-high)!important}praxis-settings-panel .settings-panel .mat-expansion-panel-header mat-icon,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-icon{color:var(--pfx-settings-panel-on-surface)!important}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-title,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description{color:var(--pfx-settings-panel-on-surface);min-width:0;overflow:visible;white-space:normal}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description{color:var(--pfx-settings-panel-on-surface-variant);flex-wrap:wrap;gap:8px}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-title>*,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description>*{color:inherit}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-title small,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description small{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-indicator,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-indicator:after{color:var(--pfx-settings-panel-on-surface-variant);border-color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-expansion-panel .mat-action-row{border-top-color:var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-low)}praxis-settings-panel .settings-panel .mat-accordion,praxis-settings-panel .settings-panel .mat-accordion .mat-expansion-panel-spacing{background:transparent!important}praxis-settings-panel .settings-panel .mat-expansion-panel-content,praxis-settings-panel .settings-panel .mat-expansion-panel-content-wrapper,praxis-settings-panel .settings-panel .mat-expansion-panel-body{background:var(--pfx-settings-panel-surface-container)!important;color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-expansion-panel .mat-expansion-panel-body{padding:8px}praxis-settings-panel .settings-panel .mat-expansion-panel .mat-expansion-panel-body>*{color:inherit}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header{border-bottom:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-low)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab{min-width:0}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab .mdc-tab__text-label{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab:hover .mdc-tab__text-label,praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab:focus .mdc-tab__text-label{color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab.mdc-tab--active .mdc-tab__text-label{color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header-pagination{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header-pagination-chevron{border-color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header-pagination:not(.mat-mdc-tab-header-pagination-disabled):hover{background:color-mix(in srgb,var(--pfx-settings-panel-surface-container-high) 84%,var(--pfx-settings-panel-primary) 16%)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab-indicator__content--underline{border-color:var(--pfx-settings-panel-primary)}praxis-settings-panel .settings-panel .mat-mdc-card{background:var(--pfx-settings-panel-surface-container-low);border:1px solid var(--pfx-settings-panel-outline-variant);color:var(--pfx-settings-panel-on-surface);box-shadow:var(--md-sys-elevation-level1, 0 2px 8px rgba(0, 0, 0, .08))}praxis-settings-panel .settings-panel .mat-mdc-card-subtitle,praxis-settings-panel .settings-panel .mat-mdc-card-content{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-card-title{color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-form-field{width:100%;--mdc-filled-text-field-container-color: var( --pfx-settings-panel-surface-container );--mdc-filled-text-field-hover-container-color: var( --pfx-settings-panel-surface-container-high );--mdc-filled-text-field-focus-container-color: var( --pfx-settings-panel-surface-container-high );--mdc-filled-text-field-active-indicator-color: var( --pfx-settings-panel-outline-variant );--mdc-filled-text-field-hover-active-indicator-color: var( --pfx-settings-panel-secondary );--mdc-filled-text-field-focus-active-indicator-color: var( --pfx-settings-panel-primary );--mdc-filled-text-field-label-text-color: var( --pfx-settings-panel-on-surface-variant );--mdc-filled-text-field-focus-label-text-color: var( --pfx-settings-panel-primary );--mdc-filled-text-field-input-text-color: var( --pfx-settings-panel-on-surface );--mdc-filled-text-field-caret-color: var(--pfx-settings-panel-primary);--mdc-outlined-text-field-outline-color: var( --pfx-settings-panel-outline-variant );--mdc-outlined-text-field-hover-outline-color: var( --pfx-settings-panel-secondary );--mdc-outlined-text-field-focus-outline-color: var( --pfx-settings-panel-primary );--mdc-outlined-text-field-label-text-color: var( --pfx-settings-panel-on-surface-variant );--mdc-outlined-text-field-focus-label-text-color: var( --pfx-settings-panel-primary );--mdc-outlined-text-field-input-text-color: var( --pfx-settings-panel-on-surface );--mdc-outlined-text-field-caret-color: var(--pfx-settings-panel-primary);--mat-form-field-focus-select-arrow-color: var( --pfx-settings-panel-primary );--mat-form-field-enabled-select-arrow-color: var( --pfx-settings-panel-on-surface-variant )}praxis-settings-panel .settings-panel .mdc-text-field--filled{background-color:var(--pfx-settings-panel-surface-container)!important;border-radius:var(--md-sys-shape-corner-small, 8px) var(--md-sys-shape-corner-small, 8px) 0 0}praxis-settings-panel .settings-panel .mat-mdc-text-field-wrapper,praxis-settings-panel .settings-panel .mat-mdc-form-field-flex,praxis-settings-panel .settings-panel .mat-mdc-form-field-infix,praxis-settings-panel .settings-panel .mat-mdc-form-field-focus-overlay{background:var(--pfx-settings-panel-surface-container)!important;color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-form-field-focus-overlay{opacity:0}praxis-settings-panel .settings-panel .mdc-text-field--filled .mdc-text-field__input,praxis-settings-panel .settings-panel .mdc-text-field--filled .mdc-floating-label,praxis-settings-panel .settings-panel .mat-mdc-select-value,praxis-settings-panel .settings-panel .mat-mdc-select-arrow,praxis-settings-panel .settings-panel .mat-mdc-form-field .mat-mdc-floating-label{color:var(--pfx-settings-panel-on-surface-variant)!important}praxis-settings-panel .settings-panel .mdc-text-field--filled.mdc-text-field--focused .mdc-floating-label,praxis-settings-panel .settings-panel .mdc-text-field--filled .mdc-text-field__input{color:var(--pfx-settings-panel-on-surface)!important}praxis-settings-panel .settings-panel .mat-mdc-form-field input,praxis-settings-panel .settings-panel .mat-mdc-form-field textarea,praxis-settings-panel .settings-panel .mat-mdc-form-field .mdc-text-field__input{color:var(--pfx-settings-panel-on-surface)!important}praxis-settings-panel .settings-panel .mat-mdc-form-field-subscript-wrapper,praxis-settings-panel .settings-panel .mat-mdc-form-field-hint-wrapper,praxis-settings-panel .settings-panel .mat-mdc-form-field-error-wrapper,praxis-settings-panel .settings-panel .mat-mdc-hint{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-button-toggle-group{border-color:var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-low)}praxis-settings-panel .settings-panel .mat-button-toggle{background:var(--pfx-settings-panel-surface-container-low);color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-button-toggle+.mat-button-toggle{border-left-color:var(--pfx-settings-panel-outline-variant)}praxis-settings-panel .settings-panel .mat-button-toggle-checked{background:var(--pfx-settings-panel-primary-container)!important;color:var(--pfx-settings-panel-on-primary-container)!important}praxis-settings-panel .settings-panel .mat-button-toggle .mat-icon,praxis-settings-panel .settings-panel .mat-button-toggle-checked .mat-icon{color:inherit}praxis-settings-panel .settings-panel .mat-mdc-slide-toggle .mdc-label{color:var(--pfx-settings-panel-on-surface)}.settings-panel{grid-template-columns:minmax(0,1fr);min-width:0;max-width:100%}.settings-panel-body{overflow-x:hidden;min-width:0}.settings-panel-body>*{min-width:0;max-width:100%}.praxis-settings-panel-backdrop{background:var(--pfx-backdrop, rgba(8, 15, 26, .42));backdrop-filter:blur(var(--pfx-backdrop-blur, 6px)) saturate(110%);-webkit-backdrop-filter:blur(var(--pfx-backdrop-blur, 6px)) saturate(110%)}.praxis-settings-panel-pane{position:fixed!important;top:0!important;right:0!important;display:flex!important;align-items:stretch!important;height:100vh!important;max-width:100vw!important;max-height:100vh!important;z-index:var(--praxis-layer-settings-panel, 1220)!important}.praxis-settings-panel-pane .settings-panel{pointer-events:auto}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { 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: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: PraxisIconButtonComponent, selector: "button[praxisIconButton]", inputs: ["praxisIconButton", "size", "appearance", "presentation", "pressed", "busy"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatDialogModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: SettingsPanelComponent, isStandalone: true, selector: "praxis-settings-panel", host: { listeners: { "document:keydown": "handleKeydown($event)", "document:pointermove": "onDocumentPointerMove($event)", "document:pointerup": "onDocumentPointerEnd($event)", "document:pointercancel": "onDocumentPointerEnd($event)" } }, providers: [providePraxisSettingsPanelI18n()], viewQueries: [{ propertyName: "contentHost", first: true, predicate: ["contentHost"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<div\n  class=\"settings-panel\"\n  data-testid=\"settings-panel-root\"\n  [class.expanded]=\"expanded\"\n  [class.is-resizable]=\"showResizeHandle\"\n  [ngStyle]=\"panelInlineStyles\"\n  role=\"dialog\"\n  [attr.aria-modal]=\"interactionActive ? 'true' : null\"\n  [attr.aria-hidden]=\"interactionActive ? null : 'true'\"\n  [attr.inert]=\"interactionActive ? null : ''\"\n  [attr.aria-labelledby]=\"titleId\"\n  [cdkTrapFocus]=\"interactionActive\"\n  [cdkTrapFocusAutoCapture]=\"interactionActive\"\n  >\n  @if (showResizeHandle) {\n    <div\n      class=\"settings-panel__resize-handle\"\n      role=\"separator\"\n      tabindex=\"0\"\n      aria-orientation=\"vertical\"\n      [attr.aria-label]=\"resizeHandleLabel\"\n      (pointerdown)=\"onResizeHandlePointerDown($event)\"\n      (keydown)=\"onResizeHandleKeydown($event)\"\n    ></div>\n  }\n  <header class=\"settings-panel-header\">\n    <h2 class=\"settings-panel-title\" [id]=\"titleId\">\n      @if (titleIcon) {\n        <mat-icon class=\"title-icon\" [praxisIcon]=\"titleIcon\"></mat-icon>\n      }\n      <span>{{ title }}</span>\n    </h2>\n    <span class=\"spacer\"></span>\n    <button\n      [praxisIconButton]=\"expanded ? 'close_fullscreen' : 'open_in_full'\"\n      size=\"compact\"\n      type=\"button\"\n      data-testid=\"settings-panel-toggle-expand\"\n      [attr.aria-label]=\"expanded ? tx('Collapse panel') : tx('Expand panel')\"\n      [attr.aria-expanded]=\"expanded\"\n      [matTooltip]=\"expanded ? tx('Collapse panel') : tx('Expand panel')\"\n      (click)=\"toggleExpand()\"\n    ></button>\n    <button\n      praxisIconButton=\"close\"\n      size=\"compact\"\n      type=\"button\"\n      data-testid=\"settings-panel-close-icon\"\n      [attr.aria-label]=\"tx('Close')\"\n      [matTooltip]=\"tx('Close')\"\n      (click)=\"onCancel()\"\n    ></button>\n  </header>\n  @if (showStatusMessage) {\n    <div\n      class=\"settings-panel-status\"\n      [attr.data-status]=\"statusTone\"\n      role=\"status\"\n      aria-live=\"polite\"\n      >\n      <mat-icon\n        aria-hidden=\"true\"\n        [praxisIcon]=\"\n          statusTone === 'dirty' || statusTone === 'invalid'\n            ? 'warning'\n            : statusTone === 'saved'\n              ? 'check_circle'\n              : statusTone === 'busy'\n                ? 'autorenew'\n                : 'info'\n        \"\n      ></mat-icon>\n      <span>{{ statusMessage }}</span>\n    </div>\n  }\n  <div class=\"settings-panel-body\">\n    <ng-template #contentHost></ng-template>\n  </div>\n  <footer class=\"settings-panel-footer\">\n    <button\n      mat-button\n      type=\"button\"\n      data-testid=\"settings-panel-reset\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onReset()\"\n      [disabled]=\"isBusy\"\n      >\n      <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'restart_alt'\"></mat-icon>\n      <span>{{ tx('Reset') }}</span>\n    </button>\n    <span class=\"spacer\"></span>\n    <button\n      mat-button\n      type=\"button\"\n      data-testid=\"settings-panel-cancel\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onCancel()\"\n      [disabled]=\"isBusy\"\n      >\n      <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'close'\"></mat-icon>\n      <span>{{ tx('Cancel') }}</span>\n    </button>\n    <button\n      mat-stroked-button\n      type=\"button\"\n      data-testid=\"settings-panel-apply\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onApply()\"\n      [disabled]=\"!canApply\"\n      [matTooltip]=\"applySaveDisabledReason\"\n      [matTooltipDisabled]=\"canApply || !diagnostics.showDisabledReason\"\n      [attr.aria-busy]=\"isBusy\"\n      [attr.aria-label]=\"applyActionLabel || 'Apply'\"\n      >\n      @if (showBusyIndicator) {\n        <mat-progress-spinner\n          mode=\"indeterminate\"\n          diameter=\"20\"\n        ></mat-progress-spinner>\n      }\n      @if (!showBusyIndicator) {\n        <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'done'\"></mat-icon>\n        <span class=\"settings-panel-action-label settings-panel-action-label--apply\">{{ applyActionLabel }}</span>\n      }\n    </button>\n    <button\n      mat-flat-button\n      color=\"primary\"\n      type=\"button\"\n      data-testid=\"settings-panel-save\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onSave()\"\n      [disabled]=\"!canSave\"\n      [matTooltip]=\"applySaveDisabledReason\"\n      [matTooltipDisabled]=\"canSave || !diagnostics.showDisabledReason\"\n      [attr.aria-busy]=\"isBusy\"\n      [attr.aria-label]=\"saveActionLabel || 'Save & Close'\"\n      >\n      @if (showBusyIndicator) {\n        <mat-progress-spinner\n          mode=\"indeterminate\"\n          diameter=\"20\"\n        ></mat-progress-spinner>\n      }\n      @if (!showBusyIndicator) {\n        <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'save'\"></mat-icon>\n        <span class=\"settings-panel-action-label settings-panel-action-label--save\">{{ saveActionLabel }}</span>\n      }\n    </button>\n  </footer>\n</div>\n", styles: ["@charset \"UTF-8\";praxis-settings-panel{display:block;height:100%;width:100%;min-width:0;flex:1 1 auto}praxis-settings-panel .settings-panel{position:relative;--pfx-settings-panel-surface-container: var( --md-sys-color-surface-container, #ffffff );--pfx-settings-panel-surface-container-high: var( --md-sys-color-surface-container-high, #f7f7f7 );--pfx-settings-panel-surface-container-low: var( --md-sys-color-surface-container-low, #f2f4f7 );--pfx-settings-panel-surface: var(--md-sys-color-surface, #ffffff);--pfx-settings-panel-on-surface: var(--md-sys-color-on-surface, #111827);--pfx-settings-panel-on-surface-variant: var( --md-sys-color-on-surface-variant, rgba(17, 24, 39, .72) );--pfx-settings-panel-outline: var( --md-sys-color-outline, rgba(15, 23, 42, .24) );--pfx-settings-panel-outline-variant: var( --md-sys-color-outline-variant, rgba(15, 23, 42, .12) );--pfx-settings-panel-primary: var(--md-sys-color-primary, #2563eb);--pfx-settings-panel-primary-container: var( --md-sys-color-primary-container, rgba(37, 99, 235, .14) );--pfx-settings-panel-on-primary-container: var( --md-sys-color-on-primary-container, #0f172a );--pfx-settings-panel-secondary: var( --md-sys-color-secondary, var(--pfx-settings-panel-primary) );--pfx-settings-panel-error: var(--md-sys-color-error, #b3261e);--pfx-settings-panel-error-container: var( --md-sys-color-error-container, rgba(179, 38, 30, .14) );display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto 1fr auto;grid-template-areas:\"header\" \"status\" \"body\" \"footer\";height:100%;background:var(--pfx-settings-panel-surface-container);color:var(--pfx-settings-panel-on-surface);border-left:1px solid var(--pfx-settings-panel-outline-variant);width:100%;max-width:100%;min-width:0;box-shadow:var(--pfx-settings-panel-elevation, var(--md-sys-elevation-level2, 0 8px 24px rgba(0, 0, 0, .16)));overflow:hidden}praxis-settings-panel .settings-panel__resize-handle{position:absolute;inset:0 auto 0 0;width:12px;cursor:col-resize;touch-action:none;z-index:3;outline:none}praxis-settings-panel .settings-panel__resize-handle:before{content:\"\";position:absolute;inset:0 auto 0 4px;width:2px;background:transparent;transition:background-color var(--pfx-side-panel-motion-duration, .16s) ease,opacity var(--pfx-side-panel-motion-duration, .16s) ease;opacity:0}praxis-settings-panel .settings-panel.is-resizable:hover .settings-panel__resize-handle:before,praxis-settings-panel .settings-panel__resize-handle:focus-visible:before{opacity:1;background:var(--pfx-settings-panel-outline)}praxis-settings-panel .settings-panel-header{grid-area:header;display:flex;align-items:center;gap:var(--pfx-settings-panel-header-gap, 8px);padding:12px var(--pfx-settings-panel-header-padding-x, 20px);min-height:var(--pfx-settings-panel-header-height, 64px);border-bottom:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-high);box-shadow:var(--pfx-settings-panel-header-shadow, var(--md-sys-elevation-level1, 0 2px 6px rgba(0, 0, 0, .08)));flex-shrink:0;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-header .spacer{flex:1 1 auto;min-width:0}praxis-settings-panel .settings-panel-status{grid-area:status;display:flex;align-items:center;gap:8px;min-height:36px;padding:6px var(--pfx-settings-panel-status-padding-x, 20px);border-bottom:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-high);color:var(--pfx-settings-panel-on-surface);font-size:.85rem;font-weight:500;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-status mat-icon{width:18px;height:18px;font-size:18px}praxis-settings-panel .settings-panel-status[data-status=dirty],praxis-settings-panel .settings-panel-status[data-status=invalid]{color:var(--pfx-settings-panel-error);background:color-mix(in srgb,var(--pfx-settings-panel-error-container) 30%,var(--pfx-settings-panel-surface-container-high))}praxis-settings-panel .settings-panel-status[data-status=saved]{color:var(--pfx-settings-panel-primary);background:color-mix(in srgb,var(--pfx-settings-panel-primary-container) 28%,var(--pfx-settings-panel-surface-container-high))}praxis-settings-panel .settings-panel-body{grid-area:body;overflow-y:auto;overflow-x:hidden;scroll-padding-top:var(--pfx-settings-panel-scroll-padding-start, 16px);scroll-padding-bottom:var(--pfx-settings-panel-scroll-padding-end, 88px);min-height:0;padding:var(--pfx-settings-panel-body-padding, 8px 16px 24px);background:var(--pfx-settings-panel-surface);display:flex;flex-direction:column;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-body>*{min-width:0;max-width:100%}praxis-settings-panel .settings-panel-content{display:block;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-content>*{min-width:0;max-width:100%;box-sizing:border-box}praxis-settings-panel .settings-panel-footer{grid-area:footer;border-top:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-high);box-shadow:var(--pfx-settings-panel-footer-shadow, var(--md-sys-elevation-level1, 0 -2px 6px rgba(0, 0, 0, .08)));display:flex;align-items:center;flex-wrap:wrap;padding:var(--pfx-settings-panel-footer-padding, 12px 20px);column-gap:var(--pfx-settings-panel-footer-gap, 12px);row-gap:8px;flex-shrink:0;min-width:0;max-width:100%}praxis-settings-panel .spacer{flex:1}praxis-settings-panel .settings-panel-title{display:inline-flex;align-items:center;flex:1 1 auto;gap:var(--pfx-settings-panel-title-gap, 8px);font-weight:700;line-height:1.2;letter-spacing:.2px;margin:0;min-width:0;overflow:visible;white-space:normal}praxis-settings-panel .settings-panel-title span{min-width:0;overflow:visible;white-space:normal}praxis-settings-panel .settings-panel-title mat-icon{color:var(--pfx-settings-panel-primary)}praxis-settings-panel .settings-panel-title .title-icon{width:20px;height:20px;font-size:20px}praxis-settings-panel .settings-panel-footer button+button{margin-left:var(--pfx-settings-panel-footer-gap, 12px)}praxis-settings-panel .settings-panel-footer button{display:inline-flex;align-items:center}praxis-settings-panel .settings-panel-footer button .mat-icon{flex:0 0 20px;font-size:20px;width:20px;height:20px;line-height:1;display:inline-flex;align-items:center;justify-content:center;overflow:hidden}praxis-settings-panel .settings-panel-footer .mat-button-wrapper{display:inline-flex;align-items:center;gap:var(--pfx-settings-panel-button-gap, 8px)}praxis-settings-panel .settings-panel-footer .mat-progress-spinner{margin-right:8px}praxis-settings-panel .settings-panel-footer .mat-flat-button[color=primary]{font-weight:600}praxis-settings-panel .settings-panel .mdc-button__label{display:inline-flex;align-items:center;gap:var(--pfx-settings-panel-button-gap, 8px);line-height:1}praxis-settings-panel .settings-panel .mdc-button__label>span{display:inline-flex;align-items:center;line-height:1}praxis-settings-panel .settings-panel .mdc-button__label .mat-icon{display:inline-flex;align-items:center;justify-content:center;line-height:1}@media(max-width:520px){praxis-settings-panel .settings-panel-footer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch}praxis-settings-panel .settings-panel-footer .spacer{display:none}praxis-settings-panel .settings-panel-footer button{justify-content:center;width:100%;min-width:0}praxis-settings-panel .settings-panel-footer button+button{margin-left:0}}praxis-settings-panel .settings-panel .mat-divider{background-color:var(--pfx-settings-panel-outline-variant)!important}praxis-settings-panel .settings-panel .mat-expansion-panel{background:var(--pfx-settings-panel-surface-container)!important;border:1px solid var(--pfx-settings-panel-outline-variant);border-radius:var(--md-sys-shape-corner-medium, 12px);box-shadow:var(--md-sys-elevation-level1, 0 2px 8px rgba(0, 0, 0, .08));color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-expansion-panel-header{background:var(--pfx-settings-panel-surface-container)!important;color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-content{color:var(--pfx-settings-panel-on-surface);flex-wrap:wrap;gap:4px 12px;min-width:0;overflow:visible}praxis-settings-panel .settings-panel .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:hover{background:color-mix(in srgb,var(--pfx-settings-panel-surface-container-high) 84%,var(--pfx-settings-panel-primary) 16%)}praxis-settings-panel .settings-panel .mat-expansion-panel.mat-expanded>.mat-expansion-panel-header{background:var(--pfx-settings-panel-surface-container-high)!important}praxis-settings-panel .settings-panel .mat-expansion-panel-header mat-icon,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-icon{color:var(--pfx-settings-panel-on-surface)!important}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-title,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description{color:var(--pfx-settings-panel-on-surface);min-width:0;overflow:visible;white-space:normal}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description{color:var(--pfx-settings-panel-on-surface-variant);flex-wrap:wrap;gap:8px}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-title>*,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description>*{color:inherit}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-title small,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description small{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-indicator,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-indicator:after{color:var(--pfx-settings-panel-on-surface-variant);border-color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-expansion-panel .mat-action-row{border-top-color:var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-low)}praxis-settings-panel .settings-panel .mat-accordion,praxis-settings-panel .settings-panel .mat-accordion .mat-expansion-panel-spacing{background:transparent!important}praxis-settings-panel .settings-panel .mat-expansion-panel-content,praxis-settings-panel .settings-panel .mat-expansion-panel-content-wrapper,praxis-settings-panel .settings-panel .mat-expansion-panel-body{background:var(--pfx-settings-panel-surface-container)!important;color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-expansion-panel .mat-expansion-panel-body{padding:8px}praxis-settings-panel .settings-panel .mat-expansion-panel .mat-expansion-panel-body>*{color:inherit}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header{border-bottom:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-low)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab{min-width:0}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab .mdc-tab__text-label{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab:hover .mdc-tab__text-label,praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab:focus .mdc-tab__text-label{color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab.mdc-tab--active .mdc-tab__text-label{color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header-pagination{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header-pagination-chevron{border-color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header-pagination:not(.mat-mdc-tab-header-pagination-disabled):hover{background:color-mix(in srgb,var(--pfx-settings-panel-surface-container-high) 84%,var(--pfx-settings-panel-primary) 16%)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab-indicator__content--underline{border-color:var(--pfx-settings-panel-primary)}praxis-settings-panel .settings-panel .mat-mdc-card{background:var(--pfx-settings-panel-surface-container-low);border:1px solid var(--pfx-settings-panel-outline-variant);color:var(--pfx-settings-panel-on-surface);box-shadow:var(--md-sys-elevation-level1, 0 2px 8px rgba(0, 0, 0, .08))}praxis-settings-panel .settings-panel .mat-mdc-card-subtitle,praxis-settings-panel .settings-panel .mat-mdc-card-content{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-card-title{color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-form-field{width:100%;--mdc-filled-text-field-container-color: var( --pfx-settings-panel-surface-container );--mdc-filled-text-field-hover-container-color: var( --pfx-settings-panel-surface-container-high );--mdc-filled-text-field-focus-container-color: var( --pfx-settings-panel-surface-container-high );--mdc-filled-text-field-active-indicator-color: var( --pfx-settings-panel-outline-variant );--mdc-filled-text-field-hover-active-indicator-color: var( --pfx-settings-panel-secondary );--mdc-filled-text-field-focus-active-indicator-color: var( --pfx-settings-panel-primary );--mdc-filled-text-field-label-text-color: var( --pfx-settings-panel-on-surface-variant );--mdc-filled-text-field-focus-label-text-color: var( --pfx-settings-panel-primary );--mdc-filled-text-field-input-text-color: var( --pfx-settings-panel-on-surface );--mdc-filled-text-field-caret-color: var(--pfx-settings-panel-primary);--mdc-outlined-text-field-outline-color: var( --pfx-settings-panel-outline-variant );--mdc-outlined-text-field-hover-outline-color: var( --pfx-settings-panel-secondary );--mdc-outlined-text-field-focus-outline-color: var( --pfx-settings-panel-primary );--mdc-outlined-text-field-label-text-color: var( --pfx-settings-panel-on-surface-variant );--mdc-outlined-text-field-focus-label-text-color: var( --pfx-settings-panel-primary );--mdc-outlined-text-field-input-text-color: var( --pfx-settings-panel-on-surface );--mdc-outlined-text-field-caret-color: var(--pfx-settings-panel-primary);--mat-form-field-focus-select-arrow-color: var( --pfx-settings-panel-primary );--mat-form-field-enabled-select-arrow-color: var( --pfx-settings-panel-on-surface-variant )}praxis-settings-panel .settings-panel .mdc-text-field--filled{background-color:var(--pfx-settings-panel-surface-container)!important;border-radius:var(--md-sys-shape-corner-small, 8px) var(--md-sys-shape-corner-small, 8px) 0 0}praxis-settings-panel .settings-panel .mat-mdc-text-field-wrapper,praxis-settings-panel .settings-panel .mat-mdc-form-field-flex,praxis-settings-panel .settings-panel .mat-mdc-form-field-infix,praxis-settings-panel .settings-panel .mat-mdc-form-field-focus-overlay{background:var(--pfx-settings-panel-surface-container)!important;color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-form-field-focus-overlay{opacity:0}praxis-settings-panel .settings-panel .mdc-text-field--filled .mdc-text-field__input,praxis-settings-panel .settings-panel .mdc-text-field--filled .mdc-floating-label,praxis-settings-panel .settings-panel .mat-mdc-select-value,praxis-settings-panel .settings-panel .mat-mdc-select-arrow,praxis-settings-panel .settings-panel .mat-mdc-form-field .mat-mdc-floating-label{color:var(--pfx-settings-panel-on-surface-variant)!important}praxis-settings-panel .settings-panel .mdc-text-field--filled.mdc-text-field--focused .mdc-floating-label,praxis-settings-panel .settings-panel .mdc-text-field--filled .mdc-text-field__input{color:var(--pfx-settings-panel-on-surface)!important}praxis-settings-panel .settings-panel .mat-mdc-form-field input,praxis-settings-panel .settings-panel .mat-mdc-form-field textarea,praxis-settings-panel .settings-panel .mat-mdc-form-field .mdc-text-field__input{color:var(--pfx-settings-panel-on-surface)!important}praxis-settings-panel .settings-panel .mat-mdc-form-field-subscript-wrapper,praxis-settings-panel .settings-panel .mat-mdc-form-field-hint-wrapper,praxis-settings-panel .settings-panel .mat-mdc-form-field-error-wrapper,praxis-settings-panel .settings-panel .mat-mdc-hint{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-button-toggle-group{border-color:var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-low)}praxis-settings-panel .settings-panel .mat-button-toggle{background:var(--pfx-settings-panel-surface-container-low);color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-button-toggle+.mat-button-toggle{border-left-color:var(--pfx-settings-panel-outline-variant)}praxis-settings-panel .settings-panel .mat-button-toggle-checked{background:var(--pfx-settings-panel-primary-container)!important;color:var(--pfx-settings-panel-on-primary-container)!important}praxis-settings-panel .settings-panel .mat-button-toggle .mat-icon,praxis-settings-panel .settings-panel .mat-button-toggle-checked .mat-icon{color:inherit}praxis-settings-panel .settings-panel .mat-mdc-slide-toggle .mdc-label{color:var(--pfx-settings-panel-on-surface)}.settings-panel{grid-template-columns:minmax(0,1fr);min-width:0;max-width:100%}.settings-panel-body{overflow-x:hidden;min-width:0}.settings-panel-body>*{min-width:0;max-width:100%}.praxis-settings-panel-backdrop{background:var(--pfx-backdrop, rgba(8, 15, 26, .42));backdrop-filter:blur(var(--pfx-backdrop-blur, 6px)) saturate(110%);-webkit-backdrop-filter:blur(var(--pfx-backdrop-blur, 6px)) saturate(110%)}.praxis-settings-panel-pane{position:fixed!important;top:0!important;right:0!important;display:flex!important;align-items:stretch!important;height:100vh!important;max-width:100vw!important;max-height:100vh!important;z-index:var(--praxis-layer-settings-panel, 1220)!important;transition:width var(--pfx-side-panel-motion-duration-enter, .3s) var(--pfx-side-panel-motion-easing-enter, ease)}.praxis-settings-panel-pane .settings-panel{pointer-events:auto}@media(prefers-reduced-motion:reduce){.praxis-settings-panel-pane{transition:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { 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: "ngmodule", type: MatIconModule }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: PraxisIconButtonComponent, selector: "button[praxisIconButton]", inputs: ["praxisIconButton", "size", "appearance", "presentation", "pressed", "busy"] }, { kind: "directive", type: PraxisIconDirective, selector: "mat-icon[praxisIcon]", inputs: ["praxisIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i7.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatDialogModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: SettingsPanelComponent, decorators: [{
             type: Component,
@@ -1005,7 +1032,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
                         CdkTrapFocus,
                         MatProgressSpinnerModule,
                         MatDialogModule,
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [providePraxisSettingsPanelI18n()], template: "<div\n  class=\"settings-panel\"\n  data-testid=\"settings-panel-root\"\n  [class.expanded]=\"expanded\"\n  [class.is-resizable]=\"showResizeHandle\"\n  [ngStyle]=\"panelInlineStyles\"\n  role=\"dialog\"\n  aria-modal=\"true\"\n  [attr.aria-labelledby]=\"titleId\"\n  cdkTrapFocus\n  cdkTrapFocusAutoCapture\n  >\n  @if (showResizeHandle) {\n    <div\n      class=\"settings-panel__resize-handle\"\n      role=\"separator\"\n      tabindex=\"0\"\n      aria-orientation=\"vertical\"\n      [attr.aria-label]=\"resizeHandleLabel\"\n      (pointerdown)=\"onResizeHandlePointerDown($event)\"\n      (keydown)=\"onResizeHandleKeydown($event)\"\n    ></div>\n  }\n  <header class=\"settings-panel-header\">\n    <h2 class=\"settings-panel-title\" [id]=\"titleId\">\n      @if (titleIcon) {\n        <mat-icon class=\"title-icon\" [praxisIcon]=\"titleIcon\"></mat-icon>\n      }\n      <span>{{ title }}</span>\n    </h2>\n    <span class=\"spacer\"></span>\n    <button\n      [praxisIconButton]=\"expanded ? 'close_fullscreen' : 'open_in_full'\"\n      size=\"compact\"\n      type=\"button\"\n      data-testid=\"settings-panel-toggle-expand\"\n      [attr.aria-label]=\"expanded ? tx('Collapse panel') : tx('Expand panel')\"\n      [attr.aria-expanded]=\"expanded\"\n      [matTooltip]=\"expanded ? tx('Collapse panel') : tx('Expand panel')\"\n      (click)=\"toggleExpand()\"\n    ></button>\n    <button\n      praxisIconButton=\"close\"\n      size=\"compact\"\n      type=\"button\"\n      data-testid=\"settings-panel-close-icon\"\n      [attr.aria-label]=\"tx('Close')\"\n      [matTooltip]=\"tx('Close')\"\n      (click)=\"onCancel()\"\n    ></button>\n  </header>\n  @if (showStatusMessage) {\n    <div\n      class=\"settings-panel-status\"\n      [attr.data-status]=\"statusTone\"\n      role=\"status\"\n      aria-live=\"polite\"\n      >\n      <mat-icon\n        aria-hidden=\"true\"\n        [praxisIcon]=\"\n          statusTone === 'dirty' || statusTone === 'invalid'\n            ? 'warning'\n            : statusTone === 'saved'\n              ? 'check_circle'\n              : statusTone === 'busy'\n                ? 'autorenew'\n                : 'info'\n        \"\n      ></mat-icon>\n      <span>{{ statusMessage }}</span>\n    </div>\n  }\n  <div class=\"settings-panel-body\">\n    <ng-template #contentHost></ng-template>\n  </div>\n  <footer class=\"settings-panel-footer\">\n    <button\n      mat-button\n      type=\"button\"\n      data-testid=\"settings-panel-reset\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onReset()\"\n      [disabled]=\"isBusy\"\n      >\n      <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'restart_alt'\"></mat-icon>\n      <span>{{ tx('Reset') }}</span>\n    </button>\n    <span class=\"spacer\"></span>\n    <button\n      mat-button\n      type=\"button\"\n      data-testid=\"settings-panel-cancel\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onCancel()\"\n      [disabled]=\"isBusy\"\n      >\n      <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'close'\"></mat-icon>\n      <span>{{ tx('Cancel') }}</span>\n    </button>\n    <button\n      mat-stroked-button\n      type=\"button\"\n      data-testid=\"settings-panel-apply\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onApply()\"\n      [disabled]=\"!canApply\"\n      [matTooltip]=\"applySaveDisabledReason\"\n      [matTooltipDisabled]=\"canApply || !diagnostics.showDisabledReason\"\n      [attr.aria-busy]=\"isBusy\"\n      [attr.aria-label]=\"applyActionLabel || 'Apply'\"\n      >\n      @if (showBusyIndicator) {\n        <mat-progress-spinner\n          mode=\"indeterminate\"\n          diameter=\"20\"\n        ></mat-progress-spinner>\n      }\n      @if (!showBusyIndicator) {\n        <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'done'\"></mat-icon>\n        <span class=\"settings-panel-action-label settings-panel-action-label--apply\">{{ applyActionLabel }}</span>\n      }\n    </button>\n    <button\n      mat-flat-button\n      color=\"primary\"\n      type=\"button\"\n      data-testid=\"settings-panel-save\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onSave()\"\n      [disabled]=\"!canSave\"\n      [matTooltip]=\"applySaveDisabledReason\"\n      [matTooltipDisabled]=\"canSave || !diagnostics.showDisabledReason\"\n      [attr.aria-busy]=\"isBusy\"\n      [attr.aria-label]=\"saveActionLabel || 'Save & Close'\"\n      >\n      @if (showBusyIndicator) {\n        <mat-progress-spinner\n          mode=\"indeterminate\"\n          diameter=\"20\"\n        ></mat-progress-spinner>\n      }\n      @if (!showBusyIndicator) {\n        <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'save'\"></mat-icon>\n        <span class=\"settings-panel-action-label settings-panel-action-label--save\">{{ saveActionLabel }}</span>\n      }\n    </button>\n  </footer>\n</div>\n", styles: ["@charset \"UTF-8\";praxis-settings-panel{display:block;height:100%;width:100%;min-width:0;flex:1 1 auto}praxis-settings-panel .settings-panel{position:relative;--pfx-settings-panel-surface-container: var( --md-sys-color-surface-container, #ffffff );--pfx-settings-panel-surface-container-high: var( --md-sys-color-surface-container-high, #f7f7f7 );--pfx-settings-panel-surface-container-low: var( --md-sys-color-surface-container-low, #f2f4f7 );--pfx-settings-panel-surface: var(--md-sys-color-surface, #ffffff);--pfx-settings-panel-on-surface: var(--md-sys-color-on-surface, #111827);--pfx-settings-panel-on-surface-variant: var( --md-sys-color-on-surface-variant, rgba(17, 24, 39, .72) );--pfx-settings-panel-outline: var( --md-sys-color-outline, rgba(15, 23, 42, .24) );--pfx-settings-panel-outline-variant: var( --md-sys-color-outline-variant, rgba(15, 23, 42, .12) );--pfx-settings-panel-primary: var(--md-sys-color-primary, #2563eb);--pfx-settings-panel-primary-container: var( --md-sys-color-primary-container, rgba(37, 99, 235, .14) );--pfx-settings-panel-on-primary-container: var( --md-sys-color-on-primary-container, #0f172a );--pfx-settings-panel-secondary: var( --md-sys-color-secondary, var(--pfx-settings-panel-primary) );--pfx-settings-panel-error: var(--md-sys-color-error, #b3261e);--pfx-settings-panel-error-container: var( --md-sys-color-error-container, rgba(179, 38, 30, .14) );display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto 1fr auto;grid-template-areas:\"header\" \"status\" \"body\" \"footer\";height:100%;max-width:100%;background:var(--pfx-settings-panel-surface-container);color:var(--pfx-settings-panel-on-surface);border-left:1px solid var(--pfx-settings-panel-outline-variant);width:min(var(--pfx-settings-panel-width, 720px),100%);max-width:min(100%,100vw);min-width:0;transition:width .3s ease;box-shadow:var(--pfx-settings-panel-elevation, var(--md-sys-elevation-level2, 0 8px 24px rgba(0, 0, 0, .16)));overflow:hidden}praxis-settings-panel .settings-panel.expanded{width:min(var(--pfx-settings-panel-width-expanded, 95vw),var(--pfx-settings-panel-max-width, 2400px),100%)}praxis-settings-panel .settings-panel__resize-handle{position:absolute;inset:0 auto 0 0;width:12px;cursor:col-resize;touch-action:none;z-index:3;outline:none}praxis-settings-panel .settings-panel__resize-handle:before{content:\"\";position:absolute;inset:0 auto 0 4px;width:2px;background:transparent;transition:background-color var(--pfx-side-panel-motion-duration, .16s) ease,opacity var(--pfx-side-panel-motion-duration, .16s) ease;opacity:0}praxis-settings-panel .settings-panel.is-resizable:hover .settings-panel__resize-handle:before,praxis-settings-panel .settings-panel__resize-handle:focus-visible:before{opacity:1;background:var(--pfx-settings-panel-outline)}praxis-settings-panel .settings-panel-header{grid-area:header;display:flex;align-items:center;gap:var(--pfx-settings-panel-header-gap, 8px);padding:12px var(--pfx-settings-panel-header-padding-x, 20px);min-height:var(--pfx-settings-panel-header-height, 64px);border-bottom:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-high);box-shadow:var(--pfx-settings-panel-header-shadow, var(--md-sys-elevation-level1, 0 2px 6px rgba(0, 0, 0, .08)));flex-shrink:0;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-header .spacer{flex:1 1 auto;min-width:0}praxis-settings-panel .settings-panel-status{grid-area:status;display:flex;align-items:center;gap:8px;min-height:36px;padding:6px var(--pfx-settings-panel-status-padding-x, 20px);border-bottom:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-high);color:var(--pfx-settings-panel-on-surface);font-size:.85rem;font-weight:500;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-status mat-icon{width:18px;height:18px;font-size:18px}praxis-settings-panel .settings-panel-status[data-status=dirty],praxis-settings-panel .settings-panel-status[data-status=invalid]{color:var(--pfx-settings-panel-error);background:color-mix(in srgb,var(--pfx-settings-panel-error-container) 30%,var(--pfx-settings-panel-surface-container-high))}praxis-settings-panel .settings-panel-status[data-status=saved]{color:var(--pfx-settings-panel-primary);background:color-mix(in srgb,var(--pfx-settings-panel-primary-container) 28%,var(--pfx-settings-panel-surface-container-high))}praxis-settings-panel .settings-panel-body{grid-area:body;overflow-y:auto;overflow-x:hidden;scroll-padding-top:var(--pfx-settings-panel-scroll-padding-start, 16px);scroll-padding-bottom:var(--pfx-settings-panel-scroll-padding-end, 88px);min-height:0;padding:var(--pfx-settings-panel-body-padding, 8px 16px 24px);background:var(--pfx-settings-panel-surface);display:flex;flex-direction:column;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-body>*{min-width:0;max-width:100%}praxis-settings-panel .settings-panel-content{display:block;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-content>*{min-width:0;max-width:100%;box-sizing:border-box}praxis-settings-panel .settings-panel-footer{grid-area:footer;border-top:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-high);box-shadow:var(--pfx-settings-panel-footer-shadow, var(--md-sys-elevation-level1, 0 -2px 6px rgba(0, 0, 0, .08)));display:flex;align-items:center;flex-wrap:wrap;padding:var(--pfx-settings-panel-footer-padding, 12px 20px);column-gap:var(--pfx-settings-panel-footer-gap, 12px);row-gap:8px;flex-shrink:0;min-width:0;max-width:100%}praxis-settings-panel .spacer{flex:1}praxis-settings-panel .settings-panel-title{display:inline-flex;align-items:center;flex:1 1 auto;gap:var(--pfx-settings-panel-title-gap, 8px);font-weight:700;line-height:1.2;letter-spacing:.2px;margin:0;min-width:0;overflow:visible;white-space:normal}praxis-settings-panel .settings-panel-title span{min-width:0;overflow:visible;white-space:normal}praxis-settings-panel .settings-panel-title mat-icon{color:var(--pfx-settings-panel-primary)}praxis-settings-panel .settings-panel-title .title-icon{width:20px;height:20px;font-size:20px}praxis-settings-panel .settings-panel-footer button+button{margin-left:var(--pfx-settings-panel-footer-gap, 12px)}praxis-settings-panel .settings-panel-footer button{display:inline-flex;align-items:center}praxis-settings-panel .settings-panel-footer button .mat-icon{flex:0 0 20px;font-size:20px;width:20px;height:20px;line-height:1;display:inline-flex;align-items:center;justify-content:center;overflow:hidden}praxis-settings-panel .settings-panel-footer .mat-button-wrapper{display:inline-flex;align-items:center;gap:var(--pfx-settings-panel-button-gap, 8px)}praxis-settings-panel .settings-panel-footer .mat-progress-spinner{margin-right:8px}praxis-settings-panel .settings-panel-footer .mat-flat-button[color=primary]{font-weight:600}praxis-settings-panel .settings-panel .mdc-button__label{display:inline-flex;align-items:center;gap:var(--pfx-settings-panel-button-gap, 8px);line-height:1}praxis-settings-panel .settings-panel .mdc-button__label>span{display:inline-flex;align-items:center;line-height:1}praxis-settings-panel .settings-panel .mdc-button__label .mat-icon{display:inline-flex;align-items:center;justify-content:center;line-height:1}@media(max-width:520px){praxis-settings-panel .settings-panel-footer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch}praxis-settings-panel .settings-panel-footer .spacer{display:none}praxis-settings-panel .settings-panel-footer button{justify-content:center;width:100%;min-width:0}praxis-settings-panel .settings-panel-footer button+button{margin-left:0}}praxis-settings-panel .settings-panel .mat-divider{background-color:var(--pfx-settings-panel-outline-variant)!important}praxis-settings-panel .settings-panel .mat-expansion-panel{background:var(--pfx-settings-panel-surface-container)!important;border:1px solid var(--pfx-settings-panel-outline-variant);border-radius:var(--md-sys-shape-corner-medium, 12px);box-shadow:var(--md-sys-elevation-level1, 0 2px 8px rgba(0, 0, 0, .08));color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-expansion-panel-header{background:var(--pfx-settings-panel-surface-container)!important;color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-content{color:var(--pfx-settings-panel-on-surface);flex-wrap:wrap;gap:4px 12px;min-width:0;overflow:visible}praxis-settings-panel .settings-panel .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:hover{background:color-mix(in srgb,var(--pfx-settings-panel-surface-container-high) 84%,var(--pfx-settings-panel-primary) 16%)}praxis-settings-panel .settings-panel .mat-expansion-panel.mat-expanded>.mat-expansion-panel-header{background:var(--pfx-settings-panel-surface-container-high)!important}praxis-settings-panel .settings-panel .mat-expansion-panel-header mat-icon,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-icon{color:var(--pfx-settings-panel-on-surface)!important}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-title,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description{color:var(--pfx-settings-panel-on-surface);min-width:0;overflow:visible;white-space:normal}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description{color:var(--pfx-settings-panel-on-surface-variant);flex-wrap:wrap;gap:8px}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-title>*,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description>*{color:inherit}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-title small,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description small{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-indicator,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-indicator:after{color:var(--pfx-settings-panel-on-surface-variant);border-color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-expansion-panel .mat-action-row{border-top-color:var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-low)}praxis-settings-panel .settings-panel .mat-accordion,praxis-settings-panel .settings-panel .mat-accordion .mat-expansion-panel-spacing{background:transparent!important}praxis-settings-panel .settings-panel .mat-expansion-panel-content,praxis-settings-panel .settings-panel .mat-expansion-panel-content-wrapper,praxis-settings-panel .settings-panel .mat-expansion-panel-body{background:var(--pfx-settings-panel-surface-container)!important;color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-expansion-panel .mat-expansion-panel-body{padding:8px}praxis-settings-panel .settings-panel .mat-expansion-panel .mat-expansion-panel-body>*{color:inherit}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header{border-bottom:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-low)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab{min-width:0}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab .mdc-tab__text-label{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab:hover .mdc-tab__text-label,praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab:focus .mdc-tab__text-label{color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab.mdc-tab--active .mdc-tab__text-label{color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header-pagination{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header-pagination-chevron{border-color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header-pagination:not(.mat-mdc-tab-header-pagination-disabled):hover{background:color-mix(in srgb,var(--pfx-settings-panel-surface-container-high) 84%,var(--pfx-settings-panel-primary) 16%)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab-indicator__content--underline{border-color:var(--pfx-settings-panel-primary)}praxis-settings-panel .settings-panel .mat-mdc-card{background:var(--pfx-settings-panel-surface-container-low);border:1px solid var(--pfx-settings-panel-outline-variant);color:var(--pfx-settings-panel-on-surface);box-shadow:var(--md-sys-elevation-level1, 0 2px 8px rgba(0, 0, 0, .08))}praxis-settings-panel .settings-panel .mat-mdc-card-subtitle,praxis-settings-panel .settings-panel .mat-mdc-card-content{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-card-title{color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-form-field{width:100%;--mdc-filled-text-field-container-color: var( --pfx-settings-panel-surface-container );--mdc-filled-text-field-hover-container-color: var( --pfx-settings-panel-surface-container-high );--mdc-filled-text-field-focus-container-color: var( --pfx-settings-panel-surface-container-high );--mdc-filled-text-field-active-indicator-color: var( --pfx-settings-panel-outline-variant );--mdc-filled-text-field-hover-active-indicator-color: var( --pfx-settings-panel-secondary );--mdc-filled-text-field-focus-active-indicator-color: var( --pfx-settings-panel-primary );--mdc-filled-text-field-label-text-color: var( --pfx-settings-panel-on-surface-variant );--mdc-filled-text-field-focus-label-text-color: var( --pfx-settings-panel-primary );--mdc-filled-text-field-input-text-color: var( --pfx-settings-panel-on-surface );--mdc-filled-text-field-caret-color: var(--pfx-settings-panel-primary);--mdc-outlined-text-field-outline-color: var( --pfx-settings-panel-outline-variant );--mdc-outlined-text-field-hover-outline-color: var( --pfx-settings-panel-secondary );--mdc-outlined-text-field-focus-outline-color: var( --pfx-settings-panel-primary );--mdc-outlined-text-field-label-text-color: var( --pfx-settings-panel-on-surface-variant );--mdc-outlined-text-field-focus-label-text-color: var( --pfx-settings-panel-primary );--mdc-outlined-text-field-input-text-color: var( --pfx-settings-panel-on-surface );--mdc-outlined-text-field-caret-color: var(--pfx-settings-panel-primary);--mat-form-field-focus-select-arrow-color: var( --pfx-settings-panel-primary );--mat-form-field-enabled-select-arrow-color: var( --pfx-settings-panel-on-surface-variant )}praxis-settings-panel .settings-panel .mdc-text-field--filled{background-color:var(--pfx-settings-panel-surface-container)!important;border-radius:var(--md-sys-shape-corner-small, 8px) var(--md-sys-shape-corner-small, 8px) 0 0}praxis-settings-panel .settings-panel .mat-mdc-text-field-wrapper,praxis-settings-panel .settings-panel .mat-mdc-form-field-flex,praxis-settings-panel .settings-panel .mat-mdc-form-field-infix,praxis-settings-panel .settings-panel .mat-mdc-form-field-focus-overlay{background:var(--pfx-settings-panel-surface-container)!important;color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-form-field-focus-overlay{opacity:0}praxis-settings-panel .settings-panel .mdc-text-field--filled .mdc-text-field__input,praxis-settings-panel .settings-panel .mdc-text-field--filled .mdc-floating-label,praxis-settings-panel .settings-panel .mat-mdc-select-value,praxis-settings-panel .settings-panel .mat-mdc-select-arrow,praxis-settings-panel .settings-panel .mat-mdc-form-field .mat-mdc-floating-label{color:var(--pfx-settings-panel-on-surface-variant)!important}praxis-settings-panel .settings-panel .mdc-text-field--filled.mdc-text-field--focused .mdc-floating-label,praxis-settings-panel .settings-panel .mdc-text-field--filled .mdc-text-field__input{color:var(--pfx-settings-panel-on-surface)!important}praxis-settings-panel .settings-panel .mat-mdc-form-field input,praxis-settings-panel .settings-panel .mat-mdc-form-field textarea,praxis-settings-panel .settings-panel .mat-mdc-form-field .mdc-text-field__input{color:var(--pfx-settings-panel-on-surface)!important}praxis-settings-panel .settings-panel .mat-mdc-form-field-subscript-wrapper,praxis-settings-panel .settings-panel .mat-mdc-form-field-hint-wrapper,praxis-settings-panel .settings-panel .mat-mdc-form-field-error-wrapper,praxis-settings-panel .settings-panel .mat-mdc-hint{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-button-toggle-group{border-color:var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-low)}praxis-settings-panel .settings-panel .mat-button-toggle{background:var(--pfx-settings-panel-surface-container-low);color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-button-toggle+.mat-button-toggle{border-left-color:var(--pfx-settings-panel-outline-variant)}praxis-settings-panel .settings-panel .mat-button-toggle-checked{background:var(--pfx-settings-panel-primary-container)!important;color:var(--pfx-settings-panel-on-primary-container)!important}praxis-settings-panel .settings-panel .mat-button-toggle .mat-icon,praxis-settings-panel .settings-panel .mat-button-toggle-checked .mat-icon{color:inherit}praxis-settings-panel .settings-panel .mat-mdc-slide-toggle .mdc-label{color:var(--pfx-settings-panel-on-surface)}.settings-panel{grid-template-columns:minmax(0,1fr);min-width:0;max-width:100%}.settings-panel-body{overflow-x:hidden;min-width:0}.settings-panel-body>*{min-width:0;max-width:100%}.praxis-settings-panel-backdrop{background:var(--pfx-backdrop, rgba(8, 15, 26, .42));backdrop-filter:blur(var(--pfx-backdrop-blur, 6px)) saturate(110%);-webkit-backdrop-filter:blur(var(--pfx-backdrop-blur, 6px)) saturate(110%)}.praxis-settings-panel-pane{position:fixed!important;top:0!important;right:0!important;display:flex!important;align-items:stretch!important;height:100vh!important;max-width:100vw!important;max-height:100vh!important;z-index:var(--praxis-layer-settings-panel, 1220)!important}.praxis-settings-panel-pane .settings-panel{pointer-events:auto}\n"] }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [providePraxisSettingsPanelI18n()], template: "<div\n  class=\"settings-panel\"\n  data-testid=\"settings-panel-root\"\n  [class.expanded]=\"expanded\"\n  [class.is-resizable]=\"showResizeHandle\"\n  [ngStyle]=\"panelInlineStyles\"\n  role=\"dialog\"\n  [attr.aria-modal]=\"interactionActive ? 'true' : null\"\n  [attr.aria-hidden]=\"interactionActive ? null : 'true'\"\n  [attr.inert]=\"interactionActive ? null : ''\"\n  [attr.aria-labelledby]=\"titleId\"\n  [cdkTrapFocus]=\"interactionActive\"\n  [cdkTrapFocusAutoCapture]=\"interactionActive\"\n  >\n  @if (showResizeHandle) {\n    <div\n      class=\"settings-panel__resize-handle\"\n      role=\"separator\"\n      tabindex=\"0\"\n      aria-orientation=\"vertical\"\n      [attr.aria-label]=\"resizeHandleLabel\"\n      (pointerdown)=\"onResizeHandlePointerDown($event)\"\n      (keydown)=\"onResizeHandleKeydown($event)\"\n    ></div>\n  }\n  <header class=\"settings-panel-header\">\n    <h2 class=\"settings-panel-title\" [id]=\"titleId\">\n      @if (titleIcon) {\n        <mat-icon class=\"title-icon\" [praxisIcon]=\"titleIcon\"></mat-icon>\n      }\n      <span>{{ title }}</span>\n    </h2>\n    <span class=\"spacer\"></span>\n    <button\n      [praxisIconButton]=\"expanded ? 'close_fullscreen' : 'open_in_full'\"\n      size=\"compact\"\n      type=\"button\"\n      data-testid=\"settings-panel-toggle-expand\"\n      [attr.aria-label]=\"expanded ? tx('Collapse panel') : tx('Expand panel')\"\n      [attr.aria-expanded]=\"expanded\"\n      [matTooltip]=\"expanded ? tx('Collapse panel') : tx('Expand panel')\"\n      (click)=\"toggleExpand()\"\n    ></button>\n    <button\n      praxisIconButton=\"close\"\n      size=\"compact\"\n      type=\"button\"\n      data-testid=\"settings-panel-close-icon\"\n      [attr.aria-label]=\"tx('Close')\"\n      [matTooltip]=\"tx('Close')\"\n      (click)=\"onCancel()\"\n    ></button>\n  </header>\n  @if (showStatusMessage) {\n    <div\n      class=\"settings-panel-status\"\n      [attr.data-status]=\"statusTone\"\n      role=\"status\"\n      aria-live=\"polite\"\n      >\n      <mat-icon\n        aria-hidden=\"true\"\n        [praxisIcon]=\"\n          statusTone === 'dirty' || statusTone === 'invalid'\n            ? 'warning'\n            : statusTone === 'saved'\n              ? 'check_circle'\n              : statusTone === 'busy'\n                ? 'autorenew'\n                : 'info'\n        \"\n      ></mat-icon>\n      <span>{{ statusMessage }}</span>\n    </div>\n  }\n  <div class=\"settings-panel-body\">\n    <ng-template #contentHost></ng-template>\n  </div>\n  <footer class=\"settings-panel-footer\">\n    <button\n      mat-button\n      type=\"button\"\n      data-testid=\"settings-panel-reset\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onReset()\"\n      [disabled]=\"isBusy\"\n      >\n      <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'restart_alt'\"></mat-icon>\n      <span>{{ tx('Reset') }}</span>\n    </button>\n    <span class=\"spacer\"></span>\n    <button\n      mat-button\n      type=\"button\"\n      data-testid=\"settings-panel-cancel\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onCancel()\"\n      [disabled]=\"isBusy\"\n      >\n      <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'close'\"></mat-icon>\n      <span>{{ tx('Cancel') }}</span>\n    </button>\n    <button\n      mat-stroked-button\n      type=\"button\"\n      data-testid=\"settings-panel-apply\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onApply()\"\n      [disabled]=\"!canApply\"\n      [matTooltip]=\"applySaveDisabledReason\"\n      [matTooltipDisabled]=\"canApply || !diagnostics.showDisabledReason\"\n      [attr.aria-busy]=\"isBusy\"\n      [attr.aria-label]=\"applyActionLabel || 'Apply'\"\n      >\n      @if (showBusyIndicator) {\n        <mat-progress-spinner\n          mode=\"indeterminate\"\n          diameter=\"20\"\n        ></mat-progress-spinner>\n      }\n      @if (!showBusyIndicator) {\n        <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'done'\"></mat-icon>\n        <span class=\"settings-panel-action-label settings-panel-action-label--apply\">{{ applyActionLabel }}</span>\n      }\n    </button>\n    <button\n      mat-flat-button\n      color=\"primary\"\n      type=\"button\"\n      data-testid=\"settings-panel-save\"\n      (mousedown)=\"$event.stopPropagation()\"\n      (click)=\"$event.stopPropagation(); onSave()\"\n      [disabled]=\"!canSave\"\n      [matTooltip]=\"applySaveDisabledReason\"\n      [matTooltipDisabled]=\"canSave || !diagnostics.showDisabledReason\"\n      [attr.aria-busy]=\"isBusy\"\n      [attr.aria-label]=\"saveActionLabel || 'Save & Close'\"\n      >\n      @if (showBusyIndicator) {\n        <mat-progress-spinner\n          mode=\"indeterminate\"\n          diameter=\"20\"\n        ></mat-progress-spinner>\n      }\n      @if (!showBusyIndicator) {\n        <mat-icon aria-hidden=\"true\" [praxisIcon]=\"'save'\"></mat-icon>\n        <span class=\"settings-panel-action-label settings-panel-action-label--save\">{{ saveActionLabel }}</span>\n      }\n    </button>\n  </footer>\n</div>\n", styles: ["@charset \"UTF-8\";praxis-settings-panel{display:block;height:100%;width:100%;min-width:0;flex:1 1 auto}praxis-settings-panel .settings-panel{position:relative;--pfx-settings-panel-surface-container: var( --md-sys-color-surface-container, #ffffff );--pfx-settings-panel-surface-container-high: var( --md-sys-color-surface-container-high, #f7f7f7 );--pfx-settings-panel-surface-container-low: var( --md-sys-color-surface-container-low, #f2f4f7 );--pfx-settings-panel-surface: var(--md-sys-color-surface, #ffffff);--pfx-settings-panel-on-surface: var(--md-sys-color-on-surface, #111827);--pfx-settings-panel-on-surface-variant: var( --md-sys-color-on-surface-variant, rgba(17, 24, 39, .72) );--pfx-settings-panel-outline: var( --md-sys-color-outline, rgba(15, 23, 42, .24) );--pfx-settings-panel-outline-variant: var( --md-sys-color-outline-variant, rgba(15, 23, 42, .12) );--pfx-settings-panel-primary: var(--md-sys-color-primary, #2563eb);--pfx-settings-panel-primary-container: var( --md-sys-color-primary-container, rgba(37, 99, 235, .14) );--pfx-settings-panel-on-primary-container: var( --md-sys-color-on-primary-container, #0f172a );--pfx-settings-panel-secondary: var( --md-sys-color-secondary, var(--pfx-settings-panel-primary) );--pfx-settings-panel-error: var(--md-sys-color-error, #b3261e);--pfx-settings-panel-error-container: var( --md-sys-color-error-container, rgba(179, 38, 30, .14) );display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto 1fr auto;grid-template-areas:\"header\" \"status\" \"body\" \"footer\";height:100%;background:var(--pfx-settings-panel-surface-container);color:var(--pfx-settings-panel-on-surface);border-left:1px solid var(--pfx-settings-panel-outline-variant);width:100%;max-width:100%;min-width:0;box-shadow:var(--pfx-settings-panel-elevation, var(--md-sys-elevation-level2, 0 8px 24px rgba(0, 0, 0, .16)));overflow:hidden}praxis-settings-panel .settings-panel__resize-handle{position:absolute;inset:0 auto 0 0;width:12px;cursor:col-resize;touch-action:none;z-index:3;outline:none}praxis-settings-panel .settings-panel__resize-handle:before{content:\"\";position:absolute;inset:0 auto 0 4px;width:2px;background:transparent;transition:background-color var(--pfx-side-panel-motion-duration, .16s) ease,opacity var(--pfx-side-panel-motion-duration, .16s) ease;opacity:0}praxis-settings-panel .settings-panel.is-resizable:hover .settings-panel__resize-handle:before,praxis-settings-panel .settings-panel__resize-handle:focus-visible:before{opacity:1;background:var(--pfx-settings-panel-outline)}praxis-settings-panel .settings-panel-header{grid-area:header;display:flex;align-items:center;gap:var(--pfx-settings-panel-header-gap, 8px);padding:12px var(--pfx-settings-panel-header-padding-x, 20px);min-height:var(--pfx-settings-panel-header-height, 64px);border-bottom:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-high);box-shadow:var(--pfx-settings-panel-header-shadow, var(--md-sys-elevation-level1, 0 2px 6px rgba(0, 0, 0, .08)));flex-shrink:0;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-header .spacer{flex:1 1 auto;min-width:0}praxis-settings-panel .settings-panel-status{grid-area:status;display:flex;align-items:center;gap:8px;min-height:36px;padding:6px var(--pfx-settings-panel-status-padding-x, 20px);border-bottom:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-high);color:var(--pfx-settings-panel-on-surface);font-size:.85rem;font-weight:500;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-status mat-icon{width:18px;height:18px;font-size:18px}praxis-settings-panel .settings-panel-status[data-status=dirty],praxis-settings-panel .settings-panel-status[data-status=invalid]{color:var(--pfx-settings-panel-error);background:color-mix(in srgb,var(--pfx-settings-panel-error-container) 30%,var(--pfx-settings-panel-surface-container-high))}praxis-settings-panel .settings-panel-status[data-status=saved]{color:var(--pfx-settings-panel-primary);background:color-mix(in srgb,var(--pfx-settings-panel-primary-container) 28%,var(--pfx-settings-panel-surface-container-high))}praxis-settings-panel .settings-panel-body{grid-area:body;overflow-y:auto;overflow-x:hidden;scroll-padding-top:var(--pfx-settings-panel-scroll-padding-start, 16px);scroll-padding-bottom:var(--pfx-settings-panel-scroll-padding-end, 88px);min-height:0;padding:var(--pfx-settings-panel-body-padding, 8px 16px 24px);background:var(--pfx-settings-panel-surface);display:flex;flex-direction:column;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-body>*{min-width:0;max-width:100%}praxis-settings-panel .settings-panel-content{display:block;min-width:0;max-width:100%}praxis-settings-panel .settings-panel-content>*{min-width:0;max-width:100%;box-sizing:border-box}praxis-settings-panel .settings-panel-footer{grid-area:footer;border-top:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-high);box-shadow:var(--pfx-settings-panel-footer-shadow, var(--md-sys-elevation-level1, 0 -2px 6px rgba(0, 0, 0, .08)));display:flex;align-items:center;flex-wrap:wrap;padding:var(--pfx-settings-panel-footer-padding, 12px 20px);column-gap:var(--pfx-settings-panel-footer-gap, 12px);row-gap:8px;flex-shrink:0;min-width:0;max-width:100%}praxis-settings-panel .spacer{flex:1}praxis-settings-panel .settings-panel-title{display:inline-flex;align-items:center;flex:1 1 auto;gap:var(--pfx-settings-panel-title-gap, 8px);font-weight:700;line-height:1.2;letter-spacing:.2px;margin:0;min-width:0;overflow:visible;white-space:normal}praxis-settings-panel .settings-panel-title span{min-width:0;overflow:visible;white-space:normal}praxis-settings-panel .settings-panel-title mat-icon{color:var(--pfx-settings-panel-primary)}praxis-settings-panel .settings-panel-title .title-icon{width:20px;height:20px;font-size:20px}praxis-settings-panel .settings-panel-footer button+button{margin-left:var(--pfx-settings-panel-footer-gap, 12px)}praxis-settings-panel .settings-panel-footer button{display:inline-flex;align-items:center}praxis-settings-panel .settings-panel-footer button .mat-icon{flex:0 0 20px;font-size:20px;width:20px;height:20px;line-height:1;display:inline-flex;align-items:center;justify-content:center;overflow:hidden}praxis-settings-panel .settings-panel-footer .mat-button-wrapper{display:inline-flex;align-items:center;gap:var(--pfx-settings-panel-button-gap, 8px)}praxis-settings-panel .settings-panel-footer .mat-progress-spinner{margin-right:8px}praxis-settings-panel .settings-panel-footer .mat-flat-button[color=primary]{font-weight:600}praxis-settings-panel .settings-panel .mdc-button__label{display:inline-flex;align-items:center;gap:var(--pfx-settings-panel-button-gap, 8px);line-height:1}praxis-settings-panel .settings-panel .mdc-button__label>span{display:inline-flex;align-items:center;line-height:1}praxis-settings-panel .settings-panel .mdc-button__label .mat-icon{display:inline-flex;align-items:center;justify-content:center;line-height:1}@media(max-width:520px){praxis-settings-panel .settings-panel-footer{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch}praxis-settings-panel .settings-panel-footer .spacer{display:none}praxis-settings-panel .settings-panel-footer button{justify-content:center;width:100%;min-width:0}praxis-settings-panel .settings-panel-footer button+button{margin-left:0}}praxis-settings-panel .settings-panel .mat-divider{background-color:var(--pfx-settings-panel-outline-variant)!important}praxis-settings-panel .settings-panel .mat-expansion-panel{background:var(--pfx-settings-panel-surface-container)!important;border:1px solid var(--pfx-settings-panel-outline-variant);border-radius:var(--md-sys-shape-corner-medium, 12px);box-shadow:var(--md-sys-elevation-level1, 0 2px 8px rgba(0, 0, 0, .08));color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-expansion-panel-header{background:var(--pfx-settings-panel-surface-container)!important;color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-content{color:var(--pfx-settings-panel-on-surface);flex-wrap:wrap;gap:4px 12px;min-width:0;overflow:visible}praxis-settings-panel .settings-panel .mat-expansion-panel:not(.mat-expanded) .mat-expansion-panel-header:hover{background:color-mix(in srgb,var(--pfx-settings-panel-surface-container-high) 84%,var(--pfx-settings-panel-primary) 16%)}praxis-settings-panel .settings-panel .mat-expansion-panel.mat-expanded>.mat-expansion-panel-header{background:var(--pfx-settings-panel-surface-container-high)!important}praxis-settings-panel .settings-panel .mat-expansion-panel-header mat-icon,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-icon{color:var(--pfx-settings-panel-on-surface)!important}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-title,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description{color:var(--pfx-settings-panel-on-surface);min-width:0;overflow:visible;white-space:normal}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description{color:var(--pfx-settings-panel-on-surface-variant);flex-wrap:wrap;gap:8px}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-title>*,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description>*{color:inherit}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-title small,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-panel-header-description small{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-indicator,praxis-settings-panel .settings-panel .mat-expansion-panel-header .mat-expansion-indicator:after{color:var(--pfx-settings-panel-on-surface-variant);border-color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-expansion-panel .mat-action-row{border-top-color:var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-low)}praxis-settings-panel .settings-panel .mat-accordion,praxis-settings-panel .settings-panel .mat-accordion .mat-expansion-panel-spacing{background:transparent!important}praxis-settings-panel .settings-panel .mat-expansion-panel-content,praxis-settings-panel .settings-panel .mat-expansion-panel-content-wrapper,praxis-settings-panel .settings-panel .mat-expansion-panel-body{background:var(--pfx-settings-panel-surface-container)!important;color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-expansion-panel .mat-expansion-panel-body{padding:8px}praxis-settings-panel .settings-panel .mat-expansion-panel .mat-expansion-panel-body>*{color:inherit}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header{border-bottom:1px solid var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-low)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab{min-width:0}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab .mdc-tab__text-label{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab:hover .mdc-tab__text-label,praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab:focus .mdc-tab__text-label{color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab.mdc-tab--active .mdc-tab__text-label{color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header-pagination{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header-pagination-chevron{border-color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mat-mdc-tab-header-pagination:not(.mat-mdc-tab-header-pagination-disabled):hover{background:color-mix(in srgb,var(--pfx-settings-panel-surface-container-high) 84%,var(--pfx-settings-panel-primary) 16%)}praxis-settings-panel .settings-panel .mat-mdc-tab-group .mdc-tab-indicator__content--underline{border-color:var(--pfx-settings-panel-primary)}praxis-settings-panel .settings-panel .mat-mdc-card{background:var(--pfx-settings-panel-surface-container-low);border:1px solid var(--pfx-settings-panel-outline-variant);color:var(--pfx-settings-panel-on-surface);box-shadow:var(--md-sys-elevation-level1, 0 2px 8px rgba(0, 0, 0, .08))}praxis-settings-panel .settings-panel .mat-mdc-card-subtitle,praxis-settings-panel .settings-panel .mat-mdc-card-content{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-mdc-card-title{color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-form-field{width:100%;--mdc-filled-text-field-container-color: var( --pfx-settings-panel-surface-container );--mdc-filled-text-field-hover-container-color: var( --pfx-settings-panel-surface-container-high );--mdc-filled-text-field-focus-container-color: var( --pfx-settings-panel-surface-container-high );--mdc-filled-text-field-active-indicator-color: var( --pfx-settings-panel-outline-variant );--mdc-filled-text-field-hover-active-indicator-color: var( --pfx-settings-panel-secondary );--mdc-filled-text-field-focus-active-indicator-color: var( --pfx-settings-panel-primary );--mdc-filled-text-field-label-text-color: var( --pfx-settings-panel-on-surface-variant );--mdc-filled-text-field-focus-label-text-color: var( --pfx-settings-panel-primary );--mdc-filled-text-field-input-text-color: var( --pfx-settings-panel-on-surface );--mdc-filled-text-field-caret-color: var(--pfx-settings-panel-primary);--mdc-outlined-text-field-outline-color: var( --pfx-settings-panel-outline-variant );--mdc-outlined-text-field-hover-outline-color: var( --pfx-settings-panel-secondary );--mdc-outlined-text-field-focus-outline-color: var( --pfx-settings-panel-primary );--mdc-outlined-text-field-label-text-color: var( --pfx-settings-panel-on-surface-variant );--mdc-outlined-text-field-focus-label-text-color: var( --pfx-settings-panel-primary );--mdc-outlined-text-field-input-text-color: var( --pfx-settings-panel-on-surface );--mdc-outlined-text-field-caret-color: var(--pfx-settings-panel-primary);--mat-form-field-focus-select-arrow-color: var( --pfx-settings-panel-primary );--mat-form-field-enabled-select-arrow-color: var( --pfx-settings-panel-on-surface-variant )}praxis-settings-panel .settings-panel .mdc-text-field--filled{background-color:var(--pfx-settings-panel-surface-container)!important;border-radius:var(--md-sys-shape-corner-small, 8px) var(--md-sys-shape-corner-small, 8px) 0 0}praxis-settings-panel .settings-panel .mat-mdc-text-field-wrapper,praxis-settings-panel .settings-panel .mat-mdc-form-field-flex,praxis-settings-panel .settings-panel .mat-mdc-form-field-infix,praxis-settings-panel .settings-panel .mat-mdc-form-field-focus-overlay{background:var(--pfx-settings-panel-surface-container)!important;color:var(--pfx-settings-panel-on-surface)}praxis-settings-panel .settings-panel .mat-mdc-form-field-focus-overlay{opacity:0}praxis-settings-panel .settings-panel .mdc-text-field--filled .mdc-text-field__input,praxis-settings-panel .settings-panel .mdc-text-field--filled .mdc-floating-label,praxis-settings-panel .settings-panel .mat-mdc-select-value,praxis-settings-panel .settings-panel .mat-mdc-select-arrow,praxis-settings-panel .settings-panel .mat-mdc-form-field .mat-mdc-floating-label{color:var(--pfx-settings-panel-on-surface-variant)!important}praxis-settings-panel .settings-panel .mdc-text-field--filled.mdc-text-field--focused .mdc-floating-label,praxis-settings-panel .settings-panel .mdc-text-field--filled .mdc-text-field__input{color:var(--pfx-settings-panel-on-surface)!important}praxis-settings-panel .settings-panel .mat-mdc-form-field input,praxis-settings-panel .settings-panel .mat-mdc-form-field textarea,praxis-settings-panel .settings-panel .mat-mdc-form-field .mdc-text-field__input{color:var(--pfx-settings-panel-on-surface)!important}praxis-settings-panel .settings-panel .mat-mdc-form-field-subscript-wrapper,praxis-settings-panel .settings-panel .mat-mdc-form-field-hint-wrapper,praxis-settings-panel .settings-panel .mat-mdc-form-field-error-wrapper,praxis-settings-panel .settings-panel .mat-mdc-hint{color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-button-toggle-group{border-color:var(--pfx-settings-panel-outline-variant);background:var(--pfx-settings-panel-surface-container-low)}praxis-settings-panel .settings-panel .mat-button-toggle{background:var(--pfx-settings-panel-surface-container-low);color:var(--pfx-settings-panel-on-surface-variant)}praxis-settings-panel .settings-panel .mat-button-toggle+.mat-button-toggle{border-left-color:var(--pfx-settings-panel-outline-variant)}praxis-settings-panel .settings-panel .mat-button-toggle-checked{background:var(--pfx-settings-panel-primary-container)!important;color:var(--pfx-settings-panel-on-primary-container)!important}praxis-settings-panel .settings-panel .mat-button-toggle .mat-icon,praxis-settings-panel .settings-panel .mat-button-toggle-checked .mat-icon{color:inherit}praxis-settings-panel .settings-panel .mat-mdc-slide-toggle .mdc-label{color:var(--pfx-settings-panel-on-surface)}.settings-panel{grid-template-columns:minmax(0,1fr);min-width:0;max-width:100%}.settings-panel-body{overflow-x:hidden;min-width:0}.settings-panel-body>*{min-width:0;max-width:100%}.praxis-settings-panel-backdrop{background:var(--pfx-backdrop, rgba(8, 15, 26, .42));backdrop-filter:blur(var(--pfx-backdrop-blur, 6px)) saturate(110%);-webkit-backdrop-filter:blur(var(--pfx-backdrop-blur, 6px)) saturate(110%)}.praxis-settings-panel-pane{position:fixed!important;top:0!important;right:0!important;display:flex!important;align-items:stretch!important;height:100vh!important;max-width:100vw!important;max-height:100vh!important;z-index:var(--praxis-layer-settings-panel, 1220)!important;transition:width var(--pfx-side-panel-motion-duration-enter, .3s) var(--pfx-side-panel-motion-easing-enter, ease)}.praxis-settings-panel-pane .settings-panel{pointer-events:auto}@media(prefers-reduced-motion:reduce){.praxis-settings-panel-pane{transition:none}}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.MatDialog }, { type: i0.ElementRef }, { type: i1$1.OverlayContainer }], propDecorators: { contentHost: [{
                 type: ViewChild,
                 args: ['contentHost', { read: ViewContainerRef, static: true }]
@@ -1567,6 +1594,9 @@ class BaseSidePanelService {
         this.currentByScope.delete(scope);
     }
     buildOverlayConfig(config, options) {
+        const configuredOverlayWidth = typeof options?.overlayWidth === 'function'
+            ? options.overlayWidth(config)
+            : options?.overlayWidth;
         return {
             hasBackdrop: true,
             backdropClass: options?.backdropClass ?? 'praxis-side-panel-backdrop',
@@ -1575,9 +1605,9 @@ class BaseSidePanelService {
             height: options?.overlaySize?.height ?? '100vh',
             minHeight: options?.overlaySize?.minHeight,
             maxHeight: options?.overlaySize?.maxHeight,
-            width: options?.overlayWidth === null
+            width: configuredOverlayWidth === null
                 ? options?.overlaySize?.width
-                : options?.overlayWidth ??
+                : configuredOverlayWidth ??
                     config.width ??
                     options?.overlaySize?.width ??
                     this.resolveWidth(config.widthPreset ?? 'default'),
@@ -1674,6 +1704,8 @@ class SettingsPanelService {
     injector;
     currentRef;
     currentPanelInstance;
+    currentScope;
+    childSequence = 0;
     i18n = inject(PraxisI18nService);
     layerScale = inject(PraxisLayerScaleStyleService);
     constructor(baseSidePanelService, injector) {
@@ -1705,15 +1737,39 @@ class SettingsPanelService {
         }
         return this.openFresh(config);
     }
-    openFresh(config) {
+    /**
+     * Opens an authoring editor above the current settings panel without
+     * destroying the parent editor and its draft state.
+     */
+    openChild(config) {
+        if (!this.currentRef || !this.currentPanelInstance) {
+            return this.openFresh(config);
+        }
+        const parent = {
+            ref: this.currentRef,
+            panel: this.currentPanelInstance,
+            scope: this.currentScope ?? 'settings-panel',
+        };
+        parent.panel.setInteractionActive(false);
+        const scope = `settings-panel-child-${++this.childSequence}`;
+        try {
+            return this.openFresh(config, scope, parent);
+        }
+        catch (error) {
+            parent.panel.setInteractionActive(true);
+            throw error;
+        }
+    }
+    openFresh(config, scope = 'settings-panel', parent) {
         this.layerScale.ensureInstalled();
         const ref = this.baseSidePanelService.openHost({
             component: SettingsPanelComponent,
             config: {
                 id: config.id,
-                scope: 'settings-panel',
+                scope,
                 title: config.title,
                 titleIcon: config.titleIcon,
+                width: '720px',
                 resizable: config.resizable ?? true,
                 resizeAxis: 'x',
                 persistSizeKey: config.persistSizeKey ?? `settings-panel:${config.id}`,
@@ -1728,7 +1784,13 @@ class SettingsPanelService {
             },
             backdropClass: 'praxis-settings-panel-backdrop',
             panelClass: 'praxis-settings-panel-pane',
-            overlayWidth: null,
+            overlayWidth: (resolvedConfig) => config.expanded
+                ? resolveExpandedPanelWidth({
+                    currentWidth: resolvedConfig.width ?? '720px',
+                    minWidth: resolvedConfig.minWidth,
+                    maxWidth: resolvedConfig.maxWidth,
+                })
+                : resolvedConfig.width ?? '720px',
             createRef: (overlayRef) => new SettingsPanelRef(overlayRef),
             attach: (panelRef, panelServiceRef, resolvedConfig) => {
                 panelRef.instance.title = config.title?.trim()
@@ -1745,6 +1807,7 @@ class SettingsPanelService {
                 });
                 panelRef.instance.configureDiagnostics(config.diagnostics);
                 this.currentPanelInstance = panelRef.instance;
+                this.currentScope = scope;
                 const inputs = config.content.inputs;
                 const injector = Injector.create({
                     providers: [
@@ -1762,17 +1825,17 @@ class SettingsPanelService {
         });
         ref.closed$.subscribe(() => {
             if (this.currentRef === ref) {
-                this.currentRef = undefined;
-                this.currentPanelInstance = undefined;
+                this.currentRef = parent?.ref;
+                this.currentPanelInstance = parent?.panel;
+                this.currentScope = parent?.scope;
+                parent?.panel.setInteractionActive(true);
             }
         });
         this.currentRef = ref;
         return ref;
     }
     close(reason = 'cancel') {
-        this.baseSidePanelService.closeScope('settings-panel', reason);
-        this.currentRef = undefined;
-        this.currentPanelInstance = undefined;
+        this.currentRef?.close(reason);
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: SettingsPanelService, deps: [{ token: BaseSidePanelService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Injectable });
     static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: SettingsPanelService, providedIn: 'root' });
@@ -5119,7 +5182,7 @@ const PRAXIS_SETTINGS_PANEL_AUTHORING_MANIFEST = {
     configSchemaId: 'SettingsPanelConfig',
     manifestVersion: '1.0.0',
     runtimeInputs: [
-        { name: 'config', type: 'SettingsPanelConfig', description: 'Canonical settings panel shell config passed to SettingsPanelService.open.' },
+        { name: 'config', type: 'SettingsPanelConfig', description: 'Canonical settings panel shell config passed to SettingsPanelService.open or to openChild for a subordinate editor of the same authoring document.' },
         { name: 'config.diagnostics', type: 'SettingsPanelDiagnosticsConfig', description: 'Optional shell diagnostics visibility config for status, disabled reason, busy state and validation state.' },
         { name: 'content.component', type: 'Type<SettingsValueProvider>', description: 'Standalone editor component hosted inside the authoring shell.' },
         { name: 'content.inputs', type: 'Record<string, unknown>', description: 'Initial editor inputs owned by the consumer component manifest.' },
@@ -5286,7 +5349,7 @@ const PRAXIS_SETTINGS_PANEL_AUTHORING_MANIFEST = {
                         failureModes: ['editor-component-not-registered', 'settings-value-provider-missing', 'consumer-manifest-required', 'consumer-config-boundary-violation'],
                         description: 'Configures the hosted editor component and input envelope while delegating consumer-specific config edits to the owning component manifest.',
                     } }],
-            validators: ['editor-component-registered', 'settings-value-provider-contract-present', 'consumer-config-delegated', 'editor-inputs-serializable'],
+            validators: ['editor-component-registered', 'settings-value-provider-contract-present', 'consumer-config-delegated', 'editor-inputs-serializable', 'child-panel-isolates-parent-interaction'],
             affectedPaths: ['config.content.component', 'config.content.inputs', 'delegatedConsumerPatch'],
             submissionImpact: 'config-only',
             destructive: false,
@@ -5331,6 +5394,7 @@ const PRAXIS_SETTINGS_PANEL_AUTHORING_MANIFEST = {
     validators: [
         { validatorId: 'panel-id-stable', level: 'error', code: 'SETTINGS_PANEL_ID_STABLE', description: 'Panel id must remain stable for replacement, persistence and diagnostics.' },
         { validatorId: 'replacement-mediates-before-close', level: 'error', code: 'SETTINGS_PANEL_REPLACEMENT_MEDIATES_CLOSE', description: 'Opening a replacement panel must consult the current editor onBeforeClose before closing.' },
+        { validatorId: 'child-panel-isolates-parent-interaction', level: 'error', code: 'SETTINGS_PANEL_CHILD_ISOLATES_PARENT', description: 'A subordinate authoring panel must preserve the parent draft while making the parent inert and preventing parent keyboard shortcuts until the child closes.' },
         { validatorId: 'title-i18n-compatible', level: 'warning', code: 'SETTINGS_PANEL_TITLE_I18N_COMPATIBLE', description: 'Authoring chrome text must remain compatible with the settings panel i18n namespace.' },
         { validatorId: 'panel-size-safe', level: 'error', code: 'SETTINGS_PANEL_SIZE_SAFE', description: 'Panel sizes must be finite numbers or safe CSS size strings.' },
         { validatorId: 'panel-min-max-consistent', level: 'error', code: 'SETTINGS_PANEL_MIN_MAX_CONSISTENT', description: 'Minimum width must not exceed maximum width.' },
@@ -5359,6 +5423,7 @@ const PRAXIS_SETTINGS_PANEL_AUTHORING_MANIFEST = {
         'Apply must emit applied$ without closing; Save must emit saved$ and close with reason save; Reset must be confirmed and emit reset$.',
         'Busy, dirty and valid state must gate Apply and Save consistently and remain visible through diagnostics.',
         'Opening a replacement panel must pass through the current editor onBeforeClose and dirty-discard mediation.',
+        'Opening a subordinate editor with openChild must preserve the parent draft, isolate parent focus and shortcuts, and reactivate the parent only after the child closes.',
     ],
     examples: [
         { id: 'open-component-editor', request: 'Open the table settings editor in the settings panel.', operationId: 'editor.host.configure', params: { componentId: 'praxis-table', inputs: { tableId: 'orders' }, configManifestComponentId: 'praxis-table', editorContract: 'SettingsValueProvider' }, isPositive: true },

package/package.json

@@ -1,15 +1,15 @@
 {
   "name": "@praxisui/settings-panel",
-  "version": "9.0.5",
+  "version": "9.0.6",
   "description": "Settings panel for Praxis UI libraries: open editors for configuration at runtime and persist settings.",
   "peerDependencies": {
     "@angular/common": "^21.0.0",
     "@angular/core": "^21.0.0",
     "@angular/cdk": "^21.0.0",
     "@angular/material": "^21.0.0",
-    "@praxisui/ai": "^9.0.5",
-    "@praxisui/core": "^9.0.5",
-    "@praxisui/dynamic-fields": "^9.0.5",
+    "@praxisui/ai": "^9.0.6",
+    "@praxisui/core": "^9.0.6",
+    "@praxisui/dynamic-fields": "^9.0.6",
     "rxjs": "~7.8.0"
   },
   "dependencies": {

package/types/praxisui-settings-panel.d.ts

@@ -289,7 +289,7 @@ interface SidePanelHostOpenOptions<TComponent, TRef extends SidePanelActiveRef>
     readonly config: BaseSidePanelOpenOptions;
     readonly backdropClass?: string;
     readonly panelClass?: string;
-    readonly overlayWidth?: string | null;
+    readonly overlayWidth?: string | null | ((config: BaseSidePanelOpenOptions) => string | undefined);
     readonly overlaySize?: {
         width?: string;
         minWidth?: string;
@@ -334,6 +334,8 @@ declare class SettingsPanelService {
     private injector;
     private currentRef?;
     private currentPanelInstance?;
+    private currentScope?;
+    private childSequence;
     private readonly i18n;
     private readonly layerScale;
     constructor(baseSidePanelService: BaseSidePanelService, injector: Injector);
@@ -343,6 +345,11 @@ declare class SettingsPanelService {
      * same overlay when the provided id matches.
      */
     open(config: SettingsPanelConfig): SettingsPanelRef;
+    /**
+     * Opens an authoring editor above the current settings panel without
+     * destroying the parent editor and its draft state.
+     */
+    openChild(config: SettingsPanelConfig): SettingsPanelRef;
     private openFresh;
     close(reason?: SettingsPanelCloseReason): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<SettingsPanelService, never>;
@@ -424,6 +431,7 @@ declare class SettingsPanelComponent {
     resizable: boolean;
     persistSizeKey?: string;
     expanded: boolean;
+    interactionActive: boolean;
     ref: SettingsPanelRef;
     contentRef?: ComponentRef<any>;
     private static nextId;
@@ -448,6 +456,7 @@ declare class SettingsPanelComponent {
     get showResizeHandle(): boolean;
     get resizeHandleLabel(): string;
     get canSave(): boolean;
+    setInteractionActive(active: boolean): void;
     get disabledReason(): string;
     get applySaveDisabledReason(): string;
     get showStatusMessage(): boolean;