@simplysm/angular 14.0.1 → 14.0.5

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

@@ -0,0 +1,7 @@
+import * as i0 from "@angular/core";
+export declare class SdTabControl {
+    value: import("@angular/core").ModelSignal<any>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTabControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdTabControl, "sd-tab", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, ["*"], true, never>;
+}
+//# sourceMappingURL=sd-tab.control.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"sd-tab.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\navigation\\tab\\sd-tab.control.ts"],"names":[],"mappings":";AAEA,qBAoBa,YAAY;IACvB,KAAK,2CAAgB;yCADV,YAAY;2CAAZ,YAAY;CAExB"}

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

@@ -0,0 +1,18 @@
+import { ChangeDetectionStrategy, Component, model, ViewEncapsulation } from "@angular/core";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+export class SdTabControl {
+    value = model(...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
+    static ɵfac = function SdTabControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdTabControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdTabControl, selectors: [["sd-tab"]], inputs: { value: [1, "value"] }, outputs: { value: "valueChange" }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdTabControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        } }, styles: ["sd-tab {\n  display: block;\n  border-bottom: 2px solid var(--theme-gray-lighter);\n  padding: 0 calc(var(--gap-default) + 1px) 0 calc(var(--gap-default) - 1px);\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTabControl, [{
+        type: Component,
+        args: [{ selector: "sd-tab", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [], template: `
+    <ng-content></ng-content>
+  `, styles: ["sd-tab {\n  display: block;\n  border-bottom: 2px solid var(--theme-gray-lighter);\n  padding: 0 calc(var(--gap-default) + 1px) 0 calc(var(--gap-default) - 1px);\n}"] }]
+    }], null, { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdTabControl, { className: "SdTabControl", filePath: "packages/angular/src/ui/navigation/tab/sd-tab.control.ts", lineNumber: 23 }); })();

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"sd-tabview-item.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\navigation\\tab\\sd-tabview-item.control.ts"],"names":[],"mappings":";AAWA,qBA2Ba,oBAAoB,CAAC,CAAC;IACjC,KAAK,yCAAuB;IAC5B,MAAM,0DAAmB;IAEzB,OAAO,CAAC,QAAQ,CAAC,cAAc,CAE7B;IAEF,UAAU,0CAAgE;yCAR/D,oBAAoB;2CAApB,oBAAoB;CAShC"}

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

@@ -0,0 +1,26 @@
+import { ChangeDetectionStrategy, Component, computed, forwardRef, inject, input, ViewEncapsulation, } from "@angular/core";
+import { SdTabviewControl } from "./sd-tabview.control";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+export class SdTabviewItemControl {
+    value = input.required(...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
+    header = input(...(ngDevMode ? [undefined, { debugName: "header" }] : /* istanbul ignore next */ []));
+    _parentControl = inject(forwardRef(() => SdTabviewControl));
+    isSelected = computed(() => this._parentControl.value() === this.value(), ...(ngDevMode ? [{ debugName: "isSelected" }] : /* istanbul ignore next */ []));
+    static ɵfac = function SdTabviewItemControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdTabviewItemControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdTabviewItemControl, selectors: [["sd-tabview-item"]], hostVars: 1, hostBindings: function SdTabviewItemControl_HostBindings(rf, ctx) { if (rf & 2) {
+            i0.ɵɵattribute("data-sd-selected", ctx.isSelected());
+        } }, inputs: { value: [1, "value"], header: [1, "header"] }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdTabviewItemControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        } }, styles: ["sd-tabview-item {\n  display: none;\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n}\nsd-tabview-item[data-sd-selected=true] {\n  display: block;\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTabviewItemControl, [{
+        type: Component,
+        args: [{ selector: "sd-tabview-item", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [], template: `
+    <ng-content></ng-content>
+  `, host: {
+                    "[attr.data-sd-selected]": "isSelected()",
+                }, styles: ["sd-tabview-item {\n  display: none;\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n}\nsd-tabview-item[data-sd-selected=true] {\n  display: block;\n}"] }]
+    }], null, { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], header: [{ type: i0.Input, args: [{ isSignal: true, alias: "header", required: false }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdTabviewItemControl, { className: "SdTabviewItemControl", filePath: "packages/angular/src/ui/navigation/tab/sd-tabview-item.control.ts", lineNumber: 39 }); })();

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

