@ncds/ui-admin 1.8.0 → 1.8.2

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

@@ -1,22 +0,0 @@
-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;
-}

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

@@ -1,79 +0,0 @@
-// React 컴포넌트와 동일하게 구성
-const iconSizeMap = {
-    sm: 16,
-    md: 20,
-    lg: 24,
-    xl: 28,
-};
-export class FeaturedIcon {
-    constructor(options) {
-        this.options = {
-            theme: 'light-circle',
-            color: 'neutral',
-            size: 'sm',
-            className: '',
-            ...options,
-        };
-        this.element = this.createElement();
-    }
-    // svgString ( ICON SVG ) 을 받아서 요소를 생성
-    createElement() {
-        const { theme, color, size, className, svgString } = this.options;
-        // React FeaturedIcon과 동일한 클래스 구조
-        const classes = [
-            'ncua-featured-icon',
-            `ncua-featured-icon--${theme}`,
-            `ncua-featured-icon--${color}`,
-            `ncua-featured-icon--${size}`,
-        ];
-        if (className) {
-            classes.push(className);
-        }
-        const div = document.createElement('div');
-        div.className = classes.join(' ');
-        // outline-circle 테마일 때 추가 요소들 (React 컴포넌트와 동일)
-        if (theme === 'outline-circle') {
-            const innerOutline = document.createElement('div');
-            innerOutline.className = 'ncua-featured-icon__outline ncua-featured-icon__outline--inner';
-            div.appendChild(innerOutline);
-            const outerOutline = document.createElement('div');
-            outerOutline.className = 'ncua-featured-icon__outline ncua-featured-icon__outline--outer';
-            div.appendChild(outerOutline);
-        }
-        // SVG 아이콘 추가
-        const iconSize = iconSizeMap[size];
-        const svgWithSize = this.addSizeToSvg(svgString, iconSize);
-        div.innerHTML += svgWithSize;
-        return div;
-    }
-    addSizeToSvg(svgString, size) {
-        return svgString.replace(/<svg([^>]*)>/, `<svg$1 width="${size}" height="${size}">`);
-    }
-    // Public methods
-    getElement() {
-        return this.element;
-    }
-    updateColor(color) {
-        this.element.className = this.element.className.replace(/ncua-featured-icon--(neutral|error|warning|success)/, `ncua-featured-icon--${color}`);
-        this.options.color = color;
-    }
-    updateSize(size) {
-        const iconSize = iconSizeMap[size];
-        this.element.className = this.element.className.replace(/ncua-featured-icon--(sm|md|lg|xl)/, `ncua-featured-icon--${size}`);
-        const svgIcon = this.element.querySelector('svg');
-        if (svgIcon) {
-            svgIcon.setAttribute('width', String(iconSize));
-            svgIcon.setAttribute('height', String(iconSize));
-        }
-        this.options.size = size;
-    }
-    destroy() {
-        if (this.element.parentNode) {
-            this.element.parentNode.removeChild(this.element);
-        }
-    }
-    // Static factory method
-    static create(options) {
-        return new FeaturedIcon(options);
-    }
-}

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

@@ -1,15 +0,0 @@
-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 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";

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

@@ -1,16 +0,0 @@
-// FileInput 관련 CSS 클래스명 상수
-export const FILE_INPUT_CLASS_NAMES = {
-    fileInput: 'ncua-file-input',
-    inputContainer: 'ncua-file-input__input-container',
-    label: 'ncua-file-input__label',
-    helpIcon: 'ncua-input__help-icon',
-    hintText: 'ncua-input__hint-text',
-    hintList: 'ncua-file-input__hint-list',
-    hintItem: 'ncua-file-input__hint-item',
-    fileTags: 'ncua-file-input__file-tags',
-    fileTagContainer: 'ncua-file-input__file-tag-container',
-    fileImage: 'ncua-file-input__file-image',
-};
-export const getFileInputSizeClassName = (size) => `ncua-file-input--${size}`;
-export const getLabelClassName = (isRequired) => isRequired ? 'ncua-label ncua-label--required' : 'ncua-label';
-export const getHintTextClassName = (destructive) => destructive ? 'ncua-input__hint-text ncua-input__hint-text--destructive' : 'ncua-input__hint-text';

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

@@ -1,2 +0,0 @@
-export * from './classNames';
-export * from './types';

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

