@ng-prism/core 22.6.0 → 22.7.0-beta.0

package/dist/app/panels/panel-host/panel-badge.js

@@ -1,4 +1,3 @@
-import { deriveA11ySummary } from '../a11y/a11y-summary.js';
 /**
  * The badge a panel's tab carries, if any.
  *
@@ -18,18 +17,64 @@ export function resolvePanelBadge(panel, component, context) {
         return component ? panel.badge(component) : null;
     }
     if (panel.id === 'controls') {
-        return context.inputCount > 0 ? { text: String(context.inputCount), variant: 'default' } : null;
+        return countBadge(context.inputCount, 'input');
+    }
+    if (panel.id === 'events') {
+        return countBadge(context.eventCount, 'event');
     }
     if (panel.id === 'a11y') {
-        // `=== null` rather than a falsy check: a score of 0 is a real, and the
-        // most urgent, thing to show.
-        const result = context.a11yResult;
-        if (result === null)
-            return null;
-        return {
-            text: String(result.score),
-            variant: deriveA11ySummary(result, context.a11yThresholds).variant
-        };
+        return a11yViolationBadge(context.a11yResult);
     }
     return null;
 }
+const plural = (n, noun) => `${n} ${noun}${n === 1 ? '' : 's'}`;
+function countBadge(n, noun) {
+    return n > 0 ? { kind: 'count', text: String(n), label: plural(n, noun) } : null;
+}
+/**
+ * Reads a badge the way the tab bar renders it, including badges written
+ * before 22.7 that only set `variant`.
+ */
+export function normalizePanelBadge(badge) {
+    if (badge === null)
+        return null;
+    if (!badge.kind && badge.variant === 'ok')
+        return null;
+    const kind = badge.kind ?? (badge.variant === 'warn' || badge.variant === 'danger' ? 'issues' : 'count');
+    const label = badge.label ?? badge.text;
+    if (kind === 'count')
+        return { kind, text: badge.text, label };
+    if (badge.text === '0')
+        return null;
+    const legacyTone = badge.variant === 'warn' || badge.variant === 'danger' ? badge.variant : undefined;
+    return { kind, text: badge.text, tone: badge.tone ?? legacyTone ?? 'danger', label };
+}
+/**
+ * What to tell the author of a panel whose badge still sets `variant`, or
+ * `null` when it does not. The panel host logs it once per panel; the badge
+ * keeps rendering through {@link normalizePanelBadge} until 23.0.0.
+ */
+export function deprecatedBadgeVariantNotice(panelId, badge) {
+    if (badge?.variant === undefined)
+        return null;
+    return `The badge of panel "${panelId}" sets variant, which is deprecated since 22.7.0 and will be removed in 23.0.0. It is mapped to kind and tone until then; set those instead.`;
+}
+/**
+ * The a11y tab's badge, also shown on the Violations sub-tab: a number of open
+ * findings, not the score. The score is graded in the gauge, the sidebar and
+ * the panel. The tone follows the most severe violation, the same split the
+ * build gate draws.
+ */
+export function a11yViolationBadge(result) {
+    if (result === null)
+        return null;
+    const violations = result.critical + result.serious + result.moderate + result.minor;
+    if (violations === 0)
+        return null;
+    return {
+        kind: 'issues',
+        text: String(violations),
+        tone: result.critical + result.serious > 0 ? 'danger' : 'warn',
+        label: plural(violations, 'violation')
+    };
+}

package/dist/app/panels/panel-host/prism-panel-host.component.d.ts

@@ -1,6 +1,7 @@
 import { EnvironmentInjector, type Type } from '@angular/core';
 import type { PanelDefinition } from '../../../plugin/plugin.types.js';
 import { PrismPanelService } from '../../services/prism-panel.service.js';
