import { Component } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "../../services/component-studio-state.service";
import * as i2 from "../editors/spec-editor.component";
import * as i3 from "../editors/code-editor-panel.component";
import * as i4 from "../editors/requirements-editor.component";
import * as i5 from "../editors/data-requirements-editor.component";
function EditorTabsComponent_Case_19_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "mj-spec-editor");
} }
function EditorTabsComponent_Case_20_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "mj-code-editor-panel");
} }
function EditorTabsComponent_Case_21_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "mj-requirements-editor", 10);
} if (rf & 2) {
    i0.ɵɵproperty("Field", "functionalRequirements")("Title", "Functional Requirements");
} }
function EditorTabsComponent_Case_22_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "mj-requirements-editor", 10);
} if (rf & 2) {
    i0.ɵɵproperty("Field", "technicalDesign")("Title", "Technical Design");
} }
function EditorTabsComponent_Case_23_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "mj-data-requirements-editor");
} }
export class EditorTabsComponent {
    state;
    cdr;
    stateChangedSub = null;
    constructor(state, cdr) {
        this.state = state;
        this.cdr = cdr;
    }
    ngOnInit() {
        this.stateChangedSub = this.state.StateChanged.subscribe(() => {
            this.cdr.detectChanges();
        });
    }
    ngOnDestroy() {
        if (this.stateChangedSub) {
            this.stateChangedSub.unsubscribe();
            this.stateChangedSub = null;
        }
    }
    SelectTab(index) {
        this.state.ActiveTab = index;
        this.cdr.detectChanges();
    }
    static ɵfac = function EditorTabsComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || EditorTabsComponent)(i0.ɵɵdirectiveInject(i1.ComponentStudioStateService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: EditorTabsComponent, selectors: [["mj-editor-tabs"]], standalone: false, decls: 24, vars: 11, consts: [[1, "editor-tabs-container"], [1, "tab-bar"], [1, "tab-pill", 3, "click"], [1, "fa-solid", "fa-file-code"], [1, "fa-solid", "fa-code"], [1, "fa-solid", "fa-clipboard-list"], [1, "fa-solid", "fa-drafting-compass"], [1, "fa-solid", "fa-database"], [1, "tab-spacer"], [1, "tab-content"], [3, "Field", "Title"]], template: function EditorTabsComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "button", 2);
            i0.ɵɵlistener("click", function EditorTabsComponent_Template_button_click_2_listener() { return ctx.SelectTab(0); });
            i0.ɵɵelement(3, "i", 3);
            i0.ɵɵtext(4, " Spec ");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(5, "button", 2);
            i0.ɵɵlistener("click", function EditorTabsComponent_Template_button_click_5_listener() { return ctx.SelectTab(1); });
            i0.ɵɵelement(6, "i", 4);
            i0.ɵɵtext(7, " Code ");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(8, "button", 2);
            i0.ɵɵlistener("click", function EditorTabsComponent_Template_button_click_8_listener() { return ctx.SelectTab(2); });
            i0.ɵɵelement(9, "i", 5);
            i0.ɵɵtext(10, " Requirements ");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(11, "button", 2);
            i0.ɵɵlistener("click", function EditorTabsComponent_Template_button_click_11_listener() { return ctx.SelectTab(3); });
            i0.ɵɵelement(12, "i", 6);
            i0.ɵɵtext(13, " Design ");
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(14, "button", 2);
            i0.ɵɵlistener("click", function EditorTabsComponent_Template_button_click_14_listener() { return ctx.SelectTab(4); });
            i0.ɵɵelement(15, "i", 7);
            i0.ɵɵtext(16, " Data ");
            i0.ɵɵelementEnd();
            i0.ɵɵelement(17, "span", 8);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(18, "div", 9);
            i0.ɵɵconditionalCreate(19, EditorTabsComponent_Case_19_Template, 1, 0, "mj-spec-editor")(20, EditorTabsComponent_Case_20_Template, 1, 0, "mj-code-editor-panel")(21, EditorTabsComponent_Case_21_Template, 1, 2, "mj-requirements-editor", 10)(22, EditorTabsComponent_Case_22_Template, 1, 2, "mj-requirements-editor", 10)(23, EditorTabsComponent_Case_23_Template, 1, 0, "mj-data-requirements-editor");
            i0.ɵɵelementEnd()();
        } if (rf & 2) {
            let tmp_5_0;
            i0.ɵɵadvance(2);
            i0.ɵɵclassProp("active", ctx.state.ActiveTab === 0);
            i0.ɵɵadvance(3);
            i0.ɵɵclassProp("active", ctx.state.ActiveTab === 1);
            i0.ɵɵadvance(3);
            i0.ɵɵclassProp("active", ctx.state.ActiveTab === 2);
            i0.ɵɵadvance(3);
            i0.ɵɵclassProp("active", ctx.state.ActiveTab === 3);
            i0.ɵɵadvance(3);
            i0.ɵɵclassProp("active", ctx.state.ActiveTab === 4);
            i0.ɵɵadvance(5);
            i0.ɵɵconditional((tmp_5_0 = ctx.state.ActiveTab) === 0 ? 19 : tmp_5_0 === 1 ? 20 : tmp_5_0 === 2 ? 21 : tmp_5_0 === 3 ? 22 : tmp_5_0 === 4 ? 23 : -1);
        } }, dependencies: [i2.SpecEditorComponent, i3.CodeEditorPanelComponent, i4.RequirementsEditorComponent, i5.DataRequirementsEditorComponent], styles: ["[_nghost-%COMP%] {\n      display: flex;\n      flex: 1;\n      overflow: hidden;\n    }\n\n    .editor-tabs-container[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      overflow: hidden;\n    }\n\n    .tab-bar[_ngcontent-%COMP%] {\n      display: flex;\n      align-items: center;\n      padding: 0 8px;\n      height: 38px;\n      background: var(--mj-bg-surface-sunken);\n      border-bottom: 1px solid var(--mj-border-default);\n      flex-shrink: 0;\n      gap: 2px;\n    }\n\n    .tab-pill[_ngcontent-%COMP%] {\n      display: inline-flex;\n      align-items: center;\n      gap: 5px;\n      padding: 5px 12px;\n      border: none;\n      border-radius: 8px;\n      background: transparent;\n      color: var(--mj-text-secondary);\n      font-size: 12px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: all 0.15s ease;\n      white-space: nowrap;\n      font-family: inherit;\n    }\n\n    .tab-pill[_ngcontent-%COMP%]:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-primary);\n    }\n\n    .tab-pill.active[_ngcontent-%COMP%] {\n      background: var(--mj-bg-surface);\n      color: var(--mj-brand-primary);\n      font-weight: 600;\n      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);\n    }\n\n    .tab-pill[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 11px;\n    }\n\n    .tab-spacer[_ngcontent-%COMP%] {\n      flex: 1;\n    }\n\n    .tab-content[_ngcontent-%COMP%] {\n      flex: 1;\n      overflow: hidden;\n      display: flex;\n      flex-direction: column;\n    }\n\n    .tab-content[_ngcontent-%COMP%]    > *[_ngcontent-%COMP%] {\n      flex: 1;\n      overflow: hidden;\n    }"] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(EditorTabsComponent, [{
        type: Component,
        args: [{ standalone: false, selector: 'mj-editor-tabs', template: `
    <div class="editor-tabs-container">
      <div class="tab-bar">
        <button class="tab-pill" [class.active]="state.ActiveTab === 0" (click)="SelectTab(0)">
          <i class="fa-solid fa-file-code"></i> Spec
        </button>
        <button class="tab-pill" [class.active]="state.ActiveTab === 1" (click)="SelectTab(1)">
          <i class="fa-solid fa-code"></i> Code
        </button>
        <button class="tab-pill" [class.active]="state.ActiveTab === 2" (click)="SelectTab(2)">
          <i class="fa-solid fa-clipboard-list"></i> Requirements
        </button>
        <button class="tab-pill" [class.active]="state.ActiveTab === 3" (click)="SelectTab(3)">
          <i class="fa-solid fa-drafting-compass"></i> Design
        </button>
        <button class="tab-pill" [class.active]="state.ActiveTab === 4" (click)="SelectTab(4)">
          <i class="fa-solid fa-database"></i> Data
        </button>
        <span class="tab-spacer"></span>
      </div>

      <div class="tab-content">
        @switch (state.ActiveTab) {
          @case (0) {
            <mj-spec-editor></mj-spec-editor>
          }
          @case (1) {
            <mj-code-editor-panel></mj-code-editor-panel>
          }
          @case (2) {
            <mj-requirements-editor [Field]="'functionalRequirements'" [Title]="'Functional Requirements'"></mj-requirements-editor>
          }
          @case (3) {
            <mj-requirements-editor [Field]="'technicalDesign'" [Title]="'Technical Design'"></mj-requirements-editor>
          }
          @case (4) {
            <mj-data-requirements-editor></mj-data-requirements-editor>
          }
        }
      </div>
    </div>
  `, styles: ["\n    :host {\n      display: flex;\n      flex: 1;\n      overflow: hidden;\n    }\n\n    .editor-tabs-container {\n      display: flex;\n      flex-direction: column;\n      flex: 1;\n      overflow: hidden;\n    }\n\n    .tab-bar {\n      display: flex;\n      align-items: center;\n      padding: 0 8px;\n      height: 38px;\n      background: var(--mj-bg-surface-sunken);\n      border-bottom: 1px solid var(--mj-border-default);\n      flex-shrink: 0;\n      gap: 2px;\n    }\n\n    .tab-pill {\n      display: inline-flex;\n      align-items: center;\n      gap: 5px;\n      padding: 5px 12px;\n      border: none;\n      border-radius: 8px;\n      background: transparent;\n      color: var(--mj-text-secondary);\n      font-size: 12px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: all 0.15s ease;\n      white-space: nowrap;\n      font-family: inherit;\n    }\n\n    .tab-pill:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-primary);\n    }\n\n    .tab-pill.active {\n      background: var(--mj-bg-surface);\n      color: var(--mj-brand-primary);\n      font-weight: 600;\n      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);\n    }\n\n    .tab-pill i {\n      font-size: 11px;\n    }\n\n    .tab-spacer {\n      flex: 1;\n    }\n\n    .tab-content {\n      flex: 1;\n      overflow: hidden;\n      display: flex;\n      flex-direction: column;\n    }\n\n    .tab-content > * {\n      flex: 1;\n      overflow: hidden;\n    }\n  "] }]
    }], () => [{ type: i1.ComponentStudioStateService }, { type: i0.ChangeDetectorRef }], null); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(EditorTabsComponent, { className: "EditorTabsComponent", filePath: "src/ComponentStudio/components/workspace/editor-tabs.component.ts", lineNumber: 125 }); })();
//# sourceMappingURL=editor-tabs.component.js.map