@@ -1,2 +0,0 @@
-export * from './classNames';
-export * from './types';

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

@@ -1,88 +0,0 @@
-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 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;
-    /**
-     * Callback when files change
-     */
-    onChange?: (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;
-    /**
-     * 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;
-}
-type RequiredKeys = 'size' | 'buttonLabel' | 'multiple' | 'disabled';
-export type RequiredFileInputProps = Required<Pick<BaseFileInputOptions, RequiredKeys>> & Omit<BaseFileInputOptions, RequiredKeys | 'container'>;
-export {};

package/dist/temp/assets/scripts/fileInput/const/types.js

@@ -1,7 +0,0 @@
-// FileInput 관련 타입 정의 (React FileInput.tsx와 동일)
-export var FileInputErrorType;
-(function (FileInputErrorType) {
-    FileInputErrorType["ALREADY_UPLOADED"] = "ALREADY_UPLOADED";
-    FileInputErrorType["EXCEED_MAX_FILE_SIZE"] = "EXCEED_MAX_FILE_SIZE";
-    FileInputErrorType["EXCEED_MAX_FILE_COUNT"] = "EXCEED_MAX_FILE_COUNT";
-})(FileInputErrorType || (FileInputErrorType = {}));

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

@@ -1,13 +0,0 @@
-import { BaseFileInputOptions } from './const/types';
-export declare class FileInput {
-    private model;
-    private view;
-    constructor(options: BaseFileInputOptions);
-    private appendToContainer;
-    private setupEventListeners;
-    private handleBrowseClick;
-    private handleFileChange;
-    getElement(): HTMLDivElement;
-    setDisabled(disabled: boolean): void;
-    destroy(): void;
-}

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

@@ -1,71 +0,0 @@
-import { FileInputModel } from './fileInputModel';
-import { FileInputView } from './fileInputView';
-export class FileInput {
-    constructor(options) {
-        this.handleBrowseClick = () => {
-            if (!this.model.isDisabled()) {
-                this.view.getFileInputElement().click();
-            }
-        };
-        this.handleFileChange = (event) => {
-            const target = event.target;
-            const selectedFiles = target.files;
-            if (!selectedFiles || selectedFiles.length === 0)
-                return;
-            const { validFiles, invalidFiles } = this.model.validateFiles(Array.from(selectedFiles));
-            const options = this.model.getOptions();
-            if (validFiles.length > 0) {
-                options.onChange?.(validFiles);
-            }
-            if (invalidFiles.length > 0) {
-                options.onFail?.(invalidFiles);
-            }
-            target.value = '';
-        };
-        this.model = new FileInputModel(options);
-        this.view = new FileInputView(this.model.getOptions());
-        this.setupEventListeners();
-        if (options.container) {
-            this.appendToContainer(options.container);
-        }
-    }
-    appendToContainer(container) {
-        let containerElement = null;
-        if (typeof container === 'string') {
-            containerElement = document.getElementById(container);
-            if (!containerElement) {
-                containerElement = document.querySelector(container);
-            }
-        }
-        else {
-            containerElement = container;
-        }
-        if (containerElement) {
-            containerElement.appendChild(this.getElement());
-        }
-        else {
-            console.warn(`FileInput: Container not found:`, container);
-        }
-    }
-    setupEventListeners() {
-        const fileInput = this.view.getFileInputElement();
-        const button = this.view.getButtonElement();
-        fileInput.addEventListener('change', this.handleFileChange);
-        button.addEventListener('click', this.handleBrowseClick);
-    }
-    // Public API
-    getElement() {
-        return this.view.getElement();
-    }
-    setDisabled(disabled) {
-        this.model.setDisabled(disabled);
-        this.view.setButtonDisabled(disabled);
-    }
-    destroy() {
-        const fileInput = this.view.getFileInputElement();
-        const button = this.view.getButtonElement();
-        fileInput.removeEventListener('change', this.handleFileChange);
-        button.removeEventListener('click', this.handleBrowseClick);
-        this.view.destroy();
-    }
-}

package/dist/temp/assets/scripts/fileInput/fileInputModel.d.ts

@@ -1,12 +0,0 @@
-import { BaseFileInputOptions, InvalidFile, RequiredFileInputProps } from './const/types';
-export declare class FileInputModel {
-    private options;
-    constructor(options: BaseFileInputOptions);
-    getOptions(): RequiredFileInputProps;
-    validateFiles(fileList: File[]): {
-        validFiles: File[];
-        invalidFiles: InvalidFile[];
-    };
-    setDisabled(disabled: boolean): void;
-    isDisabled(): boolean;
-}

package/dist/temp/assets/scripts/fileInput/fileInputModel.js

@@ -1,37 +0,0 @@
-import { FileInputErrorType } from './const/types';
-export class FileInputModel {
-    constructor(options) {
-        this.options = {
-            size: 'xs',
-            multiple: false,
-            buttonLabel: '파일 찾기',
-            disabled: false,
-            ...options,
-        };
-    }
-    getOptions() {
-        return this.options;
-    }
-    validateFiles(fileList) {
-        const validFiles = [];
-        const invalidFiles = [];
-        for (const file of fileList) {
-            if (this.options.maxFileSize && file.size > this.options.maxFileSize) {
-                invalidFiles.push({ ...file, errorType: FileInputErrorType.EXCEED_MAX_FILE_SIZE });
-                continue;
-            }
-            if (this.options.maxFileCount && validFiles.length >= this.options.maxFileCount) {
-                invalidFiles.push({ ...file, errorType: FileInputErrorType.EXCEED_MAX_FILE_COUNT });
-                continue;
-            }
-            validFiles.push(file);
-        }
-        return { validFiles, invalidFiles };
-    }
-    setDisabled(disabled) {
-        this.options.disabled = disabled;
-    }
-    isDisabled() {
-        return this.options.disabled;
-    }
-}

package/dist/temp/assets/scripts/fileInput/fileInputView.d.ts

@@ -1,42 +0,0 @@
-import { RequiredFileInputProps } from './const/types';
-export declare class FileInputView {
-    private element;
-    private fileInputElement;
-    private buttonElement;
-    private options;
-    constructor(options: RequiredFileInputProps);
-    /**
-     * 메인 DOM 요소 생성
-     */
-    private createElement;
-    /**
-     * Hidden file input 생성
-     */
-    private createFileInput;
-    /**
-     * Input container 생성
-     */
-    private createInputContainer;
-    /**
-     * Label container 생성
-     */
-    private createLabelContainer;
-    /**
-     * Help icon 생성
-     */
-    private createHelpIcon;
-    private createButton;
-    /**
-     * Hint text 생성
-     */
-    private createHintText;
-    /**
-     * Hint list 생성
-     */
-    private createHintList;
-    setButtonDisabled(disabled: boolean): void;
-    getElement(): HTMLDivElement;
-    getFileInputElement(): HTMLInputElement;
-    getButtonElement(): HTMLButtonElement;
-    destroy(): void;
-}

