@ng-prism/core 21.4.4 → 21.5.0

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

@@ -11,11 +11,10 @@ export declare class PrismShellComponent {
     private readonly pluginService;
     private readonly urlStateService;
     protected readonly viewPanels: import("@angular/core").Signal<import("../../plugin/plugin.types.js").PanelDefinition[]>;
+    protected readonly showPanel: import("@angular/core").Signal<boolean>;
     protected readonly shellStyle: import("@angular/core").Signal<string>;
     constructor();
     protected onKeyDown(e: KeyboardEvent): void;
-    protected startSidebarResize(e: MouseEvent): void;
-    protected startPanelResize(e: MouseEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<PrismShellComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<PrismShellComponent, "prism-shell", never, {}, {}, never, never, true, never>;
 }

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

@@ -1 +1 @@
-{"version":3,"file":"prism-shell.component.d.ts","sourceRoot":"","sources":["../../../src/app/shell/prism-shell.component.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACzE,OAAO,EAAE,sBAAsB,EAAE,MAAM,yCAAyC,CAAC;AACjF,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;;AAavE,qBAgNa,mBAAmB;IAC9B,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAuC;IAC9D,SAAS,CAAC,QAAQ,CAAC,iBAAiB,yBAAkC;IACtE,OAAO,CAAC,QAAQ,CAAC,YAAY,CAA6B;IAC1D,SAAS,CAAC,QAAQ,CAAC,MAAM,qBAA8B;IACvD,SAAS,CAAC,QAAQ,CAAC,YAAY,oBAA6B;IAC5D,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA8B;IAC5D,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAgC;IAEhE,SAAS,CAAC,QAAQ,CAAC,UAAU,2FAG1B;IAEH,SAAS,CAAC,QAAQ,CAAC,UAAU,yCAU1B;;IA6BH,SAAS,CAAC,SAAS,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;IAU3C,SAAS,CAAC,kBAAkB,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI;IAajD,SAAS,CAAC,gBAAgB,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI;yCA5EpC,mBAAmB;2CAAnB,mBAAmB;CAqG/B"}
+{"version":3,"file":"prism-shell.component.d.ts","sourceRoot":"","sources":["../../../src/app/shell/prism-shell.component.ts"],"names":[],"mappings":"AAYA,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;AACzE,OAAO,EAAE,sBAAsB,EAAE,MAAM,yCAAyC,CAAC;AACjF,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;;AAiBvE,qBA2Pa,mBAAmB;IAC9B,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAuC;IAC9D,SAAS,CAAC,QAAQ,CAAC,iBAAiB,yBAAkC;IACtE,OAAO,CAAC,QAAQ,CAAC,YAAY,CAA6B;IAC1D,SAAS,CAAC,QAAQ,CAAC,MAAM,qBAA8B;IACvD,SAAS,CAAC,QAAQ,CAAC,YAAY,oBAA6B;IAC5D,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA8B;IAC5D,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAgC;IAEhE,SAAS,CAAC,QAAQ,CAAC,UAAU,2FAG1B;IAEH,SAAS,CAAC,QAAQ,CAAC,SAAS,0CAK1B;IAEF,SAAS,CAAC,QAAQ,CAAC,UAAU,yCAG1B;;IAgCH,SAAS,CAAC,SAAS,CAAC,CAAC,EAAE,aAAa,GAAG,IAAI;yCAxDhC,mBAAmB;2CAAnB,mBAAmB;CAyE/B"}

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

@@ -1,12 +1,12 @@
-import { Component, computed, effect, inject, untracked, HostListener } from '@angular/core';
+import { Component, computed, effect, inject, untracked, HostListener, ChangeDetectionStrategy, } from '@angular/core';
 import { PRISM_CONFIG } from '../tokens/prism-tokens.js';
-import { PRISM_DARK_THEME, PRISM_LIGHT_THEME } from '../theme/prism-default-theme.js';
 import { PrismThemeService } from '../services/prism-theme.service.js';
 import { PrismLayoutService } from '../services/prism-layout.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 { PrismComponentHeaderComponent } from '../component-header/prism-component-header.component.js';
+import { PrismComponentHeadComponent } from '../component-head/prism-component-head.component.js';
+import { PrismVariantRibbonComponent } from '../variant-ribbon/prism-variant-ribbon.component.js';
 import { PrismHeaderComponent } from '../header/prism-header.component.js';
 import { PrismPanelHostComponent } from '../panels/panel-host/prism-panel-host.component.js';
 import { PrismRendererComponent } from '../renderer/prism-renderer.component.js';
@@ -16,57 +16,86 @@ import { BUILTIN_PANELS } from '../panels/builtin-panels.js';
 import { PrismUrlStateService } from '../services/prism-url-state.service.js';
 import { PrismViewTabBarComponent } from '../view-tab-bar/prism-view-tab-bar.component.js';
 import { PrismViewPanelHostComponent } from '../view-tab-bar/prism-view-panel-host.component.js';
+import { PrismResizerDirective } from '../directives/prism-resizer.directive.js';
+import { PrismCanvasToolbarComponent } from '../canvas/prism-canvas-toolbar.component.js';
+import { PrismCodeDrawerComponent } from '../canvas/prism-code-drawer.component.js';
 import * as i0 from "@angular/core";
-function PrismShellComponent_Conditional_12_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+function PrismShellComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "aside", 6);
+    i0.ɵɵelement(1, "prism-sidebar");
+    i0.ɵɵelementStart(2, "div", 7);
+    i0.ɵɵelement(3, "img", 8);
+    i0.ɵɵelementStart(4, "a", 9);
+    i0.ɵɵtext(5, " Powered by ng-prism ");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(6, "div", 10);
+    i0.ɵɵlistener("valueChange", function PrismShellComponent_Conditional_3_Template_div_valueChange_6_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.layout.setSidebarWidth($event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(6);
+    i0.ɵɵproperty("min", 200)("max", 360)("value", ctx_r1.layout.sidebarWidth());
+} }
+function PrismShellComponent_Conditional_5_Conditional_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "prism-view-tab-bar", 11);
 } }
-function PrismShellComponent_Conditional_12_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "prism-component-header", 12);
+function PrismShellComponent_Conditional_5_Conditional_1_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "prism-component-head")(1, "prism-variant-ribbon");
 } }
-function PrismShellComponent_Conditional_12_Conditional_1_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, PrismShellComponent_Conditional_12_Conditional_1_Conditional_0_Template, 1, 0, "prism-component-header", 12);
-    i0.ɵɵelement(1, "prism-renderer", 9);
+function PrismShellComponent_Conditional_5_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, PrismShellComponent_Conditional_5_Conditional_1_Conditional_0_Template, 2, 0);
+    i0.ɵɵelementStart(1, "div", 12);
+    i0.ɵɵelement(2, "prism-canvas-toolbar")(3, "prism-renderer");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelement(4, "prism-code-drawer", 13);
 } if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext(2);
-    i0.ɵɵconditional(ctx_r0.layout.toolbarVisible() ? 0 : -1);
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵconditional(ctx_r1.layout.toolbarVisible() ? 0 : -1);
 } }
-function PrismShellComponent_Conditional_12_Conditional_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "prism-view-panel-host", 9);
+function PrismShellComponent_Conditional_5_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "prism-view-panel-host", 4);
+} }
+function PrismShellComponent_Conditional_5_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 14);
+    i0.ɵɵlistener("valueChange", function PrismShellComponent_Conditional_5_Conditional_3_Template_div_valueChange_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.layout.setPanelHeight($event)); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(1, "div", 15);
+    i0.ɵɵelement(2, "prism-panel-host");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("min", 200)("max", 560)("value", ctx_r1.layout.panelHeight());
 } }
