@ncds/ui-admin 1.7.0 → 1.8.0

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

@@ -1,115 +1,92 @@
-var __extends = (this && this.__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 = (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 { BaseBox } from './baseBox';
 import { UnifiedBoxManager } from './utils/unifiedBox/unifiedBoxManager';
-var 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;
+export class SelectBox extends BaseBox {
+    get defaultPlaceholder() {
+        return '선택하세요';
+    }
+    constructor(element, config = {}) {
+        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), { type: 'selectbox', multiple: (_a = config.multiple) !== null && _a !== void 0 ? _a : false, showFooterButtons: (_b = config.showFooterButtons) !== null && _b !== void 0 ? _b : 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, size: config.size || htmlAttributes.size || 'md', onChange: function (value) {
-                var _a;
+        const unifiedConfig = {
+            ...config,
+            type: 'selectbox',
+            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: config.value ?? htmlAttributes.value ?? (config.multiple ? [] : ''),
+            disabled: config.disabled ?? htmlAttributes.disabled ?? false,
+            size: config.size || htmlAttributes.size || 'md',
+            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);
-            } });
-        _this.unifiedSelectBox = new UnifiedBoxManager(element, unifiedConfig);
-        _this.completeInitialization();
-        return _this;
+                const realValue = config.multiple
+                    ? value.map((v) => this.getRealValueFromId(v))
+                    : this.getRealValueFromId(value);
+                config.onChange?.(realValue);
+            },
+        };
+        this.unifiedSelectBox = new 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;
             }
@@ -119,60 +96,61 @@ var SelectBox = /** @class */ (function (_super) {
             }
             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) {
@@ -184,11 +162,9 @@ var 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));
-export { SelectBox };
+    }
+}

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

@@ -1,28 +1,29 @@
 // 공통 X버튼 로직 (React ButtonCloseX 컴포넌트와 동일한 구조)
 // React ButtonCloseX와 동일한 SVG 사이즈 매핑
-export var SVG_SIZE = {
+export const SVG_SIZE = {
     xs: 16,
     sm: 20,
     md: 20,
     lg: 24,
 };
 // X버튼 SVG 아이콘
-export 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>");
-};
+export 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와 동일한 인터페이스)
-export 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  ");
+export function ButtonCloseX(size, theme = 'light', additionalClasses = '', ariaLabel = '닫기', onClick) {
+    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);
             }