@ncds/ui-admin 1.8.26-alpha.3 → 1.8.26-alpha.5

package/dist/temp/src/utils/notification/__tests__/resolveAutoClose.test.js

@@ -0,0 +1,22 @@
+import { describe, expect, it } from 'vitest';
+import { HIDE_CLOSE_BUTTON_AUTO_CLOSE_MS } from '../../../../constant/notification';
+import { resolveAutoClose } from '../resolveAutoClose';
+const EXPLICIT_MS = 5000;
+const FALLBACK_MS = 4000;
+const NO_AUTO_CLOSE = 0;
+describe('resolveAutoClose', () => {
+    it('autoClose 를 명시하면 hideCloseButton·fallback 과 무관하게 그대로 쓴다 (0 포함)', () => {
+        expect(resolveAutoClose({ autoClose: EXPLICIT_MS, hideCloseButton: true, fallback: FALLBACK_MS })).toBe(EXPLICIT_MS);
+        expect(resolveAutoClose({ autoClose: NO_AUTO_CLOSE, hideCloseButton: true, fallback: FALLBACK_MS })).toBe(NO_AUTO_CLOSE);
+    });
+    it('autoClose 미지정이면 fallback 이 양수일 때 fallback 을 쓴다', () => {
+        expect(resolveAutoClose({ fallback: FALLBACK_MS })).toBe(FALLBACK_MS);
+        expect(resolveAutoClose({ hideCloseButton: true, fallback: FALLBACK_MS })).toBe(FALLBACK_MS);
+    });
+    it('autoClose·fallback 모두 없으면 hideCloseButton 일 때만 기본 3초를 준다', () => {
+        expect(resolveAutoClose({ hideCloseButton: true })).toBe(HIDE_CLOSE_BUTTON_AUTO_CLOSE_MS);
+        expect(resolveAutoClose({ hideCloseButton: true, fallback: NO_AUTO_CLOSE })).toBe(HIDE_CLOSE_BUTTON_AUTO_CLOSE_MS);
+        expect(resolveAutoClose({ hideCloseButton: false })).toBe(NO_AUTO_CLOSE);
+        expect(resolveAutoClose({})).toBe(NO_AUTO_CLOSE);
+    });
+});

package/dist/temp/src/utils/notification/index.d.ts

@@ -0,0 +1 @@
+export { resolveAutoClose } from './resolveAutoClose';

package/dist/temp/src/utils/notification/index.js

@@ -0,0 +1 @@
+export { resolveAutoClose } from './resolveAutoClose';

package/dist/temp/src/utils/notification/resolveAutoClose.d.ts

@@ -0,0 +1,14 @@
+interface ResolveAutoCloseParams {
+    /** 사용처가 명시한 autoClose(ms). `0`이면 자동 닫힘 없음 — 부모가 직접 닫는 용도. */
+    autoClose?: number;
+    /** floating(토스트)만 넘긴다 — 닫기 버튼이 없는 토스트가 영구히 남지 않게 기본 3초를 준다. */
+    hideCloseButton?: boolean;
+    /** 색상별 기본값 등 2순위 기본값. */
+    fallback?: number;
+}
+/**
+ * 실제 적용할 autoClose(ms)를 정한다. React·Vanilla 두 구현이 공유한다.
+ * 우선순위: 명시 `autoClose` > `fallback`(양수) > `hideCloseButton`이면 3초 > 0.
+ */
+export declare const resolveAutoClose: ({ autoClose, hideCloseButton, fallback, }: ResolveAutoCloseParams) => number;
+export {};

package/dist/temp/src/utils/notification/resolveAutoClose.js

@@ -0,0 +1,12 @@
+import { HIDE_CLOSE_BUTTON_AUTO_CLOSE_MS } from '../../../constant/notification';
+/**
+ * 실제 적용할 autoClose(ms)를 정한다. React·Vanilla 두 구현이 공유한다.
+ * 우선순위: 명시 `autoClose` > `fallback`(양수) > `hideCloseButton`이면 3초 > 0.
+ */
+export const resolveAutoClose = ({ autoClose, hideCloseButton = false, fallback = 0, }) => {
+    if (autoClose !== undefined)
+        return autoClose;
+    if (fallback > 0)
+        return fallback;
+    return hideCloseButton ? HIDE_CLOSE_BUTTON_AUTO_CLOSE_MS : 0;
+};

package/dist/types/assets/scripts/notification/const/types.d.ts

