@simplysm/angular 14.0.1 → 14.0.5

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

@@ -0,0 +1,59 @@
+import { ChangeDetectionStrategy, Component, computed, inject, input, ViewEncapsulation, } from "@angular/core";
+import { SdSidebarContainerControl } from "../sidebar/sd-sidebar-container.control";
+import { SdButtonControl } from "../../form/button/sd-button.control";
+import { NgIcon } from "@ng-icons/core";
+import { tablerMenu2 } from "@ng-icons/tabler-icons";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+function SdTopbarControl_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "sd-button", 1);
+    i0.ɵɵlistener("click", function SdTopbarControl_Conditional_0_Template_sd_button_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onToggleButtonClick()); });
+    i0.ɵɵelement(1, "ng-icon", 2);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("theme", "link-primary")("buttonClass", "p-sm-default");
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("svg", ctx_r1.tablerMenu2);
+} }
+export class SdTopbarControl {
+    _injectedSidebarContainer = inject(SdSidebarContainerControl, {
+        optional: true,
+    });
+    sidebarContainer = input(...(ngDevMode ? [undefined, { debugName: "sidebarContainer" }] : /* istanbul ignore next */ []));
+    hasSidebar = computed(() => this.sidebarContainer() != null || this._injectedSidebarContainer != null, ...(ngDevMode ? [{ debugName: "hasSidebar" }] : /* istanbul ignore next */ []));
+    onToggleButtonClick() {
+        const sc = this.sidebarContainer() ?? this._injectedSidebarContainer;
+        if (sc != null) {
+            sc.toggle.update((v) => !v);
+        }
+    }
+    tablerMenu2 = tablerMenu2;
+    static ɵfac = function SdTopbarControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdTopbarControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdTopbarControl, selectors: [["sd-topbar"]], hostAttrs: [1, "flex-row", "gap-default", "cross-align-center", "main-align-start"], inputs: { sidebarContainer: [1, "sidebarContainer"] }, ngContentSelectors: _c0, decls: 2, vars: 1, consts: [[3, "theme", "buttonClass"], [3, "click", "theme", "buttonClass"], [3, "svg"]], template: function SdTopbarControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵconditionalCreate(0, SdTopbarControl_Conditional_0_Template, 2, 3, "sd-button", 0);
+            i0.ɵɵprojection(1);
+        } if (rf & 2) {
+            i0.ɵɵconditional(ctx.hasSidebar() ? 0 : -1);
+        } }, dependencies: [SdButtonControl, NgIcon], styles: ["sd-topbar {\n  min-height: var(--topbar-height);\n  overflow-x: auto;\n  overflow-y: hidden;\n  user-select: none;\n  background: var(--control-color);\n  color: var(--text-trans-default);\n  border-bottom: 1px solid var(--border-color-lighter);\n  padding-left: var(--gap-sm);\n}\nsd-topbar > h1 {\n  padding-right: var(--gap-xl);\n}\nsd-topbar > h2 {\n  padding-right: var(--gap-xl);\n}\nsd-topbar > h3 {\n  padding-right: var(--gap-xl);\n}\nsd-topbar > h4 {\n  padding-right: var(--gap-xl);\n}\nsd-topbar > h5 {\n  padding-right: var(--gap-xl);\n}\nsd-topbar > h6 {\n  padding-right: var(--gap-xl);\n}\nsd-topbar::-webkit-scrollbar-track {\n  background-color: var(--trans-light);\n}\nsd-topbar::-webkit-scrollbar-corner {\n  background-color: var(--trans-light);\n}\nsd-topbar::-webkit-scrollbar {\n  width: var(--gap-sm);\n  height: var(--gap-sm);\n  background-color: transparent;\n}\nsd-topbar::-webkit-scrollbar-thumb {\n  background-color: var(--trans-default);\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTopbarControl, [{
+        type: Component,
+        args: [{ selector: "sd-topbar", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [SdButtonControl, NgIcon], host: {
+                    "class": "flex-row gap-default cross-align-center main-align-start"
+                }, template: `
+    @if (hasSidebar()) {
+      <sd-button
+        [theme]="'link-primary'"
+        [buttonClass]="'p-sm-default'"
+        (click)="onToggleButtonClick()"
+      >
+        <ng-icon [svg]="tablerMenu2" />
+      </sd-button>
+    }
+    <ng-content />
+  `, styles: ["sd-topbar {\n  min-height: var(--topbar-height);\n  overflow-x: auto;\n  overflow-y: hidden;\n  user-select: none;\n  background: var(--control-color);\n  color: var(--text-trans-default);\n  border-bottom: 1px solid var(--border-color-lighter);\n  padding-left: var(--gap-sm);\n}\nsd-topbar > h1 {\n  padding-right: var(--gap-xl);\n}\nsd-topbar > h2 {\n  padding-right: var(--gap-xl);\n}\nsd-topbar > h3 {\n  padding-right: var(--gap-xl);\n}\nsd-topbar > h4 {\n  padding-right: var(--gap-xl);\n}\nsd-topbar > h5 {\n  padding-right: var(--gap-xl);\n}\nsd-topbar > h6 {\n  padding-right: var(--gap-xl);\n}\nsd-topbar::-webkit-scrollbar-track {\n  background-color: var(--trans-light);\n}\nsd-topbar::-webkit-scrollbar-corner {\n  background-color: var(--trans-light);\n}\nsd-topbar::-webkit-scrollbar {\n  width: var(--gap-sm);\n  height: var(--gap-sm);\n  background-color: transparent;\n}\nsd-topbar::-webkit-scrollbar-thumb {\n  background-color: var(--trans-default);\n}"] }]
+    }], null, { sidebarContainer: [{ type: i0.Input, args: [{ isSignal: true, alias: "sidebarContainer", required: false }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdTopbarControl, { className: "SdTopbarControl", filePath: "packages/angular/src/ui/navigation/topbar/sd-topbar.control.ts", lineNumber: 75 }); })();

package/dist/ui/overlay/busy/sd-busy-container.control.d.ts

@@ -0,0 +1,14 @@
+import { type TSdBusyType } from "./sd-busy.provider";
+import * as i0 from "@angular/core";
+export declare class SdBusyContainerControl {
+    private readonly _sdBusy;
+    busy: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    message: import("@angular/core").InputSignal<string | undefined>;
+    type: import("@angular/core").InputSignal<TSdBusyType | undefined>;
+    progressPercent: import("@angular/core").InputSignal<number | undefined>;
+    currType: import("@angular/core").Signal<TSdBusyType>;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdBusyContainerControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdBusyContainerControl, "sd-busy-container", never, { "busy": { "alias": "busy"; "required": false; "isSignal": true; }; "message": { "alias": "message"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "progressPercent": { "alias": "progressPercent"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+//# sourceMappingURL=sd-busy-container.control.d.ts.map

package/dist/ui/overlay/busy/sd-busy-container.control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-busy-container.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\overlay\\busy\\sd-busy-container.control.ts"],"names":[],"mappings":"AAUA,OAAO,EAAkB,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;;AAEtE,qBA+Ma,sBAAsB;IACjC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAA0B;IAElD,IAAI,qEAAiD;IACrD,OAAO,0DAAwC;IAC/C,IAAI,+DAA6C;IACjD,eAAe,0DAAwC;IAEvD,QAAQ,8CAAsD;;yCARnD,sBAAsB;2CAAtB,sBAAsB;CAuBlC"}

package/dist/ui/overlay/busy/sd-busy-container.control.js

@@ -0,0 +1,119 @@
+import { booleanAttribute, ChangeDetectionStrategy, Component, computed, ElementRef, inject, input, ViewEncapsulation, } from "@angular/core";
+import { SdBusyProvider } from "./sd-busy.provider";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+function SdBusyContainerControl_Conditional_0_Case_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElement(0, "div", 3);
+} }
+function SdBusyContainerControl_Conditional_0_Case_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElement(0, "div", 4);
+} }
+function SdBusyContainerControl_Conditional_0_Case_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 5);
+    i0.ɵɵdomElement(1, "div", 8)(2, "div", 9)(3, "div", 10)(4, "div", 11);
+    i0.ɵɵdomElementEnd();
+} }
+function SdBusyContainerControl_Conditional_0_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 6);
+    i0.ɵɵtext(1);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r0.message());
+} }
+function SdBusyContainerControl_Conditional_0_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 7);
+    i0.ɵɵdomElement(1, "div", 12);
+    i0.ɵɵdomElementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
+    i0.ɵɵstyleProp("width", ctx_r0.progressPercent(), "%");
+} }
+function SdBusyContainerControl_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵdomElementStart(0, "div", 0)(1, "div", 1)(2, "div", 2);
+    i0.ɵɵconditionalCreate(3, SdBusyContainerControl_Conditional_0_Case_3_Template, 1, 0, "div", 3)(4, SdBusyContainerControl_Conditional_0_Case_4_Template, 1, 0, "div", 4)(5, SdBusyContainerControl_Conditional_0_Case_5_Template, 5, 0, "div", 5);
+    i0.ɵɵdomElementEnd();
+    i0.ɵɵconditionalCreate(6, SdBusyContainerControl_Conditional_0_Conditional_6_Template, 2, 1, "div", 6);
+    i0.ɵɵconditionalCreate(7, SdBusyContainerControl_Conditional_0_Conditional_7_Template, 2, 2, "div", 7);
+    i0.ɵɵdomElementEnd()();
+} if (rf & 2) {
+    let tmp_1_0;
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional((tmp_1_0 = ctx_r0.currType()) === "spinner" ? 3 : tmp_1_0 === "bar" ? 4 : tmp_1_0 === "cube" ? 5 : -1);
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(ctx_r0.message() !== undefined ? 6 : -1);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r0.progressPercent() !== undefined ? 7 : -1);
+} }
+export class SdBusyContainerControl {
+    _sdBusy = inject(SdBusyProvider);
+    busy = input(false, { ...(ngDevMode ? { debugName: "busy" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
+    message = input(undefined, ...(ngDevMode ? [{ debugName: "message" }] : /* istanbul ignore next */ []));
+    type = input(undefined, ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    progressPercent = input(undefined, ...(ngDevMode ? [{ debugName: "progressPercent" }] : /* istanbul ignore next */ []));
+    currType = computed(() => this.type() ?? this._sdBusy.type(), ...(ngDevMode ? [{ debugName: "currType" }] : /* istanbul ignore next */ []));
+    constructor() {
+        const el = inject(ElementRef).nativeElement;
+        el.addEventListener("keydown", (event) => {
+            if (this.busy()) {
+                event.preventDefault();
+                event.stopPropagation();
+            }
+        }, true);
+    }
+    static ɵfac = function SdBusyContainerControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdBusyContainerControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdBusyContainerControl, selectors: [["sd-busy-container"]], hostVars: 2, hostBindings: function SdBusyContainerControl_HostBindings(rf, ctx) { if (rf & 2) {
+            i0.ɵɵattribute("data-sd-busy", ctx.busy() || undefined)("data-sd-type", ctx.currType());
+        } }, inputs: { busy: [1, "busy"], message: [1, "message"], type: [1, "type"], progressPercent: [1, "progressPercent"] }, ngContentSelectors: _c0, decls: 2, vars: 1, consts: [[1, "_screen"], [1, "_rect"], [1, "_indicator"], [1, "_spinner"], [1, "_bar"], [1, "_cube"], [1, "_message"], [1, "_progress"], [1, "_cube-face", "_cube-face-1"], [1, "_cube-face", "_cube-face-2"], [1, "_cube-face", "_cube-face-3"], [1, "_cube-face", "_cube-face-4"], [1, "_progress-bar"]], template: function SdBusyContainerControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵconditionalCreate(0, SdBusyContainerControl_Conditional_0_Template, 8, 3, "div", 0);
+            i0.ɵɵprojection(1);
+        } if (rf & 2) {
+            i0.ɵɵconditional(ctx.busy() ? 0 : -1);
+        } }, styles: ["sd-busy-container {\n  display: block;\n  position: relative;\n}\nsd-busy-container > ._screen {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: 9998;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--busy-overlay-bg);\n}\nsd-busy-container > ._screen > ._rect {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--gap-default);\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._spinner {\n  width: 2rem;\n  height: 2rem;\n  border: 0.1667rem solid var(--theme-primary-lighter);\n  border-top-color: var(--theme-primary-default);\n  border-radius: 50%;\n  animation: sd-busy-spin 0.8s linear infinite;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._bar {\n  width: 6rem;\n  height: 0.25rem;\n  background: var(--theme-primary-lighter);\n  border-radius: var(--border-radius-default);\n  overflow: hidden;\n  position: relative;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._bar::after {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 40%;\n  background: var(--theme-primary-default);\n  border-radius: var(--border-radius-default);\n  animation: sd-busy-bar 1.5s ease-in-out infinite;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._cube {\n  width: 2rem;\n  height: 2rem;\n  position: relative;\n  animation: sd-busy-cube-rotate 1.8s infinite ease-in-out;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._cube > ._cube-face {\n  position: absolute;\n  width: 50%;\n  height: 50%;\n  background: var(--theme-primary-default);\n  animation: sd-busy-cube-fold 1.8s infinite ease-in-out;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._cube > ._cube-face._cube-face-1 {\n  top: 0;\n  left: 0;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._cube > ._cube-face._cube-face-2 {\n  top: 0;\n  right: 0;\n  animation-delay: 0.45s;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._cube > ._cube-face._cube-face-3 {\n  bottom: 0;\n  right: 0;\n  animation-delay: 0.9s;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._cube > ._cube-face._cube-face-4 {\n  bottom: 0;\n  left: 0;\n  animation-delay: 1.35s;\n}\nsd-busy-container > ._screen > ._rect > ._message {\n  font-size: var(--font-size-sm);\n  color: var(--text-trans-light);\n  text-align: center;\n}\nsd-busy-container > ._screen > ._rect > ._progress {\n  width: 10rem;\n  height: 0.25rem;\n  background: var(--theme-primary-lighter);\n  border-radius: var(--border-radius-default);\n  overflow: hidden;\n}\nsd-busy-container > ._screen > ._rect > ._progress > ._progress-bar {\n  height: 100%;\n  background: var(--theme-primary-default);\n  transition: width 0.3s ease;\n}\n\n@keyframes sd-busy-spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n@keyframes sd-busy-bar {\n  0% {\n    left: -40%;\n  }\n  100% {\n    left: 100%;\n  }\n}\n@keyframes sd-busy-cube-rotate {\n  0% {\n    transform: perspective(6.25rem) rotateX(0deg) rotateY(0deg);\n  }\n  50% {\n    transform: perspective(6.25rem) rotateX(-180deg) rotateY(0deg);\n  }\n  100% {\n    transform: perspective(6.25rem) rotateX(-180deg) rotateY(-180deg);\n  }\n}\n@keyframes sd-busy-cube-fold {\n  0%, 10% {\n    transform: scale(1);\n  }\n  25% {\n    transform: scale(0.5);\n  }\n  50%, 100% {\n    transform: scale(1);\n  }\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdBusyContainerControl, [{
+        type: Component,
+        args: [{ selector: "sd-busy-container", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, host: {
+                    "[attr.data-sd-busy]": "busy() || undefined",
+                    "[attr.data-sd-type]": "currType()",
+                }, template: `
+    @if (busy()) {
+      <div class="_screen">
+        <div class="_rect">
+          <div class="_indicator">
+            @switch (currType()) {
+              @case ("spinner") {
+                <div class="_spinner"></div>
+              }
+              @case ("bar") {
+                <div class="_bar"></div>
+              }
+              @case ("cube") {
+                <div class="_cube">
+                  <div class="_cube-face _cube-face-1"></div>
+                  <div class="_cube-face _cube-face-2"></div>
+                  <div class="_cube-face _cube-face-3"></div>
+                  <div class="_cube-face _cube-face-4"></div>
+                </div>
+              }
+            }
+          </div>
+          @if (message() !== undefined) {
+            <div class="_message">{{ message() }}</div>
+          }
+          @if (progressPercent() !== undefined) {
+            <div class="_progress">
+              <div class="_progress-bar" [style.width.%]="progressPercent()"></div>
+            </div>
+          }
+        </div>
+      </div>
+    }
+    <ng-content></ng-content>
+  `, styles: ["sd-busy-container {\n  display: block;\n  position: relative;\n}\nsd-busy-container > ._screen {\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  z-index: 9998;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--busy-overlay-bg);\n}\nsd-busy-container > ._screen > ._rect {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: var(--gap-default);\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._spinner {\n  width: 2rem;\n  height: 2rem;\n  border: 0.1667rem solid var(--theme-primary-lighter);\n  border-top-color: var(--theme-primary-default);\n  border-radius: 50%;\n  animation: sd-busy-spin 0.8s linear infinite;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._bar {\n  width: 6rem;\n  height: 0.25rem;\n  background: var(--theme-primary-lighter);\n  border-radius: var(--border-radius-default);\n  overflow: hidden;\n  position: relative;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._bar::after {\n  content: \"\";\n  position: absolute;\n  top: 0;\n  left: 0;\n  height: 100%;\n  width: 40%;\n  background: var(--theme-primary-default);\n  border-radius: var(--border-radius-default);\n  animation: sd-busy-bar 1.5s ease-in-out infinite;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._cube {\n  width: 2rem;\n  height: 2rem;\n  position: relative;\n  animation: sd-busy-cube-rotate 1.8s infinite ease-in-out;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._cube > ._cube-face {\n  position: absolute;\n  width: 50%;\n  height: 50%;\n  background: var(--theme-primary-default);\n  animation: sd-busy-cube-fold 1.8s infinite ease-in-out;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._cube > ._cube-face._cube-face-1 {\n  top: 0;\n  left: 0;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._cube > ._cube-face._cube-face-2 {\n  top: 0;\n  right: 0;\n  animation-delay: 0.45s;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._cube > ._cube-face._cube-face-3 {\n  bottom: 0;\n  right: 0;\n  animation-delay: 0.9s;\n}\nsd-busy-container > ._screen > ._rect > ._indicator > ._cube > ._cube-face._cube-face-4 {\n  bottom: 0;\n  left: 0;\n  animation-delay: 1.35s;\n}\nsd-busy-container > ._screen > ._rect > ._message {\n  font-size: var(--font-size-sm);\n  color: var(--text-trans-light);\n  text-align: center;\n}\nsd-busy-container > ._screen > ._rect > ._progress {\n  width: 10rem;\n  height: 0.25rem;\n  background: var(--theme-primary-lighter);\n  border-radius: var(--border-radius-default);\n  overflow: hidden;\n}\nsd-busy-container > ._screen > ._rect > ._progress > ._progress-bar {\n  height: 100%;\n  background: var(--theme-primary-default);\n  transition: width 0.3s ease;\n}\n\n@keyframes sd-busy-spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n@keyframes sd-busy-bar {\n  0% {\n    left: -40%;\n  }\n  100% {\n    left: 100%;\n  }\n}\n@keyframes sd-busy-cube-rotate {\n  0% {\n    transform: perspective(6.25rem) rotateX(0deg) rotateY(0deg);\n  }\n  50% {\n    transform: perspective(6.25rem) rotateX(-180deg) rotateY(0deg);\n  }\n  100% {\n    transform: perspective(6.25rem) rotateX(-180deg) rotateY(-180deg);\n  }\n}\n@keyframes sd-busy-cube-fold {\n  0%, 10% {\n    transform: scale(1);\n  }\n  25% {\n    transform: scale(0.5);\n  }\n  50%, 100% {\n    transform: scale(1);\n  }\n}"] }]
+    }], () => [], { busy: [{ type: i0.Input, args: [{ isSignal: true, alias: "busy", required: false }] }], message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], progressPercent: [{ type: i0.Input, args: [{ isSignal: true, alias: "progressPercent", required: false }] }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdBusyContainerControl, { className: "SdBusyContainerControl", filePath: "packages/angular/src/ui/overlay/busy/sd-busy-container.control.ts", lineNumber: 220 }); })();

package/dist/ui/overlay/busy/sd-busy.provider.d.ts

@@ -0,0 +1,16 @@
+import { type ComponentRef } from "@angular/core";
+import { SdBusyContainerControl } from "./sd-busy-container.control";
+import * as i0 from "@angular/core";
+export type TSdBusyType = "spinner" | "bar" | "cube";
+export declare class SdBusyProvider {
+    private readonly _appRef;
+    private readonly _envInjector;
+    type: import("@angular/core").WritableSignal<TSdBusyType>;
+    globalBusyCount: import("@angular/core").WritableSignal<number>;
+    private _containerRef;
+    get containerRef(): ComponentRef<SdBusyContainerControl>;
+    constructor();
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdBusyProvider, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<SdBusyProvider>;
+}
+//# sourceMappingURL=sd-busy.provider.d.ts.map

package/dist/ui/overlay/busy/sd-busy.provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-busy.provider.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\overlay\\busy\\sd-busy.provider.ts"],"names":[],"mappings":"AAAA,OAAO,EAQL,KAAK,YAAY,EAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;;AAErE,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,KAAK,GAAG,MAAM,CAAC;AAErD,qBACa,cAAc;IACzB,OAAO,CAAC,QAAQ,CAAC,OAAO,CAA0B;IAClD,OAAO,CAAC,QAAQ,CAAC,YAAY,CAA+B;IAE5D,IAAI,sDAA8B;IAClC,eAAe,iDAAa;IAE5B,OAAO,CAAC,aAAa,CAAmD;IAExE,IAAI,YAAY,IAAI,YAAY,CAAC,sBAAsB,CAAC,CAiBvD;;yCA1BU,cAAc;6CAAd,cAAc;CAuC1B"}

package/dist/ui/overlay/busy/sd-busy.provider.js

@@ -0,0 +1,43 @@
+import { ApplicationRef, createComponent, effect, EnvironmentInjector, inject, Injectable, signal, } from "@angular/core";
+import { SdBusyContainerControl } from "./sd-busy-container.control";
+import * as i0 from "@angular/core";
+export class SdBusyProvider {
+    _appRef = inject(ApplicationRef);
+    _envInjector = inject(EnvironmentInjector);
+    type = signal("bar", ...(ngDevMode ? [{ debugName: "type" }] : /* istanbul ignore next */ []));
+    globalBusyCount = signal(0, ...(ngDevMode ? [{ debugName: "globalBusyCount" }] : /* istanbul ignore next */ []));
+    _containerRef;
+    get containerRef() {
+        if (this._containerRef === undefined) {
+            this._containerRef = createComponent(SdBusyContainerControl, {
+                environmentInjector: this._envInjector,
+            });
+            this._appRef.attachView(this._containerRef.hostView);
+            const el = this._containerRef.location.nativeElement;
+            el.style.position = "fixed";
+            el.style.top = "0";
+            el.style.left = "0";
+            el.style.right = "0";
+            el.style.bottom = "0";
+            el.style.pointerEvents = "none";
+            document.body.appendChild(el);
+        }
+        return this._containerRef;
+    }
+    constructor() {
+        effect(() => {
+            const busy = this.globalBusyCount() > 0;
+            const ref = this.containerRef;
+            const el = ref.location.nativeElement;
+            ref.setInput("busy", busy);
+            ref.setInput("type", this.type());
+            el.style.pointerEvents = busy ? "auto" : "none";
+        });
+    }
+    static ɵfac = function SdBusyProvider_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdBusyProvider)(); };
+    static ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: SdBusyProvider, factory: SdBusyProvider.ɵfac, providedIn: "root" });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdBusyProvider, [{
+        type: Injectable,
+        args: [{ providedIn: "root" }]
+    }], () => [], null); })();

