@ojiepermana/angular 22.2.1 → 22.2.3

package/fesm2022/ojiepermana-angular-navigation.mjs

@@ -1,4 +1,4 @@
-import { t as NavigationListComponent } from "./ojiepermana-angular-navigation-navigation-list.component-CrK16trj.mjs";
+import { t as NavigationListComponent } from "./ojiepermana-angular-navigation-navigation-list.component-DfG6_3eF.mjs";
 import * as i0 from "@angular/core";
 import { Component, DestroyRef, Directive, ElementRef, InjectionToken, Injector, TemplateRef, ViewContainerRef, afterNextRender, booleanAttribute, computed, contentChild, effect, forwardRef, inject, input, isDevMode, model, output, signal } from "@angular/core";
 import { ActivatedRoute } from "@angular/router";
@@ -7,7 +7,8 @@ import { NavigationIconDirective, NavigationIconDirective as NavigationIconDirec
 import { NAVIGATION_ADAPTER, NAVIGATION_ROUTE_CONTEXT_ADAPTER } from "@ojiepermana/angular/navigation/core";
 import { NAVIGATION_DOCKBAR_FALLBACK_ICON, NAVIGATION_DOCKBAR_FALLBACK_ICON as NAVIGATION_DOCKBAR_FALLBACK_ICON$1, formatNavigationBadgeCount, normalizeUiNavItems, normalizeUiNavItems as normalizeUiNavItems$1, toMinidockItems, ɵassertMinidockItems, ɵcompactNavigationDividers } from "@ojiepermana/angular/navigation/types";
 import { NgTemplateOutlet } from "@angular/common";
-import { IconComponent } from "@ojiepermana/angular/component/icon";
+import { LucideCircle, LucideCircleDot, LucideRoute } from "@lucide/angular";
+import { IconComponent, provideIcons } from "@ojiepermana/angular/component/icon";
 import { TooltipDirective } from "@ojiepermana/angular/component/tooltip";
 export * from "@ojiepermana/angular/navigation/core";
 function injectNavigationController(inputs) {
@@ -95,6 +96,7 @@ var NavigationContainerComponent = class NavigationContainerComponent {
 	dataOwner = {};
 	hoverPreviewExpanded = signal(false, ...ngDevMode ? [{ debugName: "hoverPreviewExpanded" }] : /* istanbul ignore next */ []);
 	focusPreviewExpanded = signal(false, ...ngDevMode ? [{ debugName: "focusPreviewExpanded" }] : /* istanbul ignore next */ []);
+	motionArmed = signal(false, ...ngDevMode ? [{ debugName: "motionArmed" }] : /* istanbul ignore next */ []);
 	typeConfig = signal(null, ...ngDevMode ? [{ debugName: "typeConfig" }] : /* istanbul ignore next */ []);
 	orientationPreference = computed(() => this.typeConfig()?.orientation ?? "vertical", ...ngDevMode ? [{ debugName: "orientationPreference" }] : /* istanbul ignore next */ []);
 	typePreference = computed(() => this.typeConfig()?.type ?? null, ...ngDevMode ? [{ debugName: "typePreference" }] : /* istanbul ignore next */ []);
@@ -236,10 +238,13 @@ var NavigationContainerComponent = class NavigationContainerComponent {
 		const state = this.resolvedState();
 		return this.sidebarCollapse() && state.orientation === "vertical" && state.type === "sidebar";
 	}, ...ngDevMode ? [{ debugName: "collapseEnabled" }] : /* istanbul ignore next */ []);
-	shellClasses = computed(() => cn("flex h-full min-h-0 transition-[width,box-shadow,transform] duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] motion-reduce:transition-none", this.resolvedState().orientation === "horizontal" ? "flex-row items-stretch overflow-visible" : this.resolvedState().type === "dockbar" ? "flex-col overflow-visible" : "flex-col overflow-hidden", this.resolvedState().type === "dockbar" && ["w-(--layout-sidebar-collapsed-width) shrink-0", this.resolvedState().position === "right" && "ml-auto"], this.resolvedState().position === "right" ? "origin-right" : "origin-left", this.previewRailExpanded() && ["absolute inset-y-0 z-20 w-(--layout-sidebar-width) overflow-hidden bg-background shadow-xl", this.resolvedState().position === "right" ? "right-0 border-l border-border" : "left-0 border-r border-border"]), ...ngDevMode ? [{ debugName: "shellClasses" }] : /* istanbul ignore next */ []);
+	shellClasses = computed(() => cn("flex h-full min-h-0 transition-[width,box-shadow,transform] duration-slow ease-out motion-reduce:transition-none [[data-motion=off]_&]:transition-none", this.resolvedState().orientation === "horizontal" ? "flex-row items-stretch overflow-visible" : this.resolvedState().type === "dockbar" ? "flex-col overflow-visible" : "flex-col overflow-hidden", this.resolvedState().type === "dockbar" && ["w-(--layout-sidebar-collapsed-width) shrink-0", this.resolvedState().position === "right" && "ml-auto"], this.resolvedState().position === "right" ? "origin-right" : "origin-left", this.previewRailExpanded() && ["absolute inset-y-0 z-20 w-(--layout-sidebar-width) overflow-hidden bg-background shadow-xl", this.resolvedState().position === "right" ? "right-0 border-l border-border" : "left-0 border-r border-border"]), ...ngDevMode ? [{ debugName: "shellClasses" }] : /* istanbul ignore next */ []);
 	state = this.resolvedState;
 	resolvedDataId = computed(() => this.dataId()?.trim() || this.navId().trim() || "default", ...ngDevMode ? [{ debugName: "resolvedDataId" }] : /* istanbul ignore next */ []);
-	hostClasses = computed(() => cn("relative block min-h-0 text-foreground transition-[width] duration-300 ease-[cubic-bezier(0.22,1,0.36,1)] motion-reduce:transition-none", this.resolvedState().orientation === "horizontal" ? "h-full w-full" : this.resolvedState().type === "dockbar" ? this.dockbarAsideOpen() ? "w-[calc(var(--layout-sidebar-collapsed-width)+var(--layout-aside-width))]" : "w-(--layout-sidebar-collapsed-width)" : this.resolvedState().type === "minidock" || this.resolvedState().collapsed ? "w-(--layout-sidebar-collapsed-width)" : "w-(--layout-sidebar-width)", this.resolvedState().orientation === "horizontal" || this.resolvedState().type === "dockbar" || this.previewRailExpanded() ? "overflow-visible" : "overflow-hidden", this.class()), ...ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []);
+	hostClasses = computed(() => cn("relative block min-h-0 text-foreground transition-[width] duration-slow ease-out motion-reduce:transition-none data-[motion=off]:transition-none", this.resolvedState().orientation === "horizontal" ? "h-full w-full" : this.resolvedState().type === "dockbar" ? this.dockbarAsideOpen() ? "w-[calc(var(--layout-sidebar-collapsed-width)+var(--layout-aside-width))]" : "w-(--layout-sidebar-collapsed-width)" : this.resolvedState().type === "minidock" || this.resolvedState().collapsed ? "w-(--layout-sidebar-collapsed-width)" : "w-(--layout-sidebar-width)", this.resolvedState().orientation === "horizontal" || this.resolvedState().type === "dockbar" || this.previewRailExpanded() ? "overflow-visible" : "overflow-hidden", this.class()), ...ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []);
+	armMotion() {
+		if (!this.motionArmed()) this.motionArmed.set(true);
+	}
 	constructor() {
 		effect((onCleanup) => {
 			const dataId = this.resolvedDataId();
@@ -302,7 +307,7 @@ var NavigationContainerComponent = class NavigationContainerComponent {
 	}
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationContainerComponent,
 		deps: [],
@@ -310,7 +315,7 @@ var NavigationContainerComponent = class NavigationContainerComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.2.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationContainerComponent,
 		isStandalone: true,
 		selector: "Navigation",
@@ -407,6 +412,8 @@ var NavigationContainerComponent = class NavigationContainerComponent {
 		host: {
 			attributes: { "role": "navigation" },
 			listeners: {
+				"document:pointerdown": "armMotion()",
+				"document:keydown": "armMotion()",
 				"mouseenter": "setHoverPreview(true)",
 				"mouseleave": "setHoverPreview(false)",
 				"focusin": "setFocusPreview(true)",
@@ -422,7 +429,8 @@ var NavigationContainerComponent = class NavigationContainerComponent {
 				"attr.data-type-style": "typeStyle()",
 				"attr.data-position": "resolvedState().position",
 				"attr.data-collapse-tree": "collapseTree()",
-				"attr.data-preview-expanded": "previewRailExpanded() ? \"true\" : null"
+				"attr.data-preview-expanded": "previewRailExpanded() ? \"true\" : null",
+				"attr.data-motion": "motionArmed() ? null : \"off\""
 			}
 		},
 		providers: [{
@@ -443,7 +451,7 @@ var NavigationContainerComponent = class NavigationContainerComponent {
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationContainerComponent,
 	decorators: [{
@@ -466,6 +474,9 @@ i0.ɵɵngDeclareClassMetadata({
 				"[attr.data-position]": "resolvedState().position",
 				"[attr.data-collapse-tree]": "collapseTree()",
 				"[attr.data-preview-expanded]": "previewRailExpanded() ? \"true\" : null",
+				"[attr.data-motion]": "motionArmed() ? null : \"off\"",
+				"(document:pointerdown)": "armMotion()",
+				"(document:keydown)": "armMotion()",
 				"(mouseenter)": "setHoverPreview(true)",
 				"(mouseleave)": "setHoverPreview(false)",
 				"(focusin)": "setFocusPreview(true)",
@@ -594,7 +605,7 @@ var NavigationContentComponent = class NavigationContentComponent {
 	hostClasses = computed(() => cn("min-h-0 flex-1", this.container.displayState().orientation === "horizontal" ? "flex h-full min-w-0 items-stretch justify-center overflow-visible" : this.container.displayState().type === "minidock" ? "flex flex-col overflow-y-auto overflow-x-hidden py-2" : "block overflow-y-auto overflow-x-hidden py-2", this.class()), ...ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []);
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationContentComponent,
 		deps: [],
@@ -602,7 +613,7 @@ var NavigationContentComponent = class NavigationContentComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationContentComponent,
 		isStandalone: true,
 		selector: "NavigationContent",
@@ -751,21 +762,21 @@ var NavigationContentComponent = class NavigationContentComponent {
 			outputs: ["openedIdsChange", "itemSelected"]
 		}],
 		deferBlockDependencies: [
-			() => [import("./ojiepermana-angular-navigation-navigation-flyout-menu.component-D2vwEwBY.mjs").then((m) => m.NavigationFlyoutMenuComponent)],
-			() => [import("./ojiepermana-angular-navigation-navigation-horizontal.component-B5D7yXfb.mjs").then((m) => m.NavigationHorizontalComponent)],
-			() => [import("./ojiepermana-angular-navigation-navigation-dockbar-menu.component-COiTaw34.mjs").then((m) => m.NavigationDockbarMenuComponent)]
+			() => [import("./ojiepermana-angular-navigation-navigation-flyout-menu.component-DRdw2G-c.mjs").then((m) => m.NavigationFlyoutMenuComponent)],
+			() => [import("./ojiepermana-angular-navigation-navigation-horizontal.component-Bx1NcrWO.mjs").then((m) => m.NavigationHorizontalComponent)],
+			() => [import("./ojiepermana-angular-navigation-navigation-dockbar-menu.component-I-ln7fOq.mjs").then((m) => m.NavigationDockbarMenuComponent)]
 		]
 	});
 };
 i0.ɵɵngDeclareClassMetadataAsync({
 	minVersion: "18.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationContentComponent,
 	resolveDeferredDeps: () => [
-		import("./ojiepermana-angular-navigation-navigation-flyout-menu.component-D2vwEwBY.mjs").then((m) => m.NavigationFlyoutMenuComponent),
-		import("./ojiepermana-angular-navigation-navigation-horizontal.component-B5D7yXfb.mjs").then((m) => m.NavigationHorizontalComponent),
-		import("./ojiepermana-angular-navigation-navigation-dockbar-menu.component-COiTaw34.mjs").then((m) => m.NavigationDockbarMenuComponent)
+		import("./ojiepermana-angular-navigation-navigation-flyout-menu.component-DRdw2G-c.mjs").then((m) => m.NavigationFlyoutMenuComponent),
+		import("./ojiepermana-angular-navigation-navigation-horizontal.component-Bx1NcrWO.mjs").then((m) => m.NavigationHorizontalComponent),
+		import("./ojiepermana-angular-navigation-navigation-dockbar-menu.component-I-ln7fOq.mjs").then((m) => m.NavigationDockbarMenuComponent)
 	],
 	resolveMetadata: (NavigationFlyoutMenuComponent, NavigationHorizontalComponent, NavigationDockbarMenuComponent) => ({
 		decorators: [{
@@ -918,7 +929,7 @@ var NavigationFooterComponent = class NavigationFooterComponent {
 	hostClasses = computed(() => cn(this.isHorizontal() ? "relative z-10 block h-full w-auto shrink-0" : "sticky bottom-0 z-10 block h-(--layout-topbar-height) shrink-0 border-t border-[hsl(var(--border)/var(--section-border-opacity))]", this.class()), ...ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []);
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationFooterComponent,
 		deps: [],
@@ -926,7 +937,7 @@ var NavigationFooterComponent = class NavigationFooterComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.1.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationFooterComponent,
 		isStandalone: true,
 		selector: "NavigationFooter",
@@ -952,7 +963,7 @@ var NavigationFooterComponent = class NavigationFooterComponent {
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationFooterComponent,
 	decorators: [{
@@ -994,7 +1005,6 @@ var NavigationHeaderComponent = class NavigationHeaderComponent {
 		return this.toggle() || this.shell.collapseEnabled();
 	}, ...ngDevMode ? [{ debugName: "showToggle" }] : /* istanbul ignore next */ []);
 	toggleAriaLabel = computed(() => this.collapsed() ? "Expand navigation" : "Collapse navigation", ...ngDevMode ? [{ debugName: "toggleAriaLabel" }] : /* istanbul ignore next */ []);
-	toggleIconName = computed(() => this.collapsed() ? "left_panel_open" : "left_panel_close", ...ngDevMode ? [{ debugName: "toggleIconName" }] : /* istanbul ignore next */ []);
 	rowClasses = computed(() => cn("flex h-full items-center", !this.isHorizontal() && this.displayCollapsed() ? "justify-center" : "gap-3 px-3"), ...ngDevMode ? [{ debugName: "rowClasses" }] : /* istanbul ignore next */ []);
 	contentClasses = computed(() => {
 		if (this.isHorizontal()) return "flex min-w-0 items-center gap-3";
@@ -1006,7 +1016,7 @@ var NavigationHeaderComponent = class NavigationHeaderComponent {
 	}
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationHeaderComponent,
 		deps: [],
@@ -1014,7 +1024,7 @@ var NavigationHeaderComponent = class NavigationHeaderComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationHeaderComponent,
 		isStandalone: true,
 		selector: "NavigationHeader",
@@ -1038,6 +1048,7 @@ var NavigationHeaderComponent = class NavigationHeaderComponent {
 			"class": "hostClasses()",
 			"attr.data-collapsed": "displayCollapsed()"
 		} },
+		providers: [provideIcons(LucideCircle, LucideCircleDot)],
 		ngImport: i0,
 		template: `
     <div [class]="rowClasses()">
@@ -1056,7 +1067,7 @@ var NavigationHeaderComponent = class NavigationHeaderComponent {
         >
           <Icon
             data-navigation-header-toggle-icon="true"
-            [name]="toggleIconName()"
+            [name]="collapsed() ? 'circle' : 'circle-dot'"
             size="inherit"
             class="text-(length:--nav-icon-size)"
           />
@@ -1073,17 +1084,15 @@ var NavigationHeaderComponent = class NavigationHeaderComponent {
 				"name",
 				"class",
 				"size",
-				"fill",
-				"weight",
-				"grade",
-				"opticalSize"
+				"strokeWidth",
+				"label"
 			]
 		}]
 	});
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationHeaderComponent,
 	decorators: [{
@@ -1091,6 +1100,7 @@ i0.ɵɵngDeclareClassMetadata({
 		args: [{
 			selector: "NavigationHeader",
 			imports: [IconComponent],
+			providers: [provideIcons(LucideCircle, LucideCircleDot)],
 			host: {
 				"[class]": "hostClasses()",
 				"[attr.data-collapsed]": "displayCollapsed()"
@@ -1112,7 +1122,7 @@ i0.ɵɵngDeclareClassMetadata({
         >
           <Icon
             data-navigation-header-toggle-icon="true"
-            [name]="toggleIconName()"
+            [name]="collapsed() ? 'circle' : 'circle-dot'"
             size="inherit"
             class="text-(length:--nav-icon-size)"
           />
@@ -1174,7 +1184,7 @@ var NavigationSidebarComponent = class NavigationSidebarComponent {
 	}
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationSidebarComponent,
 		deps: [],
@@ -1182,7 +1192,7 @@ var NavigationSidebarComponent = class NavigationSidebarComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationSidebarComponent,
 		isStandalone: true,
 		selector: "NavigationSidebar",
@@ -1274,7 +1284,7 @@ var NavigationSidebarComponent = class NavigationSidebarComponent {
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationSidebarComponent,
 	decorators: [{
@@ -1360,7 +1370,7 @@ var NavigationAsideFooterDirective = class NavigationAsideFooterDirective {
 	templateRef = inject(TemplateRef);
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationAsideFooterDirective,
 		deps: [],
@@ -1368,7 +1378,7 @@ var NavigationAsideFooterDirective = class NavigationAsideFooterDirective {
 	});
 	static ɵdir = i0.ɵɵngDeclareDirective({
 		minVersion: "14.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationAsideFooterDirective,
 		isStandalone: true,
 		selector: "ng-template[NavigationAsideFooter]",
@@ -1377,7 +1387,7 @@ var NavigationAsideFooterDirective = class NavigationAsideFooterDirective {
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationAsideFooterDirective,
 	decorators: [{
@@ -1450,7 +1460,7 @@ var NavigationDockbarComponent = class NavigationDockbarComponent {
 	}
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationDockbarComponent,
 		deps: [],
@@ -1458,7 +1468,7 @@ var NavigationDockbarComponent = class NavigationDockbarComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationDockbarComponent,
 		isStandalone: true,
 		selector: "NavigationDockbar",
@@ -1506,6 +1516,7 @@ var NavigationDockbarComponent = class NavigationDockbarComponent {
 			},
 			properties: { "class": "hostClasses()" }
 		},
+		providers: [provideIcons(LucideRoute)],
 		queries: [
 			{
 				propertyName: "headerSlot",
@@ -1553,7 +1564,7 @@ var NavigationDockbarComponent = class NavigationDockbarComponent {
                 [ngTemplateOutletContext]="routeHeader.iconContext"
               />
             } @else {
-              <Icon [name]="routeHeader.icon" size="inherit" [fill]="1" />
+              <Icon [name]="routeHeader.icon" size="inherit" />
             }
           </span>
 
@@ -1614,10 +1625,8 @@ var NavigationDockbarComponent = class NavigationDockbarComponent {
 					"name",
 					"class",
 					"size",
-					"fill",
-					"weight",
-					"grade",
-					"opticalSize"
+					"strokeWidth",
+					"label"
 				]
 			},
 			{
@@ -1656,15 +1665,15 @@ var NavigationDockbarComponent = class NavigationDockbarComponent {
 				exportAs: ["Tooltip"]
 			}
 		],
-		deferBlockDependencies: [() => [import("./ojiepermana-angular-navigation-navigation-badge-count.component-DYuysKVf.mjs").then((m) => m.NavigationBadgeCountComponent)]]
+		deferBlockDependencies: [() => [import("./ojiepermana-angular-navigation-navigation-badge-count.component-4RIokl1C.mjs").then((m) => m.NavigationBadgeCountComponent)]]
 	});
 };
 i0.ɵɵngDeclareClassMetadataAsync({
 	minVersion: "18.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationDockbarComponent,
-	resolveDeferredDeps: () => [import("./ojiepermana-angular-navigation-navigation-badge-count.component-DYuysKVf.mjs").then((m) => m.NavigationBadgeCountComponent)],
+	resolveDeferredDeps: () => [import("./ojiepermana-angular-navigation-navigation-badge-count.component-4RIokl1C.mjs").then((m) => m.NavigationBadgeCountComponent)],
 	resolveMetadata: (NavigationBadgeCountComponent) => ({
 		decorators: [{
 			type: Component,
@@ -1678,6 +1687,7 @@ i0.ɵɵngDeclareClassMetadataAsync({
 					NgTemplateOutlet,
 					TooltipDirective
 				],
+				providers: [provideIcons(LucideRoute)],
 				host: {
 					"[class]": "hostClasses()",
 					"(keydown.escape)": "onEscape($event)",
@@ -1699,7 +1709,7 @@ i0.ɵɵngDeclareClassMetadataAsync({
                 [ngTemplateOutletContext]="routeHeader.iconContext"
               />
             } @else {
-              <Icon [name]="routeHeader.icon" size="inherit" [fill]="1" />
+              <Icon [name]="routeHeader.icon" size="inherit" />
             }
           </span>
 
@@ -1840,7 +1850,7 @@ var NavigationMinidockComponent = class NavigationMinidockComponent {
 	}
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationMinidockComponent,
 		deps: [],
@@ -1848,7 +1858,7 @@ var NavigationMinidockComponent = class NavigationMinidockComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationMinidockComponent,
 		isStandalone: true,
 		selector: "NavigationMinidock",
@@ -1921,7 +1931,7 @@ var NavigationMinidockComponent = class NavigationMinidockComponent {
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationMinidockComponent,
 	decorators: [{
@@ -2012,7 +2022,7 @@ var NavigationNavbarComponent = class NavigationNavbarComponent {
 	}
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationNavbarComponent,
 		deps: [],
@@ -2020,7 +2030,7 @@ var NavigationNavbarComponent = class NavigationNavbarComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationNavbarComponent,
 		isStandalone: true,
 		selector: "NavigationNavbar",
@@ -2098,7 +2108,7 @@ var NavigationNavbarComponent = class NavigationNavbarComponent {
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationNavbarComponent,
 	decorators: [{
@@ -2234,7 +2244,7 @@ var NavigationFlyoutComponent = class NavigationFlyoutComponent {
 	}
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationFlyoutComponent,
 		deps: [],
@@ -2242,7 +2252,7 @@ var NavigationFlyoutComponent = class NavigationFlyoutComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.1.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationFlyoutComponent,
 		isStandalone: true,
 		selector: "NavigationFlyout",
@@ -2355,7 +2365,7 @@ var NavigationFlyoutComponent = class NavigationFlyoutComponent {
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationFlyoutComponent,
 	decorators: [{
@@ -2491,7 +2501,7 @@ var NavigationCollapseRootDirective = class NavigationCollapseRootDirective {
 	displayCollapsed = computed(() => isCompactDisplay(this.shell), ...ngDevMode ? [{ debugName: "displayCollapsed" }] : /* istanbul ignore next */ []);
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationCollapseRootDirective,
 		deps: [],
@@ -2499,7 +2509,7 @@ var NavigationCollapseRootDirective = class NavigationCollapseRootDirective {
 	});
 	static ɵdir = i0.ɵɵngDeclareDirective({
 		minVersion: "14.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationCollapseRootDirective,
 		isStandalone: true,
 		selector: "[NavigationCollapseRoot]",
@@ -2512,7 +2522,7 @@ var NavigationCollapseRootDirective = class NavigationCollapseRootDirective {
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationCollapseRootDirective,
 	decorators: [{
@@ -2549,7 +2559,7 @@ var NavigationCollapseExpandedDirective = class NavigationCollapseExpandedDirect
 	}
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationCollapseExpandedDirective,
 		deps: [],
@@ -2557,7 +2567,7 @@ var NavigationCollapseExpandedDirective = class NavigationCollapseExpandedDirect
 	});
 	static ɵdir = i0.ɵɵngDeclareDirective({
 		minVersion: "14.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationCollapseExpandedDirective,
 		isStandalone: true,
 		selector: "[NavigationCollapseExpanded]",
@@ -2566,7 +2576,7 @@ var NavigationCollapseExpandedDirective = class NavigationCollapseExpandedDirect
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationCollapseExpandedDirective,
 	decorators: [{
@@ -2588,7 +2598,7 @@ var NavigationFooterActionComponent = class NavigationFooterActionComponent {
 	hostClasses = computed(() => cn(this.collapsed() ? "hidden" : "ml-auto flex shrink-0 items-center gap-1", this.class()), ...ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []);
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationFooterActionComponent,
 		deps: [],
@@ -2596,7 +2606,7 @@ var NavigationFooterActionComponent = class NavigationFooterActionComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.1.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationFooterActionComponent,
 		isStandalone: true,
 		selector: "NavigationFooterAction",
@@ -2615,7 +2625,7 @@ var NavigationFooterActionComponent = class NavigationFooterActionComponent {
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationFooterActionComponent,
 	decorators: [{
@@ -2670,7 +2680,7 @@ var NavigationFooterInitialComponent = class NavigationFooterInitialComponent {
 	hostClasses = this.view.hostClasses;
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationFooterInitialComponent,
 		deps: [],
@@ -2678,7 +2688,7 @@ var NavigationFooterInitialComponent = class NavigationFooterInitialComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationFooterInitialComponent,
 		isStandalone: true,
 		selector: "NavigationFooterInitial",
@@ -2729,7 +2739,7 @@ var NavigationFooterInitialComponent = class NavigationFooterInitialComponent {
     @if (src(); as source) {
       <img [src]="source" alt="" class="h-full w-full rounded-[inherit] object-cover" />
     } @else if (icon(); as glyph) {
-      <Icon [name]="glyph" size="inherit" [fill]="1" class="text-(length:--nav-icon-size)" />
+      <Icon [name]="glyph" size="inherit" class="text-(length:--nav-icon-size)" />
     } @else {
       <span class="text-xs font-semibold leading-none">{{ resolvedInitials() }}</span>
     }
@@ -2743,17 +2753,15 @@ var NavigationFooterInitialComponent = class NavigationFooterInitialComponent {
 				"name",
 				"class",
 				"size",
-				"fill",
-				"weight",
-				"grade",
-				"opticalSize"
+				"strokeWidth",
+				"label"
 			]
 		}]
 	});
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationFooterInitialComponent,
 	decorators: [{
@@ -2770,7 +2778,7 @@ i0.ɵɵngDeclareClassMetadata({
     @if (src(); as source) {
       <img [src]="source" alt="" class="h-full w-full rounded-[inherit] object-cover" />
     } @else if (icon(); as glyph) {
-      <Icon [name]="glyph" size="inherit" [fill]="1" class="text-(length:--nav-icon-size)" />
+      <Icon [name]="glyph" size="inherit" class="text-(length:--nav-icon-size)" />
     } @else {
       <span class="text-xs font-semibold leading-none">{{ resolvedInitials() }}</span>
     }
@@ -2835,7 +2843,7 @@ var NavigationFooterTitleComponent = class NavigationFooterTitleComponent {
 	hostClasses = computed(() => cn(this.collapsed() ? "hidden" : "flex min-w-0 flex-col justify-center", this.class()), ...ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []);
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationFooterTitleComponent,
 		deps: [],
@@ -2843,7 +2851,7 @@ var NavigationFooterTitleComponent = class NavigationFooterTitleComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationFooterTitleComponent,
 		isStandalone: true,
 		selector: "NavigationFooterTitle",
@@ -2891,7 +2899,7 @@ var NavigationFooterTitleComponent = class NavigationFooterTitleComponent {
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationFooterTitleComponent,
 	decorators: [{
@@ -2966,7 +2974,7 @@ var NavigationHeaderInitialComponent = class NavigationHeaderInitialComponent {
 	hostClasses = this.view.hostClasses;
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationHeaderInitialComponent,
 		deps: [],
@@ -2974,7 +2982,7 @@ var NavigationHeaderInitialComponent = class NavigationHeaderInitialComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationHeaderInitialComponent,
 		isStandalone: true,
 		selector: "NavigationHeaderInitial",
@@ -3032,7 +3040,7 @@ var NavigationHeaderInitialComponent = class NavigationHeaderInitialComponent {
     @if (src(); as source) {
       <img [src]="source" alt="" class="h-full w-full rounded-[inherit] object-cover" />
     } @else if (icon(); as glyph) {
-      <Icon [name]="glyph" size="inherit" [fill]="1" [class]="iconClasses()" />
+      <Icon [name]="glyph" size="inherit" [class]="iconClasses()" />
     } @else {
       <span class="text-xs font-semibold leading-none">{{ resolvedInitials() }}</span>
     }
@@ -3046,17 +3054,15 @@ var NavigationHeaderInitialComponent = class NavigationHeaderInitialComponent {
 				"name",
 				"class",
 				"size",
-				"fill",
-				"weight",
-				"grade",
-				"opticalSize"
+				"strokeWidth",
+				"label"
 			]
 		}]
 	});
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationHeaderInitialComponent,
 	decorators: [{
@@ -3073,7 +3079,7 @@ i0.ɵɵngDeclareClassMetadata({
     @if (src(); as source) {
       <img [src]="source" alt="" class="h-full w-full rounded-[inherit] object-cover" />
     } @else if (icon(); as glyph) {
-      <Icon [name]="glyph" size="inherit" [fill]="1" [class]="iconClasses()" />
+      <Icon [name]="glyph" size="inherit" [class]="iconClasses()" />
     } @else {
       <span class="text-xs font-semibold leading-none">{{ resolvedInitials() }}</span>
     }
@@ -3146,7 +3152,7 @@ var NavigationHeaderTitleComponent = class NavigationHeaderTitleComponent {
 	hostClasses = computed(() => cn(this.collapsed() ? "hidden" : "flex min-w-0 flex-col justify-center", this.class()), ...ngDevMode ? [{ debugName: "hostClasses" }] : /* istanbul ignore next */ []);
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		ngImport: i0,
 		type: NavigationHeaderTitleComponent,
 		deps: [],
@@ -3154,7 +3160,7 @@ var NavigationHeaderTitleComponent = class NavigationHeaderTitleComponent {
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.0.0",
-		version: "22.2.2",
+		version: "22.2.3",
 		type: NavigationHeaderTitleComponent,
 		isStandalone: true,
 		selector: "NavigationHeaderTitle",
@@ -3202,7 +3208,7 @@ var NavigationHeaderTitleComponent = class NavigationHeaderTitleComponent {
 };
 i0.ɵɵngDeclareClassMetadata({
 	minVersion: "12.0.0",
-	version: "22.2.2",
+	version: "22.2.3",
 	ngImport: i0,
 	type: NavigationHeaderTitleComponent,
 	decorators: [{