+import { type PrismTabItem } from '../../shared/prism-tabs.component.js';
 import * as i0 from "@angular/core";
 type RenderedPanelEntry = {
     id: string;
@@ -24,7 +25,9 @@ export declare class PrismPanelHostComponent {
      */
     private readonly a11yThresholds;
     private readonly inputCount;
-    protected panelBadge(panel: PanelDefinition): import("../../../plugin/plugin.types.js").PanelBadge | null;
+    private readonly eventLog;
+    private panelBadge;
+    protected readonly tabItems: import("@angular/core").Signal<PrismTabItem[]>;
     private readonly builtInPanels;
     protected readonly allPanels: import("@angular/core").Signal<PanelDefinition[]>;
     protected readonly panelInputs: import("@angular/core").Signal<{

package/dist/app/panels/panel-host/prism-panel-host.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"prism-panel-host.component.d.ts","sourceRoot":"","sources":["../../../../src/app/panels/panel-host/prism-panel-host.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAwD,mBAAmB,EAAkB,KAAK,IAAI,EAAa,MAAM,eAAe,CAAC;AAChJ,OAAO,KAAK,EAAiB,eAAe,EAAmB,MAAM,iCAAiC,CAAC;AAGvG,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;;AAU1E,KAAK,kBAAkB,GAAG;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;IACzB,QAAQ,EAAE,mBAAmB,GAAG,IAAI,CAAC;IACrC,SAAS,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,qBAQa,uBAAuB;IAChC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA8B;IAC5D,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAkC;IACtD,SAAS,CAAC,QAAQ,CAAC,YAAY,oBAA6B;IAC5D,SAAS,CAAC,QAAQ,CAAC,WAAW,sBAA+B;IAC7D,OAAO,CAAC,QAAQ,CAAC,YAAY,CAA4B;IACzD,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAgC;IAChE,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAA2C;IACpE,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAuC;IAE9D;;;;OAIG;IACH,OAAO,CAAC,QAAQ,CAAC,cAAc,CAO5B;IAEH,OAAO,CAAC,QAAQ,CAAC,UAAU,CAIxB;IAEH,SAAS,CAAC,UAAU,CAAC,KAAK,EAAE,eAAe;IAQ3C,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAkB;IAEhD,SAAS,CAAC,QAAQ,CAAC,SAAS,oDAMzB;IAEH,SAAS,CAAC,QAAQ,CAAC,WAAW;;OAE1B;IAEJ,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAoC;IAE9D,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAsD;IACrF,SAAS,CAAC,QAAQ,CAAC,mBAAmB,uDAA8D;;IAwCpG,OAAO,CAAC,iBAAiB;IAwBzB,OAAO,CAAC,gBAAgB;IAYxB,OAAO,CAAC,mBAAmB;yCAnIlB,uBAAuB;2CAAvB,uBAAuB;CAuJnC"}
+{"version":3,"file":"prism-panel-host.component.d.ts","sourceRoot":"","sources":["../../../../src/app/panels/panel-host/prism-panel-host.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAwD,mBAAmB,EAAkB,KAAK,IAAI,EAAa,MAAM,eAAe,CAAC;AAChJ,OAAO,KAAK,EAAiB,eAAe,EAAmB,MAAM,iCAAiC,CAAC;AAGvG,OAAO,EAAE,iBAAiB,EAAE,MAAM,uCAAuC,CAAC;AAG1E,OAAO,EAAE,KAAK,YAAY,EAAsB,MAAM,sCAAsC,CAAC;;AAY7F,KAAK,kBAAkB,GAAG;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,SAAS,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;IACzB,QAAQ,EAAE,mBAAmB,GAAG,IAAI,CAAC;IACrC,SAAS,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,qBAQa,uBAAuB;IAChC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA8B;IAC5D,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAkC;IACtD,SAAS,CAAC,QAAQ,CAAC,YAAY,oBAA6B;IAC5D,SAAS,CAAC,QAAQ,CAAC,WAAW,sBAA+B;IAC7D,OAAO,CAAC,QAAQ,CAAC,YAAY,CAA4B;IACzD,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAgC;IAChE,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAA2C;IACpE,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAuC;IAE9D;;;;OAIG;IACH,OAAO,CAAC,QAAQ,CAAC,cAAc,CAO5B;IAEH,OAAO,CAAC,QAAQ,CAAC,UAAU,CAIxB;IAEH,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAgC;IAEzD,OAAO,CAAC,UAAU;IAgBlB,SAAS,CAAC,QAAQ,CAAC,QAAQ,iDAEzB;IAEF,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAkB;IAEhD,SAAS,CAAC,QAAQ,CAAC,SAAS,oDAE1B;IAEF,SAAS,CAAC,QAAQ,CAAC,WAAW;;OAE1B;IAEJ,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAoC;IAE9D,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAsD;IACrF,SAAS,CAAC,QAAQ,CAAC,mBAAmB,uDAA8D;;IAwCpG,OAAO,CAAC,iBAAiB;IAwBzB,OAAO,CAAC,gBAAgB;IAYxB,OAAO,CAAC,mBAAmB;yCA7IlB,uBAAuB;2CAAvB,uBAAuB;CAiKnC"}

package/dist/app/panels/panel-host/prism-panel-host.component.js

@@ -1,73 +1,35 @@
 import { NgComponentOutlet } from '@angular/common';
 import { ChangeDetectionStrategy, Component, computed, effect, EnvironmentInjector, inject, signal, untracked } from '@angular/core';
-import { PrismIconComponent } from '../../icons/prism-icon.component.js';
+import { PrismEventLogService } from '../../services/prism-event-log.service.js';
 import { PrismNavigationService } from '../../services/prism-navigation.service.js';
 import { PrismPanelService } from '../../services/prism-panel.service.js';
 import { PrismPluginService } from '../../services/prism-plugin.service.js';
 import { PrismRendererService } from '../../services/prism-renderer.service.js';
+import { PrismTabsComponent } from '../../shared/prism-tabs.component.js';
 import { PRISM_CONFIG, PRISM_MANIFEST } from '../../tokens/prism-tokens.js';
 import { A11yAuditService } from '../a11y/a11y-audit.service.js';
 import { resolveA11yThresholds } from '../a11y/a11y-thresholds.js';
 import { BUILTIN_PANELS } from '../builtin-panels.js';
-import { resolvePanelBadge } from './panel-badge.js';
+import { addonPanelsFor } from './addon-panels.js';
+import { deprecatedBadgeVariantNotice, normalizePanelBadge, resolvePanelBadge } from './panel-badge.js';
 import * as i0 from "@angular/core";
 const _forTrack0 = ($index, $item) => $item.id;
-function PrismPanelHostComponent_For_3_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "prism-icon", 6);
-} if (rf & 2) {
-    const panel_r2 = i0.ɵɵnextContext().$implicit;
-    i0.ɵɵproperty("name", panel_r2.icon)("size", 13);
-} }
-function PrismPanelHostComponent_For_3_Conditional_3_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 8);
-    i0.ɵɵtext(1);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const badge_r4 = i0.ɵɵnextContext();
-    i0.ɵɵclassProp("warn", badge_r4.variant === "warn")("danger", badge_r4.variant === "danger");
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(badge_r4.text);
-} }
-function PrismPanelHostComponent_For_3_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, PrismPanelHostComponent_For_3_Conditional_3_Conditional_0_Template, 2, 5, "span", 7);
-} if (rf & 2) {
-    i0.ɵɵconditional(ctx.variant !== "ok" ? 0 : -1);
-} }
-function PrismPanelHostComponent_For_3_Template(rf, ctx) { if (rf & 1) {
-    const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 5);
-    i0.ɵɵlistener("click", function PrismPanelHostComponent_For_3_Template_button_click_0_listener() { const panel_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.panelService.activePanelId.set(panel_r2.id)); });
-    i0.ɵɵconditionalCreate(1, PrismPanelHostComponent_For_3_Conditional_1_Template, 1, 2, "prism-icon", 6);
-    i0.ɵɵtext(2);
-    i0.ɵɵconditionalCreate(3, PrismPanelHostComponent_For_3_Conditional_3_Template, 1, 1);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    let tmp_15_0;
-    const panel_r2 = ctx.$implicit;
-    const ctx_r2 = i0.ɵɵnextContext();
-    i0.ɵɵclassProp("p-tab--active", ctx_r2.panelService.activePanelId() === panel_r2.id);
-    i0.ɵɵattribute("aria-selected", ctx_r2.panelService.activePanelId() === panel_r2.id)("aria-controls", ctx_r2.panelService.activePanelId() === panel_r2.id ? "panel-" + panel_r2.id : null);
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(panel_r2.icon ? 1 : -1);
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", panel_r2.label, " ");
-    i0.ɵɵadvance();
-    i0.ɵɵconditional((tmp_15_0 = ctx_r2.panelBadge(panel_r2)) ? 3 : -1, tmp_15_0);
-} }
-function PrismPanelHostComponent_For_6_ng_container_1_Template(rf, ctx) { if (rf & 1) {
+function PrismPanelHostComponent_For_5_ng_container_1_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0);
 } }
