@ncds/ui-admin 0.0.33 → 0.0.34

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

@@ -0,0 +1,49 @@
+export type DatePickerSize = 'sm' | 'md';
+interface Options {
+    buttons?: DatePickerButton[];
+    size: DatePickerSize;
+    datePickerOptions: DatePickerOptionWrapper[];
+}
+interface DatePickerOptionWrapper {
+    element: string;
+    options: DatePickerOption;
+}
+interface DatePickerOption {
+    defaultDate?: string | Date | Date[];
+    enableTime?: boolean;
+    dateFormat?: string;
+    locale?: string;
+    mode?: 'single' | 'range' | 'multiple';
+    maxDate?: string | Date;
+    minDate?: string | Date;
+    onChange?: (selectedDates: Date[], dateStr: string, instance: any) => void;
+}
+interface DatePickerButton {
+    text: string;
+    period: number;
+    unit: 'days' | 'weeks' | 'months' | 'years';
+    isCurrent: boolean;
+}
+export declare class DatePicker {
+    private readonly element;
+    private readonly datePickerOptions;
+    private readonly size;
+    private buttons;
+    private flatpickrInstances;
+    private currentButton;
+    constructor(wrapper: HTMLElement, options: Options);
+    private init;
+    private validationDependencies;
+    private initializeWrapper;
+    private initButtonGroup;
+    private createButtonElement;
+    private reRenderButtonGroup;
+    private initDatePicker;
+    private initializeFlatpickr;
+    private updateDateWithButton;
+    private setMultipleDates;
+    setDate(dates: string[]): void;
+    getDates(): Date[];
+}
+export {};
+//# sourceMappingURL=datePicker.d.ts.map

package/dist/temp/assets/scripts/datePicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datePicker.d.ts","sourceRoot":"","sources":["../../../../assets/scripts/datePicker.ts"],"names":[],"mappings":"AAIA,MAAM,MAAM,cAAc,GAAG,IAAI,GAAG,IAAI,CAAC;AAEzC,UAAU,OAAO;IACf,OAAO,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC7B,IAAI,EAAE,cAAc,CAAC;IACrB,iBAAiB,EAAE,uBAAuB,EAAE,CAAC;CAC9C;AAED,UAAU,uBAAuB;IAC/B,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,gBAAgB,CAAC;CAC3B;AAED,UAAU,gBAAgB;IACxB,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,EAAE,CAAC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,UAAU,CAAC;IACvC,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,OAAO,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,aAAa,EAAE,IAAI,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,IAAI,CAAC;CAC5E;AAED,UAAU,gBAAgB;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;CACpB;AAiCD,qBAAa,UAAU;IACrB,OAAO,CAAC,QAAQ,CAAC,OAAO,CAAc;IACtC,OAAO,CAAC,QAAQ,CAAC,iBAAiB,CAA4B;IAC9D,OAAO,CAAC,QAAQ,CAAC,IAAI,CAAiB;IACtC,OAAO,CAAC,OAAO,CAAqB;IACpC,OAAO,CAAC,kBAAkB,CAA2B;IACrD,OAAO,CAAC,aAAa,CAAiC;gBAE1C,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,OAAO;IAWlD,OAAO,CAAC,IAAI;IAOZ,OAAO,CAAC,sBAAsB;IAU9B,OAAO,CAAC,iBAAiB;IAMzB,OAAO,CAAC,eAAe;IA0BvB,OAAO,CAAC,mBAAmB;IAY3B,OAAO,CAAC,mBAAmB;IAe3B,OAAO,CAAC,cAAc;IA8FtB,OAAO,CAAC,mBAAmB;IAW3B,OAAO,CAAC,oBAAoB;IAwC5B,OAAO,CAAC,gBAAgB;IAOjB,OAAO,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,IAAI;IAI9B,QAAQ,IAAI,IAAI,EAAE;CAG1B"}

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

