@hivcd-printshop/design-system 1.1.1 → 1.2.1

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.d.mts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react from 'react';
2
- import { ComponentType, AnchorHTMLAttributes, ReactNode, Ref } from 'react';
2
+ import react__default, { ReactNode, ComponentType, AnchorHTMLAttributes, Ref } from 'react';
3
3
 
4
4
  interface BackButtonProps {
5
5
  onClick?: () => void;
@@ -18,6 +18,257 @@ interface CTAProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
18
18
  }
19
19
  declare const CTA: ({ primary, alert, disabled, label, onClick, className, forModal, ...props }: CTAProps) => react.JSX.Element;
20
20
 
21
+ interface BaseProps$1 {
22
+ children: ReactNode;
23
+ className?: string;
24
+ }
25
+ declare const MultiColumn: (({ children, className }: BaseProps$1) => react__default.JSX.Element) & {
26
+ Columns: ({ children, className }: BaseProps$1) => react__default.JSX.Element;
27
+ CTAs: ({ children, className }: BaseProps$1) => react__default.JSX.Element | null;
28
+ };
29
+
30
+ interface ColumnProps {
31
+ className?: string;
32
+ children: React.ReactNode;
33
+ /**
34
+ * 컬럼 상단 제목. 생략하면 제목 영역을 렌더링하지 않으며,
35
+ * 이 경우 children 안에서 `ColumnSubTitle`로 섹션 제목을 직접 배치할 수 있다.
36
+ */
37
+ header?: string;
38
+ }
39
+ declare const Column: ({ className, children, header }: ColumnProps) => react.JSX.Element;
40
+
41
+ interface ColumnContentContainerProps {
42
+ className?: string;
43
+ children: React.ReactNode;
44
+ }
45
+ declare const ColumnContentContainer: ({ className, children }: ColumnContentContainerProps) => react.JSX.Element;
46
+
47
+ interface ColumnLabelProps {
48
+ className?: string;
49
+ children: string;
50
+ subLabel?: string;
51
+ htmlFor?: string;
52
+ }
53
+ declare const ColumnLabel: ({ className, children, subLabel, htmlFor }: ColumnLabelProps) => react.JSX.Element;
54
+
55
+ interface ColumnTextProps {
56
+ className?: string;
57
+ children?: string | React.ReactNode;
58
+ onClick?: () => void;
59
+ alert?: boolean;
60
+ }
61
+ declare const ColumnTextStyle = "text-body3-book text-strong";
62
+ declare const ModalTextStyle = "text-body1-regular text-primary";
63
+ declare const ColumnText: ({ className, alert, children, onClick }: ColumnTextProps) => react.JSX.Element;
64
+
65
+ interface ColumnSubTitleProps {
66
+ className?: string;
67
+ children: React.ReactNode;
68
+ /** 우측에 부연 아이콘/버튼 등을 배치할 때 사용 (예: 도움말 아이콘) */
69
+ action?: React.ReactNode;
70
+ as?: "h2" | "h3" | "h4" | "header";
71
+ }
72
+ /**
73
+ * Column 내부의 섹션 구분용 부제목.
74
+ * 예: "예약 정보", "예약자 정보", "예약 시 주의사항"
75
+ */
76
+ declare const ColumnSubTitle: ({ className, children, action, as: Tag, }: ColumnSubTitleProps) => react.JSX.Element;
77
+
78
+ interface ColumnDescriptionProps {
79
+ className?: string;
80
+ children: React.ReactNode;
81
+ /** 컴퍼스 마크 불릿 표시 여부. 기본 true. */
82
+ bullet?: boolean;
83
+ }
84
+ /**
85
+ * Column 내부의 안내/주의사항 항목 한 줄.
86
+ * 컴퍼스 마크 불릿 + 본문(body3-book / text-primary)으로 구성되며,
87
+ * 본문이 여러 줄이어도 줄바꿈된 텍스트가 아이콘 아래로 흐르지 않는다(행잉 인덴트).
88
+ * 개행은 `\n` 그대로 반영된다.
89
+ * 예: "예약 시 주의사항" 목록의 각 항목.
90
+ */
91
+ declare const ColumnDescription: ({ className, children, bullet, }: ColumnDescriptionProps) => react.JSX.Element;
92
+ interface ColumnDescriptionListProps {
93
+ className?: string;
94
+ children: React.ReactNode;
95
+ }
96
+ /** `ColumnDescription` 항목들을 16px 간격으로 세로 배치하는 래퍼. */
97
+ declare const ColumnDescriptionList: ({ className, children }: ColumnDescriptionListProps) => react.JSX.Element;
98
+
99
+ interface BasicFormFieldProps {
100
+ children: React.ReactNode;
101
+ isDanger?: boolean;
102
+ dangerText?: string;
103
+ className?: string;
104
+ }
105
+ declare const BasicFormField: ({ children, isDanger, dangerText, className, }: BasicFormFieldProps) => react.JSX.Element;
106
+ declare const getInputStyles: (isDanger?: boolean, additionalClass?: string) => string;
107
+
108
+ interface FormTextProps extends React.InputHTMLAttributes<HTMLInputElement> {
109
+ isDanger?: boolean;
110
+ dangerText?: string;
111
+ }
112
+ declare const FormText: ({ className, isDanger, dangerText, ...props }: FormTextProps) => react.JSX.Element;
113
+
114
+ interface FormTextAreaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
115
+ isDanger?: boolean;
116
+ dangerText?: string;
117
+ }
118
+ declare const FormTextArea: ({ className, isDanger, dangerText, ...props }: FormTextAreaProps) => react.JSX.Element;
119
+
120
+ interface FormNumberProps extends React.InputHTMLAttributes<HTMLInputElement> {
121
+ isDanger?: boolean;
122
+ dangerText?: string;
123
+ }
124
+ declare const FormNumber: ({ className, isDanger, dangerText, ...props }: FormNumberProps) => react.JSX.Element;
125
+
126
+ interface FormPasswordProps extends React.InputHTMLAttributes<HTMLInputElement> {
127
+ isDanger?: boolean;
128
+ dangerText?: string;
129
+ }
130
+ declare const FormPassword: ({ className, isDanger, dangerText, ...props }: FormPasswordProps) => react.JSX.Element;
131
+
132
+ interface FormTelProps extends React.InputHTMLAttributes<HTMLInputElement> {
133
+ isDanger?: boolean;
134
+ dangerText?: string;
135
+ }
136
+ declare const FormTel: ({ className, isDanger, dangerText, onChange, ...props }: FormTelProps) => react.JSX.Element;
137
+
138
+ interface FormColorProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> {
139
+ isDanger?: boolean;
140
+ dangerText?: string;
141
+ }
142
+ declare const FormColor: ({ className, isDanger, dangerText, value, defaultValue, onChange, ...props }: FormColorProps) => react.JSX.Element;
143
+
144
+ interface FormFileProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange"> {
145
+ isDanger?: boolean;
146
+ dangerText?: string;
147
+ fileUrl?: string;
148
+ filename?: string;
149
+ onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
150
+ }
151
+ declare const FormFile: ({ className, isDanger, dangerText, fileUrl, filename, onChange, ...props }: FormFileProps) => react.JSX.Element;
152
+
153
+ interface FormCheckBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange" | "checked"> {
154
+ isChecked: boolean;
155
+ setIsChecked: (checked: boolean) => void;
156
+ children?: React.ReactNode;
157
+ className?: string;
158
+ textStyle?: string;
159
+ }
160
+ declare const FormCheckBox: ({ isChecked, setIsChecked, children, className, textStyle, ...props }: FormCheckBoxProps) => react.JSX.Element;
161
+
162
+ interface FormSelectBoxProps {
163
+ options: string[];
164
+ value: string;
165
+ onChange: (option: string) => void;
166
+ placeholder?: string;
167
+ isDanger?: boolean;
168
+ dangerText?: string;
169
+ className?: string;
170
+ }
171
+ declare const FormSelectBox: ({ options, value, onChange, placeholder, isDanger, dangerText, className, }: FormSelectBoxProps) => react.JSX.Element;
172
+
173
+ interface SelectBoxOptionProps {
174
+ label: string;
175
+ onClick: () => void;
176
+ className?: string;
177
+ }
178
+ declare const SelectBoxOption: ({ label, onClick, className, }: SelectBoxOptionProps) => react.JSX.Element;
179
+
180
+ type CommonProps = {
181
+ children: React.ReactNode;
182
+ /** 텍스트 앞/뒤에 붙는 아이콘 (예: 도움말 ⓘ, 경고 아이콘) */
183
+ icon?: React.ReactNode;
184
+ iconPosition?: "left" | "right";
185
+ /** 위험/경고 강조 색상 */
186
+ alert?: boolean;
187
+ /** 밑줄 표시 여부 (기본 true) */
188
+ underline?: boolean;
189
+ className?: string;
190
+ };
191
+ type TextButtonProps = CommonProps & (({
192
+ href: string;
193
+ } & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof CommonProps>) | ({
194
+ href?: undefined;
195
+ } & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, keyof CommonProps>));
196
+ /**
197
+ * 인라인 텍스트 버튼/링크.
198
+ * 예: "파일 제작 가이드", "파일 첨부", "더 보기", "다시 시도"
199
+ */
200
+ declare const TextButton: ({ children, icon, iconPosition, alert, underline, className, ...props }: TextButtonProps) => react.JSX.Element;
201
+
202
+ interface DropdownProps {
203
+ selectedLabel: string;
204
+ setSelectedLabel: (label: string) => void;
205
+ labels: string[];
206
+ className?: string;
207
+ }
208
+ declare const Dropdown: ({ selectedLabel, setSelectedLabel, labels, className }: DropdownProps) => react.JSX.Element;
209
+
210
+ interface TagProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
211
+ className?: string;
212
+ children: string | React.ReactNode;
213
+ selected?: boolean;
214
+ onClick?: () => void;
215
+ bgColor?: string;
216
+ }
217
+ declare const Tag: ({ className, children, selected, disabled, bgColor, onClick, ...props }: TagProps) => react.JSX.Element;
218
+
219
+ interface ListProps extends Omit<React.HTMLAttributes<HTMLLIElement>, "children"> {
220
+ className?: string;
221
+ label1?: string;
222
+ label2?: string;
223
+ label2OnClick?: () => void;
224
+ label3?: string;
225
+ disabled?: boolean;
226
+ selected?: boolean;
227
+ onClick?: () => void;
228
+ children?: React.ReactElement<TagProps> | React.ReactElement<TagProps>[];
229
+ }
230
+ declare function List({ className, label1, label2, label2OnClick, label3, disabled, selected, onClick, children, ...props }: ListProps): react.JSX.Element;
231
+
232
+ interface ModalProps {
233
+ isVisible: boolean;
234
+ header: string;
235
+ children: react__default.ReactNode;
236
+ className?: string;
237
+ }
238
+ interface BaseProps {
239
+ children: react__default.ReactNode;
240
+ className?: string;
241
+ row?: boolean;
242
+ }
243
+ declare const Modal: (({ isVisible, header, children, className }: ModalProps) => react__default.JSX.Element | null) & {
244
+ Contents: ({ children, className }: BaseProps) => react__default.JSX.Element;
245
+ CTAs: ({ children, className, row }: BaseProps) => react__default.JSX.Element | null;
246
+ };
247
+
248
+ interface ModalTextProps {
249
+ children: React.ReactNode;
250
+ className?: string;
251
+ }
252
+ declare const ModalText: ({ children, className }: ModalTextProps) => react.JSX.Element;
253
+
254
+ declare const IconChevronDownXS: ({ className, stroke, }: {
255
+ className?: string;
256
+ stroke?: string;
257
+ }) => react.JSX.Element;
258
+ declare const IconCheck: ({ className, stroke }: {
259
+ className?: string;
260
+ stroke?: string;
261
+ }) => react.JSX.Element;
262
+ declare const IconInfo: ({ className, stroke }: {
263
+ className?: string;
264
+ stroke?: string;
265
+ }) => react.JSX.Element;
266
+ /** HIVCD 컴퍼스 마크. 주의사항 리스트의 불릿 등으로 사용. */
267
+ declare const IconCompass: ({ className, fill }: {
268
+ className?: string;
269
+ fill?: string;
270
+ }) => react.JSX.Element;
271
+
21
272
  interface CategorySegmentProps {
22
273
  selected?: boolean;
23
274
  label: string;
@@ -115,15 +366,6 @@ interface SideRadioAccordionProps {
115
366
  }
116
367
  declare const SideRadioAccordion: react.ForwardRefExoticComponent<SideRadioAccordionProps & react.RefAttributes<HTMLDivElement>>;
117
368
 
118
- interface TagProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
119
- className?: string;
120
- children: string | React.ReactNode;
121
- selected?: boolean;
122
- onClick?: () => void;
123
- bgColor?: string;
124
- }
125
- declare const Tag: ({ className, children, selected, disabled, bgColor, onClick, ...props }: TagProps) => react.JSX.Element;
126
-
127
369
  type Week = "thisWeek" | "nextWeek" | "twoWeeksLater";