-function PrismPanelHostComponent_For_6_Template(rf, ctx) { if (rf & 1) {
+function PrismPanelHostComponent_For_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 4);
-    i0.ɵɵtemplate(1, PrismPanelHostComponent_For_6_ng_container_1_Template, 1, 0, "ng-container", 9);
+    i0.ɵɵtemplate(1, PrismPanelHostComponent_For_5_ng_container_1_Template, 1, 0, "ng-container", 5);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const entry_r5 = ctx.$implicit;
-    const ctx_r2 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("hidden", entry_r5.id !== ctx_r2.panelService.activePanelId());
+    const entry_r1 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("hidden", entry_r1.id !== ctx_r1.panelService.activePanelId());
     i0.ɵɵadvance();
-    i0.ɵɵproperty("ngComponentOutlet", entry_r5.component)("ngComponentOutletInputs", ctx_r2.panelInputs())("ngComponentOutletInjector", entry_r5.injector ?? ctx_r2.envInjector);
+    i0.ɵɵproperty("ngComponentOutlet", entry_r1.component)("ngComponentOutletInputs", ctx_r1.panelInputs())("ngComponentOutletInjector", entry_r1.injector ?? ctx_r1.envInjector);
 } }
+/** Panels whose badge still sets `variant`, warned about once per page load. */
+const warnedVariantBadges = new Set();
 export class PrismPanelHostComponent {
     pluginService = inject(PrismPluginService);
     nav = inject(PrismNavigationService);
@@ -95,21 +57,25 @@ export class PrismPanelHostComponent {
         return comp?.meta.inputs.length ?? 0;
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "inputCount" }] : /* istanbul ignore next */ []));
+    eventLog = inject(PrismEventLogService);
     panelBadge(panel) {
-        return resolvePanelBadge(panel, this.nav.activeComponent(), {
+        const badge = resolvePanelBadge(panel, this.nav.activeComponent(), {
             inputCount: this.inputCount(),
+            eventCount: this.eventLog.events().length,
             a11yResult: this.auditService.scoreResult(),
             a11yThresholds: this.a11yThresholds()
         });
+        const notice = deprecatedBadgeVariantNotice(panel.id, badge);
+        if (notice && !warnedVariantBadges.has(panel.id)) {
+            warnedVariantBadges.add(panel.id);
+            console.warn(`[ng-prism] ${notice}`);
+        }
+        return normalizePanelBadge(badge);
     }
+    tabItems = computed(() => this.allPanels().map((panel) => ({ id: panel.id, label: panel.label, icon: panel.icon, badge: this.panelBadge(panel) })), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "tabItems" }] : /* istanbul ignore next */ []));
     builtInPanels = BUILTIN_PANELS;
