@memberjunction/ng-dashboards 6.2.0-edge.6 → 6.2.0-edge.8

package/dist/VideoStudio/resources/video-studio-archetypes-resource.component.js

@@ -0,0 +1,964 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, inject, } from '@angular/core';
+import { CompositeKey, LogError } from '@memberjunction/core';
+import { MJEnvironmentEntityExtended, VideoStudioEngine, } from '@memberjunction/core-entities';
+import { RegisterClass, UUIDsEqual } from '@memberjunction/global';
+import { FormatVideoTime, FormatVideoTimeRange } from '@memberjunction/ng-artifacts';
+import { BaseResourceComponent } from '@memberjunction/ng-shared';
+import { ARCHETYPE_CATEGORIES, BuildArchetypesAgentContext, FilterArchetypeCards, GroupArchetypesByCategory, MapArchetypeToCard, ParseArchetypeDefaultFormats, ResolveVideoStudioItem, } from '../video-studio-agent-context';
+import * as i0 from "@angular/core";
+import * as i1 from "@memberjunction/ng-shared-generic";
+import * as i2 from "@memberjunction/ng-artifacts";
+import * as i3 from "../components/vs-archetype-editor.component";
+import * as i4 from "../components/vs-studio-slide-in.component";
+import * as i5 from "@memberjunction/ng-ui-components";
+const _c0 = () => [];
+const _forTrack0 = ($index, $item) => $item.Category;
+const _forTrack1 = ($index, $item) => $item.ID;
+const _forTrack2 = ($index, $item) => $item.Key;
+function VideoStudioArchetypesResourceComponent_Conditional_16_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 13);
+    i0.ɵɵelement(1, "mj-loading", 19);
+    i0.ɵɵelementEnd();
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_17_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-empty-state", 20);
+    i0.ɵɵlistener("Action", function VideoStudioArchetypesResourceComponent_Conditional_17_Template_mj_empty_state_Action_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.Refresh()); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("Message", ctx_r1.LoadError);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_18_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-empty-state", 15);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_For_6_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-filter-chip", 34);
+    i0.ɵɵlistener("Clicked", function VideoStudioArchetypesResourceComponent_Conditional_19_For_6_Template_mj_filter_chip_Clicked_0_listener() { const chip_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.SelectCategoryChip(chip_r5.Category)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const chip_r5 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵproperty("Label", chip_r5.Label)("Count", chip_r5.Count)("Active", ctx_r1.CategoryFilter === chip_r5.Category);
+    i0.ɵɵattribute("data-testid", "archetype-category-chip-" + chip_r5.Category);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-empty-state", 35);
+    i0.ɵɵlistener("Action", function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_11_Template_mj_empty_state_Action_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.ResetFiltersAndSearch()); });
+    i0.ɵɵelementEnd();
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 40);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const arch_r8 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", arch_r8.CompanyName, " ");
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "mj-video-badge", 41);
+    i0.ɵɵelement(1, "i", 51);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3, "Shipped");
+    i0.ɵɵelementEnd()();
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 42);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const arch_r8 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(arch_r8.Description);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_For_18_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-video-format-glyph", 48);
+} if (rf & 2) {
+    const fmt_r9 = ctx.$implicit;
+    i0.ɵɵproperty("Format", fmt_r9);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "article", 37);
+    i0.ɵɵlistener("click", function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_Template_article_click_0_listener() { const arch_r8 = i0.ɵɵrestoreView(_r7).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.SelectArchetype(arch_r8)); })("keydown.enter", function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_Template_article_keydown_enter_0_listener() { const arch_r8 = i0.ɵɵrestoreView(_r7).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.SelectArchetype(arch_r8)); })("keydown.space", function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_Template_article_keydown_space_0_listener($event) { const arch_r8 = i0.ɵɵrestoreView(_r7).$implicit; const ctx_r1 = i0.ɵɵnextContext(3); $event.preventDefault(); return i0.ɵɵresetView(ctx_r1.SelectArchetype(arch_r8)); });
+    i0.ɵɵelementStart(1, "div", 38)(2, "h3", 39);
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(4, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_Conditional_4_Template, 2, 1, "span", 40)(5, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_Conditional_5_Template, 4, 0, "mj-video-badge", 41);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(6, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_Conditional_6_Template, 2, 1, "p", 42);
+    i0.ɵɵelementStart(7, "div", 43)(8, "span", 44);
+    i0.ɵɵtext(9);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "span", 45);
+    i0.ɵɵtext(11, "\u00B7");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(12, "span", 46);
+    i0.ɵɵtext(13);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(14, "span", 45);
+    i0.ɵɵtext(15, "\u00B7");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(16, "span", 47);
+    i0.ɵɵrepeaterCreate(17, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_For_18_Template, 1, 1, "mj-video-format-glyph", 48, i0.ɵɵrepeaterTrackByIdentity);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(19, "div", 49);
+    i0.ɵɵelement(20, "mj-video-beat-strip", 50);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const arch_r8 = ctx.$implicit;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵclassProp("vs-archetype-card--selected", (ctx_r1.SelectedArchetype == null ? null : ctx_r1.SelectedArchetype.ID) === arch_r8.ID);
+    i0.ɵɵattribute("data-testid", "archetype-card-" + arch_r8.ID)("aria-pressed", (ctx_r1.SelectedArchetype == null ? null : ctx_r1.SelectedArchetype.ID) === arch_r8.ID);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("title", arch_r8.Name);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", arch_r8.Name, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(arch_r8.CompanyName ? 4 : arch_r8.IsShipped ? 5 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(arch_r8.Description ? 6 : -1);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.FormatCategoryLabel(arch_r8.Category), " ");
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate2(" ", ctx_r1.FormatTime(arch_r8.DefaultDurationSeconds), " (", ctx_r1.FormatTimeRange(arch_r8.MinDurationSeconds, arch_r8.MaxDurationSeconds), ") ");
+    i0.ɵɵadvance(4);
+    i0.ɵɵrepeater(ctx_r1.ParseFormats(arch_r8.DefaultFormats));
+    i0.ɵɵadvance(3);
+    i0.ɵɵproperty("Beats", arch_r8.BeatItems || i0.ɵɵpureFunction0(12, _c0));
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 32);
+    i0.ɵɵrepeaterCreate(1, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_For_2_Template, 21, 13, "article", 36, _forTrack1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.FilteredArchetypes);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    const _r11 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 77);
+    i0.ɵɵlistener("click", function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_8_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r11); const selected_r12 = i0.ɵɵnextContext(); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.OpenCopyArchetypeEditor(selected_r12, $event)); });
+    i0.ɵɵelement(1, "i", 78);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3, "Make a copy");
+    i0.ɵɵelementEnd()();
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_9_Template(rf, ctx) { if (rf & 1) {
+    const _r13 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 79);
+    i0.ɵɵlistener("click", function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_9_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r13); const selected_r12 = i0.ɵɵnextContext(); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.OpenEditArchetypeEditor(selected_r12, $event)); });
+    i0.ɵɵelement(1, "i", 80);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3, "Edit");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(4, "button", 81);
+    i0.ɵɵlistener("click", function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_9_Template_button_click_4_listener($event) { i0.ɵɵrestoreView(_r13); const selected_r12 = i0.ɵɵnextContext(); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.OpenArchetypeRecord(selected_r12, $event)); });
+    i0.ɵɵelementStart(5, "span");
+    i0.ɵɵtext(6, "Open record");
+    i0.ɵɵelementEnd()();
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_13_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 61);
+    i0.ɵɵelement(1, "i", 82);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3, " Shipped archetypes are read-only templates. Make a copy of this archetype to customize it for a specific company. ");
+    i0.ɵɵelementEnd()();
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_14_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 62);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const selected_r12 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(selected_r12.Description);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_For_31_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "mj-video-format-glyph", 48);
+} if (rf & 2) {
+    const fmt_r14 = ctx.$implicit;
+    i0.ɵɵproperty("Format", fmt_r14);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_For_45_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "mj-video-badge", 87);
+    i0.ɵɵtext(1, "Data bound");
+    i0.ɵɵelementEnd();
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_For_45_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 89);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const beat_r15 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(beat_r15.Guidance);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_For_45_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 74)(1, "div", 83)(2, "span", 84);
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "strong", 85);
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "span", 86);
+    i0.ɵɵtext(7);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(8, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_For_45_Conditional_8_Template, 2, 0, "mj-video-badge", 87);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "p", 88);
+    i0.ɵɵtext(10);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(11, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_For_45_Conditional_11_Template, 2, 1, "p", 89);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const beat_r15 = ctx.$implicit;
+    const ɵ$index_221_r16 = ctx.$index;
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(ɵ$index_221_r16 + 1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(beat_r15.Label);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate2(" ", ctx_r1.FormatTime(beat_r15.ComputedDurationSeconds), " (", ctx_r1.FormatTimeRange(beat_r15.MinDurationSeconds, beat_r15.MaxDurationSeconds), ") ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(beat_r15.RequiresDataBinding ? 8 : -1);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(beat_r15.Purpose);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(beat_r15.Guidance ? 11 : -1);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_46_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 93);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const selected_r12 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(selected_r12.Pacing.HoldRules);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_46_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "section", 75)(1, "h3", 70);
+    i0.ɵɵelement(2, "i", 90);
+    i0.ɵɵelementStart(3, "span");
+    i0.ɵɵtext(4, "Pacing rules");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(5, "div", 91)(6, "div", 92)(7, "span");
+    i0.ɵɵtext(8, "Average time between visual changes:");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(9, "strong");
+    i0.ɵɵtext(10);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵconditionalCreate(11, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_46_Conditional_11_Template, 2, 1, "p", 93);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const selected_r12 = i0.ɵɵnextContext();
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(10);
+    i0.ɵɵtextInterpolate(ctx_r1.FormatTime(selected_r12.Pacing.AvgSecondsBetweenChanges));
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(selected_r12.Pacing.HoldRules ? 11 : -1);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_47_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "section", 76)(1, "h3", 70);
+    i0.ɵɵelement(2, "i", 94);
+    i0.ɵɵelementStart(3, "span");
+    i0.ɵɵtext(4, "Producer guidance");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(5, "p", 95);
+    i0.ɵɵtext(6);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const selected_r12 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(6);
+    i0.ɵɵtextInterpolate(selected_r12.Guidance);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Template(rf, ctx) { if (rf & 1) {
+    const _r10 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "aside", 33)(1, "header", 52)(2, "div", 53)(3, "span", 54);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "h2", 55);
+    i0.ɵɵtext(6);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(7, "div", 56);
+    i0.ɵɵconditionalCreate(8, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_8_Template, 4, 0, "button", 57)(9, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_9_Template, 7, 0);
+    i0.ɵɵelementStart(10, "button", 58);
+    i0.ɵɵlistener("click", function VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Template_button_click_10_listener() { i0.ɵɵrestoreView(_r10); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.CloseSlideOut()); });
+    i0.ɵɵelement(11, "i", 59);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(12, "div", 60);
+    i0.ɵɵconditionalCreate(13, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_13_Template, 4, 0, "div", 61);
+    i0.ɵɵconditionalCreate(14, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_14_Template, 2, 1, "p", 62);
+    i0.ɵɵelementStart(15, "div", 63)(16, "div", 64)(17, "span", 65);
+    i0.ɵɵtext(18, "Default duration");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(19, "span", 66);
+    i0.ɵɵtext(20);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(21, "div", 64)(22, "span", 65);
+    i0.ɵɵtext(23, "Duration range");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(24, "span", 66);
+    i0.ɵɵtext(25);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(26, "div", 64)(27, "span", 65);
+    i0.ɵɵtext(28, "Default formats");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(29, "span", 67);
+    i0.ɵɵrepeaterCreate(30, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_For_31_Template, 1, 1, "mj-video-format-glyph", 48, i0.ɵɵrepeaterTrackByIdentity);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(32, "div", 64)(33, "span", 65);
+    i0.ɵɵtext(34, "Interaction mode");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(35, "span", 68);
+    i0.ɵɵtext(36);
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(37, "section", 69)(38, "h3", 70);
+    i0.ɵɵelement(39, "i", 71);
+    i0.ɵɵelementStart(40, "span");
+    i0.ɵɵtext(41);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelement(42, "mj-video-beat-strip", 72);
+    i0.ɵɵelementStart(43, "div", 73);
+    i0.ɵɵrepeaterCreate(44, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_For_45_Template, 12, 7, "div", 74, _forTrack2);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵconditionalCreate(46, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_46_Template, 12, 2, "section", 75);
+    i0.ɵɵconditionalCreate(47, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Conditional_47_Template, 7, 1, "section", 76);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const selected_r12 = ctx;
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.FormatCategoryLabel(selected_r12.Category), " ");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(selected_r12.Name);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(selected_r12.IsShipped ? 8 : 9);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("AriaLabel", "Close archetype preview");
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(selected_r12.IsShipped ? 13 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(selected_r12.Description ? 14 : -1);
+    i0.ɵɵadvance(6);
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.FormatTime(selected_r12.DefaultDurationSeconds), " ");
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate1(" ", ctx_r1.FormatTimeRange(selected_r12.MinDurationSeconds, selected_r12.MaxDurationSeconds), " ");
+    i0.ɵɵadvance(5);
+    i0.ɵɵrepeater(ctx_r1.ParseFormats(selected_r12.DefaultFormats));
+    i0.ɵɵadvance(6);
+    i0.ɵɵtextInterpolate(selected_r12.DefaultInteractionMode);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate1("Beat template (", selected_r12.Beats.length, ")");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("Beats", selected_r12.BeatItems || i0.ɵɵpureFunction0(13, _c0));
+    i0.ɵɵadvance(2);
+    i0.ɵɵrepeater(selected_r12.Beats);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(selected_r12.Pacing ? 46 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(selected_r12.Guidance ? 47 : -1);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_19_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 21)(1, "div", 22)(2, "div", 23)(3, "div", 24)(4, "mj-filter-chip", 25);
+    i0.ɵɵlistener("Clicked", function VideoStudioArchetypesResourceComponent_Conditional_19_Template_mj_filter_chip_Clicked_4_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.SelectCategoryChip("all")); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵrepeaterCreate(5, VideoStudioArchetypesResourceComponent_Conditional_19_For_6_Template, 1, 4, "mj-filter-chip", 26, _forTrack0);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelement(7, "span", 27);
+    i0.ɵɵelementStart(8, "div", 28)(9, "mj-filter-chip", 29);
+    i0.ɵɵlistener("Clicked", function VideoStudioArchetypesResourceComponent_Conditional_19_Template_mj_filter_chip_Clicked_9_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.ToggleScopeChip("shipped")); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "mj-filter-chip", 30);
+    i0.ɵɵlistener("Clicked", function VideoStudioArchetypesResourceComponent_Conditional_19_Template_mj_filter_chip_Clicked_10_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.ToggleScopeChip("company")); });
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵconditionalCreate(11, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_11_Template, 1, 0, "mj-empty-state", 31)(12, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_12_Template, 3, 0, "div", 32);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(13, VideoStudioArchetypesResourceComponent_Conditional_19_Conditional_13_Template, 48, 14, "aside", 33);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_10_0;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵclassProp("vs-archetypes-workspace--split", ctx_r1.SelectedArchetype !== null);
+    i0.ɵɵadvance(4);
+    i0.ɵɵproperty("Count", ctx_r1.CategoryAllCount)("Active", ctx_r1.CategoryFilter === "all");
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater(ctx_r1.CategoryChipItems);
+    i0.ɵɵadvance(4);
+    i0.ɵɵproperty("Count", ctx_r1.ShippedCount)("Active", ctx_r1.ScopeFilter === "shipped");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("Count", ctx_r1.CompanyCount)("Active", ctx_r1.ScopeFilter === "company");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.FilteredArchetypes.length === 0 ? 11 : 12);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional((tmp_10_0 = ctx_r1.SelectedArchetype) ? 13 : -1, tmp_10_0);
+} }
+function VideoStudioArchetypesResourceComponent_Conditional_20_Template(rf, ctx) { if (rf & 1) {
+    const _r17 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-dialog", 96);
+    i0.ɵɵlistener("Close", function VideoStudioArchetypesResourceComponent_Conditional_20_Template_mj_dialog_Close_0_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.CloseArchetypeEditor()); });
+    i0.ɵɵelementStart(1, "vs-archetype-editor", 97);
+    i0.ɵɵlistener("Saved", function VideoStudioArchetypesResourceComponent_Conditional_20_Template_vs_archetype_editor_Saved_1_listener($event) { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnArchetypeEditorSaved($event)); })("Cancelled", function VideoStudioArchetypesResourceComponent_Conditional_20_Template_vs_archetype_editor_Cancelled_1_listener() { i0.ɵɵrestoreView(_r17); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.CloseArchetypeEditor()); });
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("Visible", true)("Title", ctx_r1.EditorDialogTitle);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("Provider", ctx_r1.ProviderToUse)("Mode", ctx_r1.EditorMode)("SourceArchetypeId", ctx_r1.EditorSourceArchetypeId)("EditingArchetypeId", ctx_r1.EditorEditingArchetypeId);
+} }
+/**
+ * Archetypes resource tab for the Video Studio application.
+ *
+ * Displays all `MJ: Video Archetypes` from `VideoStudioEngine` in a single
+ * grid with `<mj-filter-chip>` filters for `Category` (`Announcement | Briefing |
+ * DataStory | Explainer | Product | Social | Tutorial`) and scope (`Shipped` /
+ * `Yours`), proportional beat-timeline strips (`arch.BeatTemplateObject`), and an
+ * inline slide-out preview showing the full beat template, pacing rules,
+ * and narrative guidance.
+ *
+ * Company archetypes (`CompanyID` non-null) provide an "Edit" button that opens
+ * `vs-archetype-editor` plus an "Open record" link to the entity form, while
+ * shipped archetypes (`CompanyID IS NULL`) are read-only with a "Make a copy"
+ * button that opens `vs-archetype-editor` pre-filled with the shipped row.
+ */
+let VideoStudioArchetypesResourceComponent = class VideoStudioArchetypesResourceComponent extends BaseResourceComponent {
+    IsLoading = false;
+    LoadError = null;
+    AllArchetypes = [];
+    FilteredArchetypes = [];
+    CategoryGroups = [];
+    CategoryChipItems = [];
+    CategoryAllCount = 0;
+    SelectedArchetype = null;
+    SearchText = '';
+    CategoryFilter = 'all';
+    ScopeFilter = 'all';
+    FilterFields = [
+        {
+            key: 'category',
+            label: 'Category',
+            type: 'dropdown',
+            options: [
+                { value: 'all', text: 'All categories' },
+                ...ARCHETYPE_CATEGORIES.map((cat) => ({
+                    value: cat,
+                    text: this.FormatCategoryLabel(cat),
+                })),
+            ],
+        },
+        {
+            key: 'scope',
+            label: 'Scope',
+            type: 'dropdown',
+            options: [
+                { value: 'all', text: 'All scopes' },
+                { value: 'shipped', text: 'Shipped (read-only)' },
+                { value: 'company', text: 'Company overrides' },
+            ],
+        },
+    ];
+    FilterValues = {
+        category: 'all',
+        scope: 'all',
+    };
+    // Archetype editor dialog state
+    IsEditorOpen = false;
+    EditorMode = 'copy';
+    EditorSourceArchetypeId = null;
+    EditorEditingArchetypeId = null;
+    PageContext = this.buildArchetypesContext();
+    PageTools = this.buildArchetypesClientTools();
+    cdr = inject(ChangeDetectorRef);
+    get CurrentUser() {
+        return this.ProviderToUse?.CurrentUser ?? null;
+    }
+    get EnvironmentId() {
+        return (this.Data?.Configuration?.['environmentId'] ||
+            MJEnvironmentEntityExtended.DefaultEnvironmentID);
+    }
+    get ApplicationId() {
+        return this.Data?.Configuration?.['applicationId'] ?? '';
+    }
+    async ngOnInit() {
+        super.ngOnInit();
+        await this.LoadArchetypes(false);
+        this.NotifyLoadComplete();
+    }
+    async GetResourceDisplayName(_data) {
+        return 'Archetypes';
+    }
+    async GetResourceIconClass(_data) {
+        return 'fa-solid fa-layer-group';
+    }
+    get TotalCount() {
+        return this.AllArchetypes.length;
+    }
+    get FilteredCount() {
+        return this.FilteredArchetypes.length;
+    }
+    get ShippedCount() {
+        return this.AllArchetypes.filter((a) => a.IsShipped).length;
+    }
+    get CompanyCount() {
+        return this.AllArchetypes.filter((a) => !a.IsShipped).length;
+    }
+    get EditorDialogTitle() {
+        if (this.EditorMode === 'edit') {
+            const target = this.AllArchetypes.find((a) => this.EditorEditingArchetypeId && UUIDsEqual(a.ID, this.EditorEditingArchetypeId));
+            return target ? `Edit "${target.Name}"` : 'Edit archetype';
+        }
+        if (this.EditorSourceArchetypeId) {
+            const source = this.AllArchetypes.find((a) => this.EditorSourceArchetypeId && UUIDsEqual(a.ID, this.EditorSourceArchetypeId));
+            if (source) {
+                return `Make a copy of "${source.Name}"`;
+            }
+        }
+        return 'New archetype';
+    }
+    get ActivePopoverFilterCount() {
+        let count = 0;
+        if (this.CategoryFilter && this.CategoryFilter !== 'all') {
+            count++;
+        }
+        if (this.ScopeFilter && this.ScopeFilter !== 'all') {
+            count++;
+        }
+        return count;
+    }
+    async Refresh() {
+        await this.LoadArchetypes(true);
+    }
+    async LoadArchetypes(forceRefresh = false) {
+        this.IsLoading = true;
+        this.LoadError = null;
+        this.cdr.markForCheck();
+        try {
+            const engine = VideoStudioEngine.GetProviderInstance(this.ProviderToUse, VideoStudioEngine);
+            await engine.Config(forceRefresh, undefined, this.ProviderToUse);
+            const archetypes = engine.Archetypes;
+            this.AllArchetypes = archetypes.map((arch) => this.mapArchetypeToCard(arch));
+            this.applyFiltersAndSync();
+        }
+        catch (err) {
+            const msg = err instanceof Error ? err.message : String(err);
+            LogError(msg);
+            this.LoadError = msg;
+        }
+        finally {
+            this.IsLoading = false;
+            this.syncAgentContext();
+            this.cdr.markForCheck();
+        }
+    }
+    OnSearchChange(value) {
+        this.SearchText = value;
+        this.applyFiltersAndSync();
+    }
+    OnFilterValuesChange(values) {
+        this.FilterValues = { ...values };
+        const rawCat = typeof values['category'] === 'string' && values['category'].trim()
+            ? values['category'].trim()
+            : 'all';
+        const rawScope = typeof values['scope'] === 'string' && values['scope'].trim()
+            ? values['scope'].trim()
+            : 'all';
+        this.CategoryFilter = rawCat;
+        this.ScopeFilter = rawScope;
+        this.applyFiltersAndSync();
+    }
+    SelectCategoryChip(category) {
+        const nextCategory = category !== 'all' && this.CategoryFilter === category ? 'all' : category;
+        this.CategoryFilter = nextCategory;
+        this.FilterValues = {
+            ...this.FilterValues,
+            category: nextCategory,
+        };
+        this.applyFiltersAndSync();
+    }
+    ToggleScopeChip(scope) {
+        const nextScope = this.ScopeFilter === scope ? 'all' : scope;
+        this.ScopeFilter = nextScope;
+        this.FilterValues = {
+            ...this.FilterValues,
+            scope: nextScope,
+        };
+        this.applyFiltersAndSync();
+    }
+    ClearAllFilters() {
+        this.CategoryFilter = 'all';
+        this.ScopeFilter = 'all';
+        this.FilterValues = {
+            category: 'all',
+            scope: 'all',
+        };
+        this.applyFiltersAndSync();
+    }
+    SelectArchetype(item) {
+        this.SelectedArchetype = item;
+        this.syncAgentContext();
+        this.cdr.markForCheck();
+    }
+    CloseSlideOut() {
+        this.SelectArchetype(null);
+    }
+    OpenNewArchetypeEditor() {
+        this.EditorMode = 'copy';
+        this.EditorSourceArchetypeId = this.SelectedArchetype?.ID ?? null;
+        this.EditorEditingArchetypeId = null;
+        this.IsEditorOpen = true;
+        this.cdr.markForCheck();
+    }
+    OpenCopyArchetypeEditor(item, event) {
+        event?.stopPropagation();
+        this.EditorMode = 'copy';
+        this.EditorSourceArchetypeId = item.ID;
+        this.EditorEditingArchetypeId = null;
+        this.IsEditorOpen = true;
+        this.cdr.markForCheck();
+    }
+    OpenEditArchetypeEditor(item, event) {
+        event?.stopPropagation();
+        if (item.IsShipped) {
+            this.OpenCopyArchetypeEditor(item, event);
+            return;
+        }
+        this.EditorMode = 'edit';
+        this.EditorSourceArchetypeId = null;
+        this.EditorEditingArchetypeId = item.ID;
+        this.IsEditorOpen = true;
+        this.cdr.markForCheck();
+    }
+    OpenArchetypeRecord(item, event) {
+        event?.stopPropagation();
+        if (item.IsShipped) {
+            this.OpenCopyArchetypeEditor(item, event);
+            return;
+        }
+        this.navigationService.OpenEntityRecord('MJ: Video Archetypes', CompositeKey.FromID(item.ID));
+    }
+    CloseArchetypeEditor() {
+        this.IsEditorOpen = false;
+        this.EditorSourceArchetypeId = null;
+        this.EditorEditingArchetypeId = null;
+        this.cdr.markForCheck();
+    }
+    async OnArchetypeEditorSaved(savedArchetypeId) {
+        this.IsEditorOpen = false;
+        this.EditorSourceArchetypeId = null;
+        this.EditorEditingArchetypeId = null;
+        await this.LoadArchetypes(true);
+        const saved = this.AllArchetypes.find((a) => UUIDsEqual(a.ID, savedArchetypeId));
+        if (saved) {
+            this.SelectArchetype(saved);
+        }
+        this.cdr.markForCheck();
+    }
+    FormatCategoryLabel(category) {
+        if (category === 'DataStory') {
+            return 'Data Story';
+        }
+        return category;
+    }
+    FormatTime(seconds) {
+        return FormatVideoTime(seconds);
+    }
+    FormatTimeRange(minSeconds, maxSeconds) {
+        return FormatVideoTimeRange(minSeconds, maxSeconds);
+    }
+    ParseFormats(formatsRaw) {
+        return ParseArchetypeDefaultFormats(formatsRaw);
+    }
+    ResetFiltersAndSearch() {
+        this.ClearAllFilters();
+        this.OnSearchChange('');
+    }
+    rebuildCategoryChips() {
+        const rowsAfterOtherFilters = FilterArchetypeCards(this.AllArchetypes, {
+            SearchQuery: this.SearchText,
+            Category: 'all',
+            Scope: this.ScopeFilter,
+        });
+        const countsByCategory = new Map();
+        for (const cat of ARCHETYPE_CATEGORIES) {
+            countsByCategory.set(cat, 0);
+        }
+        for (const arch of rowsAfterOtherFilters) {
+            countsByCategory.set(arch.Category, (countsByCategory.get(arch.Category) ?? 0) + 1);
+        }
+        this.CategoryAllCount = rowsAfterOtherFilters.length;
+        this.CategoryChipItems = ARCHETYPE_CATEGORIES.map((cat) => ({
+            Category: cat,
+            Label: this.FormatCategoryLabel(cat),
+            Count: countsByCategory.get(cat) ?? 0,
+        }));
+    }
+    mapArchetypeToCard(arch) {
+        const snapshot = MapArchetypeToCard(arch);
+        const rawBeats = Array.isArray(arch.BeatTemplateObject) ? arch.BeatTemplateObject : [];
+        const beatItems = snapshot.BeatItems ?? [];
+        const totalWeight = beatItems.reduce((acc, item) => acc + item.Seconds, 0) || 1;
+        const beats = rawBeats.map((b, idx) => {
+            const stripItem = beatItems[idx];
+            const seconds = stripItem?.Seconds ?? 1;
+            return {
+                Key: (b.Key ?? '').trim() || stripItem?.Key || `beat-${idx + 1}`,
+                Label: stripItem?.Label ?? (b.Label || b.Key || `Beat ${idx + 1}`),
+                Purpose: b.Purpose || '',
+                MinDurationSeconds: b.MinDurationSeconds ?? 0,
+                MaxDurationSeconds: b.MaxDurationSeconds ?? 0,
+                DefaultDurationSeconds: b.DefaultDurationSeconds,
+                ComputedDurationSeconds: seconds,
+                WidthPercent: Math.max(4, Math.round((seconds / totalWeight) * 1000) / 10),
+                Guidance: b.Guidance,
+                RequiresDataBinding: b.RequiresDataBinding,
+            };
+        });
+        const pacingObj = arch.PacingObject;
+        const pacing = pacingObj
+            ? {
+                ...pacingObj,
+                AvgSecondsBetweenChanges: pacingObj.AvgSecondsBetweenChanges ?? 0,
+                HoldRules: pacingObj.HoldRules ?? '',
+            }
+            : null;
+        return {
+            ...snapshot,
+            DefaultInteractionMode: arch.DefaultInteractionMode ?? 'Auto',
+            Guidance: arch.Guidance ?? null,
+            BeatTemplateRaw: arch.BeatTemplate ?? JSON.stringify(rawBeats),
+            PacingRaw: arch.Pacing ?? (pacingObj ? JSON.stringify(pacingObj) : null),
+            Beats: beats,
+            Pacing: pacing,
+        };
+    }
+    currentFilterState() {
+        return {
+            SearchQuery: this.SearchText,
+            Category: this.CategoryFilter,
+            Scope: this.ScopeFilter,
+        };
+    }
+    applyFiltersAndSync() {
+        this.rebuildCategoryChips();
+        this.FilteredArchetypes = FilterArchetypeCards(this.AllArchetypes, this.currentFilterState());
+        this.CategoryGroups = GroupArchetypesByCategory(this.FilteredArchetypes);
+        this.syncAgentContext();
+        this.cdr.markForCheck();
+    }
+    buildArchetypesContext() {
+        return BuildArchetypesAgentContext({
+            AllCards: this.AllArchetypes,
+            FilteredCards: this.FilteredArchetypes,
+            Filters: this.currentFilterState(),
+            SelectedArchetype: this.SelectedArchetype,
+            IsLoading: this.IsLoading,
+        });
+    }
+    syncAgentContext() {
+        this.PageContext = this.buildArchetypesContext();
+        this.navigationService.SetAgentContext(this, this.PageContext);
+    }
+    // SAFETY BOUNDARY: Only read, filter, search, select/open-for-viewing, and refresh
+    // tools are registered for the AI agent. Creating or editing a company archetype
+    // writes a database record and is gated exclusively behind the user-driven
+    // vs-archetype-editor dialog.
+    buildArchetypesClientTools() {
+        return [
+            {
+                Name: 'SearchArchetypes',
+                Description: 'Filter Video Archetypes by a free-text search query matching name, category, format, or beat labels.',
+                ParameterSchema: {
+                    type: 'object',
+                    properties: {
+                        query: { type: 'string', description: 'Free-text search query (empty string clears search).' },
+                    },
+                    required: ['query'],
+                },
+                Handler: async (params) => {
+                    const query = typeof params['query'] === 'string' ? params['query'] : '';
+                    this.OnSearchChange(query);
+                    return {
+                        Success: true,
+                        Data: { FilteredCount: this.FilteredCount },
+                    };
+                },
+            },
+            {
+                Name: 'FilterArchetypes',
+                Description: 'Filter Video Archetypes by category or scope (all, shipped, company).',
+                ParameterSchema: {
+                    type: 'object',
+                    properties: {
+                        category: {
+                            type: 'string',
+                            description: 'Category name (Announcement, Briefing, DataStory, Explainer, Product, Social, Tutorial, or "all").',
+                        },
+                        scope: {
+                            type: 'string',
+                            enum: ['all', 'shipped', 'company'],
+                            description: 'Scope filter ("all", "shipped", or "company").',
+                        },
+                    },
+                },
+                Handler: async (params) => {
+                    const nextValues = { ...this.FilterValues };
+                    if (typeof params['category'] === 'string') {
+                        nextValues['category'] = params['category'];
+                    }
+                    if (typeof params['scope'] === 'string') {
+                        nextValues['scope'] = params['scope'];
+                    }
+                    this.OnFilterValuesChange(nextValues);
+                    return {
+                        Success: true,
+                        Data: { FilteredCount: this.FilteredCount },
+                    };
+                },
+            },
+            {
+                Name: 'ClearArchetypeFilters',
+                Description: 'Clear all active search and popover filters on the Video Archetypes tab.',
+                ParameterSchema: { type: 'object', properties: {} },
+                Handler: async () => {
+                    this.SearchText = '';
+                    this.ClearAllFilters();
+                    return {
+                        Success: true,
+                        Data: { FilteredCount: this.FilteredCount },
+                    };
+                },
+            },
+            {
+                Name: 'SelectArchetype',
+                Description: 'Open the inline slide-out preview for a Video Archetype by ID or name.',
+                ParameterSchema: {
+                    type: 'object',
+                    properties: {
+                        archetype: { type: 'string', description: 'Archetype ID or display name.' },
+                    },
+                    required: ['archetype'],
+                },
+                Handler: async (params) => {
+                    const resolution = ResolveVideoStudioItem(params['archetype'], this.AllArchetypes, 'video archetype');
+                    if (!resolution.Ok) {
+                        return { Success: false, ErrorMessage: resolution.Error };
+                    }
+                    this.SelectArchetype(resolution.Item);
+                    return {
+                        Success: true,
+                        Data: { ID: resolution.Item.ID, Name: resolution.Item.Name },
+                    };
+                },
+            },
+            {
+                Name: 'OpenArchetype',
+                Description: 'Open a company Video Archetype record form by ID or name (shipped archetypes are read-only and open in the slide-out preview).',
+                ParameterSchema: {
+                    type: 'object',
+                    properties: {
+                        archetype: { type: 'string', description: 'Archetype ID or display name.' },
+                    },
+                    required: ['archetype'],
+                },
+                Handler: async (params) => {
+                    const resolution = ResolveVideoStudioItem(params['archetype'], this.AllArchetypes, 'video archetype');
+                    if (!resolution.Ok) {
+                        return { Success: false, ErrorMessage: resolution.Error };
+                    }
+                    if (resolution.Item.IsShipped) {
+                        this.SelectArchetype(resolution.Item);
+                        return {
+                            Success: true,
+                            Data: { ID: resolution.Item.ID, Name: resolution.Item.Name, IsShipped: true },
+                        };
+                    }
+                    this.navigationService.OpenEntityRecord('MJ: Video Archetypes', CompositeKey.FromID(resolution.Item.ID));
+                    return {
+                        Success: true,
+                        Data: { ID: resolution.Item.ID, Name: resolution.Item.Name, IsShipped: false },
+                    };
+                },
+            },
+            {
+                Name: 'RefreshArchetypes',
+                Description: 'Reload Video Archetypes from VideoStudioEngine.',
+                ParameterSchema: { type: 'object', properties: {} },
+                Handler: async () => {
+                    await this.Refresh();
+                    return {
+                        Success: true,
+                        Data: { TotalCount: this.TotalCount },
+                    };
+                },
+            },
+        ];
+    }
+    static ɵfac = /*@__PURE__*/ (() => { let ɵVideoStudioArchetypesResourceComponent_BaseFactory; return function VideoStudioArchetypesResourceComponent_Factory(__ngFactoryType__) { return (ɵVideoStudioArchetypesResourceComponent_BaseFactory || (ɵVideoStudioArchetypesResourceComponent_BaseFactory = i0.ɵɵgetInheritedFactory(VideoStudioArchetypesResourceComponent)))(__ngFactoryType__ || VideoStudioArchetypesResourceComponent); }; })();
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: VideoStudioArchetypesResourceComponent, selectors: [["mj-video-studio-archetypes-resource"]], standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 22, vars: 19, consts: [[1, "vs-resource-shell"], [1, "vs-resource-shell__page"], ["Title", "Archetypes", "Icon", "fa-solid fa-layer-group", "Subtitle", "Reusable beat templates, duration ranges, and pacing rules for video productions"], ["meta", ""], ["Label", "Archetypes", 3, "Count", "Total"], ["actions", ""], [3, "Clicked", "Loading"], ["type", "button", "mjButton", "", "Variant", "primary", "data-testid", "new-archetype-button", 3, "click"], ["aria-hidden", "true", 1, "fa-solid", "fa-plus"], ["toolbar", ""], ["Placeholder", "Search archetypes by name, category, format, or beat...", 3, "ValueChange", "Value"], ["Label", "Filters", "Icon", "fa-solid fa-filter", 3, "ClearAllRequested", "ActiveCount", "ShowClearAll"], [3, "ValuesChange", "Fields", "Values", "ShowReset"], ["data-testid", "archetypes-loading", 1, "vs-loading-state"], ["data-testid", "archetypes-error", "Role", "alert", "Variant", "error", "Icon", "fa-solid fa-triangle-exclamation", "Title", "Unable to load archetypes", "ActionText", "Try again", "ActionIcon", "fa-solid fa-rotate", "ActionVariant", "secondary", 3, "Message"], ["data-testid", "archetypes-empty", "Variant", "empty", "Icon", "fa-solid fa-layer-group", "Title", "No video archetypes available", "Message", "Archetypes define reusable narrative structures, beat templates, and pacing rules."], [1, "vs-archetypes-workspace", 3, "vs-archetypes-workspace--split"], ["Size", "lg", 3, "Visible", "Title"], [3, "Provider", "CurrentUser", "EnvironmentId", "ApplicationId", "PageSource", "PageContext", "PageTools", "HeaderTitle"], ["Text", "Loading video archetypes...", "Size", "medium"], ["data-testid", "archetypes-error", "Role", "alert", "Variant", "error", "Icon", "fa-solid fa-triangle-exclamation", "Title", "Unable to load archetypes", "ActionText", "Try again", "ActionIcon", "fa-solid fa-rotate", "ActionVariant", "secondary", 3, "Action", "Message"], [1, "vs-archetypes-workspace"], [1, "vs-archetypes-main"], ["data-testid", "archetypes-filter-chips", 1, "vs-archetypes-filter-bar"], ["role", "group", "aria-label", "Filter by category", 1, "vs-archetypes-chip-group"], ["data-testid", "archetype-category-chip-all", "Label", "All", 3, "Clicked", "Count", "Active"], [3, "Label", "Count", "Active"], ["aria-hidden", "true", 1, "vs-archetypes-chip-divider"], ["role", "group", "aria-label", "Filter by scope", 1, "vs-archetypes-chip-group"], ["data-testid", "archetype-scope-chip-shipped", "Label", "Shipped", 3, "Clicked", "Count", "Active"], ["data-testid", "archetype-scope-chip-company", "Label", "Yours", 3, "Clicked", "Count", "Active"], ["data-testid", "archetypes-empty", "Variant", "no-results", "Icon", "fa-solid fa-layer-group", "Title", "No archetypes match your filters", "Message", "Try clearing your search query or adjusting the active category or scope filters.", "ActionText", "Reset filters", "ActionIcon", "fa-solid fa-filter-circle-xmark", "ActionVariant", "secondary"], ["data-testid", "archetypes-grid", 1, "vs-archetypes-grid"], ["data-testid", "archetype-slideout", 1, "vs-archetype-slideout"], [3, "Clicked", "Label", "Count", "Active"], ["data-testid", "archetypes-empty", "Variant", "no-results", "Icon", "fa-solid fa-layer-group", "Title", "No archetypes match your filters", "Message", "Try clearing your search query or adjusting the active category or scope filters.", "ActionText", "Reset filters", "ActionIcon", "fa-solid fa-filter-circle-xmark", "ActionVariant", "secondary", 3, "Action"], ["tabindex", "0", "role", "button", 1, "vs-archetype-card", 3, "vs-archetype-card--selected"], ["tabindex", "0", "role", "button", 1, "vs-archetype-card", 3, "click", "keydown.enter", "keydown.space"], [1, "vs-archetype-card-header"], [1, "vs-archetype-title", 3, "title"], ["data-testid", "archetype-company-badge", 1, "vs-archetype-company-meta"], ["Variant", "neutral", "data-testid", "archetype-shipped-badge"], [1, "vs-archetype-description"], [1, "vs-archetype-meta-line"], ["data-testid", "archetype-category-meta", 1, "vs-archetype-category-meta"], ["aria-hidden", "true", 1, "vs-archetype-meta-sep"], ["data-testid", "archetype-duration-badge", 1, "vs-archetype-duration-meta"], ["data-testid", "archetype-formats-badge", 1, "vs-archetype-formats-meta"], ["Size", "sm", 3, "Format"], [1, "vs-archetype-beat-strip-wrap"], ["data-testid", "archetype-beat-timeline", 3, "Beats"], ["aria-hidden", "true", 1, "fa-solid", "fa-lock"], [1, "vs-slideout-header"], [1, "vs-slideout-title-wrap"], [1, "vs-slideout-category-tag"], [1, "vs-slideout-title"], [1, "vs-slideout-actions"], ["type", "button", "mjButton", "", "Variant", "primary", "Size", "sm", "data-testid", "archetype-make-copy-button"], ["type", "button", "mjButton", "", "Variant", "icon", "Size", "sm", "data-testid", "archetype-slideout-close", 3, "click", "AriaLabel"], ["aria-hidden", "true", 1, "fa-solid", "fa-xmark"], [1, "vs-slideout-body"], ["data-testid", "archetype-shipped-readonly-banner", 1, "vs-shipped-readonly-banner"], [1, "vs-slideout-description"], [1, "vs-slideout-summary-grid"], [1, "vs-summary-item"], [1, "vs-summary-label"], [1, "vs-summary-value", "vs-summary-value--mono"], [1, "vs-summary-value", "vs-archetype-formats-meta"], [1, "vs-summary-value"], [1, "vs-slideout-section"], [1, "vs-slideout-section-title"], ["aria-hidden", "true", 1, "fa-solid", "fa-timeline"], [3, "Beats"], [1, "vs-slideout-beat-list"], ["data-testid", "slideout-beat-item", 1, "vs-slideout-beat-item"], ["data-testid", "slideout-pacing-section", 1, "vs-slideout-section"], ["data-testid", "slideout-guidance-section", 1, "vs-slideout-section"], ["type", "button", "mjButton", "", "Variant", "primary", "Size", "sm", "data-testid", "archetype-make-copy-button", 3, "click"], ["aria-hidden", "true", 1, "fa-regular", "fa-copy"], ["type", "button", "mjButton", "", "Variant", "primary", "Size", "sm", "data-testid", "archetype-edit-button", 3, "click"], ["aria-hidden", "true", 1, "fa-solid", "fa-pen-to-square"], ["type", "button", "mjButton", "", "Variant", "flat", "Size", "sm", "data-testid", "archetype-open-record-button", 3, "click"], ["aria-hidden", "true", 1, "fa-solid", "fa-circle-info"], [1, "vs-slideout-beat-header"], [1, "vs-slideout-beat-index"], [1, "vs-slideout-beat-name"], [1, "vs-slideout-beat-duration"], ["Variant", "info"], [1, "vs-slideout-beat-purpose"], [1, "vs-slideout-beat-guidance"], ["aria-hidden", "true", 1, "fa-solid", "fa-gauge-high"], [1, "vs-pacing-box"], [1, "vs-pacing-stat"], [1, "vs-pacing-hold-rules"], ["aria-hidden", "true", 1, "fa-solid", "fa-compass"], [1, "vs-guidance-text"], ["Size", "lg", 3, "Close", "Visible", "Title"], [3, "Saved", "Cancelled", "Provider", "Mode", "SourceArchetypeId", "EditingArchetypeId"]], template: function VideoStudioArchetypesResourceComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "mj-page-layout", 1)(2, "mj-page-header", 2)(3, "div", 3);
+            i0.ɵɵelement(4, "mj-stat-badge", 4);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(5, "div", 5)(6, "mj-refresh-button", 6);
+            i0.ɵɵlistener("Clicked", function VideoStudioArchetypesResourceComponent_Template_mj_refresh_button_Clicked_6_listener() { return ctx.Refresh(); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(7, "button", 7);
+            i0.ɵɵlistener("click", function VideoStudioArchetypesResourceComponent_Template_button_click_7_listener() { return ctx.OpenNewArchetypeEditor(); });
+            i0.ɵɵelement(8, "i", 8);
+            i0.ɵɵelementStart(9, "span");
+            i0.ɵɵtext(10, "New archetype");
+            i0.ɵɵelementEnd()()();
+            i0.ɵɵelementStart(11, "div", 9)(12, "mj-page-search", 10);
+            i0.ɵɵlistener("ValueChange", function VideoStudioArchetypesResourceComponent_Template_mj_page_search_ValueChange_12_listener($event) { return ctx.OnSearchChange($event); });
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(13, "mj-filter-popover", 11);
+            i0.ɵɵlistener("ClearAllRequested", function VideoStudioArchetypesResourceComponent_Template_mj_filter_popover_ClearAllRequested_13_listener() { return ctx.ClearAllFilters(); });
+            i0.ɵɵelementStart(14, "mj-filter-panel", 12);
+            i0.ɵɵlistener("ValuesChange", function VideoStudioArchetypesResourceComponent_Template_mj_filter_panel_ValuesChange_14_listener($event) { return ctx.OnFilterValuesChange($event); });
+            i0.ɵɵelementEnd()()()();
+            i0.ɵɵelementStart(15, "mj-page-body");
+            i0.ɵɵconditionalCreate(16, VideoStudioArchetypesResourceComponent_Conditional_16_Template, 2, 0, "div", 13)(17, VideoStudioArchetypesResourceComponent_Conditional_17_Template, 1, 1, "mj-empty-state", 14)(18, VideoStudioArchetypesResourceComponent_Conditional_18_Template, 1, 0, "mj-empty-state", 15)(19, VideoStudioArchetypesResourceComponent_Conditional_19_Template, 14, 10, "div", 16);
+            i0.ɵɵconditionalCreate(20, VideoStudioArchetypesResourceComponent_Conditional_20_Template, 2, 6, "mj-dialog", 17);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelement(21, "vs-studio-slide-in", 18);
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵadvance(4);
+            i0.ɵɵproperty("Count", ctx.FilteredCount)("Total", ctx.TotalCount);
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("Loading", ctx.IsLoading);
+            i0.ɵɵadvance(6);
+            i0.ɵɵproperty("Value", ctx.SearchText);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ActiveCount", ctx.ActivePopoverFilterCount)("ShowClearAll", ctx.ActivePopoverFilterCount > 0);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("Fields", ctx.FilterFields)("Values", ctx.FilterValues)("ShowReset", false);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.IsLoading && ctx.AllArchetypes.length === 0 ? 16 : ctx.LoadError ? 17 : ctx.AllArchetypes.length === 0 ? 18 : 19);
+            i0.ɵɵadvance(4);
+            i0.ɵɵconditional(ctx.IsEditorOpen ? 20 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("Provider", ctx.ProviderToUse)("CurrentUser", ctx.CurrentUser)("EnvironmentId", ctx.EnvironmentId)("ApplicationId", ctx.ApplicationId)("PageSource", ctx)("PageContext", ctx.PageContext)("PageTools", ctx.PageTools)("HeaderTitle", "Video Studio");
+        } }, dependencies: [i1.LoadingComponent, i2.MJVideoBadgeComponent, i2.MJVideoFormatGlyphComponent, i2.MJVideoBeatStripComponent, i3.VSArchetypeEditorComponent, i4.VSStudioSlideInComponent, i5.MJButtonDirective, i5.MJDialogComponent, i5.MJEmptyStateComponent, i5.MJFilterChipComponent, i5.MJPageLayoutComponent, i5.MJPageHeaderComponent, i5.MJPageBodyComponent, i5.MJPageSearchComponent, i5.MJFilterPopoverComponent, i5.MJFilterPanelComponent, i5.MJRefreshButtonComponent, i5.MJStatBadgeComponent], styles: ["[_nghost-%COMP%] {\n  display: block;\n  height: 100%;\n  width: 100%;\n}\n\n.vs-loading-state[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  min-height: 320px;\n  padding: var(--mj-space-8);\n  text-align: center;\n  background: var(--mj-bg-surface-card);\n  border: 1px dashed var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n}\n\n.vs-archetypes-workspace[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: 1fr;\n  min-height: 100%;\n}\n\n.vs-archetypes-workspace--split[_ngcontent-%COMP%] {\n  grid-template-columns: minmax(340px, 1fr) minmax(380px, 480px);\n  height: 100%;\n}\n\n.vs-archetypes-main[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-4);\n  min-width: 0;\n}\n\n.vs-archetypes-workspace--split[_ngcontent-%COMP%]   .vs-archetypes-main[_ngcontent-%COMP%] {\n  padding: var(--mj-space-5) var(--mj-space-6);\n  overflow-y: auto;\n}\n\n.vs-archetypes-filter-bar[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: var(--mj-space-2);\n}\n\n.vs-archetypes-chip-group[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: var(--mj-space-1-5);\n}\n\n.vs-archetypes-chip-divider[_ngcontent-%COMP%] {\n  width: 1px;\n  height: var(--mj-space-5);\n  background: var(--mj-border-default);\n  margin: 0 var(--mj-space-1);\n}\n\n.vs-archetypes-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));\n  gap: var(--mj-space-4);\n}\n\n.vs-archetype-card[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-3);\n  padding: var(--mj-space-4);\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n  cursor: pointer;\n  transition: var(--mj-transition-fast);\n}\n\n.vs-archetype-card[_ngcontent-%COMP%]:hover {\n  transform: translateY(-2px);\n  border-color: var(--mj-border-strong);\n  box-shadow: var(--mj-shadow-md);\n}\n\n.vs-archetype-card[_ngcontent-%COMP%]:focus-visible {\n  outline: none;\n  box-shadow: var(--mj-focus-ring);\n}\n\n.vs-archetype-card--selected[_ngcontent-%COMP%] {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 var(--mj-ring-width) color-mix(in srgb, var(--mj-brand-primary) 24%, transparent);\n}\n\n.vs-archetype-card-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: var(--mj-space-2);\n}\n\n.vs-archetype-title[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: var(--mj-text-base);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.vs-archetype-company-meta[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n  flex-shrink: 0;\n}\n\n.vs-archetype-description[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.vs-archetype-meta-line[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: var(--mj-space-2);\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n}\n\n.vs-archetype-category-meta[_ngcontent-%COMP%] {\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-primary);\n}\n\n.vs-archetype-duration-meta[_ngcontent-%COMP%] {\n  font-variant-numeric: tabular-nums;\n  color: var(--mj-text-secondary);\n}\n\n.vs-archetype-meta-sep[_ngcontent-%COMP%] {\n  color: var(--mj-text-muted);\n}\n\n.vs-archetype-formats-meta[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  flex-wrap: wrap;\n}\n\n.vs-archetype-beat-strip-wrap[_ngcontent-%COMP%] {\n  margin-top: auto;\n  padding-top: var(--mj-space-1);\n}\n\n.vs-archetype-slideout[_ngcontent-%COMP%] {\n  border-left: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.vs-slideout-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: var(--mj-space-3);\n  padding: var(--mj-space-4) var(--mj-space-5);\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n}\n\n.vs-slideout-title-wrap[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-1);\n  min-width: 0;\n}\n\n.vs-slideout-category-tag[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-xs);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-brand-primary);\n}\n\n.vs-slideout-title[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: var(--mj-text-lg);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.vs-slideout-actions[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  flex-shrink: 0;\n}\n\n.vs-slideout-body[_ngcontent-%COMP%] {\n  padding: var(--mj-space-5);\n  overflow-y: auto;\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-5);\n}\n\n.vs-slideout-description[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-secondary);\n  line-height: 1.5;\n}\n\n.vs-slideout-summary-grid[_ngcontent-%COMP%] {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: var(--mj-space-2-5);\n}\n\n.vs-summary-item[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-1);\n  padding: var(--mj-space-2-5) var(--mj-space-3);\n  border-radius: var(--mj-radius-md);\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-subtle);\n}\n\n.vs-summary-label[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n}\n\n.vs-summary-value[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.vs-summary-value--mono[_ngcontent-%COMP%] {\n  font-variant-numeric: tabular-nums;\n}\n\n.vs-slideout-section[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-2-5);\n}\n\n.vs-slideout-section-title[_ngcontent-%COMP%] {\n  margin: 0;\n  display: flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.vs-slideout-beat-list[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-2-5);\n}\n\n.vs-slideout-beat-item[_ngcontent-%COMP%] {\n  padding: var(--mj-space-3);\n  border-radius: var(--mj-radius-md);\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-1-5);\n}\n\n.vs-slideout-beat-header[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  flex-wrap: wrap;\n}\n\n.vs-slideout-beat-index[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--mj-space-5);\n  height: var(--mj-space-5);\n  border-radius: var(--mj-radius-full);\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  font-size: var(--mj-text-xs);\n  font-weight: var(--mj-font-semibold);\n}\n\n.vs-slideout-beat-name[_ngcontent-%COMP%] {\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-primary);\n}\n\n.vs-slideout-beat-duration[_ngcontent-%COMP%] {\n  margin-left: auto;\n  font-variant-numeric: tabular-nums;\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n}\n\n.vs-slideout-beat-purpose[_ngcontent-%COMP%], \n.vs-slideout-beat-guidance[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n}\n\n.vs-pacing-box[_ngcontent-%COMP%] {\n  padding: var(--mj-space-3);\n  border-radius: var(--mj-radius-md);\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-subtle);\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-1-5);\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n}\n\n.vs-pacing-stat[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  color: var(--mj-text-primary);\n}\n\n.vs-pacing-stat[_ngcontent-%COMP%]   strong[_ngcontent-%COMP%] {\n  font-variant-numeric: tabular-nums;\n}\n\n.vs-pacing-hold-rules[_ngcontent-%COMP%], \n.vs-guidance-text[_ngcontent-%COMP%] {\n  margin: 0;\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n  line-height: 1.5;\n}\n\n.vs-shipped-readonly-banner[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: flex-start;\n  gap: var(--mj-space-2);\n  padding: var(--mj-space-2-5) var(--mj-space-3);\n  border-radius: var(--mj-radius-md);\n  background: var(--mj-status-info-bg);\n  border: 1px solid var(--mj-border-subtle);\n  color: var(--mj-text-secondary);\n  font-size: var(--mj-text-xs);\n  line-height: 1.4;\n}\n\n.vs-resource-shell[_ngcontent-%COMP%] {\n  position: relative;\n  display: flex;\n  align-items: stretch;\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n  min-width: 0;\n  overflow: hidden;\n}\n\n.vs-resource-shell__page[_ngcontent-%COMP%] {\n  flex: 1;\n  min-width: 0;\n  min-height: 0;\n}\n\n@media (max-width: 1180px) {\n  .vs-resource-shell[_ngcontent-%COMP%]:has(> vs-studio-slide-in.vs-studio-slide-in--open)   .vs-archetypes-workspace--split[_ngcontent-%COMP%] {\n    grid-template-columns: 1fr;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .vs-archetype-card[_ngcontent-%COMP%] {\n    transition: none;\n  }\n}"], changeDetection: 0 });
+};
+VideoStudioArchetypesResourceComponent = __decorate([
+    RegisterClass(BaseResourceComponent, 'VideoStudioArchetypesResource')
+], VideoStudioArchetypesResourceComponent);
+export { VideoStudioArchetypesResourceComponent };
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(VideoStudioArchetypesResourceComponent, [{
+        type: Component,
+        args: [{ standalone: false, selector: 'mj-video-studio-archetypes-resource', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"vs-resource-shell\">\n  <mj-page-layout class=\"vs-resource-shell__page\">\n    <mj-page-header\n      Title=\"Archetypes\"\n      Icon=\"fa-solid fa-layer-group\"\n      Subtitle=\"Reusable beat templates, duration ranges, and pacing rules for video productions\"\n    >\n    <div meta>\n      <mj-stat-badge\n        [Count]=\"FilteredCount\"\n        [Total]=\"TotalCount\"\n        Label=\"Archetypes\"\n      />\n    </div>\n\n    <div actions>\n      <mj-refresh-button\n        [Loading]=\"IsLoading\"\n        (Clicked)=\"Refresh()\"\n      />\n      <button\n        type=\"button\"\n        mjButton\n        Variant=\"primary\"\n        data-testid=\"new-archetype-button\"\n        (click)=\"OpenNewArchetypeEditor()\"\n      >\n        <i class=\"fa-solid fa-plus\" aria-hidden=\"true\"></i>\n        <span>New archetype</span>\n      </button>\n    </div>\n\n    <div toolbar>\n      <mj-page-search\n        Placeholder=\"Search archetypes by name, category, format, or beat...\"\n        [Value]=\"SearchText\"\n        (ValueChange)=\"OnSearchChange($event)\"\n      />\n      <mj-filter-popover\n        Label=\"Filters\"\n        Icon=\"fa-solid fa-filter\"\n        [ActiveCount]=\"ActivePopoverFilterCount\"\n        [ShowClearAll]=\"ActivePopoverFilterCount > 0\"\n        (ClearAllRequested)=\"ClearAllFilters()\"\n      >\n        <mj-filter-panel\n          [Fields]=\"FilterFields\"\n          [Values]=\"FilterValues\"\n          [ShowReset]=\"false\"\n          (ValuesChange)=\"OnFilterValuesChange($event)\"\n        />\n      </mj-filter-popover>\n    </div>\n  </mj-page-header>\n\n  <mj-page-body>\n    @if (IsLoading && AllArchetypes.length === 0) {\n      <div class=\"vs-loading-state\" data-testid=\"archetypes-loading\">\n        <mj-loading Text=\"Loading video archetypes...\" Size=\"medium\" />\n      </div>\n    } @else if (LoadError) {\n      <mj-empty-state\n        data-testid=\"archetypes-error\"\n        Role=\"alert\"\n        Variant=\"error\"\n        Icon=\"fa-solid fa-triangle-exclamation\"\n        Title=\"Unable to load archetypes\"\n        [Message]=\"LoadError\"\n        ActionText=\"Try again\"\n        ActionIcon=\"fa-solid fa-rotate\"\n        ActionVariant=\"secondary\"\n        (Action)=\"Refresh()\"\n      ></mj-empty-state>\n    } @else if (AllArchetypes.length === 0) {\n      <mj-empty-state\n        data-testid=\"archetypes-empty\"\n        Variant=\"empty\"\n        Icon=\"fa-solid fa-layer-group\"\n        Title=\"No video archetypes available\"\n        Message=\"Archetypes define reusable narrative structures, beat templates, and pacing rules.\"\n      ></mj-empty-state>\n    } @else {\n      <div\n        class=\"vs-archetypes-workspace\"\n        [class.vs-archetypes-workspace--split]=\"SelectedArchetype !== null\"\n      >\n        <div class=\"vs-archetypes-main\">\n          <div class=\"vs-archetypes-filter-bar\" data-testid=\"archetypes-filter-chips\">\n            <div class=\"vs-archetypes-chip-group\" role=\"group\" aria-label=\"Filter by category\">\n              <mj-filter-chip\n                data-testid=\"archetype-category-chip-all\"\n                Label=\"All\"\n                [Count]=\"CategoryAllCount\"\n                [Active]=\"CategoryFilter === 'all'\"\n                (Clicked)=\"SelectCategoryChip('all')\"\n              ></mj-filter-chip>\n              @for (chip of CategoryChipItems; track chip.Category) {\n                <mj-filter-chip\n                  [attr.data-testid]=\"'archetype-category-chip-' + chip.Category\"\n                  [Label]=\"chip.Label\"\n                  [Count]=\"chip.Count\"\n                  [Active]=\"CategoryFilter === chip.Category\"\n                  (Clicked)=\"SelectCategoryChip(chip.Category)\"\n                ></mj-filter-chip>\n              }\n            </div>\n\n            <span class=\"vs-archetypes-chip-divider\" aria-hidden=\"true\"></span>\n\n            <div class=\"vs-archetypes-chip-group\" role=\"group\" aria-label=\"Filter by scope\">\n              <mj-filter-chip\n                data-testid=\"archetype-scope-chip-shipped\"\n                Label=\"Shipped\"\n                [Count]=\"ShippedCount\"\n                [Active]=\"ScopeFilter === 'shipped'\"\n                (Clicked)=\"ToggleScopeChip('shipped')\"\n              ></mj-filter-chip>\n              <mj-filter-chip\n                data-testid=\"archetype-scope-chip-company\"\n                Label=\"Yours\"\n                [Count]=\"CompanyCount\"\n                [Active]=\"ScopeFilter === 'company'\"\n                (Clicked)=\"ToggleScopeChip('company')\"\n              ></mj-filter-chip>\n            </div>\n          </div>\n\n          @if (FilteredArchetypes.length === 0) {\n            <mj-empty-state\n              data-testid=\"archetypes-empty\"\n              Variant=\"no-results\"\n              Icon=\"fa-solid fa-layer-group\"\n              Title=\"No archetypes match your filters\"\n              Message=\"Try clearing your search query or adjusting the active category or scope filters.\"\n              ActionText=\"Reset filters\"\n              ActionIcon=\"fa-solid fa-filter-circle-xmark\"\n              ActionVariant=\"secondary\"\n              (Action)=\"ResetFiltersAndSearch()\"\n            ></mj-empty-state>\n          } @else {\n            <div class=\"vs-archetypes-grid\" data-testid=\"archetypes-grid\">\n              @for (arch of FilteredArchetypes; track arch.ID) {\n                <article\n                  class=\"vs-archetype-card\"\n                  [class.vs-archetype-card--selected]=\"SelectedArchetype?.ID === arch.ID\"\n                  [attr.data-testid]=\"'archetype-card-' + arch.ID\"\n                  tabindex=\"0\"\n                  role=\"button\"\n                  [attr.aria-pressed]=\"SelectedArchetype?.ID === arch.ID\"\n                  (click)=\"SelectArchetype(arch)\"\n                  (keydown.enter)=\"SelectArchetype(arch)\"\n                  (keydown.space)=\"$event.preventDefault(); SelectArchetype(arch)\"\n                >\n                  <div class=\"vs-archetype-card-header\">\n                    <h3 class=\"vs-archetype-title\" [title]=\"arch.Name\">\n                      {{ arch.Name }}\n                    </h3>\n\n                    @if (arch.CompanyName) {\n                      <span\n                        class=\"vs-archetype-company-meta\"\n                        data-testid=\"archetype-company-badge\"\n                      >\n                        {{ arch.CompanyName }}\n                      </span>\n                    } @else if (arch.IsShipped) {\n                      <mj-video-badge\n                        Variant=\"neutral\"\n                        data-testid=\"archetype-shipped-badge\"\n                      >\n                        <i class=\"fa-solid fa-lock\" aria-hidden=\"true\"></i>\n                        <span>Shipped</span>\n                      </mj-video-badge>\n                    }\n                  </div>\n\n                  @if (arch.Description) {\n                    <p class=\"vs-archetype-description\">{{ arch.Description }}</p>\n                  }\n\n                  <div class=\"vs-archetype-meta-line\">\n                    <span\n                      class=\"vs-archetype-category-meta\"\n                      data-testid=\"archetype-category-meta\"\n                    >\n                      {{ FormatCategoryLabel(arch.Category) }}\n                    </span>\n                    <span class=\"vs-archetype-meta-sep\" aria-hidden=\"true\">\u00B7</span>\n                    <span class=\"vs-archetype-duration-meta\" data-testid=\"archetype-duration-badge\">\n                      {{ FormatTime(arch.DefaultDurationSeconds) }}\n                      ({{ FormatTimeRange(arch.MinDurationSeconds, arch.MaxDurationSeconds) }})\n                    </span>\n                    <span class=\"vs-archetype-meta-sep\" aria-hidden=\"true\">\u00B7</span>\n                    <span class=\"vs-archetype-formats-meta\" data-testid=\"archetype-formats-badge\">\n                      @for (fmt of ParseFormats(arch.DefaultFormats); track fmt) {\n                        <mj-video-format-glyph [Format]=\"fmt\" Size=\"sm\"></mj-video-format-glyph>\n                      }\n                    </span>\n                  </div>\n\n                  <div class=\"vs-archetype-beat-strip-wrap\">\n                    <mj-video-beat-strip\n                      data-testid=\"archetype-beat-timeline\"\n                      [Beats]=\"arch.BeatItems || []\"\n                    ></mj-video-beat-strip>\n                  </div>\n                </article>\n              }\n            </div>\n          }\n        </div>\n\n        @if (SelectedArchetype; as selected) {\n          <aside class=\"vs-archetype-slideout\" data-testid=\"archetype-slideout\">\n            <header class=\"vs-slideout-header\">\n              <div class=\"vs-slideout-title-wrap\">\n                <span class=\"vs-slideout-category-tag\">\n                  {{ FormatCategoryLabel(selected.Category) }}\n                </span>\n                <h2 class=\"vs-slideout-title\">{{ selected.Name }}</h2>\n              </div>\n\n              <div class=\"vs-slideout-actions\">\n                @if (selected.IsShipped) {\n                  <button\n                    type=\"button\"\n                    mjButton\n                    Variant=\"primary\"\n                    Size=\"sm\"\n                    data-testid=\"archetype-make-copy-button\"\n                    (click)=\"OpenCopyArchetypeEditor(selected, $event)\"\n                  >\n                    <i class=\"fa-regular fa-copy\" aria-hidden=\"true\"></i>\n                    <span>Make a copy</span>\n                  </button>\n                } @else {\n                  <button\n                    type=\"button\"\n                    mjButton\n                    Variant=\"primary\"\n                    Size=\"sm\"\n                    data-testid=\"archetype-edit-button\"\n                    (click)=\"OpenEditArchetypeEditor(selected, $event)\"\n                  >\n                    <i class=\"fa-solid fa-pen-to-square\" aria-hidden=\"true\"></i>\n                    <span>Edit</span>\n                  </button>\n                  <button\n                    type=\"button\"\n                    mjButton\n                    Variant=\"flat\"\n                    Size=\"sm\"\n                    data-testid=\"archetype-open-record-button\"\n                    (click)=\"OpenArchetypeRecord(selected, $event)\"\n                  >\n                    <span>Open record</span>\n                  </button>\n                }\n                <button\n                  type=\"button\"\n                  mjButton\n                  Variant=\"icon\"\n                  Size=\"sm\"\n                  [AriaLabel]=\"'Close archetype preview'\"\n                  data-testid=\"archetype-slideout-close\"\n                  (click)=\"CloseSlideOut()\"\n                >\n                  <i class=\"fa-solid fa-xmark\" aria-hidden=\"true\"></i>\n                </button>\n              </div>\n            </header>\n\n            <div class=\"vs-slideout-body\">\n              @if (selected.IsShipped) {\n                <div class=\"vs-shipped-readonly-banner\" data-testid=\"archetype-shipped-readonly-banner\">\n                  <i class=\"fa-solid fa-circle-info\" aria-hidden=\"true\"></i>\n                  <span>\n                    Shipped archetypes are read-only templates. Make a copy of this archetype to customize it for a specific company.\n                  </span>\n                </div>\n              }\n\n              @if (selected.Description) {\n                <p class=\"vs-slideout-description\">{{ selected.Description }}</p>\n              }\n\n              <div class=\"vs-slideout-summary-grid\">\n                <div class=\"vs-summary-item\">\n                  <span class=\"vs-summary-label\">Default duration</span>\n                  <span class=\"vs-summary-value vs-summary-value--mono\">\n                    {{ FormatTime(selected.DefaultDurationSeconds) }}\n                  </span>\n                </div>\n                <div class=\"vs-summary-item\">\n                  <span class=\"vs-summary-label\">Duration range</span>\n                  <span class=\"vs-summary-value vs-summary-value--mono\">\n                    {{ FormatTimeRange(selected.MinDurationSeconds, selected.MaxDurationSeconds) }}\n                  </span>\n                </div>\n                <div class=\"vs-summary-item\">\n                  <span class=\"vs-summary-label\">Default formats</span>\n                  <span class=\"vs-summary-value vs-archetype-formats-meta\">\n                    @for (fmt of ParseFormats(selected.DefaultFormats); track fmt) {\n                      <mj-video-format-glyph [Format]=\"fmt\" Size=\"sm\"></mj-video-format-glyph>\n                    }\n                  </span>\n                </div>\n                <div class=\"vs-summary-item\">\n                  <span class=\"vs-summary-label\">Interaction mode</span>\n                  <span class=\"vs-summary-value\">{{ selected.DefaultInteractionMode }}</span>\n                </div>\n              </div>\n\n              <section class=\"vs-slideout-section\">\n                <h3 class=\"vs-slideout-section-title\">\n                  <i class=\"fa-solid fa-timeline\" aria-hidden=\"true\"></i>\n                  <span>Beat template ({{ selected.Beats.length }})</span>\n                </h3>\n                <mj-video-beat-strip\n                  [Beats]=\"selected.BeatItems || []\"\n                ></mj-video-beat-strip>\n                <div class=\"vs-slideout-beat-list\">\n                  @for (beat of selected.Beats; track beat.Key; let idx = $index) {\n                    <div class=\"vs-slideout-beat-item\" data-testid=\"slideout-beat-item\">\n                      <div class=\"vs-slideout-beat-header\">\n                        <span class=\"vs-slideout-beat-index\">{{ idx + 1 }}</span>\n                        <strong class=\"vs-slideout-beat-name\">{{ beat.Label }}</strong>\n                        <span class=\"vs-slideout-beat-duration\">\n                          {{ FormatTime(beat.ComputedDurationSeconds) }}\n                          ({{ FormatTimeRange(beat.MinDurationSeconds, beat.MaxDurationSeconds) }})\n                        </span>\n                        @if (beat.RequiresDataBinding) {\n                          <mj-video-badge Variant=\"info\">Data bound</mj-video-badge>\n                        }\n                      </div>\n                      <p class=\"vs-slideout-beat-purpose\">{{ beat.Purpose }}</p>\n                      @if (beat.Guidance) {\n                        <p class=\"vs-slideout-beat-guidance\">{{ beat.Guidance }}</p>\n                      }\n                    </div>\n                  }\n                </div>\n              </section>\n\n              @if (selected.Pacing) {\n                <section class=\"vs-slideout-section\" data-testid=\"slideout-pacing-section\">\n                  <h3 class=\"vs-slideout-section-title\">\n                    <i class=\"fa-solid fa-gauge-high\" aria-hidden=\"true\"></i>\n                    <span>Pacing rules</span>\n                  </h3>\n                  <div class=\"vs-pacing-box\">\n                    <div class=\"vs-pacing-stat\">\n                      <span>Average time between visual changes:</span>\n                      <strong>{{ FormatTime(selected.Pacing.AvgSecondsBetweenChanges) }}</strong>\n                    </div>\n                    @if (selected.Pacing.HoldRules) {\n                      <p class=\"vs-pacing-hold-rules\">{{ selected.Pacing.HoldRules }}</p>\n                    }\n                  </div>\n                </section>\n              }\n\n              @if (selected.Guidance) {\n                <section class=\"vs-slideout-section\" data-testid=\"slideout-guidance-section\">\n                  <h3 class=\"vs-slideout-section-title\">\n                    <i class=\"fa-solid fa-compass\" aria-hidden=\"true\"></i>\n                    <span>Producer guidance</span>\n                  </h3>\n                  <p class=\"vs-guidance-text\">{{ selected.Guidance }}</p>\n                </section>\n              }\n            </div>\n          </aside>\n        }\n      </div>\n    }\n\n    @if (IsEditorOpen) {\n      <mj-dialog\n        [Visible]=\"true\"\n        [Title]=\"EditorDialogTitle\"\n        Size=\"lg\"\n        (Close)=\"CloseArchetypeEditor()\"\n      >\n        <vs-archetype-editor\n          [Provider]=\"ProviderToUse\"\n          [Mode]=\"EditorMode\"\n          [SourceArchetypeId]=\"EditorSourceArchetypeId\"\n          [EditingArchetypeId]=\"EditorEditingArchetypeId\"\n          (Saved)=\"OnArchetypeEditorSaved($event)\"\n          (Cancelled)=\"CloseArchetypeEditor()\"\n        ></vs-archetype-editor>\n      </mj-dialog>\n    }\n  </mj-page-body>\n  </mj-page-layout>\n\n  <vs-studio-slide-in\n    [Provider]=\"ProviderToUse\"\n    [CurrentUser]=\"CurrentUser\"\n    [EnvironmentId]=\"EnvironmentId\"\n    [ApplicationId]=\"ApplicationId\"\n    [PageSource]=\"this\"\n    [PageContext]=\"PageContext\"\n    [PageTools]=\"PageTools\"\n    [HeaderTitle]=\"'Video Studio'\"\n  ></vs-studio-slide-in>\n</div>\n", styles: [":host {\n  display: block;\n  height: 100%;\n  width: 100%;\n}\n\n.vs-loading-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  min-height: 320px;\n  padding: var(--mj-space-8);\n  text-align: center;\n  background: var(--mj-bg-surface-card);\n  border: 1px dashed var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n}\n\n.vs-archetypes-workspace {\n  display: grid;\n  grid-template-columns: 1fr;\n  min-height: 100%;\n}\n\n.vs-archetypes-workspace--split {\n  grid-template-columns: minmax(340px, 1fr) minmax(380px, 480px);\n  height: 100%;\n}\n\n.vs-archetypes-main {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-4);\n  min-width: 0;\n}\n\n.vs-archetypes-workspace--split .vs-archetypes-main {\n  padding: var(--mj-space-5) var(--mj-space-6);\n  overflow-y: auto;\n}\n\n.vs-archetypes-filter-bar {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: var(--mj-space-2);\n}\n\n.vs-archetypes-chip-group {\n  display: inline-flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: var(--mj-space-1-5);\n}\n\n.vs-archetypes-chip-divider {\n  width: 1px;\n  height: var(--mj-space-5);\n  background: var(--mj-border-default);\n  margin: 0 var(--mj-space-1);\n}\n\n.vs-archetypes-grid {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));\n  gap: var(--mj-space-4);\n}\n\n.vs-archetype-card {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-3);\n  padding: var(--mj-space-4);\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: var(--mj-radius-lg);\n  cursor: pointer;\n  transition: var(--mj-transition-fast);\n}\n\n.vs-archetype-card:hover {\n  transform: translateY(-2px);\n  border-color: var(--mj-border-strong);\n  box-shadow: var(--mj-shadow-md);\n}\n\n.vs-archetype-card:focus-visible {\n  outline: none;\n  box-shadow: var(--mj-focus-ring);\n}\n\n.vs-archetype-card--selected {\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 var(--mj-ring-width) color-mix(in srgb, var(--mj-brand-primary) 24%, transparent);\n}\n\n.vs-archetype-card-header {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: var(--mj-space-2);\n}\n\n.vs-archetype-title {\n  margin: 0;\n  font-size: var(--mj-text-base);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.vs-archetype-company-meta {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n  flex-shrink: 0;\n}\n\n.vs-archetype-description {\n  margin: 0;\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n}\n\n.vs-archetype-meta-line {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: var(--mj-space-2);\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n}\n\n.vs-archetype-category-meta {\n  font-weight: var(--mj-font-medium);\n  color: var(--mj-text-primary);\n}\n\n.vs-archetype-duration-meta {\n  font-variant-numeric: tabular-nums;\n  color: var(--mj-text-secondary);\n}\n\n.vs-archetype-meta-sep {\n  color: var(--mj-text-muted);\n}\n\n.vs-archetype-formats-meta {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  flex-wrap: wrap;\n}\n\n.vs-archetype-beat-strip-wrap {\n  margin-top: auto;\n  padding-top: var(--mj-space-1);\n}\n\n.vs-archetype-slideout {\n  border-left: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.vs-slideout-header {\n  display: flex;\n  align-items: flex-start;\n  justify-content: space-between;\n  gap: var(--mj-space-3);\n  padding: var(--mj-space-4) var(--mj-space-5);\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface-card);\n}\n\n.vs-slideout-title-wrap {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-1);\n  min-width: 0;\n}\n\n.vs-slideout-category-tag {\n  font-size: var(--mj-text-xs);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-brand-primary);\n}\n\n.vs-slideout-title {\n  margin: 0;\n  font-size: var(--mj-text-lg);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.vs-slideout-actions {\n  display: flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  flex-shrink: 0;\n}\n\n.vs-slideout-body {\n  padding: var(--mj-space-5);\n  overflow-y: auto;\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-5);\n}\n\n.vs-slideout-description {\n  margin: 0;\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-secondary);\n  line-height: 1.5;\n}\n\n.vs-slideout-summary-grid {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  gap: var(--mj-space-2-5);\n}\n\n.vs-summary-item {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-1);\n  padding: var(--mj-space-2-5) var(--mj-space-3);\n  border-radius: var(--mj-radius-md);\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-subtle);\n}\n\n.vs-summary-label {\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n}\n\n.vs-summary-value {\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.vs-summary-value--mono {\n  font-variant-numeric: tabular-nums;\n}\n\n.vs-slideout-section {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-2-5);\n}\n\n.vs-slideout-section-title {\n  margin: 0;\n  display: flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  font-size: var(--mj-text-sm);\n  font-weight: var(--mj-font-semibold);\n  color: var(--mj-text-primary);\n}\n\n.vs-slideout-beat-list {\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-2-5);\n}\n\n.vs-slideout-beat-item {\n  padding: var(--mj-space-3);\n  border-radius: var(--mj-radius-md);\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-1-5);\n}\n\n.vs-slideout-beat-header {\n  display: flex;\n  align-items: center;\n  gap: var(--mj-space-2);\n  flex-wrap: wrap;\n}\n\n.vs-slideout-beat-index {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: var(--mj-space-5);\n  height: var(--mj-space-5);\n  border-radius: var(--mj-radius-full);\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  font-size: var(--mj-text-xs);\n  font-weight: var(--mj-font-semibold);\n}\n\n.vs-slideout-beat-name {\n  font-size: var(--mj-text-sm);\n  color: var(--mj-text-primary);\n}\n\n.vs-slideout-beat-duration {\n  margin-left: auto;\n  font-variant-numeric: tabular-nums;\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-muted);\n}\n\n.vs-slideout-beat-purpose,\n.vs-slideout-beat-guidance {\n  margin: 0;\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n}\n\n.vs-pacing-box {\n  padding: var(--mj-space-3);\n  border-radius: var(--mj-radius-md);\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-subtle);\n  display: flex;\n  flex-direction: column;\n  gap: var(--mj-space-1-5);\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n}\n\n.vs-pacing-stat {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  color: var(--mj-text-primary);\n}\n\n.vs-pacing-stat strong {\n  font-variant-numeric: tabular-nums;\n}\n\n.vs-pacing-hold-rules,\n.vs-guidance-text {\n  margin: 0;\n  font-size: var(--mj-text-xs);\n  color: var(--mj-text-secondary);\n  line-height: 1.5;\n}\n\n.vs-shipped-readonly-banner {\n  display: flex;\n  align-items: flex-start;\n  gap: var(--mj-space-2);\n  padding: var(--mj-space-2-5) var(--mj-space-3);\n  border-radius: var(--mj-radius-md);\n  background: var(--mj-status-info-bg);\n  border: 1px solid var(--mj-border-subtle);\n  color: var(--mj-text-secondary);\n  font-size: var(--mj-text-xs);\n  line-height: 1.4;\n}\n\n.vs-resource-shell {\n  position: relative;\n  display: flex;\n  align-items: stretch;\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n  min-width: 0;\n  overflow: hidden;\n}\n\n.vs-resource-shell__page {\n  flex: 1;\n  min-width: 0;\n  min-height: 0;\n}\n\n@media (max-width: 1180px) {\n  .vs-resource-shell:has(> vs-studio-slide-in.vs-studio-slide-in--open) .vs-archetypes-workspace--split {\n    grid-template-columns: 1fr;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .vs-archetype-card {\n    transition: none;\n  }\n}\n"] }]
+    }], null, null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(VideoStudioArchetypesResourceComponent, { className: "VideoStudioArchetypesResourceComponent", filePath: "src/VideoStudio/resources/video-studio-archetypes-resource.component.ts", lineNumber: 95 }); })();
+//# sourceMappingURL=video-studio-archetypes-resource.component.js.map