@@ -0,0 +1,232 @@
+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);
+};
+// Constants
+var CONSTANTS = {
+    ICON_SIZES: {
+        sm: '14',
+        md: '16',
+    },
+    CLASS_NAMES: {
+        RANGE_WRAPPER: 'ncua-range-date-picker',
+        RANGE_WITH_BUTTONS: 'ncua-range-date-picker-with-buttons',
+        DATE_PICKER: 'ncua-date-picker',
+        DATE_PICKER_INPUT: 'ncua-date-picker__input',
+        DATE_PICKER_ICO: 'ncua-date-picker__ico',
+        BUTTON_GROUP: 'ncua-button-group',
+        BUTTON_GROUP_HAS_BORDER: 'has-border',
+        BUTTON: 'ncua-button-group__item',
+    },
+    FORMATS: {
+        DATE: 'YYYY-MM-DD',
+    },
+    ERROR_MESSAGES: {
+        FLATPICKR_NOT_LOADED: 'flatpickr 라이브러리가 로드되지 않았습니다.',
+        MOMENT_NOT_LOADED: 'moment 라이브러리가 로드되지 않았습니다.',
+    },
+};
+var DatePicker = /** @class */ (function () {
+    function DatePicker(wrapper, options) {
+        this.flatpickrInstances = [];
+        this.currentButton = null;
+        var _a = options.buttons, buttons = _a === void 0 ? [] : _a, size = options.size, datePickerOptions = options.datePickerOptions;
+        this.validationDependencies((buttons === null || buttons === void 0 ? void 0 : buttons.length) > 0);
+        this.element = wrapper;
+        this.datePickerOptions = datePickerOptions;
+        this.buttons = buttons;
+        this.size = size;
+        this.init();
+    }
+    DatePicker.prototype.init = function () {
+        this.element.innerHTML = '';
+        this.initializeWrapper();
+        this.initButtonGroup();
+        this.initDatePicker();
+    };
+    DatePicker.prototype.validationDependencies = function (hasButtons) {
+        if (typeof flatpickr === 'undefined') {
+            throw new Error(CONSTANTS.ERROR_MESSAGES.FLATPICKR_NOT_LOADED);
+        }
+        if (hasButtons && typeof moment === 'undefined') {
+            throw new Error(CONSTANTS.ERROR_MESSAGES.MOMENT_NOT_LOADED);
+        }
+    };
+    DatePicker.prototype.initializeWrapper = function () {
+        if (this.datePickerOptions.length < 2)
+            return;
+        this.element.classList.add(CONSTANTS.CLASS_NAMES.RANGE_WRAPPER);
+    };
+    DatePicker.prototype.initButtonGroup = function () {
+        var _this = this;
+        if (this.buttons.length === 0)
+            return;
+        this.element.classList.add(CONSTANTS.CLASS_NAMES.RANGE_WITH_BUTTONS);
+        var createButtonWrapperElement = function () {
+            var wrapper = document.createElement('div');
+            wrapper.className = "".concat(CONSTANTS.CLASS_NAMES.BUTTON_GROUP, " ").concat(CONSTANTS.CLASS_NAMES.BUTTON_GROUP_HAS_BORDER, " ").concat(CONSTANTS.CLASS_NAMES.BUTTON_GROUP, "--").concat(_this.size);
+            return wrapper;
+        };
+        var appendButtons = function (wrapper) {
+            _this.buttons.forEach(function (button) {
+                var buttonElement = _this.createButtonElement(button);
+                wrapper.appendChild(buttonElement);
+            });
+        };
+        var wrapper = createButtonWrapperElement();
+        appendButtons(wrapper);
+        wrapper.addEventListener('click', this.updateDateWithButton.bind(this));
+        this.element.appendChild(wrapper);
+    };
+    DatePicker.prototype.createButtonElement = function (button) {
+        if (button.isCurrent) {
+            this.currentButton = button;
+        }
+        var buttonElement = document.createElement('button');
+        buttonElement.className = "".concat(CONSTANTS.CLASS_NAMES.BUTTON, " ").concat(button.isCurrent ? 'is-current' : '');
+        buttonElement.textContent = button.text;
+        buttonElement.type = 'button';
+        return buttonElement;
+    };
+    DatePicker.prototype.reRenderButtonGroup = function (buttons) {
+        var _this = this;
+        var buttonGroup = this.element.querySelector(".".concat(CONSTANTS.CLASS_NAMES.BUTTON_GROUP));
+        if (!buttonGroup)
+            return;
+        buttonGroup.innerHTML = '';
+        buttons.forEach(function (button) {
+            if (button.isCurrent) {
+                _this.currentButton = button;
+            }
+            buttonGroup.appendChild(_this.createButtonElement(button));
+        });
+        this.buttons = buttons;
+    };
+    DatePicker.prototype.initDatePicker = function () {
+        var _this = this;
+        var datePickerOptions = this.datePickerOptions;
+        var createWrapperElement = function (size) {
+            var wrapper = document.createElement('div');
+            wrapper.className = "".concat(CONSTANTS.CLASS_NAMES.DATE_PICKER, " ").concat(CONSTANTS.CLASS_NAMES.DATE_PICKER, "--").concat(size);
+            return wrapper;
+        };
+        var createInput = function (elementId) {
+            var input = document.createElement('input');
+            input.type = 'text';
+            input.id = elementId;
+            input.className = CONSTANTS.CLASS_NAMES.DATE_PICKER_INPUT;
+            return input;
+        };
+        var createIcon = function (size) {
+            var getCalendarIconSvg = function (size) {
+                return "\n      <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"".concat(size, "\" height=\"").concat(size, "\" viewBox=\"0 0 16 16\" fill=\"none\">\n        <path\n          d=\"M14 6.66671H2M10.6667 1.33337V4.00004M5.33333 1.33337V4.00004M5.2 14.6667H10.8C11.9201 14.6667 12.4802 14.6667 12.908 14.4487C13.2843 14.257 13.5903 13.951 13.782 13.5747C14 13.1469 14 12.5868 14 11.4667V5.86671C14 4.7466 14 4.18655 13.782 3.75873C13.5903 3.3824 13.2843 3.07644 12.908 2.88469C12.4802 2.66671 11.9201 2.66671 10.8 2.66671H5.2C4.0799 2.66671 3.51984 2.66671 3.09202 2.88469C2.71569 3.07644 2.40973 3.3824 2.21799 3.75873C2 4.18655 2 4.7466 2 5.86671V11.4667C2 12.5868 2 13.1469 2.21799 13.5747C2.40973 13.951 2.71569 14.257 3.09202 14.4487C3.51984 14.6667 4.0799 14.6667 5.2 14.6667Z\"\n          stroke=\"black\"\n          stroke-width=\"1.33333\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n        ></path>\n      </svg>");
+            };
+            var ico = document.createElement('span');
+            ico.className = CONSTANTS.CLASS_NAMES.DATE_PICKER_ICO;
+            ico.innerHTML = getCalendarIconSvg(CONSTANTS.ICON_SIZES[size]);
+            return ico;
+        };
+        var insertSeparator = function () {
+            var span = document.createElement('span');
+            span.textContent = '-';
+            _this.element.insertBefore(span, _this.element.querySelectorAll(".".concat(CONSTANTS.CLASS_NAMES.DATE_PICKER))[1]);
+        };
+        var createDatePickerElement = function (datePickerOption, index) {
+            var wrapper = createWrapperElement(_this.size);
+            var input = createInput(datePickerOption.element);
+            wrapper.appendChild(input);
+            wrapper.appendChild(createIcon(_this.size));
+            wrapper.addEventListener('click', function () {
+                _this.buttons.forEach(function (button) { return (button.isCurrent = false); });
+                _this.currentButton = null;
+                _this.reRenderButtonGroup(_this.buttons);
+            });
+            _this.element.appendChild(wrapper);
+            if (index > 0) {
+                insertSeparator();
+            }
+            return _this.initializeFlatpickr(input, datePickerOption.options, wrapper);
+        };
+        var createFlatpickrInstances = function (datePickerOptions) {
+            return datePickerOptions.map(function (datePickerOption, index) { return createDatePickerElement(datePickerOption, index); });
+        };
+        var calcInitDates = function (datePickerOptions) {
+            var _a;
+            if (_this.buttons.length > 0) {
+                var _b = (_a = _this.buttons.find(function (button) { return button.isCurrent; })) !== null && _a !== void 0 ? _a : {
+                    period: 0,
+                    unit: 'days',
+                }, period = _b.period, unit = _b.unit;
+                return [
+                    moment().subtract(period, unit).format(CONSTANTS.FORMATS.DATE),
+                    moment().format(CONSTANTS.FORMATS.DATE),
+                ];
+            }
+            return datePickerOptions.map(function (datePickerOption) {
+                var _a;
+                if ((_a = datePickerOption.options) === null || _a === void 0 ? void 0 : _a.defaultDate) {
+                    return moment(datePickerOption.options.defaultDate.toString()).format(CONSTANTS.FORMATS.DATE);
+                }
+                return moment().format(CONSTANTS.FORMATS.DATE);
+            });
+        };
+        this.flatpickrInstances = createFlatpickrInstances(datePickerOptions);
+        var dates = calcInitDates(datePickerOptions);
+        this.setMultipleDates(dates);
+    };
+    DatePicker.prototype.initializeFlatpickr = function (input, options, wrapper) {
+        return flatpickr(input, __assign(__assign({}, options), { appendTo: wrapper }));
+    };
+    DatePicker.prototype.updateDateWithButton = function (e) {
+        var _this = this;
+        var target = e.target;
+        if (!target.classList.contains(CONSTANTS.CLASS_NAMES.BUTTON))
+            return;
+        var clickedButton = this.buttons.find(function (button) { return button.text === target.textContent; });
+        if (!clickedButton || clickedButton === this.currentButton)
+            return;
+        // 날짜 계산
+        var calculateDates = function () {
+            var period = clickedButton.period, unit = clickedButton.unit;
+            var dates = [];
+            var startDate = period
+                ? moment().subtract(period, unit).format(CONSTANTS.FORMATS.DATE)
+                : moment().format(CONSTANTS.FORMATS.DATE);
+            dates.push(startDate);
+            if (_this.datePickerOptions.length > 1) {
+                var endDate = moment().format(CONSTANTS.FORMATS.DATE);
+                dates.push(endDate);
+            }
+            return dates;
+        };
+        var updateButtonState = function () {
+            return _this.buttons.map(function (button) { return (__assign(__assign({}, button), { isCurrent: button.text === (clickedButton === null || clickedButton === void 0 ? void 0 : clickedButton.text) })); });
+        };
+        this.currentButton = clickedButton;
+        this.reRenderButtonGroup(updateButtonState());
+        this.setMultipleDates(calculateDates());
+    };
+    DatePicker.prototype.setMultipleDates = function (dates) {
+        var _this = this;
+        dates.forEach(function (date, index) {
+            _this.flatpickrInstances[index].setDate(date, true);
+            _this.flatpickrInstances[index].redraw();
+        });
+    };
+    DatePicker.prototype.setDate = function (dates) {
+        this.setMultipleDates(dates);
+    };
+    DatePicker.prototype.getDates = function () {
+        return this.flatpickrInstances.flatMap(function (instance) { return instance.selectedDates; });
+    };
+    return DatePicker;
+}());
+export { DatePicker };
+window.DatePicker = DatePicker;

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

