@egose/shadcn-theme-ng 0.0.28 → 0.1.0

package/sidebar/fesm2022/sidebar.mjs

@@ -1,7 +1,9 @@
 import * as i0 from '@angular/core';
 import { InjectionToken, inject, PLATFORM_ID, REQUEST, DOCUMENT, signal, computed, DestroyRef, afterNextRender, Injectable, input, effect, ChangeDetectionStrategy, Component, Directive, booleanAttribute, NgModule } from '@angular/core';
 import { isPlatformServer, NgTemplateOutlet } from '@angular/common';
-import * as i1 from '@egose/shadcn-theme-ng/sheet';
+import * as i1 from '@spartan-ng/brain/sheet';
+import { BrnSheetImports } from '@spartan-ng/brain/sheet';
+import * as i2 from '@egose/shadcn-theme-ng/sheet';
 import { HlmSheetImports } from '@egose/shadcn-theme-ng/sheet';
 import { hlm, classes } from '@egose/shadcn-theme-ng/utils';
 import * as i1$1 from '@egose/shadcn-theme-ng/input';
@@ -145,10 +147,10 @@ class HlmSidebarService {
             this._open.set(cookieValue === 'true');
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [] });
@@ -164,15 +166,15 @@ class HlmSidebar {
     ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
     collapsible = input('offcanvas', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "collapsible" }] : /* istanbul ignore next */ []));
-    _sidebarGapComputedClass = computed(() => hlm('transition-[width] duration-200 ease-linear relative w-(--sidebar-width) bg-transparent', 'group-data-[collapsible=offcanvas]:w-0', 'group-data-[side=right]:rotate-180', this.variant() === 'floating' || this.variant() === 'inset'
-        ? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]'
-        : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon)'), /* @ts-ignore */
+    _sidebarGapComputedClass = computed(() => hlm("transition-[width] duration-200 ease-linear relative w-(--sidebar-width) bg-transparent", "group-data-[collapsible=offcanvas]:w-0", "group-data-[side=right]:rotate-180", this.variant() === 'floating' || this.variant() === 'inset'
+        ? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]"
+        : "group-data-[collapsible=icon]:w-(--sidebar-width-icon)"), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "_sidebarGapComputedClass" }] : /* istanbul ignore next */ []));
     sidebarContainerClass = input('', /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "sidebarContainerClass" }] : /* istanbul ignore next */ []));
