@reopt-ai/opt-ui 1.4.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.
Files changed (64) hide show
  1. package/CHANGELOG.md +40 -0
  2. package/COMPONENT_CATALOG.md +3000 -0
  3. package/LICENSE +21 -0
  4. package/README.md +244 -0
  5. package/dist/chunk-3GWWZKX7.js +38 -0
  6. package/dist/chunk-AFF2HPE5.cjs +5008 -0
  7. package/dist/chunk-ELWICXYY.js +4745 -0
  8. package/dist/chunk-N4NDU5ET.cjs +4745 -0
  9. package/dist/chunk-ONE3C5RV.cjs +38 -0
  10. package/dist/chunk-QWBHD54V.js +3218 -0
  11. package/dist/chunk-RBM2RNC2.js +5008 -0
  12. package/dist/chunk-X5WCXJAF.cjs +3218 -0
  13. package/dist/core/index.cjs +324 -0
  14. package/dist/core/index.d.cts +5 -0
  15. package/dist/core/index.d.ts +5 -0
  16. package/dist/core/index.js +324 -0
  17. package/dist/docs/01-getting-started.md +129 -0
  18. package/dist/docs/02-components/01-core.md +1841 -0
  19. package/dist/docs/02-components/02-visuals.md +11 -0
  20. package/dist/docs/02-components/03-shells.md +1361 -0
  21. package/dist/docs/02-components/04-surfaces.md +11 -0
  22. package/dist/docs/02-components/index.md +106 -0
  23. package/dist/docs/03-recipes/01-forms.md +471 -0
  24. package/dist/docs/03-recipes/02-dashboards.md +397 -0
  25. package/dist/docs/03-recipes/03-layouts.md +424 -0
  26. package/dist/docs/04-theming.md +232 -0
  27. package/dist/docs/05-migration/01-breaking-changes.md +117 -0
  28. package/dist/docs/05-migration/02-formstore.md +336 -0
  29. package/dist/docs/06-troubleshooting.md +119 -0
  30. package/dist/docs/index.md +71 -0
  31. package/dist/id-registry.cjs +1875 -0
  32. package/dist/id-registry.d.cts +27 -0
  33. package/dist/id-registry.d.ts +27 -0
  34. package/dist/id-registry.js +1875 -0
  35. package/dist/id-registry.json +3799 -0
  36. package/dist/index-BZ_lBlO1.d.ts +474 -0
  37. package/dist/index-BuvxoWHf.d.cts +474 -0
  38. package/dist/index-DlAcuvQp.d.cts +1686 -0
  39. package/dist/index-Slu5hOj1.d.ts +1686 -0
  40. package/dist/index.cjs +9959 -0
  41. package/dist/index.d.cts +2351 -0
  42. package/dist/index.d.ts +2351 -0
  43. package/dist/index.js +9959 -0
  44. package/dist/meta.cjs +6898 -0
  45. package/dist/meta.d.cts +36 -0
  46. package/dist/meta.d.ts +36 -0
  47. package/dist/meta.js +6869 -0
  48. package/dist/shells/index.cjs +65 -0
  49. package/dist/shells/index.d.cts +5 -0
  50. package/dist/shells/index.d.ts +5 -0
  51. package/dist/shells/index.js +65 -0
  52. package/dist/tailwind.css +401 -0
  53. package/dist/theme/presets/default.css +355 -0
  54. package/dist/theme/presets/minimal.css +354 -0
  55. package/dist/theme/presets/mono-dark.css +354 -0
  56. package/dist/theme/presets/natural.css +181 -0
  57. package/dist/theme/presets/pro.css +354 -0
  58. package/dist/types-D4-0lwaE.d.cts +298 -0
  59. package/dist/types-D4-0lwaE.d.ts +298 -0
  60. package/dist/visuals/index.cjs +4 -0
  61. package/dist/visuals/index.d.cts +1 -0
  62. package/dist/visuals/index.d.ts +1 -0
  63. package/dist/visuals/index.js +4 -0
  64. package/package.json +165 -0