@@ -0,0 +1,9 @@
+import { SdTabviewItemControl } from "./sd-tabview-item.control";
+import * as i0 from "@angular/core";
+export declare class SdTabviewControl<T> {
+    value: import("@angular/core").ModelSignal<T | undefined>;
+    itemControls: import("@angular/core").Signal<readonly SdTabviewItemControl<T>[]>;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTabviewControl<any>, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdTabviewControl<any>, "sd-tabview", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, ["itemControls"], ["*"], true, never>;
+}
+//# sourceMappingURL=sd-tabview.control.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"sd-tabview.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\navigation\\tab\\sd-tabview.control.ts"],"names":[],"mappings":"AASA,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;;AAEjE,qBAuBa,gBAAgB,CAAC,CAAC;IAC7B,KAAK,qDAAc;IAEnB,YAAY,qEAAkE;yCAHnE,gBAAgB;2CAAhB,gBAAgB;CAI5B"}

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

@@ -0,0 +1,67 @@
+import { ChangeDetectionStrategy, Component, contentChildren, model, ViewEncapsulation, } from "@angular/core";
+import { SdTabItemControl } from "./sd-tab-item.control";
+import { SdTabControl } from "./sd-tab.control";
+import { SdTabviewItemControl } from "./sd-tabview-item.control";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+const _forTrack0 = ($index, $item) => $item.value();
+function SdTabviewControl_For_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "sd-tab-item", 1);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const itemControl_r1 = ctx.$implicit;
+    i0.ɵɵproperty("value", itemControl_r1.value());
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", itemControl_r1.header() || itemControl_r1.value(), " ");
+} }
+export class SdTabviewControl {
+    value = model(...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
+    itemControls = contentChildren(SdTabviewItemControl, ...(ngDevMode ? [{ debugName: "itemControls" }] : /* istanbul ignore next */ []));
+    static ɵfac = function SdTabviewControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdTabviewControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdTabviewControl, selectors: [["sd-tabview"]], contentQueries: function SdTabviewControl_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
+            i0.ɵɵcontentQuerySignal(dirIndex, ctx.itemControls, SdTabviewItemControl, 4);
+        } if (rf & 2) {
+            i0.ɵɵqueryAdvance();
+        } }, hostAttrs: [1, "flex-column", "fill"], inputs: { value: [1, "value"] }, outputs: { value: "valueChange" }, ngContentSelectors: _c0, decls: 5, vars: 1, consts: [[3, "valueChange", "value"], [3, "value"], [1, "flex-fill"]], template: function SdTabviewControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵelementStart(0, "sd-tab", 0);
+            i0.ɵɵtwoWayListener("valueChange", function SdTabviewControl_Template_sd_tab_valueChange_0_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.value, $event) || (ctx.value = $event); return $event; });
+            i0.ɵɵrepeaterCreate(1, SdTabviewControl_For_2_Template, 2, 2, "sd-tab-item", 1, _forTrack0);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(3, "div", 2);
+            i0.ɵɵprojection(4);
+            i0.ɵɵelementEnd();
+        } if (rf & 2) {
+            i0.ɵɵtwoWayProperty("value", ctx.value);
+            i0.ɵɵadvance();
+            i0.ɵɵrepeater(ctx.itemControls());
+        } }, dependencies: [SdTabControl, SdTabItemControl], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTabviewControl, [{
+        type: Component,
+        args: [{
+                selector: "sd-tabview",
+                changeDetection: ChangeDetectionStrategy.OnPush,
+                encapsulation: ViewEncapsulation.None,
+                standalone: true,
+                imports: [SdTabControl, SdTabItemControl],
+                host: {
+                    class: "flex-column fill",
+                },
+                template: `
+    <sd-tab [(value)]="value">
+      @for (itemControl of itemControls(); track itemControl.value()) {
+        <sd-tab-item [value]="itemControl.value()">
+          {{ itemControl.header() || itemControl.value() }}
+        </sd-tab-item>
+      }
+    </sd-tab>
+
+    <div class="flex-fill">
+      <ng-content />
+    </div>
+  `,
+            }]
+    }], null, { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], itemControls: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SdTabviewItemControl), { isSignal: true }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdTabviewControl, { className: "SdTabviewControl", filePath: "packages/angular/src/ui/navigation/tab/sd-tabview.control.ts", lineNumber: 35 }); })();

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

