@ncds/ui-admin 1.3.0 → 1.4.1

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

@@ -1,22 +1,16 @@
+import { Options as FlatpickrOptions } from 'flatpickr/dist/types/options';
 export type DatePickerSize = 'xs' | 'sm';
 interface Options {
     buttons?: DatePickerButton[];
     size: DatePickerSize;
+    autoComplete?: 'on' | 'off';
     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;
+    attrName?: string;
+    placeholder?: string;
+    options: FlatpickrOptions;
 }
 interface DatePickerButton {
     text: string;
@@ -25,13 +19,20 @@ interface DatePickerButton {
     isCurrent: boolean;
 }
 export declare class DatePicker {
-    private readonly element;
+    private static instanceCounter;
+    private static usedWrappers;
+    private readonly contentWrapper;
     private readonly datePickerOptions;
     private readonly size;
+    private readonly instanceId;
+    private separator;
+    private autoComplete;
     private buttons;
     private flatpickrInstances;
     private currentButton;
+    private dateFormat;
     constructor(wrapper: HTMLElement, options: Options);
+    private validateWrapper;
     private init;
     private validationDependencies;
     private initializeWrapper;
@@ -42,8 +43,10 @@ export declare class DatePicker {
     private initializeFlatpickr;
     private updateDateWithButton;
     private setMultipleDates;
+    private updateButtonsByPeriod;
+    private calculateDatesFromButton;
     setDate(dates: string[]): void;
-    getDates(): Date[];
+    getDates(): string[];
 }
 export {};
 //# sourceMappingURL=datePicker.d.ts.map

package/dist/types/assets/scripts/featuredIcon.d.ts

@@ -0,0 +1,23 @@
+export type FeaturedIconTheme = 'light-circle' | 'dark-circle' | 'outline-circle' | 'square-outline';
+export type FeaturedIconColor = 'neutral' | 'error' | 'warning' | 'success';
+export type FeaturedIconSize = 'sm' | 'md' | 'lg' | 'xl';
+export interface FeaturedIconOptions {
+    svgString: string;
+    theme?: FeaturedIconTheme;
+    color?: FeaturedIconColor;
+    size?: FeaturedIconSize;
+    className?: string;
+}
+export declare class FeaturedIcon {
+    private element;
+    private options;
+    constructor(options: FeaturedIconOptions);
+    private createElement;
+    private addSizeToSvg;
+    getElement(): HTMLElement;
+    updateColor(color: FeaturedIconColor): void;
+    updateSize(size: FeaturedIconSize): void;
+    destroy(): void;
+    static create(options: FeaturedIconOptions): FeaturedIcon;
+}
+//# sourceMappingURL=featuredIcon.d.ts.map

package/dist/types/assets/scripts/fileInput/FileInput.d.ts

@@ -0,0 +1,67 @@
+import { BaseFileInputOptions, UploadedFile } from './const/types';
+export declare class FileInput {
+    private model;
+    private view;
+    constructor(options: BaseFileInputOptions);
+    /**
+     * 컨테이너에 요소 추가
+     */
+    private appendToContainer;
+    /**
+     * 이벤트 리스너 설정
+     */
+    private setupEventListeners;
+    /**
+     * 파일 선택 버튼 클릭 핸들러
+     */
+    private handleBrowseClick;
+    /**
+     * 파일 변경 핸들러
+     */
+    private handleFileChange;
+    /**
+     * 파일 제거 핸들러
+     * 주의: 이 메서드는 renderFileTags에서 사용되지만,
+     * 파일 선택 시 자동 렌더링이 비활성화되어 있으므로 수동으로 호출해야 함
+     */
+    private handleRemoveFile;
+    /**
+     * 변경 알림 (onChange/onFileSelect 호출)
+     * 주의: 이 메서드는 setFiles 등 내부적으로 파일 목록이 변경될 때만 사용됨
+     */
+    private notifyChange;
+    /**
+     * 뷰 렌더링 (내부용)
+     */
+    private render;
+    /**
+     * 파일 태그를 수동으로 렌더링
+     * 사용자가 콜백에서 직접 호출하여 태그를 렌더링할 수 있음
+     */
+    renderFileTags(): void;
+    /**
+     * DOM 요소 반환
+     */
+    getElement(): HTMLDivElement;
+    /**
+     * 현재 파일 목록 반환
+     */
+    getFiles(): File[];
+    /**
+     * 초기 업로드된 파일 목록 설정
+     */
+    setFiles(uploadedFiles: UploadedFile[]): void;
+    /**
+     * 모든 파일 제거
+     */
+    clearFiles(): void;
+    /**
+     * disabled 상태 설정
+     */
+    setDisabled(disabled: boolean): void;
+    /**
+     * 리소스 정리
+     */
+    destroy(): void;
+}
+//# sourceMappingURL=FileInput.d.ts.map

package/dist/types/assets/scripts/fileInput/FileInputModel.d.ts

@@ -0,0 +1,70 @@
+import { BaseFileInputOptions, InvalidFile, RequiredFileInputProps, UploadedFile } from './const/types';
+export declare class FileInputModel {
+    private options;
+    private internalFiles;
+    private initialFiles;
+    private newlyAddedFiles;
+    private deletedInitialFiles;
+    constructor(options: BaseFileInputOptions);
+    /**
+     * 옵션 반환
+     */
+    getOptions(): RequiredFileInputProps;
+    /**
+     * 현재 파일 목록 반환 (초기 파일 + 새로 추가된 파일, 삭제 표시된 파일 제외)
+     */
+    getFiles(): File[];
+    /**
+     * 파일명에서 MIME 타입 추론
+     */
+    private getMimeTypeFromFileName;
+    /**
+     * 초기 업로드된 파일 목록 설정 (UploadedFile[] 타입만 허용)
+     */
+    setFiles(uploadedFiles: UploadedFile[]): void;
+    /**
+     * 파일 추가
+     */
+    addFiles(files: File[]): void;
+    /**
+     * 특정 인덱스의 파일 제거
+     */
+    removeFile(index: number): void;
+    /**
+     * 모든 파일 제거
+     */
+    clearFiles(): void;
+    /**
+     * 파일 유효성 검사
+     */
+    validateFiles(fileList: File[]): {
+        validFiles: File[];
+        invalidFiles: InvalidFile[];
+    };
+    /**
+     * disabled 상태 설정
+     */
+    setDisabled(disabled: boolean): void;
+    /**
+     * disabled 상태 반환
+     */
+    isDisabled(): boolean;
+    /**
+     * Controlled mode 여부 확인
+     * onChange가 있으면 Controlled mode로 판단
+     */
+    isControlled(): boolean;
+    /**
+     * 파일이 초기 파일인지 확인 (UploadedFile로 설정된 기존 파일)
+     */
+    isInitialFile(file: File): boolean;
+    /**
+     * 파일이 새로 추가된 파일인지 확인
+     */
+    isNewlyAddedFile(file: File): boolean;
+    /**
+     * 파일이 삭제 표시된 초기 파일인지 확인
+     */
+    isDeletedInitialFile(file: File): boolean;
+}
+//# sourceMappingURL=FileInputModel.d.ts.map

package/dist/types/assets/scripts/fileInput/FileInputView.d.ts

@@ -0,0 +1,77 @@
+import { RequiredFileInputProps } from './const/types';
+import { FileInputModel } from './FileInputModel';
+export declare class FileInputView {
+    private element;
+    private fileInputElement;
+    private buttonElement;
+    private fileTagsContainer;
+    private tagInstances;
+    private options;
+    private model;
+    private renderedFiles;
+    constructor(options: RequiredFileInputProps, model: FileInputModel);
+    /**
+     * 메인 DOM 요소 생성
+     */
+    private createElement;
+    /**
+     * Hidden file input 생성
+     */
+    private createFileInput;
+    /**
+     * Input container 생성
+     */
+    private createInputContainer;
+    /**
+     * Label container 생성
+     */
+    private createLabelContainer;
+    /**
+     * Help icon 생성
+     */
+    private createHelpIcon;
+    private createButton;
+    private createShareIcon;
+    /**
+     * Hint text 생성
+     */
+    private createHintText;
+    /**
+     * Hint list 생성
+     */
+    private createHintList;
+    /**
+     * 파일 태그 렌더링 (삭제 표시된 초기 파일 포함)
+     */
+    renderFileTags(files: File[], onRemove: (index: number) => void): void;
+    /**
+     * 삭제 표시된 초기 파일을 포함한 전체 파일 목록 반환
+     */
+    private getAllFilesIncludingDeleted;
+    /**
+     * 두 파일이 같은 파일인지 확인
+     */
+    private isSameFile;
+    /**
+     * 특정 인덱스에 파일 태그 삽입
+     */
+    private insertFileTagAtIndex;
+    /**
+     * 파일 태그 생성 (마지막에 추가)
+     */
+    private createFileTag;
+    /**
+     * 파일 태그 컨테이너 생성
+     */
+    private createFileTagContainer;
+    /**
+     * 파일 인덱스 업데이트
+     */
+    private updateFileIndices;
+    setButtonDisabled(disabled: boolean): void;
+    getElement(): HTMLDivElement;
+    getFileInputElement(): HTMLInputElement;
+    getButtonElement(): HTMLButtonElement;
+    destroy(): void;
+}
+//# sourceMappingURL=FileInputView.d.ts.map

package/dist/types/assets/scripts/fileInput/const/classNames.d.ts

@@ -0,0 +1,17 @@
+export declare const FILE_INPUT_CLASS_NAMES: {
+    fileInput: string;
+    inputContainer: string;
+    label: string;
+    helpIcon: string;
+    hintText: string;
+    hintList: string;
+    hintItem: string;
+    fileTags: string;
+    fileTagContainer: string;
+    fileImage: string;
+};
+export declare const getFileInputSizeClassName: (size: string) => string;
+export declare const getButtonSizeClassName: (size: string) => string;
+export declare const getLabelClassName: (isRequired?: boolean) => "ncua-label" | "ncua-label ncua-label--required";
+export declare const getHintTextClassName: (destructive?: boolean) => "ncua-input__hint-text" | "ncua-input__hint-text ncua-input__hint-text--destructive";
+//# sourceMappingURL=classNames.d.ts.map

package/dist/types/assets/scripts/fileInput/const/index.d.ts

@@ -0,0 +1,3 @@
+export * from './classNames';
+export * from './types';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/assets/scripts/fileInput/const/types.d.ts

@@ -0,0 +1,132 @@
+export declare enum FileInputErrorType {
+    ALREADY_UPLOADED = "ALREADY_UPLOADED",
+    EXCEED_MAX_FILE_SIZE = "EXCEED_MAX_FILE_SIZE",
+    EXCEED_MAX_FILE_COUNT = "EXCEED_MAX_FILE_COUNT"
+}
+export interface InvalidFile extends Omit<File, 'constructor'> {
+    errorType: FileInputErrorType;
+}
+export type FileInputSize = 'xs' | 'sm' | 'md' | 'lg';
+export type UploadedFile = {
+    fileName: string;
+    fileImageUrl?: string;
+};
+export interface BaseFileInputOptions {
+    /**
+     * Size of the input
+     */
+    size?: FileInputSize;
+    /**
+     * Accepted file types
+     * e.g. '.jpg,.png,.pdf' or 'image/*'
+     */
+    accept?: string;
+    /**
+     * Allow multiple file selection
+     */
+    multiple?: boolean;
+    /**
+     * Maximum number of files
+     */
+    maxFileCount?: number;
+    /**
+     * Maximum file size in bytes
+     */
+    maxFileSize?: number;
+    /**
+     * Initial files (controlled mode)
+     */
+    value?: File[];
+    /**
+     * Callback when files change (controlled mode)
+     */
+    onChange?: (files: File[]) => void;
+    /**
+     * Callback when files are selected (uncontrolled mode)
+     */
+    onFileSelect?: (files: File[]) => void;
+    /**
+     * Callback when file selection fails
+     */
+    onFail?: (files: InvalidFile[]) => void;
+    /**
+     * Label shown on the button
+     */
+    buttonLabel?: string;
+    /**
+     * Whether the input is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Label text
+     */
+    label?: string;
+    /**
+     * Hint text items to display as a list
+     */
+    hintItems?: string[];
+    /**
+     * Whether the input is required
+     */
+    isRequired?: boolean;
+    /**
+     * Whether to show the help icon
+     */
+    showHelpIcon?: boolean;
+    /**
+     * Hint text to display
+     */
+    hintText?: string;
+    /**
+     * Validation state
+     */
+    validation?: boolean;
+    /**
+     * Destructive state
+     */
+    destructive?: boolean;
+    /**
+     * Show image preview for image files
+     */
+    showImagePreview?: boolean;
+    /**
+     * Name attribute for file input (for PHP form submission)
+     */
+    fileInputName?: string;
+    /**
+     * Name attribute for checkbox input (for existing files deletion)
+     */
+    checkboxName?: string;
+    /**
+     * Container element or selector to automatically append the file input
+     * Can be a DOM element, element ID, or CSS selector
+     */
+    container?: HTMLElement | string;
+    /**
+     * Additional CSS class names to add to the main file input element
+     */
+    className?: string;
+}
+export interface RequiredFileInputProps extends Required<Pick<BaseFileInputOptions, 'size' | 'buttonLabel'>> {
+    accept?: string;
+    multiple: boolean;
+    maxFileCount?: number;
+    maxFileSize?: number;
+    value?: File[];
+    onChange?: (files: File[]) => void;
+    onFileSelect?: (files: File[]) => void;
+    onFail?: (files: InvalidFile[]) => void;
+    disabled: boolean;
+    label?: string;
+    hintItems?: string[];
+    isRequired?: boolean;
+    showHelpIcon?: boolean;
+    hintText?: string;
+    validation?: boolean;
+    destructive?: boolean;
+    showImagePreview: boolean;
+    fileInputName?: string;
+    checkboxName?: string;
+    className?: string;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/types/assets/scripts/fileInput/index.d.ts

@@ -0,0 +1,4 @@
+export * from './const/classNames';
+export * from './const/types';
+export { FileInput } from './FileInput';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/assets/scripts/imageFileInput/ImageFileInput.d.ts

@@ -0,0 +1,64 @@
+import { BaseImageFileInputOptions, UploadedFile } from './const/types';
+export declare class ImageFileInput {
+    private model;
+    private view;
+    constructor(options: BaseImageFileInputOptions);
+    /**
+     * 컨테이너에 요소 추가
+     */
+    private appendToContainer;
+    /**
+     * 이벤트 리스너 설정
+     */
+    private setupEventListeners;
+    /**
+     * 파일 선택 버튼 클릭 핸들러
+     */
+    private handleBrowseClick;
+    /**
+     * 파일 변경 핸들러
+     */
+    private handleFileChange;
+    /**
+     * 파일 제거 핸들러
+     */
+    private handleRemoveFile;
+    /**
+     * 변경 알림 (onChange/onFileSelect 호출)
+     */
+    private notifyChange;
+    /**
+     * 뷰 렌더링 (내부용)
+     */
+    private render;
+    /**
+     * 이미지 프리뷰를 수동으로 렌더링
+     * 사용자가 콜백에서 직접 호출하여 프리뷰를 렌더링할 수 있음
+     */
+    renderImagePreviews(): void;
+    /**
+     * DOM 요소 반환
+     */
+    getElement(): HTMLDivElement;
+    /**
+     * 현재 파일 목록 반환
+     */
+    getFiles(): File[];
+    /**
+     * 초기 업로드된 파일 목록 설정
+     */
+    setFiles(uploadedFiles: UploadedFile[]): void;
+    /**
+     * 모든 파일 제거
+     */
+    clearFiles(): void;
+    /**
+     * disabled 상태 설정
+     */
+    setDisabled(disabled: boolean): void;
+    /**
+     * 리소스 정리
+     */
+    destroy(): void;
+}
+//# sourceMappingURL=ImageFileInput.d.ts.map

package/dist/types/assets/scripts/imageFileInput/ImageFileInputModel.d.ts

@@ -0,0 +1,74 @@
+import { BaseImageFileInputOptions, InvalidFile, RequiredImageFileInputProps, UploadedFile } from './const/types';
+export declare class ImageFileInputModel {
+    private options;
+    private internalFiles;
+    private initialFiles;
+    private newlyAddedFiles;
+    private deletedInitialFiles;
+    constructor(options: BaseImageFileInputOptions);
+    /**
+     * 옵션 반환
+     */
+    getOptions(): RequiredImageFileInputProps;
+    /**
+     * 현재 파일 목록 반환 (초기 파일 + 새로 추가된 파일, 삭제 표시된 파일 제외)
+     */
+    getFiles(): File[];
+    /**
+     * 파일명에서 MIME 타입 추론
+     */
+    private getMimeTypeFromFileName;
+    /**
+     * 초기 업로드된 파일 목록 설정 (UploadedFile[] 타입만 허용)
+     */
+    setFiles(uploadedFiles: UploadedFile[]): void;
+    /**
+     * 파일 추가
+     */
+    addFiles(files: File[]): void;
+    /**
+     * 특정 인덱스의 파일 제거
+     */
+    removeFile(index: number): void;
+    /**
+     * 모든 파일 제거
+     */
+    clearFiles(): void;
+    /**
+     * 파일 유효성 검사
+     */
+    validateFiles(fileList: File[]): {
+        validFiles: File[];
+        invalidFiles: InvalidFile[];
+    };
+    /**
+     * disabled 상태 설정
+     */
+    setDisabled(disabled: boolean): void;
+    /**
+     * disabled 상태 반환
+     */
+    isDisabled(): boolean;
+    /**
+     * Controlled mode 여부 확인
+     * onChange가 있으면 Controlled mode로 판단
+     */
+    isControlled(): boolean;
+    /**
+     * 파일이 초기 파일인지 확인 (UploadedFile로 설정된 기존 파일)
+     */
+    isInitialFile(file: File): boolean;
+    /**
+     * 파일이 새로 추가된 파일인지 확인
+     */
+    isNewlyAddedFile(file: File): boolean;
+    /**
+     * 파일이 삭제 표시된 초기 파일인지 확인
+     */
+    isDeletedInitialFile(file: File): boolean;
+    /**
+     * 초기 파일의 이미지 URL 반환
+     */
+    getInitialFileImageUrl(file: File): string | undefined;
+}
+//# sourceMappingURL=ImageFileInputModel.d.ts.map

package/dist/types/assets/scripts/imageFileInput/ImageFileInputView.d.ts

@@ -0,0 +1,80 @@
+import { RequiredImageFileInputProps } from './const/types';
+import { ImageFileInputModel } from './ImageFileInputModel';
+export declare class ImageFileInputView {
+    private element;
+    private fileInputElement;
+    private buttonElement;
+    private previewsContainer;
+    private options;
+    private model;
+    private renderedFiles;
+    private previewUrls;
+    constructor(options: RequiredImageFileInputProps, model: ImageFileInputModel);
+    /**
+     * 메인 DOM 요소 생성
+     */
+    private createElement;
+    /**
+     * Hidden file input 생성
+     */
+    private createFileInput;
+    /**
+     * Input container 생성
+     */
+    private createInputContainer;
+    /**
+     * Label container 생성
+     */
+    private createLabelContainer;
+    /**
+     * Help icon 생성
+     */
+    private createHelpIcon;
+    /**
+     * Button 생성 (파일 찾기)
+     */
+    private createButton;
+    /**
+     * Share icon (업로드 아이콘) 생성
+     */
+    private createShareIcon;
+    /**
+     * Trash icon (삭제 아이콘) 생성
+     */
+    private createTrashIcon;
+    /**
+     * Hint text 생성
+     */
+    private createHintText;
+    /**
+     * Hint list 생성
+     * Note: 힌트 리스트는 컴포넌트 size와 관계없이 항상 xs 사이즈로 고정됨
+     */
+    private createHintList;
+    /**
+     * 이미지 프리뷰 렌더링
+     */
+    renderImagePreviews(files: File[], onRemove: (index: number) => void, onBrowseClick: () => void): void;
+    /**
+     * 이미지 프리뷰 생성
+     */
+    private createImagePreview;
+    /**
+     * 빈 슬롯 생성 (파일 찾기 버튼)
+     */
+    private createEmptySlot;
+    /**
+     * Tooltip 생성
+     */
+    private createTooltip;
+    /**
+     * 기존 프리뷰 정리
+     */
+    private cleanupPreviews;
+    setButtonDisabled(disabled: boolean): void;
+    getElement(): HTMLDivElement;
+    getFileInputElement(): HTMLInputElement;
+    getButtonElement(): HTMLButtonElement;
+    destroy(): void;
+}
+//# sourceMappingURL=ImageFileInputView.d.ts.map