128
370
  interface WeekNavigationProps {
129
371
  /** 표시 중인 주의 월요일(ISO "YYYY-MM-DD"). 범위 라벨(~금요일)을 여기서 계산한다. */
@@ -277,4 +519,4 @@ interface ToastProps {
277
519
  }
278
520
  declare const Toast: react.ForwardRefExoticComponent<ToastProps & react.RefAttributes<HTMLDivElement>>;
279
521
 
280
- export { BackButton, type BackButtonProps, CTA, type CTAProps, CategorySegment, type CategorySegmentProps, CategorySegmentedControl, type CategorySegmentedControlProps, type DayColumn, type LinkComponent, type LowerPartItem, type NavIcon, NoticeBadge, type NoticeBadgeProps, type NoticeBadgeVariable, NoticeBar, type NoticeBarBadgeVariable, type NoticeBarProps, type NoticeBarVariable, type RadioToggle, SearchBar, type SearchBarProps, SideRadioAccordion, type PrintColor$1 as SideRadioAccordionPrintColor, type SideRadioAccordionProps, TNB, type TNBProps, Tag, type TagProps, type TimeSlot, type TimeSlotState, Timetable, type PrintColor as TimetablePrintColor, type TimetableProps, TitleInput, type TitleInputProps, Toast, type ToastProps, type UpperPartItem, type Week, WeekNavigation, type WeekNavigationProps };
522
+ export { BackButton, type BackButtonProps, BasicFormField, type BasicFormFieldProps, CTA, type CTAProps, CategorySegment, type CategorySegmentProps, CategorySegmentedControl, type CategorySegmentedControlProps, Column, ColumnContentContainer, type ColumnContentContainerProps, ColumnDescription, ColumnDescriptionList, type ColumnDescriptionListProps, type ColumnDescriptionProps, ColumnLabel, type ColumnLabelProps, type ColumnProps, ColumnSubTitle, type ColumnSubTitleProps, ColumnText, type ColumnTextProps, ColumnTextStyle, type DayColumn, Dropdown, type DropdownProps, FormCheckBox, type FormCheckBoxProps, FormColor, type FormColorProps, FormFile, type FormFileProps, FormNumber, type FormNumberProps, FormPassword, type FormPasswordProps, FormSelectBox, type FormSelectBoxProps, FormTel, type FormTelProps, FormText, FormTextArea, type FormTextAreaProps, type FormTextProps, IconCheck, IconChevronDownXS, IconCompass, IconInfo, type LinkComponent, List, type ListProps, type LowerPartItem, Modal, type ModalProps, ModalText, type ModalTextProps, ModalTextStyle, MultiColumn, type NavIcon, NoticeBadge, type NoticeBadgeProps, type NoticeBadgeVariable, NoticeBar, type NoticeBarBadgeVariable, type NoticeBarProps, type NoticeBarVariable, type RadioToggle, SearchBar, type SearchBarProps, SelectBoxOption, type SelectBoxOptionProps, SideRadioAccordion, type PrintColor$1 as SideRadioAccordionPrintColor, type SideRadioAccordionProps, TNB, type TNBProps, Tag, type TagProps, TextButton, type TextButtonProps, type TimeSlot, type TimeSlotState, Timetable, type PrintColor as TimetablePrintColor, type TimetableProps, TitleInput, type TitleInputProps, Toast, type ToastProps, type UpperPartItem, type Week, WeekNavigation, type WeekNavigationProps, getInputStyles };
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as react from 'react';
2
- import { ComponentType, AnchorHTMLAttributes, ReactNode, Ref } from 'react';
2
+ import react__default, { ReactNode, ComponentType, AnchorHTMLAttributes, Ref } from 'react';
3
3
 
4
4
  interface BackButtonProps {
5
5
  onClick?: () => void;
@@ -18,6 +18,257 @@ interface CTAProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
18
18
  }
19
19
  declare const CTA: ({ primary, alert, disabled, label, onClick, className, forModal, ...props }: CTAProps) => react.JSX.Element;
20
20
 
21
+ interface BaseProps$1 {
22
+ children: ReactNode;
23
+ className?: string;
24
+ }
25
+ declare const MultiColumn: (({ children, className }: BaseProps$1) => react__default.JSX.Element) & {
26
+ Columns: ({ children, className }: BaseProps$1) => react__default.JSX.Element;
27
+ CTAs: ({ children, className }: BaseProps$1) => react__default.JSX.Element | null;
28
+ };
29
+
30
+ interface ColumnProps {
31
+ className?: string;
32
+ children: React.ReactNode;
33
+ /**
34
+ * 컬럼 상단 제목. 생략하면 제목 영역을 렌더링하지 않으며,
35
+ * 이 경우 children 안에서 `ColumnSubTitle`로 섹션 제목을 직접 배치할 수 있다.
36
+ */
37
+ header?: string;
38
+ }
39
+ declare const Column: ({ className, children, header }: ColumnProps) => react.JSX.Element;
40
+
41
+ interface ColumnContentContainerProps {
42
+ className?: string;
43
+ children: React.ReactNode;
44
+ }
45
+ declare const ColumnContentContainer: ({ className, children }: ColumnContentContainerProps) => react.JSX.Element;
46
+
47
+ interface ColumnLabelProps {
48
+ className?: string;
49
+ children: string;
50
+ subLabel?: string;
51
+ htmlFor?: string;
52
+ }
53
+ declare const ColumnLabel: ({ className, children, subLabel, htmlFor }: ColumnLabelProps) => react.JSX.Element;
54
+
55
+ interface ColumnTextProps {
56
+ className?: string;
57
+ children?: string | React.ReactNode;
58
+ onClick?: () => void;
59
+ alert?: boolean;
60
+ }
61
+ declare const ColumnTextStyle = "text-body3-book text-strong";
62
+ declare const ModalTextStyle = "text-body1-regular text-primary";
63
+ declare const ColumnText: ({ className, alert, children, onClick }: ColumnTextProps) => react.JSX.Element;
64
+
65
+ interface ColumnSubTitleProps {
66
+ className?: string;
67
+ children: React.ReactNode;
68
+ /** 우측에 부연 아이콘/버튼 등을 배치할 때 사용 (예: 도움말 아이콘) */
69
+ action?: React.ReactNode;
70
+ as?: "h2" | "h3" | "h4" | "header";
71
+ }
72
+ /**
73
+ * Column 내부의 섹션 구분용 부제목.
74
+ * 예: "예약 정보", "예약자 정보", "예약 시 주의사항"
75
+ */
76
+ declare const ColumnSubTitle: ({ className, children, action, as: Tag, }: ColumnSubTitleProps) => react.JSX.Element;
77
+
78
+ interface ColumnDescriptionProps {
79
+ className?: string;
80
+ children: React.ReactNode;
81
+ /** 컴퍼스 마크 불릿 표시 여부. 기본 true. */
82
+ bullet?: boolean;
83
+ }
84
+ /**
85
+ * Column 내부의 안내/주의사항 항목 한 줄.
86
+ * 컴퍼스 마크 불릿 + 본문(body3-book / text-primary)으로 구성되며,
87
+ * 본문이 여러 줄이어도 줄바꿈된 텍스트가 아이콘 아래로 흐르지 않는다(행잉 인덴트).
88
+ * 개행은 `\n` 그대로 반영된다.
89
+ * 예: "예약 시 주의사항" 목록의 각 항목.
90
+ */
91
+ declare const ColumnDescription: ({ className, children, bullet, }: ColumnDescriptionProps) => react.JSX.Element;
92
+ interface ColumnDescriptionListProps {
93
+ className?: string;
94
+ children: React.ReactNode;
95
+ }
96
+ /** `ColumnDescription` 항목들을 16px 간격으로 세로 배치하는 래퍼. */
97
+ declare const ColumnDescriptionList: ({ className, children }: ColumnDescriptionListProps) => react.JSX.Element;
98
+
99
+ interface BasicFormFieldProps {
100
+ children: React.ReactNode;
101
+ isDanger?: boolean;
102
+ dangerText?: string;
103
+ className?: string;
104
+ }
105
+ declare const BasicFormField: ({ children, isDanger, dangerText, className, }: BasicFormFieldProps) => react.JSX.Element;
106
+ declare const getInputStyles: (isDanger?: boolean, additionalClass?: string) => string;
107
+
108
+ interface FormTextProps extends React.InputHTMLAttributes<HTMLInputElement> {
109
+ isDanger?: boolean;
110
+ dangerText?: string;
111
+ }
112
+ declare const FormText: ({ className, isDanger, dangerText, ...props }: FormTextProps) => react.JSX.Element;
113
+
114
+ interface FormTextAreaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {
115
+ isDanger?: boolean;
116
+ dangerText?: string;
117
+ }
118
+ declare const FormTextArea: ({ className, isDanger, dangerText, ...props }: FormTextAreaProps) => react.JSX.Element;
119
+
120
+ interface FormNumberProps extends React.InputHTMLAttributes<HTMLInputElement> {
121
+ isDanger?: boolean;
122
+ dangerText?: string;
123
+ }
124
+ declare const FormNumber: ({ className, isDanger, dangerText, ...props }: FormNumberProps) => react.JSX.Element;
125
+
126
+ interface FormPasswordProps extends React.InputHTMLAttributes<HTMLInputElement> {
127
+ isDanger?: boolean;
128
+ dangerText?: string;
129
+ }
130
+ declare const FormPassword: ({ className, isDanger, dangerText, ...props }: FormPasswordProps) => react.JSX.Element;
131
+
132
+ interface FormTelProps extends React.InputHTMLAttributes<HTMLInputElement> {
133
+ isDanger?: boolean;
134
+ dangerText?: string;
135
+ }
136
+ declare const FormTel: ({ className, isDanger, dangerText, onChange, ...props }: FormTelProps) => react.JSX.Element;
137
+
138
+ interface FormColorProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type"> {
139
+ isDanger?: boolean;
140
+ dangerText?: string;
141
+ }
142
+ declare const FormColor: ({ className, isDanger, dangerText, value, defaultValue, onChange, ...props }: FormColorProps) => react.JSX.Element;
143
+
144
+ interface FormFileProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange"> {
145
+ isDanger?: boolean;
146
+ dangerText?: string;
147
+ fileUrl?: string;
148
+ filename?: string;
149
+ onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
150
+ }
151
+ declare const FormFile: ({ className, isDanger, dangerText, fileUrl, filename, onChange, ...props }: FormFileProps) => react.JSX.Element;
152
+
153
+ interface FormCheckBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "onChange" | "checked"> {
154
+ isChecked: boolean;
155
+ setIsChecked: (checked: boolean) => void;
156
+ children?: React.ReactNode;
157
+ className?: string;
158
+ textStyle?: string;
159
+ }
160
+ declare const FormCheckBox: ({ isChecked, setIsChecked, children, className, textStyle, ...props }: FormCheckBoxProps) => react.JSX.Element;
161
+
162
+ interface FormSelectBoxProps {
163
+ options: string[];
164
+ value: string;
165
+ onChange: (option: string) => void;
166
+ placeholder?: string;
167
+ isDanger?: boolean;
168
+ dangerText?: string;
169
+ className?: string;
170
+ }
171
+ declare const FormSelectBox: ({ options, value, onChange, placeholder, isDanger, dangerText, className, }: FormSelectBoxProps) => react.JSX.Element;
172
+
173
+ interface SelectBoxOptionProps {
174
+ label: string;
175
+ onClick: () => void;
176
+ className?: string;
177
+ }
178
+ declare const SelectBoxOption: ({ label, onClick, className, }: SelectBoxOptionProps) => react.JSX.Element;
179
+
180
+ type CommonProps = {
181
+ children: React.ReactNode;
182
+ /** 텍스트 앞/뒤에 붙는 아이콘 (예: 도움말 ⓘ, 경고 아이콘) */
183
+ icon?: React.ReactNode;
184
+ iconPosition?: "left" | "right";
185
+ /** 위험/경고 강조 색상 */
186
+ alert?: boolean;
187
+ /** 밑줄 표시 여부 (기본 true) */
188
+ underline?: boolean;
189
+ className?: string;
190
+ };
191
+ type TextButtonProps = CommonProps & (({
192
+ href: string;
193
+ } & Omit<React.AnchorHTMLAttributes<HTMLAnchorElement>, keyof CommonProps>) | ({
194
+ href?: undefined;
195
+ } & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, keyof CommonProps>));
196
+ /**
197
+ * 인라인 텍스트 버튼/링크.
198
+ * 예: "파일 제작 가이드", "파일 첨부", "더 보기", "다시 시도"
199
+ */
200
+ declare const TextButton: ({ children, icon, iconPosition, alert, underline, className, ...props }: TextButtonProps) => react.JSX.Element;
201
+
202
+ interface DropdownProps {
203
+ selectedLabel: string;
204
+ setSelectedLabel: (label: string) => void;
205
+ labels: string[];
206
+ className?: string;
207
+ }
208
+ declare const Dropdown: ({ selectedLabel, setSelectedLabel, labels, className }: DropdownProps) => react.JSX.Element;
209
+
210
+ interface TagProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
211
+ className?: string;
212
+ children: string | React.ReactNode;
213
+ selected?: boolean;
214
+ onClick?: () => void;
215
+ bgColor?: string;
216
+ }
217
+ declare const Tag: ({ className, children, selected, disabled, bgColor, onClick, ...props }: TagProps) => react.JSX.Element;
218
+
219
+ interface ListProps extends Omit<React.HTMLAttributes<HTMLLIElement>, "children"> {
220
+ className?: string;
221
+ label1?: string;
222
+ label2?: string;
223
+ label2OnClick?: () => void;
224
+ label3?: string;
225
+ disabled?: boolean;
226
+ selected?: boolean;
227
+ onClick?: () => void;
228
+ children?: React.ReactElement<TagProps> | React.ReactElement<TagProps>[];
229
+ }
230
+ declare function List({ className, label1, label2, label2OnClick, label3, disabled, selected, onClick, children, ...props }: ListProps): react.JSX.Element;
231
+
232
+ interface ModalProps {
233
+ isVisible: boolean;
234
+ header: string;
235
+ children: react__default.ReactNode;
236
+ className?: string;
237
+ }
238
+ interface BaseProps {
239
+ children: react__default.ReactNode;
240
+ className?: string;
241
+ row?: boolean;
242
+ }
243
+ declare const Modal: (({ isVisible, header, children, className }: ModalProps) => react__default.JSX.Element | null) & {
244
+ Contents: ({ children, className }: BaseProps) => react__default.JSX.Element;
245
+ CTAs: ({ children, className, row }: BaseProps) => react__default.JSX.Element | null;
246
+ };
247
+
248
+ interface ModalTextProps {
249
+ children: React.ReactNode;
250
+ className?: string;
251
+ }
252
+ declare const ModalText: ({ children, className }: ModalTextProps) => react.JSX.Element;
253
+
254
+ declare const IconChevronDownXS: ({ className, stroke, }: {
255
+ className?: string;
256
+ stroke?: string;
257
+ }) => react.JSX.Element;
258
+ declare const IconCheck: ({ className, stroke }: {
259
+ className?: string;
260
+ stroke?: string;
261
+ }) => react.JSX.Element;
262
+ declare const IconInfo: ({ className, stroke }: {
263
+ className?: string;
264
+ stroke?: string;
265
+ }) => react.JSX.Element;
266
+ /** HIVCD 컴퍼스 마크. 주의사항 리스트의 불릿 등으로 사용. */
267
+ declare const IconCompass: ({ className, fill }: {
268
+ className?: string;
269
+ fill?: string;
270
+ }) => react.JSX.Element;
271
+
21
272
  interface CategorySegmentProps {
22
273
  selected?: boolean;
23
274
  label: string;
@@ -115,15 +366,6 @@ interface SideRadioAccordionProps {
115
366
  }
116
367
  declare const SideRadioAccordion: react.ForwardRefExoticComponent<SideRadioAccordionProps & react.RefAttributes<HTMLDivElement>>;
117
368
 
118
- interface TagProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
119
- className?: string;
120
- children: string | React.ReactNode;
121
- selected?: boolean;
122
- onClick?: () => void;
123
- bgColor?: string;
124
- }
125
- declare const Tag: ({ className, children, selected, disabled, bgColor, onClick, ...props }: TagProps) => react.JSX.Element;
126
-
127
369
  type Week = "thisWeek" | "nextWeek" | "twoWeeksLater";