@@ -0,0 +1,6 @@
+import * as i0 from "@angular/core";
+export declare class SdTopbarContainerControl {
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTopbarContainerControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdTopbarContainerControl, "sd-topbar-container", never, {}, {}, never, ["*"], true, never>;
+}
+//# sourceMappingURL=sd-topbar-container.control.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"sd-topbar-container.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\navigation\\topbar\\sd-topbar-container.control.ts"],"names":[],"mappings":";AAEA,qBAmBa,wBAAwB;yCAAxB,wBAAwB;2CAAxB,wBAAwB;CAAG"}

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

@@ -0,0 +1,17 @@
+import { ChangeDetectionStrategy, Component, ViewEncapsulation } from "@angular/core";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+export class SdTopbarContainerControl {
+    static ɵfac = function SdTopbarContainerControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdTopbarContainerControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdTopbarContainerControl, selectors: [["sd-topbar-container"]], ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdTopbarContainerControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵprojection(0);
+        } }, styles: ["sd-topbar-container {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTopbarContainerControl, [{
+        type: Component,
+        args: [{ selector: "sd-topbar-container", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [], template: `
+    <ng-content />
+  `, styles: ["sd-topbar-container {\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n}"] }]
+    }], null, null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdTopbarContainerControl, { className: "SdTopbarContainerControl", filePath: "packages/angular/src/ui/navigation/topbar/sd-topbar-container.control.ts", lineNumber: 22 }); })();

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