@@ -0,0 +1,1686 @@
1
+ import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import * as react from 'react';
3
+ import { ReactNode, ComponentPropsWithoutRef, HTMLAttributes, ImgHTMLAttributes, CSSProperties } from 'react';
4
+ import { ToggleProps as ToggleProps$1, ToggleGroupProps as ToggleGroupProps$1, AccordionContentProps, AccordionItemProps, AccordionRootProps, AccordionTriggerProps, DisclosureContentProps, DisclosureRootProps, DisclosureTriggerProps, TabProps, TabListProps, TabPanelProps, TabsRootProps, SelectItemProps, SelectPopoverProps, SelectLabelProps, SelectRootProps, SelectTriggerProps as SelectTriggerProps$1, AlertDialogPanelProps as AlertDialogPanelProps$1, DialogPanelProps as DialogPanelProps$1, DialogRootProps, ComboboxGroupProps, ComboboxGroupLabelProps, ComboboxInputProps, ComboboxItemProps, ComboboxPopoverProps, ComboboxRootProps, MenuPopoverProps, MenuItemProps, MenuRootProps, MenuSeparatorProps, MenuTriggerProps, MenuButtonArrowProps, MenuItemCheckboxProps, MenuItemRadioProps, MenubarContainerProps, MenubarRootProps, ToolbarButtonProps, ToolbarContainerProps, ToolbarRootProps, ToolbarSeparatorProps, TooltipProps, TooltipAnchorProps, TooltipProviderProps, FormCheckboxProps as FormCheckboxProps$1, FormInputProps as FormInputProps$1, FormDescriptionProps as FormDescriptionProps$1, FormErrorProps as FormErrorProps$1, FormFieldProps as FormFieldProps$1, FormGroupProps as FormGroupProps$1, FormGroupLabelProps as FormGroupLabelProps$1, FormLabelProps as FormLabelProps$1, FormProvider as FormProvider$1, FormPushProps as FormPushProps$1, FormRadioProps as FormRadioProps$1, FormRadioGroupProps as FormRadioGroupProps$1, FormRemoveProps as FormRemoveProps$1, FormResetProps as FormResetProps$1, FormRootProps as FormRootProps$1, FormStoreInstance, FormSubmitProps as FormSubmitProps$1, FormSwitchProps as FormSwitchProps$1, PopoverCloseProps, PopoverContentProps as PopoverContentProps$1, PopoverRootProps, PopoverTriggerProps } from '@reopt-ai/opt-ui-primitives';
5
+ import { S as StatCard$1 } from './types-D4-0lwaE.js';
6
+
7
+ /** Props for the kbd component. */
8
+ interface KbdProps {
9
+ children: React.ReactNode;
10
+ className?: string;
11
+ }
12
+ /** Renders the kbd component. */
13
+ declare function Kbd({ children, className }: KbdProps): react_jsx_runtime.JSX.Element;
14
+
15
+ /** Semantic body-text roles backed by typography foundation tokens. */
16
+ type TextRole = "body" | "label" | "supporting" | "code";
17
+ /** Semantic text color roles backed by foreground tokens. */
18
+ type TextTone = "primary" | "secondary" | "tertiary" | "inherit";
19
+ /** Supported polymorphic HTML elements for Text. */
20
+ type TextElement = "span" | "p" | "div" | "label" | "code";
21
+ /** Props for the semantic Text component. */
22
+ type TextProps<T extends TextElement = "span"> = {
23
+ as?: T;
24
+ variant?: TextRole;
25
+ tone?: TextTone;
26
+ truncate?: boolean;
27
+ children?: ReactNode;
28
+ } & Omit<ComponentPropsWithoutRef<T>, "as" | "children" | "color">;
29
+ /** Semantic body text whose visual role is controlled by foundation tokens. */
30
+ declare function Text<T extends TextElement = "span">({ as, variant, tone, truncate, className, children, ...props }: TextProps<T>): react.ReactElement<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref">, string | react.JSXElementConstructor<any>>;
31
+
32
+ /** Supported semantic heading levels. */
33
+ type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
34
+ /** Visual heading roles backed by typography foundation tokens. */
35
+ type HeadingRole = `heading-${HeadingLevel}` | "display-1" | "display-2" | "display-3";
36
+ /** Props for the semantic Heading component. */
37
+ interface HeadingProps extends Omit<HTMLAttributes<HTMLHeadingElement>, never> {
38
+ level?: HeadingLevel;
39
+ variant?: HeadingRole;
40
+ children?: ReactNode;
41
+ }
42
+ /** Semantic heading with independently selectable visual hierarchy. */
43
+ declare function Heading({ level, variant, className, children, ...props }: HeadingProps): react.DOMElement<{
44
+ "data-opt-component": string;
45
+ "data-opt-part": string;
46
+ "data-opt-id": string;
47
+ "data-opt-slug": string;
48
+ "data-level": HeadingLevel;
49
+ "data-role": HeadingRole;
50
+ slot?: string | undefined | undefined;
51
+ style?: react.CSSProperties | undefined;
52
+ title?: string | undefined | undefined;
53
+ color?: string | undefined | undefined;
54
+ defaultChecked?: boolean | undefined | undefined;
55
+ defaultValue?: string | number | readonly string[] | undefined;
56
+ suppressContentEditableWarning?: boolean | undefined | undefined;
57
+ suppressHydrationWarning?: boolean | undefined | undefined;
58
+ accessKey?: string | undefined | undefined;
59
+ autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
60
+ autoFocus?: boolean | undefined | undefined;
61
+ contentEditable?: "inherit" | (boolean | "true" | "false") | "plaintext-only" | undefined;
62
+ contextMenu?: string | undefined | undefined;
63
+ dir?: string | undefined | undefined;
64
+ draggable?: (boolean | "true" | "false") | undefined;
65
+ enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
66
+ hidden?: boolean | undefined | undefined;
67
+ id?: string | undefined | undefined;
68
+ lang?: string | undefined | undefined;
69
+ nonce?: string | undefined | undefined;
70
+ spellCheck?: (boolean | "true" | "false") | undefined;
71
+ tabIndex?: number | undefined | undefined;
72
+ translate?: "yes" | "no" | undefined | undefined;
73
+ radioGroup?: string | undefined | undefined;
74
+ role?: react.AriaRole | undefined;
75
+ about?: string | undefined | undefined;
76
+ content?: string | undefined | undefined;
77
+ datatype?: string | undefined | undefined;
78
+ inlist?: any;
79
+ prefix?: string | undefined | undefined;
80
+ property?: string | undefined | undefined;
81
+ rel?: string | undefined | undefined;
82
+ resource?: string | undefined | undefined;
83
+ rev?: string | undefined | undefined;
84
+ typeof?: string | undefined | undefined;
85
+ vocab?: string | undefined | undefined;
86
+ autoCorrect?: string | undefined | undefined;
87
+ autoSave?: string | undefined | undefined;
88
+ itemProp?: string | undefined | undefined;
89
+ itemScope?: boolean | undefined | undefined;
90
+ itemType?: string | undefined | undefined;
91
+ itemID?: string | undefined | undefined;
92
+ itemRef?: string | undefined | undefined;
93
+ results?: number | undefined | undefined;
94
+ security?: string | undefined | undefined;
95
+ unselectable?: "on" | "off" | undefined | undefined;
96
+ popover?: "" | "auto" | "manual" | "hint" | undefined | undefined;
97
+ popoverTargetAction?: "toggle" | "show" | "hide" | undefined | undefined;
98
+ popoverTarget?: string | undefined | undefined;
99
+ inert?: boolean | undefined | undefined;
100
+ inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
101
+ is?: string | undefined | undefined;
102
+ exportparts?: string | undefined | undefined;
103
+ part?: string | undefined | undefined;
104
+ "aria-activedescendant"?: string | undefined | undefined;
105
+ "aria-atomic"?: (boolean | "true" | "false") | undefined;
106
+ "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
107
+ "aria-braillelabel"?: string | undefined | undefined;
108
+ "aria-brailleroledescription"?: string | undefined | undefined;
109
+ "aria-busy"?: (boolean | "true" | "false") | undefined;
110
+ "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
111
+ "aria-colcount"?: number | undefined | undefined;
112
+ "aria-colindex"?: number | undefined | undefined;
113
+ "aria-colindextext"?: string | undefined | undefined;
114
+ "aria-colspan"?: number | undefined | undefined;
115
+ "aria-controls"?: string | undefined | undefined;
116
+ "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
117
+ "aria-describedby"?: string | undefined | undefined;
118
+ "aria-description"?: string | undefined | undefined;
119
+ "aria-details"?: string | undefined | undefined;
120
+ "aria-disabled"?: (boolean | "true" | "false") | undefined;
121
+ "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
122
+ "aria-errormessage"?: string | undefined | undefined;
123
+ "aria-expanded"?: (boolean | "true" | "false") | undefined;
124
+ "aria-flowto"?: string | undefined | undefined;
125
+ "aria-grabbed"?: (boolean | "true" | "false") | undefined;
126
+ "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
127
+ "aria-hidden"?: (boolean | "true" | "false") | undefined;
128
+ "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
129
+ "aria-keyshortcuts"?: string | undefined | undefined;
130
+ "aria-label"?: string | undefined | undefined;
131
+ "aria-labelledby"?: string | undefined | undefined;
132
+ "aria-level"?: number | undefined | undefined;
133
+ "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
134
+ "aria-modal"?: (boolean | "true" | "false") | undefined;
135
+ "aria-multiline"?: (boolean | "true" | "false") | undefined;
136
+ "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
137
+ "aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
138
+ "aria-owns"?: string | undefined | undefined;
139
+ "aria-placeholder"?: string | undefined | undefined;
140
+ "aria-posinset"?: number | undefined | undefined;
141
+ "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
142
+ "aria-readonly"?: (boolean | "true" | "false") | undefined;
143
+ "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
144
+ "aria-required"?: (boolean | "true" | "false") | undefined;
145
+ "aria-roledescription"?: string | undefined | undefined;
146
+ "aria-rowcount"?: number | undefined | undefined;
147
+ "aria-rowindex"?: number | undefined | undefined;
148
+ "aria-rowindextext"?: string | undefined | undefined;
149
+ "aria-rowspan"?: number | undefined | undefined;
150
+ "aria-selected"?: (boolean | "true" | "false") | undefined;
151
+ "aria-setsize"?: number | undefined | undefined;
152
+ "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
153
+ "aria-valuemax"?: number | undefined | undefined;
154
+ "aria-valuemin"?: number | undefined | undefined;
155
+ "aria-valuenow"?: number | undefined | undefined;
156
+ "aria-valuetext"?: string | undefined | undefined;
157
+ dangerouslySetInnerHTML?: {
158
+ __html: string | TrustedHTML;
159
+ } | undefined | undefined;
160
+ onCopy?: react.ClipboardEventHandler<HTMLHeadingElement> | undefined;
161
+ onCopyCapture?: react.ClipboardEventHandler<HTMLHeadingElement> | undefined;
162
+ onCut?: react.ClipboardEventHandler<HTMLHeadingElement> | undefined;
163
+ onCutCapture?: react.ClipboardEventHandler<HTMLHeadingElement> | undefined;
164
+ onPaste?: react.ClipboardEventHandler<HTMLHeadingElement> | undefined;
165
+ onPasteCapture?: react.ClipboardEventHandler<HTMLHeadingElement> | undefined;
166
+ onCompositionEnd?: react.CompositionEventHandler<HTMLHeadingElement> | undefined;
167
+ onCompositionEndCapture?: react.CompositionEventHandler<HTMLHeadingElement> | undefined;
168
+ onCompositionStart?: react.CompositionEventHandler<HTMLHeadingElement> | undefined;
169
+ onCompositionStartCapture?: react.CompositionEventHandler<HTMLHeadingElement> | undefined;
170
+ onCompositionUpdate?: react.CompositionEventHandler<HTMLHeadingElement> | undefined;
171
+ onCompositionUpdateCapture?: react.CompositionEventHandler<HTMLHeadingElement> | undefined;
172
+ onFocus?: react.FocusEventHandler<HTMLHeadingElement> | undefined;
173
+ onFocusCapture?: react.FocusEventHandler<HTMLHeadingElement> | undefined;
174
+ onBlur?: react.FocusEventHandler<HTMLHeadingElement> | undefined;
175
+ onBlurCapture?: react.FocusEventHandler<HTMLHeadingElement> | undefined;
176
+ onChange?: react.ChangeEventHandler<HTMLHeadingElement, Element> | undefined;
177
+ onChangeCapture?: react.ChangeEventHandler<HTMLHeadingElement, Element> | undefined;
178
+ onBeforeInput?: react.InputEventHandler<HTMLHeadingElement> | undefined;
179
+ onBeforeInputCapture?: react.InputEventHandler<HTMLHeadingElement> | undefined;
180
+ onInput?: react.InputEventHandler<HTMLHeadingElement> | undefined;
181
+ onInputCapture?: react.InputEventHandler<HTMLHeadingElement> | undefined;
182
+ onReset?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
183
+ onResetCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
184
+ onSubmit?: react.SubmitEventHandler<HTMLHeadingElement> | undefined;
185
+ onSubmitCapture?: react.SubmitEventHandler<HTMLHeadingElement> | undefined;
186
+ onInvalid?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
187
+ onInvalidCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
188
+ onLoad?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
189
+ onLoadCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
190
+ onError?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
191
+ onErrorCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
192
+ onKeyDown?: react.KeyboardEventHandler<HTMLHeadingElement> | undefined;
193
+ onKeyDownCapture?: react.KeyboardEventHandler<HTMLHeadingElement> | undefined;
194
+ onKeyPress?: react.KeyboardEventHandler<HTMLHeadingElement> | undefined;
195
+ onKeyPressCapture?: react.KeyboardEventHandler<HTMLHeadingElement> | undefined;
196
+ onKeyUp?: react.KeyboardEventHandler<HTMLHeadingElement> | undefined;
197
+ onKeyUpCapture?: react.KeyboardEventHandler<HTMLHeadingElement> | undefined;
198
+ onAbort?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
199
+ onAbortCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
200
+ onCanPlay?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
201
+ onCanPlayCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
202
+ onCanPlayThrough?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
203
+ onCanPlayThroughCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
204
+ onDurationChange?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
205
+ onDurationChangeCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
206
+ onEmptied?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
207
+ onEmptiedCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
208
+ onEncrypted?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
209
+ onEncryptedCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
210
+ onEnded?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
211
+ onEndedCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
212
+ onLoadedData?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
213
+ onLoadedDataCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
214
+ onLoadedMetadata?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
215
+ onLoadedMetadataCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
216
+ onLoadStart?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
217
+ onLoadStartCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
218
+ onPause?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
219
+ onPauseCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
220
+ onPlay?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
221
+ onPlayCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
222
+ onPlaying?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
223
+ onPlayingCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
224
+ onProgress?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
225
+ onProgressCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
226
+ onRateChange?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
227
+ onRateChangeCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
228
+ onSeeked?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
229
+ onSeekedCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
230
+ onSeeking?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
231
+ onSeekingCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
232
+ onStalled?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
233
+ onStalledCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
234
+ onSuspend?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
235
+ onSuspendCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
236
+ onTimeUpdate?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
237
+ onTimeUpdateCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
238
+ onVolumeChange?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
239
+ onVolumeChangeCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
240
+ onWaiting?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
241
+ onWaitingCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
242
+ onAuxClick?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
243
+ onAuxClickCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
244
+ onClick?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
245
+ onClickCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
246
+ onContextMenu?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
247
+ onContextMenuCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
248
+ onDoubleClick?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
249
+ onDoubleClickCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
250
+ onDrag?: react.DragEventHandler<HTMLHeadingElement> | undefined;
251
+ onDragCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
252
+ onDragEnd?: react.DragEventHandler<HTMLHeadingElement> | undefined;
253
+ onDragEndCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
254
+ onDragEnter?: react.DragEventHandler<HTMLHeadingElement> | undefined;
255
+ onDragEnterCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
256
+ onDragExit?: react.DragEventHandler<HTMLHeadingElement> | undefined;
257
+ onDragExitCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
258
+ onDragLeave?: react.DragEventHandler<HTMLHeadingElement> | undefined;
259
+ onDragLeaveCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
260
+ onDragOver?: react.DragEventHandler<HTMLHeadingElement> | undefined;
261
+ onDragOverCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
262
+ onDragStart?: react.DragEventHandler<HTMLHeadingElement> | undefined;
263
+ onDragStartCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
264
+ onDrop?: react.DragEventHandler<HTMLHeadingElement> | undefined;
265
+ onDropCapture?: react.DragEventHandler<HTMLHeadingElement> | undefined;
266
+ onMouseDown?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
267
+ onMouseDownCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
268
+ onMouseEnter?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
269
+ onMouseLeave?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
270
+ onMouseMove?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
271
+ onMouseMoveCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
272
+ onMouseOut?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
273
+ onMouseOutCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
274
+ onMouseOver?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
275
+ onMouseOverCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
276
+ onMouseUp?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
277
+ onMouseUpCapture?: react.MouseEventHandler<HTMLHeadingElement> | undefined;
278
+ onSelect?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
279
+ onSelectCapture?: react.ReactEventHandler<HTMLHeadingElement> | undefined;
280
+ onTouchCancel?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
281
+ onTouchCancelCapture?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
282
+ onTouchEnd?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
283
+ onTouchEndCapture?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
284
+ onTouchMove?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
285
+ onTouchMoveCapture?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
286
+ onTouchStart?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
287
+ onTouchStartCapture?: react.TouchEventHandler<HTMLHeadingElement> | undefined;
288
+ onPointerDown?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
289
+ onPointerDownCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
290
+ onPointerMove?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
291
+ onPointerMoveCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
292
+ onPointerUp?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
293
+ onPointerUpCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
294
+ onPointerCancel?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
295
+ onPointerCancelCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
296
+ onPointerEnter?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
297
+ onPointerLeave?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
298
+ onPointerOver?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
299
+ onPointerOverCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
300
+ onPointerOut?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
301
+ onPointerOutCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
302
+ onGotPointerCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
303
+ onGotPointerCaptureCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
304
+ onLostPointerCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
305
+ onLostPointerCaptureCapture?: react.PointerEventHandler<HTMLHeadingElement> | undefined;
306
+ onScroll?: react.UIEventHandler<HTMLHeadingElement> | undefined;
307
+ onScrollCapture?: react.UIEventHandler<HTMLHeadingElement> | undefined;
308
+ onScrollEnd?: react.UIEventHandler<HTMLHeadingElement> | undefined;
309
+ onScrollEndCapture?: react.UIEventHandler<HTMLHeadingElement> | undefined;
310
+ onWheel?: react.WheelEventHandler<HTMLHeadingElement> | undefined;
311
+ onWheelCapture?: react.WheelEventHandler<HTMLHeadingElement> | undefined;
312
+ onAnimationStart?: react.AnimationEventHandler<HTMLHeadingElement> | undefined;
313
+ onAnimationStartCapture?: react.AnimationEventHandler<HTMLHeadingElement> | undefined;
314
+ onAnimationEnd?: react.AnimationEventHandler<HTMLHeadingElement> | undefined;
315
+ onAnimationEndCapture?: react.AnimationEventHandler<HTMLHeadingElement> | undefined;
316
+ onAnimationIteration?: react.AnimationEventHandler<HTMLHeadingElement> | undefined;
317
+ onAnimationIterationCapture?: react.AnimationEventHandler<HTMLHeadingElement> | undefined;
318
+ onToggle?: react.ToggleEventHandler<HTMLHeadingElement> | undefined;
319
+ onBeforeToggle?: react.ToggleEventHandler<HTMLHeadingElement> | undefined;
320
+ onTransitionCancel?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
321
+ onTransitionCancelCapture?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
322
+ onTransitionEnd?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
323
+ onTransitionEndCapture?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
324
+ onTransitionRun?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
325
+ onTransitionRunCapture?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
326
+ onTransitionStart?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
327
+ onTransitionStartCapture?: react.TransitionEventHandler<HTMLHeadingElement> | undefined;
328
+ className: string;
329
+ }, Element>;
330
+
331
+ /** Props for the separator component. */
332
+ interface SeparatorProps {
333
+ /** Visual/semantic axis. Defaults to `"horizontal"`. */
334
+ orientation?: "horizontal" | "vertical";
335
+ /** Hide from the accessibility tree (purely visual). */
336
+ decorative?: boolean;
337
+ /** Optional centered label — horizontal orientation only. */
338
+ children?: ReactNode;
339
+ className?: string;
340
+ }
341
+ /**
342
+ * Visual divider between content. Wraps the headless primitive with design
343
+ * tokens. With `children`, renders a centered label flanked by rules.
344
+ */
345
+ declare function Separator({ orientation, decorative, children, className, }: SeparatorProps): react_jsx_runtime.JSX.Element;
346
+ declare namespace Separator {
347
+ var displayName: string;
348
+ }
349
+
350
+ declare const PATTERNS: {
351
+ readonly numeric: RegExp;
352
+ readonly alphanumeric: RegExp;
353
+ };
354
+ /** Props for the OTP / PIN field component. */
355
+ interface OtpFieldProps {
356
+ /** Number of cells. Default 6. */
357
+ length?: number;
358
+ value?: string;
359
+ defaultValue?: string;
360
+ onChange?: (value: string) => void;
361
+ /** Fired once every cell is filled. */
362
+ onComplete?: (value: string) => void;
363
+ /** Allowed characters. Default `"numeric"`. */
364
+ type?: keyof typeof PATTERNS;
365
+ /** Render filled cells as dots (for secret PINs). */
366
+ mask?: boolean;
367
+ disabled?: boolean;
368
+ autoFocus?: boolean;
369
+ /** Form field name — renders a hidden input carrying the full value. */
370
+ name?: string;
371
+ label?: string;
372
+ required?: boolean;
373
+ error?: string;
374
+ hint?: string;
375
+ className?: string;
376
+ id?: string;
377
+ "aria-label"?: string;
378
+ }
379
+ /**
380
+ * One-time-code / PIN entry split into per-character cells, with paste
381
+ * distribution, auto-advancing focus, and arrow/backspace navigation.
382
+ */
383
+ declare function OtpField({ length, value: controlledValue, defaultValue, onChange, onComplete, type, mask, disabled, autoFocus, name, label, required, error, hint, className, id, "aria-label": ariaLabel, }: OtpFieldProps): react_jsx_runtime.JSX.Element;
384
+ declare namespace OtpField {
385
+ var displayName: string;
386
+ }
387
+
388
+ declare const sizeStyles: {
389
+ readonly sm: "h-8 min-w-8 px-2 text-xs gap-1.5";
390
+ readonly md: "h-10 min-w-10 px-3 text-sm gap-2";
391
+ };
392
+ /** Props for the toggle component. */
393
+ interface ToggleProps extends ToggleProps$1 {
394
+ size?: keyof typeof sizeStyles;
395
+ children?: ReactNode;
396
+ }
397
+ /** A two-state (pressed) button. Use standalone or inside `ToggleGroup`. */
398
+ declare function Toggle({ size, className, children, ...props }: ToggleProps): react_jsx_runtime.JSX.Element;
399
+ declare namespace Toggle {
400
+ var displayName: string;
401
+ }
402
+ /** Props for the toggle group component. */
403
+ type ToggleGroupProps = ToggleGroupProps$1;
404
+ /** A set of related toggles with shared selection and keyboard navigation. */
405
+ declare function ToggleGroup({ className, children, orientation, ...props }: ToggleGroupProps): react_jsx_runtime.JSX.Element;
406
+ declare namespace ToggleGroup {
407
+ var displayName: string;
408
+ }
409
+
410
+ /** A vertically stacked set of expandable panels (single or multiple open). */
411
+ declare function AccordionRoot({ className, ...props }: AccordionRootProps & {
412
+ className?: string;
413
+ }): react_jsx_runtime.JSX.Element;
414
+ declare namespace AccordionRoot {
415
+ var displayName: string;
416
+ }
417
+ /** A single accordion entry, identified by its `value`. */
418
+ declare function AccordionItem({ className, ...props }: AccordionItemProps): react_jsx_runtime.JSX.Element;
419
+ declare namespace AccordionItem {
420
+ var displayName: string;
421
+ }
422
+ /** The clickable header that expands/collapses its panel. */
423
+ declare function AccordionTrigger({ className, children, ...props }: AccordionTriggerProps): react_jsx_runtime.JSX.Element;
424
+ declare namespace AccordionTrigger {
425
+ var displayName: string;
426
+ }
427
+ /** The collapsible panel body associated with a trigger. */
428
+ declare function AccordionContent({ className, children, ...props }: AccordionContentProps): react_jsx_runtime.JSX.Element;
429
+ declare namespace AccordionContent {
430
+ var displayName: string;
431
+ }
432
+
433
+ /** Props for the stat card component. */
434
+ interface StatCardProps extends StatCard$1 {
435
+ sparklineData?: number[];
436
+ className?: string;
437
+ }
438
+ /** Renders the stat card component. */
439
+ declare function StatCard({ title, value, change, trend, sparklineData, className, }: StatCardProps): react_jsx_runtime.JSX.Element;
440
+ declare namespace StatCard {
441
+ var displayName: string;
442
+ }
443
+
444
+ /** Defines the breadcrumb item shape. */
445
+ interface BreadcrumbItem {
446
+ id: string;
447
+ label: string;
448
+ href?: string;
449
+ icon?: React.ReactNode;
450
+ disabled?: boolean;
451
+ }
452
+ /** Props for the breadcrumb component. */
453
+ interface BreadcrumbProps {
454
+ items: BreadcrumbItem[];
455
+ separator?: React.ReactNode;
456
+ className?: string;
457
+ onNavigate?: (item: BreadcrumbItem) => void;
458
+ /** aria-label for the navigation */
459
+ "aria-label"?: string;
460
+ }
461
+ /** Renders the breadcrumb component. */
462
+ declare function Breadcrumb({ items, separator, className, onNavigate, "aria-label": ariaLabel, }: BreadcrumbProps): react_jsx_runtime.JSX.Element;
463
+
464
+ /** Defines the empty state action shape. */
465
+ interface EmptyStateAction {
466
+ id: string;
467
+ label: string;
468
+ onClick: () => void;
469
+ variant?: "primary" | "secondary";
470
+ disabled?: boolean;
471
+ }
472
+ /** Props for the empty component. */
473
+ interface EmptyStateProps {
474
+ icon?: React.ReactNode;
475
+ title: string;
476
+ description?: string;
477
+ actions?: EmptyStateAction[];
478
+ className?: string;
479
+ /** Icon size preset */
480
+ iconSize?: "sm" | "md" | "lg";
481
+ /** Heading level for semantic hierarchy */
482
+ headingLevel?: "h2" | "h3" | "h4";
483
+ }
484
+ /** Renders the empty state component. */
485
+ declare function EmptyState({ icon, title, description, actions, className, iconSize, headingLevel, }: EmptyStateProps): react_jsx_runtime.JSX.Element;
486
+
487
+ /** Props for the card component. */
488
+ interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
489
+ variant?: "default" | "outline" | "ghost";
490
+ padding?: "none" | "sm" | "md" | "lg";
491
+ /** Show shadow (default variant only) */
492
+ shadow?: boolean;
493
+ /** Enable click-to-select behavior with visual highlight */
494
+ selectable?: boolean;
495
+ /** Whether this card is currently selected (controlled) */
496
+ selected?: boolean;
497
+ /** Called when selected state changes */
498
+ onSelectedChange?: (selected: boolean) => void;
499
+ }
500
+ /** Renders the card component. */
501
+ declare function Card({ variant, padding, shadow, selectable, selected, onSelectedChange, className, children, onClick, onKeyDown, role, tabIndex, ...props }: CardProps): react_jsx_runtime.JSX.Element;
502
+ /** Props for the card header component. */
503
+ interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
504
+ /** Gap between title and description */
505
+ gap?: "sm" | "md" | "lg";
506
+ }
507
+ /** Renders the card header component. */
508
+ declare function CardHeader({ gap, className, children, ...props }: CardHeaderProps): react_jsx_runtime.JSX.Element;
509
+ /** Props for the card title component. */
510
+ interface CardTitleProps extends React.HTMLAttributes<HTMLHeadingElement> {
511
+ /** Heading level */
512
+ as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
513
+ }
514
+ /** Renders the card title component. */
515
+ declare function CardTitle({ as: Tag, className, children, ...props }: CardTitleProps): react_jsx_runtime.JSX.Element;
516
+ /** Props for the card description component. */
517
+ type CardDescriptionProps = React.HTMLAttributes<HTMLParagraphElement>;
518
+ /** Renders the card description component. */
519
+ declare function CardDescription({ className, children, ...props }: CardDescriptionProps): react_jsx_runtime.JSX.Element;
520
+ /** Props for the card content component. */
521
+ interface CardContentProps extends React.HTMLAttributes<HTMLDivElement> {
522
+ /** Spacing from header */
523
+ spacing?: "none" | "sm" | "md" | "lg";
524
+ }
525
+ /** Renders the card content component. */
526
+ declare function CardContent({ spacing, className, children, ...props }: CardContentProps): react_jsx_runtime.JSX.Element;
527
+ /** Props for the card footer component. */
528
+ interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {
529
+ /** Show top divider */
530
+ divider?: boolean;
531
+ }
532
+ /** Renders the card footer component. */
533
+ declare function CardFooter({ divider, className, children, ...props }: CardFooterProps): react_jsx_runtime.JSX.Element;
534
+
535
+ /** Props for the button component. */
536
+ interface ButtonProps extends ComponentPropsWithoutRef<"button"> {
537
+ variant?: "primary" | "secondary" | "ghost" | "danger";
538
+ size?: "sm" | "md" | "lg";
539
+ loading?: boolean;
540
+ leftIcon?: ReactNode;
541
+ rightIcon?: ReactNode;
542
+ }
543
+ /** Renders the button component. */
544
+ declare function Button({ variant, size, loading, leftIcon, rightIcon, className, disabled, children, "aria-busy": ariaBusy, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
545
+
546
+ /** Props for the badge component. */
547
+ interface BadgeProps extends ComponentPropsWithoutRef<"span"> {
548
+ variant?: "default" | "success" | "warning" | "error" | "info";
549
+ size?: "sm" | "md";
550
+ dot?: boolean;
551
+ /** Show a circular progress indicator (0-100) */
552
+ progress?: number;
553
+ /** Diameter of the progress ring in px (default: 16) */
554
+ progressSize?: number;
555
+ }
556
+ /** Renders the badge component. */
557
+ declare function Badge({ variant, size, dot, progress, progressSize, className, children, ...props }: BadgeProps): react_jsx_runtime.JSX.Element;
558
+
559
+ /** Props for the spinner component. */
560
+ interface SpinnerProps extends ComponentPropsWithoutRef<"svg"> {
561
+ size?: "sm" | "md" | "lg";
562
+ }
563
+ /** Renders the spinner component. */
564
+ declare function Spinner({ size, className, role, "aria-hidden": ariaHidden, "aria-label": ariaLabel, ...props }: SpinnerProps): react_jsx_runtime.JSX.Element;
565
+
566
+ /** Props for the alert component. */
567
+ interface AlertProps extends ComponentPropsWithoutRef<"div"> {
568
+ variant?: "info" | "success" | "warning" | "error";
569
+ title?: string;
570
+ icon?: ReactNode;
571
+ dismissible?: boolean;
572
+ onDismiss?: () => void;
573
+ }
574
+ /** Renders the alert component. */
575
+ declare function Alert({ variant, title, icon, dismissible, onDismiss, className, children, ...props }: AlertProps): react_jsx_runtime.JSX.Element;
576
+
577
+ /** Props for the input component. */
578
+ interface InputProps extends Omit<ComponentPropsWithoutRef<"input">, "size"> {
579
+ label?: string;
580
+ error?: string;
581
+ hint?: string;
582
+ leftIcon?: ReactNode;
583
+ rightIcon?: ReactNode;
584
+ fullWidth?: boolean;
585
+ size?: "sm" | "md" | "lg";
586
+ }
587
+ declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
588
+
589
+ /** Props for the switch component. */
590
+ interface SwitchProps extends Omit<ComponentPropsWithoutRef<"button">, "onChange" | "type" | "size"> {
591
+ label?: string;
592
+ required?: boolean;
593
+ error?: string;
594
+ hint?: string;
595
+ /** @deprecated Use `hint` instead */
596
+ description?: string;
597
+ checked?: boolean;
598
+ defaultChecked?: boolean;
599
+ onChange?: (checked: boolean) => void;
600
+ size?: "sm" | "md" | "lg";
601
+ }
602
+ declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLButtonElement>>;
603
+
604
+ /** Props for the star rating component. */
605
+ interface StarRatingProps {
606
+ value?: number;
607
+ onChange?: (value: number) => void;
608
+ /** 최대 별 개수 (default: 5) */
609
+ max?: number;
610
+ /** 읽기 전용 (default: false) */
611
+ readOnly?: boolean;
612
+ size?: "sm" | "md" | "lg";
613
+ className?: string;
614
+ ariaLabel?: string;
615
+ }
616
+ /** Renders the star rating component. */
617
+ declare function StarRating({ value, onChange, max, readOnly, size, className, ariaLabel, }: StarRatingProps): react_jsx_runtime.JSX.Element;
618
+
619
+ /** Props for the skeleton component. */
620
+ interface SkeletonProps extends ComponentPropsWithoutRef<"div"> {
621
+ variant?: "text" | "circular" | "rectangular";
622
+ width?: string | number;
623
+ height?: string | number;
624
+ lines?: number;
625
+ animated?: boolean;
626
+ }
627
+ /** Renders the skeleton component. */
628
+ declare function Skeleton({ variant, width, height, lines, animated, className, style, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
629
+ /** Renders the skeleton text component. */
630
+ declare function SkeletonText({ lines, className, ...props }: Omit<SkeletonProps, "variant"> & {
631
+ lines?: number;
632
+ }): react_jsx_runtime.JSX.Element;
633
+ /** Renders the skeleton avatar component. */
634
+ declare function SkeletonAvatar({ size, className, ...props }: Omit<SkeletonProps, "variant" | "width" | "height"> & {
635
+ size?: number;
636
+ }): react_jsx_runtime.JSX.Element;
637
+ /** Renders the skeleton card component. */
638
+ declare function SkeletonCard({ className, ...props }: Omit<SkeletonProps, "variant">): react_jsx_runtime.JSX.Element;
639
+ /** Renders the skeleton table component. */
640
+ declare function SkeletonTable({ rows, columns, className, }: {
641
+ rows?: number;
642
+ columns?: number;
643
+ className?: string;
644
+ }): react_jsx_runtime.JSX.Element;
645
+
646
+ /** Props for the textarea component. */
647
+ interface TextareaProps extends ComponentPropsWithoutRef<"textarea"> {
648
+ label?: string;
649
+ error?: string;
650
+ hint?: string;
651
+ fullWidth?: boolean;
652
+ resize?: "none" | "vertical" | "horizontal" | "both";
653
+ size?: "sm" | "md" | "lg";
654
+ }
655
+ declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
656
+
657
+ /** Loading status of the avatar image, modeled as a state machine. */
658
+ type AvatarImageLoadingStatus = "idle" | "loading" | "loaded" | "error";
659
+ /** Props for the avatar component. */
660
+ interface AvatarProps extends ComponentPropsWithoutRef<"span"> {
661
+ src?: string;
662
+ /** Responsive candidate set forwarded to the underlying `<img>`. */
663
+ srcSet?: string;
664
+ /** Sizes hint paired with `srcSet` for responsive image selection. */
665
+ sizes?: string;
666
+ crossOrigin?: ImgHTMLAttributes<HTMLImageElement>["crossOrigin"];
667
+ referrerPolicy?: ImgHTMLAttributes<HTMLImageElement>["referrerPolicy"];
668
+ alt?: string;
669
+ name?: string;
670
+ size?: "xs" | "sm" | "md" | "lg" | "xl";
671
+ fallback?: ReactNode;
672
+ status?: "online" | "offline" | "busy" | "away";
673
+ /** Fired whenever the image loading status changes. */
674
+ onLoadingStatusChange?: (status: AvatarImageLoadingStatus) => void;
675
+ }
676
+ /** Renders the avatar component. */
677
+ declare function Avatar({ src, srcSet, sizes, crossOrigin, referrerPolicy, alt, name, size, fallback, status, className, onLoadingStatusChange, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
678
+ /** Props for the avatar group component. */
679
+ interface AvatarGroupProps extends ComponentPropsWithoutRef<"div"> {
680
+ max?: number;
681
+ size?: AvatarProps["size"];
682
+ children: ReactNode;
683
+ }
684
+ /** Renders the avatar group component. */
685
+ declare function AvatarGroup({ max, size, children, className, ...props }: AvatarGroupProps): react_jsx_runtime.JSX.Element;
686
+
687
+ /** Props for the progress component. */
688
+ interface ProgressProps extends ComponentPropsWithoutRef<"div"> {
689
+ value?: number;
690
+ max?: number;
691
+ size?: "sm" | "md" | "lg";
692
+ variant?: "default" | "success" | "warning" | "error";
693
+ showLabel?: boolean;
694
+ label?: string;
695
+ animated?: boolean;
696
+ indeterminate?: boolean;
697
+ }
698
+ /** Renders the progress component. */
699
+ declare function Progress({ value, max, size, variant, showLabel, label, animated, indeterminate, className, ...props }: ProgressProps): react_jsx_runtime.JSX.Element;
700
+ /** Props for the circular progress component. */
701
+ interface CircularProgressProps extends ComponentPropsWithoutRef<"svg"> {
702
+ value?: number;
703
+ max?: number;
704
+ size?: number;
705
+ strokeWidth?: number;
706
+ variant?: "default" | "success" | "warning" | "error";
707
+ showLabel?: boolean;
708
+ label?: string;
709
+ indeterminate?: boolean;
710
+ }
711
+ /** Renders the circular progress component. */
712
+ declare function CircularProgress({ value, max, size, strokeWidth, variant, showLabel, label, indeterminate, className, ...props }: CircularProgressProps): react_jsx_runtime.JSX.Element;
713
+
714
+ /** Props for the meter component. */
715
+ interface MeterProps extends Omit<ComponentPropsWithoutRef<"div">, "children"> {
716
+ /** Current value within [min, max]. */
717
+ value: number;
718
+ min?: number;
719
+ max?: number;
720
+ size?: "sm" | "md" | "lg";
721
+ variant?: "default" | "success" | "warning" | "error";
722
+ /** Show the value as a percentage next to the label. */
723
+ showValue?: boolean;
724
+ label?: string;
725
+ /** Override the localized `aria-valuetext`. */
726
+ getValueLabel?: (value: number, min: number, max: number) => string;
727
+ }
728
+ /**
729
+ * A scalar measurement within a known range (disk usage, score, capacity) —
730
+ * `role="meter"`, distinct from Progress (task completion). Built on the
731
+ * opt-ui-primitives Meter primitive, which owns the role/aria/valuetext.
732
+ */
733
+ declare function Meter({ value, min, max, size, variant, showValue, label, getValueLabel, className, ...props }: MeterProps): react_jsx_runtime.JSX.Element;
734
+
735
+ interface CompositeZoneProps {
736
+ children: React.ReactNode;
737
+ label: string;
738
+ focusLoop?: boolean;
739
+ focusWrap?: boolean;
740
+ className?: string;
741
+ }
742
+ /** Renders the composite zone component. */
743
+ declare function CompositeZone({ children, label, focusLoop, focusWrap, className, }: CompositeZoneProps): react_jsx_runtime.JSX.Element;
744
+
745
+ /** Renders the disclosure root component. */
746
+ declare function DisclosureRoot(props: DisclosureRootProps): react_jsx_runtime.JSX.Element;
747
+
748
+ /** Renders the disclosure trigger component. */
749
+ declare function DisclosureTrigger({ className, ...props }: DisclosureTriggerProps): react_jsx_runtime.JSX.Element;
750
+
751
+ /** Renders the disclosure content component. */
752
+ declare function DisclosureContent({ className, ...props }: DisclosureContentProps): react_jsx_runtime.JSX.Element;
753
+
754
+ /** Renders the tabs root component. */
755
+ declare function TabsRoot(props: TabsRootProps): react_jsx_runtime.JSX.Element;
756
+ /** Renders the tab list component. */
757
+ declare function TabList({ className, ...props }: TabListProps): react_jsx_runtime.JSX.Element;
758
+ /** Renders the tab component. */
759
+ declare function Tab({ className, ...props }: TabProps): react_jsx_runtime.JSX.Element;
760
+ /** Renders the tab panel component. */
761
+ declare function TabPanel({ className, ...props }: TabPanelProps): react_jsx_runtime.JSX.Element;
762
+
763
+ /** Renders the select root component. */
764
+ declare function SelectRoot(props: SelectRootProps): react_jsx_runtime.JSX.Element;
765
+ /** Renders the select label component. */
766
+ declare function SelectLabel(props: SelectLabelProps): react_jsx_runtime.JSX.Element;
767
+ type SelectTriggerProps = SelectTriggerProps$1 & {
768
+ minWidth?: number | string;
769
+ };
770
+ /** Renders the select trigger component. */
771
+ declare function SelectTrigger({ className, minWidth, style, ...props }: SelectTriggerProps): react_jsx_runtime.JSX.Element;
772
+ /** Renders the select popover component. */
773
+ declare function SelectPopover({ className, ...props }: SelectPopoverProps): react_jsx_runtime.JSX.Element;
774
+ /** Renders the select item component. */
775
+ declare function SelectItem({ className, ...props }: SelectItemProps): react_jsx_runtime.JSX.Element;
776
+
777
+ declare const sizeClasses: {
778
+ readonly xs: "max-w-xs";
779
+ readonly sm: "max-w-sm";
780
+ readonly md: "max-w-lg";
781
+ readonly lg: "max-w-2xl";
782
+ readonly xl: "max-w-4xl";
783
+ readonly full: "max-w-[calc(100vw-2rem)]";
784
+ };
785
+ /** Type definition for dialog size. */
786
+ type DialogSize = keyof typeof sizeClasses;
787
+ /** Renders the dialog root component. */
788
+ declare function DialogRoot(props: DialogRootProps): react_jsx_runtime.JSX.Element;
789
+ type DialogDisclosureProps = ComponentPropsWithoutRef<"button">;
790
+ /** Renders the dialog disclosure component. */
791
+ declare function DialogDisclosure({ className, ...props }: DialogDisclosureProps): react_jsx_runtime.JSX.Element;
792
+ type DialogPanelProps = DialogPanelProps$1 & {
793
+ size?: DialogSize;
794
+ };
795
+ /** Renders the dialog panel component. */
796
+ declare function DialogPanel({ className, size, ...props }: DialogPanelProps): react_jsx_runtime.JSX.Element;
797
+ /** Props for the alert dialog panel component. */
798
+ type AlertDialogPanelProps = AlertDialogPanelProps$1 & {
799
+ size?: DialogSize;
800
+ };
801
+ /**
802
+ * A dialog that demands an explicit choice: `role="alertdialog"` with no
803
+ * backdrop/Escape dismissal. Use for destructive confirmations. Compose with
804
+ * the other Dialog parts (DialogRoot/Heading/Description/Dismiss/…).
805
+ */
806
+ declare function AlertDialogPanel({ className, size, ...props }: AlertDialogPanelProps): react_jsx_runtime.JSX.Element;
807
+ type DialogHeadingProps = ComponentPropsWithoutRef<"h2">;
808
+ /** Renders the dialog heading component. */
809
+ declare function DialogHeading({ className, ...props }: DialogHeadingProps): react_jsx_runtime.JSX.Element;
810
+ type DialogDescriptionProps = ComponentPropsWithoutRef<"p">;
811
+ /** Renders the dialog description component. */
812
+ declare function DialogDescription({ className, ...props }: DialogDescriptionProps): react_jsx_runtime.JSX.Element;
813
+ type DialogDismissProps = ComponentPropsWithoutRef<"button">;
814
+ /** Renders the dialog dismiss component. */
815
+ declare function DialogDismiss({ className, ...props }: DialogDismissProps): react_jsx_runtime.JSX.Element;
816
+ /** Props for the dialog header component. */
817
+ interface DialogHeaderProps {
818
+ children: ReactNode;
819
+ className?: string;
820
+ }
821
+ /** Renders the dialog header component. */
822
+ declare function DialogHeader({ children, className }: DialogHeaderProps): react_jsx_runtime.JSX.Element;
823
+ /** Props for the dialog body component. */
824
+ interface DialogBodyProps {
825
+ children: ReactNode;
826
+ className?: string;
827
+ }
828
+ /** Renders the dialog body component. */
829
+ declare function DialogBody({ children, className }: DialogBodyProps): react_jsx_runtime.JSX.Element;
830
+ /** Props for the dialog footer component. */
831
+ interface DialogFooterProps {
832
+ children: ReactNode;
833
+ className?: string;
834
+ }
835
+ /** Renders the dialog footer component. */
836
+ declare function DialogFooter({ children, className }: DialogFooterProps): react_jsx_runtime.JSX.Element;
837
+
838
+ /** Renders the combobox root component. */
839
+ declare function ComboboxRoot(props: ComboboxRootProps): react_jsx_runtime.JSX.Element;
840
+ /** Renders the combobox input component. */
841
+ declare function ComboboxInput({ className, ...props }: ComboboxInputProps): react_jsx_runtime.JSX.Element;
842
+ /** Renders the combobox popover component. */
843
+ declare function ComboboxPopover({ className, ...props }: ComboboxPopoverProps): react_jsx_runtime.JSX.Element;
844
+ /** Renders the combobox item component. */
845
+ declare function ComboboxItem({ className, ...props }: ComboboxItemProps): react_jsx_runtime.JSX.Element;
846
+ /** Renders the combobox group component. */
847
+ declare function ComboboxGroup(props: ComboboxGroupProps): react_jsx_runtime.JSX.Element;
848
+ /** Renders the combobox group label component. */
849
+ declare function ComboboxGroupLabel({ className, ...props }: ComboboxGroupLabelProps): react_jsx_runtime.JSX.Element;
850
+ /** Renders the combobox empty component. */
851
+ declare function ComboboxEmpty({ className, children, }: {
852
+ className?: string;
853
+ children?: React.ReactNode;
854
+ }): react_jsx_runtime.JSX.Element;
855
+
856
+ /** Renders the menubar root component. */
857
+ declare function MenubarRoot(props: MenubarRootProps): react_jsx_runtime.JSX.Element;
858
+ /** Renders the menubar container component. */
859
+ declare function MenubarContainer({ className, ...props }: MenubarContainerProps): react_jsx_runtime.JSX.Element;
860
+ /** Renders the menu root component. */
861
+ declare function MenuRoot(props: MenuRootProps): react_jsx_runtime.JSX.Element;
862
+ /** Renders the menu trigger component. */
863
+ declare function MenuTrigger({ className, ...props }: MenuTriggerProps): react_jsx_runtime.JSX.Element;
864
+ /** Renders the menu button arrow component. */
865
+ declare function MenuButtonArrow(props: MenuButtonArrowProps): react_jsx_runtime.JSX.Element;
866
+ /** Renders the menu popover component. */
867
+ declare function MenuPopover({ className, ...props }: MenuPopoverProps): react_jsx_runtime.JSX.Element;
868
+ /** Renders the menu item component. */
869
+ declare function MenuItem({ className, ...props }: MenuItemProps): react_jsx_runtime.JSX.Element;
870
+ /** Renders the menu item checkbox component. */
871
+ declare function MenuItemCheckbox({ className, ...props }: MenuItemCheckboxProps): react_jsx_runtime.JSX.Element;
872
+ /** Renders the menu item radio component. */
873
+ declare function MenuItemRadio({ className, ...props }: MenuItemRadioProps): react_jsx_runtime.JSX.Element;
874
+ /** Renders the menu separator component. */
875
+ declare function MenuSeparator({ className, ...props }: MenuSeparatorProps): react_jsx_runtime.JSX.Element;
876
+
877
+ /** Renders the toolbar root component. */
878
+ declare function ToolbarRoot(props: ToolbarRootProps): react_jsx_runtime.JSX.Element;
879
+ /** Renders the toolbar container component. */
880
+ declare function ToolbarContainer({ className, ...props }: ToolbarContainerProps): react_jsx_runtime.JSX.Element;
881
+ /** Renders the toolbar button component. */
882
+ declare function ToolbarButton({ className, ...props }: ToolbarButtonProps): react_jsx_runtime.JSX.Element;
883
+ /** Renders the toolbar separator component. */
884
+ declare function ToolbarSeparator({ className, ...props }: ToolbarSeparatorProps): react_jsx_runtime.JSX.Element;
885
+ /** Renders the tooltip provider component. */
886
+ declare function TooltipProvider(props: TooltipProviderProps): react_jsx_runtime.JSX.Element;
887
+ /** Renders the tooltip anchor component. */
888
+ declare function TooltipAnchor({ className, ...props }: TooltipAnchorProps): react_jsx_runtime.JSX.Element;
889
+ /** Renders the tooltip component. */
890
+ declare function Tooltip({ className, ...props }: TooltipProps): react_jsx_runtime.JSX.Element;
891
+
892
+ type NumberInputValue = number | null;
893
+ /** Accessible labels used by NumberInput controls and validation text. */
894
+ interface NumberInputLabels {
895
+ input?: string;
896
+ decrease?: string;
897
+ increase?: string;
898
+ clear?: string;
899
+ invalid?: string;
900
+ }
901
+ /** Props for the number input component. */
902
+ interface NumberInputProps<TNullable extends boolean = false> {
903
+ value?: TNullable extends true ? NumberInputValue : number;
904
+ defaultValue?: TNullable extends true ? NumberInputValue : number;
905
+ onChange?: (value: TNullable extends true ? NumberInputValue : number) => void;
906
+ /** Allows the field to commit an empty value as `null`. */
907
+ nullable?: TNullable;
908
+ /** Shows a clear button when `nullable` is true and the current value is set. */
909
+ clearable?: boolean;
910
+ min?: number;
911
+ max?: number;
912
+ step?: number;
913
+ /** Step used for PageUp/PageDown. Defaults to `step * 10`. */
914
+ largeStep?: number;
915
+ /**
916
+ * When `true` (and a `label` is set), the label becomes a horizontal drag
917
+ * handle that scrubs the value, like a spinner knob.
918
+ */
919
+ scrub?: boolean;
920
+ label?: string;
921
+ /** Unit suffix rendered inside the input, for example `%`, `px`, or `ms`. */
922
+ unit?: react.ReactNode;
923
+ required?: boolean;
924
+ error?: string;
925
+ hint?: string;
926
+ disabled?: boolean;
927
+ /** Keeps the field focusable with `aria-disabled` and exposes the reason. */
928
+ disabledReason?: string;
929
+ labels?: NumberInputLabels;
930
+ className?: string;
931
+ id?: string;
932
+ "aria-label"?: string;
933
+ }
934
+ /** Renders the number input component. */
935
+ declare function NumberInput<TNullable extends boolean = false>({ value: controlledValue, defaultValue, onChange, nullable, clearable, min, max, step, largeStep, scrub, label, unit, required, error, hint, disabled, disabledReason, labels, className, id, "aria-label": ariaLabel, }: NumberInputProps<TNullable>): react_jsx_runtime.JSX.Element;
936
+ declare namespace NumberInput {
937
+ var displayName: string;
938
+ }
939
+
940
+ /** Props for the slider component. */
941
+ interface SliderProps {
942
+ value?: number;
943
+ defaultValue?: number;
944
+ onChange?: (value: number) => void;
945
+ min?: number;
946
+ max?: number;
947
+ step?: number;
948
+ label?: string;
949
+ /** Show numeric value next to slider */
950
+ showValue?: boolean;
951
+ /** Format function for the displayed value */
952
+ formatValue?: (value: number) => string;
953
+ disabled?: boolean;
954
+ className?: string;
955
+ "aria-label"?: string;
956
+ }
957
+ /** Renders the slider component. */
958
+ declare function Slider({ value: controlledValue, defaultValue, onChange, min, max, step, label, showValue, formatValue, disabled, className, "aria-label": ariaLabel, }: SliderProps): react_jsx_runtime.JSX.Element;
959
+ declare namespace Slider {
960
+ var displayName: string;
961
+ }
962
+
963
+ /** Props for the color picker component. */
964
+ interface ColorPickerProps {
965
+ value?: string;
966
+ onChange?: (color: string) => void;
967
+ presets?: string[];
968
+ label?: string;
969
+ required?: boolean;
970
+ error?: string;
971
+ hint?: string;
972
+ placeholder?: string;
973
+ disabled?: boolean;
974
+ className?: string;
975
+ id?: string;
976
+ "aria-label"?: string;
977
+ }
978
+ declare const ColorPicker: react.ForwardRefExoticComponent<ColorPickerProps & react.RefAttributes<HTMLInputElement>>;
979
+
980
+ /** Defines the icon shape. */
981
+ interface IconDef {
982
+ id: string;
983
+ label: string;
984
+ icon: react.ReactNode;
985
+ group?: string;
986
+ }
987
+ /** Props for the icon picker component. */
988
+ interface IconPickerProps {
989
+ value?: string;
990
+ onChange?: (iconId: string) => void;
991
+ icons?: IconDef[];
992
+ label?: string;
993
+ required?: boolean;
994
+ error?: string;
995
+ hint?: string;
996
+ placeholder?: string;
997
+ disabled?: boolean;
998
+ className?: string;
999
+ id?: string;
1000
+ "aria-label"?: string;
1001
+ }
1002
+ /** Renders the icon picker component. */
1003
+ declare function IconPicker({ value, onChange, icons, label, required, error, hint, placeholder, disabled, className, id, "aria-label": ariaLabel, }: IconPickerProps): react_jsx_runtime.JSX.Element;
1004
+ declare namespace IconPicker {
1005
+ var displayName: string;
1006
+ }
1007
+
1008
+ /** Props for the tag input component. */
1009
+ interface TagInputProps {
1010
+ value?: string[];
1011
+ onChange?: (tags: string[]) => void;
1012
+ placeholder?: string;
1013
+ label?: string;
1014
+ required?: boolean;
1015
+ error?: string;
1016
+ hint?: string;
1017
+ maxTags?: number;
1018
+ disabled?: boolean;
1019
+ className?: string;
1020
+ id?: string;
1021
+ "aria-label"?: string;
1022
+ /** Autocomplete suggestions shown as a dropdown while typing */
1023
+ suggestions?: string[];
1024
+ /** Delimiters for paste splitting */
1025
+ delimiters?: (string | RegExp)[];
1026
+ /** Allow duplicate tags */
1027
+ allowDuplicates?: boolean;
1028
+ }
1029
+ declare const TagInput: react.ForwardRefExoticComponent<TagInputProps & react.RefAttributes<HTMLInputElement>>;
1030
+
1031
+ /** Defines the date range shape. */
1032
+ interface DateRange {
1033
+ start: Date | null;
1034
+ end: Date | null;
1035
+ }
1036
+ /** Defines the date range preset shape. */
1037
+ interface DateRangePreset {
1038
+ label: string;
1039
+ range: () => DateRange;
1040
+ }
1041
+ /** Type definition for date granularity. */
1042
+ type DateGranularity = "hour" | "day" | "week" | "month";
1043
+ /** Type definition for comparison mode. */
1044
+ type ComparisonMode = "previous" | "year-over-year";
1045
+ /** Props for the date range picker component. */
1046
+ interface DateRangePickerProps {
1047
+ value?: DateRange;
1048
+ onChange?: (range: DateRange) => void;
1049
+ presets?: DateRangePreset[];
1050
+ placeholder?: string;
1051
+ label?: string;
1052
+ required?: boolean;
1053
+ error?: string;
1054
+ hint?: string;
1055
+ className?: string;
1056
+ id?: string;
1057
+ triggerClassName?: string;
1058
+ "aria-label"?: string;
1059
+ disabled?: boolean;
1060
+ format?: (date: Date) => string;
1061
+ /** Enable comparison mode toggle */
1062
+ comparison?: boolean;
1063
+ /** Current comparison mode */
1064
+ comparisonMode?: ComparisonMode;
1065
+ /** Called when comparison mode changes (null = comparison off) */
1066
+ onComparisonChange?: (mode: ComparisonMode | null) => void;
1067
+ /** Enable time granularity selector */
1068
+ showGranularity?: boolean;
1069
+ /** Current granularity */
1070
+ granularity?: DateGranularity;
1071
+ /** Called when granularity changes */
1072
+ onGranularityChange?: (granularity: DateGranularity) => void;
1073
+ }
1074
+ declare const DEFAULT_PRESETS: DateRangePreset[];
1075
+ /** Renders the date range picker component. */
1076
+ declare function DateRangePicker({ value, onChange, presets, placeholder, label, required, error, hint, className, id, triggerClassName, "aria-label": ariaLabel, disabled, format, comparison, comparisonMode, onComparisonChange, showGranularity, granularity, onGranularityChange, }: DateRangePickerProps): react_jsx_runtime.JSX.Element;
1077
+ declare namespace DateRangePicker {
1078
+ var displayName: string;
1079
+ }
1080
+
1081
+ type FormRootProps = FormRootProps$1 & {
1082
+ /** FormStore instance. When provided, wraps children with FormProvider automatically. */
1083
+ store?: FormStoreInstance;
1084
+ };
1085
+ /** Renders the form root component. */
1086
+ declare function FormRoot({ className, store, ...props }: FormRootProps): react_jsx_runtime.JSX.Element;
1087
+ type FormInputProps = FormInputProps$1;
1088
+ /** Renders the form input component. */
1089
+ declare function FormInput({ className, ...props }: FormInputProps): react_jsx_runtime.JSX.Element;
1090
+ /** Props for the form textarea component. */
1091
+ type FormTextareaProps = Omit<ComponentPropsWithoutRef<"textarea">, "name"> & {
1092
+ name: string;
1093
+ resize?: "none" | "vertical" | "horizontal" | "both";
1094
+ };
1095
+ /** Renders the form textarea component. */
1096
+ declare function FormTextarea({ className, resize, rows, name, ...props }: FormTextareaProps): react_jsx_runtime.JSX.Element;
1097
+ /** Props for the form select component. */
1098
+ type FormSelectProps = {
1099
+ name: string;
1100
+ children: React.ReactNode;
1101
+ className?: string;
1102
+ placeholder?: string;
1103
+ minWidth?: number | string;
1104
+ "aria-label"?: string;
1105
+ };
1106
+ /** Renders the form select component. */
1107
+ declare function FormSelect({ name, children, className, placeholder, minWidth, "aria-label": ariaLabel, }: FormSelectProps): react_jsx_runtime.JSX.Element;
1108
+ type FormSelectPopoverProps = ComponentPropsWithoutRef<typeof SelectPopover>;
1109
+ /** Renders the form select popover component. */
1110
+ declare function FormSelectPopover({ className, ...props }: FormSelectPopoverProps): react_jsx_runtime.JSX.Element;
1111
+ type FormSelectItemProps = ComponentPropsWithoutRef<typeof SelectItem>;
1112
+ /** Renders the form select item component. */
1113
+ declare function FormSelectItem({ className, ...props }: FormSelectItemProps): react_jsx_runtime.JSX.Element;
1114
+ /** Props for the form switch component. */
1115
+ type FormSwitchProps = FormSwitchProps$1 & {
1116
+ size?: "sm" | "md" | "lg";
1117
+ };
1118
+ /** Renders the form switch component. */
1119
+ declare function FormSwitch({ className, size, name, ...props }: FormSwitchProps): react_jsx_runtime.JSX.Element;
1120
+ type FormLabelProps = FormLabelProps$1;
1121
+ /** Renders the form label component. */
1122
+ declare function FormLabel({ className, ...props }: FormLabelProps): react_jsx_runtime.JSX.Element;
1123
+ type FormErrorProps = FormErrorProps$1;
1124
+ /** Renders the form error component. */
1125
+ declare function FormError({ className, ...props }: FormErrorProps): react_jsx_runtime.JSX.Element;
1126
+ type FormSubmitProps = FormSubmitProps$1;
1127
+ /** Renders the form submit component. */
1128
+ declare function FormSubmit({ className, disabled, children, ...props }: FormSubmitProps): react_jsx_runtime.JSX.Element;
1129
+ /** Renders the form provider component. */
1130
+ declare function FormProvider(props: ComponentPropsWithoutRef<typeof FormProvider$1>): react_jsx_runtime.JSX.Element;
1131
+ type FormGroupProps = FormGroupProps$1;
1132
+ /** Renders the form group component. */
1133
+ declare function FormGroup({ className, ...props }: FormGroupProps): react_jsx_runtime.JSX.Element;
1134
+ type FormGroupLabelProps = FormGroupLabelProps$1;
1135
+ /** Renders the form group label component. */
1136
+ declare function FormGroupLabel({ className, ...props }: FormGroupLabelProps): react_jsx_runtime.JSX.Element;
1137
+ type FormDescriptionProps = FormDescriptionProps$1;
1138
+ /** Renders the form description component. */
1139
+ declare function FormDescription({ className, ...props }: FormDescriptionProps): react_jsx_runtime.JSX.Element;
1140
+ type FormFieldProps = FormFieldProps$1;
1141
+ /** Renders the form field component. */
1142
+ declare function FormField({ className, ...props }: FormFieldProps): react_jsx_runtime.JSX.Element;
1143
+ type FormControlProps = FormInputProps$1;
1144
+ /** Renders the form control component. */
1145
+ declare function FormControl({ className, ...props }: FormControlProps): react_jsx_runtime.JSX.Element;
1146
+ type FormPushProps = FormPushProps$1;
1147
+ /** Renders the form push component. */
1148
+ declare function FormPush({ className, ...props }: FormPushProps): react_jsx_runtime.JSX.Element;
1149
+ type FormRemoveProps = FormRemoveProps$1;
1150
+ /** Renders the form remove component. */
1151
+ declare function FormRemove({ className, ...props }: FormRemoveProps): react_jsx_runtime.JSX.Element;
1152
+ type FormResetProps = FormResetProps$1;
1153
+ /** Renders the form reset component. */
1154
+ declare function FormReset({ className, ...props }: FormResetProps): react_jsx_runtime.JSX.Element;
1155
+ type FormCheckboxProps = FormCheckboxProps$1;
1156
+ /** Renders the form checkbox component. */
1157
+ declare function FormCheckbox({ className, ...props }: FormCheckboxProps): react_jsx_runtime.JSX.Element;
1158
+ type FormRadioGroupProps = FormRadioGroupProps$1;
1159
+ /** Renders the form radio group component. */
1160
+ declare function FormRadioGroup({ className, ...props }: FormRadioGroupProps): react_jsx_runtime.JSX.Element;
1161
+ type FormRadioProps = FormRadioProps$1;
1162
+ /** Renders the form radio component. */
1163
+ declare function FormRadio({ className, ...props }: FormRadioProps): react_jsx_runtime.JSX.Element;
1164
+ /** Props for the form number input component. */
1165
+ type FormNumberInputProps = Omit<NumberInputProps, "value" | "onChange"> & {
1166
+ name: string;
1167
+ };
1168
+ /** Renders the form number input component. */
1169
+ declare function FormNumberInput({ name, ...props }: FormNumberInputProps): react_jsx_runtime.JSX.Element;
1170
+ /** Props for the form slider component. */
1171
+ type FormSliderProps = Omit<SliderProps, "value" | "onChange"> & {
1172
+ name: string;
1173
+ };
1174
+ /** Renders the form slider component. */
1175
+ declare function FormSlider({ name, ...props }: FormSliderProps): react_jsx_runtime.JSX.Element;
1176
+ /** Props for the form star rating component. */
1177
+ type FormStarRatingProps = Omit<StarRatingProps, "value" | "onChange"> & {
1178
+ name: string;
1179
+ };
1180
+ /** Renders the form star rating component. */
1181
+ declare function FormStarRating({ name, ...props }: FormStarRatingProps): react_jsx_runtime.JSX.Element;
1182
+ /** Props for the form color picker component. */
1183
+ type FormColorPickerProps = Omit<ColorPickerProps, "value" | "onChange"> & {
1184
+ name: string;
1185
+ };
1186
+ /** Renders the form color picker component. */
1187
+ declare function FormColorPicker({ name, ...props }: FormColorPickerProps): react_jsx_runtime.JSX.Element;
1188
+ /** Props for the form icon picker component. */
1189
+ type FormIconPickerProps = Omit<IconPickerProps, "value" | "onChange"> & {
1190
+ name: string;
1191
+ };
1192
+ /** Renders the form icon picker component. */
1193
+ declare function FormIconPicker({ name, ...props }: FormIconPickerProps): react_jsx_runtime.JSX.Element;
1194
+ /** Props for the form tag input component. */
1195
+ type FormTagInputProps = Omit<TagInputProps, "value" | "onChange"> & {
1196
+ name: string;
1197
+ };
1198
+ /** Renders the form tag input component. */
1199
+ declare function FormTagInput({ name, ...props }: FormTagInputProps): react_jsx_runtime.JSX.Element;
1200
+ /** Props for the form date range picker component. */
1201
+ type FormDateRangePickerProps = Omit<DateRangePickerProps, "value" | "onChange"> & {
1202
+ name: string;
1203
+ };
1204
+ /** Renders the form date range picker component. */
1205
+ declare function FormDateRangePicker({ name, ...props }: FormDateRangePickerProps): react_jsx_runtime.JSX.Element;
1206
+
1207
+ /** Defines the step shape. */
1208
+ interface StepDef {
1209
+ id: string;
1210
+ label: string;
1211
+ description?: string;
1212
+ }
1213
+ /** Props for the step builder component. */
1214
+ interface StepBuilderProps {
1215
+ steps: StepDef[];
1216
+ onChange: (steps: StepDef[]) => void;
1217
+ label?: string;
1218
+ addLabel?: string;
1219
+ maxSteps?: number;
1220
+ className?: string;
1221
+ "aria-label"?: string;
1222
+ }
1223
+ /** Renders the step builder component. */
1224
+ declare function StepBuilder({ steps, onChange, label, addLabel, maxSteps, className, "aria-label": ariaLabel, }: StepBuilderProps): react_jsx_runtime.JSX.Element;
1225
+ declare namespace StepBuilder {
1226
+ var displayName: string;
1227
+ }
1228
+
1229
+ /** Type definition for condition operator. */
1230
+ type ConditionOperator = "equals" | "not_equals" | "contains" | "not_contains" | "gt" | "lt" | "gte" | "lte" | "is_set" | "is_not_set";
1231
+ /** Defines the condition shape. */
1232
+ interface ConditionDef {
1233
+ id: string;
1234
+ property: string;
1235
+ operator: ConditionOperator;
1236
+ value: string;
1237
+ /** Condition type for heterogeneous builders (e.g. "property", "event", "cohort") */
1238
+ type?: string;
1239
+ }
1240
+ /** Defines the condition group shape. */
1241
+ interface ConditionGroup {
1242
+ id: string;
1243
+ logic: "and" | "or";
1244
+ conditions: ConditionDef[];
1245
+ /** Nested sub-groups for unlimited depth AND/OR nesting */
1246
+ children?: ConditionGroup[];
1247
+ }
1248
+ /** Custom renderer for a condition type */
1249
+ interface ConditionTypeRenderer {
1250
+ label: string;
1251
+ render: (condition: ConditionDef, onChange: (updates: Partial<ConditionDef>) => void) => react.ReactNode;
1252
+ }
1253
+ /** Props for the condition builder component. */
1254
+ interface ConditionBuilderProps {
1255
+ groups: ConditionGroup[];
1256
+ onChange: (groups: ConditionGroup[]) => void;
1257
+ properties?: string[];
1258
+ label?: string;
1259
+ addConditionLabel?: string;
1260
+ addGroupLabel?: string;
1261
+ /** Label for "Add nested group" button */
1262
+ addNestedGroupLabel?: string;
1263
+ /** Enable nested sub-groups */
1264
+ nested?: boolean;
1265
+ /** Max nesting depth (default: 3) */
1266
+ maxDepth?: number;
1267
+ /** Registry of custom condition type renderers */
1268
+ conditionTypes?: Record<string, ConditionTypeRenderer>;
1269
+ /** Callback for live preview count */
1270
+ onPreview?: (groups: ConditionGroup[]) => void;
1271
+ /** Live preview count to display */
1272
+ previewCount?: number;
1273
+ className?: string;
1274
+ "aria-label"?: string;
1275
+ }
1276
+ /** Renders the condition builder component. */
1277
+ declare function ConditionBuilder({ groups, onChange, properties, label, addConditionLabel, addGroupLabel, addNestedGroupLabel, nested, maxDepth, conditionTypes, onPreview, previewCount, className, "aria-label": ariaLabel, }: ConditionBuilderProps): react_jsx_runtime.JSX.Element;
1278
+ declare namespace ConditionBuilder {
1279
+ var displayName: string;
1280
+ }
1281
+
1282
+ /** Renders the popover root component. */
1283
+ declare function PopoverRoot(props: PopoverRootProps): react_jsx_runtime.JSX.Element;
1284
+ declare const PopoverTrigger: react.ForwardRefExoticComponent<PopoverTriggerProps & react.RefAttributes<HTMLButtonElement>>;
1285
+ /** Props for the popover content component. */
1286
+ type PopoverContentProps = PopoverContentProps$1;
1287
+ /** Renders the popover content component. */
1288
+ declare function PopoverContent({ className, ...props }: PopoverContentProps): react_jsx_runtime.JSX.Element;
1289
+ /** Renders the popover close component. */
1290
+ declare function PopoverClose({ className, ...props }: PopoverCloseProps): react_jsx_runtime.JSX.Element;
1291
+
1292
+ declare const DropdownMenu: typeof MenuRoot;
1293
+ type DropdownTriggerProps = ComponentPropsWithoutRef<typeof MenuTrigger>;
1294
+ /** Renders the dropdown trigger component. */
1295
+ declare function DropdownTrigger({ className, ...props }: DropdownTriggerProps): react_jsx_runtime.JSX.Element;
1296
+ type DropdownContentProps = ComponentPropsWithoutRef<typeof MenuPopover>;
1297
+ /** Renders the dropdown content component. */
1298
+ declare function DropdownContent({ className, ...props }: DropdownContentProps): react_jsx_runtime.JSX.Element;
1299
+ type DropdownItemProps = ComponentPropsWithoutRef<typeof MenuItem> & {
1300
+ variant?: "default" | "destructive";
1301
+ };
1302
+ /** Renders the dropdown item component. */
1303
+ declare function DropdownItem({ className, variant, ...props }: DropdownItemProps): react_jsx_runtime.JSX.Element;
1304
+ type DropdownSeparatorProps = ComponentPropsWithoutRef<typeof MenuSeparator>;
1305
+ /** Renders the dropdown separator component. */
1306
+ declare function DropdownSeparator({ className, ...props }: DropdownSeparatorProps): react_jsx_runtime.JSX.Element;
1307
+
1308
+ /** Props for the checkbox component. */
1309
+ interface CheckboxProps extends Omit<ComponentPropsWithoutRef<"input">, "onChange" | "type" | "size"> {
1310
+ label?: string;
1311
+ required?: boolean;
1312
+ error?: string;
1313
+ hint?: string;
1314
+ /** @deprecated Use `hint` instead */
1315
+ description?: string;
1316
+ checked?: boolean;
1317
+ defaultChecked?: boolean;
1318
+ onChange?: (checked: boolean) => void;
1319
+ size?: "sm" | "md" | "lg";
1320
+ /** Value for CheckboxGroup */
1321
+ value?: string;
1322
+ /** Show indeterminate state */
1323
+ indeterminate?: boolean;
1324
+ }
1325
+ /** Props for the checkbox group component. */
1326
+ interface CheckboxGroupProps {
1327
+ children: ReactNode;
1328
+ value?: string[];
1329
+ defaultValue?: string[];
1330
+ onChange?: (value: string[]) => void;
1331
+ disabled?: boolean;
1332
+ size?: "sm" | "md" | "lg";
1333
+ error?: string;
1334
+ required?: boolean;
1335
+ className?: string;
1336
+ /** Layout direction */
1337
+ orientation?: "horizontal" | "vertical";
1338
+ label?: string;
1339
+ }
1340
+ declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<HTMLInputElement>>;
1341
+ /** Renders the checkbox group component. */
1342
+ declare function CheckboxGroup({ children, value: valueProp, defaultValue, onChange, disabled, size, error, required, className, orientation, label, }: CheckboxGroupProps): react_jsx_runtime.JSX.Element;
1343
+
1344
+ /** Props for the radio group component. */
1345
+ interface RadioGroupProps {
1346
+ children: ReactNode;
1347
+ value?: string;
1348
+ defaultValue?: string;
1349
+ onChange?: (value: string) => void;
1350
+ disabled?: boolean;
1351
+ size?: "sm" | "md" | "lg";
1352
+ error?: string;
1353
+ required?: boolean;
1354
+ className?: string;
1355
+ /** Layout direction */
1356
+ orientation?: "horizontal" | "vertical";
1357
+ label?: string;
1358
+ name?: string;
1359
+ }
1360
+ /** Props for the radio component. */
1361
+ interface RadioProps extends Omit<ComponentPropsWithoutRef<"label">, "size" | "onChange"> {
1362
+ value?: string;
1363
+ /** Managed by RadioGroup — kept for backward compatibility */
1364
+ name?: string;
1365
+ label?: string;
1366
+ hint?: string;
1367
+ /** @deprecated Use `hint` instead */
1368
+ description?: string;
1369
+ size?: "sm" | "md" | "lg";
1370
+ disabled?: boolean;
1371
+ }
1372
+ /** Renders the radio group component. */
1373
+ declare function RadioGroup({ children, value, defaultValue, onChange, disabled, size, error, required, className, orientation, label, name, }: RadioGroupProps): react_jsx_runtime.JSX.Element;
1374
+ declare const Radio: react.ForwardRefExoticComponent<RadioProps & react.RefAttributes<HTMLLabelElement>>;
1375
+
1376
+ /** Props for the block layout component. */
1377
+ interface BlockLayoutProps extends react.HTMLAttributes<HTMLDivElement> {
1378
+ children: react.ReactNode;
1379
+ /** Top-level spacing between Block sections. Defaults to "section". */
1380
+ spacing?: "section" | "group" | "element" | "none";
1381
+ /** Block 전체 로딩 상태 */
1382
+ loading?: boolean;
1383
+ /** LoadingOverlay 레이블 */
1384
+ loadingLabel?: string;
1385
+ }
1386
+ /** Renders the block layout component. */
1387
+ declare function BlockLayout({ children, className, spacing, loading, loadingLabel, ...props }: BlockLayoutProps): react_jsx_runtime.JSX.Element;
1388
+ declare namespace BlockLayout {
1389
+ var displayName: string;
1390
+ }
1391
+
1392
+ /** Props for the block base component. */
1393
+ interface BlockBaseProps {
1394
+ loading?: boolean;
1395
+ className?: string;
1396
+ }
1397
+ /**
1398
+ * Block 팩토리. BlockLayout 래핑을 구조적으로 강제합니다.
1399
+ *
1400
+ * @param name - displayName으로 사용할 컴포넌트 이름
1401
+ * @param render - 나머지 props를 받아 콘텐츠를 반환하는 렌더 함수
1402
+ * @param options - layoutClassName: BlockLayout에 전달할 추가 className
1403
+ */
1404
+ declare function createBlock<P extends BlockBaseProps>(name: string, render: (props: Omit<P, "loading" | "className">) => react.ReactNode, options?: {
1405
+ layoutClassName?: string;
1406
+ }): react.FC<P>;
1407
+
1408
+ /** Props for the page header component. */
1409
+ interface PageHeaderProps {
1410
+ title: string;
1411
+ description?: string;
1412
+ actions?: react.ReactNode;
1413
+ className?: string;
1414
+ }
1415
+ /** Renders the page header component. */
1416
+ declare function PageHeader({ title, description, actions, className, }: PageHeaderProps): react_jsx_runtime.JSX.Element;
1417
+ declare namespace PageHeader {
1418
+ var displayName: string;
1419
+ }
1420
+
1421
+ /** Props for the scroll area component. */
1422
+ interface ScrollAreaProps {
1423
+ children: react.ReactNode;
1424
+ className?: string;
1425
+ orientation?: "vertical" | "horizontal" | "both";
1426
+ }
1427
+ /** Renders the scroll area component. */
1428
+ declare function ScrollArea({ children, className, orientation, }: ScrollAreaProps): react_jsx_runtime.JSX.Element;
1429
+ declare namespace ScrollArea {
1430
+ var displayName: string;
1431
+ }
1432
+
1433
+ /** Props for the container component. */
1434
+ interface ContainerProps {
1435
+ children: react.ReactNode;
1436
+ maxWidth?: "sm" | "md" | "lg" | "xl" | "2xl" | "full";
1437
+ center?: boolean;
1438
+ className?: string;
1439
+ }
1440
+ /** Renders the container component. */
1441
+ declare function Container({ children, maxWidth, center, className, }: ContainerProps): react_jsx_runtime.JSX.Element;
1442
+ declare namespace Container {
1443
+ var displayName: string;
1444
+ }
1445
+
1446
+ /** Props for the section component. */
1447
+ interface SectionProps {
1448
+ children: ReactNode;
1449
+ title?: string;
1450
+ description?: string;
1451
+ className?: string;
1452
+ }
1453
+ /** Renders the section component. */
1454
+ declare function Section({ children, title, description, className, }: SectionProps): react_jsx_runtime.JSX.Element;
1455
+ declare namespace Section {
1456
+ var displayName: string;
1457
+ }
1458
+
1459
+ /** Props for the resizable panel group component. */
1460
+ interface ResizablePanelGroupProps {
1461
+ direction: "horizontal" | "vertical";
1462
+ children: react.ReactNode;
1463
+ className?: string;
1464
+ autoSaveId?: string;
1465
+ }
1466
+ /** Renders the resizable panel group component. */
1467
+ declare function ResizablePanelGroup({ direction, children, className, autoSaveId, }: ResizablePanelGroupProps): react_jsx_runtime.JSX.Element;
1468
+ declare namespace ResizablePanelGroup {
1469
+ var displayName: string;
1470
+ }
1471
+ /** Props for the resizable panel component. */
1472
+ interface ResizablePanelProps {
1473
+ defaultSize?: number;
1474
+ minSize?: number;
1475
+ maxSize?: number;
1476
+ collapsible?: boolean;
1477
+ children: react.ReactNode;
1478
+ className?: string;
1479
+ id?: string;
1480
+ }
1481
+ /** Renders the resizable panel component. */
1482
+ declare function ResizablePanel({ defaultSize, minSize, maxSize, collapsible, children, className, id, }: ResizablePanelProps): react_jsx_runtime.JSX.Element;
1483
+ declare namespace ResizablePanel {
1484
+ var displayName: string;
1485
+ }
1486
+ /** Props for the resizable handle component. */
1487
+ interface ResizableHandleProps {
1488
+ className?: string;
1489
+ withHandle?: boolean;
1490
+ }
1491
+ /** Renders the resizable handle component. */
1492
+ declare function ResizableHandle({ className, withHandle, }: ResizableHandleProps): react_jsx_runtime.JSX.Element;
1493
+ declare namespace ResizableHandle {
1494
+ var displayName: string;
1495
+ }
1496
+
1497
+ /** Props for the logo component. */
1498
+ interface LogoProps {
1499
+ /** 로고 이미지 URL */
1500
+ src?: string;
1501
+ /** 로고 아이콘 (ReactNode) — src 미설정 시 표시 */
1502
+ icon?: ReactNode;
1503
+ /** 텍스트 레이블 */
1504
+ text?: string;
1505
+ /** 이미지 alt 텍스트 */
1506
+ alt?: string;
1507
+ /** 크기 */
1508
+ size?: "sm" | "md" | "lg";
1509
+ /** 링크 URL — 설정 시 <a>로 래핑 */
1510
+ href?: string;
1511
+ /** 클릭 핸들러 */
1512
+ onClick?: () => void;
1513
+ className?: string;
1514
+ }
1515
+ /** Renders the logo component. */
1516
+ declare function Logo({ src, icon, text, alt, size, href, onClick, className, }: LogoProps): react_jsx_runtime.JSX.Element;
1517
+
1518
+ /** Type definition for drawer side. */
1519
+ type DrawerSide = "left" | "right" | "bottom";
1520
+ /** Type definition for drawer size. */
1521
+ type DrawerSize = "sm" | "md" | "lg" | "full";
1522
+ /** Props for the drawer panel component. */
1523
+ interface DrawerPanelProps extends DialogPanelProps$1 {
1524
+ side?: DrawerSide;
1525
+ size?: DrawerSize;
1526
+ /** Enable drag-to-dismiss toward the drawer's edge. Default `true`. */
1527
+ swipeToDismiss?: boolean;
1528
+ /** Pixels the panel must be dragged before release commits a dismiss. */
1529
+ swipeDismissThreshold?: number;
1530
+ }
1531
+ /** Renders the drawer root component. */
1532
+ declare function DrawerRoot(props: DialogRootProps): react_jsx_runtime.JSX.Element;
1533
+ /** Renders the drawer panel component. */
1534
+ declare function DrawerPanel({ className, side, size, swipeToDismiss, swipeDismissThreshold, style, onPointerDown, ...props }: DrawerPanelProps): react_jsx_runtime.JSX.Element;
1535
+ type DrawerCloseProps = ComponentPropsWithoutRef<"button">;
1536
+ /** Renders the drawer close component. */
1537
+ declare function DrawerClose({ className, ...props }: DrawerCloseProps): react_jsx_runtime.JSX.Element;
1538
+
1539
+ /** Visual treatment for the content between previous/next controls. */
1540
+ type PaginationVariant = "pages" | "count" | "compact" | "none";
1541
+ /** Accessible labels and visible range formatters used by Pagination. */
1542
+ interface PaginationLabels {
1543
+ previous?: string;
1544
+ next?: string;
1545
+ page?: (page: number) => string;
1546
+ currentPage?: (page: number) => string;
1547
+ compact?: (page: number, totalPages?: number) => string;
1548
+ count?: (start: number, end: number, totalItems: number) => string;
1549
+ }
1550
+ /** Props for the pagination component. */
1551
+ interface PaginationProps extends Omit<ComponentPropsWithoutRef<"nav">, "onChange"> {
1552
+ totalItems?: number;
1553
+ totalPages?: number;
1554
+ hasMore?: boolean;
1555
+ pageSize?: number;
1556
+ currentPage: number;
1557
+ onPageChange: (page: number) => void;
1558
+ showPageNumbers?: boolean;
1559
+ siblingCount?: number;
1560
+ variant?: PaginationVariant;
1561
+ isDisabled?: boolean;
1562
+ label?: string;
1563
+ labels?: PaginationLabels;
1564
+ }
1565
+ /** Renders the pagination component. */
1566
+ declare function Pagination({ totalItems, totalPages: totalPagesProp, hasMore, pageSize, currentPage, onPageChange, showPageNumbers, siblingCount, variant, isDisabled, label, labels, className, ...props }: PaginationProps): react_jsx_runtime.JSX.Element;
1567
+
1568
+ /** Props for the virtual list component. */
1569
+ interface VirtualListProps<T> {
1570
+ items: T[];
1571
+ renderItem: (item: T, index: number) => ReactNode;
1572
+ itemHeight: number;
1573
+ overscan?: number;
1574
+ className?: string;
1575
+ style?: CSSProperties;
1576
+ }
1577
+ /** Renders the virtual list component. */
1578
+ declare function VirtualList<T>({ items, renderItem, itemHeight, overscan, className, style, }: VirtualListProps<T>): react_jsx_runtime.JSX.Element;
1579
+
1580
+ /**
1581
+ * Shader 프리셋 레지스트리 — `ShaderSurface`가 렌더하는 고급 애니메이션 셰이더.
1582
+ *
1583
+ * 각 프리셋은 공유 GLSL 프렐류드(noise/fbm/rotate/grain/lux)에 자신의 `body`(프래그먼트
1584
+ * `main`)를 더해 완성된 프래그먼트 셰이더가 된다. 파라미터(scale/speed/...)는 프리셋이
1585
+ * 노출하는 슬라이더만 선언하며, 미선언 파라미터는 전역 기본값으로 uniform에 주입된다.
1586
+ *
1587
+ * 표현 방향: 은은하고 고급스러운(understated, premium) 마감 — 저채도 팔레트, 느린 모션,
1588
+ * 완만한 하이라이트, 미세한 필름 그레인. 모든 본문은 출력 직전 `lux()`로 살짝 디새추레이트한다.
1589
+ *
1590
+ * opt-ui `ShaderSurface`와 apps/web `shader-lab` 도구가 함께 소비한다(메타데이터: id,
1591
+ * 카테고리, 파라미터 스키마, 기본 색/값 / GLSL 원본: 내부).
1592
+ */
1593
+ type ShaderPresetId = "felix-metallic" | "liquid-silk" | "iridescent-pearl" | "molten-gold" | "liquid-glass" | "aurora-veil" | "holographic" | "chrome-ripple" | "mesh-flow" | "plasma-wave" | "swirl-vortex" | "caustics" | "nebula" | "voronoi-crystal" | "kaleidoscope" | "dither-gradient" | "halftone" | "dia-gradient";
1594
+ /** 프리셋 분류 (카탈로그 그룹). */
1595
+ type ShaderPresetCategory = "luxury" | "flow" | "geometric" | "retro" | "gradient";
1596
+ /** 조절 가능한 셰이더 파라미터 키. */
1597
+ type ShaderParamKey = "scale" | "speed" | "distortion" | "grain" | "contrast" | "angle" | "dim" | "vignette" | "scrim" | "interactive" | "bars" | "blur" | "peak" | "valley";
1598
+ /** 단일 파라미터의 범위/기본값 명세 (슬라이더 구성에 사용). */
1599
+ interface ShaderParamSpec {
1600
+ key: ShaderParamKey;
1601
+ min: number;
1602
+ max: number;
1603
+ step: number;
1604
+ default: number;
1605
+ }
1606
+ /** 하나의 셰이더 프리셋 정의 (메타데이터 + GLSL 본문). */
1607
+ interface ShaderPreset {
1608
+ id: ShaderPresetId;
1609
+ category: ShaderPresetCategory;
1610
+ /** 노출하는 색 입력 개수 (셰이더는 항상 3색 uniform을 받음). */
1611
+ colorSlots: 2 | 3;
1612
+ /** hex 색상 기본값 (길이 3). */
1613
+ defaultColors: [string, string, string];
1614
+ /** 이 프리셋이 노출하는 파라미터 슬라이더. */
1615
+ params: ShaderParamSpec[];
1616
+ /** 프래그먼트 셰이더 main 본문 (공유 프렐류드 뒤에 붙음). */
1617
+ body: string;
1618
+ }
1619
+ /** 프리셋이 선언하지 않은 파라미터의 전역 기본값 (uniform 폴백). */
1620
+ declare const SHADER_PARAM_FALLBACK: Record<ShaderParamKey, number>;
1621
+ declare const SHADER_PRESETS: readonly ShaderPreset[];
1622
+ declare const SHADER_PRESET_IDS: readonly ShaderPresetId[];
1623
+ declare const SHADER_PARAM_KEYS: readonly ShaderParamKey[];
1624
+ /** 패턴과 무관하게 모든 프리셋에 공통 적용되는 마감(가독성) 파라미터 키. */
1625
+ declare const SHADER_OVERLAY_PARAM_KEYS: readonly ShaderParamKey[];
1626
+ /** id로 프리셋 조회 (없으면 첫 프리셋 폴백). */
1627
+ declare function getShaderPreset(id: ShaderPresetId): ShaderPreset;
1628
+ /** 공유 프렐류드 + 프리셋 본문을 합친 완성 프래그먼트 셰이더 소스. */
1629
+ declare function getShaderFragment(preset: ShaderPreset): string;
1630
+
1631
+ /** `ShaderSurface` ref로 노출되는 명령형 핸들. */
1632
+ interface ShaderSurfaceHandle {
1633
+ /** 현재 프레임을 PNG data URL로 캡처. WebGL 미지원 시 null. */
1634
+ capture: () => string | null;
1635
+ }
1636
+ /**
1637
+ * 애니메이션 WebGL 셰이더 배경. 배경·카드 배경 등 장식용 서피스에 사용한다.
1638
+ * 프리셋 + 색/파라미터로 제어하며, 정지 프레임(`paused`)·캡처(ref)·우아한 폴백
1639
+ * (WebGL 미지원 시 CSS 그라디언트)을 지원한다.
1640
+ */
1641
+ interface ShaderSurfaceProps {
1642
+ /** 렌더할 셰이더 프리셋 id. */
1643
+ preset: ShaderPresetId;
1644
+ /** hex 색상 배열. 미지정 시 프리셋 기본 색. */
1645
+ colors?: string[];
1646
+ /** 패턴 스케일. 미지정 시 프리셋/전역 기본값. */
1647
+ scale?: number;
1648
+ /** 애니메이션 속도. */
1649
+ speed?: number;
1650
+ /** 왜곡 강도. */
1651
+ distortion?: number;
1652
+ /** 필름 그레인 양. */
1653
+ grain?: number;
1654
+ /** 하이라이트 대비. */
1655
+ contrast?: number;
1656
+ /** 회전 각도(도). */
1657
+ angle?: number;
1658
+ /** 전체 어둡게(가독성). 0~1. */
1659
+ dim?: number;
1660
+ /** 가장자리 비네트(가독성). 0~1. */
1661
+ vignette?: number;
1662
+ /** 하단 스크림 그라디언트(텍스트 가독성). 0~1. */
1663
+ scrim?: number;
1664
+ /** 포인터 반응(패럴랙스) 강도. 0~1. */
1665
+ interactive?: number;
1666
+ /**
1667
+ * 파라미터 일괄 오버라이드 맵. 명시적 prop이 우선하며, 프리셋 전용 파라미터
1668
+ * (bars/blur/peak/valley 등)는 이 맵으로 전달한다.
1669
+ */
1670
+ params?: Partial<Record<ShaderParamKey, number>>;
1671
+ /** paused일 때 렌더할 고정 시간(초). 미지정 시 기본 정지 프레임. */
1672
+ time?: number;
1673
+ /** true면 애니메이션 없이 단일 프레임만 렌더(카드 배경 등). */
1674
+ paused?: boolean;
1675
+ /** device pixel ratio 상한. 기본 min(devicePixelRatio, 2). */
1676
+ dpr?: number;
1677
+ /** 루트 요소 클래스. */
1678
+ className?: string;
1679
+ /** 루트 요소 인라인 스타일. */
1680
+ style?: CSSProperties;
1681
+ /** 접근성 트리에서 숨김. 장식용이라 기본 true. */
1682
+ "aria-hidden"?: boolean;
1683
+ }
1684
+ declare const ShaderSurface: react.ForwardRefExoticComponent<ShaderSurfaceProps & react.RefAttributes<ShaderSurfaceHandle>>;
1685
+
1686
+ export { ConditionBuilder as $, AccordionContent as A, Badge as B, Card as C, type DateRange as D, CardHeader as E, type CardHeaderProps as F, type CardProps as G, CardTitle as H, type IconDef as I, type CardTitleProps as J, Checkbox as K, CheckboxGroup as L, type CheckboxGroupProps as M, type CheckboxProps as N, CircularProgress as O, type CircularProgressProps as P, ColorPicker as Q, type ColorPickerProps as R, ComboboxEmpty as S, ComboboxGroup as T, ComboboxGroupLabel as U, ComboboxInput as V, ComboboxItem as W, ComboboxPopover as X, ComboboxRoot as Y, type ComparisonMode as Z, CompositeZone as _, AccordionItem as a, FormRemove as a$, type ConditionBuilderProps as a0, type ConditionDef as a1, type ConditionGroup as a2, type ConditionOperator as a3, type ConditionTypeRenderer as a4, Container as a5, type ContainerProps as a6, DEFAULT_PRESETS as a7, type DateGranularity as a8, DateRangePicker as a9, DropdownMenu as aA, DropdownSeparator as aB, DropdownTrigger as aC, EmptyState as aD, type EmptyStateAction as aE, type EmptyStateProps as aF, FormCheckbox as aG, FormColorPicker as aH, type FormColorPickerProps as aI, FormControl as aJ, FormDateRangePicker as aK, type FormDateRangePickerProps as aL, FormDescription as aM, FormError as aN, FormField as aO, FormGroup as aP, FormGroupLabel as aQ, FormIconPicker as aR, type FormIconPickerProps as aS, FormInput as aT, FormLabel as aU, FormNumberInput as aV, type FormNumberInputProps as aW, FormProvider as aX, FormPush as aY, FormRadio as aZ, FormRadioGroup as a_, type DateRangePickerProps as aa, type DateRangePreset as ab, DialogBody as ac, type DialogBodyProps as ad, DialogDescription as ae, DialogDisclosure as af, DialogDismiss as ag, DialogFooter as ah, type DialogFooterProps as ai, DialogHeader as aj, type DialogHeaderProps as ak, DialogHeading as al, DialogPanel as am, DialogRoot as an, type DialogSize as ao, DisclosureContent as ap, DisclosureRoot as aq, DisclosureTrigger as ar, DrawerClose as as, DrawerPanel as at, type DrawerPanelProps as au, DrawerRoot as av, type DrawerSide as aw, type DrawerSize as ax, DropdownContent as ay, DropdownItem as az, AccordionRoot as b, ResizablePanelGroup as b$, FormReset as b0, FormRoot as b1, FormSelect as b2, FormSelectItem as b3, FormSelectPopover as b4, type FormSelectProps as b5, FormSlider as b6, type FormSliderProps as b7, FormStarRating as b8, type FormStarRatingProps as b9, MenuTrigger as bA, MenubarContainer as bB, MenubarRoot as bC, Meter as bD, type MeterProps as bE, NumberInput as bF, type NumberInputProps as bG, OtpField as bH, type OtpFieldProps as bI, PageHeader as bJ, type PageHeaderProps as bK, Pagination as bL, type PaginationProps as bM, PopoverClose as bN, PopoverContent as bO, type PopoverContentProps as bP, PopoverRoot as bQ, PopoverTrigger as bR, Progress as bS, type ProgressProps as bT, Radio as bU, RadioGroup as bV, type RadioGroupProps as bW, type RadioProps as bX, ResizableHandle as bY, type ResizableHandleProps as bZ, ResizablePanel as b_, FormSubmit as ba, FormSwitch as bb, type FormSwitchProps as bc, FormTagInput as bd, type FormTagInputProps as be, FormTextarea as bf, type FormTextareaProps as bg, Heading as bh, type HeadingLevel as bi, type HeadingProps as bj, type HeadingRole as bk, IconPicker as bl, type IconPickerProps as bm, Input as bn, type InputProps as bo, Kbd as bp, type KbdProps as bq, Logo as br, type LogoProps as bs, MenuButtonArrow as bt, MenuItem as bu, MenuItemCheckbox as bv, MenuItemRadio as bw, MenuPopover as bx, MenuRoot as by, MenuSeparator as bz, AccordionTrigger as c, ToolbarContainer as c$, type ResizablePanelGroupProps as c0, type ResizablePanelProps as c1, SHADER_OVERLAY_PARAM_KEYS as c2, SHADER_PARAM_FALLBACK as c3, SHADER_PARAM_KEYS as c4, SHADER_PRESETS as c5, SHADER_PRESET_IDS as c6, ScrollArea as c7, type ScrollAreaProps as c8, Section as c9, StarRating as cA, type StarRatingProps as cB, StatCard as cC, type StatCardProps as cD, StepBuilder as cE, type StepBuilderProps as cF, type StepDef as cG, Switch as cH, type SwitchProps as cI, Tab as cJ, TabList as cK, TabPanel as cL, TabsRoot as cM, TagInput as cN, type TagInputProps as cO, Text as cP, type TextElement as cQ, type TextProps as cR, type TextRole as cS, type TextTone as cT, Textarea as cU, type TextareaProps as cV, Toggle as cW, ToggleGroup as cX, type ToggleGroupProps as cY, type ToggleProps as cZ, ToolbarButton as c_, type SectionProps as ca, SelectItem as cb, SelectLabel as cc, SelectPopover as cd, SelectRoot as ce, SelectTrigger as cf, Separator as cg, type SeparatorProps as ch, type ShaderParamKey as ci, type ShaderParamSpec as cj, type ShaderPreset as ck, type ShaderPresetCategory as cl, type ShaderPresetId as cm, ShaderSurface as cn, type ShaderSurfaceHandle as co, type ShaderSurfaceProps as cp, Skeleton as cq, SkeletonAvatar as cr, SkeletonCard as cs, type SkeletonProps as ct, SkeletonTable as cu, SkeletonText as cv, Slider as cw, type SliderProps as cx, Spinner as cy, type SpinnerProps as cz, Alert as d, ToolbarRoot as d0, ToolbarSeparator as d1, Tooltip as d2, TooltipAnchor as d3, TooltipProvider as d4, VirtualList as d5, type VirtualListProps as d6, createBlock as d7, getShaderFragment as d8, getShaderPreset as d9, AlertDialogPanel as e, type AlertDialogPanelProps as f, type AlertProps as g, Avatar as h, AvatarGroup as i, type AvatarGroupProps as j, type AvatarProps as k, type BadgeProps as l, type BlockBaseProps as m, BlockLayout as n, type BlockLayoutProps as o, Breadcrumb as p, type BreadcrumbItem as q, type BreadcrumbProps as r, Button as s, type ButtonProps as t, CardContent as u, type CardContentProps as v, CardDescription as w, type CardDescriptionProps as x, CardFooter as y, type CardFooterProps as z };