@ngstarter-ui/components 1.0.37 → 1.0.38

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -123,7 +123,7 @@ class KanbanBoard {
123
123
  this._itemWidth = targetRect.width;
124
124
  }
125
125
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KanbanBoard, deps: [], target: i0.ɵɵFactoryTarget.Component });
126
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KanbanBoard, isStandalone: true, selector: "ngs-kanban-board", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, colors: { classPropertyName: "colors", publicName: "colors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { columnEdit: "columnEdit", columnDelete: "columnDelete", itemAdd: "itemAdd", itemClick: "itemClick", itemDropped: "itemDropped", itemSorted: "itemSorted", itemTransferred: "itemTransferred" }, host: { properties: { "class.is-dragging-active": "isDraggingActive" }, classAttribute: "ngs-kanban-board" }, queries: [{ propertyName: "_itemTplDef", first: true, predicate: KanbanItemDefDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "_headerContainer", first: true, predicate: ["headerContainer"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "_scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, read: ElementRef, isSignal: true }], exportAs: ["ngsKanbanBoard"], ngImport: i0, template: "<ngs-panel class=\"h-full\">\n <ngs-panel-header class=\"header\">\n <div class=\"flex flex-nowrap h-full items-center header-container\" #headerContainer>\n @for (column of columns(); track column; let index = $index) {\n <div class=\"h-full header-column relative flex gap-2 items-center justify-between flex-none\">\n <div class=\"flex gap-2 items-center uppercase text-sm\">\n @if (column.color) {\n <div class=\"size-3 rounded-full\" [style.background-color]=\"column.color\"></div>\n }\n {{ column.name }} ({{ column.items.length }})\n </div>\n <div class=\"flex gap-0.5 items-center\">\n <button ngsIconButton (click)=\"itemAdd.emit()\">\n <ngs-icon name=\"fluent:add-24-regular\"/>\n </button>\n <button ngsIconButton [ngsMenuTriggerFor]=\"columnMenu\">\n <ngs-icon name=\"fluent:more-horizontal-24-regular\"/>\n </button>\n </div>\n\n @if (_hasVerticalScroll()) {\n <div class=\"h-px bg-surface-container absolute bottom-0 start-0 end-0\"></div>\n }\n\n <ngs-menu #columnMenu=\"ngsMenu\">\n <button ngs-menu-item (click)=\"columnEdit.emit(column)\">\n <ngs-icon name=\"fluent:share-24-regular\"/>\n <span>Edit</span>\n </button>\n <button ngs-menu-item (click)=\"columnDelete.emit({ column, index })\">\n <ngs-icon name=\"fluent:delete-24-regular\"/>\n <span>Delete</span>\n </button>\n </ngs-menu>\n </div>\n }\n </div>\n </ngs-panel-header>\n <ngs-panel-content class=\"relative overflow-hidden\">\n <div #scrollContainer\n class=\"scroll-container h-full absolute overflow-auto inset-0 flex body items-baseline\">\n <div #scrollContainerContent\n class=\"flex min-h-full flex-nowrap column\" cdkDropListGroup>\n @for (column of columns(); track column) {\n <div class=\"column-container bg-surface-container-low flex-none rounded-2xl p-3 min-h-full flex flex-col gap-3\"\n cdkDropList\n [cdkDropListData]=\"column.items\"\n (cdkDropListDropped)=\"onDropped($event)\">\n @for (item of column.items; track item) {\n <div #element\n class=\"kanban-item bg-surface-container-lowest flex-none rounded-2xl\n p-3 shadow-sm cursor-pointer hover:outline-2 hover:outline-primary\"\n cdkDrag [cdkDragData]=\"item\" ngsRipple\n (mousedown)=\"itemMousedown($event)\"\n (click)=\"itemClick.emit(item)\"\n (cdkDragStarted)=\"onDragStarted($event, element)\"\n (cdkDragMoved)=\"onDragMoved($event)\"\n (cdkDragEnded)=\"onDragEnded($event)\">\n <ng-container [ngTemplateOutlet]=\"_itemTplDef().templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item, column }\"/>\n </div>\n }\n </div>\n }\n </div>\n </div>\n </ngs-panel-content>\n</ngs-panel>\n", styles: [":host{--ngs-kanban-board-col-width: calc(var(--spacing, .25rem) * 72);--ngs-kanban-board-padding-x: calc(var(--spacing, .25rem) * 10);--ngs-kanban-board-column-gap: calc(var(--spacing, .25rem) * 5);height:100%}:host .header{padding:0 var(--ngs-kanban-board-padding-x);overflow:hidden}:host .header-container{gap:var(--ngs-kanban-board-column-gap)}:host .header-column{width:var(--ngs-kanban-board-col-width);flex:none}:host .body{gap:var(--ngs-kanban-board-column-gap);padding:0 var(--ngs-kanban-board-padding-x)}:host .column{padding-bottom:var(--ngs-kanban-board-column-gap);gap:var(--ngs-kanban-board-column-gap)}:host .column-container{width:var(--ngs-kanban-board-col-width);flex:none}:host .cdk-drag-placeholder{opacity:60%}:host.is-dragging-active .scroll-container{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}:host.is-dragging-active .kanban-item:hover{outline:none}.kanban-item.cdk-drag-preview{background:var(--ngs-color-surface-container-lowest);padding:calc(var(--spacing, .25rem) * 3);cursor:pointer;flex:none;box-shadow:var(--ngs-shadow-sm);border-radius:var(--ngs-radius-xl)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "component", type: Icon, selector: "ngs-icon", inputs: ["name"], exportAs: ["ngsIcon"] }, { kind: "directive", type: Ripple, selector: "[ngsRipple]", inputs: ["ngsRippleColor", "ngsRippleUnbounded", "ngsRippleCentered", "ngsRippleRadius", "ngsRippleAnimation", "ngsRippleDisabled", "ngsRippleTrigger"], outputs: ["ngsRippleCenteredChange", "ngsRippleDisabledChange", "ngsRippleTriggerChange"], exportAs: ["ngsRipple"] }, { kind: "component", type: PanelContent, selector: "ngs-panel-content", exportAs: ["ngsPanelContent"] }, { kind: "component", type: Panel, selector: "ngs-panel", inputs: ["absolute"], exportAs: ["ngsPanel"] }, { kind: "component", type: PanelHeader, selector: "ngs-panel-header", inputs: ["autoHeight"], exportAs: ["ngsPanelHeader"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: Menu, selector: "ngs-menu", inputs: ["role", "classList", "xPosition", "yPosition"], outputs: ["closed"], exportAs: ["ngsMenu"] }, { kind: "component", type: MenuItem, selector: "ngs-menu-item, [ngs-menu-item]", inputs: ["disabled", "role", "selected"], outputs: ["_triggered"], exportAs: ["ngsMenuItem"] }, { kind: "directive", type: MenuTrigger, selector: "[ngsMenuTriggerFor]", inputs: ["ngsMenuTriggerFor", "ngsMenuTriggerData", "ngsMenuDisabled", "xPosition", "yPosition", "ngsMenuTriggerRestoreFocus"], outputs: ["menuOpened", "menuClosed"], exportAs: ["ngsMenuTrigger"] }, { kind: "component", type: Button, selector: " button[ngsButton], button[ngsIconButton], a[ngsButton], a[ngsIconButton] ", inputs: ["ngsButton", "ngsIconButton", "loading", "disabled", "disabledInteractive", "disableRipple", "reverse", "fullWidth", "hideTextOnMobile"], exportAs: ["ngsButton"] }] });
126
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.4", type: KanbanBoard, isStandalone: true, selector: "ngs-kanban-board", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, colors: { classPropertyName: "colors", publicName: "colors", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { columnEdit: "columnEdit", columnDelete: "columnDelete", itemAdd: "itemAdd", itemClick: "itemClick", itemDropped: "itemDropped", itemSorted: "itemSorted", itemTransferred: "itemTransferred" }, host: { properties: { "class.is-dragging-active": "isDraggingActive" }, classAttribute: "ngs-kanban-board" }, queries: [{ propertyName: "_itemTplDef", first: true, predicate: KanbanItemDefDirective, descendants: true, isSignal: true }], viewQueries: [{ propertyName: "_headerContainer", first: true, predicate: ["headerContainer"], descendants: true, read: ElementRef, isSignal: true }, { propertyName: "_scrollContainer", first: true, predicate: ["scrollContainer"], descendants: true, read: ElementRef, isSignal: true }], exportAs: ["ngsKanbanBoard"], ngImport: i0, template: "<ngs-panel class=\"h-full\">\n <ngs-panel-header class=\"header\">\n <div class=\"flex flex-nowrap h-full items-center header-container\" #headerContainer>\n @for (column of columns(); track column; let index = $index) {\n <div class=\"h-full header-column relative flex gap-2 items-center justify-between flex-none\">\n <div class=\"flex gap-2 items-center uppercase text-sm\">\n @if (column.color) {\n <div class=\"size-3 rounded-full\" [style.background-color]=\"column.color\"></div>\n }\n {{ column.name }} ({{ column.items.length }})\n </div>\n <div class=\"flex gap-0.5 items-center\">\n <button ngsIconButton (click)=\"itemAdd.emit()\">\n <ngs-icon name=\"fluent:add-24-regular\"/>\n </button>\n <button ngsIconButton [ngsMenuTriggerFor]=\"columnMenu\">\n <ngs-icon name=\"fluent:more-horizontal-24-regular\"/>\n </button>\n </div>\n\n @if (_hasVerticalScroll()) {\n <div class=\"h-px bg-surface-container absolute bottom-0 start-0 end-0\"></div>\n }\n\n <ngs-menu #columnMenu=\"ngsMenu\">\n <button ngs-menu-item (click)=\"columnEdit.emit(column)\">\n <ngs-icon name=\"fluent:share-24-regular\"/>\n <span>Edit</span>\n </button>\n <button ngs-menu-item (click)=\"columnDelete.emit({ column, index })\">\n <ngs-icon name=\"fluent:delete-24-regular\"/>\n <span>Delete</span>\n </button>\n </ngs-menu>\n </div>\n }\n </div>\n </ngs-panel-header>\n <ngs-panel-content class=\"relative overflow-hidden\">\n <div #scrollContainer\n class=\"scroll-container h-full absolute overflow-auto inset-0 flex body items-baseline\">\n <div #scrollContainerContent\n class=\"flex min-h-full flex-nowrap column\" cdkDropListGroup>\n @for (column of columns(); track column) {\n <div class=\"column-container bg-surface-container-low flex-none rounded-2xl p-3 min-h-full flex flex-col gap-3\"\n cdkDropList\n [cdkDropListData]=\"column.items\"\n (cdkDropListDropped)=\"onDropped($event)\">\n @for (item of column.items; track item) {\n <div #element\n class=\"kanban-item bg-surface-container-lowest flex-none rounded-2xl\n p-3 shadow-sm cursor-pointer hover:outline-2 hover:outline-primary\"\n cdkDrag [cdkDragData]=\"item\" ngsRipple\n (mousedown)=\"itemMousedown($event)\"\n (click)=\"itemClick.emit(item)\"\n (cdkDragStarted)=\"onDragStarted($event, element)\"\n (cdkDragMoved)=\"onDragMoved($event)\"\n (cdkDragEnded)=\"onDragEnded($event)\">\n <ng-container [ngTemplateOutlet]=\"_itemTplDef().templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item, column }\"/>\n </div>\n }\n </div>\n }\n </div>\n </div>\n </ngs-panel-content>\n</ngs-panel>\n", styles: [":host{--ngs-kanban-board-col-width: calc(var(--spacing, .25rem) * 72);--ngs-kanban-board-padding-x: calc(var(--spacing, .25rem) * 10);--ngs-kanban-board-column-gap: calc(var(--spacing, .25rem) * 5);height:100%}:host .header{padding:0 var(--ngs-kanban-board-padding-x);overflow:hidden}:host .header-container{gap:var(--ngs-kanban-board-column-gap)}:host .header-column{width:var(--ngs-kanban-board-col-width);flex:none}:host .body{gap:var(--ngs-kanban-board-column-gap);padding:0 var(--ngs-kanban-board-padding-x)}:host .column{padding-bottom:var(--ngs-kanban-board-column-gap);gap:var(--ngs-kanban-board-column-gap)}:host .column-container{width:var(--ngs-kanban-board-col-width);flex:none}:host .cdk-drag-placeholder{opacity:60%}:host.is-dragging-active .scroll-container{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}:host.is-dragging-active .kanban-item:hover{outline:none}.kanban-item.cdk-drag-preview{background:var(--ngs-color-surface-container-lowest);padding:calc(var(--spacing, .25rem) * 3);cursor:pointer;flex:none;box-shadow:var(--ngs-shadow-sm);border-radius:var(--ngs-radius-xl)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer", "cdkDropListHasAnchor"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: CdkDropListGroup, selector: "[cdkDropListGroup]", inputs: ["cdkDropListGroupDisabled"], exportAs: ["cdkDropListGroup"] }, { kind: "component", type: Icon, selector: "ngs-icon", inputs: ["name"], exportAs: ["ngsIcon"] }, { kind: "directive", type: Ripple, selector: "[ngsRipple]", inputs: ["ngsRippleColor", "ngsRippleUnbounded", "ngsRippleCentered", "ngsRippleRadius", "ngsRippleAnimation", "ngsRippleDisabled", "ngsRippleTrigger"], outputs: ["ngsRippleCenteredChange", "ngsRippleDisabledChange", "ngsRippleTriggerChange"], exportAs: ["ngsRipple"] }, { kind: "component", type: PanelContent, selector: "ngs-panel-content", exportAs: ["ngsPanelContent"] }, { kind: "component", type: Panel, selector: "ngs-panel", inputs: ["absolute"], exportAs: ["ngsPanel"] }, { kind: "component", type: PanelHeader, selector: "ngs-panel-header", inputs: ["flex", "autoHeight"], exportAs: ["ngsPanelHeader"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: Menu, selector: "ngs-menu", inputs: ["role", "classList", "xPosition", "yPosition"], outputs: ["closed"], exportAs: ["ngsMenu"] }, { kind: "component", type: MenuItem, selector: "ngs-menu-item, [ngs-menu-item]", inputs: ["disabled", "role", "selected"], outputs: ["_triggered"], exportAs: ["ngsMenuItem"] }, { kind: "directive", type: MenuTrigger, selector: "[ngsMenuTriggerFor]", inputs: ["ngsMenuTriggerFor", "ngsMenuTriggerData", "ngsMenuDisabled", "xPosition", "yPosition", "ngsMenuTriggerRestoreFocus"], outputs: ["menuOpened", "menuClosed"], exportAs: ["ngsMenuTrigger"] }, { kind: "component", type: Button, selector: " button[ngsButton], button[ngsIconButton], a[ngsButton], a[ngsIconButton] ", inputs: ["ngsButton", "ngsIconButton", "loading", "disabled", "disabledInteractive", "disableRipple", "reverse", "fullWidth", "hideTextOnMobile"], exportAs: ["ngsButton"] }] });
127
127
  }
128
128
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: KanbanBoard, decorators: [{
129
129
  type: Component,
@@ -1 +1 @@
1
- {"version":3,"file":"ngstarter-ui-components-kanban-board.mjs","sources":["../../../projects/components/kanban-board/src/kanban-item-def.directive.ts","../../../projects/components/kanban-board/src/kanban-board/kanban-board.ts","../../../projects/components/kanban-board/src/kanban-board/kanban-board.html","../../../projects/components/kanban-board/ngstarter-ui-components-kanban-board.ts"],"sourcesContent":["import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsKanbanItemDef]'\n})\nexport class KanbanItemDefDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import {\n Component,\n contentChild, DestroyRef,\n ElementRef,\n inject,\n input, OnInit,\n output,\n Renderer2,\n signal,\n viewChild\n} from '@angular/core';\nimport {\n CdkDrag,\n CdkDragDrop, CdkDragEnd, CdkDragMove, CdkDragStart,\n CdkDropList,\n CdkDropListGroup,\n moveItemInArray,\n transferArrayItem\n} from '@angular/cdk/drag-drop';\nimport { Icon } from '@ngstarter-ui/components/icon';\nimport { Ripple } from '@ngstarter-ui/components/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { Menu, MenuItem, MenuTrigger } from '@ngstarter-ui/components/menu';\nimport { PanelContent, Panel, PanelHeader } from '@ngstarter-ui/components/panel';\nimport { KanbanColumn, KanbanItem, KanbanItemSortedEvent, KanbanItemTransferredEvent } from '../types';\nimport { KanbanItemDefDirective } from '../kanban-item-def.directive';\nimport { fromEvent } from 'rxjs';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { Button } from '@ngstarter-ui/components/button';\n\n@Component({\n selector: 'ngs-kanban-board',\n exportAs: 'ngsKanbanBoard',\n imports: [\n CdkDrag,\n CdkDropList,\n CdkDropListGroup,\n Icon,\n\n Ripple,\n PanelContent,\n Panel,\n PanelHeader,\n NgTemplateOutlet,\n FormsModule,\n Menu,\n MenuItem,\n MenuTrigger,\n Button\n ],\n templateUrl: './kanban-board.html',\n styleUrl: './kanban-board.scss',\n host: {\n 'class': 'ngs-kanban-board',\n '[class.is-dragging-active]': 'isDraggingActive'\n }\n})\nexport class KanbanBoard<T extends KanbanColumn<K>, K extends KanbanItem> implements OnInit {\n protected _itemTplDef = contentChild.required(KanbanItemDefDirective);\n private _headerContainer = viewChild.required('headerContainer', { read: ElementRef });\n private _scrollContainer = viewChild.required('scrollContainer', { read: ElementRef });\n private _renderer = inject(Renderer2);\n private _destroyRef = inject(DestroyRef);\n\n columns = input<T[]>([]);\n colors = input<string[]>([]);\n\n protected _hasVerticalScroll = signal(false);\n\n readonly columnEdit = output<T>();\n readonly columnDelete = output<{ column: T, index: number }>();\n readonly itemAdd = output<void>();\n readonly itemClick = output<K>();\n readonly itemDropped = output<CdkDragDrop<K[]>>();\n readonly itemSorted = output<KanbanItemSortedEvent>();\n readonly itemTransferred = output<KanbanItemTransferredEvent<K>>();\n\n private _startContainerXOffset = 0;\n private _itemXOffset = 0;\n private _itemWidth = 0;\n protected isDraggingActive = false;\n private _autoScrollStarted = false;\n\n ngOnInit() {\n fromEvent(this._scrollContainer().nativeElement, 'scroll')\n .pipe(\n takeUntilDestroyed(this._destroyRef)\n )\n .subscribe((event: any) => {\n this.onScroll(event);\n });\n }\n\n onDropped(event: CdkDragDrop<K[]>) {\n this.itemDropped.emit(event);\n\n if (event.previousContainer === event.container) {\n this.itemSorted.emit({\n previousIndex: event.previousIndex,\n currentIndex: event.currentIndex\n });\n moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);\n } else {\n this.itemTransferred.emit({\n previousContainerData: event.previousContainer.data,\n currentContainerData: event.container.data,\n previousIndex: event.previousIndex,\n currentIndex: event.currentIndex\n });\n transferArrayItem(\n event.previousContainer.data,\n event.container.data,\n event.previousIndex,\n event.currentIndex,\n );\n }\n }\n\n onScroll(event: Event) {\n const target = event.target as HTMLElement;\n const headerContainerElement = this._headerContainer().nativeElement as HTMLElement;\n this._renderer.setStyle(headerContainerElement, 'transform', `translate(-${target.scrollLeft}px, 0)`);\n this._hasVerticalScroll.set(target.scrollTop > 0);\n }\n\n onDragStarted(event: CdkDragStart, element: HTMLElement) {\n this.isDraggingActive = true;\n }\n\n onDragMoved(event: CdkDragMove<K>) {\n const space = 100;\n const scrollContainer = this._scrollContainer().nativeElement as HTMLElement;\n const scrollContainerWidth = scrollContainer.getBoundingClientRect().width;\n const itemOffsetXStart = this._startContainerXOffset + event.distance.x;\n const itemOffsetXEnd = this._startContainerXOffset + event.distance.x + this._itemWidth;\n\n if (!this._autoScrollStarted) {\n if (itemOffsetXEnd + space >= scrollContainerWidth) {\n this._autoScrollStarted = true;\n scrollContainer.scroll({\n left: scrollContainer.scrollLeft + this._itemWidth * 2,\n behavior: 'smooth'\n });\n setTimeout(() => {\n this._autoScrollStarted = false;\n }, 500);\n } else if (itemOffsetXStart <= space && scrollContainer.scrollLeft > 0) {\n this._autoScrollStarted = true;\n scrollContainer.scroll({\n left: scrollContainer.scrollLeft - this._itemWidth * 2,\n behavior: 'smooth'\n });\n setTimeout(() => {\n this._autoScrollStarted = false;\n }, 500);\n }\n }\n }\n\n onDragEnded(event: CdkDragEnd) {\n this.isDraggingActive = false;\n }\n\n protected itemMousedown(event: MouseEvent) {\n const scrollContainerElement = this._scrollContainer().nativeElement as HTMLElement;\n let targetElement = event.target as Element;\n\n if (!targetElement.classList.contains('kanban-item')) {\n targetElement = targetElement.closest('.kanban-item') as HTMLElement;\n }\n\n const targetRect = targetElement.getBoundingClientRect();\n this._startContainerXOffset = targetRect.x - scrollContainerElement.getBoundingClientRect().x;\n this._itemXOffset = event.clientX - targetRect.x;\n this._itemWidth = targetRect.width;\n }\n}\n","<ngs-panel class=\"h-full\">\n <ngs-panel-header class=\"header\">\n <div class=\"flex flex-nowrap h-full items-center header-container\" #headerContainer>\n @for (column of columns(); track column; let index = $index) {\n <div class=\"h-full header-column relative flex gap-2 items-center justify-between flex-none\">\n <div class=\"flex gap-2 items-center uppercase text-sm\">\n @if (column.color) {\n <div class=\"size-3 rounded-full\" [style.background-color]=\"column.color\"></div>\n }\n {{ column.name }} ({{ column.items.length }})\n </div>\n <div class=\"flex gap-0.5 items-center\">\n <button ngsIconButton (click)=\"itemAdd.emit()\">\n <ngs-icon name=\"fluent:add-24-regular\"/>\n </button>\n <button ngsIconButton [ngsMenuTriggerFor]=\"columnMenu\">\n <ngs-icon name=\"fluent:more-horizontal-24-regular\"/>\n </button>\n </div>\n\n @if (_hasVerticalScroll()) {\n <div class=\"h-px bg-surface-container absolute bottom-0 start-0 end-0\"></div>\n }\n\n <ngs-menu #columnMenu=\"ngsMenu\">\n <button ngs-menu-item (click)=\"columnEdit.emit(column)\">\n <ngs-icon name=\"fluent:share-24-regular\"/>\n <span>Edit</span>\n </button>\n <button ngs-menu-item (click)=\"columnDelete.emit({ column, index })\">\n <ngs-icon name=\"fluent:delete-24-regular\"/>\n <span>Delete</span>\n </button>\n </ngs-menu>\n </div>\n }\n </div>\n </ngs-panel-header>\n <ngs-panel-content class=\"relative overflow-hidden\">\n <div #scrollContainer\n class=\"scroll-container h-full absolute overflow-auto inset-0 flex body items-baseline\">\n <div #scrollContainerContent\n class=\"flex min-h-full flex-nowrap column\" cdkDropListGroup>\n @for (column of columns(); track column) {\n <div class=\"column-container bg-surface-container-low flex-none rounded-2xl p-3 min-h-full flex flex-col gap-3\"\n cdkDropList\n [cdkDropListData]=\"column.items\"\n (cdkDropListDropped)=\"onDropped($event)\">\n @for (item of column.items; track item) {\n <div #element\n class=\"kanban-item bg-surface-container-lowest flex-none rounded-2xl\n p-3 shadow-sm cursor-pointer hover:outline-2 hover:outline-primary\"\n cdkDrag [cdkDragData]=\"item\" ngsRipple\n (mousedown)=\"itemMousedown($event)\"\n (click)=\"itemClick.emit(item)\"\n (cdkDragStarted)=\"onDragStarted($event, element)\"\n (cdkDragMoved)=\"onDragMoved($event)\"\n (cdkDragEnded)=\"onDragEnded($event)\">\n <ng-container [ngTemplateOutlet]=\"_itemTplDef().templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item, column }\"/>\n </div>\n }\n </div>\n }\n </div>\n </div>\n </ngs-panel-content>\n</ngs-panel>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;MAKa,sBAAsB,CAAA;AACxB,IAAA,WAAW,GAAG,MAAM,CAAC,WAAW,CAAC;uGAD/B,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;2FAAtB,sBAAsB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,QAAA,EAAA,EAAA,EAAA,CAAA;;2FAAtB,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAHlC,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACT,oBAAA,QAAQ,EAAE;AACX,iBAAA;;;MCsDY,WAAW,CAAA;AACZ,IAAA,WAAW,GAAG,YAAY,CAAC,QAAQ,CAAC,sBAAsB,CAAC;AAC7D,IAAA,gBAAgB,GAAG,SAAS,CAAC,QAAQ,CAAC,iBAAiB,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;AAC9E,IAAA,gBAAgB,GAAG,SAAS,CAAC,QAAQ,CAAC,iBAAiB,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC;AAC9E,IAAA,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC;AAC7B,IAAA,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC;AAExC,IAAA,OAAO,GAAG,KAAK,CAAM,EAAE,8EAAC;AACxB,IAAA,MAAM,GAAG,KAAK,CAAW,EAAE,6EAAC;AAElB,IAAA,kBAAkB,GAAG,MAAM,CAAC,KAAK,yFAAC;IAEnC,UAAU,GAAG,MAAM,EAAK;IACxB,YAAY,GAAG,MAAM,EAAgC;IACrD,OAAO,GAAG,MAAM,EAAQ;IACxB,SAAS,GAAG,MAAM,EAAK;IACvB,WAAW,GAAG,MAAM,EAAoB;IACxC,UAAU,GAAG,MAAM,EAAyB;IAC5C,eAAe,GAAG,MAAM,EAAiC;IAE1D,sBAAsB,GAAG,CAAC;IAC1B,YAAY,GAAG,CAAC;IAChB,UAAU,GAAG,CAAC;IACZ,gBAAgB,GAAG,KAAK;IAC1B,kBAAkB,GAAG,KAAK;IAElC,QAAQ,GAAA;QACN,SAAS,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC,aAAa,EAAE,QAAQ;AACtD,aAAA,IAAI,CACH,kBAAkB,CAAC,IAAI,CAAC,WAAW,CAAC;AAErC,aAAA,SAAS,CAAC,CAAC,KAAU,KAAI;AACxB,YAAA,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC;AACtB,QAAA,CAAC,CAAC;IACN;AAEA,IAAA,SAAS,CAAC,KAAuB,EAAA;AAC/B,QAAA,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC;QAE5B,IAAI,KAAK,CAAC,iBAAiB,KAAK,KAAK,CAAC,SAAS,EAAE;AAC/C,YAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;gBACnB,aAAa,EAAE,KAAK,CAAC,aAAa;gBAClC,YAAY,EAAE,KAAK,CAAC;AACrB,aAAA,CAAC;AACF,YAAA,eAAe,CAAC,KAAK,CAAC,SAAS,CAAC,IAAI,EAAE,KAAK,CAAC,aAAa,EAAE,KAAK,CAAC,YAAY,CAAC;QAChF;aAAO;AACL,YAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC;AACxB,gBAAA,qBAAqB,EAAE,KAAK,CAAC,iBAAiB,CAAC,IAAI;AACnD,gBAAA,oBAAoB,EAAE,KAAK,CAAC,SAAS,CAAC,IAAI;gBAC1C,aAAa,EAAE,KAAK,CAAC,aAAa;gBAClC,YAAY,EAAE,KAAK,CAAC;AACrB,aAAA,CAAC;YACF,iBAAiB,CACf,KAAK,CAAC,iBAAiB,CAAC,IAAI,EAC5B,KAAK,CAAC,SAAS,CAAC,IAAI,EACpB,KAAK,CAAC,aAAa,EACnB,KAAK,CAAC,YAAY,CACnB;QACH;IACF;AAEA,IAAA,QAAQ,CAAC,KAAY,EAAA;AACnB,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB;QAC1C,MAAM,sBAAsB,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC,aAA4B;AACnF,QAAA,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,sBAAsB,EAAE,WAAW,EAAE,cAAc,MAAM,CAAC,UAAU,CAAA,MAAA,CAAQ,CAAC;QACrG,IAAI,CAAC,kBAAkB,CAAC,GAAG,CAAC,MAAM,CAAC,SAAS,GAAG,CAAC,CAAC;IACnD;IAEA,aAAa,CAAC,KAAmB,EAAE,OAAoB,EAAA;AACrD,QAAA,IAAI,CAAC,gBAAgB,GAAG,IAAI;IAC9B;AAEA,IAAA,WAAW,CAAC,KAAqB,EAAA;QAC/B,MAAM,KAAK,GAAG,GAAG;QACjB,MAAM,eAAe,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC,aAA4B;QAC5E,MAAM,oBAAoB,GAAG,eAAe,CAAC,qBAAqB,EAAE,CAAC,KAAK;QAC1E,MAAM,gBAAgB,GAAG,IAAI,CAAC,sBAAsB,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC;AACvE,QAAA,MAAM,cAAc,GAAG,IAAI,CAAC,sBAAsB,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,GAAG,IAAI,CAAC,UAAU;AAEvF,QAAA,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE;AAC5B,YAAA,IAAI,cAAc,GAAG,KAAK,IAAI,oBAAoB,EAAE;AAClD,gBAAA,IAAI,CAAC,kBAAkB,GAAG,IAAI;gBAC9B,eAAe,CAAC,MAAM,CAAC;oBACrB,IAAI,EAAE,eAAe,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,GAAG,CAAC;AACtD,oBAAA,QAAQ,EAAE;AACX,iBAAA,CAAC;gBACF,UAAU,CAAC,MAAK;AACd,oBAAA,IAAI,CAAC,kBAAkB,GAAG,KAAK;gBACjC,CAAC,EAAE,GAAG,CAAC;YACT;iBAAO,IAAI,gBAAgB,IAAI,KAAK,IAAI,eAAe,CAAC,UAAU,GAAG,CAAC,EAAE;AACtE,gBAAA,IAAI,CAAC,kBAAkB,GAAG,IAAI;gBAC9B,eAAe,CAAC,MAAM,CAAC;oBACrB,IAAI,EAAE,eAAe,CAAC,UAAU,GAAG,IAAI,CAAC,UAAU,GAAG,CAAC;AACtD,oBAAA,QAAQ,EAAE;AACX,iBAAA,CAAC;gBACF,UAAU,CAAC,MAAK;AACd,oBAAA,IAAI,CAAC,kBAAkB,GAAG,KAAK;gBACjC,CAAC,EAAE,GAAG,CAAC;YACT;QACF;IACF;AAEA,IAAA,WAAW,CAAC,KAAiB,EAAA;AAC3B,QAAA,IAAI,CAAC,gBAAgB,GAAG,KAAK;IAC/B;AAEU,IAAA,aAAa,CAAC,KAAiB,EAAA;QACvC,MAAM,sBAAsB,GAAG,IAAI,CAAC,gBAAgB,EAAE,CAAC,aAA4B;AACnF,QAAA,IAAI,aAAa,GAAG,KAAK,CAAC,MAAiB;QAE3C,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE;AACpD,YAAA,aAAa,GAAG,aAAa,CAAC,OAAO,CAAC,cAAc,CAAgB;QACtE;AAEA,QAAA,MAAM,UAAU,GAAG,aAAa,CAAC,qBAAqB,EAAE;AACxD,QAAA,IAAI,CAAC,sBAAsB,GAAG,UAAU,CAAC,CAAC,GAAG,sBAAsB,CAAC,qBAAqB,EAAE,CAAC,CAAC;QAC7F,IAAI,CAAC,YAAY,GAAG,KAAK,CAAC,OAAO,GAAG,UAAU,CAAC,CAAC;AAChD,QAAA,IAAI,CAAC,UAAU,GAAG,UAAU,CAAC,KAAK;IACpC;uGAtHW,WAAW,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA;AAAX,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,WAAW,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,kBAAA,EAAA,MAAA,EAAA,EAAA,OAAA,EAAA,EAAA,iBAAA,EAAA,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,UAAA,EAAA,YAAA,EAAA,YAAA,EAAA,cAAA,EAAA,OAAA,EAAA,SAAA,EAAA,SAAA,EAAA,WAAA,EAAA,WAAA,EAAA,aAAA,EAAA,UAAA,EAAA,YAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,0BAAA,EAAA,kBAAA,EAAA,EAAA,cAAA,EAAA,kBAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,aAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EACwB,sBAAsB,EAAA,WAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,YAAA,EAAA,kBAAA,EAAA,KAAA,EAAA,IAAA,EAAA,SAAA,EAAA,CAAA,iBAAA,CAAA,EAAA,WAAA,EAAA,IAAA,EAAA,IAAA,EACK,UAAU,8HACV,UAAU,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,CAAA,gBAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EC7DrF,6pGAoEA,EAAA,MAAA,EAAA,CAAA,isCAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDjCI,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,aAAA,EAAA,iBAAA,EAAA,oBAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,yBAAA,EAAA,iBAAA,EAAA,0BAAA,EAAA,qBAAA,EAAA,yBAAA,EAAA,cAAA,CAAA,EAAA,OAAA,EAAA,CAAA,gBAAA,EAAA,iBAAA,EAAA,cAAA,EAAA,gBAAA,EAAA,eAAA,EAAA,gBAAA,EAAA,cAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACP,WAAW,EAAA,QAAA,EAAA,8BAAA,EAAA,MAAA,EAAA,CAAA,wBAAA,EAAA,iBAAA,EAAA,wBAAA,EAAA,IAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,4BAAA,EAAA,2BAAA,EAAA,0BAAA,EAAA,+BAAA,EAAA,2BAAA,EAAA,6BAAA,EAAA,sBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,oBAAA,EAAA,oBAAA,EAAA,mBAAA,EAAA,mBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACX,gBAAgB,qIAChB,IAAI,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,MAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAEJ,MAAM,EAAA,QAAA,EAAA,aAAA,EAAA,MAAA,EAAA,CAAA,gBAAA,EAAA,oBAAA,EAAA,mBAAA,EAAA,iBAAA,EAAA,oBAAA,EAAA,mBAAA,EAAA,kBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,yBAAA,EAAA,yBAAA,EAAA,wBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACN,YAAY,EAAA,QAAA,EAAA,mBAAA,EAAA,QAAA,EAAA,CAAA,iBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACZ,KAAK,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACL,WAAW,mHACX,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAChB,WAAW,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACX,IAAI,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,WAAA,EAAA,WAAA,EAAA,WAAA,CAAA,EAAA,OAAA,EAAA,CAAA,QAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACJ,QAAQ,EAAA,QAAA,EAAA,gCAAA,EAAA,MAAA,EAAA,CAAA,UAAA,EAAA,MAAA,EAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,YAAA,CAAA,EAAA,QAAA,EAAA,CAAA,aAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACR,WAAW,qQACX,MAAM,EAAA,QAAA,EAAA,mFAAA,EAAA,MAAA,EAAA,CAAA,WAAA,EAAA,eAAA,EAAA,SAAA,EAAA,UAAA,EAAA,qBAAA,EAAA,eAAA,EAAA,SAAA,EAAA,WAAA,EAAA,kBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,WAAA,CAAA,EAAA,CAAA,EAAA,CAAA;;2FASG,WAAW,EAAA,UAAA,EAAA,CAAA;kBA3BvB,SAAS;+BACE,kBAAkB,EAAA,QAAA,EAClB,gBAAgB,EAAA,OAAA,EACjB;wBACP,OAAO;wBACP,WAAW;wBACX,gBAAgB;wBAChB,IAAI;wBAEJ,MAAM;wBACN,YAAY;wBACZ,KAAK;wBACL,WAAW;wBACX,gBAAgB;wBAChB,WAAW;wBACX,IAAI;wBACJ,QAAQ;wBACR,WAAW;wBACX;qBACD,EAAA,IAAA,EAGK;AACJ,wBAAA,OAAO,EAAE,kBAAkB;AAC3B,wBAAA,4BAA4B,EAAE;AAC/B,qBAAA,EAAA,QAAA,EAAA,6pGAAA,EAAA,MAAA,EAAA,CAAA,isCAAA,CAAA,EAAA;AAG6C,SAAA,CAAA,EAAA,cAAA,EAAA,EAAA,WAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,UAAA,CAAA,MAAA,sBAAsB,CAAA,EAAA,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,gBAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,IAAA,EAAA,CACtB,iBAAiB,EAAA,EAAA,GAAE,EAAE,IAAI,EAAE,UAAU,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,gBAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,IAAA,EAAA,CACvC,iBAAiB,EAAA,EAAA,GAAE,EAAE,IAAI,EAAE,UAAU,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,OAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,SAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,QAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,UAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,YAAA,CAAA,EAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,cAAA,CAAA,EAAA,CAAA,EAAA,OAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,SAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,WAAA,CAAA,EAAA,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,aAAA,CAAA,EAAA,CAAA,EAAA,UAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,YAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,MAAA,EAAA,IAAA,EAAA,CAAA,iBAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;AE7DvF;;AAEG;;;;"}
1
+ {"version":3,"file":"ngstarter-ui-components-kanban-board.mjs","sources":["../../../projects/components/kanban-board/src/kanban-item-def.directive.ts","../../../projects/components/kanban-board/src/kanban-board/kanban-board.ts","../../../projects/components/kanban-board/src/kanban-board/kanban-board.html","../../../projects/components/kanban-board/ngstarter-ui-components-kanban-board.ts"],"sourcesContent":["import { Directive, inject, TemplateRef } from '@angular/core';\n\n@Directive({\n selector: '[ngsKanbanItemDef]'\n})\nexport class KanbanItemDefDirective {\n readonly templateRef = inject(TemplateRef);\n}\n","import {\n Component,\n contentChild, DestroyRef,\n ElementRef,\n inject,\n input, OnInit,\n output,\n Renderer2,\n signal,\n viewChild\n} from '@angular/core';\nimport {\n CdkDrag,\n CdkDragDrop, CdkDragEnd, CdkDragMove, CdkDragStart,\n CdkDropList,\n CdkDropListGroup,\n moveItemInArray,\n transferArrayItem\n} from '@angular/cdk/drag-drop';\nimport { Icon } from '@ngstarter-ui/components/icon';\nimport { Ripple } from '@ngstarter-ui/components/core';\nimport { NgTemplateOutlet } from '@angular/common';\nimport { FormsModule } from '@angular/forms';\nimport { Menu, MenuItem, MenuTrigger } from '@ngstarter-ui/components/menu';\nimport { PanelContent, Panel, PanelHeader } from '@ngstarter-ui/components/panel';\nimport { KanbanColumn, KanbanItem, KanbanItemSortedEvent, KanbanItemTransferredEvent } from '../types';\nimport { KanbanItemDefDirective } from '../kanban-item-def.directive';\nimport { fromEvent } from 'rxjs';\nimport { takeUntilDestroyed } from '@angular/core/rxjs-interop';\nimport { Button } from '@ngstarter-ui/components/button';\n\n@Component({\n selector: 'ngs-kanban-board',\n exportAs: 'ngsKanbanBoard',\n imports: [\n CdkDrag,\n CdkDropList,\n CdkDropListGroup,\n Icon,\n\n Ripple,\n PanelContent,\n Panel,\n PanelHeader,\n NgTemplateOutlet,\n FormsModule,\n Menu,\n MenuItem,\n MenuTrigger,\n Button\n ],\n templateUrl: './kanban-board.html',\n styleUrl: './kanban-board.scss',\n host: {\n 'class': 'ngs-kanban-board',\n '[class.is-dragging-active]': 'isDraggingActive'\n }\n})\nexport class KanbanBoard<T extends KanbanColumn<K>, K extends KanbanItem> implements OnInit {\n protected _itemTplDef = contentChild.required(KanbanItemDefDirective);\n private _headerContainer = viewChild.required('headerContainer', { read: ElementRef });\n private _scrollContainer = viewChild.required('scrollContainer', { read: ElementRef });\n private _renderer = inject(Renderer2);\n private _destroyRef = inject(DestroyRef);\n\n columns = input<T[]>([]);\n colors = input<string[]>([]);\n\n protected _hasVerticalScroll = signal(false);\n\n readonly columnEdit = output<T>();\n readonly columnDelete = output<{ column: T, index: number }>();\n readonly itemAdd = output<void>();\n readonly itemClick = output<K>();\n readonly itemDropped = output<CdkDragDrop<K[]>>();\n readonly itemSorted = output<KanbanItemSortedEvent>();\n readonly itemTransferred = output<KanbanItemTransferredEvent<K>>();\n\n private _startContainerXOffset = 0;\n private _itemXOffset = 0;\n private _itemWidth = 0;\n protected isDraggingActive = false;\n private _autoScrollStarted = false;\n\n ngOnInit() {\n fromEvent(this._scrollContainer().nativeElement, 'scroll')\n .pipe(\n takeUntilDestroyed(this._destroyRef)\n )\n .subscribe((event: any) => {\n this.onScroll(event);\n });\n }\n\n onDropped(event: CdkDragDrop<K[]>) {\n this.itemDropped.emit(event);\n\n if (event.previousContainer === event.container) {\n this.itemSorted.emit({\n previousIndex: event.previousIndex,\n currentIndex: event.currentIndex\n });\n moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);\n } else {\n this.itemTransferred.emit({\n previousContainerData: event.previousContainer.data,\n currentContainerData: event.container.data,\n previousIndex: event.previousIndex,\n currentIndex: event.currentIndex\n });\n transferArrayItem(\n event.previousContainer.data,\n event.container.data,\n event.previousIndex,\n event.currentIndex,\n );\n }\n }\n\n onScroll(event: Event) {\n const target = event.target as HTMLElement;\n const headerContainerElement = this._headerContainer().nativeElement as HTMLElement;\n this._renderer.setStyle(headerContainerElement, 'transform', `translate(-${target.scrollLeft}px, 0)`);\n this._hasVerticalScroll.set(target.scrollTop > 0);\n }\n\n onDragStarted(event: CdkDragStart, element: HTMLElement) {\n this.isDraggingActive = true;\n }\n\n onDragMoved(event: CdkDragMove<K>) {\n const space = 100;\n const scrollContainer = this._scrollContainer().nativeElement as HTMLElement;\n const scrollContainerWidth = scrollContainer.getBoundingClientRect().width;\n const itemOffsetXStart = this._startContainerXOffset + event.distance.x;\n const itemOffsetXEnd = this._startContainerXOffset + event.distance.x + this._itemWidth;\n\n if (!this._autoScrollStarted) {\n if (itemOffsetXEnd + space >= scrollContainerWidth) {\n this._autoScrollStarted = true;\n scrollContainer.scroll({\n left: scrollContainer.scrollLeft + this._itemWidth * 2,\n behavior: 'smooth'\n });\n setTimeout(() => {\n this._autoScrollStarted = false;\n }, 500);\n } else if (itemOffsetXStart <= space && scrollContainer.scrollLeft > 0) {\n this._autoScrollStarted = true;\n scrollContainer.scroll({\n left: scrollContainer.scrollLeft - this._itemWidth * 2,\n behavior: 'smooth'\n });\n setTimeout(() => {\n this._autoScrollStarted = false;\n }, 500);\n }\n }\n }\n\n onDragEnded(event: CdkDragEnd) {\n this.isDraggingActive = false;\n }\n\n protected itemMousedown(event: MouseEvent) {\n const scrollContainerElement = this._scrollContainer().nativeElement as HTMLElement;\n let targetElement = event.target as Element;\n\n if (!targetElement.classList.contains('kanban-item')) {\n targetElement = targetElement.closest('.kanban-item') as HTMLElement;\n }\n\n const targetRect = targetElement.getBoundingClientRect();\n this._startContainerXOffset = targetRect.x - scrollContainerElement.getBoundingClientRect().x;\n this._itemXOffset = event.clientX - targetRect.x;\n this._itemWidth = targetRect.width;\n }\n}\n","<ngs-panel class=\"h-full\">\n <ngs-panel-header class=\"header\">\n <div class=\"flex flex-nowrap h-full items-center header-container\" #headerContainer>\n @for (column of columns(); track column; let index = $index) {\n <div class=\"h-full header-column relative flex gap-2 items-center justify-between flex-none\">\n <div class=\"flex gap-2 items-center uppercase text-sm\">\n @if (column.color) {\n <div class=\"size-3 rounded-full\" [style.background-color]=\"column.color\"></div>\n }\n {{ column.name }} ({{ column.items.length }})\n </div>\n <div class=\"flex gap-0.5 items-center\">\n <button ngsIconButton (click)=\"itemAdd.emit()\">\n <ngs-icon name=\"fluent:add-24-regular\"/>\n </button>\n <button ngsIconButton [ngsMenuTriggerFor]=\"columnMenu\">\n <ngs-icon name=\"fluent:more-horizontal-24-regular\"/>\n </button>\n </div>\n\n @if (_hasVerticalScroll()) {\n <div class=\"h-px bg-surface-container absolute bottom-0 start-0 end-0\"></div>\n }\n\n <ngs-menu #columnMenu=\"ngsMenu\">\n <button ngs-menu-item (click)=\"columnEdit.emit(column)\">\n <ngs-icon name=\"fluent:share-24-regular\"/>\n <span>Edit</span>\n </button>\n <button ngs-menu-item (click)=\"columnDelete.emit({ column, index })\">\n <ngs-icon name=\"fluent:delete-24-regular\"/>\n <span>Delete</span>\n </button>\n </ngs-menu>\n </div>\n }\n </div>\n </ngs-panel-header>\n <ngs-panel-content class=\"relative overflow-hidden\">\n <div #scrollContainer\n class=\"scroll-container h-full absolute overflow-auto inset-0 flex body items-baseline\">\n <div #scrollContainerContent\n class=\"flex min-h-full flex-nowrap column\" cdkDropListGroup>\n @for (column of columns(); track column) {\n <div class=\"column-container bg-surface-container-low flex-none rounded-2xl p-3 min-h-full flex flex-col gap-3\"\n cdkDropList\n [cdkDropListData]=\"column.items\"\n (cdkDropListDropped)=\"onDropped($event)\">\n @for (item of column.items; track item) {\n <div #element\n class=\"kanban-item bg-surface-container-lowest flex-none rounded-2xl\n p-3 shadow-sm cursor-pointer hover:outline-2 hover:outline-primary\"\n cdkDrag [cdkDragData]=\"item\" ngsRipple\n (mousedown)=\"itemMousedown($event)\"\n (click)=\"itemClick.emit(item)\"\n (cdkDragStarted)=\"onDragStarted($event, element)\"\n (cdkDragMoved)=\"onDragMoved($event)\"\n (cdkDragEnded)=\"onDragEnded($event)\">\n <ng-container [ngTemplateOutlet]=\"_itemTplDef().templateRef\"\n [ngTemplateOutletContext]=\"{ $implicit: item, column }\"/>\n </div>\n }\n </div>\n }\n </div>\n </div>\n </ngs-panel-content>\n</ngs-panel>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -26,17 +26,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
26
26
  }] });
27
27
 
28
28
  class PanelHeader {
29
+ flex = input(false, { ...(ngDevMode ? { debugName: "flex" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
29
30
  autoHeight = input(false, { ...(ngDevMode ? { debugName: "autoHeight" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
30
31
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: PanelHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
31
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: PanelHeader, isStandalone: true, selector: "ngs-panel-header", inputs: { autoHeight: { classPropertyName: "autoHeight", publicName: "autoHeight", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-auto-height": "autoHeight()" }, classAttribute: "ngs-panel-header" }, exportAs: ["ngsPanelHeader"], ngImport: i0, template: "<ng-content />\n", styles: [":host{--ngs-panel-header-height: calc(var(--spacing, .25rem) * 14);flex:none;grid-area:header}:host:not([class*=h-]):not(.is-auto-height){height:var(--ngs-panel-header-height)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
32
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: PanelHeader, isStandalone: true, selector: "ngs-panel-header", inputs: { flex: { classPropertyName: "flex", publicName: "flex", isSignal: true, isRequired: false, transformFunction: null }, autoHeight: { classPropertyName: "autoHeight", publicName: "autoHeight", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-auto-height": "autoHeight()", "class.as-flex": "flex()" }, classAttribute: "ngs-panel-header" }, exportAs: ["ngsPanelHeader"], ngImport: i0, template: "<ng-content />\n", styles: [":host{--ngs-panel-header-height: calc(var(--spacing, .25rem) * 14);flex:none;grid-area:header;width:100%;display:flex;align-items:center}:host:not([class*=h-]):not(.is-auto-height){height:var(--ngs-panel-header-height)}:host.as-block{display:block}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
32
33
  }
33
34
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: PanelHeader, decorators: [{
34
35
  type: Component,
35
36
  args: [{ selector: 'ngs-panel-header', exportAs: 'ngsPanelHeader', host: {
36
37
  'class': 'ngs-panel-header',
37
- '[class.is-auto-height]': 'autoHeight()'
38
- }, template: "<ng-content />\n", styles: [":host{--ngs-panel-header-height: calc(var(--spacing, .25rem) * 14);flex:none;grid-area:header}:host:not([class*=h-]):not(.is-auto-height){height:var(--ngs-panel-header-height)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
39
- }], propDecorators: { autoHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoHeight", required: false }] }] } });
38
+ '[class.is-auto-height]': 'autoHeight()',
39
+ '[class.as-flex]': 'flex()',
40
+ }, template: "<ng-content />\n", styles: [":host{--ngs-panel-header-height: calc(var(--spacing, .25rem) * 14);flex:none;grid-area:header;width:100%;display:flex;align-items:center}:host:not([class*=h-]):not(.is-auto-height){height:var(--ngs-panel-header-height)}:host.as-block{display:block}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
41
+ }], propDecorators: { flex: [{ type: i0.Input, args: [{ isSignal: true, alias: "flex", required: false }] }], autoHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoHeight", required: false }] }] } });
40
42
 
41
43
  class PanelSubheader {
42
44
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: PanelSubheader, deps: [], target: i0.ɵɵFactoryTarget.Component });
@@ -50,17 +52,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
50
52
  }] });
51
53
 
52
54
  class PanelFooter {
55
+ block = input(false, { ...(ngDevMode ? { debugName: "block" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
53
56
  autoHeight = input(false, { ...(ngDevMode ? { debugName: "autoHeight" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
54
57
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: PanelFooter, deps: [], target: i0.ɵɵFactoryTarget.Component });
55
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: PanelFooter, isStandalone: true, selector: "ngs-panel-footer", inputs: { autoHeight: { classPropertyName: "autoHeight", publicName: "autoHeight", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-auto-height": "autoHeight()" }, classAttribute: "ngs-panel-footer" }, exportAs: ["ngsPanelFooter"], ngImport: i0, template: "<ng-content />\n", styles: [":host{--ngs-panel-footer-height: calc(var(--spacing, .25rem) * 14);flex:none;grid-area:footer}:host:not([class*=h-]):not(.is-auto-height){height:var(--ngs-panel-footer-height)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
58
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: PanelFooter, isStandalone: true, selector: "ngs-panel-footer", inputs: { block: { classPropertyName: "block", publicName: "block", isSignal: true, isRequired: false, transformFunction: null }, autoHeight: { classPropertyName: "autoHeight", publicName: "autoHeight", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-auto-height": "autoHeight()", "class.as-block": "block()" }, classAttribute: "ngs-panel-footer" }, exportAs: ["ngsPanelFooter"], ngImport: i0, template: "<ng-content />\n", styles: [":host{--ngs-panel-footer-height: calc(var(--spacing, .25rem) * 14);flex:none;grid-area:footer;display:flex;align-items:center;width:100%}:host:not([class*=h-]):not(.is-auto-height){height:var(--ngs-panel-footer-height)}:host.as-block{display:block}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
56
59
  }
57
60
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: PanelFooter, decorators: [{
58
61
  type: Component,
59
62
  args: [{ selector: 'ngs-panel-footer', exportAs: 'ngsPanelFooter', host: {
60
63
  'class': 'ngs-panel-footer',
61
- '[class.is-auto-height]': 'autoHeight()'
62
- }, template: "<ng-content />\n", styles: [":host{--ngs-panel-footer-height: calc(var(--spacing, .25rem) * 14);flex:none;grid-area:footer}:host:not([class*=h-]):not(.is-auto-height){height:var(--ngs-panel-footer-height)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
63
- }], propDecorators: { autoHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoHeight", required: false }] }] } });
64
+ '[class.is-auto-height]': 'autoHeight()',
65
+ '[class.as-block]': 'block()',
66
+ }, template: "<ng-content />\n", styles: [":host{--ngs-panel-footer-height: calc(var(--spacing, .25rem) * 14);flex:none;grid-area:footer;display:flex;align-items:center;width:100%}:host:not([class*=h-]):not(.is-auto-height){height:var(--ngs-panel-footer-height)}:host.as-block{display:block}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
67
+ }], propDecorators: { block: [{ type: i0.Input, args: [{ isSignal: true, alias: "block", required: false }] }], autoHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoHeight", required: false }] }] } });
64
68
 
65
69
  class Panel {
66
70
  header = contentChild(PanelHeader, ...(ngDevMode ? [{ debugName: "header" }] : /* istanbul ignore next */ []));
@@ -1 +1 @@
1
- {"version":3,"file":"ngstarter-ui-components-panel.mjs","sources":["../../../projects/components/panel/src/panel-sidebar/panel-sidebar.ts","../../../projects/components/panel/src/panel-sidebar/panel-sidebar.html","../../../projects/components/panel/src/panel-aside/panel-aside.ts","../../../projects/components/panel/src/panel-aside/panel-aside.html","../../../projects/components/panel/src/panel-header/panel-header.ts","../../../projects/components/panel/src/panel-header/panel-header.html","../../../projects/components/panel/src/panel-subheader/panel-subheader.ts","../../../projects/components/panel/src/panel-subheader/panel-subheader.html","../../../projects/components/panel/src/panel-footer/panel-footer.ts","../../../projects/components/panel/src/panel-footer/panel-footer.html","../../../projects/components/panel/src/panel/panel.ts","../../../projects/components/panel/src/panel/panel.html","../../../projects/components/panel/src/types.ts","../../../projects/components/panel/src/panel-content/panel-content.ts","../../../projects/components/panel/src/panel-content/panel-content.html","../../../projects/components/panel/ngstarter-ui-components-panel.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-panel-sidebar',\n imports: [],\n templateUrl: './panel-sidebar.html',\n styleUrl: './panel-sidebar.scss',\n host: {\n 'class': 'ngs-panel-sidebar'\n }\n})\nexport class PanelSidebar {\n\n}\n","<ng-content/>\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-panel-aside',\n imports: [],\n templateUrl: './panel-aside.html',\n styleUrl: './panel-aside.scss',\n host: {\n 'class': 'ngs-panel-aside'\n }\n})\nexport class PanelAside {\n\n}\n","<ng-content/>\n","import { booleanAttribute, Component, input } from '@angular/core';\n\n@Component({\n selector: 'ngs-panel-header',\n exportAs: 'ngsPanelHeader',\n templateUrl: './panel-header.html',\n styleUrl: './panel-header.scss',\n host: {\n 'class': 'ngs-panel-header',\n '[class.is-auto-height]': 'autoHeight()'\n }\n})\nexport class PanelHeader {\n autoHeight = input(false, {\n transform: booleanAttribute\n });\n}\n","<ng-content />\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-panel-subheader',\n exportAs: 'ngsPanelSubheader',\n imports: [],\n templateUrl: './panel-subheader.html',\n styleUrl: './panel-subheader.scss',\n host: {\n 'class': 'ngs-panel-subheader'\n }\n})\nexport class PanelSubheader {\n\n}\n","<p>panel-subheader works!</p>\n","import { booleanAttribute, Component, input } from '@angular/core';\n\n@Component({\n selector: 'ngs-panel-footer',\n exportAs: 'ngsPanelFooter',\n templateUrl: './panel-footer.html',\n styleUrl: './panel-footer.scss',\n host: {\n 'class': 'ngs-panel-footer',\n '[class.is-auto-height]': 'autoHeight()'\n }\n})\nexport class PanelFooter {\n autoHeight = input(false, {\n transform: booleanAttribute\n });\n}\n","<ng-content />\n","import { booleanAttribute, Component, contentChild, input } from '@angular/core';\nimport { PanelSidebar } from '../panel-sidebar/panel-sidebar';\nimport { PanelAside } from '../panel-aside/panel-aside';\nimport { PanelHeader } from '../panel-header/panel-header';\nimport { PanelSubheader } from '../panel-subheader/panel-subheader';\nimport { PanelFooter } from '../panel-footer/panel-footer';\n\n@Component({\n selector: 'ngs-panel',\n exportAs: 'ngsPanel',\n templateUrl: './panel.html',\n styleUrl: './panel.scss',\n host: {\n 'class': 'ngs-panel',\n '[class.is-absolute]': 'absolute()',\n '[class.has-header]': 'header()',\n '[class.has-subheader]': 'subheader()',\n '[class.has-sidebar]': 'sidebar()',\n '[class.has-aside]': 'aside()',\n '[class.has-footer]': 'footer()'\n }\n})\nexport class Panel {\n header = contentChild(PanelHeader);\n subheader = contentChild(PanelSubheader);\n sidebar = contentChild(PanelSidebar);\n aside = contentChild(PanelAside);\n footer = contentChild(PanelFooter);\n\n absolute = input(false, {\n transform: booleanAttribute\n });\n}\n","<ng-content select=\"ngs-panel-header\"/>\n<ng-content select=\"ngs-panel-subheader\"/>\n<ng-content select=\"ngs-panel-sidebar\"/>\n<ng-content select=\"ngs-panel-content\"/>\n<ng-content select=\"ngs-panel-aside\"/>\n<ng-content select=\"ngs-panel-footer\"/>\n","import { InjectionToken } from '@angular/core';\nimport { CdkScrollable } from '@angular/cdk/scrolling';\n\nexport interface PanelContentInterface {\n scrollContainer(): HTMLElement;\n scrollable?: CdkScrollable;\n}\n\nexport const PANEL_CONTENT = new InjectionToken<PanelContentInterface>('PANEL_CONTENT');\n\n","import { Component, ElementRef, forwardRef, inject } from '@angular/core';\nimport { PANEL_CONTENT, PanelContentInterface } from '../types';\nimport { CdkScrollable } from '@angular/cdk/scrolling';\n\n@Component({\n selector: 'ngs-panel-content',\n exportAs: 'ngsPanelContent',\n templateUrl: './panel-content.html',\n styleUrl: './panel-content.scss',\n hostDirectives: [\n CdkScrollable\n ],\n providers: [\n {\n provide: PANEL_CONTENT,\n useExisting: forwardRef(() => PanelContent)\n }\n ],\n host: {\n 'class': 'ngs-panel-content'\n }\n})\nexport class PanelContent implements PanelContentInterface {\n private elementRef = inject(ElementRef);\n readonly scrollable = inject(CdkScrollable);\n\n scrollContainer(): HTMLElement {\n return this.elementRef.nativeElement;\n }\n}\n","<ng-content/>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ngstarter-ui-components-panel.mjs","sources":["../../../projects/components/panel/src/panel-sidebar/panel-sidebar.ts","../../../projects/components/panel/src/panel-sidebar/panel-sidebar.html","../../../projects/components/panel/src/panel-aside/panel-aside.ts","../../../projects/components/panel/src/panel-aside/panel-aside.html","../../../projects/components/panel/src/panel-header/panel-header.ts","../../../projects/components/panel/src/panel-header/panel-header.html","../../../projects/components/panel/src/panel-subheader/panel-subheader.ts","../../../projects/components/panel/src/panel-subheader/panel-subheader.html","../../../projects/components/panel/src/panel-footer/panel-footer.ts","../../../projects/components/panel/src/panel-footer/panel-footer.html","../../../projects/components/panel/src/panel/panel.ts","../../../projects/components/panel/src/panel/panel.html","../../../projects/components/panel/src/types.ts","../../../projects/components/panel/src/panel-content/panel-content.ts","../../../projects/components/panel/src/panel-content/panel-content.html","../../../projects/components/panel/ngstarter-ui-components-panel.ts"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-panel-sidebar',\n imports: [],\n templateUrl: './panel-sidebar.html',\n styleUrl: './panel-sidebar.scss',\n host: {\n 'class': 'ngs-panel-sidebar'\n }\n})\nexport class PanelSidebar {\n\n}\n","<ng-content/>\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-panel-aside',\n imports: [],\n templateUrl: './panel-aside.html',\n styleUrl: './panel-aside.scss',\n host: {\n 'class': 'ngs-panel-aside'\n }\n})\nexport class PanelAside {\n\n}\n","<ng-content/>\n","import { booleanAttribute, Component, input } from '@angular/core';\n\n@Component({\n selector: 'ngs-panel-header',\n exportAs: 'ngsPanelHeader',\n templateUrl: './panel-header.html',\n styleUrl: './panel-header.scss',\n host: {\n 'class': 'ngs-panel-header',\n '[class.is-auto-height]': 'autoHeight()',\n '[class.as-flex]': 'flex()',\n }\n})\nexport class PanelHeader {\n flex = input(false, {\n transform: booleanAttribute\n });\n autoHeight = input(false, {\n transform: booleanAttribute\n });\n}\n","<ng-content />\n","import { Component } from '@angular/core';\n\n@Component({\n selector: 'ngs-panel-subheader',\n exportAs: 'ngsPanelSubheader',\n imports: [],\n templateUrl: './panel-subheader.html',\n styleUrl: './panel-subheader.scss',\n host: {\n 'class': 'ngs-panel-subheader'\n }\n})\nexport class PanelSubheader {\n\n}\n","<p>panel-subheader works!</p>\n","import { booleanAttribute, Component, input } from '@angular/core';\n\n@Component({\n selector: 'ngs-panel-footer',\n exportAs: 'ngsPanelFooter',\n templateUrl: './panel-footer.html',\n styleUrl: './panel-footer.scss',\n host: {\n 'class': 'ngs-panel-footer',\n '[class.is-auto-height]': 'autoHeight()',\n '[class.as-block]': 'block()',\n }\n})\nexport class PanelFooter {\n block = input(false, {\n transform: booleanAttribute\n });\n autoHeight = input(false, {\n transform: booleanAttribute\n });\n}\n","<ng-content />\n","import { booleanAttribute, Component, contentChild, input } from '@angular/core';\nimport { PanelSidebar } from '../panel-sidebar/panel-sidebar';\nimport { PanelAside } from '../panel-aside/panel-aside';\nimport { PanelHeader } from '../panel-header/panel-header';\nimport { PanelSubheader } from '../panel-subheader/panel-subheader';\nimport { PanelFooter } from '../panel-footer/panel-footer';\n\n@Component({\n selector: 'ngs-panel',\n exportAs: 'ngsPanel',\n templateUrl: './panel.html',\n styleUrl: './panel.scss',\n host: {\n 'class': 'ngs-panel',\n '[class.is-absolute]': 'absolute()',\n '[class.has-header]': 'header()',\n '[class.has-subheader]': 'subheader()',\n '[class.has-sidebar]': 'sidebar()',\n '[class.has-aside]': 'aside()',\n '[class.has-footer]': 'footer()'\n }\n})\nexport class Panel {\n header = contentChild(PanelHeader);\n subheader = contentChild(PanelSubheader);\n sidebar = contentChild(PanelSidebar);\n aside = contentChild(PanelAside);\n footer = contentChild(PanelFooter);\n\n absolute = input(false, {\n transform: booleanAttribute\n });\n}\n","<ng-content select=\"ngs-panel-header\"/>\n<ng-content select=\"ngs-panel-subheader\"/>\n<ng-content select=\"ngs-panel-sidebar\"/>\n<ng-content select=\"ngs-panel-content\"/>\n<ng-content select=\"ngs-panel-aside\"/>\n<ng-content select=\"ngs-panel-footer\"/>\n","import { InjectionToken } from '@angular/core';\nimport { CdkScrollable } from '@angular/cdk/scrolling';\n\nexport interface PanelContentInterface {\n scrollContainer(): HTMLElement;\n scrollable?: CdkScrollable;\n}\n\nexport const PANEL_CONTENT = new InjectionToken<PanelContentInterface>('PANEL_CONTENT');\n\n","import { Component, ElementRef, forwardRef, inject } from '@angular/core';\nimport { PANEL_CONTENT, PanelContentInterface } from '../types';\nimport { CdkScrollable } from '@angular/cdk/scrolling';\n\n@Component({\n selector: 'ngs-panel-content',\n exportAs: 'ngsPanelContent',\n templateUrl: './panel-content.html',\n styleUrl: './panel-content.scss',\n hostDirectives: [\n CdkScrollable\n ],\n providers: [\n {\n provide: PANEL_CONTENT,\n useExisting: forwardRef(() => PanelContent)\n }\n ],\n host: {\n 'class': 'ngs-panel-content'\n }\n})\nexport class PanelContent implements PanelContentInterface {\n private elementRef = inject(ElementRef);\n readonly scrollable = inject(CdkScrollable);\n\n scrollContainer(): HTMLElement {\n return this.elementRef.nativeElement;\n }\n}\n","<ng-content/>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
@@ -1,41 +1,45 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Component, InjectionToken, inject, ElementRef, input, booleanAttribute, signal, ChangeDetectionStrategy, Directive, contentChildren, contentChild, forwardRef, output, afterNextRender } from '@angular/core';
2
+ import { input, booleanAttribute, Component, InjectionToken, inject, ElementRef, signal, ChangeDetectionStrategy, Directive, contentChildren, contentChild, forwardRef, output, afterNextRender } from '@angular/core';
3
3
  import { NgTemplateOutlet } from '@angular/common';
4
4
  import * as i1 from '@ngstarter-ui/components/core';
5
5
  import { Ripple } from '@ngstarter-ui/components/core';
6
6
  import { signalStore, withState, withMethods, patchState } from '@ngrx/signals';
7
7
 
8
8
  class Sidebar {
9
+ onlyCompact = input(false, { ...(ngDevMode ? { debugName: "onlyCompact" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
9
10
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Sidebar, deps: [], target: i0.ɵɵFactoryTarget.Component });
10
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: Sidebar, isStandalone: true, selector: "ngs-sidebar", host: { classAttribute: "ngs-sidebar" }, exportAs: ["ngsSidebar"], ngImport: i0, template: "<ng-content select=\"ngs-sidebar-header\"/>\n<ng-content select=\"ngs-sidebar-body\"/>\n<ng-content select=\"ngs-sidebar-footer\"/>\n", styles: [":host{--ngs-sidebar-bg: transparent;display:flex;flex-direction:column;overflow-x:hidden;height:100%;width:var(--ngs-sidebar-width);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;background:var(--ngs-sidebar-bg)}:host-context(.ngs-sidenav.is-collapsed:not(:hover)),:host(.compact:not(:hover)){width:var(--ngs-sidenav-collapsed-width, 74px)}:host-context(.ngs-sidenav.is-collapsed:hover),:host(.compact:hover){width:var(--ngs-sidebar-width)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
11
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: Sidebar, isStandalone: true, selector: "ngs-sidebar", inputs: { onlyCompact: { classPropertyName: "onlyCompact", publicName: "onlyCompact", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.only-compact": "onlyCompact()" }, classAttribute: "ngs-sidebar" }, exportAs: ["ngsSidebar"], ngImport: i0, template: "<ng-content select=\"ngs-sidebar-header\"/>\n<ng-content select=\"ngs-sidebar-body\"/>\n<ng-content select=\"ngs-sidebar-footer\"/>\n", styles: [":host{--ngs-sidebar-bg: transparent;display:flex;flex-direction:column;overflow-x:hidden;height:100%;width:var(--ngs-sidebar-width);background:var(--ngs-sidebar-bg)}:host-context(.ngs-sidenav.is-collapsed:not(:hover)),:host(.compact:not(:hover)){width:var(--ngs-sidenav-collapsed-width, 74px)}:host-context(.ngs-sidenav.is-collapsed:hover),:host(.compact:hover){width:var(--ngs-sidebar-width)}:host(.only-compact){width:var(--ngs-sidenav-collapsed-width, 74px)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
11
12
  }
12
13
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Sidebar, decorators: [{
13
14
  type: Component,
14
15
  args: [{ selector: 'ngs-sidebar', exportAs: 'ngsSidebar', host: {
15
16
  'class': 'ngs-sidebar',
16
- }, template: "<ng-content select=\"ngs-sidebar-header\"/>\n<ng-content select=\"ngs-sidebar-body\"/>\n<ng-content select=\"ngs-sidebar-footer\"/>\n", styles: [":host{--ngs-sidebar-bg: transparent;display:flex;flex-direction:column;overflow-x:hidden;height:100%;width:var(--ngs-sidebar-width);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;background:var(--ngs-sidebar-bg)}:host-context(.ngs-sidenav.is-collapsed:not(:hover)),:host(.compact:not(:hover)){width:var(--ngs-sidenav-collapsed-width, 74px)}:host-context(.ngs-sidenav.is-collapsed:hover),:host(.compact:hover){width:var(--ngs-sidebar-width)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
17
- }] });
17
+ '[class.only-compact]': 'onlyCompact()'
18
+ }, template: "<ng-content select=\"ngs-sidebar-header\"/>\n<ng-content select=\"ngs-sidebar-body\"/>\n<ng-content select=\"ngs-sidebar-footer\"/>\n", styles: [":host{--ngs-sidebar-bg: transparent;display:flex;flex-direction:column;overflow-x:hidden;height:100%;width:var(--ngs-sidebar-width);background:var(--ngs-sidebar-bg)}:host-context(.ngs-sidenav.is-collapsed:not(:hover)),:host(.compact:not(:hover)){width:var(--ngs-sidenav-collapsed-width, 74px)}:host-context(.ngs-sidenav.is-collapsed:hover),:host(.compact:hover){width:var(--ngs-sidebar-width)}:host(.only-compact){width:var(--ngs-sidenav-collapsed-width, 74px)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
19
+ }], propDecorators: { onlyCompact: [{ type: i0.Input, args: [{ isSignal: true, alias: "onlyCompact", required: false }] }] } });
18
20
 
19
21
  class SidebarHeader {
22
+ block = input(false, { ...(ngDevMode ? { debugName: "block" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
20
23
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SidebarHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
21
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: SidebarHeader, isStandalone: true, selector: "ngs-sidebar-header", host: { classAttribute: "ngs-sidebar-header" }, exportAs: ["ngsSidebarHeader"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{--ngs-sidebar-header-compact-padding: calc(var(--spacing, .25rem) * 4) 0;flex:none;width:100%}:host ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host-context(.ngs-sidebar.compact:not(:hover)),:host-context(.ngs-sidenav.is-collapsed:not(:hover)){padding:var(--ngs-sidebar-header-compact-padding);display:flex;align-items:center;justify-content:center;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}:host-context(.ngs-sidebar.compact:not(:hover)) ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.compact:not(:hover)) ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) ::ng-deep .ngs-sidebar-compact-view-mode{display:block}:host-context(.ngs-sidebar.compact:hover) ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host-context(.ngs-sidebar.compact:hover) ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) ::ng-deep .ngs-sidebar-full-view-mode{display:block}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
24
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: SidebarHeader, isStandalone: true, selector: "ngs-sidebar-header", inputs: { block: { classPropertyName: "block", publicName: "block", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.as-block": "block()" }, classAttribute: "ngs-sidebar-header" }, exportAs: ["ngsSidebarHeader"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{--ngs-sidebar-header-compact-padding: calc(var(--spacing, .25rem) * 4) 0;flex:none;width:100%;display:flex;align-items:center}:host ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host.as-block{display:block}:host-context(.ngs-sidebar.compact:not(:hover)),:host-context(.ngs-sidenav.is-collapsed:not(:hover)){padding:var(--ngs-sidebar-header-compact-padding);display:flex;align-items:center;justify-content:center}:host-context(.ngs-sidebar.compact:not(:hover)) ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.compact:not(:hover)) ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) ::ng-deep .ngs-sidebar-compact-view-mode{display:block}:host-context(.ngs-sidebar.compact:hover) ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host-context(.ngs-sidebar.compact:hover) ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) ::ng-deep .ngs-sidebar-full-view-mode{display:block}:host-context(.ngs-sidebar.only-compact){display:flex;align-items:center;justify-content:center}:host-context(.ngs-sidebar.only-compact) ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.only-compact) ::ng-deep .ngs-sidebar-compact-view-mode{display:block}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
22
25
  }
23
26
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SidebarHeader, decorators: [{
24
27
  type: Component,
25
28
  args: [{ selector: 'ngs-sidebar-header', exportAs: 'ngsSidebarHeader', host: {
26
29
  'class': 'ngs-sidebar-header',
27
- }, template: "<ng-content/>\n", styles: [":host{--ngs-sidebar-header-compact-padding: calc(var(--spacing, .25rem) * 4) 0;flex:none;width:100%}:host ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host-context(.ngs-sidebar.compact:not(:hover)),:host-context(.ngs-sidenav.is-collapsed:not(:hover)){padding:var(--ngs-sidebar-header-compact-padding);display:flex;align-items:center;justify-content:center;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}:host-context(.ngs-sidebar.compact:not(:hover)) ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.compact:not(:hover)) ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) ::ng-deep .ngs-sidebar-compact-view-mode{display:block}:host-context(.ngs-sidebar.compact:hover) ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host-context(.ngs-sidebar.compact:hover) ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) ::ng-deep .ngs-sidebar-full-view-mode{display:block}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
28
- }] });
30
+ '[class.as-block]': 'block()'
31
+ }, template: "<ng-content/>\n", styles: [":host{--ngs-sidebar-header-compact-padding: calc(var(--spacing, .25rem) * 4) 0;flex:none;width:100%;display:flex;align-items:center}:host ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host.as-block{display:block}:host-context(.ngs-sidebar.compact:not(:hover)),:host-context(.ngs-sidenav.is-collapsed:not(:hover)){padding:var(--ngs-sidebar-header-compact-padding);display:flex;align-items:center;justify-content:center}:host-context(.ngs-sidebar.compact:not(:hover)) ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.compact:not(:hover)) ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) ::ng-deep .ngs-sidebar-compact-view-mode{display:block}:host-context(.ngs-sidebar.compact:hover) ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host-context(.ngs-sidebar.compact:hover) ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) ::ng-deep .ngs-sidebar-full-view-mode{display:block}:host-context(.ngs-sidebar.only-compact){display:flex;align-items:center;justify-content:center}:host-context(.ngs-sidebar.only-compact) ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.only-compact) ::ng-deep .ngs-sidebar-compact-view-mode{display:block}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
32
+ }], propDecorators: { block: [{ type: i0.Input, args: [{ isSignal: true, alias: "block", required: false }] }] } });
29
33
 
30
34
  class SidebarBody {
31
35
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SidebarBody, deps: [], target: i0.ɵɵFactoryTarget.Component });
32
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: SidebarBody, isStandalone: true, selector: "ngs-sidebar-body,ngs-sidebar-content", host: { classAttribute: "ngs-sidebar-body ngs-sidebar-content" }, exportAs: ["ngsSidebarBody"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{display:block;width:100%;flex-grow:1;overflow-y:auto;overflow-x:hidden;position:relative}:host .scroll-content{padding:0}:host-context(.ngs-sidebar.compact),:host-context(.ngs-sidenav.is-collapsed:not(:hover)){overflow-y:hidden;padding:0}:host-context(.ngs-sidebar.compact:hover),:host-context(.ngs-sidenav.is-collapsed:hover){overflow-y:auto}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
36
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: SidebarBody, isStandalone: true, selector: "ngs-sidebar-body,ngs-sidebar-content", host: { classAttribute: "ngs-sidebar-body ngs-sidebar-content" }, exportAs: ["ngsSidebarBody"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{display:block;width:100%;flex-grow:1;overflow-y:auto;overflow-x:hidden;position:relative}:host .scroll-content{padding:0}:host-context(.ngs-sidebar.compact),:host-context(.ngs-sidenav.is-collapsed:not(:hover)){overflow-y:hidden;padding:0}:host-context(.ngs-sidebar.compact:hover),:host-context(.ngs-sidenav.is-collapsed:hover){overflow-y:auto}:host-context(.ngs-sidebar.only-compact){overflow-y:hidden}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
33
37
  }
34
38
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SidebarBody, decorators: [{
35
39
  type: Component,
36
40
  args: [{ selector: 'ngs-sidebar-body,ngs-sidebar-content', exportAs: 'ngsSidebarBody', imports: [], host: {
37
41
  'class': 'ngs-sidebar-body ngs-sidebar-content'
38
- }, template: "<ng-content/>\n", styles: [":host{display:block;width:100%;flex-grow:1;overflow-y:auto;overflow-x:hidden;position:relative}:host .scroll-content{padding:0}:host-context(.ngs-sidebar.compact),:host-context(.ngs-sidenav.is-collapsed:not(:hover)){overflow-y:hidden;padding:0}:host-context(.ngs-sidebar.compact:hover),:host-context(.ngs-sidenav.is-collapsed:hover){overflow-y:auto}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
42
+ }, template: "<ng-content/>\n", styles: [":host{display:block;width:100%;flex-grow:1;overflow-y:auto;overflow-x:hidden;position:relative}:host .scroll-content{padding:0}:host-context(.ngs-sidebar.compact),:host-context(.ngs-sidenav.is-collapsed:not(:hover)){overflow-y:hidden;padding:0}:host-context(.ngs-sidebar.compact:hover),:host-context(.ngs-sidenav.is-collapsed:hover){overflow-y:auto}:host-context(.ngs-sidebar.only-compact){overflow-y:hidden}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
39
43
  }] });
40
44
 
41
45
  const SIDEBAR_NAVIGATION = new InjectionToken('Sidebar navigation');
@@ -88,7 +92,7 @@ class SidebarNavItem {
88
92
  return this._elementRef;
89
93
  }
90
94
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SidebarNavItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
91
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: SidebarNavItem, isStandalone: true, selector: "ngs-sidebar-nav-item,[ngs-sidebar-nav-item]", inputs: { key: { classPropertyName: "key", publicName: "key", isSignal: true, isRequired: false, transformFunction: null }, forceActive: { classPropertyName: "forceActive", publicName: "forceActive", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "click($event)" }, properties: { "class.is-active": "forceActive() || active" }, classAttribute: "ngs-sidebar-nav-item" }, exportAs: ["ngs-sidebar-nav-item"], ngImport: i0, template: "<div class=\"inner\" ngsRipple>\n <div class=\"icon\">\n <ng-content select=\"[ngsSidebarNavItemIcon]\"/>\n </div>\n <span class=\"text grow\"><ng-content/></span>\n <div class=\"badge\">\n <ng-content select=\"[ngsSidebarNavItemBadge]\"/>\n </div>\n</div>\n", styles: [":host{display:block;text-decoration:none;position:relative}:host .inner{display:flex;align-items:center;min-width:0;white-space:nowrap;flex:none;cursor:pointer;-webkit-user-select:none;user-select:none;margin:0;width:var(--ngs-sidebar-nav-item-width);background:var(--ngs-sidebar-nav-item-bg);min-height:var(--ngs-sidebar-nav-item-height);padding:var(--ngs-sidebar-nav-item-padding);font-size:var(--ngs-sidebar-nav-item-font-size);border-radius:var(--ngs-sidebar-nav-item-radius);font-weight:var(--ngs-sidebar-nav-item-font-weight);color:var(--ngs-sidebar-nav-item-color);gap:var(--ngs-sidebar-nav-item-gap)}:host:hover .inner{transition:background-color .2s}:host .text{overflow:hidden;text-overflow:ellipsis}:host .badge:empty{display:none}:host .badge{display:inline-flex;flex:none;border-radius:calc(infinity * 1px);height:var(--ngs-nav-badge-size);min-width:var(--ngs-nav-badge-size);align-items:center;justify-content:center;font-size:var(--ngs-font-size-xs);padding:var(--ngs-nav-badge-padding);background:var(--ngs-color-primary);color:var(--ngs-color-on-primary)}:host .icon{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:var(--ngs-sidebar-nav-item-icon-width);color:var(--ngs-sidebar-nav-item-icon-color)}:host .icon:empty{display:none}:host:hover{text-decoration:none}:host:hover .inner{background:var(--ngs-sidebar-nav-item-hover-bg);color:var(--ngs-sidebar-nav-item-hover-color)}:host.is-active .inner,:host.is-active:hover .inner{background:var(--ngs-sidebar-nav-item-active-bg);color:var(--ngs-sidebar-nav-item-active-color)}:host.is-active .icon{color:var(--ngs-sidebar-nav-item-active-icon-color)}:host:not(.is-active):hover{text-decoration:none}:host:not(.is-active):hover .icon{color:var(--ngs-sidebar-nav-item-hover-icon-color)}:host-context(.ngs-sidebar.compact:not(:hover)) .inner,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .inner{justify-content:center;padding:0;gap:0}:host-context(.ngs-sidebar.compact:not(:hover)) .text,:host-context(.ngs-sidebar.compact:not(:hover)) .badge,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .badge{display:none}:host-context(.ngs-sidebar.compact:not(:hover)) .icon,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .icon{width:var(--ngs-sidebar-nav-item-icon-width)}:host-context(.ngs-sidebar-nav-group-menu) .inner{margin:var(--ngs-sidebar-nav-nested-item-margin);width:calc(var(--ngs-sidebar-nav-item-width) - var(--ngs-sidebar-nav-nested-item-margin));background:var(--ngs-sidebar-nav-nested-item-bg);min-height:var(--ngs-sidebar-nav-nested-item-height);padding:var(--ngs-sidebar-nav-nested-item-padding);color:var(--ngs-sidebar-nav-nested-item-color)}:host-context(.ngs-sidebar-nav-group-menu):hover .inner{background:var(--ngs-sidebar-nav-nested-item-hover-bg);color:var(--ngs-sidebar-nav-nested-item-hover-color)}:host-context(.ngs-sidebar-nav-group-menu).is-active .inner,:host-context(.ngs-sidebar-nav-group-menu).is-active:hover .inner{background:var(--ngs-sidebar-nav-nested-item-active-bg);color:var(--ngs-sidebar-nav-nested-item-active-color)}:host-context(.ngs-sidebar-nav-group-menu):not(:last-child):before{content:\"\";position:absolute;top:0;left:20px;bottom:-10px;width:1px;background:var(--ngs-sidebar-nav-group-tree-lines-color);z-index:0}:host-context(.ngs-sidebar-nav-group-menu):after{content:\"\";position:absolute;top:0;left:20px;width:calc(var(--ngs-sidebar-nav-nested-item-height) / 1.5);height:calc(var(--ngs-sidebar-nav-nested-item-height) / 2);border-bottom-left-radius:calc(var(--ngs-sidebar-nav-nested-item-height) / 4);border-left:1px solid var(--ngs-sidebar-nav-group-tree-lines-color);border-bottom:1px solid var(--ngs-sidebar-nav-group-tree-lines-color)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: Ripple, selector: "[ngsRipple]", inputs: ["ngsRippleColor", "ngsRippleUnbounded", "ngsRippleCentered", "ngsRippleRadius", "ngsRippleAnimation", "ngsRippleDisabled", "ngsRippleTrigger"], outputs: ["ngsRippleCenteredChange", "ngsRippleDisabledChange", "ngsRippleTriggerChange"], exportAs: ["ngsRipple"] }] });
95
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: SidebarNavItem, isStandalone: true, selector: "ngs-sidebar-nav-item,[ngs-sidebar-nav-item]", inputs: { key: { classPropertyName: "key", publicName: "key", isSignal: true, isRequired: false, transformFunction: null }, forceActive: { classPropertyName: "forceActive", publicName: "forceActive", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "click($event)" }, properties: { "class.is-active": "forceActive() || active" }, classAttribute: "ngs-sidebar-nav-item" }, exportAs: ["ngs-sidebar-nav-item"], ngImport: i0, template: "<div class=\"inner\" ngsRipple>\n <div class=\"icon\">\n <ng-content select=\"[ngsSidebarNavItemIcon]\"/>\n </div>\n <span class=\"text grow\"><ng-content/></span>\n <div class=\"badge\">\n <ng-content select=\"[ngsSidebarNavItemBadge]\"/>\n </div>\n</div>\n", styles: [":host{display:block;text-decoration:none;position:relative}:host .inner{display:flex;align-items:center;min-width:0;white-space:nowrap;flex:none;cursor:pointer;-webkit-user-select:none;user-select:none;margin:0;width:var(--ngs-sidebar-nav-item-width);background:var(--ngs-sidebar-nav-item-bg);min-height:var(--ngs-sidebar-nav-item-height);padding:var(--ngs-sidebar-nav-item-padding);font-size:var(--ngs-sidebar-nav-item-font-size);border-radius:var(--ngs-sidebar-nav-item-radius);font-weight:var(--ngs-sidebar-nav-item-font-weight);color:var(--ngs-sidebar-nav-item-color);gap:var(--ngs-sidebar-nav-item-gap)}:host:hover .inner{transition:background-color .2s}:host .text{overflow:hidden;text-overflow:ellipsis}:host .badge:empty{display:none}:host .badge{display:inline-flex;flex:none;border-radius:calc(infinity * 1px);height:var(--ngs-nav-badge-size);min-width:var(--ngs-nav-badge-size);align-items:center;justify-content:center;font-size:var(--ngs-font-size-xs);padding:var(--ngs-nav-badge-padding);background:var(--ngs-color-primary);color:var(--ngs-color-on-primary)}:host .icon{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:var(--ngs-sidebar-nav-item-icon-width);color:var(--ngs-sidebar-nav-item-icon-color)}:host .icon:empty{display:none}:host:hover{text-decoration:none}:host:hover .inner{background:var(--ngs-sidebar-nav-item-hover-bg);color:var(--ngs-sidebar-nav-item-hover-color)}:host.is-active .inner,:host.is-active:hover .inner{background:var(--ngs-sidebar-nav-item-active-bg);color:var(--ngs-sidebar-nav-item-active-color)}:host.is-active .icon{color:var(--ngs-sidebar-nav-item-active-icon-color)}:host:not(.is-active):hover{text-decoration:none}:host:not(.is-active):hover .icon{color:var(--ngs-sidebar-nav-item-hover-icon-color)}:host-context(.ngs-sidebar.compact:not(:hover)) .inner,:host-context(.ngs-sidebar.only-compact) .inner,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .inner{justify-content:center;padding:0;gap:0}:host-context(.ngs-sidebar.compact:not(:hover)) .text,:host-context(.ngs-sidebar.compact:not(:hover)) .badge,:host-context(.ngs-sidebar.only-compact) .text,:host-context(.ngs-sidebar.only-compact) .badge,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .badge{display:none}:host-context(.ngs-sidebar.compact:not(:hover)) .icon,:host-context(.ngs-sidebar.only-compact) .icon,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .icon{width:var(--ngs-sidebar-nav-item-icon-width)}:host-context(.ngs-sidebar-nav-group-menu) .inner{margin:var(--ngs-sidebar-nav-nested-item-margin);width:calc(var(--ngs-sidebar-nav-item-width) - var(--ngs-sidebar-nav-nested-item-margin));background:var(--ngs-sidebar-nav-nested-item-bg);min-height:var(--ngs-sidebar-nav-nested-item-height);padding:var(--ngs-sidebar-nav-nested-item-padding);color:var(--ngs-sidebar-nav-nested-item-color)}:host-context(.ngs-sidebar-nav-group-menu):hover .inner{background:var(--ngs-sidebar-nav-nested-item-hover-bg);color:var(--ngs-sidebar-nav-nested-item-hover-color)}:host-context(.ngs-sidebar-nav-group-menu).is-active .inner,:host-context(.ngs-sidebar-nav-group-menu).is-active:hover .inner{background:var(--ngs-sidebar-nav-nested-item-active-bg);color:var(--ngs-sidebar-nav-nested-item-active-color)}:host-context(.ngs-sidebar-nav-group-menu):not(:last-child):before{content:\"\";position:absolute;top:0;left:20px;bottom:-10px;width:1px;background:var(--ngs-sidebar-nav-group-tree-lines-color);z-index:0}:host-context(.ngs-sidebar-nav-group-menu):after{content:\"\";position:absolute;top:0;left:20px;width:calc(var(--ngs-sidebar-nav-nested-item-height) / 1.5);height:calc(var(--ngs-sidebar-nav-nested-item-height) / 2);border-bottom-left-radius:calc(var(--ngs-sidebar-nav-nested-item-height) / 4);border-left:1px solid var(--ngs-sidebar-nav-group-tree-lines-color);border-bottom:1px solid var(--ngs-sidebar-nav-group-tree-lines-color)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "directive", type: Ripple, selector: "[ngsRipple]", inputs: ["ngsRippleColor", "ngsRippleUnbounded", "ngsRippleCentered", "ngsRippleRadius", "ngsRippleAnimation", "ngsRippleDisabled", "ngsRippleTrigger"], outputs: ["ngsRippleCenteredChange", "ngsRippleDisabledChange", "ngsRippleTriggerChange"], exportAs: ["ngsRipple"] }] });
92
96
  }
93
97
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SidebarNavItem, decorators: [{
94
98
  type: Component,
@@ -98,7 +102,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
98
102
  'class': 'ngs-sidebar-nav-item',
99
103
  '[class.is-active]': 'forceActive() || active',
100
104
  '(click)': 'click($event)'
101
- }, template: "<div class=\"inner\" ngsRipple>\n <div class=\"icon\">\n <ng-content select=\"[ngsSidebarNavItemIcon]\"/>\n </div>\n <span class=\"text grow\"><ng-content/></span>\n <div class=\"badge\">\n <ng-content select=\"[ngsSidebarNavItemBadge]\"/>\n </div>\n</div>\n", styles: [":host{display:block;text-decoration:none;position:relative}:host .inner{display:flex;align-items:center;min-width:0;white-space:nowrap;flex:none;cursor:pointer;-webkit-user-select:none;user-select:none;margin:0;width:var(--ngs-sidebar-nav-item-width);background:var(--ngs-sidebar-nav-item-bg);min-height:var(--ngs-sidebar-nav-item-height);padding:var(--ngs-sidebar-nav-item-padding);font-size:var(--ngs-sidebar-nav-item-font-size);border-radius:var(--ngs-sidebar-nav-item-radius);font-weight:var(--ngs-sidebar-nav-item-font-weight);color:var(--ngs-sidebar-nav-item-color);gap:var(--ngs-sidebar-nav-item-gap)}:host:hover .inner{transition:background-color .2s}:host .text{overflow:hidden;text-overflow:ellipsis}:host .badge:empty{display:none}:host .badge{display:inline-flex;flex:none;border-radius:calc(infinity * 1px);height:var(--ngs-nav-badge-size);min-width:var(--ngs-nav-badge-size);align-items:center;justify-content:center;font-size:var(--ngs-font-size-xs);padding:var(--ngs-nav-badge-padding);background:var(--ngs-color-primary);color:var(--ngs-color-on-primary)}:host .icon{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:var(--ngs-sidebar-nav-item-icon-width);color:var(--ngs-sidebar-nav-item-icon-color)}:host .icon:empty{display:none}:host:hover{text-decoration:none}:host:hover .inner{background:var(--ngs-sidebar-nav-item-hover-bg);color:var(--ngs-sidebar-nav-item-hover-color)}:host.is-active .inner,:host.is-active:hover .inner{background:var(--ngs-sidebar-nav-item-active-bg);color:var(--ngs-sidebar-nav-item-active-color)}:host.is-active .icon{color:var(--ngs-sidebar-nav-item-active-icon-color)}:host:not(.is-active):hover{text-decoration:none}:host:not(.is-active):hover .icon{color:var(--ngs-sidebar-nav-item-hover-icon-color)}:host-context(.ngs-sidebar.compact:not(:hover)) .inner,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .inner{justify-content:center;padding:0;gap:0}:host-context(.ngs-sidebar.compact:not(:hover)) .text,:host-context(.ngs-sidebar.compact:not(:hover)) .badge,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .badge{display:none}:host-context(.ngs-sidebar.compact:not(:hover)) .icon,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .icon{width:var(--ngs-sidebar-nav-item-icon-width)}:host-context(.ngs-sidebar-nav-group-menu) .inner{margin:var(--ngs-sidebar-nav-nested-item-margin);width:calc(var(--ngs-sidebar-nav-item-width) - var(--ngs-sidebar-nav-nested-item-margin));background:var(--ngs-sidebar-nav-nested-item-bg);min-height:var(--ngs-sidebar-nav-nested-item-height);padding:var(--ngs-sidebar-nav-nested-item-padding);color:var(--ngs-sidebar-nav-nested-item-color)}:host-context(.ngs-sidebar-nav-group-menu):hover .inner{background:var(--ngs-sidebar-nav-nested-item-hover-bg);color:var(--ngs-sidebar-nav-nested-item-hover-color)}:host-context(.ngs-sidebar-nav-group-menu).is-active .inner,:host-context(.ngs-sidebar-nav-group-menu).is-active:hover .inner{background:var(--ngs-sidebar-nav-nested-item-active-bg);color:var(--ngs-sidebar-nav-nested-item-active-color)}:host-context(.ngs-sidebar-nav-group-menu):not(:last-child):before{content:\"\";position:absolute;top:0;left:20px;bottom:-10px;width:1px;background:var(--ngs-sidebar-nav-group-tree-lines-color);z-index:0}:host-context(.ngs-sidebar-nav-group-menu):after{content:\"\";position:absolute;top:0;left:20px;width:calc(var(--ngs-sidebar-nav-nested-item-height) / 1.5);height:calc(var(--ngs-sidebar-nav-nested-item-height) / 2);border-bottom-left-radius:calc(var(--ngs-sidebar-nav-nested-item-height) / 4);border-left:1px solid var(--ngs-sidebar-nav-group-tree-lines-color);border-bottom:1px solid var(--ngs-sidebar-nav-group-tree-lines-color)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
105
+ }, template: "<div class=\"inner\" ngsRipple>\n <div class=\"icon\">\n <ng-content select=\"[ngsSidebarNavItemIcon]\"/>\n </div>\n <span class=\"text grow\"><ng-content/></span>\n <div class=\"badge\">\n <ng-content select=\"[ngsSidebarNavItemBadge]\"/>\n </div>\n</div>\n", styles: [":host{display:block;text-decoration:none;position:relative}:host .inner{display:flex;align-items:center;min-width:0;white-space:nowrap;flex:none;cursor:pointer;-webkit-user-select:none;user-select:none;margin:0;width:var(--ngs-sidebar-nav-item-width);background:var(--ngs-sidebar-nav-item-bg);min-height:var(--ngs-sidebar-nav-item-height);padding:var(--ngs-sidebar-nav-item-padding);font-size:var(--ngs-sidebar-nav-item-font-size);border-radius:var(--ngs-sidebar-nav-item-radius);font-weight:var(--ngs-sidebar-nav-item-font-weight);color:var(--ngs-sidebar-nav-item-color);gap:var(--ngs-sidebar-nav-item-gap)}:host:hover .inner{transition:background-color .2s}:host .text{overflow:hidden;text-overflow:ellipsis}:host .badge:empty{display:none}:host .badge{display:inline-flex;flex:none;border-radius:calc(infinity * 1px);height:var(--ngs-nav-badge-size);min-width:var(--ngs-nav-badge-size);align-items:center;justify-content:center;font-size:var(--ngs-font-size-xs);padding:var(--ngs-nav-badge-padding);background:var(--ngs-color-primary);color:var(--ngs-color-on-primary)}:host .icon{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:none;width:var(--ngs-sidebar-nav-item-icon-width);color:var(--ngs-sidebar-nav-item-icon-color)}:host .icon:empty{display:none}:host:hover{text-decoration:none}:host:hover .inner{background:var(--ngs-sidebar-nav-item-hover-bg);color:var(--ngs-sidebar-nav-item-hover-color)}:host.is-active .inner,:host.is-active:hover .inner{background:var(--ngs-sidebar-nav-item-active-bg);color:var(--ngs-sidebar-nav-item-active-color)}:host.is-active .icon{color:var(--ngs-sidebar-nav-item-active-icon-color)}:host:not(.is-active):hover{text-decoration:none}:host:not(.is-active):hover .icon{color:var(--ngs-sidebar-nav-item-hover-icon-color)}:host-context(.ngs-sidebar.compact:not(:hover)) .inner,:host-context(.ngs-sidebar.only-compact) .inner,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .inner{justify-content:center;padding:0;gap:0}:host-context(.ngs-sidebar.compact:not(:hover)) .text,:host-context(.ngs-sidebar.compact:not(:hover)) .badge,:host-context(.ngs-sidebar.only-compact) .text,:host-context(.ngs-sidebar.only-compact) .badge,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .badge{display:none}:host-context(.ngs-sidebar.compact:not(:hover)) .icon,:host-context(.ngs-sidebar.only-compact) .icon,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .icon{width:var(--ngs-sidebar-nav-item-icon-width)}:host-context(.ngs-sidebar-nav-group-menu) .inner{margin:var(--ngs-sidebar-nav-nested-item-margin);width:calc(var(--ngs-sidebar-nav-item-width) - var(--ngs-sidebar-nav-nested-item-margin));background:var(--ngs-sidebar-nav-nested-item-bg);min-height:var(--ngs-sidebar-nav-nested-item-height);padding:var(--ngs-sidebar-nav-nested-item-padding);color:var(--ngs-sidebar-nav-nested-item-color)}:host-context(.ngs-sidebar-nav-group-menu):hover .inner{background:var(--ngs-sidebar-nav-nested-item-hover-bg);color:var(--ngs-sidebar-nav-nested-item-hover-color)}:host-context(.ngs-sidebar-nav-group-menu).is-active .inner,:host-context(.ngs-sidebar-nav-group-menu).is-active:hover .inner{background:var(--ngs-sidebar-nav-nested-item-active-bg);color:var(--ngs-sidebar-nav-nested-item-active-color)}:host-context(.ngs-sidebar-nav-group-menu):not(:last-child):before{content:\"\";position:absolute;top:0;left:20px;bottom:-10px;width:1px;background:var(--ngs-sidebar-nav-group-tree-lines-color);z-index:0}:host-context(.ngs-sidebar-nav-group-menu):after{content:\"\";position:absolute;top:0;left:20px;width:calc(var(--ngs-sidebar-nav-nested-item-height) / 1.5);height:calc(var(--ngs-sidebar-nav-nested-item-height) / 2);border-bottom-left-radius:calc(var(--ngs-sidebar-nav-nested-item-height) / 4);border-left:1px solid var(--ngs-sidebar-nav-group-tree-lines-color);border-bottom:1px solid var(--ngs-sidebar-nav-group-tree-lines-color)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
102
106
  }], propDecorators: { key: [{ type: i0.Input, args: [{ isSignal: true, alias: "key", required: false }] }], forceActive: [{ type: i0.Input, args: [{ isSignal: true, alias: "forceActive", required: false }] }] } });
103
107
 
104
108
  class SidebarNavGroupToggle {
@@ -121,7 +125,7 @@ class SidebarNavGroupToggle {
121
125
  }
122
126
  }
123
127
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SidebarNavGroupToggle, deps: [], target: i0.ɵɵFactoryTarget.Component });
124
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: SidebarNavGroupToggle, isStandalone: true, selector: "ngs-sidebar-nav-group-toggle", host: { listeners: { "click": "toggle($event)" }, properties: { "class.is-active": "active" }, classAttribute: "ngs-sidebar-nav-group-toggle" }, exportAs: ["ngsSidebarNavGroupToggle"], hostDirectives: [{ directive: i1.Ripple }], ngImport: i0, template: "<div class=\"icon\"><ng-content select=\"[ngsSidebarNavItemIcon]\"/></div>\n<span class=\"text grow\"><ng-content/></span>\n<div class=\"flex items-center gap-0.5\">\n <div class=\"badge\">\n <ng-content select=\"[ngsSidebarNavItemBadge]\"/>\n </div>\n <div class=\"arrow\">\n <ng-content select=\"[ngsSidebarNavGroupToggleIcon]\"/>\n </div>\n</div>\n", styles: [":host{display:flex;align-items:center;min-width:0;white-space:nowrap;position:relative;flex:none;cursor:pointer;-webkit-user-select:none;user-select:none;background:var(--ngs-sidebar-nav-group-toggle-bg);min-height:var(--ngs-sidebar-nav-item-height);padding:var(--ngs-sidebar-nav-item-padding);font-size:var(--ngs-sidebar-nav-item-font-size);border-radius:var(--ngs-sidebar-nav-item-radius);font-weight:var(--ngs-sidebar-nav-item-font-weight);color:var(--ngs-sidebar-nav-item-color);gap:var(--ngs-sidebar-nav-item-gap);width:var(--ngs-sidebar-nav-item-width)}:host .text{overflow:hidden;text-overflow:ellipsis}:host .text ::ng-deep .ngs-sidebar-full-view-mode{display:block}:host .text ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host .badge:empty{display:none}:host .badge{display:inline-flex;flex:none;border-radius:calc(infinity * 1px);height:var(--ngs-nav-badge-size);align-items:center;justify-content:center;min-width:var(--ngs-nav-badge-size);font-size:var(--ngs-font-size-xs);padding:var(--ngs-nav-badge-padding);background:var(--ngs-color-primary);color:var(--ngs-color-on-primary)}:host .icon{display:inline-flex;align-items:center;justify-content:center;width:var(--ngs-sidebar-nav-item-icon-width);color:var(--ngs-sidebar-nav-group-toggle-icon-color);flex:none}:host .icon:empty{display:none}:host .arrow{display:inline-flex;align-items:center;justify-content:center;transition:transform .2s ease;color:var(--ngs-sidebar-nav-group-arrow-color);width:var(--ngs-nav-arrow-size);height:var(--ngs-nav-arrow-size);flex:none}:host .arrow:empty{display:none}:host:hover{background:var(--ngs-sidebar-nav-item-hover-bg);color:var(--ngs-sidebar-nav-group-toggle-hover-icon-color);transition:background-color .2s}:host.is-active,:host.is-active:hover{background:var(--ngs-sidebar-nav-group-toggle-active-bg);color:var(--ngs-sidebar-nav-group-toggle-active-color)}:host:not(.is-active):hover .icon{color:var(--ngs-sidebar-nav-item-hover-icon-color)}:host.is-active .icon{color:var(--ngs-sidebar-nav-group-toggle-active-icon-color)}:host.is-active .arrow{transform:rotate(-180deg)}:host:has(.arrow:not(:empty)){padding-inline-end:var(--ngs-sidebar-nav-group-toggle-has-icon-padding-end)}:host-context(.ngs-sidebar.compact) .text,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text{display:none}:host-context(.ngs-sidebar.compact) .text ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.compact) .text ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text ::ng-deep .ngs-sidebar-compact-view-mode{display:block}:host-context(.ngs-sidebar.compact),:host-context(.ngs-sidenav.is-collapsed:not(:hover)){justify-content:center;padding:0;gap:0}:host-context(.ngs-sidebar.compact)>.flex,:host-context(.ngs-sidebar.compact) .badge,:host-context(.ngs-sidebar.compact) .arrow,:host-context(.ngs-sidenav.is-collapsed:not(:hover))>.flex,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .badge,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .arrow{display:none}:host-context(.ngs-sidebar.compact:hover) .text,:host-context(.ngs-sidenav.is-collapsed:hover) .text{display:block}:host-context(.ngs-sidebar.compact:hover) .text ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) .text ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host-context(.ngs-sidebar.compact:hover) .text ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) .text ::ng-deep .ngs-sidebar-full-view-mode{display:block}:host-context(.ngs-sidebar.compact:hover),:host-context(.ngs-sidenav.is-collapsed:hover){justify-content:flex-start;padding:var(--ngs-sidebar-nav-item-padding);gap:var(--ngs-sidebar-nav-item-gap)}:host-context(.ngs-sidebar.compact:hover)>.flex,:host-context(.ngs-sidenav.is-collapsed:hover)>.flex{display:flex}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
128
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: SidebarNavGroupToggle, isStandalone: true, selector: "ngs-sidebar-nav-group-toggle", host: { listeners: { "click": "toggle($event)" }, properties: { "class.is-active": "active" }, classAttribute: "ngs-sidebar-nav-group-toggle" }, exportAs: ["ngsSidebarNavGroupToggle"], hostDirectives: [{ directive: i1.Ripple }], ngImport: i0, template: "<div class=\"icon\"><ng-content select=\"[ngsSidebarNavItemIcon]\"/></div>\n<span class=\"text grow\"><ng-content/></span>\n<div class=\"flex items-center gap-0.5\">\n <div class=\"badge\">\n <ng-content select=\"[ngsSidebarNavItemBadge]\"/>\n </div>\n <div class=\"arrow\">\n <ng-content select=\"[ngsSidebarNavGroupToggleIcon]\"/>\n </div>\n</div>\n", styles: [":host{display:flex;align-items:center;min-width:0;white-space:nowrap;position:relative;flex:none;cursor:pointer;-webkit-user-select:none;user-select:none;background:var(--ngs-sidebar-nav-group-toggle-bg);min-height:var(--ngs-sidebar-nav-item-height);padding:var(--ngs-sidebar-nav-item-padding);font-size:var(--ngs-sidebar-nav-item-font-size);border-radius:var(--ngs-sidebar-nav-item-radius);font-weight:var(--ngs-sidebar-nav-item-font-weight);color:var(--ngs-sidebar-nav-item-color);gap:var(--ngs-sidebar-nav-item-gap);width:var(--ngs-sidebar-nav-item-width)}:host .text{overflow:hidden;text-overflow:ellipsis}:host .text ::ng-deep .ngs-sidebar-full-view-mode{display:block}:host .text ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host .badge:empty{display:none}:host .badge{display:inline-flex;flex:none;border-radius:calc(infinity * 1px);height:var(--ngs-nav-badge-size);align-items:center;justify-content:center;min-width:var(--ngs-nav-badge-size);font-size:var(--ngs-font-size-xs);padding:var(--ngs-nav-badge-padding);background:var(--ngs-color-primary);color:var(--ngs-color-on-primary)}:host .icon{display:inline-flex;align-items:center;justify-content:center;width:var(--ngs-sidebar-nav-item-icon-width);color:var(--ngs-sidebar-nav-group-toggle-icon-color);flex:none}:host .icon:empty{display:none}:host .arrow{display:inline-flex;align-items:center;justify-content:center;transition:transform .2s ease;color:var(--ngs-sidebar-nav-group-arrow-color);width:var(--ngs-nav-arrow-size);height:var(--ngs-nav-arrow-size);flex:none}:host .arrow:empty{display:none}:host:hover{background:var(--ngs-sidebar-nav-item-hover-bg);color:var(--ngs-sidebar-nav-group-toggle-hover-icon-color);transition:background-color .2s}:host.is-active,:host.is-active:hover{background:var(--ngs-sidebar-nav-group-toggle-active-bg);color:var(--ngs-sidebar-nav-group-toggle-active-color)}:host:not(.is-active):hover .icon{color:var(--ngs-sidebar-nav-item-hover-icon-color)}:host.is-active .icon{color:var(--ngs-sidebar-nav-group-toggle-active-icon-color)}:host.is-active .arrow{transform:rotate(-180deg)}:host:has(.arrow:not(:empty)){padding-inline-end:var(--ngs-sidebar-nav-group-toggle-has-icon-padding-end)}:host-context(.ngs-sidebar.compact) .text,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text{display:none}:host-context(.ngs-sidebar.compact) .text ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.compact) .text ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text ::ng-deep .ngs-sidebar-compact-view-mode{display:block}:host-context(.ngs-sidebar.compact),:host-context(.ngs-sidenav.is-collapsed:not(:hover)){justify-content:center;gap:0}:host-context(.ngs-sidebar.compact)>.flex,:host-context(.ngs-sidebar.compact) .badge,:host-context(.ngs-sidebar.compact) .arrow,:host-context(.ngs-sidenav.is-collapsed:not(:hover))>.flex,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .badge,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .arrow{display:none}:host-context(.ngs-sidebar.compact:hover) .text,:host-context(.ngs-sidenav.is-collapsed:hover) .text{display:block}:host-context(.ngs-sidebar.compact:hover) .text ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) .text ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host-context(.ngs-sidebar.compact:hover) .text ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) .text ::ng-deep .ngs-sidebar-full-view-mode{display:block}:host-context(.ngs-sidebar.compact:hover),:host-context(.ngs-sidenav.is-collapsed:hover){justify-content:flex-start;padding:var(--ngs-sidebar-nav-item-padding);gap:var(--ngs-sidebar-nav-item-gap)}:host-context(.ngs-sidebar.compact:hover)>.flex,:host-context(.ngs-sidenav.is-collapsed:hover)>.flex{display:flex}:host-context(.ngs-sidebar.only-compact) .text{display:none}:host-context(.ngs-sidebar.only-compact) .text ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.only-compact) .text ::ng-deep .ngs-sidebar-compact-view-mode{display:block}:host-context(.ngs-sidebar.only-compact){justify-content:center;gap:0}:host-context(.ngs-sidebar.only-compact)>.flex,:host-context(.ngs-sidebar.only-compact) .badge,:host-context(.ngs-sidebar.only-compact) .arrow{display:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
125
129
  }
126
130
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SidebarNavGroupToggle, decorators: [{
127
131
  type: Component,
@@ -131,7 +135,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
131
135
  'class': 'ngs-sidebar-nav-group-toggle',
132
136
  '[class.is-active]': 'active',
133
137
  '(click)': 'toggle($event)'
134
- }, template: "<div class=\"icon\"><ng-content select=\"[ngsSidebarNavItemIcon]\"/></div>\n<span class=\"text grow\"><ng-content/></span>\n<div class=\"flex items-center gap-0.5\">\n <div class=\"badge\">\n <ng-content select=\"[ngsSidebarNavItemBadge]\"/>\n </div>\n <div class=\"arrow\">\n <ng-content select=\"[ngsSidebarNavGroupToggleIcon]\"/>\n </div>\n</div>\n", styles: [":host{display:flex;align-items:center;min-width:0;white-space:nowrap;position:relative;flex:none;cursor:pointer;-webkit-user-select:none;user-select:none;background:var(--ngs-sidebar-nav-group-toggle-bg);min-height:var(--ngs-sidebar-nav-item-height);padding:var(--ngs-sidebar-nav-item-padding);font-size:var(--ngs-sidebar-nav-item-font-size);border-radius:var(--ngs-sidebar-nav-item-radius);font-weight:var(--ngs-sidebar-nav-item-font-weight);color:var(--ngs-sidebar-nav-item-color);gap:var(--ngs-sidebar-nav-item-gap);width:var(--ngs-sidebar-nav-item-width)}:host .text{overflow:hidden;text-overflow:ellipsis}:host .text ::ng-deep .ngs-sidebar-full-view-mode{display:block}:host .text ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host .badge:empty{display:none}:host .badge{display:inline-flex;flex:none;border-radius:calc(infinity * 1px);height:var(--ngs-nav-badge-size);align-items:center;justify-content:center;min-width:var(--ngs-nav-badge-size);font-size:var(--ngs-font-size-xs);padding:var(--ngs-nav-badge-padding);background:var(--ngs-color-primary);color:var(--ngs-color-on-primary)}:host .icon{display:inline-flex;align-items:center;justify-content:center;width:var(--ngs-sidebar-nav-item-icon-width);color:var(--ngs-sidebar-nav-group-toggle-icon-color);flex:none}:host .icon:empty{display:none}:host .arrow{display:inline-flex;align-items:center;justify-content:center;transition:transform .2s ease;color:var(--ngs-sidebar-nav-group-arrow-color);width:var(--ngs-nav-arrow-size);height:var(--ngs-nav-arrow-size);flex:none}:host .arrow:empty{display:none}:host:hover{background:var(--ngs-sidebar-nav-item-hover-bg);color:var(--ngs-sidebar-nav-group-toggle-hover-icon-color);transition:background-color .2s}:host.is-active,:host.is-active:hover{background:var(--ngs-sidebar-nav-group-toggle-active-bg);color:var(--ngs-sidebar-nav-group-toggle-active-color)}:host:not(.is-active):hover .icon{color:var(--ngs-sidebar-nav-item-hover-icon-color)}:host.is-active .icon{color:var(--ngs-sidebar-nav-group-toggle-active-icon-color)}:host.is-active .arrow{transform:rotate(-180deg)}:host:has(.arrow:not(:empty)){padding-inline-end:var(--ngs-sidebar-nav-group-toggle-has-icon-padding-end)}:host-context(.ngs-sidebar.compact) .text,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text{display:none}:host-context(.ngs-sidebar.compact) .text ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.compact) .text ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text ::ng-deep .ngs-sidebar-compact-view-mode{display:block}:host-context(.ngs-sidebar.compact),:host-context(.ngs-sidenav.is-collapsed:not(:hover)){justify-content:center;padding:0;gap:0}:host-context(.ngs-sidebar.compact)>.flex,:host-context(.ngs-sidebar.compact) .badge,:host-context(.ngs-sidebar.compact) .arrow,:host-context(.ngs-sidenav.is-collapsed:not(:hover))>.flex,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .badge,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .arrow{display:none}:host-context(.ngs-sidebar.compact:hover) .text,:host-context(.ngs-sidenav.is-collapsed:hover) .text{display:block}:host-context(.ngs-sidebar.compact:hover) .text ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) .text ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host-context(.ngs-sidebar.compact:hover) .text ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) .text ::ng-deep .ngs-sidebar-full-view-mode{display:block}:host-context(.ngs-sidebar.compact:hover),:host-context(.ngs-sidenav.is-collapsed:hover){justify-content:flex-start;padding:var(--ngs-sidebar-nav-item-padding);gap:var(--ngs-sidebar-nav-item-gap)}:host-context(.ngs-sidebar.compact:hover)>.flex,:host-context(.ngs-sidenav.is-collapsed:hover)>.flex{display:flex}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
138
+ }, template: "<div class=\"icon\"><ng-content select=\"[ngsSidebarNavItemIcon]\"/></div>\n<span class=\"text grow\"><ng-content/></span>\n<div class=\"flex items-center gap-0.5\">\n <div class=\"badge\">\n <ng-content select=\"[ngsSidebarNavItemBadge]\"/>\n </div>\n <div class=\"arrow\">\n <ng-content select=\"[ngsSidebarNavGroupToggleIcon]\"/>\n </div>\n</div>\n", styles: [":host{display:flex;align-items:center;min-width:0;white-space:nowrap;position:relative;flex:none;cursor:pointer;-webkit-user-select:none;user-select:none;background:var(--ngs-sidebar-nav-group-toggle-bg);min-height:var(--ngs-sidebar-nav-item-height);padding:var(--ngs-sidebar-nav-item-padding);font-size:var(--ngs-sidebar-nav-item-font-size);border-radius:var(--ngs-sidebar-nav-item-radius);font-weight:var(--ngs-sidebar-nav-item-font-weight);color:var(--ngs-sidebar-nav-item-color);gap:var(--ngs-sidebar-nav-item-gap);width:var(--ngs-sidebar-nav-item-width)}:host .text{overflow:hidden;text-overflow:ellipsis}:host .text ::ng-deep .ngs-sidebar-full-view-mode{display:block}:host .text ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host .badge:empty{display:none}:host .badge{display:inline-flex;flex:none;border-radius:calc(infinity * 1px);height:var(--ngs-nav-badge-size);align-items:center;justify-content:center;min-width:var(--ngs-nav-badge-size);font-size:var(--ngs-font-size-xs);padding:var(--ngs-nav-badge-padding);background:var(--ngs-color-primary);color:var(--ngs-color-on-primary)}:host .icon{display:inline-flex;align-items:center;justify-content:center;width:var(--ngs-sidebar-nav-item-icon-width);color:var(--ngs-sidebar-nav-group-toggle-icon-color);flex:none}:host .icon:empty{display:none}:host .arrow{display:inline-flex;align-items:center;justify-content:center;transition:transform .2s ease;color:var(--ngs-sidebar-nav-group-arrow-color);width:var(--ngs-nav-arrow-size);height:var(--ngs-nav-arrow-size);flex:none}:host .arrow:empty{display:none}:host:hover{background:var(--ngs-sidebar-nav-item-hover-bg);color:var(--ngs-sidebar-nav-group-toggle-hover-icon-color);transition:background-color .2s}:host.is-active,:host.is-active:hover{background:var(--ngs-sidebar-nav-group-toggle-active-bg);color:var(--ngs-sidebar-nav-group-toggle-active-color)}:host:not(.is-active):hover .icon{color:var(--ngs-sidebar-nav-item-hover-icon-color)}:host.is-active .icon{color:var(--ngs-sidebar-nav-group-toggle-active-icon-color)}:host.is-active .arrow{transform:rotate(-180deg)}:host:has(.arrow:not(:empty)){padding-inline-end:var(--ngs-sidebar-nav-group-toggle-has-icon-padding-end)}:host-context(.ngs-sidebar.compact) .text,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text{display:none}:host-context(.ngs-sidebar.compact) .text ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.compact) .text ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .text ::ng-deep .ngs-sidebar-compact-view-mode{display:block}:host-context(.ngs-sidebar.compact),:host-context(.ngs-sidenav.is-collapsed:not(:hover)){justify-content:center;gap:0}:host-context(.ngs-sidebar.compact)>.flex,:host-context(.ngs-sidebar.compact) .badge,:host-context(.ngs-sidebar.compact) .arrow,:host-context(.ngs-sidenav.is-collapsed:not(:hover))>.flex,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .badge,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) .arrow{display:none}:host-context(.ngs-sidebar.compact:hover) .text,:host-context(.ngs-sidenav.is-collapsed:hover) .text{display:block}:host-context(.ngs-sidebar.compact:hover) .text ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) .text ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host-context(.ngs-sidebar.compact:hover) .text ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) .text ::ng-deep .ngs-sidebar-full-view-mode{display:block}:host-context(.ngs-sidebar.compact:hover),:host-context(.ngs-sidenav.is-collapsed:hover){justify-content:flex-start;padding:var(--ngs-sidebar-nav-item-padding);gap:var(--ngs-sidebar-nav-item-gap)}:host-context(.ngs-sidebar.compact:hover)>.flex,:host-context(.ngs-sidenav.is-collapsed:hover)>.flex{display:flex}:host-context(.ngs-sidebar.only-compact) .text{display:none}:host-context(.ngs-sidebar.only-compact) .text ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.only-compact) .text ::ng-deep .ngs-sidebar-compact-view-mode{display:block}:host-context(.ngs-sidebar.only-compact){justify-content:center;gap:0}:host-context(.ngs-sidebar.only-compact)>.flex,:host-context(.ngs-sidebar.only-compact) .badge,:host-context(.ngs-sidebar.only-compact) .arrow{display:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
135
139
  }] });
136
140
 
137
141
  class SidebarNavItemDefDirective {
@@ -362,15 +366,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImpor
362
366
  }], ctorParameters: () => [], propDecorators: { _items: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SidebarNavItem), { ...{ descendants: true }, isSignal: true }] }], _groups: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SidebarNavGroup), { ...{ descendants: true }, isSignal: true }] }], _defs: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SidebarNavItemDefDirective), { isSignal: true }] }], activeKey: [{ type: i0.Input, args: [{ isSignal: true, alias: "activeKey", required: false }] }], dataSource: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataSource", required: false }] }], itemTypeProperty: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemTypeProperty", required: false }] }], autoScrollToActiveItem: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoScrollToActiveItem", required: false }] }], itemClicked: [{ type: i0.Output, args: ["itemClicked"] }] } });
363
367
 
364
368
  class SidebarFooter {
369
+ block = input(false, { ...(ngDevMode ? { debugName: "block" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
365
370
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SidebarFooter, deps: [], target: i0.ɵɵFactoryTarget.Component });
366
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: SidebarFooter, isStandalone: true, selector: "ngs-sidebar-footer", host: { classAttribute: "ngs-sidebar-footer" }, exportAs: ["ngsSidebarFooter"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{flex:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
371
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: SidebarFooter, isStandalone: true, selector: "ngs-sidebar-footer", inputs: { block: { classPropertyName: "block", publicName: "block", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.as-block": "block()" }, classAttribute: "ngs-sidebar-footer" }, exportAs: ["ngsSidebarFooter"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{flex:none;width:100%;display:flex;align-items:center}:host ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host.as-block{display:block}:host-context(.ngs-sidebar.compact:not(:hover)) ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.compact:not(:hover)) ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) ::ng-deep .ngs-sidebar-compact-view-mode{display:block}:host-context(.ngs-sidebar.compact:hover) ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host-context(.ngs-sidebar.compact:hover) ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) ::ng-deep .ngs-sidebar-full-view-mode{display:block}:host-context(.ngs-sidebar.only-compact) ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.only-compact) ::ng-deep .ngs-sidebar-compact-view-mode{display:block}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
367
372
  }
368
373
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SidebarFooter, decorators: [{
369
374
  type: Component,
370
375
  args: [{ selector: 'ngs-sidebar-footer', exportAs: 'ngsSidebarFooter', host: {
371
376
  'class': 'ngs-sidebar-footer',
372
- }, template: "<ng-content/>\n", styles: [":host{flex:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
373
- }] });
377
+ '[class.as-block]': 'block()'
378
+ }, template: "<ng-content/>\n", styles: [":host{flex:none;width:100%;display:flex;align-items:center}:host ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host.as-block{display:block}:host-context(.ngs-sidebar.compact:not(:hover)) ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.compact:not(:hover)) ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:not(:hover)) ::ng-deep .ngs-sidebar-compact-view-mode{display:block}:host-context(.ngs-sidebar.compact:hover) ::ng-deep .ngs-sidebar-compact-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) ::ng-deep .ngs-sidebar-compact-view-mode{display:none}:host-context(.ngs-sidebar.compact:hover) ::ng-deep .ngs-sidebar-full-view-mode,:host-context(.ngs-sidenav.is-collapsed:hover) ::ng-deep .ngs-sidebar-full-view-mode{display:block}:host-context(.ngs-sidebar.only-compact) ::ng-deep .ngs-sidebar-full-view-mode{display:none}:host-context(.ngs-sidebar.only-compact) ::ng-deep .ngs-sidebar-compact-view-mode{display:block}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
379
+ }], propDecorators: { block: [{ type: i0.Input, args: [{ isSignal: true, alias: "block", required: false }] }] } });
374
380
 
375
381
  class SidebarNavHeading {
376
382
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SidebarNavHeading, deps: [], target: i0.ɵɵFactoryTarget.Component });