@wistia/ui 0.23.0-beta.3ddac3bf.d4e9d97 → 0.23.0-beta.5e745cc4.68bef3f

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.ts CHANGED
@@ -5,17 +5,10 @@ import * as _$styled_components0 from "styled-components";
5
5
  import { css } from "styled-components";
6
6
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
7
7
  import { FileAmountLimitValidator, FileSizeValidator, FileTypeValidator, ImageDimensionsValidator, PersistentFileAmountLimitValidator } from "use-file-picker/validators";
8
- import { CollapsibleContentProps } from "@radix-ui/react-collapsible";
9
8
  import { Color } from "culori/fn";
10
- import { ToggleGroupSingleProps } from "@radix-ui/react-toggle-group";
11
- import * as _$_radix_ui_react_popover0 from "@radix-ui/react-popover";
12
- import { Anchor, Close, PopoverContentProps as PopoverContentProps$1, Portal, Root as Root$2, Trigger as Trigger$1 } from "@radix-ui/react-popover";
13
9
  import * as Ariakit from "@ariakit/react";
14
- import { DropdownMenuCheckboxItemProps, DropdownMenuContentProps, DropdownMenuItemProps, DropdownMenuRadioGroupProps, DropdownMenuRadioItemProps } from "@radix-ui/react-dropdown-menu";
15
10
  import { Schema } from "yup";
16
- import { HoverCardContentProps } from "@radix-ui/react-hover-card";
17
11
  import ReactMarkdown from "react-markdown";
18
- import { TabsContentProps, TabsListProps, TabsProps, TabsTriggerProps } from "@radix-ui/react-tabs";
19
12
  import { ExtractContentTypeFromConfig, FilePickerReturnTypes, ImperativeFilePickerReturnTypes, UseFilePickerConfig, useImperativeFilePickerConfig } from "use-file-picker/types";
20
13
  export * from "use-file-picker/types";
21
14
 
@@ -452,7 +445,7 @@ type ButtonProps = ButtonAsButtonProps | ButtonAsLinkProps;
452
445
  * action, or performing a delete operation. It replaces the HTML `<button>` element,
453
446
  * unless an `href` attribute is passed, in which it will render an `<a>` element.
454
447
  */
455
- declare const Button: _$react.ForwardRefExoticComponent<(Omit<BaseButtonProps & _$react.ClassAttributes<HTMLAnchorElement> & _$react.AnchorHTMLAttributes<HTMLAnchorElement> & {
448
+ declare const Button: _$react.ForwardRefExoticComponent<(Omit<ButtonAsButtonProps, "ref"> | Omit<BaseButtonProps & _$react.ClassAttributes<HTMLAnchorElement> & _$react.AnchorHTMLAttributes<HTMLAnchorElement> & {
456
449
  beforeAction?: (() => Promise<void>) | (() => void);
457
450
  children: ReactNode;
458
451
  colorScheme?: ColorSchemeTypes;
@@ -510,7 +503,7 @@ declare const Button: _$react.ForwardRefExoticComponent<(Omit<BaseButtonProps &
510
503
  * @ignore
511
504
  */
512
505
  type?: LinkTypes;
513
- }, "ref"> | Omit<ButtonAsButtonProps, "ref">) & _$react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
506
+ }, "ref">) & _$react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
514
507
  //#endregion
515
508
  //#region src/private/components/Toast/Toast.d.ts
516
509
  type ToastProps = ComponentPropsWithoutRef<'div'> & {
@@ -617,7 +610,7 @@ declare const ActionButton: _$react.ForwardRefExoticComponent<(Omit<{
617
610
  * Changes the secondary icon for different use cases
618
611
  */
619
612
  variant?: "default" | "gated" | "menu-down" | "menu-up";
620
- } & Omit<ButtonAsButtonProps, "variant" | "size" | "leftIcon" | "isLoading" | "fullWidth" | "unstyled" | "rightIcon">, "ref"> | Omit<{
613
+ } & Omit<ButtonAsButtonProps, "variant" | "fullWidth" | "isLoading" | "leftIcon" | "rightIcon" | "size" | "unstyled">, "ref"> | Omit<{
621
614
  /**
622
615
  * @override
623
616
  * The text to display for the ActionButton
@@ -646,7 +639,7 @@ declare const ActionButton: _$react.ForwardRefExoticComponent<(Omit<{
646
639
  * Changes the secondary icon for different use cases
647
640
  */
648
641
  variant?: "default" | "gated" | "menu-down" | "menu-up";
649
- } & Omit<ButtonAsLinkProps, "variant" | "size" | "leftIcon" | "isLoading" | "fullWidth" | "unstyled" | "rightIcon">, "ref">) & _$react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
642
+ } & Omit<ButtonAsLinkProps, "variant" | "fullWidth" | "isLoading" | "leftIcon" | "rightIcon" | "size" | "unstyled">, "ref">) & _$react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
650
643
  //#endregion
651
644
  //#region src/components/Avatar/Avatar.d.ts
652
645
  type AvatarInstanceType = 'image' | 'initials';
@@ -1341,7 +1334,7 @@ type CollapsibleTriggerProps = {
1341
1334
  * A trigger element that will toggle the collapsible content.
1342
1335
  * Usually a [Button](?path=/docs/components-button--docs).
1343
1336
  */
1344
- children: ReactNode;
1337
+ children: ReactElement;
1345
1338
  };
