@simplysm/angular 14.0.1 → 14.0.5

package/dist/ui/navigation/pagination/sd-pagination.control.js

@@ -0,0 +1,137 @@
+import { ChangeDetectionStrategy, Component, computed, input, model, numberAttribute, ViewEncapsulation, } from "@angular/core";
+import { SdAnchorControl } from "../../form/button/sd-anchor.control";
+import { NgIcon } from "@ng-icons/core";
+import { tablerChevronLeft, tablerChevronRight, tablerChevronsLeft, tablerChevronsRight, } from "@ng-icons/tabler-icons";
+import * as i0 from "@angular/core";
+function SdPaginationControl_For_5_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-anchor", 6);
+    i0.ɵɵlistener("click", function SdPaginationControl_For_5_Template_sd_anchor_click_0_listener() { const page_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.goToPage(page_r2 - 1)); });
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const page_r2 = ctx.$implicit;
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵstyleProp("text-decoration", page_r2 === ctx_r2.currentPage() + 1 ? "underline" : "");
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(page_r2);
+} }
+export class SdPaginationControl {
+    icons = { tablerChevronsLeft, tablerChevronLeft, tablerChevronRight, tablerChevronsRight };
+    currentPage = model(0, ...(ngDevMode ? [{ debugName: "currentPage" }] : /* istanbul ignore next */ []));
+    totalPageCount = input(0, { ...(ngDevMode ? { debugName: "totalPageCount" } : /* istanbul ignore next */ {}), transform: numberAttribute });
+    visiblePageCount = input(10, { ...(ngDevMode ? { debugName: "visiblePageCount" } : /* istanbul ignore next */ {}), transform: numberAttribute });
+    groupIndex = computed(() => {
+        return Math.floor(this.currentPage() / this.visiblePageCount());
+    }, ...(ngDevMode ? [{ debugName: "groupIndex" }] : /* istanbul ignore next */ []));
+    hasPrev = computed(() => {
+        if (this.totalPageCount() === 0) {
+            return false;
+        }
+        return this.groupIndex() > 0;
+    }, ...(ngDevMode ? [{ debugName: "hasPrev" }] : /* istanbul ignore next */ []));
+    hasNext = computed(() => {
+        const totalPageCount = this.totalPageCount();
+        if (totalPageCount === 0) {
+            return false;
+        }
+        const lastGroupIndex = Math.floor((totalPageCount - 1) / this.visiblePageCount());
+        return this.groupIndex() < lastGroupIndex;
+    }, ...(ngDevMode ? [{ debugName: "hasNext" }] : /* istanbul ignore next */ []));
+    displayPages = computed(() => {
+        const totalPageCount = this.totalPageCount();
+        if (totalPageCount === 0) {
+            return [];
+        }
+        const visiblePageCount = this.visiblePageCount();
+        const startPage = this.groupIndex() * visiblePageCount + 1;
+        const endPage = Math.min(startPage + visiblePageCount - 1, totalPageCount);
+        const pages = [];
+        for (let i = startPage; i <= endPage; i++) {
+            pages.push(i);
+        }
+        return pages;
+    }, ...(ngDevMode ? [{ debugName: "displayPages" }] : /* istanbul ignore next */ []));
+    goToPage(page) {
+        this.currentPage.set(page);
+    }
+    goToNextGroup() {
+        this.currentPage.set((this.groupIndex() + 1) * this.visiblePageCount());
+    }
+    goToPrevGroup() {
+        this.currentPage.set((this.groupIndex() - 1) * this.visiblePageCount());
+    }
+    goToFirst() {
+        this.currentPage.set(0);
+    }
+    goToLast() {
+        this.currentPage.set(this.totalPageCount() - 1);
+    }
+    static ɵfac = function SdPaginationControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdPaginationControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdPaginationControl, selectors: [["sd-pagination"]], hostAttrs: [1, "flex-row", "gap-xs"], inputs: { currentPage: [1, "currentPage"], totalPageCount: [1, "totalPageCount"], visiblePageCount: [1, "visiblePageCount"] }, outputs: { currentPage: "currentPageChange" }, decls: 10, vars: 8, consts: [[1, "nav-first", 3, "click", "disabled"], [3, "svg"], [1, "nav-prev-group", 3, "click", "disabled"], [1, "page-anchor", 3, "text-decoration"], [1, "nav-next-group", 3, "click", "disabled"], [1, "nav-last", 3, "click", "disabled"], [1, "page-anchor", 3, "click"]], template: function SdPaginationControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "sd-anchor", 0);
+            i0.ɵɵlistener("click", function SdPaginationControl_Template_sd_anchor_click_0_listener() { return ctx.goToFirst(); });
+            i0.ɵɵelement(1, "ng-icon", 1);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(2, "sd-anchor", 2);
+            i0.ɵɵlistener("click", function SdPaginationControl_Template_sd_anchor_click_2_listener() { return ctx.goToPrevGroup(); });
+            i0.ɵɵelement(3, "ng-icon", 1);
+            i0.ɵɵelementEnd();
+            i0.ɵɵrepeaterCreate(4, SdPaginationControl_For_5_Template, 2, 3, "sd-anchor", 3, i0.ɵɵrepeaterTrackByIdentity);
+            i0.ɵɵelementStart(6, "sd-anchor", 4);
+            i0.ɵɵlistener("click", function SdPaginationControl_Template_sd_anchor_click_6_listener() { return ctx.goToNextGroup(); });
+            i0.ɵɵelement(7, "ng-icon", 1);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(8, "sd-anchor", 5);
+            i0.ɵɵlistener("click", function SdPaginationControl_Template_sd_anchor_click_8_listener() { return ctx.goToLast(); });
+            i0.ɵɵelement(9, "ng-icon", 1);
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵproperty("disabled", !ctx.hasPrev());
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("svg", ctx.icons.tablerChevronsLeft);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("disabled", !ctx.hasPrev());
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("svg", ctx.icons.tablerChevronLeft);
+            i0.ɵɵadvance();
+            i0.ɵɵrepeater(ctx.displayPages());
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("disabled", !ctx.hasNext());
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("svg", ctx.icons.tablerChevronRight);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("disabled", !ctx.hasNext());
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("svg", ctx.icons.tablerChevronsRight);
+        } }, dependencies: [SdAnchorControl, NgIcon], styles: ["sd-pagination > sd-anchor {\n  display: inline-block;\n  padding: var(--gap-xs);\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdPaginationControl, [{
+        type: Component,
+        args: [{ selector: "sd-pagination", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [SdAnchorControl, NgIcon], template: `
+    <sd-anchor class="nav-first" [disabled]="!hasPrev()" (click)="goToFirst()">
+      <ng-icon [svg]="icons.tablerChevronsLeft" />
+    </sd-anchor>
+    <sd-anchor class="nav-prev-group" [disabled]="!hasPrev()" (click)="goToPrevGroup()">
+      <ng-icon [svg]="icons.tablerChevronLeft" />
+    </sd-anchor>
+
+    @for (page of displayPages(); track page) {
+      <sd-anchor
+        class="page-anchor"
+        [style.text-decoration]="page === currentPage() + 1 ? 'underline' : ''"
+        (click)="goToPage(page - 1)"
+      >{{ page }}</sd-anchor>
+    }
+
+    <sd-anchor class="nav-next-group" [disabled]="!hasNext()" (click)="goToNextGroup()">
+      <ng-icon [svg]="icons.tablerChevronRight" />
+    </sd-anchor>
+    <sd-anchor class="nav-last" [disabled]="!hasNext()" (click)="goToLast()">
+      <ng-icon [svg]="icons.tablerChevronsRight" />
+    </sd-anchor>
+  `, host: {
+                    class: "flex-row gap-xs",
+                }, styles: ["sd-pagination > sd-anchor {\n  display: inline-block;\n  padding: var(--gap-xs);\n}"] }]
+    }], null, { currentPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentPage", required: false }] }, { type: i0.Output, args: ["currentPageChange"] }], totalPageCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalPageCount", required: false }] }], visiblePageCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "visiblePageCount", required: false }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdPaginationControl, { className: "SdPaginationControl", filePath: "packages/angular/src/ui/navigation/pagination/sd-pagination.control.ts", lineNumber: 62 }); })();

package/dist/ui/navigation/sidebar/sd-sidebar-container.control.d.ts

@@ -0,0 +1,11 @@
+import * as i0 from "@angular/core";
+export declare class SdSidebarContainerControl {
+    private readonly _router;
+    toggle: import("@angular/core").WritableSignal<boolean>;
+    private readonly _navStart;
+    constructor();
+    onBackdropClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdSidebarContainerControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdSidebarContainerControl, "sd-sidebar-container", never, {}, {}, never, ["*"], true, never>;
+}
+//# sourceMappingURL=sd-sidebar-container.control.d.ts.map

package/dist/ui/navigation/sidebar/sd-sidebar-container.control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-sidebar-container.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\navigation\\sidebar\\sd-sidebar-container.control.ts"],"names":[],"mappings":";AAKA,qBA+Da,yBAAyB;IACpC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAsC;IAE9D,MAAM,kDAAiB;IAEvB,OAAO,CAAC,QAAQ,CAAC,SAAS,CAEZ;;IAad,eAAe,IAAI,IAAI;yCApBZ,yBAAyB;2CAAzB,yBAAyB;CAuBrC"}

package/dist/ui/navigation/sidebar/sd-sidebar-container.control.js

@@ -0,0 +1,46 @@
+import { ChangeDetectionStrategy, Component, effect, inject, signal, ViewEncapsulation } from "@angular/core";
+import { toSignal } from "@angular/core/rxjs-interop";
+import { NavigationStart, Router } from "@angular/router";
+import { filter } from "rxjs";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+export class SdSidebarContainerControl {
+    _router = inject(Router, { optional: true });
+    toggle = signal(false, ...(ngDevMode ? [{ debugName: "toggle" }] : /* istanbul ignore next */ []));
+    _navStart = this._router
+        ? toSignal(this._router.events.pipe(filter((e) => e instanceof NavigationStart)))
+        : undefined;
+    constructor() {
+        const navStart = this._navStart;
+        if (navStart) {
+            effect(() => {
+                if (navStart()) {
+                    this.toggle.set(false);
+                }
+            });
+        }
+    }
+    onBackdropClick() {
+        this.toggle.update((v) => !v);
+    }
+    static ɵfac = function SdSidebarContainerControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdSidebarContainerControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdSidebarContainerControl, selectors: [["sd-sidebar-container"]], hostVars: 1, hostBindings: function SdSidebarContainerControl_HostBindings(rf, ctx) { if (rf & 2) {
+            i0.ɵɵattribute("data-sd-toggle", ctx.toggle());
+        } }, ngContentSelectors: _c0, decls: 2, vars: 0, consts: [[1, "_backdrop", 3, "mousedown"]], template: function SdSidebarContainerControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+            i0.ɵɵdomElementStart(1, "div", 0);
+            i0.ɵɵdomListener("mousedown", function SdSidebarContainerControl_Template_div_mousedown_1_listener() { return ctx.onBackdropClick(); });
+            i0.ɵɵdomElementEnd();
+        } }, styles: ["sd-sidebar-container {\n  display: block;\n  position: relative;\n  height: 100%;\n  padding-left: var(--sidebar-width);\n  transition: padding-left 0.1s ease-out;\n}\nsd-sidebar-container[data-sd-toggle=true] {\n  padding-left: 0;\n  transition: padding-left 0.1s ease-in;\n}\nsd-sidebar-container > ._backdrop {\n  display: none;\n}\n\n@media all and (max-width: 520px) {\n  sd-sidebar-container {\n    padding-left: 0;\n  }\n  sd-sidebar-container > ._backdrop {\n    position: absolute;\n    display: block;\n    z-index: calc(var(--z-index-sidebar) - 1);\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: var(--background-rev-color);\n    opacity: 0;\n    pointer-events: none;\n    transition: opacity 0.3s ease-in-out;\n  }\n  sd-sidebar-container[data-sd-toggle=true] > ._backdrop {\n    opacity: 0.6;\n    pointer-events: auto;\n  }\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSidebarContainerControl, [{
+        type: Component,
+        args: [{ selector: "sd-sidebar-container", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [], host: {
+                    "[attr.data-sd-toggle]": "toggle()",
+                }, template: `
+    <ng-content />
+    <div class="_backdrop" (mousedown)="onBackdropClick()"></div>
+  `, styles: ["sd-sidebar-container {\n  display: block;\n  position: relative;\n  height: 100%;\n  padding-left: var(--sidebar-width);\n  transition: padding-left 0.1s ease-out;\n}\nsd-sidebar-container[data-sd-toggle=true] {\n  padding-left: 0;\n  transition: padding-left 0.1s ease-in;\n}\nsd-sidebar-container > ._backdrop {\n  display: none;\n}\n\n@media all and (max-width: 520px) {\n  sd-sidebar-container {\n    padding-left: 0;\n  }\n  sd-sidebar-container > ._backdrop {\n    position: absolute;\n    display: block;\n    z-index: calc(var(--z-index-sidebar) - 1);\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    background: var(--background-rev-color);\n    opacity: 0;\n    pointer-events: none;\n    transition: opacity 0.3s ease-in-out;\n  }\n  sd-sidebar-container[data-sd-toggle=true] > ._backdrop {\n    opacity: 0.6;\n    pointer-events: auto;\n  }\n}"] }]
+    }], () => [], null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSidebarContainerControl, { className: "SdSidebarContainerControl", filePath: "packages/angular/src/ui/navigation/sidebar/sd-sidebar-container.control.ts", lineNumber: 69 }); })();