-function PrismShellComponent_Conditional_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵconditionalCreate(0, PrismShellComponent_Conditional_12_Conditional_0_Template, 1, 0, "prism-view-tab-bar", 11);
-    i0.ɵɵconditionalCreate(1, PrismShellComponent_Conditional_12_Conditional_1_Template, 2, 1)(2, PrismShellComponent_Conditional_12_Conditional_2_Template, 1, 0, "prism-view-panel-host", 9);
+function PrismShellComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵconditionalCreate(0, PrismShellComponent_Conditional_5_Conditional_0_Template, 1, 0, "prism-view-tab-bar", 11);
+    i0.ɵɵconditionalCreate(1, PrismShellComponent_Conditional_5_Conditional_1_Template, 5, 1)(2, PrismShellComponent_Conditional_5_Conditional_2_Template, 1, 0, "prism-view-panel-host", 4);
+    i0.ɵɵconditionalCreate(3, PrismShellComponent_Conditional_5_Conditional_3_Template, 3, 3);
 } if (rf & 2) {
-    const ctx_r0 = i0.ɵɵnextContext();
-    i0.ɵɵconditional(ctx_r0.viewPanels().length > 0 ? 0 : -1);
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵconditional(ctx_r1.viewPanels().length > 0 ? 0 : -1);
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r0.panelService.activeViewId() === "renderer" ? 1 : 2);
+    i0.ɵɵconditional(ctx_r1.panelService.activeViewId() === "renderer" ? 1 : 2);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r1.showPanel() ? 3 : -1);
 } }
-function PrismShellComponent_Conditional_13_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "prism-page-renderer", 9);
+function PrismShellComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "prism-page-renderer", 4);
 } }
-function PrismShellComponent_Conditional_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 10)(1, "div", 13);
+function PrismShellComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 5);
     i0.ɵɵnamespaceSVG();
-    i0.ɵɵelementStart(2, "svg", 14);
-    i0.ɵɵelement(3, "path", 5)(4, "path", 6);
+    i0.ɵɵelementStart(1, "svg", 16);
+    i0.ɵɵelement(2, "path", 17)(3, "path", 18);
     i0.ɵɵelementEnd();
     i0.ɵɵnamespaceHTML();
-    i0.ɵɵelementStart(5, "p", 15);
-    i0.ɵɵtext(6, "Select a component");
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "p", 16);
-    i0.ɵɵtext(8, "from the sidebar to preview it here");
-    i0.ɵɵelementEnd()()();
-} }
-function PrismShellComponent_Conditional_15_Template(rf, ctx) { if (rf & 1) {
-    const _r2 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 17);
-    i0.ɵɵlistener("mousedown", function PrismShellComponent_Conditional_15_Template_div_mousedown_0_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.startPanelResize($event)); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(1, "div", 18);
-    i0.ɵɵelement(2, "prism-panel-host");
+    i0.ɵɵelementStart(4, "p", 19);
+    i0.ɵɵtext(5, "Select a component");
     i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "p", 20);
+    i0.ɵɵtext(7, " from the sidebar to preview it here ");
+    i0.ɵɵelementEnd()();
 } }
 export class PrismShellComponent {
     config = inject(PRISM_CONFIG);
@@ -80,25 +109,24 @@ export class PrismShellComponent {
         ...BUILTIN_PANELS.filter((p) => p.placement === 'view'),
         ...this.pluginService.viewPanels(),
     ], ...(ngDevMode ? [{ debugName: "viewPanels" }] : []));
