@ng-prism/core 22.2.0-beta.5 → 22.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (119) hide show
  1. package/dist/app/canvas/canvas-bg.styles.d.ts +19 -0
  2. package/dist/app/canvas/canvas-bg.styles.d.ts.map +1 -0
  3. package/dist/app/canvas/canvas-bg.styles.js +58 -0
  4. package/dist/app/canvas/prism-canvas-bg-pill.component.d.ts.map +1 -1
  5. package/dist/app/canvas/prism-canvas-bg-pill.component.js +3 -3
  6. package/dist/app/canvas/prism-canvas-toolbar.component.d.ts +25 -7
  7. package/dist/app/canvas/prism-canvas-toolbar.component.d.ts.map +1 -1
  8. package/dist/app/canvas/prism-canvas-toolbar.component.js +152 -121
  9. package/dist/app/canvas/prism-template-popover.component.d.ts +0 -3
  10. package/dist/app/canvas/prism-template-popover.component.d.ts.map +1 -1
  11. package/dist/app/canvas/prism-template-popover.component.js +43 -59
  12. package/dist/app/component-head/head-metrics.d.ts +41 -0
  13. package/dist/app/component-head/head-metrics.d.ts.map +1 -0
  14. package/dist/app/component-head/head-metrics.js +39 -0
  15. package/dist/app/component-head/prism-component-head.component.d.ts +10 -2
  16. package/dist/app/component-head/prism-component-head.component.d.ts.map +1 -1
  17. package/dist/app/component-head/prism-component-head.component.js +107 -209
  18. package/dist/app/component-head/prism-head-gauge.component.d.ts +23 -0
  19. package/dist/app/component-head/prism-head-gauge.component.d.ts.map +1 -0
  20. package/dist/app/component-head/prism-head-gauge.component.js +123 -0
  21. package/dist/app/component-head/prism-head-info.component.d.ts +23 -0
  22. package/dist/app/component-head/prism-head-info.component.d.ts.map +1 -0
  23. package/dist/app/component-head/prism-head-info.component.js +124 -0
  24. package/dist/app/component-head/prism-stat.component.d.ts +10 -4
  25. package/dist/app/component-head/prism-stat.component.d.ts.map +1 -1
  26. package/dist/app/component-head/prism-stat.component.js +34 -44
  27. package/dist/app/header/prism-header.component.js +2 -2
  28. package/dist/app/icons/icon-registry.d.ts.map +1 -1
  29. package/dist/app/icons/icon-registry.js +2 -0
  30. package/dist/app/index.d.ts +3 -1
  31. package/dist/app/index.d.ts.map +1 -1
  32. package/dist/app/index.js +26 -1
  33. package/dist/app/layout-menu/prism-layout-menu.component.js +2 -2
  34. package/dist/app/overview/overview-panel.d.ts +3 -0
  35. package/dist/app/overview/overview-panel.d.ts.map +1 -0
  36. package/dist/app/overview/overview-panel.js +9 -0
  37. package/dist/app/overview/overview-visibility.d.ts +15 -0
  38. package/dist/app/overview/overview-visibility.d.ts.map +1 -0
  39. package/dist/app/overview/overview-visibility.js +18 -0
  40. package/dist/app/overview/prism-overview-cell.component.d.ts +29 -0
  41. package/dist/app/overview/prism-overview-cell.component.d.ts.map +1 -0
  42. package/dist/app/overview/prism-overview-cell.component.js +136 -0
  43. package/dist/app/overview/prism-overview.component.d.ts +17 -0
  44. package/dist/app/overview/prism-overview.component.d.ts.map +1 -0
  45. package/dist/app/overview/prism-overview.component.js +53 -0
  46. package/dist/app/page-renderer/prism-page-renderer.component.d.ts.map +1 -1
  47. package/dist/app/page-renderer/prism-page-renderer.component.js +3 -3
  48. package/dist/app/panels/a11y/a11y-header-badge.component.d.ts.map +1 -1
  49. package/dist/app/panels/a11y/a11y-header-badge.component.js +21 -30
  50. package/dist/app/panels/builtin-panels.d.ts.map +1 -1
  51. package/dist/app/panels/builtin-panels.js +2 -0
  52. package/dist/app/panels/panel-host/prism-panel-host.component.d.ts.map +1 -1
  53. package/dist/app/panels/panel-host/prism-panel-host.component.js +15 -11
  54. package/dist/app/renderer/prism-renderer.component.d.ts +0 -1
  55. package/dist/app/renderer/prism-renderer.component.d.ts.map +1 -1
  56. package/dist/app/renderer/prism-renderer.component.js +9 -71
  57. package/dist/app/renderer/projectable-content.d.ts +10 -0
  58. package/dist/app/renderer/projectable-content.d.ts.map +1 -0
  59. package/dist/app/renderer/projectable-content.js +60 -0
  60. package/dist/app/services/prism-capture.service.d.ts.map +1 -1
  61. package/dist/app/services/prism-capture.service.js +20 -0
  62. package/dist/app/services/prism-layout.service.d.ts +0 -3
  63. package/dist/app/services/prism-layout.service.d.ts.map +1 -1
  64. package/dist/app/services/prism-layout.service.js +0 -8
  65. package/dist/app/services/prism-panel.service.d.ts +18 -0
  66. package/dist/app/services/prism-panel.service.d.ts.map +1 -1
  67. package/dist/app/services/prism-panel.service.js +28 -0
  68. package/dist/app/shared/prism-metric-badge.component.d.ts +32 -0
  69. package/dist/app/shared/prism-metric-badge.component.d.ts.map +1 -0
  70. package/dist/app/shared/prism-metric-badge.component.js +70 -0
  71. package/dist/app/shell/prism-shell.component.d.ts +0 -1
  72. package/dist/app/shell/prism-shell.component.d.ts.map +1 -1
  73. package/dist/app/shell/prism-shell.component.js +56 -48
  74. package/dist/app/sidebar/navigation-decorations.d.ts +6 -3
  75. package/dist/app/sidebar/navigation-decorations.d.ts.map +1 -1
  76. package/dist/app/sidebar/navigation-decorations.js +7 -4
  77. package/dist/app/sidebar/prism-sidebar.component.d.ts +11 -7
  78. package/dist/app/sidebar/prism-sidebar.component.d.ts.map +1 -1
  79. package/dist/app/sidebar/prism-sidebar.component.js +61 -83
  80. package/dist/app/theme/prism-default-theme.d.ts.map +1 -1
  81. package/dist/app/theme/prism-default-theme.js +44 -4
  82. package/dist/app/variant-ribbon/prism-variant-ribbon.component.d.ts +4 -1
  83. package/dist/app/variant-ribbon/prism-variant-ribbon.component.d.ts.map +1 -1
  84. package/dist/app/variant-ribbon/prism-variant-ribbon.component.js +13 -26
  85. package/dist/app/variant-ribbon/spectrum.d.ts +19 -0
  86. package/dist/app/variant-ribbon/spectrum.d.ts.map +1 -0
  87. package/dist/app/variant-ribbon/spectrum.js +15 -0
  88. package/dist/app/view-tab-bar/next-view-id.d.ts +12 -0
  89. package/dist/app/view-tab-bar/next-view-id.d.ts.map +1 -0
  90. package/dist/app/view-tab-bar/next-view-id.js +16 -0
  91. package/dist/app/view-tab-bar/prism-view-panel-host.component.d.ts +0 -1
  92. package/dist/app/view-tab-bar/prism-view-panel-host.component.d.ts.map +1 -1
  93. package/dist/app/view-tab-bar/prism-view-panel-host.component.js +10 -11
  94. package/dist/app/view-tab-bar/prism-view-tab-bar.component.d.ts +0 -1
  95. package/dist/app/view-tab-bar/prism-view-tab-bar.component.d.ts.map +1 -1
  96. package/dist/app/view-tab-bar/prism-view-tab-bar.component.js +6 -13
  97. package/dist/transformer/cli.js +0 -0
  98. package/package.json +1 -1
  99. package/dist/app/canvas/prism-code-drawer.component.d.ts +0 -14
  100. package/dist/app/canvas/prism-code-drawer.component.d.ts.map +0 -1
  101. package/dist/app/canvas/prism-code-drawer.component.js +0 -116
  102. package/dist/app/component-header/prism-component-header.component.d.ts +0 -8
  103. package/dist/app/component-header/prism-component-header.component.d.ts.map +0 -1
  104. package/dist/app/component-header/prism-component-header.component.js +0 -77
  105. package/dist/cli/audit-a11y/aggregator.d.ts +0 -10
  106. package/dist/cli/audit-a11y/aggregator.d.ts.map +0 -1
  107. package/dist/cli/audit-a11y/aggregator.js +0 -64
  108. package/dist/cli/audit-a11y/auditor.d.ts +0 -14
  109. package/dist/cli/audit-a11y/auditor.d.ts.map +0 -1
  110. package/dist/cli/audit-a11y/auditor.js +0 -104
  111. package/dist/cli/audit-a11y/cli.d.ts +0 -3
  112. package/dist/cli/audit-a11y/cli.d.ts.map +0 -1
  113. package/dist/cli/audit-a11y/cli.js +0 -143
  114. package/dist/cli/audit-a11y/index.d.ts +0 -4
  115. package/dist/cli/audit-a11y/index.d.ts.map +0 -1
  116. package/dist/cli/audit-a11y/index.js +0 -3
  117. package/dist/cli/audit-a11y/static-server.d.ts +0 -11
  118. package/dist/cli/audit-a11y/static-server.d.ts.map +0 -1
  119. package/dist/cli/audit-a11y/static-server.js +0 -61