@@ -40,6 +40,13 @@ export interface BaseNotificationOptions {
     supportingText?: string;
     color?: NotificationColor;
     onClose?: () => void;
+    /**
+     * 닫기(X) 버튼 숨김 여부. `true`면 `onClose`가 있어도 X 버튼을 렌더하지 않는다.
+     * autoClose 만료 시 `onClose` 호출은 그대로 유지된다. 기본값 `false`.
+     * floating 은 `autoClose` 미지정 시 3초 뒤 자동으로 닫힌다(직접 `remove()` 로 닫으려면 `autoClose: 0` 명시).
+     * full-width · message 는 `autoClose` 를 명시했을 때만 자동으로 닫힌다.
+     */
+    hideCloseButton?: boolean;
     className?: string;
     actions?: NotificationAction[];
     autoClose?: number;

package/dist/types/assets/scripts/notification/messageTemplate.d.ts

@@ -8,6 +8,7 @@ export interface MessageTemplateParams {
     color?: NotificationColor;
     actions?: NotificationAction[];
     onClose?: () => void;
+    hideCloseButton?: boolean;
     onHidePermanently?: () => void;
     hidePermanentlyLabel?: string;
 }

package/dist/types/constant/notification.d.ts

@@ -26,3 +26,9 @@ export declare const MESSAGE_CLOSE_ICON_COLOR: {
     readonly success: string;
     readonly info: string;
 };
+/**
+ * floating(토스트)에서 `hideCloseButton`인데 `autoClose`를 지정하지 않았을 때 적용되는 자동 닫힘 시간(ms).
+ * 닫기 버튼이 없는 토스트가 영구히 남지 않게 한다 — DES-SPEC-027 §5.3 Toast Alert 3초.
+ * full-width · message 는 부모가 언마운트로 닫으므로 적용하지 않는다.
+ */
+export declare const HIDE_CLOSE_BUTTON_AUTO_CLOSE_MS = 3000;

package/dist/types/src/components/overlays/notification/FloatingNotification.d.ts

@@ -18,6 +18,13 @@ interface FloatingNotificationProps extends Omit<ComponentPropsWithoutRef<'div'>
      * 닫기 버튼 클릭 이벤트 핸들러
      */
     onClose?: () => void;
+    /**
+     * 닫기(X) 버튼 숨김 여부. `true`면 `onClose`가 있어도 X 버튼을 렌더하지 않는다.
+     * autoClose 만료·모바일 전환 시 `onClose` 호출은 그대로 유지된다.
+     * `autoClose` 미지정이면 3초 뒤 자동으로 닫힌다. 부모가 직접 언마운트하려면 `autoClose={0}`을 명시한다.
+     * @default false
+     */
+    hideCloseButton?: boolean;
     /**
      * 추가 CSS 클래스
      */
@@ -28,6 +35,7 @@ interface FloatingNotificationProps extends Omit<ComponentPropsWithoutRef<'div'>
     actions?: NotificationAction[];
     /**
      * 자동 닫기 시간 (밀리초 단위, 0이면 자동으로 닫히지 않음)
+     * 미지정 시 0. 단 `hideCloseButton`이면 3초.
      * @default 0
      */
     autoClose?: number;

package/dist/types/src/components/overlays/notification/FullWidthNotification.d.ts

@@ -18,6 +18,13 @@ interface FullWidthNotificationProps extends Omit<ComponentPropsWithoutRef<'div'
      * 닫기 버튼 클릭 이벤트 핸들러
      */
     onClose?: () => void;
+    /**
+     * 닫기(X) 버튼 숨김 여부. `true`면 `onClose`가 있어도 X 버튼을 렌더하지 않는다.
+     * autoClose 만료 시 `onClose` 호출은 그대로 유지된다.
+     * 기본 자동 닫힘은 없다 — 부모가 언마운트로 닫거나 `autoClose`를 명시한다.
+     * @default false
+     */
+    hideCloseButton?: boolean;
     /**
      * 추가 CSS 클래스
      */

package/dist/types/src/components/overlays/notification/MessageNotification.d.ts

@@ -23,6 +23,18 @@ interface MessageNotificationProps extends Omit<ComponentPropsWithoutRef<'div'>,
      * 닫기 버튼 클릭 이벤트 핸들러
      */
     onClose?: () => void;
+    /**
+     * 닫기(X) 버튼 숨김 여부. `true`면 `onClose`가 있어도 X 버튼을 렌더하지 않는다.
+     * autoClose 만료 시 `onClose` 호출은 그대로 유지된다.
+     * 기본 자동 닫힘은 없다 — 부모가 언마운트로 닫거나 `autoClose`를 명시한다.
+     * @default false
+     */
+    hideCloseButton?: boolean;
+    /**
+     * 자동 닫기 시간 (밀리초 단위, 0이면 자동으로 닫히지 않음)
+     * @default 0
+     */
+    autoClose?: number;
     /**
      * 추가 CSS 클래스
      */

package/dist/types/src/components/overlays/notification/MessageNotificationParts.d.ts

@@ -19,6 +19,7 @@ declare const MessageNotificationContent: ({ title, supportingText, supportTextL
 interface MessageNotificationActionsProps {
     actions?: NotificationAction[];
     onClose?: () => void;
+    hideCloseButton?: boolean;
     onHidePermanently?: () => void;
     hidePermanentlyLabel?: ReactNode;
     closeIconColor: string;
@@ -28,6 +29,6 @@ interface MessageNotificationActionsProps {
  * 이 컨테이너의 gap(12px)이 두 그룹 사이 간격을 만든다.
  * 표시할 요소가 하나도 없으면 빈 컨테이너를 남기지 않는다.
  */
-declare const MessageNotificationActions: ({ actions, onClose, onHidePermanently, hidePermanentlyLabel, closeIconColor, }: MessageNotificationActionsProps) => import("react/jsx-runtime").JSX.Element | null;
+declare const MessageNotificationActions: ({ actions, onClose, hideCloseButton, onHidePermanently, hidePermanentlyLabel, closeIconColor, }: MessageNotificationActionsProps) => import("react/jsx-runtime").JSX.Element | null;
 export type { MessageNotificationActionsProps, MessageNotificationContentProps };
 export { MessageNotificationActions, MessageNotificationContent };

package/dist/types/src/components/overlays/notification/Notification.d.ts

@@ -51,6 +51,18 @@ interface NotificationProps extends Omit<ComponentPropsWithoutRef<'div'>, 'title
      * 닫기 버튼 클릭 이벤트 핸들러
      */
     onClose?: () => void;
+    /**
+     * 닫기(X) 버튼 숨김 여부. floating · full-width · message 타입에서 동작한다.
+     * `true`면 `onClose`가 있어도 X 버튼을 렌더하지 않는다.
+     * autoClose 만료(및 floating의 모바일 전환) 시 `onClose` 호출은 그대로 유지되므로,
+     * "닫기 버튼 없는 자동 닫힘 토스트"(DES-SPEC-027 §5.3)에서 부모가 닫힘 시점을 받을 수 있다.
+     *
+     * floating(토스트)은 닫을 수단이 사라지지 않도록 `autoClose` 미지정 시 3초 뒤 자동으로 닫힌다
+     * (부모가 직접 언마운트해 닫으려면 `autoClose={0}` 명시). full-width · message 는 부모가 언마운트로 닫으므로
+     * `autoClose`를 명시했을 때만 자동으로 닫힌다.
+     * @default false
+     */
+    hideCloseButton?: boolean;
     /**
      * 추가 CSS 클래스
      */
@@ -62,7 +74,8 @@ interface NotificationProps extends Omit<ComponentPropsWithoutRef<'div'>, 'title
     actions?: NotificationAction[];
     /**
      * 자동 닫기 시간 (밀리초 단위, 0이면 자동으로 닫히지 않음)
-     * floating 타입에서만 동작
+     * floating, full-width, message 타입에서 동작
+     * 미지정 시 0. 단 floating 에서 `hideCloseButton`이면 3초(DES-SPEC-027 §5.3).
      * @default 0
      */
     autoClose?: number;

package/dist/types/src/components/overlays/notification/useAutoClose.d.ts

@@ -0,0 +1,15 @@
+interface UseAutoCloseParams {
+    autoClose?: number;
+    /** floating 만 넘긴다 — 닫기 버튼 없는 토스트의 기본 3초 자동 닫힘. */
+    hideCloseButton?: boolean;
+    onClose?: () => void;
+}
+/**
+ * autoClose 타이머. 만료 시 `onClose`를 호출하고 `true`(제거됨)를 반환한다.
+ * floating · full-width · message 가 공유한다.
+ *
+ * `onClose`는 매 렌더 새 함수일 수 있어 ref 로 latest 만 보관하고 deps 에서 뺀다 —
+ * 인라인 핸들러를 넘겨도 부모 리렌더마다 타이머가 리셋되지 않는다.
+ */
+export declare const useAutoClose: ({ autoClose, hideCloseButton, onClose }: UseAutoCloseParams) => boolean;
+export {};

package/dist/types/src/utils/notification/__tests__/resolveAutoClose.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/src/utils/notification/index.d.ts

@@ -0,0 +1 @@
+export { resolveAutoClose } from './resolveAutoClose';

package/dist/types/src/utils/notification/resolveAutoClose.d.ts

@@ -0,0 +1,14 @@
+interface ResolveAutoCloseParams {
+    /** 사용처가 명시한 autoClose(ms). `0`이면 자동 닫힘 없음 — 부모가 직접 닫는 용도. */
+    autoClose?: number;
+    /** floating(토스트)만 넘긴다 — 닫기 버튼이 없는 토스트가 영구히 남지 않게 기본 3초를 준다. */
+    hideCloseButton?: boolean;
+    /** 색상별 기본값 등 2순위 기본값. */
+    fallback?: number;
+}
+/**
+ * 실제 적용할 autoClose(ms)를 정한다. React·Vanilla 두 구현이 공유한다.
+ * 우선순위: 명시 `autoClose` > `fallback`(양수) > `hideCloseButton`이면 3초 > 0.
+ */
+export declare const resolveAutoClose: ({ autoClose, hideCloseButton, fallback, }: ResolveAutoCloseParams) => number;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ncds/ui-admin",
-  "version": "1.8.26-alpha.3",
+  "version": "1.8.26-alpha.5",
   "description": "nhn-commerce의 어드민 디자인 시스템입니다.",
   "scripts": {
     "barrel": "node barrel.js",