@simplysm/angular 14.0.19 → 14.0.22

package/src/ui/form/select/sd-select.control.ts

@@ -2,6 +2,7 @@ import {
   booleanAttribute,
   ChangeDetectionStrategy,
   Component,
+  computed,
   contentChild,
   contentChildren,
   effect,
@@ -215,7 +216,26 @@ export class SdSelectControl<M extends "single" | "multi", T> {
 
   _selectedItemContentHTML = signal<string | undefined>(undefined);
 
-  _flatItems = signal<{ data: T; index: number; depth: number }[]>([]);
+  _flatItems = computed(() => {
+    const items = this.items();
+    if (items == null) return [];
+    const getChildren = this.getChildrenFn();
+    const flat: { data: T; index: number; depth: number }[] = [];
+    let index = 0;
+    const walk = (list: T[], depth: number) => {
+      for (const item of list) {
+        flat.push({ data: item, index: index++, depth });
+        if (getChildren !== undefined) {
+          const children = getChildren(item);
+          if (children !== undefined) {
+            walk(children, depth + 1);
+          }
+        }
+      }
+    };
+    walk(items, 0);
+    return flat;
+  });
 
   constructor() {
     // Required validation
@@ -227,31 +247,6 @@ export class SdSelectControl<M extends "single" | "multi", T> {
       return "";
     });
 
-    // Flatten items array (with hierarchy support)
-    effect(() => {
-      const items = this.items();
-      if (items == null) {
-        this._flatItems.set([]);
-        return;
-      }
-      const getChildren = this.getChildrenFn();
-      const flat: { data: T; index: number; depth: number }[] = [];
-      let index = 0;
-      const walk = (list: T[], depth: number) => {
-        for (const item of list) {
-          flat.push({ data: item, index: index++, depth });
-          if (getChildren !== undefined) {
-            const children = getChildren(item);
-            if (children !== undefined) {
-              walk(children, depth + 1);
-            }
-          }
-        }
-      };
-      walk(items, 0);
-      this._flatItems.set(flat);
-    });
-
     // D3: contentClass/contentStyle via effect() on popup element
     // + D4: keyboard navigation via tabbable()
     effect((onCleanup) => {

package/src/ui/layout/sd-gap.control.ts

@@ -1,10 +1,9 @@
-import { ChangeDetectionStrategy, Component, effect, ElementRef, inject, input, ViewEncapsulation } from "@angular/core";
+import { ChangeDetectionStrategy, Component, computed, input, ViewEncapsulation } from "@angular/core";
 
 @Component({
   selector: "sd-gap",
   changeDetection: ChangeDetectionStrategy.OnPush,
   encapsulation: ViewEncapsulation.None,
-  standalone: true,
   imports: [],
   styles: [
     /* language=SCSS */ `
@@ -32,32 +31,29 @@ import { ChangeDetectionStrategy, Component, effect, ElementRef, inject, input,
     "[attr.data-sd-width]": "width()",
     "[style.width.px]": "widthPx()",
     "[style.width.em]": "widthEm()",
+    "[style.display]": "_displayStyle()",
   },
 })
 export class SdGapControl {
-  private readonly _elRef = inject(ElementRef<HTMLElement>);
-
   height = input<"xxs" | "xs" | "sm" | "default" | "lg" | "xl" | "xxl">();
   heightPx = input<number>();
   width = input<"xxs" | "xs" | "sm" | "default" | "lg" | "xl" | "xxl">();
   widthPx = input<number>();
   widthEm = input<number>();
 
-  constructor() {
-    effect(() => {
-      if (this.widthPx() === 0 || this.heightPx() === 0 || this.widthEm() === 0) {
-        this._elRef.nativeElement.style.display = "none";
-      } else if (
-        this.width() !== undefined ||
-        this.widthPx() !== undefined ||
-        this.widthEm() !== undefined
-      ) {
-        this._elRef.nativeElement.style.display = "inline-block";
-      } else if (this.height() !== undefined || this.heightPx() !== undefined) {
-        this._elRef.nativeElement.style.display = "block";
-      } else {
-        this._elRef.nativeElement.style.display = "";
-      }
-    });
-  }
+  _displayStyle = computed(() => {
+    if (this.widthPx() === 0 || this.heightPx() === 0 || this.widthEm() === 0) {
+      return "none";
+    } else if (
+      this.width() !== undefined ||
+      this.widthPx() !== undefined ||
+      this.widthEm() !== undefined
+    ) {
+      return "inline-block";
+    } else if (this.height() !== undefined || this.heightPx() !== undefined) {
+      return "block";
+    } else {
+      return undefined;
+    }
+  });
 }

package/src/ui/navigation/menu-utils.ts

@@ -1,10 +1,6 @@
-export interface ISdMenu {
-  title: string;
-  codeChain: string[];
-  url?: string;
-  icon?: string;
-  children?: ISdMenu[];
-}
+import type { ISdMenu } from "../../core/providers/sd-app-structure.types";
+
+export type { ISdMenu } from "../../core/providers/sd-app-structure.types";
 
 export function getMenuRouterLinkOption(
   menu: ISdMenu,

package/src/ui/overlay/busy/sd-busy-container.control.ts

@@ -8,7 +8,7 @@ import {
   input,
   ViewEncapsulation,
 } from "@angular/core";
-import { SdBusyProvider, type TSdBusyType } from "./sd-busy.provider";
+import { SdBusyProvider, type TSdBusyType } from "../../../core/providers/sd-busy.provider";
 
 @Component({
   selector: "sd-busy-container",

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

@@ -20,35 +20,17 @@ import { SdButtonControl } from "../../form/button/sd-button.control";
   encapsulation: ViewEncapsulation.None,
   standalone: true,
   imports: [SdButtonControl],
+  host: {
+    style: "display: block",
+    class: "p-default",
+  },
   template: `
-    <div class="_sd-confirm-modal">
-      <p class="_message">{{ message() }}</p>
-      <div class="_actions">
-        <sd-button [theme]="'primary'" (click)="onConfirm()">확인</sd-button>
-        <sd-button (click)="onCancel()">취소</sd-button>
-      </div>
+    <p class="mb-default" [innerHTML]="message()"></p>
+    <div class="flex-row main-align-end gap-sm">
+      <sd-button [theme]="'primary'" (click)="onConfirm()">확인</sd-button>
+      <sd-button (click)="onCancel()">취소</sd-button>
     </div>
   `,
-  styles: [
-    /* language=SCSS */ `
-      sd-confirm-modal {
-        display: block;
-        padding: var(--gap-default);
-
-        > ._sd-confirm-modal {
-          > ._message {
-            margin-bottom: var(--gap-default);
-          }
-
-          > ._actions {
-            display: flex;
-            justify-content: flex-end;
-            gap: var(--gap-sm);
-          }
-        }
-      }
-    `,
-  ],
 })
 export class SdConfirmModalControl implements ISdModal<boolean> {
   initialized = signal(true);

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

@@ -13,7 +13,7 @@ import {
 } from "@angular/core";
 import { isTabbable } from "tabbable";
 import { NgTemplateOutlet } from "@angular/common";
-import { SdActivatedModalProvider } from "./sd-modal.provider";
+import { SdActivatedModalProvider } from "../../../core/providers/sd-activated-modal.provider";
 import { SdSystemConfigProvider } from "../../../core/providers/sd-system-config.provider";
 import "@simplysm/core-browser";
 

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

@@ -19,6 +19,7 @@ import type {
   TWithOptional,
 } from "../../../core/utils/TDirectiveInputSignals";
 import { SdModalControl } from "./sd-modal.control";
+import { SdActivatedModalProvider } from "../../../core/providers/sd-activated-modal.provider";
 import "@simplysm/core-browser";
 
 /**
@@ -70,16 +71,6 @@ export interface ISdModalOptions {
   noFirstControlFocusing?: boolean;
 }
 
-/**
- * 모달 내부에서 inject하여 사용하는 프로바이더
- */
-@Injectable()
-export class SdActivatedModalProvider<T extends ISdModal<any> = ISdModal<any>> {
-  modalComponent = signal<any>(undefined);
-  contentComponent = signal<T | undefined>(undefined);
-  canDeactiveFn: () => boolean = () => true;
-}
-
 /**
  * 모달을 프로그래밍 방식으로 생성하는 프로바이더
  */

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

@@ -8,6 +8,7 @@ import {
 } from "@angular/core";
 import type { ISdModal } from "./sd-modal.provider";
 import { SdButtonControl } from "../../form/button/sd-button.control";
+import { SdTextfieldControl } from "../../form/input/sd-textfield.control";
 
 /**
  * 범용 프롬프트 모달.
@@ -19,52 +20,25 @@ import { SdButtonControl } from "../../form/button/sd-button.control";
   changeDetection: ChangeDetectionStrategy.OnPush,
   encapsulation: ViewEncapsulation.None,
   standalone: true,
-  imports: [SdButtonControl],
+  imports: [SdButtonControl, SdTextfieldControl],
+  host: {
+    style: "display: block",
+    class: "p-default",
+  },
   template: `
-    <div class="_sd-prompt-modal">
-      <p class="_message">{{ message() }}</p>
-      <input
-        class="_input"
-        type="text"
-        [value]="_inputValue()"
-        (input)="onInputChange($event)"
-        (keydown.enter)="onConfirm()"
-      />
-      <div class="_actions">
-        <sd-button [theme]="'primary'" (click)="onConfirm()">확인</sd-button>
-        <sd-button (click)="onCancel()">취소</sd-button>
-      </div>
+    <p class="mb-default" [innerHTML]="message()"></p>
+    <sd-textfield
+      [type]="'text'"
+      [value]="_inputValue()"
+      (input)="onInputChange($event)"
+      (keydown.enter)="onConfirm()"
+      class="mb-default"
+    />
+    <div class="flex-row main-align-end gap-sm">
+      <sd-button [theme]="'primary'" (click)="onConfirm()">확인</sd-button>
+      <sd-button (click)="onCancel()">취소</sd-button>
     </div>
   `,
-  styles: [
-    /* language=SCSS */ `
-      sd-prompt-modal {
-        display: block;
-        padding: var(--gap-default);
-
-        > ._sd-prompt-modal {
-          > ._message {
-            margin-bottom: var(--gap-default);
-          }
-
-          > ._input {
-            display: block;
-            width: 100%;
-            padding: var(--gap-sm) var(--gap-default);
-            border: 1px solid var(--trans-lighter);
-            border-radius: var(--border-radius-default);
-            margin-bottom: var(--gap-default);
-          }
-
-          > ._actions {
-            display: flex;
-            justify-content: flex-end;
-            gap: var(--gap-sm);
-          }
-        }
-      }
-    `,
-  ],
 })
 export class SdPromptModalControl implements ISdModal<string> {
   initialized = signal(true);

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

@@ -7,7 +7,7 @@ import {
   model,
   ViewEncapsulation,
 } from "@angular/core";
-import type { TSdToastTheme } from "./sd-toast.provider";
+import type { TSdToastTheme } from "../../../core/providers/sd-toast.provider";
 
 const POLITE_THEMES: ReadonlySet<string> = new Set(["info", "success"]);
 const ASSERTIVE_THEMES: ReadonlySet<string> = new Set(["warning", "danger"]);

package/dist/core/utils/setups/setupCloserWhenSingleSelectionChange.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"setupCloserWhenSingleSelectionChange.d.ts","sourceRoot":"","sources":["../../../../src/core/utils/setups/setupCloserWhenSingleSelectionChange.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,gBAAgB,EAAE,KAAK,MAAM,EAAU,MAAM,eAAe,CAAC;AAC3E,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,wDAAwD,CAAC;AAEvG,wBAAgB,oCAAoC,CAAC,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE;IACzE,gBAAgB,EAAE,MAAM,CAAC,IAAI,EAAE,CAAC,CAAC;IACjC,aAAa,EAAE,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC;IAC/B,UAAU,EAAE,MAAM,QAAQ,GAAG,OAAO,GAAG,SAAS,CAAC;IACjD,KAAK,EAAE,gBAAgB,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,CAAC;CAC1D,GAAG,IAAI,CAoBP"}

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

@@ -1 +0,0 @@
-{"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/toast/sd-toast.provider.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"sd-toast.provider.d.ts","sourceRoot":"","sources":["../../../../src/ui/overlay/toast/sd-toast.provider.ts"],"names":[],"mappings":"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"}