@@ -0,0 +1,19 @@
1
+ /** Where one variant tab sits on the spectrum rail. */
2
+ export interface SpectrumSlot {
3
+ /** Zero-based position. */
4
+ i: number;
5
+ /** Total positions, never below 2. */
6
+ n: number;
7
+ }
8
+ /**
9
+ * Maps a variant's index onto the spectrum rail.
10
+ *
11
+ * The CSS reads `calc(var(--i) / (var(--n) - 1) * 100%)`, so n = 1 would
12
+ * divide by zero — and an invalid calc() drops the whole declaration rather
13
+ * than falling back to a sane default, leaving the result dependent on
14
+ * whatever else happens to target background-position. Reporting a floor of 2
15
+ * keeps the arithmetic defined and parks a lone variant at the start of the
16
+ * spectrum, which is also what it should look like.
17
+ */
18
+ export declare function spectrumSlot(index: number, count: number): SpectrumSlot;
19
+ //# sourceMappingURL=spectrum.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"spectrum.d.ts","sourceRoot":"","sources":["../../../src/app/variant-ribbon/spectrum.ts"],"names":[],"mappings":"AAAA,uDAAuD;AACvD,MAAM,WAAW,YAAY;IAC3B,2BAA2B;IAC3B,CAAC,EAAE,MAAM,CAAC;IACV,sCAAsC;IACtC,CAAC,EAAE,MAAM,CAAC;CACX;AAED;;;;;;;;;GASG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,YAAY,CAIvE"}
@@ -0,0 +1,15 @@
1
+ /**
2
+ * Maps a variant's index onto the spectrum rail.
3
+ *
4
+ * The CSS reads `calc(var(--i) / (var(--n) - 1) * 100%)`, so n = 1 would
5
+ * divide by zero — and an invalid calc() drops the whole declaration rather
6
+ * than falling back to a sane default, leaving the result dependent on
7
+ * whatever else happens to target background-position. Reporting a floor of 2
8
+ * keeps the arithmetic defined and parks a lone variant at the start of the
9
+ * spectrum, which is also what it should look like.
10
+ */
11
+ export function spectrumSlot(index, count) {
12
+ const n = count < 2 ? 2 : count;
13
+ const i = index < 0 ? 0 : index > n - 1 ? n - 1 : index;
14
+ return { i, n };
15
+ }
@@ -0,0 +1,12 @@
1
+ import type { PanelDefinition } from '../../plugin/plugin.types.js';
2
+ /**
3
+ * The view to switch to, or `null` when the active one still stands.
4
+ *
5
+ * A view survives a component switch for as long as the new component still
6
+ * offers it — that is the whole rule. `renderer` needs no check of its own
7
+ * because it is the one view every component has: there is no `isVisible` for
8
+ * the Playground, so it can never drop out of the visible list and never
9
+ * needs a fallback away from itself.
10
+ */
11
+ export declare function nextViewId(activeViewId: string, visibleViewPanels: readonly PanelDefinition[]): string | null;
12
+ //# sourceMappingURL=next-view-id.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"next-view-id.d.ts","sourceRoot":"","sources":["../../../src/app/view-tab-bar/next-view-id.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAEpE;;;;;;;;GAQG;AACH,wBAAgB,UAAU,CACxB,YAAY,EAAE,MAAM,EACpB,iBAAiB,EAAE,SAAS,eAAe,EAAE,GAC5C,MAAM,GAAG,IAAI,CAKf"}
@@ -0,0 +1,16 @@
1
+ /**
2
+ * The view to switch to, or `null` when the active one still stands.
3
+ *
4
+ * A view survives a component switch for as long as the new component still
5
+ * offers it — that is the whole rule. `renderer` needs no check of its own
6
+ * because it is the one view every component has: there is no `isVisible` for
7
+ * the Playground, so it can never drop out of the visible list and never
8
+ * needs a fallback away from itself.
9
+ */
10
+ export function nextViewId(activeViewId, visibleViewPanels) {
11
+ if (activeViewId === 'renderer')
12
+ return null;
13
+ return visibleViewPanels.some((p) => p.id === activeViewId)
14
+ ? null
15
+ : 'renderer';
16
+ }
@@ -2,7 +2,6 @@ import { EnvironmentInjector, OnDestroy, type Type } from '@angular/core';
2
2
  import { PrismPanelService } from '../services/prism-panel.service.js';
3
3
  import * as i0 from "@angular/core";
