@simplysm/angular 14.0.7 → 14.0.8

package/src/ui/navigation/sidebar/sd-sidebar-container.control.ts

@@ -87,6 +87,6 @@ export class SdSidebarContainerControl {
   }
 
   onBackdropClick(): void {
-    this.toggle.update((v) => !v);
+    this.toggle.set(false);
   }
 }

package/src/ui/overlay/dropdown/sd-dropdown-popup.control.ts

@@ -102,7 +102,7 @@ export class SdDropdownPopupControl {
     const divEl = el.firstElementChild as HTMLElement;
 
     if (divEl.clientHeight > 300) {
-      el.style.height = "18.75rem";
+      el.style.height = "300px";
     } else {
       el.style.height = "";
     }

package/src/ui/overlay/modal/sd-modal.control.ts

@@ -1,6 +1,7 @@
 import {
   ChangeDetectionStrategy,
   Component,
+  DestroyRef,
   effect,
   ElementRef,
   inject,
@@ -62,6 +63,7 @@ export class SdModalControl {
   private readonly _elRef = inject(ElementRef<HTMLElement>);
   private readonly _activatedModal = inject(SdActivatedModalProvider, { optional: true });
   private readonly _systemConfig = inject(SdSystemConfigProvider, { optional: true });
+  private readonly _destroyRef = inject(DestroyRef);
 
   open = model(false);
   key = input<string | undefined>(undefined);
@@ -147,6 +149,11 @@ export class SdModalControl {
         void this._saveConfig();
       }
     };
+
+    this._destroyRef.onDestroy(() => {
+      document.removeEventListener("mousemove", this._onDocumentMouseMove);
+      document.removeEventListener("mouseup", this._onDocumentMouseUp);
+    });
   }
 
   onResizeMouseDown(event: MouseEvent, dir: string): void {
@@ -262,6 +269,8 @@ export class SdModalControl {
         maxZ = z;
       }
     }
+    const currentZ = parseInt(hostEl.style.zIndex, 10);
+    if (currentZ >= maxZ) return;
     hostEl.style.zIndex = String(maxZ + 1);
   }
 

package/src/ui/overlay/toast/sd-toast.provider.ts

@@ -201,12 +201,13 @@ export class SdToastProvider {
       const progressSignal = toastRef.instance.progress;
 
       effect(
-        () => {
+        (onCleanup) => {
           const val = progressSignal();
           if (val >= 100) {
-            setTimeout(() => {
+            const timerId = setTimeout(() => {
               this._dismissToast(toastRef);
             }, 1000);
+            onCleanup(() => clearTimeout(timerId));
           }
         },
         { injector: toastRef.injector },
@@ -260,14 +261,19 @@ export class SdToastProvider {
     toastRef.instance.open.set(false);
 
     const el = toastRef.location.nativeElement as HTMLElement;
+    let fallbackId: ReturnType<typeof setTimeout>;
+
     const onTransitionEnd = () => {
+      clearTimeout(fallbackId);
       el.removeEventListener("transitionend", onTransitionEnd);
       this._destroyToast(toastRef);
     };
+
     el.addEventListener("transitionend", onTransitionEnd);
 
     // fallback: transition이 없는 경우 300ms 후 파괴
-    setTimeout(() => {
+    fallbackId = setTimeout(() => {
+      el.removeEventListener("transitionend", onTransitionEnd);
       this._destroyToast(toastRef);
     }, 300);
   }

package/src/ui/visual/sd-progress.control.ts

@@ -2,6 +2,7 @@ import {
   booleanAttribute,
   ChangeDetectionStrategy,
   Component,
+  computed,
   input,
   ViewEncapsulation,
 } from "@angular/core";
@@ -22,7 +23,7 @@ import { PercentPipe } from "@angular/common";
     <div class="_content tx-right">
       {{ value() | percent: "1.0-2" }}
     </div>
-    <div class="_progress" [style.width]="value() * 100 + '%'"></div>
+    <div class="_progress" [style.width]="_barWidth()"></div>
   `,
   styles: [
     /* language=SCSS */ `
@@ -85,4 +86,6 @@ export class SdProgressControl {
   >();
 
   value = input.required<number>();
+
+  _barWidth = computed(() => Math.min(this.value() * 100, 100) + "%");
 }