@@ -0,0 +1,7 @@
+declare global {
+    interface Window {
+        ncua: Object;
+    }
+}
+export {};
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../assets/scripts/index.ts"],"names":[],"mappings":"AAIA,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,IAAI,EAAE,MAAM,CAAC;KACd;CACF"}

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

@@ -0,0 +1,8 @@
+import { DatePicker } from './datePicker';
+import { Slider } from './slider';
+import { Tab } from './tab';
+window.ncua = {
+    Slider: Slider,
+    Tab: Tab,
+    DatePicker: DatePicker,
+};

package/dist/temp/assets/scripts/slider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slider.d.ts","sourceRoot":"","sources":["../../../../assets/scripts/slider.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,aAAa;IAC5B,GAAG,EAAE,MAAM,CAAC;IACZ,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACjC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IACtD,aAAa,CAAC,EAAE,QAAQ,GAAG,cAAc,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,qBAAa,MAAM;IACjB,OAAO,CAAC,OAAO,CAAc;IAC7B,OAAO,CAAC,OAAO,CAAgB;IAC/B,OAAO,CAAC,YAAY,CAAuB;IAC3C,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,KAAK,CAA4B;IACzC,OAAO,CAAC,cAAc,CAAqB;IAC3C,OAAO,CAAC,eAAe,CAA4B;IACnD,OAAO,CAAC,YAAY,CAA4B;gBAEpC,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,aAAa;IAsBxD,OAAO,CAAC,IAAI;IAsCZ,OAAO,CAAC,YAAY;IA6CpB,OAAO,CAAC,qBAAqB;IA0C7B,OAAO,CAAC,mBAAmB;IAU3B,OAAO,CAAC,oBAAoB;IAgB5B,OAAO,CAAC,oBAAoB;IAI5B,OAAO,CAAC,oBAAoB;IAO5B,OAAO,CAAC,sBAAsB;IA2C9B,OAAO,CAAC,eAAe,CAUrB;IAEF,OAAO,CAAC,gBAAgB,CAOtB;IAEF,OAAO,CAAC,eAAe,CAIrB;IAEF,OAAO,CAAC,eAAe,CAKrB;IAEF,OAAO,CAAC,aAAa,CAGnB;IAEF,OAAO,CAAC,cAAc,CAEpB;IAEF,OAAO,CAAC,sBAAsB;IA4B9B,OAAO,CAAC,YAAY;IAgBb,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI;IAKhD,QAAQ,IAAI,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC;IAIrC,OAAO,IAAI,IAAI;IAiBf,MAAM,IAAI,IAAI;IAiBd,OAAO,IAAI,IAAI;CAiBvB"}

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

