@memberjunction/ng-dashboards 5.21.0 → 5.23.0

package/dist/KnowledgeHub/components/search/knowledge-search-resource.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"knowledge-search-resource.component.js","sourceRoot":"","sources":["../../../../src/KnowledgeHub/components/search/knowledge-search-resource.component.ts","../../../../src/KnowledgeHub/components/search/knowledge-search-resource.component.html"],"names":[],"mappings":"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","sourcesContent":["/**\n * @fileoverview Knowledge Hub Search Dashboard (Task 2)\n *\n * Google-style clean search experience with centered search bar,\n * grouped results, faceted sidebar filters, and \"Ask Knowledge Agent\" CTA.\n * Registered as BaseResourceComponent for the Knowledge Hub app.\n */\n\nimport { Component, ChangeDetectorRef, OnDestroy, AfterViewInit, inject, Injector } from '@angular/core';\nimport { Subject } from 'rxjs';\nimport { takeUntil } from 'rxjs/operators';\nimport { CompositeKey, Metadata } from '@memberjunction/core';\nimport { ResourceData } from '@memberjunction/core-entities';\nimport { RegisterClass } from '@memberjunction/global';\nimport { BaseResourceComponent, NavigationService } from '@memberjunction/ng-shared';\nimport {\n    SearchResultItem,\n    SearchResultGroup,\n    SearchFilter,\n    SearchRequest,\n    SearchResponse,\n    SearchResultSelectedEvent,\n    SearchFilterChangeEvent\n} from '@memberjunction/ng-search';\nimport { SearchService, RecentSearch } from '@memberjunction/ng-search';\nimport { ConversationBridgeService } from '@memberjunction/ng-conversations';\n\n/** Saved search entry */\ninterface SavedSearch {\n    Query: string;\n    FilterCount: number;\n    SavedAt: Date;\n}\n\n@RegisterClass(BaseResourceComponent, 'KnowledgeSearchResource')\n@Component({\n    standalone: false,\n    selector: 'app-knowledge-search-resource',\n    templateUrl: './knowledge-search-resource.component.html',\n    styleUrls: ['./knowledge-search-resource.component.css']\n})\nexport class KnowledgeSearchResourceComponent extends BaseResourceComponent implements AfterViewInit, OnDestroy {\n    private cdr = inject(ChangeDetectorRef);\n    private searchService = inject(SearchService);\n    private injector = inject(Injector);\n    private navigationService = inject(NavigationService);\n    private destroy$ = new Subject<void>();\n\n    // --- State ---\n    public Query = '';\n    public IsSearching = false;\n    public HasSearched = false;\n    public ShowFilters = false;\n    public ShowResultDetail = false;\n    public DetailResult: SearchResultItem | null = null;\n\n    // --- Results ---\n    public AllResults: SearchResultItem[] = [];\n    public ResultGroups: SearchResultGroup[] = [];\n    public Filters: SearchFilter[] = [];\n    public ActiveFilters: Record<string, string[]> = {};\n    public TotalCount = 0;\n    public ElapsedMs = 0;\n    /** Minimum relevance score threshold (0-1). Results below this are hidden. */\n    public MinScoreThreshold = 0.35;\n\n    // --- Recent & Saved ---\n    public RecentSearches: RecentSearch[] = [];\n    public SavedSearches: SavedSearch[] = [];\n\n    async GetResourceDisplayName(_data: ResourceData): Promise<string> {\n        return 'Knowledge Search';\n    }\n\n    async GetResourceIconClass(_data: ResourceData): Promise<string> {\n        return 'fa-solid fa-magnifying-glass';\n    }\n\n    ngAfterViewInit(): void {\n        this.subscribeToSearchState();\n        this.parseUrlParameters();\n    }\n\n    ngOnDestroy(): void {\n        this.destroy$.next();\n        this.destroy$.complete();\n    }\n\n    /** Execute a search query */\n    public async RunSearch(): Promise<void> {\n        const query = this.Query.trim();\n        if (!query) return;\n\n        const request: SearchRequest = {\n            Query: query,\n            MaxResults: 50,\n            ActiveFilters: this.ActiveFilters,\n            IncludeSources: ['vector', 'fulltext', 'entity'],\n            MinScore: this.MinScoreThreshold,\n        };\n\n        const response = await this.searchService.ExecuteSearch(request);\n        this.applySearchResponse(response);\n    }\n\n    /** Handle pressing Enter in the search box */\n    public OnSearchKeydown(event: KeyboardEvent): void {\n        if (event.key === 'Enter') {\n            event.preventDefault();\n            this.RunSearch();\n        }\n    }\n\n    /** Handle selecting a result */\n    public OnResultSelected(event: SearchResultSelectedEvent): void {\n        this.DetailResult = event.Result;\n        this.ShowResultDetail = true;\n        this.cdr.detectChanges();\n    }\n\n    /** Handle \"Open Record\" — navigate to the entity record via NavigationService */\n    public OnOpenRecord(event: { EntityName: string; RecordID: string }): void {\n        const md = new Metadata();\n        const entityInfo = md.Entities.find(e => e.Name === event.EntityName);\n        const pkey = new CompositeKey();\n        if (entityInfo) {\n            pkey.LoadFromURLSegment(entityInfo, event.RecordID);\n        } else {\n            // Fallback: treat as simple single-field PK\n            pkey.KeyValuePairs = [{ FieldName: 'ID', Value: event.RecordID }];\n        }\n        this.navigationService.OpenEntityRecord(event.EntityName, pkey);\n    }\n\n    /** Close the result detail view */\n    public CloseResultDetail(): void {\n        this.ShowResultDetail = false;\n        this.DetailResult = null;\n        this.cdr.detectChanges();\n    }\n\n    /** Toggle the filter sidebar */\n    public ToggleFilters(): void {\n        this.ShowFilters = !this.ShowFilters;\n        this.cdr.detectChanges();\n    }\n\n    /** Handle a filter change from the filter component */\n    public OnFilterChanged(event: SearchFilterChangeEvent): void {\n        this.ActiveFilters[event.Category] = event.SelectedValues;\n        this.RunSearch();\n    }\n\n    /** Handle clearing all filters */\n    public OnFiltersCleared(): void {\n        this.ActiveFilters = {};\n        this.MinScoreThreshold = 0.35;\n        this.RunSearch();\n    }\n\n    /** Handle relevance threshold slider change */\n    public OnThresholdChanged(value: number): void {\n        this.MinScoreThreshold = value;\n        this.RunSearch();\n    }\n\n    /** Open the chat overlay with Knowledge Agent context */\n    public OnAskAgent(): void {\n        try {\n            const bridge = this.injector.get(ConversationBridgeService, null);\n            if (bridge) {\n                bridge.SwitchToOverlay(null);\n            } else {\n                console.warn('[KnowledgeSearch] ConversationBridgeService not available');\n            }\n        } catch {\n            console.warn('[KnowledgeSearch] ConversationBridgeService not available');\n        }\n    }\n\n    /** Apply a recent search */\n    public ApplyRecentSearch(recent: RecentSearch): void {\n        this.Query = recent.Query;\n        this.RunSearch();\n    }\n\n    /** Clear the current search */\n    public ClearSearch(): void {\n        this.Query = '';\n        this.AllResults = [];\n        this.ResultGroups = [];\n        this.Filters = [];\n        this.ActiveFilters = {};\n        this.TotalCount = 0;\n        this.HasSearched = false;\n        this.ShowFilters = false;\n        this.cdr.detectChanges();\n    }\n\n    /** Check if any filters are active */\n    public HasActiveFilters(): boolean {\n        return Object.values(this.ActiveFilters).some(v => v.length > 0);\n    }\n\n    // --- Private Methods ---\n\n    /** Parse URL parameters for deep links (e.g., ?conversationId=xxx or ?q=search+term) */\n    private parseUrlParameters(): void {\n        try {\n            const urlParams = new URLSearchParams(window.location.search);\n            const conversationId = urlParams.get('conversationId');\n            if (conversationId) {\n                // Deep link to conversation - open the agent chat\n                this.OnAskAgent();\n            }\n\n            const searchQuery = urlParams.get('q');\n            if (searchQuery) {\n                this.Query = searchQuery;\n                this.RunSearch();\n            }\n        } catch {\n            // Ignore URL parsing errors\n        }\n    }\n\n    private subscribeToSearchState(): void {\n        this.searchService.IsSearching$\n            .pipe(takeUntil(this.destroy$))\n            .subscribe((val: boolean) => {\n                this.IsSearching = val;\n                this.cdr.detectChanges();\n            });\n\n        this.searchService.RecentSearches$\n            .pipe(takeUntil(this.destroy$))\n            .subscribe((val: RecentSearch[]) => {\n                this.RecentSearches = val;\n                this.cdr.detectChanges();\n            });\n    }\n\n    private applySearchResponse(response: SearchResponse): void {\n        this.AllResults = response.Results;\n        this.ResultGroups = response.Groups;\n        this.Filters = response.Filters;\n        this.TotalCount = response.TotalCount;\n        this.ElapsedMs = response.ElapsedMs;\n        this.HasSearched = true;\n        this.ShowFilters = response.Filters.length > 0;\n        this.cdr.detectChanges();\n    }\n}\n\n/** Tree-shaking prevention */\nexport function LoadKnowledgeSearchResource(): void {\n    // Prevents tree-shaking of the component\n}\n","@if (!ShowResultDetail) {\n    <div class=\"search-page\" [class.search-page-has-results]=\"HasSearched\">\n        <!-- Search Hero Section -->\n        <div class=\"search-hero\" [class.search-hero-compact]=\"HasSearched\">\n            @if (!HasSearched) {\n                <div class=\"search-logo\">\n                    <i class=\"fa-solid fa-brain\"></i>\n                    Knowledge Hub\n                </div>\n                <p class=\"search-subtitle\">Search across all your knowledge -- entities, documents, content, and more</p>\n            }\n\n            <!-- Search Bar -->\n            <div class=\"search-container\">\n                <div class=\"search-box\">\n                    <i class=\"fa-solid fa-magnifying-glass search-box-icon\"></i>\n                    <input\n                        type=\"text\"\n                        class=\"search-box-input\"\n                        placeholder=\"Search across all your knowledge...\"\n                        [(ngModel)]=\"Query\"\n                        (keydown)=\"OnSearchKeydown($event)\"\n                        autocomplete=\"off\"\n                        spellcheck=\"false\"\n                    />\n                    @if (Query.length > 0) {\n                        <button class=\"search-clear-btn\" (click)=\"ClearSearch()\">\n                            <i class=\"fa-solid fa-times\"></i>\n                        </button>\n                    }\n                    <button class=\"search-submit-btn\" (click)=\"RunSearch()\" [disabled]=\"IsSearching || !Query.trim()\">\n                        @if (IsSearching) {\n                            <i class=\"fa-solid fa-spinner fa-spin\"></i>\n                        } @else {\n                            Search\n                        }\n                    </button>\n                </div>\n\n                <!-- Quick filters row -->\n                @if (!HasSearched) {\n                    <div class=\"search-quick-actions\">\n                        <button class=\"quick-action-btn\" (click)=\"OnAskAgent()\">\n                            <i class=\"fa-solid fa-robot\"></i>\n                            Ask Knowledge Agent\n                        </button>\n                    </div>\n                }\n            </div>\n        </div>\n\n        @if (HasSearched) {\n            <!-- Results Area -->\n            <div class=\"search-results-layout\">\n                <!-- Sidebar Filters -->\n                @if (ShowFilters && Filters.length > 0) {\n                    <aside class=\"search-sidebar\">\n                        <mj-search-filter\n                            [Filters]=\"Filters\"\n                            [ActiveFilters]=\"ActiveFilters\"\n                            (FilterChanged)=\"OnFilterChanged($event)\"\n                            (FiltersCleared)=\"OnFiltersCleared()\"\n                        ></mj-search-filter>\n\n                        <!-- Relevance Threshold Slider -->\n                        <div class=\"threshold-section\">\n                            <label class=\"threshold-label\">\n                                Min Relevance\n                                <span class=\"threshold-value\">{{ (MinScoreThreshold * 100) | number:'1.0-0' }}%</span>\n                            </label>\n                            <input\n                                type=\"range\"\n                                class=\"threshold-slider\"\n                                [min]=\"0\"\n                                [max]=\"100\"\n                                [step]=\"5\"\n                                [value]=\"MinScoreThreshold * 100\"\n                                (input)=\"OnThresholdChanged($any($event.target).value / 100)\"\n                            />\n                            <div class=\"threshold-range-labels\">\n                                <span>All</span>\n                                <span>Strict</span>\n                            </div>\n                        </div>\n                    </aside>\n                }\n\n                <!-- Results Main -->\n                <div class=\"search-results-main\">\n                    <!-- Results Header -->\n                    <div class=\"search-results-header\">\n                        <span class=\"search-results-count\">\n                            {{ TotalCount }} results\n                            @if (ElapsedMs > 0) {\n                                <span class=\"search-results-time\">in {{ ElapsedMs }}ms</span>\n                            }\n                        </span>\n                        <div class=\"search-results-actions\">\n                            @if (Filters.length > 0) {\n                                <button class=\"toggle-filters-btn\" (click)=\"ToggleFilters()\">\n                                    <i class=\"fa-solid fa-filter\"></i>\n                                    @if (HasActiveFilters()) {\n                                        Filters Active\n                                    } @else {\n                                        Filters\n                                    }\n                                </button>\n                            }\n                        </div>\n                    </div>\n\n                    <!-- Results List -->\n                    <mj-search-results\n                        [ResultGroups]=\"ResultGroups\"\n                        [IsLoading]=\"IsSearching\"\n                        [TotalCount]=\"TotalCount\"\n                        [ElapsedMs]=\"ElapsedMs\"\n                        (ResultSelected)=\"OnResultSelected($event)\"\n                        (OpenRecordRequested)=\"OnOpenRecord($event)\"\n                    ></mj-search-results>\n\n                    <!-- Agent CTA at bottom -->\n                    @if (TotalCount === 0 && !IsSearching) {\n                        <div class=\"search-agent-cta\">\n                            <i class=\"fa-solid fa-robot cta-icon\"></i>\n                            <div class=\"cta-text\">\n                                <strong>Can't find what you're looking for?</strong>\n                                <p>Ask the Knowledge Agent for a deeper analysis</p>\n                            </div>\n                            <button class=\"cta-btn\" (click)=\"OnAskAgent()\">\n                                Ask Agent\n                            </button>\n                        </div>\n                    }\n                </div>\n            </div>\n        } @else if (!IsSearching) {\n            <!-- Empty state: recent searches -->\n            <div class=\"search-recent-area\">\n                @if (RecentSearches.length > 0) {\n                    <h3 class=\"recent-title\">Recent Searches</h3>\n                    <div class=\"recent-list\">\n                        @for (recent of RecentSearches; track recent.Query; let i = $index) {\n                            @if (i < 8) {\n                                <div class=\"recent-item\" (click)=\"ApplyRecentSearch(recent)\">\n                                    <i class=\"fa-solid fa-clock recent-icon\"></i>\n                                    <span class=\"recent-query\">{{ recent.Query }}</span>\n                                    <span class=\"recent-count\">{{ recent.ResultCount }} results</span>\n                                </div>\n                            }\n                        }\n                    </div>\n                }\n            </div>\n        }\n    </div>\n} @else {\n    <!-- Result Detail View (Task 8) -->\n    <app-search-result-detail\n        [Result]=\"DetailResult\"\n        (BackClicked)=\"CloseResultDetail()\"\n        (NavigateToRecord)=\"OnOpenRecord($event)\"\n    ></app-search-result-detail>\n}\n"]}

