@ncds/ui-admin 1.8.28-alpha.0 → 1.8.28-alpha.1

package/dist/cjs/assets/scripts/notification/const/icons.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.SVG_ICONS = exports.MESSAGE_ICON_MAP = exports.ICON_MAP = exports.FULL_WIDTH_ICON_MAP = exports.FLOATING_ICON_MAP = void 0;
+exports.SVG_ICONS = exports.MESSAGE_ICON_MAP = exports.FULL_WIDTH_ICON_MAP = exports.FLOATING_ICON_MAP = void 0;
 // SVG 아이콘들 (크기는 동적으로 설정)
 const SVG_ICONS = exports.SVG_ICONS = {
   'pin-02': size => `<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" fill="none" viewBox="0 0 24 24" stroke="none"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8.377 15.616 2.72 21.273m8.974-14.631-1.56 1.56a2 2 0 0 1-.264.242 1 1 0 0 1-.207.111c-.082.032-.17.05-.347.085l-3.665.733c-.952.19-1.428.286-1.65.537a1 1 0 0 0-.243.8c.046.333.39.677 1.076 1.363l7.086 7.086c.686.687 1.03 1.03 1.362 1.076a1 1 0 0 0 .801-.242c.251-.223.346-.7.537-1.651l.733-3.665c.035-.176.053-.265.085-.347a1 1 0 0 1 .11-.207c.051-.072.115-.136.242-.263l1.561-1.561c.082-.082.122-.122.167-.158q.06-.047.126-.085c.05-.029.103-.051.208-.097l2.495-1.069c.727-.312 1.091-.467 1.256-.72a1 1 0 0 0 .144-.747c-.06-.295-.34-.575-.9-1.135l-5.142-5.143c-.56-.56-.84-.84-1.135-.9a1 1 0 0 0-.748.145c-.252.165-.407.529-.72 1.256l-1.068 2.495a2 2 0 0 1-.097.208 1 1 0 0 1-.085.126 2 2 0 0 1-.158.167"></path></svg>`,
@@ -28,7 +28,6 @@ const FULL_WIDTH_ICON_MAP = exports.FULL_WIDTH_ICON_MAP = {
   success: SVG_ICONS['check-circle'],
   info: SVG_ICONS['info-circle']
 };
-const ICON_MAP = exports.ICON_MAP = FULL_WIDTH_ICON_MAP;
 /** message 기본 타입 아이콘. floating 과 같은 4색에 info(neutral 과 같은 핀)를 더한다. */
 const MESSAGE_ICON_MAP = exports.MESSAGE_ICON_MAP = {
   neutral: SVG_ICONS['pin-02'],

package/dist/cjs/assets/scripts/notification/const/index.js

@@ -9,24 +9,6 @@ Object.defineProperty(exports, "CLASS_NAMES", {
     return _classNames.CLASS_NAMES;
   }
 });
-Object.defineProperty(exports, "CLOSE_BUTTON_SIZES", {
-  enumerable: true,
-  get: function () {
-    return _sizes.CLOSE_BUTTON_SIZES;
-  }
-});
-Object.defineProperty(exports, "CLOSE_BUTTON_SVG_SIZES", {
-  enumerable: true,
-  get: function () {
-    return _sizes.CLOSE_BUTTON_SVG_SIZES;
-  }
-});
-Object.defineProperty(exports, "FEATURED_ICON_SIZES", {
-  enumerable: true,
-  get: function () {
-    return _sizes.FEATURED_ICON_SIZES;
-  }
-});
 Object.defineProperty(exports, "FLOATING_ICON_MAP", {
   enumerable: true,
   get: function () {
@@ -45,18 +27,6 @@ Object.defineProperty(exports, "FULL_WIDTH_SIZES", {
     return _sizes.FULL_WIDTH_SIZES;
   }
 });
-Object.defineProperty(exports, "ICON_MAP", {
-  enumerable: true,
-  get: function () {
-    return _icons.ICON_MAP;
-  }
-});
-Object.defineProperty(exports, "ICON_PIXEL_SIZES", {
-  enumerable: true,
-  get: function () {
-    return _sizes.ICON_PIXEL_SIZES;
-  }
-});
 Object.defineProperty(exports, "MESSAGE_ICON_MAP", {
   enumerable: true,
   get: function () {

package/dist/cjs/assets/scripts/notification/const/sizes.js

@@ -3,26 +3,26 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getSizes = exports.MESSAGE_SIZES = exports.ICON_PIXEL_SIZES = exports.FULL_WIDTH_SIZES = exports.FEATURED_ICON_SIZES = exports.CLOSE_BUTTON_SVG_SIZES = exports.CLOSE_BUTTON_SIZES = void 0;
+exports.getSizes = exports.MESSAGE_SIZES = exports.FULL_WIDTH_SIZES = void 0;
 // 알림 컴포넌트 사이즈 관련 상수들
 // FeaturedIcon 사이즈
-const FEATURED_ICON_SIZES = exports.FEATURED_ICON_SIZES = {
+const FEATURED_ICON_SIZES = {
   MOBILE: 'md',
   DESKTOP: 'sm'
 };
 // SVG 아이콘 픽셀 사이즈
-const ICON_PIXEL_SIZES = exports.ICON_PIXEL_SIZES = {
+const ICON_PIXEL_SIZES = {
   MOBILE: '20',
   DESKTOP: '16',
   FULL_WIDTH: '16' // Full-width는 항상 고정
 };
 // 닫기 버튼 사이즈
-const CLOSE_BUTTON_SIZES = exports.CLOSE_BUTTON_SIZES = {
+const CLOSE_BUTTON_SIZES = {
   MOBILE: 'sm',
   DESKTOP: 'xs'
 };
 // 닫기 버튼 SVG 픽셀 사이즈
-const CLOSE_BUTTON_SVG_SIZES = exports.CLOSE_BUTTON_SVG_SIZES = {
+const CLOSE_BUTTON_SVG_SIZES = {
   xs: 16,
   sm: 20
 };

package/dist/cjs/assets/scripts/notification/index.js

@@ -7,7 +7,6 @@ var _exportNames = {
   CLASS_NAMES: true,
   FLOATING_ICON_MAP: true,
   FULL_WIDTH_ICON_MAP: true,
-  ICON_MAP: true,
   SVG_ICONS: true,
   FloatingNotification: true,
   FullWidthNotification: true,
@@ -48,12 +47,6 @@ Object.defineProperty(exports, "FullWidthNotification", {
     return _FullWidthNotification.FullWidthNotification;
   }
 });
-Object.defineProperty(exports, "ICON_MAP", {
-  enumerable: true,
-  get: function () {
-    return _const.ICON_MAP;
-  }
-});
 Object.defineProperty(exports, "MessageNotification", {
   enumerable: true,
   get: function () {

package/dist/cjs/assets/scripts/shared/ButtonCloseX.js

@@ -4,28 +4,29 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ButtonCloseX = ButtonCloseX;
-exports.X_CLOSE_SVG = exports.SVG_SIZE = void 0;
 // 공통 X버튼 로직 (React ButtonCloseX 컴포넌트와 동일한 구조)
 // React ButtonCloseX와 동일한 SVG 사이즈 매핑
-const SVG_SIZE = exports.SVG_SIZE = {
+const SVG_SIZE = {
   xs: 16,
   sm: 20,
   md: 20,
   lg: 24
 };
+// 버튼 id 난수 — 36진수 문자열에서 '0.' 뒤 9자리를 쓴다
+const BUTTON_ID_RADIX = 36;
+const BUTTON_ID_LENGTH = 9;
 // X버튼 SVG 아이콘
 const X_CLOSE_SVG = size => `<svg width="${size}" height="${size}" fill="none" viewBox="0 0 24 24" stroke="currentColor">
     <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
   </svg>`;
 // X버튼 렌더링 유틸리티 (React ButtonCloseX와 동일한 인터페이스)
-exports.X_CLOSE_SVG = X_CLOSE_SVG;
 function ButtonCloseX(size) {
   let theme = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'light';
   let additionalClasses = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
   let ariaLabel = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '닫기';
   let onClick = arguments.length > 4 ? arguments[4] : undefined;
   const svgSize = SVG_SIZE[size];
-  const buttonId = `close-btn-${Math.random().toString(36).substr(2, 9)}`;
+  const buttonId = `close-btn-${Math.random().toString(BUTTON_ID_RADIX).substr(2, BUTTON_ID_LENGTH)}`;
   const buttonHTML = `
     <button type="button" id="${buttonId}" class="ncua-button-close-x ncua-button-close-x--${size} ncua-button-close-x--${theme} ${additionalClasses}" aria-label="${ariaLabel}">
       ${X_CLOSE_SVG(svgSize.toString())}

package/dist/cjs/assets/scripts/tooltip/const/classNames.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CLASS_NAMES = void 0;
+// Tooltip CSS 클래스명 상수들
+const CLASS_NAMES = exports.CLASS_NAMES = {
+  // 기본 클래스
+  TOOLTIP: 'ncua-tooltip',
+  TOOLTIP_ICON: 'ncua-tooltip__icon',
+  TOOLTIP_BG: 'ncua-tooltip__bg',
+  TOOLTIP_TITLE: 'ncua-tooltip__title',
+  TOOLTIP_CONTENT: 'ncua-tooltip__content',
+  TOOLTIP_CLOSE_BUTTON: 'ncua-tooltip__close-button',
+  // 수정자 클래스 (modifier classes)
+  TOOLTIP_HIDDEN_ARROW: 'ncua-tooltip--hidden-arrow',
+  TOOLTIP_STROKE: 'ncua-tooltip--stroke',
+  TOOLTIP_AUTO: 'ncua-tooltip--auto',
+  // 배경 상태 클래스
+  TOOLTIP_BG_VISIBLE: 'ncua-tooltip__bg--visible',
+  TOOLTIP_BG_MEASURING: 'ncua-tooltip__bg--measuring',
+  TOOLTIP_BG_FORCE_HIDDEN: 'ncua-tooltip__bg--force-hidden',
+  // 레이어 관련 클래스
+  TOOLTIP_GLOBAL_LAYER: 'ncua-tooltip-global-layer',
+  TOOLTIP_PANEL: 'ncua-tooltip-panel',
+  // 버튼 클래스
+  BUTTON_CLOSE_X: 'ncua-button-close-x'
+};

package/dist/cjs/assets/scripts/tooltip/const/constants.js

@@ -0,0 +1,58 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Z_INDEX = exports.VIEWPORT_MARGIN = exports.TRANSITION_DURATION = exports.TOOLTIP_OFFSET = exports.TOOLTIP_DEFAULT_VALUE = exports.POSITION_PRIORITY = exports.POSITION = exports.OPACITY = exports.OFFSCREEN_POSITION = exports.MARGIN = exports.ICON_SIZES = exports.EVENT_OPTIONS = exports.DEFAULT_TOOLTIP_WIDTH = exports.DEFAULT_TOOLTIP_HEIGHT = void 0;
+const MARGIN = exports.MARGIN = 10;
+const DEFAULT_TOOLTIP_WIDTH = exports.DEFAULT_TOOLTIP_WIDTH = 200;
+const DEFAULT_TOOLTIP_HEIGHT = exports.DEFAULT_TOOLTIP_HEIGHT = 60;
+const POSITION_PRIORITY = exports.POSITION_PRIORITY = ['bottom', 'top', 'right', 'left'];
+// 툴팁 위치 계산 관련 상수
+const TOOLTIP_OFFSET = exports.TOOLTIP_OFFSET = 8; // 툴팁과 앵커 사이의 거리
+const VIEWPORT_MARGIN = exports.VIEWPORT_MARGIN = 8; // 뷰포트 경계와의 최소 거리
+// 아이콘 크기 상수
+const ICON_SIZES = exports.ICON_SIZES = {
+  sm: 14,
+  md: 16
+};
+// 애니메이션 관련 상수
+const TRANSITION_DURATION = exports.TRANSITION_DURATION = '0.18s';
+const OFFSCREEN_POSITION = exports.OFFSCREEN_POSITION = '-99999px';
+// 툴팁 상태 관련 상수
+const OPACITY = exports.OPACITY = {
+  HIDDEN: '0',
+  VISIBLE: '1'
+};
+const POSITION = exports.POSITION = {
+  INITIAL: '0px',
+  OFFSCREEN: OFFSCREEN_POSITION
+};
+// z-index 관련 상수
+// SCSS 토큰 `--z-index-tooltip`(base/_custom-variable.scss)과 동기 유지 — 변경 시 양쪽 같이 수정
+const Z_INDEX = exports.Z_INDEX = {
+  TOOLTIP_LAYER: 2000 // 툴팁 전역 레이어 기본 z-index (고도몰 기준)
+};
+// 이벤트 관련 상수
+const EVENT_OPTIONS = exports.EVENT_OPTIONS = {
+  PASSIVE: {
+    passive: true
+  },
+  ONCE: {
+    once: true
+  }
+};
+const TOOLTIP_DEFAULT_VALUE = exports.TOOLTIP_DEFAULT_VALUE = {
+  tooltipType: 'white',
+  iconType: 'stroke',
+  position: 'auto',
+  size: 'sm',
+  hideArrow: false,
+  title: '',
+  content: '',
+  type: 'short',
+  zIndex: Z_INDEX.TOOLTIP_LAYER,
+  useShadowDOM: false,
+  className: '',
+  iconColor: 'var(--gray-300)' // React Tooltip의 iconColor 기본값과 동일
+};

package/dist/cjs/assets/scripts/tooltip/const/icons.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SVG_ICONS = void 0;
+// SVG 아이콘들
+const SVG_ICONS = exports.SVG_ICONS = {
+  'help-circle-stroke': size => `<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" fill="none" viewBox="0 0 24 24" stroke="none">
+      <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3m.08 4h.01M22 12c0 5.523-4.477 10-10 10S2 17.523 2 12 6.477 2 12 2s10 4.477 10 10"></path>
+    </svg>`,
+  'help-circle-fill': size => `<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" fill="none" viewBox="0 0 24 24" stroke="none">
+      <path fill="currentColor" fill-rule="evenodd" d="M12 1C5.925 1 1 5.925 1 12s4.925 11 11 11 11-4.925 11-11S18.075 1 12 1m-1.093 7.271a2 2 0 0 1 3.013 1.727V10c0 .47-.365.958-1.055 1.418a6 6 0 0 1-1.262.634 1 1 0 0 0 .633 1.897l.169-.061a8.05 8.05 0 0 0 1.57-.806c.81-.54 1.944-1.55 1.945-3.081a4 4 0 0 0-7.773-1.333 1 1 0 0 0 1.886.664 2 2 0 0 1 .874-1.06M12 16a1 1 0 1 0 0 2h.01a1 1 0 0 0 0-2z" clip-rule="evenodd"></path>
+    </svg>`
+};

package/dist/cjs/assets/scripts/tooltip/const/index.js

@@ -0,0 +1,117 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "CLASS_NAMES", {
+  enumerable: true,
+  get: function () {
+    return _classNames.CLASS_NAMES;
+  }
+});
+Object.defineProperty(exports, "CSS_TEMPLATES", {
+  enumerable: true,
+  get: function () {
+    return _templates.CSS_TEMPLATES;
+  }
+});
+Object.defineProperty(exports, "DEFAULT_TOOLTIP_HEIGHT", {
+  enumerable: true,
+  get: function () {
+    return _constants.DEFAULT_TOOLTIP_HEIGHT;
+  }
+});
+Object.defineProperty(exports, "DEFAULT_TOOLTIP_WIDTH", {
+  enumerable: true,
+  get: function () {
+    return _constants.DEFAULT_TOOLTIP_WIDTH;
+  }
+});
+Object.defineProperty(exports, "EVENT_OPTIONS", {
+  enumerable: true,
+  get: function () {
+    return _constants.EVENT_OPTIONS;
+  }
+});
+Object.defineProperty(exports, "FALLBACK_ICON_SVG", {
+  enumerable: true,
+  get: function () {
+    return _templates.FALLBACK_ICON_SVG;
+  }
+});
+Object.defineProperty(exports, "HTML_TEMPLATES", {
+  enumerable: true,
+  get: function () {
+    return _templates.HTML_TEMPLATES;
+  }
+});
+Object.defineProperty(exports, "ICON_SIZES", {
+  enumerable: true,
+  get: function () {
+    return _constants.ICON_SIZES;
+  }
+});
+Object.defineProperty(exports, "MARGIN", {
+  enumerable: true,
+  get: function () {
+    return _constants.MARGIN;
+  }
+});
+Object.defineProperty(exports, "OFFSCREEN_POSITION", {
+  enumerable: true,
+  get: function () {
+    return _constants.OFFSCREEN_POSITION;
+  }
+});
+Object.defineProperty(exports, "OPACITY", {
+  enumerable: true,
+  get: function () {
+    return _constants.OPACITY;
+  }
+});
+Object.defineProperty(exports, "POSITION", {
+  enumerable: true,
+  get: function () {
+    return _constants.POSITION;
+  }
+});
+Object.defineProperty(exports, "POSITION_PRIORITY", {
+  enumerable: true,
+  get: function () {
+    return _constants.POSITION_PRIORITY;
+  }
+});
+Object.defineProperty(exports, "SVG_ICONS", {
+  enumerable: true,
+  get: function () {
+    return _icons.SVG_ICONS;
+  }
+});
+Object.defineProperty(exports, "TOOLTIP_DEFAULT_VALUE", {
+  enumerable: true,
+  get: function () {
+    return _constants.TOOLTIP_DEFAULT_VALUE;
+  }
+});
+Object.defineProperty(exports, "TOOLTIP_OFFSET", {
+  enumerable: true,
+  get: function () {
+    return _constants.TOOLTIP_OFFSET;
+  }
+});
+Object.defineProperty(exports, "VIEWPORT_MARGIN", {
+  enumerable: true,
+  get: function () {
+    return _constants.VIEWPORT_MARGIN;
+  }
+});
+Object.defineProperty(exports, "Z_INDEX", {
+  enumerable: true,
+  get: function () {
+    return _constants.Z_INDEX;
+  }
+});
+var _classNames = require("./classNames");
+var _constants = require("./constants");
+var _icons = require("./icons");
+var _templates = require("./templates");

package/dist/cjs/assets/scripts/tooltip/const/templates.js

@@ -0,0 +1,67 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HTML_TEMPLATES = exports.FALLBACK_ICON_SVG = exports.CSS_TEMPLATES = void 0;
+var _constants = require("./constants");
+/**
+ * 툴팁 관련 CSS 및 HTML 템플릿
+ */
+// CSS 템플릿
+const CSS_TEMPLATES = exports.CSS_TEMPLATES = {
+  // 레이어 컨테이너 스타일 (클릭 통과)
+  LAYER_CONTAINER: zIndex => `
+    position: fixed;
+    inset: 0;
+    pointer-events: none;
+    z-index: ${zIndex};
+    display: block;
+  `,
+  // 툴팁 패널 스타일 (클릭 허용)
+  TOOLTIP_PANEL: zIndex => `
+    position: fixed;
+    left: ${_constants.OFFSCREEN_POSITION}; 
+    top: ${_constants.OFFSCREEN_POSITION};
+    opacity: 0;
+    transition: opacity ${_constants.TRANSITION_DURATION} ease;
+    pointer-events: auto;
+    z-index: ${zIndex};
+    right: auto;
+    bottom: auto;
+    transform: none;
+  `,
+  // 앵커 래퍼 스타일
+  ANCHOR_WRAPPER: `
+    display: inline-flex;
+    vertical-align: middle;
+    margin: 0 4px;
+  `,
+  // Shadow DOM 기본 스타일
+  // Shadow boundary는 스타일 격리하지만 CSS 커스텀 프로퍼티는 통과하므로 host 변수를 그대로 참조 가능
+  SHADOW_DOM_HOST: `
+    :host {
+      all: unset;
+      display: block;
+      font-family: var(--font-families-commerce-sans, system-ui);
+      color: black;
+    }
+  `
+};
+// HTML 템플릿
+const HTML_TEMPLATES = exports.HTML_TEMPLATES = {
+  // 아이콘 래퍼
+  ICON_WRAPPER: (className, iconSvg) => `<span class="${className}">${iconSvg}</span>`,
+  // 툴팁 제목
+  TOOLTIP_TITLE: (className, title) => `<span class="${className}">${title}</span>`,
+  // 툴팁 콘텐츠 (일반)
+  TOOLTIP_CONTENT: (className, content) => `<span class="${className}">${content}</span>`,
+  // 툴팁 콘텐츠 (Shadow DOM)
+  TOOLTIP_CONTENT_SHADOW: className => `<span class="${className}" data-shadow-content></span>`
+};
+// 폴백 아이콘 SVG
+const FALLBACK_ICON_SVG = size => `<svg width="${size}" height="${size}" viewBox="0 0 16 16" aria-hidden="true">
+    <circle cx="8" cy="8" r="7" stroke="currentColor" fill="none"/>
+    <text x="8" y="11" font-size="8" text-anchor="middle" fill="currentColor">?</text>
+  </svg>`;
+exports.FALLBACK_ICON_SVG = FALLBACK_ICON_SVG;

package/dist/cjs/assets/scripts/tooltip/const/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/assets/scripts/utils/sanitize.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.sanitizeHtml = sanitizeHtml;
-exports.setSafeInnerHTML = setSafeInnerHTML;
 var _dompurify = _interopRequireDefault(require("dompurify"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /**
@@ -24,16 +23,4 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  */
 function sanitizeHtml(dirty) {
   return _dompurify.default.sanitize(dirty);
-}
-/**
- * 엘리먼트에 콘텐츠를 안전하게 설정한다.
- * - string: sanitize 후 innerHTML 교체
- * - HTMLElement: 기존 자식 제거 후 appendChild
- */
-function setSafeInnerHTML(element, content) {
-  if (content instanceof HTMLElement) {
-    element.replaceChildren(content);
-    return;
-  }
-  element.innerHTML = sanitizeHtml(content);
 }

package/dist/cjs/src/__tests__/helpers/dom.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.mustQuery = mustQuery;
+/** 셀렉터에 맞는 첫 요소. 없으면 셀렉터를 담아 던져 실패 위치를 바로 보여 준다. */
+function mustQuery(root, selector) {
+  const element = root.querySelector(selector);
+  if (!element) {
+    throw new Error(`요소를 찾지 못함: ${selector}`);
+  }
+  return element;
+}

package/dist/cjs/src/__tests__/helpers/fileInput.js

@@ -0,0 +1,92 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.selectFiles = exports.mockObjectUrls = exports.lastFilesOf = exports.indexesIn = exports.fileInputOf = exports.createFileFactory = exports.browseButton = exports.DUMMY_FILE_BYTES = void 0;
+var _vitest = require("vitest");
+// 파일 첨부 테스트 공용 헬퍼 — vanilla(assets/scripts/imageFileInput) · React(file-input · image-file-input) 가 함께 쓴다.
+// React 전용 act 감싸기는 selectFiles 의 dispatch 인자로 받아 이 모듈은 React 에 의존하지 않는다.
+
+/** 내용은 검증 대상이 아니므로 최소 크기만 채운다 */
+const DUMMY_FILE_BYTES = exports.DUMMY_FILE_BYTES = 4;
+/** 파일마다 type 등 속성이 달라 팩토리로 받는다 — 반환 함수는 (이름, 크기) 만 받는다 */
+const createFileFactory = properties => function (name) {
+  let size = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DUMMY_FILE_BYTES;
+  return new File([new Uint8Array(size)], name, properties);
+};
+/**
+ * URL.createObjectURL · revokeObjectURL 을 테스트마다 새 목으로 바꾸고 끝나면 원복한다.
+ * 모듈 최상위에서 호출해 beforeEach · afterEach 를 등록한다. 발급 URL 은 테스트마다 blob:mock/1 부터 센다.
+ */
+// 반환 타입을 적지 않으면 NPM 빌드(declaration: true)가 vi.fn 의 타입을 pnpm 내부 경로로만 이름 붙일 수 있어 TS2742 로 실패한다
+exports.createFileFactory = createFileFactory;
+const mockObjectUrls = () => {
+  const originalCreateObjectURL = URL.createObjectURL;
+  const originalRevokeObjectURL = URL.revokeObjectURL;
+  const createObjectURL = _vitest.vi.fn();
+  const revokeObjectURL = _vitest.vi.fn();
+  (0, _vitest.beforeEach)(() => {
+    let issued = 0;
+    createObjectURL.mockReset().mockImplementation(() => `blob:mock/${++issued}`);
+    revokeObjectURL.mockReset();
+    URL.createObjectURL = createObjectURL;
+    URL.revokeObjectURL = revokeObjectURL;
+  });
+  (0, _vitest.afterEach)(() => {
+    URL.createObjectURL = originalCreateObjectURL;
+    URL.revokeObjectURL = originalRevokeObjectURL;
+  });
+  return {
+    createObjectURL,
+    revokeObjectURL
+  };
+};
+exports.mockObjectUrls = mockObjectUrls;
+const fileInputOf = scope => {
+  const input = scope.querySelector('input[type="file"]');
+  if (!input) throw new Error('file input을 찾지 못했습니다');
+  return input;
+};
+exports.fileInputOf = fileInputOf;
+const browseButton = scope => {
+  const button = scope.querySelector('.ncua-file-input__input-container button.ncua-btn');
+  if (!button) throw new Error('찾기 버튼을 찾지 못했습니다');
+  return button;
+};
+/**
+ * jsdom 에는 파일 선택 UI 가 없어 files 를 직접 정의한 뒤 change 를 발생시킨다.
+ * React 는 상태 갱신을 반영하도록 dispatch 에 act 를 넘긴다.
+ */
+exports.browseButton = browseButton;
+const selectFiles = function (scope, filesToSelect) {
+  let dispatch = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : fire => fire();
+  const input = fileInputOf(scope);
+  const value = filesToSelect === null ? null : {
+    ...filesToSelect,
+    length: filesToSelect.length,
+    item: index => filesToSelect[index] ?? null,
+    [Symbol.iterator]: function* () {
+      yield* filesToSelect;
+    }
+  };
+  Object.defineProperty(input, 'files', {
+    configurable: true,
+    value
+  });
+  dispatch(() => {
+    input.dispatchEvent(new Event('change', {
+      bubbles: true
+    }));
+  });
+};
+/**
+ * actual 의 각 File 이 expected 의 몇 번째 인스턴스인지 (없으면 -1).
+ * 이 환경에서 File 은 열거 가능한 own 속성이 없어 서로 다른 File 도 toEqual 이 통과하므로 동일성으로 비교한다.
+ */
+exports.selectFiles = selectFiles;
+const indexesIn = (expected, actual) => actual.map(file => expected.indexOf(file));
+/** 목(mock) 의 마지막 호출에서 첫 인자(File[])를 꺼낸다 — 호출이 없으면 빈 배열 */
+exports.indexesIn = indexesIn;
+const lastFilesOf = mock => mock.mock.lastCall?.[0] ?? [];
+exports.lastFilesOf = lastFilesOf;

package/dist/cjs/src/__tests__/helpers/fixedToday.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useFixedToday = exports.FIXED_TODAY = void 0;
+var _vitest = require("vitest");
+/** 2026-10-21 (수) 정오 — 자정 경계 영향을 받지 않도록 정오로 둔다 */
+const FIXED_TODAY = exports.FIXED_TODAY = new Date('2026-10-21T12:00:00');
+/** Date 만 가짜로 고정한다 — flatpickr 내부 타이머는 실제로 흐른다. 해제는 호출 측 afterEach 의 vi.useRealTimers() */
+const useFixedToday = () => {
+  _vitest.vi.useFakeTimers({
+    toFake: ['Date']
+  });
+  _vitest.vi.setSystemTime(FIXED_TODAY);
+};
+exports.useFixedToday = useFixedToday;

package/dist/cjs/src/__tests__/helpers/matchMedia.js

@@ -0,0 +1,50 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.installMatchMedia = installMatchMedia;
+const dispatchDirectly = dispatchToListeners => dispatchToListeners();
+/**
+ * jsdom 에 없는 matchMedia 를 change 리스너를 보관하는 가짜로 바꾼다.
+ * 원본 복원 함수는 `cleanups` 에 넣으므로 호출 측 afterEach 가 되돌린다.
+ */
+function installMatchMedia(cleanups, initial) {
+  let dispatch = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : dispatchDirectly;
+  const listeners = new Set();
+  let matches = initial;
+  const hadOwn = Object.hasOwn(window, 'matchMedia');
+  const original = window.matchMedia;
+  window.matchMedia = query => ({
+    get matches() {
+      return matches;
+    },
+    media: query,
+    onchange: null,
+    addEventListener: (_type, listener) => listeners.add(listener),
+    removeEventListener: (_type, listener) => listeners.delete(listener),
+    addListener: () => undefined,
+    removeListener: () => undefined,
+    dispatchEvent: () => false
+  });
+  cleanups.push(() => {
+    if (hadOwn) {
+      window.matchMedia = original;
+    } else {
+      Reflect.deleteProperty(window, 'matchMedia');
+    }
+  });
+  return {
+    fire: next => {
+      matches = next;
+      dispatch(() => {
+        for (const listener of Array.from(listeners)) {
+          listener({
+            matches: next
+          });
+        }
+      });
+    },
+    listenerCount: () => listeners.size
+  };
+}

package/dist/cjs/src/__tests__/helpers/rect.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.toRect = void 0;
+/** jsdom 은 레이아웃이 없어 getBoundingClientRect 가 전부 0 이다 — 테스트가 쓸 좌표만 채운 DOMRect 를 만든다. */
+const toRect = rect => {
+  const resolved = {
+    top: 0,
+    bottom: 0,
+    left: 0,
+    right: 0,
+    width: 0,
+    height: 0,
+    x: 0,
+    y: 0,
+    ...rect
+  };
+  return {
+    ...resolved,
+    toJSON: () => resolved
+  };
+};
+exports.toRect = toRect;