@@ -0,0 +1,331 @@
+var Slider = /** @class */ (function () {
+    function Slider(element, options) {
+        var _this = this;
+        this.activeHandle = null;
+        this.isDragging = false;
+        this.handleElements = [];
+        this.progressElement = null;
+        this.trackElement = null;
+        this.handleMouseDown = function (e) {
+            var targetElement = e.target;
+            e.preventDefault();
+            _this.handleInteractionStart(e.clientX, targetElement);
+            if (_this.isDragging) {
+                // 텍스트 선택 방지
+                document.body.style.userSelect = 'none';
+            }
+        };
+        this.handleTouchStart = function (e) {
+            if (e.touches.length > 0) {
+                var targetElement = e.target;
+                e.preventDefault();
+                _this.handleInteractionStart(e.touches[0].clientX, targetElement);
+            }
+        };
+        this.handleMouseMove = function (e) {
+            if (_this.isDragging) {
+                _this.updateValueFromClientX(e.clientX);
+            }
+        };
+        this.handleTouchMove = function (e) {
+            if (_this.isDragging && e.touches.length > 0) {
+                e.preventDefault();
+                _this.updateValueFromClientX(e.touches[0].clientX);
+            }
+        };
+        this.handleMouseUp = function () {
+            _this.isDragging = false;
+            document.body.style.userSelect = '';
+        };
+        this.handleTouchEnd = function () {
+            _this.isDragging = false;
+        };
+        this.element = element;
+        this.options = Object.assign({
+            min: 0,
+            max: 100,
+            step: 1,
+            value: 0,
+            disabled: false,
+        }, options);
+        this.value = this.options.value;
+        this.options.min = Number(this.options.min);
+        this.options.max = Number(this.options.max);
+        this.options.step = Number(this.options.step);
+        this.init();
+    }
+    Slider.prototype.init = function () {
+        if (this.options.disabled) {
+            this.element.style.opacity = '0.5';
+        }
+        // 기존 내용 제거
+        this.element.innerHTML = '';
+        // Track 생성
+        this.trackElement = document.createElement('div');
+        this.trackElement.className = 'ncua-slider__track';
+        this.element.appendChild(this.trackElement);
+        // Progress 생성
+        this.progressElement = document.createElement('div');
+        this.progressElement.className = 'ncua-slider__progress';
+        this.element.appendChild(this.progressElement);
+        // Handle(s) 생성
+        if (Array.isArray(this.value)) {
+            // Range slider (2 handles)
+            var _a = this.value, leftValue = _a[0], rightValue = _a[1];
+            this.createHandle(0, leftValue);
+            this.createHandle(1, rightValue);
+        }
+        else {
+            // Single slider (1 handle)
+            this.createHandle(0, this.value);
+        }
+        // 이벤트 리스너 추가
+        if (!this.options.disabled) {
+            this.enable();
+        }
+        // 초기 위치 설정
+        this.updateHandlePositions();
+    };
+    Slider.prototype.createHandle = function (index, value) {
+        var _this = this;
+        var handle = document.createElement('div');
+        handle.className = 'ncua-slider__handle';
+        handle.setAttribute('role', 'slider');
+        handle.setAttribute('tabindex', this.options.disabled ? '-1' : '0');
+        handle.setAttribute('aria-valuemin', Array.isArray(this.value) && index === 1 ? String(this.value[0]) : String(this.options.min));
+        handle.setAttribute('aria-valuemax', Array.isArray(this.value) && index === 0 ? String(this.value[1]) : String(this.options.max));
+        handle.setAttribute('aria-valuenow', String(value));
+        handle.setAttribute('aria-disabled', String(this.options.disabled));
+        handle.dataset.index = String(index);
+        handle.addEventListener('focus', function () {
+            _this.activeHandle = index;
+            _this.updateHandleClasses();
+        });
+        handle.addEventListener('blur', function () {
+            _this.activeHandle = null;
+            _this.updateHandleClasses();
+        });
+        if (this.options.labelPosition === 'bottom') {
+            var label = document.createElement('div');
+            label.className = "ncua-slider__label";
+            label.textContent = "".concat(value, "%");
+            handle.appendChild(label);
+        }
+        if (this.options.labelPosition === 'top-floating') {
+            var label = document.createElement('div');
+            label.className = "ncua-slider__label ncua-slider__label--tooltip";
+            label.textContent = "".concat(value, "%");
+            handle.appendChild(label);
+        }
+        this.element.appendChild(handle);
+        this.handleElements[index] = handle;
+    };
+    Slider.prototype.updateHandlePositions = function () {
+        if (Array.isArray(this.value)) {
+            // Range slider
+            var _a = this.value, leftValue = _a[0], rightValue = _a[1];
+            var leftPosition = this.getPositionFromValue(leftValue);
+            var rightPosition = this.getPositionFromValue(rightValue);
+            this.handleElements[0].style.left = "".concat(leftPosition, "%");
+            this.handleElements[1].style.left = "".concat(rightPosition, "%");
+            if (this.options.labelPosition) {
+                var leftLabel = this.handleElements[0].querySelector('.ncua-slider__label');
+                var rightLabel = this.handleElements[1].querySelector('.ncua-slider__label');
+                if (leftLabel)
+                    leftLabel.textContent = "".concat(leftValue, "%");
+                if (rightLabel)
+                    rightLabel.textContent = "".concat(rightValue, "%");
+            }
+            if (this.progressElement) {
+                this.progressElement.style.left = "".concat(leftPosition, "%");
+                this.progressElement.style.width = "".concat(rightPosition - leftPosition, "%");
+            }
+        }
+        else {
+            // Single slider
+            var position = this.getPositionFromValue(this.value);
+            this.handleElements[0].style.left = "".concat(position, "%");
+            if (this.options.labelPosition) {
+                var label = this.handleElements[0].querySelector('.ncua-slider__label');
+                if (label)
+                    label.textContent = "".concat(this.value, "%");
+            }
+            if (this.progressElement) {
+                this.progressElement.style.left = '0';
+                this.progressElement.style.width = "".concat(position, "%");
+            }
+        }
+        // ARIA 속성 업데이트
+        this.updateAriaAttributes();
+    };
+    Slider.prototype.updateHandleClasses = function () {
+        var _this = this;
+        this.handleElements.forEach(function (handle, index) {
+            if (index === _this.activeHandle) {
+                handle.classList.add('is-active');
+            }
+            else {
+                handle.classList.remove('is-active');
+            }
+        });
+    };
+    Slider.prototype.updateAriaAttributes = function () {
+        if (Array.isArray(this.value)) {
+            // Range slider
+            var _a = this.value, leftValue = _a[0], rightValue = _a[1];
+            this.handleElements[0].setAttribute('aria-valuenow', String(leftValue));
+            this.handleElements[0].setAttribute('aria-valuemax', String(rightValue));
+            this.handleElements[1].setAttribute('aria-valuenow', String(rightValue));
+            this.handleElements[1].setAttribute('aria-valuemin', String(leftValue));
+        }
+        else {
+            // Single slider
+            this.handleElements[0].setAttribute('aria-valuenow', String(this.value));
+        }
+    };
+    Slider.prototype.getPositionFromValue = function (value) {
+        return ((value - this.options.min) / (this.options.max - this.options.min)) * 100;
+    };
+    Slider.prototype.getValueFromPosition = function (position) {
+        var percentage = Math.min(Math.max(position, 0), 100);
+        var exactValue = this.options.min + (percentage / 100) * (this.options.max - this.options.min);
+        var steppedValue = Math.round(exactValue / this.options.step) * this.options.step;
+        return Math.min(Math.max(steppedValue, this.options.min), this.options.max);
+    };
+    Slider.prototype.handleInteractionStart = function (clientX, target) {
+        // 슬라이더 영역 내부를 클릭/터치한 경우
+        if (target.closest('.ncua-slider')) {
+            // 핸들을 직접 클릭/터치했는지 확인
+            var handleElement = target.closest('.ncua-slider__handle');
+            if (handleElement) {
+                if (Array.isArray(this.value) && this.value[0] === this.value[1] && this.value[0] === this.options.max) {
+                    this.activeHandle = 0;
+                }
+                else if (Array.isArray(this.value) && this.value[0] === this.value[1] && this.value[0] === this.options.min) {
+                    this.activeHandle = 1;
+                }
+                else {
+                    this.activeHandle = parseInt(handleElement.dataset.index || '0', 10);
+                }
+            }
+            else {
+                // 슬라이더 트랙을 클릭/터치한 경우, 가장 가까운 핸들을 결정
+                var rect = this.element.getBoundingClientRect();
+                var position = ((clientX - rect.left) / rect.width) * 100;
+                if (Array.isArray(this.value)) {
+                    var _a = this.value, leftValue = _a[0], rightValue = _a[1];
+                    var leftPosition = this.getPositionFromValue(leftValue);
+                    var rightPosition = this.getPositionFromValue(rightValue);
+                    if (position < leftPosition) {
+                        this.activeHandle = 0;
+                    }
+                    else if (position > rightPosition) {
+                        this.activeHandle = 1;
+                    }
+                    else {
+                        this.activeHandle = Math.abs(position - leftPosition) < Math.abs(position - rightPosition) ? 0 : 1;
+                    }
+                }
+                else {
+                    this.activeHandle = 0;
+                }
+            }
+            this.updateHandleClasses();
+            this.isDragging = true;
+            // 클릭/터치 위치로 값 업데이트
+            this.updateValueFromClientX(clientX);
+        }
+    };
+    Slider.prototype.updateValueFromClientX = function (clientX) {
+        if (!this.element || this.activeHandle === null)
+            return;
+        var rect = this.element.getBoundingClientRect();
+        var position = ((clientX - rect.left) / rect.width) * 100;
+        var newValue = this.getValueFromPosition(position);
+        var prevValue = this.value;
+        if (Array.isArray(this.value)) {
+            // Range slider
+            var _a = this.value, leftValue = _a[0], rightValue = _a[1];
+            if (this.activeHandle === 0) {
+                // 왼쪽 핸들
+                this.value = [Math.min(newValue, rightValue), rightValue];
+            }
+            else if (this.activeHandle === 1) {
+                // 오른쪽 핸들
+                this.value = [leftValue, Math.max(newValue, leftValue)];
+            }
+        }
+        else {
+            // Single slider
+            this.value = newValue;
+        }
+        this.notifyChange(prevValue);
+        this.updateHandlePositions();
+    };
+    Slider.prototype.notifyChange = function (prevValue) {
+        var _this = this;
+        var isSingle = !Array.isArray(prevValue);
+        var checkChangedSingle = function () { return prevValue !== _this.value; };
+        var checkChangedRange = function () {
+            return Array.isArray(prevValue) &&
+                Array.isArray(_this.value) &&
+                (prevValue[0] !== _this.value[0] || prevValue[1] !== _this.value[1]);
+        };
+        var isChanged = isSingle ? checkChangedSingle() : checkChangedRange();
+        if (this.options.onChange && isChanged) {
+            this.options.onChange(this.value);
+        }
+    };
+    Slider.prototype.setValue = function (value) {
+        this.value = value;
+        this.updateHandlePositions();
+    };
+    Slider.prototype.getValue = function () {
+        return this.value;
+    };
+    Slider.prototype.disable = function () {
+        this.options.disabled = true;
+        this.element.style.opacity = '0.5';
+        this.handleElements.forEach(function (handle) {
+            handle.setAttribute('tabindex', '-1');
+            handle.setAttribute('aria-disabled', 'true');
+        });
+        this.element.removeEventListener('mousedown', this.handleMouseDown);
+        this.element.removeEventListener('touchstart', this.handleTouchStart);
+        document.removeEventListener('mousemove', this.handleMouseMove);
+        document.removeEventListener('mouseup', this.handleMouseUp);
+        document.removeEventListener('touchmove', this.handleTouchMove);
+        document.removeEventListener('touchend', this.handleTouchEnd);
+    };
+    Slider.prototype.enable = function () {
+        this.options.disabled = false;
+        this.element.style.opacity = '1';
+        this.handleElements.forEach(function (handle) {
+            handle.setAttribute('tabindex', '0');
+            handle.setAttribute('aria-disabled', 'false');
+        });
+        this.element.addEventListener('mousedown', this.handleMouseDown);
+        this.element.addEventListener('touchstart', this.handleTouchStart, { passive: false });
+        document.addEventListener('mousemove', this.handleMouseMove);
+        document.addEventListener('mouseup', this.handleMouseUp);
+        document.addEventListener('touchmove', this.handleTouchMove);
+        document.addEventListener('touchend', this.handleTouchEnd);
+    };
+    Slider.prototype.destroy = function () {
+        // 모든 이벤트 리스너 제거
+        this.element.removeEventListener('mousedown', this.handleMouseDown);
+        this.element.removeEventListener('touchstart', this.handleTouchStart);
+        document.removeEventListener('mousemove', this.handleMouseMove);
+        document.removeEventListener('mouseup', this.handleMouseUp);
+        document.removeEventListener('touchmove', this.handleTouchMove);
+        document.removeEventListener('touchend', this.handleTouchEnd);
+        // 모든 내용 제거
+        this.element.innerHTML = '';
+        // 참조 정리
+        this.handleElements = [];
+        this.progressElement = null;
+        this.trackElement = null;
+    };
+    return Slider;
+}());
+export { Slider };

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

@@ -0,0 +1,8 @@
+export declare class Tab {
+    private element;
+    private swiper;
+    constructor(element: HTMLElement | null);
+    private init;
+    destroy(): void;
+}
+//# sourceMappingURL=tab.d.ts.map

package/dist/temp/assets/scripts/tab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tab.d.ts","sourceRoot":"","sources":["../../../../assets/scripts/tab.ts"],"names":[],"mappings":"AAEA,qBAAa,GAAG;IACd,OAAO,CAAC,OAAO,CAAc;IAC7B,OAAO,CAAC,MAAM,CAAuB;gBAEzB,OAAO,EAAE,WAAW,GAAG,IAAI;IAavC,OAAO,CAAC,IAAI;IAcL,OAAO,IAAI,IAAI;CAMvB"}