1346
1339
  declare const CollapsibleTrigger: ({
1347
1340
  children
@@ -1392,7 +1385,6 @@ declare const iconMap: {
1392
1385
  'circle-slashed': (props: _$react.SVGProps<SVGSVGElement>) => _$react_jsx_runtime0.JSX.Element;
1393
1386
  clapboard: (props: _$react.SVGProps<SVGSVGElement>) => _$react_jsx_runtime0.JSX.Element;
1394
1387
  clips: (props: _$react.SVGProps<SVGSVGElement>) => _$react_jsx_runtime0.JSX.Element;
1395
- clock: (props: _$react.SVGProps<SVGSVGElement>) => _$react_jsx_runtime0.JSX.Element;
1396
1388
  close: (props: _$react.SVGProps<SVGSVGElement>) => _$react_jsx_runtime0.JSX.Element;
1397
1389
  'close-octagon': (props: _$react.SVGProps<SVGSVGElement>) => _$react_jsx_runtime0.JSX.Element;
1398
1390
  'closed-captions': (props: _$react.SVGProps<SVGSVGElement>) => _$react_jsx_runtime0.JSX.Element;
@@ -1658,7 +1650,7 @@ declare const CollapsibleTriggerIcon: {
1658
1650
  };
1659
1651
  //#endregion
1660
1652
  //#region src/components/Collapsible/CollapsibleContent.d.ts
1661
- type CollapsibleContentProps$1 = {
1653
+ type CollapsibleContentProps = {
1662
1654
  /**
1663
1655
  * The number of lines to clamp the content to when `Collapsible` is closed.
1664
1656
  */
@@ -1666,12 +1658,12 @@ type CollapsibleContentProps$1 = {
1666
1658
  /**
1667
1659
  * The content that will be hidden when `Collapsible` is closed.
1668
1660
  */
1669
- children: CollapsibleContentProps['children'];
1661
+ children: ReactNode;
1670
1662
  };
1671
1663
  declare const CollapsibleContent: ({
1672
1664
  clamp,
1673
1665
  children
1674
- }: CollapsibleContentProps$1) => _$react_jsx_runtime0.JSX.Element;
1666
+ }: CollapsibleContentProps) => _$react_jsx_runtime0.JSX.Element;
1675
1667
  //#endregion
1676
1668
  //#region src/components/ColorPicker/ColorGrid.d.ts
1677
1669
  type ColorGridProps = PropsWithChildren & {
@@ -2041,7 +2033,7 @@ declare const ContextMenu: ({
2041
2033
  side,
2042
2034
  onRequestClose,
2043
2035
  compact
2044
- }: ContextMenuProps) => _$react_jsx_runtime0.JSX.Element | null;
2036
+ }: ContextMenuProps) => _$react_jsx_runtime0.JSX.Element;
2045
2037
  //#endregion
2046
2038
  //#region src/components/CustomizableThemeWrapper/CustomizableThemeWrapper.d.ts
2047
2039
  type CustomizableTokens = '--wui-color-backdrop' | '--wui-color-bg-app' | '--wui-color-bg-fill-active' | '--wui-color-bg-fill-hover' | '--wui-color-bg-fill-white ' | '--wui-color-bg-fill' | '--wui-color-bg-surface-active' | '--wui-color-bg-surface-disabled' | '--wui-color-bg-surface-hover' | '--wui-color-bg-surface-secondary-active' | '--wui-color-bg-surface-secondary-hover' | '--wui-color-bg-surface-secondary' | '--wui-color-bg-surface-selected-active' | '--wui-color-bg-surface-selected-hover' | '--wui-color-bg-surface-selected' | '--wui-color-bg-surface-tertiary' | '--wui-color-bg-surface' | '--wui-color-bg-tooltip' | '--wui-color-border-active-selected' | '--wui-color-border-active' | '--wui-color-border-disabled' | '--wui-color-border-hover-selected' | '--wui-color-border-hover' | '--wui-color-border-secondary-active' | '--wui-color-border-secondary-hover' | '--wui-color-border-secondary' | '--wui-color-border-selected' | '--wui-color-border' | '--wui-color-drop-shadow' | '--wui-color-focus-color' | '--wui-color-focus-ring-disabled' | '--wui-color-focus-ring' | '--wui-color-icon-disabled' | '--wui-color-icon-on-fill' | '--wui-color-icon-selected' | '--wui-color-icon' | '--wui-color-invalid-indicator' | '--wui-color-notification-pill-color' | '--wui-color-segmented-control-checked-background' | '--wui-color-text-button' | '--wui-color-text-disabled' | '--wui-color-text-link' | '--wui-color-text-on-fill-white-selected' | '--wui-color-text-on-fill' | '--wui-color-text-secondary' | '--wui-color-text-selected' | '--wui-color-text' | '--wui-typography-family-brand' | '--wui-typography-family-default' | '--wui-typography-family-mono' | '--wui-typography-weight-body-bold' | '--wui-typography-weight-body' | '--wui-typography-weight-heading' | '--wui-typography-weight-label-bold' | '--wui-typography-weight-label';
@@ -2729,7 +2721,7 @@ type InputProps = Omit<InputHTMLAttributes<HTMLInputElement | HTMLTextAreaElemen
2729
2721
  /**
2730
2722
  * The type of the input
2731
2723
  */
2732
- type?: 'email' | 'multiline' | 'number' | 'password' | 'phone' | 'search' | 'text' | 'time' | 'timePosition' | 'url';
2724
+ type?: 'email' | 'multiline' | 'number' | 'password' | 'phone' | 'search' | 'text' | 'url';
2733
2725
  };
2734
2726
  /**
2735
2727
  * Capture user input with a text field. Should be used within a [Form]() and [FormField]().
@@ -2771,7 +2763,7 @@ declare const Input: _$react.ForwardRefExoticComponent<Omit<InputHTMLAttributes<
2771
2763
  /**
2772
2764
  * The type of the input
2773
2765
  */
2774
- type?: "email" | "multiline" | "number" | "password" | "phone" | "search" | "text" | "time" | "timePosition" | "url";
2766
+ type?: "email" | "multiline" | "number" | "password" | "phone" | "search" | "text" | "url";
2775
2767
  } & _$react.RefAttributes<HTMLInputElement | HTMLTextAreaElement>>;
