@praxisui/core 9.0.6 → 9.0.7

package/ai/component-registry.json

@@ -1,8 +1,8 @@
 {
   "schemaVersion": "1.0.0",
-  "generatedAt": "2026-08-19T23:21:15.260Z",
+  "generatedAt": "2026-08-20T16:41:04.405Z",
   "packageName": "@praxisui/core",
-  "packageVersion": "9.0.6",
+  "packageVersion": "9.0.7",
   "sourceRegistry": "praxis-component-registry-ingestion",
   "sourceRegistryVersion": "1.0.0",
   "componentCount": 4,

package/fesm2022/praxisui-core.mjs

@@ -41705,8 +41705,25 @@ function providePraxisDynamicPageMetadata() {
     };
 }
 
+const SURFACE_HOST_I18N_NAMESPACE = 'surfaceHost';
+const SURFACE_HOST_I18N_CONFIG = {
+    namespaces: {
+        [SURFACE_HOST_I18N_NAMESPACE]: {
+            'pt-BR': {
+                'widget.error.title': 'Não foi possível carregar este conteúdo',
+                'widget.error.description': 'Este conteúdo está indisponível. Tente novamente. Se o problema continuar, informe o responsável pela plataforma.',
+            },
+            'en-US': {
+                'widget.error.title': 'This content could not be loaded',
+                'widget.error.description': 'This content is unavailable. Try again. If the problem continues, contact the platform owner.',
+            },
+        },
+    },
+};
+
 class PraxisSurfaceHostComponent {
     globalActions = inject(GlobalActionService);
+    i18n = inject(PraxisI18nService);
     title;
     subtitle;
     icon;
@@ -41729,25 +41746,43 @@ class PraxisSurfaceHostComponent {
     mainWidgetLoader;
     afterWidgetLoader;
     renderQueued = false;
+    widgetDiagnostics = signal({}, ...(ngDevMode ? [{ debugName: "widgetDiagnostics" }] : /* istanbul ignore next */ []));
     beforeWidgetKey = 'surface.before';
     mainWidgetKey = 'surface.main';
     afterWidgetKey = 'surface.after';
     operationIdentity() {
         const operation = normalizeSurfaceOperationContext(this.context?.['operation']);
-        return operation?.subject?.identity ?? operation?.taskScope?.identity ?? null;
+        return (operation?.subject?.identity ?? operation?.taskScope?.identity ?? null);
     }
     ngAfterViewInit() {
         this.scheduleWidgetRender();
     }
     ngOnChanges(changes) {
-        if (changes['widget']
-            || changes['beforeWidget']
-            || changes['afterWidget']
-            || changes['context']
-            || changes['strictValidation']) {
+        if (changes['widget'] ||
+            changes['beforeWidget'] ||
+            changes['afterWidget'] ||
+            changes['context'] ||
+            changes['strictValidation']) {
+            if (changes['widget'] ||
+                changes['beforeWidget'] ||
+                changes['afterWidget']) {
+                this.widgetDiagnostics.set({});
+            }
             this.scheduleWidgetRender();
         }
     }
+    t(key, fallback) {
+        return this.i18n.t(key, undefined, fallback, SURFACE_HOST_I18N_NAMESPACE);
+    }
+    hasWidgetError() {
+        return Object.values(this.widgetDiagnostics()).some((diagnostic) => diagnostic.phase !== 'ready');
+    }
+    onWidgetDiagnostic(widgetKey, diagnostic) {
+        this.widgetDiagnostics.update((current) => ({
+            ...current,
+            [widgetKey]: diagnostic,
+        }));
+    }
     scheduleWidgetRender() {
         if (this.renderQueued)
             return;
@@ -41860,7 +41895,8 @@ class PraxisSurfaceHostComponent {
         });
     }
     materializeSurfaceOutcome(event) {
-        const binding = this.lifecycle?.outcomes.find((candidate) => candidate.output === event.output && this.matchesLifecycleConditions(candidate, event.payload));
+        const binding = this.lifecycle?.outcomes.find((candidate) => candidate.output === event.output &&
+            this.matchesLifecycleConditions(candidate, event.payload));
         if (!binding)
             return;
         const runtime = this.context?.['surfaceRuntime'];
@@ -41945,7 +41981,9 @@ class PraxisSurfaceHostComponent {
         return text || null;
     }
     resourceIdOrNull(value) {
-        return typeof value === 'string' || typeof value === 'number' ? value : null;
+        return typeof value === 'string' || typeof value === 'number'
+            ? value
+            : null;
     }
     toResourceSurface(surface, resource) {
         const availability = this.readRecord(surface?.['availability']);
@@ -41953,14 +41991,20 @@ class PraxisSurfaceHostComponent {
             return null;
         }
         const id = this.stringOrNull(surface['id']);
-        const resourceKey = this.stringOrNull(surface['resourceKey'])
-            || this.stringOrNull(resource?.['resourceKey']);
+        const resourceKey = this.stringOrNull(surface['resourceKey']) ||
+            this.stringOrNull(resource?.['resourceKey']);
         const operationId = this.stringOrNull(surface['operationId']);
         const path = this.stringOrNull(surface['path']);
         const method = this.stringOrNull(surface['method']);
         const schemaId = this.stringOrNull(surface['schemaId']);
         const schemaUrl = this.stringOrNull(surface['schemaUrl']);
-        if (!id || !resourceKey || !operationId || !path || !method || !schemaId || !schemaUrl) {
+        if (!id ||
+            !resourceKey ||
+            !operationId ||
+            !path ||
+            !method ||
+            !schemaId ||
+            !schemaUrl) {
             return null;
         }
         return {
@@ -41984,12 +42028,16 @@ class PraxisSurfaceHostComponent {
         };
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PraxisSurfaceHostComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: PraxisSurfaceHostComponent, isStandalone: true, selector: "praxis-surface-host", inputs: { title: "title", subtitle: "subtitle", icon: "icon", beforeWidget: "beforeWidget", widget: "widget", afterWidget: "afterWidget", context: "context", lifecycle: "lifecycle", strictValidation: "strictValidation", renderTitleInsideBody: "renderTitleInsideBody" }, outputs: { widgetEvent: "widgetEvent", rowClick: "rowClick", selectionChange: "selectionChange", resourceEvent: "resourceEvent" }, viewQueries: [{ propertyName: "beforeWidgetLoader", first: true, predicate: ["beforeWidgetLoader"], descendants: true, read: DynamicWidgetLoaderDirective }, { propertyName: "mainWidgetLoader", first: true, predicate: ["mainWidgetLoader"], descendants: true, read: DynamicWidgetLoaderDirective }, { propertyName: "afterWidgetLoader", first: true, predicate: ["afterWidgetLoader"], descendants: true, read: DynamicWidgetLoaderDirective }], usesOnChanges: true, ngImport: i0, template: `
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: PraxisSurfaceHostComponent, isStandalone: true, selector: "praxis-surface-host", inputs: { title: "title", subtitle: "subtitle", icon: "icon", beforeWidget: "beforeWidget", widget: "widget", afterWidget: "afterWidget", context: "context", lifecycle: "lifecycle", strictValidation: "strictValidation", renderTitleInsideBody: "renderTitleInsideBody" }, outputs: { widgetEvent: "widgetEvent", rowClick: "rowClick", selectionChange: "selectionChange", resourceEvent: "resourceEvent" }, providers: [providePraxisI18nConfig(SURFACE_HOST_I18N_CONFIG)], viewQueries: [{ propertyName: "beforeWidgetLoader", first: true, predicate: ["beforeWidgetLoader"], descendants: true, read: DynamicWidgetLoaderDirective }, { propertyName: "mainWidgetLoader", first: true, predicate: ["mainWidgetLoader"], descendants: true, read: DynamicWidgetLoaderDirective }, { propertyName: "afterWidgetLoader", first: true, predicate: ["afterWidgetLoader"], descendants: true, read: DynamicWidgetLoaderDirective }], usesOnChanges: true, ngImport: i0, template: `
     <div class="pdx-surface-host">
       @if (subtitle || (title && renderTitleInsideBody)) {
         <header class="pdx-surface-host__header">
           @if (icon) {
-            <span class="material-icons pdx-surface-host__icon" aria-hidden="true">{{ icon }}</span>
+            <span
+              class="material-icons pdx-surface-host__icon"
+              aria-hidden="true"
+              >{{ icon }}</span
+            >
           }
           <div class="pdx-surface-host__copy">
             @if (title && renderTitleInsideBody) {
@@ -42004,7 +42052,10 @@ class PraxisSurfaceHostComponent {
 
       <section class="pdx-surface-host__body">
         @if (operationIdentity(); as identity) {
-          <div class="pdx-surface-host__operation-context" data-testid="surface-operation-identity">
+          <div
+            class="pdx-surface-host__operation-context"
+            data-testid="surface-operation-identity"
+          >
             <praxis-resource-identity
               [identity]="identity"
               density="compact"
@@ -42013,6 +42064,32 @@ class PraxisSurfaceHostComponent {
           </div>
         }
 
+        @if (hasWidgetError()) {
+          <div
+            class="pdx-surface-host__error"
+            role="alert"
+            aria-live="assertive"
+            data-testid="surface-widget-error"
+          >
+            <span class="material-icons" aria-hidden="true">error_outline</span>
+            <div>
+              <h3>
+                {{
+                  t('widget.error.title', 'This content could not be loaded')
+                }}
+              </h3>
+              <p>
+                {{
+                  t(
+                    'widget.error.description',
+                    'This content is unavailable. Try again.'
+                  )
+                }}
+              </p>
+            </div>
+          </div>
+        }
+
         @if (beforeWidget) {
           <div class="pdx-surface-host__slot pdx-surface-host__slot--before">
             <ng-container
@@ -42023,6 +42100,7 @@ class PraxisSurfaceHostComponent {
               [strictValidation]="strictValidation"
               [autoWireOutputs]="true"
               (widgetEvent)="onSlotWidgetEvent(beforeWidgetKey, $event)"
+              (widgetDiagnostic)="onWidgetDiagnostic(beforeWidgetKey, $event)"
             ></ng-container>
           </div>
         }
@@ -42036,6 +42114,7 @@ class PraxisSurfaceHostComponent {
             [strictValidation]="strictValidation"
             [autoWireOutputs]="true"
             (widgetEvent)="onSlotWidgetEvent(mainWidgetKey, $event)"
+            (widgetDiagnostic)="onWidgetDiagnostic(mainWidgetKey, $event)"
           ></ng-container>
         }
 
@@ -42049,21 +42128,26 @@ class PraxisSurfaceHostComponent {
               [strictValidation]="strictValidation"
               [autoWireOutputs]="true"
               (widgetEvent)="onSlotWidgetEvent(afterWidgetKey, $event)"
+              (widgetDiagnostic)="onWidgetDiagnostic(afterWidgetKey, $event)"
             ></ng-container>
           </div>
         }
       </section>
     </div>
-  `, isInline: true, styles: [":host{display:block;min-width:0}.pdx-surface-host{display:grid;gap:16px;min-width:0}.pdx-surface-host__header{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}.pdx-surface-host__icon{font-size:20px;line-height:20px;color:var(--md-sys-color-primary, currentColor)}.pdx-surface-host__copy{display:grid;gap:4px;min-width:0}.pdx-surface-host__title,.pdx-surface-host__subtitle{margin:0}.pdx-surface-host__title{font-size:1rem;font-weight:600}.pdx-surface-host__subtitle{color:var(--md-sys-color-on-surface-variant, rgba(0, 0, 0, .64));font-size:.9375rem}.pdx-surface-host__body{display:grid;gap:16px;min-width:0}.pdx-surface-host__operation-context{min-width:0;padding:12px 14px;border-inline-start:3px solid var(--md-sys-color-primary, currentColor);border-radius:0 10px 10px 0;background:var(--md-sys-color-surface-container-low, transparent)}.pdx-surface-host__slot{min-width:0}\n"], dependencies: [{ kind: "directive", type: DynamicWidgetLoaderDirective, selector: "[dynamicWidgetLoader]", inputs: ["dynamicWidgetLoader", "ownerWidgetKey", "context", "strictValidation", "autoWireOutputs"], outputs: ["widgetEvent", "widgetDiagnostic"], exportAs: ["dynamicWidgetLoader"] }, { kind: "component", type: PraxisResourceIdentityComponent, selector: "praxis-resource-identity", inputs: ["identity", "emptyTitle", "density", "showMetadataLabels", "showKey", "showKeyLabel", "ariaLabel"] }] });
+  `, isInline: true, styles: [":host{display:block;min-width:0}.pdx-surface-host{display:grid;gap:16px;min-width:0}.pdx-surface-host__header{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}.pdx-surface-host__icon{font-size:20px;line-height:20px;color:var(--md-sys-color-primary, currentColor)}.pdx-surface-host__copy{display:grid;gap:4px;min-width:0}.pdx-surface-host__title,.pdx-surface-host__subtitle{margin:0}.pdx-surface-host__title{font-size:1rem;font-weight:600}.pdx-surface-host__subtitle{color:var(--md-sys-color-on-surface-variant, rgba(0, 0, 0, .64));font-size:.9375rem}.pdx-surface-host__body{display:grid;gap:16px;min-width:0}.pdx-surface-host__operation-context{min-width:0;padding:12px 14px;border-inline-start:3px solid var(--md-sys-color-primary, currentColor);border-radius:0 10px 10px 0;background:var(--md-sys-color-surface-container-low, transparent)}.pdx-surface-host__error{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:12px;min-width:0;padding:14px;border:1px solid var(--md-sys-color-error, #ba1a1a);border-radius:10px;color:var(--md-sys-color-on-error-container, #410002);background:var(--md-sys-color-error-container, #ffdad6)}.pdx-surface-host__error h3,.pdx-surface-host__error p{margin:0}.pdx-surface-host__error h3{font-size:.95rem;font-weight:700}.pdx-surface-host__error p{margin-top:3px;font-size:.875rem;line-height:1.4}.pdx-surface-host__slot{min-width:0}\n"], dependencies: [{ kind: "directive", type: DynamicWidgetLoaderDirective, selector: "[dynamicWidgetLoader]", inputs: ["dynamicWidgetLoader", "ownerWidgetKey", "context", "strictValidation", "autoWireOutputs"], outputs: ["widgetEvent", "widgetDiagnostic"], exportAs: ["dynamicWidgetLoader"] }, { kind: "component", type: PraxisResourceIdentityComponent, selector: "praxis-resource-identity", inputs: ["identity", "emptyTitle", "density", "showMetadataLabels", "showKey", "showKeyLabel", "ariaLabel"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PraxisSurfaceHostComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'praxis-surface-host', standalone: true, imports: [DynamicWidgetLoaderDirective, PraxisResourceIdentityComponent], template: `
+            args: [{ selector: 'praxis-surface-host', standalone: true, imports: [DynamicWidgetLoaderDirective, PraxisResourceIdentityComponent], providers: [providePraxisI18nConfig(SURFACE_HOST_I18N_CONFIG)], template: `
     <div class="pdx-surface-host">
       @if (subtitle || (title && renderTitleInsideBody)) {
         <header class="pdx-surface-host__header">
           @if (icon) {
-            <span class="material-icons pdx-surface-host__icon" aria-hidden="true">{{ icon }}</span>
+            <span
+              class="material-icons pdx-surface-host__icon"
+              aria-hidden="true"
+              >{{ icon }}</span
+            >
           }
           <div class="pdx-surface-host__copy">
             @if (title && renderTitleInsideBody) {
@@ -42078,7 +42162,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
 
       <section class="pdx-surface-host__body">
         @if (operationIdentity(); as identity) {
-          <div class="pdx-surface-host__operation-context" data-testid="surface-operation-identity">
+          <div
+            class="pdx-surface-host__operation-context"
+            data-testid="surface-operation-identity"
+          >
             <praxis-resource-identity
               [identity]="identity"
               density="compact"
@@ -42087,6 +42174,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
           </div>
         }
 
+        @if (hasWidgetError()) {
+          <div
+            class="pdx-surface-host__error"
+            role="alert"
+            aria-live="assertive"
+            data-testid="surface-widget-error"
+          >
+            <span class="material-icons" aria-hidden="true">error_outline</span>
+            <div>
+              <h3>
+                {{
+                  t('widget.error.title', 'This content could not be loaded')
+                }}
+              </h3>
+              <p>
+                {{
+                  t(
+                    'widget.error.description',
+                    'This content is unavailable. Try again.'
+                  )
+                }}
+              </p>
+            </div>
+          </div>
+        }
+
         @if (beforeWidget) {
           <div class="pdx-surface-host__slot pdx-surface-host__slot--before">
             <ng-container
@@ -42097,6 +42210,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
               [strictValidation]="strictValidation"
               [autoWireOutputs]="true"
               (widgetEvent)="onSlotWidgetEvent(beforeWidgetKey, $event)"
+              (widgetDiagnostic)="onWidgetDiagnostic(beforeWidgetKey, $event)"
             ></ng-container>
           </div>
         }
@@ -42110,6 +42224,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
             [strictValidation]="strictValidation"
             [autoWireOutputs]="true"
             (widgetEvent)="onSlotWidgetEvent(mainWidgetKey, $event)"
+            (widgetDiagnostic)="onWidgetDiagnostic(mainWidgetKey, $event)"
           ></ng-container>
         }
 
@@ -42123,12 +42238,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
               [strictValidation]="strictValidation"
               [autoWireOutputs]="true"
               (widgetEvent)="onSlotWidgetEvent(afterWidgetKey, $event)"
+              (widgetDiagnostic)="onWidgetDiagnostic(afterWidgetKey, $event)"
             ></ng-container>
           </div>
         }
       </section>
     </div>
-  `, styles: [":host{display:block;min-width:0}.pdx-surface-host{display:grid;gap:16px;min-width:0}.pdx-surface-host__header{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}.pdx-surface-host__icon{font-size:20px;line-height:20px;color:var(--md-sys-color-primary, currentColor)}.pdx-surface-host__copy{display:grid;gap:4px;min-width:0}.pdx-surface-host__title,.pdx-surface-host__subtitle{margin:0}.pdx-surface-host__title{font-size:1rem;font-weight:600}.pdx-surface-host__subtitle{color:var(--md-sys-color-on-surface-variant, rgba(0, 0, 0, .64));font-size:.9375rem}.pdx-surface-host__body{display:grid;gap:16px;min-width:0}.pdx-surface-host__operation-context{min-width:0;padding:12px 14px;border-inline-start:3px solid var(--md-sys-color-primary, currentColor);border-radius:0 10px 10px 0;background:var(--md-sys-color-surface-container-low, transparent)}.pdx-surface-host__slot{min-width:0}\n"] }]
+  `, styles: [":host{display:block;min-width:0}.pdx-surface-host{display:grid;gap:16px;min-width:0}.pdx-surface-host__header{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}.pdx-surface-host__icon{font-size:20px;line-height:20px;color:var(--md-sys-color-primary, currentColor)}.pdx-surface-host__copy{display:grid;gap:4px;min-width:0}.pdx-surface-host__title,.pdx-surface-host__subtitle{margin:0}.pdx-surface-host__title{font-size:1rem;font-weight:600}.pdx-surface-host__subtitle{color:var(--md-sys-color-on-surface-variant, rgba(0, 0, 0, .64));font-size:.9375rem}.pdx-surface-host__body{display:grid;gap:16px;min-width:0}.pdx-surface-host__operation-context{min-width:0;padding:12px 14px;border-inline-start:3px solid var(--md-sys-color-primary, currentColor);border-radius:0 10px 10px 0;background:var(--md-sys-color-surface-container-low, transparent)}.pdx-surface-host__error{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:12px;min-width:0;padding:14px;border:1px solid var(--md-sys-color-error, #ba1a1a);border-radius:10px;color:var(--md-sys-color-on-error-container, #410002);background:var(--md-sys-color-error-container, #ffdad6)}.pdx-surface-host__error h3,.pdx-surface-host__error p{margin:0}.pdx-surface-host__error h3{font-size:.95rem;font-weight:700}.pdx-surface-host__error p{margin-top:3px;font-size:.875rem;line-height:1.4}.pdx-surface-host__slot{min-width:0}\n"] }]
         }], propDecorators: { title: [{
                 type: Input
             }], subtitle: [{

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@praxisui/core",
-  "version": "9.0.6",
+  "version": "9.0.7",
   "description": "Core library for Praxis UI Workspace: types, tokens, services and utilities shared across @praxisui/* packages.",
   "peerDependencies": {
     "@angular/common": "^21.0.0",

package/types/praxisui-core.d.ts

@@ -16570,6 +16570,7 @@ declare function providePraxisDynamicPageMetadata(): Provider;
 
 declare class PraxisSurfaceHostComponent implements AfterViewInit, OnChanges {
     private readonly globalActions;
+    private readonly i18n;
     title?: string;
     subtitle?: string;
     icon?: string;
@@ -16592,12 +16593,16 @@ declare class PraxisSurfaceHostComponent implements AfterViewInit, OnChanges {
     private mainWidgetLoader?;
     private afterWidgetLoader?;
     private renderQueued;
+    private readonly widgetDiagnostics;
     readonly beforeWidgetKey = "surface.before";
     readonly mainWidgetKey = "surface.main";
     readonly afterWidgetKey = "surface.after";
     protected operationIdentity(): MaterializedResourceIdentity | null;
     ngAfterViewInit(): void;
     ngOnChanges(changes: SimpleChanges): void;
+    protected t(key: string, fallback: string): string;
+    protected hasWidgetError(): boolean;
+    onWidgetDiagnostic(widgetKey: string, diagnostic: WidgetResolutionDiagnostic): void;
     private scheduleWidgetRender;
     private renderLoader;
     private enrichWidget;