@ng-prism/core 22.0.1 → 22.1.1

package/dist/app/controls/json-control.component.d.ts

@@ -1,4 +1,6 @@
 import * as i0 from "@angular/core";
+export declare function highlightJson(json: unknown): string;
+export declare function stringifyForJsonControl(val: unknown): string;
 export declare class JsonControlComponent {
     readonly value: import("@angular/core").InputSignal<unknown>;
     readonly label: import("@angular/core").InputSignal<string>;
@@ -10,7 +12,6 @@ export declare class JsonControlComponent {
     private readonly preEl;
     readonly displayText: import("@angular/core").Signal<string>;
     readonly highlightedHtml: import("@angular/core").Signal<string>;
-    stringify(val: unknown): string;
     onInput(raw: string): void;
     syncScroll(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<JsonControlComponent, never>;

package/dist/app/controls/json-control.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"json-control.component.d.ts","sourceRoot":"","sources":["../../../src/app/controls/json-control.component.ts"],"names":[],"mappings":";AAyBA,qBAuFa,oBAAoB;IAC/B,QAAQ,CAAC,KAAK,+CAAwB;IACtC,QAAQ,CAAC,KAAK,8CAAa;IAC3B,QAAQ,CAAC,QAAQ,8CAAa;IAC9B,QAAQ,CAAC,WAAW,oDAAqB;IAEzC,QAAQ,CAAC,UAAU,kDAAiB;IACpC,QAAQ,CAAC,SAAS,wDAA+B;IAEjD,OAAO,CAAC,QAAQ,CAAC,UAAU,CACgC;IAC3D,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAkD;IAExE,QAAQ,CAAC,WAAW,yCAIjB;IAEH,QAAQ,CAAC,eAAe,yCAAqD;IAE7E,SAAS,CAAC,GAAG,EAAE,OAAO,GAAG,MAAM;IAQ/B,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAW1B,UAAU,IAAI,IAAI;yCAxCP,oBAAoB;2CAApB,oBAAoB;CAgDhC"}
+{"version":3,"file":"json-control.component.d.ts","sourceRoot":"","sources":["../../../src/app/controls/json-control.component.ts"],"names":[],"mappings":";AAWA,wBAAgB,aAAa,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM,CAanD;AAED,wBAAgB,uBAAuB,CAAC,GAAG,EAAE,OAAO,GAAG,MAAM,CAU5D;AAED,qBAuFa,oBAAoB;IAC/B,QAAQ,CAAC,KAAK,+CAAwB;IACtC,QAAQ,CAAC,KAAK,8CAAa;IAC3B,QAAQ,CAAC,QAAQ,8CAAa;IAC9B,QAAQ,CAAC,WAAW,oDAAqB;IAEzC,QAAQ,CAAC,UAAU,kDAAiB;IACpC,QAAQ,CAAC,SAAS,wDAA+B;IAEjD,OAAO,CAAC,QAAQ,CAAC,UAAU,CACgC;IAC3D,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAkD;IAExE,QAAQ,CAAC,WAAW,yCAIjB;IAEH,QAAQ,CAAC,eAAe,yCAAqD;IAE7E,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAW1B,UAAU,IAAI,IAAI;yCAhCP,oBAAoB;2CAApB,oBAAoB;CAwChC"}

package/dist/app/controls/json-control.component.js

@@ -7,7 +7,9 @@ function JsonControlComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(1, "Invalid JSON");
     i0.ɵɵdomElementEnd();
 } }
-function highlightJson(json) {
+export function highlightJson(json) {
+    if (typeof json !== 'string')
+        return '';
     return json.replace(/("(?:\\.|[^"\\])*")\s*(:)|("(?:\\.|[^"\\])*")|(true|false)|(null)|(-?\d+(?:\.\d+)?(?:[eE][+-]?\d+)?)/g, (match, key, colon, str, bool, nil, num) => {
         if (key && colon)
             return `<span class="jh-key">${key}</span>${colon}`;
@@ -22,6 +24,18 @@ function highlightJson(json) {
         return match;
     });
 }
+export function stringifyForJsonControl(val) {
+    try {
+        const serialized = JSON.stringify(val, null, 2);
+        // JSON.stringify returns `undefined` (the value, not a string) for
+        // `undefined`, functions, and symbols. Surface that as visible text so the
+        // textarea + highlighter never see a non-string.
+        return serialized ?? 'undefined';
+    }
+    catch {
+        return String(val);
+    }
+}
 export class JsonControlComponent {
     value = input(null, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
@@ -42,19 +56,11 @@ export class JsonControlComponent {
         const local = this.localText();
         if (local !== null)
             return local;
-        return this.stringify(this.value());
+        return stringifyForJsonControl(this.value());
     }, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "displayText" }] : /* istanbul ignore next */ []));
     highlightedHtml = computed(() => highlightJson(this.displayText()), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "highlightedHtml" }] : /* istanbul ignore next */ []));