package/dist/KnowledgeHub/index.d.ts

@@ -0,0 +1,5 @@
+export * from './components/search/knowledge-search-resource.component';
+export * from './components/config/knowledge-config-resource.component';
+export * from './components/results-detail/search-result-detail.component';
+export * from './components/clusters/cluster-visualization-resource.component';
+//# sourceMappingURL=index.d.ts.map

package/dist/KnowledgeHub/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/KnowledgeHub/index.ts"],"names":[],"mappings":"AACA,cAAc,yDAAyD,CAAC;AACxE,cAAc,yDAAyD,CAAC;AACxE,cAAc,4DAA4D,CAAC;AAC3E,cAAc,gEAAgE,CAAC"}

package/dist/KnowledgeHub/index.js

@@ -0,0 +1,6 @@
+// Knowledge Hub components
+export * from './components/search/knowledge-search-resource.component';
+export * from './components/config/knowledge-config-resource.component';
+export * from './components/results-detail/search-result-detail.component';
+export * from './components/clusters/cluster-visualization-resource.component';
+//# sourceMappingURL=index.js.map

package/dist/KnowledgeHub/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/KnowledgeHub/index.ts"],"names":[],"mappings":"AAAA,2BAA2B;AAC3B,cAAc,yDAAyD,CAAC;AACxE,cAAc,yDAAyD,CAAC;AACxE,cAAc,4DAA4D,CAAC;AAC3E,cAAc,gEAAgE,CAAC","sourcesContent":["// Knowledge Hub components\nexport * from './components/search/knowledge-search-resource.component';\nexport * from './components/config/knowledge-config-resource.component';\nexport * from './components/results-detail/search-result-detail.component';\nexport * from './components/clusters/cluster-visualization-resource.component';\n"]}