-    _sidebarContainerComputedClass = computed(() => hlm('fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear data-[side=left]:left-0 data-[side=left]:group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)] data-[side=right]:right-0 data-[side=right]:group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)] md:flex', this.variant() === 'floating' || this.variant() === 'inset'
-        ? 'p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]'
-        : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l', this.sidebarContainerClass()), /* @ts-ignore */
+    _sidebarContainerComputedClass = computed(() => hlm("fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear data-[side=left]:left-0 data-[side=left]:group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)] data-[side=right]:right-0 data-[side=right]:group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)] md:flex", this.variant() === 'floating' || this.variant() === 'inset'
+        ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]"
+        : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l", this.sidebarContainerClass()), /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "_sidebarContainerComputedClass" }] : /* istanbul ignore next */ []));
     _dataSlot = computed(() => {
         return !this._sidebarService.isMobile() ? 'sidebar' : undefined;
@@ -208,63 +210,24 @@ class HlmSidebar {
         });
         classes(() => {
             if (this.collapsible() === 'none') {
-                return hlm('bg-sidebar text-sidebar-foreground flex h-svh w-(--sidebar-width) flex-col');
+                return hlm("bg-sidebar text-sidebar-foreground flex h-svh w-(--sidebar-width) flex-col");
             }
             else if (this._sidebarService.isMobile()) {
                 return '';
             }
             else {
-                return hlm('group peer text-sidebar-foreground hidden md:block');
+                return hlm("group peer text-sidebar-foreground hidden md:block");
             }
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebar, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: HlmSidebar, isStandalone: true, selector: "hlm-sidebar", inputs: { sidebarWidthMobile: { classPropertyName: "sidebarWidthMobile", publicName: "sidebarWidthMobile", isSignal: true, isRequired: false, transformFunction: null }, side: { classPropertyName: "side", publicName: "side", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, sidebarContainerClass: { classPropertyName: "sidebarContainerClass", publicName: "sidebarContainerClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-slot": "_dataSlot()", "attr.data-state": "_dataState()", "attr.data-collapsible": "_dataCollapsible()", "attr.data-variant": "_dataVariant()", "attr.data-side": "_dataSide()" } }, ngImport: i0, template: `
-    <ng-template #contentContainer>
-      <ng-content />
-    </ng-template>
-
-    @if (collapsible() === 'none') {
-      <ng-container *ngTemplateOutlet="contentContainer"></ng-container>
-    } @else if (_sidebarService.isMobile()) {
-      <hlm-sheet
-        [side]="side()"
-        [state]="_sidebarService.openMobile() ? 'open' : 'closed'"
-        (stateChanged)="_sidebarService.setOpenMobile($event === 'open')"
-      >
-        <hlm-sheet-content
-          *hlmSheetPortal="let ctx"
-          data-slot="sidebar"
-          data-sidebar="sidebar"
-          data-mobile="true"
-          class="bg-sidebar text-sidebar-foreground h-svh w-(--sidebar-width) p-0 [&>button]:hidden"
-          [style.--sidebar-width]="sidebarWidthMobile()"
-        >
-          <div class="flex h-full w-full flex-col">
-            <ng-container *ngTemplateOutlet="contentContainer" />
-          </div>
-        </hlm-sheet-content>
-      </hlm-sheet>
-    } @else {
-      <!-- Sidebar gap on desktop -->
-      <div data-slot="sidebar-gap" [class]="_sidebarGapComputedClass()"></div>
-      <div data-slot="sidebar-container" [attr.data-side]="_dataSide()" [class]="_sidebarContainerComputedClass()">
-        <div
-          data-sidebar="sidebar"
-          data-slot="sidebar-inner"
-          class="bg-sidebar group-data-[variant=floating]:ring-sidebar-border group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:shadow-sm group-data-[variant=floating]:ring-1 flex size-full flex-col"
-        >
-          <ng-container *ngTemplateOutlet="contentContainer" />
-        </div>
-      </div>
-    }
-  `, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1.HlmSheet, selector: "hlm-sheet", exportAs: ["hlmSheet"] }, { kind: "component", type: i1.HlmSheetContent, selector: "hlm-sheet-content", inputs: ["class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebar, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.3", type: HlmSidebar, isStandalone: true, selector: "hlm-sidebar", inputs: { sidebarWidthMobile: { classPropertyName: "sidebarWidthMobile", publicName: "sidebarWidthMobile", isSignal: true, isRequired: false, transformFunction: null }, side: { classPropertyName: "side", publicName: "side", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, sidebarContainerClass: { classPropertyName: "sidebarContainerClass", publicName: "sidebarContainerClass", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-slot": "_dataSlot()", "attr.data-state": "_dataState()", "attr.data-collapsible": "_dataCollapsible()", "attr.data-variant": "_dataVariant()", "attr.data-side": "_dataSide()" } }, ngImport: i0, template: "\n    <ng-template #contentContainer>\n      <ng-content />\n    </ng-template>\n\n    @if (collapsible() === 'none') {\n      <ng-container *ngTemplateOutlet=\"contentContainer\"></ng-container>\n    } @else if (_sidebarService.isMobile()) {\n      <hlm-sheet\n        [side]=\"side()\"\n        [state]=\"_sidebarService.openMobile() ? 'open' : 'closed'\"\n        (stateChanged)=\"_sidebarService.setOpenMobile($event === 'open')\"\n      >\n        <hlm-sheet-content\n          *brnSheetContent=\"let ctx\"\n          data-slot=\"sidebar\"\n          data-sidebar=\"sidebar\"\n          data-mobile=\"true\"\n          class=\"bg-sidebar text-sidebar-foreground h-svh w-(--sidebar-width) p-0 [&>button]:hidden\"\n          [style.--sidebar-width]=\"sidebarWidthMobile()\"\n        >\n          <div class=\"flex h-full w-full flex-col\">\n            <ng-container *ngTemplateOutlet=\"contentContainer\" />\n          </div>\n        </hlm-sheet-content>\n      </hlm-sheet>\n    } @else {\n      <!-- Sidebar gap on desktop -->\n      <div data-slot=\"sidebar-gap\" [class]=\"_sidebarGapComputedClass()\"></div>\n      <div data-slot=\"sidebar-container\" [attr.data-side]=\"_dataSide()\" [class]=\"_sidebarContainerComputedClass()\">\n        <div\n          data-sidebar=\"sidebar\"\n          data-slot=\"sidebar-inner\"\n          class=\"bg-sidebar group-data-[variant=floating]:ring-sidebar-border group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:shadow-sm group-data-[variant=floating]:ring-1 flex size-full flex-col\"\n        >\n          <ng-container *ngTemplateOutlet=\"contentContainer\" />\n        </div>\n      </div>\n    }\n  ", isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.BrnSheetContent, selector: "[brnSheetContent]" }, { kind: "component", type: i2.HlmSheet, selector: "hlm-sheet", exportAs: ["hlmSheet"] }, { kind: "component", type: i2.HlmSheetContent, selector: "hlm-sheet-content", inputs: ["class"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebar, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebar, decorators: [{
             type: Component,
             args: [{
                     selector: 'hlm-sidebar',
-                    imports: [NgTemplateOutlet, HlmSheetImports],
+                    imports: [NgTemplateOutlet, BrnSheetImports, HlmSheetImports],
                     changeDetection: ChangeDetectionStrategy.OnPush,
                     host: {
                         '[attr.data-slot]': '_dataSlot()',
@@ -273,57 +236,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         '[attr.data-variant]': '_dataVariant()',
                         '[attr.data-side]': '_dataSide()',
                     },
-                    template: `
-    <ng-template #contentContainer>
-      <ng-content />
-    </ng-template>
-
-    @if (collapsible() === 'none') {
-      <ng-container *ngTemplateOutlet="contentContainer"></ng-container>
-    } @else if (_sidebarService.isMobile()) {
-      <hlm-sheet
-        [side]="side()"
-        [state]="_sidebarService.openMobile() ? 'open' : 'closed'"
-        (stateChanged)="_sidebarService.setOpenMobile($event === 'open')"
-      >
-        <hlm-sheet-content
-          *hlmSheetPortal="let ctx"
-          data-slot="sidebar"
-          data-sidebar="sidebar"
-          data-mobile="true"
-          class="bg-sidebar text-sidebar-foreground h-svh w-(--sidebar-width) p-0 [&>button]:hidden"
-          [style.--sidebar-width]="sidebarWidthMobile()"
-        >
-          <div class="flex h-full w-full flex-col">
-            <ng-container *ngTemplateOutlet="contentContainer" />
-          </div>
-        </hlm-sheet-content>
-      </hlm-sheet>
-    } @else {
-      <!-- Sidebar gap on desktop -->
-      <div data-slot="sidebar-gap" [class]="_sidebarGapComputedClass()"></div>
-      <div data-slot="sidebar-container" [attr.data-side]="_dataSide()" [class]="_sidebarContainerComputedClass()">
-        <div
-          data-sidebar="sidebar"
-          data-slot="sidebar-inner"
-          class="bg-sidebar group-data-[variant=floating]:ring-sidebar-border group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:shadow-sm group-data-[variant=floating]:ring-1 flex size-full flex-col"
-        >
-          <ng-container *ngTemplateOutlet="contentContainer" />
-        </div>
-      </div>
-    }
-  `,
+                    template: "\n    <ng-template #contentContainer>\n      <ng-content />\n    </ng-template>\n\n    @if (collapsible() === 'none') {\n      <ng-container *ngTemplateOutlet=\"contentContainer\"></ng-container>\n    } @else if (_sidebarService.isMobile()) {\n      <hlm-sheet\n        [side]=\"side()\"\n        [state]=\"_sidebarService.openMobile() ? 'open' : 'closed'\"\n        (stateChanged)=\"_sidebarService.setOpenMobile($event === 'open')\"\n      >\n        <hlm-sheet-content\n          *brnSheetContent=\"let ctx\"\n          data-slot=\"sidebar\"\n          data-sidebar=\"sidebar\"\n          data-mobile=\"true\"\n          class=\"bg-sidebar text-sidebar-foreground h-svh w-(--sidebar-width) p-0 [&>button]:hidden\"\n          [style.--sidebar-width]=\"sidebarWidthMobile()\"\n        >\n          <div class=\"flex h-full w-full flex-col\">\n            <ng-container *ngTemplateOutlet=\"contentContainer\" />\n          </div>\n        </hlm-sheet-content>\n      </hlm-sheet>\n    } @else {\n      <!-- Sidebar gap on desktop -->\n      <div data-slot=\"sidebar-gap\" [class]=\"_sidebarGapComputedClass()\"></div>\n      <div data-slot=\"sidebar-container\" [attr.data-side]=\"_dataSide()\" [class]=\"_sidebarContainerComputedClass()\">\n        <div\n          data-sidebar=\"sidebar\"\n          data-slot=\"sidebar-inner\"\n          class=\"bg-sidebar group-data-[variant=floating]:ring-sidebar-border group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:shadow-sm group-data-[variant=floating]:ring-1 flex size-full flex-col\"\n        >\n          <ng-container *ngTemplateOutlet=\"contentContainer\" />\n        </div>\n      </div>\n    }\n  ",
                 }]
         }], ctorParameters: () => [], propDecorators: { sidebarWidthMobile: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarWidthMobile", required: false }] }], side: [{ type: i0.Input, args: [{ isSignal: true, alias: "side", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], collapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsible", required: false }] }], sidebarContainerClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarContainerClass", required: false }] }] } });
 
 class HlmSidebarContent {
     constructor() {
-        classes(() => 'no-scrollbar gap-2 flex min-h-0 flex-1 flex-col overflow-auto group-data-[collapsible=icon]:overflow-hidden');
+        classes(() => "no-scrollbar gap-2 flex min-h-0 flex-1 flex-col overflow-auto group-data-[collapsible=icon]:overflow-hidden");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarContent, isStandalone: true, selector: "[hlmSidebarContent],hlm-sidebar-content", host: { attributes: { "data-slot": "sidebar-content", "data-sidebar": "content" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarContent, isStandalone: true, selector: "[hlmSidebarContent],hlm-sidebar-content", host: { attributes: { "data-slot": "sidebar-content", "data-sidebar": "content" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarContent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarContent, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmSidebarContent],hlm-sidebar-content',
@@ -336,12 +260,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarFooter {
     constructor() {
-        classes(() => 'gap-2 p-2 flex flex-col');
+        classes(() => "gap-2 p-2 flex flex-col");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarFooter, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarFooter, isStandalone: true, selector: "[hlmSidebarFooter],hlm-sidebar-footer", host: { attributes: { "data-slot": "sidebar-footer", "data-sidebar": "footer" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarFooter, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarFooter, isStandalone: true, selector: "[hlmSidebarFooter],hlm-sidebar-footer", host: { attributes: { "data-slot": "sidebar-footer", "data-sidebar": "footer" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarFooter, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarFooter, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmSidebarFooter],hlm-sidebar-footer',
@@ -354,12 +278,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarGroup {
     constructor() {
-        classes(() => 'p-2 relative flex w-full min-w-0 flex-col');
+        classes(() => "p-2 relative flex w-full min-w-0 flex-col");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarGroup, isStandalone: true, selector: "[hlmSidebarGroup],hlm-sidebar-group", host: { attributes: { "data-slot": "sidebar-group", "data-sidebar": "group" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarGroup, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarGroup, isStandalone: true, selector: "[hlmSidebarGroup],hlm-sidebar-group", host: { attributes: { "data-slot": "sidebar-group", "data-sidebar": "group" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarGroup, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarGroup, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmSidebarGroup],hlm-sidebar-group',
@@ -372,12 +296,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarGroupAction {
     constructor() {
-        classes(() => 'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute end-3 top-3.5 w-5 rounded-md p-0 focus-visible:ring-2 [&>ng-icon]:text-[length:--spacing(4)] flex aspect-square items-center justify-center outline-hidden transition-transform group-data-[collapsible=icon]:hidden after:absolute after:-inset-2 md:after:hidden [&>ng-icon]:shrink-0');
+        classes(() => "text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute end-3 top-3.5 w-5 rounded-md p-0 focus-visible:ring-2 [&>ng-icon]:text-[length:--spacing(4)] flex aspect-square items-center justify-center outline-hidden transition-transform group-data-[collapsible=icon]:hidden after:absolute after:-inset-2 md:after:hidden [&>ng-icon]:shrink-0");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarGroupAction, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarGroupAction, isStandalone: true, selector: "button[hlmSidebarGroupAction]", host: { attributes: { "data-slot": "sidebar-group-action", "data-sidebar": "group-action" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarGroupAction, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarGroupAction, isStandalone: true, selector: "button[hlmSidebarGroupAction]", host: { attributes: { "data-slot": "sidebar-group-action", "data-sidebar": "group-action" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarGroupAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarGroupAction, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[hlmSidebarGroupAction]',
@@ -390,12 +314,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarGroupContent {
     constructor() {
-        classes(() => 'text-sm w-full');
+        classes(() => "text-sm w-full");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarGroupContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarGroupContent, isStandalone: true, selector: "div[hlmSidebarGroupContent]", host: { attributes: { "data-slot": "sidebar-group-content", "data-sidebar": "group-content" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarGroupContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarGroupContent, isStandalone: true, selector: "div[hlmSidebarGroupContent]", host: { attributes: { "data-slot": "sidebar-group-content", "data-sidebar": "group-content" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarGroupContent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarGroupContent, decorators: [{
             type: Directive,
             args: [{
                     selector: 'div[hlmSidebarGroupContent]',
@@ -408,12 +332,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarGroupLabel {
     constructor() {
-        classes(() => 'text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-md px-2 text-xs font-medium transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>ng-icon]:text-[length:--spacing(4)] flex shrink-0 items-center outline-hidden [&>ng-icon]:shrink-0');
+        classes(() => "text-sidebar-foreground/70 ring-sidebar-ring h-8 rounded-md px-2 text-xs font-medium transition-[margin,opacity] duration-200 ease-linear group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0 focus-visible:ring-2 [&>ng-icon]:text-[length:--spacing(4)] flex shrink-0 items-center outline-hidden [&>ng-icon]:shrink-0");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarGroupLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarGroupLabel, isStandalone: true, selector: "div[hlmSidebarGroupLabel], button[hlmSidebarGroupLabel]", host: { attributes: { "data-slot": "sidebar-group-label", "data-sidebar": "group-label" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarGroupLabel, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarGroupLabel, isStandalone: true, selector: "div[hlmSidebarGroupLabel], button[hlmSidebarGroupLabel]", host: { attributes: { "data-slot": "sidebar-group-label", "data-sidebar": "group-label" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarGroupLabel, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarGroupLabel, decorators: [{
             type: Directive,
             args: [{
                     selector: 'div[hlmSidebarGroupLabel], button[hlmSidebarGroupLabel]',
@@ -426,12 +350,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarHeader {
     constructor() {
-        classes(() => 'gap-2 p-2 flex flex-col');
+        classes(() => "gap-2 p-2 flex flex-col");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarHeader, isStandalone: true, selector: "[hlmSidebarHeader],hlm-sidebar-header", host: { attributes: { "data-slot": "sidebar-header", "data-sidebar": "header" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarHeader, isStandalone: true, selector: "[hlmSidebarHeader],hlm-sidebar-header", host: { attributes: { "data-slot": "sidebar-header", "data-sidebar": "header" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarHeader, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarHeader, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmSidebarHeader],hlm-sidebar-header',
@@ -444,12 +368,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarInput {
     constructor() {
-        classes(() => 'bg-background h-8 w-full shadow-none');
+        classes(() => "bg-background h-8 w-full shadow-none");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarInput, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarInput, isStandalone: true, selector: "input[hlmSidebarInput]", host: { attributes: { "data-slot": "sidebar-input", "data-sidebar": "input" } }, hostDirectives: [{ directive: i1$1.HlmInput }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarInput, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarInput, isStandalone: true, selector: "input[hlmSidebarInput]", host: { attributes: { "data-slot": "sidebar-input", "data-sidebar": "input" } }, hostDirectives: [{ directive: i1$1.HlmInput }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarInput, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarInput, decorators: [{
             type: Directive,
             args: [{
                     selector: 'input[hlmSidebarInput]',
@@ -463,12 +387,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarInset {
     constructor() {
-        classes(() => 'bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ms-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ms-2 relative flex w-full flex-1 flex-col');
+        classes(() => "bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ms-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ms-2 relative flex w-full flex-1 flex-col");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarInset, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarInset, isStandalone: true, selector: "main[hlmSidebarInset]", host: { attributes: { "data-slot": "sidebar-inset" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarInset, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarInset, isStandalone: true, selector: "main[hlmSidebarInset]", host: { attributes: { "data-slot": "sidebar-inset" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarInset, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarInset, decorators: [{
             type: Directive,
             args: [{
                     selector: 'main[hlmSidebarInset]',
@@ -478,12 +402,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarMenu {
     constructor() {
-        classes(() => 'gap-1 flex w-full min-w-0 flex-col');
+        classes(() => "gap-1 flex w-full min-w-0 flex-col");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenu, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarMenu, isStandalone: true, selector: "ul[hlmSidebarMenu]", host: { attributes: { "data-slot": "sidebar-menu", "data-sidebar": "menu" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenu, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarMenu, isStandalone: true, selector: "ul[hlmSidebarMenu]", host: { attributes: { "data-slot": "sidebar-menu", "data-sidebar": "menu" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenu, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenu, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ul[hlmSidebarMenu]',
@@ -498,15 +422,15 @@ class HlmSidebarMenuAction {
     showOnHover = input(false, { ...(ngDevMode ? { debugName: "showOnHover" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     constructor() {
         classes(() => [
-            'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute end-1 top-1.5 aspect-square w-5 rounded-md p-0 peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 focus-visible:ring-2 [&>ng-icon]:text-[length:--spacing(4)] flex items-center justify-center outline-hidden transition-transform group-data-[collapsible=icon]:hidden after:absolute after:-inset-2 md:after:hidden [&>ng-icon]:shrink-0',
+            "text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute end-1 top-1.5 aspect-square w-5 rounded-md p-0 peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 focus-visible:ring-2 [&>ng-icon]:text-[length:--spacing(4)] flex items-center justify-center outline-hidden transition-transform group-data-[collapsible=icon]:hidden after:absolute after:-inset-2 md:after:hidden [&>ng-icon]:shrink-0",
             this.showOnHover() &&
-                'peer-data-active/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 aria-expanded:opacity-100 md:opacity-0',
+                "peer-data-active/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 aria-expanded:opacity-100 md:opacity-0",
         ]);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuAction, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmSidebarMenuAction, isStandalone: true, selector: "button[hlmSidebarMenuAction]", inputs: { showOnHover: { classPropertyName: "showOnHover", publicName: "showOnHover", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "sidebar-menu-action", "data-sidebar": "menu-action" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuAction, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmSidebarMenuAction, isStandalone: true, selector: "button[hlmSidebarMenuAction]", inputs: { showOnHover: { classPropertyName: "showOnHover", publicName: "showOnHover", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "sidebar-menu-action", "data-sidebar": "menu-action" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuAction, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuAction, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[hlmSidebarMenuAction]',
@@ -519,12 +443,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarMenuBadge {
     constructor() {
-        classes(() => 'text-sidebar-foreground peer-hover/menu-button:text-sidebar-accent-foreground peer-data-active/menu-button:text-sidebar-accent-foreground pointer-events-none absolute end-1 h-5 min-w-5 rounded-md px-1 text-xs font-medium peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 flex items-center justify-center tabular-nums select-none group-data-[collapsible=icon]:hidden');
+        classes(() => "text-sidebar-foreground peer-hover/menu-button:text-sidebar-accent-foreground peer-data-active/menu-button:text-sidebar-accent-foreground pointer-events-none absolute end-1 h-5 min-w-5 rounded-md px-1 text-xs font-medium peer-data-[size=default]/menu-button:top-1.5 peer-data-[size=lg]/menu-button:top-2.5 peer-data-[size=sm]/menu-button:top-1 flex items-center justify-center tabular-nums select-none group-data-[collapsible=icon]:hidden");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuBadge, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarMenuBadge, isStandalone: true, selector: "[hlmSidebarMenuBadge],hlm-sidebar-menu-badge", host: { attributes: { "data-slot": "sidebar-menu-badge", "data-sidebar": "menu-badge" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuBadge, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarMenuBadge, isStandalone: true, selector: "[hlmSidebarMenuBadge],hlm-sidebar-menu-badge", host: { attributes: { "data-slot": "sidebar-menu-badge", "data-sidebar": "menu-badge" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuBadge, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuBadge, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmSidebarMenuBadge],hlm-sidebar-menu-badge',
@@ -535,16 +459,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                 }]
         }], ctorParameters: () => [] });
 
-const sidebarMenuButtonVariants = cva('ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground gap-2 rounded-md p-2 text-start text-sm transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pe-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 data-active:font-medium peer/menu-button group/menu-button flex w-full items-center overflow-hidden outline-hidden disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_ng-icon]:shrink-0 [&_ng-icon]:text-[length:--spacing(4)] [&>span:last-child]:truncate', {
+const sidebarMenuButtonVariants = cva("ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground data-open:hover:bg-sidebar-accent data-open:hover:text-sidebar-accent-foreground gap-2 rounded-md p-2 text-start text-sm transition-[width,height,padding] group-has-data-[sidebar=menu-action]/menu-item:pe-8 group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:p-2! focus-visible:ring-2 data-active:font-medium peer/menu-button group/menu-button flex w-full items-center overflow-hidden outline-hidden disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&_ng-icon]:shrink-0 [&_ng-icon]:text-[length:--spacing(4)] [&>span:last-child]:truncate", {
     variants: {
         variant: {
-            default: 'hover:bg-sidebar-accent hover:text-sidebar-accent-foreground',
-            outline: 'bg-background hover:bg-sidebar-accent hover:text-sidebar-accent-foreground shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)]',
+            default: "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
+            outline: "bg-background hover:bg-sidebar-accent hover:text-sidebar-accent-foreground shadow-[0_0_0_1px_var(--sidebar-border)] hover:shadow-[0_0_0_1px_var(--sidebar-accent)]",
         },
         size: {
-            default: 'h-8 text-sm',
-            sm: 'h-7 text-xs',
-            lg: 'h-12 text-sm group-data-[collapsible=icon]:p-0!',
+            default: "h-8 text-sm",
+            sm: "h-7 text-xs",
+            lg: "h-12 text-sm group-data-[collapsible=icon]:p-0!",
         },
     },
     defaultVariants: {
@@ -573,8 +497,8 @@ class HlmSidebarMenuButton {
             this._sidebarService.setOpenMobile(false);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuButton, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmSidebarMenuButton, isStandalone: true, selector: "button[hlmSidebarMenuButton], a[hlmSidebarMenuButton]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, closeMobileSidebarOnClick: { classPropertyName: "closeMobileSidebarOnClick", publicName: "closeMobileSidebarOnClick", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "sidebar-menu-button", "data-sidebar": "menu-button" }, listeners: { "click": "onClick()" }, properties: { "attr.data-size": "size()", "attr.data-active": "isActive()" } }, providers: [
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuButton, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmSidebarMenuButton, isStandalone: true, selector: "button[hlmSidebarMenuButton], a[hlmSidebarMenuButton]", inputs: { variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, closeMobileSidebarOnClick: { classPropertyName: "closeMobileSidebarOnClick", publicName: "closeMobileSidebarOnClick", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "sidebar-menu-button", "data-sidebar": "menu-button" }, listeners: { "click": "onClick()" }, properties: { "attr.data-size": "size()", "attr.data-active": "isActive()" } }, providers: [
             provideBrnTooltipDefaultOptions({
                 showDelay: 150,
                 hideDelay: 0,
@@ -585,7 +509,7 @@ class HlmSidebarMenuButton {
             }),
         ], hostDirectives: [{ directive: i1$2.BrnTooltip, inputs: ["brnTooltip", "tooltip"] }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuButton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuButton, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[hlmSidebarMenuButton], a[hlmSidebarMenuButton]',
@@ -617,12 +541,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarMenuItem {
     constructor() {
-        classes(() => 'group/menu-item relative');
+        classes(() => "group/menu-item relative");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarMenuItem, isStandalone: true, selector: "li[hlmSidebarMenuItem]", host: { attributes: { "data-slot": "sidebar-menu-item", "data-sidebar": "menu-item" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarMenuItem, isStandalone: true, selector: "li[hlmSidebarMenuItem]", host: { attributes: { "data-slot": "sidebar-menu-item", "data-sidebar": "menu-item" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuItem, decorators: [{
             type: Directive,
             args: [{
                     selector: 'li[hlmSidebarMenuItem]',
@@ -637,22 +561,12 @@ class HlmSidebarMenuSkeleton {
     showIcon = input(false, { ...(ngDevMode ? { debugName: "showIcon" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     _width = `${Math.floor(Math.random() * 40) + 50}%`;
     constructor() {
-        classes(() => 'h-8 gap-2 rounded-md px-2 flex items-center');
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuSkeleton, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: HlmSidebarMenuSkeleton, isStandalone: true, selector: "hlm-sidebar-menu-skeleton,div[hlmSidebarMenuSkeleton]", inputs: { showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "sidebar-menu-skeleton", "data-sidebar": "menu-skeleton" } }, ngImport: i0, template: `
-    @if (showIcon()) {
-      <hlm-skeleton data-sidebar="menu-skeleton-icon" class="size-4 rounded-md" />
-    } @else {
-      <hlm-skeleton
-        data-sidebar="menu-skeleton-text"
-        class="h-4 max-w-(--skeleton-width) flex-1"
-        [style.--skeleton-width]="_width"
-      />
-    }
-  `, isInline: true, dependencies: [{ kind: "directive", type: i1$3.HlmSkeleton, selector: "[hlmSkeleton],hlm-skeleton" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+        classes(() => "h-8 gap-2 rounded-md px-2 flex items-center");
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuSkeleton, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.3", type: HlmSidebarMenuSkeleton, isStandalone: true, selector: "hlm-sidebar-menu-skeleton,div[hlmSidebarMenuSkeleton]", inputs: { showIcon: { classPropertyName: "showIcon", publicName: "showIcon", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "sidebar-menu-skeleton", "data-sidebar": "menu-skeleton" } }, ngImport: i0, template: "\n    @if (showIcon()) {\n      <hlm-skeleton data-sidebar=\"menu-skeleton-icon\" class=\"size-4 rounded-md\" />\n    } @else {\n      <hlm-skeleton\n        data-sidebar=\"menu-skeleton-text\"\n        class=\"h-4 max-w-(--skeleton-width) flex-1\"\n        [style.--skeleton-width]=\"_width\"\n      />\n    }\n  ", isInline: true, dependencies: [{ kind: "directive", type: i1$3.HlmSkeleton, selector: "[hlmSkeleton],hlm-skeleton" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuSkeleton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuSkeleton, decorators: [{
             type: Component,
             args: [{
                     selector: 'hlm-sidebar-menu-skeleton,div[hlmSidebarMenuSkeleton]',
@@ -662,28 +576,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         'data-slot': 'sidebar-menu-skeleton',
                         'data-sidebar': 'menu-skeleton',
                     },
-                    template: `
-    @if (showIcon()) {
-      <hlm-skeleton data-sidebar="menu-skeleton-icon" class="size-4 rounded-md" />
-    } @else {
-      <hlm-skeleton
-        data-sidebar="menu-skeleton-text"
-        class="h-4 max-w-(--skeleton-width) flex-1"
-        [style.--skeleton-width]="_width"
-      />
-    }
-  `,
+                    template: "\n    @if (showIcon()) {\n      <hlm-skeleton data-sidebar=\"menu-skeleton-icon\" class=\"size-4 rounded-md\" />\n    } @else {\n      <hlm-skeleton\n        data-sidebar=\"menu-skeleton-text\"\n        class=\"h-4 max-w-(--skeleton-width) flex-1\"\n        [style.--skeleton-width]=\"_width\"\n      />\n    }\n  ",
                 }]
         }], ctorParameters: () => [], propDecorators: { showIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "showIcon", required: false }] }] } });
 
 class HlmSidebarMenuSub {
     constructor() {
-        classes(() => 'border-sidebar-border mx-3.5 translate-x-px gap-1 border-s px-2.5 py-0.5 group-data-[collapsible=icon]:hidden rtl:-translate-x-px flex min-w-0 flex-col');
+        classes(() => "border-sidebar-border mx-3.5 translate-x-px gap-1 border-s px-2.5 py-0.5 group-data-[collapsible=icon]:hidden rtl:-translate-x-px flex min-w-0 flex-col");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuSub, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarMenuSub, isStandalone: true, selector: "ul[hlmSidebarMenuSub]", host: { attributes: { "data-slot": "sidebar-menu-sub", "data-sidebar": "menu-sub" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuSub, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarMenuSub, isStandalone: true, selector: "ul[hlmSidebarMenuSub]", host: { attributes: { "data-slot": "sidebar-menu-sub", "data-sidebar": "menu-sub" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuSub, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuSub, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ul[hlmSidebarMenuSub]',
@@ -702,17 +606,17 @@ class HlmSidebarMenuSubButton {
     ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
     isActive = input(false, { ...(ngDevMode ? { debugName: "isActive" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
     constructor() {
-        classes(() => 'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground h-7 gap-2 rounded-md px-2 focus-visible:ring-2 data-[size=md]:text-sm data-[size=sm]:text-xs [&>ng-icon]:text-[length:--spacing(4)] flex min-w-0 -translate-x-px items-center overflow-hidden outline-hidden group-data-[collapsible=icon]:hidden disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>ng-icon]:shrink-0 [&>span:last-child]:truncate');
+        classes(() => "text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground data-active:bg-sidebar-accent data-active:text-sidebar-accent-foreground h-7 gap-2 rounded-md px-2 focus-visible:ring-2 data-[size=md]:text-sm data-[size=sm]:text-xs [&>ng-icon]:text-[length:--spacing(4)] flex min-w-0 -translate-x-px items-center overflow-hidden outline-hidden group-data-[collapsible=icon]:hidden disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>ng-icon]:shrink-0 [&>span:last-child]:truncate");
     }
     onClick() {
         if (this.closeMobileSidebarOnClick()) {
             this._sidebarService.setOpenMobile(false);
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuSubButton, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmSidebarMenuSubButton, isStandalone: true, selector: "a[hlmSidebarMenuSubButton], button[hlmSidebarMenuSubButton]", inputs: { closeMobileSidebarOnClick: { classPropertyName: "closeMobileSidebarOnClick", publicName: "closeMobileSidebarOnClick", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "sidebar-menu-sub-button", "data-sidebar": "menu-sub-button" }, listeners: { "click": "onClick()" }, properties: { "attr.data-active": "isActive()", "attr.data-size": "size()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuSubButton, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmSidebarMenuSubButton, isStandalone: true, selector: "a[hlmSidebarMenuSubButton], button[hlmSidebarMenuSubButton]", inputs: { closeMobileSidebarOnClick: { classPropertyName: "closeMobileSidebarOnClick", publicName: "closeMobileSidebarOnClick", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "sidebar-menu-sub-button", "data-sidebar": "menu-sub-button" }, listeners: { "click": "onClick()" }, properties: { "attr.data-active": "isActive()", "attr.data-size": "size()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuSubButton, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuSubButton, decorators: [{
             type: Directive,
             args: [{
                     selector: 'a[hlmSidebarMenuSubButton], button[hlmSidebarMenuSubButton]',
@@ -728,12 +632,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarMenuSubItem {
     constructor() {
-        classes(() => 'group/menu-sub-item relative');
+        classes(() => "group/menu-sub-item relative");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuSubItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarMenuSubItem, isStandalone: true, selector: "li[hlmSidebarMenuSubItem]", host: { attributes: { "data-slot": "sidebar-menu-sub-item", "data-sidebar": "menu-sub-item" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuSubItem, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarMenuSubItem, isStandalone: true, selector: "li[hlmSidebarMenuSubItem]", host: { attributes: { "data-slot": "sidebar-menu-sub-item", "data-sidebar": "menu-sub-item" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarMenuSubItem, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarMenuSubItem, decorators: [{
             type: Directive,
             args: [{
                     selector: 'li[hlmSidebarMenuSubItem]',
@@ -749,21 +653,21 @@ class HlmSidebarRail {
     ariaLabel = input('Toggle Sidebar', { ...(ngDevMode ? { debugName: "ariaLabel" } : /* istanbul ignore next */ {}), alias: 'aria-label' });
     constructor() {
         classes(() => [
-            'hover:after:bg-sidebar-border absolute inset-y-0 z-20 hidden w-4 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:start-1/2 after:w-[2px] sm:flex ltr:-translate-x-1/2 rtl:-translate-x-1/2',
-            'in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize',
-            '[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize',
-            'hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full',
-            '[[data-side=left][data-collapsible=offcanvas]_&]:-right-2',
-            '[[data-side=right][data-collapsible=offcanvas]_&]:-left-2',
+            "hover:after:bg-sidebar-border absolute inset-y-0 z-20 hidden w-4 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:start-1/2 after:w-[2px] sm:flex ltr:-translate-x-1/2 rtl:-translate-x-1/2",
+            "in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize",
+            "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize",
+            "hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full",
+            "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2",
+            "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
         ]);
     }
     onClick() {
         this._sidebarService.toggleSidebar();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarRail, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmSidebarRail, isStandalone: true, selector: "button[hlmSidebarRail]", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-sidebar": "rail", "data-slot": "sidebar-rail", "tabindex": "-1" }, listeners: { "click": "onClick()" }, properties: { "attr.aria-label": "ariaLabel()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarRail, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmSidebarRail, isStandalone: true, selector: "button[hlmSidebarRail]", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "aria-label", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-sidebar": "rail", "data-slot": "sidebar-rail", "tabindex": "-1" }, listeners: { "click": "onClick()" }, properties: { "attr.aria-label": "ariaLabel()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarRail, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarRail, decorators: [{
             type: Directive,
             args: [{
                     selector: 'button[hlmSidebarRail]',
@@ -779,12 +683,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
 
 class HlmSidebarSeparator {
     constructor() {
-        classes(() => 'bg-sidebar-border mx-2 w-auto');
+        classes(() => "bg-sidebar-border mx-2 w-auto");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarSeparator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.7", type: HlmSidebarSeparator, isStandalone: true, selector: "[hlmSidebarSeparator],hlm-sidebar-separator", host: { attributes: { "data-slot": "sidebar-separator", "data-sidebar": "separator" } }, hostDirectives: [{ directive: i1$4.HlmSeparator }], ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarSeparator, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.3", type: HlmSidebarSeparator, isStandalone: true, selector: "[hlmSidebarSeparator],hlm-sidebar-separator", host: { attributes: { "data-slot": "sidebar-separator", "data-sidebar": "separator" } }, hostDirectives: [{ directive: i1$4.HlmSeparator }], ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarSeparator, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarSeparator, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmSidebarSeparator],hlm-sidebar-separator',
@@ -803,13 +707,10 @@ class HlmSidebarTrigger {
     _onClick() {
         this._sidebarService.toggleSidebar();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarTrigger, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.7", type: HlmSidebarTrigger, isStandalone: true, selector: "button[hlmSidebarTrigger]", inputs: { srOnlyText: { classPropertyName: "srOnlyText", publicName: "srOnlyText", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "sidebar-trigger", "data-sidebar": "trigger" }, listeners: { "click": "_onClick()" } }, providers: [provideIcons({ lucidePanelLeft }), provideBrnButtonConfig({ variant: 'ghost', size: 'icon-sm' })], hostDirectives: [{ directive: i1$5.HlmBtn, inputs: ["variant", "variant", "size", "size"] }], ngImport: i0, template: `
-    <ng-icon name="lucidePanelLeft" />
-    <span class="sr-only">{{ srOnlyText() }}</span>
-  `, isInline: true, dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarTrigger, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.3", type: HlmSidebarTrigger, isStandalone: true, selector: "button[hlmSidebarTrigger]", inputs: { srOnlyText: { classPropertyName: "srOnlyText", publicName: "srOnlyText", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "sidebar-trigger", "data-sidebar": "trigger" }, listeners: { "click": "_onClick()" } }, providers: [provideIcons({ lucidePanelLeft }), provideBrnButtonConfig({ variant: 'ghost', size: 'icon-sm' })], hostDirectives: [{ directive: i1$5.HlmBtn, inputs: ["variant", "variant", "size", "size"] }], ngImport: i0, template: "\n    <ng-icon name=\"lucidePanelLeft\" />\n    <span class=\"sr-only\">{{ srOnlyText() }}</span>\n  ", isInline: true, dependencies: [{ kind: "component", type: NgIcon, selector: "ng-icon", inputs: ["name", "svg", "size", "strokeWidth", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarTrigger, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarTrigger, decorators: [{
             type: Component,
             args: [{
                     // eslint-disable-next-line @angular-eslint/component-selector
@@ -823,10 +724,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         'data-sidebar': 'trigger',
                         '(click)': '_onClick()',
                     },
-                    template: `
-    <ng-icon name="lucidePanelLeft" />
-    <span class="sr-only">{{ srOnlyText() }}</span>
-  `,
+                    template: "\n    <ng-icon name=\"lucidePanelLeft\" />\n    <span class=\"sr-only\">{{ srOnlyText() }}</span>\n  ",
                 }]
         }], propDecorators: { srOnlyText: [{ type: i0.Input, args: [{ isSignal: true, alias: "srOnlyText", required: false }] }] } });
 
@@ -837,12 +735,12 @@ class HlmSidebarWrapper {
     sidebarWidthIcon = input(this._config.sidebarWidthIcon, /* @ts-ignore */
     ...(ngDevMode ? [{ debugName: "sidebarWidthIcon" }] : /* istanbul ignore next */ []));
     constructor() {
-        classes(() => 'group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full');
+        classes(() => "group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full");
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarWrapper, deps: [], target: i0.ɵɵFactoryTarget.Directive });
-    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.7", type: HlmSidebarWrapper, isStandalone: true, selector: "[hlmSidebarWrapper],hlm-sidebar-wrapper", inputs: { sidebarWidth: { classPropertyName: "sidebarWidth", publicName: "sidebarWidth", isSignal: true, isRequired: false, transformFunction: null }, sidebarWidthIcon: { classPropertyName: "sidebarWidthIcon", publicName: "sidebarWidthIcon", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "sidebar-wrapper" }, properties: { "style.--sidebar-width": "sidebarWidth()", "style.--sidebar-width-icon": "sidebarWidthIcon()" } }, ngImport: i0 });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarWrapper, deps: [], target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.1.3", type: HlmSidebarWrapper, isStandalone: true, selector: "[hlmSidebarWrapper],hlm-sidebar-wrapper", inputs: { sidebarWidth: { classPropertyName: "sidebarWidth", publicName: "sidebarWidth", isSignal: true, isRequired: false, transformFunction: null }, sidebarWidthIcon: { classPropertyName: "sidebarWidthIcon", publicName: "sidebarWidthIcon", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-slot": "sidebar-wrapper" }, properties: { "style.--sidebar-width": "sidebarWidth()", "style.--sidebar-width-icon": "sidebarWidthIcon()" } }, ngImport: i0 });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarWrapper, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarWrapper, decorators: [{
             type: Directive,
             args: [{
                     selector: '[hlmSidebarWrapper],hlm-sidebar-wrapper',
@@ -883,8 +781,8 @@ const HlmSidebarImports = [
     HlmSidebarMenuSubItem,
 ];
 class HlmSidebarModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarModule, imports: [HlmSidebar,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarModule, imports: [HlmSidebar,
             HlmSidebarContent,
             HlmSidebarFooter,
             HlmSidebarGroup,
@@ -929,10 +827,10 @@ class HlmSidebarModule {
             HlmSidebarTrigger,
             HlmSidebarWrapper,
             HlmSidebarMenuSubItem] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarModule, imports: [HlmSidebar,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarModule, imports: [HlmSidebar,
             HlmSidebarTrigger] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: HlmSidebarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.3", ngImport: i0, type: HlmSidebarModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [...HlmSidebarImports],
@@ -945,4 +843,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
  */
 
 export { HlmSidebar, HlmSidebarContent, HlmSidebarFooter, HlmSidebarGroup, HlmSidebarGroupAction, HlmSidebarGroupContent, HlmSidebarGroupLabel, HlmSidebarHeader, HlmSidebarImports, HlmSidebarInput, HlmSidebarInset, HlmSidebarMenu, HlmSidebarMenuAction, HlmSidebarMenuBadge, HlmSidebarMenuButton, HlmSidebarMenuItem, HlmSidebarMenuSkeleton, HlmSidebarMenuSub, HlmSidebarMenuSubButton, HlmSidebarMenuSubItem, HlmSidebarModule, HlmSidebarRail, HlmSidebarSeparator, HlmSidebarService, HlmSidebarTrigger, HlmSidebarWrapper, injectHlmSidebarConfig, provideHlmSidebarConfig };
-//# sourceMappingURL=sidebar.mjs.map
+