@3w-witim/ui 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.
@@ -0,0 +1,971 @@
1
+ import { ClassValue } from 'clsx';
2
+ import * as class_variance_authority_types from 'class-variance-authority/types';
3
+ import * as React from 'react';
4
+ import { VariantProps } from 'class-variance-authority';
5
+ import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
6
+ import * as react_jsx_runtime from 'react/jsx-runtime';
7
+
8
+ /**
9
+ * Class name utility (clsx + tailwind-merge)
10
+ */
11
+
12
+ declare function cn(...inputs: ClassValue[]): string;
13
+
14
+ declare const buttonVariants: (props?: ({
15
+ variant?: "primary" | "neutral" | "ghost" | "danger" | "danger-outline" | null | undefined;
16
+ size?: "sm" | "md" | "lg" | null | undefined;
17
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
18
+ interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
19
+ asChild?: boolean;
20
+ }
21
+ declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
22
+
23
+ declare const inputVariants: (props?: ({
24
+ state?: "default" | "error" | null | undefined;
25
+ inputSize?: "sm" | "md" | "lg" | null | undefined;
26
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
27
+ interface InputProps extends Omit<React.ComponentProps<"input">, "size">, VariantProps<typeof inputVariants> {
28
+ /** Presentational leading icon (e.g. search). Rendered inside the field. */
29
+ startIcon?: React.ReactNode;
30
+ /** Presentational trailing icon or affix. */
31
+ endIcon?: React.ReactNode;
32
+ /** Helper / error text rendered below the field. */
33
+ helperText?: React.ReactNode;
34
+ }
35
+ /**
36
+ * Presentation-only input. Wraps the native <input> so leading/trailing icons
37
+ * and helper text render with the field. Error state pairs colour with a
38
+ * status icon + helper text for non-colour accessibility.
39
+ */
40
+ declare const Input: React.ForwardRefExoticComponent<Omit<InputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
41
+
42
+ declare const textareaVariants: (props?: ({
43
+ state?: "default" | "error" | null | undefined;
44
+ size?: "sm" | "md" | "lg" | null | undefined;
45
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
46
+ interface TextareaProps extends Omit<React.ComponentProps<"textarea">, "size">, VariantProps<typeof textareaVariants> {
47
+ }
48
+ declare const Textarea: React.ForwardRefExoticComponent<Omit<TextareaProps, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
49
+
50
+ declare const cardVariants: (props?: ({
51
+ variant?: "default" | "raised" | "outline" | null | undefined;
52
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
53
+ interface CardProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof cardVariants> {
54
+ }
55
+ declare const Card: React.ForwardRefExoticComponent<CardProps & React.RefAttributes<HTMLDivElement>>;
56
+ declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
57
+ declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
58
+ declare const CardDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
59
+ declare const CardContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
60
+ declare const CardFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
61
+
62
+ declare const ScrollArea: React.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
63
+ declare const ScrollBar: React.ForwardRefExoticComponent<Omit<ScrollAreaPrimitive.ScrollAreaScrollbarProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
64
+
65
+ declare const labelVariants: (props?: ({
66
+ variant?: "neutral" | "danger" | "brand" | null | undefined;
67
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
68
+ interface LabelProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof labelVariants> {
69
+ }
70
+ declare const Label: React.ForwardRefExoticComponent<LabelProps & React.RefAttributes<HTMLSpanElement>>;
71
+
72
+ declare const skeletonVariants: (props?: ({
73
+ variant?: "text" | "circle" | "rect" | null | undefined;
74
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
75
+ interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof skeletonVariants> {
76
+ }
77
+ declare const Skeleton: React.ForwardRefExoticComponent<SkeletonProps & React.RefAttributes<HTMLDivElement>>;
78
+
79
+ declare const progressTrackVariants: (props?: ({
80
+ size?: "md" | null | undefined;
81
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
82
+ declare const progressFillVariants: (props?: ({
83
+ indeterminate?: boolean | null | undefined;
84
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
85
+ interface ProgressProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children">, VariantProps<typeof progressTrackVariants> {
86
+ /** Progress value between 0 and 100. Ignored when `indeterminate` is true. */
87
+ value?: number;
88
+ /** Shows an ongoing, unquantified progress animation. */
89
+ indeterminate?: boolean;
90
+ /** Accessible label describing what is loading. */
91
+ label?: string;
92
+ }
93
+ declare const Progress: React.ForwardRefExoticComponent<ProgressProps & React.RefAttributes<HTMLDivElement>>;
94
+
95
+ /**
96
+ * Checkbox — 20px box, radius xs(4px), 2px border, 12px check icon.
97
+ * off = border-border-strong / bg-surface-default
98
+ * on = bg-brand-solid + text-text-on-brand check
99
+ * error= border-danger-border
100
+ *
101
+ * Native input[type=checkbox]를 sr-only로 두고 span 박스를 시각 스타일링한다.
102
+ * 제어(checked) / 비제어(defaultChecked) 모두 지원하는 프리젠테이션 구현.
103
+ */
104
+ declare const checkboxVariants: (props?: ({
105
+ state?: "default" | "error" | null | undefined;
106
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
107
+ type CheckboxVariantProps = VariantProps<typeof checkboxVariants>;
108
+ interface CheckboxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "size">, CheckboxVariantProps {
109
+ /** 우측에 표시할 라벨 (문자열/노드 모두 허용) */
110
+ label?: React.ReactNode;
111
+ /** 에러 상태 (state="error"와 동일, 편의용) */
112
+ error?: boolean;
113
+ }
114
+ declare const Checkbox: React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>>;
115
+
116
+ interface RadioGroupProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {
117
+ /** name shared by all radios in the group */
118
+ name?: string;
119
+ /** controlled selected value */
120
+ value?: string;
121
+ /** uncontrolled default selected value */
122
+ defaultValue?: string;
123
+ onValueChange?: (value: string) => void;
124
+ /** disables every radio in the group */
125
+ disabled?: boolean;
126
+ /** renders every radio in the error state */
127
+ error?: boolean;
128
+ }
129
+ declare const RadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & React.RefAttributes<HTMLDivElement>>;
130
+ declare const radioVariants: (props?: ({
131
+ state?: "default" | "error" | null | undefined;
132
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
133
+ interface RadioProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "type" | "size">, VariantProps<typeof radioVariants> {
134
+ /** required option value */
135
+ value: string;
136
+ /** visible label rendered next to the control */
137
+ label?: React.ReactNode;
138
+ /** optional helper/description text under the label */
139
+ description?: React.ReactNode;
140
+ /** force error styling on this single radio */
141
+ error?: boolean;
142
+ onValueChange?: (value: string) => void;
143
+ }
144
+ declare const Radio: React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<HTMLInputElement>>;
145
+
146
+ declare const toggleTrackVariants: (props?: ({
147
+ size?: "sm" | "md" | null | undefined;
148
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
149
+ declare const toggleThumbVariants: (props?: ({
150
+ size?: "sm" | "md" | null | undefined;
151
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
152
+ interface ToggleProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange" | "type">, VariantProps<typeof toggleTrackVariants> {
153
+ /** Controlled on/off state. */
154
+ checked?: boolean;
155
+ /** Uncontrolled initial state. */
156
+ defaultChecked?: boolean;
157
+ /** Fired with the next boolean state when toggled. */
158
+ onCheckedChange?: (checked: boolean) => void;
159
+ }
160
+ declare const Toggle: React.ForwardRefExoticComponent<ToggleProps & React.RefAttributes<HTMLButtonElement>>;
161
+
162
+ declare const chipVariants: (props?: ({
163
+ variant?: "default" | "selected" | null | undefined;
164
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
165
+ interface ChipProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof chipVariants> {
166
+ /** Show a leading check icon when the chip is selected. */
167
+ showSelectedIcon?: boolean;
168
+ /** Render a trailing remove (x) affordance. */
169
+ removable?: boolean;
170
+ /** Called when the remove affordance is activated. */
171
+ onRemove?: () => void;
172
+ /** Accessible label for the remove control. */
173
+ removeLabel?: string;
174
+ }
175
+ declare const Chip: React.ForwardRefExoticComponent<ChipProps & React.RefAttributes<HTMLButtonElement>>;
176
+
177
+ declare const alertVariants: (props?: ({
178
+ variant?: "danger" | "info" | null | undefined;
179
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
180
+ interface AlertProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
181
+ }
182
+ declare const Alert: React.ForwardRefExoticComponent<AlertProps & React.RefAttributes<HTMLDivElement>>;
183
+ type AlertTitleProps = React.HTMLAttributes<HTMLParagraphElement>;
184
+ declare const AlertTitle: React.ForwardRefExoticComponent<AlertTitleProps & React.RefAttributes<HTMLParagraphElement>>;
185
+ type AlertDescriptionProps = React.HTMLAttributes<HTMLParagraphElement>;
186
+ declare const AlertDescription: React.ForwardRefExoticComponent<AlertDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
187
+
188
+ type PresenceStatus = "online" | "away" | "offline" | "remote";
189
+ type PresenceSize = "sm" | "md" | "lg";
190
+ declare const PRESENCE_LABEL: Record<PresenceStatus, string>;
191
+ interface PresenceProps extends React.HTMLAttributes<HTMLSpanElement> {
192
+ status?: PresenceStatus;
193
+ size?: PresenceSize;
194
+ }
195
+ declare function Presence({ status, size, className, ...props }: PresenceProps): react_jsx_runtime.JSX.Element;
196
+
197
+ /**
198
+ * Avatar — 프로필 미설정 시 WITIM 마스코트 기본 이미지(이니셜 미사용).
199
+ * presence 표시는 공용 Presence 컴포넌트를 그대로 사용(온라인/자리비움 Z/재택 집/오프라인).
200
+ */
201
+ declare const avatarVariants: (props?: ({
202
+ size?: "sm" | "md" | "lg" | "xs" | "xl" | null | undefined;
203
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
204
+ type AvatarSize = NonNullable<VariantProps<typeof avatarVariants>["size"]>;
205
+ type AvatarPresence = PresenceStatus;
206
+ interface AvatarProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof avatarVariants> {
207
+ /** 이미지 소스. 없거나 로드 실패 시 마스코트 기본 이미지 렌더(이니셜 미사용) */
208
+ src?: string;
209
+ /** 대체 텍스트 및 마스코트 색 배정 시드가 되는 이름 */
210
+ alt?: string;
211
+ /** 마스코트 색 — 사용자가 직접 선택(6색 동등). 미지정 시 이름 기반 기본값. */
212
+ color?: AvatarColor;
213
+ /** presence 상태 badge — 공용 Presence 컴포넌트로 렌더(자리비움 Z · 재택 집 · 오프라인 흐림) */
214
+ presence?: AvatarPresence;
215
+ }
216
+ /** 마스코트 색 — 6색 모두 동등한 위계. 사용자가 직접 선택하고 이후 변경 가능. */
217
+ type AvatarColor = "gray" | "lavender" | "mint" | "peach" | "pink" | "sky";
218
+ /** 선택 가능한 마스코트 색 목록 (동등 — 색상 선택 UI 구성용). */
219
+ declare const AVATAR_COLORS: AvatarColor[];
220
+ declare const Avatar: React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLSpanElement>>;
221
+ interface AvatarImageProps extends React.ImgHTMLAttributes<HTMLImageElement> {
222
+ /** 로드 실패 시 사용할 마스코트 색(사용자 선택) */
223
+ color?: AvatarColor;
224
+ /** 로드 실패 시 색 미선택이면 색 배정에 쓸 시드(이름/ID) */
225
+ seed?: string;
226
+ }
227
+ declare const AvatarImage: React.ForwardRefExoticComponent<AvatarImageProps & React.RefAttributes<HTMLImageElement>>;
228
+ interface AvatarFallbackProps extends React.HTMLAttributes<HTMLSpanElement> {
229
+ }
230
+ declare const AvatarFallback: React.ForwardRefExoticComponent<AvatarFallbackProps & React.RefAttributes<HTMLSpanElement>>;
231
+ interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
232
+ /** 최대 표시 개수. 초과분은 '+N' 카운터로 요약 */
233
+ max?: number;
234
+ /** 카운터/겹침 사이즈(자식 Avatar와 맞춤) */
235
+ size?: AvatarSize;
236
+ }
237
+ declare const AvatarGroup: React.ForwardRefExoticComponent<AvatarGroupProps & React.RefAttributes<HTMLDivElement>>;
238
+
239
+ /**
240
+ * Tooltip — presentation-only catalog component.
241
+ *
242
+ * Overlay/positioning here is a visual approximation for the design catalog
243
+ * (no @radix-ui). Real positioning/portal behavior is wired by the app dev.
244
+ * Placement is controlled via the `placement` prop; visibility via `open`
245
+ * (controlled) or hover (uncontrolled, using React.useState).
246
+ */
247
+ type TooltipPlacement = "top" | "top-left" | "top-right" | "right" | "bottom" | "bottom-left" | "bottom-right" | "left";
248
+ declare const tooltipContentVariants: (props?: ({
249
+ placement?: "left" | "right" | "bottom" | "top" | "top-left" | "top-right" | "bottom-left" | "bottom-right" | null | undefined;
250
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
251
+ declare const tooltipArrowVariants: (props?: ({
252
+ placement?: "left" | "right" | "bottom" | "top" | "top-left" | "top-right" | "bottom-left" | "bottom-right" | null | undefined;
253
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
254
+ interface TooltipProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "content">, VariantProps<typeof tooltipContentVariants> {
255
+ /** The tooltip bubble content. */
256
+ content: React.ReactNode;
257
+ /** The trigger element the tooltip is anchored to. */
258
+ children: React.ReactNode;
259
+ /** Controlled visibility. When set, hover state is ignored. */
260
+ open?: boolean;
261
+ /** Show the arrow pointing at the trigger. */
262
+ arrow?: boolean;
263
+ /** Disable the tooltip entirely (never shows). */
264
+ disabled?: boolean;
265
+ }
266
+ declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & React.RefAttributes<HTMLDivElement>>;
267
+
268
+ interface DropdownMenuProps extends React.HTMLAttributes<HTMLDivElement> {
269
+ /** Controlled open state. */
270
+ open?: boolean;
271
+ /** Uncontrolled initial open state. */
272
+ defaultOpen?: boolean;
273
+ /** Fired whenever the open state changes. */
274
+ onOpenChange?: (open: boolean) => void;
275
+ }
276
+ declare const DropdownMenu: React.ForwardRefExoticComponent<DropdownMenuProps & React.RefAttributes<HTMLDivElement>>;
277
+ interface DropdownMenuTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
278
+ }
279
+ declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
280
+ declare const dropdownMenuContentVariants: (props?: ({
281
+ align?: "end" | "start" | null | undefined;
282
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
283
+ interface DropdownMenuContentProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof dropdownMenuContentVariants> {
284
+ /** Force render even when closed (useful for catalog/visual specs). */
285
+ forceMount?: boolean;
286
+ }
287
+ declare const DropdownMenuContent: React.ForwardRefExoticComponent<DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>>;
288
+ declare const dropdownMenuItemVariants: (props?: ({
289
+ variant?: "danger" | "default" | null | undefined;
290
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
291
+ interface DropdownMenuItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "disabled">, VariantProps<typeof dropdownMenuItemVariants> {
292
+ disabled?: boolean;
293
+ /** Optional leading icon element. */
294
+ icon?: React.ReactNode;
295
+ /** Optional trailing content (shortcut hint, chevron, etc.). */
296
+ trailing?: React.ReactNode;
297
+ }
298
+ declare const DropdownMenuItem: React.ForwardRefExoticComponent<DropdownMenuItemProps & React.RefAttributes<HTMLButtonElement>>;
299
+ interface DropdownMenuLabelProps extends React.HTMLAttributes<HTMLDivElement> {
300
+ }
301
+ declare const DropdownMenuLabel: React.ForwardRefExoticComponent<DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>>;
302
+ interface DropdownMenuSeparatorProps extends React.HTMLAttributes<HTMLDivElement> {
303
+ }
304
+ declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>>;
305
+ interface DropdownMenuEmptyProps extends React.HTMLAttributes<HTMLDivElement> {
306
+ }
307
+ declare const DropdownMenuEmpty: React.ForwardRefExoticComponent<DropdownMenuEmptyProps & React.RefAttributes<HTMLDivElement>>;
308
+
309
+ declare const selectTriggerVariants: (props?: ({
310
+ state?: "default" | "error" | null | undefined;
311
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
312
+ interface SelectOption {
313
+ label: string;
314
+ value: string;
315
+ disabled?: boolean;
316
+ }
317
+ interface SelectProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange">, VariantProps<typeof selectTriggerVariants> {
318
+ /** Available options rendered in the dropdown panel. */
319
+ options: SelectOption[];
320
+ /** Currently selected value (controlled). */
321
+ value?: string;
322
+ /** Placeholder shown when no value is selected. */
323
+ placeholder?: string;
324
+ /** Fired when an option is chosen. */
325
+ onValueChange?: (value: string) => void;
326
+ /** Disable the whole control. */
327
+ disabled?: boolean;
328
+ /** Force the panel open (presentational / catalog use). */
329
+ defaultOpen?: boolean;
330
+ /** Accessible label for the trigger button. */
331
+ "aria-label"?: string;
332
+ /** Optional id linking to an external error message element. */
333
+ errorMessageId?: string;
334
+ }
335
+ /**
336
+ * Select — presentational dropdown for the design catalog.
337
+ *
338
+ * Open/close is managed with `React.useState`; wiring to a real
339
+ * accessibility-complete listbox library is left to the developer.
340
+ */
341
+ declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLDivElement>>;
342
+
343
+ interface DialogOverlayProps extends React.HTMLAttributes<HTMLDivElement> {
344
+ }
345
+ declare const DialogOverlay: React.ForwardRefExoticComponent<DialogOverlayProps & React.RefAttributes<HTMLDivElement>>;
346
+ declare const dialogPanelVariants: (props?: ({
347
+ size?: "sm" | "md" | "lg" | null | undefined;
348
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
349
+ interface DialogProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof dialogPanelVariants> {
350
+ /** Presentation-only open control. When false nothing renders. */
351
+ open?: boolean;
352
+ /** Fired when the overlay (or Escape) requests a close. */
353
+ onOpenChange?: (open: boolean) => void;
354
+ /** Accessible label id wired to aria-labelledby. */
355
+ "aria-labelledby"?: string;
356
+ /** Accessible description id wired to aria-describedby. */
357
+ "aria-describedby"?: string;
358
+ /** Class applied to the panel element. */
359
+ className?: string;
360
+ /** Class applied to the overlay element. */
361
+ overlayClassName?: string;
362
+ }
363
+ declare const Dialog: React.ForwardRefExoticComponent<DialogProps & React.RefAttributes<HTMLDivElement>>;
364
+ interface DialogHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
365
+ }
366
+ declare const DialogHeader: React.ForwardRefExoticComponent<DialogHeaderProps & React.RefAttributes<HTMLDivElement>>;
367
+ interface DialogTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {
368
+ }
369
+ declare const DialogTitle: React.ForwardRefExoticComponent<DialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
370
+ interface DialogDescriptionProps extends React.HTMLAttributes<HTMLParagraphElement> {
371
+ }
372
+ declare const DialogDescription: React.ForwardRefExoticComponent<DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
373
+ interface DialogBodyProps extends React.HTMLAttributes<HTMLDivElement> {
374
+ }
375
+ declare const DialogBody: React.ForwardRefExoticComponent<DialogBodyProps & React.RefAttributes<HTMLDivElement>>;
376
+ interface DialogFooterProps extends React.HTMLAttributes<HTMLDivElement> {
377
+ }
378
+ declare const DialogFooter: React.ForwardRefExoticComponent<DialogFooterProps & React.RefAttributes<HTMLDivElement>>;
379
+
380
+ /**
381
+ * Sheet — presentational bottom sheet (design catalog).
382
+ *
383
+ * Overlay + edge-anchored panel with an optional drag handle.
384
+ * Visibility is controlled via the `open` prop; `onOpenChange` is invoked
385
+ * when the overlay or close affordance is activated. Actual gesture /
386
+ * focus-trap behaviour is left to the app integration.
387
+ */
388
+ declare const sheetOverlayVariants: (props?: ({
389
+ open?: boolean | null | undefined;
390
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
391
+ declare const sheetPanelVariants: (props?: ({
392
+ side?: "left" | "right" | "bottom" | "top" | null | undefined;
393
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
394
+ interface SheetProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof sheetPanelVariants> {
395
+ /** Whether the sheet is visible. */
396
+ open?: boolean;
397
+ /** Called when a dismiss affordance (overlay) is activated. */
398
+ onOpenChange?: (open: boolean) => void;
399
+ /** Show the drag handle (only meaningful for the bottom/top sides). */
400
+ showHandle?: boolean;
401
+ /** Accessible label for the dialog surface. */
402
+ "aria-label"?: string;
403
+ }
404
+ declare const Sheet: React.ForwardRefExoticComponent<SheetProps & React.RefAttributes<HTMLDivElement>>;
405
+ declare const SheetHandle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
406
+ declare const SheetHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
407
+ declare const SheetTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLHeadingElement>>;
408
+ declare const SheetDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
409
+ declare const SheetBody: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
410
+ declare const SheetFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
411
+
412
+ interface TabsProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange"> {
413
+ /** Controlled active tab value. */
414
+ value?: string;
415
+ /** Initial active tab value (uncontrolled). */
416
+ defaultValue?: string;
417
+ /** Fires when the active tab changes. */
418
+ onValueChange?: (value: string) => void;
419
+ }
420
+ declare const Tabs: React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>>;
421
+ declare const tabsListVariants: (props?: ({
422
+ fullWidth?: boolean | null | undefined;
423
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
424
+ interface TabsListProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof tabsListVariants> {
425
+ }
426
+ declare const TabsList: React.ForwardRefExoticComponent<TabsListProps & React.RefAttributes<HTMLDivElement>>;
427
+ declare const tabsTriggerVariants: (props?: ({
428
+ active?: boolean | null | undefined;
429
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
430
+ interface TabsTriggerProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "value"> {
431
+ /** Unique value identifying this tab. */
432
+ value: string;
433
+ }
434
+ declare const TabsTrigger: React.ForwardRefExoticComponent<TabsTriggerProps & React.RefAttributes<HTMLButtonElement>>;
435
+ interface TabsContentProps extends React.HTMLAttributes<HTMLDivElement> {
436
+ /** Value of the tab this panel belongs to. */
437
+ value: string;
438
+ /** Keep the panel mounted even when inactive (hidden via CSS). */
439
+ forceMount?: boolean;
440
+ }
441
+ declare const TabsContent: React.ForwardRefExoticComponent<TabsContentProps & React.RefAttributes<HTMLDivElement>>;
442
+
443
+ declare const tableVariants: (props?: ({
444
+ density?: "compact" | "comfortable" | null | undefined;
445
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
446
+ interface TableProps extends React.TableHTMLAttributes<HTMLTableElement>, VariantProps<typeof tableVariants> {
447
+ /** Wrapper element props (the scroll container). */
448
+ containerProps?: React.HTMLAttributes<HTMLDivElement>;
449
+ }
450
+ declare const Table: React.ForwardRefExoticComponent<TableProps & React.RefAttributes<HTMLTableElement>>;
451
+ type TableHeaderProps = React.HTMLAttributes<HTMLTableSectionElement>;
452
+ declare const TableHeader: React.ForwardRefExoticComponent<TableHeaderProps & React.RefAttributes<HTMLTableSectionElement>>;
453
+ type TableBodyProps = React.HTMLAttributes<HTMLTableSectionElement>;
454
+ declare const TableBody: React.ForwardRefExoticComponent<TableBodyProps & React.RefAttributes<HTMLTableSectionElement>>;
455
+ declare const tableRowVariants: (props?: ({
456
+ interactive?: boolean | null | undefined;
457
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
458
+ interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement>, VariantProps<typeof tableRowVariants> {
459
+ /** Visual selected state (also drives aria-selected). */
460
+ selected?: boolean;
461
+ }
462
+ declare const TableRow: React.ForwardRefExoticComponent<TableRowProps & React.RefAttributes<HTMLTableRowElement>>;
463
+ interface TableHeadProps extends React.ThHTMLAttributes<HTMLTableCellElement> {
464
+ /** Sort indicator for accessible sortable columns. */
465
+ sort?: "asc" | "desc" | "none";
466
+ }
467
+ declare const TableHead: React.ForwardRefExoticComponent<TableHeadProps & React.RefAttributes<HTMLTableCellElement>>;
468
+ type TableCellProps = React.TdHTMLAttributes<HTMLTableCellElement>;
469
+ declare const TableCell: React.ForwardRefExoticComponent<TableCellProps & React.RefAttributes<HTMLTableCellElement>>;
470
+ type TableCaptionProps = React.HTMLAttributes<HTMLTableCaptionElement>;
471
+ declare const TableCaption: React.ForwardRefExoticComponent<TableCaptionProps & React.RefAttributes<HTMLTableCaptionElement>>;
472
+
473
+ declare const paginationItemVariants: (props?: ({
474
+ active?: boolean | null | undefined;
475
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
476
+ interface PaginationItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "value">, VariantProps<typeof paginationItemVariants> {
477
+ /** Page number this item represents. */
478
+ page: number;
479
+ }
480
+ declare const PaginationItem: React.ForwardRefExoticComponent<PaginationItemProps & React.RefAttributes<HTMLButtonElement>>;
481
+ declare const PaginationEllipsis: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
482
+ interface PaginationNavProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
483
+ }
484
+ declare const PaginationPrevious: React.ForwardRefExoticComponent<PaginationNavProps & React.RefAttributes<HTMLButtonElement>>;
485
+ declare const PaginationNext: React.ForwardRefExoticComponent<PaginationNavProps & React.RefAttributes<HTMLButtonElement>>;
486
+ type PageRangeItem = number | "ellipsis";
487
+ declare function buildPageRange(current: number, total: number, siblingCount?: number): PageRangeItem[];
488
+ interface PaginationProps extends Omit<React.HTMLAttributes<HTMLElement>, "onChange"> {
489
+ /** Total number of pages. */
490
+ totalPages: number;
491
+ /** Currently active page (1-based). */
492
+ page: number;
493
+ /** Called when a page control is activated. */
494
+ onPageChange?: (page: number) => void;
495
+ /** How many page items to show on each side of the current page. */
496
+ siblingCount?: number;
497
+ /** Accessible label for the navigation landmark. */
498
+ label?: string;
499
+ }
500
+ declare const Pagination: React.ForwardRefExoticComponent<PaginationProps & React.RefAttributes<HTMLElement>>;
501
+
502
+ /**
503
+ * SegmentedControl — 값 기반 세그먼트 컨트롤.
504
+ * height 32 · padding 2 · radius sm(8) · thumb radius 8 · font 14.
505
+ * 컨테이너 bg-surface-sunken, active thumb=bg-surface-default shadow-sm 슬라이드.
506
+ * value/onValueChange 로 제어(controlled) 하거나 defaultValue 로 비제어(uncontrolled).
507
+ */
508
+ declare const segmentContainerVariants: (props?: ({
509
+ fullWidth?: boolean | null | undefined;
510
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
511
+ declare const segmentItemVariants: (props?: ({
512
+ active?: boolean | null | undefined;
513
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
514
+ interface SegmentedControlItem {
515
+ /** 세그먼트 값 (고유) */
516
+ value: string;
517
+ /** 표시 라벨 */
518
+ label: React.ReactNode;
519
+ /** 선택적 아이콘 (색만으로 정보전달 금지 — 아이콘/텍스트 병행 용도) */
520
+ icon?: React.ReactNode;
521
+ /** 개별 비활성화 */
522
+ disabled?: boolean;
523
+ }
524
+ interface SegmentedControlProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onChange" | "defaultValue">, VariantProps<typeof segmentContainerVariants> {
525
+ /** 세그먼트 항목 목록 */
526
+ items: SegmentedControlItem[];
527
+ /** 제어 값 */
528
+ value?: string;
529
+ /** 비제어 초기 값 */
530
+ defaultValue?: string;
531
+ /** 값 변경 콜백 */
532
+ onValueChange?: (value: string) => void;
533
+ /** 전체 비활성화 */
534
+ disabled?: boolean;
535
+ /** 접근성 라벨 */
536
+ "aria-label"?: string;
537
+ }
538
+ declare const SegmentedControl: React.ForwardRefExoticComponent<SegmentedControlProps & React.RefAttributes<HTMLDivElement>>;
539
+
540
+ /**
541
+ * Toast — presentation-only visual component (design catalog).
542
+ * TODO: A real ToastProvider / useToast hook (queueing, auto-dismiss,
543
+ * portal, aria-live region) must be wired by the app developer.
544
+ * This component renders a single toast surface for visual spec review.
545
+ */
546
+ declare const toastVariants: (props?: ({
547
+ variant?: "danger" | "default" | null | undefined;
548
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
549
+ interface ToastProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title">, VariantProps<typeof toastVariants> {
550
+ /** Main message content of the toast. */
551
+ message: React.ReactNode;
552
+ /** Optional emphasized title rendered above the message. */
553
+ title?: React.ReactNode;
554
+ /** Render the leading status icon (default true). */
555
+ icon?: boolean;
556
+ /** Show the trailing close button (default true). */
557
+ dismissible?: boolean;
558
+ /** Fired when the close button is pressed. */
559
+ onClose?: () => void;
560
+ /** Accessible label for the close button. */
561
+ closeLabel?: string;
562
+ }
563
+ declare const Toast: React.ForwardRefExoticComponent<ToastProps & React.RefAttributes<HTMLDivElement>>;
564
+
565
+ type EmptyStateSize = "lg" | "md" | "sm";
566
+ interface EmptyStateProps extends React.HTMLAttributes<HTMLDivElement> {
567
+ size?: EmptyStateSize;
568
+ /** 라운드 플레이트 안에 들어갈 일러스트(TIMI 캐릭터). <img>/<svg> */
569
+ illustration?: React.ReactNode;
570
+ title: string;
571
+ description?: string;
572
+ /** 하단 CTA (예: <Button>) — 없으면 생략 */
573
+ action?: React.ReactNode;
574
+ }
575
+ declare function EmptyState({ size, illustration, title, description, action, className, ...props }: EmptyStateProps): react_jsx_runtime.JSX.Element;
576
+
577
+ interface AccordionItemData {
578
+ /** 고유 키(미지정 시 title 사용) */
579
+ id?: string;
580
+ /** 제목(요약 행) */
581
+ title: React.ReactNode;
582
+ /** 펼쳤을 때 본문 */
583
+ content: React.ReactNode;
584
+ /** 기본 펼침 여부 */
585
+ defaultOpen?: boolean;
586
+ }
587
+ interface AccordionItemProps extends Omit<React.ComponentPropsWithoutRef<"details">, "title"> {
588
+ /** 제목(요약 행) */
589
+ title: React.ReactNode;
590
+ }
591
+ /**
592
+ * 단일 아코디언 행. `<details>/<summary>` 기반 — JS 없이 펼침/접힘.
593
+ * 셰브론은 열림 시 180° 회전(group-open).
594
+ */
595
+ declare const AccordionItem: React.ForwardRefExoticComponent<AccordionItemProps & React.RefAttributes<HTMLDetailsElement>>;
596
+ interface AccordionProps extends React.HTMLAttributes<HTMLDivElement> {
597
+ /** 데이터 기반 렌더. 미지정 시 children 사용. */
598
+ items?: AccordionItemData[];
599
+ }
600
+ /**
601
+ * 아코디언 컨테이너(surface 카드). 행 사이 구분선, 첫 행은 상단선 없음.
602
+ * `items` prop으로 데이터 기반 렌더하거나 `children`으로 직접 조립.
603
+ */
604
+ declare const Accordion: React.ForwardRefExoticComponent<AccordionProps & React.RefAttributes<HTMLDivElement>>;
605
+
606
+ interface KpiItem {
607
+ /** 지표/상태 라벨 */
608
+ label: string;
609
+ /** 값(문자열: 건수 "0", "21" 또는 "92%") */
610
+ value: string;
611
+ /** 상태 점 색 클래스(bg-*). 지정 시 라벨 앞에 상태 점 표시 — 색은 소비처 주입 */
612
+ dot?: string;
613
+ }
614
+ interface KpiRowProps extends React.HTMLAttributes<HTMLDivElement> {
615
+ items: KpiItem[];
616
+ }
617
+ declare const KpiRow: React.ForwardRefExoticComponent<KpiRowProps & React.RefAttributes<HTMLDivElement>>;
618
+ interface ProgressItem {
619
+ label: string;
620
+ /** 0–100 */
621
+ pct: number;
622
+ /** 위험(초과 등) 강조 */
623
+ danger?: boolean;
624
+ }
625
+ interface ProgressListProps extends React.HTMLAttributes<HTMLDivElement> {
626
+ items: ProgressItem[];
627
+ }
628
+ declare const ProgressList: React.ForwardRefExoticComponent<ProgressListProps & React.RefAttributes<HTMLDivElement>>;
629
+ interface RingProps extends React.HTMLAttributes<HTMLDivElement> {
630
+ /** 0–100 */
631
+ pct: number;
632
+ /** 지름(px) */
633
+ size?: number;
634
+ /** 가운데 라벨(기본: `${pct}%`) */
635
+ label?: React.ReactNode;
636
+ }
637
+ declare const Ring: React.ForwardRefExoticComponent<RingProps & React.RefAttributes<HTMLDivElement>>;
638
+ interface StackSegment {
639
+ label: string;
640
+ /** 비율(%) */
641
+ pct: number;
642
+ /** 세그먼트 색 클래스(bg-*). 미지정 시 bg-brand-solid */
643
+ className?: string;
644
+ }
645
+ interface StackBarProps extends React.HTMLAttributes<HTMLDivElement> {
646
+ segments: StackSegment[];
647
+ /** 범례 표시 여부 */
648
+ showLegend?: boolean;
649
+ }
650
+ declare const StackBar: React.ForwardRefExoticComponent<StackBarProps & React.RefAttributes<HTMLDivElement>>;
651
+ type WorkHoursState = "reached" | "unreached" | "pending";
652
+ interface WorkHoursItem {
653
+ /** 요일 라벨 */
654
+ day: string;
655
+ /** 근무 시간 */
656
+ hours: number;
657
+ /** reached=목표도달 · unreached=미달 · pending=출근전 */
658
+ state: WorkHoursState;
659
+ /** 오늘 강조 */
660
+ today?: boolean;
661
+ /** 미래(예정) */
662
+ future?: boolean;
663
+ }
664
+ interface WorkHoursBarProps extends React.HTMLAttributes<HTMLDivElement> {
665
+ data: WorkHoursItem[];
666
+ /** y축 최대치(시간). 기본 12 */
667
+ max?: number;
668
+ /** 차트 높이(px). 기본 120 */
669
+ height?: number;
670
+ /** 하단 캡션 */
671
+ caption?: React.ReactNode;
672
+ }
673
+ declare const WorkHoursBar: React.ForwardRefExoticComponent<WorkHoursBarProps & React.RefAttributes<HTMLDivElement>>;
674
+
675
+ /** 키보드 단축키 배지. 활성 행에선 현재 색(brand)을 따라간다. */
676
+ interface KbdProps extends React.HTMLAttributes<HTMLElement> {
677
+ /** 활성(하이라이트) 컨텍스트에 놓였는지 여부. */
678
+ active?: boolean;
679
+ }
680
+ declare const Kbd: React.ForwardRefExoticComponent<KbdProps & React.RefAttributes<HTMLElement>>;
681
+ /** 커맨드 팔레트의 개별 명령. */
682
+ interface CommandItem {
683
+ /** 선택 콜백 식별용 고유 값. */
684
+ id: string;
685
+ /** 선행 아이콘(예: ./icons 의 PlusIcon). */
686
+ icon?: React.ReactNode;
687
+ /** 표시 라벨. */
688
+ label: string;
689
+ /** 단축키 표기(예: "⌘N"). */
690
+ kbd?: string;
691
+ }
692
+ /** 헤딩으로 묶인 명령 그룹. */
693
+ interface CommandGroup {
694
+ /** 그룹 헤딩(생략 시 헤딩 없이 렌더). */
695
+ heading?: string;
696
+ items: CommandItem[];
697
+ }
698
+ interface CommandPaletteProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect"> {
699
+ /** 그룹으로 묶인 명령 목록. */
700
+ groups: CommandGroup[];
701
+ /** 명령 선택 시 호출. */
702
+ onSelect?: (item: CommandItem) => void;
703
+ /** 현재 하이라이트(활성)된 명령의 id. */
704
+ activeId?: string;
705
+ /** 검색 입력의 표시 문구. */
706
+ placeholder?: string;
707
+ /** 검색 입력 우측에 표시할 단축키. */
708
+ searchKbd?: string;
709
+ /** 열림 여부. false면 렌더하지 않는다. */
710
+ open?: boolean;
711
+ }
712
+ /**
713
+ * 검색 입력 + 그룹 헤딩 + 결과 행(아이콘·라벨·단축키)으로 구성된 커맨드 팔레트.
714
+ * 활성 행은 brand-subtle 배경 + brand-text 로 하이라이트된다.
715
+ */
716
+ declare const CommandPalette: React.ForwardRefExoticComponent<CommandPaletteProps & React.RefAttributes<HTMLDivElement>>;
717
+
718
+ interface AvatarWithPresenceProps {
719
+ /** 이름 (Avatar alt) */
720
+ name: string;
721
+ /** presence 상태 — offline 이면 아바타 흐림(opacity .55) */
722
+ status?: PresenceStatus;
723
+ /** 마스코트 색 */
724
+ color?: AvatarColor;
725
+ /** 프로필 이미지 URL */
726
+ src?: string;
727
+ /** 아바타 크기 — 미지정 시 Avatar 자체 기본값 사용 */
728
+ size?: AvatarSize;
729
+ /** presence dot 링 색 — 얹히는 표면과 맞춘다(기본 surface-default) */
730
+ ringClassName?: string;
731
+ className?: string;
732
+ }
733
+ /** Avatar + Presence 코너 dot 조합(오프라인 흐림 포함) — 사이드바 DM·멤버 리스트 공용 SSOT. */
734
+ declare const AvatarWithPresence: React.ForwardRefExoticComponent<AvatarWithPresenceProps & React.RefAttributes<HTMLSpanElement>>;
735
+
736
+ interface SidebarSectionProps extends React.HTMLAttributes<HTMLDivElement> {
737
+ /** 섹션 제목 (예: "채널", "다이렉트 메시지") */
738
+ title: string;
739
+ /** 헤더 우측 추가(+) 버튼 노출 */
740
+ addable?: boolean;
741
+ /** 추가 버튼 클릭 핸들러 */
742
+ onAdd?: () => void;
743
+ /** 추가 버튼 접근성 레이블 */
744
+ addLabel?: string;
745
+ }
746
+ declare const SidebarSection: React.ForwardRefExoticComponent<SidebarSectionProps & React.RefAttributes<HTMLDivElement>>;
747
+ interface SidebarChannelProps extends React.HTMLAttributes<HTMLButtonElement> {
748
+ /** 채널 이름 */
749
+ name: string;
750
+ /** 커스텀 아이콘. 미지정 시 locked에 따라 Lock/Hash */
751
+ icon?: React.ReactNode;
752
+ /** 비공개 채널 — 기본 아이콘을 자물쇠로 */
753
+ locked?: boolean;
754
+ /** 현재 선택된 채널 */
755
+ active?: boolean;
756
+ /** 미읽음 카운트 배지 */
757
+ badge?: string | number;
758
+ }
759
+ declare const SidebarChannel: React.ForwardRefExoticComponent<SidebarChannelProps & React.RefAttributes<HTMLButtonElement>>;
760
+ interface SidebarDmProps extends React.HTMLAttributes<HTMLButtonElement> {
761
+ /** 상대 이름 */
762
+ name: string;
763
+ /** presence 상태 */
764
+ status?: PresenceStatus;
765
+ /** 마스코트 색 (Avatar 재사용). 미지정 시 이름 기반 기본값 */
766
+ color?: AvatarColor;
767
+ /** 프로필 이미지 URL (있으면 Avatar가 우선 사용) */
768
+ avatarSrc?: string;
769
+ /** 고정 표시 */
770
+ pinned?: boolean;
771
+ }
772
+ declare const SidebarDm: React.ForwardRefExoticComponent<SidebarDmProps & React.RefAttributes<HTMLButtonElement>>;
773
+ /** 채널 아이템 데이터 (kind 생략 시 채널로 간주) */
774
+ interface SidebarChannelData extends Omit<SidebarChannelProps, "className"> {
775
+ kind?: "channel";
776
+ /** 고유 키 */
777
+ id?: string;
778
+ }
779
+ /** DM 아이템 데이터 */
780
+ interface SidebarDmData extends Omit<SidebarDmProps, "className"> {
781
+ kind: "dm";
782
+ /** 고유 키 */
783
+ id?: string;
784
+ }
785
+ type SidebarItem = SidebarChannelData | SidebarDmData;
786
+ interface SidebarSectionData {
787
+ /** 섹션 제목 */
788
+ title: string;
789
+ /** 헤더 추가(+) 버튼 노출 */
790
+ addable?: boolean;
791
+ /** 추가 버튼 핸들러 */
792
+ onAdd?: () => void;
793
+ /** 섹션 아이템 목록 */
794
+ items: SidebarItem[];
795
+ }
796
+ interface SidebarProps extends React.HTMLAttributes<HTMLElement> {
797
+ /** 섹션 목록 (헤더 + 채널/DM 아이템) */
798
+ sections: SidebarSectionData[];
799
+ /** panel(기본: 라운드 카드) | shell(앱 셸 임베드: 라운드 없음·우측 보더·풀 높이 — 폭은 소비자가 className으로 지정) */
800
+ variant?: "panel" | "shell";
801
+ }
802
+ /** 사이드바 컨테이너 변형 (스토리 프리뷰·Sidebar 공용 SSOT) */
803
+ declare const sidebarContainerVariants: (props?: ({
804
+ variant?: "panel" | "shell" | null | undefined;
805
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
806
+ /** 스토리/문서용 사이드바 패널 컨테이너 — Sidebar 컨테이너와 동일 크롬. 앱에서는 Sidebar(nav landmark)를 사용할 것. */
807
+ declare const SidebarPanel: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
808
+ declare const Sidebar: React.ForwardRefExoticComponent<SidebarProps & React.RefAttributes<HTMLElement>>;
809
+
810
+ interface ListProps extends React.HTMLAttributes<HTMLUListElement> {
811
+ /** 컨테이너 테두리 + 라운드 표시 (기본 true) */
812
+ bordered?: boolean;
813
+ /** 행 사이 구분선 표시 (기본 true) */
814
+ divided?: boolean;
815
+ }
816
+ declare const List: React.ForwardRefExoticComponent<ListProps & React.RefAttributes<HTMLUListElement>>;
817
+ interface ListItemProps extends Omit<React.LiHTMLAttributes<HTMLLIElement>, "title"> {
818
+ /** 좌측 요소(아바타/아이콘 등) */
819
+ leading?: React.ReactNode;
820
+ /** 제목(필수) */
821
+ title: React.ReactNode;
822
+ /** 보조 설명 */
823
+ description?: React.ReactNode;
824
+ /** 우측 요소(배지/버튼/아이콘 등) */
825
+ trailing?: React.ReactNode;
826
+ }
827
+ declare const ListItem: React.ForwardRefExoticComponent<ListItemProps & React.RefAttributes<HTMLLIElement>>;
828
+
829
+ interface SuccessCheckProps extends React.HTMLAttributes<HTMLSpanElement> {
830
+ /** 뱃지 지름(px). 기본 22. 체크 아이콘은 이 값의 약 60%로 렌더된다. */
831
+ size?: number;
832
+ }
833
+ /**
834
+ * SuccessCheck — brand 솔리드 원형 배지 + 흰 체크.
835
+ * success/green 토큰 없이 완료 상태를 시맨틱 brand 토큰만으로 표현하는 프리미티브.
836
+ */
837
+ declare const SuccessCheck: React.ForwardRefExoticComponent<SuccessCheckProps & React.RefAttributes<HTMLSpanElement>>;
838
+
839
+ /**
840
+ * Separator — presentation primitive (shadcn/Radix Separator 대응).
841
+ *
842
+ * 선 색은 시맨틱 토큰 `border-border-default`, 두께는 Foundation border-width(1px).
843
+ * - horizontal: 1px 풀폭 라인 (border-t)
844
+ * - vertical: 1px 세로 라인, 부모 높이 채움 (border-l + self-stretch)
845
+ * - label: 가운데 텍스트 + 양옆 flex-1 라인 (항상 horizontal)
846
+ *
847
+ * 접근성: 기본은 role="separator" + aria-orientation. `decorative`면 순수 장식으로
848
+ * 취급해 role="none" 으로 a11y 트리에서 제거한다.
849
+ */
850
+ declare const separatorVariants: (props?: ({
851
+ orientation?: "horizontal" | "vertical" | null | undefined;
852
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
853
+ interface SeparatorProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof separatorVariants> {
854
+ /** 가운데 라벨. 있으면 텍스트 양옆에 라인을 그린다(라벨형은 항상 수평). */
855
+ label?: React.ReactNode;
856
+ /** 순수 장식이면 true — a11y 트리에서 제거(role="none"). 기본 false = 시맨틱 구분선. */
857
+ decorative?: boolean;
858
+ }
859
+ declare const Separator: React.ForwardRefExoticComponent<SeparatorProps & React.RefAttributes<HTMLDivElement>>;
860
+
861
+ /**
862
+ * Popover — presentation-only floating container for arbitrary content.
863
+ *
864
+ * Click the trigger to toggle; outside-click and ESC close it. Positioning here
865
+ * is a lightweight Tailwind approximation for the design catalog (no @radix-ui /
866
+ * floating-ui) — real portal/collision behavior is wired by the app dev.
867
+ * Visibility is `open` (controlled) or internal state (uncontrolled via
868
+ * `defaultOpen`). `placement` picks the side, `align` slides along that side.
869
+ */
870
+ type PopoverPlacement = "top" | "bottom" | "left" | "right";
871
+ type PopoverAlign = "start" | "center" | "end";
872
+ declare const popoverContentVariants: (props?: ({
873
+ placement?: "left" | "right" | "bottom" | "top" | null | undefined;
874
+ align?: "center" | "end" | "start" | null | undefined;
875
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
876
+ interface PopoverProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "content">, VariantProps<typeof popoverContentVariants> {
877
+ /** The floating panel content (any node). */
878
+ content: React.ReactNode;
879
+ /** The trigger element the popover is anchored to. */
880
+ children: React.ReactNode;
881
+ /** Controlled open state. When set, internal state is ignored. */
882
+ open?: boolean;
883
+ /** Uncontrolled initial open state. */
884
+ defaultOpen?: boolean;
885
+ /** Fired whenever the open state changes. */
886
+ onOpenChange?: (open: boolean) => void;
887
+ }
888
+ declare const Popover: React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLDivElement>>;
889
+
890
+ /**
891
+ * Field — form-field wrapper (FormField).
892
+ *
893
+ * Lays out a label (+ required mark / optional badge), a control
894
+ * (`children`: input / textarea / select) and a helper or error message
895
+ * in a consistent vertical stack. When `error` is set it takes priority
896
+ * over `hint`, and the control is wired with `aria-invalid` /
897
+ * `aria-describedby` for non-colour accessibility.
898
+ */
899
+ declare const fieldVariants: (props?: ({
900
+ orientation?: "horizontal" | "vertical" | null | undefined;
901
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
902
+ interface FieldProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "children">, VariantProps<typeof fieldVariants> {
903
+ /** Field label text. Rendered inside a native `<label htmlFor>`. */
904
+ label?: React.ReactNode;
905
+ /** id of the control this field labels (also applied to the child). */
906
+ htmlFor?: string;
907
+ /** Show a red required marker (`*`, text-danger-text). */
908
+ required?: boolean;
909
+ /** Show a subtle "선택" badge (reuses the DS Label). Ignored when required. */
910
+ optional?: boolean;
911
+ /** Helper text below the control (text-text-subtle). */
912
+ hint?: React.ReactNode;
913
+ /** Error text below the control. Takes priority over `hint` (text-danger-text). */
914
+ error?: React.ReactNode;
915
+ /** The control: input / textarea / select. */
916
+ children?: React.ReactNode;
917
+ }
918
+ declare const Field: React.ForwardRefExoticComponent<FieldProps & React.RefAttributes<HTMLDivElement>>;
919
+
920
+ interface SearchFieldProps extends Omit<React.ComponentProps<"input">, "size" | "value" | "defaultValue" | "onChange" | "type"> {
921
+ /** Controlled query value. */
922
+ value?: string;
923
+ /** Uncontrolled initial value. */
924
+ defaultValue?: string;
925
+ /** Fires with the next query string on typing or clear. */
926
+ onValueChange?: (value: string) => void;
927
+ /** Placeholder copy. Defaults to "검색". */
928
+ placeholder?: string;
929
+ /** When a number, renders a "{n}건" result count on the trailing side. */
930
+ resultCount?: number;
931
+ /** Shows a previous-result nav button when provided. */
932
+ onPrev?: () => void;
933
+ /** Shows a next-result nav button when provided. */
934
+ onNext?: () => void;
935
+ /** Shows a clear (x) button when provided and the field has a value. */
936
+ onClear?: () => void;
937
+ /** Field height/padding scale. Mirrors Input's inputSize. */
938
+ size?: VariantProps<typeof inputVariants>["inputSize"];
939
+ }
940
+ /**
941
+ * SearchField — a search input built on Input's visual tokens (inputVariants).
942
+ * Adds a leading search icon plus optional trailing accessories: a result
943
+ * count, previous/next navigation, and a clear (x) button. Query state is
944
+ * controlled via `value`/`onValueChange` or uncontrolled via `defaultValue`.
945
+ */
946
+ declare const SearchField: React.ForwardRefExoticComponent<Omit<SearchFieldProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
947
+
948
+ /**
949
+ * Banner — dismissible, full-width inline notification.
950
+ *
951
+ * Distinct from Alert: a Banner spans the full width of its container and is
952
+ * meant for persistent, dismissible announcements (release notes, billing
953
+ * notices, maintenance windows). Colour comes only from semantic variant
954
+ * tokens; the icon + close button inherit the variant text colour.
955
+ */
956
+ declare const bannerVariants: (props?: ({
957
+ variant?: "neutral" | "danger" | "brand" | null | undefined;
958
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
959
+ interface BannerProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title">, VariantProps<typeof bannerVariants> {
960
+ /** Leading status icon. Inherits the variant text colour. */
961
+ icon?: React.ReactNode;
962
+ /** Emphasised heading rendered above the body (children). */
963
+ title?: React.ReactNode;
964
+ /** When true, renders a trailing close button that calls `onDismiss`. */
965
+ dismissible?: boolean;
966
+ /** Fired when the close button is pressed. */
967
+ onDismiss?: () => void;
968
+ }
969
+ declare const Banner: React.ForwardRefExoticComponent<BannerProps & React.RefAttributes<HTMLDivElement>>;
970
+
971
+ export { AVATAR_COLORS, Accordion, AccordionItem, type AccordionItemData, type AccordionItemProps, type AccordionProps, Alert, AlertDescription, type AlertDescriptionProps, type AlertProps, AlertTitle, type AlertTitleProps, Avatar, type AvatarColor, AvatarFallback, type AvatarFallbackProps, AvatarGroup, type AvatarGroupProps, AvatarImage, type AvatarImageProps, type AvatarPresence, type AvatarProps, type AvatarSize, AvatarWithPresence, type AvatarWithPresenceProps, Banner, type BannerProps, Button, type ButtonProps, Card, CardContent, CardDescription, CardFooter, CardHeader, type CardProps, CardTitle, Checkbox, type CheckboxProps, Chip, type ChipProps, type CommandGroup, type CommandItem, CommandPalette, type CommandPaletteProps, Dialog, Button as DialogAction, DialogBody, type DialogBodyProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogOverlay, type DialogOverlayProps, type DialogProps, DialogTitle, type DialogTitleProps, DropdownMenu, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuEmpty, type DropdownMenuEmptyProps, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, type DropdownMenuProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuTrigger, type DropdownMenuTriggerProps, EmptyState, type EmptyStateProps, Field, type FieldProps, Input, type InputProps, Kbd, type KbdProps, type KpiItem, KpiRow, type KpiRowProps, Label, type LabelProps, List, ListItem, type ListItemProps, type ListProps, PRESENCE_LABEL, Pagination, PaginationEllipsis, PaginationItem, type PaginationItemProps, type PaginationNavProps, PaginationNext, PaginationPrevious, type PaginationProps, Popover, type PopoverAlign, type PopoverPlacement, type PopoverProps, Presence, type PresenceProps, type PresenceSize, type PresenceStatus, Progress, type ProgressItem, ProgressList, type ProgressListProps, type ProgressProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Ring, type RingProps, ScrollArea, ScrollBar, SearchField, type SearchFieldProps, SegmentedControl, type SegmentedControlItem, type SegmentedControlProps, Select, type SelectOption, type SelectProps, Separator, type SeparatorProps, Sheet, SheetBody, SheetDescription, SheetFooter, SheetHandle, SheetHeader, type SheetProps, SheetTitle, Sidebar, SidebarChannel, type SidebarChannelData, type SidebarChannelProps, SidebarDm, type SidebarDmData, type SidebarDmProps, type SidebarItem, SidebarPanel, type SidebarProps, SidebarSection, type SidebarSectionData, type SidebarSectionProps, Skeleton, type SkeletonProps, StackBar, type StackBarProps, type StackSegment, SuccessCheck, type SuccessCheckProps, Table, TableBody, type TableBodyProps, TableCaption, type TableCaptionProps, TableCell, type TableCellProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, type TableProps, TableRow, type TableRowProps, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, Textarea, type TextareaProps, Toast, type ToastProps, Toggle, type ToggleProps, Tooltip, type TooltipPlacement, type TooltipProps, WorkHoursBar, type WorkHoursBarProps, type WorkHoursItem, type WorkHoursState, alertVariants, avatarVariants, bannerVariants, buildPageRange, buttonVariants, cardVariants, checkboxVariants, chipVariants, cn, dialogPanelVariants, dropdownMenuContentVariants, dropdownMenuItemVariants, fieldVariants, inputVariants, labelVariants, paginationItemVariants, popoverContentVariants, progressFillVariants, progressTrackVariants, radioVariants, segmentContainerVariants, segmentItemVariants, selectTriggerVariants, separatorVariants, sheetOverlayVariants, sheetPanelVariants, sidebarContainerVariants, skeletonVariants, tableRowVariants, tableVariants, tabsListVariants, tabsTriggerVariants, textareaVariants, toastVariants, toggleThumbVariants, toggleTrackVariants, tooltipArrowVariants, tooltipContentVariants };