atomicuilibrary 0.0.1

package/dist/collection/components/list/list.js

@@ -0,0 +1,2167 @@
+import { h } from "@stencil/core";
+export class AppList {
+    el;
+    label = '';
+    size = 'md';
+    color = 'default';
+    variant = 'text';
+    dense = false;
+    dividers = false;
+    rounded = false;
+    elevated = false;
+    selectable = true;
+    multiSelect = false;
+    selectedValues = [];
+    maxHeight = '';
+    fullWidth = false;
+    padding = true;
+    subheader = '';
+    // New enhanced features
+    virtual = false;
+    itemHeight = 48;
+    items = [];
+    searchable = false;
+    searchPlaceholder = 'Search...';
+    searchQuery = '';
+    loading = false;
+    loadingText = 'Loading...';
+    skeleton = false;
+    emptyText = 'No items found';
+    showEmpty = true;
+    isDraggable = false;
+    paginated = false;
+    itemsPerPage = 10;
+    currentPage = 1;
+    checkboxSelection = false;
+    keyboardNavigation = true;
+    grouped = false;
+    groupBy = '';
+    // New Variants
+    flush = false;
+    horizontal = false;
+    numbered = false;
+    infinite = false;
+    loadMoreThreshold = 50;
+    stickyHeaders = false;
+    showBulkHeader = false;
+    bulkActions = []; // [{icon:'', label:'', action:''}]
+    grid = false;
+    gridCols = 3;
+    dragGroup = '';
+    altMode = true; // Enable Ghost Layer
+    altKeyPressed = false;
+    isPowerLauncherOpen = false;
+    emptyStateTitle = 'No results found';
+    emptyStateActionLabel = '';
+    selectionHeaderColor = 'primary';
+    ariaLabel = 'System Cluster List'; // Accessibility Root Label
+    density = 'comfortable';
+    viewTabs = []; // [{label:'', filter:''}]
+    commandK = true;
+    showMinimap = true;
+    isCommandKOpen = false;
+    commandQuery = '';
+    activeTab = 0;
+    focusRingTop = -1;
+    focusRingHeight = 0;
+    showConfetti = false;
+    isEKGActive = true;
+    groupDashboards = new Set();
+    syncing = false;
+    filterChips = []; // [{label:'', value:'', active:false}]
+    showSortingHeaders = false;
+    columns = []; // [{label:'', key:'', sortable:true}]
+    showGroupFooter = false;
+    groupFooterLabel = 'Items'; // "Total: 5 Items"
+    floatingFAB = false;
+    isPaletteOpen = false;
+    isQuickLookOpen = false;
+    shiftSelectionStartIndex = -1;
+    scrollTop = 0;
+    lassoActive = false;
+    lassoStart = { x: 0, y: 0 };
+    lassoEnd = { x: 0, y: 0 };
+    visibleItems = [];
+    filteredItems = [];
+    focusedIndex = -1;
+    draggedItem = null;
+    totalPages = 1;
+    listItemSelect;
+    listChange;
+    listStarToggle;
+    swipeAction;
+    longPress;
+    searchChange;
+    itemsReorder;
+    pageChange;
+    loadMore;
+    bulkAction;
+    columnSort;
+    _sortColumn = '';
+    _sortDir = 'asc';
+    listRef;
+    scrollTimeout;
+    componentWillLoad() {
+        try {
+            this.filterItems();
+        }
+        catch (e) {
+            console.error('[AppList] Error filtering items:', e);
+        }
+    }
+    componentDidLoad() {
+        if (this.virtual) {
+            this.updateVisibleItems();
+        }
+    }
+    handleItemsChange() {
+        this.filterItems();
+    }
+    filterItems() {
+        let items = [...this.items];
+        // Apply search filter
+        if (this.searchQuery && this.searchable) {
+            const query = this.searchQuery.toLowerCase();
+            items = items.filter(item => {
+                if (typeof item === 'string')
+                    return item.toLowerCase().includes(query);
+                if (item.label)
+                    return item.label.toLowerCase().includes(query);
+                if (item.text)
+                    return item.text.toLowerCase().includes(query);
+                return JSON.stringify(item).toLowerCase().includes(query);
+            });
+        }
+        this.filteredItems = items;
+        // Calculate pagination
+        if (this.paginated) {
+            this.totalPages = Math.ceil(items.length / this.itemsPerPage);
+            const start = (this.currentPage - 1) * this.itemsPerPage;
+            const end = start + this.itemsPerPage;
+            this.filteredItems = items.slice(start, end);
+        }
+        if (this.virtual) {
+            this.updateVisibleItems();
+        }
+    }
+    getGroupedItems() {
+        if (!this.grouped || !this.groupBy)
+            return null;
+        const groups = {};
+        this.filteredItems.forEach(item => {
+            const key = item[this.groupBy] || 'Other';
+            if (!groups[key])
+                groups[key] = [];
+            groups[key].push(item);
+        });
+        return groups;
+    }
+    updateVisibleItems() {
+        if (!this.listRef || !this.virtual)
+            return;
+        const containerHeight = this.listRef.clientHeight || 400;
+        const startIndex = Math.floor(this.scrollTop / this.itemHeight);
+        const endIndex = Math.ceil((this.scrollTop + containerHeight) / this.itemHeight);
+        this.visibleItems = this.filteredItems.slice(Math.max(0, startIndex - 5), Math.min(this.filteredItems.length, endIndex + 5));
+    }
+    handleScroll = (e) => {
+        const target = e.target;
+        this.scrollTop = target.scrollTop;
+        if (this.virtual) {
+            clearTimeout(this.scrollTimeout);
+            this.scrollTimeout = setTimeout(() => {
+                this.updateVisibleItems();
+            }, 50);
+        }
+        if (this.infinite) {
+            const scrollBottom = target.scrollHeight - target.scrollTop - target.clientHeight;
+            if (scrollBottom < this.loadMoreThreshold) {
+                this.loadMore.emit();
+            }
+        }
+    };
+    handleLassoStart = (e) => {
+        if (this.isPaletteOpen || this.isQuickLookOpen)
+            return;
+        if (!e.target.classList.contains('list'))
+            return;
+        this.lassoActive = true;
+        const rect = this.listRef.getBoundingClientRect();
+        this.lassoStart = { x: e.clientX - rect.left, y: e.clientY - rect.top };
+        this.lassoEnd = { ...this.lassoStart };
+        document.addEventListener('mousemove', this.handleLassoMove);
+        document.addEventListener('mouseup', this.handleLassoEnd);
+    };
+    handleLassoMove = (e) => {
+        if (!this.lassoActive)
+            return;
+        const rect = this.listRef.getBoundingClientRect();
+        this.lassoEnd = { x: e.clientX - rect.left, y: e.clientY - rect.top };
+        this.checkLassoSelection();
+    };
+    handleLassoEnd = () => {
+        this.lassoActive = false;
+        document.removeEventListener('mousemove', this.handleLassoMove);
+        document.removeEventListener('mouseup', this.handleLassoEnd);
+    };
+    checkLassoSelection() {
+        const x1 = Math.min(this.lassoStart.x, this.lassoEnd.x);
+        const x2 = Math.max(this.lassoStart.x, this.lassoEnd.x);
+        const y1 = Math.min(this.lassoStart.y, this.lassoEnd.y);
+        const y2 = Math.max(this.lassoStart.y, this.lassoEnd.y);
+        const itemEls = this.listRef.querySelectorAll('ui-list-item');
+        const newValues = [...this.selectedValues];
+        itemEls.forEach((el) => {
+            const itemRect = el.getBoundingClientRect();
+            const listRect = this.listRef.getBoundingClientRect();
+            const itemY = itemRect.top - listRect.top;
+            const itemX = itemRect.left - listRect.left;
+            // Lasso bounding box intersection
+            if (itemY + itemRect.height > y1 && itemY < y2 && itemX + itemRect.width > x1 && itemX < x2) {
+                const val = el.value || el.label;
+                if (!newValues.includes(val))
+                    newValues.push(val);
+            }
+        });
+        this.selectedValues = Array.from(new Set(newValues));
+    }
+    handleGlobalKeyDown(e) {
+        if (!this.keyboardNavigation)
+            return;
+        if (e.composedPath()[0] instanceof HTMLInputElement || e.composedPath()[0] instanceof HTMLTextAreaElement)
+            return;
+        if (e.key === '?') {
+            e.preventDefault();
+            this.isPaletteOpen = !this.isPaletteOpen;
+            return;
+        }
+        if (this.isPaletteOpen && e.key === 'Escape') {
+            this.isPaletteOpen = false;
+            return;
+        }
+        if (e.key === '[' || e.key === ']') {
+            e.preventDefault();
+            this.jumpToGroup(e.key === '[' ? 'prev' : 'next');
+            return;
+        }
+        if (e.key === ' ' && !this.isPaletteOpen) {
+            e.preventDefault();
+            this.isQuickLookOpen = !this.isQuickLookOpen;
+            return;
+        }
+        const isShift = e.shiftKey;
+        if (e.key === 'Alt')
+            this.altKeyPressed = true;
+        if (e.key === 'k' && (e.ctrlKey || e.metaKey)) {
+            e.preventDefault();
+            this.isCommandKOpen = !this.isCommandKOpen;
+        }
+        switch (e.key.toLowerCase()) {
+            case 'j':
+            case 'arrowdown':
+                e.preventDefault();
+                const nextIdx = Math.min(this.filteredItems.length - 1, this.focusedIndex + 1);
+                if (isShift && this.focusedIndex >= 0)
+                    this.handleRangeSelection(this.focusedIndex, nextIdx);
+                this.moveFocusRel(1);
+                break;
+            case 'k':
+            case 'arrowup':
+                e.preventDefault();
+                const prevIdx = Math.max(0, this.focusedIndex - 1);
+                if (isShift && this.focusedIndex >= 0)
+                    this.handleRangeSelection(this.focusedIndex, prevIdx);
+                this.moveFocusRel(-1);
+                break;
+            case 'x':
+                if (this.focusedIndex >= 0) {
+                    const item = this.filteredItems[this.focusedIndex];
+                    const val = item.value || item.id || this.focusedIndex.toString();
+                    this.handleItemSelection(val, !this.selectedValues.includes(val));
+                }
+                break;
+        }
+    }
+    handleGlobalKeyUp(e) {
+        if (e.key === 'Alt')
+            this.altKeyPressed = false;
+    }
+    handleKeyDown = (e) => {
+        if (!this.keyboardNavigation)
+            return;
+        const items = this.filteredItems;
+        if (items.length === 0)
+            return;
+        if (e.key === 'ArrowDown') {
+            e.preventDefault();
+            this.moveFocus(1);
+        }
+        else if (e.key === 'ArrowUp') {
+            e.preventDefault();
+            this.moveFocus(-1);
+        }
+        else if (e.key === 'Enter' && this.focusedIndex >= 0) {
+            const item = items[this.focusedIndex];
+            const value = item.value || item.id || this.focusedIndex.toString();
+            this.handleItemSelection(value, true);
+        }
+        else if (e.key === ' ' && this.checkboxSelection && this.focusedIndex >= 0) {
+            e.preventDefault();
+            const item = items[this.focusedIndex];
+            const value = item.value || item.id || this.focusedIndex.toString();
+            const isSelected = this.selectedValues.includes(value);
+            this.handleItemSelection(value, !isSelected);
+        }
+    };
+    handleRangeSelection(start, end) {
+        if (this.shiftSelectionStartIndex === -1)
+            this.shiftSelectionStartIndex = start;
+        const lower = Math.min(this.shiftSelectionStartIndex, end);
+        const upper = Math.max(this.shiftSelectionStartIndex, end);
+        const newValues = Array.from(new Set([...this.selectedValues]));
+        for (let i = lower; i <= upper; i++) {
+            const val = this.filteredItems[i].value || this.filteredItems[i].label;
+            if (!newValues.includes(val))
+                newValues.push(val);
+        }
+        this.selectedValues = newValues;
+        this.listChange.emit({ values: this.selectedValues });
+    }
+    jumpToGroup(dir) {
+        const groups = this.getGroupedItems();
+        if (!groups)
+            return;
+        const groupNames = Object.keys(groups);
+        const currentItem = this.filteredItems[this.focusedIndex];
+        if (!currentItem) {
+            this.moveFocus(0);
+            return;
+        }
+        const currentGroupName = groupNames.find(name => groups[name].includes(currentItem));
+        if (!currentGroupName)
+            return;
+        let nextIdx = groupNames.indexOf(currentGroupName) + (dir === 'next' ? 1 : -1);
+        if (nextIdx < 0)
+            nextIdx = groupNames.length - 1;
+        if (nextIdx >= groupNames.length)
+            nextIdx = 0;
+        const targetItem = groups[groupNames[nextIdx]][0];
+        const targetGlobalIdx = this.filteredItems.indexOf(targetItem);
+        this.moveFocus(targetGlobalIdx - this.focusedIndex);
+    }
+    moveFocusRel(delta) {
+        const nextIndex = Math.max(0, Math.min(this.focusedIndex + delta, this.filteredItems.length - 1));
+        if (nextIndex !== this.focusedIndex) {
+            this.focusedIndex = nextIndex;
+            this.updateFocusRing();
+            this.scrollToFocused();
+            // Accessibility Focus Sync
+            const itemEls = this.el.shadowRoot?.querySelectorAll('ui-list-item');
+            itemEls?.[nextIndex]?.focus();
+        }
+    }
+    updateFocusRing() {
+        const items = this.el.shadowRoot?.querySelectorAll('ui-list-item');
+        const focusedEl = items?.[this.focusedIndex];
+        if (focusedEl) {
+            const listRect = this.listRef.getBoundingClientRect();
+            const itemRect = focusedEl.getBoundingClientRect();
+            this.focusRingTop = itemRect.top - listRect.top + this.listRef.scrollTop;
+            this.focusRingHeight = itemRect.height;
+        }
+    }
+    moveFocus(delta) {
+        this.moveFocusRel(delta);
+    }
+    scrollToFocused() {
+        if (this.listRef && this.focusedIndex >= 0) {
+            const focusedEl = this.listRef.children[this.focusedIndex];
+            if (focusedEl) {
+                focusedEl.scrollIntoView({ block: 'nearest', behavior: 'smooth' });
+                focusedEl.focus();
+            }
+        }
+    }
+    handleDragStart = (e, item, index) => {
+        if (!this.isDraggable)
+            return;
+        this.draggedItem = { item, index };
+        e.dataTransfer.effectAllowed = 'move';
+        e.dataTransfer.setData('text/html', e.target.outerHTML);
+        e.target.classList.add('dragging');
+    };
+    handleDragOver = (e) => {
+        if (!this.isDraggable || !this.draggedItem)
+            return;
+        e.preventDefault();
+        e.dataTransfer.dropEffect = 'move';
+    };
+    handleDrop = (e, dropIndex) => {
+        e.preventDefault();
+        const sourceListId = e.dataTransfer.getData('source-list-id');
+        const sourceDragGroup = e.dataTransfer.getData('drag-group');
+        const itemData = e.dataTransfer.getData('item-data');
+        if (sourceDragGroup && sourceDragGroup !== this.dragGroup) {
+            console.warn('[AppList] Drag group mismatch');
+            return;
+        }
+        if (sourceListId === this.el.id || !sourceListId) {
+            if (!this.draggedItem)
+                return;
+            // Internal reorder
+            const dragIndex = this.draggedItem.index;
+            if (dragIndex === dropIndex)
+                return;
+            const newItems = [...this.filteredItems];
+            const [removed] = newItems.splice(dragIndex, 1);
+            newItems.splice(dropIndex, 0, removed);
+            this.filteredItems = newItems;
+            this.itemsReorder.emit({ items: newItems });
+        }
+        else {
+            // External drop
+            try {
+                const item = JSON.parse(itemData);
+                const newItems = [...this.filteredItems];
+                newItems.splice(dropIndex, 0, item);
+                this.filteredItems = newItems;
+                this.itemsReorder.emit({ items: newItems });
+            }
+            catch (e) {
+                console.error('[AppList] Error parsing external item data', e);
+            }
+        }
+        this.draggedItem = null;
+    };
+    handleDragEnd = (e) => {
+        e.target.classList.remove('dragging');
+        this.draggedItem = null;
+    };
+    handleItemSelection(value, selected) {
+        if (!this.selectable)
+            return;
+        if (this.multiSelect || this.checkboxSelection) {
+            if (selected) {
+                if (!this.selectedValues.includes(value)) {
+                    this.selectedValues = [...this.selectedValues, value];
+                }
+            }
+            else {
+                this.selectedValues = this.selectedValues.filter(v => v !== value);
+            }
+        }
+        else {
+            this.selectedValues = selected ? [value] : [];
+        }
+        this.listItemSelect.emit({ value, values: this.selectedValues });
+        this.listChange.emit({ values: this.selectedValues });
+    }
+    goToPage(page) {
+        if (page < 1 || page > this.totalPages)
+            return;
+        this.currentPage = page;
+        this.pageChange.emit({ page });
+    }
+    renderSearch() {
+        if (!this.searchable)
+            return null;
+        return (h("div", { class: "list-search" }, h("ui-icon", { name: "search", library: "fontawesome", class: "search-icon" }), h("ui-input", { type: "text", class: "search-input", placeholder: this.searchPlaceholder, value: this.searchQuery, onInputChange: (e) => {
+                this.searchQuery = e.detail;
+                this.searchChange.emit({ query: this.searchQuery });
+            }, prefixIcon: "search", size: "sm" }), this.searchQuery && (h("ui-button", { variant: "ghost", class: "search-clear", onClick: () => {
+                this.searchQuery = '';
+                this.searchChange.emit({ query: '' });
+            }, icon: "times", iconLibrary: "fontawesome", iconOnly: true, size: "sm" }))));
+    }
+    renderLoading() {
+        if (!this.loading)
+            return null;
+        return (h("div", { class: "list-loading" }, h("ui-loader", { type: "spinner", size: "1.2em", color: "primary" }), h("span", null, this.loadingText)));
+    }
+    renderEmpty() {
+        if (!this.showEmpty || this.loading || this.filteredItems.length > 0)
+            return null;
+        return (h("div", { class: "list-empty" }, h("ui-icon", { name: "inbox", library: "fontawesome" }), h("span", null, this.emptyText)));
+    }
+    renderPagination() {
+        if (!this.paginated || this.totalPages <= 1)
+            return null;
+        const pages = [];
+        for (let i = 1; i <= this.totalPages; i++) {
+            if (i === 1 ||
+                i === this.totalPages ||
+                (i >= this.currentPage - 2 && i <= this.currentPage + 2)) {
+                pages.push(h("ui-button", { variant: i === this.currentPage ? "primary" : "ghost", class: {
+                        'pagination-button': true,
+                        'active': i === this.currentPage
+                    }, onClick: () => this.goToPage(i), label: i.toString(), size: "sm" }));
+            }
+            else if (i === this.currentPage - 3 || i === this.currentPage + 3) {
+                pages.push(h("span", { class: "pagination-ellipsis" }, "..."));
+            }
+        }
+        return (h("div", { class: "list-pagination" }, h("ui-button", { variant: "ghost", class: "pagination-button", disabled: this.currentPage === 1, onClick: () => this.goToPage(this.currentPage - 1), icon: "chevron-left", iconLibrary: "fontawesome", iconOnly: true, size: "sm" }), pages, h("ui-button", { variant: "ghost", class: "pagination-button", disabled: this.currentPage === this.totalPages, onClick: () => this.goToPage(this.currentPage + 1), icon: "chevron-right", iconLibrary: "fontawesome", iconOnly: true, size: "sm" })));
+    }
+    renderVirtualList() {
+        const totalHeight = this.filteredItems.length * this.itemHeight;
+        const offsetY = Math.floor(this.scrollTop / this.itemHeight) * this.itemHeight;
+        return (h("div", { class: "virtual-list", style: { height: `${totalHeight}px`, position: 'relative' } }, h("div", { style: { transform: `translateY(${offsetY}px)` } }, this.visibleItems.map((item, index) => this.renderItem(item, index)))));
+    }
+    renderItem(item, index) {
+        const value = item.value || item.id || index.toString();
+        const isSelected = this.selectedValues.includes(value);
+        // Dynamic props from item object
+        const label = item.label || item.text || item;
+        const sublabel = item.sublabel || '';
+        const icon = item.icon || '';
+        const userAvatar = item.avatar || item.userAvatar || '';
+        const image = item.image || '';
+        const badge = item.badge || '';
+        const counter = item.counter || '';
+        const tags = item.tags || '';
+        return (h("ui-list-item", { style: { '--item-index': index.toString() }, label: label, sublabel: sublabel, value: value, icon: icon, userAvatar: userAvatar, image: image, selected: isSelected, skeleton: this.skeleton || this.loading, highlight: this.searchQuery, size: this.size, badge: badge, counter: counter, tags: tags, interactive: this.selectable, onListItemClick: () => this.handleItemSelection(value, !isSelected), onCheckboxChange: (e) => this.handleItemSelection(value, e.detail.checked), showCheckbox: this.checkboxSelection, swipeActions: item.swipeActions ?? true, leftActionIcon: item.leftActionIcon ?? "check", rightActionIcon: item.rightActionIcon ?? "trash", leftActions: item.leftActions || [], rightActions: item.rightActions || [], avatarGroup: item.avatarGroup || item.collaborators || '', avatarGroupPosition: item.avatarGroupPosition || 'content', progress: item.progress ?? -1, status: item.status || '', statusPosition: item.statusPosition || 'bottom-right', starred: item.starred || false, showStar: item.showStar || false, expandable: item.expandable || false, priorityPulse: item.priorityPulse || false, presence: item.presence || [], presenceCursors: item.presenceCursors || [], density: this.density, auraMode: true, sparkline: item.sparkline || [], metadata: item.metadata || {}, showGhostLayer: this.altKeyPressed, gridMode: this.grid, focused: this.focusedIndex === index, class: {
+                'draggable': this.isDraggable,
+                'focused-item': this.focusedIndex === index
+            }, draggable: this.isDraggable, onDragStart: (e) => {
+                this.handleDragStart(e, item, index);
+                e.dataTransfer.setData('source-list-id', this.el.id);
+                e.dataTransfer.setData('drag-group', this.dragGroup);
+                e.dataTransfer.setData('item-data', JSON.stringify(item));
+            }, onDragOver: this.handleDragOver, onDrop: (e) => this.handleDrop(e, index), onDragEnd: this.handleDragEnd, onSwipeAction: (e) => {
+                e.stopPropagation();
+                this.swipeAction.emit({ value: e.detail.value, side: e.detail.side, action: e.detail.action });
+            }, onLongPress: (e) => {
+                e.stopPropagation();
+                this.longPress.emit({ value: e.detail.value });
+            }, onStarToggle: (e) => {
+                e.stopPropagation();
+                this.listStarToggle.emit({ value: e.detail.value, starred: e.detail.starred });
+            } }));
+    }
+    renderGroupFooter(groupItems) {
+        if (!this.showGroupFooter)
+            return null;
+        return (h("div", { class: "list-group-footer", slot: "footer" }, this.groupFooterLabel, ": ", groupItems.length));
+    }
+    handleItemClick(event) {
+        const { value, selected, shiftKey, ctrlKey, metaKey } = event.detail;
+        if (!this.selectable) {
+            return;
+        }
+        const clickedIndex = this.filteredItems.findIndex(it => (it.value || it.id || it.label) === value);
+        if (shiftKey && this.shiftSelectionStartIndex !== -1 && this.multiSelect) {
+            this.handleRangeSelection(this.shiftSelectionStartIndex, clickedIndex);
+        }
+        else if ((ctrlKey || metaKey) && this.multiSelect) {
+            this.handleItemSelection(value, !this.selectedValues.includes(value));
+            this.shiftSelectionStartIndex = clickedIndex;
+        }
+        else {
+            this.handleItemSelection(value, selected);
+            this.shiftSelectionStartIndex = clickedIndex;
+        }
+        this.listItemSelect.emit({ value, values: this.selectedValues, shiftKey, ctrlKey, metaKey });
+        this.listChange.emit({ values: this.selectedValues });
+    }
+    renderContent() {
+        if (this.loading) {
+            return this.renderLoading();
+        }
+        if (this.virtual) {
+            return this.renderVirtualList();
+        }
+        if (this.grouped && this.items && this.items.length > 0) {
+            return this.renderGroupedItems();
+        }
+        if (this.items && this.items.length > 0) {
+            if (this.filteredItems.length > 0) {
+                return this.filteredItems.map((item, index) => this.renderItem(item, index));
+            }
+            return this.renderEmpty();
+        }
+        return h("slot", null);
+    }
+    renderEKGWaveform() {
+        if (!this.isEKGActive)
+            return null;
+        return (h("div", { class: "list-ekg-container" }, h("svg", { class: "list-ekg-waveform", viewBox: "0 0 100 20", preserveAspectRatio: "none" }, h("path", { d: "M0,10 L10,10 L12,2 L15,18 L18,10 L30,10 L32,5 L35,15 L38,10 L50,10 L52,0 L55,20 L58,10 L100,10", fill: "none", stroke: "rgba(59, 130, 246, 0.4)", "stroke-width": "1.5" }))));
+    }
+    renderConfetti() {
+        if (!this.showConfetti)
+            return null;
+        const particles = Array.from({ length: 20 });
+        return (h("div", { class: "list-confetti-burst" }, particles.map(() => h("div", { class: "confetti-particle" }))));
+    }
+    renderGroupDashboard(groupName, items) {
+        const isExpanded = this.groupDashboards.has(groupName);
+        if (!isExpanded)
+            return null;
+        const avgHealth = Math.round(items.reduce((acc, it) => acc + (it.progress || 0), 0) / items.length);
+        const onlineCount = items.filter(it => it.status === 'online').length;
+        return (h("div", { class: "group-mini-dashboard" }, h("div", { class: "gm-stat" }, "Group Pulse: ", h("strong", null, avgHealth, "%")), h("div", { class: "gm-stat" }, "Vitality: ", h("strong", null, onlineCount, "/", items.length, " Active")), h("div", { class: "gm-spark", style: { flex: '1' } }, h("svg", { height: "24", width: "100%" }, h("path", { d: "M0,12 Q25,2 50,12 T100,12", fill: "none", stroke: "#3bf673", "stroke-width": "2" })))));
+    }
+    renderGroupedItems() {
+        const groups = this.getGroupedItems();
+        if (!groups)
+            return null;
+        return Object.keys(groups).map(groupName => (h("ui-list-group", { key: groupName, label: groupName, collapsible: true, expanded: true }, h("div", { slot: "header", class: "group-header-custom", onClick: (e) => {
+                e.stopPropagation();
+                const newDash = new Set(this.groupDashboards);
+                if (newDash.has(groupName))
+                    newDash.delete(groupName);
+                else
+                    newDash.add(groupName);
+                this.groupDashboards = newDash;
+            } }, h("span", { class: "group-title-label" }, groupName), h("span", { class: "group-pill" }, groups[groupName].length, " Nodes"), h("ui-icon", { name: this.groupDashboards.has(groupName) ? 'chart-bar' : 'chevron-down', library: "fontawesome" })), this.renderGroupDashboard(groupName, groups[groupName]), groups[groupName].map((item, idx) => {
+            const globalIdx = this.filteredItems.indexOf(item);
+            return (h("div", { key: `${groupName}-${idx}` }, this.renderItem(item, globalIdx)));
+        }), this.renderGroupFooter(groups[groupName]))));
+    }
+    renderCommandPalette() {
+        if (!this.isCommandKOpen)
+            return null;
+        const commands = [
+            { label: 'Switch to Grid View', action: () => this.grid = true, icon: 'th' },
+            { label: 'Switch to Compact Mode', action: () => this.density = 'compact', icon: 'list' },
+            { label: 'Export to CSV', action: () => this.bulkAction.emit({ action: 'export-csv', values: this.selectedValues }), icon: 'download' },
+            { label: 'Filter by Critical', action: () => this.searchQuery = 'online', icon: 'shield-alt' }
+        ].filter(c => c.label.toLowerCase().includes(this.commandQuery.toLowerCase()));
+        return (h("div", { class: "list-command-palette-overlay", onClick: () => this.isCommandKOpen = false }, h("div", { class: "command-palette-content", onClick: e => e.stopPropagation() }, h("div", { class: "cp-search" }, h("ui-icon", { name: "search" }), h("ui-input", { type: "text", placeholder: "Type a command or search...", value: this.commandQuery, onInputChange: (e) => this.commandQuery = e.detail, autoFocus: true, prefixIcon: "search", size: "sm" }), h("kbd", null, "ESC")), h("div", { class: "cp-results" }, commands.map(cmd => (h("div", { class: "cp-item", onClick: () => { cmd.action(); this.isCommandKOpen = false; } }, h("ui-icon", { name: cmd.icon }), h("span", null, cmd.label))))))));
+    }
+    renderMinimap() {
+        if (!this.showMinimap)
+            return null;
+        return (h("div", { class: "list-scrollbar-minimap" }, this.filteredItems.map((item, i) => {
+            if (item.status === 'online' || item.status === 'busy' || item.priorityPulse) {
+                const pct = (i / this.filteredItems.length) * 100;
+                return h("div", { class: `m-marker m-${item.status || 'danger'}`, style: { top: `${pct}%` } });
+            }
+            return null;
+        })));
+    }
+    renderViewTabs() {
+        if (!this.viewTabs || this.viewTabs.length === 0)
+            return null;
+        return (h("div", { class: "list-view-tabs" }, this.viewTabs.map((tab, idx) => (h("div", { key: tab.label, class: { 'view-tab': true, 'active': this.activeTab === idx }, onClick: () => { this.activeTab = idx; this.filterItems(); } }, tab.label)))));
+    }
+    render() {
+        const listClasses = {
+            'list': true,
+            [`list-${this.size}`]: true,
+            [`list-${this.variant}`]: true,
+            'list-dense': this.dense,
+            'list-dividers': this.dividers,
+            'list-rounded': this.rounded,
+            'list-elevated': this.elevated,
+            'list-full-width': this.fullWidth,
+            'list-no-padding': !this.padding,
+            'list-draggable': this.isDraggable,
+            'list-keyboard-nav': this.keyboardNavigation,
+            'list-flush': this.flush,
+            'list-horizontal': this.horizontal,
+            'list-numbered': this.numbered,
+            'list-grid': this.grid,
+            'list-selection-active': this.selectedValues.length > 0
+        };
+        const containerClasses = {
+            'list-container': true,
+            'list-has-selection': this.selectedValues.length > 0,
+            [`selection-theme-${this.selectionHeaderColor}`]: this.selectedValues.length > 0
+        };
+        const gridStyle = this.grid ? {
+            display: 'grid',
+            gridTemplateColumns: `repeat(${this.gridCols}, 1fr)`,
+            gap: '16px',
+            padding: '16px'
+        } : {};
+        const listStyle = {
+            ...(this.maxHeight ? { maxHeight: this.maxHeight, overflowY: 'auto' } : {}),
+            ...gridStyle
+        };
+        return (h("div", { key: '5684139656aa6922b537ed2c33d040ff00951369', class: containerClasses, onKeyDown: this.handleKeyDown, tabindex: "0" }, this.syncing && h("div", { key: '3d0fa48f4af75ef72778c33a2e7c49b0fcdc951c', class: "list-sync-bar" }), h("div", { key: 'ca2b3d140bde8c70c312694b09605f8c57494de6', class: "list-header-adaptive" }, h("div", { key: '9652209ed505568d154ff0cea69a59946d152d0f', class: "header-main-titles" }, this.label && h("div", { key: '3a2219002b7c43dd851b577354e36da1c1b1bbdf', class: "list-label" }, this.label), this.subheader && h("div", { key: '65fdf444f79400cb22091c8e1ba559476c2e5e60', class: "list-subheader" }, this.subheader)), this.renderViewTabs()), this.renderSearch(), this.filterChips.length > 0 && (h("div", { key: '83a004df672c8b81a61f98bbee307a29738655d7', class: "list-filter-chips" }, this.filterChips.map(chip => (h("ui-button", { variant: chip.active ? "primary" : "ghost", class: { 'filter-chip': true, 'active': chip.active }, label: `${chip.label} ${chip.count !== undefined ? chip.count : ''}`, size: "sm" }))))), this.showSortingHeaders && (h("div", { key: '2a5f4ad0309980db00dc73dc86630998609a4c56', class: "list-sorting-headers" }, this.columns.map(col => (h("div", { class: "sort-header", onClick: () => { const dir = this._sortColumn === col.key && this._sortDir === 'asc' ? 'desc' : 'asc'; this._sortColumn = col.key; this._sortDir = dir; this.columnSort.emit({ key: col.key, direction: dir }); } }, h("span", null, col.label), col.sortable && h("ui-icon", { name: "sort", library: "fontawesome" })))))), this.showBulkHeader && this.multiSelect && (h("div", { key: '23cb44d5f7bee3a990a724146b2df8ca42b5dd96', class: "list-bulk-header" }, h("div", { key: '28dc1ac4b24e6e9689d4265147e88b5282c98919', class: "bulk-select-all" }, h("ui-check-box", { key: '143d57d309f55370752c5f893a8c10cc054fe7f4', checked: this.selectedValues.length === this.items.length && this.items.length > 0, indeterminate: this.selectedValues.length > 0 && this.selectedValues.length < this.items.length, onCheckChange: (e) => {
+                if (e.detail.checked) {
+                    this.selectedValues = this.items.map((item, i) => item.value || item.id || i.toString());
+                }
+                else {
+                    this.selectedValues = [];
+                }
+                this.listChange.emit({ values: this.selectedValues });
+            } }), h("span", { key: '7a863464bb51a4e0696357cf47df4d673f1435da', class: "bulk-count" }, this.selectedValues.length, " selected")), this.selectedValues.length > 0 && (h("div", { key: 'e4b0914bb4a1270b53d5ce22b78e692a773dd119', class: "bulk-actions" }, this.bulkActions.map(action => (h("ui-button", { variant: "ghost", onClick: () => this.bulkAction.emit({ action: action.action, values: this.selectedValues }), icon: action.icon, iconLibrary: "fontawesome", label: action.label, size: "sm" }))))))), this.floatingFAB && this.selectedValues.length > 0 && (h("div", { key: '80d73a3f7aaf83ed56483b9b1289355c94ee2cd2', class: "list-power-launcher-container" }, h("div", { key: 'b17d2e799be661d020129b7282958cc390a5e1f3', class: { 'launcher-fab': true, 'active': this.isPowerLauncherOpen }, onClick: () => this.isPowerLauncherOpen = !this.isPowerLauncherOpen }, h("ui-icon", { key: '2c480f1a330b88d988027b395cffea9007959875', name: this.isPowerLauncherOpen ? 'times' : 'bolt', library: "fontawesome" })), this.isPowerLauncherOpen && (h("div", { key: '22b2dc111065ea5d027f2036b0aa09c2b8e33c1c', class: "launcher-menu" }, h("div", { key: '96757071c64097399f00003c5b8286109ae073d0', class: "l-item", onClick: () => this.bulkAction.emit({ action: 'rolling-restart', values: this.selectedValues }) }, h("ui-icon", { key: 'dcf809cf37cc3ce674ccbd45c17b4753dc2d0d00', name: "redo" }), " Rolling Restart"), h("div", { key: '638b213324ce1fab5f08bcdc46c3eece46096e01', class: "l-item", onClick: () => this.bulkAction.emit({ action: 'sync-cluster', values: this.selectedValues }) }, h("ui-icon", { key: 'e56da100b1479ddc964b1881ea980a8e95ababa0', name: "sync" }), " Sync Cluster"), h("div", { key: 'e49e35e060cb5b3ac704701ca895bec1ce87f25d', class: "l-item", onClick: () => this.bulkAction.emit({ action: 'patch-security', values: this.selectedValues }) }, h("ui-icon", { key: '809e778533d4a8f81bba9a9cc8ff4eba3873428f', name: "shield-alt" }), " Patch Security"), h("div", { key: 'c0a6cc4d0b9f18c372c2ed915c908eb56ddd5f85', class: "l-item danger", onClick: () => this.bulkAction.emit({ action: 'delete', values: this.selectedValues }) }, h("ui-icon", { key: '3f21dccdecb41a5f55181a1e1aeb9e35bea1c64e', name: "trash" }), " Terminate Selected"))))), this.isPaletteOpen && (h("div", { key: 'c7d9e294022223fa9a651ef38242c0bf6adb954f', class: "list-shortcut-palette", onClick: () => this.isPaletteOpen = false }, h("div", { key: '806386e68869a9b330924aa912639f9e4c23f406', class: "palette-content", onClick: e => e.stopPropagation() }, h("h3", { key: 'b1f9d573f682cb91e5c1e27678b5a23d88d53f0d' }, "\u2328\uFE0F Keyboard Shortcuts"), h("div", { key: '587cb46ffaf1d6b937b6cbf976d488716e99c4e7', class: "shortcut-grid" }, h("div", { key: '99b60b30c17829122d01cab955e68abf2e325404', class: "s-row" }, h("kbd", { key: '528dbdade7ea5e40d0f910485ee6dc97987b3cba' }, "J"), " / ", h("kbd", { key: 'cf48324a3c57e1930f5df7a72d6a39b80398af7b' }, "K"), " ", h("span", { key: '45fdfcb587fe461e116e8377e9a60e4c713f3c5b' }, "Navigate Down / Up")), h("div", { key: 'cee7b640c85a03007caf55f321a6f7cb0a05f7ec', class: "s-row" }, h("kbd", { key: '272dcd26548008a508b07ec840ff14551b727b77' }, "Shift"), " + ", h("kbd", { key: '192fb55ec1a65b52dd048e48d9f1fdeb8e749055' }, "J/K"), " ", h("span", { key: 'a0650dd5e2f346b9928881f0b1afb279a1e447ce' }, "Select Range")), h("div", { key: '978a95dba468ddd239a6564e64676ec49c56f814', class: "s-row" }, h("kbd", { key: 'dd89ce3941b66de4fdfe54fa9b642305ca5a1ec7' }, "X"), " ", h("span", { key: 'e65cbc977404a02c8c97422969bd655066eaa24f' }, "Toggle Selection")), h("div", { key: '2f4948053e0c57cdeda7b8dc95924c208cc2162d', class: "s-row" }, h("kbd", { key: '96236740f75b1bd32ff2cd59d0e0a8f4fbc56790' }, "Enter"), " ", h("span", { key: 'f97d42cd2426d7b8ce733d1d951a208d6a651214' }, "Activate / Open")), h("div", { key: '19fc8715190f1170dbc8fa49dc175c41889c8800', class: "s-row" }, h("kbd", { key: '9e3b21acfd2b90e5ef6092c4c76c7b272123c1d5' }, "Space"), " ", h("span", { key: '1fb4d5e4980463a275206fed93b84d932de58a47' }, "Quick Look Preview")), h("div", { key: 'e6db95f32afcdcc87869a3e2a25a0f4641e2ed06', class: "s-row" }, h("kbd", { key: '96eff77c50f2cb47f0aec426028acd9fa62e9676' }, "["), " / ", h("kbd", { key: '65291ab2f4667e8538b6dad3eef7acf2eca59bb7' }, "]"), " ", h("span", { key: '386e1754ec50d9dc8748cd5f0f79ebc4d07adb37' }, "Jump to Prev / Next Group")), h("div", { key: '4330d1b02cff4b1fea58df8b4edc487a0d8afa40', class: "s-row" }, h("kbd", { key: '5e32e02c048a583b6a514ec53cec46cd72dc609f' }, "?"), " ", h("span", { key: '0505f5dc146e9ccefcf7538a580c2cc9cc0ba83c' }, "Toggle this help")))))), this.isQuickLookOpen && (h("div", { key: '96152ba016ee2466fbc4a768d8ba4858c3942759', class: "list-quick-look-modal", onClick: () => this.isQuickLookOpen = false }, h("div", { key: '6394a176a2202a76e3ea5651013ae2cd966e4721', class: "quick-look-content", onClick: e => e.stopPropagation() }, h("ui-icon", { key: '2d1059432bd8ff8b0881db5c37ca6b7de545a7e2', name: "times", class: "close-look", onClick: () => this.isQuickLookOpen = false }), h("div", { key: '06966b3777cc0975455fdfb1b369101ed719d8bb', class: "look-header" }, h("h2", { key: 'd5d97e1c05289474b724d1057c9ff25e1a2c0dd2' }, this.filteredItems[this.focusedIndex]?.label), h("span", { key: '0b65d7a4c60a924a8e1d1b958f49e4be95eb4dc4' }, this.filteredItems[this.focusedIndex]?.sublabel)), h("div", { key: '4b95dcf39f8356e511cda85795fde30c53cc6afb', class: "look-body" }, h("p", { key: '059ba589a2d86c5d3c311d43732cda2f791c2736' }, "Comprehensive detail for Node ID: ", this.filteredItems[this.focusedIndex]?.value || 'N/A'), h("div", { key: '492b7836c768053dd04571e7789d36f20ecc3316', class: "look-stats" }, h("div", { key: '2dd11a134ec109eccf262fd7cff2603832008411', class: "l-stat" }, "Status: ", h("strong", { key: '97b9d41633eee04ef2ae308e4cfb90e689d13471' }, this.filteredItems[this.focusedIndex]?.status || 'Idle')), h("div", { key: 'cda37caa09ea5be1ca63ea05aa52b05c7ea7c60b', class: "l-stat" }, "Health: ", h("strong", { key: 'af222d5568b451b93b38ddce361c6a8ce4dc62d7' }, this.filteredItems[this.focusedIndex]?.progress || 100, "%"))))))), h("div", { key: '7cda8202307e92b7450fa2947bb2c8e9262cc21e', ref: el => this.listRef = el, class: listClasses, style: listStyle, role: "list", "aria-label": this.ariaLabel, "aria-busy": this.syncing ? 'true' : 'false', part: "list", onScroll: this.handleScroll, onMouseDown: this.handleLassoStart }, this.renderMinimap(), this.focusRingTop >= 0 && (h("div", { key: '2e57833bb56b58deaa11adb1309f7f2cd5db5b88', class: "list-focus-spring-ring", style: {
+                top: `${this.focusRingTop}px`,
+                height: `${this.focusRingHeight}px`
+            } })), this.lassoActive && (h("div", { key: '6a5277b2aeb18a682b5472dc8afb8a17c3ab6d3f', class: "list-lasso-box", style: {
+                left: `${Math.min(this.lassoStart.x, this.lassoEnd.x)}px`,
+                top: `${Math.min(this.lassoStart.y, this.lassoEnd.y)}px`,
+                width: `${Math.abs(this.lassoEnd.x - this.lassoStart.x)}px`,
+                height: `${Math.abs(this.lassoEnd.y - this.lassoStart.y)}px`
+            } })), this.renderContent()), this.renderPagination(), this.renderCommandPalette(), this.renderEKGWaveform(), this.renderConfetti(), this.showConfetti && h("div", { key: '7a0cb9110e1b763f4651e1f6a2687f549dfa9870', class: "a11y-sr-only", "aria-live": "assertive" }, "Industrial Batch Operation Completed Successfully"), this.syncing && h("div", { key: '7b2aa86d2b7913c3313a4b3bcdc04afee3efaba4', class: "a11y-sr-only", "aria-live": "polite" }, "Cluster data is currently synchronizing...")));
+    }
+    static get is() { return "ui-list"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["list.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["list.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "label",
+                "defaultValue": "''"
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'sm' | 'md' | 'lg'",
+                    "resolved": "\"lg\" | \"md\" | \"sm\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "size",
+                "defaultValue": "'md'"
+            },
+            "color": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "StatusColor",
+                    "resolved": "\"borderless\" | \"danger\" | \"default\" | \"elevated\" | \"error\" | \"flat\" | \"ghost\" | \"glass\" | \"info\" | \"inverse\" | \"loading\" | \"neutral\" | \"none\" | \"outline\" | \"plain\" | \"primary\" | \"raised\" | \"secondary\" | \"soft\" | \"sovereign\" | \"success\" | \"surface\" | \"tertiary\" | \"warning\"",
+                    "references": {
+                        "StatusColor": {
+                            "location": "import",
+                            "path": "../../types/common.type",
+                            "id": "src/types/common.type.d.ts::StatusColor",
+                            "referenceLocation": "StatusColor"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "color",
+                "defaultValue": "'default'"
+            },
+            "variant": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'filled' | 'outlined' | 'text' | 'soft'",
+                    "resolved": "\"filled\" | \"outlined\" | \"soft\" | \"text\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "variant",
+                "defaultValue": "'text'"
+            },
+            "dense": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "dense",
+                "defaultValue": "false"
+            },
+            "dividers": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "dividers",
+                "defaultValue": "false"
+            },
+            "rounded": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "rounded",
+                "defaultValue": "false"
+            },
+            "elevated": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "elevated",
+                "defaultValue": "false"
+            },
+            "selectable": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "selectable",
+                "defaultValue": "true"
+            },
+            "multiSelect": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "multi-select",
+                "defaultValue": "false"
+            },
+            "selectedValues": {
+                "type": "unknown",
+                "mutable": true,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "maxHeight": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "max-height",
+                "defaultValue": "''"
+            },
+            "fullWidth": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "full-width",
+                "defaultValue": "false"
+            },
+            "padding": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "padding",
+                "defaultValue": "true"
+            },
+            "subheader": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "subheader",
+                "defaultValue": "''"
+            },
+            "virtual": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "virtual",
+                "defaultValue": "false"
+            },
+            "itemHeight": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "item-height",
+                "defaultValue": "48"
+            },
+            "items": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "any[]",
+                    "resolved": "any[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "searchable": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "searchable",
+                "defaultValue": "false"
+            },
+            "searchPlaceholder": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "search-placeholder",
+                "defaultValue": "'Search...'"
+            },
+            "searchQuery": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "search-query",
+                "defaultValue": "''"
+            },
+            "loading": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "loading",
+                "defaultValue": "false"
+            },
+            "loadingText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "loading-text",
+                "defaultValue": "'Loading...'"
+            },
+            "skeleton": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "skeleton",
+                "defaultValue": "false"
+            },
+            "emptyText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "empty-text",
+                "defaultValue": "'No items found'"
+            },
+            "showEmpty": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-empty",
+                "defaultValue": "true"
+            },
+            "isDraggable": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-draggable",
+                "defaultValue": "false"
+            },
+            "paginated": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "paginated",
+                "defaultValue": "false"
+            },
+            "itemsPerPage": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "items-per-page",
+                "defaultValue": "10"
+            },
+            "currentPage": {
+                "type": "number",
+                "mutable": true,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "current-page",
+                "defaultValue": "1"
+            },
+            "checkboxSelection": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "checkbox-selection",
+                "defaultValue": "false"
+            },
+            "keyboardNavigation": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "keyboard-navigation",
+                "defaultValue": "true"
+            },
+            "grouped": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "grouped",
+                "defaultValue": "false"
+            },
+            "groupBy": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "group-by",
+                "defaultValue": "''"
+            },
+            "flush": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "flush",
+                "defaultValue": "false"
+            },
+            "horizontal": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "horizontal",
+                "defaultValue": "false"
+            },
+            "numbered": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "numbered",
+                "defaultValue": "false"
+            },
+            "infinite": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "infinite",
+                "defaultValue": "false"
+            },
+            "loadMoreThreshold": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "load-more-threshold",
+                "defaultValue": "50"
+            },
+            "stickyHeaders": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "sticky-headers",
+                "defaultValue": "false"
+            },
+            "showBulkHeader": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-bulk-header",
+                "defaultValue": "false"
+            },
+            "bulkActions": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "any[]",
+                    "resolved": "any[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "grid": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "grid",
+                "defaultValue": "false"
+            },
+            "gridCols": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "grid-cols",
+                "defaultValue": "3"
+            },
+            "dragGroup": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "drag-group",
+                "defaultValue": "''"
+            },
+            "altMode": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "alt-mode",
+                "defaultValue": "true"
+            },
+            "emptyStateTitle": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "empty-state-title",
+                "defaultValue": "'No results found'"
+            },
+            "emptyStateActionLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "empty-state-action-label",
+                "defaultValue": "''"
+            },
+            "selectionHeaderColor": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "selection-header-color",
+                "defaultValue": "'primary'"
+            },
+            "ariaLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "aria-label",
+                "defaultValue": "'System Cluster List'"
+            },
+            "density": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'cozy' | 'comfortable' | 'compact'",
+                    "resolved": "\"comfortable\" | \"compact\" | \"cozy\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "density",
+                "defaultValue": "'comfortable'"
+            },
+            "viewTabs": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "any[]",
+                    "resolved": "any[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "commandK": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "command-k",
+                "defaultValue": "true"
+            },
+            "showMinimap": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-minimap",
+                "defaultValue": "true"
+            },
+            "syncing": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "syncing",
+                "defaultValue": "false"
+            },
+            "filterChips": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "any[]",
+                    "resolved": "any[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "showSortingHeaders": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-sorting-headers",
+                "defaultValue": "false"
+            },
+            "columns": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "any[]",
+                    "resolved": "any[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            },
+            "showGroupFooter": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-group-footer",
+                "defaultValue": "false"
+            },
+            "groupFooterLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "group-footer-label",
+                "defaultValue": "'Items'"
+            },
+            "floatingFAB": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "floating-f-a-b",
+                "defaultValue": "false"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "altKeyPressed": {},
+            "isPowerLauncherOpen": {},
+            "isCommandKOpen": {},
+            "commandQuery": {},
+            "activeTab": {},
+            "focusRingTop": {},
+            "focusRingHeight": {},
+            "showConfetti": {},
+            "isEKGActive": {},
+            "groupDashboards": {},
+            "isPaletteOpen": {},
+            "isQuickLookOpen": {},
+            "shiftSelectionStartIndex": {},
+            "scrollTop": {},
+            "lassoActive": {},
+            "lassoStart": {},
+            "lassoEnd": {},
+            "visibleItems": {},
+            "filteredItems": {},
+            "focusedIndex": {},
+            "draggedItem": {},
+            "totalPages": {},
+            "_sortColumn": {},
+            "_sortDir": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "listItemSelect",
+                "name": "listItemSelect",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ value: string; values: string[]; shiftKey?: boolean; ctrlKey?: boolean; metaKey?: boolean; altKey?: boolean; }",
+                    "resolved": "{ value: string; values: string[]; shiftKey?: boolean; ctrlKey?: boolean; metaKey?: boolean; altKey?: boolean; }",
+                    "references": {}
+                }
+            }, {
+                "method": "listChange",
+                "name": "listChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ values: string[]; }",
+                    "resolved": "{ values: string[]; }",
+                    "references": {}
+                }
+            }, {
+                "method": "listStarToggle",
+                "name": "listStarToggle",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ value: string; starred: boolean; }",
+                    "resolved": "{ value: string; starred: boolean; }",
+                    "references": {}
+                }
+            }, {
+                "method": "swipeAction",
+                "name": "swipeAction",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ value: string; side: LeftRight; action?: string; }",
+                    "resolved": "{ value: string; side: LeftRight; action?: string; }",
+                    "references": {
+                        "LeftRight": {
+                            "location": "import",
+                            "path": "../../types/common.type",
+                            "id": "src/types/common.type.d.ts::LeftRight",
+                            "referenceLocation": "LeftRight"
+                        }
+                    }
+                }
+            }, {
+                "method": "longPress",
+                "name": "longPress",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ value: string; }",
+                    "resolved": "{ value: string; }",
+                    "references": {}
+                }
+            }, {
+                "method": "searchChange",
+                "name": "searchChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ query: string; }",
+                    "resolved": "{ query: string; }",
+                    "references": {}
+                }
+            }, {
+                "method": "itemsReorder",
+                "name": "itemsReorder",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ items: any[]; }",
+                    "resolved": "{ items: any[]; }",
+                    "references": {}
+                }
+            }, {
+                "method": "pageChange",
+                "name": "pageChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ page: number; }",
+                    "resolved": "{ page: number; }",
+                    "references": {}
+                }
+            }, {
+                "method": "loadMore",
+                "name": "loadMore",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "void",
+                    "resolved": "void",
+                    "references": {}
+                }
+            }, {
+                "method": "bulkAction",
+                "name": "bulkAction",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ action: string, values: string[] }",
+                    "resolved": "{ action: string; values: string[]; }",
+                    "references": {}
+                }
+            }, {
+                "method": "columnSort",
+                "name": "columnSort",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "{ key: string; direction: 'asc' | 'desc' }",
+                    "resolved": "{ key: string; direction: \"desc\" | \"asc\"; }",
+                    "references": {}
+                }
+            }];
+    }
+    static get elementRef() { return "el"; }
+    static get watchers() {
+        return [{
+                "propName": "items",
+                "methodName": "handleItemsChange"
+            }, {
+                "propName": "searchQuery",
+                "methodName": "handleItemsChange"
+            }, {
+                "propName": "currentPage",
+                "methodName": "handleItemsChange"
+            }];
+    }
+    static get listeners() {
+        return [{
+                "name": "keydown",
+                "method": "handleGlobalKeyDown",
+                "target": "window",
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "keyup",
+                "method": "handleGlobalKeyUp",
+                "target": "window",
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "listItemClick",
+                "method": "handleItemClick",
+                "target": undefined,
+                "capture": false,
+                "passive": false
+            }];
+    }
+}