-    allPanels = computed(() => {
-        const comp = this.nav.activeComponent();
-        const panels = [...this.builtInPanels.filter((p) => p.placement !== 'view'), ...this.pluginService.addonPanels()];
-        if (!comp)
-            return panels;
-        return panels.filter((p) => !p.isVisible || p.isVisible(comp));
-    }, /* @ts-ignore */
+    allPanels = computed(() => addonPanelsFor([...this.builtInPanels.filter((p) => p.placement !== 'view'), ...this.pluginService.addonPanels()], this.nav.activeComponent()), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "allPanels" }] : /* istanbul ignore next */ []));
     panelInputs = computed(() => ({
         activeComponent: this.nav.activeComponent()
@@ -199,24 +165,24 @@ export class PrismPanelHostComponent {
             this.renderedPanels.set(next);
     }
     static ɵfac = function PrismPanelHostComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PrismPanelHostComponent)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PrismPanelHostComponent, selectors: [["prism-panel-host"]], decls: 7, vars: 1, consts: [[1, "panel"], ["role", "tablist", 1, "panel-tabs"], ["role", "tab", 1, "p-tab", 3, "p-tab--active"], ["role", "tabpanel", 1, "panel-body", 3, "id"], [1, "panel-pane", 3, "hidden"], ["role", "tab", 1, "p-tab", 3, "click"], [3, "name", "size"], [1, "p-tab-badge", 3, "warn", "danger"], [1, "p-tab-badge"], [4, "ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector"]], template: function PrismPanelHostComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "div", 0)(1, "nav", 1);
-            i0.ɵɵrepeaterCreate(2, PrismPanelHostComponent_For_3_Template, 4, 7, "button", 2, _forTrack0);
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(4, "div", 3);
-            i0.ɵɵrepeaterCreate(5, PrismPanelHostComponent_For_6_Template, 2, 4, "div", 4, _forTrack0);
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PrismPanelHostComponent, selectors: [["prism-panel-host"]], decls: 6, vars: 3, consts: [[1, "panel"], [1, "panel-tabs"], ["ariaLabel", "Panels", "panelIdPrefix", "panel-", 3, "activeChange", "items", "active"], ["role", "tabpanel", 1, "panel-body", 3, "id"], [1, "panel-pane", 3, "hidden"], [4, "ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector"]], template: function PrismPanelHostComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "prism-tabs", 2);
+            i0.ɵɵlistener("activeChange", function PrismPanelHostComponent_Template_prism_tabs_activeChange_2_listener($event) { return $event && ctx.panelService.activePanelId.set($event); });
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(3, "div", 3);
+            i0.ɵɵrepeaterCreate(4, PrismPanelHostComponent_For_5_Template, 2, 4, "div", 4, _forTrack0);
             i0.ɵɵelementEnd()();
         } if (rf & 2) {
             i0.ɵɵadvance(2);
-            i0.ɵɵrepeater(ctx.allPanels());
-            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("items", ctx.tabItems())("active", ctx.panelService.activePanelId());
+            i0.ɵɵadvance();
             i0.ɵɵproperty("id", "panel-" + ctx.panelService.activePanelId());
             i0.ɵɵadvance();
             i0.ɵɵrepeater(ctx.renderedPanelsArray());
-        } }, dependencies: [NgComponentOutlet, PrismIconComponent], styles: [".panel[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0;\n    overflow: hidden;\n    background: var(--%NS%prism-bg-elevated);\n    border-top: 1px solid var(--%NS%prism-border);\n}\n\n.panel-tabs[_ngcontent-%COMP%] {\n    display: flex;\n    flex-shrink: 0;\n    gap: 2px;\n    align-items: center;\n    height: 40px;\n    padding: 0 16px;\n    overflow-x: auto;\n    scrollbar-width: none;\n    background: var(--%NS%prism-bg);\n    border-bottom: 1px solid var(--%NS%prism-border);\n}\n\n.panel-tabs[_ngcontent-%COMP%]::-webkit-scrollbar {\n    display: none;\n}\n\n.p-tab[_ngcontent-%COMP%] {\n    position: relative;\n    display: flex;\n    gap: 7px;\n    align-items: center;\n    height: 100%;\n    padding: 0 12px;\n    font-family: var(--%NS%font-sans);\n    font-size: var(--%NS%fs-md);\n    font-weight: 500;\n    color: var(--%NS%prism-text-muted);\n    white-space: nowrap;\n    cursor: pointer;\n    background: none;\n    border: none;\n    transition: color var(--%NS%dur-fast);\n}\n\n.p-tab[_ngcontent-%COMP%]:hover {\n    color: var(--%NS%prism-text-2);\n}\n\n.p-tab--active[_ngcontent-%COMP%] {\n    color: var(--%NS%prism-text);\n}\n\n.p-tab--%NS%active[_ngcontent-%COMP%]::after {\n    position: absolute;\n    right: 8px;\n    bottom: -1px;\n    left: 8px;\n    height: 2px;\n    content: '';\n    background: linear-gradient(90deg, var(--%NS%prism-primary-from), var(--%NS%prism-primary-to));\n    border-radius: 1px;\n}\n\n.p-tab-badge[_ngcontent-%COMP%] {\n    display: grid;\n    place-items: center;\n    min-width: 16px;\n    height: 16px;\n    padding: 0 5px;\n    font-family: var(--%NS%font-mono);\n    font-size: 10px;\n    font-weight: 700;\n    color: var(--%NS%prism-primary);\n    background: color-mix(in srgb, var(--%NS%prism-primary) 18%, transparent);\n    border-radius: 8px;\n}\n\n.p-tab-badge.warn[_ngcontent-%COMP%] {\n    color: var(--%NS%prism-warn);\n    background: color-mix(in srgb, var(--%NS%prism-warn) 18%, transparent);\n}\n\n.p-tab-badge.danger[_ngcontent-%COMP%] {\n    color: var(--%NS%prism-danger);\n    background: color-mix(in srgb, var(--%NS%prism-danger) 18%, transparent);\n}\n\n.panel-tabs-right[_ngcontent-%COMP%] {\n    display: flex;\n    gap: 4px;\n    align-items: center;\n    padding-left: 10px;\n    margin-left: auto;\n}\n\n.icon-btn[_ngcontent-%COMP%] {\n    display: grid;\n    place-items: center;\n    width: 28px;\n    height: 28px;\n    color: var(--%NS%prism-text-muted);\n    cursor: pointer;\n    background: none;\n    border: none;\n    border-radius: var(--%NS%radius-sm);\n    transition: all var(--%NS%dur-fast);\n}\n\n.icon-btn[_ngcontent-%COMP%]:hover {\n    color: var(--%NS%prism-text);\n    background: var(--%NS%prism-input-bg);\n}\n\n.panel-body[_ngcontent-%COMP%] {\n    flex: 1;\n    min-height: 0;\n    overflow: auto;\n    background: var(--%NS%prism-bg-elevated);\n}\n\n.panel-body[_ngcontent-%COMP%]::-webkit-scrollbar {\n    width: 8px;\n    height: 8px;\n}\n\n.panel-body[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n    background: var(--%NS%prism-border-strong);\n    border-radius: 4px;\n}\n\n.panel-pane[_ngcontent-%COMP%] {\n    height: 100%;\n}\n\n.panel-pane[hidden][_ngcontent-%COMP%] {\n    display: none;\n}\n\n[_ngcontent-%COMP%]:focus-visible {\n    outline: 2px solid var(--%NS%prism-primary);\n    outline-offset: 2px;\n}"] });
+        } }, dependencies: [NgComponentOutlet, PrismTabsComponent], styles: [".panel[_ngcontent-%COMP%] {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0;\n    overflow: hidden;\n    background: var(--%NS%prism-bg-surface);\n    border-top: 1px solid var(--%NS%prism-border);\n}\n\n.panel-tabs[_ngcontent-%COMP%] {\n    display: flex;\n    flex-shrink: 0;\n    height: 38px;\n    padding: 0 12px;\n    background: var(--%NS%prism-bg);\n    border-bottom: 1px solid var(--%NS%prism-border);\n}\n\n.panel-body[_ngcontent-%COMP%] {\n    flex: 1;\n    min-height: 0;\n    overflow: auto;\n    background: var(--%NS%prism-bg-surface);\n}\n\n.panel-body[_ngcontent-%COMP%]::-webkit-scrollbar {\n    width: 8px;\n    height: 8px;\n}\n\n.panel-body[_ngcontent-%COMP%]::-webkit-scrollbar-thumb {\n    background: var(--%NS%prism-border-strong);\n    border-radius: 4px;\n}\n\n.panel-pane[_ngcontent-%COMP%] {\n    height: 100%;\n}\n\n.panel-pane[hidden][_ngcontent-%COMP%] {\n    display: none;\n}\n\n[_ngcontent-%COMP%]:focus-visible {\n    outline: 2px solid var(--%NS%prism-primary);\n    outline-offset: 2px;\n}"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PrismPanelHostComponent, [{
         type: Component,
-        args: [{ selector: 'prism-panel-host', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgComponentOutlet, PrismIconComponent], template: "<div class=\"panel\">\n    <nav\n        class=\"panel-tabs\"\n        role=\"tablist\">\n        @for (panel of allPanels(); track panel.id) {\n            <button\n                class=\"p-tab\"\n                [class.p-tab--active]=\"panelService.activePanelId() === panel.id\"\n                (click)=\"panelService.activePanelId.set(panel.id)\"\n                role=\"tab\"\n                [attr.aria-selected]=\"panelService.activePanelId() === panel.id\"\n                [attr.aria-controls]=\"panelService.activePanelId() === panel.id ? 'panel-' + panel.id : null\">\n                @if (panel.icon) {\n                    <prism-icon\n                        [name]=\"panel.icon\"\n                        [size]=\"13\" />\n                }\n                {{ panel.label }}\n                @if (panelBadge(panel); as badge) {\n                    @if (badge.variant !== 'ok') {\n                        <span\n                            class=\"p-tab-badge\"\n                            [class.warn]=\"badge.variant === 'warn'\"\n                            [class.danger]=\"badge.variant === 'danger'\"\n                            >{{ badge.text }}</span\n                        >\n                    }\n                }\n            </button>\n        }\n    </nav>\n    <div\n        class=\"panel-body\"\n        [id]=\"'panel-' + panelService.activePanelId()\"\n        role=\"tabpanel\">\n        @for (entry of renderedPanelsArray(); track entry.id) {\n            <div\n                class=\"panel-pane\"\n                [hidden]=\"entry.id !== panelService.activePanelId()\">\n                <ng-container *ngComponentOutlet=\"entry.component; inputs: panelInputs(); injector: entry.injector ?? envInjector\" />\n            </div>\n        }\n    </div>\n</div>\n", styles: [".panel {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0;\n    overflow: hidden;\n    background: var(--prism-bg-elevated);\n    border-top: 1px solid var(--prism-border);\n}\n\n.panel-tabs {\n    display: flex;\n    flex-shrink: 0;\n    gap: 2px;\n    align-items: center;\n    height: 40px;\n    padding: 0 16px;\n    overflow-x: auto;\n    scrollbar-width: none;\n    background: var(--prism-bg);\n    border-bottom: 1px solid var(--prism-border);\n}\n\n.panel-tabs::-webkit-scrollbar {\n    display: none;\n}\n\n.p-tab {\n    position: relative;\n    display: flex;\n    gap: 7px;\n    align-items: center;\n    height: 100%;\n    padding: 0 12px;\n    font-family: var(--font-sans);\n    font-size: var(--fs-md);\n    font-weight: 500;\n    color: var(--prism-text-muted);\n    white-space: nowrap;\n    cursor: pointer;\n    background: none;\n    border: none;\n    transition: color var(--dur-fast);\n}\n\n.p-tab:hover {\n    color: var(--prism-text-2);\n}\n\n.p-tab--active {\n    color: var(--prism-text);\n}\n\n.p-tab--active::after {\n    position: absolute;\n    right: 8px;\n    bottom: -1px;\n    left: 8px;\n    height: 2px;\n    content: '';\n    background: linear-gradient(90deg, var(--prism-primary-from), var(--prism-primary-to));\n    border-radius: 1px;\n}\n\n.p-tab-badge {\n    display: grid;\n    place-items: center;\n    min-width: 16px;\n    height: 16px;\n    padding: 0 5px;\n    font-family: var(--font-mono);\n    font-size: 10px;\n    font-weight: 700;\n    color: var(--prism-primary);\n    background: color-mix(in srgb, var(--prism-primary) 18%, transparent);\n    border-radius: 8px;\n}\n\n.p-tab-badge.warn {\n    color: var(--prism-warn);\n    background: color-mix(in srgb, var(--prism-warn) 18%, transparent);\n}\n\n.p-tab-badge.danger {\n    color: var(--prism-danger);\n    background: color-mix(in srgb, var(--prism-danger) 18%, transparent);\n}\n\n.panel-tabs-right {\n    display: flex;\n    gap: 4px;\n    align-items: center;\n    padding-left: 10px;\n    margin-left: auto;\n}\n\n.icon-btn {\n    display: grid;\n    place-items: center;\n    width: 28px;\n    height: 28px;\n    color: var(--prism-text-muted);\n    cursor: pointer;\n    background: none;\n    border: none;\n    border-radius: var(--radius-sm);\n    transition: all var(--dur-fast);\n}\n\n.icon-btn:hover {\n    color: var(--prism-text);\n    background: var(--prism-input-bg);\n}\n\n.panel-body {\n    flex: 1;\n    min-height: 0;\n    overflow: auto;\n    background: var(--prism-bg-elevated);\n}\n\n.panel-body::-webkit-scrollbar {\n    width: 8px;\n    height: 8px;\n}\n\n.panel-body::-webkit-scrollbar-thumb {\n    background: var(--prism-border-strong);\n    border-radius: 4px;\n}\n\n.panel-pane {\n    height: 100%;\n}\n\n.panel-pane[hidden] {\n    display: none;\n}\n\n:focus-visible {\n    outline: 2px solid var(--prism-primary);\n    outline-offset: 2px;\n}\n"] }]
+        args: [{ selector: 'prism-panel-host', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgComponentOutlet, PrismTabsComponent], template: "<div class=\"panel\">\n    <div class=\"panel-tabs\">\n        <prism-tabs\n            ariaLabel=\"Panels\"\n            panelIdPrefix=\"panel-\"\n            [items]=\"tabItems()\"\n            [active]=\"panelService.activePanelId()\"\n            (activeChange)=\"$event && panelService.activePanelId.set($event)\" />\n    </div>\n    <div\n        class=\"panel-body\"\n        [id]=\"'panel-' + panelService.activePanelId()\"\n        role=\"tabpanel\">\n        @for (entry of renderedPanelsArray(); track entry.id) {\n            <div\n                class=\"panel-pane\"\n                [hidden]=\"entry.id !== panelService.activePanelId()\">\n                <ng-container *ngComponentOutlet=\"entry.component; inputs: panelInputs(); injector: entry.injector ?? envInjector\" />\n            </div>\n        }\n    </div>\n</div>\n", styles: [".panel {\n    display: flex;\n    flex-direction: column;\n    height: 100%;\n    min-height: 0;\n    overflow: hidden;\n    background: var(--prism-bg-surface);\n    border-top: 1px solid var(--prism-border);\n}\n\n.panel-tabs {\n    display: flex;\n    flex-shrink: 0;\n    height: 38px;\n    padding: 0 12px;\n    background: var(--prism-bg);\n    border-bottom: 1px solid var(--prism-border);\n}\n\n.panel-body {\n    flex: 1;\n    min-height: 0;\n    overflow: auto;\n    background: var(--prism-bg-surface);\n}\n\n.panel-body::-webkit-scrollbar {\n    width: 8px;\n    height: 8px;\n}\n\n.panel-body::-webkit-scrollbar-thumb {\n    background: var(--prism-border-strong);\n    border-radius: 4px;\n}\n\n.panel-pane {\n    height: 100%;\n}\n\n.panel-pane[hidden] {\n    display: none;\n}\n\n:focus-visible {\n    outline: 2px solid var(--prism-primary);\n    outline-offset: 2px;\n}\n"] }]
     }], () => [], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismPanelHostComponent, { className: "PrismPanelHostComponent", filePath: "app/panels/panel-host/prism-panel-host.component.ts", lineNumber: 31 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismPanelHostComponent, { className: "PrismPanelHostComponent", filePath: "app/panels/panel-host/prism-panel-host.component.ts", lineNumber: 36 }); })();