-    stringify(val) {
-        try {
-            return JSON.stringify(val, null, 2);
-        }
-        catch {
-            return String(val);
-        }
-    }
     onInput(raw) {
         this.localText.set(raw);
         try {
@@ -121,4 +127,4 @@ export class JsonControlComponent {
     </div>
   `, styles: ["\n    .json-editor { flex: 1; min-width: 0; }\n\n    .json-overlay {\n      position: relative;\n      border: 1px solid var(--prism-border);\n      border-radius: var(--radius-sm);\n      overflow: hidden;\n      transition: border-color var(--dur-fast);\n    }\n    .json-overlay:focus-within {\n      border-color: var(--prism-primary);\n      box-shadow: 0 0 0 2px color-mix(in srgb, var(--prism-primary) 30%, transparent);\n    }\n\n    .json-pre, .json-input {\n      margin: 0;\n      padding: 4px 8px;\n      font-family: var(--font-mono);\n      font-size: 12px;\n      line-height: 1.4;\n      white-space: pre-wrap;\n      word-wrap: break-word;\n      tab-size: 2;\n    }\n\n    .json-pre {\n      min-height: 56px;\n      pointer-events: none;\n    }\n    .json-pre code { font-family: inherit; }\n\n    :host ::ng-deep .jh-key { color: var(--prism-code-attr); }\n    :host ::ng-deep .jh-string { color: var(--prism-code-str); }\n    :host ::ng-deep .jh-number { color: var(--prism-warn); }\n    :host ::ng-deep .jh-bool { color: var(--prism-primary); }\n    :host ::ng-deep .jh-null { color: var(--prism-text-ghost); }\n\n    .json-input {\n      position: absolute;\n      inset: 0;\n      width: 100%;\n      height: 100%;\n      background: transparent;\n      color: transparent;\n      caret-color: var(--prism-text);\n      border: none;\n      resize: none;\n      overflow: auto;\n      box-sizing: border-box;\n    }\n    .json-input:focus { outline: none; }\n    .json-input::selection { background: rgba(99, 102, 241, 0.3); }\n\n    .json-error {\n      font-size: 11px;\n      color: var(--prism-danger);\n      display: block;\n      margin-top: 2px;\n    }\n  "] }]
     }], null, { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], typeName: [{ type: i0.Input, args: [{ isSignal: true, alias: "typeName", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], textareaEl: [{ type: i0.ViewChild, args: ['textareaEl', { isSignal: true }] }], preEl: [{ type: i0.ViewChild, args: ['preEl', { isSignal: true }] }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(JsonControlComponent, { className: "JsonControlComponent", filePath: "app/controls/json-control.component.ts", lineNumber: 113 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(JsonControlComponent, { className: "JsonControlComponent", filePath: "app/controls/json-control.component.ts", lineNumber: 126 }); })();

package/dist/app/panels/controls/non-editable-input-types.d.ts

@@ -0,0 +1,3 @@
+import type { InputMeta } from '../../../plugin/plugin.types.js';
+export declare function isNonEditableInputType(input: InputMeta): boolean;
+//# sourceMappingURL=non-editable-input-types.d.ts.map

package/dist/app/panels/controls/non-editable-input-types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"non-editable-input-types.d.ts","sourceRoot":"","sources":["../../../../src/app/panels/controls/non-editable-input-types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAoBjE,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,SAAS,GAAG,OAAO,CAIhE"}

package/dist/app/panels/controls/non-editable-input-types.js

@@ -0,0 +1,20 @@
+/**
+ * Angular framework reference types that aren't meaningfully editable via
+ * a JSON textarea (they wrap live framework objects, not data). When a
+ * showcased component declares an input of one of these types, the controls
+ * panel renders a "Not editable" placeholder instead of routing it through
+ * the JsonControl — which would otherwise crash on `undefined`/non-serializable
+ * defaults and presents a misleading editor to the developer anyway.
+ */
+const NON_EDITABLE_TYPE_NAMES = [
+    'TemplateRef',
+    'ElementRef',
+    'ViewContainerRef',
+];
+const NON_EDITABLE_TYPE_PATTERN = new RegExp(`\\b(?:${NON_EDITABLE_TYPE_NAMES.join('|')})\\b`);
+export function isNonEditableInputType(input) {
+    const raw = input.rawType;
+    if (!raw)
+        return false;
+    return NON_EDITABLE_TYPE_PATTERN.test(raw);
+}

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

@@ -8,6 +8,7 @@ export declare class PrismControlsPanelComponent {
     private readonly pluginService;
     readonly activeComponent: import("@angular/core").InputSignal<RuntimeComponent | null>;
     protected getCustomControl(input: InputMeta): ControlDefinition | null;
+    protected isNonEditable(input: InputMeta): boolean;
     protected asBoolean(val: unknown): boolean;
     protected asNumber(val: unknown): number;
     protected asString(val: unknown): string;

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

@@ -1 +1 @@
-{"version":3,"file":"prism-controls-panel.component.d.ts","sourceRoot":"","sources":["../../../../src/app/panels/controls/prism-controls-panel.component.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EACV,iBAAiB,EACjB,SAAS,EACT,gBAAgB,EACjB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,sBAAsB,EAAE,MAAM,4CAA4C,CAAC;AAEpF,OAAO,EAAE,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;;AAEhF,qBA+La,2BAA2B;IACtC,SAAS,CAAC,QAAQ,CAAC,iBAAiB,yBAAkC;IACtE,SAAS,CAAC,QAAQ,CAAC,eAAe,uBAAgC;IAClE,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA8B;IAE5D,QAAQ,CAAC,eAAe,+DAAwC;IAEhE,SAAS,CAAC,gBAAgB,CAAC,KAAK,EAAE,SAAS,GAAG,iBAAiB,GAAG,IAAI;IAOtE,SAAS,CAAC,SAAS,CAAC,GAAG,EAAE,OAAO,GAAG,OAAO;IAI1C,SAAS,CAAC,QAAQ,CAAC,GAAG,EAAE,OAAO,GAAG,MAAM;IAIxC,SAAS,CAAC,QAAQ,CAAC,GAAG,EAAE,OAAO,GAAG,MAAM;yCAtB7B,2BAA2B;2CAA3B,2BAA2B;CAyBvC"}
+{"version":3,"file":"prism-controls-panel.component.d.ts","sourceRoot":"","sources":["../../../../src/app/panels/controls/prism-controls-panel.component.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EACV,iBAAiB,EACjB,SAAS,EACT,gBAAgB,EACjB,MAAM,iCAAiC,CAAC;AACzC,OAAO,EAAE,sBAAsB,EAAE,MAAM,4CAA4C,CAAC;AAEpF,OAAO,EAAE,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;;AAGhF,qBA2Ma,2BAA2B;IACtC,SAAS,CAAC,QAAQ,CAAC,iBAAiB,yBAAkC;IACtE,SAAS,CAAC,QAAQ,CAAC,eAAe,uBAAgC;IAClE,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA8B;IAE5D,QAAQ,CAAC,eAAe,+DAAwC;IAEhE,SAAS,CAAC,gBAAgB,CAAC,KAAK,EAAE,SAAS,GAAG,iBAAiB,GAAG,IAAI;IAOtE,SAAS,CAAC,aAAa,CAAC,KAAK,EAAE,SAAS,GAAG,OAAO;IAIlD,SAAS,CAAC,SAAS,CAAC,GAAG,EAAE,OAAO,GAAG,OAAO;IAI1C,SAAS,CAAC,QAAQ,CAAC,GAAG,EAAE,OAAO,GAAG,MAAM;IAIxC,SAAS,CAAC,QAAQ,CAAC,GAAG,EAAE,OAAO,GAAG,MAAM;yCA1B7B,2BAA2B;2CAA3B,2BAA2B;CA6BvC"}

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

@@ -1,5 +1,5 @@
 import { NgComponentOutlet } from '@angular/common';
-import { Component, inject, input, ChangeDetectionStrategy } from '@angular/core';
+import { Component, inject, input, ChangeDetectionStrategy, } from '@angular/core';
 import { BooleanControlComponent } from '../../controls/boolean-control.component.js';
 import { JsonControlComponent } from '../../controls/json-control.component.js';
 import { NumberControlComponent } from '../../controls/number-control.component.js';
@@ -8,6 +8,7 @@ import { UnionControlComponent } from '../../controls/union-control.component.js
 import { PrismNavigationService } from '../../services/prism-navigation.service.js';
 import { PrismPluginService } from '../../services/prism-plugin.service.js';
 import { PrismRendererService } from '../../services/prism-renderer.service.js';
+import { isNonEditableInputType } from './non-editable-input-types.js';
 import * as i0 from "@angular/core";
 const _c0 = (a0, a1) => ({ inputMeta: a0, rendererService: a1 });
 const _c1 = () => [];
@@ -37,56 +38,68 @@ function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_1_Template(
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("ngComponentOutlet", ctx.component)("ngComponentOutletInputs", i0.ɵɵpureFunction2(2, _c0, input_r4, ctx_r1.rendererService));
 } }
-function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_7_Template(rf, ctx) { if (rf & 1) {
+function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 13);
+    i0.ɵɵtext(1, "Not editable");
+    i0.ɵɵelementEnd();
+} }
+function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_0_Template(rf, ctx) { if (rf & 1) {
     const _r5 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "prism-boolean-control", 15);
-    i0.ɵɵlistener("valueChange", function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_7_Template_prism_boolean_control_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r5); const input_r4 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.rendererService.updateInput(input_r4.name, $event)); });
+    i0.ɵɵelementStart(0, "prism-boolean-control", 16);
+    i0.ɵɵlistener("valueChange", function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_0_Template_prism_boolean_control_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r5); const input_r4 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.rendererService.updateInput(input_r4.name, $event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const input_r4 = i0.ɵɵnextContext(2).$implicit;
+    const input_r4 = i0.ɵɵnextContext(3).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("value", ctx_r1.asBoolean(ctx_r1.rendererService.inputValues()[input_r4.name]));
 } }
-function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_8_Template(rf, ctx) { if (rf & 1) {
+function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_1_Template(rf, ctx) { if (rf & 1) {
     const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "prism-number-control", 15);
-    i0.ɵɵlistener("valueChange", function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_8_Template_prism_number_control_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r6); const input_r4 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.rendererService.updateInput(input_r4.name, $event)); });
+    i0.ɵɵelementStart(0, "prism-number-control", 16);
+    i0.ɵɵlistener("valueChange", function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_1_Template_prism_number_control_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r6); const input_r4 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.rendererService.updateInput(input_r4.name, $event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const input_r4 = i0.ɵɵnextContext(2).$implicit;
+    const input_r4 = i0.ɵɵnextContext(3).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("value", ctx_r1.asNumber(ctx_r1.rendererService.inputValues()[input_r4.name]));
 } }
-function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_9_Template(rf, ctx) { if (rf & 1) {
+function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_2_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "prism-union-control", 16);
-    i0.ɵɵlistener("valueChange", function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_9_Template_prism_union_control_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r7); const input_r4 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.rendererService.updateInput(input_r4.name, $event)); });
+    i0.ɵɵelementStart(0, "prism-union-control", 17);
+    i0.ɵɵlistener("valueChange", function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_2_Template_prism_union_control_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r7); const input_r4 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.rendererService.updateInput(input_r4.name, $event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const input_r4 = i0.ɵɵnextContext(2).$implicit;
+    const input_r4 = i0.ɵɵnextContext(3).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("value", ctx_r1.asString(ctx_r1.rendererService.inputValues()[input_r4.name]))("options", input_r4.values ?? i0.ɵɵpureFunction0(2, _c1));
 } }
-function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_10_Template(rf, ctx) { if (rf & 1) {
+function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_3_Template(rf, ctx) { if (rf & 1) {
     const _r8 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "prism-string-control", 15);
-    i0.ɵɵlistener("valueChange", function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_10_Template_prism_string_control_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r8); const input_r4 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.rendererService.updateInput(input_r4.name, $event)); });
+    i0.ɵɵelementStart(0, "prism-string-control", 16);
+    i0.ɵɵlistener("valueChange", function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_3_Template_prism_string_control_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r8); const input_r4 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.rendererService.updateInput(input_r4.name, $event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const input_r4 = i0.ɵɵnextContext(2).$implicit;
+    const input_r4 = i0.ɵɵnextContext(3).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("value", ctx_r1.asString(ctx_r1.rendererService.inputValues()[input_r4.name]));
 } }
-function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_11_Template(rf, ctx) { if (rf & 1) {
+function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_4_Template(rf, ctx) { if (rf & 1) {
     const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "prism-json-control", 15);
-    i0.ɵɵlistener("valueChange", function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_11_Template_prism_json_control_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r9); const input_r4 = i0.ɵɵnextContext(2).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.rendererService.updateInput(input_r4.name, $event)); });
+    i0.ɵɵelementStart(0, "prism-json-control", 16);
+    i0.ɵɵlistener("valueChange", function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_4_Template_prism_json_control_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r9); const input_r4 = i0.ɵɵnextContext(3).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.rendererService.updateInput(input_r4.name, $event)); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const input_r4 = i0.ɵɵnextContext(2).$implicit;
+    const input_r4 = i0.ɵɵnextContext(3).$implicit;
     const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵproperty("value", ctx_r1.rendererService.inputValues()[input_r4.name]);
 } }
+function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_0_Template, 1, 1, "prism-boolean-control", 14)(1, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_1_Template, 1, 1, "prism-number-control", 14)(2, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_2_Template, 1, 3, "prism-union-control", 15)(3, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_3_Template, 1, 1, "prism-string-control", 14)(4, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Case_4_Template, 1, 1, "prism-json-control", 14);
+} if (rf & 2) {
+    let tmp_14_0;
+    const input_r4 = i0.ɵɵnextContext(2).$implicit;
+    i0.ɵɵconditional((tmp_14_0 = input_r4.type) === "boolean" ? 0 : tmp_14_0 === "number" ? 1 : tmp_14_0 === "union" ? 2 : tmp_14_0 === "string" ? 3 : 4);
+} }
 function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 9)(1, "span", 10);
     i0.ɵɵtext(2);
@@ -95,21 +108,21 @@ function PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Template(
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd()()();
     i0.ɵɵelementStart(6, "div", 12);
-    i0.ɵɵconditionalCreate(7, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_7_Template, 1, 1, "prism-boolean-control", 13)(8, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_8_Template, 1, 1, "prism-number-control", 13)(9, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_9_Template, 1, 3, "prism-union-control", 14)(10, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_10_Template, 1, 1, "prism-string-control", 13)(11, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Case_11_Template, 1, 1, "prism-json-control", 13);
+    i0.ɵɵconditionalCreate(7, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_7_Template, 2, 0, "span", 13)(8, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Conditional_8_Template, 5, 1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    let tmp_15_0;
     const input_r4 = i0.ɵɵnextContext().$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(2);
     i0.ɵɵadvance(2);
     i0.ɵɵtextInterpolate(input_r4.name);
     i0.ɵɵadvance(3);
     i0.ɵɵtextInterpolate(input_r4.rawType ?? input_r4.type);
     i0.ɵɵadvance(2);
-    i0.ɵɵconditional((tmp_15_0 = input_r4.type) === "boolean" ? 7 : tmp_15_0 === "number" ? 8 : tmp_15_0 === "union" ? 9 : tmp_15_0 === "string" ? 10 : 11);
+    i0.ɵɵconditional(ctx_r1.isNonEditable(input_r4) ? 7 : 8);
 } }
 function PrismControlsPanelComponent_Conditional_0_For_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementStart(0, "div", 2);
-    i0.ɵɵconditionalCreate(1, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_1_Template, 1, 5, "ng-container", 8)(2, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Template, 12, 3);
+    i0.ɵɵconditionalCreate(1, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_1_Template, 1, 5, "ng-container", 8)(2, PrismControlsPanelComponent_Conditional_0_For_3_Conditional_2_Template, 9, 3);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     let tmp_12_0;
@@ -150,6 +163,9 @@ export class PrismControlsPanelComponent {
         return (this.pluginService.controls().find((ctrl) => ctrl.matchType(input)) ??
             null);
     }
+    isNonEditable(input) {
+        return isNonEditableInputType(input);
+    }
     asBoolean(val) {
         return Boolean(val);
     }
@@ -160,7 +176,7 @@ export class PrismControlsPanelComponent {
         return String(val ?? '');
     }
     static ɵfac = function PrismControlsPanelComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PrismControlsPanelComponent)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PrismControlsPanelComponent, selectors: [["prism-controls-panel"]], inputs: { activeComponent: [1, "activeComponent"] }, decls: 1, vars: 1, consts: [[1, "ctl-panel"], [1, "ctl-toolbar"], [1, "ctl-row"], [1, "ctl-empty"], [1, "ctl-dirty-info"], ["aria-hidden", "true", 1, "ctl-dirty-dot"], ["type", "button", "title", "Reset all inputs to variant defaults", 1, "ctl-reset-btn", 3, "click"], ["aria-hidden", "true"], [3, "ngComponentOutlet", "ngComponentOutletInputs"], [1, "ctl-label"], [1, "ctl-name"], [1, "ctl-type"], [1, "ctl-input"], [3, "value"], [3, "value", "options"], [3, "valueChange", "value"], [3, "valueChange", "value", "options"]], template: function PrismControlsPanelComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PrismControlsPanelComponent, selectors: [["prism-controls-panel"]], inputs: { activeComponent: [1, "activeComponent"] }, decls: 1, vars: 1, consts: [[1, "ctl-panel"], [1, "ctl-toolbar"], [1, "ctl-row"], [1, "ctl-empty"], [1, "ctl-dirty-info"], ["aria-hidden", "true", 1, "ctl-dirty-dot"], ["type", "button", "title", "Reset all inputs to variant defaults", 1, "ctl-reset-btn", 3, "click"], ["aria-hidden", "true"], [3, "ngComponentOutlet", "ngComponentOutletInputs"], [1, "ctl-label"], [1, "ctl-name"], [1, "ctl-type"], [1, "ctl-input"], ["title", "This input type can't be edited from the controls panel", 1, "ctl-not-editable"], [3, "value"], [3, "value", "options"], [3, "valueChange", "value"], [3, "valueChange", "value", "options"]], template: function PrismControlsPanelComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵconditionalCreate(0, PrismControlsPanelComponent_Conditional_0_Template, 5, 2, "div", 0);
         } if (rf & 2) {
             let tmp_0_0;
@@ -170,7 +186,7 @@ export class PrismControlsPanelComponent {
             StringControlComponent,
             NumberControlComponent,
             UnionControlComponent,
-            JsonControlComponent], styles: [".ctl-panel[_ngcontent-%COMP%] {\n      overflow-y: auto;\n      height: 100%;\n    }\n\n    .ctl-toolbar[_ngcontent-%COMP%] {\n      position: sticky;\n      top: 0;\n      z-index: 2;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 8px 20px;\n      background: var(--prism-bg-elevated);\n      border-bottom: 1px solid var(--prism-border);\n    }\n    .ctl-dirty-info[_ngcontent-%COMP%] {\n      font-size: 11.5px;\n      font-family: var(--font-mono);\n      color: var(--prism-text-muted);\n      display: inline-flex;\n      align-items: center;\n      gap: 6px;\n    }\n    .ctl-dirty-dot[_ngcontent-%COMP%] {\n      width: 6px;\n      height: 6px;\n      border-radius: 50%;\n      background: var(--prism-primary);\n      box-shadow: 0 0 6px color-mix(in srgb, var(--prism-primary) 60%, transparent);\n    }\n    .ctl-reset-btn[_ngcontent-%COMP%] {\n      height: 24px;\n      padding: 0 10px;\n      border-radius: 5px;\n      font-size: 11.5px;\n      font-weight: 500;\n      font-family: var(--font-sans);\n      color: var(--prism-text-muted);\n      background: transparent;\n      border: 1px solid var(--prism-border);\n      cursor: pointer;\n      display: inline-flex;\n      align-items: center;\n      gap: 5px;\n      transition: color var(--dur-fast), background var(--dur-fast), border-color var(--dur-fast);\n    }\n    .ctl-reset-btn[_ngcontent-%COMP%]:hover {\n      color: var(--prism-text);\n      border-color: color-mix(in srgb, var(--prism-primary) 40%, var(--prism-border));\n      background: color-mix(in srgb, var(--prism-primary) 8%, transparent);\n    }\n    .ctl-reset-btn[_ngcontent-%COMP%]:focus-visible {\n      outline: 2px solid var(--prism-primary);\n      outline-offset: 1px;\n    }\n\n    .ctl-row[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: 180px 1fr;\n      align-items: center;\n      gap: 12px;\n      padding: 8px 20px;\n      min-height: 40px;\n      border-bottom: 1px solid var(--prism-border);\n    }\n    .ctl-row[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--prism-primary) 3%, transparent);\n    }\n\n    .ctl-label[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      gap: 2px;\n    }\n    .ctl-name[_ngcontent-%COMP%] {\n      font-size: 13px;\n      color: var(--prism-text);\n      font-weight: 500;\n    }\n    .ctl-type[_ngcontent-%COMP%] {\n      font-family: var(--font-mono);\n      font-size: 10.5px;\n      color: var(--prism-text-ghost);\n    }\n    .ctl-type[_ngcontent-%COMP%]   b[_ngcontent-%COMP%] {\n      color: var(--prism-primary);\n      font-weight: 500;\n    }\n\n    .ctl-input[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      min-width: 0;\n    }\n\n    .ctl-empty[_ngcontent-%COMP%] {\n      color: var(--prism-text-ghost);\n      font-size: 13px;\n      margin: 0;\n      padding: 16px 20px;\n    }"] });
+            JsonControlComponent], styles: [".ctl-panel[_ngcontent-%COMP%] {\n      overflow-y: auto;\n      height: 100%;\n    }\n\n    .ctl-toolbar[_ngcontent-%COMP%] {\n      position: sticky;\n      top: 0;\n      z-index: 2;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 8px 20px;\n      background: var(--prism-bg-elevated);\n      border-bottom: 1px solid var(--prism-border);\n    }\n    .ctl-dirty-info[_ngcontent-%COMP%] {\n      font-size: 11.5px;\n      font-family: var(--font-mono);\n      color: var(--prism-text-muted);\n      display: inline-flex;\n      align-items: center;\n      gap: 6px;\n    }\n    .ctl-dirty-dot[_ngcontent-%COMP%] {\n      width: 6px;\n      height: 6px;\n      border-radius: 50%;\n      background: var(--prism-primary);\n      box-shadow: 0 0 6px color-mix(in srgb, var(--prism-primary) 60%, transparent);\n    }\n    .ctl-reset-btn[_ngcontent-%COMP%] {\n      height: 24px;\n      padding: 0 10px;\n      border-radius: 5px;\n      font-size: 11.5px;\n      font-weight: 500;\n      font-family: var(--font-sans);\n      color: var(--prism-text-muted);\n      background: transparent;\n      border: 1px solid var(--prism-border);\n      cursor: pointer;\n      display: inline-flex;\n      align-items: center;\n      gap: 5px;\n      transition: color var(--dur-fast), background var(--dur-fast), border-color var(--dur-fast);\n    }\n    .ctl-reset-btn[_ngcontent-%COMP%]:hover {\n      color: var(--prism-text);\n      border-color: color-mix(in srgb, var(--prism-primary) 40%, var(--prism-border));\n      background: color-mix(in srgb, var(--prism-primary) 8%, transparent);\n    }\n    .ctl-reset-btn[_ngcontent-%COMP%]:focus-visible {\n      outline: 2px solid var(--prism-primary);\n      outline-offset: 1px;\n    }\n\n    .ctl-row[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: 180px 1fr;\n      align-items: center;\n      gap: 12px;\n      padding: 8px 20px;\n      min-height: 40px;\n      border-bottom: 1px solid var(--prism-border);\n    }\n    .ctl-row[_ngcontent-%COMP%]:hover {\n      background: color-mix(in srgb, var(--prism-primary) 3%, transparent);\n    }\n\n    .ctl-label[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      gap: 2px;\n    }\n    .ctl-name[_ngcontent-%COMP%] {\n      font-size: 13px;\n      color: var(--prism-text);\n      font-weight: 500;\n    }\n    .ctl-type[_ngcontent-%COMP%] {\n      font-family: var(--font-mono);\n      font-size: 10.5px;\n      color: var(--prism-text-ghost);\n    }\n    .ctl-type[_ngcontent-%COMP%]   b[_ngcontent-%COMP%] {\n      color: var(--prism-primary);\n      font-weight: 500;\n    }\n\n    .ctl-input[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      min-width: 0;\n    }\n\n    .ctl-not-editable[_ngcontent-%COMP%] {\n      font-family: var(--font-mono);\n      font-size: 11.5px;\n      color: var(--prism-text-ghost);\n      font-style: italic;\n    }\n\n    .ctl-empty[_ngcontent-%COMP%] {\n      color: var(--prism-text-ghost);\n      font-size: 13px;\n      margin: 0;\n      padding: 16px 20px;\n    }"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PrismControlsPanelComponent, [{
         type: Component,
@@ -199,8 +215,7 @@ export class PrismControlsPanelComponent {
           <span aria-hidden="true">&#x21BB;</span> Reset
         </button>
       </div>
-      }
-      @for (input of comp.meta.inputs; track input.name) {
+      } @for (input of comp.meta.inputs; track input.name) {
       <div class="ctl-row">
         @if (getCustomControl(input); as customCtrl) {
         <ng-container
@@ -218,7 +233,13 @@ export class PrismControlsPanelComponent {
           >
         </div>
         <div class="ctl-input">
-          @switch (input.type) { @case ('boolean') {
+          @if (isNonEditable(input)) {
+          <span
+            class="ctl-not-editable"
+            title="This input type can't be edited from the controls panel"
+            >Not editable</span
+          >
+          } @else { @switch (input.type) { @case ('boolean') {
           <prism-boolean-control
             [value]="asBoolean(rendererService.inputValues()[input.name])"
             (valueChange)="rendererService.updateInput(input.name, $event)"
@@ -244,7 +265,7 @@ export class PrismControlsPanelComponent {
             [value]="rendererService.inputValues()[input.name]"
             (valueChange)="rendererService.updateInput(input.name, $event)"
           />
-          } }
+          } } }
         </div>
         }
       </div>
@@ -253,6 +274,6 @@ export class PrismControlsPanelComponent {
       }
     </div>
     }
-  `, styles: ["\n    .ctl-panel {\n      overflow-y: auto;\n      height: 100%;\n    }\n\n    .ctl-toolbar {\n      position: sticky;\n      top: 0;\n      z-index: 2;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 8px 20px;\n      background: var(--prism-bg-elevated);\n      border-bottom: 1px solid var(--prism-border);\n    }\n    .ctl-dirty-info {\n      font-size: 11.5px;\n      font-family: var(--font-mono);\n      color: var(--prism-text-muted);\n      display: inline-flex;\n      align-items: center;\n      gap: 6px;\n    }\n    .ctl-dirty-dot {\n      width: 6px;\n      height: 6px;\n      border-radius: 50%;\n      background: var(--prism-primary);\n      box-shadow: 0 0 6px color-mix(in srgb, var(--prism-primary) 60%, transparent);\n    }\n    .ctl-reset-btn {\n      height: 24px;\n      padding: 0 10px;\n      border-radius: 5px;\n      font-size: 11.5px;\n      font-weight: 500;\n      font-family: var(--font-sans);\n      color: var(--prism-text-muted);\n      background: transparent;\n      border: 1px solid var(--prism-border);\n      cursor: pointer;\n      display: inline-flex;\n      align-items: center;\n      gap: 5px;\n      transition: color var(--dur-fast), background var(--dur-fast), border-color var(--dur-fast);\n    }\n    .ctl-reset-btn:hover {\n      color: var(--prism-text);\n      border-color: color-mix(in srgb, var(--prism-primary) 40%, var(--prism-border));\n      background: color-mix(in srgb, var(--prism-primary) 8%, transparent);\n    }\n    .ctl-reset-btn:focus-visible {\n      outline: 2px solid var(--prism-primary);\n      outline-offset: 1px;\n    }\n\n    .ctl-row {\n      display: grid;\n      grid-template-columns: 180px 1fr;\n      align-items: center;\n      gap: 12px;\n      padding: 8px 20px;\n      min-height: 40px;\n      border-bottom: 1px solid var(--prism-border);\n    }\n    .ctl-row:hover {\n      background: color-mix(in srgb, var(--prism-primary) 3%, transparent);\n    }\n\n    .ctl-label {\n      display: flex;\n      flex-direction: column;\n      gap: 2px;\n    }\n    .ctl-name {\n      font-size: 13px;\n      color: var(--prism-text);\n      font-weight: 500;\n    }\n    .ctl-type {\n      font-family: var(--font-mono);\n      font-size: 10.5px;\n      color: var(--prism-text-ghost);\n    }\n    .ctl-type b {\n      color: var(--prism-primary);\n      font-weight: 500;\n    }\n\n    .ctl-input {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      min-width: 0;\n    }\n\n    .ctl-empty {\n      color: var(--prism-text-ghost);\n      font-size: 13px;\n      margin: 0;\n      padding: 16px 20px;\n    }\n  "] }]
+  `, styles: ["\n    .ctl-panel {\n      overflow-y: auto;\n      height: 100%;\n    }\n\n    .ctl-toolbar {\n      position: sticky;\n      top: 0;\n      z-index: 2;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      padding: 8px 20px;\n      background: var(--prism-bg-elevated);\n      border-bottom: 1px solid var(--prism-border);\n    }\n    .ctl-dirty-info {\n      font-size: 11.5px;\n      font-family: var(--font-mono);\n      color: var(--prism-text-muted);\n      display: inline-flex;\n      align-items: center;\n      gap: 6px;\n    }\n    .ctl-dirty-dot {\n      width: 6px;\n      height: 6px;\n      border-radius: 50%;\n      background: var(--prism-primary);\n      box-shadow: 0 0 6px color-mix(in srgb, var(--prism-primary) 60%, transparent);\n    }\n    .ctl-reset-btn {\n      height: 24px;\n      padding: 0 10px;\n      border-radius: 5px;\n      font-size: 11.5px;\n      font-weight: 500;\n      font-family: var(--font-sans);\n      color: var(--prism-text-muted);\n      background: transparent;\n      border: 1px solid var(--prism-border);\n      cursor: pointer;\n      display: inline-flex;\n      align-items: center;\n      gap: 5px;\n      transition: color var(--dur-fast), background var(--dur-fast), border-color var(--dur-fast);\n    }\n    .ctl-reset-btn:hover {\n      color: var(--prism-text);\n      border-color: color-mix(in srgb, var(--prism-primary) 40%, var(--prism-border));\n      background: color-mix(in srgb, var(--prism-primary) 8%, transparent);\n    }\n    .ctl-reset-btn:focus-visible {\n      outline: 2px solid var(--prism-primary);\n      outline-offset: 1px;\n    }\n\n    .ctl-row {\n      display: grid;\n      grid-template-columns: 180px 1fr;\n      align-items: center;\n      gap: 12px;\n      padding: 8px 20px;\n      min-height: 40px;\n      border-bottom: 1px solid var(--prism-border);\n    }\n    .ctl-row:hover {\n      background: color-mix(in srgb, var(--prism-primary) 3%, transparent);\n    }\n\n    .ctl-label {\n      display: flex;\n      flex-direction: column;\n      gap: 2px;\n    }\n    .ctl-name {\n      font-size: 13px;\n      color: var(--prism-text);\n      font-weight: 500;\n    }\n    .ctl-type {\n      font-family: var(--font-mono);\n      font-size: 10.5px;\n      color: var(--prism-text-ghost);\n    }\n    .ctl-type b {\n      color: var(--prism-primary);\n      font-weight: 500;\n    }\n\n    .ctl-input {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      min-width: 0;\n    }\n\n    .ctl-not-editable {\n      font-family: var(--font-mono);\n      font-size: 11.5px;\n      color: var(--prism-text-ghost);\n      font-style: italic;\n    }\n\n    .ctl-empty {\n      color: var(--prism-text-ghost);\n      font-size: 13px;\n      margin: 0;\n      padding: 16px 20px;\n    }\n  "] }]
     }], null, { activeComponent: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeComponent", required: false }] }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismControlsPanelComponent, { className: "PrismControlsPanelComponent", filePath: "app/panels/controls/prism-controls-panel.component.ts", lineNumber: 208 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismControlsPanelComponent, { className: "PrismControlsPanelComponent", filePath: "app/panels/controls/prism-controls-panel.component.ts", lineNumber: 226 }); })();

package/dist/app/renderer/known-inputs.d.ts

@@ -0,0 +1,9 @@
+import type { RuntimeComponent } from '../../plugin/plugin.types.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` — code that
+ * validates / filters inputs against that list must allow this key through.
+ */
+export declare const PRISM_CONTENT_INPUT = "__prismContent__";
+export declare function buildKnownInputs(comp: RuntimeComponent): Set<string>;
+//# sourceMappingURL=known-inputs.d.ts.map

package/dist/app/renderer/known-inputs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"known-inputs.d.ts","sourceRoot":"","sources":["../../../src/app/renderer/known-inputs.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAErE;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,qBAAqB,CAAC;AAEtD,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,gBAAgB,GAAG,GAAG,CAAC,MAAM,CAAC,CAMpE"}

package/dist/app/renderer/known-inputs.js

@@ -0,0 +1,13 @@
+/** 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` — code that
+ * validates / filters inputs against that list must allow this key through.
+ */
+export const PRISM_CONTENT_INPUT = '__prismContent__';
+export function buildKnownInputs(comp) {
+    const known = new Set(comp.meta.inputs.map((i) => i.name));
+    if (comp.meta.componentMeta.isDirective) {
+        known.add(PRISM_CONTENT_INPUT);
+    }
+    return known;
+}

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":"AAAA,OAAO,EASL,QAAQ,EAER,KAAK,IAAI,EAIV,MAAM,eAAe,CAAC;AAYvB,OAAO,EAAE,sBAAsB,EAAE,MAAM,yCAAyC,CAAC;AAGjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACzE,OAAO,EAAE,qBAAqB,EAAE,MAAM,yCAAyC,CAAC;;AAIhF,qBA8Ia,sBAAsB;IACjC,SAAS,CAAC,QAAQ,CAAC,IAAI,OAAQ;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,SAAS,wBAAiC;IAC7D,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;IAE5D,OAAO,CAAC,QAAQ,CAAC,MAAM,CAEpB;IACH,OAAO,CAAC,YAAY,CAAsC;IAC1D,OAAO,CAAC,mBAAmB,CAAsC;IACjE,OAAO,CAAC,oBAAoB,CAChB;IACZ,OAAO,CAAC,YAAY,CAAS;IAE7B,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAoC;IACjE,QAAQ,CAAC,aAAa,+DAAsC;IAC5D,wFAAwF;IACxF,SAAS,CAAC,QAAQ,CAAC,WAAW,gDAQ3B;IACH,6GAA6G;IAC7G,SAAS,CAAC,QAAQ,CAAC,YAAY,4FAU5B;IACH,SAAS,CAAC,QAAQ,CAAC,aAAa;;MAA6C;IAC7E,SAAS,CAAC,QAAQ,CAAC,eAAe,yFAG/B;;IA0FH,OAAO,CAAC,eAAe;IA6FvB,OAAO,CAAC,OAAO;yCA9OJ,sBAAsB;2CAAtB,sBAAsB;CA4PlC"}
+{"version":3,"file":"prism-renderer.component.d.ts","sourceRoot":"","sources":["../../../src/app/renderer/prism-renderer.component.ts"],"names":[],"mappings":"AAAA,OAAO,EASL,QAAQ,EAER,KAAK,IAAI,EAIV,MAAM,eAAe,CAAC;AAYvB,OAAO,EAAE,sBAAsB,EAAE,MAAM,yCAAyC,CAAC;AAGjF,OAAO,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAC;AAC7E,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACzE,OAAO,EAAE,qBAAqB,EAAE,MAAM,yCAAyC,CAAC;;AAKhF,qBA8Ia,sBAAsB;IACjC,SAAS,CAAC,QAAQ,CAAC,IAAI,OAAQ;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,SAAS,wBAAiC;IAC7D,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;IAE5D,OAAO,CAAC,QAAQ,CAAC,MAAM,CAEpB;IACH,OAAO,CAAC,YAAY,CAAsC;IAC1D,OAAO,CAAC,mBAAmB,CAAsC;IACjE,OAAO,CAAC,oBAAoB,CAChB;IACZ,OAAO,CAAC,YAAY,CAAS;IAE7B,OAAO,CAAC,QAAQ,CAAC,YAAY,CAAoC;IACjE,QAAQ,CAAC,aAAa,+DAAsC;IAC5D,wFAAwF;IACxF,SAAS,CAAC,QAAQ,CAAC,WAAW,gDAQ3B;IACH,6GAA6G;IAC7G,SAAS,CAAC,QAAQ,CAAC,YAAY,4FAU5B;IACH,SAAS,CAAC,QAAQ,CAAC,aAAa;;MAA6C;IAC7E,SAAS,CAAC,QAAQ,CAAC,eAAe,yFAG/B;;IA0FH,OAAO,CAAC,eAAe;IA6FvB,OAAO,CAAC,OAAO;yCA9OJ,sBAAsB;2CAAtB,sBAAsB;CA4PlC"}

package/dist/app/renderer/prism-renderer.component.js

@@ -12,6 +12,7 @@ import { PrismCanvasService } from '../services/prism-canvas.service.js';
 import { PrismVariantBgService } from '../services/prism-variant-bg.service.js';
 import { PrismCanvasRulersComponent } from '../canvas/prism-canvas-rulers.component.js';
 import { PrismCanvasBgPillComponent } from '../canvas/prism-canvas-bg-pill.component.js';
+import { buildKnownInputs } from './known-inputs.js';
 import * as i0 from "@angular/core";
 const _c0 = ["outlet"];
 function PrismRendererComponent_Conditional_10_ng_container_0_Template(rf, ctx) { if (rf & 1) {
@@ -104,7 +105,7 @@ export class PrismRendererComponent {
                 return;
             }
             performance.mark('prism:rerender:start');
-            const knownInputs = new Set(comp.meta.inputs.map((i) => i.name));
+            const knownInputs = buildKnownInputs(comp);
             for (const [key, value] of Object.entries(inputs)) {
                 if (!knownInputs.has(key)) {
                     console.warn(`[ng-prism] Unknown input "${key}" on <${comp.meta.componentMeta.selector}> — skipping. Remove it from @Showcase variants.`);
@@ -196,7 +197,7 @@ export class PrismRendererComponent {
                 this.outputSubscriptions.push(sub);
             }
         }
-        const knownInputs = new Set(comp.meta.inputs.map((i) => i.name));
+        const knownInputs = buildKnownInputs(comp);
         for (const [key, value] of Object.entries(this.rendererService.inputValues())) {
             if (!knownInputs.has(key)) {
                 console.warn(`[ng-prism] Unknown input "${key}" on <${selector}> — skipping. Remove it from @Showcase variants.`);
@@ -299,7 +300,7 @@ export class PrismRendererComponent {
     }], () => [], { outlet: [{ type: i0.ViewChild, args: ['outlet', { ...{
                         read: ViewContainerRef,
                     }, isSignal: true }] }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismRendererComponent, { className: "PrismRendererComponent", filePath: "app/renderer/prism-renderer.component.ts", lineNumber: 179 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismRendererComponent, { className: "PrismRendererComponent", filePath: "app/renderer/prism-renderer.component.ts", lineNumber: 180 }); })();
 function parseContentToNodes(content) {
     if (typeof content === 'string') {
         return [htmlToNodes(content)];

package/dist/app/renderer/snippet-generator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"snippet-generator.d.ts","sourceRoot":"","sources":["../../../src/app/renderer/snippet-generator.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAC9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAEvE,MAAM,WAAW,uBAAuB;IACtC,IAAI,CAAC,EAAE,MAAM,GAAG,aAAa,CAAC;CAC/B;AAoBD,wBAAgB,eAAe,CAC7B,QAAQ,EAAE,MAAM,EAChB,MAAM,EAAE,SAAS,EAAE,EACnB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC/B,YAAY,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,EAClC,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACzC,gBAAgB,CAAC,EAAE,uBAAuB,GACzC,MAAM,CA2DR"}
+{"version":3,"file":"snippet-generator.d.ts","sourceRoot":"","sources":["../../../src/app/renderer/snippet-generator.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAC9D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mCAAmC,CAAC;AAEvE,MAAM,WAAW,uBAAuB;IACtC,IAAI,CAAC,EAAE,MAAM,GAAG,aAAa,CAAC;CAC/B;AAwBD,wBAAgB,eAAe,CAC7B,QAAQ,EAAE,MAAM,EAChB,MAAM,EAAE,SAAS,EAAE,EACnB,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EAC/B,YAAY,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC,EAClC,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,EACzC,gBAAgB,CAAC,EAAE,uBAAuB,GACzC,MAAM,CAmER"}

package/dist/app/renderer/snippet-generator.js

@@ -76,7 +76,9 @@ function directiveSelectorToAttr(selector) {
     return match ? match[1] : selector;
 }
 function parseHostStringSimple(host) {
-    const match = host.trim().match(/^<\s*([a-zA-Z][a-zA-Z0-9-]*)((?:\s+[^>]*?)?)\s*\/?\s*>$/);
+    const match = host
+        .trim()
+        .match(/^<\s*([a-zA-Z][a-zA-Z0-9-]*)((?:\s+[^>]*?)?)\s*\/?\s*>$/);
     if (!match)
         return { tag: 'div', attrs: '' };
     return { tag: match[1], attrs: match[2].trim() };
@@ -100,7 +102,7 @@ function generateDirectiveSnippet(selector, inputs, values, explicitKeys, conten
         }
     }
     const attributes = [];
-    const processed = new Set();
+    const processed = new Set(['__prismContent__']);
     for (const input of inputs) {
         processed.add(input.name);
         const value = values[input.name];
@@ -123,15 +125,21 @@ function generateDirectiveSnippet(selector, inputs, values, explicitKeys, conten
             continue;
         pushAttribute(attributes, name, value);
     }
+    const projectedContent = content ??
+        (typeof values['__prismContent__'] === 'string'
+            ? values['__prismContent__']
+            : undefined);
     const allAttrs = [...hostAttrs, directiveAttr, ...attributes].join(' ');
-    const contentHtml = resolveContentHtml(content);
+    const contentHtml = resolveContentHtml(projectedContent);
     if (!contentHtml) {
         if (!allAttrs)
             return `<${tag} />`;
         const singleLine = `<${tag} ${allAttrs} />`;
         if (singleLine.length <= 80)
             return singleLine;
-        const indented = [...hostAttrs, directiveAttr, ...attributes].map((a) => `  ${a}`).join('\n');
+        const indented = [...hostAttrs, directiveAttr, ...attributes]
+            .map((a) => `  ${a}`)
+            .join('\n');
         return `<${tag}\n${indented} />`;
     }
     const openTag = `<${tag} ${allAttrs}>`;

package/dist/app/services/prism-navigation.service.d.ts

@@ -1,14 +1,25 @@
-import type { RuntimeComponent } from '../../plugin/plugin.types.js';
+import type { RuntimeComponent, ScannedComponent } from '../../plugin/plugin.types.js';
 import type { StyleguidePage } from '../../plugin/page.types.js';
 import type { NavigationItem } from './navigation-item.types.js';
 import * as i0 from "@angular/core";
+export interface CategoryNode {
+    name: string;
+    items: NavigationItem[];
+}
+export interface SectionNode {
+    name: string;
+    order: number;
+    totalCount: number;
+    categories: CategoryNode[];
+}
+export declare function resolveSection(c: ScannedComponent): string;
 export declare class PrismNavigationService {
     private readonly searchService;
     private readonly manifestService;
     readonly activeItem: import("@angular/core").WritableSignal<NavigationItem | null>;
     readonly activeComponent: import("@angular/core").Signal<RuntimeComponent | null>;
     readonly activePage: import("@angular/core").Signal<StyleguidePage | null>;
-    readonly categoryTree: import("@angular/core").Signal<Map<string, NavigationItem[]>>;
+    readonly sectionTree: import("@angular/core").Signal<SectionNode[]>;
     select(comp: RuntimeComponent): void;
     selectPage(page: StyleguidePage): void;
     selectFirst(): void;

package/dist/app/services/prism-navigation.service.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"prism-navigation.service.d.ts","sourceRoot":"","sources":["../../../src/app/services/prism-navigation.service.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AACrE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;;AAIjE,qBACa,sBAAsB;IACjC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA8B;IAC5D,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAgC;IAEhE,QAAQ,CAAC,UAAU,gEAAuC;IAE1D,QAAQ,CAAC,eAAe,0DAQrB;IAEH,QAAQ,CAAC,UAAU,wDAQhB;IAEH,QAAQ,CAAC,YAAY,gEA0DlB;IAEH,MAAM,CAAC,IAAI,EAAE,gBAAgB,GAAG,IAAI;IAIpC,UAAU,CAAC,IAAI,EAAE,cAAc,GAAG,IAAI;IAItC,WAAW,IAAI,IAAI;yCA9FR,sBAAsB;6CAAtB,sBAAsB;CA2GlC"}
+{"version":3,"file":"prism-navigation.service.d.ts","sourceRoot":"","sources":["../../../src/app/services/prism-navigation.service.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,gBAAgB,EAChB,gBAAgB,EACjB,MAAM,8BAA8B,CAAC;AACtC,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;;AAWjE,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,cAAc,EAAE,CAAC;CACzB;AAED,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,YAAY,EAAE,CAAC;CAC5B;AAED,wBAAgB,cAAc,CAAC,CAAC,EAAE,gBAAgB,GAAG,MAAM,CAG1D;AAeD,qBACa,sBAAsB;IACjC,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA8B;IAC5D,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAgC;IAEhE,QAAQ,CAAC,UAAU,gEAAuC;IAE1D,QAAQ,CAAC,eAAe,0DAQrB;IAEH,QAAQ,CAAC,UAAU,wDAQhB;IAEH,QAAQ,CAAC,WAAW,gDAiFjB;IAEH,MAAM,CAAC,IAAI,EAAE,gBAAgB,GAAG,IAAI;IAIpC,UAAU,CAAC,IAAI,EAAE,cAAc,GAAG,IAAI;IAItC,WAAW,IAAI,IAAI;yCArHR,sBAAsB;6CAAtB,sBAAsB;CAkIlC"}