2776
2768
  //#endregion
2777
2769
  //#region src/components/EditableText/EditableTextInput.d.ts
@@ -3115,8 +3107,7 @@ type GridProps = ComponentPropsWithoutRef<'div'> & {
3115
3107
  declare const Grid: (<C extends ElementType = "div">(props: PolymorphicComponentProps<C, GridProps>) => _$react.ReactElement | null) & UnknownRecord;
3116
3108
  //#endregion
3117
3109
  //#region src/components/PreviewCard/PreviewCard.d.ts
3118
- type ContentProps$1 = Omit<HoverCardContentProps, 'alignOffset' | 'arrowPadding' | 'asChild' | 'collisionPadding' | 'hideWhenDetached' | 'sideOffset'>;
3119
- type PreviewCardProps = ContentProps$1 & {
3110
+ type PreviewCardProps = {
3120
3111
  /**
3121
3112
  * The content of the preview card
3122
3113
  */
@@ -3133,7 +3124,7 @@ type PreviewCardProps = ContentProps$1 & {
3133
3124
  * The [Link](?path=/docs/components-link--docs) that opens the preview card when hovered.
3134
3125
  * Preview cards should only be used on links—do not use on non-interactive elements (e.g. buttons or plain text).
3135
3126
  */
3136
- trigger: JSX.Element;
3127
+ trigger: ReactElement;
3137
3128
  /**
3138
3129
  * If true, the preview card will use the unstyled Content component instead of StyledContent
3139
3130
  */
@@ -3156,6 +3147,14 @@ type PreviewCardProps = ContentProps$1 & {
3156
3147
  * Force the preview card to be open without user interaction (for debugging and CI)
3157
3148
  */
3158
3149
  forceOpen?: boolean;
3150
+ /**
3151
+ * The preferred side of the trigger to render on
3152
+ */
3153
+ side?: 'bottom' | 'left' | 'right' | 'top';
3154
+ /**
3155
+ * The preferred alignment against the trigger
3156
+ */
3157
+ align?: 'center' | 'end' | 'start';
3159
3158
  };
3160
3159
  /**
3161
3160
  * Preview cards reveal content on hover. **Everything in the card must also exist at the destination**—never put information only in the preview. This pattern is for sighted-only, so treat the card as a preview, not a source of truth.
@@ -3172,6 +3171,8 @@ declare const PreviewCard: {
3172
3171
  closeDelay,
3173
3172
  colorScheme,
3174
3173
  forceOpen,
3174
+ side,
3175
+ align,
3175
3176
  ...props
3176
3177
  }: PreviewCardProps): JSX.Element;
3177
3178
  displayName: string;
@@ -3201,7 +3202,7 @@ declare const IconButton: _$react.ForwardRefExoticComponent<(Omit<{
3201
3202
  * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
3202
3203
  */
3203
3204
  children: JSX.Element;
3204
- } & Omit<ButtonAsButtonProps, "leftIcon" | "fullWidth" | "rightIcon">, "ref"> | Omit<{
3205
+ } & Omit<ButtonAsButtonProps, "fullWidth" | "leftIcon" | "rightIcon">, "ref"> | Omit<{
3205
3206
  /**
3206
3207
  * Accessible text for screen readers.
3207
3208
  */
@@ -3210,7 +3211,7 @@ declare const IconButton: _$react.ForwardRefExoticComponent<(Omit<{
3210
3211
  * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
3211
3212
  */
3212
3213
  children: JSX.Element;
3213
- } & Omit<ButtonAsLinkProps, "leftIcon" | "fullWidth" | "rightIcon">, "ref">) & _$react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
3214
+ } & Omit<ButtonAsLinkProps, "fullWidth" | "leftIcon" | "rightIcon">, "ref">) & _$react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
3214
3215
  //#endregion
3215
3216
  //#region src/components/Image/Image.d.ts
3216
3217
  type ImageProps = ComponentPropsWithoutRef<'img'> & {
@@ -3290,7 +3291,7 @@ type InputClickToCopyProps = Omit<InputProps, 'autoSelect' | 'disabled' | 'right
3290
3291
  /**
3291
3292
  * Provides a readonly input that copies the text to the clipboard when clicked.
3292
3293
  */
3293
- declare const InputClickToCopy: _$react.ForwardRefExoticComponent<Omit<InputProps, "type" | "disabled" | "rightIcon" | "value" | "autoSelect"> & {
3294
+ declare const InputClickToCopy: _$react.ForwardRefExoticComponent<Omit<InputProps, "type" | "rightIcon" | "disabled" | "value" | "autoSelect"> & {
3294
3295
  /**
3295
3296
  * When disabled, the copy action will not be triggered
3296
3297
  */
@@ -3500,10 +3501,6 @@ type MenuProps = MenuControlProps & {
3500
3501
  * The label for the trigger element, this is ignored if `trigger` is defined
3501
3502
  */
3502
3503
  label?: string;
3503
- /**
3504
- * Callback for when the user clicks or focuses outside of the menu
3505
- */
3506
- onInteractOutside?: DropdownMenuContentProps['onInteractOutside'];
3507
3504
  /**
3508
3505
  * The side the menu appears on, relative to the trigger
3509
3506
  */
@@ -3625,7 +3622,38 @@ type MenuItemButtonProps = ButtonProps & {
3625
3622
  };
3626
3623
  //#endregion
3627
3624
  //#region src/components/Menu/MenuItem.d.ts
3628
- declare const MenuItem: _$react.ForwardRefExoticComponent<(Omit<DropdownMenuItemProps & BaseButtonProps & _$react.ClassAttributes<HTMLAnchorElement> & _$react.AnchorHTMLAttributes<HTMLAnchorElement> & {
3625
+ declare const MenuItem: _$react.ForwardRefExoticComponent<(Omit<BaseButtonProps & _$react.ClassAttributes<HTMLButtonElement> & _$react.ButtonHTMLAttributes<HTMLButtonElement> & {
3626
+ href?: never;
3627
+ type?: "button" | "reset" | "submit";
3628
+ children: _$react.ReactNode;
3629
+ } & {
3630
+ appearance?: "dangerous" | "default" | "gated";
3631
+ badge?: _$react.JSX.Element;
3632
+ children?: _$react.ReactNode;
3633
+ command?: _$react.ReactNode;
3634
+ icon?: ButtonProps["leftIcon"];
3635
+ leftIcon?: ButtonProps["leftIcon"];
3636
+ rightIcon?: ButtonProps["rightIcon"];
3637
+ fullWidth?: never;
3638
+ asChild?: never;
3639
+ variant?: never;
3640
+ size?: never;
3641
+ unstyled?: never;
3642
+ } & {
3643
+ /**
3644
+ * Treats the menu item as a link when provided
3645
+ */
3646
+ href?: MenuItemButtonProps["href"];
3647
+ /**
3648
+ * Whether the menu should close when this item is clicked
3649
+ * @default true
3650
+ */
3651
+ closeOnClick?: boolean;
3652
+ /**
3653
+ * Callback when the item is selected
3654
+ */
3655
+ onSelect?: (event: SyntheticEvent) => void;
3656
+ }, "ref"> | Omit<BaseButtonProps & _$react.ClassAttributes<HTMLAnchorElement> & _$react.AnchorHTMLAttributes<HTMLAnchorElement> & {
3629
3657
  beforeAction?: (() => Promise<void>) | (() => void);
3630
3658
  children: _$react.ReactNode;
3631
3659
  colorScheme?: ColorSchemeTypes;
@@ -3661,7 +3689,16 @@ declare const MenuItem: _$react.ForwardRefExoticComponent<(Omit<DropdownMenuItem
3661
3689
  * Treats the menu item as a link when provided
3662
3690
  */
3663
3691
  href?: MenuItemButtonProps["href"];
3664
- }, "ref"> | Omit<DropdownMenuItemProps & BaseButtonProps & _$react.ClassAttributes<HTMLAnchorElement> & _$react.AnchorHTMLAttributes<HTMLAnchorElement> & {
3692
+ /**
3693
+ * Whether the menu should close when this item is clicked
3694
+ * @default true
3695
+ */
3696
+ closeOnClick?: boolean;
3697
+ /**
3698
+ * Callback when the item is selected
3699
+ */
3700
+ onSelect?: (event: SyntheticEvent) => void;
3701
+ }, "ref"> | Omit<BaseButtonProps & _$react.ClassAttributes<HTMLAnchorElement> & _$react.AnchorHTMLAttributes<HTMLAnchorElement> & {
3665
3702
  beforeAction?: (() => Promise<void>) | (() => void);
3666
3703
  children: _$react.ReactNode;
3667
3704
  colorScheme?: ColorSchemeTypes;
@@ -3703,28 +3740,15 @@ declare const MenuItem: _$react.ForwardRefExoticComponent<(Omit<DropdownMenuItem
3703
3740
  * Treats the menu item as a link when provided
3704
3741
  */
3705
3742
  href?: MenuItemButtonProps["href"];
3706
- }, "ref"> | Omit<DropdownMenuItemProps & BaseButtonProps & _$react.ClassAttributes<HTMLButtonElement> & _$react.ButtonHTMLAttributes<HTMLButtonElement> & {
3707
- href?: never;
3708
- type?: "button" | "reset" | "submit";
3709
- children: _$react.ReactNode;
3710
- } & {
3711
- appearance?: "dangerous" | "default" | "gated";
3712
- badge?: _$react.JSX.Element;
3713
- children?: _$react.ReactNode;
3714
- command?: _$react.ReactNode;
3715
- icon?: ButtonProps["leftIcon"];
3716
- leftIcon?: ButtonProps["leftIcon"];
3717
- rightIcon?: ButtonProps["rightIcon"];
3718
- fullWidth?: never;
3719
- asChild?: never;
3720
- variant?: never;
3721
- size?: never;
3722
- unstyled?: never;
3723
- } & {
3724
3743
  /**
3725
- * Treats the menu item as a link when provided
3744
+ * Whether the menu should close when this item is clicked
3745
+ * @default true
3726
3746
  */
3727
- href?: MenuItemButtonProps["href"];
3747
+ closeOnClick?: boolean;
3748
+ /**
3749
+ * Callback when the item is selected
3750
+ */
3751
+ onSelect?: (event: SyntheticEvent) => void;
3728
3752
  }, "ref">) & _$react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
3729
3753
  //#endregion
3730
3754
  //#region src/components/Menu/MenuItemLabel.d.ts
@@ -3750,15 +3774,19 @@ declare const MenuItemDescription: ({
3750
3774
  }: MenuItemDescriptionProps) => _$react_jsx_runtime0.JSX.Element;
3751
3775
  //#endregion
3752
3776
  //#region src/components/Menu/MenuRadioGroup.d.ts
3753
- type MenuRadioGroupProps = DropdownMenuRadioGroupProps & {
3777
+ type MenuRadioGroupProps = {
3754
3778
  /**
3755
3779
  * The radio items
3756
3780
  */
3757
3781
  children: ReactNode | ReactNode[];
3758
3782
  /**
3759
- * @ignore
3783
+ * The value of the selected radio item
3760
3784
  */
3761
- asChild?: never;
3785
+ value?: string;
3786
+ /**
3787
+ * Callback when the value changes
3788
+ */
3789
+ onValueChange?: (value: string) => void;
3762
3790
  };
3763
3791
  declare const MenuRadioGroup: {
3764
3792
  ({
@@ -3769,7 +3797,7 @@ declare const MenuRadioGroup: {
3769
3797
  };
3770
3798
  //#endregion
3771
3799
  //#region src/components/Menu/RadioMenuItem.d.ts
3772
- type RadioMenuItemProps = DropdownMenuRadioItemProps & MenuItemButtonProps & {
3800
+ type RadioMenuItemProps = MenuItemButtonProps & {
3773
3801
  /**
3774
3802
  * Optional `Icon` to use as the indicator that the radio item is selected. Must be an instance of [Icon](../?path=/docs/components-icon--docs)
3775
3803
  */
@@ -3777,7 +3805,7 @@ type RadioMenuItemProps = DropdownMenuRadioItemProps & MenuItemButtonProps & {
3777
3805
  /**
3778
3806
  * The value of the item
3779
3807
  */
3780
- value: DropdownMenuRadioItemProps['value'];
3808
+ value: string;
3781
3809
  /**
3782
3810
  * @ignore
3783
3811
  */
@@ -3790,6 +3818,10 @@ type RadioMenuItemProps = DropdownMenuRadioItemProps & MenuItemButtonProps & {
3790
3818
  * @ignore
3791
3819
  */
3792
3820
  ref?: never;
3821
+ /**
3822
+ * Callback when the item is selected
3823
+ */
3824
+ onSelect?: (event: SyntheticEvent) => void;
3793
3825
  };
3794
3826
  declare const RadioMenuItem: {
3795
3827
  ({
@@ -3802,7 +3834,7 @@ declare const RadioMenuItem: {
3802
3834
  };
3803
3835
  //#endregion
3804
3836
  //#region src/components/Menu/CheckboxMenuItem.d.ts
3805
- type CheckboxMenuItemProps = DropdownMenuCheckboxItemProps & MenuItemButtonProps & {
3837
+ type CheckboxMenuItemProps = MenuItemButtonProps & {
3806
3838
  /** Callback to fire when the checked status changes */onCheckedChange: (checked: boolean) => void;
3807
3839
  /**
3808
3840
  * Optional `Icon` to use as the indicator that the checkbox item is selected. Must be an instance of [Icon](../?path=/docs/components-icon--docs)
@@ -3824,6 +3856,10 @@ type CheckboxMenuItemProps = DropdownMenuCheckboxItemProps & MenuItemButtonProps
3824
3856
  * @ignore
3825
3857
  */
3826
3858
  ref?: never;
3859
+ /**
3860
+ * Callback when the item is selected
3861
+ */
3862
+ onSelect?: (event: SyntheticEvent) => void;
3827
3863
  };
3828
3864
  declare const CheckboxMenuItem: {
3829
3865
  ({
@@ -4068,8 +4104,7 @@ type UncontrolledPopoverProps = {
4068
4104
  onOpenChange?: never;
4069
4105
  };
4070
4106
  type PopoverControlProps = ControlledPopoverProps | UncontrolledPopoverProps;
4071
- type ContentProps = Omit<PopoverContentProps$1, 'alignOffset' | 'arrowPadding' | 'asChild' | 'collisionPadding' | 'hideWhenDetached' | 'sideOffset' | 'updatePositionStrategy'>;
4072
- type PopoverProps = ContentProps & PopoverControlProps & {
4107
+ type PopoverProps = PopoverControlProps & {
4073
4108
  /**
4074
4109
  * The content of the popover
4075
4110
  */
@@ -4093,13 +4128,13 @@ type PopoverProps = ContentProps & PopoverControlProps & {
4093
4128
  /**
4094
4129
  * An interactive element. Most commonly a [Button](?path=/docs/components-button--docs) or [IconButton]([Button](?path=/docs/components-iconbutton--docs)).
4095
4130
  */
4096
- trigger: JSX.Element;
4131
+ trigger: ReactElement;
4097
4132
  /**
4098
4133
  * If true, the popover will use the unstyled Content component instead of StyledContent
4099
4134
  */
4100
4135
  unstyled?: boolean;
4101
4136
  /**
4102
- * If true, the popover will use a custom radix arrow to trigger
4137
+ * If true, the popover will use a custom arrow on the trigger
4103
4138
  */
4104
4139
  withArrow?: boolean;
4105
4140
  /**
@@ -4111,13 +4146,24 @@ type PopoverProps = ContentProps & PopoverControlProps & {
4111
4146
  * Inline styles applied to the popover popup
4112
4147
  */
4113
4148
  style?: CSSProperties;
4149
+ /**
4150
+ * The preferred side of the trigger to render on
4151
+ */
4152
+ side?: 'bottom' | 'left' | 'right' | 'top';
4153
+ /**
4154
+ * The preferred alignment against the trigger
4155
+ */
4156
+ align?: 'center' | 'end' | 'start';
4157
+ /**
4158
+ * Whether the trigger should be treated as a native button (default: true)
4159
+ */
4160
+ nativeButton?: boolean;
4114
4161
  };
4115
4162
  /**
4116
4163
  * Displays rich content in a portal, triggered by a button.
4117
4164
  *
4118
- * For more control — custom anchor, access to event handlers like
4119
- * `onPointerDownOutside`, no injected close button, etc. — compose the
4120
- * primitives directly: `PopoverRoot`, `PopoverTrigger`, `PopoverAnchor`,
4165
+ * For more control — custom anchor, no injected close button, etc. — compose
4166
+ * the primitives directly: `PopoverRoot`, `PopoverTrigger`, `PopoverAnchor`,
4121
4167
  * `PopoverPortal`, `PopoverContent`, `PopoverClose`.
4122
4168
  */
4123
4169
  declare const Popover: {
@@ -4134,19 +4180,31 @@ declare const Popover: {
4134
4180
  isAnimated,
4135
4181
  colorScheme,
4136
4182
  style,
4183
+ side,
4184
+ align,
4185
+ nativeButton,
4137
4186
  ...props
4138
4187
  }: PopoverProps): JSX.Element;
4139
4188
  displayName: string;
4140
4189
  };
4141
4190
  //#endregion
4142
4191
  //#region src/components/Popover/PopoverAnchor.d.ts
4143
- type PopoverAnchorProps = ComponentPropsWithoutRef<typeof Anchor>;
4192
+ type PopoverAnchorProps = {
4193
+ children: ReactNode;
4194
+ };
4144
4195
  /**
4145
4196
  * Positions the popover relative to an element other than the trigger. Useful
4146
4197
  * when the element the user interacts with (e.g. a text input) is separate
4147
4198
  * from what the popover attaches to.
4199
+ *
4200
+ * Wrap the anchor element and nest `PopoverTrigger` inside it.
4148
4201
  */
4149
- declare const PopoverAnchor: _$react.ForwardRefExoticComponent<Omit<_$_radix_ui_react_popover0.PopoverAnchorProps & _$react.RefAttributes<HTMLDivElement>, "ref"> & _$react.RefAttributes<HTMLDivElement>>;
4202
+ declare const PopoverAnchor: {
4203
+ ({
4204
+ children
4205
+ }: PopoverAnchorProps): JSX.Element;
4206
+ displayName: string;
4207
+ };
4150
4208
  //#endregion
4151
4209
  //#region src/components/Popover/PopoverArrow.d.ts
4152
4210
  type PopoverArrowProps = {
@@ -4163,13 +4221,25 @@ declare const PopoverArrow: {
4163
4221
  };
4164
4222
  //#endregion
4165
4223
  //#region src/components/Popover/PopoverClose.d.ts
4166
- type PopoverCloseProps = ComponentPropsWithoutRef<typeof Close>;
4224
+ type PopoverCloseProps = Omit<ComponentPropsWithoutRef<'button'>, 'render'> & {
4225
+ /**
4226
+ * A React element to merge close behavior onto.
4227
+ * When provided, the close button renders this element instead of a plain `<button>`.
4228
+ */
4229
+ render?: ReactElement;
4230
+ };
4167
4231
  /**
4168
4232
  * An element that closes the popover when activated. Defaults to a `<button>`;
4169
- * pass `asChild` to merge the close behavior onto a single child element. For
4233
+ * pass `render` to merge the close behavior onto a single child element. For
4170
4234
  * a pre-styled icon close button, use `PopoverCloseButton`.
4171
4235
  */
4172
- declare const PopoverClose: _$react.ForwardRefExoticComponent<Omit<_$_radix_ui_react_popover0.PopoverCloseProps & _$react.RefAttributes<HTMLButtonElement>, "ref"> & _$react.RefAttributes<HTMLButtonElement>>;
4236
+ declare const PopoverClose: _$react.ForwardRefExoticComponent<Omit<Omit<_$react.DetailedHTMLProps<_$react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "render"> & {
4237
+ /**
4238
+ * A React element to merge close behavior onto.
4239
+ * When provided, the close button renders this element instead of a plain `<button>`.
4240
+ */
4241
+ render?: ReactElement;
4242
+ } & _$react.RefAttributes<HTMLButtonElement>>;
4173
4243
  //#endregion
4174
4244
  //#region src/components/Popover/PopoverCloseButton.d.ts
4175
4245
  type PopoverCloseButtonProps = {
@@ -4187,44 +4257,48 @@ declare const PopoverCloseButton: {
4187
4257
  };
4188
4258
  //#endregion
4189
4259
  //#region src/components/Popover/PopoverContent.d.ts
4190
- type PopoverContentProps = Omit<PopoverContentProps$1, 'asChild'> & {
4260
+ type PopoverContentProps = {
4191
4261
  /** Sets the [color scheme](/docs/color-schemes) applied inside the portal. */colorScheme?: ColorSchemeTypes; /** Remove the default surface styling (padding, background, border, etc.). */
4192
4262
  unstyled?: boolean; /** Applied as `max-width` on the popover surface. Pass `"none"` to uncap. */
4193
4263
  maxWidth?: string; /** Applied as `max-height` on the popover surface. Pass `"none"` to uncap. */
4194
- maxHeight?: string;
4264
+ maxHeight?: string; /** Which side of the trigger to render the popover on. */
4265
+ side?: 'bottom' | 'left' | 'right' | 'top'; /** How to align the popover relative to the specified side. */
4266
+ align?: 'center' | 'end' | 'start'; /** Distance between the anchor and the popup in pixels. */
4267
+ sideOffset?: number; /** Inline styles applied to the popup. */
4268
+ style?: CSSProperties; /** The popover content. */
4269
+ children?: React.ReactNode; /** Role applied to the popup element. */
4270
+ role?: string;
4195
4271
  };
4196
4272
  /**
4197
4273
  * The styled popover surface. Place inside a `PopoverRoot` (typically wrapped
4198
- * in a `PopoverPortal`). Forwards all Radix Content props, including
4199
- * dismissal/focus event handlers such as `onPointerDownOutside`,
4200
- * `onOpenAutoFocus`, and `onCloseAutoFocus`.
4274
+ * in a `PopoverPortal`). Wraps a `Positioner` and `Popup` internally.
4201
4275
  */
4202
- declare const PopoverContent: _$react.ForwardRefExoticComponent<Omit<PopoverContentProps$1, "asChild"> & {
4203
- /** Sets the [color scheme](/docs/color-schemes) applied inside the portal. */colorScheme?: ColorSchemeTypes; /** Remove the default surface styling (padding, background, border, etc.). */
4204
- unstyled?: boolean; /** Applied as `max-width` on the popover surface. Pass `"none"` to uncap. */
4205
- maxWidth?: string; /** Applied as `max-height` on the popover surface. Pass `"none"` to uncap. */
4206
- maxHeight?: string;
4207
- } & _$react.RefAttributes<HTMLDivElement>>;
4276
+ declare const PopoverContent: _$react.ForwardRefExoticComponent<PopoverContentProps & _$react.RefAttributes<HTMLDivElement>>;
4208
4277
  //#endregion
4209
4278
  //#region src/components/Popover/PopoverPortal.d.ts
4210
- type PopoverPortalProps = ComponentPropsWithoutRef<typeof Portal>;
4279
+ type PopoverPortalProps = {
4280
+ children: ReactNode;
4281
+ };
4211
4282
  /**
4212
4283
  * Portals the popover content out of the DOM hierarchy of its trigger so it can
4213
4284
  * escape clipping ancestors (`overflow: hidden`, transformed containers, etc.).
4214
4285
  */
4215
4286
  declare const PopoverPortal: {
4216
- (props: PopoverPortalProps): JSX.Element;
4287
+ ({
4288
+ children
4289
+ }: PopoverPortalProps): JSX.Element;
4217
4290
  displayName: string;
4218
4291
  };
4219
4292
  //#endregion
4220
4293
  //#region src/components/Popover/PopoverRoot.d.ts
4221
- type RadixRootProps = ComponentPropsWithoutRef<typeof Root$2>;
4222
- type PopoverRootProps = Omit<RadixRootProps, 'open'> & {
4294
+ type PopoverRootProps = {
4223
4295
  /**
4224
4296
  * Controlled open state. When provided, pair with `onOpenChange` to update it.
4225
- * Leave unset for uncontrolled behavior (Radix manages state internally).
4297
+ * Leave unset for uncontrolled behavior.
4226
4298
  */
4227
- isOpen?: boolean;
4299
+ isOpen?: boolean; /** Called when the popover open state changes. */
4300
+ onOpenChange?: (isOpen: boolean) => void; /** The composable popover children (Trigger, Portal, etc.). */
4301
+ children: ReactNode;
4228
4302
  };
4229
4303
  /**
4230
4304
  * The root of a composable popover. Wrap `PopoverTrigger` (or `PopoverAnchor`)
@@ -4235,19 +4309,44 @@ type PopoverRootProps = Omit<RadixRootProps, 'open'> & {
4235
4309
  declare const PopoverRoot: {
4236
4310
  ({
4237
4311
  isOpen,
4238
- ...props
4312
+ onOpenChange,
4313
+ children
4239
4314
  }: PopoverRootProps): JSX.Element;
4240
4315
  displayName: string;
4241
4316
  };
4242
4317
  //#endregion
4243
4318
  //#region src/components/Popover/PopoverTrigger.d.ts
4244
- type PopoverTriggerProps = ComponentPropsWithoutRef<typeof Trigger$1>;
4319
+ type PopoverTriggerProps = Omit<ComponentPropsWithoutRef<'button'>, 'render'> & {
4320
+ /**
4321
+ * A React element to merge trigger behavior onto.
4322
+ * When provided, the trigger renders this element instead of a plain `<button>`.
4323
+ */
4324
+ render?: ReactElement;
4325
+ /**
4326
+ * Whether the trigger should be treated as a native button.
4327
+ * Set to `false` if the rendered element is not a button (e.g. `<div>`).
4328
+ * @default true
4329
+ */
4330
+ nativeButton?: boolean;
4331
+ };
4245
4332
  /**
4246
4333
  * The button that toggles the popover open and closed. By default it renders a
4247
- * `<button>` wrapping its children; pass `asChild` to merge the trigger
4334
+ * `<button>` wrapping its children; pass `render` to merge the trigger
4248
4335
  * behavior onto a single child element (e.g. a `Button` or `IconButton`).
4249
4336
  */
4250
- declare const PopoverTrigger: _$react.ForwardRefExoticComponent<Omit<_$_radix_ui_react_popover0.PopoverTriggerProps & _$react.RefAttributes<HTMLButtonElement>, "ref"> & _$react.RefAttributes<HTMLButtonElement>>;
4337
+ declare const PopoverTrigger: _$react.ForwardRefExoticComponent<Omit<Omit<_$react.DetailedHTMLProps<_$react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref">, "render"> & {
4338
+ /**
4339
+ * A React element to merge trigger behavior onto.
4340
+ * When provided, the trigger renders this element instead of a plain `<button>`.
4341
+ */
4342
+ render?: ReactElement;
4343
+ /**
4344
+ * Whether the trigger should be treated as a native button.
4345
+ * Set to `false` if the rendered element is not a button (e.g. `<div>`).
4346
+ * @default true
4347
+ */
4348
+ nativeButton?: boolean;
4349
+ } & _$react.RefAttributes<HTMLButtonElement>>;
4251
4350
  //#endregion
4252
4351
  //#region src/components/ProgressBar/ProgressBar.d.ts
4253
4352
  type ProgressBarProps = ComponentPropsWithoutRef<'div'> & {
@@ -4603,7 +4702,7 @@ declare const ScrollArea: _$react.ForwardRefExoticComponent<HTMLAttributes<HTMLD
4603
4702
  } & _$react.RefAttributes<HTMLDivElement>>;
4604
4703
  //#endregion
4605
4704
  //#region src/components/SegmentedControl/SegmentedControl.d.ts
4606
- type SegmentedControlProps = Omit<ToggleGroupSingleProps, 'type'> & {
4705
+ type SegmentedControlProps = {
4607
4706
  /**
4608
4707
  * `SegmentedControlItem`s that will be rendered in grouping
4609
4708
  */
@@ -4632,7 +4731,7 @@ type SegmentedControlProps = Omit<ToggleGroupSingleProps, 'type'> & {
4632
4731
  /**
4633
4732
  * Provides a horizontal set of segments for switching between different values
4634
4733
  */
4635
- declare const SegmentedControl: ForwardRefExoticComponent<RefAttributes<HTMLDivElement> & SegmentedControlProps>;
4734
+ declare const SegmentedControl: ForwardRefExoticComponent<RefAttributes<HTMLDivElement> & SegmentedControlProps & HTMLAttributes<HTMLDivElement>>;
4636
4735
  //#endregion
4637
4736
  //#region src/components/SegmentedControl/SegmentedControlItem.d.ts
4638
4737
  type BaseProps$1 = {
@@ -4817,7 +4916,7 @@ type SliderProps = Omit<ComponentPropsWithoutRef<'div'>, 'onChange'> & {
4817
4916
  * (e.g. on mouseup, touchend, or keyup). Useful for analytics or
4818
4917
  * expensive operations where only the final value matters.
4819
4918
  */
4820
- onValueCommit?: (value: number[]) => void;
4919
+ onValueCommitted?: (value: number[]) => void;
4821
4920
  /**
4822
4921
  * Value to be added or subtracted on each step
4823
4922
  */
@@ -4837,7 +4936,7 @@ declare const Slider: {
4837
4936
  max,
4838
4937
  min,
4839
4938
  onChange,
4840
- onValueCommit,
4939
+ onValueCommitted,
4841
4940
  step,
4842
4941
  value,
4843
4942
  "data-testid": dataTestId,
@@ -5124,7 +5223,12 @@ declare const TableRow: ({
5124
5223
  }: TableRowProps) => JSX.Element;
5125
5224
  //#endregion
5126
5225
  //#region src/components/Tabs/Tabs.d.ts
5127
- type TabsProps$1 = Pick<TabsProps, 'children' | 'defaultValue' | 'onValueChange' | 'value'>;
5226
+ type TabsProps = {
5227
+ children?: React.ReactNode;
5228
+ defaultValue?: string;
5229
+ onValueChange?: (value: string) => void;
5230
+ value?: string;
5231
+ };
5128
5232
  declare const Tabs: {
5129
5233
  ({
5130
5234
  children,
@@ -5132,22 +5236,27 @@ declare const Tabs: {
5132
5236
  onValueChange: onValueChangeProp,
5133
5237
  defaultValue,
5134
5238
  ...props
5135
- }: TabsProps$1): JSX.Element;
5239
+ }: TabsProps): JSX.Element;
5136
5240
  displayName: string;
5137
5241
  };
5138
5242
  //#endregion
5139
5243
  //#region src/components/Tabs/TabsContent.d.ts
5140
- type TabsContentProps$1 = Pick<TabsContentProps, 'children' | 'value'>;
5244
+ type TabsContentProps = {
5245
+ children?: ReactNode;
5246
+ value: string;
5247
+ };
5141
5248
  declare const TabsContent: {
5142
5249
  ({
5143
5250
  children,
5144
5251
  value
5145
- }: TabsContentProps$1): JSX.Element;
5252
+ }: TabsContentProps): JSX.Element;
5146
5253
  displayName: string;
5147
5254
  };
5148
5255
  //#endregion
5149
5256
  //#region src/components/Tabs/TabsList.d.ts
5150
- type TabsListProps$1 = Pick<TabsListProps, 'aria-label'> & PropsWithChildren<{
5257
+ type TabsListProps = {
5258
+ 'aria-label'?: string;
5259
+ } & PropsWithChildren<{
5151
5260
  fullWidth?: boolean;
5152
5261
  }>;
5153
5262
  declare const TabsList: {
@@ -5155,12 +5264,15 @@ declare const TabsList: {
5155
5264
  children,
5156
5265
  fullWidth,
5157
5266
  ...props
5158
- }: TabsListProps$1): JSX.Element;
5267
+ }: TabsListProps): JSX.Element;
5159
5268
  displayName: string;
5160
5269
  };
5161
5270
  //#endregion
5162
5271
  //#region src/components/Tabs/TabsTrigger.d.ts
5163
- type BaseProps = Pick<TabsTriggerProps, 'disabled' | 'value'>;
5272
+ type BaseProps = {
5273
+ disabled?: boolean;
5274
+ value: string;
5275
+ };
5164
5276
  type IconWithLabel = {
5165
5277
  /**
5166
5278
  * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
@@ -5191,8 +5303,8 @@ type NoIcon = {
5191
5303
  label?: ReactNode | string;
5192
5304
  'aria-label'?: never;
5193
5305
  };
5194
- type TabsTriggerProps$1 = BaseProps & (IconWithAriaLabel | IconWithLabel | NoIcon);
5195
- declare const TabsTrigger: _$react.ForwardRefExoticComponent<TabsTriggerProps$1 & _$react.RefAttributes<HTMLButtonElement>>;
5306
+ type TabsTriggerProps = BaseProps & (IconWithAriaLabel | IconWithLabel | NoIcon);
5307
+ declare const TabsTrigger: _$react.ForwardRefExoticComponent<TabsTriggerProps & _$react.RefAttributes<HTMLButtonElement>>;
5196
5308
  //#endregion
5197
5309
  //#region src/components/Tag/Tag.d.ts
5198
5310
  type TagProps = ComponentPropsWithoutRef<'div'> & {