jongsultest 0.1.0

package/dist/index.d.mts

@@ -0,0 +1,339 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as _mantine_core from '@mantine/core';
+import { ButtonProps, TextInputProps, PasswordInputProps, NumberInputProps, ColorInputProps, FileInputProps, FileInput, TextareaProps, RadioProps, RadioGroupProps, SwitchProps as SwitchProps$1, SegmentedControlProps, SelectProps, AutocompleteProps, BadgeProps, ActionIconProps, AccordionProps as AccordionProps$1, Accordion as Accordion$1, TitleProps, PaperProps, ModalProps as ModalProps$1, CSSProperties } from '@mantine/core';
+import React, { ComponentPropsWithoutRef, ComponentType, ReactNode, PropsWithChildren } from 'react';
+import { DatePickerInputProps, DateTimePickerProps } from '@mantine/dates';
+import { DropResult } from '@hello-pangea/dnd';
+
+type Props$2 = ButtonProps & ComponentPropsWithoutRef<"button">;
+declare const Button: ({ style, ...props }: Props$2) => react_jsx_runtime.JSX.Element;
+
+declare const InputText: (props: TextInputProps) => react_jsx_runtime.JSX.Element;
+
+declare const InputPassword: (props: PasswordInputProps) => react_jsx_runtime.JSX.Element;
+
+declare const InputNumber: (props: NumberInputProps) => react_jsx_runtime.JSX.Element;
+
+declare const InputColor: (props: ColorInputProps) => react_jsx_runtime.JSX.Element;
+
+type FileInputComponentProps<Multiple extends boolean = false> = Omit<FileInputProps<Multiple>, "translate"> & {
+    translate?: string;
+};
+type FileInputComponent = (<Multiple extends boolean = false>(props: FileInputComponentProps<Multiple>) => React.JSX.Element) & {
+    extend: typeof FileInput.extend;
+};
+declare const InputFile: FileInputComponent;
+
+declare const InputDatePicker: (props: DatePickerInputProps) => react_jsx_runtime.JSX.Element;
+
+declare const InputTextarea: (props: TextareaProps) => react_jsx_runtime.JSX.Element;
+
+declare const InputRadio: ((props: RadioProps) => react_jsx_runtime.JSX.Element) & {
+    Group: (props: RadioGroupProps) => react_jsx_runtime.JSX.Element;
+};
+
+type SwitchProps = SwitchProps$1;
+declare const InputSwitch: ({ checked, style, classNames, ...props }: SwitchProps) => react_jsx_runtime.JSX.Element;
+
+interface SwitchInTableProps<T extends string> {
+    status: T;
+    onStatusChange: (id: number, status: T) => void;
+    id: number;
+    activeValue?: T;
+    inactiveValue?: T;
+    activeLabel?: string;
+    inactiveLabel?: string;
+}
+declare const InputSwitchInTable: <T extends string>({ status, onStatusChange, id, activeValue, inactiveValue, activeLabel, inactiveLabel, }: SwitchInTableProps<T>) => react_jsx_runtime.JSX.Element;
+
+declare const InputSegmentedControl: (props: SegmentedControlProps) => react_jsx_runtime.JSX.Element;
+
+declare const ComboboxSelect: (props: SelectProps) => react_jsx_runtime.JSX.Element;
+
+declare const ComboboxAutocomplete: (props: AutocompleteProps) => react_jsx_runtime.JSX.Element;
+
+declare const DateTimePicker: (props: DateTimePickerProps) => react_jsx_runtime.JSX.Element;
+
+declare const Badge: ({ className, classNames, isRemoveAble, onRemove, ...props }: BadgeProps & {
+    isRemoveAble?: boolean;
+    onRemove?: () => void;
+}) => react_jsx_runtime.JSX.Element;
+
+interface IconSvgProps {
+    size?: number;
+    /** 프리셋("red", "white", "gray", "disabled") 또는 hex 값 */
+    color?: string;
+    disabled?: boolean;
+}
+/** 원형 배경 + 십자 아이콘 (활성: #666666 / 비활성: #DDDDDD) */
+declare const PlusIcon: ({ size, color, disabled }: IconSvgProps) => react_jsx_runtime.JSX.Element;
+/** 휴지통 아이콘 (기본: "gray" / 삭제: "red" / 흰색: "white") */
+declare const TrashIcon: ({ size, color }: IconSvgProps) => react_jsx_runtime.JSX.Element;
+/** 드래그 핸들 아이콘 (6점 그리드) */
+declare const GripVerticalIcon: ({ size, color }: IconSvgProps) => react_jsx_runtime.JSX.Element;
+/** 하단 화살표 아이콘 */
+declare const ChevronDownIcon: ({ size, color }: IconSvgProps) => react_jsx_runtime.JSX.Element;
+
+type Props$1 = ActionIconProps & ComponentPropsWithoutRef<"button"> & {
+    icon?: ComponentType<IconSvgProps>;
+    iconSize?: number;
+    iconColor?: string;
+    children?: ReactNode;
+};
+declare const IconButton: ({ icon: Icon, iconSize, iconColor, disabled, children, ...props }: Props$1) => react_jsx_runtime.JSX.Element;
+
+declare const inputClassNames: {
+    input: string;
+    label: string;
+    placeholder: string;
+    error: string;
+    description: string;
+    root: string;
+};
+
+interface TableColumn<T> {
+    id: string;
+    header: string;
+    accessor?: keyof T;
+    render?: (row: T, index: number) => ReactNode;
+    align?: "left" | "center" | "right";
+    width?: number | string;
+}
+interface TableProps<T> {
+    columns: TableColumn<T>[];
+    data: T[];
+    rowKey?: keyof T | ((row: T, index: number) => string);
+    emptyMessage?: string;
+    striped?: boolean;
+    highlightOnHover?: boolean;
+    onRowClick?: (row: T, index: number) => void;
+}
+declare function Table<T>({ columns, data, rowKey, emptyMessage, highlightOnHover, onRowClick, }: TableProps<T>): react_jsx_runtime.JSX.Element;
+
+interface PaginationProps {
+    total: number;
+    page: number;
+    onChange: (page: number) => void;
+    siblings?: number;
+    boundaries?: number;
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
+    withEdges?: boolean;
+    position?: "left" | "center" | "right";
+}
+declare function Pagination({ total, page, onChange, siblings, boundaries, size, withEdges, position, }: PaginationProps): react_jsx_runtime.JSX.Element | null;
+
+interface AccordionItemData {
+    id: string;
+    title: string;
+    description?: string;
+    icon?: ReactNode;
+    rightSection?: ReactNode;
+    content: ReactNode;
+    disabled?: boolean;
+}
+interface AccordionProps {
+    items: AccordionItemData[];
+    defaultOpen?: string[];
+    multiple?: boolean;
+    variant?: AccordionProps$1["variant"];
+    onChange?: (value: string | string[] | null) => void;
+}
+declare function Accordion({ items, defaultOpen, multiple, variant, onChange, }: AccordionProps): react_jsx_runtime.JSX.Element;
+declare namespace Accordion {
+    var Root: typeof Accordion$1;
+    var Item: _mantine_core.MantineComponent<{
+        props: _mantine_core.AccordionItemProps;
+        ref: HTMLDivElement;
+        stylesNames: "item";
+        compound: true;
+    }>;
+    var Control;
+    var Panel;
+}
+
+interface AccordionDraggableItem {
+    id: string;
+    title: string;
+    content: ReactNode;
+    icon?: ReactNode;
+    rightSection?: ReactNode;
+    isRequired?: boolean;
+    isUsed?: boolean;
+}
+interface AccordionDraggableProps {
+    items: AccordionDraggableItem[];
+    droppableId?: string;
+    activeId?: string | null;
+    onActiveChange?: (id: string | null) => void;
+    onReorder: (result: DropResult) => void;
+    onDelete?: (id: string) => void;
+    onRequiredChange?: (id: string, value: boolean) => void;
+    onUsedChange?: (id: string, value: boolean) => void;
+    emptyMessage?: string;
+    showDeleteButton?: boolean;
+    showRequiredToggle?: boolean;
+    showUsedToggle?: boolean;
+    draggingBgColor?: string;
+}
+declare function AccordionDraggable({ items, droppableId, activeId, onActiveChange, onReorder, onDelete, onRequiredChange, onUsedChange, emptyMessage, showDeleteButton, showRequiredToggle, showUsedToggle, draggingBgColor, }: AccordionDraggableProps): react_jsx_runtime.JSX.Element;
+
+interface NavigationBannerItem {
+    id: string;
+    image: string;
+    title: string;
+}
+interface NavigationBannerProps {
+    items: NavigationBannerItem[];
+    currentIndex?: number;
+    onIndexChange?: (index: number) => void;
+    imageSize?: number;
+    emptyText?: string;
+    showNavigation?: boolean;
+    className?: string;
+}
+declare function NavigationBanner({ items, currentIndex: controlledIndex, onIndexChange, imageSize, emptyText, showNavigation, className, }: NavigationBannerProps): react_jsx_runtime.JSX.Element;
+
+interface ImageUploadProps {
+    value: string[];
+    onChange: (images: string[]) => void;
+    maxCount?: number;
+    variant?: "gallery" | "area" | "input";
+    previewWidth?: number;
+    previewHeight?: number;
+    previewFit?: "cover" | "contain";
+    label?: string;
+    buttonText?: string;
+    placeholder?: string;
+    description?: string;
+    accept?: string;
+    showCount?: boolean;
+    /** 업로드 허용 최대 가로 크기(px) */
+    maxWidth?: number;
+    /** 업로드 허용 최대 세로 크기(px) */
+    maxHeight?: number;
+}
+declare function ImageUpload({ value, onChange, maxCount, variant, previewWidth, previewHeight, previewFit, label, buttonText, placeholder, description, accept, showCount, maxWidth, maxHeight, }: ImageUploadProps): react_jsx_runtime.JSX.Element;
+
+declare function PageTitle({ title, subText, rightContent, leftContent, ...props }: TitleProps & {
+    subText?: string;
+    rightContent?: React.ReactNode;
+    leftContent?: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
+interface PageLoadingProps {
+    bg?: string;
+}
+declare function PageLoading({ bg }: PageLoadingProps): react_jsx_runtime.JSX.Element;
+
+/**
+ *
+ * @param title - 패널 제목
+ * @param totalCount - 내부 데이터 총 개수
+ * @param description - 패널 설명
+ * @param children - 패널 컨텐츠
+ * @param headerRightContent - 패널 헤더 오른쪽 컨텐츠
+ * @param contentBottomPadding - 패널 컨텐츠 하단 패딩 (기본값: 40px)
+ * @param footer - 패널 푸터
+ * @returns 패널 컴포넌트
+ */
+declare const Panel: {
+    ({ title, totalCount, description, children, headerRightContent, contentBottomPadding, footer, ...props }: PaperProps & {
+        title?: string | React.ReactNode;
+        totalCount?: number;
+        description?: string;
+        children?: React.ReactNode;
+        headerRightContent?: React.ReactNode;
+        contentBottomPadding?: number;
+        footer?: React.ReactNode;
+    }): react_jsx_runtime.JSX.Element;
+    Section: typeof Section;
+};
+/**
+ *
+ * @param title - 섹션 제목 (스타일은 패널 제목과 동일)
+ * @param children - 섹션 컨텐츠
+ * @returns
+ */
+declare function Section({ title, children }: {
+    title?: string;
+    children: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
+declare function BoxContainer({ children }: PropsWithChildren): react_jsx_runtime.JSX.Element;
+
+interface EditorLayoutProps {
+    leftPanel: ReactNode;
+    centerPanel: ReactNode;
+    rightPanel: ReactNode;
+    leftSpan?: number;
+    centerSpan?: number;
+    rightSpan?: number;
+}
+declare function EditorLayout({ leftPanel, centerPanel, rightPanel, leftSpan, centerSpan, rightSpan, }: EditorLayoutProps): react_jsx_runtime.JSX.Element;
+
+declare function Modal({ opened, onClose, title, size, styles, children, ...props }: ModalProps$1 & {
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
+interface ModalProps {
+    opened: boolean;
+    onClose: () => void;
+    onConfirm: () => void;
+    message?: string | React.ReactNode;
+}
+declare function ModalDeleteConfirm({ opened, onClose, onConfirm, message }: ModalProps): react_jsx_runtime.JSX.Element;
+
+declare function ModalTokenExpired(): react_jsx_runtime.JSX.Element;
+
+interface Column<T> {
+    id: string;
+    label: string;
+    minWidth?: number;
+    align?: "left" | "right" | "center";
+    format?: (value: any, row: T) => React.ReactNode;
+    style?: CSSProperties;
+    headerStyle?: CSSProperties;
+}
+interface DataTableProps<T> {
+    columns: Column<T>[];
+    data: T[];
+    getRowId: (row: T) => string | number;
+    onRowClick?: (row: T) => void;
+    rowsPerPageOptions?: number[];
+    defaultRowsPerPage?: number;
+    style?: CSSProperties;
+    containerStyle?: CSSProperties;
+    rowStyle?: CSSProperties;
+    emptyMessage?: string;
+}
+declare function DataTable<T extends Record<string, any>>({ columns, data, getRowId, onRowClick, rowsPerPageOptions, defaultRowsPerPage, style, containerStyle, rowStyle, emptyMessage, }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
+
+declare function PageHeader({ headerText, back }: {
+    headerText: string;
+    back?: boolean;
+}): react_jsx_runtime.JSX.Element;
+
+interface Props {
+    title: string;
+    children: React.ReactNode;
+}
+declare const SectionGroupWithTitle: ({ title, children }: Props) => react_jsx_runtime.JSX.Element;
+
+interface TagInputItem {
+    id: string;
+    label: string;
+}
+interface TagInputProps {
+    label?: string;
+    placeholder?: string;
+    items: TagInputItem[];
+    onAdd: (values: string[]) => void;
+    onRemove: (id: string) => void;
+    badgeVariant?: "filled" | "light";
+    badgeColor?: string;
+}
+declare function TagInput({ label, placeholder, items, onAdd, onRemove, badgeVariant, badgeColor, }: TagInputProps): react_jsx_runtime.JSX.Element;
+
+declare function readFileAsDataURL(file: File): Promise<string>;
+
+export { Accordion, AccordionDraggable, type AccordionDraggableItem, type AccordionDraggableProps, type AccordionItemData, type AccordionProps, Badge, BoxContainer, Button, ChevronDownIcon, type Column, ComboboxAutocomplete, ComboboxSelect, DataTable, DateTimePicker, EditorLayout, GripVerticalIcon, IconButton, type IconSvgProps, ImageUpload, InputColor, InputDatePicker, InputFile, InputNumber, InputPassword, InputRadio, InputSegmentedControl, InputSwitch, InputSwitchInTable, InputText, InputTextarea, Modal, ModalDeleteConfirm, ModalTokenExpired, NavigationBanner, type NavigationBannerItem, type NavigationBannerProps, PageHeader, PageLoading, PageTitle, Pagination, type PaginationProps, Panel, PlusIcon, SectionGroupWithTitle, Table, type TableColumn, type TableProps, TagInput, type TagInputItem, type TagInputProps, TrashIcon, inputClassNames, readFileAsDataURL };

package/dist/index.d.ts

@@ -0,0 +1,339 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as _mantine_core from '@mantine/core';
+import { ButtonProps, TextInputProps, PasswordInputProps, NumberInputProps, ColorInputProps, FileInputProps, FileInput, TextareaProps, RadioProps, RadioGroupProps, SwitchProps as SwitchProps$1, SegmentedControlProps, SelectProps, AutocompleteProps, BadgeProps, ActionIconProps, AccordionProps as AccordionProps$1, Accordion as Accordion$1, TitleProps, PaperProps, ModalProps as ModalProps$1, CSSProperties } from '@mantine/core';
+import React, { ComponentPropsWithoutRef, ComponentType, ReactNode, PropsWithChildren } from 'react';
+import { DatePickerInputProps, DateTimePickerProps } from '@mantine/dates';
+import { DropResult } from '@hello-pangea/dnd';
+
+type Props$2 = ButtonProps & ComponentPropsWithoutRef<"button">;
+declare const Button: ({ style, ...props }: Props$2) => react_jsx_runtime.JSX.Element;
+
+declare const InputText: (props: TextInputProps) => react_jsx_runtime.JSX.Element;
+
+declare const InputPassword: (props: PasswordInputProps) => react_jsx_runtime.JSX.Element;
+
+declare const InputNumber: (props: NumberInputProps) => react_jsx_runtime.JSX.Element;
+
+declare const InputColor: (props: ColorInputProps) => react_jsx_runtime.JSX.Element;
+
+type FileInputComponentProps<Multiple extends boolean = false> = Omit<FileInputProps<Multiple>, "translate"> & {
+    translate?: string;
+};
+type FileInputComponent = (<Multiple extends boolean = false>(props: FileInputComponentProps<Multiple>) => React.JSX.Element) & {
+    extend: typeof FileInput.extend;
+};
+declare const InputFile: FileInputComponent;
+
+declare const InputDatePicker: (props: DatePickerInputProps) => react_jsx_runtime.JSX.Element;
+
+declare const InputTextarea: (props: TextareaProps) => react_jsx_runtime.JSX.Element;
+
+declare const InputRadio: ((props: RadioProps) => react_jsx_runtime.JSX.Element) & {
+    Group: (props: RadioGroupProps) => react_jsx_runtime.JSX.Element;
+};
+
+type SwitchProps = SwitchProps$1;
+declare const InputSwitch: ({ checked, style, classNames, ...props }: SwitchProps) => react_jsx_runtime.JSX.Element;
+
+interface SwitchInTableProps<T extends string> {
+    status: T;
+    onStatusChange: (id: number, status: T) => void;
+    id: number;
+    activeValue?: T;
+    inactiveValue?: T;
+    activeLabel?: string;
+    inactiveLabel?: string;
+}
+declare const InputSwitchInTable: <T extends string>({ status, onStatusChange, id, activeValue, inactiveValue, activeLabel, inactiveLabel, }: SwitchInTableProps<T>) => react_jsx_runtime.JSX.Element;
+
+declare const InputSegmentedControl: (props: SegmentedControlProps) => react_jsx_runtime.JSX.Element;
+
+declare const ComboboxSelect: (props: SelectProps) => react_jsx_runtime.JSX.Element;
+
+declare const ComboboxAutocomplete: (props: AutocompleteProps) => react_jsx_runtime.JSX.Element;
+
+declare const DateTimePicker: (props: DateTimePickerProps) => react_jsx_runtime.JSX.Element;
+
+declare const Badge: ({ className, classNames, isRemoveAble, onRemove, ...props }: BadgeProps & {
+    isRemoveAble?: boolean;
+    onRemove?: () => void;
+}) => react_jsx_runtime.JSX.Element;
+
+interface IconSvgProps {
+    size?: number;
+    /** 프리셋("red", "white", "gray", "disabled") 또는 hex 값 */
+    color?: string;
+    disabled?: boolean;
+}
+/** 원형 배경 + 십자 아이콘 (활성: #666666 / 비활성: #DDDDDD) */
+declare const PlusIcon: ({ size, color, disabled }: IconSvgProps) => react_jsx_runtime.JSX.Element;
+/** 휴지통 아이콘 (기본: "gray" / 삭제: "red" / 흰색: "white") */
+declare const TrashIcon: ({ size, color }: IconSvgProps) => react_jsx_runtime.JSX.Element;
+/** 드래그 핸들 아이콘 (6점 그리드) */
+declare const GripVerticalIcon: ({ size, color }: IconSvgProps) => react_jsx_runtime.JSX.Element;
+/** 하단 화살표 아이콘 */
+declare const ChevronDownIcon: ({ size, color }: IconSvgProps) => react_jsx_runtime.JSX.Element;
+
+type Props$1 = ActionIconProps & ComponentPropsWithoutRef<"button"> & {
+    icon?: ComponentType<IconSvgProps>;
+    iconSize?: number;
+    iconColor?: string;
+    children?: ReactNode;
+};
+declare const IconButton: ({ icon: Icon, iconSize, iconColor, disabled, children, ...props }: Props$1) => react_jsx_runtime.JSX.Element;
+
+declare const inputClassNames: {
+    input: string;
+    label: string;
+    placeholder: string;
+    error: string;
+    description: string;
+    root: string;
+};
+
+interface TableColumn<T> {
+    id: string;
+    header: string;
+    accessor?: keyof T;
+    render?: (row: T, index: number) => ReactNode;
+    align?: "left" | "center" | "right";
+    width?: number | string;
+}
+interface TableProps<T> {
+    columns: TableColumn<T>[];
+    data: T[];
+    rowKey?: keyof T | ((row: T, index: number) => string);
+    emptyMessage?: string;
+    striped?: boolean;
+    highlightOnHover?: boolean;
+    onRowClick?: (row: T, index: number) => void;
+}
+declare function Table<T>({ columns, data, rowKey, emptyMessage, highlightOnHover, onRowClick, }: TableProps<T>): react_jsx_runtime.JSX.Element;
+
+interface PaginationProps {
+    total: number;
+    page: number;
+    onChange: (page: number) => void;
+    siblings?: number;
+    boundaries?: number;
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
+    withEdges?: boolean;
+    position?: "left" | "center" | "right";
+}
+declare function Pagination({ total, page, onChange, siblings, boundaries, size, withEdges, position, }: PaginationProps): react_jsx_runtime.JSX.Element | null;
+
+interface AccordionItemData {
+    id: string;
+    title: string;
+    description?: string;
+    icon?: ReactNode;
+    rightSection?: ReactNode;
+    content: ReactNode;
+    disabled?: boolean;
+}
+interface AccordionProps {
+    items: AccordionItemData[];
+    defaultOpen?: string[];
+    multiple?: boolean;
+    variant?: AccordionProps$1["variant"];
+    onChange?: (value: string | string[] | null) => void;
+}
+declare function Accordion({ items, defaultOpen, multiple, variant, onChange, }: AccordionProps): react_jsx_runtime.JSX.Element;
+declare namespace Accordion {
+    var Root: typeof Accordion$1;
+    var Item: _mantine_core.MantineComponent<{
+        props: _mantine_core.AccordionItemProps;
+        ref: HTMLDivElement;
+        stylesNames: "item";
+        compound: true;
+    }>;
+    var Control;
+    var Panel;
+}
+
+interface AccordionDraggableItem {
+    id: string;
+    title: string;
+    content: ReactNode;
+    icon?: ReactNode;
+    rightSection?: ReactNode;
+    isRequired?: boolean;
+    isUsed?: boolean;
+}
+interface AccordionDraggableProps {
+    items: AccordionDraggableItem[];
+    droppableId?: string;
+    activeId?: string | null;
+    onActiveChange?: (id: string | null) => void;
+    onReorder: (result: DropResult) => void;
+    onDelete?: (id: string) => void;
+    onRequiredChange?: (id: string, value: boolean) => void;
+    onUsedChange?: (id: string, value: boolean) => void;
+    emptyMessage?: string;
+    showDeleteButton?: boolean;
+    showRequiredToggle?: boolean;
+    showUsedToggle?: boolean;
+    draggingBgColor?: string;
+}
+declare function AccordionDraggable({ items, droppableId, activeId, onActiveChange, onReorder, onDelete, onRequiredChange, onUsedChange, emptyMessage, showDeleteButton, showRequiredToggle, showUsedToggle, draggingBgColor, }: AccordionDraggableProps): react_jsx_runtime.JSX.Element;
+
+interface NavigationBannerItem {
+    id: string;
+    image: string;
+    title: string;
+}
+interface NavigationBannerProps {
+    items: NavigationBannerItem[];
+    currentIndex?: number;
+    onIndexChange?: (index: number) => void;
+    imageSize?: number;
+    emptyText?: string;
+    showNavigation?: boolean;
+    className?: string;
+}
+declare function NavigationBanner({ items, currentIndex: controlledIndex, onIndexChange, imageSize, emptyText, showNavigation, className, }: NavigationBannerProps): react_jsx_runtime.JSX.Element;
+
+interface ImageUploadProps {
+    value: string[];
+    onChange: (images: string[]) => void;
+    maxCount?: number;
+    variant?: "gallery" | "area" | "input";
+    previewWidth?: number;
+    previewHeight?: number;
+    previewFit?: "cover" | "contain";
+    label?: string;
+    buttonText?: string;
+    placeholder?: string;
+    description?: string;
+    accept?: string;
+    showCount?: boolean;
+    /** 업로드 허용 최대 가로 크기(px) */
+    maxWidth?: number;
+    /** 업로드 허용 최대 세로 크기(px) */
+    maxHeight?: number;
+}
+declare function ImageUpload({ value, onChange, maxCount, variant, previewWidth, previewHeight, previewFit, label, buttonText, placeholder, description, accept, showCount, maxWidth, maxHeight, }: ImageUploadProps): react_jsx_runtime.JSX.Element;
+
+declare function PageTitle({ title, subText, rightContent, leftContent, ...props }: TitleProps & {
+    subText?: string;
+    rightContent?: React.ReactNode;
+    leftContent?: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
+interface PageLoadingProps {
+    bg?: string;
+}
+declare function PageLoading({ bg }: PageLoadingProps): react_jsx_runtime.JSX.Element;
+
+/**
+ *
+ * @param title - 패널 제목
+ * @param totalCount - 내부 데이터 총 개수
+ * @param description - 패널 설명
+ * @param children - 패널 컨텐츠
+ * @param headerRightContent - 패널 헤더 오른쪽 컨텐츠
+ * @param contentBottomPadding - 패널 컨텐츠 하단 패딩 (기본값: 40px)
+ * @param footer - 패널 푸터
+ * @returns 패널 컴포넌트
+ */
+declare const Panel: {
+    ({ title, totalCount, description, children, headerRightContent, contentBottomPadding, footer, ...props }: PaperProps & {
+        title?: string | React.ReactNode;
+        totalCount?: number;
+        description?: string;
+        children?: React.ReactNode;
+        headerRightContent?: React.ReactNode;
+        contentBottomPadding?: number;
+        footer?: React.ReactNode;
+    }): react_jsx_runtime.JSX.Element;
+    Section: typeof Section;
+};
+/**
+ *
+ * @param title - 섹션 제목 (스타일은 패널 제목과 동일)
+ * @param children - 섹션 컨텐츠
+ * @returns
+ */
+declare function Section({ title, children }: {
+    title?: string;
+    children: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
+declare function BoxContainer({ children }: PropsWithChildren): react_jsx_runtime.JSX.Element;
+
+interface EditorLayoutProps {
+    leftPanel: ReactNode;
+    centerPanel: ReactNode;
+    rightPanel: ReactNode;
+    leftSpan?: number;
+    centerSpan?: number;
+    rightSpan?: number;
+}
+declare function EditorLayout({ leftPanel, centerPanel, rightPanel, leftSpan, centerSpan, rightSpan, }: EditorLayoutProps): react_jsx_runtime.JSX.Element;
+
+declare function Modal({ opened, onClose, title, size, styles, children, ...props }: ModalProps$1 & {
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
+interface ModalProps {
+    opened: boolean;
+    onClose: () => void;
+    onConfirm: () => void;
+    message?: string | React.ReactNode;
+}
+declare function ModalDeleteConfirm({ opened, onClose, onConfirm, message }: ModalProps): react_jsx_runtime.JSX.Element;
+
+declare function ModalTokenExpired(): react_jsx_runtime.JSX.Element;
+
+interface Column<T> {
+    id: string;
+    label: string;
+    minWidth?: number;
+    align?: "left" | "right" | "center";
+    format?: (value: any, row: T) => React.ReactNode;
+    style?: CSSProperties;
+    headerStyle?: CSSProperties;
+}
+interface DataTableProps<T> {
+    columns: Column<T>[];
+    data: T[];
+    getRowId: (row: T) => string | number;
+    onRowClick?: (row: T) => void;
+    rowsPerPageOptions?: number[];
+    defaultRowsPerPage?: number;
+    style?: CSSProperties;
+    containerStyle?: CSSProperties;
+    rowStyle?: CSSProperties;
+    emptyMessage?: string;
+}
+declare function DataTable<T extends Record<string, any>>({ columns, data, getRowId, onRowClick, rowsPerPageOptions, defaultRowsPerPage, style, containerStyle, rowStyle, emptyMessage, }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
+
+declare function PageHeader({ headerText, back }: {
+    headerText: string;
+    back?: boolean;
+}): react_jsx_runtime.JSX.Element;
+
+interface Props {
+    title: string;
+    children: React.ReactNode;
+}
+declare const SectionGroupWithTitle: ({ title, children }: Props) => react_jsx_runtime.JSX.Element;
+
+interface TagInputItem {
+    id: string;
+    label: string;
+}
+interface TagInputProps {
+    label?: string;
+    placeholder?: string;
+    items: TagInputItem[];
+    onAdd: (values: string[]) => void;
+    onRemove: (id: string) => void;
+    badgeVariant?: "filled" | "light";
+    badgeColor?: string;
+}
+declare function TagInput({ label, placeholder, items, onAdd, onRemove, badgeVariant, badgeColor, }: TagInputProps): react_jsx_runtime.JSX.Element;
+
+declare function readFileAsDataURL(file: File): Promise<string>;
+
+export { Accordion, AccordionDraggable, type AccordionDraggableItem, type AccordionDraggableProps, type AccordionItemData, type AccordionProps, Badge, BoxContainer, Button, ChevronDownIcon, type Column, ComboboxAutocomplete, ComboboxSelect, DataTable, DateTimePicker, EditorLayout, GripVerticalIcon, IconButton, type IconSvgProps, ImageUpload, InputColor, InputDatePicker, InputFile, InputNumber, InputPassword, InputRadio, InputSegmentedControl, InputSwitch, InputSwitchInTable, InputText, InputTextarea, Modal, ModalDeleteConfirm, ModalTokenExpired, NavigationBanner, type NavigationBannerItem, type NavigationBannerProps, PageHeader, PageLoading, PageTitle, Pagination, type PaginationProps, Panel, PlusIcon, SectionGroupWithTitle, Table, type TableColumn, type TableProps, TagInput, type TagInputItem, type TagInputProps, TrashIcon, inputClassNames, readFileAsDataURL };