4
4
  export declare class PrismViewPanelHostComponent implements OnDestroy {
5
- private readonly pluginService;
6
5
  private readonly nav;
7
6
  protected readonly panelService: PrismPanelService;
8
7
  private readonly envInjector;
@@ -1 +1 @@
1
- {"version":3,"file":"prism-view-panel-host.component.d.ts","sourceRoot":"","sources":["../../../src/app/view-tab-bar/prism-view-panel-host.component.ts"],"names":[],"mappings":"AACA,OAAO,EAA0D,mBAAmB,EAAU,SAAS,EAAU,KAAK,IAAI,EAAE,MAAM,eAAe,CAAC;AAGlJ,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;;AAGvE,qBAqBa,2BAA4B,YAAW,SAAS;IAC3D,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA8B;IAC5D,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAkC;IACtD,SAAS,CAAC,QAAQ,CAAC,YAAY,oBAA6B;IAC5D,OAAO,CAAC,QAAQ,CAAC,WAAW,CAA+B;IAE3D,OAAO,CAAC,QAAQ,CAAC,aAAa,CAG3B;IAEH,SAAS,CAAC,QAAQ,CAAC,iBAAiB,+DAAsC;IAC1E,SAAS,CAAC,QAAQ,CAAC,WAAW;;OAE1B;IAEJ,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAoC;IAC9D,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA0C;IAExE,SAAS,CAAC,QAAQ,CAAC,cAAc,sDAY9B;;IA+BH,WAAW,IAAI,IAAI;yCA9DR,2BAA2B;2CAA3B,2BAA2B;CAiEvC"}
1
+ {"version":3,"file":"prism-view-panel-host.component.d.ts","sourceRoot":"","sources":["../../../src/app/view-tab-bar/prism-view-panel-host.component.ts"],"names":[],"mappings":"AACA,OAAO,EAKL,mBAAmB,EAEnB,SAAS,EAET,KAAK,IAAI,EACV,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;;AAEvE,qBA2Ba,2BAA4B,YAAW,SAAS;IAC3D,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAkC;IACtD,SAAS,CAAC,QAAQ,CAAC,YAAY,oBAA6B;IAC5D,OAAO,CAAC,QAAQ,CAAC,WAAW,CAA+B;IAE3D,OAAO,CAAC,QAAQ,CAAC,aAAa,CAAgC;IAE9D,SAAS,CAAC,QAAQ,CAAC,iBAAiB,+DAAsC;IAC1E,SAAS,CAAC,QAAQ,CAAC,WAAW;;OAE1B;IAEJ,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAoC;IAC9D,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA0C;IAExE,SAAS,CAAC,QAAQ,CAAC,cAAc,sDAgB9B;;IAkCH,WAAW,IAAI,IAAI;yCAjER,2BAA2B;2CAA3B,2BAA2B;CAoEvC"}
@@ -1,9 +1,7 @@
1
1
  import { NgComponentOutlet } from '@angular/common';
2
- import { Component, computed, createEnvironmentInjector, effect, EnvironmentInjector, inject, signal } from '@angular/core';
3
- import { BUILTIN_PANELS } from '../panels/builtin-panels.js';
2
+ import { Component, computed, createEnvironmentInjector, effect, EnvironmentInjector, inject, signal, } from '@angular/core';
4
3
  import { PrismNavigationService } from '../services/prism-navigation.service.js';
5
4
  import { PrismPanelService } from '../services/prism-panel.service.js';
6
- import { PrismPluginService } from '../services/prism-plugin.service.js';
7
5
  import * as i0 from "@angular/core";
8
6
  function PrismViewPanelHostComponent_Conditional_1_ng_container_0_Template(rf, ctx) { if (rf & 1) {
9
7
  i0.ɵɵelementContainer(0);
@@ -15,15 +13,10 @@ function PrismViewPanelHostComponent_Conditional_1_Template(rf, ctx) { if (rf &
15
13
  i0.ɵɵproperty("ngComponentOutlet", ctx_r0.resolvedComponent())("ngComponentOutletInputs", ctx_r0.panelInputs())("ngComponentOutletInjector", ctx_r0.activeInjector());
16
14
  } }
17
15
  export class PrismViewPanelHostComponent {
18
- pluginService = inject(PrismPluginService);
19
16
  nav = inject(PrismNavigationService);
20
17
  panelService = inject(PrismPanelService);
21
18
  envInjector = inject(EnvironmentInjector);
22
- allViewPanels = computed(() => [
23
- ...BUILTIN_PANELS.filter((p) => p.placement === 'view'),
24
- ...this.pluginService.viewPanels(),
25
- ], /* @ts-ignore */
26
- ...(ngDevMode ? [{ debugName: "allViewPanels" }] : /* istanbul ignore next */ []));
19
+ allViewPanels = this.panelService.viewPanels;
27
20
  resolvedComponent = signal(null, /* @ts-ignore */
28
21
  ...(ngDevMode ? [{ debugName: "resolvedComponent" }] : /* istanbul ignore next */ []));
29
22
  panelInputs = computed(() => ({
@@ -86,9 +79,15 @@ export class PrismViewPanelHostComponent {
86
79
  args: [{ selector: 'prism-view-panel-host', standalone: true, imports: [NgComponentOutlet], template: `
87
80
  <div class="prism-view-panel-host">
88
81
  @if (resolvedComponent()) {
89
- <ng-container *ngComponentOutlet="resolvedComponent(); inputs: panelInputs(); injector: activeInjector()" />
82
+ <ng-container
83
+ *ngComponentOutlet="
84
+ resolvedComponent();
85
+ inputs: panelInputs();
86
+ injector: activeInjector()
87
+ "
88
+ />
90
89
  }
91
90
  </div>
92
91
  `, styles: ["\n .prism-view-panel-host {\n display: flex;\n flex-direction: column;\n height: 100%;\n overflow: auto;\n background: var(--prism-bg-elevated);\n }\n "] }]
93
92
  }], () => [], null); })();
94
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismViewPanelHostComponent, { className: "PrismViewPanelHostComponent", filePath: "app/view-tab-bar/prism-view-panel-host.component.ts", lineNumber: 29 }); })();
93
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismViewPanelHostComponent, { className: "PrismViewPanelHostComponent", filePath: "app/view-tab-bar/prism-view-panel-host.component.ts", lineNumber: 43 }); })();
@@ -2,7 +2,6 @@ import { PrismPanelService } from '../services/prism-panel.service.js';
2
2
  import * as i0 from "@angular/core";