package/dist/app/renderer/composition.d.ts

@@ -0,0 +1,20 @@
+import type { Type } from '@angular/core';
+import type { CompositionCase, RuntimeComponent } from '../../plugin/plugin.types.js';
+/**
+ * The composition variant `variantIndex` renders in, `null` for a variant without one, which renders the class (or the
+ * `__PrismHost` of a directive) as before. Also `null` when the manifest has no wrapper to render the case in.
+ */
+export declare function activeCase(comp: RuntimeComponent, variantIndex: number): CompositionCase | null;
+/** The class to create for variant `variantIndex`: the composition wrapper for a composed variant, else `comp.type`. */
+export declare function renderTypeFor(comp: RuntimeComponent, variantIndex: number): Type<unknown>;
+/** What a render consists of: when two are the same, a variant switch sets the inputs on the instance instead of creating a new one. */
+export interface RenderSignature {
+    type: Type<unknown>;
+    /** `variantIndex` only for a composed variant: two composed variants are two renders even with equal inputs. */
+    variantIndex: number | null;
+    content: string | Record<string, string> | undefined;
+}
+export declare function renderSignature(comp: RuntimeComponent, variantIndex: number, content: RenderSignature['content']): RenderSignature;
+/** Whether `b` renders what `a` rendered, `a` being `null` while nothing is rendered. Content compares by identity. */
+export declare function sameRender(a: RenderSignature | null, b: RenderSignature): boolean;
+//# sourceMappingURL=composition.d.ts.map

