@wistia/ui 0.5.7 → 0.6.0-beta.1ca5cd23.8077d2d

package/dist/index.d.mts

@@ -1,10 +1,12 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, ForwardedRef, Ref, InputHTMLAttributes, RefObject, ForwardRefExoticComponent, RefAttributes } from 'react';
+import * as react_router from 'react-router';
 import { LinkProps as LinkProps$1 } from 'react-router-dom';
 import { CollapsibleContentProps as CollapsibleContentProps$1 } from '@radix-ui/react-collapsible';
 import * as styled_components from 'styled-components';
 import { DropdownMenuContentProps, DropdownMenuItemProps, DropdownMenuRadioGroupProps, DropdownMenuRadioItemProps, DropdownMenuCheckboxItemProps } from '@radix-ui/react-dropdown-menu';
+import { PopoverContentProps } from '@radix-ui/react-popover';
 import { ToggleGroupSingleProps } from '@radix-ui/react-toggle-group';
 
 type UIProviderProps = {
@@ -260,7 +262,7 @@ type BaseButtonProps = {
      */
     variant?: ButtonVariants;
 };
-type ButtonAsLinkProps = BaseButtonProps & ComponentPropsWithRef<'a'> & {
+type ButtonAsLinkProps = BaseButtonProps & ComponentPropsWithRef<'a'> & LinkProps & {
     href: string | undefined;
     children: ReactNode;
     /**
@@ -286,7 +288,63 @@ type ButtonProps = ButtonAsButtonProps | ButtonAsLinkProps;
  * action, or performing a delete operation. It replaces the HTML `<button>` element,
  * unless an `href` attribute is passed, in which it will render an `<a>` element.
  */
-declare const Button: react.ForwardRefExoticComponent<(Omit<ButtonAsLinkProps, "ref"> | Omit<ButtonAsButtonProps, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
+declare const Button: react.ForwardRefExoticComponent<(Omit<BaseButtonProps & Omit<react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    ref?: ((instance: HTMLAnchorElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLAnchorElement> | null | undefined;
+} & {
+    beforeAction?: (() => Promise<void>) | (() => void);
+    children: ReactNode;
+    colorScheme?: ColorSchemeTypes;
+    disabled?: boolean;
+    leftIcon?: JSX.Element | undefined;
+    rightIcon?: JSX.Element | undefined;
+    type?: LinkTypes | undefined;
+    underline?: boolean;
+} & Omit<react_router.LinkProps, "to"> & {
+    href: string | undefined;
+    type?: LinkTypes;
+} & {
+    href: string | undefined;
+    children: ReactNode;
+    /**
+     * This just allows pathrough to beforeAction for link
+     * @ignore
+     */
+    beforeAction?: (() => Promise<void>) | (() => void);
+    /**
+     * This just allows pathrough to beforeAction for link
+     * @ignore
+     */
+    type?: LinkTypes;
+}, "ref"> | Omit<BaseButtonProps & Omit<react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    ref?: ((instance: HTMLAnchorElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLAnchorElement> | null | undefined;
+} & {
+    beforeAction?: (() => Promise<void>) | (() => void);
+    children: ReactNode;
+    colorScheme?: ColorSchemeTypes;
+    disabled?: boolean;
+    leftIcon?: JSX.Element | undefined;
+    rightIcon?: JSX.Element | undefined;
+    type?: LinkTypes | undefined;
+    underline?: boolean;
+} & Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLButtonElement> | null | undefined;
+} & {
+    href?: never;
+    type?: "button" | "reset" | "submit";
+} & {
+    href: string | undefined;
+    children: ReactNode;
+    /**
+     * This just allows pathrough to beforeAction for link
+     * @ignore
+     */
+    beforeAction?: (() => Promise<void>) | (() => void);
+    /**
+     * This just allows pathrough to beforeAction for link
+     * @ignore
+     */
+    type?: LinkTypes;
+}, "ref"> | Omit<ButtonAsButtonProps, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
 
 type ToastProps = ComponentPropsWithoutRef<'div'> & {
     /**
@@ -622,13 +680,18 @@ type ButtonGroupProps = ComponentPropsWithoutRef<'div'> & {
      * Force ButtonGroup to fill the width of it's container
      */
     fullWidth?: boolean;
+    /**
+     * If true, the button group will collapse to a single column on small screens
+     * and the buttons will be stacked on top of each other.
+     */
+    collapseOnSmallScreens?: boolean;
 };
 /**
  * ButtonGroup is a layout component that groups buttons together,
  * with a standardized gap between them.
  */
 declare const ButtonGroup: {
-    ({ children, align, fullWidth, ...otherProps }: ButtonGroupProps): JSX.Element | null;
+    ({ children, align, fullWidth, collapseOnSmallScreens, ...otherProps }: ButtonGroupProps): JSX.Element | null;
     displayName: string;
 };
 
@@ -984,6 +1047,11 @@ type FormProps<T> = Omit<ComponentPropsWithoutRef<'form'>, 'action' | 'aria-labe
      * The action to be performed when the form is submitted. It can be asynchronous.
      */
     action?: Action;
+    /**
+     * Sets the default label position for all `FormFields` within the form. Will be ignored if labelPosition
+     * is set on the `FormField` itself.
+     */
+    labelPosition?: 'block' | 'inline';
     /**
      * The form elements used in the form
      */
@@ -1009,7 +1077,7 @@ type FormProps<T> = Omit<ComponentPropsWithoutRef<'form'>, 'action' | 'aria-labe
  * x
  */
 declare const FormComponent: {
-    <T>({ children, action, values, validate, fullWidth, ...props }: FormProps<T>, forwardedRef?: Ref<HTMLFormElement>): JSX.Element;
+    <T>({ children, action, values, labelPosition, validate, fullWidth, ...props }: FormProps<T>, forwardedRef?: Ref<HTMLFormElement>): JSX.Element;
     displayName: string;
 };
 declare const Form: <T>(props: FormProps<T> & {
@@ -1046,12 +1114,16 @@ type FormFieldProps = ComponentPropsWithoutRef<'div'> & {
      * A value that overrides the basic value. This should pair with `onChange`.
      */
     value?: string;
+    /**
+     * Setting to `inline` will have the label and input appear on the same line. Setting to `block` will have the label above the input.
+     */
+    labelPosition?: 'block' | 'inline';
 };
 /**
  * Component description goes here
  */
 declare const FormField: {
-    ({ children, label, name, error, value, ...props }: FormFieldProps): JSX.Element;
+    ({ children, label, name, error, value, labelPosition, id, ...props }: FormFieldProps): JSX.Element;
     displayName: string;
 };
 
@@ -1627,6 +1699,57 @@ type MenuItemButtonProps = ButtonProps & {
 
 declare const MenuItem: react.ForwardRefExoticComponent<(Omit<DropdownMenuItemProps & BaseButtonProps & Omit<react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
     ref?: ((instance: HTMLAnchorElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLAnchorElement> | null | undefined;
+} & {
+    beforeAction?: (() => Promise<void>) | (() => void);
+    children: react.ReactNode;
+    colorScheme?: ColorSchemeTypes;
+    disabled?: boolean;
+    leftIcon?: react.JSX.Element | undefined;
+    rightIcon?: react.JSX.Element | undefined;
+    type?: LinkTypes | undefined;
+    underline?: boolean;
+} & Omit<react_router.LinkProps, "to"> & {
+    href: string | undefined;
+    type?: LinkTypes;
+} & {
+    href: string | undefined;
+    children: react.ReactNode;
+    beforeAction?: (() => Promise<void>) | (() => void);
+    type?: LinkTypes;
+} & {
+    appearance?: "dangerous" | "default" | "gated";
+    badge?: react.JSX.Element;
+    children?: react.ReactNode;
+    command?: react.ReactNode;
+    icon?: ButtonProps["leftIcon"];
+    leftIcon?: ButtonProps["leftIcon"];
+    rightIcon?: ButtonProps["rightIcon"];
+    fullWidth?: never;
+    asChild?: never;
+    variant?: never;
+    size?: never;
+    unstyled?: never;
+} & {
+    /**
+     * Treats the menu item as a link when provided
+     */
+    href?: MenuItemButtonProps["href"];
+}, "ref"> | Omit<DropdownMenuItemProps & BaseButtonProps & Omit<react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    ref?: ((instance: HTMLAnchorElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLAnchorElement> | null | undefined;
+} & {
+    beforeAction?: (() => Promise<void>) | (() => void);
+    children: react.ReactNode;
+    colorScheme?: ColorSchemeTypes;
+    disabled?: boolean;
+    leftIcon?: react.JSX.Element | undefined;
+    rightIcon?: react.JSX.Element | undefined;
+    type?: LinkTypes | undefined;
+    underline?: boolean;
+} & Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLButtonElement> | null | undefined;
+} & {
+    href?: never;
+    type?: "button" | "reset" | "submit";
 } & {
     href: string | undefined;
     children: react.ReactNode;
@@ -1913,6 +2036,45 @@ declare const Modal: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProp
     width?: string;
 } & react.RefAttributes<HTMLDivElement>>;
 
+type ControlledPopoverProps = {
+    /**
+     * Is the popover open.
+     * Must be used with `onOpenChange`.
+     * */
+    isOpen: boolean;
+    /** When an attempt to toggle the popover is triggered.
+     *  Must be used with `isOpen`.
+     */
+    onOpenChange: (isOpen: boolean) => void;
+};
+type UncontrolledPopoverProps = {
+    isOpen?: never;
+    onOpenChange?: never;
+};
+type PopoverControlProps = ControlledPopoverProps | UncontrolledPopoverProps;
+type ContentProps = Omit<PopoverContentProps, 'alignOffset' | 'arrowPadding' | 'asChild' | 'collisionPadding' | 'hideWhenDetached' | 'sideOffset' | 'updatePositionStrategy'>;
+type PopoverProps = ContentProps & PopoverControlProps & {
+    /**
+     * The content of the popover
+     */
+    children: ReactNode;
+    /**
+     * Determines if the close button is visible (if false, `esc` will still close the Modal)
+     */
+    hideCloseButton?: boolean;
+    /**
+     * An interactive element. Most commonly a [Button](?path=/docs/components-button--docs) or [IconButton]([Button](?path=/docs/components-iconbutton--docs)).
+     * */
+    trigger: JSX.Element;
+};
+/**
+ * Displays rich content in a portal, triggered by a button.
+ */
+declare const Popover: {
+    ({ children, trigger, isOpen, hideCloseButton, onOpenChange, ...props }: PopoverProps): JSX.Element;
+    displayName: string;
+};
+
 type RadioProps = ComponentPropsWithoutRef<'input'> & {
     /**
      * Indicates the state of the radio
@@ -2380,7 +2542,7 @@ type SelectOptionProps = {
      */
     children: ReactNode;
     /**
-     * The value to set
+     * The value to set. Leave this empty to define a placeholder option.
      */
     value: string;
     /**
@@ -2405,4 +2567,4 @@ type SelectOptionGroupProps = {
 };
 declare const SelectOptionGroup: ({ children, label, ...props }: SelectOptionGroupProps) => react_jsx_runtime.JSX.Element;
 
-export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, Collapsible, CollapsibleContent, type CollapsibleProps, CollapsibleTrigger, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, DataCard, type DataCardProps, DataCardTrend, type DataCardTrendProps, DataCards, type DataCardsProps, Divider, EditableHeading, type EditableHeadingProps, Ellipsis, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Radio, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, SegmentedControl, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, Select, SelectOption, SelectOptionGroup, type SelectOptionGroupProps, type SelectOptionProps, type SelectProps, Stack, SubMenu, Tab, type TabProps, Tabs, type TabsProps, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, dateTime, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };
+export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, Collapsible, CollapsibleContent, type CollapsibleProps, CollapsibleTrigger, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, DataCard, type DataCardProps, DataCardTrend, type DataCardTrendProps, DataCards, type DataCardsProps, Divider, EditableHeading, type EditableHeadingProps, Ellipsis, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Popover, type PopoverProps, Radio, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, SegmentedControl, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, Select, SelectOption, SelectOptionGroup, type SelectOptionGroupProps, type SelectOptionProps, type SelectProps, Stack, SubMenu, Tab, type TabProps, Tabs, type TabsProps, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, dateTime, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };

package/dist/index.d.ts

@@ -1,10 +1,12 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, ForwardedRef, Ref, InputHTMLAttributes, RefObject, ForwardRefExoticComponent, RefAttributes } from 'react';
+import * as react_router from 'react-router';
 import { LinkProps as LinkProps$1 } from 'react-router-dom';
 import { CollapsibleContentProps as CollapsibleContentProps$1 } from '@radix-ui/react-collapsible';
 import * as styled_components from 'styled-components';
 import { DropdownMenuContentProps, DropdownMenuItemProps, DropdownMenuRadioGroupProps, DropdownMenuRadioItemProps, DropdownMenuCheckboxItemProps } from '@radix-ui/react-dropdown-menu';
+import { PopoverContentProps } from '@radix-ui/react-popover';
 import { ToggleGroupSingleProps } from '@radix-ui/react-toggle-group';
 
 type UIProviderProps = {
@@ -260,7 +262,7 @@ type BaseButtonProps = {
      */
     variant?: ButtonVariants;
 };
-type ButtonAsLinkProps = BaseButtonProps & ComponentPropsWithRef<'a'> & {
+type ButtonAsLinkProps = BaseButtonProps & ComponentPropsWithRef<'a'> & LinkProps & {
     href: string | undefined;
     children: ReactNode;
     /**
@@ -286,7 +288,63 @@ type ButtonProps = ButtonAsButtonProps | ButtonAsLinkProps;
  * action, or performing a delete operation. It replaces the HTML `<button>` element,
  * unless an `href` attribute is passed, in which it will render an `<a>` element.
  */
-declare const Button: react.ForwardRefExoticComponent<(Omit<ButtonAsLinkProps, "ref"> | Omit<ButtonAsButtonProps, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
+declare const Button: react.ForwardRefExoticComponent<(Omit<BaseButtonProps & Omit<react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    ref?: ((instance: HTMLAnchorElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLAnchorElement> | null | undefined;
+} & {
+    beforeAction?: (() => Promise<void>) | (() => void);
+    children: ReactNode;
+    colorScheme?: ColorSchemeTypes;
+    disabled?: boolean;
+    leftIcon?: JSX.Element | undefined;
+    rightIcon?: JSX.Element | undefined;
+    type?: LinkTypes | undefined;
+    underline?: boolean;
+} & Omit<react_router.LinkProps, "to"> & {
+    href: string | undefined;
+    type?: LinkTypes;
+} & {
+    href: string | undefined;
+    children: ReactNode;
+    /**
+     * This just allows pathrough to beforeAction for link
+     * @ignore
+     */
+    beforeAction?: (() => Promise<void>) | (() => void);
+    /**
+     * This just allows pathrough to beforeAction for link
+     * @ignore
+     */
+    type?: LinkTypes;
+}, "ref"> | Omit<BaseButtonProps & Omit<react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    ref?: ((instance: HTMLAnchorElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLAnchorElement> | null | undefined;
+} & {
+    beforeAction?: (() => Promise<void>) | (() => void);
+    children: ReactNode;
+    colorScheme?: ColorSchemeTypes;
+    disabled?: boolean;
+    leftIcon?: JSX.Element | undefined;
+    rightIcon?: JSX.Element | undefined;
+    type?: LinkTypes | undefined;
+    underline?: boolean;
+} & Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLButtonElement> | null | undefined;
+} & {
+    href?: never;
+    type?: "button" | "reset" | "submit";
+} & {
+    href: string | undefined;
+    children: ReactNode;
+    /**
+     * This just allows pathrough to beforeAction for link
+     * @ignore
+     */
+    beforeAction?: (() => Promise<void>) | (() => void);
+    /**
+     * This just allows pathrough to beforeAction for link
+     * @ignore
+     */
+    type?: LinkTypes;
+}, "ref"> | Omit<ButtonAsButtonProps, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
 
 type ToastProps = ComponentPropsWithoutRef<'div'> & {
     /**
@@ -622,13 +680,18 @@ type ButtonGroupProps = ComponentPropsWithoutRef<'div'> & {
      * Force ButtonGroup to fill the width of it's container
      */
     fullWidth?: boolean;
+    /**
+     * If true, the button group will collapse to a single column on small screens
+     * and the buttons will be stacked on top of each other.
+     */
+    collapseOnSmallScreens?: boolean;
 };
 /**
  * ButtonGroup is a layout component that groups buttons together,
  * with a standardized gap between them.
  */
 declare const ButtonGroup: {
-    ({ children, align, fullWidth, ...otherProps }: ButtonGroupProps): JSX.Element | null;
+    ({ children, align, fullWidth, collapseOnSmallScreens, ...otherProps }: ButtonGroupProps): JSX.Element | null;
     displayName: string;
 };
 
@@ -984,6 +1047,11 @@ type FormProps<T> = Omit<ComponentPropsWithoutRef<'form'>, 'action' | 'aria-labe
      * The action to be performed when the form is submitted. It can be asynchronous.
      */
     action?: Action;
+    /**
+     * Sets the default label position for all `FormFields` within the form. Will be ignored if labelPosition
+     * is set on the `FormField` itself.
+     */
+    labelPosition?: 'block' | 'inline';
     /**
      * The form elements used in the form
      */
@@ -1009,7 +1077,7 @@ type FormProps<T> = Omit<ComponentPropsWithoutRef<'form'>, 'action' | 'aria-labe
  * x
  */
 declare const FormComponent: {
-    <T>({ children, action, values, validate, fullWidth, ...props }: FormProps<T>, forwardedRef?: Ref<HTMLFormElement>): JSX.Element;
+    <T>({ children, action, values, labelPosition, validate, fullWidth, ...props }: FormProps<T>, forwardedRef?: Ref<HTMLFormElement>): JSX.Element;
     displayName: string;
 };
 declare const Form: <T>(props: FormProps<T> & {
@@ -1046,12 +1114,16 @@ type FormFieldProps = ComponentPropsWithoutRef<'div'> & {
      * A value that overrides the basic value. This should pair with `onChange`.
      */
     value?: string;
+    /**
+     * Setting to `inline` will have the label and input appear on the same line. Setting to `block` will have the label above the input.
+     */
+    labelPosition?: 'block' | 'inline';
 };
 /**
  * Component description goes here
  */
 declare const FormField: {
-    ({ children, label, name, error, value, ...props }: FormFieldProps): JSX.Element;
+    ({ children, label, name, error, value, labelPosition, id, ...props }: FormFieldProps): JSX.Element;
     displayName: string;
 };
 
@@ -1627,6 +1699,57 @@ type MenuItemButtonProps = ButtonProps & {
 
 declare const MenuItem: react.ForwardRefExoticComponent<(Omit<DropdownMenuItemProps & BaseButtonProps & Omit<react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
     ref?: ((instance: HTMLAnchorElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLAnchorElement> | null | undefined;
+} & {
+    beforeAction?: (() => Promise<void>) | (() => void);
+    children: react.ReactNode;
+    colorScheme?: ColorSchemeTypes;
+    disabled?: boolean;
+    leftIcon?: react.JSX.Element | undefined;
+    rightIcon?: react.JSX.Element | undefined;
+    type?: LinkTypes | undefined;
+    underline?: boolean;
+} & Omit<react_router.LinkProps, "to"> & {
+    href: string | undefined;
+    type?: LinkTypes;
+} & {
+    href: string | undefined;
+    children: react.ReactNode;
+    beforeAction?: (() => Promise<void>) | (() => void);
+    type?: LinkTypes;
+} & {
+    appearance?: "dangerous" | "default" | "gated";
+    badge?: react.JSX.Element;
+    children?: react.ReactNode;
+    command?: react.ReactNode;
+    icon?: ButtonProps["leftIcon"];
+    leftIcon?: ButtonProps["leftIcon"];
+    rightIcon?: ButtonProps["rightIcon"];
+    fullWidth?: never;
+    asChild?: never;
+    variant?: never;
+    size?: never;
+    unstyled?: never;
+} & {
+    /**
+     * Treats the menu item as a link when provided
+     */
+    href?: MenuItemButtonProps["href"];
+}, "ref"> | Omit<DropdownMenuItemProps & BaseButtonProps & Omit<react.DetailedHTMLProps<react.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    ref?: ((instance: HTMLAnchorElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLAnchorElement> | null | undefined;
+} & {
+    beforeAction?: (() => Promise<void>) | (() => void);
+    children: react.ReactNode;
+    colorScheme?: ColorSchemeTypes;
+    disabled?: boolean;
+    leftIcon?: react.JSX.Element | undefined;
+    rightIcon?: react.JSX.Element | undefined;
+    type?: LinkTypes | undefined;
+    underline?: boolean;
+} & Omit<react.DetailedHTMLProps<react.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void | react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof react.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | react.RefObject<HTMLButtonElement> | null | undefined;
+} & {
+    href?: never;
+    type?: "button" | "reset" | "submit";
 } & {
     href: string | undefined;
     children: react.ReactNode;
@@ -1913,6 +2036,45 @@ declare const Modal: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProp
     width?: string;
 } & react.RefAttributes<HTMLDivElement>>;
 
+type ControlledPopoverProps = {
+    /**
+     * Is the popover open.
+     * Must be used with `onOpenChange`.
+     * */
+    isOpen: boolean;
+    /** When an attempt to toggle the popover is triggered.
+     *  Must be used with `isOpen`.
+     */
+    onOpenChange: (isOpen: boolean) => void;
+};
+type UncontrolledPopoverProps = {
+    isOpen?: never;
+    onOpenChange?: never;
+};
+type PopoverControlProps = ControlledPopoverProps | UncontrolledPopoverProps;
+type ContentProps = Omit<PopoverContentProps, 'alignOffset' | 'arrowPadding' | 'asChild' | 'collisionPadding' | 'hideWhenDetached' | 'sideOffset' | 'updatePositionStrategy'>;
+type PopoverProps = ContentProps & PopoverControlProps & {
+    /**
+     * The content of the popover
+     */
+    children: ReactNode;
+    /**
+     * Determines if the close button is visible (if false, `esc` will still close the Modal)
+     */
+    hideCloseButton?: boolean;
+    /**
+     * An interactive element. Most commonly a [Button](?path=/docs/components-button--docs) or [IconButton]([Button](?path=/docs/components-iconbutton--docs)).
+     * */
+    trigger: JSX.Element;
+};
+/**
+ * Displays rich content in a portal, triggered by a button.
+ */
+declare const Popover: {
+    ({ children, trigger, isOpen, hideCloseButton, onOpenChange, ...props }: PopoverProps): JSX.Element;
+    displayName: string;
+};
+
 type RadioProps = ComponentPropsWithoutRef<'input'> & {
     /**
      * Indicates the state of the radio
@@ -2380,7 +2542,7 @@ type SelectOptionProps = {
      */
     children: ReactNode;
     /**
-     * The value to set
+     * The value to set. Leave this empty to define a placeholder option.
      */
     value: string;
     /**
@@ -2405,4 +2567,4 @@ type SelectOptionGroupProps = {
 };
 declare const SelectOptionGroup: ({ children, label, ...props }: SelectOptionGroupProps) => react_jsx_runtime.JSX.Element;
 
-export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, Collapsible, CollapsibleContent, type CollapsibleProps, CollapsibleTrigger, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, DataCard, type DataCardProps, DataCardTrend, type DataCardTrendProps, DataCards, type DataCardsProps, Divider, EditableHeading, type EditableHeadingProps, Ellipsis, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Radio, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, SegmentedControl, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, Select, SelectOption, SelectOptionGroup, type SelectOptionGroupProps, type SelectOptionProps, type SelectProps, Stack, SubMenu, Tab, type TabProps, Tabs, type TabsProps, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, dateTime, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };
+export { ActionButton, type ActionButtonProps, Avatar, type AvatarProps, type AvatarStatus, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, Collapsible, CollapsibleContent, type CollapsibleProps, CollapsibleTrigger, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, DataCard, type DataCardProps, DataCardTrend, type DataCardTrendProps, DataCards, type DataCardsProps, Divider, EditableHeading, type EditableHeadingProps, Ellipsis, Form, FormErrorSummary, FormField, type FormFieldProps, FormGroup, type FormGroupProps, type FormProps, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Popover, type PopoverProps, Radio, RadioGroup, RadioMenuItem, type RadioProps, ScreenReaderOnly, SegmentedControl, SegmentedControlItem, type SegmentedControlItemProps, type SegmentedControlProps, Select, SelectOption, SelectOptionGroup, type SelectOptionGroupProps, type SelectOptionProps, type SelectProps, Stack, SubMenu, Tab, type TabProps, Tabs, type TabsProps, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, dateTime, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };