import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core';
import * as i0 from "@angular/core";
const _forTrack0 = ($index, $item) => $item.id;
function ActionBreadcrumbComponent_For_2_Conditional_0_Conditional_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "i");
} if (rf & 2) {
    const item_r2 = i0.ɵɵnextContext(2).$implicit;
    i0.ɵɵclassMap(item_r2.icon);
} }
function ActionBreadcrumbComponent_For_2_Conditional_0_Template(rf, ctx) { if (rf & 1) {
    const _r1 = i0.ɵɵgetCurrentView();
    i0.ɵɵelementStart(0, "button", 2);
    i0.ɵɵlistener("click", function ActionBreadcrumbComponent_For_2_Conditional_0_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r1); const item_r2 = i0.ɵɵnextContext().$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.selectCategory(item_r2.id)); });
    i0.ɵɵconditionalCreate(1, ActionBreadcrumbComponent_For_2_Conditional_0_Conditional_1_Template, 1, 2, "i", 3);
    i0.ɵɵelementStart(2, "span", 4);
    i0.ɵɵtext(3);
    i0.ɵɵelementEnd()();
    i0.ɵɵelementStart(4, "span", 5);
    i0.ɵɵelement(5, "i", 6);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r3 = i0.ɵɵnextContext();
    const item_r2 = ctx_r3.$implicit;
    const ɵ$index_3_r5 = ctx_r3.$index;
    i0.ɵɵproperty("title", item_r2.name);
    i0.ɵɵadvance();
    i0.ɵɵconditional(ɵ$index_3_r5 === 0 ? 1 : -1);
    i0.ɵɵadvance(2);
    i0.ɵɵtextInterpolate(item_r2.name);
} }
function ActionBreadcrumbComponent_For_2_Conditional_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "i");
} if (rf & 2) {
    const item_r2 = i0.ɵɵnextContext(2).$implicit;
    i0.ɵɵclassMap(item_r2.icon);
} }
function ActionBreadcrumbComponent_For_2_Conditional_1_Conditional_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelement(0, "i", 7);
} }
function ActionBreadcrumbComponent_For_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "span", 1);
    i0.ɵɵconditionalCreate(1, ActionBreadcrumbComponent_For_2_Conditional_1_Conditional_1_Template, 1, 2, "i", 3)(2, ActionBreadcrumbComponent_For_2_Conditional_1_Conditional_2_Template, 1, 0, "i", 7);
    i0.ɵɵelementStart(3, "span", 4);
    i0.ɵɵtext(4);
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const item_r2 = i0.ɵɵnextContext().$implicit;
    const ctx_r2 = i0.ɵɵnextContext();
    i0.ɵɵproperty("title", item_r2.name);
    i0.ɵɵadvance();
    i0.ɵɵconditional(ctx_r2.Breadcrumbs.length === 1 ? 1 : 2);
    i0.ɵɵadvance(3);
    i0.ɵɵtextInterpolate(item_r2.name);
} }
function ActionBreadcrumbComponent_For_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵconditionalCreate(0, ActionBreadcrumbComponent_For_2_Conditional_0_Template, 6, 3)(1, ActionBreadcrumbComponent_For_2_Conditional_1_Template, 5, 3, "span", 1);
} if (rf & 2) {
    const ɵ$index_3_r5 = ctx.$index;
    const ɵ$count_3_r6 = ctx.$count;
    i0.ɵɵconditional(!(ɵ$index_3_r5 === ɵ$count_3_r6 - 1) ? 0 : 1);
} }
export class ActionBreadcrumbComponent {
    SelectedCategoryId = 'all';
    Categories = [];
    CategorySelect = new EventEmitter();
    Breadcrumbs = [];
    ngOnChanges(changes) {
        if (changes['SelectedCategoryId'] || changes['Categories']) {
            this.buildBreadcrumbs();
        }
    }
    buildBreadcrumbs() {
        this.Breadcrumbs = [];
        // Always start with "All Actions"
        this.Breadcrumbs.push({
            id: 'all',
            name: 'All Actions',
            icon: 'fa-solid fa-layer-group'
        });
        if (this.SelectedCategoryId === 'all') {
            return;
        }
        if (this.SelectedCategoryId === 'uncategorized') {
            this.Breadcrumbs.push({
                id: 'uncategorized',
                name: 'Uncategorized',
                icon: 'fa-solid fa-inbox'
            });
            return;
        }
        // Build path from root to selected category
        const categoryMap = new Map();
        this.Categories.forEach(c => categoryMap.set(c.ID, c));
        const path = [];
        let currentId = this.SelectedCategoryId;
        while (currentId) {
            const category = categoryMap.get(currentId);
            if (category) {
                path.unshift({
                    id: category.ID,
                    name: category.Name,
                    icon: 'fa-solid fa-folder'
                });
                currentId = category.ParentID || null;
            }
            else {
                break;
            }
        }
        this.Breadcrumbs.push(...path);
    }
    selectCategory(id) {
        this.CategorySelect.emit(id);
    }
    isLast(index) {
        return index === this.Breadcrumbs.length - 1;
    }
    static ɵfac = function ActionBreadcrumbComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ActionBreadcrumbComponent)(); };
    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ActionBreadcrumbComponent, selectors: [["mj-action-breadcrumb"]], inputs: { SelectedCategoryId: "SelectedCategoryId", Categories: "Categories" }, outputs: { CategorySelect: "CategorySelect" }, standalone: false, features: [i0.ɵɵNgOnChangesFeature], decls: 3, vars: 0, consts: [["aria-label", "Category navigation", 1, "action-breadcrumb"], [1, "breadcrumb-item", "current", 3, "title"], [1, "breadcrumb-item", 3, "click", "title"], [3, "class"], [1, "breadcrumb-text"], [1, "breadcrumb-separator"], [1, "fa-solid", "fa-chevron-right"], [1, "fa-solid", "fa-folder-open"]], template: function ActionBreadcrumbComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵelementStart(0, "nav", 0);
            i0.ɵɵrepeaterCreate(1, ActionBreadcrumbComponent_For_2_Template, 2, 1, null, null, _forTrack0);
            i0.ɵɵelementEnd();
        } if (rf & 2) {
            i0.ɵɵadvance();
            i0.ɵɵrepeater(ctx.Breadcrumbs);
        } }, styles: [".action-breadcrumb[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  padding: 8px 20px;\n  background: var(--mj-bg-page);\n  border-bottom: 1px solid var(--mj-border-default);\n  overflow-x: auto;\n  white-space: nowrap;\n}\n\n.breadcrumb-item[_ngcontent-%COMP%] {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 8px;\n  border: none;\n  background: transparent;\n  border-radius: 4px;\n  font-size: 13px;\n  color: var(--mj-brand-primary);\n  cursor: pointer;\n  transition: all 0.15s ease;\n  text-decoration: none;\n}\n\n.breadcrumb-item[_ngcontent-%COMP%]:hover {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.breadcrumb-item.current[_ngcontent-%COMP%] {\n  color: var(--mj-text-primary);\n  font-weight: 600;\n  cursor: default;\n}\n\n.breadcrumb-item.current[_ngcontent-%COMP%]:hover {\n  background: transparent;\n}\n\n.breadcrumb-item[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 12px;\n}\n\n.breadcrumb-item.current[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-status-warning);\n}\n\n.breadcrumb-text[_ngcontent-%COMP%] {\n  max-width: 150px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.breadcrumb-separator[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  color: var(--mj-text-muted);\n}\n\n.breadcrumb-separator[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 10px;\n}\n\n\n\n@media (max-width: 640px) {\n  .breadcrumb-text[_ngcontent-%COMP%] {\n    max-width: 80px;\n  }\n}"], changeDetection: 0 });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ActionBreadcrumbComponent, [{
        type: Component,
        args: [{ standalone: false, selector: 'mj-action-breadcrumb', changeDetection: ChangeDetectionStrategy.OnPush, template: "<nav class=\"action-breadcrumb\" aria-label=\"Category navigation\">\n  @for (item of Breadcrumbs; track item.id; let i = $index; let last = $last) {\n    @if (!last) {\n      <button class=\"breadcrumb-item\"\n        (click)=\"selectCategory(item.id)\"\n        [title]=\"item.name\">\n        @if (i === 0) {\n          <i [class]=\"item.icon\"></i>\n        }\n        <span class=\"breadcrumb-text\">{{ item.name }}</span>\n      </button>\n      <span class=\"breadcrumb-separator\">\n        <i class=\"fa-solid fa-chevron-right\"></i>\n      </span>\n    } @else {\n      <span class=\"breadcrumb-item current\" [title]=\"item.name\">\n        @if (Breadcrumbs.length === 1) {\n          <i [class]=\"item.icon\"></i>\n        } @else {\n          <i class=\"fa-solid fa-folder-open\"></i>\n        }\n        <span class=\"breadcrumb-text\">{{ item.name }}</span>\n      </span>\n    }\n  }\n</nav>\n", styles: [".action-breadcrumb {\n  display: flex;\n  align-items: center;\n  gap: 4px;\n  padding: 8px 20px;\n  background: var(--mj-bg-page);\n  border-bottom: 1px solid var(--mj-border-default);\n  overflow-x: auto;\n  white-space: nowrap;\n}\n\n.breadcrumb-item {\n  display: inline-flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 8px;\n  border: none;\n  background: transparent;\n  border-radius: 4px;\n  font-size: 13px;\n  color: var(--mj-brand-primary);\n  cursor: pointer;\n  transition: all 0.15s ease;\n  text-decoration: none;\n}\n\n.breadcrumb-item:hover {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.breadcrumb-item.current {\n  color: var(--mj-text-primary);\n  font-weight: 600;\n  cursor: default;\n}\n\n.breadcrumb-item.current:hover {\n  background: transparent;\n}\n\n.breadcrumb-item i {\n  font-size: 12px;\n}\n\n.breadcrumb-item.current i {\n  color: var(--mj-status-warning);\n}\n\n.breadcrumb-text {\n  max-width: 150px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.breadcrumb-separator {\n  display: flex;\n  align-items: center;\n  color: var(--mj-text-muted);\n}\n\n.breadcrumb-separator i {\n  font-size: 10px;\n}\n\n/* Responsive - collapse middle items on small screens */\n@media (max-width: 640px) {\n  .breadcrumb-text {\n    max-width: 80px;\n  }\n}\n"] }]
    }], null, { SelectedCategoryId: [{
            type: Input
        }], Categories: [{
            type: Input
        }], CategorySelect: [{
            type: Output
        }] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ActionBreadcrumbComponent, { className: "ActionBreadcrumbComponent", filePath: "src/Actions/components/explorer/action-breadcrumb.component.ts", lineNumber: 25 }); })();
//# sourceMappingURL=action-breadcrumb.component.js.map