package/dist/ui/navigation/sidebar/sd-sidebar-menu.control.d.ts

@@ -0,0 +1,28 @@
+import * as i0 from "@angular/core";
+export declare class SdSidebarMenuControl {
+    menus: import("@angular/core").InputSignal<ISdSidebarMenu[]>;
+    layout: import("@angular/core").InputSignal<"flat" | "accordion" | undefined>;
+    getMenuIsSelectedFn: import("@angular/core").InputSignal<((menu: ISdSidebarMenu) => boolean) | undefined>;
+    fullPageCode: import("@angular/core").Signal<string>;
+    rootLayout: import("@angular/core").Signal<"flat" | "accordion">;
+    getMenuRouterLinkOption(menu: ISdSidebarMenu): {
+        link: string;
+        queryParams: Record<string, string> | undefined;
+    } | undefined;
+    getIsMenuSelected(menu: ISdSidebarMenu): boolean;
+    onMenuClick(menu: ISdSidebarMenu): void;
+    protected readonly itemTemplateType: {
+        menus: ISdSidebarMenu[];
+        depth: number;
+    };
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdSidebarMenuControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdSidebarMenuControl, "sd-sidebar-menu", never, { "menus": { "alias": "menus"; "required": false; "isSignal": true; }; "layout": { "alias": "layout"; "required": false; "isSignal": true; }; "getMenuIsSelectedFn": { "alias": "getMenuIsSelectedFn"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+export interface ISdSidebarMenu {
+    title: string;
+    codeChain: string[];
+    url?: string;
+    icon?: string;
+    children?: ISdSidebarMenu[];
+}
+//# sourceMappingURL=sd-sidebar-menu.control.d.ts.map

package/dist/ui/navigation/sidebar/sd-sidebar-menu.control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-sidebar-menu.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\navigation\\sidebar\\sd-sidebar-menu.control.ts"],"names":[],"mappings":";AAaA,qBA8Ea,oBAAoB;IAC/B,KAAK,wDAA+B;IACpC,MAAM,wEAAiC;IACvC,mBAAmB,8CAAgB,cAAc,KAAK,OAAO,eAAI;IAEjE,YAAY,yCAA2B;IAEvC,UAAU,uDAAsF;IAEhG,uBAAuB,CACrB,IAAI,EAAE,cAAc,GACnB;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,CAAA;KAAE,GAAG,SAAS;IAIhF,iBAAiB,CAAC,IAAI,EAAE,cAAc,GAAG,OAAO;IAIhD,WAAW,CAAC,IAAI,EAAE,cAAc,GAAG,IAAI;IAMvC,SAAS,CAAC,QAAQ,CAAC,gBAAgB,EAAG;QACpC,KAAK,EAAE,cAAc,EAAE,CAAC;QACxB,KAAK,EAAE,MAAM,CAAC;KACf,CAAC;yCA5BS,oBAAoB;2CAApB,oBAAoB;CA6BhC;AAED,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,cAAc,EAAE,CAAC;CAC7B"}

package/dist/ui/navigation/sidebar/sd-sidebar-menu.control.js

@@ -0,0 +1,159 @@
+import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation } from "@angular/core";
+import { useFullPageCodeSignal } from "../../../core/utils/useFullPageCodeSignal";
+import { getMenuRouterLinkOption as menuRouterLinkOption, getIsMenuSelected as menuIsSelected, } from "../menu-utils";
+import { NgTemplateOutlet } from "@angular/common";
+import { SdTypedTemplateDirective } from "../../../core/directives/sd-typed-template.directive";
+import { SdRouterLinkDirective } from "../../../core/directives/sd-router-link.directive";
+import { SdListControl } from "../../data/list/sd-list.control";
+import { SdListItemControl } from "../../data/list/sd-list-item.control";
+import { NgIcon } from "@ng-icons/core";
+import * as i0 from "@angular/core";
+const _c0 = a0 => ({ menus: a0, depth: 0 });
+const _c1 = (a0, a1) => ({ menus: a0, depth: a1 });
+const _forTrack0 = ($index, $item) => $item.codeChain.join(".");
+function SdSidebarMenuControl_ng_template_3_Template(rf, ctx) { }
+function SdSidebarMenuControl_ng_template_4_For_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ng-icon", 8);
+    i0.ɵɵtext(1, " \u00A0 ");
+} if (rf & 2) {
+    const menu_r2 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("svg", menu_r2.icon);
+} }
+function SdSidebarMenuControl_ng_template_4_For_1_Conditional_3_ng_template_1_Template(rf, ctx) { }
+function SdSidebarMenuControl_ng_template_4_For_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "sd-list", 7);
+    i0.ɵɵtemplate(1, SdSidebarMenuControl_ng_template_4_For_1_Conditional_3_ng_template_1_Template, 0, 0, "ng-template", 3);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const menu_r2 = i0.ɵɵnextContext().$implicit;
+    const depth_r4 = i0.ɵɵnextContext().depth;
+    i0.ɵɵnextContext();
+    const itemTpl_r5 = i0.ɵɵreference(5);
+    i0.ɵɵproperty("inset", true);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", itemTpl_r5)("ngTemplateOutletContext", i0.ɵɵpureFunction2(3, _c1, menu_r2.children, depth_r4 + 1));
+} }
+function SdSidebarMenuControl_ng_template_4_For_1_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-list-item", 6);
+    i0.ɵɵlistener("click", function SdSidebarMenuControl_ng_template_4_For_1_Template_sd_list_item_click_0_listener() { const menu_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r2.onMenuClick(menu_r2)); });
+    i0.ɵɵconditionalCreate(1, SdSidebarMenuControl_ng_template_4_For_1_Conditional_1_Template, 2, 1);
+    i0.ɵɵtext(2);
+    i0.ɵɵconditionalCreate(3, SdSidebarMenuControl_ng_template_4_For_1_Conditional_3_Template, 2, 6, "sd-list", 7);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const menu_r2 = ctx.$implicit;
+    const depth_r4 = i0.ɵɵnextContext().depth;
+    const ctx_r2 = i0.ɵɵnextContext();
+    i0.ɵɵstyleProp("padding-left", depth_r4 > 0 ? (depth_r4 + 1) * 0.5 : undefined, "em");
+    i0.ɵɵproperty("sd-router-link", ctx_r2.getMenuRouterLinkOption(menu_r2))("selected", ctx_r2.getIsMenuSelected(menu_r2))("layout", depth_r4 === 0 ? ctx_r2.rootLayout() : "accordion");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(menu_r2.icon ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", menu_r2.title, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(menu_r2.children ? 3 : -1);
+} }
+function SdSidebarMenuControl_ng_template_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵrepeaterCreate(0, SdSidebarMenuControl_ng_template_4_For_1_Template, 4, 8, "sd-list-item", 5, _forTrack0);
+} if (rf & 2) {
+    const currMenus_r6 = ctx.menus;
+    i0.ɵɵrepeater(currMenus_r6);
+} }
+export class SdSidebarMenuControl {
+    menus = input([], ...(ngDevMode ? [{ debugName: "menus" }] : /* istanbul ignore next */ []));
+    layout = input(...(ngDevMode ? [undefined, { debugName: "layout" }] : /* istanbul ignore next */ []));
+    getMenuIsSelectedFn = input(...(ngDevMode ? [undefined, { debugName: "getMenuIsSelectedFn" }] : /* istanbul ignore next */ []));
+    fullPageCode = useFullPageCodeSignal();
+    rootLayout = computed(() => this.layout() ?? (this.menus().length <= 3 ? "flat" : "accordion"), ...(ngDevMode ? [{ debugName: "rootLayout" }] : /* istanbul ignore next */ []));
+    getMenuRouterLinkOption(menu) {
+        return menuRouterLinkOption(menu);
+    }
+    getIsMenuSelected(menu) {
+        return menuIsSelected(menu, this.fullPageCode(), this.getMenuIsSelectedFn());
+    }
+    onMenuClick(menu) {
+        if (menu.url != null) {
+            window.open(menu.url, "_blank");
+        }
+    }
+    itemTemplateType;
+    static ɵfac = function SdSidebarMenuControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdSidebarMenuControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdSidebarMenuControl, selectors: [["sd-sidebar-menu"]], hostAttrs: [1, "flex-column", "fill"], hostVars: 1, hostBindings: function SdSidebarMenuControl_HostBindings(rf, ctx) { if (rf & 2) {
+            i0.ɵɵattribute("data-sd-root-layout", ctx.rootLayout());
+        } }, inputs: { menus: [1, "menus"], layout: [1, "layout"], getMenuIsSelectedFn: [1, "getMenuIsSelectedFn"] }, decls: 6, vars: 6, consts: [["itemTpl", ""], [1, "control-header", "p-default"], [1, "flex-fill", 3, "inset"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [3, "typed"], [3, "padding-left", "sd-router-link", "selected", "layout"], [3, "click", "sd-router-link", "selected", "layout"], [3, "inset"], [3, "svg"]], template: function SdSidebarMenuControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 1);
+            i0.ɵɵtext(1, "MENU");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(2, "sd-list", 2);
+            i0.ɵɵtemplate(3, SdSidebarMenuControl_ng_template_3_Template, 0, 0, "ng-template", 3);
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(4, SdSidebarMenuControl_ng_template_4_Template, 2, 0, "ng-template", 4, 0, i0.ɵɵtemplateRefExtractor);
+        } if (rf & 2) {
+            const itemTpl_r5 = i0.ɵɵreference(5);
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("inset", true);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("ngTemplateOutlet", itemTpl_r5)("ngTemplateOutletContext", i0.ɵɵpureFunction1(4, _c0, ctx.menus()));
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("typed", ctx.itemTemplateType);
+        } }, dependencies: [NgTemplateOutlet,
+            SdTypedTemplateDirective,
+            SdRouterLinkDirective,
+            SdListControl,
+            SdListItemControl,
+            NgIcon], styles: ["sd-sidebar-menu > sd-list[data-sd-inset=true] sd-list {\n  background: var(--trans-lightest);\n}\nsd-sidebar-menu > sd-list[data-sd-inset=true] > sd-list-item > ._content {\n  padding-block: var(--gap-default);\n}\nsd-sidebar-menu:not([data-sd-root-layout=accordion]) > sd-list[data-sd-inset=true] > sd-list-item > sd-collapse > ._content > sd-list {\n  background: transparent;\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSidebarMenuControl, [{
+        type: Component,
+        args: [{ selector: "sd-sidebar-menu", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [
+                    NgTemplateOutlet,
+                    SdTypedTemplateDirective,
+                    SdRouterLinkDirective,
+                    SdListControl,
+                    SdListItemControl,
+                    NgIcon,
+                ], host: {
+                    "class": "flex-column fill",
+                    "[attr.data-sd-root-layout]": "rootLayout()",
+                }, template: `
+    <div class="control-header p-default">MENU</div>
+
+    <sd-list class="flex-fill" [inset]="true">
+      <ng-template
+        [ngTemplateOutlet]="itemTpl"
+        [ngTemplateOutletContext]="{ menus: menus(), depth: 0 }"
+      ></ng-template>
+    </sd-list>
+
+    <ng-template #itemTpl [typed]="itemTemplateType" let-currMenus="menus" let-depth="depth">
+      @for (menu of currMenus; track menu.codeChain.join(".")) {
+        <sd-list-item
+          [style.padding-left.em]="depth > 0 ? (depth + 1) * 0.5 : undefined"
+          [sd-router-link]="getMenuRouterLinkOption(menu)"
+          (click)="onMenuClick(menu)"
+          [selected]="getIsMenuSelected(menu)"
+          [layout]="depth === 0 ? rootLayout() : 'accordion'"
+        >
+          @if (menu.icon) {
+            <ng-icon [svg]="menu.icon" />
+            &nbsp;
+          }
+          {{ menu.title }}
+          @if (menu.children) {
+            <sd-list [inset]="true">
+              <ng-template
+                [ngTemplateOutlet]="itemTpl"
+                [ngTemplateOutletContext]="{
+                  menus: menu.children,
+                  depth: depth + 1,
+                }"
+              ></ng-template>
+            </sd-list>
+          }
+        </sd-list-item>
+      }
+    </ng-template>
+  `, styles: ["sd-sidebar-menu > sd-list[data-sd-inset=true] sd-list {\n  background: var(--trans-lightest);\n}\nsd-sidebar-menu > sd-list[data-sd-inset=true] > sd-list-item > ._content {\n  padding-block: var(--gap-default);\n}\nsd-sidebar-menu:not([data-sd-root-layout=accordion]) > sd-list[data-sd-inset=true] > sd-list-item > sd-collapse > ._content > sd-list {\n  background: transparent;\n}"] }]
+    }], null, { menus: [{ type: i0.Input, args: [{ isSignal: true, alias: "menus", required: false }] }], layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }], getMenuIsSelectedFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "getMenuIsSelectedFn", required: false }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSidebarMenuControl, { className: "SdSidebarMenuControl", filePath: "packages/angular/src/ui/navigation/sidebar/sd-sidebar-menu.control.ts", lineNumber: 92 }); })();