128
370
  interface WeekNavigationProps {
129
371
  /** 표시 중인 주의 월요일(ISO "YYYY-MM-DD"). 범위 라벨(~금요일)을 여기서 계산한다. */
@@ -277,4 +519,4 @@ interface ToastProps {
277
519
  }
278
520
  declare const Toast: react.ForwardRefExoticComponent<ToastProps & react.RefAttributes<HTMLDivElement>>;
279
521
 
280
- export { BackButton, type BackButtonProps, CTA, type CTAProps, CategorySegment, type CategorySegmentProps, CategorySegmentedControl, type CategorySegmentedControlProps, type DayColumn, type LinkComponent, type LowerPartItem, type NavIcon, NoticeBadge, type NoticeBadgeProps, type NoticeBadgeVariable, NoticeBar, type NoticeBarBadgeVariable, type NoticeBarProps, type NoticeBarVariable, type RadioToggle, SearchBar, type SearchBarProps, SideRadioAccordion, type PrintColor$1 as SideRadioAccordionPrintColor, type SideRadioAccordionProps, TNB, type TNBProps, Tag, type TagProps, type TimeSlot, type TimeSlotState, Timetable, type PrintColor as TimetablePrintColor, type TimetableProps, TitleInput, type TitleInputProps, Toast, type ToastProps, type UpperPartItem, type Week, WeekNavigation, type WeekNavigationProps };
522
+ export { BackButton, type BackButtonProps, BasicFormField, type BasicFormFieldProps, CTA, type CTAProps, CategorySegment, type CategorySegmentProps, CategorySegmentedControl, type CategorySegmentedControlProps, Column, ColumnContentContainer, type ColumnContentContainerProps, ColumnDescription, ColumnDescriptionList, type ColumnDescriptionListProps, type ColumnDescriptionProps, ColumnLabel, type ColumnLabelProps, type ColumnProps, ColumnSubTitle, type ColumnSubTitleProps, ColumnText, type ColumnTextProps, ColumnTextStyle, type DayColumn, Dropdown, type DropdownProps, FormCheckBox, type FormCheckBoxProps, FormColor, type FormColorProps, FormFile, type FormFileProps, FormNumber, type FormNumberProps, FormPassword, type FormPasswordProps, FormSelectBox, type FormSelectBoxProps, FormTel, type FormTelProps, FormText, FormTextArea, type FormTextAreaProps, type FormTextProps, IconCheck, IconChevronDownXS, IconCompass, IconInfo, type LinkComponent, List, type ListProps, type LowerPartItem, Modal, type ModalProps, ModalText, type ModalTextProps, ModalTextStyle, MultiColumn, type NavIcon, NoticeBadge, type NoticeBadgeProps, type NoticeBadgeVariable, NoticeBar, type NoticeBarBadgeVariable, type NoticeBarProps, type NoticeBarVariable, type RadioToggle, SearchBar, type SearchBarProps, SelectBoxOption, type SelectBoxOptionProps, SideRadioAccordion, type PrintColor$1 as SideRadioAccordionPrintColor, type SideRadioAccordionProps, TNB, type TNBProps, Tag, type TagProps, TextButton, type TextButtonProps, type TimeSlot, type TimeSlotState, Timetable, type PrintColor as TimetablePrintColor, type TimetableProps, TitleInput, type TitleInputProps, Toast, type ToastProps, type UpperPartItem, type Week, WeekNavigation, type WeekNavigationProps, getInputStyles };