3
3
  export declare class PrismViewTabBarComponent {
4
4
  protected readonly panelService: PrismPanelService;
5
- private readonly pluginService;
6
5
  protected readonly viewPanels: import("@angular/core").Signal<import("../../index.js").PanelDefinition[]>;
7
6
  static ɵfac: i0.ɵɵFactoryDeclaration<PrismViewTabBarComponent, never>;
8
7
  static ɵcmp: i0.ɵɵComponentDeclaration<PrismViewTabBarComponent, "prism-view-tab-bar", never, {}, {}, never, never, true, never>;
@@ -1 +1 @@
1
- {"version":3,"file":"prism-view-tab-bar.component.d.ts","sourceRoot":"","sources":["../../../src/app/view-tab-bar/prism-view-tab-bar.component.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;;AAGvE,qBAoEa,wBAAwB;IACnC,SAAS,CAAC,QAAQ,CAAC,YAAY,oBAA6B;IAC5D,OAAO,CAAC,QAAQ,CAAC,aAAa,CAA8B;IAE5D,SAAS,CAAC,QAAQ,CAAC,UAAU,6EAG1B;yCAPQ,wBAAwB;2CAAxB,wBAAwB;CAQpC"}
1
+ {"version":3,"file":"prism-view-tab-bar.component.d.ts","sourceRoot":"","sources":["../../../src/app/view-tab-bar/prism-view-tab-bar.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;;AAEvE,qBAgEa,wBAAwB;IACnC,SAAS,CAAC,QAAQ,CAAC,YAAY,oBAA6B;IAE5D,SAAS,CAAC,QAAQ,CAAC,UAAU,6EAAuC;yCAHzD,wBAAwB;2CAAxB,wBAAwB;CAIpC"}
@@ -1,7 +1,5 @@
1
- import { Component, computed, inject } from '@angular/core';
2
- import { BUILTIN_PANELS } from '../panels/builtin-panels.js';
1
+ import { Component, inject, ChangeDetectionStrategy } from '@angular/core';
3
2
  import { PrismPanelService } from '../services/prism-panel.service.js';
4
- import { PrismPluginService } from '../services/prism-plugin.service.js';
5
3
  import * as i0 from "@angular/core";
6
4
  const _forTrack0 = ($index, $item) => $item.id;
7
5
  function PrismViewTabBarComponent_For_4_Template(rf, ctx) { if (rf & 1) {
@@ -19,12 +17,7 @@ function PrismViewTabBarComponent_For_4_Template(rf, ctx) { if (rf & 1) {
19
17
  } }
20
18
  export class PrismViewTabBarComponent {
21
19
  panelService = inject(PrismPanelService);
22
- pluginService = inject(PrismPluginService);
23
- viewPanels = computed(() => [
24
- ...BUILTIN_PANELS.filter((p) => p.placement === 'view'),
25
- ...this.pluginService.viewPanels(),
26
- ], /* @ts-ignore */
27
- ...(ngDevMode ? [{ debugName: "viewPanels" }] : /* istanbul ignore next */ []));
20
+ viewPanels = this.panelService.visibleViewPanels;
28
21
  static ɵfac = function PrismViewTabBarComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PrismViewTabBarComponent)(); };
29
22
  static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PrismViewTabBarComponent, selectors: [["prism-view-tab-bar"]], decls: 5, vars: 2, consts: [[1, "prism-view-tab-bar"], [1, "prism-view-tab-bar__tab", 3, "click"], [1, "prism-view-tab-bar__tab", 3, "prism-view-tab-bar__tab--active"]], template: function PrismViewTabBarComponent_Template(rf, ctx) { if (rf & 1) {
30
23
  i0.ɵɵdomElementStart(0, "div", 0)(1, "button", 1);
@@ -38,11 +31,11 @@ export class PrismViewTabBarComponent {
38
31
  i0.ɵɵclassProp("prism-view-tab-bar__tab--active", ctx.panelService.activeViewId() === "renderer");
39
32
  i0.ɵɵadvance(2);
40
33
  i0.ɵɵrepeater(ctx.viewPanels());
41
- } }, styles: [".prism-view-tab-bar[_ngcontent-%COMP%] {\n display: flex;\n border-bottom: 1px solid var(--%NS%prism-border);\n padding: 0 8px;\n flex-shrink: 0;\n background: var(--%NS%prism-bg-elevated);\n }\n\n .prism-view-tab-bar__tab[_ngcontent-%COMP%] {\n padding: 9px 14px;\n font-size: 13px;\n font-family: var(--%NS%prism-font-sans);\n border: none;\n background: none;\n color: var(--%NS%prism-text-muted);\n cursor: pointer;\n position: relative;\n margin-bottom: -1px;\n transition: color 0.12s;\n }\n\n .prism-view-tab-bar__tab[_ngcontent-%COMP%]::after {\n content: '';\n position: absolute;\n bottom: 0;\n left: 8px;\n right: 8px;\n height: 2px;\n background: linear-gradient(90deg, var(--%NS%prism-primary-from), var(--%NS%prism-primary-to));\n opacity: 0;\n transition: opacity 0.12s;\n }\n\n .prism-view-tab-bar__tab[_ngcontent-%COMP%]:hover { color: var(--%NS%prism-text-2); }\n\n .prism-view-tab-bar__tab--active[_ngcontent-%COMP%] { color: var(--%NS%prism-primary); font-weight: 500; }\n\n .prism-view-tab-bar__tab--%NS%active[_ngcontent-%COMP%]::after { opacity: 1; }"] });
34
+ } }, styles: ["[_nghost-%COMP%] { display: inline-flex; }\n\n .prism-view-tab-bar[_ngcontent-%COMP%] {\n display: inline-flex;\n gap: 2px;\n padding: 2px;\n border-radius: var(--%NS%radius-sm);\n background: var(--%NS%prism-input-bg);\n }\n\n .prism-view-tab-bar__tab[_ngcontent-%COMP%] {\n padding: 2px var(--%NS%sp-4);\n border: 0;\n border-radius: var(--%NS%radius-xs);\n background: none;\n font-family: var(--%NS%prism-font-sans);\n font-size: var(--%NS%fs-md);\n color: var(--%NS%prism-text-muted);\n cursor: pointer;\n white-space: nowrap;\n transition: color var(--%NS%dur-fast) var(--%NS%ease-default);\n }\n .prism-view-tab-bar__tab[_ngcontent-%COMP%]:hover { color: var(--%NS%prism-text-2); }\n .prism-view-tab-bar__tab[_ngcontent-%COMP%]:focus-visible {\n outline: 2px solid var(--%NS%prism-primary);\n outline-offset: 1px;\n }\n .prism-view-tab-bar__tab--active[_ngcontent-%COMP%] {\n background: var(--%NS%prism-bg-elevated);\n color: var(--%NS%prism-text);\n font-weight: 500;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);\n }"] });
42
35
  }
43
36
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PrismViewTabBarComponent, [{
44
37
  type: Component,
45
- args: [{ selector: 'prism-view-tab-bar', standalone: true, template: `
38
+ args: [{ selector: 'prism-view-tab-bar', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, template: `
46
39
  <div class="prism-view-tab-bar">
47
40
  <button
48
41
  class="prism-view-tab-bar__tab"
@@ -65,6 +58,6 @@ export class PrismViewTabBarComponent {
65
58
  </button>
66
59
  }
67
60
  </div>
68
- `, styles: ["\n .prism-view-tab-bar {\n display: flex;\n border-bottom: 1px solid var(--prism-border);\n padding: 0 8px;\n flex-shrink: 0;\n background: var(--prism-bg-elevated);\n }\n\n .prism-view-tab-bar__tab {\n padding: 9px 14px;\n font-size: 13px;\n font-family: var(--prism-font-sans);\n border: none;\n background: none;\n color: var(--prism-text-muted);\n cursor: pointer;\n position: relative;\n margin-bottom: -1px;\n transition: color 0.12s;\n }\n\n .prism-view-tab-bar__tab::after {\n content: '';\n position: absolute;\n bottom: 0;\n left: 8px;\n right: 8px;\n height: 2px;\n background: linear-gradient(90deg, var(--prism-primary-from), var(--prism-primary-to));\n opacity: 0;\n transition: opacity 0.12s;\n }\n\n .prism-view-tab-bar__tab:hover { color: var(--prism-text-2); }\n\n .prism-view-tab-bar__tab--active { color: var(--prism-primary); font-weight: 500; }\n\n .prism-view-tab-bar__tab--active::after { opacity: 1; }\n "] }]
61
+ `, styles: ["\n :host { display: inline-flex; }\n\n .prism-view-tab-bar {\n display: inline-flex;\n gap: 2px;\n padding: 2px;\n border-radius: var(--radius-sm);\n background: var(--prism-input-bg);\n }\n\n .prism-view-tab-bar__tab {\n padding: 2px var(--sp-4);\n border: 0;\n border-radius: var(--radius-xs);\n background: none;\n font-family: var(--prism-font-sans);\n font-size: var(--fs-md);\n color: var(--prism-text-muted);\n cursor: pointer;\n white-space: nowrap;\n transition: color var(--dur-fast) var(--ease-default);\n }\n .prism-view-tab-bar__tab:hover { color: var(--prism-text-2); }\n .prism-view-tab-bar__tab:focus-visible {\n outline: 2px solid var(--prism-primary);\n outline-offset: 1px;\n }\n .prism-view-tab-bar__tab--active {\n background: var(--prism-bg-elevated);\n color: var(--prism-text);\n font-weight: 500;\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);\n }\n "] }]
69
62
  }], null, null); })();
