primenglab 22.0.0-beta.1

package/fesm2022/primenglab-sidebar.mjs

@@ -0,0 +1,1461 @@
+export * from 'primenglab/types/sidebar';
+import * as i0 from '@angular/core';
+import { InjectionToken, Injectable, inject, computed, effect, ViewEncapsulation, ChangeDetectionStrategy, Component, Directive, signal, input, booleanAttribute, model, HostListener, NgModule } from '@angular/core';
+import { uuid } from '@primeuix/utils';
+import { BaseComponent, PARENT_INSTANCE } from 'primenglab/basecomponent';
+import * as i1 from 'primenglab/bind';
+import { Bind, BindModule } from 'primenglab/bind';
+import { style as style$1 } from '@primeuix/styles/sidebar';
+import { BaseStyle } from 'primenglab/base';
+import { isPlatformBrowser } from '@angular/common';
+import { createMotion } from '@primeuix/motion';
+
+const SIDEBAR_INSTANCE = new InjectionToken('SIDEBAR_INSTANCE');
+const SIDEBAR_LAYOUT_INSTANCE = new InjectionToken('SIDEBAR_LAYOUT_INSTANCE');
+const SIDEBAR_ASIDE_INSTANCE = new InjectionToken('SIDEBAR_ASIDE_INSTANCE');
+const SIDEBAR_CONTENT_INSTANCE = new InjectionToken('SIDEBAR_CONTENT_INSTANCE');
+const SIDEBAR_HEADER_INSTANCE = new InjectionToken('SIDEBAR_HEADER_INSTANCE');
+const SIDEBAR_PANEL_INSTANCE = new InjectionToken('SIDEBAR_PANEL_INSTANCE');
+const SIDEBAR_FOOTER_INSTANCE = new InjectionToken('SIDEBAR_FOOTER_INSTANCE');
+const SIDEBAR_GROUP_INSTANCE = new InjectionToken('SIDEBAR_GROUP_INSTANCE');
+const SIDEBAR_MENU_INSTANCE = new InjectionToken('SIDEBAR_MENU_INSTANCE');
+const SIDEBAR_MENU_ITEM_INSTANCE = new InjectionToken('SIDEBAR_MENU_ITEM_INSTANCE');
+const SIDEBAR_MENU_SUB_INSTANCE = new InjectionToken('SIDEBAR_MENU_SUB_INSTANCE');
+const SIDEBAR_MENU_SUB_ITEM_INSTANCE = new InjectionToken('SIDEBAR_MENU_SUB_ITEM_INSTANCE');
+
+const style = /*css*/ `
+${style$1}
+
+/* For PrimeNG */
+.p-sidebar-backdrop {
+    display: block;
+    position: fixed;
+    inset: 0;
+    z-index: 15;
+    background-color: rgb(0 0 0 / 0.4);
+}
+
+/* NG uses extra DOM wrappers around .p-sidebar-menu-sub for the Angular animation system */
+.p-sidebar-menu-sub-content-container {
+    display: grid;
+    grid-template-rows: 1fr;
+}
+
+.p-sidebar-menu-sub-content-wrapper {
+    min-height: 0;
+}
+
+.p-sidebar[data-collapsible="icon"] .p-sidebar-menu-item[data-collapsible]>.p-sidebar-menu-sub-content-container {
+    display: none;
+}
+
+.p-sidebar-menu-sub-enter-from,
+.p-sidebar-menu-sub-leave-to {
+    height: 0 !important;
+    opacity: 0;
+}
+
+.p-sidebar-menu-sub-enter-to,
+.p-sidebar-menu-sub-leave-from {
+    height: var(--pui-motion-height);
+    opacity: 1;
+}
+
+.p-sidebar-menu-sub-enter-active,
+.p-sidebar-menu-sub-leave-active {
+    transition: height 200ms ease-out, opacity 200ms ease-out;
+    overflow: hidden;
+}
+`;
+const classes = {
+    root: 'p-sidebar p-component',
+    layout: 'p-sidebar-layout',
+    spacer: 'p-sidebar-spacer',
+    aside: 'p-sidebar-aside',
+    panel: 'p-sidebar-panel',
+    header: 'p-sidebar-header',
+    content: 'p-sidebar-content',
+    footer: 'p-sidebar-footer',
+    group: 'p-sidebar-group',
+    groupLabel: 'p-sidebar-group-label',
+    groupAction: 'p-sidebar-group-action',
+    groupContent: 'p-sidebar-group-content',
+    menu: 'p-sidebar-menu',
+    menuItem: 'p-sidebar-menu-item',
+    menuButton: 'p-sidebar-menu-button',
+    menuAction: 'p-sidebar-menu-action',
+    menuBadge: 'p-sidebar-menu-badge',
+    menuSub: 'p-sidebar-menu-sub',
+    menuSubItem: 'p-sidebar-menu-sub-item',
+    menuSubButton: 'p-sidebar-menu-sub-button',
+    trigger: 'p-sidebar-trigger',
+    rail: 'p-sidebar-rail',
+    main: 'p-sidebar-main',
+    backdrop: 'p-sidebar-backdrop'
+};
+class SidebarStyle extends BaseStyle {
+    name = 'sidebar';
+    style = style;
+    classes = classes;
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarStyle });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarStyle, decorators: [{
+            type: Injectable
+        }] });
+/**
+ *
+ * Sidebar is a panel displayed as an overlay or static side navigation with a compound API.
+ *
+ * [Live Demo](https://www.primeng.org/sidebar/)
+ *
+ * @module sidebarstyle
+ *
+ */
+var SidebarClasses;
+(function (SidebarClasses) {
+    /**
+     * Class name of the root element
+     */
+    SidebarClasses["root"] = "p-sidebar";
+    /**
+     * Class name of the layout element
+     */
+    SidebarClasses["layout"] = "p-sidebar-layout";
+    /**
+     * Class name of the spacer element
+     */
+    SidebarClasses["spacer"] = "p-sidebar-spacer";
+    /**
+     * Class name of the aside element
+     */
+    SidebarClasses["aside"] = "p-sidebar-aside";
+    /**
+     * Class name of the panel element
+     */
+    SidebarClasses["panel"] = "p-sidebar-panel";
+    /**
+     * Class name of the header element
+     */
+    SidebarClasses["header"] = "p-sidebar-header";
+    /**
+     * Class name of the content element
+     */
+    SidebarClasses["content"] = "p-sidebar-content";
+    /**
+     * Class name of the footer element
+     */
+    SidebarClasses["footer"] = "p-sidebar-footer";
+    /**
+     * Class name of the group element
+     */
+    SidebarClasses["group"] = "p-sidebar-group";
+    /**
+     * Class name of the group label element
+     */
+    SidebarClasses["groupLabel"] = "p-sidebar-group-label";
+    /**
+     * Class name of the group action element
+     */
+    SidebarClasses["groupAction"] = "p-sidebar-group-action";
+    /**
+     * Class name of the group content element
+     */
+    SidebarClasses["groupContent"] = "p-sidebar-group-content";
+    /**
+     * Class name of the menu element
+     */
+    SidebarClasses["menu"] = "p-sidebar-menu";
+    /**
+     * Class name of the menu item element
+     */
+    SidebarClasses["menuItem"] = "p-sidebar-menu-item";
+    /**
+     * Class name of the menu button element
+     */
+    SidebarClasses["menuButton"] = "p-sidebar-menu-button";
+    /**
+     * Class name of the menu action element
+     */
+    SidebarClasses["menuAction"] = "p-sidebar-menu-action";
+    /**
+     * Class name of the menu badge element
+     */
+    SidebarClasses["menuBadge"] = "p-sidebar-menu-badge";
+    /**
+     * Class name of the menu sub element
+     */
+    SidebarClasses["menuSub"] = "p-sidebar-menu-sub";
+    /**
+     * Class name of the menu sub item element
+     */
+    SidebarClasses["menuSubItem"] = "p-sidebar-menu-sub-item";
+    /**
+     * Class name of the menu sub button element
+     */
+    SidebarClasses["menuSubButton"] = "p-sidebar-menu-sub-button";
+    /**
+     * Class name of the trigger element
+     */
+    SidebarClasses["trigger"] = "p-sidebar-trigger";
+    /**
+     * Class name of the rail element
+     */
+    SidebarClasses["rail"] = "p-sidebar-rail";
+    /**
+     * Class name of the main element
+     */
+    SidebarClasses["main"] = "p-sidebar-main";
+    /**
+     * Class name of the backdrop element
+     */
+    SidebarClasses["backdrop"] = "p-sidebar-backdrop";
+})(SidebarClasses || (SidebarClasses = {}));
+
+/**
+ * SidebarBackdrop is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarBackdrop extends BaseComponent {
+    componentName = 'SidebarBackdrop';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    pcSidebar = inject(SIDEBAR_INSTANCE, { optional: true });
+    layout = inject(SIDEBAR_LAYOUT_INSTANCE, { optional: true });
+    visible = computed(() => {
+        if (this.pcSidebar)
+            return this.pcSidebar.open();
+        return !!this.layout?.isAnyOpen();
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "visible" }] : /* istanbul ignore next */ []));
+    motion;
+    isInitialMount = true;
+    constructor() {
+        super();
+        effect(() => {
+            const show = this.visible();
+            if (!isPlatformBrowser(this.platformId))
+                return;
+            const el = this.el?.nativeElement;
+            if (!el)
+                return;
+            if (!this.motion) {
+                this.motion = createMotion(el, {
+                    name: 'p-overlay-mask',
+                    autoHeight: false,
+                    autoWidth: false
+                });
+            }
+            if (show) {
+                el.style.removeProperty('display');
+                el.classList.add('p-overlay-mask');
+                this.motion.enter();
+            }
+            else if (!this.isInitialMount) {
+                this.motion.leave().then(() => {
+                    if (!this.visible() && this.el?.nativeElement) {
+                        this.el.nativeElement.style.display = 'none';
+                        this.el.nativeElement.classList.remove('p-overlay-mask');
+                    }
+                });
+            }
+            else {
+                el.style.display = 'none';
+            }
+            this.isInitialMount = false;
+        });
+    }
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    onClick(event) {
+        if (this.pcSidebar) {
+            if (this.pcSidebar.dismissable())
+                this.pcSidebar.collapse(event);
+        }
+        else {
+            this.layout?.collapseAll(event);
+        }
+    }
+    onDestroy() {
+        this.motion?.cancel();
+        this.motion = undefined;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarBackdrop, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarBackdrop, isStandalone: true, selector: "p-sidebar-backdrop", host: { listeners: { "click": "onClick($event)" }, properties: { "class": "cx('backdrop')" } }, providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarBackdrop }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: ``, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarBackdrop, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-backdrop',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: ``,
+                    host: {
+                        '[class]': "cx('backdrop')",
+                        '(click)': 'onClick($event)'
+                    },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarBackdrop }]
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * SidebarContent is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarContent extends BaseComponent {
+    componentName = 'SidebarContent';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarContent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarContent, isStandalone: true, selector: "p-sidebar-content", host: { properties: { "class": "cx('content')" } }, providers: [SidebarStyle, { provide: SIDEBAR_CONTENT_INSTANCE, useExisting: SidebarContent }, { provide: PARENT_INSTANCE, useExisting: SidebarContent }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarContent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-content',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: { '[class]': "cx('content')" },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: SIDEBAR_CONTENT_INSTANCE, useExisting: SidebarContent }, { provide: PARENT_INSTANCE, useExisting: SidebarContent }]
+                }]
+        }] });
+
+/**
+ * SidebarFooter is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarFooter extends BaseComponent {
+    componentName = 'SidebarFooter';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarFooter, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarFooter, isStandalone: true, selector: "p-sidebar-footer", host: { properties: { "class": "cx('footer')" } }, providers: [SidebarStyle, { provide: SIDEBAR_FOOTER_INSTANCE, useExisting: SidebarFooter }, { provide: PARENT_INSTANCE, useExisting: SidebarFooter }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarFooter, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-footer',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: { '[class]': "cx('footer')" },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: SIDEBAR_FOOTER_INSTANCE, useExisting: SidebarFooter }, { provide: PARENT_INSTANCE, useExisting: SidebarFooter }]
+                }]
+        }] });
+
+/**
+ * SidebarGroup is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarGroup extends BaseComponent {
+    componentName = 'SidebarGroup';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarGroup, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarGroup, isStandalone: true, selector: "p-sidebar-group", host: { properties: { "class": "cx('group')" } }, providers: [SidebarStyle, { provide: SIDEBAR_GROUP_INSTANCE, useExisting: SidebarGroup }, { provide: PARENT_INSTANCE, useExisting: SidebarGroup }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarGroup, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-group',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: { '[class]': "cx('group')" },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: SIDEBAR_GROUP_INSTANCE, useExisting: SidebarGroup }, { provide: PARENT_INSTANCE, useExisting: SidebarGroup }]
+                }]
+        }] });
+
+/**
+ * SidebarGroupAction is a helper directive for Sidebar component.
+ * @group Components
+ */
+class SidebarGroupAction extends BaseComponent {
+    componentName = 'SidebarGroupAction';
+    bindDirectiveInstance = inject(Bind, { optional: true, self: true }) ?? undefined;
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance?.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarGroupAction, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.3", type: SidebarGroupAction, isStandalone: true, selector: "[pSidebarGroupAction]", host: { properties: { "class": "cx('groupAction')" } }, providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarGroupAction }], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarGroupAction, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pSidebarGroupAction]',
+                    standalone: true,
+                    host: { '[class]': "cx('groupAction')" },
+                    providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarGroupAction }]
+                }]
+        }] });
+
+/**
+ * SidebarGroupContent is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarGroupContent extends BaseComponent {
+    componentName = 'SidebarGroupContent';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarGroupContent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarGroupContent, isStandalone: true, selector: "p-sidebar-group-content", host: { properties: { "class": "cx('groupContent')" } }, providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarGroupContent }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarGroupContent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-group-content',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: { '[class]': "cx('groupContent')" },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarGroupContent }]
+                }]
+        }] });
+
+/**
+ * SidebarGroupLabel is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarGroupLabel extends BaseComponent {
+    componentName = 'SidebarGroupLabel';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarGroupLabel, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarGroupLabel, isStandalone: true, selector: "p-sidebar-group-label", host: { properties: { "class": "cx('groupLabel')" } }, providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarGroupLabel }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarGroupLabel, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-group-label',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: { '[class]': "cx('groupLabel')" },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarGroupLabel }]
+                }]
+        }] });
+
+/**
+ * SidebarHeader is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarHeader extends BaseComponent {
+    componentName = 'SidebarHeader';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarHeader, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarHeader, isStandalone: true, selector: "p-sidebar-header", host: { properties: { "class": "cx('header')" } }, providers: [SidebarStyle, { provide: SIDEBAR_HEADER_INSTANCE, useExisting: SidebarHeader }, { provide: PARENT_INSTANCE, useExisting: SidebarHeader }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarHeader, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-header',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: { '[class]': "cx('header')" },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: SIDEBAR_HEADER_INSTANCE, useExisting: SidebarHeader }, { provide: PARENT_INSTANCE, useExisting: SidebarHeader }]
+                }]
+        }] });
+
+/**
+ * SidebarMain is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarMain extends BaseComponent {
+    componentName = 'SidebarMain';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    layout = inject(SIDEBAR_LAYOUT_INSTANCE, { optional: true });
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    onClick(event) {
+        this.layout?.onMainClick(event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMain, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarMain, isStandalone: true, selector: "p-sidebar-main", host: { listeners: { "click": "onClick($event)" }, properties: { "class": "cx('main')" } }, providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarMain }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMain, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-main',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: {
+                        '[class]': "cx('main')",
+                        '(click)': 'onClick($event)'
+                    },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarMain }]
+                }]
+        }] });
+
+/**
+ * SidebarLayout is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarLayout extends BaseComponent {
+    componentName = 'SidebarLayout';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    sidebars = new Map();
+    version = signal(0, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "version" }] : /* istanbul ignore next */ []));
+    isAnyOpen = computed(() => {
+        this.version();
+        let open = false;
+        this.sidebars.forEach((s) => {
+            if (s.open())
+                open = true;
+        });
+        return open;
+    }, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isAnyOpen" }] : /* istanbul ignore next */ []));
+    registerSidebar(id, sidebar) {
+        this.sidebars.set(id, sidebar);
+        this.version.update((v) => v + 1);
+    }
+    unregisterSidebar(id) {
+        this.sidebars.delete(id);
+        this.version.update((v) => v + 1);
+    }
+    getSidebar(id) {
+        return this.sidebars.get(id);
+    }
+    toggle(target, event) {
+        if (target) {
+            this.sidebars.get(target)?.toggle(event);
+            return;
+        }
+        if (this.sidebars.size === 1) {
+            this.sidebars.values().next().value?.toggle(event);
+        }
+    }
+    collapseAll(event) {
+        this.sidebars.forEach((s) => s.collapse(event));
+    }
+    onMainClick(event) {
+        const target = event.target;
+        // Skip clicks that originate from a sidebar trigger so opening the sidebar via the trigger is not immediately undone by the same click.
+        if (target?.closest('[data-scope="sidebar"][data-part="trigger"]'))
+            return;
+        this.sidebars.forEach((s) => {
+            if (s.open() && s.overlay() && s.hideOnOutsideClick())
+                s.collapse(event);
+        });
+    }
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarLayout, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarLayout, isStandalone: true, selector: "p-sidebar-layout", host: { properties: { "class": "cx('layout')" } }, providers: [SidebarStyle, { provide: SIDEBAR_LAYOUT_INSTANCE, useExisting: SidebarLayout }, { provide: PARENT_INSTANCE, useExisting: SidebarLayout }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarLayout, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-layout',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: {
+                        '[class]': "cx('layout')"
+                    },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: SIDEBAR_LAYOUT_INSTANCE, useExisting: SidebarLayout }, { provide: PARENT_INSTANCE, useExisting: SidebarLayout }]
+                }]
+        }] });
+
+/**
+ * SidebarMenu is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarMenu extends BaseComponent {
+    componentName = 'SidebarMenu';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenu, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarMenu, isStandalone: true, selector: "p-sidebar-menu", host: { attributes: { "role": "list" }, properties: { "class": "cx('menu')" } }, providers: [SidebarStyle, { provide: SIDEBAR_MENU_INSTANCE, useExisting: SidebarMenu }, { provide: PARENT_INSTANCE, useExisting: SidebarMenu }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenu, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-menu',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: {
+                        '[class]': "cx('menu')",
+                        role: 'list'
+                    },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: SIDEBAR_MENU_INSTANCE, useExisting: SidebarMenu }, { provide: PARENT_INSTANCE, useExisting: SidebarMenu }]
+                }]
+        }] });
+
+/**
+ * SidebarMenuAction is a helper directive for Sidebar component.
+ * @group Components
+ */
+class SidebarMenuAction extends BaseComponent {
+    componentName = 'SidebarMenuAction';
+    bindDirectiveInstance = inject(Bind, { optional: true, self: true }) ?? undefined;
+    _componentStyle = inject(SidebarStyle);
+    /**
+     * Hide the action until the parent menu item is hovered / focus-within.
+     * @defaultValue false
+     * @group Props
+     */
+    showOnHover = input(false, { ...(ngDevMode ? { debugName: "showOnHover" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    dataShowOnHover = computed(() => (this.showOnHover() ? '' : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dataShowOnHover" }] : /* istanbul ignore next */ []));
+    onAfterViewChecked() {
+        this.bindDirectiveInstance?.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuAction, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.3", type: SidebarMenuAction, isStandalone: true, selector: "[pSidebarMenuAction]", inputs: { showOnHover: { classPropertyName: "showOnHover", publicName: "showOnHover", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "cx('menuAction')", "attr.data-show-on-hover": "dataShowOnHover()" } }, providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarMenuAction }], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuAction, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pSidebarMenuAction]',
+                    standalone: true,
+                    host: {
+                        '[class]': "cx('menuAction')",
+                        '[attr.data-show-on-hover]': 'dataShowOnHover()'
+                    },
+                    providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarMenuAction }]
+                }]
+        }], propDecorators: { showOnHover: [{ type: i0.Input, args: [{ isSignal: true, alias: "showOnHover", required: false }] }] } });
+
+/**
+ * SidebarMenuBadge is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarMenuBadge extends BaseComponent {
+    componentName = 'SidebarMenuBadge';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuBadge, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarMenuBadge, isStandalone: true, selector: "p-sidebar-menu-badge", host: { properties: { "class": "cx('menuBadge')" } }, providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarMenuBadge }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuBadge, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-menu-badge',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: { '[class]': "cx('menuBadge')" },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarMenuBadge }]
+                }]
+        }] });
+
+/**
+ * SidebarMenuButton is a helper directive for Sidebar component.
+ * @group Components
+ */
+class SidebarMenuButton extends BaseComponent {
+    componentName = 'SidebarMenuButton';
+    bindDirectiveInstance = inject(Bind, { optional: true, self: true }) ?? undefined;
+    _componentStyle = inject(SidebarStyle);
+    pcMenuItem = inject(SIDEBAR_MENU_ITEM_INSTANCE, { optional: true }) ?? undefined;
+    /**
+     * Whether this button represents the active menu entry.
+     * @defaultValue false
+     * @group Props
+     */
+    isActive = input(false, { ...(ngDevMode ? { debugName: "isActive" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    dataActive = computed(() => (this.isActive() ? 'true' : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dataActive" }] : /* istanbul ignore next */ []));
+    onAfterViewChecked() {
+        this.bindDirectiveInstance?.setAttrs(this.ptm('root'));
+    }
+    onClick(event) {
+        if (this.pcMenuItem?.collapsible()) {
+            this.pcMenuItem.toggle();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuButton, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.3", type: SidebarMenuButton, isStandalone: true, selector: "[pSidebarMenuButton]", inputs: { isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "onClick($event)" }, properties: { "class": "cx('menuButton')", "attr.data-active": "dataActive()" } }, providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarMenuButton }], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuButton, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pSidebarMenuButton]',
+                    standalone: true,
+                    host: {
+                        '[class]': "cx('menuButton')",
+                        '[attr.data-active]': 'dataActive()',
+                        '(click)': 'onClick($event)'
+                    },
+                    providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarMenuButton }]
+                }]
+        }], propDecorators: { isActive: [{ type: i0.Input, args: [{ isSignal: true, alias: "isActive", required: false }] }] } });
+
+/**
+ * SidebarMenuItem is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarMenuItem extends BaseComponent {
+    componentName = 'SidebarMenuItem';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    /**
+     * When enabled, renders a collapsible item that toggles the nested SidebarMenuSub.
+     * @defaultValue false
+     * @group Props
+     */
+    collapsible = input(false, { ...(ngDevMode ? { debugName: "collapsible" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Two-way bound open state for the nested sub-menu (only when `collapsible`).
+     * @defaultValue false
+     * @group Props
+     */
+    open = model(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    /**
+     * Initial open state applied once on init (like React's defaultOpen). Does not continuously bind.
+     * @defaultValue undefined
+     * @group Props
+     */
+    defaultOpen = input(undefined, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "defaultOpen" }] : /* istanbul ignore next */ []));
+    /**
+     * Disables interaction within the item.
+     * @defaultValue false
+     * @group Props
+     */
+    disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    isOpen = computed(() => this.collapsible() && this.open(), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "isOpen" }] : /* istanbul ignore next */ []));
+    dataCollapsible = computed(() => (this.collapsible() ? '' : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dataCollapsible" }] : /* istanbul ignore next */ []));
+    dataOpen = computed(() => (this.collapsible() && this.open() ? '' : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dataOpen" }] : /* istanbul ignore next */ []));
+    dataDisabled = computed(() => (this.disabled() ? '' : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dataDisabled" }] : /* istanbul ignore next */ []));
+    constructor() {
+        super();
+        effect(() => {
+            const def = this.defaultOpen();
+            if (def !== undefined && !this.defaultApplied) {
+                this.defaultApplied = true;
+                this.open.set(def);
+            }
+        });
+    }
+    defaultApplied = false;
+    toggle() {
+        if (this.collapsible() && !this.disabled()) {
+            this.open.set(!this.open());
+        }
+    }
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuItem, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.3", type: SidebarMenuItem, isStandalone: true, selector: "p-sidebar-menu-item", inputs: { collapsible: { classPropertyName: "collapsible", publicName: "collapsible", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, defaultOpen: { classPropertyName: "defaultOpen", publicName: "defaultOpen", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { attributes: { "role": "listitem" }, properties: { "class": "cx('menuItem')", "attr.data-collapsible": "dataCollapsible()", "attr.data-open": "dataOpen()", "attr.data-disabled": "dataDisabled()" } }, providers: [SidebarStyle, { provide: SIDEBAR_MENU_ITEM_INSTANCE, useExisting: SidebarMenuItem }, { provide: PARENT_INSTANCE, useExisting: SidebarMenuItem }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuItem, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-menu-item',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: {
+                        '[class]': "cx('menuItem')",
+                        role: 'listitem',
+                        '[attr.data-collapsible]': 'dataCollapsible()',
+                        '[attr.data-open]': 'dataOpen()',
+                        '[attr.data-disabled]': 'dataDisabled()'
+                    },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: SIDEBAR_MENU_ITEM_INSTANCE, useExisting: SidebarMenuItem }, { provide: PARENT_INSTANCE, useExisting: SidebarMenuItem }]
+                }]
+        }], ctorParameters: () => [], propDecorators: { collapsible: [{ type: i0.Input, args: [{ isSignal: true, alias: "collapsible", required: false }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], defaultOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultOpen", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
+
+/**
+ * SidebarMenuSub is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarMenuSub extends BaseComponent {
+    componentName = 'SidebarMenuSub';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    pcMenuItem = inject(SIDEBAR_MENU_ITEM_INSTANCE, { optional: true }) ?? undefined;
+    motion;
+    isInitialMount = true;
+    constructor() {
+        super();
+        effect(() => {
+            const collapsible = this.pcMenuItem?.collapsible() ?? false;
+            const visible = collapsible ? this.pcMenuItem.open() : true;
+            if (!isPlatformBrowser(this.platformId))
+                return;
+            const el = this.el?.nativeElement;
+            if (!el)
+                return;
+            if (!collapsible) {
+                this.cancel();
+                el.style.removeProperty('display');
+                return;
+            }
+            if (!this.motion) {
+                this.motion = createMotion(el, {
+                    name: 'p-sidebar-menu-sub',
+                    autoHeight: true,
+                    duration: 200
+                });
+            }
+            if (this.isInitialMount) {
+                if (!visible)
+                    el.style.display = 'none';
+                this.isInitialMount = false;
+                return;
+            }
+            if (visible) {
+                el.style.removeProperty('display');
+                this.motion.enter();
+            }
+            else {
+                this.motion.leave().then(() => {
+                    const stillClosed = this.pcMenuItem?.collapsible() && !this.pcMenuItem?.open();
+                    if (stillClosed && this.el?.nativeElement) {
+                        this.el.nativeElement.style.display = 'none';
+                    }
+                });
+            }
+        });
+    }
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    onDestroy() {
+        this.cancel();
+    }
+    cancel() {
+        this.motion?.cancel();
+        this.motion = undefined;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuSub, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarMenuSub, isStandalone: true, selector: "p-sidebar-menu-sub", host: { attributes: { "role": "list" }, properties: { "class": "cx('menuSub')" } }, providers: [SidebarStyle, { provide: SIDEBAR_MENU_SUB_INSTANCE, useExisting: SidebarMenuSub }, { provide: PARENT_INSTANCE, useExisting: SidebarMenuSub }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuSub, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-menu-sub',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: {
+                        '[class]': "cx('menuSub')",
+                        role: 'list'
+                    },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: SIDEBAR_MENU_SUB_INSTANCE, useExisting: SidebarMenuSub }, { provide: PARENT_INSTANCE, useExisting: SidebarMenuSub }]
+                }]
+        }], ctorParameters: () => [] });
+
+/**
+ * SidebarMenuSubButton is a helper directive for Sidebar component.
+ * @group Components
+ */
+class SidebarMenuSubButton extends BaseComponent {
+    componentName = 'SidebarMenuSubButton';
+    bindDirectiveInstance = inject(Bind, { optional: true, self: true }) ?? undefined;
+    _componentStyle = inject(SidebarStyle);
+    /**
+     * Whether this button represents the active sub-menu entry.
+     * @defaultValue false
+     * @group Props
+     */
+    isActive = input(false, { ...(ngDevMode ? { debugName: "isActive" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    /**
+     * Optional size variant.
+     * @group Props
+     */
+    size = input('md', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
+    dataActive = computed(() => (this.isActive() ? 'true' : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dataActive" }] : /* istanbul ignore next */ []));
+    dataSize = computed(() => (this.size() === 'sm' ? 'sm' : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dataSize" }] : /* istanbul ignore next */ []));
+    onAfterViewChecked() {
+        this.bindDirectiveInstance?.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuSubButton, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.3", type: SidebarMenuSubButton, isStandalone: true, selector: "[pSidebarMenuSubButton]", inputs: { isActive: { classPropertyName: "isActive", publicName: "isActive", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "cx('menuSubButton')", "attr.data-active": "dataActive()", "attr.data-size": "dataSize()" } }, providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarMenuSubButton }], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuSubButton, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pSidebarMenuSubButton]',
+                    standalone: true,
+                    host: {
+                        '[class]': "cx('menuSubButton')",
+                        '[attr.data-active]': 'dataActive()',
+                        '[attr.data-size]': 'dataSize()'
+                    },
+                    providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarMenuSubButton }]
+                }]
+        }], propDecorators: { isActive: [{ type: i0.Input, args: [{ isSignal: true, alias: "isActive", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }] } });
+
+/**
+ * SidebarMenuSubItem is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarMenuSubItem extends BaseComponent {
+    componentName = 'SidebarMenuSubItem';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuSubItem, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarMenuSubItem, isStandalone: true, selector: "p-sidebar-menu-sub-item", host: { attributes: { "role": "listitem" }, properties: { "class": "cx('menuSubItem')" } }, providers: [SidebarStyle, { provide: SIDEBAR_MENU_SUB_ITEM_INSTANCE, useExisting: SidebarMenuSubItem }, { provide: PARENT_INSTANCE, useExisting: SidebarMenuSubItem }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarMenuSubItem, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-menu-sub-item',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: {
+                        '[class]': "cx('menuSubItem')",
+                        role: 'listitem'
+                    },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: SIDEBAR_MENU_SUB_ITEM_INSTANCE, useExisting: SidebarMenuSubItem }, { provide: PARENT_INSTANCE, useExisting: SidebarMenuSubItem }]
+                }]
+        }] });
+
+/**
+ * SidebarAside is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarAside extends BaseComponent {
+    componentName = 'SidebarAside';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarAside, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarAside, isStandalone: true, selector: "p-sidebar-aside", host: { properties: { "class": "cx('aside')" } }, providers: [SidebarStyle, { provide: SIDEBAR_ASIDE_INSTANCE, useExisting: SidebarAside }, { provide: PARENT_INSTANCE, useExisting: SidebarAside }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarAside, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-aside',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: { '[class]': "cx('aside')" },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: SIDEBAR_ASIDE_INSTANCE, useExisting: SidebarAside }, { provide: PARENT_INSTANCE, useExisting: SidebarAside }]
+                }]
+        }] });
+
+/**
+ * SidebarPanel is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarPanel extends BaseComponent {
+    componentName = 'SidebarPanel';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarPanel, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarPanel, isStandalone: true, selector: "p-sidebar-panel", host: { properties: { "class": "cx('panel')" } }, providers: [SidebarStyle, { provide: SIDEBAR_PANEL_INSTANCE, useExisting: SidebarPanel }, { provide: PARENT_INSTANCE, useExisting: SidebarPanel }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarPanel, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-panel',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: { '[class]': "cx('panel')" },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: SIDEBAR_PANEL_INSTANCE, useExisting: SidebarPanel }, { provide: PARENT_INSTANCE, useExisting: SidebarPanel }]
+                }]
+        }] });
+
+/**
+ * SidebarRail is a helper directive for Sidebar component.
+ * @group Components
+ */
+class SidebarRail extends BaseComponent {
+    componentName = 'SidebarRail';
+    bindDirectiveInstance = inject(Bind, { optional: true, self: true }) ?? undefined;
+    _componentStyle = inject(SidebarStyle);
+    pcSidebar = inject(SIDEBAR_INSTANCE, { optional: true }) ?? undefined;
+    onAfterViewChecked() {
+        this.bindDirectiveInstance?.setAttrs(this.ptm('root'));
+    }
+    onClick(event) {
+        this.pcSidebar?.toggle(event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarRail, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.0.3", type: SidebarRail, isStandalone: true, selector: "[pSidebarRail]", host: { attributes: { "aria-label": "Toggle Sidebar", "title": "Toggle Sidebar", "tabindex": "-1", "type": "button" }, listeners: { "click": "onClick($event)" }, properties: { "class": "cx('rail')" } }, providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarRail }], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarRail, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pSidebarRail]',
+                    standalone: true,
+                    host: {
+                        '[class]': "cx('rail')",
+                        'aria-label': 'Toggle Sidebar',
+                        title: 'Toggle Sidebar',
+                        tabindex: '-1',
+                        type: 'button',
+                        '(click)': 'onClick($event)'
+                    },
+                    providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarRail }]
+                }]
+        }] });
+
+/**
+ * SidebarSpacer is a helper component for Sidebar component.
+ * @group Components
+ */
+class SidebarSpacer extends BaseComponent {
+    componentName = 'SidebarSpacer';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    _componentStyle = inject(SidebarStyle);
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarSpacer, deps: null, target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.3", type: SidebarSpacer, isStandalone: true, selector: "p-sidebar-spacer", host: { properties: { "class": "cx('spacer')" } }, providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarSpacer }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: ``, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarSpacer, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar-spacer',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: ``,
+                    host: { '[class]': "cx('spacer')" },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarSpacer }]
+                }]
+        }] });
+
+/**
+ * SidebarTrigger is a helper directive for Sidebar component.
+ * @group Components
+ */
+class SidebarTrigger extends BaseComponent {
+    componentName = 'SidebarTrigger';
+    bindDirectiveInstance = inject(Bind, { optional: true, self: true }) ?? undefined;
+    _componentStyle = inject(SidebarStyle);
+    layout = inject(SIDEBAR_LAYOUT_INSTANCE, { optional: true });
+    ancestorSidebar = inject(SIDEBAR_INSTANCE, { optional: true });
+    /**
+     * Id of the target Sidebar within the parent Layout.
+     * @group Props
+     */
+    target = input(/* @ts-ignore */
+    ...(ngDevMode ? [undefined, { debugName: "target" }] : /* istanbul ignore next */ []));
+    onAfterViewChecked() {
+        this.bindDirectiveInstance?.setAttrs(this.ptm('root'));
+    }
+    resolveTarget() {
+        const id = this.target();
+        if (id)
+            return this.layout?.getSidebar(id);
+        return this.ancestorSidebar;
+    }
+    onClick(event) {
+        this.resolveTarget()?.toggle(event);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarTrigger, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+    static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.3", type: SidebarTrigger, isStandalone: true, selector: "[pSidebarTrigger]", inputs: { target: { classPropertyName: "target", publicName: "target", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "data-scope": "sidebar", "data-part": "trigger" }, listeners: { "click": "onClick($event)" }, properties: { "class": "cx('trigger')", "attr.aria-controls": "resolveTarget()?.id()", "attr.aria-expanded": "resolveTarget()?.open()" } }, providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarTrigger }], usesInheritance: true, ngImport: i0 });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarTrigger, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[pSidebarTrigger]',
+                    standalone: true,
+                    host: {
+                        '[class]': "cx('trigger')",
+                        'data-scope': 'sidebar',
+                        'data-part': 'trigger',
+                        '[attr.aria-controls]': 'resolveTarget()?.id()',
+                        '[attr.aria-expanded]': 'resolveTarget()?.open()',
+                        '(click)': 'onClick($event)'
+                    },
+                    providers: [SidebarStyle, { provide: PARENT_INSTANCE, useExisting: SidebarTrigger }]
+                }]
+        }], propDecorators: { target: [{ type: i0.Input, args: [{ isSignal: true, alias: "target", required: false }] }] } });
+
+/**
+ * Sidebar is a compound navigation panel with collapsible icon mode, offcanvas mode, variants and optional overlay.
+ * @group Components
+ */
+class Sidebar extends BaseComponent {
+    componentName = 'Sidebar';
+    bindDirectiveInstance = inject(Bind, { self: true });
+    layout = inject(SIDEBAR_LAYOUT_INSTANCE, { optional: true });
+    /**
+     * Two-way bound open state.
+     * @defaultValue true
+     * @group Props
+     */
+    open = model(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "open" }] : /* istanbul ignore next */ []));
+    /**
+     * Side the sidebar attaches to.
+     * @defaultValue 'left'
+     * @group Props
+     */
+    side = input('left', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "side" }] : /* istanbul ignore next */ []));
+    /**
+     * Visual variant.
+     * @defaultValue 'sidebar'
+     * @group Props
+     */
+    variant = input('sidebar', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
+    /**
+     * Collapse mode.
+     * @defaultValue 'icon'
+     * @group Props
+     */
+    collapsible = input('icon', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "collapsible" }] : /* istanbul ignore next */ []));
+    /**
+     * When enabled, the sidebar overlays the inset instead of pushing it.
+     * @defaultValue false
+     * @group Props
+     */
+    overlay = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "overlay" }] : /* istanbul ignore next */ []));
+    /**
+     * Clicking the backdrop closes the sidebar when overlay is active.
+     * @defaultValue true
+     * @group Props
+     */
+    dismissable = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dismissable" }] : /* istanbul ignore next */ []));
+    /**
+     * When overlay is active, clicking inside the SidebarMain area collapses the sidebar. Clicks originating from a [pSidebarTrigger] are excluded so opening via the trigger is not immediately undone.
+     * @defaultValue true
+     * @group Props
+     */
+    hideOnOutsideClick = input(true, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hideOnOutsideClick" }] : /* istanbul ignore next */ []));
+    /**
+     * Expanded width (CSS length).
+     * @defaultValue '16rem'
+     * @group Props
+     */
+    width = input('16rem', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
+    /**
+     * Icon-mode width (CSS length).
+     * @defaultValue '3rem'
+     * @group Props
+     */
+    iconWidth = input('3rem', /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "iconWidth" }] : /* istanbul ignore next */ []));
+    /**
+     * Open/close the sidebar on pointer enter/leave of the root.
+     * @defaultValue false
+     * @group Props
+     */
+    openOnHover = input(false, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "openOnHover" }] : /* istanbul ignore next */ []));
+    /**
+     * Delay in ms before opening on hover.
+     * @defaultValue 50
+     * @group Props
+     */
+    hoverOpenDelay = input(50, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hoverOpenDelay" }] : /* istanbul ignore next */ []));
+    /**
+     * Delay in ms before closing on hover leave.
+     * @defaultValue 100
+     * @group Props
+     */
+    hoverCloseDelay = input(100, /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "hoverCloseDelay" }] : /* istanbul ignore next */ []));
+    /**
+     * Unique id used by [pSidebarTrigger] target lookup.
+     * @group Props
+     */
+    id = input(uuid('p-sidebar-'), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
+    displayState = computed(() => (this.open() ? 'expanded' : 'collapsed'), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "displayState" }] : /* istanbul ignore next */ []));
+    dataCollapsible = computed(() => (this.displayState() === 'collapsed' ? this.collapsible() : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dataCollapsible" }] : /* istanbul ignore next */ []));
+    dataOverlay = computed(() => (this.overlay() ? '' : null), /* @ts-ignore */
+    ...(ngDevMode ? [{ debugName: "dataOverlay" }] : /* istanbul ignore next */ []));
+    _componentStyle = inject(SidebarStyle);
+    hoverTimer = null;
+    constructor() {
+        super();
+        effect((onCleanup) => {
+            const id = this.id();
+            this.layout?.registerSidebar(id, this);
+            onCleanup(() => this.layout?.unregisterSidebar(id));
+        });
+    }
+    onAfterViewChecked() {
+        this.bindDirectiveInstance.setAttrs(this.ptm('root'));
+    }
+    toggle(event) {
+        if (this.collapsible() === 'none')
+            return;
+        this.open.set(!this.open());
+    }
+    expand(event) {
+        this.open.set(true);
+    }
+    collapse(event) {
+        if (this.collapsible() === 'none')
+            return;
+        this.open.set(false);
+    }
+    onPointerEnter(event) {
+        if (!this.openOnHover())
+            return;
+        this.clearHoverTimer();
+        this.hoverTimer = setTimeout(() => this.expand(event), this.hoverOpenDelay());
+    }
+    onPointerLeave(event) {
+        if (!this.openOnHover())
+            return;
+        this.clearHoverTimer();
+        this.hoverTimer = setTimeout(() => this.collapse(event), this.hoverCloseDelay());
+    }
+    clearHoverTimer() {
+        if (this.hoverTimer) {
+            clearTimeout(this.hoverTimer);
+            this.hoverTimer = null;
+        }
+    }
+    onDestroy() {
+        this.clearHoverTimer();
+    }
+    onEscape() {
+        if (this.overlay() && this.dismissable() && this.open()) {
+            this.collapse();
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: Sidebar, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.3", type: Sidebar, isStandalone: true, selector: "p-sidebar", inputs: { open: { classPropertyName: "open", publicName: "open", 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 }, overlay: { classPropertyName: "overlay", publicName: "overlay", isSignal: true, isRequired: false, transformFunction: null }, dismissable: { classPropertyName: "dismissable", publicName: "dismissable", isSignal: true, isRequired: false, transformFunction: null }, hideOnOutsideClick: { classPropertyName: "hideOnOutsideClick", publicName: "hideOnOutsideClick", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, iconWidth: { classPropertyName: "iconWidth", publicName: "iconWidth", isSignal: true, isRequired: false, transformFunction: null }, openOnHover: { classPropertyName: "openOnHover", publicName: "openOnHover", isSignal: true, isRequired: false, transformFunction: null }, hoverOpenDelay: { classPropertyName: "hoverOpenDelay", publicName: "hoverOpenDelay", isSignal: true, isRequired: false, transformFunction: null }, hoverCloseDelay: { classPropertyName: "hoverCloseDelay", publicName: "hoverCloseDelay", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, host: { listeners: { "pointerenter": "onPointerEnter($event)", "pointerleave": "onPointerLeave($event)", "keydown.escape": "onEscape()" }, properties: { "class": "cx('root')", "attr.data-side": "side()", "attr.data-variant": "variant()", "attr.data-collapsible": "dataCollapsible()", "attr.data-collapsible-mode": "collapsible()", "attr.data-overlay": "dataOverlay()", "attr.data-state": "displayState()", "style.--px-sidebar-width": "width()", "style.--px-sidebar-width-icon": "iconWidth()" } }, providers: [SidebarStyle, { provide: SIDEBAR_INSTANCE, useExisting: Sidebar }, { provide: PARENT_INSTANCE, useExisting: Sidebar }], usesInheritance: true, hostDirectives: [{ directive: i1.Bind }], ngImport: i0, template: `<ng-content />`, isInline: true, dependencies: [{ kind: "ngmodule", type: BindModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: Sidebar, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'p-sidebar',
+                    standalone: true,
+                    imports: [BindModule],
+                    template: `<ng-content />`,
+                    host: {
+                        '[class]': "cx('root')",
+                        '[attr.data-side]': 'side()',
+                        '[attr.data-variant]': 'variant()',
+                        '[attr.data-collapsible]': 'dataCollapsible()',
+                        '[attr.data-collapsible-mode]': 'collapsible()',
+                        '[attr.data-overlay]': 'dataOverlay()',
+                        '[attr.data-state]': 'displayState()',
+                        '[style.--px-sidebar-width]': 'width()',
+                        '[style.--px-sidebar-width-icon]': 'iconWidth()',
+                        '(pointerenter)': 'onPointerEnter($event)',
+                        '(pointerleave)': 'onPointerLeave($event)'
+                    },
+                    hostDirectives: [Bind],
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    encapsulation: ViewEncapsulation.None,
+                    providers: [SidebarStyle, { provide: SIDEBAR_INSTANCE, useExisting: Sidebar }, { provide: PARENT_INSTANCE, useExisting: Sidebar }]
+                }]
+        }], ctorParameters: () => [], propDecorators: { open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], 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 }] }], overlay: [{ type: i0.Input, args: [{ isSignal: true, alias: "overlay", required: false }] }], dismissable: [{ type: i0.Input, args: [{ isSignal: true, alias: "dismissable", required: false }] }], hideOnOutsideClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideOnOutsideClick", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], iconWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconWidth", required: false }] }], openOnHover: [{ type: i0.Input, args: [{ isSignal: true, alias: "openOnHover", required: false }] }], hoverOpenDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverOpenDelay", required: false }] }], hoverCloseDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverCloseDelay", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], onEscape: [{
+                type: HostListener,
+                args: ['keydown.escape']
+            }] } });
+const SIDEBAR_PARTS = [
+    Sidebar,
+    SidebarLayout,
+    SidebarSpacer,
+    SidebarAside,
+    SidebarPanel,
+    SidebarHeader,
+    SidebarContent,
+    SidebarFooter,
+    SidebarGroup,
+    SidebarGroupLabel,
+    SidebarGroupContent,
+    SidebarGroupAction,
+    SidebarMenu,
+    SidebarMenuItem,
+    SidebarMenuButton,
+    SidebarMenuAction,
+    SidebarMenuBadge,
+    SidebarMenuSub,
+    SidebarMenuSubItem,
+    SidebarMenuSubButton,
+    SidebarTrigger,
+    SidebarRail,
+    SidebarBackdrop,
+    SidebarMain
+];
+class SidebarModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.3", ngImport: i0, type: SidebarModule, imports: [Sidebar, SidebarLayout,
+            SidebarSpacer,
+            SidebarAside,
+            SidebarPanel,
+            SidebarHeader,
+            SidebarContent,
+            SidebarFooter,
+            SidebarGroup,
+            SidebarGroupLabel,
+            SidebarGroupContent,
+            SidebarGroupAction,
+            SidebarMenu,
+            SidebarMenuItem,
+            SidebarMenuButton,
+            SidebarMenuAction,
+            SidebarMenuBadge,
+            SidebarMenuSub,
+            SidebarMenuSubItem,
+            SidebarMenuSubButton,
+            SidebarTrigger,
+            SidebarRail,
+            SidebarBackdrop,
+            SidebarMain], exports: [Sidebar, SidebarLayout,
+            SidebarSpacer,
+            SidebarAside,
+            SidebarPanel,
+            SidebarHeader,
+            SidebarContent,
+            SidebarFooter,
+            SidebarGroup,
+            SidebarGroupLabel,
+            SidebarGroupContent,
+            SidebarGroupAction,
+            SidebarMenu,
+            SidebarMenuItem,
+            SidebarMenuButton,
+            SidebarMenuAction,
+            SidebarMenuBadge,
+            SidebarMenuSub,
+            SidebarMenuSubItem,
+            SidebarMenuSubButton,
+            SidebarTrigger,
+            SidebarRail,
+            SidebarBackdrop,
+            SidebarMain] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarModule, imports: [Sidebar, SidebarLayout,
+            SidebarSpacer,
+            SidebarAside,
+            SidebarPanel,
+            SidebarHeader,
+            SidebarContent,
+            SidebarFooter,
+            SidebarGroup,
+            SidebarGroupLabel,
+            SidebarGroupContent,
+            SidebarMenu,
+            SidebarMenuItem,
+            SidebarMenuBadge,
+            SidebarMenuSub,
+            SidebarMenuSubItem,
+            SidebarBackdrop,
+            SidebarMain] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.3", ngImport: i0, type: SidebarModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [...SIDEBAR_PARTS],
+                    exports: [...SIDEBAR_PARTS]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { SIDEBAR_ASIDE_INSTANCE, SIDEBAR_CONTENT_INSTANCE, SIDEBAR_FOOTER_INSTANCE, SIDEBAR_GROUP_INSTANCE, SIDEBAR_HEADER_INSTANCE, SIDEBAR_INSTANCE, SIDEBAR_LAYOUT_INSTANCE, SIDEBAR_MENU_INSTANCE, SIDEBAR_MENU_ITEM_INSTANCE, SIDEBAR_MENU_SUB_INSTANCE, SIDEBAR_MENU_SUB_ITEM_INSTANCE, SIDEBAR_PANEL_INSTANCE, Sidebar, SidebarAside, SidebarBackdrop, SidebarClasses, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarLayout, SidebarMain, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarModule, SidebarPanel, SidebarRail, SidebarSpacer, SidebarStyle, SidebarTrigger };
+//# sourceMappingURL=primenglab-sidebar.mjs.map