@madebywild/wvk 0.0.2 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.cts CHANGED
@@ -1,17 +1,30 @@
1
1
  import * as class_variance_authority_types from 'class-variance-authority/types';
2
2
  import * as React from 'react';
3
3
  import { SVGProps } from 'react';
4
+ import { HTMLMotionProps } from 'framer-motion';
5
+ export { AnimatePresence, Variants, motion } from 'framer-motion';
4
6
  import { VariantProps } from 'class-variance-authority';
7
+ import { useRender } from '@base-ui/react/use-render';
8
+ import * as _base_ui_react from '@base-ui/react';
5
9
  import * as react_jsx_runtime from 'react/jsx-runtime';
6
10
  import { W as WireframeIcons } from './index-CQDaCDUc.cjs';
11
+ import { Menu as Menu$1 } from '@base-ui/react/menu';
12
+ import { Radio as Radio$1 } from '@base-ui/react/radio';
13
+ import { RadioGroup as RadioGroup$1 } from '@base-ui/react/radio-group';
14
+ import { Toggle } from '@base-ui/react/toggle';
15
+ import { Tabs as Tabs$1 } from '@base-ui/react/tabs';
16
+ import { Tooltip as Tooltip$1 } from '@base-ui/react/tooltip';
7
17
  import { ClassValue } from 'clsx';
8
18
 
