@wistia/ui 0.0.17 → 0.0.19

package/dist/index.d.mts

@@ -126,7 +126,7 @@ type BadgeProps = ComponentPropsWithoutRef<'div'> & {
     label: string;
 };
 /**
- * A badge is a compact label, with optional icon, to convey status or context.
+ * A `Badge` is a compact label, with optional icon, to convey status or context.
  */
 declare const Badge: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     /**
@@ -1446,6 +1446,54 @@ declare const Stack: (<C = "div">(props: PolymorphicComponentProps<C, StackProps
     renderAs: react.JSXElementConstructor<any> | keyof react.JSX.IntrinsicElements;
 })>, never> & Record<string, never>;
 
+type TagProps = ComponentPropsWithoutRef<'div'> & {
+    /**
+     * Set the [color scheme](/?path=/docs/docs-color-schemes--docs) of the `Tag`
+     */
+    colorScheme?: ColorSchemeTypes;
+    /**
+     * Valid URL for the `Tag` label to link to
+     */
+    href?: string;
+    /**
+     * Text label for the `Tag`
+     */
+    label: ReactNode;
+    /**
+     * Callback function to be called when the `x` button is clicked
+     */
+    onClickRemove?: ((event: MouseEvent<HTMLButtonElement>) => void) | undefined;
+    /**
+     * Accessible label for the `x` button (ie. "Remove tag")
+     */
+    onClickRemoveLabel?: string | undefined;
+};
+/**
+ * A `Tag` is an optionally linked label, with an optional action button, to categorize content.
+ */
+declare const Tag: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    /**
+     * Set the [color scheme](/?path=/docs/docs-color-schemes--docs) of the `Tag`
+     */
+    colorScheme?: ColorSchemeTypes;
+    /**
+     * Valid URL for the `Tag` label to link to
+     */
+    href?: string;
+    /**
+     * Text label for the `Tag`
+     */
+    label: ReactNode;
+    /**
+     * Callback function to be called when the `x` button is clicked
+     */
+    onClickRemove?: ((event: MouseEvent<HTMLButtonElement>) => void) | undefined;
+    /**
+     * Accessible label for the `x` button (ie. "Remove tag")
+     */
+    onClickRemoveLabel?: string | undefined;
+} & react.RefAttributes<HTMLDivElement>>;
+
 type TooltipProps = {
     /**
      * The content of the tooltip
@@ -1525,4 +1573,4 @@ declare const WistiaLogo: {
     displayName: string;
 };
 
-export { Avatar, type AvatarInstanceType, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Button, ButtonGroup, type ButtonProps, Checkbox, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, Ellipsis, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, RadioMenuItem, ScreenReaderOnly, Stack, SubMenu, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useMq, useWindowSize };
+export { Avatar, type AvatarInstanceType, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Button, ButtonGroup, type ButtonProps, Checkbox, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, Ellipsis, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, RadioMenuItem, ScreenReaderOnly, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useMq, useWindowSize };

package/dist/index.d.ts

@@ -126,7 +126,7 @@ type BadgeProps = ComponentPropsWithoutRef<'div'> & {
     label: string;
 };
 /**
- * A badge is a compact label, with optional icon, to convey status or context.
+ * A `Badge` is a compact label, with optional icon, to convey status or context.
  */
 declare const Badge: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     /**
@@ -1446,6 +1446,54 @@ declare const Stack: (<C = "div">(props: PolymorphicComponentProps<C, StackProps
     renderAs: react.JSXElementConstructor<any> | keyof react.JSX.IntrinsicElements;
 })>, never> & Record<string, never>;
 
+type TagProps = ComponentPropsWithoutRef<'div'> & {
+    /**
+     * Set the [color scheme](/?path=/docs/docs-color-schemes--docs) of the `Tag`
+     */
+    colorScheme?: ColorSchemeTypes;
+    /**
+     * Valid URL for the `Tag` label to link to
+     */
+    href?: string;
+    /**
+     * Text label for the `Tag`
+     */
+    label: ReactNode;
+    /**
+     * Callback function to be called when the `x` button is clicked
+     */
+    onClickRemove?: ((event: MouseEvent<HTMLButtonElement>) => void) | undefined;
+    /**
+     * Accessible label for the `x` button (ie. "Remove tag")
+     */
+    onClickRemoveLabel?: string | undefined;
+};
+/**
+ * A `Tag` is an optionally linked label, with an optional action button, to categorize content.
+ */
+declare const Tag: react.ForwardRefExoticComponent<Omit<react.DetailedHTMLProps<react.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    /**
+     * Set the [color scheme](/?path=/docs/docs-color-schemes--docs) of the `Tag`
+     */
+    colorScheme?: ColorSchemeTypes;
+    /**
+     * Valid URL for the `Tag` label to link to
+     */
+    href?: string;
+    /**
+     * Text label for the `Tag`
+     */
+    label: ReactNode;
+    /**
+     * Callback function to be called when the `x` button is clicked
+     */
+    onClickRemove?: ((event: MouseEvent<HTMLButtonElement>) => void) | undefined;
+    /**
+     * Accessible label for the `x` button (ie. "Remove tag")
+     */
+    onClickRemoveLabel?: string | undefined;
+} & react.RefAttributes<HTMLDivElement>>;
+
 type TooltipProps = {
     /**
      * The content of the tooltip
@@ -1525,4 +1573,4 @@ declare const WistiaLogo: {
     displayName: string;
 };
 
-export { Avatar, type AvatarInstanceType, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Button, ButtonGroup, type ButtonProps, Checkbox, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, Ellipsis, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, RadioMenuItem, ScreenReaderOnly, Stack, SubMenu, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useMq, useWindowSize };
+export { Avatar, type AvatarInstanceType, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Button, ButtonGroup, type ButtonProps, Checkbox, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, Ellipsis, Heading, type HeadingProps, Icon, IconButton, type IconButtonProps, type IconNameType, Label, type LabelProps, Link, type LinkProps, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, RadioMenuItem, ScreenReaderOnly, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useMq, useWindowSize };