@wistia/ui 0.6.13 → 0.6.14-beta.3f97cbfa.3a5d72d

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
-import react__default, { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, ForwardedRef, Ref, InputHTMLAttributes, RefObject, ForwardRefExoticComponent, RefAttributes } from 'react';
+import react__default, { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, MutableRefObject, ForwardedRef, Ref, InputHTMLAttributes, RefObject, ForwardRefExoticComponent, RefAttributes } from 'react';
 export * from 'use-file-picker/types';
 export { useFilePicker, useImperativeFilePicker } from 'use-file-picker';
 export { FileAmountLimitValidator, FileSizeValidator, FileTypeValidator, ImageDimensionsValidator, PersistentFileAmountLimitValidator } from 'use-file-picker/validators';
@@ -830,6 +830,31 @@ type CheckboxProps = Omit<ComponentPropsWithRef<'label'>, 'onChange'> & {
 };
 declare const Checkbox: react.ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
 
+type ClickRegionProps = {
+    /**
+     * The content that should be clickable.
+     */
+    children: JSX.Element;
+    /**
+     * The ref to the button or link that should be clicked when the ClickRegion is clicked.
+     */
+    targetRef: MutableRefObject<HTMLAnchorElement | HTMLButtonElement | null>;
+};
+/**
+ * This allows larger elements to be interactive links or buttons while maintaining acessibility.
+ *
+ * For buttons, when the element is clicked, it will proxy a click event to the targetRef, which should be inside the ClickRegion.
+ *
+ * For links, a pseudo-element of the link is created that is the size of the ClickRegion. **Note**: this will prevent text selection
+ * inside the text region.
+ *
+ * In either case, a link or button must be present, but can be hidden by using `ScreenReaderOnly`.
+ */
+declare const ClickRegion: {
+    ({ children, targetRef }: ClickRegionProps): JSX.Element;
+    displayName: string;
+};
+
 type CollapsibleProps = {
     /**
      * `CollapsibleTrigger` and `CollapsibleContent` must be included somewhere inside these children.
@@ -1711,6 +1736,10 @@ type SubMenuProps = {
      * Callback when the submenu is opened or closed
      */
     onOpenChange?: (open: boolean) => void;
+    /**
+     * Icon to display on the left side of the SubMenu, Must be an instance of [Icon](?path=/docs/components-icon--docs)
+     */
+    icon?: JSX.Element | undefined;
 };
 declare const SubMenu: {
     ({ label, description, children, onOpenChange, ...props }: SubMenuProps): react_jsx_runtime.JSX.Element;
@@ -2151,6 +2180,32 @@ declare const Popover: {
     displayName: string;
 };
 
+type ProgressBarProps = ComponentPropsWithoutRef<'div'> & {
+    /**
+     * Current numeric level of the progress (0 -> max)
+     */
+    progress: number;
+    /**
+     * The maximum progress value
+     */
+    max?: number;
+    /**
+     * Slot for additional content to be rendered to the left of the progress bar
+     */
+    labelLeft?: ReactNode;
+    /**
+     * Slot for additional content to be rendered to the right of the progress bar
+     */
+    labelRight?: ReactNode;
+};
+/**
+ * A progress component that visually represents the completion status of a task
+ */
+declare const ProgressBar: {
+    ({ progress, max, children, labelLeft, labelRight, ...props }: ProgressBarProps): JSX.Element;
+    displayName: string;
+};
+
 type RadioProps = ComponentPropsWithoutRef<'input'> & {
     /**
      * Indicates the state of the radio
@@ -2701,4 +2756,4 @@ declare const WistiaLogo: {
     displayName: string;
 };
 
-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, Image, type ImageProps, 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, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableFooter, type TableFooterProps, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, 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, ClickRegion, type ClickRegionProps, 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, Image, type ImageProps, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Popover, type PopoverProps, ProgressBar, type ProgressBarProps, 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, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableFooter, type TableFooterProps, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, 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,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
-import react__default, { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, ForwardedRef, Ref, InputHTMLAttributes, RefObject, ForwardRefExoticComponent, RefAttributes } from 'react';
+import react__default, { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, ComponentPropsWithRef, MouseEvent, ElementType, ChangeEvent, MutableRefObject, ForwardedRef, Ref, InputHTMLAttributes, RefObject, ForwardRefExoticComponent, RefAttributes } from 'react';
 export * from 'use-file-picker/types';
 export { useFilePicker, useImperativeFilePicker } from 'use-file-picker';
 export { FileAmountLimitValidator, FileSizeValidator, FileTypeValidator, ImageDimensionsValidator, PersistentFileAmountLimitValidator } from 'use-file-picker/validators';
@@ -830,6 +830,31 @@ type CheckboxProps = Omit<ComponentPropsWithRef<'label'>, 'onChange'> & {
 };
 declare const Checkbox: react.ForwardRefExoticComponent<Omit<CheckboxProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
 
+type ClickRegionProps = {
+    /**
+     * The content that should be clickable.
+     */
+    children: JSX.Element;
+    /**
+     * The ref to the button or link that should be clicked when the ClickRegion is clicked.
+     */
+    targetRef: MutableRefObject<HTMLAnchorElement | HTMLButtonElement | null>;
+};
+/**
+ * This allows larger elements to be interactive links or buttons while maintaining acessibility.
+ *
+ * For buttons, when the element is clicked, it will proxy a click event to the targetRef, which should be inside the ClickRegion.
+ *
+ * For links, a pseudo-element of the link is created that is the size of the ClickRegion. **Note**: this will prevent text selection
+ * inside the text region.
+ *
+ * In either case, a link or button must be present, but can be hidden by using `ScreenReaderOnly`.
+ */
+declare const ClickRegion: {
+    ({ children, targetRef }: ClickRegionProps): JSX.Element;
+    displayName: string;
+};
+
 type CollapsibleProps = {
     /**
      * `CollapsibleTrigger` and `CollapsibleContent` must be included somewhere inside these children.
@@ -1711,6 +1736,10 @@ type SubMenuProps = {
      * Callback when the submenu is opened or closed
      */
     onOpenChange?: (open: boolean) => void;
+    /**
+     * Icon to display on the left side of the SubMenu, Must be an instance of [Icon](?path=/docs/components-icon--docs)
+     */
+    icon?: JSX.Element | undefined;
 };
 declare const SubMenu: {
     ({ label, description, children, onOpenChange, ...props }: SubMenuProps): react_jsx_runtime.JSX.Element;
@@ -2151,6 +2180,32 @@ declare const Popover: {
     displayName: string;
 };
 
+type ProgressBarProps = ComponentPropsWithoutRef<'div'> & {
+    /**
+     * Current numeric level of the progress (0 -> max)
+     */
+    progress: number;
+    /**
+     * The maximum progress value
+     */
+    max?: number;
+    /**
+     * Slot for additional content to be rendered to the left of the progress bar
+     */
+    labelLeft?: ReactNode;
+    /**
+     * Slot for additional content to be rendered to the right of the progress bar
+     */
+    labelRight?: ReactNode;
+};
+/**
+ * A progress component that visually represents the completion status of a task
+ */
+declare const ProgressBar: {
+    ({ progress, max, children, labelLeft, labelRight, ...props }: ProgressBarProps): JSX.Element;
+    displayName: string;
+};
+
 type RadioProps = ComponentPropsWithoutRef<'input'> & {
     /**
      * Indicates the state of the radio
@@ -2701,4 +2756,4 @@ declare const WistiaLogo: {
     displayName: string;
 };
 
-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, Image, type ImageProps, 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, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableFooter, type TableFooterProps, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, 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, ClickRegion, type ClickRegionProps, 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, Image, type ImageProps, Input, type InputProps, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Modal, type ModalProps, Popover, type PopoverProps, ProgressBar, type ProgressBarProps, 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, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableFooter, type TableFooterProps, TableHead, type TableHeadProps, type TableProps, TableRow, type TableRowProps, 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 };