package/dist/ui/overlay/dropdown/sd-dropdown-popup.control.d.ts

@@ -0,0 +1,11 @@
+import type { ISdResizeEvent } from "../../../core/plugins/events/sd-resize-event.plugin";
+import * as i0 from "@angular/core";
+export declare class SdDropdownPopupControl {
+    private readonly _parentControl;
+    private readonly _elRef;
+    onKeydown(event: KeyboardEvent): void;
+    onResize(_event: ISdResizeEvent): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdDropdownPopupControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdDropdownPopupControl, "sd-dropdown-popup", never, {}, {}, never, ["*"], true, never>;
+}
+//# sourceMappingURL=sd-dropdown-popup.control.d.ts.map

package/dist/ui/overlay/dropdown/sd-dropdown-popup.control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-dropdown-popup.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\overlay\\dropdown\\sd-dropdown-popup.control.ts"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qDAAqD,CAAC;;AAE1F,qBA6Ea,sBAAsB;IACjC,OAAO,CAAC,QAAQ,CAAC,cAAc,CAE7B;IACF,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAmC;IAE1D,SAAS,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI;IAIrC,QAAQ,CAAC,MAAM,EAAE,cAAc,GAAG,IAAI;yCAV3B,sBAAsB;2CAAtB,sBAAsB;CAoBlC"}