package/dist/Lists/components/lists-browse-resource.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"lists-browse-resource.component.d.ts","sourceRoot":"","sources":["../../../src/Lists/components/lists-browse-resource.component.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"lists-browse-resource.component.d.ts","sourceRoot":"","sources":["../../../src/Lists/components/lists-browse-resource.component.ts"],"names":[],"mappings":"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"}

package/dist/Lists/components/lists-browse-resource.component.js

@@ -15,7 +15,8 @@ import * as i2 from "@memberjunction/ng-notifications";
 import * as i3 from "@memberjunction/ng-list-management";
 import * as i4 from "@angular/common";
 import * as i5 from "@angular/forms";
-import * as i6 from "@memberjunction/ng-shared-generic";
+import * as i6 from "@memberjunction/ng-ui-components";
+import * as i7 from "@memberjunction/ng-shared-generic";
 const _c0 = a0 => ({ node: a0, depth: 0 });
 const _c1 = (a0, a1) => ({ node: a0, depth: a1 });
 function ListsBrowseResource_Conditional_15_Template(rf, ctx) { if (rf & 1) {
@@ -1401,7 +1402,7 @@ let ListsBrowseResource = class ListsBrowseResource extends BaseResourceComponen
     static ɵfac = function ListsBrowseResource_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || ListsBrowseResource)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef), i0.ɵɵdirectiveInject(i1.TabService), i0.ɵɵdirectiveInject(i2.MJNotificationService), i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i3.ListSharingService)); };
     static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ListsBrowseResource, selectors: [["mj-lists-browse-resource"]], hostBindings: function ListsBrowseResource_HostBindings(rf, ctx) { if (rf & 1) {
             i0.ɵɵlistener("click", function ListsBrowseResource_click_HostBindingHandler($event) { return ctx.onDocumentClick($event); }, i0.ɵɵresolveDocument)("keydown.escape", function ListsBrowseResource_keydown_escape_HostBindingHandler() { return ctx.onEscapeKey(); }, i0.ɵɵresolveDocument);
-        } }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 45, vars: 22, consts: [["categoryNodeTemplate", ""], ["entityInput", ""], [1, "lists-browse-container"], [1, "browse-header"], [1, "header-row"], [1, "header-title"], [1, "fa-solid", "fa-list-check"], [1, "btn-create", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "header-actions"], [1, "search-box"], [1, "fa-solid", "fa-search"], ["type", "text", "placeholder", "Search lists...", 3, "ngModelChange", "ngModel"], [1, "clear-search"], [1, "filter-group"], ["title", "Filter by owner", 1, "filter-select", 3, "ngModelChange", "ngModel"], [3, "value"], ["title", "Filter by entity", 1, "filter-select", 3, "ngModelChange", "ngModel"], [1, "view-toggle-group"], ["title", "Table view", 1, "view-toggle", 3, "click"], [1, "fa-solid", "fa-table-list"], ["title", "Card view", 1, "view-toggle", 3, "click"], [1, "fa-solid", "fa-grip"], ["title", "Category view", 1, "view-toggle", 3, "click"], [1, "fa-solid", "fa-folder-tree"], [1, "loading-container"], [1, "empty-state"], [1, "empty-state", "search-empty"], [1, "browse-content"], [1, "context-menu-overlay"], [1, "context-menu", 3, "top", "left"], [1, "modal-overlay"], [1, "modal-dialog"], [1, "modal-dialog", "confirm-dialog"], [3, "config", "visible"], [1, "entity-dropdown-portal", 3, "top", "left", "width", "dropdown-above"], [1, "clear-search", 3, "click"], [1, "fa-solid", "fa-times"], ["text", "Loading lists...", "size", "medium"], [1, "empty-state-icon-wrapper"], [1, "icon-bg"], [1, "empty-state-features"], [1, "feature-item"], [1, "fa-solid", "fa-check-circle"], [1, "btn-create-large", 3, "click"], [1, "empty-state-icon-wrapper", "search"], [1, "fa-solid", "fa-filter-circle-xmark"], [1, "empty-hint"], [1, "btn-clear", 3, "click"], [1, "results-header"], [1, "result-count"], [1, "sort-options"], [1, "filter-select", "sort-select", 3, "ngModelChange", "ngModel"], [1, "lists-table"], ["role", "list", "aria-label", "Lists", 1, "lists-grid"], [1, "category-tree"], ["role", "grid", "aria-label", "Lists table"], ["scope", "col", 1, "col-name"], ["scope", "col", 1, "col-entity"], ["scope", "col", 1, "col-items"], ["scope", "col", 1, "col-sharing"], ["scope", "col", 1, "col-owner"], ["scope", "col", 1, "col-updated"], ["scope", "col", 1, "col-actions"], [1, "sr-only"], ["tabindex", "0", "role", "row", 1, "list-row"], ["tabindex", "0", "role", "row", 1, "list-row", 3, "click", "keydown.enter"], ["role", "gridcell", 1, "col-name"], [1, "name-cell"], ["aria-hidden", "true", 1, "list-icon"], [1, "name-content"], [1, "list-name"], [1, "list-desc"], ["role", "gridcell", 1, "col-entity"], [1, "entity-badge"], ["role", "gridcell", 1, "col-items"], ["role", "gridcell", 1, "col-sharing"], [1, "sharing-private"], ["role", "gridcell", 1, "col-owner"], [1, "owner-name"], ["role", "gridcell", 1, "col-updated"], ["role", "gridcell", 1, "col-actions"], ["title", "More options", 1, "action-btn"], [1, "sharing-indicator"], [1, "fa-solid", "fa-share-nodes"], [1, "share-count"], [1, "fa-solid", "fa-lock"], ["title", "More options", 1, "action-btn", 3, "click"], ["aria-hidden", "true", 1, "fa-solid", "fa-ellipsis-v"], ["tabindex", "0", "role", "listitem", 1, "list-card"], ["tabindex", "0", "role", "listitem", 1, "list-card", 3, "click", "keydown.enter"], [1, "card-header"], ["aria-hidden", "true", 1, "card-icon"], [1, "card-menu"], [1, "card-body"], [1, "card-title"], [1, "card-description"], [1, "card-meta"], [1, "meta-item"], [1, "fa-solid", "fa-database"], [1, "fa-solid", "fa-hashtag"], [1, "card-footer"], [1, "owner-tag"], [1, "fa-solid", "fa-user"], [1, "card-footer-right"], [1, "date-info"], [1, "menu-btn", 3, "click"], [1, "sharing-badge", 3, "title"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "category-section"], [1, "category-header"], [1, "category-header", "uncategorized"], ["role", "list", 1, "category-lists"], [1, "category-header", 3, "click"], [1, "fa-solid", "fa-folder"], [1, "category-name"], [1, "category-count"], [1, "category-header", "uncategorized", 3, "click"], [1, "fa-solid", "fa-inbox"], ["tabindex", "0", "role", "listitem", 1, "list-row", "hierarchy-row"], ["tabindex", "0", "role", "listitem", 1, "list-row", "hierarchy-row", 3, "click", "keydown.enter"], [1, "list-info"], [1, "list-meta"], [1, "list-actions"], [1, "action-btn", 3, "click"], [1, "context-menu-overlay", 3, "click"], [1, "context-menu"], [1, "menu-item", 3, "click"], [1, "fa-solid", "fa-pen"], [1, "fa-solid", "fa-copy"], [1, "menu-divider"], [1, "menu-item", "danger", 3, "click"], [1, "fa-solid", "fa-trash"], [1, "modal-overlay", 3, "click"], [1, "modal-header"], [1, "modal-close", 3, "click"], [1, "modal-body"], [1, "form-group"], ["type", "text", "placeholder", "Enter list name", 1, "form-input", 3, "ngModelChange", "ngModel"], ["placeholder", "Optional description", "rows", "3", 1, "form-input", 3, "ngModelChange", "ngModel"], [1, "form-input", 3, "ngModelChange", "ngModel"], [3, "ngValue"], [1, "modal-footer"], [1, "btn-primary", 3, "click", "disabled"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "btn-secondary", 3, "click", "disabled"], [1, "custom-select-wrapper"], ["type", "text", "placeholder", "Search and select an entity", 1, "form-input", 3, "ngModelChange", "focus", "ngModel"], ["type", "text", "disabled", "", 1, "form-input", 3, "value"], [1, "warning-text"], [1, "btn-danger", 3, "click", "disabled"], [3, "complete", "cancel", "config", "visible"], [1, "entity-dropdown-portal"], [1, "entity-dropdown-content"], [1, "dropdown-item"], [1, "dropdown-empty"], [1, "dropdown-item", 3, "mousedown"]], template: function ListsBrowseResource_Template(rf, ctx) { if (rf & 1) {
+        } }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 45, vars: 22, consts: [["categoryNodeTemplate", ""], ["entityInput", ""], [1, "lists-browse-container"], [1, "browse-header"], [1, "header-row"], [1, "header-title"], [1, "fa-solid", "fa-list-check"], [1, "btn-create", 3, "click"], [1, "fa-solid", "fa-plus"], [1, "header-actions"], [1, "search-box"], [1, "fa-solid", "fa-search"], ["type", "text", "placeholder", "Search lists...", 3, "ngModelChange", "ngModel"], [1, "clear-search"], [1, "filter-group"], ["title", "Filter by owner", 1, "filter-select", 3, "ngModelChange", "ngModel"], [3, "value"], ["title", "Filter by entity", 1, "filter-select", 3, "ngModelChange", "ngModel"], [1, "view-toggle-group"], ["title", "Table view", 1, "view-toggle", 3, "click"], [1, "fa-solid", "fa-table-list"], ["title", "Card view", 1, "view-toggle", 3, "click"], [1, "fa-solid", "fa-grip"], ["title", "Category view", 1, "view-toggle", 3, "click"], [1, "fa-solid", "fa-folder-tree"], [1, "loading-container"], [1, "empty-state"], [1, "empty-state", "search-empty"], [1, "browse-content"], [1, "context-menu-overlay"], [1, "context-menu", 3, "top", "left"], [1, "modal-overlay"], [1, "modal-dialog"], [1, "modal-dialog", "confirm-dialog"], [3, "config", "visible"], [1, "entity-dropdown-portal", 3, "top", "left", "width", "dropdown-above"], [1, "clear-search", 3, "click"], [1, "fa-solid", "fa-times"], ["text", "Loading lists...", "size", "medium"], [1, "empty-state-icon-wrapper"], [1, "icon-bg"], [1, "empty-state-features"], [1, "feature-item"], [1, "fa-solid", "fa-check-circle"], [1, "btn-create-large", 3, "click"], [1, "empty-state-icon-wrapper", "search"], [1, "fa-solid", "fa-filter-circle-xmark"], [1, "empty-hint"], [1, "btn-clear", 3, "click"], [1, "results-header"], [1, "result-count"], [1, "sort-options"], [1, "filter-select", "sort-select", 3, "ngModelChange", "ngModel"], [1, "lists-table"], ["role", "list", "aria-label", "Lists", 1, "lists-grid"], [1, "category-tree"], ["role", "grid", "aria-label", "Lists table"], ["scope", "col", 1, "col-name"], ["scope", "col", 1, "col-entity"], ["scope", "col", 1, "col-items"], ["scope", "col", 1, "col-sharing"], ["scope", "col", 1, "col-owner"], ["scope", "col", 1, "col-updated"], ["scope", "col", 1, "col-actions"], [1, "sr-only"], ["tabindex", "0", "role", "row", 1, "list-row"], ["tabindex", "0", "role", "row", 1, "list-row", 3, "click", "keydown.enter"], ["role", "gridcell", 1, "col-name"], [1, "name-cell"], ["aria-hidden", "true", 1, "list-icon"], [1, "name-content"], [1, "list-name"], [1, "list-desc"], ["role", "gridcell", 1, "col-entity"], [1, "entity-badge"], ["role", "gridcell", 1, "col-items"], ["role", "gridcell", 1, "col-sharing"], [1, "sharing-private"], ["role", "gridcell", 1, "col-owner"], [1, "owner-name"], ["role", "gridcell", 1, "col-updated"], ["role", "gridcell", 1, "col-actions"], ["mjButton", "", "variant", "flat", "size", "sm", "title", "More options"], [1, "sharing-indicator"], [1, "fa-solid", "fa-share-nodes"], [1, "share-count"], [1, "fa-solid", "fa-lock"], ["mjButton", "", "variant", "flat", "size", "sm", "title", "More options", 3, "click"], ["aria-hidden", "true", 1, "fa-solid", "fa-ellipsis-v"], ["tabindex", "0", "role", "listitem", 1, "list-card"], ["tabindex", "0", "role", "listitem", 1, "list-card", 3, "click", "keydown.enter"], [1, "card-header"], ["aria-hidden", "true", 1, "card-icon"], [1, "card-menu"], [1, "card-body"], [1, "card-title"], [1, "card-description"], [1, "card-meta"], [1, "meta-item"], [1, "fa-solid", "fa-database"], [1, "fa-solid", "fa-hashtag"], [1, "card-footer"], [1, "owner-tag"], [1, "fa-solid", "fa-user"], [1, "card-footer-right"], [1, "date-info"], [1, "menu-btn", 3, "click"], [1, "sharing-badge", 3, "title"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [1, "category-section"], [1, "category-header"], [1, "category-header", "uncategorized"], ["role", "list", 1, "category-lists"], [1, "category-header", 3, "click"], [1, "fa-solid", "fa-folder"], [1, "category-name"], [1, "category-count"], [1, "category-header", "uncategorized", 3, "click"], [1, "fa-solid", "fa-inbox"], ["tabindex", "0", "role", "listitem", 1, "list-row", "hierarchy-row"], ["tabindex", "0", "role", "listitem", 1, "list-row", "hierarchy-row", 3, "click", "keydown.enter"], [1, "list-info"], [1, "list-meta"], [1, "list-actions"], ["mjButton", "", "variant", "flat", "size", "sm", 3, "click"], [1, "context-menu-overlay", 3, "click"], [1, "context-menu"], [1, "menu-item", 3, "click"], [1, "fa-solid", "fa-pen"], [1, "fa-solid", "fa-copy"], [1, "menu-divider"], [1, "menu-item", "danger", 3, "click"], [1, "fa-solid", "fa-trash"], [1, "modal-overlay", 3, "click"], [1, "modal-header"], [1, "modal-close", 3, "click"], [1, "modal-body"], [1, "form-group"], ["type", "text", "placeholder", "Enter list name", 1, "form-input", 3, "ngModelChange", "ngModel"], ["placeholder", "Optional description", "rows", "3", 1, "form-input", 3, "ngModelChange", "ngModel"], [1, "form-input", 3, "ngModelChange", "ngModel"], [3, "ngValue"], [1, "modal-footer"], [1, "btn-primary", 3, "click", "disabled"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "btn-secondary", 3, "click", "disabled"], [1, "custom-select-wrapper"], ["type", "text", "placeholder", "Search and select an entity", 1, "form-input", 3, "ngModelChange", "focus", "ngModel"], ["type", "text", "disabled", "", 1, "form-input", 3, "value"], [1, "warning-text"], [1, "btn-danger", 3, "click", "disabled"], [3, "complete", "cancel", "config", "visible"], [1, "entity-dropdown-portal"], [1, "entity-dropdown-content"], [1, "dropdown-item"], [1, "dropdown-empty"], [1, "dropdown-item", 3, "mousedown"]], template: function ListsBrowseResource_Template(rf, ctx) { if (rf & 1) {
             const _r1 = i0.ɵɵgetCurrentView();
             i0.ɵɵelementStart(0, "div", 2)(1, "div", 3)(2, "div", 4)(3, "div", 5);
             i0.ɵɵelement(4, "i", 6);
@@ -1501,7 +1502,7 @@ let ListsBrowseResource = class ListsBrowseResource extends BaseResourceComponen
             i0.ɵɵconditional(ctx.shareDialogConfig ? 43 : -1);
             i0.ɵɵadvance();
             i0.ɵɵconditional(ctx.showEntityDropdown && !ctx.editingList ? 44 : -1);
-        } }, dependencies: [i4.NgTemplateOutlet, i5.NgSelectOption, i5.ɵNgSelectMultipleOption, i5.DefaultValueAccessor, i5.SelectControlValueAccessor, i5.NgControlStatus, i5.NgModel, i6.LoadingComponent, i3.ListShareDialogComponent], styles: ["\n    :host {\n      display: flex;\n      flex-direction: column;\n      width: 100%;\n      height: 100%;\n    }\n\n    .lists-browse-container {\n      display: flex;\n      flex-direction: column;\n      height: 100%;\n      background: var(--mj-bg-surface);\n      overflow: hidden;\n    }\n\n    /* Header */\n    .browse-header {\n      display: flex;\n      flex-direction: column;\n      gap: 12px;\n      padding: 16px 24px;\n      background: var(--mj-bg-surface-card);\n      border-bottom: 1px solid var(--mj-border-default);\n      flex-shrink: 0;\n    }\n\n    .header-row {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    .header-title {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .header-title i {\n      font-size: 24px;\n      color: var(--mj-brand-primary);\n    }\n\n    .header-title h2 {\n      margin: 0;\n      font-size: 20px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n    }\n\n    .header-actions {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      flex-wrap: wrap;\n    }\n\n    .search-box {\n      position: relative;\n      display: flex;\n      align-items: center;\n      flex: 1;\n      min-width: 200px;\n      max-width: 300px;\n    }\n\n    .search-box i.fa-search {\n      position: absolute;\n      left: 12px;\n      color: var(--mj-text-muted);\n    }\n\n    .search-box input {\n      padding: 8px 36px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 20px;\n      font-size: 14px;\n      width: 100%;\n      transition: border-color 0.2s, box-shadow 0.2s;\n    }\n\n    .search-box input:focus {\n      outline: none;\n      border-color: var(--mj-brand-primary);\n      box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n    }\n\n    .clear-search {\n      position: absolute;\n      right: 8px;\n      background: none;\n      border: none;\n      color: var(--mj-text-muted);\n      cursor: pointer;\n    }\n\n    .filter-group {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .filter-group label {\n      font-size: 13px;\n      color: var(--mj-text-secondary);\n    }\n\n    .filter-select {\n      padding: 8px 12px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      font-size: 14px;\n      background: var(--mj-bg-surface-card);\n      cursor: pointer;\n      min-width: 120px;\n    }\n\n    .filter-select:focus {\n      outline: none;\n      border-color: var(--mj-brand-primary);\n      box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n    }\n\n    .sort-select {\n      min-width: 140px;\n    }\n\n    .view-toggle-group {\n      display: flex;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      overflow: hidden;\n    }\n\n    .view-toggle {\n      padding: 8px 12px;\n      background: var(--mj-bg-surface-card);\n      border: none;\n      border-right: 1px solid var(--mj-border-default);\n      color: var(--mj-text-secondary);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .view-toggle:last-child {\n      border-right: none;\n    }\n\n    .view-toggle:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .view-toggle.active {\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n    }\n\n    .btn-create {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      padding: 8px 16px;\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      border: none;\n      border-radius: 6px;\n      font-size: 14px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .btn-create:hover {\n      background: var(--mj-brand-primary-hover);\n    }\n\n    /* Loading */\n    .loading-container {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      flex: 1;\n    }\n\n    /* Empty State */\n    .empty-state {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      flex: 1;\n      padding: 48px 40px;\n      text-align: center;\n      max-width: 480px;\n      margin: 0 auto;\n    }\n\n    .empty-state-icon-wrapper {\n      position: relative;\n      margin-bottom: 24px;\n    }\n\n    .empty-state-icon-wrapper .icon-bg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n      width: 120px;\n      height: 120px;\n      border-radius: 50%;\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n    }\n\n    .empty-state-icon-wrapper > i {\n      position: relative;\n      font-size: 56px;\n      color: var(--mj-brand-primary);\n      z-index: 1;\n    }\n\n    .empty-state-icon-wrapper.search > i {\n      font-size: 48px;\n      color: var(--mj-text-disabled);\n    }\n\n    .empty-state h3 {\n      margin: 0 0 12px;\n      font-size: 22px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n    }\n\n    .empty-state p {\n      margin: 0 0 8px;\n      color: var(--mj-text-secondary);\n      font-size: 15px;\n      line-height: 1.5;\n    }\n\n    .empty-state p:last-of-type {\n      margin-bottom: 24px;\n    }\n\n    .empty-hint {\n      color: var(--mj-text-muted) !important;\n      font-size: 13px !important;\n    }\n\n    .empty-state-features {\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n      margin-bottom: 28px;\n      text-align: left;\n    }\n\n    .feature-item {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      font-size: 14px;\n      color: var(--mj-text-secondary);\n    }\n\n    .feature-item i {\n      font-size: 14px !important;\n      color: var(--mj-status-success) !important;\n    }\n\n    .btn-create-large {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      padding: 14px 28px;\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      border: none;\n      border-radius: 8px;\n      font-size: 15px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: all 0.2s;\n      box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-brand-primary) 30%, transparent);\n    }\n\n    .btn-create-large:hover {\n      background: var(--mj-brand-primary-hover);\n      transform: translateY(-1px);\n      box-shadow: 0 4px 12px color-mix(in srgb, var(--mj-brand-primary) 40%, transparent);\n    }\n\n    .btn-clear {\n      padding: 10px 20px;\n      background: var(--mj-bg-surface-sunken);\n      border: none;\n      border-radius: 6px;\n      color: var(--mj-text-secondary);\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .btn-clear:hover {\n      background: var(--mj-border-default);\n    }\n\n    /* Content */\n    .browse-content {\n      flex: 1;\n      overflow-y: auto;\n      padding: 16px 24px;\n    }\n\n    .results-header {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      margin-bottom: 16px;\n    }\n\n    .result-count {\n      font-size: 14px;\n      color: var(--mj-text-secondary);\n    }\n\n    .sort-options {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .sort-options label {\n      font-size: 13px;\n      color: var(--mj-text-secondary);\n    }\n\n    /* Table View */\n    .lists-table {\n      background: var(--mj-bg-surface-card);\n      border-radius: 8px;\n      overflow: hidden;\n      box-shadow: var(--mj-shadow-sm);\n    }\n\n    .lists-table table {\n      width: 100%;\n      border-collapse: collapse;\n    }\n\n    .lists-table th {\n      text-align: left;\n      padding: 12px 16px;\n      font-size: 12px;\n      font-weight: 600;\n      color: var(--mj-text-secondary);\n      text-transform: uppercase;\n      letter-spacing: 0.5px;\n      background: var(--mj-bg-surface-sunken);\n      border-bottom: 1px solid var(--mj-border-default);\n    }\n\n    .lists-table td {\n      padding: 12px 16px;\n      border-bottom: 1px solid var(--mj-border-default);\n      font-size: 14px;\n      color: var(--mj-text-primary);\n    }\n\n    .list-row {\n      cursor: pointer;\n      transition: background 0.15s;\n      outline: none;\n    }\n\n    .list-row:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .list-row:focus {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n    }\n\n    .list-row:focus-visible {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n      box-shadow: inset 3px 0 0 var(--mj-brand-primary);\n    }\n\n    .list-row:last-child td {\n      border-bottom: none;\n    }\n\n    .sr-only {\n      position: absolute;\n      width: 1px;\n      height: 1px;\n      padding: 0;\n      margin: -1px;\n      overflow: hidden;\n      clip: rect(0, 0, 0, 0);\n      white-space: nowrap;\n      border: 0;\n    }\n\n    .col-name { width: 30%; }\n    .col-entity { width: 15%; }\n    .col-items { width: 8%; text-align: center; }\n    .col-sharing { width: 8%; text-align: center; }\n    .col-owner { width: 14%; }\n    .col-updated { width: 15%; }\n    .col-actions { width: 10%; text-align: right; }\n\n    /* Sharing indicators */\n    .sharing-indicator {\n      display: inline-flex;\n      align-items: center;\n      gap: 4px;\n      color: var(--mj-brand-primary);\n      font-size: 13px;\n    }\n\n    .sharing-indicator i {\n      font-size: 14px;\n    }\n\n    .share-count {\n      font-weight: 500;\n    }\n\n    .sharing-private {\n      color: var(--mj-text-muted);\n      font-size: 13px;\n    }\n\n    .sharing-badge {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      width: 24px;\n      height: 24px;\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n      border-radius: 50%;\n      color: var(--mj-brand-primary);\n      font-size: 11px;\n    }\n\n    .card-footer-right {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .name-cell {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .list-icon {\n      width: 36px;\n      height: 36px;\n      border-radius: 6px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: var(--mj-text-inverse);\n      font-size: 14px;\n      flex-shrink: 0;\n    }\n\n    .name-content {\n      display: flex;\n      flex-direction: column;\n      min-width: 0;\n    }\n\n    .list-name {\n      font-weight: 500;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .list-desc {\n      font-size: 12px;\n      color: var(--mj-text-muted);\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .entity-badge {\n      display: inline-block;\n      padding: 2px 8px;\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n      border-radius: 4px;\n      font-size: 12px;\n      color: var(--mj-brand-primary-hover);\n    }\n\n    .owner-name {\n      color: var(--mj-text-secondary);\n    }\n\n    .owner-name.is-me {\n      color: var(--mj-brand-primary);\n      font-weight: 500;\n    }\n\n    .action-btn {\n      background: none;\n      border: none;\n      padding: 6px 10px;\n      color: var(--mj-text-muted);\n      cursor: pointer;\n      border-radius: 4px;\n      transition: all 0.15s;\n    }\n\n    .action-btn:hover {\n      background: var(--mj-border-default);\n      color: var(--mj-text-secondary);\n    }\n\n    /* Card View */\n    .lists-grid {\n      display: grid;\n      grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n      gap: 16px;\n    }\n\n    .list-card {\n      background: var(--mj-bg-surface-card);\n      border-radius: 8px;\n      box-shadow: var(--mj-shadow-sm);\n      overflow: hidden;\n      cursor: pointer;\n      transition: transform 0.2s, box-shadow 0.2s, outline 0.1s;\n      outline: 2px solid transparent;\n    }\n\n    .list-card:hover {\n      transform: translateY(-2px);\n      box-shadow: var(--mj-shadow-md);\n    }\n\n    .list-card:focus {\n      outline: 2px solid var(--mj-brand-primary);\n      outline-offset: 2px;\n    }\n\n    .list-card:focus:not(:focus-visible) {\n      outline: none;\n    }\n\n    .list-card:focus-visible {\n      outline: 2px solid var(--mj-brand-primary);\n      outline-offset: 2px;\n    }\n\n    .card-header {\n      display: flex;\n      justify-content: space-between;\n      align-items: flex-start;\n      padding: 16px 16px 0;\n    }\n\n    .card-icon {\n      width: 40px;\n      height: 40px;\n      border-radius: 8px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: var(--mj-text-inverse);\n      font-size: 18px;\n    }\n\n    .menu-btn {\n      background: none;\n      border: none;\n      padding: 4px 8px;\n      color: var(--mj-text-muted);\n      cursor: pointer;\n      border-radius: 4px;\n    }\n\n    .menu-btn:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-secondary);\n    }\n\n    .card-body {\n      padding: 12px 16px;\n    }\n\n    .card-title {\n      margin: 0 0 4px;\n      font-size: 16px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n    }\n\n    .card-description {\n      margin: 0 0 12px;\n      font-size: 13px;\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    .card-meta {\n      display: flex;\n      gap: 16px;\n    }\n\n    .meta-item {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      font-size: 12px;\n      color: var(--mj-text-muted);\n    }\n\n    .card-footer {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 12px 16px;\n      border-top: 1px solid var(--mj-border-default);\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .owner-tag {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n      font-size: 12px;\n      color: var(--mj-text-secondary);\n    }\n\n    .owner-tag.is-me {\n      color: var(--mj-brand-primary);\n    }\n\n    .date-info {\n      font-size: 12px;\n      color: var(--mj-text-muted);\n    }\n\n    /* Hierarchy View */\n    .category-tree {\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n    }\n\n    .category-section {\n      background: var(--mj-bg-surface-card);\n      border-radius: 8px;\n      overflow: hidden;\n    }\n\n    .category-header {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      padding: 12px 16px;\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .category-header:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .category-header i:first-child {\n      width: 16px;\n      text-align: center;\n      color: var(--mj-text-muted);\n    }\n\n    .category-header .fa-folder,\n    .category-header .fa-folder-open {\n      color: var(--mj-status-warning);\n    }\n\n    .category-header.uncategorized .fa-inbox {\n      color: var(--mj-text-muted);\n    }\n\n    .category-name {\n      flex: 1;\n      font-weight: 500;\n      color: var(--mj-text-primary);\n    }\n\n    .category-count {\n      font-size: 12px;\n      color: var(--mj-text-muted);\n      background: var(--mj-bg-surface-sunken);\n      padding: 2px 8px;\n      border-radius: 10px;\n    }\n\n    .category-lists {\n      border-top: 1px solid var(--mj-border-default);\n    }\n\n    .hierarchy-row {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 12px 16px 12px 40px;\n      cursor: pointer;\n      transition: background 0.2s;\n      outline: none;\n    }\n\n    .hierarchy-row:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .hierarchy-row:focus {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n    }\n\n    .hierarchy-row:focus-visible {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n      box-shadow: inset 3px 0 0 var(--mj-brand-primary);\n    }\n\n    .list-info {\n      flex: 1;\n      min-width: 0;\n    }\n\n    .list-meta {\n      font-size: 12px;\n      color: var(--mj-text-muted);\n    }\n\n    .list-actions {\n      display: flex;\n      gap: 4px;\n      opacity: 0;\n      transition: opacity 0.2s;\n    }\n\n    .hierarchy-row:hover .list-actions {\n      opacity: 1;\n    }\n\n    /* Context Menu */\n    .context-menu-overlay {\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      z-index: 999;\n    }\n\n    .context-menu {\n      position: fixed;\n      background: var(--mj-bg-surface-card);\n      border-radius: 8px;\n      box-shadow: var(--mj-shadow-md);\n      min-width: 160px;\n      padding: 4px 0;\n      z-index: 1000;\n    }\n\n    .menu-item {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      width: 100%;\n      padding: 10px 16px;\n      background: none;\n      border: none;\n      text-align: left;\n      font-size: 14px;\n      color: var(--mj-text-primary);\n      cursor: pointer;\n      transition: background 0.15s;\n    }\n\n    .menu-item:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .menu-item.danger {\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n    }\n\n    .menu-divider {\n      height: 1px;\n      background: var(--mj-border-default);\n      margin: 4px 0;\n    }\n\n    /* Modal Styles */\n    .modal-overlay {\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      background: var(--mj-bg-overlay);\n      z-index: 1000;\n    }\n\n    .modal-dialog {\n      position: fixed;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n      background: var(--mj-bg-surface-card);\n      border-radius: 12px;\n      box-shadow: var(--mj-shadow-lg);\n      width: 500px;\n      max-width: 90vw;\n      max-height: 90vh;\n      overflow: hidden;\n      z-index: 1001;\n    }\n\n    .confirm-dialog {\n      width: 400px;\n    }\n\n    .modal-header {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 16px 20px;\n      border-bottom: 1px solid var(--mj-border-default);\n    }\n\n    .modal-header h3 {\n      margin: 0;\n      font-size: 18px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n    }\n\n    .modal-close {\n      background: none;\n      border: none;\n      padding: 4px 8px;\n      color: var(--mj-text-muted);\n      cursor: pointer;\n      border-radius: 4px;\n    }\n\n    .modal-close:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-secondary);\n    }\n\n    .modal-body {\n      padding: 20px;\n      max-height: 60vh;\n      overflow-y: auto;\n    }\n\n    .modal-body p {\n      margin: 0 0 8px;\n      color: var(--mj-text-primary);\n    }\n\n    .warning-text {\n      color: var(--mj-status-error) !important;\n      font-size: 13px;\n    }\n\n    .modal-footer {\n      display: flex;\n      gap: 12px;\n      padding: 16px 20px;\n      border-top: 1px solid var(--mj-border-default);\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .btn-primary {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      padding: 10px 20px;\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      border: none;\n      border-radius: 6px;\n      font-size: 14px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .btn-primary:hover:not(:disabled) {\n      background: var(--mj-brand-primary-hover);\n    }\n\n    .btn-primary:disabled {\n      opacity: 0.6;\n      cursor: not-allowed;\n    }\n\n    .btn-secondary {\n      padding: 10px 20px;\n      background: var(--mj-bg-surface-card);\n      color: var(--mj-text-secondary);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      font-size: 14px;\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .btn-secondary:hover:not(:disabled) {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .btn-danger {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      padding: 10px 20px;\n      background: var(--mj-status-error);\n      color: var(--mj-text-inverse);\n      border: none;\n      border-radius: 6px;\n      font-size: 14px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .btn-danger:hover:not(:disabled) {\n      background: color-mix(in srgb, var(--mj-status-error) 85%, black);\n    }\n\n    /* Form Styles */\n    .form-group {\n      margin-bottom: 16px;\n    }\n\n    .form-group:last-child {\n      margin-bottom: 0;\n    }\n\n    .form-group label {\n      display: block;\n      margin-bottom: 6px;\n      font-size: 13px;\n      font-weight: 500;\n      color: var(--mj-text-secondary);\n    }\n\n    .form-input {\n      width: 100%;\n      padding: 10px 12px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      font-size: 14px;\n      transition: border-color 0.2s, box-shadow 0.2s;\n      box-sizing: border-box;\n    }\n\n    .form-input:focus {\n      outline: none;\n      border-color: var(--mj-brand-primary);\n      box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n    }\n\n    .form-input:disabled {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-muted);\n    }\n\n    textarea.form-input {\n      resize: vertical;\n      min-height: 80px;\n    }\n\n    select.form-input {\n      cursor: pointer;\n    }\n\n    .custom-select-wrapper {\n      position: relative;\n    }\n\n    /* Portal Dropdown */\n    .entity-dropdown-portal {\n      position: fixed;\n      z-index: 10002;\n    }\n\n    .entity-dropdown-content {\n      max-height: 200px;\n      overflow-y: auto;\n      background: var(--mj-bg-surface-card);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      box-shadow: var(--mj-shadow-md);\n    }\n\n    .entity-dropdown-content.open-above {\n      position: absolute;\n      bottom: 0;\n    }\n\n    .dropdown-item {\n      padding: 10px 12px;\n      cursor: pointer;\n      transition: background 0.15s;\n      font-size: 14px;\n      color: var(--mj-text-primary);\n    }\n\n    .dropdown-item:hover {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n    }\n\n    .dropdown-item:first-child {\n      border-radius: 6px 6px 0 0;\n    }\n\n    .dropdown-item:last-child {\n      border-radius: 0 0 6px 6px;\n    }\n\n    .dropdown-empty {\n      padding: 10px 12px;\n      color: var(--mj-text-muted);\n      font-style: italic;\n    }\n\n    /* Responsive */\n    @media (max-width: 768px) {\n      .header-row {\n        flex-direction: column;\n        gap: 12px;\n        align-items: stretch;\n      }\n\n      .btn-create {\n        width: 100%;\n        justify-content: center;\n      }\n\n      .header-actions {\n        flex-direction: column;\n        align-items: stretch;\n      }\n\n      .search-box {\n        max-width: none;\n      }\n\n      .filter-group {\n        width: 100%;\n      }\n\n      .filter-select {\n        flex: 1;\n        width: 100%;\n      }\n\n      .view-toggle-group {\n        justify-content: center;\n      }\n\n      .lists-table {\n        overflow-x: auto;\n      }\n\n      .col-entity, .col-items, .col-updated {\n        display: none;\n      }\n\n      .lists-grid {\n        grid-template-columns: 1fr;\n      }\n\n      .modal-dialog {\n        width: 95vw;\n      }\n    }\n  "], encapsulation: 2 });
+        } }, dependencies: [i4.NgTemplateOutlet, i5.NgSelectOption, i5.ɵNgSelectMultipleOption, i5.DefaultValueAccessor, i5.SelectControlValueAccessor, i5.NgControlStatus, i5.NgModel, i6.MJButtonDirective, i7.LoadingComponent, i3.ListShareDialogComponent], styles: ["\n    :host {\n      display: flex;\n      flex-direction: column;\n      width: 100%;\n      height: 100%;\n    }\n\n    .lists-browse-container {\n      display: flex;\n      flex-direction: column;\n      height: 100%;\n      background: var(--mj-bg-surface);\n      overflow: hidden;\n    }\n\n    /* Header */\n    .browse-header {\n      display: flex;\n      flex-direction: column;\n      gap: 12px;\n      padding: 16px 24px;\n      background: var(--mj-bg-surface-card);\n      border-bottom: 1px solid var(--mj-border-default);\n      flex-shrink: 0;\n    }\n\n    .header-row {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n    }\n\n    .header-title {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .header-title i {\n      font-size: 24px;\n      color: var(--mj-brand-primary);\n    }\n\n    .header-title h2 {\n      margin: 0;\n      font-size: 20px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n    }\n\n    .header-actions {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      flex-wrap: wrap;\n    }\n\n    .search-box {\n      position: relative;\n      display: flex;\n      align-items: center;\n      flex: 1;\n      min-width: 200px;\n      max-width: 300px;\n    }\n\n    .search-box i.fa-search {\n      position: absolute;\n      left: 12px;\n      color: var(--mj-text-muted);\n    }\n\n    .search-box input {\n      padding: 8px 36px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 20px;\n      font-size: 14px;\n      width: 100%;\n      transition: border-color 0.2s, box-shadow 0.2s;\n    }\n\n    .search-box input:focus {\n      outline: none;\n      border-color: var(--mj-brand-primary);\n      box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n    }\n\n    .clear-search {\n      position: absolute;\n      right: 8px;\n      background: none;\n      border: none;\n      color: var(--mj-text-muted);\n      cursor: pointer;\n    }\n\n    .filter-group {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .filter-group label {\n      font-size: 13px;\n      color: var(--mj-text-secondary);\n    }\n\n    .filter-select {\n      padding: 8px 12px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      font-size: 14px;\n      background: var(--mj-bg-surface-card);\n      cursor: pointer;\n      min-width: 120px;\n    }\n\n    .filter-select:focus {\n      outline: none;\n      border-color: var(--mj-brand-primary);\n      box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n    }\n\n    .sort-select {\n      min-width: 140px;\n    }\n\n    .view-toggle-group {\n      display: flex;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      overflow: hidden;\n    }\n\n    .view-toggle {\n      padding: 8px 12px;\n      background: var(--mj-bg-surface-card);\n      border: none;\n      border-right: 1px solid var(--mj-border-default);\n      color: var(--mj-text-secondary);\n      cursor: pointer;\n      transition: all 0.2s;\n    }\n\n    .view-toggle:last-child {\n      border-right: none;\n    }\n\n    .view-toggle:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .view-toggle.active {\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n    }\n\n    .btn-create {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      padding: 8px 16px;\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      border: none;\n      border-radius: 6px;\n      font-size: 14px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .btn-create:hover {\n      background: var(--mj-brand-primary-hover);\n    }\n\n    /* Loading */\n    .loading-container {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      flex: 1;\n    }\n\n    /* Empty State */\n    .empty-state {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      flex: 1;\n      padding: 48px 40px;\n      text-align: center;\n      max-width: 480px;\n      margin: 0 auto;\n    }\n\n    .empty-state-icon-wrapper {\n      position: relative;\n      margin-bottom: 24px;\n    }\n\n    .empty-state-icon-wrapper .icon-bg {\n      position: absolute;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n      width: 120px;\n      height: 120px;\n      border-radius: 50%;\n      background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n    }\n\n    .empty-state-icon-wrapper > i {\n      position: relative;\n      font-size: 56px;\n      color: var(--mj-brand-primary);\n      z-index: 1;\n    }\n\n    .empty-state-icon-wrapper.search > i {\n      font-size: 48px;\n      color: var(--mj-text-disabled);\n    }\n\n    .empty-state h3 {\n      margin: 0 0 12px;\n      font-size: 22px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n    }\n\n    .empty-state p {\n      margin: 0 0 8px;\n      color: var(--mj-text-secondary);\n      font-size: 15px;\n      line-height: 1.5;\n    }\n\n    .empty-state p:last-of-type {\n      margin-bottom: 24px;\n    }\n\n    .empty-hint {\n      color: var(--mj-text-muted) !important;\n      font-size: 13px !important;\n    }\n\n    .empty-state-features {\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n      margin-bottom: 28px;\n      text-align: left;\n    }\n\n    .feature-item {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      font-size: 14px;\n      color: var(--mj-text-secondary);\n    }\n\n    .feature-item i {\n      font-size: 14px !important;\n      color: var(--mj-status-success) !important;\n    }\n\n    .btn-create-large {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      padding: 14px 28px;\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      border: none;\n      border-radius: 8px;\n      font-size: 15px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: all 0.2s;\n      box-shadow: 0 2px 8px color-mix(in srgb, var(--mj-brand-primary) 30%, transparent);\n    }\n\n    .btn-create-large:hover {\n      background: var(--mj-brand-primary-hover);\n      transform: translateY(-1px);\n      box-shadow: 0 4px 12px color-mix(in srgb, var(--mj-brand-primary) 40%, transparent);\n    }\n\n    .btn-clear {\n      padding: 10px 20px;\n      background: var(--mj-bg-surface-sunken);\n      border: none;\n      border-radius: 6px;\n      color: var(--mj-text-secondary);\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .btn-clear:hover {\n      background: var(--mj-border-default);\n    }\n\n    /* Content */\n    .browse-content {\n      flex: 1;\n      overflow-y: auto;\n      padding: 16px 24px;\n    }\n\n    .results-header {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      margin-bottom: 16px;\n    }\n\n    .result-count {\n      font-size: 14px;\n      color: var(--mj-text-secondary);\n    }\n\n    .sort-options {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .sort-options label {\n      font-size: 13px;\n      color: var(--mj-text-secondary);\n    }\n\n    /* Table View */\n    .lists-table {\n      background: var(--mj-bg-surface-card);\n      border-radius: 8px;\n      overflow: hidden;\n      box-shadow: var(--mj-shadow-sm);\n    }\n\n    .lists-table table {\n      width: 100%;\n      border-collapse: collapse;\n    }\n\n    .lists-table th {\n      text-align: left;\n      padding: 12px 16px;\n      font-size: 12px;\n      font-weight: 600;\n      color: var(--mj-text-secondary);\n      text-transform: uppercase;\n      letter-spacing: 0.5px;\n      background: var(--mj-bg-surface-sunken);\n      border-bottom: 1px solid var(--mj-border-default);\n    }\n\n    .lists-table td {\n      padding: 12px 16px;\n      border-bottom: 1px solid var(--mj-border-default);\n      font-size: 14px;\n      color: var(--mj-text-primary);\n    }\n\n    .list-row {\n      cursor: pointer;\n      transition: background 0.15s;\n      outline: none;\n    }\n\n    .list-row:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .list-row:focus {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n    }\n\n    .list-row:focus-visible {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n      box-shadow: inset 3px 0 0 var(--mj-brand-primary);\n    }\n\n    .list-row:last-child td {\n      border-bottom: none;\n    }\n\n    .sr-only {\n      position: absolute;\n      width: 1px;\n      height: 1px;\n      padding: 0;\n      margin: -1px;\n      overflow: hidden;\n      clip: rect(0, 0, 0, 0);\n      white-space: nowrap;\n      border: 0;\n    }\n\n    .col-name { width: 30%; }\n    .col-entity { width: 15%; }\n    .col-items { width: 8%; text-align: center; }\n    .col-sharing { width: 8%; text-align: center; }\n    .col-owner { width: 14%; }\n    .col-updated { width: 15%; }\n    .col-actions { width: 10%; text-align: right; }\n\n    /* Sharing indicators */\n    .sharing-indicator {\n      display: inline-flex;\n      align-items: center;\n      gap: 4px;\n      color: var(--mj-brand-primary);\n      font-size: 13px;\n    }\n\n    .sharing-indicator i {\n      font-size: 14px;\n    }\n\n    .share-count {\n      font-weight: 500;\n    }\n\n    .sharing-private {\n      color: var(--mj-text-muted);\n      font-size: 13px;\n    }\n\n    .sharing-badge {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      width: 24px;\n      height: 24px;\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n      border-radius: 50%;\n      color: var(--mj-brand-primary);\n      font-size: 11px;\n    }\n\n    .card-footer-right {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n    }\n\n    .name-cell {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n    }\n\n    .list-icon {\n      width: 36px;\n      height: 36px;\n      border-radius: 6px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: var(--mj-text-inverse);\n      font-size: 14px;\n      flex-shrink: 0;\n    }\n\n    .name-content {\n      display: flex;\n      flex-direction: column;\n      min-width: 0;\n    }\n\n    .list-name {\n      font-weight: 500;\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .list-desc {\n      font-size: 12px;\n      color: var(--mj-text-muted);\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n\n    .entity-badge {\n      display: inline-block;\n      padding: 2px 8px;\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n      border-radius: 4px;\n      font-size: 12px;\n      color: var(--mj-brand-primary-hover);\n    }\n\n    .owner-name {\n      color: var(--mj-text-secondary);\n    }\n\n    .owner-name.is-me {\n      color: var(--mj-brand-primary);\n      font-weight: 500;\n    }\n\n    .action-btn {\n      background: none;\n      border: none;\n      padding: 6px 10px;\n      color: var(--mj-text-muted);\n      cursor: pointer;\n      border-radius: 4px;\n      transition: all 0.15s;\n    }\n\n    .action-btn:hover {\n      background: var(--mj-border-default);\n      color: var(--mj-text-secondary);\n    }\n\n    /* Card View */\n    .lists-grid {\n      display: grid;\n      grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));\n      gap: 16px;\n    }\n\n    .list-card {\n      background: var(--mj-bg-surface-card);\n      border-radius: 8px;\n      box-shadow: var(--mj-shadow-sm);\n      overflow: hidden;\n      cursor: pointer;\n      transition: transform 0.2s, box-shadow 0.2s, outline 0.1s;\n      outline: 2px solid transparent;\n    }\n\n    .list-card:hover {\n      transform: translateY(-2px);\n      box-shadow: var(--mj-shadow-md);\n    }\n\n    .list-card:focus {\n      outline: 2px solid var(--mj-brand-primary);\n      outline-offset: 2px;\n    }\n\n    .list-card:focus:not(:focus-visible) {\n      outline: none;\n    }\n\n    .list-card:focus-visible {\n      outline: 2px solid var(--mj-brand-primary);\n      outline-offset: 2px;\n    }\n\n    .card-header {\n      display: flex;\n      justify-content: space-between;\n      align-items: flex-start;\n      padding: 16px 16px 0;\n    }\n\n    .card-icon {\n      width: 40px;\n      height: 40px;\n      border-radius: 8px;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: var(--mj-text-inverse);\n      font-size: 18px;\n    }\n\n    .menu-btn {\n      background: none;\n      border: none;\n      padding: 4px 8px;\n      color: var(--mj-text-muted);\n      cursor: pointer;\n      border-radius: 4px;\n    }\n\n    .menu-btn:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-secondary);\n    }\n\n    .card-body {\n      padding: 12px 16px;\n    }\n\n    .card-title {\n      margin: 0 0 4px;\n      font-size: 16px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n    }\n\n    .card-description {\n      margin: 0 0 12px;\n      font-size: 13px;\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    .card-meta {\n      display: flex;\n      gap: 16px;\n    }\n\n    .meta-item {\n      display: flex;\n      align-items: center;\n      gap: 6px;\n      font-size: 12px;\n      color: var(--mj-text-muted);\n    }\n\n    .card-footer {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 12px 16px;\n      border-top: 1px solid var(--mj-border-default);\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .owner-tag {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n      font-size: 12px;\n      color: var(--mj-text-secondary);\n    }\n\n    .owner-tag.is-me {\n      color: var(--mj-brand-primary);\n    }\n\n    .date-info {\n      font-size: 12px;\n      color: var(--mj-text-muted);\n    }\n\n    /* Hierarchy View */\n    .category-tree {\n      display: flex;\n      flex-direction: column;\n      gap: 8px;\n    }\n\n    .category-section {\n      background: var(--mj-bg-surface-card);\n      border-radius: 8px;\n      overflow: hidden;\n    }\n\n    .category-header {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      padding: 12px 16px;\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .category-header:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .category-header i:first-child {\n      width: 16px;\n      text-align: center;\n      color: var(--mj-text-muted);\n    }\n\n    .category-header .fa-folder,\n    .category-header .fa-folder-open {\n      color: var(--mj-status-warning);\n    }\n\n    .category-header.uncategorized .fa-inbox {\n      color: var(--mj-text-muted);\n    }\n\n    .category-name {\n      flex: 1;\n      font-weight: 500;\n      color: var(--mj-text-primary);\n    }\n\n    .category-count {\n      font-size: 12px;\n      color: var(--mj-text-muted);\n      background: var(--mj-bg-surface-sunken);\n      padding: 2px 8px;\n      border-radius: 10px;\n    }\n\n    .category-lists {\n      border-top: 1px solid var(--mj-border-default);\n    }\n\n    .hierarchy-row {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      padding: 12px 16px 12px 40px;\n      cursor: pointer;\n      transition: background 0.2s;\n      outline: none;\n    }\n\n    .hierarchy-row:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .hierarchy-row:focus {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n    }\n\n    .hierarchy-row:focus-visible {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n      box-shadow: inset 3px 0 0 var(--mj-brand-primary);\n    }\n\n    .list-info {\n      flex: 1;\n      min-width: 0;\n    }\n\n    .list-meta {\n      font-size: 12px;\n      color: var(--mj-text-muted);\n    }\n\n    .list-actions {\n      display: flex;\n      gap: 4px;\n      opacity: 0;\n      transition: opacity 0.2s;\n    }\n\n    .hierarchy-row:hover .list-actions {\n      opacity: 1;\n    }\n\n    /* Context Menu */\n    .context-menu-overlay {\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      z-index: 999;\n    }\n\n    .context-menu {\n      position: fixed;\n      background: var(--mj-bg-surface-card);\n      border-radius: 8px;\n      box-shadow: var(--mj-shadow-md);\n      min-width: 160px;\n      padding: 4px 0;\n      z-index: 1000;\n    }\n\n    .menu-item {\n      display: flex;\n      align-items: center;\n      gap: 10px;\n      width: 100%;\n      padding: 10px 16px;\n      background: none;\n      border: none;\n      text-align: left;\n      font-size: 14px;\n      color: var(--mj-text-primary);\n      cursor: pointer;\n      transition: background 0.15s;\n    }\n\n    .menu-item:hover {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .menu-item.danger {\n      color: var(--mj-status-error);\n    }\n\n    .menu-item.danger:hover {\n      background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n    }\n\n    .menu-divider {\n      height: 1px;\n      background: var(--mj-border-default);\n      margin: 4px 0;\n    }\n\n    /* Modal Styles */\n    .modal-overlay {\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      bottom: 0;\n      background: var(--mj-bg-overlay);\n      z-index: 1000;\n    }\n\n    .modal-dialog {\n      position: fixed;\n      top: 50%;\n      left: 50%;\n      transform: translate(-50%, -50%);\n      background: var(--mj-bg-surface-card);\n      border-radius: 12px;\n      box-shadow: var(--mj-shadow-lg);\n      width: 500px;\n      max-width: 90vw;\n      max-height: 90vh;\n      overflow: hidden;\n      z-index: 1001;\n    }\n\n    .confirm-dialog {\n      width: 400px;\n    }\n\n    .modal-header {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 16px 20px;\n      border-bottom: 1px solid var(--mj-border-default);\n    }\n\n    .modal-header h3 {\n      margin: 0;\n      font-size: 18px;\n      font-weight: 600;\n      color: var(--mj-text-primary);\n    }\n\n    .modal-close {\n      background: none;\n      border: none;\n      padding: 4px 8px;\n      color: var(--mj-text-muted);\n      cursor: pointer;\n      border-radius: 4px;\n    }\n\n    .modal-close:hover {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-secondary);\n    }\n\n    .modal-body {\n      padding: 20px;\n      max-height: 60vh;\n      overflow-y: auto;\n    }\n\n    .modal-body p {\n      margin: 0 0 8px;\n      color: var(--mj-text-primary);\n    }\n\n    .warning-text {\n      color: var(--mj-status-error) !important;\n      font-size: 13px;\n    }\n\n    .modal-footer {\n      display: flex;\n      gap: 12px;\n      padding: 16px 20px;\n      border-top: 1px solid var(--mj-border-default);\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .btn-primary {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      padding: 10px 20px;\n      background: var(--mj-brand-primary);\n      color: var(--mj-text-inverse);\n      border: none;\n      border-radius: 6px;\n      font-size: 14px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .btn-primary:hover:not(:disabled) {\n      background: var(--mj-brand-primary-hover);\n    }\n\n    .btn-primary:disabled {\n      opacity: 0.6;\n      cursor: not-allowed;\n    }\n\n    .btn-secondary {\n      padding: 10px 20px;\n      background: var(--mj-bg-surface-card);\n      color: var(--mj-text-secondary);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      font-size: 14px;\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .btn-secondary:hover:not(:disabled) {\n      background: var(--mj-bg-surface-sunken);\n    }\n\n    .btn-danger {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      padding: 10px 20px;\n      background: var(--mj-status-error);\n      color: var(--mj-text-inverse);\n      border: none;\n      border-radius: 6px;\n      font-size: 14px;\n      font-weight: 500;\n      cursor: pointer;\n      transition: background 0.2s;\n    }\n\n    .btn-danger:hover:not(:disabled) {\n      background: color-mix(in srgb, var(--mj-status-error) 85%, black);\n    }\n\n    /* Form Styles */\n    .form-group {\n      margin-bottom: 16px;\n    }\n\n    .form-group:last-child {\n      margin-bottom: 0;\n    }\n\n    .form-group label {\n      display: block;\n      margin-bottom: 6px;\n      font-size: 13px;\n      font-weight: 500;\n      color: var(--mj-text-secondary);\n    }\n\n    .form-input {\n      width: 100%;\n      padding: 10px 12px;\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      font-size: 14px;\n      transition: border-color 0.2s, box-shadow 0.2s;\n      box-sizing: border-box;\n    }\n\n    .form-input:focus {\n      outline: none;\n      border-color: var(--mj-brand-primary);\n      box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n    }\n\n    .form-input:disabled {\n      background: var(--mj-bg-surface-sunken);\n      color: var(--mj-text-muted);\n    }\n\n    textarea.form-input {\n      resize: vertical;\n      min-height: 80px;\n    }\n\n    select.form-input {\n      cursor: pointer;\n    }\n\n    .custom-select-wrapper {\n      position: relative;\n    }\n\n    /* Portal Dropdown */\n    .entity-dropdown-portal {\n      position: fixed;\n      z-index: 10002;\n    }\n\n    .entity-dropdown-content {\n      max-height: 200px;\n      overflow-y: auto;\n      background: var(--mj-bg-surface-card);\n      border: 1px solid var(--mj-border-default);\n      border-radius: 6px;\n      box-shadow: var(--mj-shadow-md);\n    }\n\n    .entity-dropdown-content.open-above {\n      position: absolute;\n      bottom: 0;\n    }\n\n    .dropdown-item {\n      padding: 10px 12px;\n      cursor: pointer;\n      transition: background 0.15s;\n      font-size: 14px;\n      color: var(--mj-text-primary);\n    }\n\n    .dropdown-item:hover {\n      background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n    }\n\n    .dropdown-item:first-child {\n      border-radius: 6px 6px 0 0;\n    }\n\n    .dropdown-item:last-child {\n      border-radius: 0 0 6px 6px;\n    }\n\n    .dropdown-empty {\n      padding: 10px 12px;\n      color: var(--mj-text-muted);\n      font-style: italic;\n    }\n\n    /* Responsive */\n    @media (max-width: 768px) {\n      .header-row {\n        flex-direction: column;\n        gap: 12px;\n        align-items: stretch;\n      }\n\n      .btn-create {\n        width: 100%;\n        justify-content: center;\n      }\n\n      .header-actions {\n        flex-direction: column;\n        align-items: stretch;\n      }\n\n      .search-box {\n        max-width: none;\n      }\n\n      .filter-group {\n        width: 100%;\n      }\n\n      .filter-select {\n        flex: 1;\n        width: 100%;\n      }\n\n      .view-toggle-group {\n        justify-content: center;\n      }\n\n      .lists-table {\n        overflow-x: auto;\n      }\n\n      .col-entity, .col-items, .col-updated {\n        display: none;\n      }\n\n      .lists-grid {\n        grid-template-columns: 1fr;\n      }\n\n      .modal-dialog {\n        width: 95vw;\n      }\n    }\n  "], encapsulation: 2 });
 };
 ListsBrowseResource = __decorate([
     RegisterClass(BaseResourceComponent, 'ListsBrowseResource')
@@ -1724,8 +1725,9 @@ export { ListsBrowseResource };
                       <td class="col-updated" role="gridcell">{{formatDate(item.list.__mj_UpdatedAt)}}</td>
                       <td class="col-actions" role="gridcell">
                         @if (item.isOwner) {
-                          <button
-                            class="action-btn"
+                          <button mjButton
+                            variant="flat"
+                            size="sm"
                             (click)="openListMenu($event, item)"
                             title="More options">
                             <i class="fa-solid fa-ellipsis-v" aria-hidden="true"></i>
@@ -1858,7 +1860,7 @@ export { ListsBrowseResource };
                   </div>
                   @if (item.isOwner) {
                     <div class="list-actions">
-                      <button class="action-btn" (click)="openListMenu($event, item)">
+                      <button mjButton variant="flat" size="sm" (click)="openListMenu($event, item)">
                         <i class="fa-solid fa-ellipsis-v" aria-hidden="true"></i>
                       </button>
                     </div>
@@ -2049,5 +2051,5 @@ export { ListsBrowseResource };
             type: HostListener,
             args: ['document:keydown.escape']
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ListsBrowseResource, { className: "ListsBrowseResource", filePath: "src/Lists/components/lists-browse-resource.component.ts", lineNumber: 1665 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ListsBrowseResource, { className: "ListsBrowseResource", filePath: "src/Lists/components/lists-browse-resource.component.ts", lineNumber: 1666 }); })();
 //# sourceMappingURL=lists-browse-resource.component.js.map