@ncds/ui-admin 1.7.0 → 1.8.1

package/dist/cjs/assets/scripts/selectBox.js

@@ -6,135 +6,90 @@ Object.defineProperty(exports, "__esModule", {
 exports.SelectBox = void 0;
 var _baseBox = require("./baseBox");
 var _unifiedBoxManager = require("./utils/unifiedBox/unifiedBoxManager");
-var __extends = void 0 && (void 0).__extends || function () {
-  var extendStatics = function (d, b) {
-    extendStatics = Object.setPrototypeOf || {
-      __proto__: []
-    } instanceof Array && function (d, b) {
-      d.__proto__ = b;
-    } || function (d, b) {
-      for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p];
-    };
-    return extendStatics(d, b);
-  };
-  return function (d, b) {
-    if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-    extendStatics(d, b);
-    function __() {
-      this.constructor = d;
-    }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-  };
-}();
-var __assign = void 0 && (void 0).__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);
-};
-var SelectBox = exports.SelectBox = /** @class */function (_super) {
-  __extends(SelectBox, _super);
-  function SelectBox(element, config) {
-    if (config === void 0) {
-      config = {};
-    }
-    var _this = this;
-    var _a, _b, _c, _d, _e, _f;
-    _this = _super.call(this, element) || this;
+class SelectBox extends _baseBox.BaseBox {
+  get defaultPlaceholder() {
+    return '선택하세요';
+  }
+  constructor(element) {
+    let config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+    super(element);
     // HTML에서 옵션 파싱 (config.options가 없을 경우)
-    var htmlOptions = _this.parseOptionsFromHTML();
+    const htmlOptions = this.parseOptionsFromHTML();
     // JavaScript 옵션을 DropdownOption 형식으로 변환
-    var normalizedOptions = config.options ? _this.normalizeOptions(config.options) : htmlOptions;
-    var finalOptions = normalizedOptions;
+    const normalizedOptions = config.options ? this.normalizeOptions(config.options) : htmlOptions;
+    const finalOptions = normalizedOptions;
     // HTML에서 속성 파싱
-    var htmlAttributes = _this.parseAttributesFromHTML();
+    const htmlAttributes = this.parseAttributesFromHTML();
     // 기존 API를 새 API로 변환
-    var unifiedConfig = __assign(__assign({}, config), {
+    const unifiedConfig = {
+      ...config,
       type: 'selectbox',
-      multiple: (_a = config.multiple) !== null && _a !== void 0 ? _a : false,
-      showFooterButtons: (_b = config.showFooterButtons) !== null && _b !== void 0 ? _b : false,
+      multiple: config.multiple ?? false,
+      showFooterButtons: config.showFooterButtons ?? false,
       onEdit: config.onEdit,
       onSelectAll: config.onSelectAll,
       onComplete: config.onComplete,
       options: finalOptions,
-      placeholder: config.placeholder || htmlAttributes.placeholder || _this.defaultPlaceholder,
-      value: (_d = (_c = config.value) !== null && _c !== void 0 ? _c : htmlAttributes.value) !== null && _d !== void 0 ? _d : config.multiple ? [] : '',
-      disabled: (_f = (_e = config.disabled) !== null && _e !== void 0 ? _e : htmlAttributes.disabled) !== null && _f !== void 0 ? _f : false,
+      placeholder: config.placeholder || htmlAttributes.placeholder || this.defaultPlaceholder,
+      value: config.value ?? htmlAttributes.value ?? (config.multiple ? [] : ''),
+      disabled: config.disabled ?? htmlAttributes.disabled ?? false,
       size: config.size || htmlAttributes.size || 'md',
-      onChange: function (value) {
-        var _a;
+      onChange: value => {
         // 초기화 중에는 동기화하지 않음 (무한 루프 방지)
-        if (_this.isInitializing) {
-          _this.lastValue = value; // 초기값 저장
+        if (this.isInitializing) {
+          this.lastValue = value; // 초기값 저장
           return;
         }
         // 값이 실제로 변경되지 않았으면 동기화 생략 (무한 루프 방지)
-        if (JSON.stringify(_this.lastValue) === JSON.stringify(value)) {
+        if (JSON.stringify(this.lastValue) === JSON.stringify(value)) {
           return;
         }
-        _this.lastValue = value; // 새 값 저장
+        this.lastValue = value; // 새 값 저장
         // 타겟 select와 동기화
         if (config.multiple) {
-          _this.syncWithTargetSelectMultiple(value);
+          this.syncWithTargetSelectMultiple(value);
         } else {
-          _this.syncWithTargetSelect(value);
+          this.syncWithTargetSelect(value);
         }
         // onChange 콜백에는 실제 value를 전달
-        var realValue = config.multiple ? value.map(function (v) {
-          return _this.getRealValueFromId(v);
-        }) : _this.getRealValueFromId(value);
-        (_a = config.onChange) === null || _a === void 0 ? void 0 : _a.call(config, realValue);
+        const realValue = config.multiple ? value.map(v => this.getRealValueFromId(v)) : this.getRealValueFromId(value);
+        config.onChange?.(realValue);
       }
-    });
-    _this.unifiedSelectBox = new _unifiedBoxManager.UnifiedBoxManager(element, unifiedConfig);
-    _this.completeInitialization();
-    return _this;
+    };
+    this.unifiedSelectBox = new _unifiedBoxManager.UnifiedBoxManager(element, unifiedConfig);
+    this.completeInitialization();
   }
-  Object.defineProperty(SelectBox.prototype, "defaultPlaceholder", {
-    get: function () {
-      return '선택하세요';
-    },
-    enumerable: false,
-    configurable: true
-  });
   /**
    * JavaScript 옵션을 DropdownOption 형식으로 변환
    */
-  SelectBox.prototype.normalizeOptions = function (options) {
-    return options.map(function (option) {
+  normalizeOptions(options) {
+    return options.map(option => {
       // 이미 DropdownOption 형식인 경우
       if ('label' in option) {
         return option;
       }
       // SelectBoxOptionType 형식인 경우 (text -> label 변환)
-      var selectBoxOption = option;
+      const selectBoxOption = option;
       return {
         id: selectBoxOption.id,
         label: selectBoxOption.text,
         disabled: selectBoxOption.disabled
       };
     });
-  };
+  }
   /**
    * HTML select에서 옵션 파싱
    */
-  SelectBox.prototype.parseOptionsFromHTML = function () {
-    var _this = this;
+  parseOptionsFromHTML() {
     if (!this.targetSelect) return [];
-    var options = [];
-    var optionElements = this.targetSelect.querySelectorAll('option');
+    const options = [];
+    const optionElements = this.targetSelect.querySelectorAll('option');
     // 빈 값 옵션 개수 확인 (최적화를 위해)
-    var emptyValueCount = Array.from(optionElements).filter(function (opt) {
-      return opt.value === '';
-    }).length;
-    optionElements.forEach(function (optionElement, index) {
-      var optionValue = optionElement.value;
+    const emptyValueCount = Array.from(optionElements).filter(opt => opt.value === '').length;
+    optionElements.forEach((optionElement, index) => {
+      const optionValue = optionElement.value;
       // 빈 값 옵션이 1개뿐이면 단순 처리, 여러 개면 고유 ID 생성
-      var optionId;
+      let optionId;
       if (optionValue !== '') {
         optionId = optionValue;
       } else if (emptyValueCount === 1) {
@@ -142,74 +97,59 @@ var SelectBox = exports.SelectBox = /** @class */function (_super) {
         optionId = '';
       } else {
         // 빈 값 옵션이 여러 개면 고유 ID 생성 (구분 필요)
-        optionId = "__empty_option_".concat(index);
+        optionId = `__empty_option_${index}`;
       }
       options.push({
         id: optionId,
-        label: optionElement.textContent || optionElement.value || _this.defaultPlaceholder,
+        label: optionElement.textContent || optionElement.value || this.defaultPlaceholder,
         disabled: optionElement.disabled,
         // 원본 value 저장 (동기화를 위해)
         originalValue: optionValue
       });
     });
     return options;
-  };
+  }
   /**
    * 값 변환 - originalValue 매핑
    */
-  SelectBox.prototype.resolveValue = function (value) {
+  resolveValue(value) {
     return this.getRealValueFromId(value);
-  };
+  }
   /**
    * ID로부터 실제 HTML select의 value 값을 가져오기
    */
-  SelectBox.prototype.getRealValueFromId = function (id) {
-    var options = this.unifiedSelectBox.getOptions();
-    var option = options.find(function (opt) {
-      return opt.id === id;
-    });
+  getRealValueFromId(id) {
+    const options = this.unifiedSelectBox.getOptions();
+    const option = options.find(opt => opt.id === id);
     // originalValue가 있으면 그것을 사용, 없으면 id를 문자열로 변환
-    return (option === null || option === void 0 ? void 0 : option.originalValue) !== undefined ? option.originalValue : String(id);
-  };
+    return option?.originalValue !== undefined ? option.originalValue : String(id);
+  }
   /**
    * 실제 HTML select의 value 값으로부터 내부 ID를 가져오기
    */
-  SelectBox.prototype.getIdFromRealValue = function (value) {
-    var options = this.unifiedSelectBox.getOptions();
-    var option = options.find(function (opt) {
-      return opt.originalValue === String(value);
-    });
+  getIdFromRealValue(value) {
+    const options = this.unifiedSelectBox.getOptions();
+    const option = options.find(opt => opt.originalValue === String(value));
     // originalValue가 일치하는 옵션을 찾으면 그 ID를 반환, 없으면 value 그대로 반환
     return option ? option.id : value;
-  };
+  }
   // SelectBox 고유 API
-  SelectBox.prototype.getValues = function () {
-    var _this = this;
-    var internalValue = this.unifiedSelectBox.getValues();
-    return internalValue.map(function (option) {
-      return __assign(__assign({}, option), {
-        id: _this.getRealValueFromId(option.id)
-      });
-    });
-  };
-  SelectBox.prototype.setValues = function (value) {
-    var _this = this;
-    var internalValue = value.map(function (v) {
-      return _this.getIdFromRealValue(v.id);
-    });
+  getValues() {
+    const internalValue = this.unifiedSelectBox.getValues();
+    return internalValue.map(option => ({
+      ...option,
+      id: this.getRealValueFromId(option.id)
+    }));
+  }
+  setValues(value) {
+    const internalValue = value.map(v => this.getIdFromRealValue(v.id));
     if (JSON.stringify(this.lastValue) === JSON.stringify(internalValue)) {
       return;
     }
     this.lastValue = internalValue;
     // id 배열을 옵션 객체 배열로 변환
-    var allOptions = this.unifiedSelectBox.getOptions();
-    var optionArray = internalValue.map(function (id) {
-      return allOptions.find(function (opt) {
-        return opt.id === id;
-      });
-    }).filter(function (opt) {
-      return opt !== undefined;
-    });
+    const allOptions = this.unifiedSelectBox.getOptions();
+    const optionArray = internalValue.map(id => allOptions.find(opt => opt.id === id)).filter(opt => opt !== undefined);
     this.unifiedSelectBox.setValues(optionArray);
     // setValues 호출 시에도 타겟 select와 동기화
     if (this.targetSelect) {
@@ -220,10 +160,10 @@ var SelectBox = exports.SelectBox = /** @class */function (_super) {
         this.syncWithTargetSelect(internalValue[0] || '');
       }
     }
-  };
-  SelectBox.prototype.getSelectedCount = function () {
-    var values = this.getValues();
+  }
+  getSelectedCount() {
+    const values = this.getValues();
     return values.length;
-  };
-  return SelectBox;
-}(_baseBox.BaseBox);
+  }
+}
+exports.SelectBox = SelectBox;

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

@@ -7,36 +7,35 @@ exports.ButtonCloseX = ButtonCloseX;
 exports.X_CLOSE_SVG = exports.SVG_SIZE = void 0;
 // 공통 X버튼 로직 (React ButtonCloseX 컴포넌트와 동일한 구조)
 // React ButtonCloseX와 동일한 SVG 사이즈 매핑
-var SVG_SIZE = exports.SVG_SIZE = {
+const SVG_SIZE = exports.SVG_SIZE = {
   xs: 16,
   sm: 20,
   md: 20,
   lg: 24
 };
 // X버튼 SVG 아이콘
-var X_CLOSE_SVG = function (size) {
-  return "<svg width=\"".concat(size, "\" height=\"").concat(size, "\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\">\n    <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n  </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, theme, additionalClasses, ariaLabel, onClick) {
-  if (theme === void 0) {
-    theme = 'light';
-  }
-  if (additionalClasses === void 0) {
-    additionalClasses = '';
-  }
-  if (ariaLabel === void 0) {
-    ariaLabel = '닫기';
-  }
-  var svgSize = SVG_SIZE[size];
-  var buttonId = "close-btn-".concat(Math.random().toString(36).substr(2, 9));
-  var buttonHTML = "\n    <button type=\"button\" id=\"".concat(buttonId, "\" class=\"ncua-button-close-x ncua-button-close-x--").concat(size, " ncua-button-close-x--").concat(theme, " ").concat(additionalClasses, "\" aria-label=\"").concat(ariaLabel, "\">\n      ").concat(X_CLOSE_SVG(svgSize.toString()), "\n    </button>\n  ");
+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 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())}
+    </button>
+  `;
   // onClick이 제공된 경우 이벤트 바인딩
   if (onClick) {
     // DOM에 추가된 후 이벤트 바인딩을 위해 setTimeout 사용
-    setTimeout(function () {
-      var button = document.getElementById(buttonId);
+    setTimeout(() => {
+      const button = document.getElementById(buttonId);
       if (button) {
         button.addEventListener('click', onClick);
       }