@ncds/ui-admin 1.7.0 → 1.8.0

package/dist/temp/assets/scripts/imageFileInput/ImageFileInputView.js

@@ -1,30 +1,30 @@
 import { IMAGE_FILE_INPUT_CLASS_NAMES, getFileInputSizeClassName, getHintTextClassName, getImageFileInputSizeClassName, getLabelClassName, } from './const/classNames';
-var ImageFileInputView = /** @class */ (function () {
-    function ImageFileInputView(options, model) {
+export class ImageFileInputView {
+    constructor(options, model) {
         this.renderedFiles = []; // 이미 렌더링된 파일들 추적
         this.previewUrls = new Map(); // 파일 URL 추적
         this.options = options;
         this.model = model;
         this.element = this.createElement();
-        this.previewsContainer = this.element.querySelector(".".concat(IMAGE_FILE_INPUT_CLASS_NAMES.previews));
+        this.previewsContainer = this.element.querySelector(`.${IMAGE_FILE_INPUT_CLASS_NAMES.previews}`);
         this.fileInputElement = this.element.querySelector('input[type="file"]');
         this.buttonElement = this.element.querySelector('button.ncua-btn');
     }
     /**
      * 메인 DOM 요소 생성
      */
-    ImageFileInputView.prototype.createElement = function () {
-        var mainContainer = document.createElement('div');
-        var baseClasses = "".concat(IMAGE_FILE_INPUT_CLASS_NAMES.imageFileInput, " ").concat(getImageFileInputSizeClassName(this.options.size));
-        var customClasses = this.options.className ? " ".concat(this.options.className) : '';
+    createElement() {
+        const mainContainer = document.createElement('div');
+        const baseClasses = `${IMAGE_FILE_INPUT_CLASS_NAMES.imageFileInput} ${getImageFileInputSizeClassName(this.options.size)}`;
+        const customClasses = this.options.className ? ` ${this.options.className}` : '';
         mainContainer.className = baseClasses + customClasses;
         // Image previews container
-        var previewsContainer = document.createElement('div');
+        const previewsContainer = document.createElement('div');
         previewsContainer.className = IMAGE_FILE_INPUT_CLASS_NAMES.previews;
         mainContainer.appendChild(previewsContainer);
         // File input container
-        var fileInputContainer = document.createElement('div');
-        var fileInputClasses = "".concat(IMAGE_FILE_INPUT_CLASS_NAMES.fileInput, " ").concat(getFileInputSizeClassName(this.options.size));
+        const fileInputContainer = document.createElement('div');
+        const fileInputClasses = `${IMAGE_FILE_INPUT_CLASS_NAMES.fileInput} ${getFileInputSizeClassName(this.options.size)}`;
         fileInputContainer.className = fileInputClasses;
         // Hidden file input 생성
         fileInputContainer.appendChild(this.createFileInput());
@@ -36,12 +36,12 @@ var ImageFileInputView = /** @class */ (function () {
         }
         mainContainer.appendChild(fileInputContainer);
         return mainContainer;
-    };
+    }
     /**
      * Hidden file input 생성
      */
-    ImageFileInputView.prototype.createFileInput = function () {
-        var input = document.createElement('input');
+    createFileInput() {
+        const input = document.createElement('input');
         input.type = 'file';
         input.hidden = true;
         input.tabIndex = -1;
@@ -57,12 +57,12 @@ var ImageFileInputView = /** @class */ (function () {
             input.name = this.options.fileInputName;
         }
         return input;
-    };
+    }
     /**
      * Input container 생성
      */
-    ImageFileInputView.prototype.createInputContainer = function () {
-        var container = document.createElement('div');
+    createInputContainer() {
+        const container = document.createElement('div');
         container.className = IMAGE_FILE_INPUT_CLASS_NAMES.inputContainer;
         // Label
         if (this.options.label) {
@@ -75,14 +75,14 @@ var ImageFileInputView = /** @class */ (function () {
             container.appendChild(this.createHintText());
         }
         return container;
-    };
+    }
     /**
      * Label container 생성
      */
-    ImageFileInputView.prototype.createLabelContainer = function () {
-        var container = document.createElement('div');
+    createLabelContainer() {
+        const container = document.createElement('div');
         container.className = IMAGE_FILE_INPUT_CLASS_NAMES.label;
-        var label = document.createElement('label');
+        const label = document.createElement('label');
         label.className = getLabelClassName(this.options.isRequired);
         label.textContent = this.options.label;
         container.appendChild(label);
@@ -90,30 +90,30 @@ var ImageFileInputView = /** @class */ (function () {
             container.appendChild(this.createHelpIcon());
         }
         return container;
-    };
+    }
     /**
      * Help icon 생성
      */
-    ImageFileInputView.prototype.createHelpIcon = function () {
-        var iconContainer = document.createElement('span');
+    createHelpIcon() {
+        const iconContainer = document.createElement('span');
         iconContainer.className = IMAGE_FILE_INPUT_CLASS_NAMES.helpIcon;
-        var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+        const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
         svg.setAttribute('width', '16');
         svg.setAttribute('height', '16');
         svg.setAttribute('viewBox', '0 0 24 24');
         svg.setAttribute('fill', 'none');
         svg.setAttribute('stroke', 'currentColor');
-        var circle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
+        const circle = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
         circle.setAttribute('cx', '12');
         circle.setAttribute('cy', '12');
         circle.setAttribute('r', '10');
         circle.setAttribute('stroke-width', '2');
-        var path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+        const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
         path.setAttribute('d', 'M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3');
         path.setAttribute('stroke-width', '2');
         path.setAttribute('stroke-linecap', 'round');
         path.setAttribute('stroke-linejoin', 'round');
-        var line = document.createElementNS('http://www.w3.org/2000/svg', 'line');
+        const line = document.createElementNS('http://www.w3.org/2000/svg', 'line');
         line.setAttribute('x1', '12');
         line.setAttribute('y1', '17');
         line.setAttribute('x2', '12.01');
@@ -125,28 +125,28 @@ var ImageFileInputView = /** @class */ (function () {
         svg.appendChild(line);
         iconContainer.appendChild(svg);
         return iconContainer;
-    };
+    }
     /**
      * Button 생성 (파일 찾기)
      */
-    ImageFileInputView.prototype.createButton = function () {
-        var button = document.createElement('button');
+    createButton() {
+        const button = document.createElement('button');
         button.type = 'button';
-        button.className = "ncua-btn ncua-btn--xs ncua-btn--secondary-gray";
+        button.className = `ncua-btn ncua-btn--xs ncua-btn--secondary-gray`;
         button.disabled = this.options.disabled;
-        var iconSvg = this.createShareIcon();
+        const iconSvg = this.createShareIcon();
         button.appendChild(iconSvg);
-        var label = document.createElement('span');
+        const label = document.createElement('span');
         label.className = 'ncua-btn__label';
         label.textContent = this.options.buttonLabel;
         button.appendChild(label);
         return button;
-    };
+    }
     /**
      * Share icon (업로드 아이콘) 생성
      */
-    ImageFileInputView.prototype.createShareIcon = function () {
-        var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+    createShareIcon() {
+        const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
         svg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
         svg.setAttribute('width', '14');
         svg.setAttribute('height', '14');
@@ -154,7 +154,7 @@ var ImageFileInputView = /** @class */ (function () {
         svg.setAttribute('fill', 'none');
         svg.setAttribute('stroke', 'none');
         svg.classList.add('ncua-btn__icon');
-        var path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+        const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
         path.setAttribute('stroke', 'currentColor');
         path.setAttribute('stroke-linecap', 'round');
         path.setAttribute('stroke-linejoin', 'round');
@@ -162,12 +162,12 @@ var ImageFileInputView = /** @class */ (function () {
         path.setAttribute('d', 'M21 12v4.2c0 1.68 0 2.52-.327 3.162a3 3 0 0 1-1.311 1.311C18.72 21 17.88 21 16.2 21H7.8c-1.68 0-2.52 0-3.162-.327a3 3 0 0 1-1.311-1.311C3 18.72 3 17.88 3 16.2V12m13-5-4-4m0 0L8 7m4-4v12');
         svg.appendChild(path);
         return svg;
-    };
+    }
     /**
      * Trash icon (삭제 아이콘) 생성
      */
-    ImageFileInputView.prototype.createTrashIcon = function () {
-        var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+    createTrashIcon() {
+        const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
         svg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
         svg.setAttribute('width', '20');
         svg.setAttribute('height', '20');
@@ -175,7 +175,7 @@ var ImageFileInputView = /** @class */ (function () {
         svg.setAttribute('fill', 'none');
         svg.setAttribute('stroke', 'currentColor');
         svg.classList.add('ncua-btn__icon');
-        var path1 = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+        const path1 = document.createElementNS('http://www.w3.org/2000/svg', 'path');
         path1.setAttribute('stroke', 'currentColor');
         path1.setAttribute('stroke-linecap', 'round');
         path1.setAttribute('stroke-linejoin', 'round');
@@ -183,166 +183,168 @@ var ImageFileInputView = /** @class */ (function () {
         path1.setAttribute('d', 'M16 6v-.8c0-1.12 0-1.68-.218-2.108a2 2 0 0 0-.874-.874C14.48 2 13.92 2 12.8 2h-1.6c-1.12 0-1.68 0-2.108.218a2 2 0 0 0-.874.874C8 3.52 8 4.08 8 5.2V6m2 5.5v5m4-5v5M3 6h18m-2 0v11.2c0 1.68 0 2.52-.327 3.162a3 3 0 0 1-1.311 1.311C16.72 22 15.88 22 14.2 22H9.8c-1.68 0-2.52 0-3.162-.327a3 3 0 0 1-1.311-1.311C5 19.72 5 18.88 5 17.2V6');
         svg.appendChild(path1);
         return svg;
-    };
+    }
     /**
      * Hint text 생성
      */
-    ImageFileInputView.prototype.createHintText = function () {
-        var hintText = document.createElement('div');
+    createHintText() {
+        const hintText = document.createElement('div');
         hintText.className = getHintTextClassName(this.options.destructive);
         hintText.textContent = this.options.hintText;
         return hintText;
-    };
+    }
     /**
      * Hint list 생성
      * Note: 힌트 리스트는 컴포넌트 size와 관계없이 항상 xs 사이즈로 고정됨
      */
-    ImageFileInputView.prototype.createHintList = function () {
-        var _a;
-        var ul = document.createElement('ul');
+    createHintList() {
+        const ul = document.createElement('ul');
         ul.className = IMAGE_FILE_INPUT_CLASS_NAMES.hintList;
-        (_a = this.options.hintItems) === null || _a === void 0 ? void 0 : _a.forEach(function (hint) {
-            var li = document.createElement('li');
+        this.options.hintItems?.forEach((hint) => {
+            const li = document.createElement('li');
             li.className = IMAGE_FILE_INPUT_CLASS_NAMES.hintItem;
             li.textContent = hint;
             ul.appendChild(li);
         });
         return ul;
-    };
+    }
     /**
      * 이미지 프리뷰 렌더링
      */
-    ImageFileInputView.prototype.renderImagePreviews = function (files, onRemove, onBrowseClick) {
-        var _this = this;
+    renderImagePreviews(files, onRemove, onBrowseClick) {
         // 기존 프리뷰 정리
         this.cleanupPreviews();
         // 새로운 프리뷰 렌더링
-        files.forEach(function (file, index) {
-            var previewContainer = _this.createImagePreview(file, index, onRemove);
-            _this.previewsContainer.appendChild(previewContainer);
-            _this.renderedFiles.push(file);
+        files.forEach((file, index) => {
+            const previewContainer = this.createImagePreview(file, index, onRemove);
+            this.previewsContainer.appendChild(previewContainer);
+            this.renderedFiles.push(file);
         });
         // 빈 슬롯 표시 여부 확인
-        var showEmptySlot = this.options.maxFileCount ? files.length < this.options.maxFileCount : files.length === 0;
+        const showEmptySlot = this.options.maxFileCount ? files.length < this.options.maxFileCount : files.length === 0;
         if (showEmptySlot) {
-            var emptySlot = this.createEmptySlot(onBrowseClick);
+            const emptySlot = this.createEmptySlot(onBrowseClick);
             this.previewsContainer.appendChild(emptySlot);
         }
-    };
+    }
     /**
      * 이미지 프리뷰 생성
      */
-    ImageFileInputView.prototype.createImagePreview = function (file, index, onRemove) {
-        var container = document.createElement('div');
+    createImagePreview(file, index, onRemove) {
+        const container = document.createElement('div');
         container.className = IMAGE_FILE_INPUT_CLASS_NAMES.previewContainer;
         // 이미지 요소 생성
-        var img = document.createElement('img');
+        const img = document.createElement('img');
         img.className = IMAGE_FILE_INPUT_CLASS_NAMES.previewImage;
         img.alt = file.name;
         // 이미지 URL 생성
-        var isInitialFile = this.model.isInitialFile(file);
+        const isInitialFile = this.model.isInitialFile(file);
         if (isInitialFile) {
             // 초기 파일: fileImageUrl 사용
-            var imageUrl = this.model.getInitialFileImageUrl(file);
+            const imageUrl = this.model.getInitialFileImageUrl(file);
             if (imageUrl) {
                 img.src = imageUrl;
             }
         }
         else {
             // 새로 추가된 파일: createObjectURL 사용
-            var url = URL.createObjectURL(file);
+            const url = URL.createObjectURL(file);
             img.src = url;
             this.previewUrls.set(file, url);
         }
         container.appendChild(img);
         // 삭제 버튼 생성
-        var removeButton = document.createElement('button');
+        const removeButton = document.createElement('button');
         removeButton.type = 'button';
-        removeButton.className = "ncua-btn ncua-btn--sm ncua-btn--text ".concat(IMAGE_FILE_INPUT_CLASS_NAMES.previewRemoveButton);
+        removeButton.className = `ncua-btn ncua-btn--sm ncua-btn--text ${IMAGE_FILE_INPUT_CLASS_NAMES.previewRemoveButton}`;
         removeButton.setAttribute('aria-label', 'Remove image');
-        var trashIcon = this.createTrashIcon();
+        const trashIcon = this.createTrashIcon();
         removeButton.appendChild(trashIcon);
-        removeButton.addEventListener('click', function () { return onRemove(index); });
+        removeButton.addEventListener('click', () => onRemove(index));
         container.appendChild(removeButton);
         return container;
-    };
+    }
     /**
      * 빈 슬롯 생성 (파일 찾기 버튼)
      */
-    ImageFileInputView.prototype.createEmptySlot = function (onBrowseClick) {
-        var _this = this;
-        var wrapper = document.createElement('div');
+    createEmptySlot(onBrowseClick) {
+        const wrapper = document.createElement('div');
         wrapper.className = 'ncua-image-file-input__empty-slot-wrapper';
-        var button = document.createElement('button');
+        const button = document.createElement('button');
         button.type = 'button';
-        button.className = "ncua-btn ncua-btn--".concat(this.options.size, " ncua-btn--secondary-gray ").concat(IMAGE_FILE_INPUT_CLASS_NAMES.previewContainer);
+        button.className = `ncua-btn ncua-btn--${this.options.size} ncua-btn--secondary-gray ${IMAGE_FILE_INPUT_CLASS_NAMES.previewContainer}`;
         button.disabled = this.options.disabled;
         button.setAttribute('aria-label', this.options.imagePreviewTooltipLabel);
         button.addEventListener('click', onBrowseClick);
         wrapper.addEventListener('click', onBrowseClick);
         wrapper.appendChild(button);
         // Tooltip 생성 및 추가
-        var tooltip = this.createTooltip();
+        const tooltip = this.createTooltip();
         wrapper.appendChild(tooltip);
         // Hover 이벤트로 tooltip 표시/숨김
-        wrapper.addEventListener('mouseenter', function () {
-            if (!_this.options.disabled) {
+        wrapper.addEventListener('mouseenter', () => {
+            if (!this.options.disabled) {
                 tooltip.style.display = 'block';
             }
         });
-        wrapper.addEventListener('mouseleave', function () {
+        wrapper.addEventListener('mouseleave', () => {
             tooltip.style.display = 'none';
         });
         return wrapper;
-    };
+    }
     /**
      * Tooltip 생성
      */
-    ImageFileInputView.prototype.createTooltip = function () {
-        var iconSize = this.options.size === 'xs' ? '48' : '80';
-        var tooltipHTML = "\n      <svg width=\"".concat(iconSize, "\" height=\"").concat(iconSize, "\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" style=\"opacity: 0; cursor: pointer;\">\n        <circle cx=\"12\" cy=\"12\" r=\"10\" stroke-width=\"2\"></circle>\n      </svg>\n      <span class=\"ncua-tooltip__bg ncua-tooltip__bg--black ncua-tooltip__bg--bottom ncua-tooltip__bg--visible\">\n        <span class=\"ncua-tooltip__content\">").concat(this.options.imagePreviewTooltipLabel, "</span>\n      </span>\n    ");
-        var tooltip = document.createElement('span');
+    createTooltip() {
+        const iconSize = this.options.size === 'xs' ? '48' : '80';
+        const tooltipHTML = `
+      <svg width="${iconSize}" height="${iconSize}" viewBox="0 0 24 24" fill="none" stroke="currentColor" style="opacity: 0; cursor: pointer;">
+        <circle cx="12" cy="12" r="10" stroke-width="2"></circle>
+      </svg>
+      <span class="ncua-tooltip__bg ncua-tooltip__bg--black ncua-tooltip__bg--bottom ncua-tooltip__bg--visible">
+        <span class="ncua-tooltip__content">${this.options.imagePreviewTooltipLabel}</span>
+      </span>
+    `;
+        const tooltip = document.createElement('span');
         tooltip.className = 'ncua-tooltip ncua-tooltip--sm ncua-tooltip--short';
         tooltip.style.display = 'none';
         tooltip.innerHTML = tooltipHTML;
         return tooltip;
-    };
+    }
     /**
      * 기존 프리뷰 정리
      */
-    ImageFileInputView.prototype.cleanupPreviews = function () {
+    cleanupPreviews() {
         // Blob URL 정리
-        this.previewUrls.forEach(function (url) {
+        this.previewUrls.forEach((url) => {
             URL.revokeObjectURL(url);
         });
         this.previewUrls.clear();
         // DOM 정리
         this.previewsContainer.innerHTML = '';
         this.renderedFiles = [];
-    };
-    ImageFileInputView.prototype.setButtonDisabled = function (disabled) {
+    }
+    setButtonDisabled(disabled) {
         this.buttonElement.disabled = disabled;
         // 빈 슬롯 wrapper 내부의 버튼도 disabled 설정
-        var emptySlotWrapper = this.previewsContainer.querySelector('.ncua-image-file-input__empty-slot-wrapper');
+        const emptySlotWrapper = this.previewsContainer.querySelector('.ncua-image-file-input__empty-slot-wrapper');
         if (emptySlotWrapper) {
-            var emptySlotButton = emptySlotWrapper.querySelector(".".concat(IMAGE_FILE_INPUT_CLASS_NAMES.previewContainer, ".ncua-btn"));
+            const emptySlotButton = emptySlotWrapper.querySelector(`.${IMAGE_FILE_INPUT_CLASS_NAMES.previewContainer}.ncua-btn`);
             if (emptySlotButton) {
                 emptySlotButton.disabled = disabled;
             }
         }
-    };
-    ImageFileInputView.prototype.getElement = function () {
+    }
+    getElement() {
         return this.element;
-    };
-    ImageFileInputView.prototype.getFileInputElement = function () {
+    }
+    getFileInputElement() {
         return this.fileInputElement;
-    };
-    ImageFileInputView.prototype.getButtonElement = function () {
+    }
+    getButtonElement() {
         return this.buttonElement;
-    };
-    ImageFileInputView.prototype.destroy = function () {
+    }
+    destroy() {
         this.cleanupPreviews();
-    };
-    return ImageFileInputView;
-}());
-export { ImageFileInputView };
+    }
+}

package/dist/temp/assets/scripts/imageFileInput/const/classNames.js

@@ -1,5 +1,5 @@
 // ImageFileInput 관련 CSS 클래스명 상수
-export var IMAGE_FILE_INPUT_CLASS_NAMES = {
+export const IMAGE_FILE_INPUT_CLASS_NAMES = {
     imageFileInput: 'ncua-image-file-input',
     previews: 'ncua-image-file-input__previews',
     previewContainer: 'ncua-image-file-input__preview-container',
@@ -13,12 +13,8 @@ export var IMAGE_FILE_INPUT_CLASS_NAMES = {
     hintList: 'ncua-file-input__hint-list',
     hintItem: 'ncua-file-input__hint-item',
 };
-export var getImageFileInputSizeClassName = function (size) { return "ncua-image-file-input--".concat(size); };
-export var getFileInputSizeClassName = function (size) { return "ncua-file-input--".concat(size); };
-export var getButtonSizeClassName = function (size) { return "ncua-button--".concat(size); };
-export var getLabelClassName = function (isRequired) {
-    return isRequired ? 'ncua-label ncua-label--required' : 'ncua-label';
-};
-export var getHintTextClassName = function (destructive) {
-    return destructive ? 'ncua-input__hint-text ncua-input__hint-text--destructive' : 'ncua-input__hint-text';
-};
+export const getImageFileInputSizeClassName = (size) => `ncua-image-file-input--${size}`;
+export const getFileInputSizeClassName = (size) => `ncua-file-input--${size}`;
+export const getButtonSizeClassName = (size) => `ncua-button--${size}`;
+export const getLabelClassName = (isRequired) => isRequired ? 'ncua-label ncua-label--required' : 'ncua-label';
+export const getHintTextClassName = (destructive) => destructive ? 'ncua-input__hint-text ncua-input__hint-text--destructive' : 'ncua-input__hint-text';

package/dist/temp/assets/scripts/index.d.ts

@@ -9,6 +9,7 @@ import { ProgressBar } from './progress-bar';
 import { SelectBox } from './selectBox';
 import { Slider } from './slider';
 import { Tab } from './tab';
+import { Table } from './table';
 import { Tag } from './tag';
 import { Tooltip } from './tooltip';
 declare global {
@@ -16,6 +17,7 @@ declare global {
         ncua: {
             Slider?: typeof Slider;
             Tab?: typeof Tab;
+            Table?: typeof Table;
             Tag?: typeof Tag;
             DatePicker?: typeof DatePicker;
             FeaturedIcon?: typeof FeaturedIcon;

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

@@ -9,11 +9,13 @@ import { ProgressBar } from './progress-bar';
 import { SelectBox } from './selectBox';
 import { Slider } from './slider';
 import { Tab } from './tab';
+import { Table } from './table';
 import { Tag } from './tag';
 import { Tooltip } from './tooltip';
 window.ncua = {
     Slider: Slider,
     Tab: Tab,
+    Table: Table,
     Tag: Tag,
     DatePicker: DatePicker,
     SelectBox: SelectBox,

package/dist/temp/assets/scripts/modal/Modal.js

@@ -1,37 +1,31 @@
-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 { MODAL_CLASS_NAMES, getModalSizeClassNames } from './const/classNames';
 import { ModalHeader } from './ModalHeader';
 import { ModalContent } from './ModalContent';
 import { ModalActions } from './ModalActions';
-export var Modal = /** @class */ (function () {
-    function Modal(options) {
-        if (options === void 0) { options = {}; }
-        var _this = this;
+class Modal {
+    constructor(options = {}) {
         this.isOpen = false;
-        this.handleBackdropClick = function (e) {
-            if (_this.options.closeOnBackdropClick && e.target === e.currentTarget) {
-                _this.close();
+        this.handleBackdropClick = (e) => {
+            if (this.options.closeOnBackdropClick && e.target === e.currentTarget) {
+                this.close();
             }
         };
-        this.handleKeyDown = function (e) {
-            if (_this.isOpen && _this.options.closeOnEsc && e.key === 'Escape') {
-                _this.close();
+        this.handleKeyDown = (e) => {
+            if (this.isOpen && this.options.closeOnEsc && e.key === 'Escape') {
+                this.close();
             }
         };
-        this.options = __assign({ size: 'md', closeOnBackdropClick: false, closeOnEsc: true, className: '', onClose: function () { } }, options);
+        this.options = {
+            size: 'md',
+            closeOnBackdropClick: false,
+            closeOnEsc: true,
+            className: '',
+            onClose: () => { },
+            ...options,
+        };
         this.createElement();
     }
-    Modal.prototype.createElement = function () {
+    createElement() {
         // 백드롭 요소 생성
         this.element = document.createElement('div');
         this.element.className = this.getBackdropClasses();
@@ -40,14 +34,14 @@ export var Modal = /** @class */ (function () {
         this.modalElement = document.createElement('div');
         this.modalElement.className = this.getModalClasses();
         this.element.appendChild(this.modalElement);
-    };
-    Modal.prototype.getBackdropClasses = function () {
-        return "".concat(MODAL_CLASS_NAMES.backdrop, " ").concat(this.options.className); // ncua-modal-backdrop + className
-    };
-    Modal.prototype.getModalClasses = function () {
-        return "".concat(MODAL_CLASS_NAMES.modal, " ").concat(getModalSizeClassNames(this.options.size)); // ncua-modal ncua-modal--${size}
-    };
-    Modal.prototype.open = function () {
+    }
+    getBackdropClasses() {
+        return `${MODAL_CLASS_NAMES.backdrop} ${this.options.className}`; // ncua-modal-backdrop + className
+    }
+    getModalClasses() {
+        return `${MODAL_CLASS_NAMES.modal} ${getModalSizeClassNames(this.options.size)}`; // ncua-modal ncua-modal--${size}
+    }
+    open() {
         if (this.isOpen)
             return;
         this.isOpen = true;
@@ -58,8 +52,8 @@ export var Modal = /** @class */ (function () {
         document.body.appendChild(this.element);
         document.addEventListener('keydown', this.handleKeyDown);
         document.body.classList.add(MODAL_CLASS_NAMES.modalOpen);
-    };
-    Modal.prototype.close = function () {
+    }
+    close() {
         if (!this.isOpen)
             return;
         this.isOpen = false;
@@ -71,12 +65,12 @@ export var Modal = /** @class */ (function () {
         if (this.options.onClose) {
             this.options.onClose();
         }
-    };
-    Modal.prototype.destroy = function () {
+    }
+    destroy() {
         this.close();
         this.element.removeEventListener('click', this.handleBackdropClick);
-    };
-    Modal.prototype.setContent = function (content) {
+    }
+    setContent(content) {
         if (typeof content === 'string') {
             this.modalElement.innerHTML = content;
         }
@@ -84,23 +78,23 @@ export var Modal = /** @class */ (function () {
             this.modalElement.innerHTML = '';
             this.modalElement.appendChild(content);
         }
-    };
-    Modal.prototype.getElement = function () {
+    }
+    getElement() {
         return this.element;
-    };
-    Modal.prototype.getModalElement = function () {
+    }
+    getModalElement() {
         return this.modalElement;
-    };
-    Modal.prototype.isModalOpen = function () {
+    }
+    isModalOpen() {
         return this.isOpen;
-    };
+    }
     // Static factory method
-    Modal.create = function (options) {
+    static create(options) {
         return new Modal(options);
-    };
-    // Static properties for HTML usage
-    Modal.Header = ModalHeader;
-    Modal.Content = ModalContent;
-    Modal.Actions = ModalActions;
-    return Modal;
-}());
+    }
+}
+// Static properties for HTML usage
+Modal.Header = ModalHeader;
+Modal.Content = ModalContent;
+Modal.Actions = ModalActions;
+export { Modal };