@ncds/ui-admin 1.8.26-alpha.6 → 1.8.26-alpha.8

package/dist/temp/src/components/overlays/notification/Notification.js

@@ -7,7 +7,9 @@ import { MessageNotification } from './MessageNotification';
 const Notification = forwardRef(
 // 단일 type 에만 유효한 prop 은 rest 에서 분리해 해당 분기로만 명시 전달한다.
 // rest 에 남기면 다른 type 의 하위 컴포넌트가 div 로 스프레드해 DOM 속성으로 출력된다.
-({ type = 'floating', color = 'neutral', width, supportTextLink, supportTextLinkTarget, variant, ...rest }, ref) => {
+({ type = 'floating', color = 'neutral', width, supportTextLink, supportTextLinkTarget, ...props }, ref) => {
+    // #580 에서 제거된 message `variant` 가 런타임에 넘어와도 DOM 속성으로 새지 않게 어떤 type 에도 전달하지 않는다.
+    const { variant: _variant, ...rest } = props;
     if (type === 'floating') {
         return _jsx(FloatingNotification, { color: color, ...rest, ref: ref });
     }
@@ -15,7 +17,7 @@ const Notification = forwardRef(
         return (_jsx(FullWidthNotification, { color: color, supportTextLink: supportTextLink, supportTextLinkTarget: supportTextLinkTarget, ...rest, ref: ref }));
     }
     if (type === 'message') {
-        return (_jsx(MessageNotification, { color: color, variant: variant, supportTextLink: supportTextLink, supportTextLinkTarget: supportTextLinkTarget, ...rest, ref: ref }));
+        return _jsx(MessageNotification, { color: color, ...rest, ref: ref });
     }
     if (type === 'callout') {
         // 나머지 3개 type 이 공유하는 prop 은 callout 이 지원하지 않으므로 여기서 제외한다.

package/dist/temp/src/components/overlays/notification/__tests__/MessageNotification.test.js

@@ -1,5 +1,5 @@
 // @vitest-environment jsdom
-import { InfoCircle, Pin02 } from '@ncds/ui-admin-icon';
+import { Pin02 } from '@ncds/ui-admin-icon';
 import { createElement } from 'react';
 import { createRoot } from 'react-dom/client';
 import { act } from 'react-dom/test-utils';
@@ -127,14 +127,14 @@ describe('MessageNotification (React) — DOM 구조 계약', () => {
 });
 describe('MessageNotification (React) — color="info" (#568)', () => {
     it('R-01: color="info" 는 neutral 로 폴백하지 않고 --info 수식자로 렌더한다', () => {
-        // Given/When: variant 미지정, info 색상으로 렌더하면
+        // Given/When: info 색상으로 렌더하면
         const root = renderMessageNotification({ color: 'info' }).querySelector(SELECTOR.ROOT);
         // Then: info 수식자가 있고 neutral 수식자는 없다
         expect(root?.classList.contains('ncua-message-notification--info')).toBe(true);
         expect(root?.classList.contains('ncua-message-notification--neutral')).toBe(false);
     });
     it('R-02: 기본 info 아이콘은 neutral 과 같은 Pin02 다', () => {
-        // Given/When: variant 미지정, info 색상으로 렌더하면
+        // Given/When: info 색상으로 렌더하면
         const container = renderMessageNotification({ color: 'info' });
         // Then: 아이콘 path 가 Pin02 와 같다
         const expected = iconPathD(Pin02);
@@ -142,17 +142,20 @@ describe('MessageNotification (React) — color="info" (#568)', () => {
         expect(renderedIconPathD(container)).toBe(expected);
     });
     it('R-03: info 의 FeaturedIcon 은 neutral·md 로 렌더한다 (violet 톤은 SCSS 가 덮는다)', () => {
-        // Given/When: variant 미지정, info 색상으로 렌더하면
+        // Given/When: info 색상으로 렌더하면
         const icon = renderMessageNotification({ color: 'info' }).querySelector(SELECTOR.ICON);
         // Then: FeaturedIcon 에는 info 색이 없으므로 neutral 수식자와 md 사이즈가 유지된다
         expect(icon?.classList.contains('ncua-featured-icon--neutral')).toBe(true);
         expect(icon?.classList.contains('ncua-featured-icon--md')).toBe(true);
     });
-    it('R-04: block 의 info 아이콘은 InfoCircle 을 유지한다', () => {
-        // Given/When: block 변형에 info 색상으로 렌더하면
-        const container = renderMessageNotification({ variant: 'block', color: 'info' });
-        // Then: 아이콘 path 가 InfoCircle 과 같다 (#536 회귀)
-        const expected = iconPathD(InfoCircle);
+    it('R-04: 런타임에 variant="block" 이 넘어와도 info 아이콘은 Pin02 다 (#580 Block 변형 제거)', () => {
+        // Given/When: 제거된 variant prop 을 런타임 입력으로 넘겨 info 색상으로 렌더하면
+        const container = renderMessageNotification({
+            variant: 'block',
+            color: 'info',
+        });
+        // Then: 아이콘 path 가 Pin02 와 같다
+        const expected = iconPathD(Pin02);
         expect(expected).not.toBeNull();
         expect(renderedIconPathD(container)).toBe(expected);
     });

package/dist/temp/src/components/overlays/notification/__tests__/Notification.test.js

@@ -65,6 +65,11 @@ describe('Notification — type 별 위임', () => {
         const element = render({ type, supportingText: '보조', supportTextLink: 'https://example.com' });
         expect(element?.hasAttribute('supporttextlink')).toBe(false);
     });
+    it.each(['floating', 'full-width', 'message'])('type=%s 에 제거된 variant="block" 을 주어도 DOM 속성으로 새지 않는다 (#580)', (type) => {
+        const element = render({ type, variant: 'block' });
+        expect(element).not.toBeNull();
+        expect(element?.hasAttribute('variant')).toBe(false);
+    });
     it('정의되지 않은 type 은 아무것도 렌더하지 않는다', () => {
         const element = render({ type: 'banner' });
         expect(element).toBeNull();

package/dist/temp/src/components/overlays/notification/__tests__/supportTextLink.test.js

@@ -4,7 +4,6 @@ import { createRoot } from 'react-dom/client';
 import { act } from 'react-dom/test-utils';
 import { afterEach, describe, expect, it } from 'vitest';
 import { FullWidthNotification } from '../FullWidthNotification';
-import { MessageNotification } from '../MessageNotification';
 /**
  * React 텍스트 링크(`supportTextLink`)의 프로토콜 검사 (#538 리뷰 H2).
  * Vanilla `renderSupportingText` 와 같은 정책 — unsafe URL 이면 링크 없이 텍스트만 렌더한다.
@@ -29,16 +28,6 @@ function mount(element) {
     return container;
 }
 const IMPLEMENTATIONS = [
-    [
-        'MessageNotification(block)',
-        (supportTextLink) => mount(createElement(MessageNotification, {
-            title: '공지',
-            variant: 'block',
-            supportingText: '자세히 보기',
-            supportTextLink,
-        })),
-        '.ncua-message-notification__supporting-text',
-    ],
     [
         'FullWidthNotification',
         (supportTextLink) => mount(createElement(FullWidthNotification, {