70
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismViewTabBarComponent, { className: "PrismViewTabBarComponent", filePath: "app/view-tab-bar/prism-view-tab-bar.component.ts", lineNumber: 74 }); })();
63
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismViewTabBarComponent, { className: "PrismViewTabBarComponent", filePath: "app/view-tab-bar/prism-view-tab-bar.component.ts", lineNumber: 68 }); })();
File without changes
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ng-prism/core",
3
- "version": "22.2.0-beta.5",
3
+ "version": "22.2.0",
4
4
  "description": "ng-prism — the Angular-native Storybook alternative. Lightweight component showcase with @Showcase decorator, no story files needed.",
5
5
  "keywords": [
6
6
  "ng-prism",
@@ -1,14 +0,0 @@
1
- import { PrismLayoutService } from '../services/prism-layout.service.js';
2
- import * as i0 from "@angular/core";
3
- export declare class PrismCodeDrawerComponent {
4
- private readonly navigationService;
5
- private readonly rendererService;
6
- protected readonly layoutService: PrismLayoutService;
7
- protected readonly collapsed: import("@angular/core").WritableSignal<boolean>;
8
- protected readonly snippet: import("@angular/core").Signal<string>;
9
- protected readonly highlighted: import("@angular/core").Signal<string>;
10
- protected copy(e: MouseEvent): void;
11
- static ɵfac: i0.ɵɵFactoryDeclaration<PrismCodeDrawerComponent, never>;
12
- static ɵcmp: i0.ɵɵComponentDeclaration<PrismCodeDrawerComponent, "prism-code-drawer", never, {}, {}, never, never, true, never>;
13
- }
14
- //# sourceMappingURL=prism-code-drawer.component.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"prism-code-drawer.component.d.ts","sourceRoot":"","sources":["../../../src/app/canvas/prism-code-drawer.component.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,kBAAkB,EAAE,MAAM,qCAAqC,CAAC;;AAkCzE,qBAuGa,wBAAwB;IACnC,OAAO,CAAC,QAAQ,CAAC,iBAAiB,CAAkC;IACpE,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAgC;IAChE,SAAS,CAAC,QAAQ,CAAC,aAAa,qBAA8B;IAE9D,SAAS,CAAC,QAAQ,CAAC,SAAS,kDAA0C;IAEtE,SAAS,CAAC,QAAQ,CAAC,OAAO,yCAqBvB;IAEH,SAAS,CAAC,QAAQ,CAAC,WAAW,yCAI3B;IAEH,SAAS,CAAC,IAAI,CAAC,CAAC,EAAE,UAAU,GAAG,IAAI;yCApCxB,wBAAwB;2CAAxB,wBAAwB;CAyCpC"}
@@ -1,116 +0,0 @@
1
- import { Component, inject, computed, ChangeDetectionStrategy, } from '@angular/core';
2
- import { PrismIconComponent } from '../icons/prism-icon.component.js';
3
- import { PrismLayoutService } from '../services/prism-layout.service.js';
4
- import { PrismNavigationService } from '../services/prism-navigation.service.js';
5
- import { PrismRendererService } from '../services/prism-renderer.service.js';
6
- import { generateSnippet } from '../renderer/snippet-generator.js';
7
- import * as i0 from "@angular/core";
8
- function esc(s) {
9
- return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
10
- }
11
- function tokenizeXml(code) {
12
- const re = /(\/\/[^\n]*)|(<\/?[\w-]+)|(\[[\w.]+\]|[\w-]+)=|"([^"]*)"|(\/>|>)|(\n)|([^<\["\n/>=]+|[/=])/g;
13
- let out = '';
14
- let m;
15
- while ((m = re.exec(code)) !== null) {
16
- if (m[1] != null) {
17
- out += `<span class="tok-com">${esc(m[1])}</span>`;
18
- }
19
- else if (m[2] != null) {
20
- out += `<span class="tok-tag">${esc(m[2])}</span>`;
21
- }
22
- else if (m[3] != null) {
23
- out += `<span class="tok-attr">${esc(m[3])}</span>=`;
24
- }
25
- else if (m[4] != null) {
26
- out += `"<span class="tok-str">${esc(m[4])}</span>"`;
27
- }
28
- else if (m[5] != null) {
29
- out += `<span class="tok-tag">${esc(m[5])}</span>`;
30
- }
31
- else if (m[6] != null) {
32
- out += '\n';
33
- }
34
- else {
35
- out += esc(m[0]);
36
- }
37
- }
38
- return out;
39
- }
40
- export class PrismCodeDrawerComponent {
41
- navigationService = inject(PrismNavigationService);
42
- rendererService = inject(PrismRendererService);
43
- layoutService = inject(PrismLayoutService);
44
- collapsed = this.layoutService.codeDrawerCollapsed;
45
- snippet = computed(() => {
46
- const comp = this.navigationService.activeComponent();
47
- if (!comp)
48
- return '';
49
- const variant = comp.meta.showcaseConfig.variants?.[this.rendererService.activeVariantIndex()];
50
- const explicitKeys = variant?.inputs
51
- ? new Set(Object.keys(variant.inputs))
52
- : undefined;
53
- const directiveOptions = comp.meta.componentMeta.isDirective
54
- ? { host: comp.meta.showcaseConfig.host }
55
- : undefined;
56
- return generateSnippet(comp.meta.componentMeta.selector, comp.meta.inputs, this.rendererService.inputValues(), explicitKeys, this.rendererService.activeContent(), directiveOptions);
57
- }, ...(ngDevMode ? [{ debugName: "snippet" }] : []));
58
- highlighted = computed(() => {
59
- const code = this.snippet();
60
- if (!code)
61
- return '';
62
- return tokenizeXml(code);
63
- }, ...(ngDevMode ? [{ debugName: "highlighted" }] : []));
64
- copy(e) {
65
- e.stopPropagation();
66
- const code = this.snippet();
67
- if (code)
68
- navigator.clipboard.writeText(code);
69
- }
70
- static ɵfac = function PrismCodeDrawerComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PrismCodeDrawerComponent)(); };
71
- static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PrismCodeDrawerComponent, selectors: [["prism-code-drawer"]], decls: 11, vars: 6, consts: [[1, "code-drawer"], [1, "code-head", 3, "click"], ["name", "chevron-down", 1, "chev", 3, "size"], ["name", "copy", 3, "size"], [1, "code-head-actions"], ["title", "Copy to clipboard", 1, "mini", 3, "click"], [1, "code-body", 3, "innerHTML"]], template: function PrismCodeDrawerComponent_Template(rf, ctx) { if (rf & 1) {
72
- i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
73
- i0.ɵɵlistener("click", function PrismCodeDrawerComponent_Template_div_click_1_listener() { return ctx.layoutService.toggleCodeDrawer(); });
74
- i0.ɵɵelement(2, "prism-icon", 2)(3, "prism-icon", 3);
75
- i0.ɵɵelementStart(4, "span");
76
- i0.ɵɵtext(5, "Angular Template");
77
- i0.ɵɵelementEnd();
78
- i0.ɵɵelementStart(6, "div", 4)(7, "button", 5);
79
- i0.ɵɵlistener("click", function PrismCodeDrawerComponent_Template_button_click_7_listener($event) { return ctx.copy($event); });
80
- i0.ɵɵelement(8, "prism-icon", 3);
81
- i0.ɵɵtext(9, " Copy ");
82
- i0.ɵɵelementEnd()()();
83
- i0.ɵɵelement(10, "pre", 6);
84
- i0.ɵɵelementEnd();
85
- } if (rf & 2) {
86
- i0.ɵɵclassProp("is-collapsed", ctx.collapsed());
87
- i0.ɵɵadvance(2);
88
- i0.ɵɵproperty("size", 12);
89
- i0.ɵɵadvance();
90
- i0.ɵɵproperty("size", 12);
91
- i0.ɵɵadvance(5);
92
- i0.ɵɵproperty("size", 11);
93
- i0.ɵɵadvance(2);
94
- i0.ɵɵproperty("innerHTML", ctx.highlighted(), i0.ɵɵsanitizeHtml);
95
- } }, dependencies: [PrismIconComponent], styles: [".code-drawer[_ngcontent-%COMP%] {\n border-top: 1px solid var(--prism-border);\n background: var(--prism-bg);\n max-height: 260px;\n transition: max-height 0.25s var(--ease-default), opacity var(--dur-base);\n overflow: hidden;\n }\n .code-drawer.is-collapsed[_ngcontent-%COMP%] { max-height: 40px; }\n .code-drawer.is-collapsed[_ngcontent-%COMP%] .code-body[_ngcontent-%COMP%] { opacity: 0; }\n\n .code-head[_ngcontent-%COMP%] {\n display: flex;\n align-items: center;\n gap: 8px;\n height: 40px;\n padding: 0 20px;\n color: var(--prism-text-muted);\n font-size: var(--fs-sm);\n font-weight: 600;\n letter-spacing: 0.04em;\n cursor: pointer;\n border-bottom: 1px solid var(--prism-border);\n background: linear-gradient(180deg, var(--prism-bg-surface), var(--prism-bg));\n }\n .code-head[_ngcontent-%COMP%] > span[_ngcontent-%COMP%]:first-of-type {\n text-transform: uppercase;\n letter-spacing: 0.08em;\n color: var(--prism-text-2);\n }\n .code-head[_ngcontent-%COMP%] .chev[_ngcontent-%COMP%] {\n transition: transform var(--dur-fast);\n }\n .is-collapsed[_ngcontent-%COMP%] .code-head[_ngcontent-%COMP%] .chev[_ngcontent-%COMP%] {\n transform: rotate(-90deg);\n }\n\n .code-head-actions[_ngcontent-%COMP%] {\n margin-left: auto;\n display: flex;\n gap: 2px;\n }\n .mini[_ngcontent-%COMP%] {\n height: 22px;\n padding: 0 8px;\n font-size: 10.5px;\n border-radius: 4px;\n color: var(--prism-text-ghost);\n display: flex;\n align-items: center;\n gap: 4px;\n background: none;\n border: none;\n cursor: pointer;\n font-family: var(--font-sans);\n }\n .mini[_ngcontent-%COMP%]:hover {\n color: var(--prism-text);\n background: var(--prism-input-bg);\n }\n\n .code-body[_ngcontent-%COMP%] {\n margin: 0;\n padding: 12px 20px 16px;\n font-family: var(--font-mono);\n font-size: var(--fs-md);\n line-height: 1.7;\n color: var(--prism-text-2);\n overflow-x: auto;\n transition: opacity var(--dur-base);\n background: var(--prism-bg);\n white-space: pre;\n }\n .code-body[_ngcontent-%COMP%]::-webkit-scrollbar { height: 6px; }\n .code-body[_ngcontent-%COMP%]::-webkit-scrollbar-thumb { background: var(--prism-border-strong); border-radius: 3px; }\n\n [_nghost-%COMP%] .tok-tag { color: var(--prism-code-tag); }\n [_nghost-%COMP%] .tok-attr { color: var(--prism-code-attr); }\n [_nghost-%COMP%] .tok-str { color: var(--prism-code-str); }\n [_nghost-%COMP%] .tok-com { color: var(--prism-code-com); font-style: italic; }"], changeDetection: 0 });
96
- }
97
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PrismCodeDrawerComponent, [{
98
- type: Component,
99
- args: [{ selector: 'prism-code-drawer', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [PrismIconComponent], template: `
100
- <div class="code-drawer" [class.is-collapsed]="collapsed()">
101
- <div class="code-head" (click)="layoutService.toggleCodeDrawer()">
102
- <prism-icon name="chevron-down" [size]="12" class="chev" />
103
- <prism-icon name="copy" [size]="12" />
104
- <span>Angular Template</span>
105
- <div class="code-head-actions">
106
- <button class="mini" (click)="copy($event)" title="Copy to clipboard">
107
- <prism-icon name="copy" [size]="11" />
108
- Copy
109
- </button>
110
- </div>
111
- </div>
112
- <pre class="code-body" [innerHTML]="highlighted()"></pre>
113
- </div>
114
- `, styles: ["\n .code-drawer {\n border-top: 1px solid var(--prism-border);\n background: var(--prism-bg);\n max-height: 260px;\n transition: max-height 0.25s var(--ease-default), opacity var(--dur-base);\n overflow: hidden;\n }\n .code-drawer.is-collapsed { max-height: 40px; }\n .code-drawer.is-collapsed .code-body { opacity: 0; }\n\n .code-head {\n display: flex;\n align-items: center;\n gap: 8px;\n height: 40px;\n padding: 0 20px;\n color: var(--prism-text-muted);\n font-size: var(--fs-sm);\n font-weight: 600;\n letter-spacing: 0.04em;\n cursor: pointer;\n border-bottom: 1px solid var(--prism-border);\n background: linear-gradient(180deg, var(--prism-bg-surface), var(--prism-bg));\n }\n .code-head > span:first-of-type {\n text-transform: uppercase;\n letter-spacing: 0.08em;\n color: var(--prism-text-2);\n }\n .code-head .chev {\n transition: transform var(--dur-fast);\n }\n .is-collapsed .code-head .chev {\n transform: rotate(-90deg);\n }\n\n .code-head-actions {\n margin-left: auto;\n display: flex;\n gap: 2px;\n }\n .mini {\n height: 22px;\n padding: 0 8px;\n font-size: 10.5px;\n border-radius: 4px;\n color: var(--prism-text-ghost);\n display: flex;\n align-items: center;\n gap: 4px;\n background: none;\n border: none;\n cursor: pointer;\n font-family: var(--font-sans);\n }\n .mini:hover {\n color: var(--prism-text);\n background: var(--prism-input-bg);\n }\n\n .code-body {\n margin: 0;\n padding: 12px 20px 16px;\n font-family: var(--font-mono);\n font-size: var(--fs-md);\n line-height: 1.7;\n color: var(--prism-text-2);\n overflow-x: auto;\n transition: opacity var(--dur-base);\n background: var(--prism-bg);\n white-space: pre;\n }\n .code-body::-webkit-scrollbar { height: 6px; }\n .code-body::-webkit-scrollbar-thumb { background: var(--prism-border-strong); border-radius: 3px; }\n\n :host ::ng-deep .tok-tag { color: var(--prism-code-tag); }\n :host ::ng-deep .tok-attr { color: var(--prism-code-attr); }\n :host ::ng-deep .tok-str { color: var(--prism-code-str); }\n :host ::ng-deep .tok-com { color: var(--prism-code-com); font-style: italic; }\n "] }]
115
- }], null, null); })();
116
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismCodeDrawerComponent, { className: "PrismCodeDrawerComponent", filePath: "app/canvas/prism-code-drawer.component.ts", lineNumber: 145 }); })();
@@ -1,8 +0,0 @@
1
- import { PrismNavigationService } from '../services/prism-navigation.service.js';
2
- import * as i0 from "@angular/core";
3
- export declare class PrismComponentHeaderComponent {
4
- protected readonly navigationService: PrismNavigationService;
5
- static ɵfac: i0.ɵɵFactoryDeclaration<PrismComponentHeaderComponent, never>;
6
- static ɵcmp: i0.ɵɵComponentDeclaration<PrismComponentHeaderComponent, "prism-component-header", never, {}, {}, never, never, true, never>;
7
- }
8
- //# sourceMappingURL=prism-component-header.component.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"prism-component-header.component.d.ts","sourceRoot":"","sources":["../../../src/app/component-header/prism-component-header.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,sBAAsB,EAAE,MAAM,yCAAyC,CAAC;;AAEjF,qBAkEa,6BAA6B;IACxC,SAAS,CAAC,QAAQ,CAAC,iBAAiB,yBAAkC;yCAD3D,6BAA6B;2CAA7B,6BAA6B;CAEzC"}
@@ -1,77 +0,0 @@
1
- import { Component, inject } from '@angular/core';
2
- import { PrismNavigationService } from '../services/prism-navigation.service.js';
3
- import * as i0 from "@angular/core";
4
- function PrismComponentHeaderComponent_Conditional_0_Conditional_3_Template(rf, ctx) { if (rf & 1) {
5
- i0.ɵɵdomElementStart(0, "p", 2);
6
- i0.ɵɵtext(1);
7
- i0.ɵɵdomElementEnd();
8
- } if (rf & 2) {
9
- const comp_r1 = i0.ɵɵnextContext();
10
- i0.ɵɵadvance();
11
- i0.ɵɵtextInterpolate(comp_r1.meta.showcaseConfig.description);
12
- } }
13
- function PrismComponentHeaderComponent_Conditional_0_Conditional_4_For_2_Template(rf, ctx) { if (rf & 1) {
14
- i0.ɵɵdomElementStart(0, "span", 4);
15
- i0.ɵɵtext(1);
16
- i0.ɵɵdomElementEnd();
17
- } if (rf & 2) {
18
- const tag_r2 = ctx.$implicit;
19
- i0.ɵɵadvance();
20
- i0.ɵɵtextInterpolate(tag_r2);
21
- } }
22
- function PrismComponentHeaderComponent_Conditional_0_Conditional_4_Template(rf, ctx) { if (rf & 1) {
23
- i0.ɵɵdomElementStart(0, "div", 3);
24
- i0.ɵɵrepeaterCreate(1, PrismComponentHeaderComponent_Conditional_0_Conditional_4_For_2_Template, 2, 1, "span", 4, i0.ɵɵrepeaterTrackByIdentity);
25
- i0.ɵɵdomElementEnd();
26
- } if (rf & 2) {
27
- const comp_r1 = i0.ɵɵnextContext();
28
- i0.ɵɵadvance();
29
- i0.ɵɵrepeater(comp_r1.meta.showcaseConfig.tags);
30
- } }
31
- function PrismComponentHeaderComponent_Conditional_0_Template(rf, ctx) { if (rf & 1) {
32
- i0.ɵɵdomElementStart(0, "div", 0)(1, "h2", 1);
33
- i0.ɵɵtext(2);
34
- i0.ɵɵdomElementEnd();
35
- i0.ɵɵconditionalCreate(3, PrismComponentHeaderComponent_Conditional_0_Conditional_3_Template, 2, 1, "p", 2);
36
- i0.ɵɵconditionalCreate(4, PrismComponentHeaderComponent_Conditional_0_Conditional_4_Template, 3, 0, "div", 3);
37
- i0.ɵɵdomElementEnd();
38
- } if (rf & 2) {
39
- const comp_r1 = ctx;
40
- i0.ɵɵadvance(2);
41
- i0.ɵɵtextInterpolate(comp_r1.meta.showcaseConfig.title);
42
- i0.ɵɵadvance();
43
- i0.ɵɵconditional(comp_r1.meta.showcaseConfig.description ? 3 : -1);
44
- i0.ɵɵadvance();
45
- i0.ɵɵconditional(comp_r1.meta.showcaseConfig.tags?.length ? 4 : -1);
46
- } }
47
- export class PrismComponentHeaderComponent {
48
- navigationService = inject(PrismNavigationService);
49
- static ɵfac = function PrismComponentHeaderComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || PrismComponentHeaderComponent)(); };
50
- static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PrismComponentHeaderComponent, selectors: [["prism-component-header"]], decls: 1, vars: 1, consts: [[1, "prism-component-header"], [1, "prism-component-header__title"], [1, "prism-component-header__description"], [1, "prism-component-header__tags"], [1, "prism-component-header__tag"]], template: function PrismComponentHeaderComponent_Template(rf, ctx) { if (rf & 1) {
51
- i0.ɵɵconditionalCreate(0, PrismComponentHeaderComponent_Conditional_0_Template, 5, 3, "div", 0);
52
- } if (rf & 2) {
53
- let tmp_0_0;
54
- i0.ɵɵconditional((tmp_0_0 = ctx.navigationService.activeComponent()) ? 0 : -1, tmp_0_0);
55
- } }, styles: [".prism-component-header[_ngcontent-%COMP%] {\n padding: 16px 20px;\n border-bottom: 1px solid var(--%NS%prism-border);\n border-left: 3px solid;\n border-image: linear-gradient(180deg, var(--%NS%prism-primary-from), var(--%NS%prism-primary-to)) 1;\n background: var(--%NS%prism-bg-surface);\n }\n\n .prism-component-header__title[_ngcontent-%COMP%] {\n margin: 0;\n font-size: 18px;\n font-weight: 600;\n letter-spacing: -0.01em;\n color: var(--%NS%prism-text);\n font-family: var(--%NS%prism-font-sans);\n }\n\n .prism-component-header__description[_ngcontent-%COMP%] {\n margin: 4px 0 0;\n font-size: 13px;\n line-height: 1.6;\n color: var(--%NS%prism-text-2);\n font-family: var(--%NS%prism-font-sans);\n }\n\n .prism-component-header__tags[_ngcontent-%COMP%] {\n display: flex;\n gap: 6px;\n margin-top: 10px;\n flex-wrap: wrap;\n }\n\n .prism-component-header__tag[_ngcontent-%COMP%] {\n padding: 2px 8px;\n font-size: 11px;\n font-weight: 500;\n border-radius: var(--%NS%prism-radius-xs);\n background: color-mix(in srgb, var(--%NS%prism-primary) 12%, transparent);\n color: var(--%NS%prism-primary);\n border: 1px solid color-mix(in srgb, var(--%NS%prism-primary) 20%, transparent);\n letter-spacing: 0.02em;\n font-family: var(--%NS%prism-font-sans);\n }"] });
56
- }
57
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PrismComponentHeaderComponent, [{
58
- type: Component,
59
- args: [{ selector: 'prism-component-header', standalone: true, template: `
60
- @if (navigationService.activeComponent(); as comp) {
61
- <div class="prism-component-header">
62
- <h2 class="prism-component-header__title">{{ comp.meta.showcaseConfig.title }}</h2>
63
- @if (comp.meta.showcaseConfig.description) {
64
- <p class="prism-component-header__description">{{ comp.meta.showcaseConfig.description }}</p>
65
- }
66
- @if (comp.meta.showcaseConfig.tags?.length) {
67
- <div class="prism-component-header__tags">
68
- @for (tag of comp.meta.showcaseConfig.tags; track tag) {
69
- <span class="prism-component-header__tag">{{ tag }}</span>
70
- }
71
- </div>
72
- }
73
- </div>
74
- }
75
- `, styles: ["\n .prism-component-header {\n padding: 16px 20px;\n border-bottom: 1px solid var(--prism-border);\n border-left: 3px solid;\n border-image: linear-gradient(180deg, var(--prism-primary-from), var(--prism-primary-to)) 1;\n background: var(--prism-bg-surface);\n }\n\n .prism-component-header__title {\n margin: 0;\n font-size: 18px;\n font-weight: 600;\n letter-spacing: -0.01em;\n color: var(--prism-text);\n font-family: var(--prism-font-sans);\n }\n\n .prism-component-header__description {\n margin: 4px 0 0;\n font-size: 13px;\n line-height: 1.6;\n color: var(--prism-text-2);\n font-family: var(--prism-font-sans);\n }\n\n .prism-component-header__tags {\n display: flex;\n gap: 6px;\n margin-top: 10px;\n flex-wrap: wrap;\n }\n\n .prism-component-header__tag {\n padding: 2px 8px;\n font-size: 11px;\n font-weight: 500;\n border-radius: var(--prism-radius-xs);\n background: color-mix(in srgb, var(--prism-primary) 12%, transparent);\n color: var(--prism-primary);\n border: 1px solid color-mix(in srgb, var(--prism-primary) 20%, transparent);\n letter-spacing: 0.02em;\n font-family: var(--prism-font-sans);\n }\n "] }]
76
- }], null, null); })();
77
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(PrismComponentHeaderComponent, { className: "PrismComponentHeaderComponent", filePath: "app/component-header/prism-component-header.component.ts", lineNumber: 70 }); })();
@@ -1,10 +0,0 @@
1
- import type { A11yReport, A11yScoreResult } from '../../app/panels/a11y/a11y.types.js';
2
- export interface RawAuditResult {
3
- className: string;
4
- variantName: string;
5
- variantIndex: number;
6
- /** Result from `calculateScore(axeResults)` in the running app. */
7
- score: A11yScoreResult;
8
- }
9
- export declare function aggregateAuditResults(results: RawAuditResult[]): A11yReport;
10
- //# sourceMappingURL=aggregator.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"aggregator.d.ts","sourceRoot":"","sources":["../../../src/cli/audit-a11y/aggregator.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,UAAU,EACV,eAAe,EAChB,MAAM,qCAAqC,CAAC;AAE7C,MAAM,WAAW,cAAc;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,mEAAmE;IACnE,KAAK,EAAE,eAAe,CAAC;CACxB;AAED,wBAAgB,qBAAqB,CAAC,OAAO,EAAE,cAAc,EAAE,GAAG,UAAU,CAkD3E"}
@@ -1,64 +0,0 @@
1
- export function aggregateAuditResults(results) {
2
- if (results.length === 0) {
3
- return {
4
- total: {
5
- score: 100,
6
- violations: 0,
7
- critical: 0,
8
- serious: 0,
9
- moderate: 0,
10
- minor: 0,
11
- passes: 0,
12
- incomplete: 0,
13
- auditedComponents: 0,
14
- auditedVariants: 0,
15
- },
16
- components: {},
17
- generatedAt: new Date().toISOString(),
18
- };
19
- }
20
- const byComponent = new Map();
21
- for (const r of results) {
22
- const list = byComponent.get(r.className) ?? [];
23
- list.push(r.score);
24
- byComponent.set(r.className, list);
25
- }
26
- const componentBreakdown = {};
27
- for (const [className, scores] of byComponent) {
28
- componentBreakdown[className] = averageScore(scores);
29
- }
30
- const all = results.map((r) => r.score);
31
- const total = averageScore(all);
32
- return {
33
- total: {
34
- ...total,
35
- // Sum (not average) of violation counts — they aggregate across the library.
36
- violations: sum(all, (s) => s.violations),
37
- critical: sum(all, (s) => s.critical),
38
- serious: sum(all, (s) => s.serious),
39
- moderate: sum(all, (s) => s.moderate),
40
- minor: sum(all, (s) => s.minor),
41
- auditedComponents: byComponent.size,
42
- auditedVariants: results.length,
43
- },
44
- components: componentBreakdown,
45
- generatedAt: new Date().toISOString(),
46
- };
47
- }
48
- function averageScore(scores) {
49
- const n = scores.length;
50
- const sumF = (sel) => scores.reduce((acc, s) => acc + sel(s), 0);
51
- return {
52
- score: Math.round(sumF((s) => s.score) / n),
53
- violations: Math.round(sumF((s) => s.violations) / n),
54
- critical: Math.round(sumF((s) => s.critical) / n),
55
- serious: Math.round(sumF((s) => s.serious) / n),
56
- moderate: Math.round(sumF((s) => s.moderate) / n),
57
- minor: Math.round(sumF((s) => s.minor) / n),
58
- passes: Math.round(sumF((s) => s.passes) / n),
59
- incomplete: Math.round(sumF((s) => s.incomplete) / n),
60
- };
61
- }
62
- function sum(scores, sel) {
63
- return scores.reduce((acc, s) => acc + sel(s), 0);
64
- }
@@ -1,14 +0,0 @@
1
- import type { RawAuditResult } from './aggregator.js';
2
- export interface AuditOptions {
3
- baseUrl: string;
4
- /** Component class names to limit the audit to. Empty = all. */
5
- include?: string[];
6
- /** Component class names to skip. */
7
- exclude?: string[];
8
- /** Per-page navigation/render timeout in ms. Default 10_000. */
9
- timeoutMs?: number;
10
- /** Logger for progress output. */
11
- log?: (msg: string) => void;
12
- }
13
- export declare function auditPrismApp(opts: AuditOptions): Promise<RawAuditResult[]>;
14
- //# sourceMappingURL=auditor.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"auditor.d.ts","sourceRoot":"","sources":["../../../src/cli/audit-a11y/auditor.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAWtD,MAAM,WAAW,YAAY;IAC3B,OAAO,EAAE,MAAM,CAAC;IAChB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,qCAAqC;IACrC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,gEAAgE;IAChE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kCAAkC;IAClC,GAAG,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CAC7B;AAED,wBAAsB,aAAa,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,cAAc,EAAE,CAAC,CAyGjF"}