@@ -0,0 +1,29 @@
+import * as i0 from "@angular/core";
+export declare class SdTopbarMenuControl {
+    menus: import("@angular/core").InputSignal<ISdTopbarMenu[]>;
+    getMenuIsSelectedFn: import("@angular/core").InputSignal<((menu: ISdTopbarMenu) => boolean) | undefined>;
+    fullPageCode: import("@angular/core").Signal<string>;
+    private readonly _dropdowns;
+    getMenuRouterLinkOption(menu: ISdTopbarMenu): {
+        link: string;
+        queryParams: Record<string, string> | undefined;
+    } | undefined;
+    getIsMenuSelected(menu: ISdTopbarMenu): boolean;
+    onMenuClick(menu: ISdTopbarMenu, dropdownIndex: number): void;
+    protected readonly itemTemplateType: {
+        menus: ISdTopbarMenu[];
+        depth: number;
+        dropdownIndex: number;
+    };
+    protected readonly tablerCaretDown = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"stroke-width:var(--ng-icon__stroke-width, 2)\"><path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"></path><path d=\"M6 10l6 6l6 -6h-12\"></path></svg>";
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTopbarMenuControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdTopbarMenuControl, "sd-topbar-menu", never, { "menus": { "alias": "menus"; "required": false; "isSignal": true; }; "getMenuIsSelectedFn": { "alias": "getMenuIsSelectedFn"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+export interface ISdTopbarMenu {
+    title: string;
+    codeChain: string[];
+    url?: string;
+    icon?: string;
+    children?: ISdTopbarMenu[];
+}
+//# sourceMappingURL=sd-topbar-menu.control.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"sd-topbar-menu.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\navigation\\topbar\\sd-topbar-menu.control.ts"],"names":[],"mappings":";AAuBA,qBAkGa,mBAAmB;IAC9B,KAAK,uDAA8B;IACnC,mBAAmB,8CAAgB,aAAa,KAAK,OAAO,eAAI;IAEhE,YAAY,yCAA2B;IAEvC,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAmC;IAE9D,uBAAuB,CACrB,IAAI,EAAE,aAAa,GAClB;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,aAAa,GAAG,OAAO;IAI/C,WAAW,CAAC,IAAI,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,GAAG,IAAI;IAU7D,SAAS,CAAC,QAAQ,CAAC,gBAAgB,EAAG;QACpC,KAAK,EAAE,aAAa,EAAE,CAAC;QACvB,KAAK,EAAE,MAAM,CAAC;QACd,aAAa,EAAE,MAAM,CAAC;KACvB,CAAC;IAEF,SAAS,CAAC,QAAQ,CAAC,eAAe,iUAAmB;yCAlC1C,mBAAmB;2CAAnB,mBAAmB;CAmC/B;AAED,MAAM,WAAW,aAAa;IAC5B,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,aAAa,EAAE,CAAC;CAC5B"}

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

@@ -0,0 +1,245 @@
+import { ChangeDetectionStrategy, Component, input, viewChildren, 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 { SdDropdownControl } from "../../overlay/dropdown/sd-dropdown.control";
+import { SdDropdownPopupControl } from "../../overlay/dropdown/sd-dropdown-popup.control";
+import { SdListControl } from "../../data/list/sd-list.control";
+import { SdListItemControl } from "../../data/list/sd-list-item.control";
+import { SdButtonControl } from "../../form/button/sd-button.control";
+import { NgIcon } from "@ng-icons/core";
+import { tablerCaretDown } from "@ng-icons/tabler-icons";
+import * as i0 from "@angular/core";
+const _c0 = (a0, a1) => ({ menus: a0, depth: 0, dropdownIndex: a1 });
+const _c1 = a0 => [a0];
+const _c2 = (a0, a1, a2) => ({ menus: a0, depth: a1, dropdownIndex: a2 });
+const _forTrack0 = ($index, $item) => $item.codeChain.join(".");
+function SdTopbarMenuControl_For_1_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ng-icon", 3);
+} if (rf & 2) {
+    const menu_r1 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("svg", menu_r1.icon);
+} }
+function SdTopbarMenuControl_For_1_Conditional_7_ng_template_0_Template(rf, ctx) { }
+function SdTopbarMenuControl_For_1_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, SdTopbarMenuControl_For_1_Conditional_7_ng_template_0_Template, 0, 0, "ng-template", 5);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    const menu_r1 = ctx_r1.$implicit;
+    const ɵ$index_1_r3 = ctx_r1.$index;
+    i0.ɵɵnextContext();
+    const itemTpl_r4 = i0.ɵɵreference(3);
+    i0.ɵɵproperty("ngTemplateOutlet", itemTpl_r4)("ngTemplateOutletContext", i0.ɵɵpureFunction2(2, _c0, menu_r1.children, ɵ$index_1_r3));
+} }
+function SdTopbarMenuControl_For_1_Conditional_8_ng_template_0_Template(rf, ctx) { }
+function SdTopbarMenuControl_For_1_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, SdTopbarMenuControl_For_1_Conditional_8_ng_template_0_Template, 0, 0, "ng-template", 5);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    const menu_r1 = ctx_r1.$implicit;
+    const ɵ$index_1_r3 = ctx_r1.$index;
+    i0.ɵɵnextContext();
+    const itemTpl_r4 = i0.ɵɵreference(3);
+    i0.ɵɵproperty("ngTemplateOutlet", itemTpl_r4)("ngTemplateOutletContext", i0.ɵɵpureFunction2(4, _c0, i0.ɵɵpureFunction1(2, _c1, menu_r1), ɵ$index_1_r3));
+} }
+function SdTopbarMenuControl_For_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "sd-dropdown")(1, "sd-button", 2);
+    i0.ɵɵconditionalCreate(2, SdTopbarMenuControl_For_1_Conditional_2_Template, 1, 1, "ng-icon", 3);
+    i0.ɵɵtext(3);
+    i0.ɵɵelement(4, "ng-icon", 3);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "sd-dropdown-popup")(6, "sd-list", 4);
+    i0.ɵɵconditionalCreate(7, SdTopbarMenuControl_For_1_Conditional_7_Template, 1, 5, null, 5)(8, SdTopbarMenuControl_For_1_Conditional_8_Template, 1, 7, null, 5);
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const menu_r1 = ctx.$implicit;
+    const ctx_r4 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("theme", "link-gray");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(menu_r1.icon ? 2 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", menu_r1.title, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("svg", ctx_r4.tablerCaretDown);
+    i0.ɵɵadvance(2);
+    i0.ɵɵproperty("inset", true);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(menu_r1.children ? 7 : 8);
+} }
+function SdTopbarMenuControl_ng_template_2_For_1_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelement(0, "ng-icon", 3);
+    i0.ɵɵtext(1, " \u00A0 ");
+} if (rf & 2) {
+    const menu_r7 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵproperty("svg", menu_r7.icon);
+} }
+function SdTopbarMenuControl_ng_template_2_For_1_Conditional_3_ng_template_1_Template(rf, ctx) { }
+function SdTopbarMenuControl_ng_template_2_For_1_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "sd-list", 4);
+    i0.ɵɵtemplate(1, SdTopbarMenuControl_ng_template_2_For_1_Conditional_3_ng_template_1_Template, 0, 0, "ng-template", 5);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const menu_r7 = i0.ɵɵnextContext().$implicit;
+    const ctx_r8 = i0.ɵɵnextContext();
+    const depth_r10 = ctx_r8.depth;
+    const dropdownIndex_r8 = ctx_r8.dropdownIndex;
+    i0.ɵɵnextContext();
+    const itemTpl_r4 = i0.ɵɵreference(3);
+    i0.ɵɵproperty("inset", true);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("ngTemplateOutlet", itemTpl_r4)("ngTemplateOutletContext", i0.ɵɵpureFunction3(3, _c2, menu_r7.children, depth_r10 + 1, dropdownIndex_r8));
+} }
+function SdTopbarMenuControl_ng_template_2_For_1_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-list-item", 7);
+    i0.ɵɵlistener("click", function SdTopbarMenuControl_ng_template_2_For_1_Template_sd_list_item_click_0_listener() { const menu_r7 = i0.ɵɵrestoreView(_r6).$implicit; const dropdownIndex_r8 = i0.ɵɵnextContext().dropdownIndex; const ctx_r4 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r4.onMenuClick(menu_r7, dropdownIndex_r8)); });
+    i0.ɵɵconditionalCreate(1, SdTopbarMenuControl_ng_template_2_For_1_Conditional_1_Template, 2, 1);
+    i0.ɵɵtext(2);
+    i0.ɵɵconditionalCreate(3, SdTopbarMenuControl_ng_template_2_For_1_Conditional_3_Template, 2, 7, "sd-list", 4);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const menu_r7 = ctx.$implicit;
+    const depth_r10 = i0.ɵɵnextContext().depth;
+    const ctx_r4 = i0.ɵɵnextContext();
+    i0.ɵɵstyleProp("padding-left", depth_r10 > 0 ? (depth_r10 + 1) * 0.5 : undefined, "em")("padding-block", depth_r10 === 0 ? "var(--gap-default)" : undefined);
+    i0.ɵɵproperty("sd-router-link", ctx_r4.getMenuRouterLinkOption(menu_r7))("selected", ctx_r4.getIsMenuSelected(menu_r7))("open", true);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(menu_r7.icon ? 1 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", menu_r7.title, " ");
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(menu_r7.children ? 3 : -1);
+} }
+function SdTopbarMenuControl_ng_template_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵrepeaterCreate(0, SdTopbarMenuControl_ng_template_2_For_1_Template, 4, 10, "sd-list-item", 6, _forTrack0);
+} if (rf & 2) {
+    const currMenus_r11 = ctx.menus;
+    i0.ɵɵrepeater(currMenus_r11);
+} }
+export class SdTopbarMenuControl {
+    menus = input([], ...(ngDevMode ? [{ debugName: "menus" }] : /* istanbul ignore next */ []));
+    getMenuIsSelectedFn = input(...(ngDevMode ? [undefined, { debugName: "getMenuIsSelectedFn" }] : /* istanbul ignore next */ []));
+    fullPageCode = useFullPageCodeSignal();
+    _dropdowns = viewChildren(SdDropdownControl, ...(ngDevMode ? [{ debugName: "_dropdowns" }] : /* istanbul ignore next */ []));
+    getMenuRouterLinkOption(menu) {
+        return menuRouterLinkOption(menu);
+    }
+    getIsMenuSelected(menu) {
+        return menuIsSelected(menu, this.fullPageCode(), this.getMenuIsSelectedFn());
+    }
+    onMenuClick(menu, dropdownIndex) {
+        if (menu.url != null) {
+            window.open(menu.url, "_blank");
+        }
+        if (menu.children === undefined) {
+            this._dropdowns()[dropdownIndex].open.set(false);
+        }
+    }
+    itemTemplateType;
+    tablerCaretDown = tablerCaretDown;
+    static ɵfac = function SdTopbarMenuControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdTopbarMenuControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdTopbarMenuControl, selectors: [["sd-topbar-menu"]], viewQuery: function SdTopbarMenuControl_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuerySignal(ctx._dropdowns, SdDropdownControl, 5);
+        } if (rf & 2) {
+            i0.ɵɵqueryAdvance();
+        } }, hostAttrs: [1, "flex-row", "gap-sm"], inputs: { menus: [1, "menus"], getMenuIsSelectedFn: [1, "getMenuIsSelectedFn"] }, decls: 4, vars: 1, consts: [["itemTpl", ""], [3, "typed"], [3, "theme"], [3, "svg"], [3, "inset"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], [3, "padding-left", "padding-block", "sd-router-link", "selected", "open"], [3, "click", "sd-router-link", "selected", "open"]], template: function SdTopbarMenuControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵrepeaterCreate(0, SdTopbarMenuControl_For_1_Template, 9, 6, "sd-dropdown", null, _forTrack0);
+            i0.ɵɵtemplate(2, SdTopbarMenuControl_ng_template_2_Template, 2, 0, "ng-template", 1, 0, i0.ɵɵtemplateRefExtractor);
+        } if (rf & 2) {
+            i0.ɵɵrepeater(ctx.menus());
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("typed", ctx.itemTemplateType);
+        } }, dependencies: [NgTemplateOutlet,
+            SdTypedTemplateDirective,
+            SdRouterLinkDirective,
+            SdDropdownControl,
+            SdDropdownPopupControl,
+            SdListControl,
+            SdListItemControl,
+            SdButtonControl,
+            NgIcon], styles: ["sd-topbar-menu sd-dropdown-popup sd-list[data-sd-inset=true] sd-list {\n  background: var(--trans-lightest);\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTopbarMenuControl, [{
+        type: Component,
+        args: [{ selector: "sd-topbar-menu", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [
+                    NgTemplateOutlet,
+                    SdTypedTemplateDirective,
+                    SdRouterLinkDirective,
+                    SdDropdownControl,
+                    SdDropdownPopupControl,
+                    SdListControl,
+                    SdListItemControl,
+                    SdButtonControl,
+                    NgIcon,
+                ], host: {
+                    "class": "flex-row gap-sm",
+                }, template: `
+    @for (menu of menus(); track menu.codeChain.join("."); let i = $index) {
+      <sd-dropdown>
+        <sd-button [theme]="'link-gray'">
+          @if (menu.icon) {
+            <ng-icon [svg]="menu.icon" />
+          }
+          {{ menu.title }}
+          <ng-icon [svg]="tablerCaretDown" />
+        </sd-button>
+        <sd-dropdown-popup>
+          <sd-list [inset]="true">
+            @if (menu.children) {
+              <ng-template
+                [ngTemplateOutlet]="itemTpl"
+                [ngTemplateOutletContext]="{ menus: menu.children, depth: 0, dropdownIndex: i }"
+              ></ng-template>
+            } @else {
+              <ng-template
+                [ngTemplateOutlet]="itemTpl"
+                [ngTemplateOutletContext]="{ menus: [menu], depth: 0, dropdownIndex: i }"
+              ></ng-template>
+            }
+          </sd-list>
+        </sd-dropdown-popup>
+      </sd-dropdown>
+    }
+
+    <ng-template
+      #itemTpl
+      [typed]="itemTemplateType"
+      let-currMenus="menus"
+      let-depth="depth"
+      let-dropdownIndex="dropdownIndex"
+    >
+      @for (menu of currMenus; track menu.codeChain.join(".")) {
+        <sd-list-item
+          [style.padding-left.em]="depth > 0 ? (depth + 1) * 0.5 : undefined"
+          [style.padding-block]="depth === 0 ? 'var(--gap-default)' : undefined"
+          [sd-router-link]="getMenuRouterLinkOption(menu)"
+          (click)="onMenuClick(menu, dropdownIndex)"
+          [selected]="getIsMenuSelected(menu)"
+          [open]="true"
+        >
+          @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,
+                  dropdownIndex: dropdownIndex,
+                }"
+              ></ng-template>
+            </sd-list>
+          }
+        </sd-list-item>
+      }
+    </ng-template>
+  `, styles: ["sd-topbar-menu sd-dropdown-popup sd-list[data-sd-inset=true] sd-list {\n  background: var(--trans-lightest);\n}"] }]
+    }], null, { menus: [{ type: i0.Input, args: [{ isSignal: true, alias: "menus", required: false }] }], getMenuIsSelectedFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "getMenuIsSelectedFn", required: false }] }], _dropdowns: [{ type: i0.ViewChildren, args: [i0.forwardRef(() => SdDropdownControl), { isSignal: true }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdTopbarMenuControl, { className: "SdTopbarMenuControl", filePath: "packages/angular/src/ui/navigation/topbar/sd-topbar-menu.control.ts", lineNumber: 122 }); })();

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

