@ncds/ui-admin 1.6.4-alpha.1 → 1.7.0

package/dist/temp/src/hooks/dropdown/useDropdownKeyboard.js

@@ -0,0 +1,108 @@
+import { useCallback, useRef } from 'react';
+import { calculateNextFocusIndex } from '../../utils/dropdown';
+var SCROLL_DELAY_MS = 100;
+/**
+ * 드롭다운 키보드 네비게이션을 위한 커스텀 훅
+ */
+export var useDropdownKeyboard = function (config) {
+    var isOpen = config.isOpen, disabled = config.disabled, focusedIndex = config.focusedIndex, optionItems = config.optionItems, onToggle = config.onToggle, onSelect = config.onSelect, onClose = config.onClose, onFocusChange = config.onFocusChange, triggerRef = config.triggerRef, dropdownRef = config.dropdownRef;
+    // 키보드 네비게이션 플래그
+    var isKeyboardNavigationRef = useRef(false);
+    // 포커스된 옵션이 보이도록 스크롤 조정
+    var scrollToFocusedOption = useCallback(function (index) {
+        if (!(dropdownRef === null || dropdownRef === void 0 ? void 0 : dropdownRef.current) || index < 0)
+            return;
+        var optionsList = dropdownRef.current.querySelector('.ncua-select-dropdown__options');
+        if (!optionsList)
+            return;
+        var options = optionsList.querySelectorAll('.ncua-select-dropdown__option');
+        var focusedOption = options[index];
+        if (!focusedOption)
+            return;
+        var optionsListRect = optionsList.getBoundingClientRect();
+        var focusedOptionRect = focusedOption.getBoundingClientRect();
+        // 옵션이 위쪽으로 벗어났을 때
+        if (focusedOptionRect.top < optionsListRect.top) {
+            optionsList.scrollTop = focusedOption.offsetTop;
+        }
+        // 옵션이 아래쪽으로 벗어났을 때
+        else if (focusedOptionRect.bottom > optionsListRect.bottom) {
+            optionsList.scrollTop = focusedOption.offsetTop + focusedOption.offsetHeight - optionsList.clientHeight;
+        }
+    }, [dropdownRef]);
+    var handleEnterOrSpace = useCallback(function (e) {
+        e.preventDefault();
+        if (!isOpen) {
+            onToggle();
+        }
+        else if (focusedIndex >= 0 && optionItems[focusedIndex]) {
+            onSelect(optionItems[focusedIndex]);
+        }
+    }, [isOpen, focusedIndex, optionItems, onToggle, onSelect]);
+    var handleEscape = useCallback(function (e) {
+        var _a;
+        if (isOpen) {
+            e.preventDefault();
+            onClose();
+            (_a = triggerRef === null || triggerRef === void 0 ? void 0 : triggerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+        }
+    }, [isOpen, onClose, triggerRef]);
+    var handleArrowNavigation = useCallback(function (e, direction) {
+        e.preventDefault();
+        isKeyboardNavigationRef.current = true;
+        if (isOpen) {
+            var nextIndex_1 = calculateNextFocusIndex(focusedIndex, direction, optionItems.length);
+            onFocusChange(nextIndex_1);
+            setTimeout(function () { return scrollToFocusedOption(nextIndex_1); }, SCROLL_DELAY_MS);
+        }
+        else {
+            onToggle();
+        }
+    }, [isOpen, focusedIndex, optionItems.length, onFocusChange, onToggle, scrollToFocusedOption]);
+    var handleHomeEnd = useCallback(function (e, targetIndex) {
+        if (isOpen) {
+            e.preventDefault();
+            isKeyboardNavigationRef.current = true;
+            onFocusChange(targetIndex);
+            setTimeout(function () { return scrollToFocusedOption(targetIndex); }, 0);
+        }
+    }, [isOpen, onFocusChange, scrollToFocusedOption]);
+    var handleKeyDown = useCallback(function (e) {
+        if (disabled)
+            return;
+        switch (e.key) {
+            case 'Enter':
+            case ' ':
+                handleEnterOrSpace(e);
+                break;
+            case 'Escape':
+                handleEscape(e);
+                break;
+            case 'ArrowDown':
+                handleArrowNavigation(e, 'down');
+                break;
+            case 'ArrowUp':
+                handleArrowNavigation(e, 'up');
+                break;
+            case 'Home':
+                handleHomeEnd(e, 0);
+                break;
+            case 'End':
+                handleHomeEnd(e, optionItems.length - 1);
+                break;
+        }
+    }, [disabled, optionItems.length, handleEnterOrSpace, handleEscape, handleArrowNavigation, handleHomeEnd]);
+    // 마우스 움직임 감지 함수
+    var handleMouseMove = useCallback(function () {
+        isKeyboardNavigationRef.current = false;
+    }, []);
+    // 키보드 네비게이션 상태 확인 함수
+    var isKeyboardNavigation = useCallback(function () {
+        return isKeyboardNavigationRef.current;
+    }, []);
+    return {
+        handleKeyDown: handleKeyDown,
+        handleMouseMove: handleMouseMove,
+        isKeyboardNavigation: isKeyboardNavigation,
+    };
+};

package/dist/temp/src/hooks/dropdown/useDropdownPosition.d.ts

@@ -0,0 +1,9 @@
+import type { DropdownDirection, DropdownPositionConfig } from '../../types/dropdown';
+/**
+ * 드롭다운 위치 계산을 위한 커스텀 훅
+ */
+export declare const useDropdownPosition: (config: DropdownPositionConfig) => {
+    direction: DropdownDirection;
+    updatePosition: () => import("../../types/dropdown").DropdownPositionResult;
+    setDirection: import("react").Dispatch<import("react").SetStateAction<DropdownDirection>>;
+};

package/dist/temp/src/hooks/dropdown/useDropdownPosition.js

@@ -0,0 +1,18 @@
+import { useCallback, useState } from 'react';
+import { calculateDropdownPosition } from '../../utils/dropdown';
+/**
+ * 드롭다운 위치 계산을 위한 커스텀 훅
+ */
+export var useDropdownPosition = function (config) {
+    var _a = useState('down'), direction = _a[0], setDirection = _a[1];
+    var updatePosition = useCallback(function () {
+        var result = calculateDropdownPosition(config);
+        setDirection(result.direction);
+        return result;
+    }, [config]);
+    return {
+        direction: direction,
+        updatePosition: updatePosition,
+        setDirection: setDirection,
+    };
+};

package/dist/temp/src/hooks/dropdown/useOutsideClick.d.ts

@@ -0,0 +1,5 @@
+import type { DropdownOutsideClickConfig } from '../../types/dropdown';
+/**
+ * 외부 클릭 감지를 위한 커스텀 훅
+ */
+export declare const useOutsideClick: (config: DropdownOutsideClickConfig) => void;

package/dist/temp/src/hooks/dropdown/useOutsideClick.js

@@ -0,0 +1,23 @@
+import { useEffect } from 'react';
+/**
+ * 외부 클릭 감지를 위한 커스텀 훅
+ */
+export var useOutsideClick = function (config) {
+    var isOpen = config.isOpen, refs = config.refs, onClose = config.onClose;
+    useEffect(function () {
+        if (!isOpen)
+            return;
+        var handleClickOutside = function (event) {
+            var target = event.target;
+            // 모든 ref들에 대해 클릭이 외부에서 발생했는지 확인
+            var isOutside = refs.every(function (ref) { return !ref.current || !ref.current.contains(target); });
+            if (isOutside) {
+                onClose();
+            }
+        };
+        document.addEventListener('mousedown', handleClickOutside);
+        return function () {
+            document.removeEventListener('mousedown', handleClickOutside);
+        };
+    }, [isOpen, refs, onClose]);
+};

package/dist/temp/src/hooks/dropdown/useScrollLock.d.ts

@@ -0,0 +1,4 @@
+/**
+ * 페이지 스크롤을 잠그는 커스텀 훅 (드롭다운 내부 스크롤은 허용)
+ */
+export declare const useScrollLock: (isLocked: boolean, dropdownRef?: React.RefObject<HTMLElement>) => void;

package/dist/temp/src/hooks/dropdown/useScrollLock.js

@@ -0,0 +1,72 @@
+import { useEffect, useRef } from 'react';
+import { findScrollableParent } from '../../utils';
+var SCROLL_KEYS = ['PageUp', 'PageDown', 'Home', 'End', ' '];
+/** 이벤트 대상이 드롭다운 내부에 있는지 확인 */
+function isInsideDropdown(target, dropdownRef) {
+    return !!(dropdownRef === null || dropdownRef === void 0 ? void 0 : dropdownRef.current) && dropdownRef.current.contains(target);
+}
+/** 스크롤 가능한 요소의 경계에 도달했는지 확인하고, 도달했으면 이벤트 차단 */
+function preventScrollBeyondBounds(e, scrollableElement) {
+    var deltaY = e.deltaY;
+    var scrollTop = scrollableElement.scrollTop, scrollHeight = scrollableElement.scrollHeight, clientHeight = scrollableElement.clientHeight;
+    // 스크롤이 위쪽 끝에 도달했고 위로 스크롤하려는 경우
+    if (scrollTop === 0 && deltaY < 0) {
+        e.preventDefault();
+        return;
+    }
+    // 스크롤이 아래쪽 끝에 도달했고 아래로 스크롤하려는 경우
+    if (scrollTop + clientHeight >= scrollHeight && deltaY > 0) {
+        e.preventDefault();
+    }
+}
+/**
+ * 페이지 스크롤을 잠그는 커스텀 훅 (드롭다운 내부 스크롤은 허용)
+ */
+export var useScrollLock = function (isLocked, dropdownRef) {
+    var scrollPosition = useRef(0);
+    useEffect(function () {
+        if (isLocked) {
+            // 현재 스크롤 위치 저장
+            scrollPosition.current = window.pageYOffset;
+            // 스크롤 방지 함수 (드롭다운 내부는 스크롤 체이닝 방지)
+            var preventScroll_1 = function (e) {
+                // 드롭다운 내부에서 발생하지 않은 이벤트는 차단
+                if (!isInsideDropdown(e.target, dropdownRef)) {
+                    e.preventDefault();
+                    return;
+                }
+                // 드롭다운 내부의 스크롤 가능한 요소 찾기
+                var scrollableElement = findScrollableParent(e.target, dropdownRef.current);
+                if (scrollableElement && e instanceof WheelEvent) {
+                    preventScrollBeyondBounds(e, scrollableElement);
+                    return;
+                }
+                // 드롭다운 내부에 스크롤 가능한 요소가 없으면 차단
+                if (!scrollableElement) {
+                    e.preventDefault();
+                }
+            };
+            // 키보드 스크롤 방지 함수 (드롭다운 내부는 제외)
+            var preventKeyboardScroll_1 = function (e) {
+                if (isInsideDropdown(e.target, dropdownRef)) {
+                    return;
+                }
+                if (SCROLL_KEYS.includes(e.key)) {
+                    e.preventDefault();
+                }
+            };
+            // 이벤트 리스너 추가
+            document.addEventListener('wheel', preventScroll_1, { passive: false });
+            document.addEventListener('touchmove', preventScroll_1, { passive: false });
+            document.addEventListener('keydown', preventKeyboardScroll_1);
+            return function () {
+                // 이벤트 리스너 제거
+                document.removeEventListener('wheel', preventScroll_1);
+                document.removeEventListener('touchmove', preventScroll_1);
+                document.removeEventListener('keydown', preventKeyboardScroll_1);
+                // 스크롤 위치 복원
+                window.scrollTo(0, scrollPosition.current);
+            };
+        }
+    }, [isLocked, dropdownRef]);
+};

package/dist/temp/src/hooks/dropdown/useWindowResize.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Resize Observer를 사용하여 요소의 크기 변화를 감지하는 커스텀 훅
+ * @param callback 크기 변화 시 실행될 콜백 함수
+ * @param isActive 옵저버 활성화 여부
+ * @param target 관찰할 대상 요소 (기본값: document.body)
+ */
+export declare const useWindowResize: (callback: () => void, isActive?: boolean, target?: HTMLElement | null) => void;

package/dist/temp/src/hooks/dropdown/useWindowResize.js

@@ -0,0 +1,44 @@
+import { useEffect, useRef } from 'react';
+/**
+ * Resize Observer를 사용하여 요소의 크기 변화를 감지하는 커스텀 훅
+ * @param callback 크기 변화 시 실행될 콜백 함수
+ * @param isActive 옵저버 활성화 여부
+ * @param target 관찰할 대상 요소 (기본값: document.body)
+ */
+export var useWindowResize = function (callback, isActive, target) {
+    if (isActive === void 0) { isActive = true; }
+    var resizeObserverRef = useRef(null);
+    useEffect(function () {
+        if (!isActive)
+            return;
+        // Resize Observer 지원 여부 확인
+        if (!window.ResizeObserver) {
+            // Resize Observer를 지원하지 않는 브라우저의 경우 기존 방식 사용
+            var handleResize_1 = function () {
+                callback();
+            };
+            window.addEventListener('resize', handleResize_1);
+            return function () {
+                window.removeEventListener('resize', handleResize_1);
+            };
+        }
+        // Resize Observer 생성
+        resizeObserverRef.current = new ResizeObserver(function (entries) {
+            // entries가 비어있지 않을 때만 콜백 실행
+            if (entries.length > 0) {
+                callback();
+            }
+        });
+        // 관찰할 대상 요소 결정
+        var targetElement = target || document.body;
+        if (targetElement) {
+            resizeObserverRef.current.observe(targetElement);
+        }
+        return function () {
+            if (resizeObserverRef.current) {
+                resizeObserverRef.current.disconnect();
+                resizeObserverRef.current = null;
+            }
+        };
+    }, [callback, isActive, target]);
+};

package/dist/temp/src/hooks/index.d.ts

@@ -0,0 +1,4 @@
+export * from './dropdown';
+export { useCallbackRef } from './useCallbackRef';
+export { useMediaQuery } from './useMediaQuery';
+export { useMergeRefs } from './useMergeRefs';

package/dist/temp/src/hooks/index.js

@@ -0,0 +1,6 @@
+// 기존 공통 hooks
+// 드롭다운 관련 hooks
+export * from './dropdown';
+export { useCallbackRef } from './useCallbackRef';
+export { useMediaQuery } from './useMediaQuery';
+export { useMergeRefs } from './useMergeRefs';

package/dist/temp/src/hooks/useCallbackRef.d.ts

@@ -0,0 +1,27 @@
+/**
+ * A callback ref hook that supports cleanup functions.
+ * This is useful when you need to perform setup/cleanup operations when the ref changes.
+ *
+ * @param callback - Function that receives the node and optionally returns a cleanup function
+ * @returns A callback ref
+ *
+ * @example
+ * ```tsx
+ * const MyComponent = () => {
+ *   const ref = useCallbackRef<HTMLInputElement>((node) => {
+ *     if (node) {
+ *       const handleInput = () => console.log('input changed');
+ *       node.addEventListener('input', handleInput);
+ *
+ *       // Return cleanup function
+ *       return () => {
+ *         node.removeEventListener('input', handleInput);
+ *       };
+ *     }
+ *   });
+ *
+ *   return <input ref={ref} />;
+ * };
+ * ```
+ */
+export declare function useCallbackRef<T>(callback: (node: T | null) => (() => void) | void): React.RefCallback<T>;

package/dist/temp/src/hooks/useCallbackRef.js

@@ -0,0 +1,44 @@
+import { useCallback, useRef } from 'react';
+/**
+ * A callback ref hook that supports cleanup functions.
+ * This is useful when you need to perform setup/cleanup operations when the ref changes.
+ *
+ * @param callback - Function that receives the node and optionally returns a cleanup function
+ * @returns A callback ref
+ *
+ * @example
+ * ```tsx
+ * const MyComponent = () => {
+ *   const ref = useCallbackRef<HTMLInputElement>((node) => {
+ *     if (node) {
+ *       const handleInput = () => console.log('input changed');
+ *       node.addEventListener('input', handleInput);
+ *
+ *       // Return cleanup function
+ *       return () => {
+ *         node.removeEventListener('input', handleInput);
+ *       };
+ *     }
+ *   });
+ *
+ *   return <input ref={ref} />;
+ * };
+ * ```
+ */
+export function useCallbackRef(callback) {
+    var cleanupRef = useRef();
+    return useCallback(function (node) {
+        // Cleanup previous ref
+        if (cleanupRef.current) {
+            cleanupRef.current();
+            cleanupRef.current = undefined;
+        }
+        // Set up new ref
+        if (node) {
+            cleanupRef.current = callback(node);
+        }
+        else {
+            callback(null);
+        }
+    }, [callback]);
+}

package/dist/temp/src/hooks/useMediaQuery.d.ts

@@ -0,0 +1,5 @@
+interface UseMediaQueryOptions {
+    onMatched?: () => void;
+}
+export declare const useMediaQuery: (query: string, options?: UseMediaQueryOptions) => boolean;
+export {};

package/dist/temp/src/hooks/useMediaQuery.js

@@ -0,0 +1,20 @@
+import { useEffect, useState } from 'react';
+export var useMediaQuery = function (query, options) {
+    var _a = useState(false), matches = _a[0], setMatches = _a[1];
+    useEffect(function () {
+        var mediaQuery = window.matchMedia(query);
+        setMatches(mediaQuery.matches);
+        var handleChange = function (e) {
+            var _a;
+            setMatches(e.matches);
+            if (e.matches) {
+                (_a = options === null || options === void 0 ? void 0 : options.onMatched) === null || _a === void 0 ? void 0 : _a.call(options);
+            }
+        };
+        mediaQuery.addEventListener('change', handleChange);
+        return function () {
+            mediaQuery.removeEventListener('change', handleChange);
+        };
+    }, [query, options === null || options === void 0 ? void 0 : options.onMatched]);
+    return matches;
+};

package/dist/temp/src/hooks/useMergeRefs.d.ts

@@ -0,0 +1,20 @@
+type Ref<T> = React.RefCallback<T> | React.MutableRefObject<T | null> | null | undefined;
+/**
+ * Merges multiple refs into a single callback ref.
+ * This is useful when you need to forward a ref while also keeping an internal ref.
+ *
+ * @param refs - Array of refs to merge
+ * @returns A callback ref that will update all provided refs
+ *
+ * @example
+ * ```tsx
+ * const MyComponent = forwardRef<HTMLInputElement, Props>((props, ref) => {
+ *   const internalRef = useRef<HTMLInputElement>(null);
+ *   const mergedRef = useMergeRefs([ref, internalRef]);
+ *
+ *   return <input ref={mergedRef} />;
+ * });
+ * ```
+ */
+export declare function useMergeRefs<T>(refs: Ref<T>[]): React.RefCallback<T>;
+export {};

package/dist/temp/src/hooks/useMergeRefs.js

@@ -0,0 +1,31 @@
+/**
+ * Merges multiple refs into a single callback ref.
+ * This is useful when you need to forward a ref while also keeping an internal ref.
+ *
+ * @param refs - Array of refs to merge
+ * @returns A callback ref that will update all provided refs
+ *
+ * @example
+ * ```tsx
+ * const MyComponent = forwardRef<HTMLInputElement, Props>((props, ref) => {
+ *   const internalRef = useRef<HTMLInputElement>(null);
+ *   const mergedRef = useMergeRefs([ref, internalRef]);
+ *
+ *   return <input ref={mergedRef} />;
+ * });
+ * ```
+ */
+export function useMergeRefs(refs) {
+    return function (node) {
+        refs.forEach(function (ref) {
+            if (ref) {
+                if (typeof ref === 'function') {
+                    ref(node);
+                }
+                else {
+                    ref.current = node;
+                }
+            }
+        });
+    };
+}

package/dist/temp/src/types/dropdown/dropdown.d.ts

@@ -0,0 +1,39 @@
+import type { RefObject } from 'react';
+export type DropdownDirection = 'up' | 'down';
+export type DropdownPositionConfig = {
+    triggerRef: RefObject<HTMLElement>;
+    maxHeight: number;
+    itemCount: number;
+    itemHeight?: number;
+    offset?: number;
+};
+export type DropdownPositionResult = {
+    direction: DropdownDirection;
+    maxHeight: number;
+};
+export type DropdownKeyboardConfig<T> = {
+    isOpen: boolean;
+    disabled: boolean;
+    focusedIndex: number;
+    optionItems: T[];
+    onToggle: () => void;
+    onSelect: (option: T) => void;
+    onClose: () => void;
+    onFocusChange: (index: number) => void;
+    triggerRef?: RefObject<HTMLElement>;
+    dropdownRef?: RefObject<HTMLElement>;
+};
+export type DropdownOutsideClickConfig = {
+    isOpen: boolean;
+    refs: RefObject<HTMLElement>[];
+    onClose: () => void;
+};
+export type MultiSelectOption = {
+    id: string | number;
+    label?: string;
+    disabled?: boolean;
+};
+export type SelectedTag = {
+    id: string | number;
+    label: string;
+};

package/dist/temp/src/types/dropdown/dropdown.js

@@ -0,0 +1 @@
+export {};

package/dist/temp/src/types/dropdown/index.d.ts

@@ -0,0 +1,2 @@
+export * from './dropdown';
+export * from './option';

package/dist/temp/src/types/dropdown/index.js

@@ -0,0 +1,2 @@
+export * from './dropdown';
+export * from './option';

package/dist/temp/src/types/dropdown/option.d.ts

@@ -0,0 +1,23 @@
+/**
+ * 기본 옵션 타입
+ */
+export type OptionType = {
+    id: string | number;
+    label: string;
+    icon?: React.ComponentType<{
+        width?: number;
+        height?: number;
+    }>;
+};
+/**
+ * 옵션 값 타입 (단일 또는 다중 선택)
+ */
+export type OptionValue = string | number | (string | number)[];
+/**
+ * 옵션 변경 핸들러 타입
+ */
+export type OptionChangeHandler = (value: OptionValue) => void;
+/**
+ * 옵션 선택 핸들러 타입
+ */
+export type OptionSelectHandler<T extends OptionType = OptionType> = (option: T) => void;

package/dist/temp/src/types/dropdown/option.js

@@ -0,0 +1 @@
+export {};

package/dist/temp/src/types/index.d.ts

@@ -0,0 +1,2 @@
+export * from './dropdown';
+export type * from './side-slot';

package/dist/temp/src/types/index.js

@@ -0,0 +1,2 @@
+// 드롭다운 관련 types
+export * from './dropdown';

package/dist/temp/src/types/side-slot.d.ts

@@ -0,0 +1,25 @@
+import type { ComponentType, ReactNode } from 'react';
+import type { COLOR } from '../../constant/color';
+import type { DotProps } from '../components';
+export type SlotIconComponent = ComponentType<{
+    height?: number;
+    width?: number;
+    color?: string;
+    className?: string;
+}>;
+export type IconSlotType = {
+    type: 'icon';
+    icon: SlotIconComponent;
+    color?: keyof typeof COLOR;
+    size?: number;
+};
+export type DotSlotType = {
+    type: 'dot';
+    color: DotProps['color'];
+    size: DotProps['size'];
+};
+export type CustomSlotType = {
+    type: 'custom';
+    children: ReactNode;
+};
+export type SideSlotType = IconSlotType | DotSlotType | CustomSlotType;

package/dist/temp/src/types/side-slot.js

@@ -0,0 +1 @@
+export {};

package/dist/temp/src/utils/date-picker.d.ts

@@ -0,0 +1,11 @@
+import { type DurationInputArg1, type DurationInputArg2 } from 'moment';
+export declare function getDateFormat(date?: Date | string): string;
+export declare function getToday(): Date;
+export declare function getSubtractDate({ date, period, unit, }: {
+    date?: string | Date;
+    period: DurationInputArg1;
+    unit: DurationInputArg2;
+}): Date;
+export declare const formatDateInput: (input: string) => string;
+export declare const formatHourInput: (input: string) => string;
+export declare const formatMinuteInput: (input: string) => string;

package/dist/temp/src/utils/date-picker.js

@@ -0,0 +1,51 @@
+import moment from 'moment';
+var YEAR_LENGTH = 4;
+var MONTH_START = 4;
+var MONTH_END = 6;
+var DAY_START = 6;
+var DAY_END = 8;
+var MAX_HOUR = 23;
+var MAX_MINUTE = 59;
+export function getDateFormat(date) {
+    if (date === void 0) { date = getToday(); }
+    return moment(date).format('YYYY-MM-DD');
+}
+export function getToday() {
+    return moment().toDate();
+}
+export function getSubtractDate(_a) {
+    var _b = _a.date, date = _b === void 0 ? getToday() : _b, period = _a.period, unit = _a.unit;
+    return moment(date).subtract(period, unit).toDate();
+}
+export var formatDateInput = function (input) {
+    var dateRegex = /^(19|20)\d{2}(0[1-9]|1[012])(0[1-9]|[12][0-9]|3[0-1])$/;
+    if (dateRegex.test(input)) {
+        // 20231112 -> 2023-11-12 형식으로 변환
+        var year = input.substring(0, YEAR_LENGTH);
+        var month = input.substring(MONTH_START, MONTH_END);
+        var day = input.substring(DAY_START, DAY_END);
+        return "".concat(year, "-").concat(month, "-").concat(day);
+    }
+    return input;
+};
+export var formatHourInput = function (input) {
+    var numbers = input.replace(/\D/g, '');
+    var hourStr = numbers.substring(0, 2);
+    var hourNum = Number.parseInt(hourStr, 10);
+    if (hourNum >= 0 && hourNum <= MAX_HOUR) {
+        return hourStr;
+    }
+    return input;
+};
+export var formatMinuteInput = function (input) {
+    // 숫자만 추출
+    var numbers = input.replace(/\D/g, '');
+    // 2자리 숫자로 제한
+    var minuteStr = numbers.substring(0, 2);
+    var minuteNum = Number.parseInt(minuteStr, 10);
+    // 00-59 범위 체크
+    if (minuteNum >= 0 && minuteNum <= MAX_MINUTE) {
+        return minuteStr; // 2자리로 패딩
+    }
+    return input;
+};