package/dist/ui/overlay/dropdown/sd-dropdown-popup.control.js

@@ -0,0 +1,43 @@
+import { ChangeDetectionStrategy, Component, ElementRef, forwardRef, inject, ViewEncapsulation, } from "@angular/core";
+import { SdEventsDirective } from "../../../core/directives/sd-events.directive";
+import { SdDropdownControl } from "./sd-dropdown.control";
+import * as i0 from "@angular/core";
+const _c0 = ["*"];
+export class SdDropdownPopupControl {
+    _parentControl = inject(forwardRef(() => SdDropdownControl));
+    _elRef = inject((ElementRef));
+    onKeydown(event) {
+        this._parentControl.onPopupKeydown(event);
+    }
+    onResize(_event) {
+        const el = this._elRef.nativeElement;
+        const divEl = el.firstElementChild;
+        if (divEl.clientHeight > 300) {
+            el.style.height = "18.75rem";
+        }
+        else {
+            el.style.height = "";
+        }
+    }
+    static ɵfac = function SdDropdownPopupControl_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdDropdownPopupControl)(); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdDropdownPopupControl, selectors: [["sd-dropdown-popup"]], hostBindings: function SdDropdownPopupControl_HostBindings(rf, ctx) { if (rf & 1) {
+            i0.ɵɵlistener("keydown", function SdDropdownPopupControl_keydown_HostBindingHandler($event) { return ctx.onKeydown($event); });
+        } }, ngContentSelectors: _c0, decls: 2, vars: 0, consts: [[3, "sdResize"]], template: function SdDropdownPopupControl_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵprojectionDef();
+            i0.ɵɵelementStart(0, "div", 0);
+            i0.ɵɵlistener("sdResize", function SdDropdownPopupControl_Template_div_sdResize_0_listener($event) { return ctx.onResize($event); });
+            i0.ɵɵprojection(1);
+            i0.ɵɵelementEnd();
+        } }, dependencies: [SdEventsDirective], styles: ["sd-dropdown-popup {\n  position: fixed;\n  z-index: var(--z-index-dropdown);\n  opacity: 0;\n  transform: translateY(-0.625rem);\n  transition: 0.1s linear;\n  transition-property: transform, opacity;\n  pointer-events: none;\n  background: var(--control-color);\n  min-width: 7.5rem;\n  box-shadow: 0 calc(4 * var(--elevation-size)) calc(4 * 4 * var(--elevation-size)) var(--trans-lighter), 0 var(--elevation-size) var(--elevation-size) var(--trans-lighter);\n  overflow: hidden;\n  border-radius: var(--border-radius-default);\n  border: 1px solid var(--border-color-light);\n}\nsd-dropdown-popup > div {\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n  white-space: nowrap;\n}\nsd-dropdown-popup:focus {\n  outline: 1px solid var(--theme-primary-default);\n}\n@media all and (max-width: 520px) {\n  sd-dropdown-popup {\n    box-shadow: none;\n    border: 1px solid var(--border-color-default);\n  }\n}\nsd-dropdown-popup[data-sd-mobile] {\n  position: fixed;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  top: auto;\n  max-height: 80vh;\n  border-radius: var(--border-radius-default) var(--border-radius-default) 0 0;\n  opacity: 1;\n  pointer-events: auto;\n  transform: none;\n  animation: sd-dropdown-slide-up 0.2s ease-out;\n  box-shadow: 0 calc(8 * var(--elevation-size)) calc(8 * 4 * var(--elevation-size)) var(--trans-lighter), 0 var(--elevation-size) var(--elevation-size) var(--trans-lighter);\n}\n\n@keyframes sd-dropdown-slide-up {\n  from {\n    transform: translateY(100%);\n  }\n  to {\n    transform: translateY(0);\n  }\n}"], encapsulation: 2, changeDetection: 0 });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdDropdownPopupControl, [{
+        type: Component,
+        args: [{ selector: "sd-dropdown-popup", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [SdEventsDirective], host: {
+                    "(keydown)": "onKeydown($event)",
+                }, template: `
+    <div (sdResize)="onResize($event)">
+      <ng-content></ng-content>
+    </div>
+  `, styles: ["sd-dropdown-popup {\n  position: fixed;\n  z-index: var(--z-index-dropdown);\n  opacity: 0;\n  transform: translateY(-0.625rem);\n  transition: 0.1s linear;\n  transition-property: transform, opacity;\n  pointer-events: none;\n  background: var(--control-color);\n  min-width: 7.5rem;\n  box-shadow: 0 calc(4 * var(--elevation-size)) calc(4 * 4 * var(--elevation-size)) var(--trans-lighter), 0 var(--elevation-size) var(--elevation-size) var(--trans-lighter);\n  overflow: hidden;\n  border-radius: var(--border-radius-default);\n  border: 1px solid var(--border-color-light);\n}\nsd-dropdown-popup > div {\n  width: 100%;\n  height: 100%;\n  overflow: auto;\n  white-space: nowrap;\n}\nsd-dropdown-popup:focus {\n  outline: 1px solid var(--theme-primary-default);\n}\n@media all and (max-width: 520px) {\n  sd-dropdown-popup {\n    box-shadow: none;\n    border: 1px solid var(--border-color-default);\n  }\n}\nsd-dropdown-popup[data-sd-mobile] {\n  position: fixed;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  top: auto;\n  max-height: 80vh;\n  border-radius: var(--border-radius-default) var(--border-radius-default) 0 0;\n  opacity: 1;\n  pointer-events: auto;\n  transform: none;\n  animation: sd-dropdown-slide-up 0.2s ease-out;\n  box-shadow: 0 calc(8 * var(--elevation-size)) calc(8 * 4 * var(--elevation-size)) var(--trans-lighter), 0 var(--elevation-size) var(--elevation-size) var(--trans-lighter);\n}\n\n@keyframes sd-dropdown-slide-up {\n  from {\n    transform: translateY(100%);\n  }\n  to {\n    transform: translateY(0);\n  }\n}"] }]
+    }], null, null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdDropdownPopupControl, { className: "SdDropdownPopupControl", filePath: "packages/angular/src/ui/overlay/dropdown/sd-dropdown-popup.control.ts", lineNumber: 90 }); })();