package/dist/ui/navigation/sidebar/sd-sidebar-user.control.d.ts

@@ -0,0 +1,16 @@
+import * as i0 from "@angular/core";
+export declare class SdSidebarUserControl {
+    userMenu: import("@angular/core").InputSignal<ISidebarUserMenu | undefined>;
+    menuOpen: import("@angular/core").WritableSignal<boolean>;
+    onMenuOpenButtonClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdSidebarUserControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdSidebarUserControl, "sd-sidebar-user", never, { "userMenu": { "alias": "userMenu"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+export interface ISidebarUserMenu {
+    title: string;
+    menus: {
+        title: string;
+        onClick: () => void;
+    }[];
+}
+//# sourceMappingURL=sd-sidebar-user.control.d.ts.map

package/dist/ui/navigation/sidebar/sd-sidebar-user.control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-sidebar-user.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\navigation\\sidebar\\sd-sidebar-user.control.ts"],"names":[],"mappings":";AAOA,qBA4Da,oBAAoB;IAC/B,QAAQ,oEAA6B;IAErC,QAAQ,kDAAiB;IAEzB,qBAAqB,IAAI,IAAI;yCALlB,oBAAoB;2CAApB,oBAAoB;CAQhC;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE;QACL,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,MAAM,IAAI,CAAC;KACrB,EAAE,CAAC;CACL"}

package/dist/ui/navigation/sidebar/sd-sidebar-user.control.js

@@ -0,0 +1,109 @@
+import { ChangeDetectionStrategy, Component, input, signal, ViewEncapsulation } from "@angular/core";
+import { SdCollapseIconControl } from "../collapse/sd-collapse-icon.control";
+import { SdCollapseControl } from "../collapse/sd-collapse.control";
+import { SdRippleDirective } from "../../../core/directives/sd-ripple.directive";
+import { SdListControl } from "../../data/list/sd-list.control";
+import { SdListItemControl } from "../../data/list/sd-list-item.control";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+const _forTrack0 = ($index, $item) => $item.title;
+function SdSidebarUserControl_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 3);
+    i0.ɵɵlistener("click", function SdSidebarUserControl_Conditional_2_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onMenuOpenButtonClick()); })("keydown.enter", function SdSidebarUserControl_Conditional_2_Template_div_keydown_enter_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onMenuOpenButtonClick()); });
+    i0.ɵɵtext(1);
+    i0.ɵɵelement(2, "sd-collapse-icon", 4);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    let tmp_2_0;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("sd-ripple", true);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", (tmp_2_0 = ctx_r1.userMenu()) == null ? null : tmp_2_0.title, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("open", ctx_r1.menuOpen())("openRotate", 180);
+} }
+function SdSidebarUserControl_Conditional_3_For_3_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-list-item", 6);
+    i0.ɵɵlistener("click", function SdSidebarUserControl_Conditional_3_For_3_Template_sd_list_item_click_0_listener() { const menu_r4 = i0.ɵɵrestoreView(_r3).$implicit; return i0.ɵɵresetView(menu_r4.onClick()); });
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const menu_r4 = ctx.$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", menu_r4.title, " ");
+} }
+function SdSidebarUserControl_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "sd-collapse", 2)(1, "sd-list", 5);
+    i0.ɵɵrepeaterCreate(2, SdSidebarUserControl_Conditional_3_For_3_Template, 2, 1, "sd-list-item", null, _forTrack0);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    let tmp_3_0;
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("open", ctx_r1.menuOpen());
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("inset", true);
+    i0.ɵɵadvance();
+    i0.ɵɵrepeater((tmp_3_0 = ctx_r1.userMenu()) == null ? null : tmp_3_0.menus);
+} }
+export class SdSidebarUserControl {
+    userMenu = input(...(ngDevMode ? [undefined, { debugName: "userMenu" }] : /* istanbul ignore next */ []));
+    menuOpen = signal(false, ...(ngDevMode ? [{ debugName: "menuOpen" }] : /* istanbul ignore next */ []));
+    onMenuOpenButtonClick() {
+        this.menuOpen.update((v) => !v);
+    }
+    static ɵfac = function SdSidebarUserControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdSidebarUserControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdSidebarUserControl, selectors: [["sd-sidebar-user"]], inputs: { userMenu: [1, "userMenu"] }, ngContentSelectors: _c0, decls: 4, vars: 2, consts: [[1, "p-lg"], ["tabindex", "0", 1, "_menu-button", 3, "sd-ripple"], [3, "open"], ["tabindex", "0", 1, "_menu-button", 3, "click", "keydown.enter", "sd-ripple"], [2, "float", "right", 3, "open", "openRotate"], [3, "inset"], [3, "click"]], template: function SdSidebarUserControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵelementStart(0, "div", 0);
+            i0.ɵɵprojection(1);
+            i0.ɵɵelementEnd();
+            i0.ɵɵconditionalCreate(2, SdSidebarUserControl_Conditional_2_Template, 3, 4, "div", 1);
+            i0.ɵɵconditionalCreate(3, SdSidebarUserControl_Conditional_3_Template, 4, 2, "sd-collapse", 2);
+        } if (rf & 2) {
+            let tmp_0_0;
+            let tmp_1_0;
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(((tmp_0_0 = ctx.userMenu()) == null ? null : tmp_0_0.title) ? 2 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(((tmp_1_0 = ctx.userMenu()) == null ? null : tmp_1_0.title) ? 3 : -1);
+        } }, dependencies: [SdCollapseIconControl,
+            SdCollapseControl,
+            SdRippleDirective,
+            SdListControl,
+            SdListItemControl], styles: ["sd-sidebar-user {\n  display: block;\n}\nsd-sidebar-user > ._menu-button {\n  display: block;\n  cursor: pointer;\n  user-select: none;\n  padding: var(--gap-default);\n}\nsd-sidebar-user > ._menu-button:hover {\n  background: var(--trans-lighter);\n}\nsd-sidebar-user > sd-collapse > ._content > sd-list {\n  background: var(--trans-lightest);\n  padding: var(--gap-xs) 0;\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSidebarUserControl, [{
+        type: Component,
+        args: [{ selector: "sd-sidebar-user", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [
+                    SdCollapseIconControl,
+                    SdCollapseControl,
+                    SdRippleDirective,
+                    SdListControl,
+                    SdListItemControl,
+                ], template: `
+    <div class="p-lg">
+      <ng-content />
+    </div>
+    @if (userMenu()?.title) {
+      <div class="_menu-button" tabindex="0" (click)="onMenuOpenButtonClick()" (keydown.enter)="onMenuOpenButtonClick()" [sd-ripple]="true">
+        {{ userMenu()?.title }}
+        <sd-collapse-icon [open]="menuOpen()" style="float: right;" [openRotate]="180" />
+      </div>
+    }
+
+    @if (userMenu()?.title) {
+      <sd-collapse [open]="menuOpen()">
+        <sd-list [inset]="true">
+          @for (menu of userMenu()?.menus; track menu.title) {
+            <sd-list-item (click)="menu.onClick()">
+              {{ menu.title }}
+            </sd-list-item>
+          }
+        </sd-list>
+      </sd-collapse>
+    }
+  `, styles: ["sd-sidebar-user {\n  display: block;\n}\nsd-sidebar-user > ._menu-button {\n  display: block;\n  cursor: pointer;\n  user-select: none;\n  padding: var(--gap-default);\n}\nsd-sidebar-user > ._menu-button:hover {\n  background: var(--trans-lighter);\n}\nsd-sidebar-user > sd-collapse > ._content > sd-list {\n  background: var(--trans-lightest);\n  padding: var(--gap-xs) 0;\n}"] }]
+    }], null, { userMenu: [{ type: i0.Input, args: [{ isSignal: true, alias: "userMenu", required: false }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSidebarUserControl, { className: "SdSidebarUserControl", filePath: "packages/angular/src/ui/navigation/sidebar/sd-sidebar-user.control.ts", lineNumber: 68 }); })();

package/dist/ui/navigation/sidebar/sd-sidebar.control.d.ts

@@ -0,0 +1,8 @@
+import * as i0 from "@angular/core";
+export declare class SdSidebarControl {
+    private readonly _parentControl;
+    toggle: import("@angular/core").Signal<boolean>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdSidebarControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdSidebarControl, "sd-sidebar", never, {}, {}, never, ["*"], true, never>;
+}
+//# sourceMappingURL=sd-sidebar.control.d.ts.map

package/dist/ui/navigation/sidebar/sd-sidebar.control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-sidebar.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\navigation\\sidebar\\sd-sidebar.control.ts"],"names":[],"mappings":";AAUA,qBAkDa,gBAAgB;IAC3B,OAAO,CAAC,QAAQ,CAAC,cAAc,CAE7B;IAEF,MAAM,0CAAgD;yCAL3C,gBAAgB;2CAAhB,gBAAgB;CAM5B"}

package/dist/ui/navigation/sidebar/sd-sidebar.control.js

@@ -0,0 +1,24 @@
+import { ChangeDetectionStrategy, Component, computed, forwardRef, inject, ViewEncapsulation, } from "@angular/core";
+import { SdSidebarContainerControl } from "./sd-sidebar-container.control";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+export class SdSidebarControl {
+    _parentControl = inject(forwardRef(() => SdSidebarContainerControl));
+    toggle = computed(() => this._parentControl.toggle(), ...(ngDevMode ? [{ debugName: "toggle" }] : /* istanbul ignore next */ []));
+    static ɵfac = function SdSidebarControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdSidebarControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdSidebarControl, selectors: [["sd-sidebar"]], hostVars: 1, hostBindings: function SdSidebarControl_HostBindings(rf, ctx) { if (rf & 2) {
+            i0.ɵɵattribute("data-sd-toggle", ctx.toggle());
+        } }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdSidebarControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        } }, styles: ["sd-sidebar {\n  position: absolute;\n  z-index: var(--z-index-sidebar);\n  top: 0;\n  left: 0;\n  width: var(--sidebar-width);\n  height: 100%;\n  background: var(--control-color);\n  border-right: 1px solid var(--border-color-lighter);\n}\n@media not all and (max-width: 520px) {\n  sd-sidebar {\n    transition: transform 0.1s ease-out;\n  }\n  sd-sidebar[data-sd-toggle=true] {\n    transform: translateX(-100%);\n    transition: transform 0.1s ease-in;\n  }\n}\n@media all and (max-width: 520px) {\n  sd-sidebar {\n    transition: transform 0.3s ease-in;\n    transform: translateX(-100%);\n  }\n  sd-sidebar[data-sd-toggle=true] {\n    transform: none;\n    transition: transform 0.3s ease-out;\n    box-shadow: 0 calc(16 * var(--elevation-size)) calc(16 * 4 * var(--elevation-size)) var(--trans-lighter), 0 var(--elevation-size) var(--elevation-size) var(--trans-lighter);\n  }\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSidebarControl, [{
+        type: Component,
+        args: [{ selector: "sd-sidebar", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [], host: {
+                    "[attr.data-sd-toggle]": "toggle()",
+                }, template: `
+    <ng-content />
+  `, styles: ["sd-sidebar {\n  position: absolute;\n  z-index: var(--z-index-sidebar);\n  top: 0;\n  left: 0;\n  width: var(--sidebar-width);\n  height: 100%;\n  background: var(--control-color);\n  border-right: 1px solid var(--border-color-lighter);\n}\n@media not all and (max-width: 520px) {\n  sd-sidebar {\n    transition: transform 0.1s ease-out;\n  }\n  sd-sidebar[data-sd-toggle=true] {\n    transform: translateX(-100%);\n    transition: transform 0.1s ease-in;\n  }\n}\n@media all and (max-width: 520px) {\n  sd-sidebar {\n    transition: transform 0.3s ease-in;\n    transform: translateX(-100%);\n  }\n  sd-sidebar[data-sd-toggle=true] {\n    transform: none;\n    transition: transform 0.3s ease-out;\n    box-shadow: 0 calc(16 * var(--elevation-size)) calc(16 * 4 * var(--elevation-size)) var(--trans-lighter), 0 var(--elevation-size) var(--elevation-size) var(--trans-lighter);\n  }\n}"] }]
+    }], null, null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSidebarControl, { className: "SdSidebarControl", filePath: "packages/angular/src/ui/navigation/sidebar/sd-sidebar.control.ts", lineNumber: 61 }); })();