+    showPanel = computed(() => this.layout.addonsVisible() &&
+        this.panelService.activeViewId() === 'renderer' &&
+        !this.navigationService.activePage(), ...(ngDevMode ? [{ debugName: "showPanel" }] : []));
     shellStyle = computed(() => {
-        const isDark = this.themeService.isDark();
-        const base = isDark ? PRISM_DARK_THEME : PRISM_LIGHT_THEME;
-        const specific = isDark ? (this.config.darkTheme ?? {}) : (this.config.lightTheme ?? {});
-        const merged = { ...base, ...specific, ...(this.config.theme ?? {}) };
-        const tokens = Object.entries(merged).map(([k, v]) => `${k}: ${v}`).join('; ');
         const sw = this.layout.sidebarVisible() ? this.layout.sidebarWidth() : 0;
-        const ph = this.layout.addonsOrientation() === 'bottom' ? this.layout.panelHeight() : 0;
-        const pw = this.layout.addonsOrientation() === 'right' ? this.layout.panelWidth() : 0;
-        return `${tokens}; --sw: ${sw}px; --ph: ${ph}px; --pw: ${pw}px;`;
+        return `--sw: ${sw}px;`;
     }, ...(ngDevMode ? [{ debugName: "shellStyle" }] : []));
     constructor() {
+        this.themeService.applyConfigOverrides(this.config);
         this.navigationService.selectFirst();
         this.urlStateService.init();
         let lastItemKey = null;
         effect(() => {
             const item = this.navigationService.activeItem();
             const key = item
-                ? (item.kind === 'component' ? item.data.meta.className : item.data.title)
+                ? item.kind === 'component'
+                    ? item.data.meta.className
+                    : item.data.title
                 : null;
             if (lastItemKey !== null && lastItemKey !== key) {
                 untracked(() => this.panelService.activeViewId.set('renderer'));
@@ -130,172 +158,155 @@ export class PrismShellComponent {
                 e.preventDefault();
                 this.layout.toggleAddons();
                 break;
-            case 'd':
-                e.preventDefault();
-                this.layout.toggleOrientation();
-                break;
-        }
-    }
-    startSidebarResize(e) {
-        e.preventDefault();
-        const startX = e.clientX;
-        const startW = this.layout.sidebarWidth();
-        const onMove = (ev) => this.layout.setSidebarWidth(startW + ev.clientX - startX);
-        const onUp = () => {
-            document.removeEventListener('mousemove', onMove);
-            document.removeEventListener('mouseup', onUp);
-        };
-        document.addEventListener('mousemove', onMove);
-        document.addEventListener('mouseup', onUp);
-    }
-    startPanelResize(e) {
-        e.preventDefault();
-        const isRight = this.layout.addonsOrientation() === 'right';
-        if (isRight) {
-            const startX = e.clientX;
-            const startW = this.layout.panelWidth();
-            const onMove = (ev) => this.layout.setPanelWidth(startW - (ev.clientX - startX));
-            const onUp = () => {
-                document.removeEventListener('mousemove', onMove);
-                document.removeEventListener('mouseup', onUp);
-            };
-            document.addEventListener('mousemove', onMove);
-            document.addEventListener('mouseup', onUp);
-        }
-        else {
-            const startY = e.clientY;
-            const startH = this.layout.panelHeight();
-            const onMove = (ev) => this.layout.setPanelHeight(startH - (ev.clientY - startY));
-            const onUp = () => {
-                document.removeEventListener('mousemove', onMove);
-                document.removeEventListener('mouseup', onUp);
-            };
-            document.addEventListener('mousemove', onMove);
-            document.addEventListener('mouseup', onUp);
         }
     }
     static ɵfac = function PrismShellComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PrismShellComponent)(); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PrismShellComponent, selectors: [["prism-shell"]], hostBindings: function PrismShellComponent_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("keydown", function PrismShellComponent_keydown_HostBindingHandler($event) { return ctx.onKeyDown($event); }, i0.ɵɵresolveDocument);
-        } }, decls: 16, vars: 8, consts: [[1, "prism-shell"], [1, "prism-shell__header"], [1, "prism-shell__sidebar"], [1, "prism-shell__powered-by"], ["viewBox", "0 0 24 24", "fill", "none", "xmlns", "http://www.w3.org/2000/svg", 1, "prism-shell__powered-by-icon"], ["d", "M12 2L4 14h16L12 2z", "stroke", "currentColor", "stroke-width", "1.5", "stroke-linejoin", "round"], ["d", "M4 14l4 8h8l4-8", "stroke", "currentColor", "stroke-width", "1.5", "stroke-linejoin", "round"], [1, "prism-shell__sidebar-handle", 3, "mousedown"], [1, "prism-shell__main"], [1, "prism-shell__canvas"], [1, "prism-shell__empty"], [1, "prism-shell__view-bar"], [1, "prism-shell__toolbar"], [1, "prism-shell__empty-inner"], ["viewBox", "0 0 24 24", "fill", "none", "xmlns", "http://www.w3.org/2000/svg", 1, "prism-shell__empty-icon"], [1, "prism-shell__empty-text"], [1, "prism-shell__empty-hint"], [1, "prism-shell__panel-handle", 3, "mousedown"], [1, "prism-shell__panel"]], template: function PrismShellComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, decls: 8, vars: 8, consts: [[1, "prism-shell"], [1, "prism-shell__header"], [1, "prism-body"], [1, "prism-main"], [1, "prism-main__canvas"], [1, "prism-shell__empty"], [1, "prism-sidebar-wrap"], [1, "prism-sidebar-foot"], ["alt", "ng-prism logo", "src", "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABYCAMAAAA0hKKwAAAC7lBMVEUAAADFkfu6Dn9fLlcmNclKI0WFKFAnRr9XJ09tUI3jTZDxU5vxUJvIQ30wYuRNIMFoF7qBEq61g7y0N2+SL1ljQnL8vO5dUqqhNGPps/coVdQ4K8iUEKCkEJm1O3GKaL2JXpzTmePcS4zCitkoQdeVgfK4ie7hqeGde9p7bNTRR4PQRYRqYMawjPe/SHyBX7D4WJ75WaD6W6H4Vp37XKL9y/UlMtbDEoR90f39uvndn/v5U5rYm/vMlPsrTPJLI8z/YbNWH8f6tfr+0PjxrPvqqPu8jPs1K9QxY/zko/tFJc5RIcnTmfuuifv/1PkmNdz0r/olM9hoGcDopPurh/swXPotUfVzF7rCj/ukhvv9zfb9wv+XgvvuqfovVvgrRO7/5/60i/zhofunhvv6WJ6B0f2ghPvQlvttGL2/Eoa3i/soPeYnOuA8KdJfHMNjG8F8FbX/4P6yiPuSgfsxYPv3sfq2EYpAJ9BaHcX8Vpy7EYf+x/R3FbiIFLD/X62YE6W5jPychPz+tvb7Yab4Qo/+2P/IkvsvLtaCFLOPE6vIk/v9W6C4BH2Vzv2/jvv+XqOtEY/JEYWH0P28xf2fEpb//f//7v81af+myf2Mf/ykE6P6SpWmEJIkYP3/ZaP/zf+N0P1my/2dyv3/Wqf6uP8UM/D9ZaixD4vBDoGwxv3Mv/v6rvYIIOv/aLiVEZnN9f/+vP9y2P6bj/0bVvun3//1tP+ymv/I2v54zP16gvssRvZTIcSKFaTTn/+ml/9p4P7bzP7ilvvNhPtqcvn9qNqNFJ652/7AfPzYjPvy3fr8gsL6crPRJoq7/v+A3f7GmP6oi/6grv3ZtfxTbfskOvE3NeY0Ltn9l8xNDamAGKfmQJOTAISlAIGh9P+P7P/Fof/uzf6Kx/3e2/xGTvHjvud1HK6Nuf5Dav1lILi0MZvbM5B9AI+W2v62iNaPcdLXk824YLmbRbUxB7RqHq9mBJ9zAJjMHIWLjP9HRO0lFtDFY56wAAAAMHRSTlMA/qAgpAY5rxNM3e/9sqKhoZ+bgFYq/Htp+Kihnp6TkV3W08Oh7enSxsO/t6X2nnNWmYchAAAJcElEQVRo3rTSv4vaYBwG8IDc0btrF1uP3nLVOhRaKEnMonEQTQbhECFbQyBIwNnBwcXBmsnBqS4OGS44eAhZ3BW63HVz6Xp/Sr/PmwRxbHzfB3+MH573+0j/nVxOEp/rL5LwXL74BUl0rhuB8CofG/OJW5SE5uLtbFUNbi8kkfm+0VeTaJCXBCY3Xo20iW0HbyRxebeZjX5O7KovsMplY66OVoTYgbgZf26oc9akKm7GHzYzbc6aVKPBlSQkFzdjVYubUJU7MTO+pyKaliBCbo/5ztUjQrfPcScwX09LEVFVMF9trmneKkEi7jPGfFmRI9IMSpwJzJcuQh+dngtEsxn6mDHf+aLI8SZQbM4zvsfVTxGKnxcwXyR9LsowtHnO+NvGA5LcJCIAxrAblLnOV1aYoii69mTHBiFDu8BvvmNPVeMqKiFRanQdu8RvviMgbMIqPVdIBoiuYRh2kdt8ZYW9lsqQpzDuAcMJOc34vuF5DKEyCkNAwHAcxwrynOarUNCEjATpUmCYpjHkMeOvjQoMIFCAdOO3gmG1ozKP+c5wEQpDsK4tesQGKWZ0xWG+spcguIlCTYCgCAjLaoels+fLrh7v9xRhjwWkHZ0745txRSEFDIuiq4QYSREQvZ7RO894T0VAHDP96zvxepkBpBZ9Om++MzlF6Bd3X3Z+GU76WChCiLUtnD1fpihpkcUisFgREMyo1bblc+brebIMAwj+p3/cwevCthzz+FhImH3G1+MKMwAQI8vy8nYxuHteWNapUTdK2ec7Sg18KdOXRWvwenDt/alRr4fFrPN9rMishBJH1fWWC2TnGiSkRh0x+1nnq1c8GCoo6kRXdzudwe5wePb3MEAkSN/IZ5rv44yKKACSLFe+3+q4u/V67W73MFLi4aFfNwtZ5jumIkDSyNPf7o9OiyE7v9c7EkjfLGeZ77/K7DwoxjCOA7h1TJpxjiPn8AeGwShr1Vht0+wgmrbJlA47uxal5NpqXIvaoRS5YlNRQ83qmKamQ3dRKbkqFEVE5L5v//n9nufZ991VVvud7PCPz/ye3/d9vGoXVosptL5qmVQmVV8+mZV1smt1A2cgAVlibXl904SmiNhWEymSymRrik9iri1ZbGw4OjqunWF5fcVgYJiBWxf5ESQTjMziJ9UcAQZmyVTL64uDIEIflTP7pTIDkglIQtfFBmowIiqqUmB5fW1ZGHJFLfLz8wOkPiETU9hVDQI3x6GoqKi1Ft3GgxccFsIkfHDrIhFMAu2qT03ApNaPbzA2Dh2KcqwcbAEyFAbhDHwOhWfGqjU8QpgjxdWOeFbUgAh81s606Pblto4fMMh1HIQhT1Np3l2udqQETAGEj8BnubUlt6/Qjg5heNalMhwEFx9f+PQIzbnCOzXEgAgEAh9IZZ9rPA6eQyGbgyrwrIPBFg8IS2NCAzkpNJA4enTponkW1Zc3Fpy5ESklp0WOq7DkHEtcY1YDEFECzljaJBhkUX3tGIJbj9QYI3FxcUDAp8O7DTUwBQQNRCIqp/SpvuuPEYO7U2Dra0CgiFQaX1ji7x/HkpfQYCSAEeHTNKCP9bWjCI3YThNpgpz35+LQ2FnDE4ioKmf2ob77cOuosDtrwYH7ajwsVmFR/CNAHAxK3lNAeCJi48aISus+1Zd/CgHBrXOGn0wXn/v4fIm/gyGXbtdQYuPSiI0QVUjTjD7U19b0WRfDs84MkSZel/Xs2UlgOCQvr6gGh0ABDVWIqtLmv/Vlly+rMGydOyyNWtf14cvvbH1o8a1Gjrn0ogYI3nBzi5g76H/1ZTPQC2W+eL4okiOufWj7Ul7uFJzdml98Kw8YqlRdRUMFCQkBw82zc4r52zdNuB5HIV/Gz7pGprv2/lVbW7mza/mK1pbsXzyT5w8LQQPHQMNTpTJX49nkOWQIxLB1jUine9/d1vZqi7Ozq5OrU6tSn/3sdu6j8yV091cRYGNA1jXNNPvywNpLzwtfUNQaPw3s+/nnb9++ft2609nV1dXJaUVrGTC10ABk8hwirlICDUSaO63N1BcN/toiN7xGswaI79/bu7tfbdkJk4CxYkerUqnM1lPG/9ILRNwwIEB8VdPN3b4EIAwe1gKpbKxa9/zT27cV7e3dgVsNyI7Nm+8pkWkprYei4e7JPnAKggR0/qPGg2zh9qUEYYSwdTXs+1PO27q6ior2wJVbt2zhkGWgUCYXGlACg3giggKmuXmQmduXzkGkAxfW6OI/nnqYk1NXV9fuvRIQbpJlyw66KyVKpaSFNAAOzJPsAw1MQNGUXusL777C9QSgg+D/3D6+fvjwFCIV3oGBiOzkkYUeyjJQJPrsu8Dkh7B1ECIgoLlogPmXByH5OHPlORKnAMkBgyLORsjChcESEr2+NjXXJwAVFDBabdGsXm9fzhDC17GUIa87Os6eBQQNb++eiAcoZRIlKKv0+tKiJpUvIoTAVFn3Ul86CPwC43DKkJvpHenHAYFU7PHe4x1oupODMAlkExCoSPSK0iKBm68BkcvlVdN71hcMAJABQvhme0d6+nGKVGzbsweQnseFs7gDAMgqYLxKm5d6IiGnKbL5a+vCNDDYKCm2b4I6tm8nCCRm2zZQjCZZwRASWD9TFJKCsFpfFY5BEqrNH/zXN87EaOAYKSkP7GN3794NCkHCo6OjjZBy452gwSkKhaKgIKxU5aYlBKRqTo/6GvZ9MzY2iCEQMMwjHh7uoCAC8SoouJvoto4h8vwxf9WXLgOJjCAeCd+7d280HJc3j5geFxju7sGrMIh4eRUkA6MNxSRWzTK9fSF2KXZvMmIz7O2DQNkOSSeGKeLaC7IJFAUqiISFARO6To5IIqkxX19YxjFYBhBGSHhMTAxD/r14d4OiYEhYcoFLrdYXjMT86Ub1FeO+f8TGgsAQVJJiEIk2N4kHRTZtAoVDXFySk1+WarWo2HA/NBYfPkaWYU+DBihJ4eHhxpNs7Q0hxwUBxQsQplAmQJ4YGjrYUN8UISN4JAgNRMwunkeCg0HhEWSgAQGJ+XPoy8OFww9g32DwCDBJSX2YxINHIBLOoIHVyLX5A8hP3egyTBD73Wc5xGy7TBClhDfYMKdr8TYenXYzNuOEaexP2B9PwjAkmkOcAaH/+t67584Cf3tLsLIMo1S4uJw2istpWM1Pm36j+veWyZhJmJE0I2iG00zEDORjNW2glZXVtGnTBg6cYGU1YRgE/gy/mWA1bMIwmz/QGVRJ3BG6bAAAAABJRU5ErkJggg==", 1, "prism-sidebar-foot__logo"], ["href", "https://dyingangel666.github.io/ng-prism/#/", "target", "_blank", "rel", "noopener", 1, "prism-sidebar-foot__link"], ["prismResizer", "", "axis", "x", 1, "prism-resizer-col", 3, "valueChange", "min", "max", "value"], [1, "prism-main__view-bar"], [1, "prism-canvas-wrap"], [1, "prism-main__code-drawer"], ["prismResizer", "", "axis", "y", 1, "prism-resizer-row", 3, "valueChange", "min", "max", "value"], [1, "prism-main__panel"], ["viewBox", "0 0 24 24", "fill", "none", "stroke", "currentColor", "stroke-width", "1.5", "stroke-linecap", "round", "stroke-linejoin", "round", 1, "prism-shell__empty-icon"], ["d", "M12 2L4 14h16L12 2z"], ["d", "M4 14l4 8h8l4-8"], [1, "prism-shell__empty-text"], [1, "prism-shell__empty-hint"]], template: function PrismShellComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵelement(1, "prism-header", 1);
-            i0.ɵɵelementStart(2, "aside", 2);
-            i0.ɵɵelement(3, "prism-sidebar");
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(4, "div", 3);
-            i0.ɵɵnamespaceSVG();
-            i0.ɵɵelementStart(5, "svg", 4);
-            i0.ɵɵelement(6, "path", 5)(7, "path", 6);
-            i0.ɵɵelementEnd();
-            i0.ɵɵnamespaceHTML();
-            i0.ɵɵelementStart(8, "span");
-            i0.ɵɵtext(9, "Powered by ng-prism");
-            i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(10, "div", 7);
-            i0.ɵɵlistener("mousedown", function PrismShellComponent_Template_div_mousedown_10_listener($event) { return ctx.startSidebarResize($event); });
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(11, "main", 8);
-            i0.ɵɵconditionalCreate(12, PrismShellComponent_Conditional_12_Template, 3, 2)(13, PrismShellComponent_Conditional_13_Template, 1, 0, "prism-page-renderer", 9)(14, PrismShellComponent_Conditional_14_Template, 9, 0, "div", 10);
-            i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(15, PrismShellComponent_Conditional_15_Template, 3, 0);
-            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(2, "div", 2);
+            i0.ɵɵconditionalCreate(3, PrismShellComponent_Conditional_3_Template, 7, 3);
+            i0.ɵɵelementStart(4, "main", 3);
+            i0.ɵɵconditionalCreate(5, PrismShellComponent_Conditional_5_Template, 4, 3)(6, PrismShellComponent_Conditional_6_Template, 1, 0, "prism-page-renderer", 4)(7, PrismShellComponent_Conditional_7_Template, 8, 0, "div", 5);
+            i0.ɵɵelementEnd()()();
         } if (rf & 2) {
             i0.ɵɵstyleMap(ctx.shellStyle());
-            i0.ɵɵattribute("data-sidebar", ctx.layout.sidebarVisible() ? "visible" : "hidden")("data-addons", ctx.layout.addonsVisible() && ctx.panelService.activeViewId() === "renderer" && !ctx.navigationService.activePage() ? "visible" : "hidden")("data-orientation", ctx.layout.addonsOrientation())("data-toolbar", ctx.layout.toolbarVisible() ? "visible" : "hidden");
-            i0.ɵɵadvance(12);
-            i0.ɵɵconditional(ctx.navigationService.activeComponent() ? 12 : ctx.navigationService.activePage() ? 13 : 14);
-            i0.ɵɵadvance(3);
-            i0.ɵɵconditional(ctx.layout.addonsVisible() && ctx.panelService.activeViewId() === "renderer" && !ctx.navigationService.activePage() ? 15 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵclassProp("prism-body--no-sidebar", !ctx.layout.sidebarVisible());
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.layout.sidebarVisible() ? 3 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵstyleProp("--ph", ctx.showPanel() ? ctx.layout.panelHeight() : 0, "px");
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.navigationService.activeComponent() ? 5 : ctx.navigationService.activePage() ? 6 : 7);
         } }, dependencies: [PrismHeaderComponent,
             PrismSidebarComponent,
-            PrismComponentHeaderComponent,
+            PrismComponentHeadComponent,
+            PrismVariantRibbonComponent,
             PrismRendererComponent,
             PrismPanelHostComponent,
             PrismPageRendererComponent,
             PrismViewTabBarComponent,
-            PrismViewPanelHostComponent], styles: ["[_nghost-%COMP%] { display: block; height: 100%; }\n\n    .prism-shell[_ngcontent-%COMP%] {\n      display: grid;\n      height: 100%;\n      font-family: var(--prism-font-sans);\n      color: var(--prism-text);\n      background: var(--prism-bg);\n      overflow: hidden;\n\n      grid-template-columns: var(--sw) 4px 1fr;\n      grid-template-rows: var(--prism-header-height) 1fr 4px var(--ph);\n      grid-template-areas:\n        \"header  header  header\"\n        \"sidebar shdrag  main\"\n        \"sidebar shdrag  phdrag\"\n        \"sidebar shdrag  panel\";\n    }\n\n    .prism-shell[data-sidebar=\"hidden\"][_ngcontent-%COMP%] {\n      grid-template-columns: 0 0 1fr;\n    }\n\n    .prism-shell[data-addons=\"hidden\"][_ngcontent-%COMP%] {\n      grid-template-rows: var(--prism-header-height) 1fr;\n      grid-template-areas:\n        \"header  header  header\"\n        \"sidebar shdrag  main\";\n    }\n\n    .prism-shell[data-orientation=\"right\"][data-addons=\"visible\"][_ngcontent-%COMP%] {\n      grid-template-columns: var(--sw) 4px 1fr 4px var(--pw);\n      grid-template-rows: var(--prism-header-height) 1fr;\n      grid-template-areas:\n        \"header  header  header  header  header\"\n        \"sidebar shdrag  main    phdrag  panel\";\n    }\n\n    .prism-shell__header[_ngcontent-%COMP%]  { grid-area: header; }\n    .prism-shell__sidebar[_ngcontent-%COMP%] { grid-area: sidebar; overflow: hidden; min-width: 0; background: var(--prism-bg); }\n    .prism-shell__main[_ngcontent-%COMP%]    { grid-area: main; display: flex; flex-direction: column; overflow: hidden; min-height: 0; }\n    .prism-shell__panel[_ngcontent-%COMP%]   { grid-area: panel; overflow: hidden; min-height: 0; min-width: 0; }\n\n    .prism-shell__sidebar-handle[_ngcontent-%COMP%] {\n      grid-area: shdrag;\n      cursor: col-resize;\n      background: transparent;\n      transition: background 0.15s;\n      z-index: 10;\n    }\n    .prism-shell__sidebar-handle[_ngcontent-%COMP%]:hover { background: var(--prism-border); }\n\n    .prism-shell__panel-handle[_ngcontent-%COMP%] {\n      grid-area: phdrag;\n      background: transparent;\n      transition: background 0.15s;\n      z-index: 10;\n      cursor: row-resize;\n    }\n    .prism-shell__panel-handle[_ngcontent-%COMP%]:hover { background: var(--prism-border); }\n\n    .prism-shell[data-orientation=\"right\"][_ngcontent-%COMP%]   .prism-shell__panel-handle[_ngcontent-%COMP%] {\n      cursor: col-resize;\n    }\n\n    .prism-shell__view-bar[_ngcontent-%COMP%] { flex-shrink: 0; }\n    .prism-shell__toolbar[_ngcontent-%COMP%] { flex-shrink: 0; }\n    .prism-shell__canvas[_ngcontent-%COMP%]  { flex: 1; overflow: auto; min-height: 0; }\n\n    .prism-shell__empty[_ngcontent-%COMP%] {\n      flex: 1;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n    .prism-shell__empty-inner[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      gap: 8px;\n      text-align: center;\n    }\n    .prism-shell__empty-icon[_ngcontent-%COMP%] {\n      width: 48px;\n      height: 48px;\n      color: var(--prism-text-ghost);\n      margin-bottom: 8px;\n    }\n    .prism-shell__empty-text[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: 14px;\n      font-weight: 500;\n      color: var(--prism-text-muted);\n    }\n    .prism-shell__empty-hint[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: 13px;\n      color: var(--prism-text-ghost);\n    }\n\n    .prism-shell__powered-by[_ngcontent-%COMP%] {\n      grid-area: sidebar;\n      align-self: end;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 10px 16px;\n      font-size: 11px;\n      color: var(--prism-text-ghost);\n      font-family: var(--prism-font-sans);\n      border-right: 1px solid var(--prism-border);\n      background: var(--prism-bg);\n      pointer-events: none;\n      user-select: none;\n    }\n\n    .prism-shell__powered-by-icon[_ngcontent-%COMP%] {\n      width: 14px;\n      height: 14px;\n      flex-shrink: 0;\n    }\n\n    .prism-shell[data-sidebar=\"hidden\"][_ngcontent-%COMP%]   .prism-shell__powered-by[_ngcontent-%COMP%] {\n      display: none;\n    }"] });
+            PrismViewPanelHostComponent,
+            PrismResizerDirective,
+            PrismCanvasToolbarComponent,
+            PrismCodeDrawerComponent], styles: ["[_nghost-%COMP%] { display: block; height: 100%; }\n\n    .prism-shell[_ngcontent-%COMP%] {\n      height: 100vh;\n      display: grid;\n      grid-template-rows: 52px 1fr;\n      background: var(--prism-void);\n      font-family: var(--font-sans, var(--prism-font-sans));\n      color: var(--prism-text);\n      overflow: hidden;\n    }\n\n    .prism-body[_ngcontent-%COMP%] {\n      display: grid;\n      grid-template-columns: var(--sw, 264px) 4px 1fr;\n      min-height: 0;\n    }\n    .prism-body--no-sidebar[_ngcontent-%COMP%] {\n      grid-template-columns: 1fr;\n    }\n\n    .prism-sidebar-wrap[_ngcontent-%COMP%] {\n      background: var(--prism-bg);\n      border-right: 1px solid var(--prism-border);\n      display: flex;\n      flex-direction: column;\n      min-height: 0;\n      overflow: hidden;\n    }\n\n    .prism-sidebar-wrap[_ngcontent-%COMP%]   prism-sidebar[_ngcontent-%COMP%] {\n      flex: 1;\n      min-height: 0;\n    }\n\n    .prism-sidebar-foot[_ngcontent-%COMP%] {\n      border-top: 1px solid var(--prism-border);\n      padding: 10px 14px;\n      font-size: 11px;\n      color: var(--prism-text-ghost);\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n    .prism-sidebar-foot__logo[_ngcontent-%COMP%] {\n      width: 16px;\n      flex-shrink: 0;\n    }\n    .prism-sidebar-foot__link[_ngcontent-%COMP%] {\n      color: var(--prism-text-ghost);\n      text-decoration: none;\n      transition: color var(--dur-fast);\n    }\n    .prism-sidebar-foot__link[_ngcontent-%COMP%]:hover {\n      color: var(--prism-text-2);\n    }\n\n    .prism-resizer-col[_ngcontent-%COMP%] {\n      width: 4px;\n      background: transparent;\n      transition: background var(--dur-fast) var(--ease-default);\n      position: relative;\n      z-index: 5;\n    }\n    .prism-resizer-col[_ngcontent-%COMP%]:hover, \n   .prism-resizer-col.active[_ngcontent-%COMP%] {\n      background: var(--prism-primary);\n    }\n\n    .prism-main[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      min-height: 0;\n      background: var(--prism-void);\n      overflow: hidden;\n    }\n\n    .prism-resizer-row[_ngcontent-%COMP%] {\n      flex-shrink: 0;\n      height: 4px;\n      background: transparent;\n      transition: background var(--dur-fast) var(--ease-default);\n      position: relative;\n      z-index: 5;\n    }\n    .prism-resizer-row[_ngcontent-%COMP%]:hover, \n   .prism-resizer-row.active[_ngcontent-%COMP%] {\n      background: var(--prism-primary);\n    }\n\n    .prism-canvas-wrap[_ngcontent-%COMP%] {\n      flex: 1;\n      min-height: 0;\n      display: grid;\n      grid-template-rows: auto minmax(0, 1fr);\n      background: var(--prism-bg-surface);\n      overflow: hidden;\n    }\n    .prism-main__code-drawer[_ngcontent-%COMP%] { flex-shrink: 0; }\n    .prism-main__view-bar[_ngcontent-%COMP%] { flex-shrink: 0; }\n    .prism-main__canvas[_ngcontent-%COMP%] { flex: 1; min-height: 0; overflow: auto; }\n\n    .prism-main__panel[_ngcontent-%COMP%] {\n      height: var(--ph, 260px);\n      flex-shrink: 0;\n      overflow: hidden;\n      min-height: 0;\n    }\n\n    .prism-shell__empty[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      gap: 8px;\n      grid-row: 1 / -1;\n    }\n    .prism-shell__empty-icon[_ngcontent-%COMP%] {\n      width: 48px;\n      height: 48px;\n      color: var(--prism-text-ghost);\n      margin-bottom: 8px;\n    }\n    .prism-shell__empty-text[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: var(--fs-xl);\n      font-weight: 500;\n      color: var(--prism-text-muted);\n    }\n    .prism-shell__empty-hint[_ngcontent-%COMP%] {\n      margin: 0;\n      font-size: var(--fs-lg);\n      color: var(--prism-text-ghost);\n    }"], changeDetection: 0 });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PrismShellComponent, [{
         type: Component,
-        args: [{ selector: 'prism-shell', standalone: true, imports: [
+        args: [{ selector: 'prism-shell', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                     PrismHeaderComponent,
                     PrismSidebarComponent,
-                    PrismComponentHeaderComponent,
+                    PrismComponentHeadComponent,
+                    PrismVariantRibbonComponent,
                     PrismRendererComponent,
                     PrismPanelHostComponent,
                     PrismPageRendererComponent,
                     PrismViewTabBarComponent,
                     PrismViewPanelHostComponent,
+                    PrismResizerDirective,
+                    PrismCanvasToolbarComponent,
+                    PrismCodeDrawerComponent,
                 ], template: `
-    <div
-      class="prism-shell"
-      [style]="shellStyle()"
-      [attr.data-sidebar]="layout.sidebarVisible() ? 'visible' : 'hidden'"
-      [attr.data-addons]="layout.addonsVisible() && panelService.activeViewId() === 'renderer' && !navigationService.activePage() ? 'visible' : 'hidden'"
-      [attr.data-orientation]="layout.addonsOrientation()"
-      [attr.data-toolbar]="layout.toolbarVisible() ? 'visible' : 'hidden'"
-    >
+    <div class="prism-shell" [style]="shellStyle()">
       <prism-header class="prism-shell__header" />
 
-      <aside class="prism-shell__sidebar">
-        <prism-sidebar />
-      </aside>
-      <div class="prism-shell__powered-by">
-        <svg class="prism-shell__powered-by-icon" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-          <path d="M12 2L4 14h16L12 2z" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round"/>
-          <path d="M4 14l4 8h8l4-8" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round"/>
-        </svg>
-        <span>Powered by ng-prism</span>
-      </div>
       <div
-        class="prism-shell__sidebar-handle"
-        (mousedown)="startSidebarResize($event)"
-      ></div>
+        class="prism-body"
+        [class.prism-body--no-sidebar]="!layout.sidebarVisible()"
+      >
+        @if (layout.sidebarVisible()) {
+        <aside class="prism-sidebar-wrap">
+          <prism-sidebar />
+          <div class="prism-sidebar-foot">
+            <img
+              class="prism-sidebar-foot__logo"
+              alt="ng-prism logo"
+              src="data:image/png;base64,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"
+            />
+            <a
+              class="prism-sidebar-foot__link"
+              href="https://dyingangel666.github.io/ng-prism/#/"
+              target="_blank"
+              rel="noopener"
+            >
+              Powered by ng-prism
+            </a>
+          </div>
+        </aside>
+        <div
+          class="prism-resizer-col"
+          prismResizer
+          axis="x"
+          [min]="200"
+          [max]="360"
+          [value]="layout.sidebarWidth()"
+          (valueChange)="layout.setSidebarWidth($event)"
+        ></div>
+        }
 
-      <main class="prism-shell__main">
-        @if (navigationService.activeComponent()) {
-          @if (viewPanels().length > 0) {
-            <prism-view-tab-bar class="prism-shell__view-bar" />
+        <main
+          class="prism-main"
+          [style.--ph.px]="showPanel() ? layout.panelHeight() : 0"
+        >
+          @if (navigationService.activeComponent()) { @if (viewPanels().length >
+          0) {
+          <prism-view-tab-bar class="prism-main__view-bar" />
+          } @if (panelService.activeViewId() === 'renderer') { @if
+          (layout.toolbarVisible()) {
+          <prism-component-head />
+          <prism-variant-ribbon />
           }
-
-          @if (panelService.activeViewId() === 'renderer') {
-            @if (layout.toolbarVisible()) {
-              <prism-component-header class="prism-shell__toolbar" />
-            }
-            <prism-renderer class="prism-shell__canvas" />
+          <div class="prism-canvas-wrap">
+            <prism-canvas-toolbar />
+            <prism-renderer />
+          </div>
+          <prism-code-drawer class="prism-main__code-drawer" />
+          } @else {
+          <prism-view-panel-host class="prism-main__canvas" />
+          } @if (showPanel()) {
+          <div
+            class="prism-resizer-row"
+            prismResizer
+            axis="y"
+            [min]="200"
+            [max]="560"
+            [value]="layout.panelHeight()"
+            (valueChange)="layout.setPanelHeight($event)"
+          ></div>
+          <div class="prism-main__panel">
+            <prism-panel-host />
+          </div>
+          } } @else if (navigationService.activePage()) {
+          <prism-page-renderer class="prism-main__canvas" />
           } @else {
-            <prism-view-panel-host class="prism-shell__canvas" />
-          }
-        } @else if (navigationService.activePage()) {
-          <prism-page-renderer class="prism-shell__canvas" />
-        } @else {
           <div class="prism-shell__empty">
-            <div class="prism-shell__empty-inner">
-              <svg class="prism-shell__empty-icon" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-                <path d="M12 2L4 14h16L12 2z" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round"/>
-                <path d="M4 14l4 8h8l4-8" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round"/>
-              </svg>
-              <p class="prism-shell__empty-text">Select a component</p>
-              <p class="prism-shell__empty-hint">from the sidebar to preview it here</p>
-            </div>
+            <svg
+              class="prism-shell__empty-icon"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="1.5"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+            >
+              <path d="M12 2L4 14h16L12 2z" />
+              <path d="M4 14l4 8h8l4-8" />
+            </svg>
+            <p class="prism-shell__empty-text">Select a component</p>
+            <p class="prism-shell__empty-hint">
+              from the sidebar to preview it here
+            </p>
           </div>
-        }
-      </main>
-
-      @if (layout.addonsVisible() && panelService.activeViewId() === 'renderer' && !navigationService.activePage()) {
-        <div
-          class="prism-shell__panel-handle"
-          (mousedown)="startPanelResize($event)"
-        ></div>
-        <div class="prism-shell__panel">
-          <prism-panel-host />
-        </div>
-      }
+          }
+        </main>
+      </div>
     </div>
-  `, styles: ["\n    :host { display: block; height: 100%; }\n\n    .prism-shell {\n      display: grid;\n      height: 100%;\n      font-family: var(--prism-font-sans);\n      color: var(--prism-text);\n      background: var(--prism-bg);\n      overflow: hidden;\n\n      grid-template-columns: var(--sw) 4px 1fr;\n      grid-template-rows: var(--prism-header-height) 1fr 4px var(--ph);\n      grid-template-areas:\n        \"header  header  header\"\n        \"sidebar shdrag  main\"\n        \"sidebar shdrag  phdrag\"\n        \"sidebar shdrag  panel\";\n    }\n\n    .prism-shell[data-sidebar=\"hidden\"] {\n      grid-template-columns: 0 0 1fr;\n    }\n\n    .prism-shell[data-addons=\"hidden\"] {\n      grid-template-rows: var(--prism-header-height) 1fr;\n      grid-template-areas:\n        \"header  header  header\"\n        \"sidebar shdrag  main\";\n    }\n\n    .prism-shell[data-orientation=\"right\"][data-addons=\"visible\"] {\n      grid-template-columns: var(--sw) 4px 1fr 4px var(--pw);\n      grid-template-rows: var(--prism-header-height) 1fr;\n      grid-template-areas:\n        \"header  header  header  header  header\"\n        \"sidebar shdrag  main    phdrag  panel\";\n    }\n\n    .prism-shell__header  { grid-area: header; }\n    .prism-shell__sidebar { grid-area: sidebar; overflow: hidden; min-width: 0; background: var(--prism-bg); }\n    .prism-shell__main    { grid-area: main; display: flex; flex-direction: column; overflow: hidden; min-height: 0; }\n    .prism-shell__panel   { grid-area: panel; overflow: hidden; min-height: 0; min-width: 0; }\n\n    .prism-shell__sidebar-handle {\n      grid-area: shdrag;\n      cursor: col-resize;\n      background: transparent;\n      transition: background 0.15s;\n      z-index: 10;\n    }\n    .prism-shell__sidebar-handle:hover { background: var(--prism-border); }\n\n    .prism-shell__panel-handle {\n      grid-area: phdrag;\n      background: transparent;\n      transition: background 0.15s;\n      z-index: 10;\n      cursor: row-resize;\n    }\n    .prism-shell__panel-handle:hover { background: var(--prism-border); }\n\n    .prism-shell[data-orientation=\"right\"] .prism-shell__panel-handle {\n      cursor: col-resize;\n    }\n\n    .prism-shell__view-bar { flex-shrink: 0; }\n    .prism-shell__toolbar { flex-shrink: 0; }\n    .prism-shell__canvas  { flex: 1; overflow: auto; min-height: 0; }\n\n    .prism-shell__empty {\n      flex: 1;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n    }\n    .prism-shell__empty-inner {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      gap: 8px;\n      text-align: center;\n    }\n    .prism-shell__empty-icon {\n      width: 48px;\n      height: 48px;\n      color: var(--prism-text-ghost);\n      margin-bottom: 8px;\n    }\n    .prism-shell__empty-text {\n      margin: 0;\n      font-size: 14px;\n      font-weight: 500;\n      color: var(--prism-text-muted);\n    }\n    .prism-shell__empty-hint {\n      margin: 0;\n      font-size: 13px;\n      color: var(--prism-text-ghost);\n    }\n\n    .prism-shell__powered-by {\n      grid-area: sidebar;\n      align-self: end;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      padding: 10px 16px;\n      font-size: 11px;\n      color: var(--prism-text-ghost);\n      font-family: var(--prism-font-sans);\n      border-right: 1px solid var(--prism-border);\n      background: var(--prism-bg);\n      pointer-events: none;\n      user-select: none;\n    }\n\n    .prism-shell__powered-by-icon {\n      width: 14px;\n      height: 14px;\n      flex-shrink: 0;\n    }\n\n    .prism-shell[data-sidebar=\"hidden\"] .prism-shell__powered-by {\n      display: none;\n    }\n  "] }]
+  `, styles: ["\n    :host { display: block; height: 100%; }\n\n    .prism-shell {\n      height: 100vh;\n      display: grid;\n      grid-template-rows: 52px 1fr;\n      background: var(--prism-void);\n      font-family: var(--font-sans, var(--prism-font-sans));\n      color: var(--prism-text);\n      overflow: hidden;\n    }\n\n    .prism-body {\n      display: grid;\n      grid-template-columns: var(--sw, 264px) 4px 1fr;\n      min-height: 0;\n    }\n    .prism-body--no-sidebar {\n      grid-template-columns: 1fr;\n    }\n\n    .prism-sidebar-wrap {\n      background: var(--prism-bg);\n      border-right: 1px solid var(--prism-border);\n      display: flex;\n      flex-direction: column;\n      min-height: 0;\n      overflow: hidden;\n    }\n\n    .prism-sidebar-wrap prism-sidebar {\n      flex: 1;\n      min-height: 0;\n    }\n\n    .prism-sidebar-foot {\n      border-top: 1px solid var(--prism-border);\n      padding: 10px 14px;\n      font-size: 11px;\n      color: var(--prism-text-ghost);\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n    .prism-sidebar-foot__logo {\n      width: 16px;\n      flex-shrink: 0;\n    }\n    .prism-sidebar-foot__link {\n      color: var(--prism-text-ghost);\n      text-decoration: none;\n      transition: color var(--dur-fast);\n    }\n    .prism-sidebar-foot__link:hover {\n      color: var(--prism-text-2);\n    }\n\n    .prism-resizer-col {\n      width: 4px;\n      background: transparent;\n      transition: background var(--dur-fast) var(--ease-default);\n      position: relative;\n      z-index: 5;\n    }\n    .prism-resizer-col:hover,\n    .prism-resizer-col.active {\n      background: var(--prism-primary);\n    }\n\n    .prism-main {\n      display: flex;\n      flex-direction: column;\n      min-height: 0;\n      background: var(--prism-void);\n      overflow: hidden;\n    }\n\n    .prism-resizer-row {\n      flex-shrink: 0;\n      height: 4px;\n      background: transparent;\n      transition: background var(--dur-fast) var(--ease-default);\n      position: relative;\n      z-index: 5;\n    }\n    .prism-resizer-row:hover,\n    .prism-resizer-row.active {\n      background: var(--prism-primary);\n    }\n\n    .prism-canvas-wrap {\n      flex: 1;\n      min-height: 0;\n      display: grid;\n      grid-template-rows: auto minmax(0, 1fr);\n      background: var(--prism-bg-surface);\n      overflow: hidden;\n    }\n    .prism-main__code-drawer { flex-shrink: 0; }\n    .prism-main__view-bar { flex-shrink: 0; }\n    .prism-main__canvas { flex: 1; min-height: 0; overflow: auto; }\n\n    .prism-main__panel {\n      height: var(--ph, 260px);\n      flex-shrink: 0;\n      overflow: hidden;\n      min-height: 0;\n    }\n\n    .prism-shell__empty {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      gap: 8px;\n      grid-row: 1 / -1;\n    }\n    .prism-shell__empty-icon {\n      width: 48px;\n      height: 48px;\n      color: var(--prism-text-ghost);\n      margin-bottom: 8px;\n    }\n    .prism-shell__empty-text {\n      margin: 0;\n      font-size: var(--fs-xl);\n      font-weight: 500;\n      color: var(--prism-text-muted);\n    }\n    .prism-shell__empty-hint {\n      margin: 0;\n      font-size: var(--fs-lg);\n      color: var(--prism-text-ghost);\n    }\n  "] }]
     }], () => [], { onKeyDown: [{
             type: HostListener,
             args: ['document:keydown', ['$event']]
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismShellComponent, { className: "PrismShellComponent", filePath: "app/shell/prism-shell.component.ts", lineNumber: 229 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismShellComponent, { className: "PrismShellComponent", filePath: "app/shell/prism-shell.component.ts", lineNumber: 283 }); })();

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

@@ -1,26 +1,32 @@
 import type { NavigationItem } from '../services/navigation-item.types.js';
 import { PrismNavigationService } from '../services/prism-navigation.service.js';
+import { PrismSearchService } from '../services/prism-search.service.js';
 import * as i0 from "@angular/core";
 interface SidebarCategory {
     name: string;
+    color: string;
     items: NavigationItem[];
 }
-interface SidebarGroup {
-    name: string | null;
-    categories: SidebarCategory[];
-}
 export declare class PrismSidebarComponent {
     protected readonly navigationService: PrismNavigationService;
-    private readonly expandedSet;
-    protected readonly groups: import("@angular/core").Signal<SidebarGroup[]>;
-    protected isExpanded(key: string, index: number): boolean;
-    protected toggle(key: string, index: number): void;
+    protected readonly searchService: PrismSearchService;
+    private readonly manifestService;
+    private readonly collapsedSet;
+    protected readonly totalPages: import("@angular/core").Signal<number>;
+    protected readonly pageCategories: import("@angular/core").Signal<SidebarCategory[]>;
+    protected readonly componentCategories: import("@angular/core").Signal<SidebarCategory[]>;
+    protected readonly stats: import("@angular/core").Signal<{
+        components: number;
+        variants: number;
+    }>;
+    protected isCollapsed(key: string): boolean;
+    protected toggleCollapse(key: string): void;
     protected itemKey(item: NavigationItem): string;
     protected itemLabel(item: NavigationItem): string;
     protected isActive(item: NavigationItem): boolean;
     protected onSelect(item: NavigationItem): void;
-    private loadExpanded;
-    private saveExpanded;
+    private loadCollapsed;
+    private saveCollapsed;
     static ɵfac: i0.ɵɵFactoryDeclaration<PrismSidebarComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<PrismSidebarComponent, "prism-sidebar", never, {}, {}, never, never, true, never>;
 }

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

@@ -1 +1 @@
-{"version":3,"file":"prism-sidebar.component.d.ts","sourceRoot":"","sources":["../../../src/app/sidebar/prism-sidebar.component.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AAC3E,OAAO,EAAE,sBAAsB,EAAE,MAAM,yCAAyC,CAAC;;AAIjF,UAAU,eAAe;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,cAAc,EAAE,CAAC;CACzB;AAED,UAAU,YAAY;IACpB,IAAI,EAAE,MAAM,GAAG,IAAI,CAAC;IACpB,UAAU,EAAE,eAAe,EAAE,CAAC;CAC/B;AAED,qBA2Na,qBAAqB;IAChC,SAAS,CAAC,QAAQ,CAAC,iBAAiB,yBAAkC;IAEtE,OAAO,CAAC,QAAQ,CAAC,WAAW,CAA4C;IAExE,SAAS,CAAC,QAAQ,CAAC,MAAM,iDAgCtB;IAEH,SAAS,CAAC,UAAU,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,OAAO;IAOzD,SAAS,CAAC,MAAM,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,IAAI;IAoBlD,SAAS,CAAC,OAAO,CAAC,IAAI,EAAE,cAAc,GAAG,MAAM;IAM/C,SAAS,CAAC,SAAS,CAAC,IAAI,EAAE,cAAc,GAAG,MAAM;IAMjD,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,cAAc,GAAG,OAAO;IASjD,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,cAAc,GAAG,IAAI;IAQ9C,OAAO,CAAC,YAAY;IASpB,OAAO,CAAC,YAAY;yCAxGT,qBAAqB;2CAArB,qBAAqB;CA6GjC"}
+{"version":3,"file":"prism-sidebar.component.d.ts","sourceRoot":"","sources":["../../../src/app/sidebar/prism-sidebar.component.ts"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AAC3E,OAAO,EAAE,sBAAsB,EAAE,MAAM,yCAAyC,CAAC;AACjF,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;;AAwBzE,UAAU,eAAe;IACvB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,cAAc,EAAE,CAAC;CACzB;AAED,qBA6Ta,qBAAqB;IAChC,SAAS,CAAC,QAAQ,CAAC,iBAAiB,yBAAkC;IACtE,SAAS,CAAC,QAAQ,CAAC,aAAa,qBAA8B;IAC9D,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAgC;IAEhE,OAAO,CAAC,QAAQ,CAAC,YAAY,CAA6C;IAE1E,SAAS,CAAC,QAAQ,CAAC,UAAU,yCAE1B;IAEH,SAAS,CAAC,QAAQ,CAAC,cAAc,oDAc9B;IAEH,SAAS,CAAC,QAAQ,CAAC,mBAAmB,oDAanC;IAEH,SAAS,CAAC,QAAQ,CAAC,KAAK;;;OAQrB;IAEH,SAAS,CAAC,WAAW,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO;IAI3C,SAAS,CAAC,cAAc,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAU3C,SAAS,CAAC,OAAO,CAAC,IAAI,EAAE,cAAc,GAAG,MAAM;IAM/C,SAAS,CAAC,SAAS,CAAC,IAAI,EAAE,cAAc,GAAG,MAAM;IAMjD,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,cAAc,GAAG,OAAO;IAWjD,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,cAAc,GAAG,IAAI;IAQ9C,OAAO,CAAC,aAAa;IASrB,OAAO,CAAC,aAAa;yCA1GV,qBAAqB;2CAArB,qBAAqB;CA+GjC"}