package/dist/app/renderer/composition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"composition.d.ts","sourceRoot":"","sources":["../../../src/app/renderer/composition.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,KAAK,EAAE,eAAe,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEtF;;;GAGG;AACH,wBAAgB,UAAU,CAAC,IAAI,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,GAAG,eAAe,GAAG,IAAI,CAO/F;AAED,wHAAwH;AACxH,wBAAgB,aAAa,CAAC,IAAI,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC,OAAO,CAAC,CAEzF;AAED,wIAAwI;AACxI,MAAM,WAAW,eAAe;IAC5B,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;IACpB,gHAAgH;IAChH,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,OAAO,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,CAAC;CACxD;AAED,wBAAgB,eAAe,CAAC,IAAI,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,EAAE,OAAO,EAAE,eAAe,CAAC,SAAS,CAAC,GAAG,eAAe,CAMlI;AAED,uHAAuH;AACvH,wBAAgB,UAAU,CAAC,CAAC,EAAE,eAAe,GAAG,IAAI,EAAE,CAAC,EAAE,eAAe,GAAG,OAAO,CAEjF"}

package/dist/app/renderer/composition.js

@@ -0,0 +1,26 @@
+/**
+ * The composition variant `variantIndex` renders in, `null` for a variant without one, which renders the class (or the
+ * `__PrismHost` of a directive) as before. Also `null` when the manifest has no wrapper to render the case in.
+ */
+export function activeCase(comp, variantIndex) {
+    const composition = comp.meta.composition;
+    if (!composition || !comp.composition)
+        return null;
+    const caseIndex = composition.variantCases[variantIndex] ?? -1;
+    return caseIndex < 0 ? null : (composition.cases[caseIndex] ?? null);
+}
+/** The class to create for variant `variantIndex`: the composition wrapper for a composed variant, else `comp.type`. */
+export function renderTypeFor(comp, variantIndex) {
+    return activeCase(comp, variantIndex) && comp.composition ? comp.composition : comp.type;
+}
+export function renderSignature(comp, variantIndex, content) {
+    return {
+        type: renderTypeFor(comp, variantIndex),
+        variantIndex: activeCase(comp, variantIndex) ? variantIndex : null,
+        content
+    };
+}
+/** Whether `b` renders what `a` rendered, `a` being `null` while nothing is rendered. Content compares by identity. */
+export function sameRender(a, b) {
+    return a !== null && a.type === b.type && a.variantIndex === b.variantIndex && a.content === b.content;
+}