9
- declare const Alert: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & VariantProps<(props?: ({
19
+ declare const alertVariants: (props?: ({
10
20
  variant?: "info" | "warning" | "error" | "success" | null | undefined;
11
- } & class_variance_authority_types.ClassProp) | undefined) => string> & {
21
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
22
+ type AlertProps = Omit<HTMLMotionProps<"div">, "children"> & VariantProps<typeof alertVariants> & {
12
23
  title?: string;
13
24
  icon?: React.ReactNode;
14
- } & React.RefAttributes<HTMLDivElement>>;
25
+ children?: React.ReactNode;
26
+ };
27
+ declare const Alert: React.ForwardRefExoticComponent<Omit<AlertProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
15
28
 
16
29
  type BottomTabBarProps = {
17
30
  value: string;
@@ -42,31 +55,36 @@ declare const BottomTabBarItem: React.ForwardRefExoticComponent<Omit<Omit<React.
42
55
  declare const buttonVariants: (props?: ({
43
56
  variant?: "primary" | "secondary" | "primaryLight" | "primaryOutline" | "secondaryOutline" | "ghost" | null | undefined;
44
57
  size?: "sm" | "md" | "lg" | null | undefined;
58
+ iconOnly?: boolean | null | undefined;
45
59
  } & class_variance_authority_types.ClassProp) | undefined) => string;
46
- declare const Button: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
47
- variant?: "primary" | "secondary" | "primaryLight" | "primaryOutline" | "secondaryOutline" | "ghost" | null | undefined;
48
- size?: "sm" | "md" | "lg" | null | undefined;
49
- } & class_variance_authority_types.ClassProp) | undefined) => string> & {
60
+ type ButtonBaseProps = React.ComponentPropsWithoutRef<"button"> & Omit<VariantProps<typeof buttonVariants>, "iconOnly"> & {
50
61
  /**
51
- * When true, renders the child element as the button (via Radix Slot).
52
- * `leadingIcon` and `trailingIcon` are ignored when `asChild` is set
53
- * the child is rendered as-is without icon wrappers.
62
+ * Replace the rendered element with a custom one (e.g. an `<a>` from a router).
63
+ * Mirrors Base UI's `render` prop pass either a React element to clone, or a
64
+ * callback `(props, state) => ReactElement`. `leadingIcon` and `trailingIcon`
65
+ * are ignored when `render` is provided so the consumer keeps full control.
54
66
  */
55
- asChild?: boolean;
56
- /** Optional icon before the label (e.g. from `../../icons`). Ignored when `asChild` is true. */
67
+ render?: useRender.RenderProp;
68
+ /** Optional icon before the label (e.g. from `../../icons`). Ignored when `render` is provided or `iconOnly` is true. */
57
69
  leadingIcon?: React.ReactNode;
58
- /** Optional icon after the label. Ignored when `asChild` is true. */
70
+ /** Optional icon after the label. Ignored when `render` is provided or `iconOnly` is true. */
59
71
  trailingIcon?: React.ReactNode;
60
- } & React.RefAttributes<HTMLButtonElement>>;
72
+ };
73
+ type ButtonProps = (ButtonBaseProps & {
74
+ /** Render as a square icon-only button. `children` should be a single icon and `aria-label` is required for accessibility. */
75
+ iconOnly: true;
76
+ "aria-label": string;
77
+ }) | (ButtonBaseProps & {
78
+ iconOnly?: false;
79
+ });
80
+ declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
61
81
 
62
82
  declare const checkboxFrameVariants: (props?: ({
63
83
  size?: "sm" | "md" | "lg" | null | undefined;
64
84
  } & class_variance_authority_types.ClassProp) | undefined) => string;
65
- declare const Checkbox: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "onChange" | "value" | "type"> & VariantProps<(props?: ({
85
+ declare const Checkbox: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.CheckboxRootProps, "ref"> & React.RefAttributes<HTMLElement>, "ref">, "render" | "onCheckedChange"> & VariantProps<(props?: ({
66
86
  size?: "sm" | "md" | "lg" | null | undefined;
67
87
  } & class_variance_authority_types.ClassProp) | undefined) => string> & {
68
- checked?: boolean;
69
- indeterminate?: boolean;
70
88
  onCheckedChange?: (checked: boolean) => void;
71
89
  } & React.RefAttributes<HTMLButtonElement>>;
72
90
 
@@ -162,7 +180,14 @@ declare const linkVariants: (props?: ({
162
180
  declare const Link: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & VariantProps<(props?: ({
163
181
  theme?: "dark" | "light" | "medium" | null | undefined;
164
182
  size?: "body" | "caption" | null | undefined;
165
- } & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLAnchorElement>>;
183
+ } & class_variance_authority_types.ClassProp) | undefined) => string> & {
184
+ /**
185
+ * Whether the underline is rendered by default.
186
+ * - `false` (default): underline animates in on hover.
187
+ * - `true`: underline is shown initially and animates out on hover.
188
+ */
189
+ underlined?: boolean;
190
+ } & React.RefAttributes<HTMLAnchorElement>>;
166
191
 
167
192
  declare const listItemVariants: (props?: ({
168
193
  size?: "sm" | "md" | "lg" | null | undefined;
@@ -208,6 +233,36 @@ interface VideoControlsProps extends React.HTMLAttributes<HTMLDivElement> {
208
233
  }
209
234
  declare const VideoControls: React.ForwardRefExoticComponent<VideoControlsProps & React.RefAttributes<HTMLDivElement>>;
210
235
 
236
+ /**
237
+ * Compound menu built on Base UI's `Menu` primitives. Use this when you need a popover-style
238
+ * dropdown with rich item content (icons, dividers, submenus) — for a real form `<select>`,
239
+ * use {@link Select} instead.
240
+ *
241
+ * Example:
242
+ * ```tsx
243
+ * <Menu>
244
+ * <MenuTrigger render={<Button variant="ghost" />}>Actions</MenuTrigger>
245
+ * <MenuPopup>
246
+ * <MenuItem onClick={onCopy}>Copy</MenuItem>
247
+ * <MenuItem onClick={onDelete}>Delete</MenuItem>
248
+ * </MenuPopup>
249
+ * </Menu>
250
+ * ```
251
+ */
252
+ declare const Menu: <Payload>(props: Menu$1.Root.Props<Payload>) => react_jsx_runtime.JSX.Element;
253
+ declare const MenuTrigger: Menu$1.Trigger;
254
+ /** Combines Portal + Positioner + Popup with kit styling defaults. */
255
+ declare const MenuPopup: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.ContextMenuPopupProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & {
256
+ /** Side (relative to the trigger) where the popup is placed. */
257
+ side?: "top" | "right" | "bottom" | "left";
258
+ /** Pixel gap between trigger and popup. */
259
+ sideOffset?: number;
260
+ } & React.RefAttributes<HTMLDivElement>>;
261
+ declare const MenuItem: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.ContextMenuItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
262
+ declare const MenuSeparator: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
263
+ declare const MenuGroup: React.ForwardRefExoticComponent<Omit<_base_ui_react.ContextMenuGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
264
+ declare const MenuGroupLabel: React.ForwardRefExoticComponent<Omit<_base_ui_react.ContextMenuGroupLabelProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
265
+
211
266
  declare const Pagination: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "role"> & VariantProps<(props?: ({
212
267
  size?: "sm" | "md" | "lg" | null | undefined;
213
268
  } & class_variance_authority_types.ClassProp) | undefined) => string> & {
@@ -216,7 +271,27 @@ declare const Pagination: React.ForwardRefExoticComponent<Omit<Omit<React.Detail
216
271
  onPageChange?: (page: number) => void;
217
272
  } & React.RefAttributes<HTMLDivElement>>;
218
273
 
219
- declare const ProgressBar: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
274
+ /**
275
+ * Determinate (or indeterminate) task progress bar — built on Base UI Progress.
276
+ * Use this for "loading", "uploading", or any *task* whose completion you can describe.
277
+ * For showing a measurement within a known range (battery, disk usage, score), use {@link Meter}.
278
+ */
279
+ declare const ProgressBar: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.ProgressRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "value"> & {
280
+ /**
281
+ * Progress value 0–100. Pass `null` for indeterminate (animated, unknown duration).
282
+ * @default 0
283
+ */
284
+ value?: number | null;
285
+ } & React.RefAttributes<HTMLDivElement>>;
286
+ /**
287
+ * Static measurement within a known range — built on Base UI Meter.
288
+ * Use for battery level, disk usage, score, etc. For task progress, use {@link ProgressBar}.
289
+ */
290
+ declare const Meter: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.MeterRootProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "value"> & {
291
+ /**
292
+ * Current value within `[min, max]`.
293
+ * @default 0
294
+ */
220
295
  value?: number;
221
296
  } & React.RefAttributes<HTMLDivElement>>;
222
297
 
@@ -231,6 +306,12 @@ declare const Radio: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTM
231
306
  /** Mirrored to `data-value` for grouping/lookup outside the component. */
232
307
  value?: string;
233
308
  } & React.RefAttributes<HTMLButtonElement>>;
309
+ declare const RadioGroup: React.ForwardRefExoticComponent<Omit<Omit<RadioGroup$1.Props<unknown>, "ref">, "onValueChange"> & {
310
+ onValueChange?: (value: string) => void;
311
+ } & React.RefAttributes<HTMLDivElement>>;
312
+ declare const RadioGroupItem: React.ForwardRefExoticComponent<Omit<Omit<Radio$1.Root.Props<unknown>, "ref">, "render"> & VariantProps<(props?: ({
313
+ size?: "sm" | "md" | "lg" | null | undefined;
314
+ } & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
234
315
 
235
316
  declare const controlVariants: (props?: ({
236
317
  size?: "sm" | "md" | "lg" | null | undefined;
@@ -245,7 +326,7 @@ type SegmentedControlProps = Omit<VariantProps<typeof controlVariants>, "widthMo
245
326
  /** Preferred change handler. Called whenever the selected segment changes. */
246
327
  onValueChange?: (value: string) => void;
247
328
  className?: string;
248
- /** Passed to the root element (e.g. for `role="tablist"` labeling). */
329
+ /** Passed to the root element (e.g. for labelling the toggle group). */
249
330
  "aria-label"?: string;
250
331
  children: React.ReactNode;
251
332
  };
@@ -261,11 +342,11 @@ declare const SegmentedControl: React.ForwardRefExoticComponent<Omit<VariantProp
261
342
  /** Preferred change handler. Called whenever the selected segment changes. */
262
343
  onValueChange?: (value: string) => void;
263
344
  className?: string;
264
- /** Passed to the root element (e.g. for `role="tablist"` labeling). */
345
+ /** Passed to the root element (e.g. for labelling the toggle group). */
265
346
  "aria-label"?: string;
266
347
  children: React.ReactNode;
267
348
  } & React.RefAttributes<HTMLDivElement>>;
268
- type SegmentedControlItemProps = Omit<React.ComponentPropsWithoutRef<"button">, "children"> & {
349
+ type SegmentedControlItemProps = Omit<React.ComponentPropsWithoutRef<typeof Toggle>, "children" | "value"> & {
269
350
  value: string;
270
351
  /** Visible text; omit for icon-only segments (do not pass an empty string). */
271
352
  label?: string;
@@ -273,7 +354,7 @@ type SegmentedControlItemProps = Omit<React.ComponentPropsWithoutRef<"button">,
273
354
  icon?: React.ReactNode;
274
355
  iconPlacement?: "leading" | "trailing";
275
356
  };
276
- declare const SegmentedControlItem: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children"> & {
357
+ declare const SegmentedControlItem: React.ForwardRefExoticComponent<Omit<Omit<Toggle.Props<string> & React.RefAttributes<HTMLButtonElement>, "ref">, "children" | "value"> & {
277
358
  value: string;
278
359
  /** Visible text; omit for icon-only segments (do not pass an empty string). */
279
360
  label?: string;
@@ -282,7 +363,7 @@ declare const SegmentedControlItem: React.ForwardRefExoticComponent<Omit<Omit<Re
282
363
  iconPlacement?: "leading" | "trailing";
283
364
  } & React.RefAttributes<HTMLButtonElement>>;
284
365
  /** Alias for {@link SegmentedControlItem} (same pattern as `TabsTrigger`). */
285
- declare const SegmentedControlTrigger: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children"> & {
366
+ declare const SegmentedControlTrigger: React.ForwardRefExoticComponent<Omit<Omit<Toggle.Props<string> & React.RefAttributes<HTMLButtonElement>, "ref">, "children" | "value"> & {
286
367
  value: string;
287
368
  /** Visible text; omit for icon-only segments (do not pass an empty string). */
288
369
  label?: string;
@@ -293,24 +374,56 @@ declare const SegmentedControlTrigger: React.ForwardRefExoticComponent<Omit<Omit
293
374
 
294
375
  /**
295
376
  * Idle stroke via box-shadow (no layout shift). Active/focused = 2px input focus ring.
296
- * Native <select> focus is mirrored with onFocus/onBlur for reliable shell styling.
297
- *
298
- * The <select> is position:absolute inset-0 so the entire shell is clickable — padding
299
- * lives on the select, not the shell, otherwise clicks on padded areas hit the div.
377
+ * Mirrors {@link TextInput} so Select sits on the same shell baseline.
300
378
  */
301
379
  declare const selectShellVariants: (props?: ({
302
380
  inputStyle?: "border" | "solid" | null | undefined;
303
381
  size?: "sm" | "md" | "lg" | null | undefined;
304
382
  } & class_variance_authority_types.ClassProp) | undefined) => string;
305
- declare const selectFieldVariants: (props?: ({
306
- size?: "sm" | "md" | "lg" | null | undefined;
307
- } & class_variance_authority_types.ClassProp) | undefined) => string;
308
- declare const Select: React.ForwardRefExoticComponent<Omit<React.SelectHTMLAttributes<HTMLSelectElement>, "size"> & VariantProps<(props?: ({
309
- inputStyle?: "border" | "solid" | null | undefined;
310
- size?: "sm" | "md" | "lg" | null | undefined;
311
- } & class_variance_authority_types.ClassProp) | undefined) => string> & FieldLabelSlotProps & {
383
+ type SelectBaseProps = VariantProps<typeof selectShellVariants> & FieldLabelSlotProps & {
312
384
  placeholder?: string;
313
- } & React.RefAttributes<HTMLSelectElement>>;
385
+ /** Custom class for the trigger (the visible select shell). */
386
+ className?: string;
387
+ /** Aria-label for the trigger when there is no visible label. */
388
+ "aria-label"?: string;
389
+ /** Children should be `<SelectItem>` (and optional `<SelectGroup>` / `<SelectSeparator>`). */
390
+ children?: React.ReactNode;
391
+ disabled?: boolean;
392
+ id?: string;
393
+ /** Identifies the field when a form is submitted. */
394
+ name?: string;
395
+ /** Whether the user must choose a value. */
396
+ required?: boolean;
397
+ /** Whether the popup is open (controlled). */
398
+ open?: boolean;
399
+ defaultOpen?: boolean;
400
+ onOpenChange?: (open: boolean) => void;
401
+ };
402
+ type SelectSingleProps = SelectBaseProps & {
403
+ multiple?: false;
404
+ value?: string;
405
+ defaultValue?: string;
406
+ onValueChange?: (value: string) => void;
407
+ };
408
+ type SelectMultipleProps = SelectBaseProps & {
409
+ multiple: true;
410
+ value?: string[];
411
+ defaultValue?: string[];
412
+ onValueChange?: (value: string[]) => void;
413
+ };
414
+ type SelectProps = SelectSingleProps | SelectMultipleProps;
415
+ declare const Select: React.ForwardRefExoticComponent<SelectProps & React.RefAttributes<HTMLButtonElement>>;
416
+ declare const SelectItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.SelectItemProps, "ref"> & React.RefAttributes<HTMLElement>, "ref">, "children"> & {
417
+ /** Item label / content (visible text). */
418
+ children?: React.ReactNode;
419
+ /** Optional glyph rendered before the label. */
420
+ leadingIcon?: React.ReactNode;
421
+ /** Optional glyph rendered after the label (sits before the selection indicator in single-select mode). */
422
+ trailingIcon?: React.ReactNode;
423
+ } & React.RefAttributes<HTMLDivElement>>;
424
+ declare const SelectGroup: React.ForwardRefExoticComponent<Omit<_base_ui_react.SelectGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
425
+ declare const SelectGroupLabel: React.ForwardRefExoticComponent<Omit<Omit<_base_ui_react.SelectGroupLabelProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
426
+ declare const SelectSeparator: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
314
427
 
315
428
  type SliderValue = number | [number, number];
316
429
  declare const Slider: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref">, "defaultValue" | "onChange"> & {
@@ -318,6 +431,7 @@ declare const Slider: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHT
318
431
  onChange?: (value: SliderValue) => void;
319
432
  min?: number;
320
433
  max?: number;
434
+ step?: number;
321
435
  disabled?: boolean;
322
436
  } & React.RefAttributes<HTMLDivElement>>;
323
437
 
@@ -345,23 +459,21 @@ declare const StarRating: React.ForwardRefExoticComponent<StarRatingProps & Reac
345
459
  declare const tabListVariants: (props?: ({
346
460
  size?: "sm" | "md" | "lg" | null | undefined;
347
461
  } & class_variance_authority_types.ClassProp) | undefined) => string;
348
- type TabsProps = {
462
+ type TabsProps = Omit<React.ComponentPropsWithoutRef<typeof Tabs$1.Root>, "value" | "defaultValue" | "onValueChange"> & {
349
463
  value?: string;
350
464
  defaultValue?: string;
351
465
  onValueChange?: (value: string) => void;
352
466
  children: React.ReactNode;
353
- className?: string;
354
467
  };
355
- declare function Tabs({ value: valueProp, defaultValue, onValueChange, children, className, }: TabsProps): react_jsx_runtime.JSX.Element;
356
- declare const TabList: React.ForwardRefExoticComponent<VariantProps<(props?: ({
468
+ declare function Tabs({ value, defaultValue, onValueChange, className, children, ...rest }: TabsProps): react_jsx_runtime.JSX.Element;
469
+ declare const TabList: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.TabsListProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "children"> & VariantProps<(props?: ({
357
470
  size?: "sm" | "md" | "lg" | null | undefined;
358
471
  } & class_variance_authority_types.ClassProp) | undefined) => string> & {
359
472
  /** When true, each tab sizes to its label/icon; the list row remains full width. */
360
473
  autoWidth?: boolean;
361
474
  children: React.ReactNode;
362
- className?: string;
363
475
  } & React.RefAttributes<HTMLDivElement>>;
364
- type TabProps = Omit<React.ComponentPropsWithoutRef<"button">, "children"> & {
476
+ type TabProps = Omit<React.ComponentPropsWithoutRef<typeof Tabs$1.Tab>, "children" | "value"> & {
365
477
  /** Segment id; required when using controlled `Tabs`. */
366
478
  value?: string;
367
479
  /** Optional; use `children` for text if you prefer. */
@@ -369,11 +481,9 @@ type TabProps = Omit<React.ComponentPropsWithoutRef<"button">, "children"> & {
369
481
  /** Optional; omit for label-only triggers. */
370
482
  icon?: React.ReactNode;
371
483
  iconPlacement?: "leading" | "trailing";
372
- /** When not using `Tabs` context, marks the selected tab. */
373
- active?: boolean;
374
484
  children?: React.ReactNode;
375
485
  };
376
- declare const Tab: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children"> & {
486
+ declare const Tab: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.TabsTabProps, "ref"> & React.RefAttributes<HTMLElement>, "ref">, "children" | "value"> & {
377
487
  /** Segment id; required when using controlled `Tabs`. */
378
488
  value?: string;
379
489
  /** Optional; use `children` for text if you prefer. */
@@ -381,21 +491,20 @@ declare const Tab: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLP
381
491
  /** Optional; omit for label-only triggers. */
382
492
  icon?: React.ReactNode;
383
493
  iconPlacement?: "leading" | "trailing";
384
- /** When not using `Tabs` context, marks the selected tab. */
385
- active?: boolean;
386
494
  children?: React.ReactNode;
387
495
  } & React.RefAttributes<HTMLButtonElement>>;
496
+ declare const TabPanel: React.ForwardRefExoticComponent<Omit<_base_ui_react.TabsPanelProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
497
+ declare const TabIndicator: React.ForwardRefExoticComponent<Omit<_base_ui_react.TabsIndicatorProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
388
498
  /** Same component as {@link TabList}; matches common Radix-style naming. */
389
- declare const TabsList: React.ForwardRefExoticComponent<VariantProps<(props?: ({
499
+ declare const TabsList: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.TabsListProps, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">, "children"> & VariantProps<(props?: ({
390
500
  size?: "sm" | "md" | "lg" | null | undefined;
391
501
  } & class_variance_authority_types.ClassProp) | undefined) => string> & {
392
502
  /** When true, each tab sizes to its label/icon; the list row remains full width. */
393
503
  autoWidth?: boolean;
394
504
  children: React.ReactNode;
395
- className?: string;
396
505
  } & React.RefAttributes<HTMLDivElement>>;
397
506
  /** Same component as {@link Tab}; matches common Radix-style naming. */
398
- declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "children"> & {
507
+ declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.TabsTabProps, "ref"> & React.RefAttributes<HTMLElement>, "ref">, "children" | "value"> & {
399
508
  /** Segment id; required when using controlled `Tabs`. */
400
509
  value?: string;
401
510
  /** Optional; use `children` for text if you prefer. */
@@ -403,10 +512,10 @@ declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<Omit<React.Detai
403
512
  /** Optional; omit for label-only triggers. */
404
513
  icon?: React.ReactNode;
405
514
  iconPlacement?: "leading" | "trailing";
406
- /** When not using `Tabs` context, marks the selected tab. */
407
- active?: boolean;
408
515
  children?: React.ReactNode;
409
516
  } & React.RefAttributes<HTMLButtonElement>>;
517
+ /** Same component as {@link TabPanel}; matches common Radix-style naming. */
518
+ declare const TabsContent: React.ForwardRefExoticComponent<Omit<_base_ui_react.TabsPanelProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
410
519
 
411
520
  /** Default tag / label glyph for the optional custom `icon` slot (uses `currentColor`). */
412
521
  declare function TagIconGlyph(props: React.SVGProps<SVGSVGElement>): react_jsx_runtime.JSX.Element;
@@ -481,35 +590,115 @@ declare const TextInput: React.ForwardRefExoticComponent<Omit<React.InputHTMLAtt
481
590
  */
482
591
  declare const toggleSwitchVariants: (props?: ({
483
592
  size?: "sm" | "md" | "lg" | null | undefined;
484
- checked?: boolean | null | undefined;
485
- } & class_variance_authority_types.ClassProp) | undefined) => string;
486
- declare const toggleThumbVariants: (props?: ({
487
- checked?: boolean | null | undefined;
488
593
  } & class_variance_authority_types.ClassProp) | undefined) => string;
489
- declare const ToggleSwitch: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "onChange" | "value" | "type"> & Omit<VariantProps<(props?: ({
594
+ declare const toggleThumbVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
595
+ declare const ToggleSwitch: React.ForwardRefExoticComponent<Omit<Omit<Omit<_base_ui_react.SwitchRootProps, "ref"> & React.RefAttributes<HTMLElement>, "ref">, "render" | "onCheckedChange"> & VariantProps<(props?: ({
490
596
  size?: "sm" | "md" | "lg" | null | undefined;
491
- checked?: boolean | null | undefined;
492
- } & class_variance_authority_types.ClassProp) | undefined) => string>, "checked"> & {
493
- checked?: boolean;
597
+ } & class_variance_authority_types.ClassProp) | undefined) => string> & {
494
598
  onCheckedChange?: (checked: boolean) => void;
495
599
  } & React.RefAttributes<HTMLButtonElement>>;
496
600
 
601
+ declare const tooltipVariants: (props?: ({
602
+ theme?: "dark" | "light" | null | undefined;
603
+ size?: "sm" | "md" | "lg" | null | undefined;
604
+ direction?: "center" | "left" | "right" | null | undefined;
605
+ } & class_variance_authority_types.ClassProp) | undefined) => string;
606
+ /**
607
+ * Presentational tooltip box (no interaction). Use this when the tooltip's positioning is
608
+ * already handled by its container — for example, alongside a custom hover/focus group.
609
+ *
610
+ * For an interactive, floating tooltip with delay, focus, and collision handling, use the
611
+ * {@link TooltipPopup} compound (Base UI primitives).
612
+ */
497
613
  declare const Tooltip: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & VariantProps<(props?: ({
498
614
  theme?: "dark" | "light" | null | undefined;
499
615
  size?: "sm" | "md" | "lg" | null | undefined;
500
616
  direction?: "center" | "left" | "right" | null | undefined;
501
617
  } & class_variance_authority_types.ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
618
+ /**
619
+ * Optional `<TooltipProvider>` wraps a subtree to share hover-delay state across multiple
620
+ * tooltips so opening one lets siblings open without re-waiting.
621
+ */
622
+ declare const TooltipProvider: React.FC<_base_ui_react.TooltipProviderProps>;
623
+ /**
624
+ * Interactive, floating tooltip compound built on Base UI primitives. Pass any element as
625
+ * `trigger` (it must be focusable to support keyboard users) and the tooltip body as
626
+ * `children`. The popup uses the kit's dark/light themes and arrow caret.
627
+ */
628
+ type TooltipPopupProps = Omit<React.ComponentPropsWithoutRef<typeof Tooltip$1.Popup>, "children"> & VariantProps<typeof tooltipVariants> & {
629
+ /** Element that triggers the tooltip on hover/focus. Must be a single, focusable element. */
630
+ trigger: React.ReactElement<Record<string, unknown>>;
631
+ /** Tooltip content. */
632
+ children: React.ReactNode;
633
+ /** Side (relative to the trigger) where the popup is placed. */
634
+ side?: "top" | "right" | "bottom" | "left";
635
+ /** Pixel gap between trigger and popup. */
636
+ sideOffset?: number;
637
+ };
638
+ declare function TooltipPopup({ trigger, children, theme, size, side, sideOffset, className, ...rest }: TooltipPopupProps): react_jsx_runtime.JSX.Element;
639
+
640
+ type WhimsyCursorProps = {
641
+ /** Rotation angle in degrees applied on hover (negative = left tilt). Defaults to -22. */
642
+ hoverRotateDeg?: number;
643
+ };
644
+ /**
645
+ * Replaces the native cursor with a DOM-rendered SVG that follows the pointer
646
+ * and tilts left with a small spring bounce when hovering interactive elements.
647
+ *
648
+ * Mount once near the root (e.g. inside ThemeProvider). It is a no-op on
649
+ * coarse-pointer devices and respects `prefers-reduced-motion`.
650
+ */
651
+ declare function WhimsyCursor({ hoverRotateDeg, }?: WhimsyCursorProps): react_jsx_runtime.JSX.Element;
502
652
 
503
653
  type AppTheme = "light" | "dark";
654
+ /**
655
+ * Cursor style variant.
656
+ * - `"default"` — the chunky kit signature pointer (with WhimsyCursor by default)
657
+ * - `"arrow"` — slim classic arrow; WhimsyCursor auto-suppresses to keep the
658
+ * native arrow visible
659
+ */
660
+ type CursorStyle = "default" | "arrow";
661
+ /**
662
+ * Toggle for the auto-mounted {@link WhimsyCursor}:
663
+ * - `true` (default) mounts it with default options
664
+ * - `false` disables it
665
+ * - an object passes through as `WhimsyCursor` props (e.g. `{ hoverRotateDeg: -10 }`)
666
+ */
667
+ type WhimsyCursorOption = boolean | WhimsyCursorProps;
504
668
  type ThemeContextValue = {
505
669
  theme: AppTheme;
506
670
  setTheme: (t: AppTheme) => void;
671
+ cursorStyle: CursorStyle;
672
+ setCursorStyle: (c: CursorStyle) => void;
507
673
  };
508
674
  declare const ThemeContext: React.Context<ThemeContextValue | null>;
509
- declare function ThemeProvider({ children }: {
675
+ type ThemeProviderProps = {
510
676
  children: React.ReactNode;
511
- }): react_jsx_runtime.JSX.Element;
677
+ /**
678
+ * Initial cursor style. `"default"` (chunky kit pointer + WhimsyCursor) or
679
+ * `"arrow"` (slim arrow, no WhimsyCursor). Defaults to `"default"`.
680
+ *
681
+ * Persisted to localStorage under `wvk-cursor-style`; the persisted value
682
+ * wins on next mount. To make this stick across SSR without a flash, mirror
683
+ * the value in your anti-flash inline script.
684
+ */
685
+ cursorStyle?: CursorStyle;
686
+ /**
687
+ * Auto-mount the {@link WhimsyCursor} alongside the provider so consumers get
688
+ * the kit's signature pointer behaviour with no extra wiring.
689
+ *
690
+ * Defaults to `true`. Pass `false` to disable, or an object to forward props
691
+ * (e.g. `{ hoverRotateDeg: -10 }`). Auto-suppressed when `cursorStyle` is
692
+ * `"arrow"` so the slim native cursor stays visible.
693
+ */
694
+ whimsyCursor?: WhimsyCursorOption;
695
+ };
696
+ declare function ThemeProvider({ children, cursorStyle: cursorStyleProp, whimsyCursor, }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
512
697
  declare function useTheme(): ThemeContextValue;
698
+ declare function useCursorStyle(): {
699
+ cursorStyle: CursorStyle;
700
+ setCursorStyle: (c: CursorStyle) => void;
701
+ };
513
702
 
514
703
  declare function ThemeSwitcher(): react_jsx_runtime.JSX.Element | null;
515
704
 
@@ -535,12 +724,32 @@ declare const wvkIconSmClass = "size-[length:var(--wvk-icon-sm)] min-h-0 min-w-0
535
724
  */
536
725
  declare const wvkIconBoxLgClass = "inline-flex size-[length:var(--wvk-icon-lg)] shrink-0 items-center justify-center [&_svg]:size-full [&_svg]:aspect-square";
537
726
 
538
- declare const BUTTON_DECORATIVE_ICON_NAMES: readonly ["none", "plus", "chevronRight", "home", "search", "user", "settings"];
539
- type ButtonDecorativeIconName = (typeof BUTTON_DECORATIVE_ICON_NAMES)[number];
540
- declare function ButtonDecorativeIconGlyph({ name, size, className, }: {
541
- name: Exclude<ButtonDecorativeIconName, "none">;
542
- size: "sm" | "md" | "lg";
543
- className?: string;
544
- }): react_jsx_runtime.JSX.Element | null;
727
+ /** Wrap a list container with this to stagger children in. */
728
+ declare const staggerContainer: {
729
+ hidden: {
730
+ opacity: number;
731
+ };
732
+ show: {
733
+ opacity: number;
734
+ transition: {
735
+ staggerChildren: number;
736
+ };
737
+ };
738
+ };
739
+ /** Pair with `staggerContainer` on each list child. */
740
+ declare const fadeInUp: {
741
+ hidden: {
742
+ opacity: number;
743
+ y: number;
744
+ };
745
+ show: {
746
+ opacity: number;
747
+ y: number;
748
+ transition: {
749
+ duration: number;
750
+ ease: "easeOut";
751
+ };
752
+ };
753
+ };
545
754
 
546
- export { Alert, type AppTheme, BUTTON_DECORATIVE_ICON_NAMES, BottomTabBar, BottomTabBarItem, type BottomTabBarItemProps, type BottomTabBarProps, Button, ButtonDecorativeIconGlyph, type ButtonDecorativeIconName, Checkbox, FieldGroup, type FieldGroupProps, FieldLabel, type FieldLabelProps, type FieldLabelSlotProps, ImagePlaceholder, InfoBar, type InfoBarLeadingIconName, Link, ListItem, LoadingSpinner, type LoadingSpinnerProps, Pagination, ProgressBar, Radio, SegmentedControl, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, SegmentedControlTrigger, Select, Slider, SplitButton, StarRating, TAG_LEADING_ICON_NAMES, Tab, TabList, type TabProps, Tabs, TabsList, TabsTrigger, Tag, TagIconGlyph, TagLeadingIcon, type TagLeadingIconName, TextArea, TextInput, TextInputCalendarIcon, TextInputSearchIcon, ThemeContext, ThemeProvider, ThemeSwitcher, ToggleSwitch, Tooltip, VideoControls, VideoPlaceholder, buttonVariants, checkboxFrameVariants, cn, hasRenderableFieldLabelText, linkVariants, listItemVariants, placeholderVariants, radioFrameVariants, selectFieldVariants, selectShellVariants, selectShellVariants as selectVariants, splitButtonVariants, tabListVariants, tagVariants, textAreaFieldVariants, textAreaShellVariants, textInputShellVariants, toggleSwitchVariants, toggleThumbVariants, useTheme, wvkIconBoxLgClass, wvkIconLgClass, wvkIconMdClass, wvkIconSmClass };
755
+ export { Alert, type AppTheme, BottomTabBar, BottomTabBarItem, type BottomTabBarItemProps, type BottomTabBarProps, Button, Checkbox, type CursorStyle, FieldGroup, type FieldGroupProps, FieldLabel, type FieldLabelProps, type FieldLabelSlotProps, ImagePlaceholder, InfoBar, type InfoBarLeadingIconName, Link, ListItem, LoadingSpinner, type LoadingSpinnerProps, Menu, MenuGroup, MenuGroupLabel, MenuItem, MenuPopup, MenuSeparator, MenuTrigger, Meter, Pagination, ProgressBar, Radio, RadioGroup, RadioGroupItem, SegmentedControl, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, SegmentedControlTrigger, Select, SelectGroup, SelectGroupLabel, SelectItem, SelectSeparator, Slider, SplitButton, StarRating, TAG_LEADING_ICON_NAMES, Tab, TabIndicator, TabList, TabPanel, type TabProps, Tabs, TabsContent, TabsList, TabsTrigger, Tag, TagIconGlyph, TagLeadingIcon, type TagLeadingIconName, TextArea, TextInput, TextInputCalendarIcon, TextInputSearchIcon, ThemeContext, ThemeProvider, type ThemeProviderProps, ThemeSwitcher, ToggleSwitch, Tooltip, TooltipPopup, TooltipProvider, VideoControls, VideoPlaceholder, WhimsyCursor, type WhimsyCursorOption, type WhimsyCursorProps, buttonVariants, checkboxFrameVariants, cn, fadeInUp, hasRenderableFieldLabelText, linkVariants, listItemVariants, placeholderVariants, radioFrameVariants, selectShellVariants, selectShellVariants as selectVariants, splitButtonVariants, staggerContainer, tabListVariants, tagVariants, textAreaFieldVariants, textAreaShellVariants, textInputShellVariants, toggleSwitchVariants, toggleThumbVariants, useCursorStyle, useTheme, wvkIconBoxLgClass, wvkIconLgClass, wvkIconMdClass, wvkIconSmClass };