package/dist/ui/overlay/dropdown/sd-dropdown.control.d.ts

@@ -0,0 +1,27 @@
+import { ElementRef } from "@angular/core";
+import "@simplysm/core-browser";
+import * as i0 from "@angular/core";
+export declare class SdDropdownControl {
+    private readonly _elRef;
+    open: import("@angular/core").ModelSignal<boolean>;
+    disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+    popupElRef: import("@angular/core").Signal<ElementRef<HTMLElement>>;
+    private _popupEl?;
+    private _mouseoverEl?;
+    private _backdropEl?;
+    private _isMobile;
+    private readonly _mql;
+    constructor();
+    onHostClick(): void;
+    onHostKeydown(event: KeyboardEvent): void;
+    onPopupKeydown(event: KeyboardEvent): void;
+    private _openPopup;
+    private _closePopup;
+    private _updatePopupPosition;
+    private _onDocumentScrollCapture;
+    private _onDocumentBlurCapture;
+    private _removePopup;
+    static ɵfac: i0.ɵɵFactoryDeclaration<SdDropdownControl, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<SdDropdownControl, "sd-dropdown", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "open": "openChange"; }, ["popupElRef"], ["*", "sd-dropdown-popup"], true, never>;
+}
+//# sourceMappingURL=sd-dropdown.control.d.ts.map