package/dist/app/renderer/input-bindings.d.ts

@@ -11,6 +11,18 @@ export declare const PRISM_CONTENT_INPUT = "__prismContent__";
  * component's aliased input maps to its alias. A directive renders inside the
  * generated `__PrismHost` wrapper, which declares the inputs under their member
  * names and binds the aliases itself.
+ *
+ * With `variantIndex`, a composed variant renders in the composition wrapper,
+ * which declares the inputs under their member names as well, and only those
+ * its case binds.
  */
-export declare function buildInputBindings(comp: RuntimeComponent): Map<string, string>;
+export declare function buildInputBindings(comp: RuntimeComponent, variantIndex?: number): Map<string, string>;
+/**
+ * What a composed variant leaves out of {@link buildInputBindings} on purpose:
+ * the inputs its case does not bind, and `__prismContent__`, which only the
+ * `__PrismHost` of a directive declares. A value for one of them is skipped
+ * without the warning about an unknown input. Empty for a variant without a
+ * composition.
+ */
+export declare function unboundInputs(comp: RuntimeComponent, variantIndex: number): ReadonlySet<string>;
 //# sourceMappingURL=input-bindings.d.ts.map

package/dist/app/renderer/input-bindings.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"input-bindings.d.ts","sourceRoot":"","sources":["../../../src/app/renderer/input-bindings.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAErE;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,qBAAqB,CAAC;AAEtD;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,gBAAgB,GAAG,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAQ9E"}
+{"version":3,"file":"input-bindings.d.ts","sourceRoot":"","sources":["../../../src/app/renderer/input-bindings.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAGrE;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,qBAAqB,CAAC;AAEtD;;;;;;;;;;GAUG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,EAAE,gBAAgB,EAAE,YAAY,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAgBrG;AAED;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,GAAG,WAAW,CAAC,MAAM,CAAC,CAI/F"}

package/dist/app/renderer/input-bindings.js

@@ -1,3 +1,4 @@
+import { activeCase } from './composition.js';
 /** Synthetic input the manifest generator emits on directive wrapper classes
  * to project per-variant `content` text into the host element. The directive
  * itself doesn't declare it, so it isn't in `meta.inputs`, and code that
@@ -10,8 +11,17 @@ export const PRISM_CONTENT_INPUT = '__prismContent__';
  * component's aliased input maps to its alias. A directive renders inside the
  * generated `__PrismHost` wrapper, which declares the inputs under their member
  * names and binds the aliases itself.
+ *
+ * With `variantIndex`, a composed variant renders in the composition wrapper,
+ * which declares the inputs under their member names as well, and only those
+ * its case binds.
  */
-export function buildInputBindings(comp) {
+export function buildInputBindings(comp, variantIndex) {
+    const composition = variantIndex === undefined ? null : activeCase(comp, variantIndex);
+    if (composition) {
+        const unbound = new Set(composition.unbound.map(({ name }) => name));
+        return new Map(comp.meta.inputs.filter(({ name }) => !unbound.has(name)).map(({ name }) => [name, name]));
+    }
     const isDirective = comp.meta.componentMeta.isDirective;
     const bindings = new Map(comp.meta.inputs.map((i) => [i.name, isDirective ? i.name : (i.alias ?? i.name)]));
     if (isDirective) {
@@ -19,3 +29,14 @@ export function buildInputBindings(comp) {
     }
     return bindings;
 }
+/**
+ * What a composed variant leaves out of {@link buildInputBindings} on purpose:
+ * the inputs its case does not bind, and `__prismContent__`, which only the
+ * `__PrismHost` of a directive declares. A value for one of them is skipped
+ * without the warning about an unknown input. Empty for a variant without a
+ * composition.
+ */
+export function unboundInputs(comp, variantIndex) {
+    const composition = activeCase(comp, variantIndex);
+    return new Set(composition ? [...composition.unbound.map(({ name }) => name), PRISM_CONTENT_INPUT] : []);
+}

package/dist/app/renderer/prism-renderer.component.d.ts

@@ -49,7 +49,8 @@ export declare class PrismRendererComponent {
     private readonly outlet;
     private componentRef;
     private outputSubscriptions;
-    private lastProjectedContent;
+    /** What the instance on the canvas renders, `null` without one: a variant switch to another render creates a new instance. */
+    private lastRender;
     private isRenderPage;
     private readonly overlayCache;
     readonly activeOverlay: import("@angular/core").WritableSignal<Type<unknown> | null>;
@@ -78,6 +79,12 @@ export declare class PrismRendererComponent {
     protected readonly overlayInjector: import("@angular/core").Signal<import("@angular/core").EnvironmentInjector | Injector>;
     constructor();
     private createComponent;
+    /**
+     * Sets `values` on the instance by the bindings of the variant. A key that
+     * names no input gets a warning, an input the composition of the variant
+     * leaves unbound is skipped without one.
+     */
+    private setInputs;
     private cleanup;
     static ɵfac: i0.ɵɵFactoryDeclaration<PrismRendererComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<PrismRendererComponent, "prism-renderer", never, {}, {}, never, never, true, never>;

package/dist/app/renderer/prism-renderer.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"prism-renderer.component.d.ts","sourceRoot":"","sources":["../../../src/app/renderer/prism-renderer.component.ts"],"names":[],"mappings":"AACA,OAAO,EASH,QAAQ,EAGR,KAAK,IAAI,EAIZ,MAAM,eAAe,CAAC;AAYvB,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACzE,OAAO,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAG3E,OAAO,EAAE,sBAAsB,EAAE,MAAM,yCAAyC,CAAC;AAIjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,qBAAqB,EAAE,MAAM,yCAAyC,CAAC;;AAOhF,qBASa,sBAAsB;IAC/B,SAAS,CAAC,QAAQ,CAAC,iBAAiB,yBAAkC;IACtE,SAAS,CAAC,QAAQ,CAAC,eAAe,uBAAgC;IAClE,SAAS,CAAC,QAAQ,CAAC,aAAa,qBAA8B;IAC9D,SAAS,CAAC,QAAQ,CAAC,OAAO,sBAA+B;IACzD,SAAS,CAAC,QAAQ,CAAC,SAAS,wBAAiC;IAC7D,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAmC;IAE/D;;;;;;;;;;;;OAYG;IACH,SAAS,CAAC,QAAQ,CAAC,aAAa,gDAAuF;IAEvH,SAAS,CAAC,QAAQ,CAAC,YAAY,OAAgB;IAC/C,SAAS,CAAC,QAAQ,CAAC,YAAY,QAAgB;IAE/C;;;;;;;OAOG;IACH,SAAS,CAAC,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAI/C,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAgC;IAChE,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAgC;IAChE,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAoB;IAC7C,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAsB;IACjD,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAmC;IACxD,OAAO,CAAC,QAAQ,CAAC,aAAa,CAE3B;IAEH,OAAO,CAAC,QAAQ,CAAC,YAAY,CAA6B;IAC1D,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA8B;IAC5D,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAmC;IAEhE,OAAO,CAAC,QAAQ,CAAC,MAAM,CAEpB;IACH,OAAO,CAAC,YAAY,CAAsC;IAC1D,OAAO,CAAC,mBAAmB,CAAsC;IACjE,OAAO,CAAC,oBAAoB,CAA0D;IACtF,OAAO,CAAC,YAAY,CAAS;IAE7B,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAoC;IACjE,QAAQ,CAAC,aAAa,+DAAsC;IAC5D;;;OAGG;IACH,SAAS,CAAC,QAAQ,CAAC,WAAW,gDAY3B;IACH;;;;OAIG;IACH,SAAS,CAAC,QAAQ,CAAC,cAAc,gDAE/B;IACF;;;;OAIG;IACH,SAAS,CAAC,QAAQ,CAAC,YAAY,gDAI5B;IACH,4GAA4G;IAC5G,SAAS,CAAC,QAAQ,CAAC,YAAY,4FAO5B;IACH,SAAS,CAAC,QAAQ,CAAC,aAAa;;MAA6C;IAC7E,SAAS,CAAC,QAAQ,CAAC,eAAe,yFAI/B;;IAmGH,OAAO,CAAC,eAAe;IAoFvB,OAAO,CAAC,OAAO;yCArSN,sBAAsB;2CAAtB,sBAAsB;CAoTlC"}
+{"version":3,"file":"prism-renderer.component.d.ts","sourceRoot":"","sources":["../../../src/app/renderer/prism-renderer.component.ts"],"names":[],"mappings":"AACA,OAAO,EASH,QAAQ,EAGR,KAAK,IAAI,EAIZ,MAAM,eAAe,CAAC;AAavB,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACzE,OAAO,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAG3E,OAAO,EAAE,sBAAsB,EAAE,MAAM,yCAAyC,CAAC;AAIjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,qBAAqB,EAAE,MAAM,yCAAyC,CAAC;;AAQhF,qBASa,sBAAsB;IAC/B,SAAS,CAAC,QAAQ,CAAC,iBAAiB,yBAAkC;IACtE,SAAS,CAAC,QAAQ,CAAC,eAAe,uBAAgC;IAClE,SAAS,CAAC,QAAQ,CAAC,aAAa,qBAA8B;IAC9D,SAAS,CAAC,QAAQ,CAAC,OAAO,sBAA+B;IACzD,SAAS,CAAC,QAAQ,CAAC,SAAS,wBAAiC;IAC7D,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAmC;IAE/D;;;;;;;;;;;;OAYG;IACH,SAAS,CAAC,QAAQ,CAAC,aAAa,gDAAuF;IAEvH,SAAS,CAAC,QAAQ,CAAC,YAAY,OAAgB;IAC/C,SAAS,CAAC,QAAQ,CAAC,YAAY,QAAgB;IAE/C;;;;;;;OAOG;IACH,SAAS,CAAC,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAI/C,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAgC;IAChE,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAgC;IAChE,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAoB;IAC7C,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAsB;IACjD,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAmC;IACxD,OAAO,CAAC,QAAQ,CAAC,aAAa,CAE3B;IAEH,OAAO,CAAC,QAAQ,CAAC,YAAY,CAA6B;IAC1D,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA8B;IAC5D,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAmC;IAEhE,OAAO,CAAC,QAAQ,CAAC,MAAM,CAEpB;IACH,OAAO,CAAC,YAAY,CAAsC;IAC1D,OAAO,CAAC,mBAAmB,CAAsC;IACjE,8HAA8H;IAC9H,OAAO,CAAC,UAAU,CAAgC;IAClD,OAAO,CAAC,YAAY,CAAS;IAE7B,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAoC;IACjE,QAAQ,CAAC,aAAa,+DAAsC;IAC5D;;;OAGG;IACH,SAAS,CAAC,QAAQ,CAAC,WAAW,gDAY3B;IACH;;;;OAIG;IACH,SAAS,CAAC,QAAQ,CAAC,cAAc,gDAE/B;IACF;;;;OAIG;IACH,SAAS,CAAC,QAAQ,CAAC,YAAY,gDAI5B;IACH,4GAA4G;IAC5G,SAAS,CAAC,QAAQ,CAAC,YAAY,4FAO5B;IACH,SAAS,CAAC,QAAQ,CAAC,aAAa;;MAA6C;IAC7E,SAAS,CAAC,QAAQ,CAAC,eAAe,yFAI/B;;IA0FH,OAAO,CAAC,eAAe;IAgFvB;;;;OAIG;IACH,OAAO,CAAC,SAAS;IAejB,OAAO,CAAC,OAAO;yCA7SN,sBAAsB;2CAAtB,sBAAsB;CA4TlC"}