@@ -0,0 +1,13 @@
+import * as i0 from "@angular/core";
+export declare class SdTopbarUserControl {
+    menus: import("@angular/core").InputSignal<ISdTopbarUserMenu[]>;
+    private readonly _dropdown;
+    onMenuClick(menu: ISdTopbarUserMenu): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTopbarUserControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdTopbarUserControl, "sd-topbar-user", never, { "menus": { "alias": "menus"; "required": true; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+export interface ISdTopbarUserMenu {
+    title: string;
+    onClick: () => void;
+}
+//# sourceMappingURL=sd-topbar-user.control.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"sd-topbar-user.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\navigation\\topbar\\sd-topbar-user.control.ts"],"names":[],"mappings":";AAaA,qBA8Ba,mBAAmB;IAC9B,KAAK,2DAAyC;IAE9C,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAgC;IAE1D,WAAW,CAAC,IAAI,EAAE,iBAAiB,GAAG,IAAI;yCAL/B,mBAAmB;2CAAnB,mBAAmB;CAS/B;AAED,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB"}

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

@@ -0,0 +1,77 @@
+import { ChangeDetectionStrategy, Component, input, viewChild, ViewEncapsulation, } from "@angular/core";
+import { SdDropdownControl } from "../../overlay/dropdown/sd-dropdown.control";
+import { SdDropdownPopupControl } from "../../overlay/dropdown/sd-dropdown-popup.control";
+import { SdListControl } from "../../data/list/sd-list.control";
+import { SdListItemControl } from "../../data/list/sd-list-item.control";
+import { SdButtonControl } from "../../form/button/sd-button.control";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+const _forTrack0 = ($index, $item) => $item.title;
+function SdTopbarUserControl_For_6_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-list-item", 1);
+    i0.ɵɵlistener("click", function SdTopbarUserControl_For_6_Template_sd_list_item_click_0_listener() { const menu_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.onMenuClick(menu_r2)); });
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const menu_r2 = ctx.$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", menu_r2.title, " ");
+} }
+export class SdTopbarUserControl {
+    menus = input.required(...(ngDevMode ? [{ debugName: "menus" }] : /* istanbul ignore next */ []));
+    _dropdown = viewChild(SdDropdownControl, ...(ngDevMode ? [{ debugName: "_dropdown" }] : /* istanbul ignore next */ []));
+    onMenuClick(menu) {
+        menu.onClick();
+        this._dropdown()?.open.set(false);
+    }
+    static ɵfac = function SdTopbarUserControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdTopbarUserControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdTopbarUserControl, selectors: [["sd-topbar-user"]], viewQuery: function SdTopbarUserControl_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuerySignal(ctx._dropdown, SdDropdownControl, 5);
+        } if (rf & 2) {
+            i0.ɵɵqueryAdvance();
+        } }, inputs: { menus: [1, "menus"] }, ngContentSelectors: _c0, decls: 7, vars: 2, consts: [[3, "inline", "theme"], [3, "click"]], template: function SdTopbarUserControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵelementStart(0, "sd-dropdown")(1, "sd-button", 0);
+            i0.ɵɵprojection(2);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(3, "sd-dropdown-popup")(4, "sd-list");
+            i0.ɵɵrepeaterCreate(5, SdTopbarUserControl_For_6_Template, 2, 1, "sd-list-item", null, _forTrack0);
+            i0.ɵɵelementEnd()()();
+        } if (rf & 2) {
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("inline", true)("theme", "link-gray");
+            i0.ɵɵadvance(4);
+            i0.ɵɵrepeater(ctx.menus());
+        } }, dependencies: [SdDropdownControl,
+            SdDropdownPopupControl,
+            SdListControl,
+            SdListItemControl,
+            SdButtonControl], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTopbarUserControl, [{
+        type: Component,
+        args: [{ selector: "sd-topbar-user", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [
+                    SdDropdownControl,
+                    SdDropdownPopupControl,
+                    SdListControl,
+                    SdListItemControl,
+                    SdButtonControl,
+                ], template: `
+    <sd-dropdown>
+      <sd-button [inline]="true" [theme]="'link-gray'">
+        <ng-content />
+      </sd-button>
+      <sd-dropdown-popup>
+        <sd-list>
+          @for (menu of menus(); track menu.title) {
+            <sd-list-item (click)="onMenuClick(menu)">
+              {{ menu.title }}
+            </sd-list-item>
+          }
+        </sd-list>
+      </sd-dropdown-popup>
+    </sd-dropdown>
+  ` }]
+    }], null, { menus: [{ type: i0.Input, args: [{ isSignal: true, alias: "menus", required: true }] }], _dropdown: [{ type: i0.ViewChild, args: [i0.forwardRef(() => SdDropdownControl), { isSignal: true }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdTopbarUserControl, { className: "SdTopbarUserControl", filePath: "packages/angular/src/ui/navigation/topbar/sd-topbar-user.control.ts", lineNumber: 44 }); })();

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

@@ -0,0 +1,12 @@
+import { SdSidebarContainerControl } from "../sidebar/sd-sidebar-container.control";
+import * as i0 from "@angular/core";
+export declare class SdTopbarControl {
+    private readonly _injectedSidebarContainer;
+    sidebarContainer: import("@angular/core").InputSignal<SdSidebarContainerControl | undefined>;
+    hasSidebar: import("@angular/core").Signal<boolean>;
+    onToggleButtonClick(): void;
+    protected readonly tablerMenu2 = "<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" style=\"stroke-width:var(--ng-icon__stroke-width, 2)\"><path stroke=\"none\" d=\"M0 0h24v24H0z\" fill=\"none\"></path><path d=\"M4 6l16 0\"></path><path d=\"M4 12l16 0\"></path><path d=\"M4 18l16 0\"></path></svg>";
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdTopbarControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdTopbarControl, "sd-topbar", never, { "sidebarContainer": { "alias": "sidebarContainer"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+//# sourceMappingURL=sd-topbar.control.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"sd-topbar.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\navigation\\topbar\\sd-topbar.control.ts"],"names":[],"mappings":"AAQA,OAAO,EAAE,yBAAyB,EAAE,MAAM,yCAAyC,CAAC;;AAKpF,qBA6Da,eAAe;IAC1B,OAAO,CAAC,QAAQ,CAAC,yBAAyB,CAEvC;IAEH,gBAAgB,6EAAsC;IAEtD,UAAU,0CAER;IAEF,mBAAmB,IAAI,IAAI;IAO3B,SAAS,CAAC,QAAQ,CAAC,WAAW,oXAAe;yCAlBlC,eAAe;2CAAf,eAAe;CAmB3B"}