package/dist/ui/navigation/tab/sd-tab-item.control.d.ts

@@ -0,0 +1,10 @@
+import * as i0 from "@angular/core";
+export declare class SdTabItemControl {
+    private readonly _parentControl;
+    value: import("@angular/core").InputSignal<any>;
+    isSelected: import("@angular/core").Signal<boolean>;
+    onClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTabItemControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdTabItemControl, "sd-tab-item", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+//# sourceMappingURL=sd-tab-item.control.d.ts.map

package/dist/ui/navigation/tab/sd-tab-item.control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-tab-item.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\navigation\\tab\\sd-tab-item.control.ts"],"names":[],"mappings":";AAWA,qBAiCa,gBAAgB;IAC3B,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAwD;IAEvF,KAAK,2CAAgB;IAErB,UAAU,0CAAgE;IAE1E,OAAO;yCAPI,gBAAgB;2CAAhB,gBAAgB;CAU5B"}

package/dist/ui/navigation/tab/sd-tab-item.control.js

@@ -0,0 +1,31 @@
+import { ChangeDetectionStrategy, Component, computed, forwardRef, inject, input, ViewEncapsulation, } from "@angular/core";
+import { SdTabControl } from "./sd-tab.control";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+export class SdTabItemControl {
+    _parentControl = inject(forwardRef(() => SdTabControl));
+    value = input(...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
+    isSelected = computed(() => this._parentControl.value() === this.value(), ...(ngDevMode ? [{ debugName: "isSelected" }] : /* istanbul ignore next */ []));
+    onClick() {
+        this._parentControl.value.set(this.value());
+    }
+    static ɵfac = function SdTabItemControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdTabItemControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdTabItemControl, selectors: [["sd-tab-item"]], hostVars: 1, hostBindings: function SdTabItemControl_HostBindings(rf, ctx) { if (rf & 1) {
+            i0.ɵɵlistener("click", function SdTabItemControl_click_HostBindingHandler() { return ctx.onClick(); });
+        } if (rf & 2) {
+            i0.ɵɵattribute("data-sd-selected", ctx.isSelected());
+        } }, inputs: { value: [1, "value"] }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdTabItemControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        } }, styles: ["sd-tab-item {\n  display: inline-block;\n  padding: var(--gap-sm) var(--gap-default);\n  cursor: pointer;\n  margin-bottom: -2px;\n  border-bottom: 2px solid transparent !important;\n  font-weight: bold;\n  color: var(--theme-gray-default);\n}\nsd-tab-item[data-sd-selected=true] {\n  border-bottom: 3px solid var(--theme-primary-default) !important;\n  color: var(--theme-primary-default);\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTabItemControl, [{
+        type: Component,
+        args: [{ selector: "sd-tab-item", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [], host: {
+                    "[attr.data-sd-selected]": "isSelected()",
+                    "(click)": "onClick()",
+                }, template: `
+    <ng-content></ng-content>
+  `, styles: ["sd-tab-item {\n  display: inline-block;\n  padding: var(--gap-sm) var(--gap-default);\n  cursor: pointer;\n  margin-bottom: -2px;\n  border-bottom: 2px solid transparent !important;\n  font-weight: bold;\n  color: var(--theme-gray-default);\n}\nsd-tab-item[data-sd-selected=true] {\n  border-bottom: 3px solid var(--theme-primary-default) !important;\n  color: var(--theme-primary-default);\n}"] }]
+    }], null, { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdTabItemControl, { className: "SdTabItemControl", filePath: "packages/angular/src/ui/navigation/tab/sd-tab-item.control.ts", lineNumber: 45 }); })();