@bigtablet/design-system 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +523 -0
- package/dist/index.css +990 -0
- package/dist/index.d.cts +146 -0
- package/dist/index.d.ts +146 -0
- package/dist/index.js +487 -0
- package/package.json +66 -0
package/dist/index.d.cts
ADDED
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import * as react_toastify from 'react-toastify';
|
|
4
|
+
|
|
5
|
+
interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
6
|
+
shadow?: "none" | "sm" | "md" | "lg";
|
|
7
|
+
padding?: "none" | "sm" | "md" | "lg";
|
|
8
|
+
bordered?: boolean;
|
|
9
|
+
}
|
|
10
|
+
declare const Card: ({ shadow, padding, bordered, className, ...props }: CardProps) => react_jsx_runtime.JSX.Element;
|
|
11
|
+
|
|
12
|
+
type AlertVariant = "info" | "success" | "warning" | "error";
|
|
13
|
+
interface AlertProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
|
|
14
|
+
variant?: AlertVariant;
|
|
15
|
+
title?: React.ReactNode;
|
|
16
|
+
icon?: React.ReactNode;
|
|
17
|
+
closable?: boolean;
|
|
18
|
+
onClose?: () => void;
|
|
19
|
+
}
|
|
20
|
+
declare const Alert: ({ variant, title, icon, closable, onClose, className, children, ...props }: AlertProps) => react_jsx_runtime.JSX.Element;
|
|
21
|
+
|
|
22
|
+
declare const Loading: ({ size }: {
|
|
23
|
+
size?: number;
|
|
24
|
+
}) => react_jsx_runtime.JSX.Element;
|
|
25
|
+
|
|
26
|
+
declare const ToastProvider: () => react_jsx_runtime.JSX.Element;
|
|
27
|
+
declare const useToast: () => {
|
|
28
|
+
success: (msg: string) => react_toastify.Id;
|
|
29
|
+
error: (msg: string) => react_toastify.Id;
|
|
30
|
+
warning: (msg: string) => react_toastify.Id;
|
|
31
|
+
info: (msg: string) => react_toastify.Id;
|
|
32
|
+
message: (msg: string) => react_toastify.Id;
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> {
|
|
36
|
+
label?: React.ReactNode;
|
|
37
|
+
size?: "sm" | "md" | "lg";
|
|
38
|
+
indeterminate?: boolean;
|
|
39
|
+
}
|
|
40
|
+
declare const Checkbox: ({ label, size, indeterminate, className, ...props }: CheckboxProps) => react_jsx_runtime.JSX.Element;
|
|
41
|
+
|
|
42
|
+
interface FileInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
|
43
|
+
label?: string;
|
|
44
|
+
onFiles?: (files: FileList | null) => void;
|
|
45
|
+
}
|
|
46
|
+
declare const FileInput: ({ label, onFiles, className, ...props }: FileInputProps) => react_jsx_runtime.JSX.Element;
|
|
47
|
+
|
|
48
|
+
interface RadioProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> {
|
|
49
|
+
label?: React.ReactNode;
|
|
50
|
+
size?: "sm" | "md" | "lg";
|
|
51
|
+
}
|
|
52
|
+
declare const Radio: ({ label, size, className, ...props }: RadioProps) => react_jsx_runtime.JSX.Element;
|
|
53
|
+
|
|
54
|
+
interface SwitchProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange"> {
|
|
55
|
+
checked?: boolean;
|
|
56
|
+
defaultChecked?: boolean;
|
|
57
|
+
onChange?: (checked: boolean) => void;
|
|
58
|
+
size?: "sm" | "md" | "lg";
|
|
59
|
+
disabled?: boolean;
|
|
60
|
+
}
|
|
61
|
+
declare const Switch: ({ checked, defaultChecked, onChange, size, disabled, className, ...props }: SwitchProps) => react_jsx_runtime.JSX.Element;
|
|
62
|
+
|
|
63
|
+
type TextFieldVariant = "outline" | "filled" | "ghost";
|
|
64
|
+
type TextFieldSize = "sm" | "md" | "lg";
|
|
65
|
+
interface TextFieldProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> {
|
|
66
|
+
label?: string;
|
|
67
|
+
helperText?: string;
|
|
68
|
+
error?: boolean;
|
|
69
|
+
success?: boolean;
|
|
70
|
+
variant?: TextFieldVariant;
|
|
71
|
+
size?: TextFieldSize;
|
|
72
|
+
leftIcon?: React.ReactNode;
|
|
73
|
+
rightIcon?: React.ReactNode;
|
|
74
|
+
fullWidth?: boolean;
|
|
75
|
+
}
|
|
76
|
+
declare const TextField: React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<HTMLInputElement>>;
|
|
77
|
+
|
|
78
|
+
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
79
|
+
variant?: "primary" | "secondary" | "ghost";
|
|
80
|
+
size?: "sm" | "md" | "lg";
|
|
81
|
+
}
|
|
82
|
+
declare const Button: ({ variant, size, className, ...props }: ButtonProps) => react_jsx_runtime.JSX.Element;
|
|
83
|
+
|
|
84
|
+
type SelectSize = "sm" | "md" | "lg";
|
|
85
|
+
type SelectVariant = "outline" | "filled" | "ghost";
|
|
86
|
+
interface SelectOption {
|
|
87
|
+
value: string;
|
|
88
|
+
label: string;
|
|
89
|
+
disabled?: boolean;
|
|
90
|
+
}
|
|
91
|
+
interface SelectProps {
|
|
92
|
+
id?: string;
|
|
93
|
+
label?: string;
|
|
94
|
+
placeholder?: string;
|
|
95
|
+
/** options 목록 */
|
|
96
|
+
options: SelectOption[];
|
|
97
|
+
/** 값 제어(컨트롤드) */
|
|
98
|
+
value?: string | null;
|
|
99
|
+
onChange?: (value: string | null, option?: SelectOption | null) => void;
|
|
100
|
+
/** 언컨트롤드 기본값 */
|
|
101
|
+
defaultValue?: string | null;
|
|
102
|
+
disabled?: boolean;
|
|
103
|
+
size?: SelectSize;
|
|
104
|
+
variant?: SelectVariant;
|
|
105
|
+
fullWidth?: boolean;
|
|
106
|
+
className?: string;
|
|
107
|
+
}
|
|
108
|
+
declare function Select({ id, label, placeholder, options, value, onChange, defaultValue, disabled, size, variant, fullWidth, className }: SelectProps): react_jsx_runtime.JSX.Element;
|
|
109
|
+
|
|
110
|
+
interface PaginationProps {
|
|
111
|
+
page: number;
|
|
112
|
+
total: number;
|
|
113
|
+
onChange: (page: number) => void;
|
|
114
|
+
siblingCount?: number;
|
|
115
|
+
}
|
|
116
|
+
declare const Pagination: ({ page, total, onChange, siblingCount }: PaginationProps) => react_jsx_runtime.JSX.Element;
|
|
117
|
+
|
|
118
|
+
interface SidebarItem {
|
|
119
|
+
key: string;
|
|
120
|
+
label: React.ReactNode;
|
|
121
|
+
icon?: React.ComponentType<{
|
|
122
|
+
size?: number;
|
|
123
|
+
}>;
|
|
124
|
+
}
|
|
125
|
+
interface SidebarProps {
|
|
126
|
+
items?: SidebarItem[];
|
|
127
|
+
activeKey?: string;
|
|
128
|
+
onItemSelect?: (key: string) => void;
|
|
129
|
+
width?: number;
|
|
130
|
+
collapsible?: boolean;
|
|
131
|
+
defaultCollapsed?: boolean;
|
|
132
|
+
className?: string;
|
|
133
|
+
style?: React.CSSProperties;
|
|
134
|
+
}
|
|
135
|
+
declare const Sidebar: ({ items, activeKey, onItemSelect, width, collapsible, defaultCollapsed, className, style, }: SidebarProps) => react_jsx_runtime.JSX.Element;
|
|
136
|
+
|
|
137
|
+
interface ModalProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
|
|
138
|
+
open: boolean;
|
|
139
|
+
onClose?: () => void;
|
|
140
|
+
closeOnOverlay?: boolean;
|
|
141
|
+
width?: number | string;
|
|
142
|
+
title?: React.ReactNode;
|
|
143
|
+
}
|
|
144
|
+
declare const Modal: ({ open, onClose, closeOnOverlay, width, title, children, ...props }: ModalProps) => react_jsx_runtime.JSX.Element | null;
|
|
145
|
+
|
|
146
|
+
export { Alert, type AlertProps, type AlertVariant, Button, type ButtonProps, Card, type CardProps, Checkbox, type CheckboxProps, FileInput, type FileInputProps, Loading, Modal, type ModalProps, Pagination, type PaginationProps, Radio, type RadioProps, Select, type SelectOption, type SelectProps, Sidebar, type SidebarItem, type SidebarProps, Switch, type SwitchProps, TextField, type TextFieldProps, ToastProvider, useToast };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,146 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import * as react_toastify from 'react-toastify';
|
|
4
|
+
|
|
5
|
+
interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
6
|
+
shadow?: "none" | "sm" | "md" | "lg";
|
|
7
|
+
padding?: "none" | "sm" | "md" | "lg";
|
|
8
|
+
bordered?: boolean;
|
|
9
|
+
}
|
|
10
|
+
declare const Card: ({ shadow, padding, bordered, className, ...props }: CardProps) => react_jsx_runtime.JSX.Element;
|
|
11
|
+
|
|
12
|
+
type AlertVariant = "info" | "success" | "warning" | "error";
|
|
13
|
+
interface AlertProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
|
|
14
|
+
variant?: AlertVariant;
|
|
15
|
+
title?: React.ReactNode;
|
|
16
|
+
icon?: React.ReactNode;
|
|
17
|
+
closable?: boolean;
|
|
18
|
+
onClose?: () => void;
|
|
19
|
+
}
|
|
20
|
+
declare const Alert: ({ variant, title, icon, closable, onClose, className, children, ...props }: AlertProps) => react_jsx_runtime.JSX.Element;
|
|
21
|
+
|
|
22
|
+
declare const Loading: ({ size }: {
|
|
23
|
+
size?: number;
|
|
24
|
+
}) => react_jsx_runtime.JSX.Element;
|
|
25
|
+
|
|
26
|
+
declare const ToastProvider: () => react_jsx_runtime.JSX.Element;
|
|
27
|
+
declare const useToast: () => {
|
|
28
|
+
success: (msg: string) => react_toastify.Id;
|
|
29
|
+
error: (msg: string) => react_toastify.Id;
|
|
30
|
+
warning: (msg: string) => react_toastify.Id;
|
|
31
|
+
info: (msg: string) => react_toastify.Id;
|
|
32
|
+
message: (msg: string) => react_toastify.Id;
|
|
33
|
+
};
|
|
34
|
+
|
|
35
|
+
interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> {
|
|
36
|
+
label?: React.ReactNode;
|
|
37
|
+
size?: "sm" | "md" | "lg";
|
|
38
|
+
indeterminate?: boolean;
|
|
39
|
+
}
|
|
40
|
+
declare const Checkbox: ({ label, size, indeterminate, className, ...props }: CheckboxProps) => react_jsx_runtime.JSX.Element;
|
|
41
|
+
|
|
42
|
+
interface FileInputProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
|
43
|
+
label?: string;
|
|
44
|
+
onFiles?: (files: FileList | null) => void;
|
|
45
|
+
}
|
|
46
|
+
declare const FileInput: ({ label, onFiles, className, ...props }: FileInputProps) => react_jsx_runtime.JSX.Element;
|
|
47
|
+
|
|
48
|
+
interface RadioProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> {
|
|
49
|
+
label?: React.ReactNode;
|
|
50
|
+
size?: "sm" | "md" | "lg";
|
|
51
|
+
}
|
|
52
|
+
declare const Radio: ({ label, size, className, ...props }: RadioProps) => react_jsx_runtime.JSX.Element;
|
|
53
|
+
|
|
54
|
+
interface SwitchProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange"> {
|
|
55
|
+
checked?: boolean;
|
|
56
|
+
defaultChecked?: boolean;
|
|
57
|
+
onChange?: (checked: boolean) => void;
|
|
58
|
+
size?: "sm" | "md" | "lg";
|
|
59
|
+
disabled?: boolean;
|
|
60
|
+
}
|
|
61
|
+
declare const Switch: ({ checked, defaultChecked, onChange, size, disabled, className, ...props }: SwitchProps) => react_jsx_runtime.JSX.Element;
|
|
62
|
+
|
|
63
|
+
type TextFieldVariant = "outline" | "filled" | "ghost";
|
|
64
|
+
type TextFieldSize = "sm" | "md" | "lg";
|
|
65
|
+
interface TextFieldProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> {
|
|
66
|
+
label?: string;
|
|
67
|
+
helperText?: string;
|
|
68
|
+
error?: boolean;
|
|
69
|
+
success?: boolean;
|
|
70
|
+
variant?: TextFieldVariant;
|
|
71
|
+
size?: TextFieldSize;
|
|
72
|
+
leftIcon?: React.ReactNode;
|
|
73
|
+
rightIcon?: React.ReactNode;
|
|
74
|
+
fullWidth?: boolean;
|
|
75
|
+
}
|
|
76
|
+
declare const TextField: React.ForwardRefExoticComponent<TextFieldProps & React.RefAttributes<HTMLInputElement>>;
|
|
77
|
+
|
|
78
|
+
interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
79
|
+
variant?: "primary" | "secondary" | "ghost";
|
|
80
|
+
size?: "sm" | "md" | "lg";
|
|
81
|
+
}
|
|
82
|
+
declare const Button: ({ variant, size, className, ...props }: ButtonProps) => react_jsx_runtime.JSX.Element;
|
|
83
|
+
|
|
84
|
+
type SelectSize = "sm" | "md" | "lg";
|
|
85
|
+
type SelectVariant = "outline" | "filled" | "ghost";
|
|
86
|
+
interface SelectOption {
|
|
87
|
+
value: string;
|
|
88
|
+
label: string;
|
|
89
|
+
disabled?: boolean;
|
|
90
|
+
}
|
|
91
|
+
interface SelectProps {
|
|
92
|
+
id?: string;
|
|
93
|
+
label?: string;
|
|
94
|
+
placeholder?: string;
|
|
95
|
+
/** options 목록 */
|
|
96
|
+
options: SelectOption[];
|
|
97
|
+
/** 값 제어(컨트롤드) */
|
|
98
|
+
value?: string | null;
|
|
99
|
+
onChange?: (value: string | null, option?: SelectOption | null) => void;
|
|
100
|
+
/** 언컨트롤드 기본값 */
|
|
101
|
+
defaultValue?: string | null;
|
|
102
|
+
disabled?: boolean;
|
|
103
|
+
size?: SelectSize;
|
|
104
|
+
variant?: SelectVariant;
|
|
105
|
+
fullWidth?: boolean;
|
|
106
|
+
className?: string;
|
|
107
|
+
}
|
|
108
|
+
declare function Select({ id, label, placeholder, options, value, onChange, defaultValue, disabled, size, variant, fullWidth, className }: SelectProps): react_jsx_runtime.JSX.Element;
|
|
109
|
+
|
|
110
|
+
interface PaginationProps {
|
|
111
|
+
page: number;
|
|
112
|
+
total: number;
|
|
113
|
+
onChange: (page: number) => void;
|
|
114
|
+
siblingCount?: number;
|
|
115
|
+
}
|
|
116
|
+
declare const Pagination: ({ page, total, onChange, siblingCount }: PaginationProps) => react_jsx_runtime.JSX.Element;
|
|
117
|
+
|
|
118
|
+
interface SidebarItem {
|
|
119
|
+
key: string;
|
|
120
|
+
label: React.ReactNode;
|
|
121
|
+
icon?: React.ComponentType<{
|
|
122
|
+
size?: number;
|
|
123
|
+
}>;
|
|
124
|
+
}
|
|
125
|
+
interface SidebarProps {
|
|
126
|
+
items?: SidebarItem[];
|
|
127
|
+
activeKey?: string;
|
|
128
|
+
onItemSelect?: (key: string) => void;
|
|
129
|
+
width?: number;
|
|
130
|
+
collapsible?: boolean;
|
|
131
|
+
defaultCollapsed?: boolean;
|
|
132
|
+
className?: string;
|
|
133
|
+
style?: React.CSSProperties;
|
|
134
|
+
}
|
|
135
|
+
declare const Sidebar: ({ items, activeKey, onItemSelect, width, collapsible, defaultCollapsed, className, style, }: SidebarProps) => react_jsx_runtime.JSX.Element;
|
|
136
|
+
|
|
137
|
+
interface ModalProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
|
|
138
|
+
open: boolean;
|
|
139
|
+
onClose?: () => void;
|
|
140
|
+
closeOnOverlay?: boolean;
|
|
141
|
+
width?: number | string;
|
|
142
|
+
title?: React.ReactNode;
|
|
143
|
+
}
|
|
144
|
+
declare const Modal: ({ open, onClose, closeOnOverlay, width, title, children, ...props }: ModalProps) => react_jsx_runtime.JSX.Element | null;
|
|
145
|
+
|
|
146
|
+
export { Alert, type AlertProps, type AlertVariant, Button, type ButtonProps, Card, type CardProps, Checkbox, type CheckboxProps, FileInput, type FileInputProps, Loading, Modal, type ModalProps, Pagination, type PaginationProps, Radio, type RadioProps, Select, type SelectOption, type SelectProps, Sidebar, type SidebarItem, type SidebarProps, Switch, type SwitchProps, TextField, type TextFieldProps, ToastProvider, useToast };
|