@simplysm/angular 14.0.39 → 14.0.41

package/src/core/app-structure/sd-app-structure.provider.ts

@@ -15,19 +15,19 @@ export function injectPermsSignal<K extends string>(viewCodes: string[], keys: K
 // 메뉴는 모듈/권한 모두 체크함
 @Injectable({ providedIn: "root" })
 export class SdAppStructureProvider<TModule = unknown> {
-  private readonly _clientFactory = inject(SdServiceClientFactoryProvider);
-  private readonly _config = inject(SdAngularConfigProvider);
+  private readonly _sdServiceClientFactory = inject(SdServiceClientFactoryProvider);
+  private readonly _sdAngularConfig = inject(SdAngularConfigProvider);
 
   readonly usableModules = signal<TModule[] | undefined>(undefined);
   readonly permRecord = signal<Record<string, boolean> | undefined>(undefined);
   readonly items = signal<AppStructureItem<TModule>[]>([]);
 
   async initialize(serviceKey: string): Promise<void> {
-    const client = this._clientFactory.get(serviceKey);
+    const client = this._sdServiceClientFactory.get(serviceKey);
     const svc = client.getService<AppStructureService>("AppStructure");
     const itemsMap = await svc.getItems();
     this.items.set(
-      (itemsMap[this._config.clientName] ?? []) as AppStructureItem<TModule>[],
+      (itemsMap[this._sdAngularConfig.clientName] ?? []) as AppStructureItem<TModule>[],
     );
   }
 

package/src/core/config/sd-local-storage.provider.ts

@@ -3,14 +3,14 @@ import { SdAngularConfigProvider } from "./sd-angular-config.provider";
 
 @Injectable({ providedIn: "root" })
 export class SdLocalStorageProvider<T> {
-  private readonly _sdNgConf = inject(SdAngularConfigProvider);
+  private readonly _sdAngularConfig = inject(SdAngularConfigProvider);
 
   set<K extends keyof T & string>(key: K, value: T[K]) {
-    localStorage.setItem(`${this._sdNgConf.clientName}.${key}`, JSON.stringify(value));
+    localStorage.setItem(`${this._sdAngularConfig.clientName}.${key}`, JSON.stringify(value));
   }
 
   get<K extends keyof T & string>(key: K): T[K] | undefined {
-    const json = localStorage.getItem(`${this._sdNgConf.clientName}.${key}`);
+    const json = localStorage.getItem(`${this._sdAngularConfig.clientName}.${key}`);
     if (json == null) return undefined;
     try {
       return JSON.parse(json);
@@ -20,6 +20,6 @@ export class SdLocalStorageProvider<T> {
   }
 
   remove(key: keyof T & string) {
-    localStorage.removeItem(`${this._sdNgConf.clientName}.${key}`);
+    localStorage.removeItem(`${this._sdAngularConfig.clientName}.${key}`);
   }
 }

package/src/core/error-handler/sd-global-error-handler.plugin.ts

@@ -11,7 +11,7 @@ import { SdSystemLogProvider } from "../config/sd-system-log.provider";
 @Injectable({ providedIn: null })
 export class SdGlobalErrorHandlerPlugin implements ErrorHandler {
   private readonly _envInjector = inject(EnvironmentInjector);
-  private readonly _systemLog = inject(SdSystemLogProvider);
+  private readonly _sdSystemLog = inject(SdSystemLogProvider);
   private _hasDisplayedError = false;
 
   handleError(event: any) {
@@ -41,7 +41,7 @@ export class SdGlobalErrorHandlerPlugin implements ErrorHandler {
         const { message, filename, lineno, colno, error } = event;
 
         if (error == null) {
-          void this._systemLog.writeAsync("warn", message);
+          void this._sdSystemLog.writeAsync("warn", message);
           return;
         }
 
@@ -95,7 +95,7 @@ export class SdGlobalErrorHandlerPlugin implements ErrorHandler {
 
     const paramLines = Object.keys(param).map((key) => key + ": " + param[key]);
 
-    void this._systemLog.writeAsync("error", `[${title}]\n${paramLines.join("\n")}`);
+    void this._sdSystemLog.writeAsync("error", `[${title}]\n${paramLines.join("\n")}`);
 
     const appRef = this._envInjector.get<ApplicationRef>(ApplicationRef);
     appRef.destroy();

package/src/core/modal/injectFocusTrap.ts

@@ -21,11 +21,11 @@ export function injectFocusTrap(): {
 
   function handleTabTrap(event: KeyboardEvent): void {
     const hostEl = elRef.nativeElement;
-    const focusableElements = getTabbableElements(hostEl);
-    if (focusableElements.length === 0) return;
+    const tabbableElements = getTabbableElements(hostEl);
+    if (tabbableElements.length === 0) return;
 
-    const first = focusableElements[0];
-    const last = focusableElements[focusableElements.length - 1];
+    const first = tabbableElements[0];
+    const last = tabbableElements[tabbableElements.length - 1];
 
     if (event.shiftKey) {
       if (document.activeElement === first) {

package/src/core/modal/sd-modal.provider.ts

@@ -170,11 +170,11 @@ export class SdModalProvider {
         if (options?.noFirstControlFocusing === true) {
           dialogEl.focus();
         } else {
-          // 컨텐츠 영역에서 첫 포커스 가능 요소 검색
+          // 컨텐츠 영역에서 첫 탭 이동 가능 요소 검색
           const contentEl = modalEl.querySelector("._content");
-          const firstFocusable = contentEl?.findFirstFocusableChild();
-          if (firstFocusable !== undefined) {
-            firstFocusable.focus();
+          const firstTabbable = contentEl?.findFirstTabbableChild();
+          if (firstTabbable !== undefined) {
+            firstTabbable.focus();
           } else {
             dialogEl.focus();
           }

package/src/core/modal/sd-modal.ts

@@ -285,8 +285,8 @@ import "@simplysm/core-browser";
 })
 export class SdModal {
   private readonly _elRef = inject(ElementRef<HTMLElement>);
-  private readonly _activatedModal = inject(SdActivatedModalProvider, { optional: true });
-  private readonly _systemConfig = inject(SdSystemConfigProvider, { optional: true });
+  private readonly _sdActivatedModal = inject(SdActivatedModalProvider, { optional: true });
+  private readonly _sdSystemConfig = inject(SdSystemConfigProvider, { optional: true });
   private readonly _errorHandler = inject(ErrorHandler);
   private readonly _focusTrap = injectFocusTrap();
 
@@ -347,7 +347,7 @@ export class SdModal {
     // key 기반 설정 복원
     effect(() => {
       const k = this.key();
-      if (k === undefined || this._systemConfig == null) return;
+      if (k === undefined || this._sdSystemConfig == null) return;
 
       void this._restoreConfig(k).catch((err) => this._errorHandler.handleError(err));
     });
@@ -389,7 +389,7 @@ export class SdModal {
   }
 
   private _requestClose(): void {
-    if (this._activatedModal !== null && !this._activatedModal.canDeactivateFn()) {
+    if (this._sdActivatedModal !== null && !this._sdActivatedModal.canDeactivateFn()) {
       return;
     }
     void this._saveConfig().catch((err) => this._errorHandler.handleError(err));
@@ -418,7 +418,7 @@ export class SdModal {
 
   private async _saveConfig(): Promise<void> {
     const k = this.key();
-    if (k === undefined || this._systemConfig == null) return;
+    if (k === undefined || this._sdSystemConfig == null) return;
 
     const dialogEl = this._getDialogEl();
     if (dialogEl === null) return;
@@ -429,13 +429,13 @@ export class SdModal {
     if (dialogEl.style.left !== "") config["left"] = dialogEl.style.left;
     if (dialogEl.style.top !== "") config["top"] = dialogEl.style.top;
 
-    await this._systemConfig.setAsync(`sd-modal.${k}` as any, config as any);
+    await this._sdSystemConfig.setAsync(`sd-modal.${k}` as any, config as any);
   }
 
   private async _restoreConfig(k: string): Promise<void> {
-    if (this._systemConfig == null) return;
+    if (this._sdSystemConfig == null) return;
 
-    const config = (await this._systemConfig.getAsync(`sd-modal.${k}` as any)) as
+    const config = (await this._sdSystemConfig.getAsync(`sd-modal.${k}` as any)) as
       | Record<string, string | undefined>
       | undefined;
     if (config == null) return;

package/src/core/routing/injectViewTitleSignal.ts

@@ -5,15 +5,15 @@ import { injectFullPageCodeSignal } from "./injectFullPageCodeSignal";
 import { injectCurrentPageCodeSignal } from "./injectCurrentPageCodeSignal";
 
 export function injectViewTitleSignal(): Signal<string> {
-  const activatedModal = inject(SdActivatedModalProvider, { optional: true });
+  const sdActivatedModal = inject(SdActivatedModalProvider, { optional: true });
   const sdAppStructure = inject(SdAppStructureProvider);
 
   const fullPageCode = injectFullPageCodeSignal();
   const currPageCode = injectCurrentPageCodeSignal();
 
   return computed(() => {
-    if (activatedModal != null) {
-      return activatedModal.modalComponent()?.title() ?? "";
+    if (sdActivatedModal != null) {
+      return sdActivatedModal.modalComponent()?.title() ?? "";
     }
 
     try {

package/src/core/routing/injectViewTypeSignal.ts

@@ -5,14 +5,14 @@ import { injectCurrentPageCodeSignal } from "./injectCurrentPageCodeSignal";
 import { injectFullPageCodeSignal } from "./injectFullPageCodeSignal";
 
 export function injectViewTypeSignal(getComp: () => object): Signal<SdViewType> {
-  const activatedModal = inject(SdActivatedModalProvider, { optional: true });
+  const sdActivatedModal = inject(SdActivatedModalProvider, { optional: true });
   const activatedRoute = inject(ActivatedRoute, { optional: true });
 
   const fullPageCode = injectFullPageCodeSignal();
   const currPageCode = injectCurrentPageCodeSignal();
 
   return computed<SdViewType>(() => {
-    if (activatedModal != null) {
+    if (sdActivatedModal != null) {
       return "modal";
     }
 

package/src/core/routing/sd-router-link.ts

@@ -12,7 +12,7 @@ import { SdNavigateWindowProvider } from "./sd-navigate-window.provider";
 })
 export class SdRouterLink {
   private readonly _router = inject(Router);
-  private readonly _navWindow = inject(SdNavigateWindowProvider);
+  private readonly _sdNavigateWindow = inject(SdNavigateWindowProvider);
 
   option = input<
     | {
@@ -39,13 +39,13 @@ export class SdRouterLink {
     event.preventDefault();
     event.stopPropagation();
 
-    if (this._navWindow.isWindow) {
+    if (this._sdNavigateWindow.isWindow) {
       const width = option.window?.width ?? 800;
       const height = option.window?.height ?? 800;
       const qp = option.queryParams
         ? "?" + new URLSearchParams(option.queryParams).toString()
         : "";
-      this._navWindow.open(
+      this._sdNavigateWindow.open(
         option.link + qp,
         option.params,
         `width=${width},height=${height}`,
@@ -54,7 +54,7 @@ export class SdRouterLink {
       const qp = option.queryParams
         ? "?" + new URLSearchParams(option.queryParams).toString()
         : "";
-      this._navWindow.open(option.link + qp, option.params);
+      this._sdNavigateWindow.open(option.link + qp, option.params);
     } else if (option.outletName === undefined) {
       await this._router.navigate(
         [option.link, ...(option.params ? [option.params] : [])],

package/src/core/routing/setupCanDeactivate.ts

@@ -3,12 +3,12 @@ import { ActivatedRoute, type CanDeactivateFn } from "@angular/router";
 import { SdActivatedModalProvider } from "../modal/sd-activated-modal.provider";
 
 export function setupCanDeactivate(fn: () => boolean): void {
-  const activatedModal = inject(SdActivatedModalProvider, { optional: true });
+  const sdActivatedModal = inject(SdActivatedModalProvider, { optional: true });
   const activatedRoute = inject(ActivatedRoute, { optional: true });
   const elRef = inject(ElementRef);
 
-  if (activatedModal != null) {
-    activatedModal.canDeactivateFn = fn;
+  if (sdActivatedModal != null) {
+    sdActivatedModal.canDeactivateFn = fn;
     return;
   }
 

package/src/core/service-client/sd-service-client-factory.provider.ts

@@ -6,8 +6,8 @@ import { SdToastProvider } from "../toast/sd-toast.provider";
 
 @Injectable({ providedIn: "root" })
 export class SdServiceClientFactoryProvider {
-  private readonly _toastProvider = inject(SdToastProvider);
-  private readonly _configProvider = inject(SdAngularConfigProvider);
+  private readonly _sdToast = inject(SdToastProvider);
+  private readonly _sdAngularConfig = inject(SdAngularConfigProvider);
   private readonly _destroyRef = inject(DestroyRef);
 
   private readonly _clientMap = new Map<string, ServiceClient>();
@@ -43,7 +43,7 @@ export class SdServiceClientFactoryProvider {
       ...options,
     };
 
-    const client = createServiceClient(this._configProvider.clientName, mergedOptions);
+    const client = createServiceClient(this._sdAngularConfig.clientName, mergedOptions);
 
     client.on("request-progress", (state: ServiceProgressState) => {
       this._handleProgress("요청을 전송하는 중입니다.", state);
@@ -85,7 +85,7 @@ export class SdServiceClientFactoryProvider {
 
     let progressSignal = this._progressMap.get(uuid);
     if (progressSignal == null) {
-      progressSignal = this._toastProvider.info(message, true);
+      progressSignal = this._sdToast.info(message, true);
       this._progressMap.set(uuid, progressSignal);
     }
 

package/src/core/shared-data/sd-shared-data.provider.ts

@@ -40,8 +40,8 @@ interface SharedDataEntry<T extends SharedDataBase<string | number>> {
 
 @Injectable()
 export abstract class SdSharedDataProvider<T extends Record<string, SharedDataBase<string | number>>> {
-  private readonly _clientFactory = inject(SdServiceClientFactoryProvider);
-  private readonly _errorHandler = inject(ErrorHandler);
+  protected readonly _sdServiceClientFactory = inject(SdServiceClientFactoryProvider);
+  protected readonly _errorHandler = inject(ErrorHandler);
 
   readonly loadingCount: WritableSignal<number> = signal(0);
 
@@ -54,7 +54,7 @@ export abstract class SdSharedDataProvider<T extends Record<string, SharedDataBa
     if (existing != null) {
       // 기존 리스너 키 초기화 + generation 증가로 이전 이벤트 무시
       if (existing.listenerKey != null) {
-        const client = this._clientFactory.get(existing.info.serviceKey);
+        const client = this._sdServiceClientFactory.get(existing.info.serviceKey);
         void client.removeListener(existing.listenerKey);
         existing.listenerKey = undefined;
       }
@@ -109,7 +109,7 @@ export abstract class SdSharedDataProvider<T extends Record<string, SharedDataBa
       throw new Error(`등록되지 않은 공유 데이터: ${name as string}`);
     }
 
-    const client = this._clientFactory.get(entry.info.serviceKey);
+    const client = this._sdServiceClientFactory.get(entry.info.serviceKey);
     const event = client.getEvent<typeof SdSharedDataChangeEvent>("SdSharedDataChange");
     await event.emit(
       (item) => item.name === (name as string) && obj.equal(item.filter, entry.info.filter),
@@ -137,7 +137,7 @@ export abstract class SdSharedDataProvider<T extends Record<string, SharedDataBa
 
         // 이벤트 리스너 등록
         if (entry.listenerKey == null) {
-          const client = this._clientFactory.get(entry.info.serviceKey);
+          const client = this._sdServiceClientFactory.get(entry.info.serviceKey);
           const event = client.getEvent<typeof SdSharedDataChangeEvent>("SdSharedDataChange");
           entry.listenerKey = await event.addListener(
             { name, filter: entry.info.filter },

package/src/core/toast/sd-toast-container.ts

@@ -18,18 +18,21 @@ import {
   styles: [
     /* language=SCSS */ `
       @use "../../../scss/commons/variables";
+      @use "../../../scss/commons/mixins";
       @use "sass:map";
 
       sd-toast-container {
+        display: flex;
         position: fixed;
         top: 0;
         left: 0;
-        right: 0;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        z-index: map.get(variables.$vars, z-index, toast);
+        height: 100%;
+        width: 100%;
         pointer-events: none;
+        padding: var(--gap-xxl);
+        z-index: map.get(variables.$vars, z-index, toast);
+
+        @include mixins.flex-direction(column);
 
         @media all and (max-width: variables.$breakpoint-mobile) {
           flex-direction: column-reverse;
@@ -37,8 +40,6 @@ import {
 
         &[data-sd-overlap] {
           display: block;
-          bottom: 0;
-          height: 100%;
 
           > sd-toast {
             position: absolute;
@@ -46,7 +47,6 @@ import {
             left: var(--gap-xxl);
             right: var(--gap-xxl);
             width: auto;
-            max-width: none;
           }
         }
       }

package/src/core/toast/sd-toast.provider.ts

@@ -36,7 +36,7 @@ export class SdToastProvider {
   private readonly _appRef = inject(ApplicationRef);
   private readonly _envInjector = inject(EnvironmentInjector);
   private readonly _injector = inject(Injector);
-  private readonly _systemLog = inject(SdSystemLogProvider);
+  private readonly _sdSystemLog = inject(SdSystemLogProvider);
 
   alertThemes = signal<SdToastSeverity[]>([]);
   overlap = signal(false);
@@ -145,11 +145,11 @@ export class SdToastProvider {
     });
   }
 
-  async try<R>(fn: () => Promise<R>): Promise<R | undefined>;
-  async try<R>(fn: () => Promise<R>, messageFn: (err: unknown) => string): Promise<R | undefined>;
+  async try<R>(fn: () => Promise<R>, messageFn?: (err: Error) => string): Promise<R | undefined>;
+  try<R>(fn: () => R, messageFn?: (err: Error) => string): R | undefined;
   async try<R>(
-    fn: () => Promise<R>,
-    messageFn?: (err: unknown) => string,
+    fn: () => Promise<R> | R,
+    messageFn?: (err: Error) => string,
   ): Promise<R | undefined> {
     try {
       return await fn();
@@ -160,7 +160,7 @@ export class SdToastProvider {
 
       const message = messageFn !== undefined ? messageFn(err) : err.message;
       this.danger(message);
-      await this._systemLog.writeAsync("error", err.stack ?? err.message);
+      await this._sdSystemLog.writeAsync("error", err.stack ?? err.message);
       return undefined;
     }
   }

package/src/core/toast/sd-toast.ts

@@ -18,21 +18,23 @@ const ASSERTIVE_THEMES: ReadonlySet<string> = new Set(["warning", "danger"]);
   encapsulation: ViewEncapsulation.None,
   standalone: true,
   host: {
-    "[attr.data-sd-open]": "open() || undefined",
+    "[attr.data-sd-open]": "open()",
     "[attr.data-sd-theme]": "theme()",
     "[attr.role]": "ariaRole()",
     "[attr.aria-live]": "ariaLive()",
   },
   template: `
-    @if (message() !== undefined) {
-      <div class="_message">{{ message() }}</div>
-    }
-    <ng-content />
-    @if (useProgress()) {
-      <div class="_progress">
-        <div class="_progress-bar" [style.width.%]="progress()"></div>
-      </div>
-    }
+    <div class="_block">
+      @if (message() !== undefined) {
+        <div class="_message">{{ message() }}</div>
+      }
+      <ng-content />
+      @if (useProgress()) {
+        <div class="_progress">
+          <div class="_progress-bar" [style.width.%]="progress()"></div>
+        </div>
+      }
+    </div>
   `,
   styles: [
     /* language=SCSS */ `
@@ -42,59 +44,90 @@ const ASSERTIVE_THEMES: ReadonlySet<string> = new Set(["warning", "danger"]);
 
       sd-toast {
         display: block;
-        position: relative;
-        max-width: 32.5rem;
+        margin-bottom: var(--gap-sm);
+        text-align: center;
         width: 100%;
-        margin: var(--gap-sm);
-        padding: var(--gap-default) var(--gap-lg);
-        border-radius: var(--border-radius-default);
-        color: var(--text-trans-rev-default);
-        pointer-events: auto;
-        transform: translateY(-100%);
-        opacity: 0;
-        transition:
-          transform var(--animation-duration) ease,
-          opacity var(--animation-duration) ease;
-
-        @include mixins.elevation(12);
-
-        &[data-sd-open] {
-          transform: translateY(0);
-          opacity: 1;
+        pointer-events: none;
+
+        > ._block {
+          display: inline-block;
+          text-align: left;
+          color: var(--text-trans-rev-default);
+          transform: translateY(-100%);
+          border-radius: var(--border-radius-lg);
+          opacity: 0;
+          @include mixins.elevation(12);
+          pointer-events: auto;
+
+          > ._message {
+            padding: var(--gap-default) var(--gap-lg);
+            word-break: break-all;
+            white-space: pre-wrap;
+          }
+
+          > ._progress {
+            background: var(--theme-gray-default);
+            height: 4px;
+            border-radius: var(--border-radius-xl);
+            margin: 0 4px 4px 4px;
+
+            > ._progress-bar {
+              border-radius: var(--border-radius-xl);
+              height: 4px;
+              transition: width 1s ease-out;
+            }
+          }
         }
 
         @each $theme-name, $theme-map in map.get(variables.$vars, theme) {
           &[data-sd-theme="#{$theme-name}"] {
-            background: map.get($theme-map, default);
+            > ._block {
+              background: map.get($theme-map, default);
+
+              > ._progress {
+                background: map.get($theme-map, darker);
+
+                > ._progress-bar {
+                  background: map.get($theme-map, lighter);
+                }
+              }
+            }
           }
         }
 
-        > ._message {
-          word-break: break-all;
-          white-space: pre-wrap;
+        &[data-sd-open="true"] {
+          > ._block {
+            transform: none;
+            transition: var(--animation-duration) ease-out;
+            transition-property: transform, opacity;
+            opacity: 1;
+          }
         }
 
-        > ._progress {
-          position: absolute;
-          bottom: 0;
-          left: 0;
-          right: 0;
-          height: 0.25rem;
-          background: var(--trans-lighter);
-          border-radius: 0 0 var(--border-radius-default) var(--border-radius-default);
-          overflow: hidden;
-
-          > ._progress-bar {
-            height: 100%;
-            background: var(--trans-default);
-            transition: width 0.3s ease;
+        &[data-sd-open="false"] {
+          > ._block {
+            transform: translateY(-100%);
+            transition: var(--animation-duration) ease-in;
+            transition-property: transform, opacity;
+            opacity: 0;
           }
         }
 
         @media all and (max-width: variables.$breakpoint-mobile) {
-          max-width: none;
-          margin: var(--gap-xs);
-          border-radius: 0;
+          > ._block {
+            border-radius: calc(var(--line-height) / 2);
+            transform: translateY(100%);
+
+            > ._message {
+              padding: var(--gap-xs) var(--gap-default);
+            }
+          }
+
+          &[data-sd-open="false"] {
+            > ._block {
+              transform: translateY(100%);
+            }
+          }
         }
       }
     `,

package/src/core/validation/setupInvalid.ts

@@ -1,7 +1,7 @@
 import { DestroyRef, effect, ElementRef, inject, Renderer2 } from "@angular/core";
 import { setSafeStyle } from "../setSafeStyle";
 import { Uuid } from "@simplysm/core-common";
-import { isFocusable } from "tabbable";
+import { isTabbable } from "tabbable";
 
 export function setupInvalid(getInvalidMessage: () => string): void {
   const elRef = inject<ElementRef<HTMLElement>>(ElementRef);
@@ -65,6 +65,7 @@ function createInputHiddenEl(renderer: Renderer2, hostEl: HTMLElement): HTMLInpu
   newEl.type = "text";
   newEl.name = Uuid.generate().toString();
   newEl.className = "sd-invalid-input";
+  newEl.tabIndex = -1;
   setSafeStyle(renderer, newEl, {
     position: "absolute",
     left: "2px",
@@ -79,11 +80,11 @@ function createInputHiddenEl(renderer: Renderer2, hostEl: HTMLElement): HTMLInpu
   });
 
   renderer.listen(newEl, "focus", () => {
-    const focusableElement =
-      (isFocusable(hostEl) ? hostEl : hostEl.findFirstFocusableChild()) ??
-      hostEl.findFocusableParent();
-    if (focusableElement !== undefined) {
-      focusableElement.focus();
+    const tabbableElement =
+      (isTabbable(hostEl) ? hostEl : hostEl.findFirstTabbableChild()) ??
+      hostEl.findTabbableParent();
+    if (tabbableElement !== undefined) {
+      tabbableElement.focus();
     }
   });
 

package/src/data/data-detail/sd-data-detail.base.ts

@@ -47,9 +47,9 @@ export abstract class SdDataDetailBase<T extends object, R = boolean>
 
   //-- implement
 
-  private readonly _sdToast = inject(SdToastProvider);
-  private readonly _sdSharedData = inject(SdSharedDataProvider);
-  private readonly _errorHandler = inject(ErrorHandler);
+  protected readonly _sdToast = inject(SdToastProvider);
+  protected readonly _sdSharedData = inject(SdSharedDataProvider);
+  protected readonly _errorHandler = inject(ErrorHandler);
 
   viewType = injectViewTypeSignal(() => this);
 

package/src/data/data-select-button/sd-data-select-button.base.ts

@@ -32,7 +32,7 @@ export abstract class SdDataSelectButtonBase<
 
   //-- implement
 
-  private readonly _sdModal = inject(SdModalProvider);
+  protected readonly _sdModal = inject(SdModalProvider);
 
   value = model<SelectModeValue<TKey>[TMode]>();
 

package/src/data/sheet/sd-sheet.ts

@@ -368,7 +368,7 @@ export class SdSheet<T> {
   columnControls = contentChildren(SdSheetColumn);
 
   // Injected providers
-  private readonly _modalProvider = inject(SdModalProvider);
+  private readonly _sdModal = inject(SdModalProvider);
 
   // DOM accessor & cell agent
   domAccessor = injectSheetDomAccessor();
@@ -564,7 +564,7 @@ export class SdSheet<T> {
   }
 
   async onConfigButtonClick(): Promise<void> {
-    const result = await this._modalProvider.showAsync(
+    const result = await this._sdModal.showAsync(
       {
         title: "시트 설정",
         type: SdSheetConfigModal,