@arcfusionz/arc-primitive-ui 0.1.0 → 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/AILoader/AILoader.d.ts +32 -0
- package/dist/components/AILoader/AILoader.js +157 -0
- package/dist/components/AILoader/index.d.ts +2 -0
- package/dist/components/AILoader/index.js +2 -0
- package/dist/components/Accordion/Accordion.d.ts +96 -0
- package/dist/components/Accordion/Accordion.js +149 -0
- package/dist/components/Accordion/index.d.ts +2 -0
- package/dist/components/Accordion/index.js +2 -0
- package/dist/components/Avatar/Avatar.d.ts +152 -0
- package/dist/components/Avatar/Avatar.js +216 -0
- package/dist/components/Avatar/index.d.ts +2 -0
- package/dist/components/Avatar/index.js +2 -0
- package/dist/components/Badge/Badge.d.ts +87 -0
- package/dist/components/Badge/Badge.js +118 -0
- package/dist/components/Badge/index.d.ts +2 -0
- package/dist/components/Badge/index.js +2 -0
- package/dist/components/Breadcrumb/Breadcrumb.d.ts +109 -0
- package/dist/components/Breadcrumb/Breadcrumb.js +182 -0
- package/dist/components/Breadcrumb/index.d.ts +2 -0
- package/dist/components/Breadcrumb/index.js +2 -0
- package/dist/components/Button/Button.d.ts +57 -0
- package/dist/components/Button/Button.js +177 -0
- package/dist/components/Button/index.d.ts +2 -0
- package/dist/components/Button/index.js +2 -0
- package/dist/components/Calendar/Calendar.d.ts +140 -0
- package/dist/components/Calendar/Calendar.js +468 -0
- package/dist/components/Calendar/index.d.ts +2 -0
- package/dist/components/Calendar/index.js +2 -0
- package/dist/components/Checkbox/Checkbox.d.ts +60 -0
- package/dist/components/Checkbox/Checkbox.js +129 -0
- package/dist/components/Checkbox/index.d.ts +2 -0
- package/dist/components/Checkbox/index.js +2 -0
- package/dist/components/Combobox/Combobox.d.ts +251 -0
- package/dist/components/Combobox/Combobox.js +354 -0
- package/dist/components/Combobox/index.d.ts +2 -0
- package/dist/components/Combobox/index.js +2 -0
- package/dist/components/ContextMenu/ContextMenu.d.ts +129 -0
- package/dist/components/ContextMenu/ContextMenu.js +93 -0
- package/dist/components/ContextMenu/index.d.ts +2 -0
- package/dist/components/ContextMenu/index.js +2 -0
- package/dist/components/DatePicker/DatePicker.d.ts +109 -0
- package/dist/components/DatePicker/DatePicker.js +145 -0
- package/dist/components/DatePicker/index.d.ts +2 -0
- package/dist/components/DatePicker/index.js +2 -0
- package/dist/components/DateRangePicker/DateRangePicker.d.ts +107 -0
- package/dist/components/DateRangePicker/DateRangePicker.js +161 -0
- package/dist/components/DateRangePicker/index.d.ts +2 -0
- package/dist/components/DateRangePicker/index.js +2 -0
- package/dist/components/Dialog/Dialog.d.ts +112 -0
- package/dist/components/Dialog/Dialog.js +141 -0
- package/dist/components/Dialog/index.d.ts +2 -0
- package/dist/components/Dialog/index.js +2 -0
- package/dist/components/Drawer/Drawer.d.ts +188 -0
- package/dist/components/Drawer/Drawer.js +268 -0
- package/dist/components/Drawer/index.d.ts +2 -0
- package/dist/components/Drawer/index.js +2 -0
- package/dist/components/Field/Field.d.ts +123 -0
- package/dist/components/Field/Field.js +241 -0
- package/dist/components/Field/FieldContext.d.ts +43 -0
- package/dist/components/Field/FieldContext.js +28 -0
- package/dist/components/Field/index.d.ts +3 -0
- package/dist/components/Field/index.js +3 -0
- package/dist/components/Fieldset/Fieldset.d.ts +43 -0
- package/dist/components/Fieldset/Fieldset.js +48 -0
- package/dist/components/Fieldset/index.d.ts +2 -0
- package/dist/components/Fieldset/index.js +2 -0
- package/dist/components/Form/Form.d.ts +54 -0
- package/dist/components/Form/Form.js +57 -0
- package/dist/components/Form/index.d.ts +2 -0
- package/dist/components/Form/index.js +2 -0
- package/dist/components/Input/Input.d.ts +64 -0
- package/dist/components/Input/Input.js +111 -0
- package/dist/components/Input/index.d.ts +2 -0
- package/dist/components/Input/index.js +2 -0
- package/dist/components/Menu/Menu.d.ts +212 -0
- package/dist/components/Menu/Menu.js +255 -0
- package/dist/components/Menu/index.d.ts +2 -0
- package/dist/components/Menu/index.js +2 -0
- package/dist/components/Popover/Popover.d.ts +122 -0
- package/dist/components/Popover/Popover.js +116 -0
- package/dist/components/Popover/index.d.ts +2 -0
- package/dist/components/Popover/index.js +2 -0
- package/dist/components/Progress/Progress.d.ts +87 -0
- package/dist/components/Progress/Progress.js +73 -0
- package/dist/components/Progress/index.d.ts +2 -0
- package/dist/components/Progress/index.js +2 -0
- package/dist/components/Radio/Radio.d.ts +65 -0
- package/dist/components/Radio/Radio.js +93 -0
- package/dist/components/Radio/index.d.ts +2 -0
- package/dist/components/Radio/index.js +2 -0
- package/dist/components/Select/Select.d.ts +136 -0
- package/dist/components/Select/Select.js +219 -0
- package/dist/components/Select/index.d.ts +2 -0
- package/dist/components/Select/index.js +2 -0
- package/dist/components/Skeleton/Skeleton.d.ts +39 -0
- package/dist/components/Skeleton/Skeleton.js +44 -0
- package/dist/components/Skeleton/index.d.ts +2 -0
- package/dist/components/Skeleton/index.js +2 -0
- package/dist/components/Stepper/Stepper.d.ts +161 -0
- package/dist/components/Stepper/Stepper.js +344 -0
- package/dist/components/Stepper/index.d.ts +2 -0
- package/dist/components/Stepper/index.js +2 -0
- package/dist/components/Switch/Switch.d.ts +56 -0
- package/dist/components/Switch/Switch.js +87 -0
- package/dist/components/Switch/index.d.ts +2 -0
- package/dist/components/Switch/index.js +2 -0
- package/dist/components/Table/Table.d.ts +116 -0
- package/dist/components/Table/Table.js +143 -0
- package/dist/components/Table/index.d.ts +2 -0
- package/dist/components/Table/index.js +2 -0
- package/dist/components/Tabs/Tabs.d.ts +116 -0
- package/dist/components/Tabs/Tabs.js +158 -0
- package/dist/components/Tabs/index.d.ts +2 -0
- package/dist/components/Tabs/index.js +2 -0
- package/dist/components/Timeline/Timeline.d.ts +137 -0
- package/dist/components/Timeline/Timeline.js +243 -0
- package/dist/components/Timeline/index.d.ts +2 -0
- package/dist/components/Timeline/index.js +2 -0
- package/dist/components/Toast/Toast.d.ts +135 -0
- package/dist/components/Toast/Toast.js +314 -0
- package/dist/components/Toast/index.d.ts +2 -0
- package/dist/components/Toast/index.js +2 -0
- package/dist/components/Tooltip/Tooltip.d.ts +104 -0
- package/dist/components/Tooltip/Tooltip.js +95 -0
- package/dist/components/Tooltip/index.d.ts +2 -0
- package/dist/components/Tooltip/index.js +2 -0
- package/dist/components/Typography/Typography.d.ts +38 -0
- package/dist/components/Typography/Typography.js +53 -0
- package/dist/components/Typography/index.d.ts +2 -0
- package/dist/components/Typography/index.js +2 -0
- package/dist/index.d.ts +66 -3398
- package/dist/index.js +34 -5343
- package/dist/lib/cn.d.ts +6 -0
- package/dist/lib/cn.js +9 -0
- package/package.json +6 -2
package/dist/index.d.ts
CHANGED
|
@@ -1,3399 +1,67 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
import {
|
|
4
|
-
import
|
|
5
|
-
import { Avatar
|
|
6
|
-
import
|
|
7
|
-
import {
|
|
8
|
-
import
|
|
9
|
-
import {
|
|
10
|
-
import
|
|
11
|
-
import {
|
|
12
|
-
import
|
|
13
|
-
import {
|
|
14
|
-
import
|
|
15
|
-
import {
|
|
16
|
-
import
|
|
17
|
-
import {
|
|
18
|
-
import
|
|
19
|
-
import {
|
|
20
|
-
import
|
|
21
|
-
import {
|
|
22
|
-
import {
|
|
23
|
-
import
|
|
24
|
-
import {
|
|
25
|
-
import
|
|
26
|
-
import {
|
|
27
|
-
import
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
interface AccordionItemProps extends Omit<ComponentPropsWithoutRef<typeof Accordion$1.Item>, "className" | "value"> {
|
|
68
|
-
/**
|
|
69
|
-
* Identifies the item in the root's `value`/`defaultValue` arrays.
|
|
70
|
-
* Auto-generated when omitted (fine for purely uncontrolled use).
|
|
71
|
-
*/
|
|
72
|
-
value?: string;
|
|
73
|
-
className?: string;
|
|
74
|
-
}
|
|
75
|
-
/**
|
|
76
|
-
* One disclosure section: a header/trigger pair plus its panel. Give it a
|
|
77
|
-
* `value` to control or pre-open it; omit the value and Base UI generates one.
|
|
78
|
-
*/
|
|
79
|
-
declare const AccordionItem: import("react").ForwardRefExoticComponent<AccordionItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
80
|
-
interface AccordionHeaderProps extends Omit<ComponentPropsWithoutRef<typeof Accordion$1.Header>, "className"> {
|
|
81
|
-
className?: string;
|
|
82
|
-
}
|
|
83
|
-
/**
|
|
84
|
-
* The heading that labels a panel — an `<h3>` by default. Pick the level
|
|
85
|
-
* from the surrounding document outline via `render`, e.g.
|
|
86
|
-
* `<AccordionHeader render={<h4 />}>`; the visual style lives on the trigger
|
|
87
|
-
* either way.
|
|
88
|
-
*/
|
|
89
|
-
declare const AccordionHeader: import("react").ForwardRefExoticComponent<AccordionHeaderProps & import("react").RefAttributes<HTMLHeadingElement>>;
|
|
90
|
-
interface AccordionTriggerProps extends Omit<ComponentPropsWithoutRef<typeof Accordion$1.Trigger>, "className"> {
|
|
91
|
-
/**
|
|
92
|
-
* Replace the default chevron; pass `null` to render no indicator. The
|
|
93
|
-
* default chevron rotates 180° while open — a custom icon styles its own
|
|
94
|
-
* open state off the trigger's `group`, e.g.
|
|
95
|
-
* `className="motion-safe:transition-transform group-data-panel-open:rotate-45"`.
|
|
96
|
-
*/
|
|
97
|
-
icon?: ReactNode;
|
|
98
|
-
className?: string;
|
|
99
|
-
}
|
|
100
|
-
/**
|
|
101
|
-
* The full-width button that toggles its panel. Label and icon are one
|
|
102
|
-
* target (never split them); long labels wrap.
|
|
103
|
-
*/
|
|
104
|
-
declare const AccordionTrigger: import("react").ForwardRefExoticComponent<AccordionTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
105
|
-
interface AccordionPanelProps extends Omit<ComponentPropsWithoutRef<typeof Accordion$1.Panel>, "className"> {
|
|
106
|
-
/**
|
|
107
|
-
* Applied to the content block inside the animated panel — the panel
|
|
108
|
-
* element itself must keep zero padding and `overflow-hidden` for the
|
|
109
|
-
* height transition to measure cleanly (customize it via `render`).
|
|
110
|
-
*/
|
|
111
|
-
className?: string;
|
|
112
|
-
}
|
|
113
|
-
/**
|
|
114
|
-
* The collapsible content region. Height animates via Base UI's
|
|
115
|
-
* `--accordion-panel-height` behind `motion-safe:`; with reduced motion it
|
|
116
|
-
* snaps open. Set `hiddenUntilFound` (here or on the root) so browser
|
|
117
|
-
* find-in-page can reveal closed panels.
|
|
118
|
-
*/
|
|
119
|
-
declare const AccordionPanel: import("react").ForwardRefExoticComponent<AccordionPanelProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
120
|
-
//#endregion
|
|
121
|
-
//#region src/components/AILoader/AILoader.d.ts
|
|
122
|
-
type AILoaderState = "default" | "processing";
|
|
123
|
-
type AILoaderSize = "sm" | "md" | "lg";
|
|
124
|
-
type AILoaderTone = "brand" | "current";
|
|
125
|
-
interface AILoaderRenderState extends Record<string, unknown> {
|
|
126
|
-
/** Current visual and semantic state. */
|
|
127
|
-
state: AILoaderState;
|
|
128
|
-
/** Whether the indicator represents active work. */
|
|
129
|
-
processing: boolean;
|
|
130
|
-
}
|
|
131
|
-
interface AILoaderBaseProps extends Omit<ComponentPropsWithoutRef<"span">, "children" | "className"> {
|
|
132
|
-
/** Ambient AI motion or a rotating indeterminate processing indicator. */
|
|
133
|
-
state?: AILoaderState;
|
|
134
|
-
/** Visual scale: `sm` uses a 16px mark/12px plain text, `md` 24px/14px, and `lg` 32px/16px. This is non-interactive, so no target-size floor applies. */
|
|
135
|
-
size?: AILoaderSize;
|
|
136
|
-
/** `brand` uses info → primary → hero at rest and primary blue while processing; `current` inherits the surrounding text color. Processing uses `currentColor`, so text-color utilities or `style.color` can override either tone. */
|
|
137
|
-
tone?: AILoaderTone;
|
|
138
|
-
/** Optional visible status content beside the mark. Accepts plain text or an inline node such as `<Typography as="span">`; processing adds a reduced-motion-safe shimmer. */
|
|
139
|
-
text?: ReactNode;
|
|
140
|
-
/** Accessible label. Defaults to a string `text` value when present, otherwise “AI” at rest and “Processing” while active. When `text` is JSX, set this to override its readable content. */
|
|
141
|
-
label?: string;
|
|
142
|
-
/** Replace the rendered `span` or inspect `{ state, processing }` in a render callback. */
|
|
143
|
-
render?: useRender.RenderProp<AILoaderRenderState>;
|
|
144
|
-
/** Additional classes merged after the component's layout and spacing classes. */
|
|
145
|
-
className?: string;
|
|
146
|
-
}
|
|
147
|
-
type AILoaderProps = AILoaderBaseProps;
|
|
148
|
-
declare const AILoader: import("react").ForwardRefExoticComponent<AILoaderBaseProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
149
|
-
//#endregion
|
|
150
|
-
//#region src/components/Avatar/Avatar.d.ts
|
|
151
|
-
type AvatarSize = "xs" | "sm" | "md" | "lg" | "xl";
|
|
152
|
-
type AvatarShape = "circle" | "square";
|
|
153
|
-
interface AvatarVariantsOptions {
|
|
154
|
-
size?: AvatarSize;
|
|
155
|
-
shape?: AvatarShape;
|
|
156
|
-
className?: string;
|
|
157
|
-
}
|
|
158
|
-
/**
|
|
159
|
-
* Class list for an element styled as an Avatar box.
|
|
160
|
-
*
|
|
161
|
-
* Use it when the box must stay a foreign element — e.g. a plain anchor
|
|
162
|
-
* around a raw `<img>`, or a static placeholder — so it still matches
|
|
163
|
-
* real avatars in size, shape and fill:
|
|
164
|
-
*
|
|
165
|
-
* <a href="/profile" className={avatarVariants({ size: "sm" })}>
|
|
166
|
-
* <img src={photo} alt="Open profile" className="size-full rounded-[inherit] object-cover" />
|
|
167
|
-
* </a>
|
|
168
|
-
*/
|
|
169
|
-
declare function avatarVariants({ size, shape, className }?: AvatarVariantsOptions): string;
|
|
170
|
-
interface AvatarProps extends Omit<ComponentPropsWithoutRef<typeof Avatar$1.Root>, "className"> {
|
|
171
|
-
/**
|
|
172
|
-
* Box size: `xs` 24px · `sm` 32px · `md` 40px · `lg` 48px · `xl` 64px.
|
|
173
|
-
* Defaults to the enclosing `AvatarGroup`'s size, then `md`. Avatars are
|
|
174
|
-
* non-interactive by default; one made clickable via `render` should use
|
|
175
|
-
* `sm`+ to clear the WCAG 2.5.8 24px target-size floor with room to spare.
|
|
176
|
-
*/
|
|
177
|
-
size?: AvatarSize;
|
|
178
|
-
/** `circle` for people (default), `square` (6px radius) for entities like teams, orgs, or apps. Defaults to the enclosing `AvatarGroup`'s shape. */
|
|
179
|
-
shape?: AvatarShape;
|
|
180
|
-
/** Image URL. While it loads — and if it fails — the fallback shows instead. */
|
|
181
|
-
src?: string;
|
|
182
|
-
/**
|
|
183
|
-
* Alt text for the image. Defaults to `""` (decorative) because avatars
|
|
184
|
-
* usually sit next to the visible name. For a standalone avatar put the
|
|
185
|
-
* name on the root via `aria-label` instead — it also covers the fallback,
|
|
186
|
-
* which `alt` cannot.
|
|
187
|
-
*/
|
|
188
|
-
alt?: string;
|
|
189
|
-
/**
|
|
190
|
-
* Person or entity name used to derive the fallback initials (first letter
|
|
191
|
-
* of the first and last words). Used for initials only — pass `aria-label`
|
|
192
|
-
* when the avatar must be announced.
|
|
193
|
-
*/
|
|
194
|
-
name?: string;
|
|
195
|
-
/** Custom fallback content (e.g. an org icon), replacing the derived initials / person icon. */
|
|
196
|
-
fallback?: ReactNode;
|
|
197
|
-
/**
|
|
198
|
-
* Milliseconds to wait before showing the fallback, avoiding a flash of
|
|
199
|
-
* initials when images load fast. Only applied while `src` is set — the
|
|
200
|
-
* muted box shows in the meantime. Without `src` the fallback is immediate.
|
|
201
|
-
*/
|
|
202
|
-
fallbackDelay?: number;
|
|
203
|
-
className?: string;
|
|
204
|
-
}
|
|
205
|
-
/**
|
|
206
|
-
* Profile picture with automatic fallback, built on Base UI's Avatar.
|
|
207
|
-
*
|
|
208
|
-
* Shorthand props (`src`, `alt`, `name`, `fallback`, `fallbackDelay`) render
|
|
209
|
-
* the image and fallback parts internally; `children` render after them, so
|
|
210
|
-
* an `AvatarBadge` composes on top of the shorthand. When only `children`
|
|
211
|
-
* are passed the root renders them alone — full manual composition with
|
|
212
|
-
* `AvatarImage` / `AvatarFallback` (don't mix that with the shorthand props,
|
|
213
|
-
* or two fallbacks render).
|
|
214
|
-
*
|
|
215
|
-
* Decorative by default. When it stands alone, pass `aria-label` — the root
|
|
216
|
-
* then gets `role="img"` and its internals are hidden from assistive
|
|
217
|
-
* technology, whether the image or the fallback is showing.
|
|
218
|
-
*/
|
|
219
|
-
declare const Avatar: import("react").ForwardRefExoticComponent<AvatarProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
220
|
-
interface AvatarImageProps extends Omit<ComponentPropsWithoutRef<typeof Avatar$1.Image>, "className"> {
|
|
221
|
-
className?: string;
|
|
222
|
-
}
|
|
223
|
-
/**
|
|
224
|
-
* The avatar photo, cropped to fill the box. Base UI keeps it unmounted
|
|
225
|
-
* until the file has actually loaded (the fallback shows meanwhile), then it
|
|
226
|
-
* fades in motion-safe. Defaults to `alt=""` — see `Avatar`'s `alt` docs.
|
|
227
|
-
* `onLoadingStatusChange` reports `idle → loading → loaded | error`.
|
|
228
|
-
*/
|
|
229
|
-
declare const AvatarImage: import("react").ForwardRefExoticComponent<AvatarImageProps & import("react").RefAttributes<HTMLImageElement>>;
|
|
230
|
-
interface AvatarFallbackProps extends Omit<ComponentPropsWithoutRef<typeof Avatar$1.Fallback>, "className"> {
|
|
231
|
-
className?: string;
|
|
232
|
-
}
|
|
233
|
-
/**
|
|
234
|
-
* Shown while there is no loaded image: initials, an icon, or any content.
|
|
235
|
-
* Fills the box and inherits the root's muted fill and text styling — set
|
|
236
|
-
* colors via `className` on the root (or here) as a pair, e.g.
|
|
237
|
-
* `bg-primary-100 text-primary-800`. Base UI's `delay` prop postpones it to
|
|
238
|
-
* avoid a flash on fast image loads; only set a delay when an `AvatarImage`
|
|
239
|
-
* sibling exists, otherwise the box just sits empty for that long.
|
|
240
|
-
*/
|
|
241
|
-
declare const AvatarFallback: import("react").ForwardRefExoticComponent<AvatarFallbackProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
242
|
-
interface AvatarBadgeProps extends Omit<ComponentPropsWithoutRef<"span">, "className"> {
|
|
243
|
-
/**
|
|
244
|
-
* Screen-reader text for the state the badge conveys (e.g. "Online").
|
|
245
|
-
* Color alone must not carry meaning (WCAG 1.4.1) — always pass this when
|
|
246
|
-
* the badge is more than decoration.
|
|
247
|
-
*/
|
|
248
|
-
label?: string;
|
|
249
|
-
/** Replace the rendered `span`, e.g. `render={<a href="…" />}`. */
|
|
250
|
-
render?: useRender.RenderProp;
|
|
251
|
-
className?: string;
|
|
252
|
-
}
|
|
253
|
-
/**
|
|
254
|
-
* Corner indicator anchored to the avatar's bottom-right rim, scaled to the
|
|
255
|
-
* avatar's size, with a background-colored ring separating it from the
|
|
256
|
-
* photo. Defaults to the success fill (presence "online"); recolor via
|
|
257
|
-
* `className` — `bg-warning` away, `bg-destructive` busy, `bg-slate-400`
|
|
258
|
-
* offline — and match the ring to the page surface with `ring-*` when the
|
|
259
|
-
* avatar sits on a non-background fill. Compose inside `<Avatar>`, after the
|
|
260
|
-
* shorthand props or parts.
|
|
261
|
-
*/
|
|
262
|
-
declare const AvatarBadge: import("react").ForwardRefExoticComponent<AvatarBadgeProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
263
|
-
interface AvatarGroupProps extends Omit<ComponentPropsWithoutRef<"div">, "className"> {
|
|
264
|
-
/** Size applied to every member avatar (and the overlap distance). Members can still override it. */
|
|
265
|
-
size?: AvatarSize;
|
|
266
|
-
/** Shape applied to every member avatar. Members can still override it. */
|
|
267
|
-
shape?: AvatarShape;
|
|
268
|
-
/**
|
|
269
|
-
* Maximum boxes to render, counting the overflow chip: with 6 children and
|
|
270
|
-
* `max={4}`, 3 avatars and a "+3" chip show. Values below 2 are treated
|
|
271
|
-
* as 2. Omit to render every child.
|
|
272
|
-
*/
|
|
273
|
-
max?: number;
|
|
274
|
-
/**
|
|
275
|
-
* Total member count when the children are only a page of the real list —
|
|
276
|
-
* e.g. 4 fetched collaborators of 12 → `total={12}` renders "+9" after
|
|
277
|
-
* `max` is applied. Defaults to the number of children.
|
|
278
|
-
*/
|
|
279
|
-
total?: number;
|
|
280
|
-
/** Replace the rendered `div`, e.g. `render={<ul />}` with `<li>`-wrapped avatars. */
|
|
281
|
-
render?: useRender.RenderProp;
|
|
282
|
-
className?: string;
|
|
283
|
-
}
|
|
284
|
-
/**
|
|
285
|
-
* Overlapping stack of avatars ("facepile") with an optional "+N" overflow
|
|
286
|
-
* chip. Members inherit the group's `size`/`shape` and get a
|
|
287
|
-
* background-colored separator ring; later members overlap earlier ones
|
|
288
|
-
* (DOM order). For a custom overflow control — different text, or a chip
|
|
289
|
-
* that opens the full member list — omit `max` and append your own child,
|
|
290
|
-
* e.g. `<Avatar render={<button aria-label="Show all 12 members" />}>+9</Avatar>`.
|
|
291
|
-
* The ring assumes the group sits on `background` — on another surface,
|
|
292
|
-
* override per member (`className="ring-surface"`). Purely visual grouping:
|
|
293
|
-
* give the group an `aria-label` (e.g. "Contributors") when the stack is
|
|
294
|
-
* meaningful, and name each member if avatars are individually meaningful.
|
|
295
|
-
*/
|
|
296
|
-
declare const AvatarGroup: import("react").ForwardRefExoticComponent<AvatarGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
297
|
-
//#endregion
|
|
298
|
-
//#region src/components/Badge/Badge.d.ts
|
|
299
|
-
type BadgeVariant = "neutral" | "primary" | "success" | "warning" | "destructive";
|
|
300
|
-
type BadgeAppearance = "solid" | "soft" | "outline";
|
|
301
|
-
type BadgeSize = "sm" | "md" | "lg";
|
|
302
|
-
interface BadgeVariantsOptions {
|
|
303
|
-
variant?: BadgeVariant;
|
|
304
|
-
appearance?: BadgeAppearance;
|
|
305
|
-
size?: BadgeSize;
|
|
306
|
-
pill?: boolean;
|
|
307
|
-
className?: string;
|
|
308
|
-
}
|
|
309
|
-
/**
|
|
310
|
-
* Class list for an element styled as a Badge.
|
|
311
|
-
*
|
|
312
|
-
* Use it to style a plain anchor as a clickable badge while keeping link
|
|
313
|
-
* semantics (alternatively pass `render={<a href … />}` to `Badge` itself —
|
|
314
|
-
* badges carry no role, so both are sound):
|
|
315
|
-
*
|
|
316
|
-
* <a href="/releases" className={badgeVariants({ variant: "primary" })}>v2.0</a>
|
|
317
|
-
*/
|
|
318
|
-
declare function badgeVariants({ variant, appearance, size, pill, className }?: BadgeVariantsOptions): string;
|
|
319
|
-
interface BadgeBaseProps extends Omit<ComponentPropsWithoutRef<"span">, "className" | "children"> {
|
|
320
|
-
/**
|
|
321
|
-
* Semantic intent. Drives the hue in every appearance. For informational
|
|
322
|
-
* statuses use `primary` — the palette's `info` alias shares the primary
|
|
323
|
-
* ramp, so a separate variant would render identically.
|
|
324
|
-
*/
|
|
325
|
-
variant?: BadgeVariant;
|
|
326
|
-
/** Emphasis level: `solid` fill, `soft` tint (default), or `outline`. */
|
|
327
|
-
appearance?: BadgeAppearance;
|
|
328
|
-
/** Badge height: `sm` 20px · `md` 24px · `lg` 28px. The badge body is non-interactive; the delete button expands its hit area to the WCAG 2.5.8 24px floor. If the badge is made clickable via `render`, provide enough surrounding spacing to reach 24px. */
|
|
329
|
-
size?: BadgeSize;
|
|
330
|
-
/** Fully rounded shape for tags and counts. min-width equals the height, so single-digit counts stay compact and centered. */
|
|
331
|
-
pill?: boolean;
|
|
332
|
-
/** Badge label; icons ride along as children and inherit sizing. Standalone dots omit children. */
|
|
333
|
-
children?: ReactNode;
|
|
334
|
-
/**
|
|
335
|
-
* Leading status dot (color inherits the label). Per WCAG 1.4.1 the dot
|
|
336
|
-
* alone must not carry meaning — keep a visible label where state matters.
|
|
337
|
-
* Without `children` the badge collapses to a bare circular indicator.
|
|
338
|
-
*/
|
|
339
|
-
dot?: boolean;
|
|
340
|
-
/** Called when the trailing delete button is activated with pointer, Enter, or Space. Requires `deleteLabel`. */
|
|
341
|
-
onDelete?: NonNullable<ComponentPropsWithoutRef<typeof Button$1>["onClick"]>;
|
|
342
|
-
/** Accessible name for the delete button, e.g. `Remove React filter`. Required when `onDelete` is set. */
|
|
343
|
-
deleteLabel?: string;
|
|
344
|
-
/** Decorative replacement for the default close icon. Only rendered when `onDelete` is set. */
|
|
345
|
-
deleteIcon?: ReactNode;
|
|
346
|
-
/** Replace the rendered `span`, e.g. `render={<a href="…" />}` for a clickable badge. Unavailable when `onDelete` is set, so interactive elements are never nested. */
|
|
347
|
-
render?: useRender.RenderProp;
|
|
348
|
-
/** Additional classes merged after the badge's variant classes. */
|
|
349
|
-
className?: string;
|
|
350
|
-
}
|
|
351
|
-
/** A badge with no visible label is a bare dot, so an accessible name is required. */
|
|
352
|
-
type BadgeContentProps = {
|
|
353
|
-
children: ReactNode;
|
|
354
|
-
} | {
|
|
355
|
-
children?: never;
|
|
356
|
-
dot: true;
|
|
357
|
-
"aria-label": string;
|
|
358
|
-
} | {
|
|
359
|
-
children?: never;
|
|
360
|
-
dot: true;
|
|
361
|
-
"aria-labelledby": string;
|
|
362
|
-
};
|
|
363
|
-
/** A static badge may use `render` for semantic composition, including links. */
|
|
364
|
-
type BadgeStaticProps = BadgeContentProps & {
|
|
365
|
-
render?: useRender.RenderProp;
|
|
366
|
-
onDelete?: never;
|
|
367
|
-
deleteLabel?: never;
|
|
368
|
-
deleteIcon?: never;
|
|
369
|
-
};
|
|
370
|
-
/** Deletable badges need visible content and a unique name for their delete button. */
|
|
371
|
-
type BadgeDeletableProps = {
|
|
372
|
-
children: ReactNode;
|
|
373
|
-
onDelete: NonNullable<ComponentPropsWithoutRef<typeof Button$1>["onClick"]>;
|
|
374
|
-
deleteLabel: string;
|
|
375
|
-
deleteIcon?: ReactNode;
|
|
376
|
-
render?: never;
|
|
377
|
-
};
|
|
378
|
-
type BadgeProps = BadgeBaseProps & (BadgeStaticProps | BadgeDeletableProps);
|
|
379
|
-
declare const Badge: import("react").ForwardRefExoticComponent<BadgeProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
380
|
-
//#endregion
|
|
381
|
-
//#region src/components/Breadcrumb/Breadcrumb.d.ts
|
|
382
|
-
interface BreadcrumbProps extends Omit<ComponentPropsWithoutRef<"nav">, "className"> {
|
|
383
|
-
/** Replace the rendered `nav`. Preserve the navigation landmark so screen-reader users can jump to the trail. */
|
|
384
|
-
render?: useRender.RenderProp;
|
|
385
|
-
/** Additional classes merged after the root recipe. */
|
|
386
|
-
className?: string;
|
|
387
|
-
}
|
|
388
|
-
/**
|
|
389
|
-
* Navigation landmark that holds the trail. It defaults to
|
|
390
|
-
* `aria-label="Breadcrumb"`; pass a localized `aria-label` (or
|
|
391
|
-
* `aria-labelledby`) when the page language isn't English.
|
|
392
|
-
*/
|
|
393
|
-
declare const Breadcrumb: import("react").ForwardRefExoticComponent<BreadcrumbProps & import("react").RefAttributes<HTMLElement>>;
|
|
394
|
-
interface BreadcrumbListProps extends Omit<ComponentPropsWithoutRef<"ol">, "className"> {
|
|
395
|
-
/** Replace the rendered `ol`. Preserve list semantics so assistive technology announces the trail length. */
|
|
396
|
-
render?: useRender.RenderProp;
|
|
397
|
-
/** Additional classes merged after the list recipe, e.g. `text-xs` for a denser trail. */
|
|
398
|
-
className?: string;
|
|
399
|
-
}
|
|
400
|
-
/**
|
|
401
|
-
* Ordered list of crumbs. It wraps onto new lines on narrow viewports; cap
|
|
402
|
-
* individual crumbs with a truncation `className` instead of letting the
|
|
403
|
-
* whole trail overflow.
|
|
404
|
-
*/
|
|
405
|
-
declare const BreadcrumbList: import("react").ForwardRefExoticComponent<BreadcrumbListProps & import("react").RefAttributes<HTMLOListElement>>;
|
|
406
|
-
interface BreadcrumbItemProps extends Omit<ComponentPropsWithoutRef<"li">, "className"> {
|
|
407
|
-
/** Replace the rendered `li`. Preserve list-item semantics. */
|
|
408
|
-
render?: useRender.RenderProp;
|
|
409
|
-
/** Additional classes merged after the item recipe. */
|
|
410
|
-
className?: string;
|
|
411
|
-
}
|
|
412
|
-
/** One entry in the trail: wraps a link, the current page, or a composed control. */
|
|
413
|
-
declare const BreadcrumbItem: import("react").ForwardRefExoticComponent<BreadcrumbItemProps & import("react").RefAttributes<HTMLLIElement>>;
|
|
414
|
-
interface BreadcrumbLinkVariantsOptions {
|
|
415
|
-
className?: string;
|
|
416
|
-
}
|
|
417
|
-
/**
|
|
418
|
-
* Class list for an element styled as a breadcrumb link.
|
|
419
|
-
*
|
|
420
|
-
* Use it to give non-anchor crumbs the same resting/hover/focus treatment —
|
|
421
|
-
* e.g. a Menu trigger button that reveals collapsed levels:
|
|
422
|
-
*
|
|
423
|
-
* <MenuTrigger
|
|
424
|
-
* render={<button aria-label="Show hidden levels" className={breadcrumbLinkVariants()} />}
|
|
425
|
-
* >
|
|
426
|
-
* <BreadcrumbEllipsis />
|
|
427
|
-
* </MenuTrigger>
|
|
428
|
-
*/
|
|
429
|
-
declare function breadcrumbLinkVariants({ className }?: BreadcrumbLinkVariantsOptions): string;
|
|
430
|
-
interface BreadcrumbLinkProps extends Omit<ComponentPropsWithoutRef<"a">, "className"> {
|
|
431
|
-
/** Replace the rendered `a`, e.g. `render={<Link to="…" />}` for a client-side router. Keep it a real link so open-in-new-tab and copy-link work. */
|
|
432
|
-
render?: useRender.RenderProp;
|
|
433
|
-
/** Additional classes merged after the link recipe, e.g. `block max-w-40 truncate` to cap a long crumb. */
|
|
434
|
-
className?: string;
|
|
435
|
-
}
|
|
436
|
-
/**
|
|
437
|
-
* Ancestor link in the trail. Inline text links are exempt from the WCAG
|
|
438
|
-
* 2.5.8 target-size floor, but keep the list's default gap so adjacent
|
|
439
|
-
* targets stay distinguishable on touch screens. For the APG variant where
|
|
440
|
-
* the current page stays a link, add `aria-current="page"` — the recipe
|
|
441
|
-
* restyles it to match `BreadcrumbPage`.
|
|
442
|
-
*/
|
|
443
|
-
declare const BreadcrumbLink: import("react").ForwardRefExoticComponent<BreadcrumbLinkProps & import("react").RefAttributes<HTMLAnchorElement>>;
|
|
444
|
-
interface BreadcrumbPageProps extends Omit<ComponentPropsWithoutRef<"span">, "className"> {
|
|
445
|
-
/** Replace the rendered `span`. Keep it non-interactive — NN/g: the current page must not look or behave like a link. */
|
|
446
|
-
render?: useRender.RenderProp;
|
|
447
|
-
/** Additional classes merged after the current-page recipe. */
|
|
448
|
-
className?: string;
|
|
449
|
-
}
|
|
450
|
-
/**
|
|
451
|
-
* The current page, rendered as plain text with `aria-current="page"` — an
|
|
452
|
-
* honest `span`, not a disabled fake link. Use `BreadcrumbLink` with
|
|
453
|
-
* `aria-current="page"` instead when the current page must stay navigable.
|
|
454
|
-
*/
|
|
455
|
-
declare const BreadcrumbPage: import("react").ForwardRefExoticComponent<BreadcrumbPageProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
456
|
-
interface BreadcrumbSeparatorProps extends Omit<ComponentPropsWithoutRef<"li">, "className"> {
|
|
457
|
-
/** Custom separator glyph, e.g. `/` or `·`. Defaults to a chevron. */
|
|
458
|
-
children?: ComponentPropsWithoutRef<"li">["children"];
|
|
459
|
-
/** Replace the rendered `li`. Keep it hidden from assistive technology — separators are purely visual. */
|
|
460
|
-
render?: useRender.RenderProp;
|
|
461
|
-
/** Additional classes merged after the separator recipe. */
|
|
462
|
-
className?: string;
|
|
463
|
-
}
|
|
464
|
-
/**
|
|
465
|
-
* Visual divider between crumbs. It is `aria-hidden` with
|
|
466
|
-
* `role="presentation"`, so screen readers hear only the crumbs and the
|
|
467
|
-
* list's item count — never the glyphs.
|
|
468
|
-
*/
|
|
469
|
-
declare const BreadcrumbSeparator: import("react").ForwardRefExoticComponent<BreadcrumbSeparatorProps & import("react").RefAttributes<HTMLLIElement>>;
|
|
470
|
-
interface BreadcrumbEllipsisProps extends Omit<ComponentPropsWithoutRef<"span">, "className"> {
|
|
471
|
-
/** Custom collapsed-levels glyph. Defaults to a horizontal ellipsis. */
|
|
472
|
-
children?: ComponentPropsWithoutRef<"span">["children"];
|
|
473
|
-
/** Replace the rendered `span`. Keep it decorative — an interactive wrapper owns the accessible name. */
|
|
474
|
-
render?: useRender.RenderProp;
|
|
475
|
-
/** Additional classes merged after the ellipsis recipe. */
|
|
476
|
-
className?: string;
|
|
477
|
-
}
|
|
478
|
-
/**
|
|
479
|
-
* Marker for collapsed levels in a deep trail. It is decorative
|
|
480
|
-
* (`aria-hidden`); when the hidden levels must stay reachable, wrap it in a
|
|
481
|
-
* labelled trigger — e.g. a Menu trigger styled with
|
|
482
|
-
* `breadcrumbLinkVariants()` — so the control, not the glyph, carries the
|
|
483
|
-
* accessible name.
|
|
484
|
-
*/
|
|
485
|
-
declare const BreadcrumbEllipsis: import("react").ForwardRefExoticComponent<BreadcrumbEllipsisProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
486
|
-
//#endregion
|
|
487
|
-
//#region src/components/Button/Button.d.ts
|
|
488
|
-
type ButtonVariant = "primary" | "secondary" | "outline" | "ghost" | "destructive" | "link";
|
|
489
|
-
type ButtonSize = "sm" | "md" | "lg";
|
|
490
|
-
interface ButtonVariantsOptions {
|
|
491
|
-
variant?: ButtonVariant;
|
|
492
|
-
size?: ButtonSize;
|
|
493
|
-
fullWidth?: boolean;
|
|
494
|
-
iconOnly?: boolean;
|
|
495
|
-
className?: string;
|
|
496
|
-
}
|
|
497
|
-
/**
|
|
498
|
-
* Class list for an element styled as a Button.
|
|
499
|
-
*
|
|
500
|
-
* Links must keep link semantics — never render an `<a>` through Button
|
|
501
|
-
* (it would receive `role="button"`). Style the anchor directly instead:
|
|
502
|
-
*
|
|
503
|
-
* <a href="/docs" className={buttonVariants({ variant: "primary" })}>Docs</a>
|
|
504
|
-
*/
|
|
505
|
-
declare function buttonVariants({ variant, size, fullWidth, iconOnly, className }?: ButtonVariantsOptions): string;
|
|
506
|
-
interface ButtonBaseProps extends Omit<ComponentPropsWithoutRef<typeof Button$1>, "className"> {
|
|
507
|
-
/** Visual style of the button */
|
|
508
|
-
variant?: ButtonVariant;
|
|
509
|
-
/** Size of the button. `sm` (32px) meets the WCAG 2.5.8 AA target-size floor; prefer `md`/`lg` for touch-first surfaces. */
|
|
510
|
-
size?: ButtonSize;
|
|
511
|
-
/** Stretch to fill the container width */
|
|
512
|
-
fullWidth?: boolean;
|
|
513
|
-
/**
|
|
514
|
-
* Show a progress indicator and block interaction while keeping the button
|
|
515
|
-
* focusable, so keyboard/screen-reader focus is not lost mid-action.
|
|
516
|
-
* The button keeps its width; the label is swapped for a centered spinner
|
|
517
|
-
* unless `loadingText` is set.
|
|
518
|
-
*/
|
|
519
|
-
loading?: boolean;
|
|
520
|
-
/** Visible label shown next to the spinner while `loading` (announced to screen readers). */
|
|
521
|
-
loadingText?: ReactNode;
|
|
522
|
-
/** Decorative icon before the label (hidden from assistive technology). */
|
|
523
|
-
startIcon?: ReactNode;
|
|
524
|
-
/** Decorative icon after the label (hidden from assistive technology). */
|
|
525
|
-
endIcon?: ReactNode;
|
|
526
|
-
className?: string;
|
|
527
|
-
}
|
|
528
|
-
/** Icon-only buttons have no visible label, so an accessible name is required. */
|
|
529
|
-
type ButtonIconOnlyProps = {
|
|
530
|
-
iconOnly: true;
|
|
531
|
-
"aria-label": string;
|
|
532
|
-
} | {
|
|
533
|
-
iconOnly: true;
|
|
534
|
-
"aria-labelledby": string;
|
|
535
|
-
} | {
|
|
536
|
-
iconOnly?: false;
|
|
537
|
-
};
|
|
538
|
-
type ButtonProps = ButtonBaseProps & ButtonIconOnlyProps;
|
|
539
|
-
declare const Button: import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
540
|
-
//#endregion
|
|
541
|
-
//#region src/components/Calendar/Calendar.d.ts
|
|
542
|
-
type CalendarMode = "single" | "multiple" | "range";
|
|
543
|
-
/** Inclusive date range. `onValueChange` only ever emits complete ranges. */
|
|
544
|
-
interface CalendarDateRange {
|
|
545
|
-
start: Date;
|
|
546
|
-
end: Date;
|
|
547
|
-
}
|
|
548
|
-
/** State passed to the `render` callback (also exposed as root data-attributes). */
|
|
549
|
-
type CalendarState = {
|
|
550
|
-
mode: CalendarMode;
|
|
551
|
-
disabled: boolean;
|
|
552
|
-
readOnly: boolean;
|
|
553
|
-
};
|
|
554
|
-
interface CalendarBaseProps extends Omit<ComponentPropsWithoutRef<"div">, "className" | "children" | "defaultValue"> {
|
|
555
|
-
/**
|
|
556
|
-
* Month shown in the first grid (controlled). Any day of the month works;
|
|
557
|
-
* it is normalized to the first. Pair with `onMonthChange`.
|
|
558
|
-
*/
|
|
559
|
-
month?: Date;
|
|
560
|
-
/**
|
|
561
|
-
* Initial visible month (uncontrolled). Defaults to the month of the first
|
|
562
|
-
* selected date, else the current month.
|
|
563
|
-
*/
|
|
564
|
-
defaultMonth?: Date;
|
|
565
|
-
/** Called when the visible month changes (navigation buttons or keyboard paging). */
|
|
566
|
-
onMonthChange?: (month: Date) => void;
|
|
567
|
-
/**
|
|
568
|
-
* Months rendered side by side (wraps on narrow containers). Navigation
|
|
569
|
-
* pages by this amount so months never repeat across a page turn.
|
|
570
|
-
* @default 1
|
|
571
|
-
*/
|
|
572
|
-
numberOfMonths?: number;
|
|
573
|
-
/**
|
|
574
|
-
* Earliest selectable day. Days before it are hard-disabled: dimmed,
|
|
575
|
-
* skipped by keyboard focus, and the previous-month button disables at
|
|
576
|
-
* the boundary.
|
|
577
|
-
*/
|
|
578
|
-
minDate?: Date;
|
|
579
|
-
/** Latest selectable day — the `minDate` counterpart. */
|
|
580
|
-
maxDate?: Date;
|
|
581
|
-
/**
|
|
582
|
-
* Marks days as unavailable (e.g. sold out). Unlike `minDate`/`maxDate`,
|
|
583
|
-
* unavailable days stay keyboard-focusable and readable (WCAG 4.5:1) so
|
|
584
|
-
* screen-reader users can discover them — they just can't be selected.
|
|
585
|
-
* In `range` mode a pending selection is limited to the contiguous
|
|
586
|
-
* available run around its start date.
|
|
587
|
-
*/
|
|
588
|
-
isDateUnavailable?: (date: Date) => boolean;
|
|
589
|
-
/** Disable the whole calendar: selection and navigation. */
|
|
590
|
-
disabled?: boolean;
|
|
591
|
-
/** Keep the calendar navigable but ignore selection — for display-only surfaces. */
|
|
592
|
-
readOnly?: boolean;
|
|
593
|
-
/**
|
|
594
|
-
* BCP-47 tag (e.g. `"en-US"`, `"th-TH"`) for the caption, weekday names,
|
|
595
|
-
* day numerals, and day-cell accessible labels via `Intl.DateTimeFormat`.
|
|
596
|
-
* Defaults to the runtime locale. Rendering stays Gregorian, but locales
|
|
597
|
-
* with a different default calendar display accordingly (Thai → Buddhist-era
|
|
598
|
-
* years).
|
|
599
|
-
*/
|
|
600
|
-
locale?: string;
|
|
601
|
-
/**
|
|
602
|
-
* First day of the week: 0 = Sunday … 6 = Saturday. Defaults to the
|
|
603
|
-
* locale's week convention when the runtime exposes it, else Sunday.
|
|
604
|
-
*/
|
|
605
|
-
weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
|
|
606
|
-
/**
|
|
607
|
-
* Show the leading/trailing days of adjacent months. They are inert
|
|
608
|
-
* (visual continuity only) and hidden from assistive technology.
|
|
609
|
-
* @default true
|
|
610
|
-
*/
|
|
611
|
-
showOutsideDays?: boolean;
|
|
612
|
-
/**
|
|
613
|
-
* Always render six weeks per month so the calendar height never changes
|
|
614
|
-
* while paging — recommended inside popovers.
|
|
615
|
-
* @default false
|
|
616
|
-
*/
|
|
617
|
-
fixedWeeks?: boolean;
|
|
618
|
-
/**
|
|
619
|
-
* The day highlighted as "today" (`aria-current="date"`). Defaults to the
|
|
620
|
-
* current date; pin it in tests and visual baselines for determinism.
|
|
621
|
-
*/
|
|
622
|
-
today?: Date;
|
|
623
|
-
/** Move focus to the focus-target day (selected → today → first enabled) on mount. */
|
|
624
|
-
autoFocus?: boolean;
|
|
625
|
-
/**
|
|
626
|
-
* Accessible label for the previous-month navigation button.
|
|
627
|
-
* @default "Previous month"
|
|
628
|
-
*/
|
|
629
|
-
previousMonthLabel?: string;
|
|
630
|
-
/**
|
|
631
|
-
* Accessible label for the next-month navigation button.
|
|
632
|
-
* @default "Next month"
|
|
633
|
-
*/
|
|
634
|
-
nextMonthLabel?: string;
|
|
635
|
-
className?: string;
|
|
636
|
-
/** Replace the root element — Base UI's composition prop. */
|
|
637
|
-
render?: useRender.RenderProp<CalendarState>;
|
|
638
|
-
}
|
|
639
|
-
/** Selection props follow `mode`, so a mismatched value shape fails to compile. */
|
|
640
|
-
type CalendarModeProps = {
|
|
641
|
-
/** Selection behavior. `single` picks one date. @default "single" */
|
|
642
|
-
mode?: "single";
|
|
643
|
-
/** Selected date (controlled). `null` = empty. */
|
|
644
|
-
value?: Date | null;
|
|
645
|
-
/** Initial selected date (uncontrolled). */
|
|
646
|
-
defaultValue?: Date | null;
|
|
647
|
-
/** Called with the new date, or `null` when deselected via `allowDeselect`. */
|
|
648
|
-
onValueChange?: (value: Date | null) => void;
|
|
649
|
-
/**
|
|
650
|
-
* Let clicking the selected date clear it — for optional filters.
|
|
651
|
-
* @default false
|
|
652
|
-
*/
|
|
653
|
-
allowDeselect?: boolean;
|
|
654
|
-
} | {
|
|
655
|
-
/** `multiple` toggles any number of dates. */
|
|
656
|
-
mode: "multiple";
|
|
657
|
-
/** Selected dates (controlled), kept sorted ascending. */
|
|
658
|
-
value?: Date[];
|
|
659
|
-
/** Initial selected dates (uncontrolled). */
|
|
660
|
-
defaultValue?: Date[];
|
|
661
|
-
/** Called with the new sorted date list after every toggle. */
|
|
662
|
-
onValueChange?: (value: Date[]) => void;
|
|
663
|
-
allowDeselect?: never;
|
|
664
|
-
} | {
|
|
665
|
-
/** `range` picks a start and end with a live preview in between. */
|
|
666
|
-
mode: "range";
|
|
667
|
-
/** Selected range (controlled). `null` = empty. */
|
|
668
|
-
value?: CalendarDateRange | null;
|
|
669
|
-
/** Initial selected range (uncontrolled). */
|
|
670
|
-
defaultValue?: CalendarDateRange | null;
|
|
671
|
-
/** Called only with complete `{ start, end }` ranges (ends ordered, never inverted). */
|
|
672
|
-
onValueChange?: (value: CalendarDateRange | null) => void;
|
|
673
|
-
allowDeselect?: never;
|
|
674
|
-
};
|
|
675
|
-
type CalendarProps = CalendarBaseProps & CalendarModeProps;
|
|
676
|
-
declare const Calendar: import("react").ForwardRefExoticComponent<CalendarProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
677
|
-
//#endregion
|
|
678
|
-
//#region src/components/Checkbox/Checkbox.d.ts
|
|
679
|
-
type CheckboxSize = "sm" | "md" | "lg";
|
|
680
|
-
interface CheckboxVariantsOptions {
|
|
681
|
-
size?: CheckboxSize;
|
|
682
|
-
className?: string;
|
|
683
|
-
}
|
|
684
|
-
/**
|
|
685
|
-
* Class list for the checkbox box itself. State styling hangs off Base UI's
|
|
686
|
-
* data-attributes (`data-checked`, `data-indeterminate`, `data-disabled`,
|
|
687
|
-
* `data-readonly`, `data-invalid`) plus `aria-invalid`.
|
|
688
|
-
*/
|
|
689
|
-
declare function checkboxVariants({ size, className }?: CheckboxVariantsOptions): string;
|
|
690
|
-
interface CheckboxProps extends Omit<ComponentPropsWithoutRef<typeof Checkbox$1.Root>, "className"> {
|
|
691
|
-
/**
|
|
692
|
-
* Box size. The 24px `lg` box meets the WCAG 2.5.8 target-size floor on its
|
|
693
|
-
* own; `sm`/`md` rely on the clickable `label` (or surrounding spacing) to
|
|
694
|
-
* extend the target. Prefer `md`+ with a label on touch-first surfaces.
|
|
695
|
-
*/
|
|
696
|
-
size?: CheckboxSize;
|
|
697
|
-
/**
|
|
698
|
-
* Visible label rendered in an enclosing `<label>`, so clicking it toggles
|
|
699
|
-
* the checkbox and it names the control. Without it, provide an accessible
|
|
700
|
-
* name another way: `aria-label`, `aria-labelledby`, or an external
|
|
701
|
-
* `<label>`. When `required` is set, the label shows a decorative asterisk.
|
|
702
|
-
*/
|
|
703
|
-
label?: ReactNode;
|
|
704
|
-
/**
|
|
705
|
-
* Supporting copy below the label, linked via `aria-describedby`. Rendered
|
|
706
|
-
* outside the `<label>` element so screen readers announce it as the
|
|
707
|
-
* description instead of reading it into the accessible name.
|
|
708
|
-
*/
|
|
709
|
-
description?: ReactNode;
|
|
710
|
-
/** Applied to the checkbox box itself, also when `label`/`description` wrap it. */
|
|
711
|
-
className?: string;
|
|
712
|
-
}
|
|
713
|
-
/**
|
|
714
|
-
* Binary/mixed-state control built on Base UI's Checkbox. The indicator is
|
|
715
|
-
* built in: a check mark, or a minus while `indeterminate` — so a `parent`
|
|
716
|
-
* checkbox inside a controlled `CheckboxGroup` with `allValues` needs no
|
|
717
|
-
* extra wiring. `ref` and `className` always target the box element, whether
|
|
718
|
-
* or not the labelled layout wraps it.
|
|
719
|
-
*/
|
|
720
|
-
declare const Checkbox: import("react").ForwardRefExoticComponent<CheckboxProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
721
|
-
interface CheckboxGroupProps extends Omit<ComponentPropsWithoutRef<typeof CheckboxGroup$1>, "className"> {
|
|
722
|
-
className?: string;
|
|
723
|
-
}
|
|
724
|
-
/**
|
|
725
|
-
* Shares ticked-value state (`value`/`defaultValue`/`onValueChange`) across
|
|
726
|
-
* child checkboxes matched by their `value` prop, and drives a `parent`
|
|
727
|
-
* checkbox's indeterminate state when `allValues` is set. Lays the items out
|
|
728
|
-
* as a vertical stack — pass `className="flex-row"` for a horizontal row.
|
|
729
|
-
* The group needs an accessible name: `aria-labelledby` pointing at a caption,
|
|
730
|
-
* or `aria-label`.
|
|
731
|
-
*/
|
|
732
|
-
declare const CheckboxGroup: import("react").ForwardRefExoticComponent<CheckboxGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
733
|
-
//#endregion
|
|
734
|
-
//#region src/components/Select/Select.d.ts
|
|
735
|
-
/**
|
|
736
|
-
* Groups the select parts and owns value + popup state. This is Base UI's
|
|
737
|
-
* `Select.Root` re-exported unchanged, so every root feature is available:
|
|
738
|
-
* `value`/`defaultValue`/`onValueChange(value, details)`, `multiple`,
|
|
739
|
-
* `items` (lets `SelectValue` display labels instead of raw values),
|
|
740
|
-
* `name`/`required`/`disabled`/`readOnly` form wiring, and object values via
|
|
741
|
-
* `isItemEqualToValue`/`itemToStringLabel`/`itemToStringValue`.
|
|
742
|
-
*/
|
|
743
|
-
declare const Select: typeof Select$1.Root;
|
|
744
|
-
type SelectProps<Value = unknown, Multiple extends boolean | undefined = false> = Select$1.Root.Props<Value, Multiple>;
|
|
745
|
-
interface SelectLabelProps extends Omit<ComponentPropsWithoutRef<typeof Select$1.Label>, "className"> {
|
|
746
|
-
className?: string;
|
|
747
|
-
}
|
|
748
|
-
/**
|
|
749
|
-
* Visible label for the select — Base UI associates it with the trigger
|
|
750
|
-
* automatically, and clicking it focuses the trigger without opening the
|
|
751
|
-
* popup. Renders a `<div>`. When no visible label is rendered, give the
|
|
752
|
-
* trigger an accessible name with `aria-label` instead.
|
|
753
|
-
*/
|
|
754
|
-
declare const SelectLabel: import("react").ForwardRefExoticComponent<SelectLabelProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
755
|
-
type SelectTriggerVariant = "outline" | "ghost";
|
|
756
|
-
type SelectTriggerSize = "sm" | "md" | "lg";
|
|
757
|
-
type BaseTriggerProps$3 = ComponentPropsWithoutRef<typeof Select$1.Trigger>;
|
|
758
|
-
interface SelectTriggerVariantsOptions {
|
|
759
|
-
variant?: SelectTriggerVariant;
|
|
760
|
-
size?: SelectTriggerSize;
|
|
761
|
-
fullWidth?: boolean;
|
|
762
|
-
className?: string;
|
|
763
|
-
}
|
|
764
|
-
/**
|
|
765
|
-
* Class list for an element styled as the select trigger — for select-shaped
|
|
766
|
-
* controls that don't come from Base UI (custom comboboxes, fake dropdowns
|
|
767
|
-
* in previews) so every value-picker in the product shares one look.
|
|
768
|
-
*/
|
|
769
|
-
declare function selectTriggerVariants({ variant, size, fullWidth, className }?: SelectTriggerVariantsOptions): string;
|
|
770
|
-
interface SelectTriggerProps extends Omit<BaseTriggerProps$3, "className"> {
|
|
771
|
-
/** Visual style: `outline` is the input-like default; `ghost` is borderless for toolbars and dense inline filters. */
|
|
772
|
-
variant?: SelectTriggerVariant;
|
|
773
|
-
/** Control height. `sm` (32px) meets the WCAG 2.5.8 AA target-size floor; prefer `md`/`lg` for touch-first surfaces. */
|
|
774
|
-
size?: SelectTriggerSize;
|
|
775
|
-
/** Stretch to fill the container width — the usual setting inside form layouts. `anchorWidth` takes precedence when both are set. */
|
|
776
|
-
fullWidth?: boolean;
|
|
777
|
-
/**
|
|
778
|
-
* CSS width of the trigger (the popup anchor). Accepts a number in pixels
|
|
779
|
-
* or any CSS width such as `"14rem"`, `"100%"`, or `"max-content"`.
|
|
780
|
-
* `"max-content"` keeps the control only as wide as the selected value,
|
|
781
|
-
* padding, and icon; the popup still grows when an option needs more room.
|
|
782
|
-
* A consumer `style.width` can override this convenience prop.
|
|
783
|
-
*/
|
|
784
|
-
anchorWidth?: CSSProperties["width"];
|
|
785
|
-
/** Replaces the dropdown chevron. Decorative — hidden from assistive technology. */
|
|
786
|
-
icon?: ReactNode;
|
|
787
|
-
className?: string;
|
|
788
|
-
}
|
|
789
|
-
/**
|
|
790
|
-
* The button that shows the current value and opens the popup. Place a
|
|
791
|
-
* `SelectValue` inside it and the dropdown chevron is appended
|
|
792
|
-
* automatically. The trigger's accessible name comes from a sibling
|
|
793
|
-
* `SelectLabel` (or a composed `Field.Label`); without one, pass
|
|
794
|
-
* `aria-label`.
|
|
795
|
-
*/
|
|
796
|
-
declare const SelectTrigger: import("react").ForwardRefExoticComponent<SelectTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
797
|
-
interface SelectValueProps extends Omit<ComponentPropsWithoutRef<typeof Select$1.Value>, "className"> {
|
|
798
|
-
className?: string;
|
|
799
|
-
}
|
|
800
|
-
/**
|
|
801
|
-
* The selected value's text inside the trigger. Set `placeholder` for the
|
|
802
|
-
* empty state (rendered muted). With `items` on the root it shows the
|
|
803
|
-
* matching label instead of the raw value; pass a function as `children`
|
|
804
|
-
* to format the value yourself — the multi-select "+N more" pattern lives
|
|
805
|
-
* there.
|
|
806
|
-
*/
|
|
807
|
-
declare const SelectValue: import("react").ForwardRefExoticComponent<SelectValueProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
808
|
-
type BasePositionerProps$5 = ComponentPropsWithoutRef<typeof Select$1.Positioner>;
|
|
809
|
-
type SelectAlign = NonNullable<BasePositionerProps$5["align"]>;
|
|
810
|
-
interface SelectPopupProps extends Omit<ComponentPropsWithoutRef<typeof Select$1.Popup>, "className"> {
|
|
811
|
-
/** How the popup lines up along the trigger's bottom (or top) edge. */
|
|
812
|
-
align?: SelectAlign;
|
|
813
|
-
/** Gap between trigger and popup in pixels. */
|
|
814
|
-
sideOffset?: BasePositionerProps$5["sideOffset"];
|
|
815
|
-
/** Additional shift along the alignment axis in pixels. */
|
|
816
|
-
alignOffset?: BasePositionerProps$5["alignOffset"];
|
|
817
|
-
/** Minimum space kept from the viewport (or collision boundary) edges when repositioning. */
|
|
818
|
-
collisionPadding?: BasePositionerProps$5["collisionPadding"];
|
|
819
|
-
/**
|
|
820
|
-
* Caps the popup's height so long lists scroll inside it — a number is
|
|
821
|
-
* pixels, a string is any CSS length. Whatever the value, the popup never
|
|
822
|
-
* exceeds the space between the trigger and the viewport edge.
|
|
823
|
-
*/
|
|
824
|
-
maxHeight?: number | string;
|
|
825
|
-
/** Portal destination. Defaults to `document.body`. */
|
|
826
|
-
container?: ComponentPropsWithoutRef<typeof Select$1.Portal>["container"];
|
|
827
|
-
/**
|
|
828
|
-
* Applied to the popup panel. Width hooks: the panel is at least as wide
|
|
829
|
-
* as the trigger — set `w-[var(--anchor-width)]` to match it exactly or
|
|
830
|
-
* `w-*`/`max-w-*` for a fixed width. Cap height with the `maxHeight` prop.
|
|
831
|
-
*/
|
|
832
|
-
className?: string;
|
|
833
|
-
}
|
|
834
|
-
/**
|
|
835
|
-
* The floating option list, with the portal, positioning, list, and
|
|
836
|
-
* hover-scroll arrow plumbing folded in. Always drops below the trigger and
|
|
837
|
-
* flips above it only when the space below runs out — never sideways. Long
|
|
838
|
-
* lists scroll inside the popup, up to `maxHeight`.
|
|
839
|
-
*/
|
|
840
|
-
declare const SelectPopup: import("react").ForwardRefExoticComponent<SelectPopupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
841
|
-
interface SelectItemProps extends Omit<ComponentPropsWithoutRef<typeof Select$1.Item>, "className"> {
|
|
842
|
-
className?: string;
|
|
843
|
-
}
|
|
844
|
-
/**
|
|
845
|
-
* One option in the popup. Children render as the option's label (wrapped in
|
|
846
|
-
* Base UI's `ItemText`); a check mark appears at the item's right edge while
|
|
847
|
-
* selected. Set `label` when children aren't plain text so keyboard
|
|
848
|
-
* typeahead has something to match, and `disabled` for unavailable options.
|
|
849
|
-
*/
|
|
850
|
-
declare const SelectItem: import("react").ForwardRefExoticComponent<SelectItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
851
|
-
interface SelectGroupProps extends Omit<ComponentPropsWithoutRef<typeof Select$1.Group>, "className"> {
|
|
852
|
-
className?: string;
|
|
853
|
-
}
|
|
854
|
-
/** Groups related options under a `SelectGroupLabel`, announced together by assistive technology. */
|
|
855
|
-
declare const SelectGroup: import("react").ForwardRefExoticComponent<SelectGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
856
|
-
interface SelectGroupLabelProps extends Omit<ComponentPropsWithoutRef<typeof Select$1.GroupLabel>, "className"> {
|
|
857
|
-
className?: string;
|
|
858
|
-
}
|
|
859
|
-
/** Heading for a `SelectGroup` — visually a meta caption, wired to the group via `aria-labelledby`. */
|
|
860
|
-
declare const SelectGroupLabel: import("react").ForwardRefExoticComponent<SelectGroupLabelProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
861
|
-
interface SelectSeparatorProps extends Omit<ComponentPropsWithoutRef<typeof Select$1.Separator>, "className"> {
|
|
862
|
-
className?: string;
|
|
863
|
-
}
|
|
864
|
-
/** Divider between option groups, exposed to screen readers as a separator. */
|
|
865
|
-
declare const SelectSeparator: import("react").ForwardRefExoticComponent<SelectSeparatorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
866
|
-
//#endregion
|
|
867
|
-
//#region src/components/Combobox/Combobox.d.ts
|
|
868
|
-
/**
|
|
869
|
-
* Groups the combobox parts and owns value, input text, filtering, and popup
|
|
870
|
-
* state. This is Base UI's `Combobox.Root` re-exported unchanged, so every
|
|
871
|
-
* root feature is available: `value`/`defaultValue`/`onValueChange`,
|
|
872
|
-
* `inputValue`/`onInputValueChange`, `items` (enables filtering and the
|
|
873
|
-
* built-in empty state), `multiple`, `filter`/`filteredItems`/`limit` for
|
|
874
|
-
* custom matching, `name`/`required`/`disabled`/`readOnly` form wiring, and
|
|
875
|
-
* object values via `isItemEqualToValue`/`itemToStringLabel`/
|
|
876
|
-
* `itemToStringValue`. Prefer Combobox over Select once a list is long
|
|
877
|
-
* enough to need filtering (~15+ options); it does not accept free-form
|
|
878
|
-
* text. Advanced `grid` and `virtualized` modes are out of this wrapper's
|
|
879
|
-
* scope — compose `@base-ui/react/combobox` parts directly for those.
|
|
880
|
-
*/
|
|
881
|
-
declare const Combobox: typeof Combobox$1.Root;
|
|
882
|
-
type ComboboxProps<Value = unknown, Multiple extends boolean | undefined = false> = Combobox$1.Root.Props<Value, Multiple>;
|
|
883
|
-
/** Control height shared by the input group, standalone input, and trigger. */
|
|
884
|
-
type ComboboxSize = "sm" | "md" | "lg";
|
|
885
|
-
declare const useComboboxFilter: typeof Combobox$1.useFilter;
|
|
886
|
-
declare const useComboboxFilteredItems: typeof Combobox$1.useFilteredItems;
|
|
887
|
-
interface ComboboxLabelProps extends Omit<ComponentPropsWithoutRef<typeof Combobox$1.Label>, "className"> {
|
|
888
|
-
className?: string;
|
|
889
|
-
}
|
|
890
|
-
/**
|
|
891
|
-
* Visible label associated automatically with the combobox **trigger** — use
|
|
892
|
-
* it with the trigger-anchored (input-inside-popup) pattern. When the
|
|
893
|
-
* `ComboboxInput` is the form control, label the input instead: a native
|
|
894
|
-
* `<label htmlFor>`, a composed `FieldLabel`, or `aria-label` on the input.
|
|
895
|
-
* Renders a `<div>`; pass `render={<span />}` for inline layouts.
|
|
896
|
-
*/
|
|
897
|
-
declare const ComboboxLabel: import("react").ForwardRefExoticComponent<ComboboxLabelProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
898
|
-
interface ComboboxInputGroupVariantsOptions {
|
|
899
|
-
size?: ComboboxSize;
|
|
900
|
-
className?: string;
|
|
901
|
-
}
|
|
902
|
-
/**
|
|
903
|
-
* Class list for an element styled as the combobox field frame — for
|
|
904
|
-
* combobox-shaped controls that don't come from Base UI (command-palette
|
|
905
|
-
* openers, fake search fields in previews) so every filterable picker
|
|
906
|
-
* shares one look.
|
|
907
|
-
*/
|
|
908
|
-
declare function comboboxInputGroupVariants({ size, className }?: ComboboxInputGroupVariantsOptions): string;
|
|
909
|
-
interface ComboboxInputGroupProps extends Omit<ComponentPropsWithoutRef<typeof Combobox$1.InputGroup>, "className"> {
|
|
910
|
-
/** Control height. `sm` (32px) meets the WCAG 2.5.8 AA target-size floor; prefer `md`/`lg` for touch-first surfaces. The `ComboboxInput` inside inherits it. With chips the field grows taller as rows wrap. */
|
|
911
|
-
size?: ComboboxSize;
|
|
912
|
-
/** Append the dropdown chevron button after the input — the visual cue that the field holds a predefined list. The popup also opens from clicking the input itself. */
|
|
913
|
-
showTrigger?: boolean;
|
|
914
|
-
/** Append a clear button that appears while there is a selection or typed text to erase. Leave off for required fields that must always hold a value. */
|
|
915
|
-
showClear?: boolean;
|
|
916
|
-
/** Accessible name for the folded clear button — override with localized copy. */
|
|
917
|
-
clearLabel?: string;
|
|
918
|
-
/** Accessible name for the folded chevron button — override with localized copy. */
|
|
919
|
-
triggerLabel?: string;
|
|
920
|
-
className?: string;
|
|
921
|
-
}
|
|
922
|
-
/**
|
|
923
|
-
* The field frame of an input-anchored combobox: seats the `ComboboxInput`
|
|
924
|
-
* (and selection `ComboboxChips`) inside one border with a single focus
|
|
925
|
-
* ring, and folds in the standard end-of-field buttons — a dropdown chevron
|
|
926
|
-
* (`showTrigger`) and a clear button (`showClear`). The popup anchors to
|
|
927
|
-
* this frame. Give the input an accessible name: a native `<label htmlFor>`,
|
|
928
|
-
* a composed `FieldLabel`, or `aria-label` on `ComboboxInput`.
|
|
929
|
-
*/
|
|
930
|
-
declare const ComboboxInputGroup: import("react").ForwardRefExoticComponent<ComboboxInputGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
931
|
-
interface ComboboxInputProps extends Omit<ComponentPropsWithoutRef<typeof Combobox$1.Input>, "className" | "size"> {
|
|
932
|
-
/** Control height when the input stands alone. Inside a `ComboboxInputGroup` the group's `size` wins; inside a `ComboboxPopup` the fixed search-row style applies. */
|
|
933
|
-
size?: ComboboxSize;
|
|
934
|
-
className?: string;
|
|
935
|
-
}
|
|
936
|
-
/**
|
|
937
|
-
* The text input that filters the list. Context-aware: bare inside a
|
|
938
|
-
* `ComboboxInputGroup` (the group owns the frame), a pinned search row
|
|
939
|
-
* inside a `ComboboxPopup` (the trigger-anchored pattern), and a standalone
|
|
940
|
-
* `Input`-look field otherwise. Typing filters as you type; ArrowDown opens
|
|
941
|
-
* and moves through options while focus stays in the input.
|
|
942
|
-
*/
|
|
943
|
-
declare const ComboboxInput: import("react").ForwardRefExoticComponent<ComboboxInputProps & import("react").RefAttributes<HTMLInputElement>>;
|
|
944
|
-
interface ComboboxClearProps extends Omit<ComponentPropsWithoutRef<typeof Combobox$1.Clear>, "className"> {
|
|
945
|
-
className?: string;
|
|
946
|
-
}
|
|
947
|
-
/**
|
|
948
|
-
* Erases the selection and typed text. Renders only while there is
|
|
949
|
-
* something to clear. `ComboboxInputGroup` folds one in via `showClear`;
|
|
950
|
-
* use this part directly for custom field layouts. Icon-only — keep an
|
|
951
|
-
* accessible name (defaults to "Clear selection").
|
|
952
|
-
*/
|
|
953
|
-
declare const ComboboxClear: import("react").ForwardRefExoticComponent<ComboboxClearProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
954
|
-
type ComboboxTriggerVariant = SelectTriggerVariant;
|
|
955
|
-
type ComboboxTriggerSize = SelectTriggerSize;
|
|
956
|
-
type BaseTriggerProps$2 = ComponentPropsWithoutRef<typeof Combobox$1.Trigger>;
|
|
957
|
-
interface ComboboxTriggerProps extends Omit<BaseTriggerProps$2, "className"> {
|
|
958
|
-
/** Visual style: `outline` is the input-like default; `ghost` is borderless for toolbars and dense inline filters. */
|
|
959
|
-
variant?: ComboboxTriggerVariant;
|
|
960
|
-
/** Control height. `sm` (32px) meets the WCAG 2.5.8 AA target-size floor; prefer `md`/`lg` for touch-first surfaces. */
|
|
961
|
-
size?: ComboboxTriggerSize;
|
|
962
|
-
/** Stretch to fill the container width — the usual setting inside form layouts. `anchorWidth` takes precedence when both are set. */
|
|
963
|
-
fullWidth?: boolean;
|
|
964
|
-
/**
|
|
965
|
-
* CSS width of the trigger (the popup anchor). Accepts a number in pixels
|
|
966
|
-
* or any CSS width such as `"14rem"`, `"100%"`, or `"max-content"`.
|
|
967
|
-
* `"max-content"` keeps the control only as wide as the selected value,
|
|
968
|
-
* padding, and icon. A consumer `style.width` can override this
|
|
969
|
-
* convenience prop.
|
|
970
|
-
*/
|
|
971
|
-
anchorWidth?: CSSProperties["width"];
|
|
972
|
-
/** Replaces the up-down carets. Decorative — hidden from assistive technology. */
|
|
973
|
-
icon?: ReactNode;
|
|
974
|
-
className?: string;
|
|
975
|
-
}
|
|
976
|
-
/**
|
|
977
|
-
* Select-like button anchor for the trigger-anchored pattern: it shows the
|
|
978
|
-
* current `ComboboxValue` and opens a popup whose search input rides along
|
|
979
|
-
* inside (`header` on `ComboboxPopup`). Shares the Select trigger recipe, so
|
|
980
|
-
* value pickers look identical across the system; the up-down carets mark
|
|
981
|
-
* this one as searchable. Its accessible name comes from a sibling
|
|
982
|
-
* `ComboboxLabel` (or a composed `FieldLabel`); without one, pass
|
|
983
|
-
* `aria-label`.
|
|
984
|
-
*/
|
|
985
|
-
declare const ComboboxTrigger: import("react").ForwardRefExoticComponent<ComboboxTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
986
|
-
/**
|
|
987
|
-
* The selected value's text, for use inside `ComboboxTrigger` (set
|
|
988
|
-
* `placeholder` for the empty state) or as a render-function wrapper in the
|
|
989
|
-
* chips pattern. Base UI's `Combobox.Value` re-exported unchanged — it
|
|
990
|
-
* renders no element of its own; the trigger styles the text.
|
|
991
|
-
*/
|
|
992
|
-
declare const ComboboxValue: typeof Combobox$1.Value;
|
|
993
|
-
type ComboboxValueProps = Combobox$1.Value.Props;
|
|
994
|
-
type BasePositionerProps$4 = ComponentPropsWithoutRef<typeof Combobox$1.Positioner>;
|
|
995
|
-
type BaseListProps = ComponentPropsWithoutRef<typeof Combobox$1.List>;
|
|
996
|
-
type ComboboxAlign = NonNullable<BasePositionerProps$4["align"]>;
|
|
997
|
-
interface ComboboxPopupProps extends Omit<ComponentPropsWithoutRef<typeof Combobox$1.Popup>, "className" | "children"> {
|
|
998
|
-
/** Items to render: static nodes, or a function `(item, index) => node` that renders the root's filtered `items`. */
|
|
999
|
-
children?: BaseListProps["children"];
|
|
1000
|
-
/** How the popup lines up along the anchor's bottom (or top) edge. */
|
|
1001
|
-
align?: ComboboxAlign;
|
|
1002
|
-
/** Gap between anchor and popup in pixels. */
|
|
1003
|
-
sideOffset?: BasePositionerProps$4["sideOffset"];
|
|
1004
|
-
/** Additional shift along the alignment axis in pixels. */
|
|
1005
|
-
alignOffset?: BasePositionerProps$4["alignOffset"];
|
|
1006
|
-
/** Minimum space kept from the viewport (or collision boundary) edges when repositioning. */
|
|
1007
|
-
collisionPadding?: BasePositionerProps$4["collisionPadding"];
|
|
1008
|
-
/**
|
|
1009
|
-
* Caps the popup's height so long lists scroll inside it — a number is
|
|
1010
|
-
* pixels, a string is any CSS length. Whatever the value, the popup never
|
|
1011
|
-
* exceeds the space between the anchor and the viewport edge.
|
|
1012
|
-
*/
|
|
1013
|
-
maxHeight?: number | string;
|
|
1014
|
-
/** Portal destination. Defaults to `document.body`. */
|
|
1015
|
-
container?: ComponentPropsWithoutRef<typeof Combobox$1.Portal>["container"];
|
|
1016
|
-
/** Pinned content above the list — a `ComboboxInput` here creates the searchable-select (trigger-anchored) pattern. */
|
|
1017
|
-
header?: ReactNode;
|
|
1018
|
-
/** Live status row above the list for async lists ("Searching…", errors). Announced politely to screen readers; its slot stays mounted, so swap the content rather than the prop's presence. */
|
|
1019
|
-
status?: ReactNode;
|
|
1020
|
-
/**
|
|
1021
|
-
* Shown when filtering leaves no items (requires `items` on the root).
|
|
1022
|
-
* Defaults to "No results found." — override with localized copy, or pass
|
|
1023
|
-
* `null` to omit the built-in empty state entirely.
|
|
1024
|
-
*/
|
|
1025
|
-
emptyMessage?: ReactNode;
|
|
1026
|
-
/**
|
|
1027
|
-
* Applied to the popup panel. Width hooks: the panel is at least as wide
|
|
1028
|
-
* as the anchor — set `w-[var(--anchor-width)]` to match it exactly or
|
|
1029
|
-
* `w-*`/`max-w-*` for a fixed width. Cap height with the `maxHeight` prop.
|
|
1030
|
-
*/
|
|
1031
|
-
className?: string;
|
|
1032
|
-
}
|
|
1033
|
-
/**
|
|
1034
|
-
* The floating option list, with the portal, positioning, scrollable list,
|
|
1035
|
-
* and always-mounted status/empty regions folded in. Always drops below the
|
|
1036
|
-
* anchor and flips above it only when the space below runs out — never
|
|
1037
|
-
* sideways. Long lists scroll inside the popup, up to `maxHeight`.
|
|
1038
|
-
*/
|
|
1039
|
-
declare const ComboboxPopup: import("react").ForwardRefExoticComponent<ComboboxPopupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1040
|
-
interface ComboboxItemProps extends Omit<ComponentPropsWithoutRef<typeof Combobox$1.Item>, "className"> {
|
|
1041
|
-
className?: string;
|
|
1042
|
-
}
|
|
1043
|
-
/**
|
|
1044
|
-
* One option in the popup. Children render as the option's label; a check
|
|
1045
|
-
* mark appears at the item's right edge while selected. Filtering matches
|
|
1046
|
-
* the item's `value` — for object values set `itemToStringLabel` on the
|
|
1047
|
-
* root. Keep unavailable options visible but `disabled` so the list stays
|
|
1048
|
-
* spatially consistent.
|
|
1049
|
-
*/
|
|
1050
|
-
declare const ComboboxItem: import("react").ForwardRefExoticComponent<ComboboxItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1051
|
-
interface ComboboxGroupProps extends Omit<ComponentPropsWithoutRef<typeof Combobox$1.Group>, "className"> {
|
|
1052
|
-
className?: string;
|
|
1053
|
-
}
|
|
1054
|
-
/**
|
|
1055
|
-
* Groups related options under a `ComboboxGroupLabel`, announced together by
|
|
1056
|
-
* assistive technology. With grouped `items` data (`{ value, items }[]`),
|
|
1057
|
-
* pass each group's `items` here and render them via `ComboboxCollection`.
|
|
1058
|
-
*/
|
|
1059
|
-
declare const ComboboxGroup: import("react").ForwardRefExoticComponent<ComboboxGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1060
|
-
interface ComboboxGroupLabelProps extends Omit<ComponentPropsWithoutRef<typeof Combobox$1.GroupLabel>, "className"> {
|
|
1061
|
-
className?: string;
|
|
1062
|
-
}
|
|
1063
|
-
/** Heading for a `ComboboxGroup` — visually a meta caption, wired to the group via `aria-labelledby`. */
|
|
1064
|
-
declare const ComboboxGroupLabel: import("react").ForwardRefExoticComponent<ComboboxGroupLabelProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1065
|
-
/**
|
|
1066
|
-
* Renders the filtered items of the enclosing `ComboboxGroup` through a
|
|
1067
|
-
* function child `(item, index) => node`. Base UI's `Combobox.Collection`
|
|
1068
|
-
* re-exported unchanged — it renders no element of its own.
|
|
1069
|
-
*/
|
|
1070
|
-
declare const ComboboxCollection: typeof Combobox$1.Collection;
|
|
1071
|
-
type ComboboxCollectionProps = Combobox$1.Collection.Props;
|
|
1072
|
-
interface ComboboxSeparatorProps extends Omit<ComponentPropsWithoutRef<typeof Combobox$1.Separator>, "className"> {
|
|
1073
|
-
className?: string;
|
|
1074
|
-
}
|
|
1075
|
-
/** Divider between option groups, exposed to screen readers as a separator. */
|
|
1076
|
-
declare const ComboboxSeparator: import("react").ForwardRefExoticComponent<ComboboxSeparatorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1077
|
-
interface ComboboxChipsProps extends Omit<ComponentPropsWithoutRef<typeof Combobox$1.Chips>, "className"> {
|
|
1078
|
-
className?: string;
|
|
1079
|
-
}
|
|
1080
|
-
/**
|
|
1081
|
-
* Row of selection chips for a `multiple` combobox, rendered inside the
|
|
1082
|
-
* `ComboboxInputGroup` before the input. Compose it with a `ComboboxValue`
|
|
1083
|
-
* render function that maps the selected values to `ComboboxChip`s and ends
|
|
1084
|
-
* with the `ComboboxInput`, so typing continues after the chips.
|
|
1085
|
-
*/
|
|
1086
|
-
declare const ComboboxChips: import("react").ForwardRefExoticComponent<ComboboxChipsProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1087
|
-
interface ComboboxChipProps extends Omit<ComponentPropsWithoutRef<typeof Combobox$1.Chip>, "className"> {
|
|
1088
|
-
className?: string;
|
|
1089
|
-
}
|
|
1090
|
-
/**
|
|
1091
|
-
* One selected value in a `multiple` combobox. ArrowLeft from the input
|
|
1092
|
-
* walks the chips and Backspace removes the last one; give each chip an
|
|
1093
|
-
* `aria-label` naming its value. Nest a `ComboboxChipRemove` for pointer
|
|
1094
|
-
* users.
|
|
1095
|
-
*/
|
|
1096
|
-
declare const ComboboxChip: import("react").ForwardRefExoticComponent<ComboboxChipProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1097
|
-
interface ComboboxChipRemoveBaseProps extends Omit<ComponentPropsWithoutRef<typeof Combobox$1.ChipRemove>, "className"> {
|
|
1098
|
-
className?: string;
|
|
1099
|
-
}
|
|
1100
|
-
/** The remove button renders only an icon, so an accessible name naming the value is required. */
|
|
1101
|
-
type ComboboxChipRemoveProps = ComboboxChipRemoveBaseProps & ({
|
|
1102
|
-
"aria-label": string;
|
|
1103
|
-
} | {
|
|
1104
|
-
"aria-labelledby": string;
|
|
1105
|
-
});
|
|
1106
|
-
/**
|
|
1107
|
-
* Removes its chip's value from the selection. Icon-only, so an accessible
|
|
1108
|
-
* name is required — include the value it removes, e.g.
|
|
1109
|
-
* `aria-label={`Remove ${item.label}`}`. Children replace the default × icon.
|
|
1110
|
-
*/
|
|
1111
|
-
declare const ComboboxChipRemove: import("react").ForwardRefExoticComponent<ComboboxChipRemoveProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1112
|
-
//#endregion
|
|
1113
|
-
//#region src/components/Menu/Menu.d.ts
|
|
1114
|
-
/**
|
|
1115
|
-
* Groups the menu parts and owns the open state. A menu lists **actions**
|
|
1116
|
-
* (role `menu`); to pick a value that a field keeps showing, use Select.
|
|
1117
|
-
* This is Base UI's `Menu.Root` re-exported unchanged, so every root feature
|
|
1118
|
-
* is available: `open`/`defaultOpen`/`onOpenChange(open, details)`,
|
|
1119
|
-
* `modal` (defaults `true` — page scroll locks while open), `disabled`,
|
|
1120
|
-
* `loopFocus`, `orientation`, `highlightItemOnHover`, and
|
|
1121
|
-
* `handle`/`triggerId` for detached triggers.
|
|
1122
|
-
*/
|
|
1123
|
-
declare const Menu: <Payload>(props: Menu$1.Root.Props<Payload>) => import("react").JSX.Element;
|
|
1124
|
-
type MenuProps = ComponentPropsWithoutRef<typeof Menu$1.Root>;
|
|
1125
|
-
/**
|
|
1126
|
-
* Creates a handle that links `Menu` with `MenuTrigger`s rendered elsewhere
|
|
1127
|
-
* in the tree (toolbars, table rows). Triggers may attach a `payload`, which
|
|
1128
|
-
* the `Menu` children render function receives.
|
|
1129
|
-
*/
|
|
1130
|
-
declare const createMenuHandle: typeof Menu$1.createHandle;
|
|
1131
|
-
type MenuHandle<Payload = unknown> = Menu$1.Handle<Payload>;
|
|
1132
|
-
interface MenuTriggerProps extends Omit<ComponentPropsWithoutRef<typeof Menu$1.Trigger>, "className"> {
|
|
1133
|
-
className?: string;
|
|
1134
|
-
}
|
|
1135
|
-
/**
|
|
1136
|
-
* The button that opens the menu. Ships unstyled so the visual comes from
|
|
1137
|
-
* composition — render the design system's Button:
|
|
1138
|
-
*
|
|
1139
|
-
* <MenuTrigger render={<Button variant="outline" />}>Options</MenuTrigger>
|
|
1140
|
-
*
|
|
1141
|
-
* For the kebab/ellipsis pattern, Button's icon-only form already enforces
|
|
1142
|
-
* the accessible name:
|
|
1143
|
-
*
|
|
1144
|
-
* <MenuTrigger render={<Button variant="ghost" iconOnly aria-label="Row actions" />}>
|
|
1145
|
-
* <EllipsisIcon />
|
|
1146
|
-
* </MenuTrigger>
|
|
1147
|
-
*
|
|
1148
|
-
* While its menu is open the element carries `data-popup-open`, the hook for
|
|
1149
|
-
* a pressed look (e.g. `className="data-popup-open:bg-muted"`). `openOnHover`
|
|
1150
|
-
* with `delay`/`closeDelay` (100/0ms defaults) is available but click-to-open
|
|
1151
|
-
* is the reliable default for action menus — hover menus misfire on the way
|
|
1152
|
-
* to other targets.
|
|
1153
|
-
*/
|
|
1154
|
-
declare const MenuTrigger: import("react").ForwardRefExoticComponent<MenuTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1155
|
-
type BasePositionerProps$3 = ComponentPropsWithoutRef<typeof Menu$1.Positioner>;
|
|
1156
|
-
type MenuSide = NonNullable<BasePositionerProps$3["side"]>;
|
|
1157
|
-
type MenuAlign = NonNullable<BasePositionerProps$3["align"]>;
|
|
1158
|
-
interface MenuPopupProps extends Omit<ComponentPropsWithoutRef<typeof Menu$1.Popup>, "className"> {
|
|
1159
|
-
/**
|
|
1160
|
-
* Side of the anchor to place the popup on; flips automatically when there
|
|
1161
|
-
* is no room. When omitted, Base UI picks the menu default: `bottom` for a
|
|
1162
|
-
* top-level menu, the inline end (submenu convention) inside a
|
|
1163
|
-
* `MenuSubmenuRoot` — so leave it unset unless the layout demands a side.
|
|
1164
|
-
*/
|
|
1165
|
-
side?: MenuSide;
|
|
1166
|
-
/**
|
|
1167
|
-
* How the popup lines up along the chosen side. When omitted, top-level
|
|
1168
|
-
* menus center on the trigger and submenus align `start` so their panel
|
|
1169
|
-
* tracks the trigger row.
|
|
1170
|
-
*/
|
|
1171
|
-
align?: MenuAlign;
|
|
1172
|
-
/**
|
|
1173
|
-
* Gap between anchor and popup in pixels. Defaults adapt to the resolved
|
|
1174
|
-
* side: 4px below/above a trigger, and a 4px *overlap* for submenus so the
|
|
1175
|
-
* pointer never crosses a dead zone between panels.
|
|
1176
|
-
*/
|
|
1177
|
-
sideOffset?: BasePositionerProps$3["sideOffset"];
|
|
1178
|
-
/**
|
|
1179
|
-
* Additional shift along the alignment axis in pixels. Defaults adapt: 0
|
|
1180
|
-
* for top-level menus, -4px for submenus so the first item lines up with
|
|
1181
|
-
* the submenu trigger's row.
|
|
1182
|
-
*/
|
|
1183
|
-
alignOffset?: BasePositionerProps$3["alignOffset"];
|
|
1184
|
-
/** Minimum space kept from the viewport (or collision boundary) edges when repositioning. */
|
|
1185
|
-
collisionPadding?: BasePositionerProps$3["collisionPadding"];
|
|
1186
|
-
/** Position against this element instead of the trigger (e.g. the whole toolbar while a button opens the menu). */
|
|
1187
|
-
anchor?: BasePositionerProps$3["anchor"];
|
|
1188
|
-
/** Keep the popup in the DOM while closed — for SEO or measuring; closed popups normally unmount. */
|
|
1189
|
-
keepMounted?: boolean;
|
|
1190
|
-
/** Portal destination. Defaults to `document.body`. */
|
|
1191
|
-
container?: ComponentPropsWithoutRef<typeof Menu$1.Portal>["container"];
|
|
1192
|
-
/**
|
|
1193
|
-
* Applied to the popup panel. Width hooks: the panel is content-sized from
|
|
1194
|
-
* 8rem up — set `w-*`/`max-w-*` for a fixed width or
|
|
1195
|
-
* `min-w-[var(--anchor-width)]` to never be narrower than the trigger.
|
|
1196
|
-
* Long menus scroll inside the panel; cap them earlier with `max-h-*`.
|
|
1197
|
-
*/
|
|
1198
|
-
className?: string;
|
|
1199
|
-
}
|
|
1200
|
-
/**
|
|
1201
|
-
* The floating list of menu items, with the portal and positioning plumbing
|
|
1202
|
-
* folded in. Anchored to its trigger by default; opens with a motion-safe
|
|
1203
|
-
* scale/fade from the anchor-facing corner. The same component nests inside
|
|
1204
|
-
* `MenuSubmenuRoot`, where its placement defaults switch to the submenu
|
|
1205
|
-
* conventions (inline-end side, overlapped edge, trigger-row alignment).
|
|
1206
|
-
*/
|
|
1207
|
-
declare const MenuPopup: import("react").ForwardRefExoticComponent<MenuPopupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1208
|
-
type MenuItemVariant = "default" | "destructive";
|
|
1209
|
-
interface MenuItemVariantsOptions {
|
|
1210
|
-
variant?: MenuItemVariant;
|
|
1211
|
-
inset?: boolean;
|
|
1212
|
-
className?: string;
|
|
1213
|
-
}
|
|
1214
|
-
/**
|
|
1215
|
-
* Class list for an element styled as a menu item — for menu-shaped rows
|
|
1216
|
-
* that don't come from Base UI (command palettes, custom listboxes) so every
|
|
1217
|
-
* item row in the product shares one look.
|
|
1218
|
-
*/
|
|
1219
|
-
declare function menuItemVariants({ variant, inset, className }?: MenuItemVariantsOptions): string;
|
|
1220
|
-
interface MenuItemProps extends Omit<ComponentPropsWithoutRef<typeof Menu$1.Item>, "className"> {
|
|
1221
|
-
/** Visual tone: `destructive` marks irreversible actions (delete, revoke) in the error hue. */
|
|
1222
|
-
variant?: MenuItemVariant;
|
|
1223
|
-
/** Indent the label into the indicator column so it aligns with checkbox/radio items in the same menu. */
|
|
1224
|
-
inset?: boolean;
|
|
1225
|
-
className?: string;
|
|
1226
|
-
}
|
|
1227
|
-
/**
|
|
1228
|
-
* One action in the menu. Children are free-form — a leading `<svg>` icon is
|
|
1229
|
-
* sized and muted automatically. Set `label` when children aren't plain text
|
|
1230
|
-
* so keyboard typeahead still matches, `disabled` for unavailable actions
|
|
1231
|
-
* (keep them visible so users can see what exists), and `closeOnClick={false}`
|
|
1232
|
-
* to keep the menu open after the action runs.
|
|
1233
|
-
*/
|
|
1234
|
-
declare const MenuItem: import("react").ForwardRefExoticComponent<MenuItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1235
|
-
interface MenuLinkItemProps extends Omit<ComponentPropsWithoutRef<typeof Menu$1.LinkItem>, "className"> {
|
|
1236
|
-
/** Indent the label into the indicator column so it aligns with checkbox/radio items in the same menu. */
|
|
1237
|
-
inset?: boolean;
|
|
1238
|
-
className?: string;
|
|
1239
|
-
}
|
|
1240
|
-
/**
|
|
1241
|
-
* A navigation entry that keeps link semantics — it renders a real `<a>`
|
|
1242
|
-
* (never a button styled as one), so it supports open-in-new-tab, copy link,
|
|
1243
|
-
* and middle-click. Pass `href` directly, or compose a client-side router
|
|
1244
|
-
* link via `render={<Link to="…" />}`.
|
|
1245
|
-
*/
|
|
1246
|
-
declare const MenuLinkItem: import("react").ForwardRefExoticComponent<MenuLinkItemProps & import("react").RefAttributes<HTMLAnchorElement>>;
|
|
1247
|
-
type MenuShortcutProps = HTMLAttributes<HTMLSpanElement>;
|
|
1248
|
-
/**
|
|
1249
|
-
* Right-aligned keyboard hint inside an item (`⌘N`, `Ctrl+D`). Purely
|
|
1250
|
-
* visual — it does not register the shortcut; wire the actual key handling
|
|
1251
|
-
* in the app. Helper text mirrors Typography caption.
|
|
1252
|
-
*/
|
|
1253
|
-
declare const MenuShortcut: import("react").ForwardRefExoticComponent<MenuShortcutProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
1254
|
-
interface MenuGroupProps extends Omit<ComponentPropsWithoutRef<typeof Menu$1.Group>, "className"> {
|
|
1255
|
-
className?: string;
|
|
1256
|
-
}
|
|
1257
|
-
/** Groups related items under a `MenuGroupLabel`, announced together by assistive technology. */
|
|
1258
|
-
declare const MenuGroup: import("react").ForwardRefExoticComponent<MenuGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1259
|
-
interface MenuGroupLabelProps extends Omit<ComponentPropsWithoutRef<typeof Menu$1.GroupLabel>, "className"> {
|
|
1260
|
-
/** Indent the label into the indicator column so it aligns with checkbox/radio items in the same menu. */
|
|
1261
|
-
inset?: boolean;
|
|
1262
|
-
className?: string;
|
|
1263
|
-
}
|
|
1264
|
-
/** Heading for a `MenuGroup` (or `MenuRadioGroup`) — visually a meta caption, wired to the group via `aria-labelledby`. */
|
|
1265
|
-
declare const MenuGroupLabel: import("react").ForwardRefExoticComponent<MenuGroupLabelProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1266
|
-
interface MenuSeparatorProps extends Omit<ComponentPropsWithoutRef<typeof Menu$1.Separator>, "className"> {
|
|
1267
|
-
className?: string;
|
|
1268
|
-
}
|
|
1269
|
-
/** Divider between item groups, exposed to screen readers as a separator. */
|
|
1270
|
-
declare const MenuSeparator: import("react").ForwardRefExoticComponent<MenuSeparatorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1271
|
-
interface MenuCheckboxItemProps extends Omit<ComponentPropsWithoutRef<typeof Menu$1.CheckboxItem>, "className"> {
|
|
1272
|
-
className?: string;
|
|
1273
|
-
}
|
|
1274
|
-
/**
|
|
1275
|
-
* An item that toggles a setting on or off — a check mark fills the leading
|
|
1276
|
-
* indicator column while `checked`. Control it with
|
|
1277
|
-
* `checked`/`defaultChecked`/`onCheckedChange`. It keeps the menu open on
|
|
1278
|
-
* click by default (Base UI's `closeOnClick={false}`) so several settings
|
|
1279
|
-
* can be flipped in one visit.
|
|
1280
|
-
*/
|
|
1281
|
-
declare const MenuCheckboxItem: import("react").ForwardRefExoticComponent<MenuCheckboxItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1282
|
-
interface MenuRadioGroupProps extends Omit<ComponentPropsWithoutRef<typeof Menu$1.RadioGroup>, "className"> {
|
|
1283
|
-
className?: string;
|
|
1284
|
-
}
|
|
1285
|
-
/**
|
|
1286
|
-
* Groups `MenuRadioItem`s into a single-choice set and owns its value:
|
|
1287
|
-
* `value`/`defaultValue`/`onValueChange(value, details)`. Label the set with
|
|
1288
|
-
* a `MenuGroupLabel` inside the group.
|
|
1289
|
-
*/
|
|
1290
|
-
declare const MenuRadioGroup: import("react").ForwardRefExoticComponent<MenuRadioGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1291
|
-
interface MenuRadioItemProps extends Omit<ComponentPropsWithoutRef<typeof Menu$1.RadioItem>, "className"> {
|
|
1292
|
-
className?: string;
|
|
1293
|
-
}
|
|
1294
|
-
/**
|
|
1295
|
-
* One option of a `MenuRadioGroup` — a dot fills the leading indicator
|
|
1296
|
-
* column while selected. `value` is required; the menu stays open on click
|
|
1297
|
-
* by default so the choice can be reconsidered without reopening.
|
|
1298
|
-
*/
|
|
1299
|
-
declare const MenuRadioItem: import("react").ForwardRefExoticComponent<MenuRadioItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1300
|
-
/**
|
|
1301
|
-
* Groups the parts of a nested menu; renders no HTML. Place it among the
|
|
1302
|
-
* parent's items with a `MenuSubmenuTrigger` and a nested `MenuPopup`
|
|
1303
|
-
* inside. Keep nesting to one level — deeper trees are hard to steer
|
|
1304
|
-
* (and to reach on touch screens). Accepts Base UI's SubmenuRoot props
|
|
1305
|
-
* (`open`/`defaultOpen`/`onOpenChange`, `disabled`, `closeParentOnEsc`).
|
|
1306
|
-
*/
|
|
1307
|
-
declare const MenuSubmenuRoot: typeof Menu$1.SubmenuRoot;
|
|
1308
|
-
type MenuSubmenuRootProps = ComponentPropsWithoutRef<typeof Menu$1.SubmenuRoot>;
|
|
1309
|
-
interface MenuSubmenuTriggerProps extends Omit<ComponentPropsWithoutRef<typeof Menu$1.SubmenuTrigger>, "className"> {
|
|
1310
|
-
/** Indent the label into the indicator column so it aligns with checkbox/radio items in the same menu. */
|
|
1311
|
-
inset?: boolean;
|
|
1312
|
-
className?: string;
|
|
1313
|
-
}
|
|
1314
|
-
/**
|
|
1315
|
-
* The item that opens a submenu — a trailing chevron is appended
|
|
1316
|
-
* automatically, and the row stays tinted (`data-popup-open`) while its
|
|
1317
|
-
* submenu is open. Opens on hover after a short delay, on click, and with
|
|
1318
|
-
* the right arrow key.
|
|
1319
|
-
*/
|
|
1320
|
-
declare const MenuSubmenuTrigger: import("react").ForwardRefExoticComponent<MenuSubmenuTriggerProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1321
|
-
//#endregion
|
|
1322
|
-
//#region src/components/ContextMenu/ContextMenu.d.ts
|
|
1323
|
-
/**
|
|
1324
|
-
* Groups the context menu parts and owns the open state. The menu opens at
|
|
1325
|
-
* the pointer from a right click — or a long press on touch — anywhere
|
|
1326
|
-
* inside `ContextMenuTrigger`. Base UI's `ContextMenu.Root` re-exported
|
|
1327
|
-
* unchanged: `open`/`defaultOpen`/`onOpenChange(open, details)`, `disabled`,
|
|
1328
|
-
* `loopFocus`, `orientation`, and `highlightItemOnHover` are all available.
|
|
1329
|
-
* A context menu is an invisible shortcut — keep a visible path (a kebab
|
|
1330
|
-
* `Menu`, toolbar buttons) to the same actions.
|
|
1331
|
-
*/
|
|
1332
|
-
declare const ContextMenu: typeof ContextMenu$1.Root;
|
|
1333
|
-
type ContextMenuProps = ComponentPropsWithoutRef<typeof ContextMenu$1.Root>;
|
|
1334
|
-
interface ContextMenuTriggerProps extends Omit<ComponentPropsWithoutRef<typeof ContextMenu$1.Trigger>, "className"> {
|
|
1335
|
-
className?: string;
|
|
1336
|
-
}
|
|
1337
|
-
/**
|
|
1338
|
-
* The region the menu acts on. It opens on right click, on the context-menu
|
|
1339
|
-
* key / Shift+F10 (the browser fires `contextmenu` for these while focus is
|
|
1340
|
-
* inside the region), and on a 500ms long press on touch — movement cancels
|
|
1341
|
-
* the press, and the iOS callout is suppressed automatically. Renders an
|
|
1342
|
-
* unstyled `<div>` around its children; make an existing element the region
|
|
1343
|
-
* via `render`:
|
|
1344
|
-
*
|
|
1345
|
-
* <ContextMenuTrigger render={<tr />}>…</ContextMenuTrigger>
|
|
1346
|
-
*
|
|
1347
|
-
* While its menu is open the element carries `data-popup-open` — the hook
|
|
1348
|
-
* for a "this is the target" outline. Keep something inside the region
|
|
1349
|
-
* focusable so keyboard users can reach the menu, and consider `select-none`
|
|
1350
|
-
* on touch-first surfaces so a long press doesn't also start text selection.
|
|
1351
|
-
*/
|
|
1352
|
-
declare const ContextMenuTrigger: import("react").ForwardRefExoticComponent<ContextMenuTriggerProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1353
|
-
type BasePositionerProps$2 = ComponentPropsWithoutRef<typeof ContextMenu$1.Positioner>;
|
|
1354
|
-
type ContextMenuSide = NonNullable<BasePositionerProps$2["side"]>;
|
|
1355
|
-
type ContextMenuAlign = NonNullable<BasePositionerProps$2["align"]>;
|
|
1356
|
-
interface ContextMenuPopupProps extends Omit<ComponentPropsWithoutRef<typeof ContextMenu$1.Popup>, "className"> {
|
|
1357
|
-
/**
|
|
1358
|
-
* Side of the pointer (or `anchor`) to place the popup on. Leave unset for
|
|
1359
|
-
* context-menu behavior: below the cursor, shifting — not flipping — along
|
|
1360
|
-
* the edges to stay in the viewport; submenus resolve to the inline end.
|
|
1361
|
-
*/
|
|
1362
|
-
side?: ContextMenuSide;
|
|
1363
|
-
/**
|
|
1364
|
-
* How the popup lines up along the chosen side. Unset defaults to `start`,
|
|
1365
|
-
* so the popup's corner sits at the cursor (submenus align to the trigger
|
|
1366
|
-
* row instead).
|
|
1367
|
-
*/
|
|
1368
|
-
align?: ContextMenuAlign;
|
|
1369
|
-
/**
|
|
1370
|
-
* Distance to the anchor in pixels. Unset defaults adapt: Base UI's
|
|
1371
|
-
* pointer-tuned 5px overlap at the root, a 4px panel overlap for submenus.
|
|
1372
|
-
* When `side` is set explicitly the default is 0 — the popup edge stays
|
|
1373
|
-
* exactly at the pointer.
|
|
1374
|
-
*/
|
|
1375
|
-
sideOffset?: BasePositionerProps$2["sideOffset"];
|
|
1376
|
-
/**
|
|
1377
|
-
* Additional shift along the alignment axis in pixels. Unset defaults
|
|
1378
|
-
* adapt: 2px past the cursor at the root, -4px for submenus so the first
|
|
1379
|
-
* item meets the trigger row. 0 when `side` is set explicitly.
|
|
1380
|
-
*/
|
|
1381
|
-
alignOffset?: BasePositionerProps$2["alignOffset"];
|
|
1382
|
-
/** Minimum space kept from the viewport (or collision boundary) edges when repositioning. */
|
|
1383
|
-
collisionPadding?: BasePositionerProps$2["collisionPadding"];
|
|
1384
|
-
/**
|
|
1385
|
-
* Position against an element (or virtual element) instead of the pointer —
|
|
1386
|
-
* e.g. pin the menu to the card that was right-clicked so it opens in the
|
|
1387
|
-
* same place regardless of where inside it the click landed.
|
|
1388
|
-
*/
|
|
1389
|
-
anchor?: BasePositionerProps$2["anchor"];
|
|
1390
|
-
/** Keep the popup in the DOM while closed — for SEO or measuring; closed popups normally unmount. */
|
|
1391
|
-
keepMounted?: boolean;
|
|
1392
|
-
/** Portal destination. Defaults to `document.body`. */
|
|
1393
|
-
container?: ComponentPropsWithoutRef<typeof ContextMenu$1.Portal>["container"];
|
|
1394
|
-
/**
|
|
1395
|
-
* Applied to the popup panel. Width hooks: the panel is content-sized from
|
|
1396
|
-
* 8rem up — set `w-*`/`max-w-*` for a fixed width. Long menus scroll
|
|
1397
|
-
* inside the panel; cap them earlier with `max-h-*`.
|
|
1398
|
-
*/
|
|
1399
|
-
className?: string;
|
|
1400
|
-
}
|
|
1401
|
-
/**
|
|
1402
|
-
* The floating list of items, with the portal and positioning plumbing
|
|
1403
|
-
* folded in. Anchored to the pointer by default — the panel's corner lands
|
|
1404
|
-
* at the cursor and shifts (rather than flips) at viewport edges, matching
|
|
1405
|
-
* OS context menus; opens with a motion-safe scale/fade. The same component
|
|
1406
|
-
* nests inside `ContextMenuSubmenuRoot`, where its placement defaults switch
|
|
1407
|
-
* to the shared submenu conventions (inline-end side, overlapped edges,
|
|
1408
|
-
* trigger-row alignment). The panel recipe is shared with `MenuPopup`, so
|
|
1409
|
-
* context menus and action menus look identical.
|
|
1410
|
-
*/
|
|
1411
|
-
declare const ContextMenuPopup: import("react").ForwardRefExoticComponent<ContextMenuPopupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1412
|
-
/** One action in the menu — `MenuItem` shared as-is: same `variant`/`inset` props, icon slot, and 32px rows. */
|
|
1413
|
-
declare const ContextMenuItem: import("react").ForwardRefExoticComponent<MenuItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1414
|
-
type ContextMenuItemProps = MenuItemProps;
|
|
1415
|
-
type ContextMenuItemVariant = MenuItemVariant;
|
|
1416
|
-
/** A navigation entry that keeps real `<a>` semantics — `MenuLinkItem` shared as-is. */
|
|
1417
|
-
declare const ContextMenuLinkItem: import("react").ForwardRefExoticComponent<MenuLinkItemProps & import("react").RefAttributes<HTMLAnchorElement>>;
|
|
1418
|
-
type ContextMenuLinkItemProps = MenuLinkItemProps;
|
|
1419
|
-
/** Right-aligned keyboard hint inside an item — `MenuShortcut` shared as-is (visual only; wire the key handling in the app). */
|
|
1420
|
-
declare const ContextMenuShortcut: import("react").ForwardRefExoticComponent<MenuShortcutProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
1421
|
-
type ContextMenuShortcutProps = MenuShortcutProps;
|
|
1422
|
-
/** Groups related items under a `ContextMenuGroupLabel` — `MenuGroup` shared as-is. */
|
|
1423
|
-
declare const ContextMenuGroup: import("react").ForwardRefExoticComponent<MenuGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1424
|
-
type ContextMenuGroupProps = MenuGroupProps;
|
|
1425
|
-
/** Heading for a group, wired via `aria-labelledby` — `MenuGroupLabel` shared as-is. */
|
|
1426
|
-
declare const ContextMenuGroupLabel: import("react").ForwardRefExoticComponent<MenuGroupLabelProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1427
|
-
type ContextMenuGroupLabelProps = MenuGroupLabelProps;
|
|
1428
|
-
/** Divider between item groups — `MenuSeparator` shared as-is. */
|
|
1429
|
-
declare const ContextMenuSeparator: import("react").ForwardRefExoticComponent<MenuSeparatorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1430
|
-
type ContextMenuSeparatorProps = MenuSeparatorProps;
|
|
1431
|
-
/** An item that toggles a setting and keeps the menu open — `MenuCheckboxItem` shared as-is. */
|
|
1432
|
-
declare const ContextMenuCheckboxItem: import("react").ForwardRefExoticComponent<MenuCheckboxItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1433
|
-
type ContextMenuCheckboxItemProps = MenuCheckboxItemProps;
|
|
1434
|
-
/** Single-choice set for `ContextMenuRadioItem`s — `MenuRadioGroup` shared as-is. */
|
|
1435
|
-
declare const ContextMenuRadioGroup: import("react").ForwardRefExoticComponent<MenuRadioGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1436
|
-
type ContextMenuRadioGroupProps = MenuRadioGroupProps;
|
|
1437
|
-
/** One option of a radio group — `MenuRadioItem` shared as-is. */
|
|
1438
|
-
declare const ContextMenuRadioItem: import("react").ForwardRefExoticComponent<MenuRadioItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1439
|
-
type ContextMenuRadioItemProps = MenuRadioItemProps;
|
|
1440
|
-
/** Groups the parts of a nested menu; renders no HTML — `MenuSubmenuRoot` shared as-is. Keep nesting to one level. */
|
|
1441
|
-
declare const ContextMenuSubmenuRoot: typeof ContextMenu$1.SubmenuRoot;
|
|
1442
|
-
type ContextMenuSubmenuRootProps = MenuSubmenuRootProps;
|
|
1443
|
-
/** The item that opens a submenu (chevron appended, row tinted while open) — `MenuSubmenuTrigger` shared as-is. */
|
|
1444
|
-
declare const ContextMenuSubmenuTrigger: import("react").ForwardRefExoticComponent<MenuSubmenuTriggerProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1445
|
-
type ContextMenuSubmenuTriggerProps = MenuSubmenuTriggerProps;
|
|
1446
|
-
//#endregion
|
|
1447
|
-
//#region src/components/Popover/Popover.d.ts
|
|
1448
|
-
/**
|
|
1449
|
-
* Groups the popover parts and owns the open state. Accepts Base UI's Root
|
|
1450
|
-
* props: `open`/`defaultOpen`/`onOpenChange` for control, `modal` to lock
|
|
1451
|
-
* scroll or trap focus, and `handle`/`triggerId` for detached triggers.
|
|
1452
|
-
*/
|
|
1453
|
-
declare const Popover: typeof Popover$1.Root;
|
|
1454
|
-
type PopoverProps = ComponentPropsWithoutRef<typeof Popover$1.Root>;
|
|
1455
|
-
/**
|
|
1456
|
-
* Creates a handle that links `Popover` with `PopoverTrigger`s rendered
|
|
1457
|
-
* elsewhere in the tree (toolbars, table rows). Triggers may attach a
|
|
1458
|
-
* `payload`, which the `Popover` children render function receives.
|
|
1459
|
-
*/
|
|
1460
|
-
declare const createPopoverHandle: typeof Popover$1.createHandle;
|
|
1461
|
-
type PopoverHandle<Payload = unknown> = Popover$1.Handle<Payload>;
|
|
1462
|
-
interface PopoverTriggerProps extends Omit<ComponentPropsWithoutRef<typeof Popover$1.Trigger>, "className"> {
|
|
1463
|
-
className?: string;
|
|
1464
|
-
}
|
|
1465
|
-
/**
|
|
1466
|
-
* The button that opens the popover. Ships unstyled so the visual comes from
|
|
1467
|
-
* composition — render the design system's Button:
|
|
1468
|
-
*
|
|
1469
|
-
* <PopoverTrigger render={<Button variant="outline" />}>Filters</PopoverTrigger>
|
|
1470
|
-
*
|
|
1471
|
-
* While its popup is open the element carries `data-popup-open`, the hook for
|
|
1472
|
-
* a pressed look (e.g. `className="data-popup-open:bg-muted"`). Hover-card
|
|
1473
|
-
* behavior comes from `openOnHover` with its `delay`/`closeDelay` (300/0ms
|
|
1474
|
-
* defaults) — reserve it for previews; interactive content should open on
|
|
1475
|
-
* click so it can't vanish mid-interaction.
|
|
1476
|
-
*/
|
|
1477
|
-
declare const PopoverTrigger: import("react").ForwardRefExoticComponent<PopoverTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1478
|
-
type BasePositionerProps$1 = ComponentPropsWithoutRef<typeof Popover$1.Positioner>;
|
|
1479
|
-
type PopoverSide = NonNullable<BasePositionerProps$1["side"]>;
|
|
1480
|
-
type PopoverAlign = NonNullable<BasePositionerProps$1["align"]>;
|
|
1481
|
-
interface PopoverPopupVariantsOptions {
|
|
1482
|
-
className?: string;
|
|
1483
|
-
}
|
|
1484
|
-
/**
|
|
1485
|
-
* Class list for an element styled as the popover panel — for floating
|
|
1486
|
-
* surfaces that don't come from Base UI (static previews, custom
|
|
1487
|
-
* floating-ui popups) so every popup in the product shares one look.
|
|
1488
|
-
*/
|
|
1489
|
-
declare function popoverPopupVariants({ className }?: PopoverPopupVariantsOptions): string;
|
|
1490
|
-
interface PopoverPopupProps extends Omit<ComponentPropsWithoutRef<typeof Popover$1.Popup>, "className"> {
|
|
1491
|
-
/** Side of the anchor to place the popup on; flips automatically when there is no room. */
|
|
1492
|
-
side?: PopoverSide;
|
|
1493
|
-
/** How the popup lines up along the chosen side. */
|
|
1494
|
-
align?: PopoverAlign;
|
|
1495
|
-
/** Gap between anchor and popup in pixels. The default 8px leaves room for the `arrow`. */
|
|
1496
|
-
sideOffset?: BasePositionerProps$1["sideOffset"];
|
|
1497
|
-
/** Additional shift along the alignment axis in pixels. */
|
|
1498
|
-
alignOffset?: BasePositionerProps$1["alignOffset"];
|
|
1499
|
-
/** Minimum space kept from the viewport (or collision boundary) edges when repositioning. */
|
|
1500
|
-
collisionPadding?: BasePositionerProps$1["collisionPadding"];
|
|
1501
|
-
/** Position against this element instead of the trigger (e.g. an input while a toolbar button opens the popup). */
|
|
1502
|
-
anchor?: BasePositionerProps$1["anchor"];
|
|
1503
|
-
/** Keep the popup in the DOM while closed — for SEO or measuring; closed popups normally unmount. */
|
|
1504
|
-
keepMounted?: boolean;
|
|
1505
|
-
/**
|
|
1506
|
-
* Portal destination. Defaults to `document.body`. When the popover renders
|
|
1507
|
-
* open on first paint (`defaultOpen`) and the container mounts in the same
|
|
1508
|
-
* commit, pass the element via callback-ref state — a `RefObject` to an
|
|
1509
|
-
* ancestor is not attached yet when the portal first resolves, and it would
|
|
1510
|
-
* silently fall back to `document.body`.
|
|
1511
|
-
*/
|
|
1512
|
-
container?: ComponentPropsWithoutRef<typeof Popover$1.Portal>["container"];
|
|
1513
|
-
/** Show a caret pointing at the anchor. */
|
|
1514
|
-
arrow?: boolean;
|
|
1515
|
-
/**
|
|
1516
|
-
* Applied to the popup panel. Sizing hooks: the panel is content-sized up
|
|
1517
|
-
* to 20rem — set `w-*`/`max-w-*` to change that, `w-[var(--anchor-width)]`
|
|
1518
|
-
* to match the trigger width, or an inner `max-h-* overflow-y-auto`
|
|
1519
|
-
* wrapper for scrollable content (the panel itself must not clip — the
|
|
1520
|
-
* arrow hangs outside it).
|
|
1521
|
-
*/
|
|
1522
|
-
className?: string;
|
|
1523
|
-
}
|
|
1524
|
-
/**
|
|
1525
|
-
* The floating panel, with the portal and positioning plumbing folded in.
|
|
1526
|
-
* Anchored to its trigger by default; opens with a motion-safe scale/fade
|
|
1527
|
-
* from the anchor-facing corner. When the popover holds no `PopoverTitle`,
|
|
1528
|
-
* name the panel for assistive tech with `aria-label`.
|
|
1529
|
-
*/
|
|
1530
|
-
declare const PopoverPopup: import("react").ForwardRefExoticComponent<PopoverPopupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1531
|
-
interface PopoverTitleProps extends Omit<ComponentPropsWithoutRef<typeof Popover$1.Title>, "className"> {
|
|
1532
|
-
className?: string;
|
|
1533
|
-
}
|
|
1534
|
-
/**
|
|
1535
|
-
* Heading that names the popup — Base UI wires it to the panel via
|
|
1536
|
-
* `aria-labelledby` automatically. An `<h2>` by default; pick the level from
|
|
1537
|
-
* the surrounding outline with `render`, e.g. `render={<h3 />}`.
|
|
1538
|
-
*/
|
|
1539
|
-
declare const PopoverTitle: import("react").ForwardRefExoticComponent<PopoverTitleProps & import("react").RefAttributes<HTMLHeadingElement>>;
|
|
1540
|
-
interface PopoverDescriptionProps extends Omit<ComponentPropsWithoutRef<typeof Popover$1.Description>, "className"> {
|
|
1541
|
-
className?: string;
|
|
1542
|
-
}
|
|
1543
|
-
/**
|
|
1544
|
-
* Supporting copy announced with the popup — Base UI wires it via
|
|
1545
|
-
* `aria-describedby` automatically.
|
|
1546
|
-
*/
|
|
1547
|
-
declare const PopoverDescription: import("react").ForwardRefExoticComponent<PopoverDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>>;
|
|
1548
|
-
interface PopoverCloseProps extends Omit<ComponentPropsWithoutRef<typeof Popover$1.Close>, "className"> {
|
|
1549
|
-
className?: string;
|
|
1550
|
-
}
|
|
1551
|
-
/**
|
|
1552
|
-
* A button that closes the popup. Unstyled, like the trigger — compose the
|
|
1553
|
-
* design system's Button for footer actions:
|
|
1554
|
-
*
|
|
1555
|
-
* <PopoverClose render={<Button size="sm" variant="outline" />}>Done</PopoverClose>
|
|
1556
|
-
*
|
|
1557
|
-
* or borrow its classes for a corner icon dismiss, which needs an accessible
|
|
1558
|
-
* name:
|
|
1559
|
-
*
|
|
1560
|
-
* <PopoverClose aria-label="Close" className={buttonVariants({ variant: "ghost", size: "sm", iconOnly: true })}>
|
|
1561
|
-
* <XIcon />
|
|
1562
|
-
* </PopoverClose>
|
|
1563
|
-
*/
|
|
1564
|
-
declare const PopoverClose: import("react").ForwardRefExoticComponent<PopoverCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1565
|
-
//#endregion
|
|
1566
|
-
//#region src/components/DatePicker/DatePicker.d.ts
|
|
1567
|
-
type DatePickerVariant = "outline" | "ghost";
|
|
1568
|
-
type DatePickerSize = "sm" | "md" | "lg";
|
|
1569
|
-
type BaseTriggerProps$1 = ComponentPropsWithoutRef<typeof PopoverTrigger>;
|
|
1570
|
-
type BaseRootProps$1 = ComponentPropsWithoutRef<typeof Popover>;
|
|
1571
|
-
type SingleCalendarProps = Extract<CalendarProps, {
|
|
1572
|
-
mode?: "single";
|
|
1573
|
-
}>;
|
|
1574
|
-
/**
|
|
1575
|
-
* Calendar configuration accepted by DatePicker. Selection, locale, and
|
|
1576
|
-
* disabled/read-only state stay owned by DatePicker so trigger and grid can
|
|
1577
|
-
* never drift apart.
|
|
1578
|
-
*/
|
|
1579
|
-
interface DatePickerCalendarProps extends Omit<SingleCalendarProps, "mode" | "value" | "defaultValue" | "onValueChange" | "allowDeselect" | "disabled" | "readOnly" | "locale"> {}
|
|
1580
|
-
/** Popup positioning, focus, portal, and ARIA options forwarded to `PopoverPopup`. */
|
|
1581
|
-
interface DatePickerPopupProps extends Omit<PopoverPopupProps, "children" | "className"> {}
|
|
1582
|
-
interface DatePickerVariantsOptions {
|
|
1583
|
-
/** Visual style of the trigger. */
|
|
1584
|
-
variant?: DatePickerVariant;
|
|
1585
|
-
/** Control height. */
|
|
1586
|
-
size?: DatePickerSize;
|
|
1587
|
-
/** Stretch the trigger to fill its container. */
|
|
1588
|
-
fullWidth?: boolean;
|
|
1589
|
-
/** Additional classes merged after the variant recipe. */
|
|
1590
|
-
className?: string;
|
|
1591
|
-
}
|
|
1592
|
-
/** Class list for an element styled as the DatePicker trigger. */
|
|
1593
|
-
declare function datePickerVariants({ variant, size, fullWidth, className }?: DatePickerVariantsOptions): string;
|
|
1594
|
-
interface DatePickerProps extends Omit<BaseTriggerProps$1, "children" | "className" | "defaultValue" | "disabled" | "form" | "name" | "value"> {
|
|
1595
|
-
/** Selected local calendar date (controlled). `null` represents no selection. */
|
|
1596
|
-
value?: Date | null;
|
|
1597
|
-
/** Initial selected local calendar date (uncontrolled). */
|
|
1598
|
-
defaultValue?: Date | null;
|
|
1599
|
-
/** Called when a day is selected, or with `null` when `allowDeselect` clears it. */
|
|
1600
|
-
onValueChange?: (value: Date | null) => void;
|
|
1601
|
-
/** Let selecting the chosen day again clear the value. @default false */
|
|
1602
|
-
allowDeselect?: boolean;
|
|
1603
|
-
/** Whether the calendar popup is open (controlled). */
|
|
1604
|
-
open?: BaseRootProps$1["open"];
|
|
1605
|
-
/** Whether the calendar popup starts open (uncontrolled). @default false */
|
|
1606
|
-
defaultOpen?: BaseRootProps$1["defaultOpen"];
|
|
1607
|
-
/** Called whenever Base UI requests that the popup open or close. */
|
|
1608
|
-
onOpenChange?: BaseRootProps$1["onOpenChange"];
|
|
1609
|
-
/** Called after the popup's opening or closing animation completes. */
|
|
1610
|
-
onOpenChangeComplete?: BaseRootProps$1["onOpenChangeComplete"];
|
|
1611
|
-
/** Close the popup after a date is selected or deselected. @default true */
|
|
1612
|
-
closeOnSelect?: boolean;
|
|
1613
|
-
/** Text shown while no date is selected. Localize this consumer-owned string. @default "Pick a date" */
|
|
1614
|
-
placeholder?: string;
|
|
1615
|
-
/**
|
|
1616
|
-
* BCP-47 locale used by the trigger formatter and Calendar. Defaults to the
|
|
1617
|
-
* runtime locale.
|
|
1618
|
-
*/
|
|
1619
|
-
locale?: string;
|
|
1620
|
-
/** Options passed to `Intl.DateTimeFormat` for the trigger value. @default { dateStyle: "medium" } */
|
|
1621
|
-
formatOptions?: Intl.DateTimeFormatOptions;
|
|
1622
|
-
/** Replace the default `Intl.DateTimeFormat` trigger text. Must return an accessible text label. */
|
|
1623
|
-
formatValue?: (date: Date, locale: string | undefined) => string;
|
|
1624
|
-
/** Accessible name for the calendar popup and date grid. Localize it. @default "Choose date" */
|
|
1625
|
-
calendarLabel?: string;
|
|
1626
|
-
/** Calendar behavior and layout options; DatePicker keeps selection/state props synchronized itself. */
|
|
1627
|
-
calendarProps?: DatePickerCalendarProps;
|
|
1628
|
-
/** Popover positioning, portal, focus, and ARIA options. Defaults to bottom-start alignment. */
|
|
1629
|
-
popupProps?: DatePickerPopupProps;
|
|
1630
|
-
/** Additional classes for the calendar popup panel. */
|
|
1631
|
-
popupClassName?: string;
|
|
1632
|
-
/** Visual style: `outline` is input-like; `ghost` suits toolbars and inline filters. */
|
|
1633
|
-
variant?: DatePickerVariant;
|
|
1634
|
-
/** Trigger height. `sm` (32px) meets WCAG 2.5.8 AA; prefer `md`/`lg` for touch-first surfaces. */
|
|
1635
|
-
size?: DatePickerSize;
|
|
1636
|
-
/** Stretch the trigger to fill its container. `anchorWidth` or consumer `style.width` can override it. */
|
|
1637
|
-
fullWidth?: boolean;
|
|
1638
|
-
/**
|
|
1639
|
-
* CSS width of the trigger. Accepts pixels or any CSS width such as
|
|
1640
|
-
* `"18rem"`, `"100%"`, or `"max-content"`.
|
|
1641
|
-
*/
|
|
1642
|
-
anchorWidth?: CSSProperties["width"];
|
|
1643
|
-
/** Replaces the decorative calendar icon. Pass `null` to hide it. */
|
|
1644
|
-
icon?: ReactNode;
|
|
1645
|
-
/** Disable the trigger and calendar; a named hidden input is omitted from form submission. */
|
|
1646
|
-
disabled?: boolean;
|
|
1647
|
-
/** Keep the picker openable and navigable while preventing date changes. */
|
|
1648
|
-
readOnly?: boolean;
|
|
1649
|
-
/**
|
|
1650
|
-
* Name used to submit the selected date through a hidden input as local
|
|
1651
|
-
* `YYYY-MM-DD`. Native required validation is intentionally left to the
|
|
1652
|
-
* surrounding form-field abstraction.
|
|
1653
|
-
*/
|
|
1654
|
-
name?: string;
|
|
1655
|
-
/** ID of the form associated with both the trigger and the hidden date input. */
|
|
1656
|
-
form?: string;
|
|
1657
|
-
/** Additional classes merged onto the trigger. */
|
|
1658
|
-
className?: string;
|
|
1659
|
-
}
|
|
1660
|
-
/**
|
|
1661
|
-
* A localized date trigger with a Calendar in a Base UI Popover.
|
|
1662
|
-
*
|
|
1663
|
-
* The visible trigger text is always its baseline accessible name. Add
|
|
1664
|
-
* `aria-label`/`aria-labelledby` when surrounding context (for example,
|
|
1665
|
-
* "Departure date") must be part of the name.
|
|
1666
|
-
*/
|
|
1667
|
-
declare const DatePicker: import("react").ForwardRefExoticComponent<DatePickerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1668
|
-
//#endregion
|
|
1669
|
-
//#region src/components/DateRangePicker/DateRangePicker.d.ts
|
|
1670
|
-
type DateRangePickerVariant = DatePickerVariant;
|
|
1671
|
-
type DateRangePickerSize = DatePickerSize;
|
|
1672
|
-
type BaseTriggerProps = ComponentPropsWithoutRef<typeof PopoverTrigger>;
|
|
1673
|
-
type BaseRootProps = ComponentPropsWithoutRef<typeof Popover>;
|
|
1674
|
-
type RangeCalendarProps = Extract<CalendarProps, {
|
|
1675
|
-
mode: "range";
|
|
1676
|
-
}>;
|
|
1677
|
-
/**
|
|
1678
|
-
* Calendar configuration accepted by DateRangePicker. Selection, locale, and
|
|
1679
|
-
* disabled/read-only state stay owned by DateRangePicker so trigger and grid
|
|
1680
|
-
* can never drift apart.
|
|
1681
|
-
*/
|
|
1682
|
-
interface DateRangePickerCalendarProps extends Omit<RangeCalendarProps, "mode" | "value" | "defaultValue" | "onValueChange" | "disabled" | "readOnly" | "locale"> {}
|
|
1683
|
-
/** Popup positioning, focus, portal, and ARIA options forwarded to `PopoverPopup`. */
|
|
1684
|
-
interface DateRangePickerPopupProps extends Omit<PopoverPopupProps, "children" | "className"> {}
|
|
1685
|
-
interface DateRangePickerVariantsOptions {
|
|
1686
|
-
/** Visual style of the trigger. */
|
|
1687
|
-
variant?: DateRangePickerVariant;
|
|
1688
|
-
/** Control height. */
|
|
1689
|
-
size?: DateRangePickerSize;
|
|
1690
|
-
/** Stretch the trigger to fill its container. */
|
|
1691
|
-
fullWidth?: boolean;
|
|
1692
|
-
/** Additional classes merged after the variant recipe. */
|
|
1693
|
-
className?: string;
|
|
1694
|
-
}
|
|
1695
|
-
/** Class list for an element styled as the DateRangePicker trigger. */
|
|
1696
|
-
declare function dateRangePickerVariants({ variant, size, fullWidth, className }?: DateRangePickerVariantsOptions): string;
|
|
1697
|
-
interface DateRangePickerProps extends Omit<BaseTriggerProps, "children" | "className" | "defaultValue" | "disabled" | "form" | "name" | "value"> {
|
|
1698
|
-
/** Selected inclusive local-calendar range (controlled). `null` represents no selection. */
|
|
1699
|
-
value?: CalendarDateRange | null;
|
|
1700
|
-
/** Initial selected inclusive local-calendar range (uncontrolled). */
|
|
1701
|
-
defaultValue?: CalendarDateRange | null;
|
|
1702
|
-
/** Called with an ordered, complete range after its second date is chosen. */
|
|
1703
|
-
onValueChange?: (value: CalendarDateRange | null) => void;
|
|
1704
|
-
/** Whether the calendar popup is open (controlled). */
|
|
1705
|
-
open?: BaseRootProps["open"];
|
|
1706
|
-
/** Whether the calendar popup starts open (uncontrolled). @default false */
|
|
1707
|
-
defaultOpen?: BaseRootProps["defaultOpen"];
|
|
1708
|
-
/** Called whenever Base UI requests that the popup open or close. */
|
|
1709
|
-
onOpenChange?: BaseRootProps["onOpenChange"];
|
|
1710
|
-
/** Called after the popup's opening or closing animation completes. */
|
|
1711
|
-
onOpenChangeComplete?: BaseRootProps["onOpenChangeComplete"];
|
|
1712
|
-
/** Close the popup after the range's second date is selected. @default true */
|
|
1713
|
-
closeOnSelect?: boolean;
|
|
1714
|
-
/** Text shown while no complete range is selected. Localize this consumer-owned string. @default "Pick a date range" */
|
|
1715
|
-
placeholder?: string;
|
|
1716
|
-
/**
|
|
1717
|
-
* BCP-47 locale used by the trigger formatter and Calendar. Defaults to the
|
|
1718
|
-
* runtime locale.
|
|
1719
|
-
*/
|
|
1720
|
-
locale?: string;
|
|
1721
|
-
/** Options passed to `Intl.DateTimeFormat` for the trigger range. @default { dateStyle: "medium" } */
|
|
1722
|
-
formatOptions?: Intl.DateTimeFormatOptions;
|
|
1723
|
-
/** Replace the default localized trigger text. Must return an accessible plain-text label. */
|
|
1724
|
-
formatValue?: (range: CalendarDateRange, locale: string | undefined) => string;
|
|
1725
|
-
/** Accessible name for the calendar popup and date grids. Localize it. @default "Choose date range" */
|
|
1726
|
-
calendarLabel?: string;
|
|
1727
|
-
/** Calendar behavior and layout options; selection/state props stay synchronized by DateRangePicker. */
|
|
1728
|
-
calendarProps?: DateRangePickerCalendarProps;
|
|
1729
|
-
/** Popover positioning, portal, focus, and ARIA options. Defaults to bottom-start alignment. */
|
|
1730
|
-
popupProps?: DateRangePickerPopupProps;
|
|
1731
|
-
/** Additional classes for the calendar popup panel. */
|
|
1732
|
-
popupClassName?: string;
|
|
1733
|
-
/** Visual style: `outline` is input-like; `ghost` suits toolbars and inline filters. */
|
|
1734
|
-
variant?: DateRangePickerVariant;
|
|
1735
|
-
/** Trigger height. `sm` (32px) meets WCAG 2.5.8 AA; prefer `md`/`lg` for touch-first surfaces. */
|
|
1736
|
-
size?: DateRangePickerSize;
|
|
1737
|
-
/** Stretch the trigger to fill its container. `anchorWidth` or consumer `style.width` can override it. */
|
|
1738
|
-
fullWidth?: boolean;
|
|
1739
|
-
/**
|
|
1740
|
-
* CSS width of the trigger. Accepts pixels or any CSS width such as
|
|
1741
|
-
* `"20rem"`, `"100%"`, or `"max-content"`.
|
|
1742
|
-
*/
|
|
1743
|
-
anchorWidth?: CSSProperties["width"];
|
|
1744
|
-
/** Replaces the decorative calendar icon. Pass `null` to hide it. */
|
|
1745
|
-
icon?: ReactNode;
|
|
1746
|
-
/** Disable the trigger and calendar; named hidden inputs are omitted from form submission. */
|
|
1747
|
-
disabled?: boolean;
|
|
1748
|
-
/** Keep the picker openable and navigable while preventing range changes. */
|
|
1749
|
-
readOnly?: boolean;
|
|
1750
|
-
/** Name used to submit the range start as a local `YYYY-MM-DD` hidden value. */
|
|
1751
|
-
startName?: string;
|
|
1752
|
-
/** Name used to submit the range end as a local `YYYY-MM-DD` hidden value. */
|
|
1753
|
-
endName?: string;
|
|
1754
|
-
/** ID of the form associated with the trigger and both hidden date inputs. */
|
|
1755
|
-
form?: string;
|
|
1756
|
-
/** Additional classes merged onto the trigger. */
|
|
1757
|
-
className?: string;
|
|
1758
|
-
}
|
|
1759
|
-
/**
|
|
1760
|
-
* A localized date-range trigger with an ArcFusion Calendar in a Base UI Popover.
|
|
1761
|
-
*
|
|
1762
|
-
* The visible trigger text is always its baseline accessible name. Add
|
|
1763
|
-
* `aria-label`/`aria-labelledby` when surrounding context (for example,
|
|
1764
|
-
* "Booking dates") must be part of the name.
|
|
1765
|
-
*/
|
|
1766
|
-
declare const DateRangePicker: import("react").ForwardRefExoticComponent<DateRangePickerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1767
|
-
//#endregion
|
|
1768
|
-
//#region src/components/Dialog/Dialog.d.ts
|
|
1769
|
-
type DialogSize = "sm" | "md" | "lg" | "full";
|
|
1770
|
-
type DialogScrollBehavior = "inside" | "outside";
|
|
1771
|
-
/**
|
|
1772
|
-
* Groups all parts of the dialog and owns its state. Renders no DOM.
|
|
1773
|
-
*
|
|
1774
|
-
* This is Base UI's `Dialog.Root` re-exported unchanged, so every root
|
|
1775
|
-
* feature is available: `open`/`defaultOpen`/`onOpenChange(open, details)`,
|
|
1776
|
-
* `modal` (`true` | `false` | `"trap-focus"`), `disablePointerDismissal`,
|
|
1777
|
-
* `onOpenChangeComplete`, `actionsRef`, and detached triggers via
|
|
1778
|
-
* `Dialog.createHandle()` payloads.
|
|
1779
|
-
*/
|
|
1780
|
-
declare const Dialog: typeof Dialog$1.Root;
|
|
1781
|
-
type DialogProps = Dialog$1.Root.Props;
|
|
1782
|
-
interface DialogTriggerProps extends Omit<ComponentPropsWithoutRef<typeof Dialog$1.Trigger>, "className"> {
|
|
1783
|
-
className?: string;
|
|
1784
|
-
}
|
|
1785
|
-
/**
|
|
1786
|
-
* Opens the dialog. Renders an unstyled `<button>` and exposes
|
|
1787
|
-
* `data-popup-open` while its dialog is open — compose it with Button for
|
|
1788
|
-
* the usual look: `<DialogTrigger render={<Button>Open</Button>} />`.
|
|
1789
|
-
*/
|
|
1790
|
-
declare const DialogTrigger: import("react").ForwardRefExoticComponent<DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1791
|
-
interface DialogCloseProps extends Omit<ComponentPropsWithoutRef<typeof Dialog$1.Close>, "className"> {
|
|
1792
|
-
className?: string;
|
|
1793
|
-
}
|
|
1794
|
-
/**
|
|
1795
|
-
* Closes the dialog. Renders an unstyled `<button>` — compose it with
|
|
1796
|
-
* Button for footer actions:
|
|
1797
|
-
* `<DialogClose render={<Button variant="outline">Cancel</Button>} />`.
|
|
1798
|
-
*/
|
|
1799
|
-
declare const DialogClose: import("react").ForwardRefExoticComponent<DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1800
|
-
interface DialogPopupVariantsOptions {
|
|
1801
|
-
size?: DialogSize;
|
|
1802
|
-
scrollBehavior?: DialogScrollBehavior;
|
|
1803
|
-
className?: string;
|
|
1804
|
-
}
|
|
1805
|
-
/**
|
|
1806
|
-
* Class list for the dialog surface itself. Useful when composing Base UI's
|
|
1807
|
-
* dialog parts directly (custom portals, alert dialogs) while keeping the
|
|
1808
|
-
* ArcFusion look.
|
|
1809
|
-
*/
|
|
1810
|
-
declare function dialogPopupVariants({ size, scrollBehavior, className }?: DialogPopupVariantsOptions): string;
|
|
1811
|
-
interface DialogPopupProps extends Omit<ComponentPropsWithoutRef<typeof Dialog$1.Popup>, "className"> {
|
|
1812
|
-
/**
|
|
1813
|
-
* Width preset: `sm` 384px for confirmations, `md` 512px (default) for
|
|
1814
|
-
* forms, `lg` 672px for rich content, `full` for an edge-to-edge
|
|
1815
|
-
* full-screen dialog. Below the preset the popup shrinks with the
|
|
1816
|
-
* viewport, keeping a 16px margin.
|
|
1817
|
-
*/
|
|
1818
|
-
size?: DialogSize;
|
|
1819
|
-
/**
|
|
1820
|
-
* How content taller than the viewport scrolls. `inside` (default) caps
|
|
1821
|
-
* the popup at the viewport and scrolls within it; `outside` lets the
|
|
1822
|
-
* popup grow and scrolls the page-like viewport behind the backdrop
|
|
1823
|
-
* instead. `full` dialogs always scroll inside.
|
|
1824
|
-
*/
|
|
1825
|
-
scrollBehavior?: DialogScrollBehavior;
|
|
1826
|
-
/**
|
|
1827
|
-
* Show the corner close button. When disabling it for a required
|
|
1828
|
-
* decision, keep another `DialogClose` action inside the popup — with
|
|
1829
|
-
* `modal` dialogs a visible close control is what lets touch
|
|
1830
|
-
* screen-reader users escape.
|
|
1831
|
-
*/
|
|
1832
|
-
showCloseButton?: boolean;
|
|
1833
|
-
/** Accessible name (and tooltip-free label) of the corner close button — localize it alongside your content. */
|
|
1834
|
-
closeLabel?: string;
|
|
1835
|
-
/**
|
|
1836
|
-
* Render the dimming scrim behind the dialog. Disable it together with
|
|
1837
|
-
* `modal={false}` on the root so the rest of the page stays visible and
|
|
1838
|
-
* interactive.
|
|
1839
|
-
*/
|
|
1840
|
-
showBackdrop?: boolean;
|
|
1841
|
-
/**
|
|
1842
|
-
* Keep the dialog mounted in the DOM while closed. Off by default —
|
|
1843
|
-
* enable it to preserve heavy content or form state across reopens.
|
|
1844
|
-
*/
|
|
1845
|
-
keepMounted?: boolean;
|
|
1846
|
-
/** Element the dialog portals into instead of `<body>` — for scoped stacking contexts, shadow DOM, or inline previews. */
|
|
1847
|
-
container?: ComponentPropsWithoutRef<typeof Dialog$1.Portal>["container"];
|
|
1848
|
-
className?: string;
|
|
1849
|
-
}
|
|
1850
|
-
/**
|
|
1851
|
-
* The dialog surface. Bundles Base UI's Portal, Backdrop, Viewport, and
|
|
1852
|
-
* Popup parts into one styled component; `initialFocus`/`finalFocus` and
|
|
1853
|
-
* every other Base UI popup prop pass straight through.
|
|
1854
|
-
*/
|
|
1855
|
-
declare const DialogPopup: import("react").ForwardRefExoticComponent<DialogPopupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1856
|
-
interface DialogHeaderProps extends HTMLAttributes<HTMLDivElement> {}
|
|
1857
|
-
/** Groups the title and description with standard spacing at the top of the popup. */
|
|
1858
|
-
declare const DialogHeader: import("react").ForwardRefExoticComponent<DialogHeaderProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1859
|
-
interface DialogFooterProps extends HTMLAttributes<HTMLDivElement> {}
|
|
1860
|
-
/** Action row: right-aligned on desktop, stacked with the primary action on top on small screens. */
|
|
1861
|
-
declare const DialogFooter: import("react").ForwardRefExoticComponent<DialogFooterProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1862
|
-
interface DialogTitleProps extends Omit<ComponentPropsWithoutRef<typeof Dialog$1.Title>, "className"> {
|
|
1863
|
-
className?: string;
|
|
1864
|
-
}
|
|
1865
|
-
/**
|
|
1866
|
-
* Labels the dialog — Base UI wires it to the popup's `aria-labelledby`.
|
|
1867
|
-
* Renders an `<h2>`; every dialog should have one (or an `aria-label` on
|
|
1868
|
-
* the popup) so the dialog announces meaningfully.
|
|
1869
|
-
*/
|
|
1870
|
-
declare const DialogTitle: import("react").ForwardRefExoticComponent<DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>>;
|
|
1871
|
-
interface DialogDescriptionProps extends Omit<ComponentPropsWithoutRef<typeof Dialog$1.Description>, "className"> {
|
|
1872
|
-
className?: string;
|
|
1873
|
-
}
|
|
1874
|
-
/** Supporting copy announced when the dialog opens — wired to `aria-describedby`. */
|
|
1875
|
-
declare const DialogDescription: import("react").ForwardRefExoticComponent<DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>>;
|
|
1876
|
-
//#endregion
|
|
1877
|
-
//#region src/components/Drawer/Drawer.d.ts
|
|
1878
|
-
type DrawerSide = "top" | "right" | "bottom" | "left";
|
|
1879
|
-
type DrawerSize = "sm" | "md" | "lg" | "full";
|
|
1880
|
-
interface DrawerProps extends Drawer$1.Root.Props {
|
|
1881
|
-
/**
|
|
1882
|
-
* Screen edge the drawer is attached to. `right` (default) suits detail
|
|
1883
|
-
* and settings panels, `left` navigation, `bottom` mobile sheets (snap
|
|
1884
|
-
* points and the drag handle are designed for it), `top` banners. Also
|
|
1885
|
-
* sets the matching swipe-to-dismiss direction.
|
|
1886
|
-
*/
|
|
1887
|
-
side?: DrawerSide;
|
|
1888
|
-
}
|
|
1889
|
-
/**
|
|
1890
|
-
* Groups all parts of the drawer and owns its state. Renders no DOM.
|
|
1891
|
-
*
|
|
1892
|
-
* Wraps Base UI's `Drawer.Root`, deriving `swipeDirection` from `side` (pass
|
|
1893
|
-
* `swipeDirection` yourself only to decouple them). Every other root feature
|
|
1894
|
-
* passes through: `open`/`defaultOpen`/`onOpenChange(open, details)`,
|
|
1895
|
-
* `snapPoints` with `snapPoint`/`defaultSnapPoint`/`onSnapPointChange`,
|
|
1896
|
-
* `modal` (`true` | `false` | `"trap-focus"`), `disablePointerDismissal`,
|
|
1897
|
-
* `onOpenChangeComplete`, `actionsRef`, and detached triggers via
|
|
1898
|
-
* `createDrawerHandle()` payloads.
|
|
1899
|
-
*/
|
|
1900
|
-
declare function Drawer({ side, swipeDirection, ...rest }: DrawerProps): import("react").JSX.Element;
|
|
1901
|
-
declare namespace Drawer {
|
|
1902
|
-
var displayName: string;
|
|
1903
|
-
}
|
|
1904
|
-
interface DrawerTriggerProps extends Omit<ComponentPropsWithoutRef<typeof Drawer$1.Trigger>, "className"> {
|
|
1905
|
-
className?: string;
|
|
1906
|
-
}
|
|
1907
|
-
/**
|
|
1908
|
-
* Opens the drawer. Renders an unstyled `<button>` and exposes
|
|
1909
|
-
* `data-popup-open` while its drawer is open — compose it with Button for
|
|
1910
|
-
* the usual look: `<DrawerTrigger render={<Button>Open</Button>} />`.
|
|
1911
|
-
*/
|
|
1912
|
-
declare const DrawerTrigger: import("react").ForwardRefExoticComponent<DrawerTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1913
|
-
interface DrawerCloseProps extends Omit<ComponentPropsWithoutRef<typeof Drawer$1.Close>, "className"> {
|
|
1914
|
-
className?: string;
|
|
1915
|
-
}
|
|
1916
|
-
/**
|
|
1917
|
-
* Closes the drawer. Renders an unstyled `<button>` — compose it with
|
|
1918
|
-
* Button for footer actions:
|
|
1919
|
-
* `<DrawerClose render={<Button variant="outline">Cancel</Button>} />`.
|
|
1920
|
-
*/
|
|
1921
|
-
declare const DrawerClose: import("react").ForwardRefExoticComponent<DrawerCloseProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
1922
|
-
interface DrawerPopupVariantsOptions {
|
|
1923
|
-
side?: DrawerSide;
|
|
1924
|
-
size?: DrawerSize;
|
|
1925
|
-
className?: string;
|
|
1926
|
-
}
|
|
1927
|
-
/**
|
|
1928
|
-
* Class list for the drawer surface itself. Useful when composing Base UI's
|
|
1929
|
-
* drawer parts directly (custom viewports, snap-point layouts) while keeping
|
|
1930
|
-
* the ArcFusion look.
|
|
1931
|
-
*/
|
|
1932
|
-
declare function drawerPopupVariants({ side, size, className }?: DrawerPopupVariantsOptions): string;
|
|
1933
|
-
interface DrawerPopupProps extends Omit<ComponentPropsWithoutRef<typeof Drawer$1.Popup>, "className"> {
|
|
1934
|
-
/**
|
|
1935
|
-
* Amount of screen the drawer takes on its `side`'s axis. Side panels:
|
|
1936
|
-
* `sm` 320px, `md` 384px (default), `lg` 512px, `full` edge-to-edge — all
|
|
1937
|
-
* but `full` keep a 48px page peek on narrow screens. Sheets (`top`/
|
|
1938
|
-
* `bottom`) size to their content up to `sm` 40dvh, `md` 75dvh, `lg`
|
|
1939
|
-
* 90dvh, or a `full` viewport takeover.
|
|
1940
|
-
*/
|
|
1941
|
-
size?: DrawerSize;
|
|
1942
|
-
/**
|
|
1943
|
-
* Show the corner close button. When disabling it for a required
|
|
1944
|
-
* decision, keep another `DrawerClose` action inside the popup — swiping
|
|
1945
|
-
* is not discoverable or possible for everyone, and with `modal` drawers
|
|
1946
|
-
* a visible close control is what lets touch screen-reader users escape.
|
|
1947
|
-
*/
|
|
1948
|
-
showCloseButton?: boolean;
|
|
1949
|
-
/** Accessible name (and tooltip-free label) of the corner close button — localize it alongside your content. */
|
|
1950
|
-
closeLabel?: string;
|
|
1951
|
-
/**
|
|
1952
|
-
* Show the drag-handle affordance on the swipe edge. Recommended for
|
|
1953
|
-
* `bottom` sheets on touch surfaces; it is decorative (the whole drawer
|
|
1954
|
-
* responds to swipes) and hidden from assistive technology.
|
|
1955
|
-
*/
|
|
1956
|
-
showHandle?: boolean;
|
|
1957
|
-
/**
|
|
1958
|
-
* Render the dimming scrim behind the drawer. Disable it together with
|
|
1959
|
-
* `modal={false}` on the root so the rest of the page stays visible and
|
|
1960
|
-
* interactive.
|
|
1961
|
-
*/
|
|
1962
|
-
showBackdrop?: boolean;
|
|
1963
|
-
/**
|
|
1964
|
-
* Keep the drawer mounted in the DOM while closed. Off by default —
|
|
1965
|
-
* enable it to preserve heavy content or form state across reopens.
|
|
1966
|
-
*/
|
|
1967
|
-
keepMounted?: boolean;
|
|
1968
|
-
/**
|
|
1969
|
-
* Enable Base UI's keyboard-aware focus and scroll handling — turn it on
|
|
1970
|
-
* for bottom sheets with form fields so software keyboards don't cover
|
|
1971
|
-
* the focused input. No effect on devices without a virtual keyboard.
|
|
1972
|
-
*/
|
|
1973
|
-
virtualKeyboard?: boolean;
|
|
1974
|
-
/** Element the drawer portals into instead of `<body>` — for scoped stacking contexts, shadow DOM, or inline previews. */
|
|
1975
|
-
container?: ComponentPropsWithoutRef<typeof Drawer$1.Portal>["container"];
|
|
1976
|
-
className?: string;
|
|
1977
|
-
}
|
|
1978
|
-
/**
|
|
1979
|
-
* The drawer surface. Bundles Base UI's Portal, Backdrop, Viewport, Popup,
|
|
1980
|
-
* and Content parts into one styled component positioned on the root's
|
|
1981
|
-
* `side`; `initialFocus`/`finalFocus` and every other Base UI popup prop
|
|
1982
|
-
* pass straight through. Children render inside the scrollable content
|
|
1983
|
-
* region while the handle and corner close stay pinned to the frame.
|
|
1984
|
-
*/
|
|
1985
|
-
declare const DrawerPopup: import("react").ForwardRefExoticComponent<DrawerPopupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1986
|
-
interface DrawerHeaderProps extends HTMLAttributes<HTMLDivElement> {}
|
|
1987
|
-
/** Groups the title and description with standard spacing at the top of the drawer. */
|
|
1988
|
-
declare const DrawerHeader: import("react").ForwardRefExoticComponent<DrawerHeaderProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1989
|
-
interface DrawerFooterProps extends HTMLAttributes<HTMLDivElement> {}
|
|
1990
|
-
/**
|
|
1991
|
-
* Action row: right-aligned on desktop, stacked with the primary action on
|
|
1992
|
-
* top on small screens. As a direct child of the popup it pins to the
|
|
1993
|
-
* drawer's bottom edge when the content is shorter than a full-height panel.
|
|
1994
|
-
*/
|
|
1995
|
-
declare const DrawerFooter: import("react").ForwardRefExoticComponent<DrawerFooterProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
1996
|
-
interface DrawerTitleProps extends Omit<ComponentPropsWithoutRef<typeof Drawer$1.Title>, "className"> {
|
|
1997
|
-
className?: string;
|
|
1998
|
-
}
|
|
1999
|
-
/**
|
|
2000
|
-
* Labels the drawer — Base UI wires it to the popup's `aria-labelledby`.
|
|
2001
|
-
* Renders an `<h2>`; every drawer should have one (or an `aria-label` on
|
|
2002
|
-
* the popup) so the panel announces meaningfully.
|
|
2003
|
-
*/
|
|
2004
|
-
declare const DrawerTitle: import("react").ForwardRefExoticComponent<DrawerTitleProps & import("react").RefAttributes<HTMLHeadingElement>>;
|
|
2005
|
-
interface DrawerDescriptionProps extends Omit<ComponentPropsWithoutRef<typeof Drawer$1.Description>, "className"> {
|
|
2006
|
-
className?: string;
|
|
2007
|
-
}
|
|
2008
|
-
/** Supporting copy announced when the drawer opens — wired to `aria-describedby`. */
|
|
2009
|
-
declare const DrawerDescription: import("react").ForwardRefExoticComponent<DrawerDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>>;
|
|
2010
|
-
interface DrawerSwipeAreaProps extends Omit<ComponentPropsWithoutRef<typeof Drawer$1.SwipeArea>, "className"> {
|
|
2011
|
-
className?: string;
|
|
2012
|
-
}
|
|
2013
|
-
/**
|
|
2014
|
-
* Invisible strip along the drawer's edge that opens it with a swipe-in
|
|
2015
|
-
* gesture (mobile-navigation pattern). Positions itself on the root's
|
|
2016
|
-
* `side` with a 24px hit area — pass `className` to widen it or add a
|
|
2017
|
-
* visible affordance as children. Keep a regular `DrawerTrigger` too:
|
|
2018
|
-
* edge swipes are invisible to most users and unavailable to keyboards.
|
|
2019
|
-
*/
|
|
2020
|
-
declare const DrawerSwipeArea: import("react").ForwardRefExoticComponent<DrawerSwipeAreaProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2021
|
-
/**
|
|
2022
|
-
* Shares drawer state across the app shell so `DrawerIndent` /
|
|
2023
|
-
* `DrawerIndentBackground` can react to any drawer opening. Renders no DOM —
|
|
2024
|
-
* wrap it around the app root only when using the indent effect.
|
|
2025
|
-
*/
|
|
2026
|
-
declare const DrawerProvider: typeof Drawer$1.Provider;
|
|
2027
|
-
/**
|
|
2028
|
-
* Keyboard-aware focus and scroll handling for bottom sheets that contain
|
|
2029
|
-
* form fields. Prefer the `virtualKeyboard` prop on `DrawerPopup`; this raw
|
|
2030
|
-
* part exists for custom compositions and MUST render inside a `Drawer`
|
|
2031
|
-
* (it reads the root's context), wrapping the drawer's parts. Exposes
|
|
2032
|
-
* `--drawer-keyboard-inset` on the viewport. Renders no DOM.
|
|
2033
|
-
*/
|
|
2034
|
-
declare const DrawerVirtualKeyboardProvider: typeof Drawer$1.VirtualKeyboardProvider;
|
|
2035
|
-
/**
|
|
2036
|
-
* Creates a handle that connects detached `DrawerTrigger`s (or imperative
|
|
2037
|
-
* `open`/`close` calls) to a `Drawer` rendered elsewhere — e.g. opening a
|
|
2038
|
-
* drawer from a menu item. Pass it to both as the `handle` prop.
|
|
2039
|
-
*/
|
|
2040
|
-
declare const createDrawerHandle: typeof Drawer$1.createHandle;
|
|
2041
|
-
interface DrawerIndentProps extends Omit<ComponentPropsWithoutRef<typeof Drawer$1.Indent>, "className"> {
|
|
2042
|
-
className?: string;
|
|
2043
|
-
}
|
|
2044
|
-
/**
|
|
2045
|
-
* Wrapper for the app's main UI inside a `DrawerProvider`; gets
|
|
2046
|
-
* `data-active` while any drawer is open. Unstyled on purpose — the app
|
|
2047
|
-
* shell owns the effect, e.g.
|
|
2048
|
-
* `className="motion-safe:transition-transform data-active:scale-[0.98]"`
|
|
2049
|
-
* for the iOS-style recede.
|
|
2050
|
-
*/
|
|
2051
|
-
declare const DrawerIndent: import("react").ForwardRefExoticComponent<DrawerIndentProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2052
|
-
interface DrawerIndentBackgroundProps extends Omit<ComponentPropsWithoutRef<typeof Drawer$1.IndentBackground>, "className"> {
|
|
2053
|
-
className?: string;
|
|
2054
|
-
}
|
|
2055
|
-
/**
|
|
2056
|
-
* Backdrop layer rendered behind `DrawerIndent` (place it just before) so
|
|
2057
|
-
* the receded app has something to sit on — style it with `data-active`
|
|
2058
|
-
* like the indent itself. Unstyled on purpose.
|
|
2059
|
-
*/
|
|
2060
|
-
declare const DrawerIndentBackground: import("react").ForwardRefExoticComponent<DrawerIndentBackgroundProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2061
|
-
//#endregion
|
|
2062
|
-
//#region src/components/Field/Field.d.ts
|
|
2063
|
-
type FieldOrientation = "vertical" | "horizontal";
|
|
2064
|
-
type BaseFieldRootProps = ComponentPropsWithoutRef<typeof Field$1.Root>;
|
|
2065
|
-
interface FieldProps<TFieldValues extends FieldValues = FieldValues> extends Omit<BaseFieldRootProps, "className" | "name"> {
|
|
2066
|
-
/**
|
|
2067
|
-
* Identifies the field: the submitted name in native forms, the registered
|
|
2068
|
-
* path when connected to React Hook Form. With an explicit `control`, the
|
|
2069
|
-
* name is type-checked against the form's values.
|
|
2070
|
-
*/
|
|
2071
|
-
name?: FieldPath<TFieldValues>;
|
|
2072
|
-
/**
|
|
2073
|
-
* React Hook Form `control` for connecting this field explicitly. Inside a
|
|
2074
|
-
* `<Form form={…}>` it is read from context instead, so most fields only
|
|
2075
|
-
* need `name`. A field with a `name` and a reachable control is
|
|
2076
|
-
* "connected": it subscribes to that field's state via `useController`,
|
|
2077
|
-
* shows `FieldError` messages automatically, and wires the `Input` inside
|
|
2078
|
-
* it (value, change/blur handlers, focus ref) with no extra props.
|
|
2079
|
-
*/
|
|
2080
|
-
control?: Control<TFieldValues>;
|
|
2081
|
-
/**
|
|
2082
|
-
* Marks the field as required: the label gains a decorative asterisk and
|
|
2083
|
-
* the control is announced as required (`aria-required` when connected —
|
|
2084
|
-
* the schema owns actual enforcement — or the native `required` attribute
|
|
2085
|
-
* in static fields).
|
|
2086
|
-
*/
|
|
2087
|
-
required?: boolean;
|
|
2088
|
-
/**
|
|
2089
|
-
* `vertical` (default) stacks label, control, and supporting text.
|
|
2090
|
-
* `horizontal` puts the label in a leading column, baseline-aligned with
|
|
2091
|
-
* the control — for dense, label-left form layouts. Checkbox/switch rows
|
|
2092
|
-
* are a different pattern: wrap the control with `FieldLabel` instead.
|
|
2093
|
-
*/
|
|
2094
|
-
orientation?: FieldOrientation;
|
|
2095
|
-
className?: string;
|
|
2096
|
-
}
|
|
2097
|
-
interface FieldComponent {
|
|
2098
|
-
<TFieldValues extends FieldValues = FieldValues>(props: FieldProps<TFieldValues> & {
|
|
2099
|
-
ref?: Ref<HTMLDivElement>;
|
|
2100
|
-
}): ReactNode;
|
|
2101
|
-
displayName?: string;
|
|
2102
|
-
}
|
|
2103
|
-
/**
|
|
2104
|
-
* Labelling + validation wrapper for a single form control, built on Base UI's
|
|
2105
|
-
* Field. It associates `FieldLabel`, `FieldDescription`, and `FieldError`
|
|
2106
|
-
* with the control automatically (ids, `aria-describedby`) and exposes state
|
|
2107
|
-
* data-attributes (`data-invalid`, `data-touched`, `data-dirty`,
|
|
2108
|
-
* `data-filled`, `data-focused`) on every part for styling.
|
|
2109
|
-
*
|
|
2110
|
-
* Give it a `name` inside `<Form form={…}>` (or pass `control`) to connect it
|
|
2111
|
-
* to React Hook Form — validation state then flows in from the form and the
|
|
2112
|
-
* `Input` inside is wired automatically. Without a form library it works as a
|
|
2113
|
-
* native field: constraint attributes plus the `validate`/`validationMode`
|
|
2114
|
-
* props drive `FieldError` via its `match` prop.
|
|
2115
|
-
*/
|
|
2116
|
-
declare const Field: FieldComponent;
|
|
2117
|
-
interface FieldLabelVariantsOptions {
|
|
2118
|
-
className?: string;
|
|
2119
|
-
}
|
|
2120
|
-
/**
|
|
2121
|
-
* Class list for an element styled as a field label — for labelling controls
|
|
2122
|
-
* that live outside a `Field` (e.g. a filter Select in a toolbar) so every
|
|
2123
|
-
* label in the product shares one look.
|
|
2124
|
-
*/
|
|
2125
|
-
declare function fieldLabelVariants({ className }?: FieldLabelVariantsOptions): string;
|
|
2126
|
-
interface FieldLabelProps extends Omit<ComponentPropsWithoutRef<typeof Field$1.Label>, "className"> {
|
|
2127
|
-
className?: string;
|
|
2128
|
-
}
|
|
2129
|
-
/**
|
|
2130
|
-
* Visible label, automatically associated with the field's control — clicking
|
|
2131
|
-
* it focuses the control. When the `Field` is `required`, a decorative
|
|
2132
|
-
* asterisk (hidden from assistive technology, which hears the control's
|
|
2133
|
-
* required state instead) is appended. For checkbox/radio/switch rows, wrap
|
|
2134
|
-
* the control instead: `<FieldLabel><Switch /> Notifications</FieldLabel>`.
|
|
2135
|
-
* When the control is button-based (Select, Combobox triggers), pass
|
|
2136
|
-
* `nativeLabel={false}` — the label then renders as a `<div>` wired via
|
|
2137
|
-
* `aria-labelledby`, so hovering or clicking it doesn't act on the button.
|
|
2138
|
-
*/
|
|
2139
|
-
declare const FieldLabel: import("react").ForwardRefExoticComponent<FieldLabelProps & import("react").RefAttributes<HTMLLabelElement>>;
|
|
2140
|
-
interface FieldDescriptionProps extends Omit<ComponentPropsWithoutRef<typeof Field$1.Description>, "className"> {
|
|
2141
|
-
className?: string;
|
|
2142
|
-
}
|
|
2143
|
-
/**
|
|
2144
|
-
* Persistent supporting copy for the field, announced via `aria-describedby`.
|
|
2145
|
-
* It stays visible while an error shows — the hint is exactly what the user
|
|
2146
|
-
* needs to fix the problem. Order it in the children wherever the design
|
|
2147
|
-
* calls for (before or after the control); the association is automatic.
|
|
2148
|
-
*/
|
|
2149
|
-
declare const FieldDescription: import("react").ForwardRefExoticComponent<FieldDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>>;
|
|
2150
|
-
interface FieldErrorProps extends Omit<ComponentPropsWithoutRef<typeof Field$1.Error>, "className"> {
|
|
2151
|
-
className?: string;
|
|
2152
|
-
}
|
|
2153
|
-
/**
|
|
2154
|
-
* Validation message for the field, wired into `aria-describedby` and
|
|
2155
|
-
* announced on appearance (`role="alert"`). In a connected field it renders
|
|
2156
|
-
* the form error automatically — the message (or a list when
|
|
2157
|
-
* `criteriaMode: "all"` reports several), shown exactly while the field is
|
|
2158
|
-
* invalid; `children` replace the message text. In static fields it follows
|
|
2159
|
-
* Base UI's native behavior: `match` picks a ValidityState condition (e.g.
|
|
2160
|
-
* `match="valueMissing"`) and `children` provide the message.
|
|
2161
|
-
*/
|
|
2162
|
-
declare const FieldError: import("react").ForwardRefExoticComponent<FieldErrorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2163
|
-
interface FieldItemProps extends Omit<ComponentPropsWithoutRef<typeof Field$1.Item>, "className"> {
|
|
2164
|
-
className?: string;
|
|
2165
|
-
}
|
|
2166
|
-
/**
|
|
2167
|
-
* Groups one option of a checkbox or radio group with its own label and
|
|
2168
|
-
* description — inside it, `FieldLabel`/`FieldDescription` attach to that
|
|
2169
|
-
* option's control instead of the whole field. Compose with `Fieldset`
|
|
2170
|
-
* (legend = the group's name) per option.
|
|
2171
|
-
*/
|
|
2172
|
-
declare const FieldItem: import("react").ForwardRefExoticComponent<FieldItemProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2173
|
-
type FieldValidityProps = ComponentPropsWithoutRef<typeof Field$1.Validity>;
|
|
2174
|
-
/**
|
|
2175
|
-
* Render-prop over the field's native ValidityState — for custom validity UI
|
|
2176
|
-
* such as inline requirement checklists. Renders no element of its own.
|
|
2177
|
-
* Base UI's `Field.Validity`, re-exported unchanged.
|
|
2178
|
-
*/
|
|
2179
|
-
declare const FieldValidity: import("react").FC<import("@base-ui/react").FieldValidityProps>;
|
|
2180
|
-
//#endregion
|
|
2181
|
-
//#region src/components/Field/FieldContext.d.ts
|
|
2182
|
-
/**
|
|
2183
|
-
* Control wiring a connected `Field` provides to the form control inside it.
|
|
2184
|
-
* The shape mirrors React Hook Form's `field` object from `useController`,
|
|
2185
|
-
* kept structural so consumers of the context never import react-hook-form.
|
|
2186
|
-
*/
|
|
2187
|
-
interface FieldControlProps {
|
|
2188
|
-
/** Field name registered with the form. */
|
|
2189
|
-
name: string;
|
|
2190
|
-
/** Current field value from form state. */
|
|
2191
|
-
value: unknown;
|
|
2192
|
-
/** Whether react-hook-form marked the field disabled (form- or field-level). */
|
|
2193
|
-
disabled?: boolean;
|
|
2194
|
-
/** Change handler — accepts either a change event or a raw value. */
|
|
2195
|
-
onChange: (eventOrValue: unknown) => void;
|
|
2196
|
-
/** Blur handler — marks the field as touched. */
|
|
2197
|
-
onBlur: () => void;
|
|
2198
|
-
/** Ref callback used for focus management (e.g. focus-first-error on submit). */
|
|
2199
|
-
ref: (instance: unknown) => void;
|
|
2200
|
-
}
|
|
2201
|
-
/**
|
|
2202
|
-
* Control wiring published by the closest connected `Field`, or `null` when
|
|
2203
|
-
* the component is not inside one. `Input` consumes this automatically; use
|
|
2204
|
-
* it to connect controls that don't yet, e.g. a Select:
|
|
2205
|
-
*
|
|
2206
|
-
* function PlanSelect(props: SelectProps<string>) {
|
|
2207
|
-
* const control = useFieldControl();
|
|
2208
|
-
* return (
|
|
2209
|
-
* <Select
|
|
2210
|
-
* value={control?.value as string}
|
|
2211
|
-
* onValueChange={control?.onChange}
|
|
2212
|
-
* inputRef={control?.ref}
|
|
2213
|
-
* {...props}
|
|
2214
|
-
* />
|
|
2215
|
-
* );
|
|
2216
|
-
* }
|
|
2217
|
-
*
|
|
2218
|
-
* React Hook Form's `onChange` accepts raw values, so Base UI `onValueChange`
|
|
2219
|
-
* callbacks can be passed straight through.
|
|
2220
|
-
*/
|
|
2221
|
-
declare function useFieldControl(): FieldControlProps | null;
|
|
2222
|
-
//#endregion
|
|
2223
|
-
//#region src/components/Fieldset/Fieldset.d.ts
|
|
2224
|
-
interface FieldsetProps extends Omit<ComponentPropsWithoutRef<typeof Fieldset$1.Root>, "className"> {
|
|
2225
|
-
className?: string;
|
|
2226
|
-
}
|
|
2227
|
-
/**
|
|
2228
|
-
* Groups related fields under one shared `FieldsetLegend` — required for
|
|
2229
|
-
* radio and checkbox groups (WCAG 1.3.1), useful for form sections like
|
|
2230
|
-
* "Billing details". Renders a native `<fieldset>`, so `disabled` disables
|
|
2231
|
-
* every control inside it at once; with React Hook Form, note that disabling
|
|
2232
|
-
* here is visual/interactive only — schema validation still runs, so also
|
|
2233
|
-
* disable or exclude those fields in the form when they shouldn't block
|
|
2234
|
-
* submission.
|
|
2235
|
-
*/
|
|
2236
|
-
declare const Fieldset: import("react").ForwardRefExoticComponent<FieldsetProps & import("react").RefAttributes<HTMLFieldSetElement>>;
|
|
2237
|
-
type FieldsetLegendVariant = "section" | "label";
|
|
2238
|
-
interface FieldsetLegendProps extends Omit<ComponentPropsWithoutRef<typeof Fieldset$1.Legend>, "className"> {
|
|
2239
|
-
/**
|
|
2240
|
-
* `section` (default) styles the legend as a form-section heading;
|
|
2241
|
-
* `label` matches `FieldLabel` for radio/checkbox groups, so the group
|
|
2242
|
-
* caption reads like the labels of the fields around it.
|
|
2243
|
-
*/
|
|
2244
|
-
variant?: FieldsetLegendVariant;
|
|
2245
|
-
className?: string;
|
|
2246
|
-
}
|
|
2247
|
-
/**
|
|
2248
|
-
* The fieldset's caption, automatically associated with the group for
|
|
2249
|
-
* assistive technology. Keep it short — some screen readers repeat the
|
|
2250
|
-
* legend before every control in the group.
|
|
2251
|
-
*/
|
|
2252
|
-
declare const FieldsetLegend: import("react").ForwardRefExoticComponent<FieldsetLegendProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2253
|
-
interface FieldsetDescriptionProps extends Omit<HTMLAttributes<HTMLParagraphElement>, "className"> {
|
|
2254
|
-
className?: string;
|
|
2255
|
-
}
|
|
2256
|
-
/**
|
|
2257
|
-
* Supporting copy for the whole group, placed right after the legend.
|
|
2258
|
-
* Visible text content read in sequence — unlike `FieldDescription` it is
|
|
2259
|
-
* not wired into any control's `aria-describedby`.
|
|
2260
|
-
*/
|
|
2261
|
-
declare const FieldsetDescription: import("react").ForwardRefExoticComponent<FieldsetDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>>;
|
|
2262
|
-
//#endregion
|
|
2263
|
-
//#region src/components/Form/Form.d.ts
|
|
2264
|
-
type BaseFormProps = ComponentPropsWithoutRef<typeof Form$1>;
|
|
2265
|
-
interface FormProps<TFieldValues extends FieldValues = FieldValues, TTransformedValues = TFieldValues> extends Omit<BaseFormProps, "className"> {
|
|
2266
|
-
/**
|
|
2267
|
-
* The `useForm` return value. Providing it switches the form to React Hook
|
|
2268
|
-
* Form mode: children get the form context (so `<Field name="…">` connects
|
|
2269
|
-
* with no extra props), submission runs through `handleSubmit`, and native
|
|
2270
|
-
* constraint validation is turned off (`noValidate`) so the schema is the
|
|
2271
|
-
* single source of truth. Omit it for a native Base UI form (constraint
|
|
2272
|
-
* validation, the `errors` server-error map, `onFormSubmit`).
|
|
2273
|
-
*/
|
|
2274
|
-
form?: UseFormReturn<TFieldValues, any, TTransformedValues>;
|
|
2275
|
-
/**
|
|
2276
|
-
* Called with the parsed values when submission passes validation — with a
|
|
2277
|
-
* Zod resolver this is the schema's output type. React Hook Form focuses
|
|
2278
|
-
* the first invalid control when validation fails (`shouldFocusError`).
|
|
2279
|
-
*/
|
|
2280
|
-
onValidSubmit?: SubmitHandler<TTransformedValues>;
|
|
2281
|
-
/** Called with the field errors when submission fails validation. */
|
|
2282
|
-
onInvalidSubmit?: SubmitErrorHandler<TFieldValues>;
|
|
2283
|
-
className?: string;
|
|
2284
|
-
}
|
|
2285
|
-
interface FormComponent {
|
|
2286
|
-
<TFieldValues extends FieldValues = FieldValues, TTransformedValues = TFieldValues>(props: FormProps<TFieldValues, TTransformedValues> & {
|
|
2287
|
-
ref?: Ref<HTMLFormElement>;
|
|
2288
|
-
}): ReactNode;
|
|
2289
|
-
displayName?: string;
|
|
2290
|
-
}
|
|
2291
|
-
/**
|
|
2292
|
-
* The form element for both worlds. With `form={useForm(…)}` it becomes the
|
|
2293
|
-
* React Hook Form shell — provider, `handleSubmit`, and `noValidate` in one:
|
|
2294
|
-
*
|
|
2295
|
-
* const schema = z.object({ email: z.email("Enter a valid email") });
|
|
2296
|
-
* const form = useForm({ resolver: zodResolver(schema), mode: "onTouched" });
|
|
2297
|
-
*
|
|
2298
|
-
* <Form form={form} onValidSubmit={(data) => save(data)}>
|
|
2299
|
-
* <Field name="email">
|
|
2300
|
-
* <FieldLabel>Email</FieldLabel>
|
|
2301
|
-
* <Input type="email" autoComplete="email" />
|
|
2302
|
-
* <FieldError />
|
|
2303
|
-
* </Field>
|
|
2304
|
-
* <Button type="submit">Save</Button>
|
|
2305
|
-
* </Form>
|
|
2306
|
-
*
|
|
2307
|
-
* Without `form` it is Base UI's native form: constraint validation drives
|
|
2308
|
-
* `FieldError` via `match`, `errors` maps server errors onto fields by name,
|
|
2309
|
-
* and `onFormSubmit` receives values as a plain object.
|
|
2310
|
-
*/
|
|
2311
|
-
declare const Form: FormComponent;
|
|
2312
|
-
//#endregion
|
|
2313
|
-
//#region src/components/Input/Input.d.ts
|
|
2314
|
-
type InputSize = "sm" | "md" | "lg";
|
|
2315
|
-
interface InputVariantsOptions {
|
|
2316
|
-
size?: InputSize;
|
|
2317
|
-
className?: string;
|
|
2318
|
-
}
|
|
2319
|
-
/**
|
|
2320
|
-
* Class list for an element styled as a standalone Input — for input-shaped
|
|
2321
|
-
* elements that aren't this component (a `<textarea>`, a fake search box that
|
|
2322
|
-
* opens a command palette) so every text control shares one look. Inside an
|
|
2323
|
-
* `InputGroup` the group owns the frame; these classes are for standalone use.
|
|
2324
|
-
*/
|
|
2325
|
-
declare function inputVariants({ size, className }?: InputVariantsOptions): string;
|
|
2326
|
-
type BaseInputProps = ComponentPropsWithoutRef<typeof Input$1>;
|
|
2327
|
-
interface InputProps extends Omit<BaseInputProps, "className" | "size"> {
|
|
2328
|
-
/** Control height. `sm` (32px) meets the WCAG 2.5.8 AA target-size floor; prefer `md`/`lg` for touch-first surfaces. Inside an `InputGroup` the group's `size` wins. */
|
|
2329
|
-
size?: InputSize;
|
|
2330
|
-
/** The native `size` attribute (visible width in characters) — renamed because `size` selects the control height. */
|
|
2331
|
-
htmlSize?: number;
|
|
2332
|
-
/** Marks the input invalid (`aria-invalid` + destructive styling) when validation is wired manually. Composed `Field`s set this state for you via `data-invalid`. */
|
|
2333
|
-
invalid?: boolean;
|
|
2334
|
-
className?: string;
|
|
2335
|
-
}
|
|
2336
|
-
/**
|
|
2337
|
-
* Native text input built on Base UI's Input. Full width by default — size
|
|
2338
|
-
* it via the container. Inside a `Field` it inherits labelling, description
|
|
2339
|
-
* and error wiring plus state data-attributes automatically; inside a
|
|
2340
|
-
* *connected* Field (React Hook Form) the value, change/blur handlers, and
|
|
2341
|
-
* focus ref are wired for you too — passing `value`, `defaultValue`,
|
|
2342
|
-
* `onChange`, or `name` yourself takes back manual control (don't also
|
|
2343
|
-
* `register` the same name: the Field already registered it). Standalone
|
|
2344
|
-
* max-performance registration `{...form.register("name")}` works as usual.
|
|
2345
|
-
* Fields that collect data about the user must pass the matching
|
|
2346
|
-
* `autocomplete` token (WCAG 1.3.5).
|
|
2347
|
-
*/
|
|
2348
|
-
declare const Input: import("react").ForwardRefExoticComponent<InputProps & import("react").RefAttributes<HTMLInputElement>>;
|
|
2349
|
-
interface InputGroupProps extends Omit<HTMLAttributes<HTMLDivElement>, "className"> {
|
|
2350
|
-
/** Frame height, mirroring Input sizes. The Input inside inherits it. */
|
|
2351
|
-
size?: InputSize;
|
|
2352
|
-
className?: string;
|
|
2353
|
-
}
|
|
2354
|
-
/**
|
|
2355
|
-
* Frame that seats decorations next to an `Input` — icons, text affixes like
|
|
2356
|
-
* `$` or `.com`, or interactive addons — inside one shared border with a
|
|
2357
|
-
* single focus ring. Compose `InputGroupAddon`(s) and one `Input` in visual
|
|
2358
|
-
* order; the input goes bare and the group takes over its frame, including
|
|
2359
|
-
* invalid/disabled/read-only states. Works inside `Field` unchanged.
|
|
2360
|
-
*/
|
|
2361
|
-
declare const InputGroup: import("react").ForwardRefExoticComponent<InputGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2362
|
-
interface InputGroupAddonProps extends Omit<HTMLAttributes<HTMLDivElement>, "className"> {
|
|
2363
|
-
className?: string;
|
|
2364
|
-
}
|
|
2365
|
-
/**
|
|
2366
|
-
* A decoration slot inside `InputGroup` — place it before or after the
|
|
2367
|
-
* `Input` in the children. Addon content sits outside the input's accessible
|
|
2368
|
-
* name: mark purely decorative content (icons, unit text repeated in the
|
|
2369
|
-
* label) with `aria-hidden`, and never hide interactive addons — a clear or
|
|
2370
|
-
* show-password `Button` must stay in the accessibility tree.
|
|
2371
|
-
*/
|
|
2372
|
-
declare const InputGroupAddon: import("react").ForwardRefExoticComponent<InputGroupAddonProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2373
|
-
//#endregion
|
|
2374
|
-
//#region src/components/Progress/Progress.d.ts
|
|
2375
|
-
type ProgressSize = "sm" | "md" | "lg";
|
|
2376
|
-
type ProgressVariant = "primary" | "success" | "warning" | "destructive";
|
|
2377
|
-
interface ProgressTrackVariantsOptions {
|
|
2378
|
-
size?: ProgressSize;
|
|
2379
|
-
className?: string;
|
|
2380
|
-
}
|
|
2381
|
-
/**
|
|
2382
|
-
* Class list for an element styled as a Progress track.
|
|
2383
|
-
*
|
|
2384
|
-
* Pair with `progressIndicatorVariants()` to build layouts the flattened
|
|
2385
|
-
* component doesn't cover — e.g. a stacked storage bar. Such a composite is
|
|
2386
|
-
* one image to assistive technology, so name the whole thing:
|
|
2387
|
-
*
|
|
2388
|
-
* <div role="img" aria-label="Storage: documents 45%, media 21%"
|
|
2389
|
-
* className={progressTrackVariants({ size: "lg" })}>
|
|
2390
|
-
* <div className="flex h-full gap-px">
|
|
2391
|
-
* <div className={progressIndicatorVariants({ className: "rounded-none" })} style={{ width: "45%" }} />
|
|
2392
|
-
* <div className={progressIndicatorVariants({ variant: "success", className: "rounded-none" })} style={{ width: "21%" }} />
|
|
2393
|
-
* </div>
|
|
2394
|
-
* </div>
|
|
2395
|
-
*/
|
|
2396
|
-
declare function progressTrackVariants({ size, className }?: ProgressTrackVariantsOptions): string;
|
|
2397
|
-
interface ProgressIndicatorVariantsOptions {
|
|
2398
|
-
variant?: ProgressVariant;
|
|
2399
|
-
className?: string;
|
|
2400
|
-
}
|
|
2401
|
-
/** Class list for an element styled as a Progress fill — see `progressTrackVariants`. */
|
|
2402
|
-
declare function progressIndicatorVariants({ variant, className }?: ProgressIndicatorVariantsOptions): string;
|
|
2403
|
-
interface ProgressBaseProps extends Omit<ComponentPropsWithoutRef<typeof Progress$1.Root>, "className" | "value" | "children"> {
|
|
2404
|
-
/**
|
|
2405
|
-
* Completion within `[min, max]` (0–100 by default). Omit — or pass
|
|
2406
|
-
* `null` — for an indeterminate bar while the amount of work is unknown.
|
|
2407
|
-
* Never move it backwards; per NN/g, prefer indeterminate under ~10s and
|
|
2408
|
-
* a percent-done readout beyond that.
|
|
2409
|
-
*/
|
|
2410
|
-
value?: number | null;
|
|
2411
|
-
/** Track thickness: `sm` 4px · `md` 8px · `lg` 12px. Text and spacing are unaffected. */
|
|
2412
|
-
size?: ProgressSize;
|
|
2413
|
-
/**
|
|
2414
|
-
* Semantic fill color. For informational statuses use `primary` — the
|
|
2415
|
-
* palette's `info` alias shares the primary ramp. Every fill clears the
|
|
2416
|
-
* WCAG 1.4.11 3:1 non-text contrast floor against the track. The fill does
|
|
2417
|
-
* not change on completion; switch to `success` yourself if the surface
|
|
2418
|
-
* calls for it (see `data-complete`).
|
|
2419
|
-
*/
|
|
2420
|
-
variant?: ProgressVariant;
|
|
2421
|
-
/**
|
|
2422
|
-
* Visible operation name (Base UI's Label part), rendered above the track
|
|
2423
|
-
* and wired up as the accessible name. Without it, `aria-label` or
|
|
2424
|
-
* `aria-labelledby` is required — enforced at the type level.
|
|
2425
|
-
*/
|
|
2426
|
-
label?: ReactNode;
|
|
2427
|
-
/**
|
|
2428
|
-
* Show the formatted value (Base UI's Value part) at the trailing edge of
|
|
2429
|
-
* the header row — a percentage by default; `format` and `locale` on the
|
|
2430
|
-
* root change the formatting. Renders nothing while indeterminate.
|
|
2431
|
-
*/
|
|
2432
|
-
showValue?: boolean;
|
|
2433
|
-
className?: string;
|
|
2434
|
-
}
|
|
2435
|
-
/** A progressbar must expose an accessible name: a visible label or an aria attribute. */
|
|
2436
|
-
type ProgressLabellingProps = {
|
|
2437
|
-
label: ReactNode;
|
|
2438
|
-
} | {
|
|
2439
|
-
label?: never;
|
|
2440
|
-
"aria-label": string;
|
|
2441
|
-
} | {
|
|
2442
|
-
label?: never;
|
|
2443
|
-
"aria-labelledby": string;
|
|
2444
|
-
};
|
|
2445
|
-
type ProgressProps = ProgressBaseProps & ProgressLabellingProps;
|
|
2446
|
-
/**
|
|
2447
|
-
* Linear indicator for the status of a long-running task, built on Base UI's
|
|
2448
|
-
* Progress. `value` fills the track (the width transition is motion-safe);
|
|
2449
|
-
* omitting it renders the indeterminate sweep, which degrades to an opacity
|
|
2450
|
-
* pulse under reduced motion so the bar never looks stalled. `min`, `max`,
|
|
2451
|
-
* `format`, `locale`, `aria-valuetext`, and `getAriaValueText` pass through
|
|
2452
|
-
* to Base UI's Root; `data-progressing` / `data-complete` /
|
|
2453
|
-
* `data-indeterminate` are available as styling hooks. Linear only — for
|
|
2454
|
-
* spinner-style ambient waits use AILoader.
|
|
2455
|
-
*/
|
|
2456
|
-
declare const Progress: import("react").ForwardRefExoticComponent<ProgressProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2457
|
-
//#endregion
|
|
2458
|
-
//#region src/components/Radio/Radio.d.ts
|
|
2459
|
-
type RadioSize = "sm" | "md" | "lg";
|
|
2460
|
-
interface RadioVariantsOptions {
|
|
2461
|
-
size?: RadioSize;
|
|
2462
|
-
className?: string;
|
|
2463
|
-
}
|
|
2464
|
-
/**
|
|
2465
|
-
* Class list for the radio circle itself. State styling hangs off Base UI's
|
|
2466
|
-
* data-attributes (`data-checked`, `data-disabled`, `data-readonly`,
|
|
2467
|
-
* `data-invalid`) plus `aria-invalid` — useful when styling a sibling of the
|
|
2468
|
-
* radio (e.g. a selection card) with the same look.
|
|
2469
|
-
*/
|
|
2470
|
-
declare function radioVariants({ size, className }?: RadioVariantsOptions): string;
|
|
2471
|
-
interface RadioProps extends Omit<ComponentPropsWithoutRef<typeof Radio$1.Root>, "className"> {
|
|
2472
|
-
/**
|
|
2473
|
-
* Circle size. The 24px `lg` circle meets the WCAG 2.5.8 target-size floor
|
|
2474
|
-
* on its own; `sm`/`md` rely on the clickable `label` (or surrounding
|
|
2475
|
-
* spacing) to extend the target. Prefer `md`+ with a label on touch-first
|
|
2476
|
-
* surfaces.
|
|
2477
|
-
*/
|
|
2478
|
-
size?: RadioSize;
|
|
2479
|
-
/**
|
|
2480
|
-
* Visible option label rendered in an enclosing `<label>`, so clicking it
|
|
2481
|
-
* selects the radio and it names the option. Without it, provide an
|
|
2482
|
-
* accessible name another way: `aria-label`, `aria-labelledby`, or an
|
|
2483
|
-
* external `<label>`. Unlike Checkbox, `required` adds no asterisk here —
|
|
2484
|
-
* a radio option is never required by itself; mark the group caption
|
|
2485
|
-
* instead.
|
|
2486
|
-
*/
|
|
2487
|
-
label?: ReactNode;
|
|
2488
|
-
/**
|
|
2489
|
-
* Supporting copy below the label, linked via `aria-describedby`. Rendered
|
|
2490
|
-
* outside the `<label>` element so screen readers announce it as the
|
|
2491
|
-
* description instead of reading it into the accessible name.
|
|
2492
|
-
*/
|
|
2493
|
-
description?: ReactNode;
|
|
2494
|
-
/** Applied to the radio circle itself, also when `label`/`description` wrap it. */
|
|
2495
|
-
className?: string;
|
|
2496
|
-
}
|
|
2497
|
-
/**
|
|
2498
|
-
* One option of a `RadioGroup`, built on Base UI's Radio. The indicator dot
|
|
2499
|
-
* is built in and animates behind `motion-safe`. `ref` and `className`
|
|
2500
|
-
* always target the circle element, whether or not the labelled layout
|
|
2501
|
-
* wraps it. Radios only function inside a `RadioGroup`.
|
|
2502
|
-
*/
|
|
2503
|
-
declare const Radio: import("react").ForwardRefExoticComponent<RadioProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
2504
|
-
interface RadioGroupProps extends Omit<ComponentPropsWithoutRef<typeof RadioGroup$1>, "className"> {
|
|
2505
|
-
className?: string;
|
|
2506
|
-
}
|
|
2507
|
-
/**
|
|
2508
|
-
* Holds the single selected value (`value`/`defaultValue`/`onValueChange`)
|
|
2509
|
-
* shared by child radios matched by their `value` prop, and submits it in
|
|
2510
|
-
* forms via `name`. `disabled`, `readOnly`, and `required` apply group-wide.
|
|
2511
|
-
* Lays the options out as a vertical stack — pass `className="flex-row"` for
|
|
2512
|
-
* a horizontal row (arrow keys move the selection either way). The group
|
|
2513
|
-
* needs an accessible name: `aria-labelledby` pointing at a caption, or
|
|
2514
|
-
* `aria-label`; when the choice is required, mark that caption — not the
|
|
2515
|
-
* individual options.
|
|
2516
|
-
*/
|
|
2517
|
-
declare const RadioGroup: import("react").ForwardRefExoticComponent<RadioGroupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2518
|
-
//#endregion
|
|
2519
|
-
//#region src/components/Skeleton/Skeleton.d.ts
|
|
2520
|
-
type SkeletonVariant = "text" | "circular" | "rectangular" | "rounded";
|
|
2521
|
-
type SkeletonAnimation = "pulse" | "wave" | "none";
|
|
2522
|
-
interface SkeletonRenderState extends Record<string, unknown> {
|
|
2523
|
-
/** Whether the placeholder is currently concealing its content. */
|
|
2524
|
-
loading: boolean;
|
|
2525
|
-
}
|
|
2526
|
-
interface SkeletonVariantsOptions {
|
|
2527
|
-
/** Shape recipe for text, avatars, sharp media, or rounded surfaces. */
|
|
2528
|
-
variant?: SkeletonVariant;
|
|
2529
|
-
/** Indeterminate motion. All animation stops when reduced motion is requested. */
|
|
2530
|
-
animation?: SkeletonAnimation;
|
|
2531
|
-
/** Apply placeholder appearance; `false` keeps only the structural wrapper classes. */
|
|
2532
|
-
loading?: boolean;
|
|
2533
|
-
/** Additional classes merged after the Skeleton recipe. */
|
|
2534
|
-
className?: string;
|
|
2535
|
-
}
|
|
2536
|
-
/** Class list for an element styled as a Skeleton placeholder. */
|
|
2537
|
-
declare function skeletonVariants({ variant, animation, loading, className }?: SkeletonVariantsOptions): string;
|
|
2538
|
-
interface SkeletonBaseProps extends Omit<ComponentPropsWithoutRef<"div">, "children" | "className"> {
|
|
2539
|
-
/** Shape of the placeholder. `text` has a usable 16px minimum height and fills its container; other shapes infer dimensions from children or `className`/`style`. */
|
|
2540
|
-
variant?: SkeletonVariant;
|
|
2541
|
-
/** `pulse` is the calm default, `wave` adds directional progress, and `none` is static. Motion is disabled automatically for `prefers-reduced-motion`. */
|
|
2542
|
-
animation?: SkeletonAnimation;
|
|
2543
|
-
/** Show the placeholder and make wrapped content inert. Set to `false` to reveal the content without replacing the host element. */
|
|
2544
|
-
loading?: boolean;
|
|
2545
|
-
/** Optional content whose dimensions the placeholder should preserve. Interactive descendants cannot be focused or activated while loading. */
|
|
2546
|
-
children?: ReactNode;
|
|
2547
|
-
/** Replace the rendered `div` or inspect `{ loading }` in a render callback. */
|
|
2548
|
-
render?: useRender.RenderProp<SkeletonRenderState>;
|
|
2549
|
-
/** Additional classes for dimensions, layout, or a context-specific semantic background. */
|
|
2550
|
-
className?: string;
|
|
2551
|
-
}
|
|
2552
|
-
type SkeletonProps = SkeletonBaseProps;
|
|
2553
|
-
declare const Skeleton: import("react").ForwardRefExoticComponent<SkeletonBaseProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2554
|
-
//#endregion
|
|
2555
|
-
//#region src/components/Stepper/Stepper.d.ts
|
|
2556
|
-
type StepperOrientation = "horizontal" | "vertical";
|
|
2557
|
-
type StepperSize = "sm" | "md" | "lg";
|
|
2558
|
-
interface StepperTriggerVariantsOptions {
|
|
2559
|
-
size?: StepperSize;
|
|
2560
|
-
className?: string;
|
|
2561
|
-
}
|
|
2562
|
-
/**
|
|
2563
|
-
* Class list for an element laid out and focus-styled as a StepperTrigger.
|
|
2564
|
-
*
|
|
2565
|
-
* Use it when a foreign interactive element must sit in a step's place — e.g.
|
|
2566
|
-
* a router link that re-enters a completed step:
|
|
2567
|
-
*
|
|
2568
|
-
* <a href="/checkout/plan" className={stepperTriggerVariants()}>
|
|
2569
|
-
* <StepperIndicator />
|
|
2570
|
-
* <StepperTitle>Choose plan</StepperTitle>
|
|
2571
|
-
* </a>
|
|
2572
|
-
*/
|
|
2573
|
-
declare function stepperTriggerVariants({ size, className }?: StepperTriggerVariantsOptions): string;
|
|
2574
|
-
interface StepperProps extends Omit<ComponentPropsWithoutRef<"ol">, "className"> {
|
|
2575
|
-
/**
|
|
2576
|
-
* Zero-based index of the current step. Steps before it read as completed,
|
|
2577
|
-
* steps after it as upcoming (per-item `completed` overrides). Set it to
|
|
2578
|
-
* the step count once the flow finishes so every step reads completed.
|
|
2579
|
-
* The stepper holds no internal state — the surrounding flow owns the step.
|
|
2580
|
-
*/
|
|
2581
|
-
value?: number;
|
|
2582
|
-
/**
|
|
2583
|
-
* Called with a step's index when its `StepperTrigger` is activated.
|
|
2584
|
-
* Update `value` from it (gate the update to keep a step unreachable).
|
|
2585
|
-
* Without triggers the stepper is a static indicator and this never fires.
|
|
2586
|
-
*/
|
|
2587
|
-
onValueChange?: (value: number, event: MouseEvent<HTMLButtonElement>) => void;
|
|
2588
|
-
/**
|
|
2589
|
-
* Enforce sequential order (the NN/g wizard default): triggers on steps
|
|
2590
|
-
* after the current one are blocked, while completed steps stay
|
|
2591
|
-
* revisitable. Blocked steps keep the upcoming look — only the explicit
|
|
2592
|
-
* `disabled` prop fades a step. Set `false` for free navigation.
|
|
2593
|
-
*/
|
|
2594
|
-
linear?: boolean;
|
|
2595
|
-
/** Layout axis. Vertical suits long labels, descriptions, and inline step content. */
|
|
2596
|
-
orientation?: StepperOrientation;
|
|
2597
|
-
/**
|
|
2598
|
-
* Indicator diameter: `sm` 24px · `md` 32px · `lg` 40px. `sm` sits exactly
|
|
2599
|
-
* on the WCAG 2.5.8 24px target-size floor — with triggers, the label
|
|
2600
|
-
* extends the target, but prefer `md`+ for touch-first surfaces.
|
|
2601
|
-
*/
|
|
2602
|
-
size?: StepperSize;
|
|
2603
|
-
/** Visually-hidden status appended to completed steps (USWDS wording). Localize it with the page. */
|
|
2604
|
-
completedLabel?: string;
|
|
2605
|
-
/** Visually-hidden status appended to upcoming steps. Localize it with the page. */
|
|
2606
|
-
incompleteLabel?: string;
|
|
2607
|
-
/** Visually-hidden status appended to invalid steps. Localize it with the page. */
|
|
2608
|
-
invalidLabel?: string;
|
|
2609
|
-
/** Replace the rendered `ol`. Preserve list semantics — they give screen-reader users the "step 2 of 4" position for free. */
|
|
2610
|
-
render?: useRender.RenderProp;
|
|
2611
|
-
/** Additional classes merged after the root recipe, e.g. `max-w-md`. */
|
|
2612
|
-
className?: string;
|
|
2613
|
-
}
|
|
2614
|
-
/**
|
|
2615
|
-
* Progress through a multi-step flow, marked up as an ordered list with
|
|
2616
|
-
* `aria-current="step"` on the current step and visually-hidden state text on
|
|
2617
|
-
* the others. It defaults to `aria-label="Progress"`; pass a localized
|
|
2618
|
-
* `aria-label` (or `aria-labelledby`) when the page language isn't English.
|
|
2619
|
-
*/
|
|
2620
|
-
declare const Stepper: import("react").ForwardRefExoticComponent<StepperProps & import("react").RefAttributes<HTMLOListElement>>;
|
|
2621
|
-
interface StepperItemProps extends Omit<ComponentPropsWithoutRef<"li">, "className"> {
|
|
2622
|
-
/** Zero-based position of this step. Drives the derived state and the number the indicator shows. */
|
|
2623
|
-
index: number;
|
|
2624
|
-
/**
|
|
2625
|
-
* Override the derived completed state — e.g. mark a skipped optional step
|
|
2626
|
-
* incomplete with `completed={false}`, or a finished later step in a free
|
|
2627
|
-
* flow with `completed`. Omit to derive from the stepper's `value`.
|
|
2628
|
-
*/
|
|
2629
|
-
completed?: boolean;
|
|
2630
|
-
/** Fade the step and block its trigger. For sequence-enforcement leave it to `linear` instead, which blocks without fading. */
|
|
2631
|
-
disabled?: boolean;
|
|
2632
|
-
/** Mark the step as failed: destructive styling, an error glyph, and the `invalidLabel` status for screen readers. */
|
|
2633
|
-
invalid?: boolean;
|
|
2634
|
-
/** Replace the rendered `li`. Preserve list-item semantics. */
|
|
2635
|
-
render?: useRender.RenderProp;
|
|
2636
|
-
/** Additional classes merged after the item recipe. */
|
|
2637
|
-
className?: string;
|
|
2638
|
-
}
|
|
2639
|
-
/**
|
|
2640
|
-
* One step in the flow. When it holds no `StepperTrigger` the item itself
|
|
2641
|
-
* carries `aria-current="step"` (the USWDS static-indicator pattern); with a
|
|
2642
|
-
* trigger, the trigger takes over so keyboard focus announces the state.
|
|
2643
|
-
*/
|
|
2644
|
-
declare const StepperItem: import("react").ForwardRefExoticComponent<StepperItemProps & import("react").RefAttributes<HTMLLIElement>>;
|
|
2645
|
-
interface StepperTriggerProps extends Omit<ComponentPropsWithoutRef<"button">, "className"> {
|
|
2646
|
-
/** Replace the rendered `button`, e.g. `render={<a href="…" />}` when steps are routed pages. Keep it interactive — static steps simply omit the trigger. */
|
|
2647
|
-
render?: useRender.RenderProp;
|
|
2648
|
-
/** Additional classes merged after the trigger recipe. */
|
|
2649
|
-
className?: string;
|
|
2650
|
-
}
|
|
2651
|
-
/**
|
|
2652
|
-
* Makes a step navigable: activating it calls the stepper's `onValueChange`
|
|
2653
|
-
* with this step's index. Under `linear` (the default) upcoming steps are
|
|
2654
|
-
* blocked automatically; completed steps stay revisitable, which is the
|
|
2655
|
-
* universal wizard convention. Carries `aria-current="step"` on the current
|
|
2656
|
-
* step so the state is announced on focus, not only while browsing the list.
|
|
2657
|
-
*/
|
|
2658
|
-
declare const StepperTrigger: import("react").ForwardRefExoticComponent<StepperTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
2659
|
-
interface StepperIndicatorProps extends Omit<ComponentPropsWithoutRef<"span">, "className" | "children"> {
|
|
2660
|
-
/**
|
|
2661
|
-
* Custom glyph — an icon, a spinner, a letter. It replaces the default
|
|
2662
|
-
* number/check/error glyph in every state (state still shows through the
|
|
2663
|
-
* fill colors and the visually-hidden status text). Mark decorative glyphs
|
|
2664
|
-
* `aria-hidden` yourself; the defaults already are.
|
|
2665
|
-
*/
|
|
2666
|
-
children?: ReactNode;
|
|
2667
|
-
/** Replace the rendered `span`. */
|
|
2668
|
-
render?: useRender.RenderProp;
|
|
2669
|
-
/** Additional classes merged after the indicator recipe, e.g. `size-3` with an empty fragment as children for a dots-only stepper. */
|
|
2670
|
-
className?: string;
|
|
2671
|
-
}
|
|
2672
|
-
/**
|
|
2673
|
-
* The step's circular marker: the step number, a check once completed, an
|
|
2674
|
-
* error glyph when invalid. Numbers and glyphs are decorative — the
|
|
2675
|
-
* visually-hidden status text rendered alongside them (`completedLabel` /
|
|
2676
|
-
* `incompleteLabel` / `invalidLabel`) plus the list position carry the state
|
|
2677
|
-
* for screen readers, following the USWDS step indicator.
|
|
2678
|
-
*/
|
|
2679
|
-
declare const StepperIndicator: import("react").ForwardRefExoticComponent<StepperIndicatorProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
2680
|
-
interface StepperTitleProps extends Omit<ComponentPropsWithoutRef<"span">, "className"> {
|
|
2681
|
-
/** Replace the rendered `span`. */
|
|
2682
|
-
render?: useRender.RenderProp;
|
|
2683
|
-
/** Additional classes merged after the title recipe, e.g. `sr-only` to keep labels for assistive technology in a compact stepper. */
|
|
2684
|
-
className?: string;
|
|
2685
|
-
}
|
|
2686
|
-
/** The step's label. Carbon guidance: keep it to one or two words. */
|
|
2687
|
-
declare const StepperTitle: import("react").ForwardRefExoticComponent<StepperTitleProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
2688
|
-
interface StepperDescriptionProps extends Omit<ComponentPropsWithoutRef<"span">, "className"> {
|
|
2689
|
-
/** Replace the rendered `span`. */
|
|
2690
|
-
render?: useRender.RenderProp;
|
|
2691
|
-
/** Additional classes merged after the description recipe. */
|
|
2692
|
-
className?: string;
|
|
2693
|
-
}
|
|
2694
|
-
/**
|
|
2695
|
-
* Secondary line under the title: helper copy, or the "Optional" marker the
|
|
2696
|
-
* W3C multi-page-forms guidance asks for on skippable steps.
|
|
2697
|
-
*/
|
|
2698
|
-
declare const StepperDescription: import("react").ForwardRefExoticComponent<StepperDescriptionProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
2699
|
-
interface StepperSeparatorProps extends Omit<ComponentPropsWithoutRef<"span">, "className"> {
|
|
2700
|
-
/** Replace the rendered `span`. Keep it hidden from assistive technology — connectors are purely visual. */
|
|
2701
|
-
render?: useRender.RenderProp;
|
|
2702
|
-
/** Additional classes merged after the separator recipe. */
|
|
2703
|
-
className?: string;
|
|
2704
|
-
}
|
|
2705
|
-
/**
|
|
2706
|
-
* Connector after a step (omit it on the last item). It fills toward the
|
|
2707
|
-
* next step horizontally and hangs below the indicator vertically — where it
|
|
2708
|
-
* tracks the item's height, so inline step content stretches it. The line
|
|
2709
|
-
* turns primary once its step completes.
|
|
2710
|
-
*/
|
|
2711
|
-
declare const StepperSeparator: import("react").ForwardRefExoticComponent<StepperSeparatorProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
2712
|
-
//#endregion
|
|
2713
|
-
//#region src/components/Switch/Switch.d.ts
|
|
2714
|
-
type SwitchSize = "sm" | "md" | "lg";
|
|
2715
|
-
type SwitchLabelPosition = "start" | "end";
|
|
2716
|
-
interface SwitchVariantsOptions {
|
|
2717
|
-
size?: SwitchSize;
|
|
2718
|
-
className?: string;
|
|
2719
|
-
}
|
|
2720
|
-
/**
|
|
2721
|
-
* Class list for the switch track itself. State styling hangs off Base UI's
|
|
2722
|
-
* data-attributes (`data-checked`, `data-disabled`, `data-readonly`,
|
|
2723
|
-
* `data-invalid`) plus `aria-invalid`.
|
|
2724
|
-
*/
|
|
2725
|
-
declare function switchVariants({ size, className }?: SwitchVariantsOptions): string;
|
|
2726
|
-
interface SwitchProps extends Omit<ComponentPropsWithoutRef<typeof Switch$1.Root>, "className"> {
|
|
2727
|
-
/**
|
|
2728
|
-
* Track size. The 24px-tall `lg` track meets the WCAG 2.5.8 target-size
|
|
2729
|
-
* floor on its own; `sm`/`md` rely on the clickable `label` (or surrounding
|
|
2730
|
-
* spacing) to extend the target. Prefer `md`+ with a label on touch-first
|
|
2731
|
-
* surfaces.
|
|
2732
|
-
*/
|
|
2733
|
-
size?: SwitchSize;
|
|
2734
|
-
/**
|
|
2735
|
-
* Visible label rendered in an enclosing `<label>`, so clicking it flips
|
|
2736
|
-
* the switch and it names the control. Without it, provide an accessible
|
|
2737
|
-
* name another way: `aria-label`, `aria-labelledby`, or an external
|
|
2738
|
-
* `<label>`. When `required` is set, the label shows a decorative asterisk.
|
|
2739
|
-
*/
|
|
2740
|
-
label?: ReactNode;
|
|
2741
|
-
/**
|
|
2742
|
-
* Supporting copy below the label, linked via `aria-describedby`. Rendered
|
|
2743
|
-
* outside the `<label>` element so screen readers announce it as the
|
|
2744
|
-
* description instead of reading it into the accessible name.
|
|
2745
|
-
*/
|
|
2746
|
-
description?: ReactNode;
|
|
2747
|
-
/**
|
|
2748
|
-
* Side of the switch the `label` text sits on. `end` (the default) reads
|
|
2749
|
-
* label-after like a Checkbox row; `start` reads text-first and pushes the
|
|
2750
|
-
* switch to the far edge when the row is stretched — the settings-list
|
|
2751
|
-
* pattern. Ignored without `label`.
|
|
2752
|
-
*/
|
|
2753
|
-
labelPosition?: SwitchLabelPosition;
|
|
2754
|
-
/** Applied to the switch track itself, also when `label`/`description` wrap it. */
|
|
2755
|
-
className?: string;
|
|
2756
|
-
}
|
|
2757
|
-
/**
|
|
2758
|
-
* On/off control built on Base UI's Switch. Reach for it when flipping the
|
|
2759
|
-
* value takes effect immediately (settings); for choices collected until a
|
|
2760
|
-
* form submit, prefer Checkbox. The thumb slide is built in behind
|
|
2761
|
-
* `motion-safe`. `ref` and `className` always target the track element,
|
|
2762
|
-
* whether or not the labelled layout wraps it.
|
|
2763
|
-
*/
|
|
2764
|
-
declare const Switch: import("react").ForwardRefExoticComponent<SwitchProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
2765
|
-
//#endregion
|
|
2766
|
-
//#region src/components/Table/Table.d.ts
|
|
2767
|
-
type TableSize = "sm" | "md" | "lg";
|
|
2768
|
-
type TableLayout = "auto" | "fixed";
|
|
2769
|
-
type TableContainerVariant = "plain" | "outline" | "elevated";
|
|
2770
|
-
type TableCaptionSide = "top" | "bottom";
|
|
2771
|
-
interface TableRenderState extends Record<string, unknown> {
|
|
2772
|
-
/** Density applied to header and data cells. */
|
|
2773
|
-
size: TableSize;
|
|
2774
|
-
/** Browser column-sizing algorithm. */
|
|
2775
|
-
layout: TableLayout;
|
|
2776
|
-
/** Whether alternating body rows receive a supporting surface. */
|
|
2777
|
-
striped: boolean;
|
|
2778
|
-
/** Whether body rows receive a hover affordance. */
|
|
2779
|
-
hoverable: boolean;
|
|
2780
|
-
/** Whether column headers stay pinned inside a scrolling container. */
|
|
2781
|
-
stickyHeader: boolean;
|
|
2782
|
-
/** Whether adjacent cells are visually separated. */
|
|
2783
|
-
showColumnBorders: boolean;
|
|
2784
|
-
}
|
|
2785
|
-
interface TableContainerRenderState extends Record<string, unknown> {
|
|
2786
|
-
/** Surface treatment surrounding the scroll area. */
|
|
2787
|
-
variant: TableContainerVariant;
|
|
2788
|
-
}
|
|
2789
|
-
interface TableCaptionRenderState extends Record<string, unknown> {
|
|
2790
|
-
/** Visual edge where the native caption is placed. */
|
|
2791
|
-
side: TableCaptionSide;
|
|
2792
|
-
}
|
|
2793
|
-
interface TableRowRenderState extends Record<string, unknown> {
|
|
2794
|
-
/** Whether the row receives the selected visual treatment. */
|
|
2795
|
-
selected: boolean;
|
|
2796
|
-
}
|
|
2797
|
-
interface TableContainerProps extends Omit<ComponentPropsWithoutRef<"div">, "className"> {
|
|
2798
|
-
/** Surface around the responsive scroll area. `elevated` is the rich card default, `outline` removes depth, and `plain` keeps only overflow behavior. */
|
|
2799
|
-
variant?: TableContainerVariant;
|
|
2800
|
-
/** Replace the rendered `div` or inspect `{ variant }` in a render callback. Preserve a suitable grouping element. */
|
|
2801
|
-
render?: useRender.RenderProp<TableContainerRenderState>;
|
|
2802
|
-
/** Additional classes merged after the container recipe; set `max-height` here to activate a sticky header. */
|
|
2803
|
-
className?: string;
|
|
2804
|
-
}
|
|
2805
|
-
declare const TableContainer: import("react").ForwardRefExoticComponent<TableContainerProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2806
|
-
interface TableProps extends Omit<ComponentPropsWithoutRef<"table">, "className"> {
|
|
2807
|
-
/** Cell density. `sm` is optimized for desktop data review; prefer `md` or `lg` for touch-heavy rows containing controls. */
|
|
2808
|
-
size?: TableSize;
|
|
2809
|
-
/** `auto` lets content size columns; `fixed` obeys explicit widths and makes truncation predictable. */
|
|
2810
|
-
layout?: TableLayout;
|
|
2811
|
-
/** Add a supporting surface to alternating rows to improve scanning across wide datasets. */
|
|
2812
|
-
striped?: boolean;
|
|
2813
|
-
/** Add a subtle body-row hover affordance. This is visual only and does not make a row interactive. */
|
|
2814
|
-
hoverable?: boolean;
|
|
2815
|
-
/** Pin column headers to the top of the nearest scrolling `TableContainer`; give the container a max height for vertical scrolling. */
|
|
2816
|
-
stickyHeader?: boolean;
|
|
2817
|
-
/** Draw semantic-border separators between adjacent columns. */
|
|
2818
|
-
showColumnBorders?: boolean;
|
|
2819
|
-
/** Replace the rendered `table` or inspect the visual state in a render callback. Preserve native table semantics. */
|
|
2820
|
-
render?: useRender.RenderProp<TableRenderState>;
|
|
2821
|
-
/** Additional classes for table width, minimum width, or context-specific layout. */
|
|
2822
|
-
className?: string;
|
|
2823
|
-
}
|
|
2824
|
-
declare const Table: import("react").ForwardRefExoticComponent<TableProps & import("react").RefAttributes<HTMLTableElement>>;
|
|
2825
|
-
interface TableHeaderProps extends Omit<ComponentPropsWithoutRef<"thead">, "className"> {
|
|
2826
|
-
/** Replace the rendered `thead`. Preserve its row-group semantics. */
|
|
2827
|
-
render?: useRender.RenderProp;
|
|
2828
|
-
/** Additional classes merged after the header recipe. */
|
|
2829
|
-
className?: string;
|
|
2830
|
-
}
|
|
2831
|
-
declare const TableHeader: import("react").ForwardRefExoticComponent<TableHeaderProps & import("react").RefAttributes<HTMLTableSectionElement>>;
|
|
2832
|
-
interface TableBodyProps extends Omit<ComponentPropsWithoutRef<"tbody">, "className"> {
|
|
2833
|
-
/** Replace the rendered `tbody`. Preserve its row-group semantics. */
|
|
2834
|
-
render?: useRender.RenderProp;
|
|
2835
|
-
/** Additional classes merged after the body recipe. */
|
|
2836
|
-
className?: string;
|
|
2837
|
-
}
|
|
2838
|
-
declare const TableBody: import("react").ForwardRefExoticComponent<TableBodyProps & import("react").RefAttributes<HTMLTableSectionElement>>;
|
|
2839
|
-
interface TableFooterProps extends Omit<ComponentPropsWithoutRef<"tfoot">, "className"> {
|
|
2840
|
-
/** Replace the rendered `tfoot`. Preserve its row-group semantics. */
|
|
2841
|
-
render?: useRender.RenderProp;
|
|
2842
|
-
/** Additional classes merged after the footer recipe. */
|
|
2843
|
-
className?: string;
|
|
2844
|
-
}
|
|
2845
|
-
declare const TableFooter: import("react").ForwardRefExoticComponent<TableFooterProps & import("react").RefAttributes<HTMLTableSectionElement>>;
|
|
2846
|
-
interface TableRowProps extends Omit<ComponentPropsWithoutRef<"tr">, "className"> {
|
|
2847
|
-
/** Apply the selected visual treatment. In a native data table, the composed checkbox or control must expose the accessible checked state; use an advanced grid for row-level selection semantics. */
|
|
2848
|
-
selected?: boolean;
|
|
2849
|
-
/** Replace the rendered `tr` or inspect `{ selected }` in a render callback. Preserve its row semantics. */
|
|
2850
|
-
render?: useRender.RenderProp<TableRowRenderState>;
|
|
2851
|
-
/** Additional classes merged after the row recipe. */
|
|
2852
|
-
className?: string;
|
|
2853
|
-
}
|
|
2854
|
-
declare const TableRow: import("react").ForwardRefExoticComponent<TableRowProps & import("react").RefAttributes<HTMLTableRowElement>>;
|
|
2855
|
-
interface TableHeadProps extends Omit<ComponentPropsWithoutRef<"th">, "className"> {
|
|
2856
|
-
/** Replace the rendered `th`. Preserve header-cell semantics and set `scope`, `id`, and `headers` as the table structure requires. */
|
|
2857
|
-
render?: useRender.RenderProp;
|
|
2858
|
-
/** Additional classes for alignment, width, truncation, or a sortable-header button. */
|
|
2859
|
-
className?: string;
|
|
2860
|
-
}
|
|
2861
|
-
declare const TableHead: import("react").ForwardRefExoticComponent<TableHeadProps & import("react").RefAttributes<HTMLTableCellElement>>;
|
|
2862
|
-
interface TableCellProps extends Omit<ComponentPropsWithoutRef<"td">, "className"> {
|
|
2863
|
-
/** Replace the rendered `td`. Preserve data-cell semantics; use `headers` for complex header relationships. */
|
|
2864
|
-
render?: useRender.RenderProp;
|
|
2865
|
-
/** Additional classes for alignment, width, truncation, or tabular numeric data. */
|
|
2866
|
-
className?: string;
|
|
2867
|
-
}
|
|
2868
|
-
declare const TableCell: import("react").ForwardRefExoticComponent<TableCellProps & import("react").RefAttributes<HTMLTableCellElement>>;
|
|
2869
|
-
interface TableCaptionProps extends Omit<ComponentPropsWithoutRef<"caption">, "className"> {
|
|
2870
|
-
/** Place the native caption above or below the data. Captions identify tables for screen-reader navigation. */
|
|
2871
|
-
side?: TableCaptionSide;
|
|
2872
|
-
/** Replace the rendered `caption`. Preserve caption semantics so the table keeps its accessible name. */
|
|
2873
|
-
render?: useRender.RenderProp<TableCaptionRenderState>;
|
|
2874
|
-
/** Additional classes merged after the caption recipe. */
|
|
2875
|
-
className?: string;
|
|
2876
|
-
}
|
|
2877
|
-
declare const TableCaption: import("react").ForwardRefExoticComponent<TableCaptionProps & import("react").RefAttributes<HTMLTableCaptionElement>>;
|
|
2878
|
-
//#endregion
|
|
2879
|
-
//#region src/components/Tabs/Tabs.d.ts
|
|
2880
|
-
type TabsVariant = "underline" | "pills";
|
|
2881
|
-
type TabsSize = "sm" | "md" | "lg";
|
|
2882
|
-
type TabsIndicatorPosition = "start" | "end";
|
|
2883
|
-
interface TabsListVariantsOptions {
|
|
2884
|
-
variant?: TabsVariant;
|
|
2885
|
-
fullWidth?: boolean;
|
|
2886
|
-
/** Show the passive divider behind an underline list. Has no effect on pills. */
|
|
2887
|
-
showDivider?: boolean;
|
|
2888
|
-
/** Edge used by the divider when the styled element is a vertical underline list. */
|
|
2889
|
-
indicatorPosition?: TabsIndicatorPosition;
|
|
2890
|
-
className?: string;
|
|
2891
|
-
}
|
|
2892
|
-
/**
|
|
2893
|
-
* Class list for an element styled as a TabsList.
|
|
2894
|
-
*
|
|
2895
|
-
* For navigation that only *looks* like tabs (each "tab" is a different
|
|
2896
|
-
* page), keep honest semantics — a `<nav>` of links with `aria-current`, not
|
|
2897
|
-
* `role="tablist"`:
|
|
2898
|
-
*
|
|
2899
|
-
* <nav aria-label="Settings" className={tabsListVariants()}>
|
|
2900
|
-
* <a href="/profile" aria-current="page" className={tabsTabVariants({ active: true })}>Profile</a>
|
|
2901
|
-
* <a href="/billing" className={tabsTabVariants()}>Billing</a>
|
|
2902
|
-
* </nav>
|
|
2903
|
-
*/
|
|
2904
|
-
declare function tabsListVariants({ variant, fullWidth, showDivider, indicatorPosition, className }?: TabsListVariantsOptions): string;
|
|
2905
|
-
interface TabsTabVariantsOptions {
|
|
2906
|
-
variant?: TabsVariant;
|
|
2907
|
-
size?: TabsSize;
|
|
2908
|
-
/**
|
|
2909
|
-
* Style as the selected item — the static replacement for Base UI's
|
|
2910
|
-
* `data-active` on plain nav elements: underline gains an inset 2px primary
|
|
2911
|
-
* bar, pills the raised card.
|
|
2912
|
-
*/
|
|
2913
|
-
active?: boolean;
|
|
2914
|
-
fullWidth?: boolean;
|
|
2915
|
-
className?: string;
|
|
2916
|
-
}
|
|
2917
|
-
/** Class list for an element styled as a TabsTab (see tabsListVariants). */
|
|
2918
|
-
declare function tabsTabVariants({ variant, size, active, fullWidth, className }?: TabsTabVariantsOptions): string;
|
|
2919
|
-
interface TabsProps extends Omit<ComponentPropsWithoutRef<typeof Tabs$1.Root>, "className"> {
|
|
2920
|
-
/**
|
|
2921
|
-
* Visual style shared by every part: `underline` (default) marks the active
|
|
2922
|
-
* tab with a 2px primary bar on the list's divider; `pills` renders a
|
|
2923
|
-
* segmented control — a muted track with a raised card sliding to the
|
|
2924
|
-
* active tab.
|
|
2925
|
-
*/
|
|
2926
|
-
variant?: TabsVariant;
|
|
2927
|
-
/**
|
|
2928
|
-
* Control density. Underline tabs are 32/40/48px tall; pill tabs are
|
|
2929
|
-
* 24/32/40px inside the track's padding, so `sm` pills sit exactly on the
|
|
2930
|
-
* WCAG 2.5.8 24px target-size floor — prefer `md`+ for touch-first
|
|
2931
|
-
* surfaces.
|
|
2932
|
-
*/
|
|
2933
|
-
size?: TabsSize;
|
|
2934
|
-
/** Stretch tabs to share the full list width equally. Horizontal orientation only. */
|
|
2935
|
-
fullWidth?: boolean;
|
|
2936
|
-
/**
|
|
2937
|
-
* Show the muted divider behind the active indicator in `underline` tabs.
|
|
2938
|
-
* Set to `false` for an indicator-only treatment. The primary active
|
|
2939
|
-
* indicator remains visible; this has no visual effect on `pills`.
|
|
2940
|
-
*/
|
|
2941
|
-
showDivider?: boolean;
|
|
2942
|
-
/**
|
|
2943
|
-
* Edge for the active indicator and divider in vertical underline tabs.
|
|
2944
|
-
* `start` is left in LTR and right in RTL; `end` (default) is the opposite.
|
|
2945
|
-
* Has no visual effect on horizontal or pill tabs.
|
|
2946
|
-
*/
|
|
2947
|
-
indicatorPosition?: TabsIndicatorPosition;
|
|
2948
|
-
className?: string;
|
|
2949
|
-
}
|
|
2950
|
-
/**
|
|
2951
|
-
* Groups the tab list and its panels; lays them out in a column, or a row
|
|
2952
|
-
* when `orientation="vertical"`.
|
|
2953
|
-
*/
|
|
2954
|
-
declare const Tabs: import("react").ForwardRefExoticComponent<TabsProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2955
|
-
interface TabsListProps extends Omit<ComponentPropsWithoutRef<typeof Tabs$1.List>, "className" | "activateOnFocus"> {
|
|
2956
|
-
/**
|
|
2957
|
-
* Whether arrow-key focus immediately activates the focused tab. Defaults
|
|
2958
|
-
* to `true` (automatic activation — the WAI-ARIA APG recommendation when
|
|
2959
|
-
* panels render instantly); Base UI's own default is manual. Set `false`
|
|
2960
|
-
* so Enter/Space activates instead when merely mounting a panel is
|
|
2961
|
-
* expensive, e.g. it fetches on mount.
|
|
2962
|
-
*/
|
|
2963
|
-
activateOnFocus?: boolean;
|
|
2964
|
-
className?: string;
|
|
2965
|
-
}
|
|
2966
|
-
/**
|
|
2967
|
-
* Container for the tab buttons. Renders Base UI's `Tabs.Indicator` after the
|
|
2968
|
-
* tabs automatically, so the sliding active-tab marker comes for free — don't
|
|
2969
|
-
* add one manually. (The indicator positions itself on the client; before
|
|
2970
|
-
* hydration the active tab is still distinguished by its text color.)
|
|
2971
|
-
*/
|
|
2972
|
-
declare const TabsList: import("react").ForwardRefExoticComponent<TabsListProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2973
|
-
interface TabsTabProps extends Omit<ComponentPropsWithoutRef<typeof Tabs$1.Tab>, "className"> {
|
|
2974
|
-
className?: string;
|
|
2975
|
-
}
|
|
2976
|
-
/**
|
|
2977
|
-
* One tab button; its `value` pairs it with a `TabsPanel`. Icons and badges
|
|
2978
|
-
* ride along as children and inherit the icon sizing. For route-driven tabs,
|
|
2979
|
-
* render a real link: `render={<a href="…" />}` plus `nativeButton={false}`.
|
|
2980
|
-
*/
|
|
2981
|
-
declare const TabsTab: import("react").ForwardRefExoticComponent<TabsTabProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
2982
|
-
interface TabsPanelProps extends Omit<ComponentPropsWithoutRef<typeof Tabs$1.Panel>, "className"> {
|
|
2983
|
-
className?: string;
|
|
2984
|
-
}
|
|
2985
|
-
/**
|
|
2986
|
-
* Content shown while its `value` matches the active tab. Hidden panels are
|
|
2987
|
-
* unmounted unless `keepMounted` is set — use it to preserve form state or
|
|
2988
|
-
* scroll position across switches.
|
|
2989
|
-
*/
|
|
2990
|
-
declare const TabsPanel: import("react").ForwardRefExoticComponent<TabsPanelProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
2991
|
-
//#endregion
|
|
2992
|
-
//#region src/components/Timeline/Timeline.d.ts
|
|
2993
|
-
type TimelineSize = "sm" | "md" | "lg";
|
|
2994
|
-
type TimelineIndicatorVariant = "neutral" | "primary" | "success" | "warning" | "destructive";
|
|
2995
|
-
type TimelineIndicatorAppearance = "solid" | "soft" | "outline";
|
|
2996
|
-
type TimelineSeparatorVariant = "solid" | "dashed";
|
|
2997
|
-
interface TimelineProps extends Omit<ComponentPropsWithoutRef<"ol">, "className"> {
|
|
2998
|
-
/**
|
|
2999
|
-
* Marker diameter and type scale: `sm` 16px · `md` 20px · `lg` 24px.
|
|
3000
|
-
* Markers are non-interactive, so WCAG target-size floors don't apply —
|
|
3001
|
-
* pick by information density, `sm` for compact logs.
|
|
3002
|
-
*/
|
|
3003
|
-
size?: TimelineSize;
|
|
3004
|
-
/** Replace the rendered `ol`. Preserve list semantics — they give screen-reader users the "2 of 5" position for free. */
|
|
3005
|
-
render?: useRender.RenderProp;
|
|
3006
|
-
/** Additional classes merged after the root recipe, e.g. `max-w-md`. */
|
|
3007
|
-
className?: string;
|
|
3008
|
-
}
|
|
3009
|
-
/**
|
|
3010
|
-
* A chronological list of events, marked up as an ordered list. The timeline
|
|
3011
|
-
* is display-only — it holds no current-step state (progress through a flow
|
|
3012
|
-
* is Stepper's job) and renders whatever order it receives; feeds usually
|
|
3013
|
-
* pass newest-first. Give the list an accessible name (`aria-label` or
|
|
3014
|
-
* `aria-labelledby`, e.g. "Deployment history") when the surrounding context
|
|
3015
|
-
* doesn't already announce one.
|
|
3016
|
-
*/
|
|
3017
|
-
declare const Timeline: import("react").ForwardRefExoticComponent<TimelineProps & import("react").RefAttributes<HTMLOListElement>>;
|
|
3018
|
-
interface TimelineItemProps extends Omit<ComponentPropsWithoutRef<"li">, "className"> {
|
|
3019
|
-
/** Replace the rendered `li`. Preserve list-item semantics. */
|
|
3020
|
-
render?: useRender.RenderProp;
|
|
3021
|
-
/** Additional classes merged after the item recipe. */
|
|
3022
|
-
className?: string;
|
|
3023
|
-
}
|
|
3024
|
-
/**
|
|
3025
|
-
* One event: a flex row of an optional leading `TimelineContent` (opposite
|
|
3026
|
-
* side), the `TimelineConnector` column, and the trailing `TimelineContent`.
|
|
3027
|
-
*/
|
|
3028
|
-
declare const TimelineItem: import("react").ForwardRefExoticComponent<TimelineItemProps & import("react").RefAttributes<HTMLLIElement>>;
|
|
3029
|
-
interface TimelineConnectorProps extends Omit<ComponentPropsWithoutRef<"div">, "className"> {
|
|
3030
|
-
/** Replace the rendered `div`. */
|
|
3031
|
-
render?: useRender.RenderProp;
|
|
3032
|
-
/** Additional classes merged after the connector recipe. */
|
|
3033
|
-
className?: string;
|
|
3034
|
-
}
|
|
3035
|
-
/**
|
|
3036
|
-
* The marker column: it stretches to the item's height and stacks the
|
|
3037
|
-
* `TimelineIndicator` above the `TimelineSeparator`, which fills the rest —
|
|
3038
|
-
* so the rail always reaches the next item's marker, however tall the
|
|
3039
|
-
* content grows.
|
|
3040
|
-
*/
|
|
3041
|
-
declare const TimelineConnector: import("react").ForwardRefExoticComponent<TimelineConnectorProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
3042
|
-
interface TimelineIndicatorProps extends Omit<ComponentPropsWithoutRef<"span">, "className"> {
|
|
3043
|
-
/** Status color of the marker, reusing the Badge vocabulary. */
|
|
3044
|
-
variant?: TimelineIndicatorVariant;
|
|
3045
|
-
/**
|
|
3046
|
-
* Fill treatment: `solid` is the classic filled dot, `soft` the tinted
|
|
3047
|
-
* icon circle, `outline` a hollow ring — the upcoming/unreached look in
|
|
3048
|
-
* tracking timelines.
|
|
3049
|
-
*/
|
|
3050
|
-
appearance?: TimelineIndicatorAppearance;
|
|
3051
|
-
/** Replace the rendered `span`, e.g. with an `Avatar` for actor feeds. */
|
|
3052
|
-
render?: useRender.RenderProp;
|
|
3053
|
-
/** Additional classes merged after the marker recipe, e.g. `size-8` for an avatar-sized marker. */
|
|
3054
|
-
className?: string;
|
|
3055
|
-
}
|
|
3056
|
-
/**
|
|
3057
|
-
* The event's marker. Empty it renders as a plain dot; children (an icon, a
|
|
3058
|
-
* spinner, a letter) center inside it. Glyphs are decorative next to the
|
|
3059
|
-
* event's own text — mark them `aria-hidden`; when the marker alone carries
|
|
3060
|
-
* meaning (a bare status dot), pair it with visually-hidden text in the
|
|
3061
|
-
* content instead.
|
|
3062
|
-
*/
|
|
3063
|
-
declare const TimelineIndicator: import("react").ForwardRefExoticComponent<TimelineIndicatorProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
3064
|
-
interface TimelineSeparatorProps extends Omit<ComponentPropsWithoutRef<"span">, "className"> {
|
|
3065
|
-
/** Line style. `dashed` marks an unfinished stretch — the rail into upcoming or in-progress events. */
|
|
3066
|
-
variant?: TimelineSeparatorVariant;
|
|
3067
|
-
/** Replace the rendered `span`. Keep it hidden from assistive technology — the rail is purely visual. */
|
|
3068
|
-
render?: useRender.RenderProp;
|
|
3069
|
-
/** Additional classes merged after the separator recipe, e.g. `border-primary` for a completed stretch. */
|
|
3070
|
-
className?: string;
|
|
3071
|
-
}
|
|
3072
|
-
/**
|
|
3073
|
-
* The rail segment below a marker, connecting it to the next event. Omit it
|
|
3074
|
-
* on the last item so the timeline ends at its final marker.
|
|
3075
|
-
*/
|
|
3076
|
-
declare const TimelineSeparator: import("react").ForwardRefExoticComponent<TimelineSeparatorProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
3077
|
-
interface TimelineContentProps extends Omit<ComponentPropsWithoutRef<"div">, "className"> {
|
|
3078
|
-
/** Replace the rendered `div`. */
|
|
3079
|
-
render?: useRender.RenderProp;
|
|
3080
|
-
/**
|
|
3081
|
-
* Additional classes merged after the content recipe. A leading (opposite
|
|
3082
|
-
* side) copy usually caps its width and right-aligns: `flex-none w-24
|
|
3083
|
-
* text-end`; leave both sides `flex-1` to center the rail for alternating
|
|
3084
|
-
* layouts.
|
|
3085
|
-
*/
|
|
3086
|
-
className?: string;
|
|
3087
|
-
}
|
|
3088
|
-
/**
|
|
3089
|
-
* The event's body, holding `TimelineTitle` / `TimelineTime` /
|
|
3090
|
-
* `TimelineDescription` or any richer blocks. It carries the spacing between
|
|
3091
|
-
* items, so the connector's rail spans the full distance to the next marker.
|
|
3092
|
-
* Place one before the connector for opposite-side content (dates in a
|
|
3093
|
-
* roadmap, alternating layouts).
|
|
3094
|
-
*/
|
|
3095
|
-
declare const TimelineContent: import("react").ForwardRefExoticComponent<TimelineContentProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
3096
|
-
interface TimelineTitleProps extends Omit<ComponentPropsWithoutRef<"span">, "className"> {
|
|
3097
|
-
/** Replace the rendered `span`, e.g. `render={<h3 />}` when changelog entries belong in the document outline. */
|
|
3098
|
-
render?: useRender.RenderProp;
|
|
3099
|
-
/** Additional classes merged after the title recipe. */
|
|
3100
|
-
className?: string;
|
|
3101
|
-
}
|
|
3102
|
-
/** The event's one-line headline. */
|
|
3103
|
-
declare const TimelineTitle: import("react").ForwardRefExoticComponent<TimelineTitleProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
3104
|
-
interface TimelineDescriptionProps extends Omit<ComponentPropsWithoutRef<"span">, "className"> {
|
|
3105
|
-
/** Replace the rendered `span`. */
|
|
3106
|
-
render?: useRender.RenderProp;
|
|
3107
|
-
/** Additional classes merged after the description recipe. */
|
|
3108
|
-
className?: string;
|
|
3109
|
-
}
|
|
3110
|
-
/** Supporting copy under the title. */
|
|
3111
|
-
declare const TimelineDescription: import("react").ForwardRefExoticComponent<TimelineDescriptionProps & import("react").RefAttributes<HTMLSpanElement>>;
|
|
3112
|
-
interface TimelineTimeProps extends Omit<ComponentPropsWithoutRef<"time">, "className"> {
|
|
3113
|
-
/** Replace the rendered `time`. */
|
|
3114
|
-
render?: useRender.RenderProp;
|
|
3115
|
-
/** Additional classes merged after the time recipe. */
|
|
3116
|
-
className?: string;
|
|
3117
|
-
}
|
|
3118
|
-
/**
|
|
3119
|
-
* The event's timestamp as a real `<time>` element. Feeds abbreviate the
|
|
3120
|
-
* visible text ("3h", "May 12") — keep the absolute moment machine-readable
|
|
3121
|
-
* in `dateTime`, and put it in the human-readable `title` when the visible
|
|
3122
|
-
* form is relative.
|
|
3123
|
-
*/
|
|
3124
|
-
declare const TimelineTime: import("react").ForwardRefExoticComponent<TimelineTimeProps & import("react").RefAttributes<HTMLTimeElement>>;
|
|
3125
|
-
//#endregion
|
|
3126
|
-
//#region src/components/Toast/Toast.d.ts
|
|
3127
|
-
type ToastPosition = "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
|
|
3128
|
-
/**
|
|
3129
|
-
* The severity values the built-in styling recognizes (icon + color, and
|
|
3130
|
-
* `loading` renders a spinner). Base UI's `type` field is an open string —
|
|
3131
|
-
* unknown values render the neutral look with no icon.
|
|
3132
|
-
*/
|
|
3133
|
-
type ToastType = "success" | "error" | "warning" | "info" | "loading";
|
|
3134
|
-
/** Per-toast extension data the ArcFusion `Toaster` understands. */
|
|
3135
|
-
interface ToastData {
|
|
3136
|
-
/**
|
|
3137
|
-
* Custom leading icon, replacing the automatic `type` icon. Sized to the
|
|
3138
|
-
* 20px slot unless the node carries its own `size-*` class.
|
|
3139
|
-
*/
|
|
3140
|
-
icon?: ReactNode;
|
|
3141
|
-
[key: string]: unknown;
|
|
3142
|
-
}
|
|
3143
|
-
/** Options for `toast.add` — Base UI's add options with ArcFusion `data`. */
|
|
3144
|
-
interface ToastOptions extends ToastManagerAddOptions<ToastData> {}
|
|
3145
|
-
/** Options for `toast.update` and the object states of `toast.promise`. */
|
|
3146
|
-
interface ToastUpdateOptions extends ToastManagerUpdateOptions<ToastData> {}
|
|
3147
|
-
/** State map for `toast.promise` — strings are shorthand for `{ title }`. */
|
|
3148
|
-
type ToastPromiseOptions<Value> = ToastManagerPromiseOptions<Value, ToastData>;
|
|
3149
|
-
/** A toast manager, as returned by `createToastManager()`. */
|
|
3150
|
-
type ToastManager<Data extends object = any> = ToastManager$1<Data>;
|
|
3151
|
-
/** A queued toast as the manager tracks it (id, content, type, timing). */
|
|
3152
|
-
type ToastObject<Data extends object = ToastData> = ToastObject$1<Data>;
|
|
3153
|
-
/**
|
|
3154
|
-
* Creates an isolated toast manager for a scoped `<Toaster />` (a preview
|
|
3155
|
-
* frame, a second stack with different placement, tests). Pass it to that
|
|
3156
|
-
* Toaster's `toastManager` prop and call `manager.add/close/update/promise`
|
|
3157
|
-
* on it directly — the `toast` helpers always target the built-in default
|
|
3158
|
-
* manager, not scoped ones.
|
|
3159
|
-
*/
|
|
3160
|
-
declare const createToastManager: typeof Toast.createToastManager;
|
|
3161
|
-
type ToastHelperOptions = Omit<ToastOptions, "title" | "type">;
|
|
3162
|
-
/**
|
|
3163
|
-
* Imperative toast API, callable from anywhere — components, stores, fetch
|
|
3164
|
-
* wrappers. Requires one default `<Toaster />` (no `toastManager` prop)
|
|
3165
|
-
* mounted in the app. Every method accepts Base UI's full option set
|
|
3166
|
-
* (`description`, `timeout`, `priority`, `onClose`, `actionProps`,
|
|
3167
|
-
* `data.icon`, …); `add` with an existing `id` updates that toast in place,
|
|
3168
|
-
* which is how repeated events deduplicate.
|
|
3169
|
-
*/
|
|
3170
|
-
declare const toast: {
|
|
3171
|
-
/** Queue a toast with full control over its options. Returns the toast id. */
|
|
3172
|
-
add(options: ToastOptions): string;
|
|
3173
|
-
/** Success feedback: green check icon, polite announcement. */
|
|
3174
|
-
success(title: ReactNode, options?: ToastHelperOptions): string;
|
|
3175
|
-
/** Informational notice: blue info icon, polite announcement. */
|
|
3176
|
-
info(title: ReactNode, options?: ToastHelperOptions): string;
|
|
3177
|
-
/** Warning: amber triangle icon, polite announcement. */
|
|
3178
|
-
warning(title: ReactNode, options?: ToastHelperOptions): string;
|
|
3179
|
-
/**
|
|
3180
|
-
* Failure feedback: red icon, announced assertively (`priority: "high"`)
|
|
3181
|
-
* so screen readers interrupt with it, as errors warrant. For critical
|
|
3182
|
-
* errors the user must act on, add `timeout: 0` so the toast persists.
|
|
3183
|
-
*/
|
|
3184
|
-
error(title: ReactNode, options?: ToastHelperOptions): string;
|
|
3185
|
-
/**
|
|
3186
|
-
* Spinner toast for manual async flows. Never auto-dismisses (the
|
|
3187
|
-
* operation decides when it ends) — resolve it via
|
|
3188
|
-
* `toast.update(id, { type: "success", … })` or `toast.close(id)`.
|
|
3189
|
-
* Prefer `toast.promise` when a promise already models the operation.
|
|
3190
|
-
*/
|
|
3191
|
-
loading(title: ReactNode, options?: ToastHelperOptions): string;
|
|
3192
|
-
/**
|
|
3193
|
-
* One toast tracking a promise through loading → success/error, switching
|
|
3194
|
-
* `type` (spinner → check/cross) at each step. States take a string
|
|
3195
|
-
* (shorthand for the title), an options object, or — for
|
|
3196
|
-
* `success`/`error` — a function of the resolved value/rejection reason.
|
|
3197
|
-
* Returns the input promise's result, so it can be awaited in place.
|
|
3198
|
-
*/
|
|
3199
|
-
promise<Value>(promise: Promise<Value>, options: ToastPromiseOptions<Value>): Promise<Value>;
|
|
3200
|
-
/** Update a queued toast in place (content, type, timing) by id. */
|
|
3201
|
-
update(toastId: string, options: ToastUpdateOptions): void;
|
|
3202
|
-
/** Close one toast by id, or every toast when called with no argument. */
|
|
3203
|
-
close(toastId?: string): void;
|
|
3204
|
-
};
|
|
3205
|
-
interface ToasterProps extends Omit<ComponentPropsWithoutRef<typeof Toast.Viewport>, "className" | "children"> {
|
|
3206
|
-
/**
|
|
3207
|
-
* Screen corner or edge the stack anchors to. Toasts enter from, exit
|
|
3208
|
-
* toward, and swipe-dismiss past the nearest edges. `bottom-right` is the
|
|
3209
|
-
* desktop convention; prefer a `*-center` position on mobile-first
|
|
3210
|
-
* surfaces.
|
|
3211
|
-
*/
|
|
3212
|
-
position?: ToastPosition;
|
|
3213
|
-
/**
|
|
3214
|
-
* Maximum number of toasts shown at once — older ones hide (`inert`)
|
|
3215
|
-
* until room frees up. The cap keeps bursts from covering the page.
|
|
3216
|
-
*/
|
|
3217
|
-
limit?: number;
|
|
3218
|
-
/**
|
|
3219
|
-
* Default auto-dismiss delay in ms; per-toast `timeout` overrides it and
|
|
3220
|
-
* `0` persists until dismissed. Timers pause while the stack is hovered
|
|
3221
|
-
* or focused, so reading is never raced.
|
|
3222
|
-
*/
|
|
3223
|
-
timeout?: number;
|
|
3224
|
-
/**
|
|
3225
|
-
* Render toasts from this manager (see `createToastManager`) instead of
|
|
3226
|
-
* the built-in one the `toast` helpers target. Mount exactly one Toaster
|
|
3227
|
-
* per manager — two Toasters on the same manager render every toast
|
|
3228
|
-
* twice.
|
|
3229
|
-
*/
|
|
3230
|
-
toastManager?: ToastManager;
|
|
3231
|
-
/** Element the stack portals into instead of `<body>` — for scoped stacking contexts or inline previews. */
|
|
3232
|
-
container?: ComponentPropsWithoutRef<typeof Toast.Portal>["container"];
|
|
3233
|
-
/** Accessible name of each toast's dismiss button — localize it alongside your content. */
|
|
3234
|
-
closeLabel?: string;
|
|
3235
|
-
/**
|
|
3236
|
-
* Applied to the viewport. Sizing hook: the stack is 22.5rem wide on
|
|
3237
|
-
* `sm+` (full-width minus margins below) — override with `sm:w-*`.
|
|
3238
|
-
*/
|
|
3239
|
-
className?: string;
|
|
3240
|
-
}
|
|
3241
|
-
/**
|
|
3242
|
-
* The toast stack. Mount one per app (typically at the root); after that,
|
|
3243
|
-
* `toast.success("Saved")` & co. work from anywhere. Bundles Base UI's
|
|
3244
|
-
* Provider, Portal, and Viewport with fully styled toasts: severity icon,
|
|
3245
|
-
* title, description, optional action button, and an always-visible
|
|
3246
|
-
* dismiss button.
|
|
3247
|
-
*
|
|
3248
|
-
* Collapsed toasts stack with a peek; hovering or focusing the stack
|
|
3249
|
-
* expands it and pauses dismiss timers. Every toast can be dismissed by
|
|
3250
|
-
* pointer (×), swipe, or keyboard, and F6 jumps focus into the stack.
|
|
3251
|
-
* Announcements use the toast's `title`/`description` strings — polite by
|
|
3252
|
-
* default, assertive for `priority: "high"`. The stack portals to `<body>`;
|
|
3253
|
-
* consumer apps should set `isolation: isolate` on their root so page
|
|
3254
|
-
* stacking contexts stay below it.
|
|
3255
|
-
*/
|
|
3256
|
-
declare const Toaster: import("react").ForwardRefExoticComponent<ToasterProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
3257
|
-
//#endregion
|
|
3258
|
-
//#region src/components/Tooltip/Tooltip.d.ts
|
|
3259
|
-
/**
|
|
3260
|
-
* Shares tooltip timing for every tooltip inside it: `delay`/`closeDelay`
|
|
3261
|
-
* set the subtree's defaults, and once one tooltip has shown, moving to a
|
|
3262
|
-
* nearby trigger within `timeout` (400ms) opens the next tooltip instantly
|
|
3263
|
-
* instead of re-waiting the open delay. Mount one around toolbars and icon
|
|
3264
|
-
* rows (or once at the app root) — without it every tooltip waits the full
|
|
3265
|
-
* delay on its own.
|
|
3266
|
-
*/
|
|
3267
|
-
declare const TooltipProvider: import("react").FC<import("@base-ui/react").TooltipProviderProps>;
|
|
3268
|
-
type TooltipProviderProps = ComponentPropsWithoutRef<typeof Tooltip$1.Provider>;
|
|
3269
|
-
/**
|
|
3270
|
-
* Groups the tooltip parts and owns the open state. Accepts Base UI's Root
|
|
3271
|
-
* props: `open`/`defaultOpen`/`onOpenChange` for control, `disabled` to keep
|
|
3272
|
-
* the tooltip from opening, `trackCursorAxis` to follow the pointer (chart
|
|
3273
|
-
* and canvas surfaces), `actionsRef` for imperative close, and
|
|
3274
|
-
* `handle`/`triggerId` for detached triggers.
|
|
3275
|
-
*/
|
|
3276
|
-
declare const Tooltip: <Payload>(props: Tooltip$1.Root.Props<Payload>) => import("react").JSX.Element;
|
|
3277
|
-
type TooltipProps = ComponentPropsWithoutRef<typeof Tooltip$1.Root>;
|
|
3278
|
-
/**
|
|
3279
|
-
* Creates a handle that links `Tooltip` with `TooltipTrigger`s rendered
|
|
3280
|
-
* elsewhere in the tree (table rows, toolbars). Triggers may attach a
|
|
3281
|
-
* `payload`, which the `Tooltip` children render function receives — one
|
|
3282
|
-
* mounted tooltip serving many targets.
|
|
3283
|
-
*/
|
|
3284
|
-
declare const createTooltipHandle: typeof Tooltip$1.createHandle;
|
|
3285
|
-
type TooltipHandle<Payload = unknown> = Tooltip$1.Handle<Payload>;
|
|
3286
|
-
interface TooltipTriggerProps extends Omit<ComponentPropsWithoutRef<typeof Tooltip$1.Trigger>, "className"> {
|
|
3287
|
-
className?: string;
|
|
3288
|
-
}
|
|
3289
|
-
/**
|
|
3290
|
-
* The element the tooltip describes. A `<button>` by default and unstyled on
|
|
3291
|
-
* purpose — compose the real control via `render`:
|
|
3292
|
-
*
|
|
3293
|
-
* <TooltipTrigger render={<Button iconOnly aria-label="Delete" />}>
|
|
3294
|
-
* <TrashIcon />
|
|
3295
|
-
* </TooltipTrigger>
|
|
3296
|
-
*
|
|
3297
|
-
* The popup text is invisible to assistive technology (see `TooltipPopup`),
|
|
3298
|
-
* so the trigger must carry its own accessible name — icon-only Buttons
|
|
3299
|
-
* already enforce one at the type level. Non-interactive targets (truncated
|
|
3300
|
-
* text, a wrapper around a disabled control) need `render={<span tabIndex={0} />}`
|
|
3301
|
-
* so keyboard users can focus them to see the hint. Per-trigger timing comes
|
|
3302
|
-
* from `delay`/`closeDelay` (600/0ms defaults); while its tooltip is open the
|
|
3303
|
-
* element carries `data-popup-open` as a styling hook.
|
|
3304
|
-
*/
|
|
3305
|
-
declare const TooltipTrigger: import("react").ForwardRefExoticComponent<TooltipTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
|
|
3306
|
-
type BasePositionerProps = ComponentPropsWithoutRef<typeof Tooltip$1.Positioner>;
|
|
3307
|
-
type TooltipSide = NonNullable<BasePositionerProps["side"]>;
|
|
3308
|
-
type TooltipAlign = NonNullable<BasePositionerProps["align"]>;
|
|
3309
|
-
interface TooltipPopupVariantsOptions {
|
|
3310
|
-
className?: string;
|
|
3311
|
-
}
|
|
3312
|
-
/**
|
|
3313
|
-
* Class list for an element styled as the tooltip chip — for floating hints
|
|
3314
|
-
* that don't come from Base UI (chart hover tooltips, custom floating-ui
|
|
3315
|
-
* popups) so every hint in the product shares one look.
|
|
3316
|
-
*/
|
|
3317
|
-
declare function tooltipPopupVariants({ className }?: TooltipPopupVariantsOptions): string;
|
|
3318
|
-
interface TooltipPopupProps extends Omit<ComponentPropsWithoutRef<typeof Tooltip$1.Popup>, "className"> {
|
|
3319
|
-
/** Side of the trigger to place the tooltip on; flips automatically when there is no room. */
|
|
3320
|
-
side?: TooltipSide;
|
|
3321
|
-
/** How the tooltip lines up along the chosen side. */
|
|
3322
|
-
align?: TooltipAlign;
|
|
3323
|
-
/** Gap between trigger and tooltip in pixels. The default 8px leaves room for the `arrow`. */
|
|
3324
|
-
sideOffset?: BasePositionerProps["sideOffset"];
|
|
3325
|
-
/** Additional shift along the alignment axis in pixels. */
|
|
3326
|
-
alignOffset?: BasePositionerProps["alignOffset"];
|
|
3327
|
-
/** Minimum space kept from the viewport (or collision boundary) edges when repositioning. */
|
|
3328
|
-
collisionPadding?: BasePositionerProps["collisionPadding"];
|
|
3329
|
-
/** Position against this element instead of the trigger (e.g. a chart point or a text selection). */
|
|
3330
|
-
anchor?: BasePositionerProps["anchor"];
|
|
3331
|
-
/** Keep the closed tooltip in the DOM — for measuring; closed tooltips normally unmount. */
|
|
3332
|
-
keepMounted?: boolean;
|
|
3333
|
-
/**
|
|
3334
|
-
* Portal destination. Defaults to `document.body`. When the tooltip renders
|
|
3335
|
-
* open on first paint (`defaultOpen`) and the container mounts in the same
|
|
3336
|
-
* commit, pass the element via callback-ref state — a `RefObject` to an
|
|
3337
|
-
* ancestor is not attached yet when the portal first resolves.
|
|
3338
|
-
*/
|
|
3339
|
-
container?: ComponentPropsWithoutRef<typeof Tooltip$1.Portal>["container"];
|
|
3340
|
-
/** Caret pointing at the trigger. On by default — it ties the hint to small targets in dense rows. */
|
|
3341
|
-
arrow?: boolean;
|
|
3342
|
-
/**
|
|
3343
|
-
* Applied to the popup chip. The chip is content-sized up to 17.5rem —
|
|
3344
|
-
* set `max-w-*` to change the cap.
|
|
3345
|
-
*/
|
|
3346
|
-
className?: string;
|
|
3347
|
-
}
|
|
3348
|
-
/**
|
|
3349
|
-
* The floating hint, with the portal and positioning plumbing folded in.
|
|
3350
|
-
* Text only: the popup never receives focus and Base UI exposes none of it
|
|
3351
|
-
* to assistive technology, so it must stay a redundant visual label — never
|
|
3352
|
-
* the sole carrier of essential information (tooltips also cannot open on
|
|
3353
|
-
* touch), and never a host for links or buttons (that content belongs in a
|
|
3354
|
-
* Popover). Stays open while the pointer is over the trigger or the popup,
|
|
3355
|
-
* and Escape dismisses it (WCAG 1.4.13).
|
|
3356
|
-
*/
|
|
3357
|
-
declare const TooltipPopup: import("react").ForwardRefExoticComponent<TooltipPopupProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
3358
|
-
//#endregion
|
|
3359
|
-
//#region src/components/Typography/Typography.d.ts
|
|
3360
|
-
type TypographyVariant = "display" | "h1" | "h2" | "h3" | "h4" | "body-lg" | "body" | "body-sm" | "caption" | "overline";
|
|
3361
|
-
interface TypographyVariantsOptions {
|
|
3362
|
-
variant?: TypographyVariant;
|
|
3363
|
-
className?: string;
|
|
3364
|
-
}
|
|
3365
|
-
/**
|
|
3366
|
-
* Class list for an element styled per the ArcFusion type scale.
|
|
3367
|
-
*
|
|
3368
|
-
* Use it where the element must stay native (form labels, `figcaption`,
|
|
3369
|
-
* `time`) and inside other primitives — primitives must not nest
|
|
3370
|
-
* `<Typography>` (it would block `render` composition), so they mirror the
|
|
3371
|
-
* recipe instead:
|
|
3372
|
-
*
|
|
3373
|
-
* <label className={typographyVariants({ variant: "body-sm" })}>Email</label>
|
|
3374
|
-
*/
|
|
3375
|
-
declare function typographyVariants({ variant, className }?: TypographyVariantsOptions): string;
|
|
3376
|
-
interface TypographyProps extends HTMLAttributes<HTMLElement> {
|
|
3377
|
-
/**
|
|
3378
|
-
* Text style from the ArcFusion type scale. `display`–`h4` render in
|
|
3379
|
-
* Poppins ("the Brand Voice"); `body-lg` down to `overline` render in
|
|
3380
|
-
* Inter ("the Context"). The variant also picks the default element:
|
|
3381
|
-
* `display` → `h1`, headings → their level, body styles → `p`,
|
|
3382
|
-
* `caption`/`overline` → `span`.
|
|
3383
|
-
*/
|
|
3384
|
-
variant?: TypographyVariant;
|
|
3385
|
-
/**
|
|
3386
|
-
* Override the rendered element without changing the visual style, e.g.
|
|
3387
|
-
* `variant="h4" as="h2"` when the document outline needs a level-2 heading
|
|
3388
|
-
* with a compact look. Heading levels must descend without skipping — pick
|
|
3389
|
-
* `as` from the outline, `variant` from the design.
|
|
3390
|
-
*/
|
|
3391
|
-
as?: ElementType;
|
|
3392
|
-
}
|
|
3393
|
-
declare const Typography: import("react").ForwardRefExoticComponent<TypographyProps & import("react").RefAttributes<HTMLElement>>;
|
|
3394
|
-
//#endregion
|
|
3395
|
-
//#region src/lib/cn.d.ts
|
|
3396
|
-
/** Merge class names with Tailwind-aware conflict resolution. */
|
|
3397
|
-
declare function cn(...inputs: ClassValue[]): string;
|
|
3398
|
-
//#endregion
|
|
1
|
+
import { AILoader, AILoaderProps, AILoaderRenderState, AILoaderSize, AILoaderState, AILoaderTone } from "./components/AILoader/AILoader.js";
|
|
2
|
+
import "./components/AILoader/index.js";
|
|
3
|
+
import { Accordion, AccordionChevronPosition, AccordionHeader, AccordionHeaderProps, AccordionItem, AccordionItemProps, AccordionPanel, AccordionPanelProps, AccordionProps, AccordionSize, AccordionTrigger, AccordionTriggerProps, AccordionVariant } from "./components/Accordion/Accordion.js";
|
|
4
|
+
import "./components/Accordion/index.js";
|
|
5
|
+
import { Avatar, AvatarBadge, AvatarBadgeProps, AvatarFallback, AvatarFallbackProps, AvatarGroup, AvatarGroupProps, AvatarImage, AvatarImageProps, AvatarProps, AvatarShape, AvatarSize, AvatarVariantsOptions, avatarVariants } from "./components/Avatar/Avatar.js";
|
|
6
|
+
import "./components/Avatar/index.js";
|
|
7
|
+
import { Badge, BadgeAppearance, BadgeProps, BadgeSize, BadgeVariant, BadgeVariantsOptions, badgeVariants } from "./components/Badge/Badge.js";
|
|
8
|
+
import "./components/Badge/index.js";
|
|
9
|
+
import { Breadcrumb, BreadcrumbEllipsis, BreadcrumbEllipsisProps, BreadcrumbItem, BreadcrumbItemProps, BreadcrumbLink, BreadcrumbLinkProps, BreadcrumbLinkVariantsOptions, BreadcrumbList, BreadcrumbListProps, BreadcrumbPage, BreadcrumbPageProps, BreadcrumbProps, BreadcrumbSeparator, BreadcrumbSeparatorProps, breadcrumbLinkVariants } from "./components/Breadcrumb/Breadcrumb.js";
|
|
10
|
+
import "./components/Breadcrumb/index.js";
|
|
11
|
+
import { Button, ButtonProps, ButtonSize, ButtonVariant, ButtonVariantsOptions, buttonVariants } from "./components/Button/Button.js";
|
|
12
|
+
import "./components/Button/index.js";
|
|
13
|
+
import { Calendar, CalendarDateRange, CalendarMode, CalendarProps, CalendarState } from "./components/Calendar/Calendar.js";
|
|
14
|
+
import "./components/Calendar/index.js";
|
|
15
|
+
import { Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, CheckboxSize, CheckboxVariantsOptions, checkboxVariants } from "./components/Checkbox/Checkbox.js";
|
|
16
|
+
import "./components/Checkbox/index.js";
|
|
17
|
+
import { Select, SelectAlign, SelectGroup, SelectGroupLabel, SelectGroupLabelProps, SelectGroupProps, SelectItem, SelectItemProps, SelectLabel, SelectLabelProps, SelectPopup, SelectPopupProps, SelectProps, SelectSeparator, SelectSeparatorProps, SelectTrigger, SelectTriggerProps, SelectTriggerSize, SelectTriggerVariant, SelectTriggerVariantsOptions, SelectValue, SelectValueProps, selectTriggerVariants } from "./components/Select/Select.js";
|
|
18
|
+
import "./components/Select/index.js";
|
|
19
|
+
import { Combobox, ComboboxAlign, ComboboxChip, ComboboxChipProps, ComboboxChipRemove, ComboboxChipRemoveProps, ComboboxChips, ComboboxChipsProps, ComboboxClear, ComboboxClearProps, ComboboxCollection, ComboboxCollectionProps, ComboboxGroup, ComboboxGroupLabel, ComboboxGroupLabelProps, ComboboxGroupProps, ComboboxInput, ComboboxInputGroup, ComboboxInputGroupProps, ComboboxInputGroupVariantsOptions, ComboboxInputProps, ComboboxItem, ComboboxItemProps, ComboboxLabel, ComboboxLabelProps, ComboboxPopup, ComboboxPopupProps, ComboboxProps, ComboboxSeparator, ComboboxSeparatorProps, ComboboxSize, ComboboxTrigger, ComboboxTriggerProps, ComboboxTriggerSize, ComboboxTriggerVariant, ComboboxValue, ComboboxValueProps, comboboxInputGroupVariants, useComboboxFilter, useComboboxFilteredItems } from "./components/Combobox/Combobox.js";
|
|
20
|
+
import "./components/Combobox/index.js";
|
|
21
|
+
import { Menu, MenuAlign, MenuCheckboxItem, MenuCheckboxItemProps, MenuGroup, MenuGroupLabel, MenuGroupLabelProps, MenuGroupProps, MenuHandle, MenuItem, MenuItemProps, MenuItemVariant, MenuItemVariantsOptions, MenuLinkItem, MenuLinkItemProps, MenuPopup, MenuPopupProps, MenuProps, MenuRadioGroup, MenuRadioGroupProps, MenuRadioItem, MenuRadioItemProps, MenuSeparator, MenuSeparatorProps, MenuShortcut, MenuShortcutProps, MenuSide, MenuSubmenuRoot, MenuSubmenuRootProps, MenuSubmenuTrigger, MenuSubmenuTriggerProps, MenuTrigger, MenuTriggerProps, createMenuHandle, menuItemVariants } from "./components/Menu/Menu.js";
|
|
22
|
+
import { ContextMenu, ContextMenuAlign, ContextMenuCheckboxItem, ContextMenuCheckboxItemProps, ContextMenuGroup, ContextMenuGroupLabel, ContextMenuGroupLabelProps, ContextMenuGroupProps, ContextMenuItem, ContextMenuItemProps, ContextMenuItemVariant, ContextMenuLinkItem, ContextMenuLinkItemProps, ContextMenuPopup, ContextMenuPopupProps, ContextMenuProps, ContextMenuRadioGroup, ContextMenuRadioGroupProps, ContextMenuRadioItem, ContextMenuRadioItemProps, ContextMenuSeparator, ContextMenuSeparatorProps, ContextMenuShortcut, ContextMenuShortcutProps, ContextMenuSide, ContextMenuSubmenuRoot, ContextMenuSubmenuRootProps, ContextMenuSubmenuTrigger, ContextMenuSubmenuTriggerProps, ContextMenuTrigger, ContextMenuTriggerProps } from "./components/ContextMenu/ContextMenu.js";
|
|
23
|
+
import "./components/ContextMenu/index.js";
|
|
24
|
+
import { Popover, PopoverAlign, PopoverClose, PopoverCloseProps, PopoverDescription, PopoverDescriptionProps, PopoverHandle, PopoverPopup, PopoverPopupProps, PopoverPopupVariantsOptions, PopoverProps, PopoverSide, PopoverTitle, PopoverTitleProps, PopoverTrigger, PopoverTriggerProps, createPopoverHandle, popoverPopupVariants } from "./components/Popover/Popover.js";
|
|
25
|
+
import "./components/Popover/index.js";
|
|
26
|
+
import { DatePicker, DatePickerCalendarProps, DatePickerPopupProps, DatePickerProps, DatePickerSize, DatePickerVariant, DatePickerVariantsOptions, datePickerVariants } from "./components/DatePicker/DatePicker.js";
|
|
27
|
+
import "./components/DatePicker/index.js";
|
|
28
|
+
import { DateRangePicker, DateRangePickerCalendarProps, DateRangePickerPopupProps, DateRangePickerProps, DateRangePickerSize, DateRangePickerVariant, DateRangePickerVariantsOptions, dateRangePickerVariants } from "./components/DateRangePicker/DateRangePicker.js";
|
|
29
|
+
import "./components/DateRangePicker/index.js";
|
|
30
|
+
import { Dialog, DialogClose, DialogCloseProps, DialogDescription, DialogDescriptionProps, DialogFooter, DialogFooterProps, DialogHeader, DialogHeaderProps, DialogPopup, DialogPopupProps, DialogPopupVariantsOptions, DialogProps, DialogScrollBehavior, DialogSize, DialogTitle, DialogTitleProps, DialogTrigger, DialogTriggerProps, dialogPopupVariants } from "./components/Dialog/Dialog.js";
|
|
31
|
+
import "./components/Dialog/index.js";
|
|
32
|
+
import { Drawer, DrawerClose, DrawerCloseProps, DrawerDescription, DrawerDescriptionProps, DrawerFooter, DrawerFooterProps, DrawerHeader, DrawerHeaderProps, DrawerIndent, DrawerIndentBackground, DrawerIndentBackgroundProps, DrawerIndentProps, DrawerPopup, DrawerPopupProps, DrawerPopupVariantsOptions, DrawerProps, DrawerProvider, DrawerSide, DrawerSize, DrawerSwipeArea, DrawerSwipeAreaProps, DrawerTitle, DrawerTitleProps, DrawerTrigger, DrawerTriggerProps, DrawerVirtualKeyboardProvider, createDrawerHandle, drawerPopupVariants } from "./components/Drawer/Drawer.js";
|
|
33
|
+
import "./components/Drawer/index.js";
|
|
34
|
+
import { Field, FieldDescription, FieldDescriptionProps, FieldError, FieldErrorProps, FieldItem, FieldItemProps, FieldLabel, FieldLabelProps, FieldLabelVariantsOptions, FieldOrientation, FieldProps, FieldValidity, FieldValidityProps, fieldLabelVariants } from "./components/Field/Field.js";
|
|
35
|
+
import { FieldControlProps, useFieldControl } from "./components/Field/FieldContext.js";
|
|
36
|
+
import "./components/Field/index.js";
|
|
37
|
+
import { Fieldset, FieldsetDescription, FieldsetDescriptionProps, FieldsetLegend, FieldsetLegendProps, FieldsetLegendVariant, FieldsetProps } from "./components/Fieldset/Fieldset.js";
|
|
38
|
+
import "./components/Fieldset/index.js";
|
|
39
|
+
import { Form, FormProps } from "./components/Form/Form.js";
|
|
40
|
+
import "./components/Form/index.js";
|
|
41
|
+
import { Input, InputGroup, InputGroupAddon, InputGroupAddonProps, InputGroupProps, InputProps, InputSize, InputVariantsOptions, inputVariants } from "./components/Input/Input.js";
|
|
42
|
+
import "./components/Input/index.js";
|
|
43
|
+
import "./components/Menu/index.js";
|
|
44
|
+
import { Progress, ProgressIndicatorVariantsOptions, ProgressProps, ProgressSize, ProgressTrackVariantsOptions, ProgressVariant, progressIndicatorVariants, progressTrackVariants } from "./components/Progress/Progress.js";
|
|
45
|
+
import "./components/Progress/index.js";
|
|
46
|
+
import { Radio, RadioGroup, RadioGroupProps, RadioProps, RadioSize, RadioVariantsOptions, radioVariants } from "./components/Radio/Radio.js";
|
|
47
|
+
import "./components/Radio/index.js";
|
|
48
|
+
import { Skeleton, SkeletonAnimation, SkeletonProps, SkeletonRenderState, SkeletonVariant, SkeletonVariantsOptions, skeletonVariants } from "./components/Skeleton/Skeleton.js";
|
|
49
|
+
import "./components/Skeleton/index.js";
|
|
50
|
+
import { Stepper, StepperDescription, StepperDescriptionProps, StepperIndicator, StepperIndicatorProps, StepperItem, StepperItemProps, StepperOrientation, StepperProps, StepperSeparator, StepperSeparatorProps, StepperSize, StepperTitle, StepperTitleProps, StepperTrigger, StepperTriggerProps, StepperTriggerVariantsOptions, stepperTriggerVariants } from "./components/Stepper/Stepper.js";
|
|
51
|
+
import "./components/Stepper/index.js";
|
|
52
|
+
import { Switch, SwitchLabelPosition, SwitchProps, SwitchSize, SwitchVariantsOptions, switchVariants } from "./components/Switch/Switch.js";
|
|
53
|
+
import "./components/Switch/index.js";
|
|
54
|
+
import { Table, TableBody, TableBodyProps, TableCaption, TableCaptionProps, TableCaptionRenderState, TableCaptionSide, TableCell, TableCellProps, TableContainer, TableContainerProps, TableContainerRenderState, TableContainerVariant, TableFooter, TableFooterProps, TableHead, TableHeadProps, TableHeader, TableHeaderProps, TableLayout, TableProps, TableRenderState, TableRow, TableRowProps, TableRowRenderState, TableSize } from "./components/Table/Table.js";
|
|
55
|
+
import "./components/Table/index.js";
|
|
56
|
+
import { Tabs, TabsIndicatorPosition, TabsList, TabsListProps, TabsListVariantsOptions, TabsPanel, TabsPanelProps, TabsProps, TabsSize, TabsTab, TabsTabProps, TabsTabVariantsOptions, TabsVariant, tabsListVariants, tabsTabVariants } from "./components/Tabs/Tabs.js";
|
|
57
|
+
import "./components/Tabs/index.js";
|
|
58
|
+
import { Timeline, TimelineConnector, TimelineConnectorProps, TimelineContent, TimelineContentProps, TimelineDescription, TimelineDescriptionProps, TimelineIndicator, TimelineIndicatorAppearance, TimelineIndicatorProps, TimelineIndicatorVariant, TimelineItem, TimelineItemProps, TimelineProps, TimelineSeparator, TimelineSeparatorProps, TimelineSeparatorVariant, TimelineSize, TimelineTime, TimelineTimeProps, TimelineTitle, TimelineTitleProps } from "./components/Timeline/Timeline.js";
|
|
59
|
+
import "./components/Timeline/index.js";
|
|
60
|
+
import { ToastData, ToastManager, ToastObject, ToastOptions, ToastPosition, ToastPromiseOptions, ToastType, ToastUpdateOptions, Toaster, ToasterProps, createToastManager, toast } from "./components/Toast/Toast.js";
|
|
61
|
+
import "./components/Toast/index.js";
|
|
62
|
+
import { Tooltip, TooltipAlign, TooltipHandle, TooltipPopup, TooltipPopupProps, TooltipPopupVariantsOptions, TooltipProps, TooltipProvider, TooltipProviderProps, TooltipSide, TooltipTrigger, TooltipTriggerProps, createTooltipHandle, tooltipPopupVariants } from "./components/Tooltip/Tooltip.js";
|
|
63
|
+
import "./components/Tooltip/index.js";
|
|
64
|
+
import { Typography, TypographyProps, TypographyVariant, TypographyVariantsOptions, typographyVariants } from "./components/Typography/Typography.js";
|
|
65
|
+
import "./components/Typography/index.js";
|
|
66
|
+
import { cn } from "./lib/cn.js";
|
|
3399
67
|
export { AILoader, type AILoaderProps, type AILoaderRenderState, type AILoaderSize, type AILoaderState, type AILoaderTone, Accordion, type AccordionChevronPosition, AccordionHeader, type AccordionHeaderProps, AccordionItem, type AccordionItemProps, AccordionPanel, type AccordionPanelProps, type AccordionProps, type AccordionSize, AccordionTrigger, type AccordionTriggerProps, type AccordionVariant, Avatar, AvatarBadge, type AvatarBadgeProps, AvatarFallback, type AvatarFallbackProps, AvatarGroup, type AvatarGroupProps, AvatarImage, type AvatarImageProps, type AvatarProps, type AvatarShape, type AvatarSize, type AvatarVariantsOptions, Badge, type BadgeAppearance, type BadgeProps, type BadgeSize, type BadgeVariant, type BadgeVariantsOptions, Breadcrumb, BreadcrumbEllipsis, type BreadcrumbEllipsisProps, BreadcrumbItem, type BreadcrumbItemProps, BreadcrumbLink, type BreadcrumbLinkProps, type BreadcrumbLinkVariantsOptions, BreadcrumbList, type BreadcrumbListProps, BreadcrumbPage, type BreadcrumbPageProps, type BreadcrumbProps, BreadcrumbSeparator, type BreadcrumbSeparatorProps, Button, type ButtonProps, type ButtonSize, type ButtonVariant, type ButtonVariantsOptions, Calendar, type CalendarDateRange, type CalendarMode, type CalendarProps, type CalendarState, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, type CheckboxSize, type CheckboxVariantsOptions, Combobox, type ComboboxAlign, ComboboxChip, type ComboboxChipProps, ComboboxChipRemove, type ComboboxChipRemoveProps, ComboboxChips, type ComboboxChipsProps, ComboboxClear, type ComboboxClearProps, ComboboxCollection, type ComboboxCollectionProps, ComboboxGroup, ComboboxGroupLabel, type ComboboxGroupLabelProps, type ComboboxGroupProps, ComboboxInput, ComboboxInputGroup, type ComboboxInputGroupProps, type ComboboxInputGroupVariantsOptions, type ComboboxInputProps, ComboboxItem, type ComboboxItemProps, ComboboxLabel, type ComboboxLabelProps, ComboboxPopup, type ComboboxPopupProps, type ComboboxProps, ComboboxSeparator, type ComboboxSeparatorProps, type ComboboxSize, ComboboxTrigger, type ComboboxTriggerProps, type ComboboxTriggerSize, type ComboboxTriggerVariant, ComboboxValue, type ComboboxValueProps, ContextMenu, type ContextMenuAlign, ContextMenuCheckboxItem, type ContextMenuCheckboxItemProps, ContextMenuGroup, ContextMenuGroupLabel, type ContextMenuGroupLabelProps, type ContextMenuGroupProps, ContextMenuItem, type ContextMenuItemProps, type ContextMenuItemVariant, ContextMenuLinkItem, type ContextMenuLinkItemProps, ContextMenuPopup, type ContextMenuPopupProps, type ContextMenuProps, ContextMenuRadioGroup, type ContextMenuRadioGroupProps, ContextMenuRadioItem, type ContextMenuRadioItemProps, ContextMenuSeparator, type ContextMenuSeparatorProps, ContextMenuShortcut, type ContextMenuShortcutProps, type ContextMenuSide, ContextMenuSubmenuRoot, type ContextMenuSubmenuRootProps, ContextMenuSubmenuTrigger, type ContextMenuSubmenuTriggerProps, ContextMenuTrigger, type ContextMenuTriggerProps, DatePicker, type DatePickerCalendarProps, type DatePickerPopupProps, type DatePickerProps, type DatePickerSize, type DatePickerVariant, type DatePickerVariantsOptions, DateRangePicker, type DateRangePickerCalendarProps, type DateRangePickerPopupProps, type DateRangePickerProps, type DateRangePickerSize, type DateRangePickerVariant, type DateRangePickerVariantsOptions, Dialog, DialogClose, type DialogCloseProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogPopup, type DialogPopupProps, type DialogPopupVariantsOptions, type DialogProps, type DialogScrollBehavior, type DialogSize, DialogTitle, type DialogTitleProps, DialogTrigger, type DialogTriggerProps, Drawer, DrawerClose, type DrawerCloseProps, DrawerDescription, type DrawerDescriptionProps, DrawerFooter, type DrawerFooterProps, DrawerHeader, type DrawerHeaderProps, DrawerIndent, DrawerIndentBackground, type DrawerIndentBackgroundProps, type DrawerIndentProps, DrawerPopup, type DrawerPopupProps, type DrawerPopupVariantsOptions, type DrawerProps, DrawerProvider, type DrawerSide, type DrawerSize, DrawerSwipeArea, type DrawerSwipeAreaProps, DrawerTitle, type DrawerTitleProps, DrawerTrigger, type DrawerTriggerProps, DrawerVirtualKeyboardProvider, Field, type FieldControlProps, FieldDescription, type FieldDescriptionProps, FieldError, type FieldErrorProps, FieldItem, type FieldItemProps, FieldLabel, type FieldLabelProps, type FieldLabelVariantsOptions, type FieldOrientation, type FieldProps, FieldValidity, type FieldValidityProps, Fieldset, FieldsetDescription, type FieldsetDescriptionProps, FieldsetLegend, type FieldsetLegendProps, type FieldsetLegendVariant, type FieldsetProps, Form, type FormProps, Input, InputGroup, InputGroupAddon, type InputGroupAddonProps, type InputGroupProps, type InputProps, type InputSize, type InputVariantsOptions, Menu, type MenuAlign, MenuCheckboxItem, type MenuCheckboxItemProps, MenuGroup, MenuGroupLabel, type MenuGroupLabelProps, type MenuGroupProps, type MenuHandle, MenuItem, type MenuItemProps, type MenuItemVariant, type MenuItemVariantsOptions, MenuLinkItem, type MenuLinkItemProps, MenuPopup, type MenuPopupProps, type MenuProps, MenuRadioGroup, type MenuRadioGroupProps, MenuRadioItem, type MenuRadioItemProps, MenuSeparator, type MenuSeparatorProps, MenuShortcut, type MenuShortcutProps, type MenuSide, MenuSubmenuRoot, type MenuSubmenuRootProps, MenuSubmenuTrigger, type MenuSubmenuTriggerProps, MenuTrigger, type MenuTriggerProps, Popover, type PopoverAlign, PopoverClose, type PopoverCloseProps, PopoverDescription, type PopoverDescriptionProps, type PopoverHandle, PopoverPopup, type PopoverPopupProps, type PopoverPopupVariantsOptions, type PopoverProps, type PopoverSide, PopoverTitle, type PopoverTitleProps, PopoverTrigger, type PopoverTriggerProps, Progress, type ProgressIndicatorVariantsOptions, type ProgressProps, type ProgressSize, type ProgressTrackVariantsOptions, type ProgressVariant, Radio, RadioGroup, type RadioGroupProps, type RadioProps, type RadioSize, type RadioVariantsOptions, Select, type SelectAlign, SelectGroup, SelectGroupLabel, type SelectGroupLabelProps, type SelectGroupProps, SelectItem, type SelectItemProps, SelectLabel, type SelectLabelProps, SelectPopup, type SelectPopupProps, type SelectProps, SelectSeparator, type SelectSeparatorProps, SelectTrigger, type SelectTriggerProps, type SelectTriggerSize, type SelectTriggerVariant, type SelectTriggerVariantsOptions, SelectValue, type SelectValueProps, Skeleton, type SkeletonAnimation, type SkeletonProps, type SkeletonRenderState, type SkeletonVariant, type SkeletonVariantsOptions, Stepper, StepperDescription, type StepperDescriptionProps, StepperIndicator, type StepperIndicatorProps, StepperItem, type StepperItemProps, type StepperOrientation, type StepperProps, StepperSeparator, type StepperSeparatorProps, type StepperSize, StepperTitle, type StepperTitleProps, StepperTrigger, type StepperTriggerProps, type StepperTriggerVariantsOptions, Switch, type SwitchLabelPosition, type SwitchProps, type SwitchSize, type SwitchVariantsOptions, Table, TableBody, type TableBodyProps, TableCaption, type TableCaptionProps, type TableCaptionRenderState, type TableCaptionSide, TableCell, type TableCellProps, TableContainer, type TableContainerProps, type TableContainerRenderState, type TableContainerVariant, TableFooter, type TableFooterProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, type TableLayout, type TableProps, type TableRenderState, TableRow, type TableRowProps, type TableRowRenderState, type TableSize, Tabs, type TabsIndicatorPosition, TabsList, type TabsListProps, type TabsListVariantsOptions, TabsPanel, type TabsPanelProps, type TabsProps, type TabsSize, TabsTab, type TabsTabProps, type TabsTabVariantsOptions, type TabsVariant, Timeline, TimelineConnector, type TimelineConnectorProps, TimelineContent, type TimelineContentProps, TimelineDescription, type TimelineDescriptionProps, TimelineIndicator, type TimelineIndicatorAppearance, type TimelineIndicatorProps, type TimelineIndicatorVariant, TimelineItem, type TimelineItemProps, type TimelineProps, TimelineSeparator, type TimelineSeparatorProps, type TimelineSeparatorVariant, type TimelineSize, TimelineTime, type TimelineTimeProps, TimelineTitle, type TimelineTitleProps, type ToastData, type ToastManager, type ToastObject, type ToastOptions, type ToastPosition, type ToastPromiseOptions, type ToastType, type ToastUpdateOptions, Toaster, type ToasterProps, Tooltip, type TooltipAlign, type TooltipHandle, TooltipPopup, type TooltipPopupProps, type TooltipPopupVariantsOptions, type TooltipProps, TooltipProvider, type TooltipProviderProps, type TooltipSide, TooltipTrigger, type TooltipTriggerProps, Typography, type TypographyProps, type TypographyVariant, type TypographyVariantsOptions, avatarVariants, badgeVariants, breadcrumbLinkVariants, buttonVariants, checkboxVariants, cn, comboboxInputGroupVariants, createDrawerHandle, createMenuHandle, createPopoverHandle, createToastManager, createTooltipHandle, datePickerVariants, dateRangePickerVariants, dialogPopupVariants, drawerPopupVariants, fieldLabelVariants, inputVariants, menuItemVariants, popoverPopupVariants, progressIndicatorVariants, progressTrackVariants, radioVariants, selectTriggerVariants, skeletonVariants, stepperTriggerVariants, switchVariants, tabsListVariants, tabsTabVariants, toast, tooltipPopupVariants, typographyVariants, useComboboxFilter, useComboboxFilteredItems, useFieldControl };
|