@ncds/ui-admin 1.4.1 → 1.5.1

package/dist/cjs/src/components/tooltip/Tooltip.js

@@ -74,22 +74,26 @@ var Tooltip = function (_a) {
     hideArrow = _f === void 0 ? false : _f,
     _g = _a.type,
     type = _g === void 0 ? 'short' : _g,
+    _h = _a.iconColor,
+    iconColor = _h === void 0 ? 'var(--gray-300)' : _h,
+    _j = _a.iconStyle,
+    iconStyle = _j === void 0 ? 'help-circle' : _j,
     className = _a.className;
   var iconSize = size === 'sm' ? 14 : 16;
   var tooltipRef = (0, _react.useRef)(null);
   var tooltipBgRef = (0, _react.useRef)(null);
-  var _h = (0, _react.useState)(position === 'auto' ? 'bottom' : position),
-    calculatedPosition = _h[0],
-    setCalculatedPosition = _h[1];
-  var _j = (0, _react.useState)(false),
-    isVisible = _j[0],
-    setIsVisible = _j[1];
-  var _k = (0, _react.useState)(false),
-    isManuallyClose = _k[0],
-    setIsManuallyClose = _k[1];
+  var _k = (0, _react.useState)(position === 'auto' ? 'bottom' : position),
+    calculatedPosition = _k[0],
+    setCalculatedPosition = _k[1];
   var _l = (0, _react.useState)(false),
-    isMeasuring = _l[0],
-    setIsMeasuring = _l[1];
+    isVisible = _l[0],
+    setIsVisible = _l[1];
+  var _m = (0, _react.useState)(false),
+    isManuallyClose = _m[0],
+    setIsManuallyClose = _m[1];
+  var _o = (0, _react.useState)(false),
+    isMeasuring = _o[0],
+    setIsMeasuring = _o[1];
   var handleMouseEnter = (0, _react.useCallback)(function () {
     if (isManuallyClose) return;
     setIsVisible(true);
@@ -137,15 +141,23 @@ var Tooltip = function (_a) {
     onMouseEnter: handleMouseEnter,
     onMouseLeave: handleMouseLeave
   }, {
-    children: [iconType === 'stroke' ? (0, _jsxRuntime.jsx)(_uiAdminIcon.HelpCircle, {
+    children: [iconStyle === 'help-circle' && (iconType === 'stroke' ? (0, _jsxRuntime.jsx)(_uiAdminIcon.HelpCircle, {
       width: iconSize,
       height: iconSize,
-      color: "var(--gray-300)"
+      color: iconColor
     }) : (0, _jsxRuntime.jsx)(_uiAdminIcon.HelpCircleFill, {
       width: iconSize,
       height: iconSize,
-      color: "var(--gray-300)"
-    }), (0, _jsxRuntime.jsxs)("span", __assign({
+      color: iconColor
+    })), iconStyle === 'alert-circle' && (iconType === 'stroke' ? (0, _jsxRuntime.jsx)(_uiAdminIcon.AlertCircle, {
+      width: iconSize,
+      height: iconSize,
+      color: iconColor
+    }) : (0, _jsxRuntime.jsx)(_uiAdminIcon.AlertCircleFill, {
+      width: iconSize,
+      height: iconSize,
+      color: iconColor
+    })), (0, _jsxRuntime.jsxs)("span", __assign({
       ref: tooltipBgRef,
       className: tooltipBgClassName
     }, {
@@ -153,12 +165,11 @@ var Tooltip = function (_a) {
         className: "ncua-tooltip__title"
       }, {
         children: title
-      })), content && (0, _jsxRuntime.jsx)("span", {
-        className: "ncua-tooltip__content",
-        dangerouslySetInnerHTML: {
-          __html: content
-        }
-      }), type === 'long' && (0, _jsxRuntime.jsx)(_ButtonCloseX.ButtonCloseX, {
+      })), content && (0, _jsxRuntime.jsx)("span", __assign({
+        className: "ncua-tooltip__content"
+      }, {
+        children: content
+      })), type === 'long' && (0, _jsxRuntime.jsx)(_ButtonCloseX.ButtonCloseX, {
         className: "ncua-tooltip__close-button",
         size: "xs",
         theme: tooltipType === 'white' ? 'dark' : 'light',

package/dist/esm/assets/scripts/comboBox.js

@@ -252,6 +252,24 @@ var ComboBox = /** @class */function () {
   ComboBox.prototype.toggleSelectAll = function () {
     this.unifiedSelectBox.toggleSelectAll();
   };
+  /**
+   * 드롭다운을 스크롤의 바닥으로 이동
+   */
+  ComboBox.prototype.scrollToBottom = function () {
+    this.unifiedSelectBox.scrollToBottom();
+  };
+  /**
+   * 전체 선택 버튼의 텍스트를 외부에서 변경
+   */
+  ComboBox.prototype.setSelectAllButtonText = function (text) {
+    this.unifiedSelectBox.setSelectAllButtonText(text);
+  };
+  /**
+   * 특정 인덱스의 옵션으로 포커스 이동
+   */
+  ComboBox.prototype.setFocusIndex = function (index) {
+    this.unifiedSelectBox.setFocusIndex(index);
+  };
   return ComboBox;
 }();
 export { ComboBox };

package/dist/esm/assets/scripts/datePicker.js

@@ -245,6 +245,19 @@ export var DatePicker = /** @class */function () {
       if (formattedInput === input) return;
       target.value = formattedInput;
     };
+    // 외부 클릭 시 시간 입력 강제 blur 처리
+    var handleMouseDown = function (e) {
+      var flatpickrCalendar = wrapper.querySelector('.flatpickr-calendar.open');
+      if (flatpickrCalendar && !flatpickrCalendar.contains(e.target)) {
+        var timeInputs = flatpickrCalendar.querySelectorAll('.flatpickr-time input');
+        timeInputs.forEach(function (input) {
+          if (document.activeElement === input) {
+            input.blur();
+          }
+        });
+      }
+    };
+    document.addEventListener('mousedown', handleMouseDown, true);
     return flatpickr(input, __assign(__assign({}, options), {
       allowInput: (_b = options.allowInput) !== null && _b !== void 0 ? _b : true,
       appendTo: wrapper,
@@ -271,6 +284,7 @@ export var DatePicker = /** @class */function () {
         input.removeEventListener('input', onInputHandler);
         input.removeEventListener('input', onHourInputHandler);
         input.removeEventListener('input', onMinuteInputHandler);
+        document.removeEventListener('mousedown', handleMouseDown, true);
       }
     }));
   };
@@ -329,19 +343,58 @@ export var DatePicker = /** @class */function () {
     var startDate = dates[0],
       endDate = dates[1];
     var datesToSet = this.datePickerOptions.map(function (option, index) {
-      var _a;
+      var _a, _b;
       var date = index === 0 ? startDate : endDate;
-      if (!date) return '';
+      if (!date || date === '0000-00-00') return '';
       var hasTime = (_a = option.options) === null || _a === void 0 ? void 0 : _a.enableTime;
-      if (!hasTime) return date;
-      if (date.includes(':')) return date;
-      var momentDate = moment(date);
-      return index === 0 ? momentDate.startOf('day').format(_this.dateFormat) : momentDate.endOf('day').format(_this.dateFormat);
+      var flatpickrFormat = ((_b = option.options) === null || _b === void 0 ? void 0 : _b.dateFormat) || (hasTime ? 'Y-m-d H:i' : 'Y-m-d');
+      // dateFormat이 설정되어 있지 않을 때만 hasTime에 따라 기본값 설정
+      // dateFormat이 설정되어 있으면 그 형식을 그대로 사용 (enableTime과 무관하게)
+      var momentFormat = _this.convertFlatpickrFormatToMoment(flatpickrFormat);
+      var momentDate;
+      if (hasTime && !date.includes(':')) {
+        // 시간이 없는 날짜 형식으로 파싱
+        momentDate = moment(date);
+        if (!momentDate.isValid()) return '';
+        return index === 0 ? momentDate.startOf('day').format(momentFormat) : momentDate.endOf('day').format(momentFormat);
+      }
+      if (hasTime && date.includes(':')) {
+        momentDate = moment(date);
+        if (!momentDate.isValid()) return '';
+        return momentDate.format(momentFormat);
+      }
+      // 시간이 없는 경우 (hasTime이 false이거나 date에 시간이 없는 경우)
+      momentDate = moment(date);
+      if (!momentDate.isValid()) {
+        momentDate = moment(date, momentFormat, true);
+      }
+      // 둘 다 실패하면 다른 일반적인 형식들로 시도
+      if (!momentDate.isValid()) {
+        momentDate = moment(date, [momentFormat, 'YYYY-MM-DD', 'YYYY/MM/DD', 'MM/DD/YYYY'], true);
+      }
+      if (!momentDate.isValid()) return '';
+      // dateFormat 형식으로 포맷팅하여 반환 (flatpickr가 표시하는 형식과 일치)
+      return momentDate.format(momentFormat);
     });
-    var period = moment(endDate).diff(moment(startDate), 'days');
+    var period = datesToSet[0] && datesToSet[1] ? moment(datesToSet[1]).diff(moment(datesToSet[0]), 'days') : null;
     this.updateButtonsByPeriod(period);
     this.setMultipleDates(datesToSet);
   };
+  // flatpickr 형식을 moment 형식으로 변환하는 헬퍼 메서드
+  DatePicker.prototype.convertFlatpickrFormatToMoment = function (flatpickrFormat) {
+    var map = {
+      Y: 'YYYY',
+      y: 'YY',
+      m: 'MM',
+      d: 'DD',
+      H: 'HH',
+      i: 'mm',
+      S: 'ss'
+    };
+    return flatpickrFormat.replace(/[YymdHiS]/g, function (matched) {
+      return map[matched] || matched;
+    });
+  };
   DatePicker.prototype.getDates = function () {
     var _this = this;
     return this.flatpickrInstances.map(function (instance) {

package/dist/esm/assets/scripts/imageFileInput/ImageFileInputModel.js

@@ -174,36 +174,23 @@ var ImageFileInputModel = /** @class */function () {
     var validFiles = [];
     var invalidFiles = [];
     var currentFiles = this.getFiles();
-    var _loop_1 = function (file) {
-      // 중복 체크
-      if (currentFiles.some(function (f) {
-        return f.name === file.name && f.size === file.size;
-      })) {
-        invalidFiles.push(__assign(__assign({}, file), {
-          errorType: ImageFileInputErrorType.ALREADY_UPLOADED
-        }));
-        return "continue";
-      }
+    for (var _i = 0, fileList_1 = fileList; _i < fileList_1.length; _i++) {
+      var file = fileList_1[_i];
       // 파일 크기 체크
-      if (this_1.options.maxFileSize && file.size > this_1.options.maxFileSize) {
+      if (this.options.maxFileSize && file.size > this.options.maxFileSize) {
         invalidFiles.push(__assign(__assign({}, file), {
           errorType: ImageFileInputErrorType.EXCEED_MAX_FILE_SIZE
         }));
-        return "continue";
+        continue;
       }
       // 파일 개수 체크 (maxFileCount가 1이면 교체 가능하므로 체크하지 않음)
-      if (this_1.options.maxFileCount && this_1.options.maxFileCount !== 1 && currentFiles.length + validFiles.length >= this_1.options.maxFileCount) {
+      if (this.options.maxFileCount && this.options.maxFileCount !== 1 && currentFiles.length + validFiles.length >= this.options.maxFileCount) {
         invalidFiles.push(__assign(__assign({}, file), {
           errorType: ImageFileInputErrorType.EXCEED_MAX_FILE_COUNT
         }));
-        return "continue";
+        continue;
       }
       validFiles.push(file);
-    };
-    var this_1 = this;
-    for (var _i = 0, fileList_1 = fileList; _i < fileList_1.length; _i++) {
-      var file = fileList_1[_i];
-      _loop_1(file);
     }
     return {
       validFiles: validFiles,

package/dist/esm/assets/scripts/notification/MessageNotification.js

@@ -0,0 +1,141 @@
+var __assign = this && this.__assign || function () {
+  __assign = Object.assign || function (t) {
+    for (var s, i = 1, n = arguments.length; i < n; i++) {
+      s = arguments[i];
+      for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+    }
+    return t;
+  };
+  return __assign.apply(this, arguments);
+};
+import { SVG_ICONS, CLASS_NAMES, FLOATING_ICON_MAP, MESSAGE_SIZES } from './const';
+import { FeaturedIcon } from '../featuredIcon';
+import { createWrapperElement, renderSupportingText, renderActions, bindNotificationEvents, setupAutoClose } from './utils';
+var MessageNotification = /** @class */function () {
+  function MessageNotification(options) {
+    this.options = __assign({
+      color: 'neutral',
+      className: '',
+      actions: [],
+      autoClose: 0,
+      supportingText: undefined
+    }, options);
+    this.element = this.createElement();
+    this.bindEvents();
+    this.setupAutoClose();
+  }
+  MessageNotification.prototype.createElement = function () {
+    var _a = this.options,
+      title = _a.title,
+      supportingText = _a.supportingText,
+      color = _a.color,
+      className = _a.className,
+      actions = _a.actions,
+      onClose = _a.onClose,
+      onHidePermanently = _a.onHidePermanently;
+    // message 타입은 neutral, error, warning, success 4가지 색상만 지원
+    var actualColor = color;
+    if (color === 'info') {
+      console.warn('Message notification does not support "info" color. Using "neutral" instead.');
+      actualColor = 'neutral';
+    }
+    var wrapper = createWrapperElement(CLASS_NAMES.MESSAGE.BASE, actualColor, className);
+    var iconFunction = FLOATING_ICON_MAP[actualColor];
+    // FeaturedIcon 생성
+    var featuredIconElement = null;
+    if (iconFunction) {
+      var iconSvg = iconFunction(MESSAGE_SIZES.ICON_PIXEL);
+      this.featuredIcon = FeaturedIcon.create({
+        svgString: iconSvg,
+        theme: 'light-circle',
+        color: actualColor,
+        size: MESSAGE_SIZES.FEATURED_ICON
+      });
+      featuredIconElement = this.featuredIcon.getElement();
+    }
+    wrapper.innerHTML = this.buildTemplate({
+      title: title,
+      supportingText: supportingText,
+      actions: actions,
+      onClose: onClose,
+      onHidePermanently: onHidePermanently
+    });
+    // FeaturedIcon을 content-wrapper에 추가
+    if (featuredIconElement) {
+      var contentWrapper = wrapper.querySelector(".".concat(CLASS_NAMES.MESSAGE.CONTENT_WRAPPER));
+      if (contentWrapper) {
+        contentWrapper.insertBefore(featuredIconElement, contentWrapper.firstChild);
+      }
+    }
+    return wrapper;
+  };
+  MessageNotification.prototype.buildTemplate = function (params) {
+    var title = params.title,
+      supportingText = params.supportingText,
+      actions = params.actions,
+      onClose = params.onClose,
+      onHidePermanently = params.onHidePermanently;
+    return "\n      <div class=\"".concat(CLASS_NAMES.MESSAGE.CONTAINER, "\">\n        <div class=\"").concat(CLASS_NAMES.MESSAGE.CONTENT, "\">\n          <div class=\"").concat(CLASS_NAMES.MESSAGE.CONTENT_WRAPPER, "\">\n            <div class=\"").concat(CLASS_NAMES.MESSAGE.TEXT_CONTAINER, "\">\n              <span class=\"").concat(CLASS_NAMES.MESSAGE.TITLE, "\">").concat(title, "</span>\n              ").concat(renderSupportingText(supportingText, CLASS_NAMES.MESSAGE.SUPPORTING_TEXT), "\n            </div>\n          </div>\n          <div class=\"").concat(CLASS_NAMES.MESSAGE.ACTIONS_CONTAINER, "\">\n            ").concat(actions && actions.length > 0 ? renderActions(actions, CLASS_NAMES.MESSAGE.ACTIONS) : '', "\n          </div>\n          <div class=\"").concat(CLASS_NAMES.MESSAGE.ACTIONS_CONTAINER, "\">\n            ").concat(this.renderHidePermanentlyButton(onHidePermanently), "\n            ").concat(this.renderCloseButton(onClose), "\n          </div>\n        </div>\n      </div>\n    ");
+  };
+  MessageNotification.prototype.renderHidePermanentlyButton = function (onHidePermanently) {
+    if (!onHidePermanently) return '';
+    return "\n      <button type=\"button\" class=\"".concat(CLASS_NAMES.COMMON.ACTION_BUTTON, " ").concat(CLASS_NAMES.COMMON.ACTION_BUTTON, "--text ").concat(CLASS_NAMES.MESSAGE.HIDE_LINK, "\" data-hide-permanently=\"true\">\n        \uB2E4\uC2DC \uBCF4\uC9C0 \uC54A\uAE30\n      </button>\n    ");
+  };
+  MessageNotification.prototype.renderCloseButton = function (onClose) {
+    if (!onClose) return '';
+    return "\n      <button type=\"button\" class=\"".concat(CLASS_NAMES.MESSAGE.CLOSE_BUTTON, "\" aria-label=\"\uC54C\uB9BC \uB2EB\uAE30\">\n        ").concat(SVG_ICONS['x-close'](MESSAGE_SIZES.CLOSE_BUTTON).replace('stroke="currentColor"', "stroke=\"#2F2F30\""), "\n      </button>\n    ");
+  };
+  MessageNotification.prototype.bindEvents = function () {
+    var _this = this;
+    bindNotificationEvents(this.element, this.options.actions, this.options.onClose, function () {
+      return _this.remove();
+    });
+    // 다시보지 않기 버튼 이벤트 바인딩
+    if (this.options.onHidePermanently) {
+      var hidePermanentlyButton = this.element.querySelector('[data-hide-permanently="true"]');
+      if (hidePermanentlyButton) {
+        hidePermanentlyButton.addEventListener('click', function () {
+          var _a, _b;
+          (_b = (_a = _this.options).onHidePermanently) === null || _b === void 0 ? void 0 : _b.call(_a);
+          _this.remove();
+        });
+      }
+    }
+  };
+  MessageNotification.prototype.setupAutoClose = function () {
+    var _this = this;
+    this.autoCloseTimer = setupAutoClose(this.options.autoClose, this.options.onClose, function () {
+      return _this.remove();
+    });
+  };
+  // Public methods
+  MessageNotification.prototype.getElement = function () {
+    return this.element;
+  };
+  MessageNotification.prototype.appendTo = function (parent) {
+    parent.appendChild(this.element);
+  };
+  MessageNotification.prototype.remove = function () {
+    if (this.autoCloseTimer) {
+      clearTimeout(this.autoCloseTimer);
+      this.autoCloseTimer = undefined;
+    }
+    if (this.element && this.element.parentNode) {
+      this.element.parentNode.removeChild(this.element);
+    }
+  };
+  MessageNotification.prototype.destroy = function () {
+    // FeaturedIcon 정리
+    if (this.featuredIcon) {
+      this.featuredIcon.destroy();
+      this.featuredIcon = undefined;
+    }
+    this.remove();
+  };
+  // Static factory methods
+  MessageNotification.create = function (options) {
+    return new MessageNotification(options);
+  };
+  return MessageNotification;
+}();
+export { MessageNotification };

package/dist/esm/assets/scripts/notification/Notification.js

@@ -18,16 +18,19 @@ var __rest = this && this.__rest || function (s, e) {
 };
 import { FullWidthNotification } from './FullWidthNotification';
 import { FloatingNotification } from './FloatingNotification';
+import { MessageNotification } from './MessageNotification';
 // 통합 Notification 클래스
 var Notification = /** @class */function () {
   function Notification(options) {
     var _a = options.type,
       type = _a === void 0 ? 'floating' : _a,
       baseOptions = __rest(options, ["type"]);
-    if (type === 'floating') {
-      this.instance = new FloatingNotification(baseOptions);
-    } else {
+    if (type === 'message') {
+      this.instance = new MessageNotification(baseOptions);
+    } else if (type === 'full-width') {
       this.instance = new FullWidthNotification(baseOptions);
+    } else {
+      this.instance = new FloatingNotification(baseOptions);
     }
   }
   // 모든 메서드를 instance에 위임

package/dist/esm/assets/scripts/notification/const/classNames.js

@@ -24,6 +24,20 @@ export var CLASS_NAMES = {
     ACTIONS: 'ncua-floating-notification__actions',
     CLOSE_BUTTON: 'ncua-floating-notification__close-button'
   },
+  MESSAGE: {
+    BASE: 'ncua-message-notification',
+    CONTAINER: 'ncua-message-notification__container',
+    CONTENT: 'ncua-message-notification__content',
+    CONTENT_WRAPPER: 'ncua-message-notification__content-wrapper',
+    ICON: 'ncua-message-notification__icon',
+    TEXT_CONTAINER: 'ncua-message-notification__text-container',
+    TITLE: 'ncua-message-notification__title',
+    SUPPORTING_TEXT: 'ncua-message-notification__supporting-text',
+    ACTIONS_CONTAINER: 'ncua-message-notification__actions-container',
+    ACTIONS: 'ncua-message-notification__actions',
+    HIDE_LINK: 'ncua-message-notification__hide-link',
+    CLOSE_BUTTON: 'ncua-message-notification__close-button'
+  },
   COMMON: {
     ACTION_BUTTON: 'ncua-notification__action-button'
   }

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

@@ -1,3 +1,4 @@
 export { SVG_ICONS, FLOATING_ICON_MAP, FULL_WIDTH_ICON_MAP, ICON_MAP } from './icons';
 export { CLASS_NAMES } from './classNames';
-export { FEATURED_ICON_SIZES, ICON_PIXEL_SIZES, CLOSE_BUTTON_SIZES, CLOSE_BUTTON_SVG_SIZES, FULL_WIDTH_SIZES, getSizes } from './sizes';
+export { FEATURED_ICON_SIZES, ICON_PIXEL_SIZES, CLOSE_BUTTON_SIZES, CLOSE_BUTTON_SVG_SIZES, FULL_WIDTH_SIZES, MESSAGE_SIZES, getSizes } from './sizes';
+export { MESSAGE_CLOSE_ICON_COLORS } from './types';

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

@@ -25,6 +25,12 @@ export var FULL_WIDTH_SIZES = {
   ICON: '16',
   CLOSE_BUTTON: '20'
 };
+// Message 알림 고정 사이즈
+export var MESSAGE_SIZES = {
+  FEATURED_ICON: 'lg',
+  ICON_PIXEL: '24',
+  CLOSE_BUTTON: '20'
+};
 // 사이즈 유틸리티 함수들
 export var getSizes = {
   featuredIcon: function (isMobile) {

package/dist/esm/assets/scripts/notification/const/types.js

@@ -1 +1,8 @@
-export {};
+// Message Notification 닫기 버튼 아이콘 색상 맵
+export var MESSAGE_CLOSE_ICON_COLORS = {
+  neutral: '#6B7280',
+  error: '#EF4444',
+  warning: '#F97316',
+  success: '#16A34A',
+  info: '#6B7280' // info는 message 타입에서 지원하지 않지만 fallback용
+};

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

@@ -1,6 +1,7 @@
 export { Notification } from './Notification';
 export { FullWidthNotification } from './FullWidthNotification';
 export { FloatingNotification } from './FloatingNotification';
+export { MessageNotification } from './MessageNotification';
 export * from './utils';
 export { SVG_ICONS, CLASS_NAMES, ICON_MAP, FLOATING_ICON_MAP, FULL_WIDTH_ICON_MAP } from './const';
 // 전역 등록 ( 추후 index.ts와 개별동작 할 수 있게끔 대비 )

package/dist/esm/assets/scripts/notification/utils.js

@@ -27,7 +27,7 @@ export function renderActions(actions, wrapperClass) {
     return '';
   }
   var buttonsHtml = actions.map(function (action) {
-    var buttonHtml = "\n      <button \n        class=\"ncua-notification__action-button ncua-notification__action-button--".concat(action.hierarchy || 'link', "\"\n        data-action=\"").concat(action.label, "-").concat(action.hierarchy, "\"\n      >\n        ").concat(action.label, "\n      </button>");
+    var buttonHtml = "\n      <button \n        class=\"ncua-btn ncua-btn--sm ncua-btn--".concat(action.hierarchy || 'text', "\"\n        data-action=\"").concat(action.label, "-").concat(action.hierarchy, "\"\n      >\n        ").concat(action.label, "\n      </button>");
     return buttonHtml;
   }).join('');
   return "<div class=\"".concat(wrapperClass, "\">").concat(buttonsHtml, "</div>");
@@ -37,13 +37,13 @@ export function bindNotificationEvents(element, actions, onClose, onRemove) {
   element.addEventListener('click', function (event) {
     var target = event.target;
     // 닫기 버튼 클릭 처리
-    if (target.matches(".".concat(CLASS_NAMES.FULL_WIDTH.CLOSE_BUTTON, ", .").concat(CLASS_NAMES.FLOATING.CLOSE_BUTTON)) || target.closest(".".concat(CLASS_NAMES.FULL_WIDTH.CLOSE_BUTTON, ", .").concat(CLASS_NAMES.FLOATING.CLOSE_BUTTON))) {
+    if (target.matches(".".concat(CLASS_NAMES.FULL_WIDTH.CLOSE_BUTTON, ", .").concat(CLASS_NAMES.FLOATING.CLOSE_BUTTON)) || target.closest(".".concat(CLASS_NAMES.FULL_WIDTH.CLOSE_BUTTON, ", .").concat(CLASS_NAMES.FLOATING.CLOSE_BUTTON)) || target.closest(".".concat(CLASS_NAMES.MESSAGE.CLOSE_BUTTON))) {
       onClose === null || onClose === void 0 ? void 0 : onClose();
       onRemove === null || onRemove === void 0 ? void 0 : onRemove();
       return;
     }
     // 액션 버튼 클릭 처리
-    var actionButton = target.closest('.ncua-notification__action-button[data-action]');
+    var actionButton = target.closest('.ncua-btn[data-action]');
     if (actionButton && actions) {
       var actionData = actionButton.getAttribute('data-action');
       if (actionData) {

package/dist/esm/assets/scripts/utils/selectbox/DropdownModel.js

@@ -284,6 +284,13 @@ var DropdownModel = /** @class */function () {
     this.updateFilteredOptions();
     this.notifyListeners(['searchValue', 'filteredOptions', 'showAllItems']);
   };
+  /**
+   * 검색어만 업데이트 (필터링 없이, API 모드용)
+   */
+  DropdownModel.prototype.updateSearchValue = function (searchValue) {
+    this.state.searchValue = searchValue;
+    this.notifyListeners(['searchValue']);
+  };
   /**
    * 드롭다운이 열릴 수 있는지 확인 (ComboBox용)
    */