package/dist/temp/assets/scripts/fileInput/fileInputView.js

@@ -1,145 +0,0 @@
-import { FILE_INPUT_CLASS_NAMES, getFileInputSizeClassName, getHintTextClassName, getLabelClassName, } from './const/classNames';
-const HELP_ICON_SVG = `<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor">
-  <circle cx="12" cy="12" r="10" stroke-width="2"/>
-  <path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-  <line x1="12" y1="17" x2="12.01" y2="17" stroke-width="2" stroke-linecap="round"/>
-</svg>`;
-const SHARE_ICON_SVG = `<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="none" class="ncua-btn__icon">
-  <path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12v4.2c0 1.68 0 2.52-.327 3.162a3 3 0 0 1-1.311 1.311C18.72 21 17.88 21 16.2 21H7.8c-1.68 0-2.52 0-3.162-.327a3 3 0 0 1-1.311-1.311C3 18.72 3 17.88 3 16.2V12m13-5-4-4m0 0L8 7m4-4v12"/>
-</svg>`;
-export class FileInputView {
-    constructor(options) {
-        this.options = options;
-        this.element = this.createElement();
-        this.fileInputElement = this.element.querySelector('input[type="file"]');
-        this.buttonElement = this.element.querySelector('button');
-    }
-    /**
-     * 메인 DOM 요소 생성
-     */
-    createElement() {
-        const container = document.createElement('div');
-        const baseClasses = `${FILE_INPUT_CLASS_NAMES.fileInput} ${getFileInputSizeClassName(this.options.size)}`;
-        const customClasses = this.options.className ? ` ${this.options.className}` : '';
-        container.className = baseClasses + customClasses;
-        // Hidden file input 생성
-        container.appendChild(this.createFileInput());
-        // Input container
-        container.appendChild(this.createInputContainer());
-        // Hint list
-        if (this.options.hintItems && this.options.hintItems.length > 0) {
-            container.appendChild(this.createHintList());
-        }
-        return container;
-    }
-    /**
-     * Hidden file input 생성
-     */
-    createFileInput() {
-        const input = document.createElement('input');
-        input.type = 'file';
-        input.hidden = true;
-        input.tabIndex = -1;
-        input.setAttribute('aria-hidden', 'true');
-        input.classList.add('no-filestyle');
-        if (this.options.accept) {
-            input.accept = this.options.accept;
-        }
-        if (this.options.multiple) {
-            input.multiple = true;
-        }
-        return input;
-    }
-    /**
-     * Input container 생성
-     */
-    createInputContainer() {
-        const container = document.createElement('div');
-        container.className = FILE_INPUT_CLASS_NAMES.inputContainer;
-        // Label
-        if (this.options.label) {
-            container.appendChild(this.createLabelContainer());
-        }
-        // Button
-        container.appendChild(this.createButton());
-        // Hint text
-        if (this.options.hintText) {
-            container.appendChild(this.createHintText());
-        }
-        return container;
-    }
-    /**
-     * Label container 생성
-     */
-    createLabelContainer() {
-        const container = document.createElement('div');
-        container.className = FILE_INPUT_CLASS_NAMES.label;
-        const label = document.createElement('label');
-        label.className = getLabelClassName(this.options.isRequired);
-        label.textContent = this.options.label;
-        container.appendChild(label);
-        if (this.options.showHelpIcon) {
-            container.appendChild(this.createHelpIcon());
-        }
-        return container;
-    }
-    /**
-     * Help icon 생성
-     */
-    createHelpIcon() {
-        const iconContainer = document.createElement('span');
-        iconContainer.className = FILE_INPUT_CLASS_NAMES.helpIcon;
-        iconContainer.innerHTML = HELP_ICON_SVG;
-        return iconContainer;
-    }
-    createButton() {
-        const button = document.createElement('button');
-        button.type = 'button';
-        button.className = `ncua-btn ncua-btn--${this.options.size} ncua-btn--secondary-gray`;
-        button.disabled = this.options.disabled;
-        button.insertAdjacentHTML('beforeend', SHARE_ICON_SVG);
-        const label = document.createElement('span');
-        label.className = 'ncua-btn__label';
-        label.textContent = this.options.buttonLabel;
-        button.appendChild(label);
-        return button;
-    }
-    /**
-     * Hint text 생성
-     */
-    createHintText() {
-        const hintText = document.createElement('div');
-        hintText.className = getHintTextClassName(this.options.destructive);
-        hintText.textContent = this.options.hintText;
-        return hintText;
-    }
-    /**
-     * Hint list 생성
-     */
-    createHintList() {
-        const ul = document.createElement('ul');
-        ul.className = FILE_INPUT_CLASS_NAMES.hintList;
-        this.options.hintItems?.forEach((hint) => {
-            const li = document.createElement('li');
-            li.className = FILE_INPUT_CLASS_NAMES.hintItem;
-            li.textContent = hint;
-            ul.appendChild(li);
-        });
-        return ul;
-    }
-    setButtonDisabled(disabled) {
-        this.buttonElement.disabled = disabled;
-    }
-    getElement() {
-        return this.element;
-    }
-    getFileInputElement() {
-        return this.fileInputElement;
-    }
-    getButtonElement() {
-        return this.buttonElement;
-    }
-    destroy() {
-        // View 리소스 정리 - 이벤트 리스너는 FileInput에서 관리
-    }
-}

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

@@ -1,3 +0,0 @@
-export * from './const/classNames';
-export * from './const/types';
-export { FileInput } from './fileInput';

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

@@ -1,9 +0,0 @@
-import { FileInput } from './fileInput';
-export * from './const/classNames';
-export * from './const/types';
-export { FileInput } from './fileInput';
-// 전역 등록 (추후 index.ts와 개별동작 할 수 있게끔 대비)
-if (typeof window !== 'undefined') {
-    window.ncua = window.ncua || {};
-    window.ncua.FileInput = FileInput;
-}

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

@@ -1,63 +0,0 @@
-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;
-}