@ncds/ui-admin 1.7.0 → 1.8.0

package/dist/temp/src/components/combobox/ComboBox.js

@@ -1,199 +0,0 @@
-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);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
-    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
-        if (ar || !(i in from)) {
-            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
-            ar[i] = from[i];
-        }
-    }
-    return to.concat(ar || Array.prototype.slice.call(from));
-};
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { ChevronSelectorVertical, SearchLg } from '@ncds/ui-admin-icon';
-import classNames from 'classnames';
-import { forwardRef, useImperativeHandle, useRef, useState } from 'react';
-import { useDropdown } from '../../hooks/dropdown';
-import { useMultiSelect } from '../../utils/dropdown/multiSelect';
-import { Button } from '../button';
-import { InputBase } from '../input/InputBase';
-import { SelectDropdown } from '../select-dropdown';
-import { HintText } from '../shared/hintText/HintText';
-import { Tag } from '../tag';
-var defaultMaxHeight = 275;
-var toggleMultiSelectValue = function (currentValue, optionId) {
-    var currentValues = Array.isArray(currentValue) ? currentValue : [];
-    if (currentValues.includes(optionId)) {
-        return currentValues.filter(function (v) { return v !== optionId; });
-    }
-    return __spreadArray(__spreadArray([], currentValues, true), [optionId], false);
-};
-var notifyFormChange = function (register, multiple, newValue) {
-    if (register === null || register === void 0 ? void 0 : register.onChange) {
-        register.onChange({
-            target: {
-                value: multiple ? JSON.stringify(newValue) : newValue,
-                name: register.name,
-            },
-        });
-    }
-};
-var ComboBox = forwardRef(function (_a, ref) {
-    var _b = _a.placeholder, placeholder = _b === void 0 ? '검색하세요' : _b, id = _a.id, className = _a.className, hintText = _a.hintText, children = _a.children, _c = _a.size, size = _c === void 0 ? 'xs' : _c, _d = _a.destructive, destructive = _d === void 0 ? false : _d, value = _a.value, _e = _a.optionItems, optionItems = _e === void 0 ? [] : _e, onChange = _a.onChange, onSearch = _a.onSearch, _f = _a.disabled, disabled = _f === void 0 ? false : _f, register = _a.register, _g = _a.maxHeight, maxHeight = _g === void 0 ? defaultMaxHeight : _g, _h = _a.searchValue, searchValue = _h === void 0 ? '' : _h, label = _a.label, _j = _a.required, required = _j === void 0 ? false : _j, _k = _a.multiple, multiple = _k === void 0 ? false : _k, _l = _a.showFooterButtons, showFooterButtons = _l === void 0 ? false : _l, onEdit = _a.onEdit, props = __rest(_a, ["placeholder", "id", "className", "hintText", "children", "size", "destructive", "value", "optionItems", "onChange", "onSearch", "disabled", "register", "maxHeight", "searchValue", "label", "required", "multiple", "showFooterButtons", "onEdit"]);
-    var internalRef = useRef(null);
-    var dropdownRef = useRef(null);
-    var inputRef = useRef(null);
-    var _m = useState(searchValue), inputValue = _m[0], setInputValue = _m[1];
-    var _o = useState(false), showAllItems = _o[0], setShowAllItems = _o[1];
-    var _p = useState([]), selectedTags = _p[0], setSelectedTags = _p[1];
-    var handleOptionSelect = function (option) {
-        if (disabled)
-            return;
-        if (multiple) {
-            var newValue_1 = toggleMultiSelectValue(value !== null && value !== void 0 ? value : [], option.id);
-            onChange === null || onChange === void 0 ? void 0 : onChange(newValue_1);
-            notifyFormChange(register, multiple, newValue_1);
-            return;
-        }
-        var newValue = option.id;
-        var tag = { id: option.id, label: option.label };
-        setSelectedTags([tag]);
-        onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
-        notifyFormChange(register, multiple, newValue);
-    };
-    var handleInputChange = function (e) {
-        var newValue = e.target.value;
-        setInputValue(newValue);
-        onSearch === null || onSearch === void 0 ? void 0 : onSearch(newValue);
-        setShowAllItems(false);
-        if (!isOpen && !disabled) {
-            toggleDropdown();
-        }
-    };
-    var handleInputClick = function () {
-        var _a;
-        if (!disabled) {
-            (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        }
-        if (inputValue) {
-            toggleDropdown();
-        }
-    };
-    // useDropdown 훅 사용
-    var _q = useDropdown({
-        triggerRef: internalRef,
-        dropdownRef: dropdownRef,
-        maxHeight: maxHeight,
-        itemCount: optionItems.length,
-        optionItems: optionItems,
-        disabled: disabled,
-        multiple: multiple,
-        onSelect: handleOptionSelect,
-    }), isOpen = _q.isOpen, dropdownDirection = _q.direction, focusedIndex = _q.focusedIndex, toggleDropdown = _q.toggleDropdown, dropdownClose = _q.closeDropdown, dropdownHandleKeyDown = _q.handleKeyDown, handleDropdownSelect = _q.handleOptionSelect, handleMouseMove = _q.handleMouseMove, isKeyboardNavigation = _q.isKeyboardNavigation;
-    var showAllItem = function () {
-        var _a;
-        if (disabled)
-            return;
-        (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-        setInputValue('');
-        onSearch === null || onSearch === void 0 ? void 0 : onSearch('');
-        setShowAllItems(true);
-        if (!isOpen) {
-            toggleDropdown();
-        }
-    };
-    var closeDropdown = function () {
-        setShowAllItems(false);
-        dropdownClose();
-    };
-    // 키보드 이벤트 처리는 useDropdown 훅에서 처리됨
-    var handleKeyDown = function (e) {
-        // input 전용 키보드 이벤트 처리
-        if (e.key === 'Escape' && isOpen) {
-            closeDropdown();
-            e.preventDefault();
-            return;
-        }
-        // 나머지는 useDropdown 훅에서 처리
-        dropdownHandleKeyDown(e);
-    };
-    useImperativeHandle(ref, function () { return internalRef.current; }, []);
-    var trailingElement = {
-        type: 'custom',
-        children: (_jsx("div", __assign({ className: "ncua-input__icon-wrap ncua-input__right-icon", onClick: showAllItem }, { children: _jsx(Button, { label: "\uC804\uCCB4", hierarchy: "text", size: "xxs", leadingIcon: { type: 'icon', icon: ChevronSelectorVertical } }) }))),
-    };
-    var leadingElement = {
-        type: 'icon',
-        icon: SearchLg,
-        size: 14,
-        color: 'gray300',
-    };
-    var currentSelectedValues = multiple && Array.isArray(value) ? value : [];
-    var _r = useMultiSelect(currentSelectedValues, optionItems), selectAllButtonText = _r.buttonText, toggleSelectAll = _r.toggleSelectAll, getSelectedTagsData = _r.getSelectedTagsData, removeTag = _r.removeTag;
-    var handleSelectAll = function () {
-        if (!multiple || !onChange)
-            return;
-        var newSelectedValues = toggleSelectAll();
-        onChange(newSelectedValues);
-    };
-    var handleEdit = function () {
-        onEdit === null || onEdit === void 0 ? void 0 : onEdit();
-    };
-    var handleComplete = function () {
-        if (!multiple)
-            return;
-        var tags = getSelectedTagsData();
-        setSelectedTags(tags);
-        setInputValue('');
-        closeDropdown();
-    };
-    var handleRemoveTag = function (tagId) {
-        if (!onChange)
-            return;
-        if (multiple) {
-            var newSelectedValues = removeTag(tagId);
-            onChange(newSelectedValues);
-            setSelectedTags(function (prev) { return prev.filter(function (tag) { return tag.id !== tagId; }); });
-            return;
-        }
-        onChange('');
-        setSelectedTags([]);
-    };
-    var comboboxId = "combobox-options-".concat(id || 'default');
-    var hasVisibleOptions = showAllItems || inputValue;
-    var displayedOptions = hasVisibleOptions ? optionItems : [];
-    var showNoResults = !hasVisibleOptions || optionItems.length === 0;
-    var showFooter = multiple || showFooterButtons;
-    var hiddenInputValue = multiple ? JSON.stringify(value || []) : String(value || '');
-    var hasTags = selectedTags.length > 0;
-    return (_jsxs(_Fragment, { children: [_jsxs("div", __assign({ ref: internalRef, className: classNames('ncua-combobox', "ncua-combobox--".concat(size), {
-                    'ncua-combobox--open': isOpen,
-                    'ncua-combobox--disabled': disabled,
-                    destructive: destructive,
-                }, className) }, props, { children: [_jsxs("div", __assign({ className: "ncua-combobox__content" }, { children: [_jsx(InputBase, { ref: inputRef, size: size, label: label, required: required, placeholder: placeholder, value: inputValue, onChange: handleInputChange, onKeyDown: handleKeyDown, onClick: handleInputClick, disabled: disabled, destructive: destructive, leadingElement: leadingElement, trailingElement: trailingElement, role: "combobox", "aria-expanded": isOpen, "aria-haspopup": "listbox", "aria-controls": comboboxId, "aria-disabled": disabled, autoComplete: "off", clearText: !!inputValue, onClearText: function () {
-                                    setInputValue('');
-                                    onSearch === null || onSearch === void 0 ? void 0 : onSearch('');
-                                } }), _jsxs(SelectDropdown, __assign({ ref: dropdownRef, isOpen: isOpen, direction: dropdownDirection, size: size, options: displayedOptions, value: value, focusedIndex: focusedIndex, maxHeight: maxHeight, listboxId: comboboxId, onOptionSelect: handleDropdownSelect, onMouseMove: handleMouseMove, isKeyboardNavigation: isKeyboardNavigation, multiple: multiple, showFooterButtons: showFooter, selectAllButtonText: selectAllButtonText, onSelectAll: handleSelectAll, onEdit: handleEdit, onComplete: handleComplete, componentType: "combobox" }, { children: [showNoResults ? _jsx("li", __assign({ className: "ncua-select-dropdown__no-results" }, { children: "\uC77C\uCE58\uD558\uB294 \uACB0\uACFC\uAC00 \uC5C6\uC2B5\uB2C8\uB2E4." })) : null, children] }))] })), register && _jsx("input", __assign({ type: "hidden" }, register, { value: hiddenInputValue })), hintText && _jsx(HintText, __assign({ destructive: destructive }, { children: hintText }))] })), hasTags && (_jsx("div", __assign({ className: "ncua-combobox__tags" }, { children: selectedTags.map(function (tag) { return (_jsx(Tag, { text: tag.label, size: "sm", close: true, onButtonClick: function () { return handleRemoveTag(tag.id); } }, tag.id)); }) })))] }));
-});
-ComboBox.displayName = 'ComboBox';
-export { defaultMaxHeight, ComboBox };

package/dist/temp/src/components/date-picker/RangeDatePicker.js

@@ -1,117 +0,0 @@
-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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import moment from 'moment';
-import { forwardRef, useCallback, useEffect } from 'react';
-import { DatePicker } from './DatePicker';
-import { getDateFormat } from './utils';
-var RangeDatePicker = forwardRef(function (_a, ref) {
-    var startDateOptions = _a.startDateOptions, endDateOptions = _a.endDateOptions, validationOption = _a.validationOption, onDateValidation = _a.onDateValidation, _b = _a.size, size = _b === void 0 ? 'xs' : _b;
-    var getOverlapResult = useCallback(function (type) {
-        if (type === 'start' && moment(startDateOptions.currentDate).isAfter(endDateOptions.currentDate)) {
-            return { newDate: endDateOptions.currentDate, currentDate: startDateOptions.currentDate };
-        }
-        if (type === 'end' && moment(endDateOptions.currentDate).isBefore(startDateOptions.currentDate)) {
-            return { newDate: startDateOptions.currentDate, currentDate: endDateOptions.currentDate };
-        }
-        return null;
-    }, [startDateOptions.currentDate, endDateOptions.currentDate]);
-    var getSettingNewDate = useCallback(function (type, isOverPeriod, unit, period) {
-        if (type === 'start') {
-            if (isOverPeriod) {
-                return getDateFormat(moment(endDateOptions.currentDate).subtract(period, unit).toDate());
-            }
-            if (moment(startDateOptions.currentDate).isAfter(endDateOptions.currentDate)) {
-                return endDateOptions.currentDate;
-            }
-        }
-        else {
-            if (isOverPeriod) {
-                return getDateFormat(moment(startDateOptions.currentDate).add(period, unit).toDate());
-            }
-            if (moment(endDateOptions.currentDate).isBefore(startDateOptions.currentDate)) {
-                return startDateOptions.currentDate;
-            }
-        }
-        return '';
-    }, [startDateOptions.currentDate, endDateOptions.currentDate]);
-    var changeSettingDateAndAlert = useCallback(function (type, isOverPeriod) {
-        if (isOverPeriod === void 0) { isOverPeriod = false; }
-        if (!(validationOption === null || validationOption === void 0 ? void 0 : validationOption.setting)) {
-            var result = getOverlapResult(type);
-            if (result) {
-                onDateValidation === null || onDateValidation === void 0 ? void 0 : onDateValidation(__assign({ type: type, errorType: 'overlap' }, result));
-            }
-            return;
-        }
-        var _a = validationOption.setting, unit = _a.unit, period = _a.period;
-        var newDate = getSettingNewDate(type, isOverPeriod, unit, period);
-        if (newDate) {
-            onDateValidation === null || onDateValidation === void 0 ? void 0 : onDateValidation({
-                type: type,
-                errorType: isOverPeriod ? 'period' : 'overlap',
-                newDate: newDate,
-                currentDate: type === 'start' ? startDateOptions.currentDate : endDateOptions.currentDate,
-            });
-        }
-    }, [startDateOptions, endDateOptions, validationOption, onDateValidation, getOverlapResult, getSettingNewDate]);
-    useEffect(function () {
-        var isOverDate = moment(startDateOptions.currentDate).isAfter(endDateOptions.currentDate);
-        if (isOverDate) {
-            changeSettingDateAndAlert('start');
-            return;
-        }
-        if (!(validationOption === null || validationOption === void 0 ? void 0 : validationOption.setting)) {
-            return;
-        }
-        var _a = validationOption.setting, unit = _a.unit, period = _a.period;
-        var isValidPeriod = moment(startDateOptions.currentDate).isSameOrAfter(moment(endDateOptions.currentDate).subtract(period, unit));
-        if (isValidPeriod) {
-            onDateValidation === null || onDateValidation === void 0 ? void 0 : onDateValidation({
-                type: 'start',
-                errorType: null,
-                newDate: startDateOptions.currentDate,
-                currentDate: startDateOptions.currentDate,
-            });
-        }
-        else {
-            changeSettingDateAndAlert('start', true);
-        }
-    }, [startDateOptions.currentDate]);
-    useEffect(function () {
-        var isNotTodayEndDate = !moment(endDateOptions.currentDate).isSame(moment(), 'day');
-        if (!(validationOption === null || validationOption === void 0 ? void 0 : validationOption.setting) || !isNotTodayEndDate) {
-            return;
-        }
-        var isOverDate = moment(endDateOptions.currentDate).isBefore(startDateOptions.currentDate);
-        if (isOverDate) {
-            changeSettingDateAndAlert('end');
-            return;
-        }
-        var _a = validationOption.setting, unit = _a.unit, period = _a.period;
-        var isValidPeriod = moment(endDateOptions.currentDate).isSameOrBefore(moment(startDateOptions.currentDate).add(period, unit));
-        if (isValidPeriod) {
-            onDateValidation === null || onDateValidation === void 0 ? void 0 : onDateValidation({
-                type: 'end',
-                errorType: null,
-                newDate: endDateOptions.currentDate,
-                currentDate: endDateOptions.currentDate,
-            });
-        }
-        else {
-            changeSettingDateAndAlert('end', true);
-        }
-    }, [endDateOptions.currentDate]);
-    return (_jsxs("div", __assign({ className: "ncua-range-date-picker", ref: ref || undefined }, { children: [_jsx(DatePicker, __assign({}, startDateOptions, { ref: undefined, size: size })), "~", _jsx(DatePicker, __assign({ isEndDate: true }, endDateOptions, { ref: undefined, size: size }))] })));
-});
-RangeDatePicker.displayName = 'RangeDatePicker';
-export { RangeDatePicker };

package/dist/temp/src/components/date-picker/RangeDatePickerWithButtons.js

@@ -1,55 +0,0 @@
-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 { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect } from 'react';
-import { PERIOD_ITEM } from '../../constant/date-picker';
-import { getDateFormat, getSubtractDate } from '../../utils/date-picker';
-import { ButtonGroup } from '../button';
-import { RangeDatePicker } from './RangeDatePicker';
-var RangeDatePickerWithButtons = function (_a) {
-    var _b = _a.useYesterdayAsEndDate, useYesterdayAsEndDate = _b === void 0 ? false : _b, _c = _a.size, size = _c === void 0 ? 'xs' : _c, currentButtonId = _a.currentButtonId, setCurrentButtonId = _a.setCurrentButtonId, startDateOptions = _a.startDateOptions, endDateOptions = _a.endDateOptions, validationOption = _a.validationOption, periodKeys = _a.periodKeys, periodItems = _a.periodItems, onDateValidation = _a.onDateValidation;
-    var items = (periodItems !== null && periodItems !== void 0 ? periodItems : PERIOD_ITEM);
-    var setCalculatedDate = function () {
-        var currentPeriodItem = items[currentButtonId];
-        if (!currentPeriodItem) {
-            return;
-        }
-        if (currentButtonId === 'ENTIRE') {
-            startDateOptions.onChangeDate('');
-            endDateOptions.onChangeDate('');
-            return;
-        }
-        var startDate = getDateFormat(getSubtractDate({
-            period: currentPeriodItem.period,
-            unit: currentPeriodItem.unit,
-        }));
-        startDateOptions.onChangeDate(startDate);
-        var endDate = useYesterdayAsEndDate
-            ? getDateFormat(getSubtractDate({
-                period: 1,
-                unit: 'days',
-            }))
-            : getDateFormat();
-        endDateOptions.onChangeDate(endDate);
-    };
-    var handleOnChangeDate = function (date, type) {
-        type === 'START' ? startDateOptions.onChangeDate(date) : endDateOptions.onChangeDate(date);
-        currentButtonId && setCurrentButtonId('NONE');
-    };
-    useEffect(function () {
-        if (currentButtonId !== 'NONE') {
-            setCalculatedDate();
-        }
-    }, [currentButtonId]);
-    return (_jsxs("div", __assign({ className: "ncua-range-date-picker-with-buttons" }, { children: [_jsx(ButtonGroup, __assign({ size: size }, { children: periodKeys.map(function (key) { return (_jsx(ButtonGroup.Item, { isCurrent: currentButtonId === key, label: items[key].text, onClick: function () { return setCurrentButtonId(key); } }, key)); }) })), _jsx(RangeDatePicker, { startDateOptions: __assign(__assign({}, startDateOptions), { onChangeDate: function (date) { return handleOnChangeDate(date, 'START'); } }), endDateOptions: __assign(__assign({}, endDateOptions), { onChangeDate: function (date) { return handleOnChangeDate(date, 'END'); } }), validationOption: validationOption, onDateValidation: onDateValidation, size: size })] })));
-};
-export { RangeDatePickerWithButtons };

package/dist/temp/src/components/input/InputBase.js

@@ -1,121 +0,0 @@
-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);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CheckCircle, HelpCircle, InfoCircle, X } from '@ncds/ui-admin-icon';
-import classNames from 'classnames';
-import { forwardRef, useEffect, useRef, useState } from 'react';
-import { COLOR } from '../../../constant/color';
-import { HintText } from '../shared/hintText/HintText';
-import { Label } from '../shared/label/Label';
-var validationSvgSize = {
-    xs: 14,
-    sm: 16,
-};
-var generalSvgSize = {
-    xs: 14,
-    sm: 20,
-};
-var InputBase = forwardRef(function (_a, ref) {
-    var _b = _a.size, size = _b === void 0 ? 'xs' : _b, required = _a.required, label = _a.label, hintText = _a.hintText, disabled = _a.disabled, validation = _a.validation, destructive = _a.destructive, leadingElement = _a.leadingElement, trailingElement = _a.trailingElement, showHelpIcon = _a.showHelpIcon, maxLength = _a.maxLength, showTextCount = _a.showTextCount, className = _a.className, props = __rest(_a, ["size", "required", "label", "hintText", "disabled", "validation", "destructive", "leadingElement", "trailingElement", "showHelpIcon", "maxLength", "showTextCount", "className"]);
-    var inputRef = useRef(null);
-    var _c = useState(0), textCount = _c[0], setTextCount = _c[1];
-    useEffect(function () {
-        if (inputRef.current && showTextCount) {
-            setTextCount(inputRef.current.value.length);
-            var handleInput_1 = function () {
-                var _a, _b;
-                setTextCount((_b = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.value.length) !== null && _b !== void 0 ? _b : 0);
-            };
-            inputRef.current.addEventListener('input', handleInput_1);
-            return function () {
-                var _a;
-                (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.removeEventListener('input', handleInput_1);
-            };
-        }
-    }, [showTextCount]);
-    var renderOutsideSlot = function (slot) {
-        if (slot.type === 'custom' && slot.placement !== 'outside') {
-            return null;
-        }
-        switch (slot.type) {
-            case 'button':
-                return (_jsx("button", __assign({ type: slot.isSubmit ? 'submit' : 'button', className: classNames('ncua-input__button', "ncua-input__button--".concat(size)), onClick: slot.onClick }, { children: slot.label })));
-            case 'text':
-                return (_jsx("span", __assign({ className: classNames('ncua-input__leading-text', "ncua-input__leading-text--".concat(size)) }, { children: slot.text })));
-            case 'custom':
-                return slot.children;
-            default:
-                return null;
-        }
-    };
-    var renderInsideSlot = function (slot, position) {
-        var _a, _b;
-        switch (slot.type) {
-            case 'icon': {
-                var SlotIcon = slot.icon;
-                return (_jsx("div", __assign({ className: "ncua-input__icon-wrap" }, { children: _jsx(SlotIcon, { className: classNames("ncua-input__".concat(position, "-icon"), slot.className), color: slot.color ? COLOR[slot.color] : undefined, width: (_a = slot.size) !== null && _a !== void 0 ? _a : generalSvgSize[size], height: (_b = slot.size) !== null && _b !== void 0 ? _b : generalSvgSize[size] }) })));
-            }
-            case 'custom':
-                if (slot.placement !== 'inside') {
-                    return null;
-                }
-                return slot.children;
-            default:
-                return null;
-        }
-    };
-    var renderClearButton = function () {
-        if (!props.clearText)
-            return null;
-        return (_jsx("button", __assign({ type: "button", className: classNames('ncua-input__icon-wrap', 'ncua-input__right-icon', 'ncua-input__clear'), onClick: props.onClearText }, { children: _jsx(X, { className: "ncua-input__clear-icon", width: validationSvgSize[size], height: validationSvgSize[size] }) })));
-    };
-    var renderStatusIcon = function () {
-        if (destructive) {
-            return (_jsx("div", __assign({ className: "ncua-input__icon-wrap ncua-input__right-icon" }, { children: _jsx(InfoCircle, { className: "ncua-input__destructive-icon", width: validationSvgSize[size], height: validationSvgSize[size] }) })));
-        }
-        if (validation) {
-            return (_jsx("div", __assign({ className: "ncua-input__icon-wrap ncua-input__right-icon" }, { children: _jsx(CheckCircle, { className: "ncua-input__validation-icon", width: validationSvgSize[size], height: validationSvgSize[size] }) })));
-        }
-        return null;
-    };
-    var renderLabel = function () {
-        if (!label)
-            return null;
-        return (_jsxs("div", __assign({ className: classNames('ncua-input__label', "ncua-input__label--".concat(size)) }, { children: [_jsx(Label, __assign({ isRequired: required, htmlFor: props.id }, { children: label })), showHelpIcon && _jsx(HelpCircle, { className: "ncua-input__help-icon" })] })));
-    };
-    return (_jsxs("div", __assign({ className: classNames('ncua-input', "ncua-input--".concat(size), {
-            destructive: destructive,
-            'is-disabled': disabled,
-            'ncua-input__trailing-button': (trailingElement === null || trailingElement === void 0 ? void 0 : trailingElement.type) === 'button',
-            'ncua-input__leading-text-wrap': (leadingElement === null || leadingElement === void 0 ? void 0 : leadingElement.type) === 'text',
-        }, className) }, { children: [renderLabel(), _jsxs("div", __assign({ className: "ncua-input__content-wrap" }, { children: [_jsxs("div", __assign({ className: "ncua-input__content" }, { children: [leadingElement && renderOutsideSlot(leadingElement), _jsxs("div", __assign({ className: classNames('ncua-input__field', "ncua-input__field--".concat(size)) }, { children: [leadingElement && renderInsideSlot(leadingElement, 'left'), _jsx("input", __assign({ ref: function (node) {
-                                            if (typeof ref === 'function') {
-                                                ref(node);
-                                            }
-                                            else if (ref) {
-                                                ref.current = node;
-                                            }
-                                            inputRef.current = node;
-                                        }, type: "text", disabled: disabled, maxLength: maxLength }, props)), renderClearButton(), renderStatusIcon(), trailingElement && renderInsideSlot(trailingElement, 'right')] })), trailingElement && renderOutsideSlot(trailingElement)] })), showTextCount && maxLength && (_jsxs("div", __assign({ className: "ncua-input__field-text-count" }, { children: [_jsx("output", __assign({ className: "ncua-input__field-text-count-current" }, { children: textCount })), _jsxs("span", { children: ["/", maxLength] })] })))] })), hintText && (_jsx(HintText, __assign({ className: "ncua-input__hint-text", destructive: destructive }, { children: hintText })))] })));
-});
-export { InputBase };

package/dist/temp/src/components/input/NumberInput.js

@@ -1,93 +0,0 @@
-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);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, useCallback, useRef } from 'react';
-import { useMergeRefs } from '../../hooks';
-import { ButtonStepper } from '../button';
-import { InputBase } from './InputBase';
-export var NumberInput = forwardRef(function (_a, ref) {
-    var _b = _a.size, size = _b === void 0 ? 'xs' : _b, minValue = _a.minValue, maxValue = _a.maxValue, _c = _a.step, step = _c === void 0 ? 1 : _c, stepperPosition = _a.stepperPosition, disabled = _a.disabled, props = __rest(_a, ["size", "minValue", "maxValue", "step", "stepperPosition", "disabled"]);
-    var inputRef = useRef(null);
-    var mergedRef = useMergeRefs([ref, inputRef]);
-    var getCurrentValue = useCallback(function () {
-        var _a;
-        var value = (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.value;
-        return value ? Number.parseFloat(value) : 0;
-    }, []);
-    var updateValue = useCallback(function (newValue) {
-        if (!inputRef.current)
-            return;
-        // min/max 범위 체크
-        var clampedValue = newValue;
-        if (minValue !== undefined && clampedValue < minValue) {
-            clampedValue = minValue;
-        }
-        if (maxValue !== undefined && clampedValue > maxValue) {
-            clampedValue = maxValue;
-        }
-        inputRef.current.value = clampedValue.toString();
-        // onChange 이벤트 트리거
-        var event = new Event('input', { bubbles: true });
-        inputRef.current.dispatchEvent(event);
-    }, [minValue, maxValue]);
-    var handleIncrement = useCallback(function () {
-        var currentValue = getCurrentValue();
-        var newValue = currentValue + step;
-        if (maxValue === undefined || newValue <= maxValue) {
-            updateValue(newValue);
-        }
-    }, [getCurrentValue, step, maxValue, updateValue]);
-    var handleDecrement = useCallback(function () {
-        var currentValue = getCurrentValue();
-        var newValue = currentValue - step;
-        if (minValue === undefined || newValue >= minValue) {
-            updateValue(newValue);
-        }
-    }, [getCurrentValue, step, minValue, updateValue]);
-    var handleKeyDown = useCallback(function (event) {
-        var _a;
-        if (disabled)
-            return;
-        if (event.key === 'ArrowUp') {
-            event.preventDefault();
-            handleIncrement();
-        }
-        else if (event.key === 'ArrowDown') {
-            event.preventDefault();
-            handleDecrement();
-        }
-        // 기존 onKeyDown prop이 있으면 호출
-        (_a = props.onKeyDown) === null || _a === void 0 ? void 0 : _a.call(props, event);
-    }, [disabled, handleIncrement, handleDecrement, props]);
-    var renderStepperButtonGroup = function (position) {
-        if (position !== stepperPosition) {
-            return null;
-        }
-        return (_jsxs("div", __assign({ className: "ncua-input__stepper-button-group" }, { children: [_jsx(ButtonStepper, { size: size, direction: "up", onClick: handleIncrement, disabled: disabled }), _jsx(ButtonStepper, { size: size, direction: "down", onClick: handleDecrement, disabled: disabled })] })));
-    };
-    return (_jsx(InputBase, __assign({ type: "number", leadingElement: renderStepperButtonGroup('leading')
-            ? { type: 'custom', children: renderStepperButtonGroup('leading'), placement: 'inside' }
-            : props.leadingElement, trailingElement: renderStepperButtonGroup('trailing')
-            ? { type: 'custom', children: renderStepperButtonGroup('trailing'), placement: 'inside' }
-            : props.trailingElement, ref: mergedRef, size: size, disabled: disabled, min: minValue, max: maxValue, step: step, onKeyDown: handleKeyDown, className: "ncua-input__number" }, props)));
-});

package/dist/temp/src/components/input/PasswordInput.js

@@ -1,51 +0,0 @@
-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);
-};
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Eye, EyeOff, Lock01 } from '@ncds/ui-admin-icon';
-import classNames from 'classnames';
-import { forwardRef, useState } from 'react';
-import { InputBase } from './InputBase';
-var svgSize = {
-    xs: 14,
-    sm: 20,
-};
-export var PasswordInput = forwardRef(function (_a, ref) {
-    var _b = _a.size, size = _b === void 0 ? 'xs' : _b, props = __rest(_a, ["size"]);
-    var _c = useState(false), isVisible = _c[0], setIsVisible = _c[1];
-    var svgProps = {
-        width: svgSize[size],
-        height: svgSize[size],
-    };
-    var handleVisibilityChange = function () {
-        setIsVisible(function (prev) { return !prev; });
-    };
-    return (_jsx(InputBase, __assign({ ref: ref, size: size, type: isVisible ? 'text' : 'password', leadingElement: {
-            type: 'icon',
-            icon: Lock01,
-            color: props.value ? 'gray600' : 'gray300',
-        }, trailingElement: {
-            type: 'custom',
-            placement: 'inside',
-            children: (_jsx("button", __assign({ className: classNames('ncua-input__icon-wrap', 'ncua-input__right-icon', 'ncua-input__password-icon'), type: "button", onClick: handleVisibilityChange }, { children: isVisible ? _jsx(Eye, __assign({}, svgProps)) : _jsx(EyeOff, __assign({}, svgProps)) }))),
-        } }, props)));
-});