@memberjunction/ng-dashboards 5.34.1 → 5.35.0

package/dist/Actions/components/explorer/action-toolbar.component.js

@@ -1,463 +0,0 @@
-import { Component, Input, Output, EventEmitter, ChangeDetectionStrategy } from '@angular/core';
-import { Subject } from 'rxjs';
-import { takeUntil, debounceTime, distinctUntilChanged } from 'rxjs/operators';
-import * as i0 from "@angular/core";
-import * as i1 from "../../services/action-explorer-state.service";
-import * as i2 from "@memberjunction/ng-ui-components";
-const _forTrack0 = ($index, $item) => $item.value;
-const _forTrack1 = ($index, $item) => $item.field;
-function ActionToolbarComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
-    const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 30);
-    i0.ɵɵlistener("click", function ActionToolbarComponent_Conditional_6_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.clearSearch()); });
-    i0.ɵɵelement(1, "i", 31);
-    i0.ɵɵelementEnd();
-} }
-function ActionToolbarComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 10);
-    i0.ɵɵtext(1);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate(ctx_r1.getActiveFilterCount());
-} }
-function ActionToolbarComponent_Conditional_13_Conditional_5_Template(rf, ctx) { if (rf & 1) {
-    const _r3 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 38);
-    i0.ɵɵlistener("click", function ActionToolbarComponent_Conditional_13_Conditional_5_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.StateService.setStatusFilter([])); });
-    i0.ɵɵtext(1, " Clear ");
-    i0.ɵɵelementEnd();
-} }
-function ActionToolbarComponent_Conditional_13_For_8_Template(rf, ctx) { if (rf & 1) {
-    const _r4 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "label", 39)(1, "input", 40);
-    i0.ɵɵlistener("change", function ActionToolbarComponent_Conditional_13_For_8_Template_input_change_1_listener() { const status_r5 = i0.ɵɵrestoreView(_r4).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleStatus(status_r5.value)); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵelement(2, "span", 41);
-    i0.ɵɵtext(3);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const status_r5 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵclassProp("selected", ctx_r1.isStatusSelected(status_r5.value));
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("checked", ctx_r1.isStatusSelected(status_r5.value));
-    i0.ɵɵadvance();
-    i0.ɵɵattribute("data-status", status_r5.value);
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", status_r5.label, " ");
-} }
-function ActionToolbarComponent_Conditional_13_Conditional_13_Template(rf, ctx) { if (rf & 1) {
-    const _r6 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 38);
-    i0.ɵɵlistener("click", function ActionToolbarComponent_Conditional_13_Conditional_13_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.StateService.setTypeFilter([])); });
-    i0.ɵɵtext(1, " Clear ");
-    i0.ɵɵelementEnd();
-} }
-function ActionToolbarComponent_Conditional_13_For_16_Template(rf, ctx) { if (rf & 1) {
-    const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "label", 39)(1, "input", 40);
-    i0.ɵɵlistener("change", function ActionToolbarComponent_Conditional_13_For_16_Template_input_change_1_listener() { const type_r8 = i0.ɵɵrestoreView(_r7).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleType(type_r8.value)); });
-    i0.ɵɵelementEnd();
-    i0.ɵɵelement(2, "i");
-    i0.ɵɵtext(3);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const type_r8 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵclassProp("selected", ctx_r1.isTypeSelected(type_r8.value));
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("checked", ctx_r1.isTypeSelected(type_r8.value));
-    i0.ɵɵadvance();
-    i0.ɵɵclassMap(type_r8.icon);
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", type_r8.label, " ");
-} }
-function ActionToolbarComponent_Conditional_13_Conditional_17_Template(rf, ctx) { if (rf & 1) {
-    const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 37)(1, "button", 42);
-    i0.ɵɵlistener("click", function ActionToolbarComponent_Conditional_13_Conditional_17_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r9); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.clearFilters()); });
-    i0.ɵɵelement(2, "i", 31);
-    i0.ɵɵtext(3, " Clear All Filters ");
-    i0.ɵɵelementEnd()();
-} }
-function ActionToolbarComponent_Conditional_13_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 11)(1, "div", 32)(2, "div", 33)(3, "span");
-    i0.ɵɵtext(4, "Status");
-    i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(5, ActionToolbarComponent_Conditional_13_Conditional_5_Template, 2, 0, "button", 34);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "div", 35);
-    i0.ɵɵrepeaterCreate(7, ActionToolbarComponent_Conditional_13_For_8_Template, 4, 5, "label", 36, _forTrack0);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(9, "div", 32)(10, "div", 33)(11, "span");
-    i0.ɵɵtext(12, "Type");
-    i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(13, ActionToolbarComponent_Conditional_13_Conditional_13_Template, 2, 0, "button", 34);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(14, "div", 35);
-    i0.ɵɵrepeaterCreate(15, ActionToolbarComponent_Conditional_13_For_16_Template, 4, 6, "label", 36, _forTrack0);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵconditionalCreate(17, ActionToolbarComponent_Conditional_13_Conditional_17_Template, 4, 0, "div", 37);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(5);
-    i0.ɵɵconditional(ctx_r1.Filters.statuses.length > 0 ? 5 : -1);
-    i0.ɵɵadvance(2);
-    i0.ɵɵrepeater(ctx_r1.StatusOptions);
-    i0.ɵɵadvance(6);
-    i0.ɵɵconditional(ctx_r1.Filters.types.length > 0 ? 13 : -1);
-    i0.ɵɵadvance(2);
-    i0.ɵɵrepeater(ctx_r1.TypeOptions);
-    i0.ɵɵadvance(2);
-    i0.ɵɵconditional(ctx_r1.hasActiveFilters() ? 17 : -1);
-} }
-function ActionToolbarComponent_Conditional_14_For_2_Template(rf, ctx) { if (rf & 1) {
-    const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 44);
-    i0.ɵɵlistener("click", function ActionToolbarComponent_Conditional_14_For_2_Template_span_click_0_listener() { const status_r11 = i0.ɵɵrestoreView(_r10).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleStatus(status_r11)); });
-    i0.ɵɵtext(1);
-    i0.ɵɵelement(2, "i", 31);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const status_r11 = ctx.$implicit;
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" Status: ", status_r11, " ");
-} }
-function ActionToolbarComponent_Conditional_14_For_4_Template(rf, ctx) { if (rf & 1) {
-    const _r12 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "span", 44);
-    i0.ɵɵlistener("click", function ActionToolbarComponent_Conditional_14_For_4_Template_span_click_0_listener() { const type_r13 = i0.ɵɵrestoreView(_r12).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleType(type_r13)); });
-    i0.ɵɵtext(1);
-    i0.ɵɵelement(2, "i", 31);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const type_r13 = ctx.$implicit;
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" Type: ", type_r13 === "Generated" ? "AI Generated" : type_r13, " ");
-} }
-function ActionToolbarComponent_Conditional_14_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 12);
-    i0.ɵɵrepeaterCreate(1, ActionToolbarComponent_Conditional_14_For_2_Template, 3, 1, "span", 43, i0.ɵɵrepeaterTrackByIdentity);
-    i0.ɵɵrepeaterCreate(3, ActionToolbarComponent_Conditional_14_For_4_Template, 3, 1, "span", 43, i0.ɵɵrepeaterTrackByIdentity);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵrepeater(ctx_r1.Filters.statuses);
-    i0.ɵɵadvance(2);
-    i0.ɵɵrepeater(ctx_r1.Filters.types);
-} }
-function ActionToolbarComponent_Conditional_19_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 16);
-    i0.ɵɵtext(1);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1("of ", ctx_r1.TotalCount);
-} }
-function ActionToolbarComponent_Conditional_27_For_2_Conditional_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "i", 48);
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext(3);
-    i0.ɵɵclassMap(ctx_r1.SortDirection === "asc" ? "fa-solid fa-arrow-up" : "fa-solid fa-arrow-down");
-} }
-function ActionToolbarComponent_Conditional_27_For_2_Template(rf, ctx) { if (rf & 1) {
-    const _r14 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 46);
-    i0.ɵɵlistener("click", function ActionToolbarComponent_Conditional_27_For_2_Template_button_click_0_listener() { const option_r15 = i0.ɵɵrestoreView(_r14).$implicit; const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.setSortField(option_r15.field)); });
-    i0.ɵɵelement(1, "i");
-    i0.ɵɵtext(2);
-    i0.ɵɵconditionalCreate(3, ActionToolbarComponent_Conditional_27_For_2_Conditional_3_Template, 1, 2, "i", 47);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const option_r15 = ctx.$implicit;
-    const ctx_r1 = i0.ɵɵnextContext(2);
-    i0.ɵɵclassProp("selected", ctx_r1.SortField === option_r15.field);
-    i0.ɵɵadvance();
-    i0.ɵɵclassMap(option_r15.icon);
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", option_r15.label, " ");
-    i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r1.SortField === option_r15.field ? 3 : -1);
-} }
-function ActionToolbarComponent_Conditional_27_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 18);
-    i0.ɵɵrepeaterCreate(1, ActionToolbarComponent_Conditional_27_For_2_Template, 4, 6, "button", 45, _forTrack1);
-    i0.ɵɵelementEnd();
-} if (rf & 2) {
-    const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵadvance();
-    i0.ɵɵrepeater(ctx_r1.SortOptions);
-} }
-export class ActionToolbarComponent {
-    StateService;
-    cdr;
-    TotalCount = 0;
-    FilteredCount = 0;
-    NewActionClick = new EventEmitter();
-    RefreshClick = new EventEmitter();
-    ViewMode = 'card';
-    SortField = 'name';
-    SortDirection = 'asc';
-    Filters = {
-        searchTerm: '',
-        statuses: [],
-        types: [],
-        approvalStatuses: [],
-        hasExecutions: null
-    };
-    ShowFiltersDropdown = false;
-    ShowSortDropdown = false;
-    SortOptions = [
-        { field: 'name', label: 'Name', icon: 'fa-solid fa-font' },
-        { field: 'updated', label: 'Last Updated', icon: 'fa-solid fa-clock' },
-        { field: 'status', label: 'Status', icon: 'fa-solid fa-circle-check' },
-        { field: 'type', label: 'Type', icon: 'fa-solid fa-tag' },
-        { field: 'category', label: 'Category', icon: 'fa-solid fa-folder' }
-    ];
-    StatusOptions = [
-        { value: 'Active', label: 'Active', color: 'success' },
-        { value: 'Pending', label: 'Pending', color: 'warning' },
-        { value: 'Disabled', label: 'Disabled', color: 'error' }
-    ];
-    TypeOptions = [
-        { value: 'Generated', label: 'AI Generated', icon: 'fa-solid fa-robot' },
-        { value: 'Custom', label: 'Custom', icon: 'fa-solid fa-code' }
-    ];
-    destroy$ = new Subject();
-    searchInput$ = new Subject();
-    constructor(StateService, cdr) {
-        this.StateService = StateService;
-        this.cdr = cdr;
-    }
-    ngOnInit() {
-        this.subscribeToState();
-        this.setupSearchDebounce();
-    }
-    ngOnDestroy() {
-        this.destroy$.next();
-        this.destroy$.complete();
-    }
-    subscribeToState() {
-        this.StateService.ViewMode$.pipe(takeUntil(this.destroy$)).subscribe(mode => {
-            this.ViewMode = mode;
-            this.cdr.markForCheck();
-        });
-        this.StateService.SortConfig$.pipe(takeUntil(this.destroy$)).subscribe(config => {
-            this.SortField = config.field;
-            this.SortDirection = config.direction;
-            this.cdr.markForCheck();
-        });
-        this.StateService.Filters$.pipe(takeUntil(this.destroy$)).subscribe(filters => {
-            this.Filters = filters;
-            this.cdr.markForCheck();
-        });
-    }
-    setupSearchDebounce() {
-        this.searchInput$.pipe(debounceTime(300), distinctUntilChanged(), takeUntil(this.destroy$)).subscribe(term => {
-            this.StateService.setSearchTerm(term);
-        });
-    }
-    onSearchInput(term) {
-        this.searchInput$.next(term);
-    }
-    clearSearch() {
-        this.StateService.setSearchTerm('');
-    }
-    setViewMode(mode) {
-        this.StateService.setViewMode(mode);
-    }
-    setSortField(field) {
-        this.StateService.setSortField(field);
-        this.ShowSortDropdown = false;
-    }
-    toggleSortDirection() {
-        this.StateService.toggleSortDirection();
-    }
-    toggleStatus(status) {
-        const current = [...this.Filters.statuses];
-        const index = current.indexOf(status);
-        if (index >= 0) {
-            current.splice(index, 1);
-        }
-        else {
-            current.push(status);
-        }
-        this.StateService.setStatusFilter(current);
-    }
-    toggleType(type) {
-        const current = [...this.Filters.types];
-        const index = current.indexOf(type);
-        if (index >= 0) {
-            current.splice(index, 1);
-        }
-        else {
-            current.push(type);
-        }
-        this.StateService.setTypeFilter(current);
-    }
-    isStatusSelected(status) {
-        return this.Filters.statuses.includes(status);
-    }
-    isTypeSelected(type) {
-        return this.Filters.types.includes(type);
-    }
-    clearFilters() {
-        this.StateService.clearFilters();
-    }
-    hasActiveFilters() {
-        return this.StateService.hasActiveFilters();
-    }
-    getActiveFilterCount() {
-        let count = 0;
-        if (this.Filters.searchTerm)
-            count++;
-        count += this.Filters.statuses.length;
-        count += this.Filters.types.length;
-        count += this.Filters.approvalStatuses.length;
-        if (this.Filters.hasExecutions != null)
-            count++;
-        return count;
-    }
-    toggleFiltersDropdown() {
-        this.ShowFiltersDropdown = !this.ShowFiltersDropdown;
-        if (this.ShowFiltersDropdown) {
-            this.ShowSortDropdown = false;
-        }
-    }
-    toggleSortDropdown() {
-        this.ShowSortDropdown = !this.ShowSortDropdown;
-        if (this.ShowSortDropdown) {
-            this.ShowFiltersDropdown = false;
-        }
-    }
-    closeDropdowns() {
-        this.ShowFiltersDropdown = false;
-        this.ShowSortDropdown = false;
-    }
-    getSortLabel() {
-        const option = this.SortOptions.find(o => o.field === this.SortField);
-        return option?.label || 'Sort';
-    }
-    getSortIcon() {
-        return this.SortDirection === 'asc' ? 'fa-solid fa-arrow-up-short-wide' : 'fa-solid fa-arrow-down-wide-short';
-    }
-    onNewAction() {
-        this.NewActionClick.emit();
-    }
-    onRefresh() {
-        this.RefreshClick.emit();
-    }
-    static ɵfac = function ActionToolbarComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ActionToolbarComponent)(i0.ɵɵdirectiveInject(i1.ActionExplorerStateService), i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ActionToolbarComponent, selectors: [["mj-action-toolbar"]], inputs: { TotalCount: "TotalCount", FilteredCount: "FilteredCount" }, outputs: { NewActionClick: "NewActionClick", RefreshClick: "RefreshClick" }, standalone: false, decls: 40, vars: 20, consts: [[1, "action-toolbar"], [1, "toolbar-left"], [1, "search-container"], [1, "search-input-wrapper"], [1, "fa-solid", "fa-search", "search-icon"], ["type", "text", "placeholder", "Search actions...", 1, "mj-input", 3, "input", "value"], ["mjButton", "", "variant", "flat", "size", "sm", 1, "search-clear"], [1, "dropdown-container", 3, "clickOutside"], ["mjButton", "", "variant", "outline", 3, "click"], [1, "fa-solid", "fa-filter"], [1, "filter-badge"], [1, "dropdown-menu", "filters-menu"], [1, "active-filters"], [1, "toolbar-right"], [1, "results-count"], [1, "count"], [1, "of-total"], [1, "label"], [1, "dropdown-menu", "sort-menu"], [1, "view-toggle"], ["mjButton", "", "title", "Card View", 3, "click", "variant"], [1, "fa-solid", "fa-grip"], ["mjButton", "", "title", "List View", 3, "click", "variant"], [1, "fa-solid", "fa-list"], ["mjButton", "", "title", "Compact View", 3, "click", "variant"], [1, "fa-solid", "fa-bars"], ["mjButton", "", "variant", "flat", "title", "Refresh", 3, "click"], [1, "fa-solid", "fa-refresh"], ["mjButton", "", "variant", "primary", 3, "click"], [1, "fa-solid", "fa-plus"], ["mjButton", "", "variant", "flat", "size", "sm", 1, "search-clear", 3, "click"], [1, "fa-solid", "fa-times"], [1, "dropdown-section"], [1, "section-header"], ["mjButton", "", "variant", "flat", "size", "sm"], [1, "filter-options"], [1, "filter-option", 3, "selected"], [1, "dropdown-footer"], ["mjButton", "", "variant", "flat", "size", "sm", 3, "click"], [1, "filter-option"], ["type", "checkbox", 3, "change", "checked"], [1, "status-dot"], ["mjButton", "", "variant", "danger", 3, "click"], [1, "status-chip", "removable"], [1, "status-chip", "removable", 3, "click"], [1, "sort-option", 3, "selected"], [1, "sort-option", 3, "click"], [1, "direction-icon", 3, "class"], [1, "direction-icon"]], template: function ActionToolbarComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "div", 2)(3, "div", 3);
-            i0.ɵɵelement(4, "i", 4);
-            i0.ɵɵelementStart(5, "input", 5);
-            i0.ɵɵlistener("input", function ActionToolbarComponent_Template_input_input_5_listener($event) { return ctx.onSearchInput($event.target.value); });
-            i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(6, ActionToolbarComponent_Conditional_6_Template, 2, 0, "button", 6);
-            i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(7, "div", 7);
-            i0.ɵɵlistener("clickOutside", function ActionToolbarComponent_Template_div_clickOutside_7_listener() { return ctx.ShowFiltersDropdown = false; });
-            i0.ɵɵelementStart(8, "button", 8);
-            i0.ɵɵlistener("click", function ActionToolbarComponent_Template_button_click_8_listener() { return ctx.toggleFiltersDropdown(); });
-            i0.ɵɵelement(9, "i", 9);
-            i0.ɵɵtext(10, " Filters ");
-            i0.ɵɵconditionalCreate(11, ActionToolbarComponent_Conditional_11_Template, 2, 1, "span", 10);
-            i0.ɵɵelement(12, "i");
-            i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(13, ActionToolbarComponent_Conditional_13_Template, 18, 3, "div", 11);
-            i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(14, ActionToolbarComponent_Conditional_14_Template, 5, 0, "div", 12);
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(15, "div", 13)(16, "div", 14)(17, "span", 15);
-            i0.ɵɵtext(18);
-            i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(19, ActionToolbarComponent_Conditional_19_Template, 2, 1, "span", 16);
-            i0.ɵɵelementStart(20, "span", 17);
-            i0.ɵɵtext(21, "actions");
-            i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(22, "div", 7);
-            i0.ɵɵlistener("clickOutside", function ActionToolbarComponent_Template_div_clickOutside_22_listener() { return ctx.ShowSortDropdown = false; });
-            i0.ɵɵelementStart(23, "button", 8);
-            i0.ɵɵlistener("click", function ActionToolbarComponent_Template_button_click_23_listener() { return ctx.toggleSortDropdown(); });
-            i0.ɵɵelement(24, "i");
-            i0.ɵɵtext(25);
-            i0.ɵɵelement(26, "i");
-            i0.ɵɵelementEnd();
-            i0.ɵɵconditionalCreate(27, ActionToolbarComponent_Conditional_27_Template, 3, 0, "div", 18);
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(28, "div", 19)(29, "button", 20);
-            i0.ɵɵlistener("click", function ActionToolbarComponent_Template_button_click_29_listener() { return ctx.setViewMode("card"); });
-            i0.ɵɵelement(30, "i", 21);
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(31, "button", 22);
-            i0.ɵɵlistener("click", function ActionToolbarComponent_Template_button_click_31_listener() { return ctx.setViewMode("list"); });
-            i0.ɵɵelement(32, "i", 23);
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(33, "button", 24);
-            i0.ɵɵlistener("click", function ActionToolbarComponent_Template_button_click_33_listener() { return ctx.setViewMode("compact"); });
-            i0.ɵɵelement(34, "i", 25);
-            i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(35, "button", 26);
-            i0.ɵɵlistener("click", function ActionToolbarComponent_Template_button_click_35_listener() { return ctx.onRefresh(); });
-            i0.ɵɵelement(36, "i", 27);
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(37, "button", 28);
-            i0.ɵɵlistener("click", function ActionToolbarComponent_Template_button_click_37_listener() { return ctx.onNewAction(); });
-            i0.ɵɵelement(38, "i", 29);
-            i0.ɵɵtext(39, " New Action ");
-            i0.ɵɵelementEnd()()();
-        } if (rf & 2) {
-            i0.ɵɵadvance(5);
-            i0.ɵɵproperty("value", ctx.Filters.searchTerm);
-            i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.Filters.searchTerm ? 6 : -1);
-            i0.ɵɵadvance(2);
-            i0.ɵɵclassProp("active", ctx.hasActiveFilters());
-            i0.ɵɵadvance(3);
-            i0.ɵɵconditional(ctx.getActiveFilterCount() > 0 ? 11 : -1);
-            i0.ɵɵadvance();
-            i0.ɵɵclassMap(ctx.ShowFiltersDropdown ? "fa-solid fa-chevron-up" : "fa-solid fa-chevron-down");
-            i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.ShowFiltersDropdown ? 13 : -1);
-            i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.hasActiveFilters() ? 14 : -1);
-            i0.ɵɵadvance(4);
-            i0.ɵɵtextInterpolate(ctx.FilteredCount);
-            i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.FilteredCount !== ctx.TotalCount ? 19 : -1);
-            i0.ɵɵadvance(5);
-            i0.ɵɵclassMap(ctx.getSortIcon());
-            i0.ɵɵadvance();
-            i0.ɵɵtextInterpolate1(" ", ctx.getSortLabel(), " ");
-            i0.ɵɵadvance();
-            i0.ɵɵclassMap(ctx.ShowSortDropdown ? "fa-solid fa-chevron-up" : "fa-solid fa-chevron-down");
-            i0.ɵɵadvance();
-            i0.ɵɵconditional(ctx.ShowSortDropdown ? 27 : -1);
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("variant", ctx.ViewMode === "card" ? "primary" : "outline");
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("variant", ctx.ViewMode === "list" ? "primary" : "outline");
-            i0.ɵɵadvance(2);
-            i0.ɵɵproperty("variant", ctx.ViewMode === "compact" ? "primary" : "outline");
-        } }, dependencies: [i2.MJButtonDirective], styles: [".action-toolbar[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 20px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 1px solid var(--mj-border-default);\n  gap: 16px;\n  flex-wrap: wrap;\n}\n\n.toolbar-left[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n  min-width: 0;\n  flex-wrap: wrap;\n}\n\n.toolbar-right[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-shrink: 0;\n}\n\n\n\n.search-container[_ngcontent-%COMP%] {\n  min-width: 200px;\n  max-width: 320px;\n  flex: 1;\n}\n\n.search-container[_ngcontent-%COMP%]   i.fa-search[_ngcontent-%COMP%] {\n  font-size: 13px;\n  color: var(--mj-text-muted);\n}\n\n\n\n.dropdown-container[_ngcontent-%COMP%] {\n  position: relative;\n}\n\n.dropdown-container[_ngcontent-%COMP%]    > button[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.dropdown-container[_ngcontent-%COMP%]    > button.active[_ngcontent-%COMP%] {\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.dropdown-container[_ngcontent-%COMP%]    > button[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:last-child {\n  font-size: 10px;\n  margin-left: 4px;\n}\n\n.filter-badge[_ngcontent-%COMP%] {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  font-size: 10px;\n  font-weight: 600;\n  padding: 2px 6px;\n  border-radius: 10px;\n  min-width: 18px;\n  text-align: center;\n}\n\n\n\n.dropdown-menu[_ngcontent-%COMP%] {\n  position: absolute;\n  top: calc(100% + 4px);\n  left: 0;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n  z-index: 100;\n  min-width: 220px;\n  padding: 8px 0;\n}\n\n.dropdown-menu.sort-menu[_ngcontent-%COMP%] {\n  right: 0;\n  left: auto;\n}\n\n\n\n.dropdown-section[_ngcontent-%COMP%] {\n  padding: 8px 12px;\n}\n\n.dropdown-section[_ngcontent-%COMP%]:not(:last-child) {\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.section-header[_ngcontent-%COMP%] {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 8px;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n  color: var(--mj-text-muted);\n  letter-spacing: 0.5px;\n}\n\n.section-header[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  font-size: 11px;\n  padding: 2px 6px;\n}\n\n.filter-options[_ngcontent-%COMP%] {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.filter-option[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 6px 8px;\n  border-radius: 4px;\n  cursor: pointer;\n  transition: background 0.15s ease;\n  font-size: 13px;\n}\n\n.filter-option[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n.filter-option.selected[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.filter-option[_ngcontent-%COMP%]   input[type=\"checkbox\"][_ngcontent-%COMP%] {\n  display: none;\n}\n\n.filter-option[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  font-size: 13px;\n  width: 18px;\n  color: var(--mj-text-muted);\n}\n\n.filter-option.selected[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n  color: var(--mj-brand-primary);\n}\n\n.status-dot[_ngcontent-%COMP%] {\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n}\n\n.status-dot[data-status=\"Active\"][_ngcontent-%COMP%] {\n  background: var(--mj-status-success);\n}\n\n.status-dot[data-status=\"Pending\"][_ngcontent-%COMP%] {\n  background: var(--mj-status-warning);\n}\n\n.status-dot[data-status=\"Disabled\"][_ngcontent-%COMP%] {\n  background: var(--mj-status-error);\n}\n\n.dropdown-footer[_ngcontent-%COMP%] {\n  padding: 8px 12px;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.dropdown-footer[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  width: 100%;\n}\n\n\n\n.sort-option[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  width: 100%;\n  padding: 8px 12px;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  font-size: 13px;\n  text-align: left;\n  transition: background 0.15s ease;\n}\n\n.sort-option[_ngcontent-%COMP%]:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n.sort-option.selected[_ngcontent-%COMP%] {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n\n.sort-option[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:first-child {\n  width: 18px;\n  color: var(--mj-text-muted);\n}\n\n.sort-option.selected[_ngcontent-%COMP%]   i[_ngcontent-%COMP%]:first-child {\n  color: var(--mj-brand-primary);\n}\n\n.sort-option[_ngcontent-%COMP%]   .direction-icon[_ngcontent-%COMP%] {\n  margin-left: auto;\n  font-size: 11px;\n}\n\n\n\n.active-filters[_ngcontent-%COMP%] {\n  display: flex;\n  gap: 6px;\n  flex-wrap: wrap;\n}\n\n\n\n.results-count[_ngcontent-%COMP%] {\n  display: flex;\n  align-items: baseline;\n  gap: 4px;\n  font-size: 13px;\n  color: var(--mj-text-muted);\n  white-space: nowrap;\n}\n\n.results-count[_ngcontent-%COMP%]   .count[_ngcontent-%COMP%] {\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  font-size: 14px;\n}\n\n.results-count[_ngcontent-%COMP%]   .of-total[_ngcontent-%COMP%] {\n  opacity: 0.7;\n}\n\n\n\n.view-toggle[_ngcontent-%COMP%] {\n  display: flex;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 4px;\n  overflow: hidden;\n}\n\n.view-toggle[_ngcontent-%COMP%]   button[_ngcontent-%COMP%] {\n  border-radius: 0;\n  border: none;\n  min-width: 36px;\n}\n\n.view-toggle[_ngcontent-%COMP%]   button[_ngcontent-%COMP%]:not(:last-child) {\n  border-right: 1px solid var(--mj-border-default);\n}\n\n\n\n@media (max-width: 1024px) {\n  .action-toolbar[_ngcontent-%COMP%] {\n    flex-direction: column;\n    align-items: stretch;\n  }\n\n  .toolbar-left[_ngcontent-%COMP%], \n   .toolbar-right[_ngcontent-%COMP%] {\n    width: 100%;\n    justify-content: flex-start;\n  }\n\n  .search-container[_ngcontent-%COMP%] {\n    max-width: none;\n    flex: 1;\n  }\n}\n\n@media (max-width: 640px) {\n  .toolbar-right[_ngcontent-%COMP%] {\n    flex-wrap: wrap;\n  }\n\n  .results-count[_ngcontent-%COMP%] {\n    order: -1;\n    width: 100%;\n  }\n}"], changeDetection: 0 });
-}
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ActionToolbarComponent, [{
-        type: Component,
-        args: [{ standalone: false, selector: 'mj-action-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"action-toolbar\">\n  <div class=\"toolbar-left\">\n    <!-- Search -->\n    <div class=\"search-container\">\n      <div class=\"search-input-wrapper\">\n        <i class=\"fa-solid fa-search search-icon\"></i>\n        <input type=\"text\" class=\"mj-input\"\n          placeholder=\"Search actions...\"\n          [value]=\"Filters.searchTerm\"\n          (input)=\"onSearchInput($any($event.target).value)\" />\n        @if (Filters.searchTerm) {\n          <button mjButton variant=\"flat\" size=\"sm\" class=\"search-clear\"\n            (click)=\"clearSearch()\">\n            <i class=\"fa-solid fa-times\"></i>\n          </button>\n        }\n      </div>\n    </div>\n\n    <!-- Filters Dropdown -->\n    <div class=\"dropdown-container\" (clickOutside)=\"ShowFiltersDropdown = false\">\n      <button mjButton\n        variant=\"outline\"\n        [class.active]=\"hasActiveFilters()\"\n        (click)=\"toggleFiltersDropdown()\">\n        <i class=\"fa-solid fa-filter\"></i>\n        Filters\n        @if (getActiveFilterCount() > 0) {\n          <span class=\"filter-badge\">{{ getActiveFilterCount() }}</span>\n        }\n        <i [class]=\"ShowFiltersDropdown ? 'fa-solid fa-chevron-up' : 'fa-solid fa-chevron-down'\"></i>\n      </button>\n\n      @if (ShowFiltersDropdown) {\n        <div class=\"dropdown-menu filters-menu\">\n          <div class=\"dropdown-section\">\n            <div class=\"section-header\">\n              <span>Status</span>\n              @if (Filters.statuses.length > 0) {\n                <button mjButton\n                  variant=\"flat\"\n                  size=\"sm\"\n                  (click)=\"StateService.setStatusFilter([])\">\n                  Clear\n                </button>\n              }\n            </div>\n            <div class=\"filter-options\">\n              @for (status of StatusOptions; track status.value) {\n                <label class=\"filter-option\" [class.selected]=\"isStatusSelected(status.value)\">\n                  <input type=\"checkbox\"\n                    [checked]=\"isStatusSelected(status.value)\"\n                    (change)=\"toggleStatus(status.value)\">\n                  <span class=\"status-dot\" [attr.data-status]=\"status.value\"></span>\n                  {{ status.label }}\n                </label>\n              }\n            </div>\n          </div>\n\n          <div class=\"dropdown-section\">\n            <div class=\"section-header\">\n              <span>Type</span>\n              @if (Filters.types.length > 0) {\n                <button mjButton\n                  variant=\"flat\"\n                  size=\"sm\"\n                  (click)=\"StateService.setTypeFilter([])\">\n                  Clear\n                </button>\n              }\n            </div>\n            <div class=\"filter-options\">\n              @for (type of TypeOptions; track type.value) {\n                <label class=\"filter-option\" [class.selected]=\"isTypeSelected(type.value)\">\n                  <input type=\"checkbox\"\n                    [checked]=\"isTypeSelected(type.value)\"\n                    (change)=\"toggleType(type.value)\">\n                  <i [class]=\"type.icon\"></i>\n                  {{ type.label }}\n                </label>\n              }\n            </div>\n          </div>\n\n          @if (hasActiveFilters()) {\n            <div class=\"dropdown-footer\">\n              <button mjButton\n                variant=\"danger\"\n                (click)=\"clearFilters()\">\n                <i class=\"fa-solid fa-times\"></i>\n                Clear All Filters\n              </button>\n            </div>\n          }\n        </div>\n      }\n    </div>\n\n    <!-- Active Filter Chips -->\n    @if (hasActiveFilters()) {\n      <div class=\"active-filters\">\n        @for (status of Filters.statuses; track status) {\n          <span class=\"status-chip removable\" (click)=\"toggleStatus(status)\">\n            Status: {{ status }} <i class=\"fa-solid fa-times\"></i>\n          </span>\n        }\n        @for (type of Filters.types; track type) {\n          <span class=\"status-chip removable\" (click)=\"toggleType(type)\">\n            Type: {{ type === 'Generated' ? 'AI Generated' : type }} <i class=\"fa-solid fa-times\"></i>\n          </span>\n        }\n      </div>\n    }\n  </div>\n\n  <div class=\"toolbar-right\">\n    <!-- Results Count -->\n    <div class=\"results-count\">\n      <span class=\"count\">{{ FilteredCount }}</span>\n      @if (FilteredCount !== TotalCount) {\n        <span class=\"of-total\">of {{ TotalCount }}</span>\n      }\n      <span class=\"label\">actions</span>\n    </div>\n\n    <!-- Sort Dropdown -->\n    <div class=\"dropdown-container\" (clickOutside)=\"ShowSortDropdown = false\">\n      <button mjButton\n        variant=\"outline\"\n        (click)=\"toggleSortDropdown()\">\n        <i [class]=\"getSortIcon()\"></i>\n        {{ getSortLabel() }}\n        <i [class]=\"ShowSortDropdown ? 'fa-solid fa-chevron-up' : 'fa-solid fa-chevron-down'\"></i>\n      </button>\n\n      @if (ShowSortDropdown) {\n        <div class=\"dropdown-menu sort-menu\">\n          @for (option of SortOptions; track option.field) {\n            <button class=\"sort-option\"\n              [class.selected]=\"SortField === option.field\"\n              (click)=\"setSortField(option.field)\">\n              <i [class]=\"option.icon\"></i>\n              {{ option.label }}\n              @if (SortField === option.field) {\n                <i [class]=\"SortDirection === 'asc' ? 'fa-solid fa-arrow-up' : 'fa-solid fa-arrow-down'\" class=\"direction-icon\"></i>\n              }\n            </button>\n          }\n        </div>\n      }\n    </div>\n\n    <!-- View Mode Toggle -->\n    <div class=\"view-toggle\">\n      <button mjButton\n        [variant]=\"ViewMode === 'card' ? 'primary' : 'outline'\"\n        title=\"Card View\"\n        (click)=\"setViewMode('card')\">\n        <i class=\"fa-solid fa-grip\"></i>\n      </button>\n      <button mjButton\n        [variant]=\"ViewMode === 'list' ? 'primary' : 'outline'\"\n        title=\"List View\"\n        (click)=\"setViewMode('list')\">\n        <i class=\"fa-solid fa-list\"></i>\n      </button>\n      <button mjButton\n        [variant]=\"ViewMode === 'compact' ? 'primary' : 'outline'\"\n        title=\"Compact View\"\n        (click)=\"setViewMode('compact')\">\n        <i class=\"fa-solid fa-bars\"></i>\n      </button>\n    </div>\n\n    <!-- Refresh Button -->\n    <button mjButton\n      variant=\"flat\"\n      title=\"Refresh\"\n      (click)=\"onRefresh()\">\n      <i class=\"fa-solid fa-refresh\"></i>\n    </button>\n\n    <!-- New Action Button -->\n    <button mjButton\n      variant=\"primary\"\n      (click)=\"onNewAction()\">\n      <i class=\"fa-solid fa-plus\"></i>\n      New Action\n    </button>\n  </div>\n</div>\n", styles: [".action-toolbar {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 12px 20px;\n  background: var(--mj-bg-surface-card);\n  border-bottom: 1px solid var(--mj-border-default);\n  gap: 16px;\n  flex-wrap: wrap;\n}\n\n.toolbar-left {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex: 1;\n  min-width: 0;\n  flex-wrap: wrap;\n}\n\n.toolbar-right {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-shrink: 0;\n}\n\n/* Search */\n.search-container {\n  min-width: 200px;\n  max-width: 320px;\n  flex: 1;\n}\n\n.search-container i.fa-search {\n  font-size: 13px;\n  color: var(--mj-text-muted);\n}\n\n/* Dropdown Container */\n.dropdown-container {\n  position: relative;\n}\n\n.dropdown-container > button {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.dropdown-container > button.active {\n  border-color: var(--mj-brand-primary);\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.dropdown-container > button i:last-child {\n  font-size: 10px;\n  margin-left: 4px;\n}\n\n.filter-badge {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n  font-size: 10px;\n  font-weight: 600;\n  padding: 2px 6px;\n  border-radius: 10px;\n  min-width: 18px;\n  text-align: center;\n}\n\n/* Dropdown Menu */\n.dropdown-menu {\n  position: absolute;\n  top: calc(100% + 4px);\n  left: 0;\n  background: var(--mj-bg-surface-card);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);\n  z-index: 100;\n  min-width: 220px;\n  padding: 8px 0;\n}\n\n.dropdown-menu.sort-menu {\n  right: 0;\n  left: auto;\n}\n\n/* Dropdown Section */\n.dropdown-section {\n  padding: 8px 12px;\n}\n\n.dropdown-section:not(:last-child) {\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.section-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 8px;\n  font-size: 11px;\n  font-weight: 600;\n  text-transform: uppercase;\n  color: var(--mj-text-muted);\n  letter-spacing: 0.5px;\n}\n\n.section-header button {\n  font-size: 11px;\n  padding: 2px 6px;\n}\n\n.filter-options {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.filter-option {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 6px 8px;\n  border-radius: 4px;\n  cursor: pointer;\n  transition: background 0.15s ease;\n  font-size: 13px;\n}\n\n.filter-option:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n.filter-option.selected {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n}\n\n.filter-option input[type=\"checkbox\"] {\n  display: none;\n}\n\n.filter-option i {\n  font-size: 13px;\n  width: 18px;\n  color: var(--mj-text-muted);\n}\n\n.filter-option.selected i {\n  color: var(--mj-brand-primary);\n}\n\n.status-dot {\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n}\n\n.status-dot[data-status=\"Active\"] {\n  background: var(--mj-status-success);\n}\n\n.status-dot[data-status=\"Pending\"] {\n  background: var(--mj-status-warning);\n}\n\n.status-dot[data-status=\"Disabled\"] {\n  background: var(--mj-status-error);\n}\n\n.dropdown-footer {\n  padding: 8px 12px;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.dropdown-footer button {\n  width: 100%;\n}\n\n/* Sort Options */\n.sort-option {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  width: 100%;\n  padding: 8px 12px;\n  border: none;\n  background: transparent;\n  cursor: pointer;\n  font-size: 13px;\n  text-align: left;\n  transition: background 0.15s ease;\n}\n\n.sort-option:hover {\n  background: var(--mj-bg-surface-hover);\n}\n\n.sort-option.selected {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n\n.sort-option i:first-child {\n  width: 18px;\n  color: var(--mj-text-muted);\n}\n\n.sort-option.selected i:first-child {\n  color: var(--mj-brand-primary);\n}\n\n.sort-option .direction-icon {\n  margin-left: auto;\n  font-size: 11px;\n}\n\n/* Active Filters */\n.active-filters {\n  display: flex;\n  gap: 6px;\n  flex-wrap: wrap;\n}\n\n/* Results Count */\n.results-count {\n  display: flex;\n  align-items: baseline;\n  gap: 4px;\n  font-size: 13px;\n  color: var(--mj-text-muted);\n  white-space: nowrap;\n}\n\n.results-count .count {\n  font-weight: 600;\n  color: var(--mj-text-primary);\n  font-size: 14px;\n}\n\n.results-count .of-total {\n  opacity: 0.7;\n}\n\n/* View Toggle */\n.view-toggle {\n  display: flex;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 4px;\n  overflow: hidden;\n}\n\n.view-toggle button {\n  border-radius: 0;\n  border: none;\n  min-width: 36px;\n}\n\n.view-toggle button:not(:last-child) {\n  border-right: 1px solid var(--mj-border-default);\n}\n\n/* Responsive */\n@media (max-width: 1024px) {\n  .action-toolbar {\n    flex-direction: column;\n    align-items: stretch;\n  }\n\n  .toolbar-left,\n  .toolbar-right {\n    width: 100%;\n    justify-content: flex-start;\n  }\n\n  .search-container {\n    max-width: none;\n    flex: 1;\n  }\n}\n\n@media (max-width: 640px) {\n  .toolbar-right {\n    flex-wrap: wrap;\n  }\n\n  .results-count {\n    order: -1;\n    width: 100%;\n  }\n}\n"] }]
-    }], () => [{ type: i1.ActionExplorerStateService }, { type: i0.ChangeDetectorRef }], { TotalCount: [{
-            type: Input
-        }], FilteredCount: [{
-            type: Input
-        }], NewActionClick: [{
-            type: Output
-        }], RefreshClick: [{
-            type: Output
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ActionToolbarComponent, { className: "ActionToolbarComponent", filePath: "src/Actions/components/explorer/action-toolbar.component.ts", lineNumber: 34 }); })();
-//# sourceMappingURL=action-toolbar.component.js.map

package/dist/Actions/components/explorer/action-toolbar.component.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"action-toolbar.component.js","sourceRoot":"","sources":["../../../../src/Actions/components/explorer/action-toolbar.component.ts","../../../../src/Actions/components/explorer/action-toolbar.component.html"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Input,\n  Output,\n  EventEmitter,\n  OnInit,\n  OnDestroy,\n  ChangeDetectionStrategy,\n  ChangeDetectorRef\n} from '@angular/core';\nimport { Subject } from 'rxjs';\nimport { takeUntil, debounceTime, distinctUntilChanged } from 'rxjs/operators';\nimport {\n  ActionExplorerStateService,\n  ActionViewMode,\n  SortField,\n  SortDirection,\n  ActionFilters\n} from '../../services/action-explorer-state.service';\n\ninterface SortOption {\n  field: SortField;\n  label: string;\n  icon: string;\n}\n\n@Component({\n  standalone: false,\n  selector: 'mj-action-toolbar',\n  templateUrl: './action-toolbar.component.html',\n  styleUrls: ['./action-toolbar.component.css'],\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class ActionToolbarComponent implements OnInit, OnDestroy {\n  @Input() TotalCount = 0;\n  @Input() FilteredCount = 0;\n  @Output() NewActionClick = new EventEmitter<void>();\n  @Output() RefreshClick = new EventEmitter<void>();\n\n  public ViewMode: ActionViewMode = 'card';\n  public SortField: SortField = 'name';\n  public SortDirection: SortDirection = 'asc';\n  public Filters: ActionFilters = {\n    searchTerm: '',\n    statuses: [],\n    types: [],\n    approvalStatuses: [],\n    hasExecutions: null\n  };\n\n  public ShowFiltersDropdown = false;\n  public ShowSortDropdown = false;\n\n  public SortOptions: SortOption[] = [\n    { field: 'name', label: 'Name', icon: 'fa-solid fa-font' },\n    { field: 'updated', label: 'Last Updated', icon: 'fa-solid fa-clock' },\n    { field: 'status', label: 'Status', icon: 'fa-solid fa-circle-check' },\n    { field: 'type', label: 'Type', icon: 'fa-solid fa-tag' },\n    { field: 'category', label: 'Category', icon: 'fa-solid fa-folder' }\n  ];\n\n  public StatusOptions = [\n    { value: 'Active', label: 'Active', color: 'success' },\n    { value: 'Pending', label: 'Pending', color: 'warning' },\n    { value: 'Disabled', label: 'Disabled', color: 'error' }\n  ];\n\n  public TypeOptions = [\n    { value: 'Generated', label: 'AI Generated', icon: 'fa-solid fa-robot' },\n    { value: 'Custom', label: 'Custom', icon: 'fa-solid fa-code' }\n  ];\n\n  private destroy$ = new Subject<void>();\n  private searchInput$ = new Subject<string>();\n\n  constructor(\n    public StateService: ActionExplorerStateService,\n    private cdr: ChangeDetectorRef\n  ) {}\n\n  ngOnInit(): void {\n    this.subscribeToState();\n    this.setupSearchDebounce();\n  }\n\n  ngOnDestroy(): void {\n    this.destroy$.next();\n    this.destroy$.complete();\n  }\n\n  private subscribeToState(): void {\n    this.StateService.ViewMode$.pipe(takeUntil(this.destroy$)).subscribe(mode => {\n      this.ViewMode = mode;\n      this.cdr.markForCheck();\n    });\n\n    this.StateService.SortConfig$.pipe(takeUntil(this.destroy$)).subscribe(config => {\n      this.SortField = config.field;\n      this.SortDirection = config.direction;\n      this.cdr.markForCheck();\n    });\n\n    this.StateService.Filters$.pipe(takeUntil(this.destroy$)).subscribe(filters => {\n      this.Filters = filters;\n      this.cdr.markForCheck();\n    });\n  }\n\n  private setupSearchDebounce(): void {\n    this.searchInput$.pipe(\n      debounceTime(300),\n      distinctUntilChanged(),\n      takeUntil(this.destroy$)\n    ).subscribe(term => {\n      this.StateService.setSearchTerm(term);\n    });\n  }\n\n  public onSearchInput(term: string): void {\n    this.searchInput$.next(term);\n  }\n\n  public clearSearch(): void {\n    this.StateService.setSearchTerm('');\n  }\n\n  public setViewMode(mode: ActionViewMode): void {\n    this.StateService.setViewMode(mode);\n  }\n\n  public setSortField(field: SortField): void {\n    this.StateService.setSortField(field);\n    this.ShowSortDropdown = false;\n  }\n\n  public toggleSortDirection(): void {\n    this.StateService.toggleSortDirection();\n  }\n\n  public toggleStatus(status: string): void {\n    const current = [...this.Filters.statuses];\n    const index = current.indexOf(status);\n    if (index >= 0) {\n      current.splice(index, 1);\n    } else {\n      current.push(status);\n    }\n    this.StateService.setStatusFilter(current);\n  }\n\n  public toggleType(type: string): void {\n    const current = [...this.Filters.types];\n    const index = current.indexOf(type);\n    if (index >= 0) {\n      current.splice(index, 1);\n    } else {\n      current.push(type);\n    }\n    this.StateService.setTypeFilter(current);\n  }\n\n  public isStatusSelected(status: string): boolean {\n    return this.Filters.statuses.includes(status);\n  }\n\n  public isTypeSelected(type: string): boolean {\n    return this.Filters.types.includes(type);\n  }\n\n  public clearFilters(): void {\n    this.StateService.clearFilters();\n  }\n\n  public hasActiveFilters(): boolean {\n    return this.StateService.hasActiveFilters();\n  }\n\n  public getActiveFilterCount(): number {\n    let count = 0;\n    if (this.Filters.searchTerm) count++;\n    count += this.Filters.statuses.length;\n    count += this.Filters.types.length;\n    count += this.Filters.approvalStatuses.length;\n    if (this.Filters.hasExecutions != null) count++;\n    return count;\n  }\n\n  public toggleFiltersDropdown(): void {\n    this.ShowFiltersDropdown = !this.ShowFiltersDropdown;\n    if (this.ShowFiltersDropdown) {\n      this.ShowSortDropdown = false;\n    }\n  }\n\n  public toggleSortDropdown(): void {\n    this.ShowSortDropdown = !this.ShowSortDropdown;\n    if (this.ShowSortDropdown) {\n      this.ShowFiltersDropdown = false;\n    }\n  }\n\n  public closeDropdowns(): void {\n    this.ShowFiltersDropdown = false;\n    this.ShowSortDropdown = false;\n  }\n\n  public getSortLabel(): string {\n    const option = this.SortOptions.find(o => o.field === this.SortField);\n    return option?.label || 'Sort';\n  }\n\n  public getSortIcon(): string {\n    return this.SortDirection === 'asc' ? 'fa-solid fa-arrow-up-short-wide' : 'fa-solid fa-arrow-down-wide-short';\n  }\n\n  public onNewAction(): void {\n    this.NewActionClick.emit();\n  }\n\n  public onRefresh(): void {\n    this.RefreshClick.emit();\n  }\n}\n","<div class=\"action-toolbar\">\n  <div class=\"toolbar-left\">\n    <!-- Search -->\n    <div class=\"search-container\">\n      <div class=\"search-input-wrapper\">\n        <i class=\"fa-solid fa-search search-icon\"></i>\n        <input type=\"text\" class=\"mj-input\"\n          placeholder=\"Search actions...\"\n          [value]=\"Filters.searchTerm\"\n          (input)=\"onSearchInput($any($event.target).value)\" />\n        @if (Filters.searchTerm) {\n          <button mjButton variant=\"flat\" size=\"sm\" class=\"search-clear\"\n            (click)=\"clearSearch()\">\n            <i class=\"fa-solid fa-times\"></i>\n          </button>\n        }\n      </div>\n    </div>\n\n    <!-- Filters Dropdown -->\n    <div class=\"dropdown-container\" (clickOutside)=\"ShowFiltersDropdown = false\">\n      <button mjButton\n        variant=\"outline\"\n        [class.active]=\"hasActiveFilters()\"\n        (click)=\"toggleFiltersDropdown()\">\n        <i class=\"fa-solid fa-filter\"></i>\n        Filters\n        @if (getActiveFilterCount() > 0) {\n          <span class=\"filter-badge\">{{ getActiveFilterCount() }}</span>\n        }\n        <i [class]=\"ShowFiltersDropdown ? 'fa-solid fa-chevron-up' : 'fa-solid fa-chevron-down'\"></i>\n      </button>\n\n      @if (ShowFiltersDropdown) {\n        <div class=\"dropdown-menu filters-menu\">\n          <div class=\"dropdown-section\">\n            <div class=\"section-header\">\n              <span>Status</span>\n              @if (Filters.statuses.length > 0) {\n                <button mjButton\n                  variant=\"flat\"\n                  size=\"sm\"\n                  (click)=\"StateService.setStatusFilter([])\">\n                  Clear\n                </button>\n              }\n            </div>\n            <div class=\"filter-options\">\n              @for (status of StatusOptions; track status.value) {\n                <label class=\"filter-option\" [class.selected]=\"isStatusSelected(status.value)\">\n                  <input type=\"checkbox\"\n                    [checked]=\"isStatusSelected(status.value)\"\n                    (change)=\"toggleStatus(status.value)\">\n                  <span class=\"status-dot\" [attr.data-status]=\"status.value\"></span>\n                  {{ status.label }}\n                </label>\n              }\n            </div>\n          </div>\n\n          <div class=\"dropdown-section\">\n            <div class=\"section-header\">\n              <span>Type</span>\n              @if (Filters.types.length > 0) {\n                <button mjButton\n                  variant=\"flat\"\n                  size=\"sm\"\n                  (click)=\"StateService.setTypeFilter([])\">\n                  Clear\n                </button>\n              }\n            </div>\n            <div class=\"filter-options\">\n              @for (type of TypeOptions; track type.value) {\n                <label class=\"filter-option\" [class.selected]=\"isTypeSelected(type.value)\">\n                  <input type=\"checkbox\"\n                    [checked]=\"isTypeSelected(type.value)\"\n                    (change)=\"toggleType(type.value)\">\n                  <i [class]=\"type.icon\"></i>\n                  {{ type.label }}\n                </label>\n              }\n            </div>\n          </div>\n\n          @if (hasActiveFilters()) {\n            <div class=\"dropdown-footer\">\n              <button mjButton\n                variant=\"danger\"\n                (click)=\"clearFilters()\">\n                <i class=\"fa-solid fa-times\"></i>\n                Clear All Filters\n              </button>\n            </div>\n          }\n        </div>\n      }\n    </div>\n\n    <!-- Active Filter Chips -->\n    @if (hasActiveFilters()) {\n      <div class=\"active-filters\">\n        @for (status of Filters.statuses; track status) {\n          <span class=\"status-chip removable\" (click)=\"toggleStatus(status)\">\n            Status: {{ status }} <i class=\"fa-solid fa-times\"></i>\n          </span>\n        }\n        @for (type of Filters.types; track type) {\n          <span class=\"status-chip removable\" (click)=\"toggleType(type)\">\n            Type: {{ type === 'Generated' ? 'AI Generated' : type }} <i class=\"fa-solid fa-times\"></i>\n          </span>\n        }\n      </div>\n    }\n  </div>\n\n  <div class=\"toolbar-right\">\n    <!-- Results Count -->\n    <div class=\"results-count\">\n      <span class=\"count\">{{ FilteredCount }}</span>\n      @if (FilteredCount !== TotalCount) {\n        <span class=\"of-total\">of {{ TotalCount }}</span>\n      }\n      <span class=\"label\">actions</span>\n    </div>\n\n    <!-- Sort Dropdown -->\n    <div class=\"dropdown-container\" (clickOutside)=\"ShowSortDropdown = false\">\n      <button mjButton\n        variant=\"outline\"\n        (click)=\"toggleSortDropdown()\">\n        <i [class]=\"getSortIcon()\"></i>\n        {{ getSortLabel() }}\n        <i [class]=\"ShowSortDropdown ? 'fa-solid fa-chevron-up' : 'fa-solid fa-chevron-down'\"></i>\n      </button>\n\n      @if (ShowSortDropdown) {\n        <div class=\"dropdown-menu sort-menu\">\n          @for (option of SortOptions; track option.field) {\n            <button class=\"sort-option\"\n              [class.selected]=\"SortField === option.field\"\n              (click)=\"setSortField(option.field)\">\n              <i [class]=\"option.icon\"></i>\n              {{ option.label }}\n              @if (SortField === option.field) {\n                <i [class]=\"SortDirection === 'asc' ? 'fa-solid fa-arrow-up' : 'fa-solid fa-arrow-down'\" class=\"direction-icon\"></i>\n              }\n            </button>\n          }\n        </div>\n      }\n    </div>\n\n    <!-- View Mode Toggle -->\n    <div class=\"view-toggle\">\n      <button mjButton\n        [variant]=\"ViewMode === 'card' ? 'primary' : 'outline'\"\n        title=\"Card View\"\n        (click)=\"setViewMode('card')\">\n        <i class=\"fa-solid fa-grip\"></i>\n      </button>\n      <button mjButton\n        [variant]=\"ViewMode === 'list' ? 'primary' : 'outline'\"\n        title=\"List View\"\n        (click)=\"setViewMode('list')\">\n        <i class=\"fa-solid fa-list\"></i>\n      </button>\n      <button mjButton\n        [variant]=\"ViewMode === 'compact' ? 'primary' : 'outline'\"\n        title=\"Compact View\"\n        (click)=\"setViewMode('compact')\">\n        <i class=\"fa-solid fa-bars\"></i>\n      </button>\n    </div>\n\n    <!-- Refresh Button -->\n    <button mjButton\n      variant=\"flat\"\n      title=\"Refresh\"\n      (click)=\"onRefresh()\">\n      <i class=\"fa-solid fa-refresh\"></i>\n    </button>\n\n    <!-- New Action Button -->\n    <button mjButton\n      variant=\"primary\"\n      (click)=\"onNewAction()\">\n      <i class=\"fa-solid fa-plus\"></i>\n      New Action\n    </button>\n  </div>\n</div>\n"]}