package/dist/ui/overlay/dropdown/sd-dropdown.control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sd-dropdown.control.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\ui\\overlay\\dropdown\\sd-dropdown.control.ts"],"names":[],"mappings":"AAAA,OAAO,EAOL,UAAU,EAKX,MAAM,eAAe,CAAC;AAEvB,OAAO,wBAAwB,CAAC;;AAEhC,qBAgBa,iBAAiB;IAC5B,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAmC;IAE1D,IAAI,+CAAgB;IACpB,QAAQ,qEAAiD;IAEzD,UAAU,0DAGR;IAEF,OAAO,CAAC,QAAQ,CAAC,CAAc;IAC/B,OAAO,CAAC,YAAY,CAAC,CAAc;IACnC,OAAO,CAAC,WAAW,CAAC,CAAc;IAClC,OAAO,CAAC,SAAS,CAAU;IAC3B,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAiB;;IAiEtC,WAAW,IAAI,IAAI;IAQnB,aAAa,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI;IA8CzC,cAAc,CAAC,KAAK,EAAE,aAAa,GAAG,IAAI;IAY1C,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,WAAW;IAMnB,OAAO,CAAC,oBAAoB;IA2C5B,OAAO,CAAC,wBAAwB;IAShC,OAAO,CAAC,sBAAsB;IAqC9B,OAAO,CAAC,YAAY;yCAxPT,iBAAiB;2CAAjB,iBAAiB;CAqR7B"}