@wistia/ui 0.4.6-beta.c8781aca.f327beb → 0.4.6

package/dist/index.d.mts

@@ -4,7 +4,6 @@ import { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, Com
 import { LinkProps as LinkProps$1 } from 'react-router-dom';
 import * as styled_components from 'styled-components';
 import { DropdownMenuContentProps, DropdownMenuItemProps, DropdownMenuRadioGroupProps, DropdownMenuRadioItemProps, DropdownMenuCheckboxItemProps } from '@radix-ui/react-dropdown-menu';
-import { ToggleGroupSingleProps } from '@radix-ui/react-toggle-group';
 
 type UIProviderProps = {
     children: ReactNode;
@@ -281,7 +280,7 @@ declare const useWindowSize: (interval?: number) => {
 
 type ActionButtonProps = {
     /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
+     * The Icon component to use, e.g. `<Icon type="favorite" />`
      */
     icon: JSX.Element;
     /**
@@ -302,7 +301,7 @@ type ActionButtonProps = {
  */
 declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
     /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
+     * The Icon component to use, e.g. `<Icon type="favorite" />`
      */
     icon: JSX.Element;
     /**
@@ -319,7 +318,7 @@ declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
     variant?: "default" | "gated" | "menu-down" | "menu-up";
 } & Omit<ButtonAsButtonProps, "size" | "isLoading" | "leftIcon" | "fullWidth" | "unstyled" | "rightIcon" | "variant">, "ref"> | Omit<{
     /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
+     * The Icon component to use, e.g. `<Icon type="favorite" />`
      */
     icon: JSX.Element;
     /**
@@ -692,7 +691,7 @@ type CheckboxProps = Omit<ComponentPropsWithRef<'label'>, 'onChange'> & {
      */
     name?: string | undefined;
     /**
-     * Callback function invoked when the value changes
+     * Callback function invoked when the checkbox value changes
      */
     onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
     /**
@@ -1238,7 +1237,7 @@ type IconButtonProps = {
      */
     label: string;
     /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
+     * The Icon component to use, e.g. `<Icon type="favorite" />`
      */
     children: JSX.Element;
 } & (Omit<ButtonAsButtonProps, 'fullWidth' | 'leftIcon' | 'rightIcon'> | Omit<ButtonAsLinkProps, 'fullWidth' | 'leftIcon' | 'rightIcon'>);
@@ -1252,7 +1251,7 @@ declare const IconButton: react.ForwardRefExoticComponent<(Omit<{
      */
     label: string;
     /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
+     * The Icon component to use, e.g. `<Icon type="favorite" />`
      */
     children: JSX.Element;
 } & Omit<ButtonAsButtonProps, "leftIcon" | "fullWidth" | "rightIcon">, "ref"> | Omit<{
@@ -1261,7 +1260,7 @@ declare const IconButton: react.ForwardRefExoticComponent<(Omit<{
      */
     label: string;
     /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
+     * The Icon component to use, e.g. `<Icon type="favorite" />`
      */
     children: JSX.Element;
 } & Omit<ButtonAsLinkProps, "leftIcon" | "fullWidth" | "rightIcon">, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
@@ -2008,48 +2007,6 @@ declare const ScreenReaderOnly: {
     displayName: string;
 };
 
-type SegmentedControlProps = Omit<ToggleGroupSingleProps, 'type'> & {
-    /**
-     * `SegmentedControlItem`s that will be rendered in grouping
-     */
-    children?: ReactNode;
-    /**
-     * Force `SegmentedControl` to fill the width of it's container
-     */
-    fullWidth?: boolean | undefined;
-    /**
-     * Callback function invoked when the value changes
-     */
-    onSelectedValueChange: (value: string) => void;
-    /**
-     * The value of the `SegmentedControlItem` which should be selected
-     */
-    selectedValue: string;
-};
-/**
- * Provides a horizontal set of segments for switching between different values
- */
-declare const SegmentedControl: {
-    ({ children, fullWidth, selectedValue, onSelectedValueChange, ...props }: SegmentedControlProps): JSX.Element | null;
-    displayName: string;
-};
-
-type SegmentedControlItemProps = {
-    /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
-     */
-    icon?: JSX.Element;
-    /**
-     * The label of the item
-     */
-    label?: string | undefined;
-    /**
-     * The value of the item
-     */
-    value: string;
-};
-declare const SegmentedControlItem: ({ icon, label, value, }: SegmentedControlItemProps) => JSX.Element;
-
 type StackProps = {
     /**
      * Optional children
@@ -2206,4 +2163,4 @@ declare const WistiaLogo: {
     displayName: string;
 };
 
-export { ActionButton, type ActionButtonProps, Avatar, type AvatarInstanceType, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, 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, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };
+export { ActionButton, type ActionButtonProps, Avatar, type AvatarInstanceType, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, 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, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };

package/dist/index.d.ts

@@ -4,7 +4,6 @@ import { ReactNode, Dispatch, SetStateAction, ComponentPropsWithoutRef, JSX, Com
 import { LinkProps as LinkProps$1 } from 'react-router-dom';
 import * as styled_components from 'styled-components';
 import { DropdownMenuContentProps, DropdownMenuItemProps, DropdownMenuRadioGroupProps, DropdownMenuRadioItemProps, DropdownMenuCheckboxItemProps } from '@radix-ui/react-dropdown-menu';
-import { ToggleGroupSingleProps } from '@radix-ui/react-toggle-group';
 
 type UIProviderProps = {
     children: ReactNode;
@@ -281,7 +280,7 @@ declare const useWindowSize: (interval?: number) => {
 
 type ActionButtonProps = {
     /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
+     * The Icon component to use, e.g. `<Icon type="favorite" />`
      */
     icon: JSX.Element;
     /**
@@ -302,7 +301,7 @@ type ActionButtonProps = {
  */
 declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
     /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
+     * The Icon component to use, e.g. `<Icon type="favorite" />`
      */
     icon: JSX.Element;
     /**
@@ -319,7 +318,7 @@ declare const ActionButton: react.ForwardRefExoticComponent<(Omit<{
     variant?: "default" | "gated" | "menu-down" | "menu-up";
 } & Omit<ButtonAsButtonProps, "size" | "isLoading" | "leftIcon" | "fullWidth" | "unstyled" | "rightIcon" | "variant">, "ref"> | Omit<{
     /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
+     * The Icon component to use, e.g. `<Icon type="favorite" />`
      */
     icon: JSX.Element;
     /**
@@ -692,7 +691,7 @@ type CheckboxProps = Omit<ComponentPropsWithRef<'label'>, 'onChange'> & {
      */
     name?: string | undefined;
     /**
-     * Callback function invoked when the value changes
+     * Callback function invoked when the checkbox value changes
      */
     onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
     /**
@@ -1238,7 +1237,7 @@ type IconButtonProps = {
      */
     label: string;
     /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
+     * The Icon component to use, e.g. `<Icon type="favorite" />`
      */
     children: JSX.Element;
 } & (Omit<ButtonAsButtonProps, 'fullWidth' | 'leftIcon' | 'rightIcon'> | Omit<ButtonAsLinkProps, 'fullWidth' | 'leftIcon' | 'rightIcon'>);
@@ -1252,7 +1251,7 @@ declare const IconButton: react.ForwardRefExoticComponent<(Omit<{
      */
     label: string;
     /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
+     * The Icon component to use, e.g. `<Icon type="favorite" />`
      */
     children: JSX.Element;
 } & Omit<ButtonAsButtonProps, "leftIcon" | "fullWidth" | "rightIcon">, "ref"> | Omit<{
@@ -1261,7 +1260,7 @@ declare const IconButton: react.ForwardRefExoticComponent<(Omit<{
      */
     label: string;
     /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
+     * The Icon component to use, e.g. `<Icon type="favorite" />`
      */
     children: JSX.Element;
 } & Omit<ButtonAsLinkProps, "leftIcon" | "fullWidth" | "rightIcon">, "ref">) & react.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
@@ -2008,48 +2007,6 @@ declare const ScreenReaderOnly: {
     displayName: string;
 };
 
-type SegmentedControlProps = Omit<ToggleGroupSingleProps, 'type'> & {
-    /**
-     * `SegmentedControlItem`s that will be rendered in grouping
-     */
-    children?: ReactNode;
-    /**
-     * Force `SegmentedControl` to fill the width of it's container
-     */
-    fullWidth?: boolean | undefined;
-    /**
-     * Callback function invoked when the value changes
-     */
-    onSelectedValueChange: (value: string) => void;
-    /**
-     * The value of the `SegmentedControlItem` which should be selected
-     */
-    selectedValue: string;
-};
-/**
- * Provides a horizontal set of segments for switching between different values
- */
-declare const SegmentedControl: {
-    ({ children, fullWidth, selectedValue, onSelectedValueChange, ...props }: SegmentedControlProps): JSX.Element | null;
-    displayName: string;
-};
-
-type SegmentedControlItemProps = {
-    /**
-     * The [Icon](?path=/docs/components-icon--docs) component to use, e.g. `<Icon type="favorite" />`
-     */
-    icon?: JSX.Element;
-    /**
-     * The label of the item
-     */
-    label?: string | undefined;
-    /**
-     * The value of the item
-     */
-    value: string;
-};
-declare const SegmentedControlItem: ({ icon, label, value, }: SegmentedControlItemProps) => JSX.Element;
-
 type StackProps = {
     /**
      * Optional children
@@ -2206,4 +2163,4 @@ declare const WistiaLogo: {
     displayName: string;
 };
 
-export { ActionButton, type ActionButtonProps, Avatar, type AvatarInstanceType, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, 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, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };
+export { ActionButton, type ActionButtonProps, Avatar, type AvatarInstanceType, type AvatarProps, Badge, type BadgeProps, Box, type BoxProps, Breadcrumb, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonProps, Card, type CardProps, Checkbox, CheckboxGroup, CheckboxMenuItem, type ColorSchemeTypes, ColorSchemeWrapper, type ColorSchemeWrapperProps, Divider, 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, Stack, SubMenu, Tag, type TagProps, Text, type TextProps, Tooltip, type TooltipProps, UIProvider, WistiaLogo, colorSchemeOptions, copyToClipboard, ellipsisFlexParentStyle, ellipsisStyle, iconSizeMap, mq, useActiveMq, useAriaLive, useBoolean, useFormState, useKey, useMq, useToast, useWindowSize };

package/dist/index.mjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.4.6-beta.c8781aca.f327beb
+ * @license @wistia/ui v0.4.6
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -5929,7 +5929,7 @@ var StyledBadge = styled9.div`
   padding: var(--wui-space-01) var(--wui-space-02);
   width: fit-content;
 
-  /* Icon component size */
+  /* TODO should these be a token? */
   svg {
     height: 12px;
     width: 12px;
@@ -8352,117 +8352,12 @@ var Radio = forwardRef17(
 );
 Radio.displayName = "Radio";
 
-// src/components/SegmentedControl/SegmentedControl.tsx
-import styled38 from "styled-components";
-import { Root as ToggleGroupRoot } from "@radix-ui/react-toggle-group";
-import { isNil as isNil11 } from "@wistia/type-guards";
-import { jsx as jsx203 } from "react/jsx-runtime";
-var StyledSegmentedControl = styled38(ToggleGroupRoot)`
-  display: inline-flex;
-  background-color: var(--wui-color-bg-surface-secondary);
-  border-radius: var(--wui-border-radius-rounded);
-  border: 2px solid var(--wui-color-bg-surface-secondary);
-  gap: var(--wui-space-01);
-  width: ${({ $fullWidth }) => $fullWidth ? "100%" : "auto"};
-`;
-var SegmentedControl = ({
-  children,
-  fullWidth = false,
-  selectedValue,
-  onSelectedValueChange,
-  ...props
-}) => {
-  if (isNil11(children)) {
-    return null;
-  }
-  return /* @__PURE__ */ jsx203(
-    StyledSegmentedControl,
-    {
-      $fullWidth: fullWidth,
-      loop: true,
-      onValueChange: onSelectedValueChange,
-      rovingFocus: true,
-      type: "single",
-      value: selectedValue,
-      ...props,
-      children
-    }
-  );
-};
-SegmentedControl.displayName = "SegmentedControl";
-
-// src/components/SegmentedControl/SegmentedControlItem.tsx
-import styled39 from "styled-components";
-import { Item as ToggleGroupItem } from "@radix-ui/react-toggle-group";
-import { isNotNil as isNotNil16 } from "@wistia/type-guards";
-import { jsxs as jsxs22 } from "react/jsx-runtime";
-var StyledSegmentedControlItem = styled39(ToggleGroupItem)`
-  all: unset; /* ToggleGroupItem is a button element */
-  align-items: center;
-  border-radius: var(--wui-border-radius-rounded);
-  color: var(--wui-color-text-secondary);
-  cursor: pointer;
-  display: flex;
-  flex-grow: 1;
-  flex-shrink: 1;
-  font-size: var(--wui-typography-label-3-size);
-  justify-content: center;
-  padding: 6px 8px;
-  user-select: none;
-
-  /* Icon component */
-  svg {
-    height: 16px;
-    width: 16px;
-
-    /* add right margin if there's a label and an icon */
-    ${({ $hasLabel }) => $hasLabel ? "margin-right: var(--wui-space-01)" : ""}
-  }
-
-  &:hover {
-    background-color: var(--wui-color-bg-surface-secondary-hover);
-  }
-
-  &:focus-visible {
-    outline: 2px solid var(--wui-color-focus-ring);
-  }
-
-  &[data-state='on'] {
-    background-color: var(--wui-color-bg-fill-white);
-    color: var(--wui-color-text-selected);
-  }
-
-  &:focus-visible,
-  &[data-state='on'] {
-    svg path {
-      fill: var(--wui-color-focus-ring);
-    }
-  }
-`;
-var SegmentedControlItem = ({
-  icon,
-  label,
-  value
-}) => {
-  return /* @__PURE__ */ jsxs22(
-    StyledSegmentedControlItem,
-    {
-      $hasLabel: isNotNil16(label),
-      value,
-      children: [
-        icon,
-        label
-      ]
-    }
-  );
-};
-
 // src/components/Tag/Tag.tsx
 import { forwardRef as forwardRef18 } from "react";
-import styled40 from "styled-components";
-import { isNil as isNil12, isNotNil as isNotNil17, isNonEmptyString as isNonEmptyString4 } from "@wistia/type-guards";
-import { Fragment as Fragment3, jsx as jsx204, jsxs as jsxs23 } from "react/jsx-runtime";
-var TagLabel = styled40.a`
+import styled38 from "styled-components";
+import { isNil as isNil11, isNotNil as isNotNil16, isNonEmptyString as isNonEmptyString4 } from "@wistia/type-guards";
+import { Fragment as Fragment3, jsx as jsx203, jsxs as jsxs22 } from "react/jsx-runtime";
+var TagLabel = styled38.a`
   ${({ $colorScheme }) => getColorScheme($colorScheme)};
   font-size: var(--wui-typography-label-4-size);
   font-weight: var(--wui-typography-label-4-weight);
@@ -8490,14 +8385,14 @@ var TagLabel = styled40.a`
     box-shadow: inset 0 0 0 2px var(--wui-color-border-secondary);
   }
 `;
-var TagDivider = styled40.div`
+var TagDivider = styled38.div`
   ${({ $colorScheme }) => getColorScheme($colorScheme)};
   border-left: 1px solid var(--wui-color-border);
   display: flex;
   height: 14px;
   width: 1px;
 `;
-var StyledRemoveButton = styled40.button`
+var StyledRemoveButton = styled38.button`
   ${({ $colorScheme }) => getColorScheme($colorScheme)};
   all: unset;
   cursor: pointer;
@@ -8525,7 +8420,7 @@ var StyledRemoveButton = styled40.button`
     box-shadow: inset 0 0 0 2px var(--wui-color-border-secondary);
   }
 `;
-var StyledTag = styled40.div`
+var StyledTag = styled38.div`
   ${({ $colorScheme }) => getColorScheme($colorScheme)};
   align-items: center;
   background-color: var(--wui-color-bg-surface-secondary);
@@ -8534,31 +8429,31 @@ var StyledTag = styled40.div`
   overflow: hidden;
 `;
 var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
-  if (isNil12(onClickRemove)) {
+  if (isNil11(onClickRemove)) {
     return null;
   }
-  if (isNil12(onClickRemoveLabel)) {
+  if (isNil11(onClickRemoveLabel)) {
     throw new Error(
       "for accessibility, onClickRemoveLabel must be provided if onClickRemove is provided"
     );
   }
-  return /* @__PURE__ */ jsxs23(Fragment3, { children: [
-    /* @__PURE__ */ jsx204(TagDivider, { $colorScheme: colorScheme }),
-    /* @__PURE__ */ jsxs23(
+  return /* @__PURE__ */ jsxs22(Fragment3, { children: [
+    /* @__PURE__ */ jsx203(TagDivider, { $colorScheme: colorScheme }),
+    /* @__PURE__ */ jsxs22(
       StyledRemoveButton,
       {
         $colorScheme: colorScheme,
         onClick: onClickRemove,
         type: "button",
         children: [
-          /* @__PURE__ */ jsx204(
+          /* @__PURE__ */ jsx203(
             Icon,
             {
               size: "sm",
               type: "close"
             }
           ),
-          /* @__PURE__ */ jsx204(ScreenReaderOnly, { children: onClickRemoveLabel })
+          /* @__PURE__ */ jsx203(ScreenReaderOnly, { children: onClickRemoveLabel })
         ]
       }
     )
@@ -8566,15 +8461,15 @@ var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
 };
 var Tag = forwardRef18(
   ({ onClickRemove, colorScheme = "inherit", href, label, onClickRemoveLabel, ...otherProps }, ref) => {
-    const labelProps = isNotNil17(href) && isNonEmptyString4(href) ? { href, as: "a" } : { as: "span" };
-    return /* @__PURE__ */ jsxs23(
+    const labelProps = isNotNil16(href) && isNonEmptyString4(href) ? { href, as: "a" } : { as: "span" };
+    return /* @__PURE__ */ jsxs22(
       StyledTag,
       {
         ref,
         $colorScheme: colorScheme,
         ...otherProps,
         children: [
-          /* @__PURE__ */ jsx204(
+          /* @__PURE__ */ jsx203(
             TagLabel,
             {
               ...labelProps,
@@ -8582,7 +8477,7 @@ var Tag = forwardRef18(
               children: label
             }
           ),
-          /* @__PURE__ */ jsx204(
+          /* @__PURE__ */ jsx203(
             RemoveButton,
             {
               colorScheme,
@@ -8605,8 +8500,8 @@ import {
   Portal,
   Arrow
 } from "@radix-ui/react-tooltip";
-import styled41, { css as css22 } from "styled-components";
-import { jsx as jsx205, jsxs as jsxs24 } from "react/jsx-runtime";
+import styled39, { css as css22 } from "styled-components";
+import { jsx as jsx204, jsxs as jsxs23 } from "react/jsx-runtime";
 var CompactTooltipStyles = css22`
   --tooltip-font-size: var(--wui-typography-label-4-size);
   --tooltip-line-height: var(--wui-typography-label-4-line-height);
@@ -8614,7 +8509,7 @@ var CompactTooltipStyles = css22`
   --tooltip-horizontal-padding: var(--wui-space-02);
   --tooltip-vertical-padding: var(--wui-space-03);
 `;
-var StyledContent = styled41(Content)`
+var StyledContent = styled39(Content)`
   --tooltip-font-family: var(--wui-typography-family-default);
   --tooltip-border-radius: var(--wui-border-radius-05);
   --tooltip-bg: var(--wui-color-bg-tooltip);
@@ -8672,14 +8567,14 @@ var Tooltip = ({
   if (forceOpen === true) {
     rootProps.open = true;
   }
-  return /* @__PURE__ */ jsxs24(
+  return /* @__PURE__ */ jsxs23(
     Root,
     {
       delayDuration: delay,
       ...rootProps,
       children: [
-        /* @__PURE__ */ jsx205(Trigger, { asChild: true, children }),
-        /* @__PURE__ */ jsx205(Portal, { children: /* @__PURE__ */ jsxs24(
+        /* @__PURE__ */ jsx204(Trigger, { asChild: true, children }),
+        /* @__PURE__ */ jsx204(Portal, { children: /* @__PURE__ */ jsxs23(
           StyledContent,
           {
             $compact: compact,
@@ -8687,7 +8582,7 @@ var Tooltip = ({
             sideOffset: hideArrow ? VISUAL_OFFSET : VISUAL_OFFSET - 2,
             children: [
               content,
-              !hideArrow ? /* @__PURE__ */ jsx205(Arrow, { asChild: true, children: /* @__PURE__ */ jsx205(
+              !hideArrow ? /* @__PURE__ */ jsx204(Arrow, { asChild: true, children: /* @__PURE__ */ jsx204(
                 "svg",
                 {
                   fill: "var(--tooltip-bg)",
@@ -8696,7 +8591,7 @@ var Tooltip = ({
                   viewBox: "0 0 12 8",
                   width: "12",
                   xmlns: "http://www.w3.org/2000/svg",
-                  children: /* @__PURE__ */ jsx205("path", { d: "M6.8 6.93333C6.4 7.46667 5.6 7.46667 5.2 6.93333L-2.54292e-07 -1.04907e-06L12 0L6.8 6.93333Z" })
+                  children: /* @__PURE__ */ jsx204("path", { d: "M6.8 6.93333C6.4 7.46667 5.6 7.46667 5.2 6.93333L-2.54292e-07 -1.04907e-06L12 0L6.8 6.93333Z" })
                 }
               ) }) : null
             ]
@@ -8709,26 +8604,26 @@ var Tooltip = ({
 Tooltip.displayName = "Tooltip";
 
 // src/components/WistiaLogo/WistiaLogo.tsx
-import styled42 from "styled-components";
-import { isNotNil as isNotNil18 } from "@wistia/type-guards";
-import { jsx as jsx206, jsxs as jsxs25 } from "react/jsx-runtime";
+import styled40 from "styled-components";
+import { isNotNil as isNotNil17 } from "@wistia/type-guards";
+import { jsx as jsx205, jsxs as jsxs24 } from "react/jsx-runtime";
 var renderBrandmark = (brandmarkColor, iconOnly) => {
   if (iconOnly) {
-    return /* @__PURE__ */ jsx206(
+    return /* @__PURE__ */ jsx205(
       "g",
       {
         "data-testid": "ui-wistia-logo-brandmark",
         fill: brandmarkColor,
-        children: /* @__PURE__ */ jsx206("path", { d: "M16.09 17.1h-5.2c-1.58 0-3.08.68-4.11 1.87L.21 26.53c4.78.25 9.78.25 13.3.25 18.31 0 20.89-11.27 20.89-16.55-1.59 1.93-6.06 6.87-18.32 6.87ZM32.14 0c-.08.92-.59 4.69-11.31 4.69-8.72 0-12.24 0-20.83-.17l6.44 7.4a6.657 6.657 0 0 0 4.96 2.3c2.13.03 5.05.06 5.53.06 11.01 0 17.19-5.05 17.19-9.89 0-2.01-.67-3.44-1.97-4.4Z" })
+        children: /* @__PURE__ */ jsx205("path", { d: "M16.09 17.1h-5.2c-1.58 0-3.08.68-4.11 1.87L.21 26.53c4.78.25 9.78.25 13.3.25 18.31 0 20.89-11.27 20.89-16.55-1.59 1.93-6.06 6.87-18.32 6.87ZM32.14 0c-.08.92-.59 4.69-11.31 4.69-8.72 0-12.24 0-20.83-.17l6.44 7.4a6.657 6.657 0 0 0 4.96 2.3c2.13.03 5.05.06 5.53.06 11.01 0 17.19-5.05 17.19-9.89 0-2.01-.67-3.44-1.97-4.4Z" })
       }
     );
   }
-  return /* @__PURE__ */ jsx206(
+  return /* @__PURE__ */ jsx205(
     "g",
     {
       "data-testid": "ui-wistia-logo-brandmark",
       fill: brandmarkColor,
-      children: /* @__PURE__ */ jsx206("path", { d: "M16.09 21.37h-5.2c-1.58 0-3.08.68-4.11 1.87L.21 30.8c4.78.25 9.78.25 13.3.25 18.31 0 20.89-11.27 20.89-16.55-1.59 1.93-6.06 6.87-18.32 6.87Zm16.05-17.1c-.08.92-.59 4.69-11.31 4.69-8.72 0-12.24 0-20.83-.17l6.44 7.4a6.657 6.657 0 0 0 4.96 2.3c2.13.03 5.05.06 5.53.06 11.01 0 17.19-5.05 17.19-9.89 0-2.01-.67-3.44-1.97-4.4Z" })
+      children: /* @__PURE__ */ jsx205("path", { d: "M16.09 21.37h-5.2c-1.58 0-3.08.68-4.11 1.87L.21 30.8c4.78.25 9.78.25 13.3.25 18.31 0 20.89-11.27 20.89-16.55-1.59 1.93-6.06 6.87-18.32 6.87Zm16.05-17.1c-.08.92-.59 4.69-11.31 4.69-8.72 0-12.24 0-20.83-.17l6.44 7.4a6.657 6.657 0 0 0 4.96 2.3c2.13.03 5.05.06 5.53.06 11.01 0 17.19-5.05 17.19-9.89 0-2.01-.67-3.44-1.97-4.4Z" })
     }
   );
 };
@@ -8736,12 +8631,12 @@ var renderLogotype = (logotypeColor, iconOnly) => {
   if (iconOnly) {
     return null;
   }
-  return /* @__PURE__ */ jsx206(
+  return /* @__PURE__ */ jsx205(
     "g",
     {
       "data-testid": "ui-wistia-logo-logotype",
       fill: logotypeColor,
-      children: /* @__PURE__ */ jsx206("path", { d: "M70.16 8.66v15.18c0 1.68-.35 3.09-1.05 4.23a6.612 6.612 0 0 1-2.85 2.54c-1.19.55-2.52.82-4.01.82s-2.8-.28-4.01-.85a6.655 6.655 0 0 1-3.11-2.96c-.08.15-.16.29-.24.42a6.552 6.552 0 0 1-2.87 2.54c-1.2.56-2.54.85-4.01.85s-2.8-.27-3.94-.82a6.214 6.214 0 0 1-2.71-2.52c-.67-1.14-1.01-2.56-1.02-4.25l-.22-15.18h7.34V22.3c0 .82.19 1.37.56 1.67.39.28.85.42 1.38.42s1.02-.15 1.45-.45c.43-.3.65-.85.65-1.65V8.65h7.3v13.64c0 .8.22 1.35.65 1.65.43.3.91.45 1.45.45s.99-.14 1.36-.42c.39-.3.58-.85.58-1.67V8.66h7.34Zm2.45 0v22.26h7.34V8.66h-7.34Zm5.67-1.87c.61-.3 1.08-.71 1.42-1.25.36-.55.53-1.19.53-1.94s-.18-1.34-.53-1.89A3.43 3.43 0 0 0 78.28.44c-.59-.3-1.25-.45-1.98-.45s-1.42.15-2.02.45c-.59.3-1.07.72-1.42 1.27-.36.55-.53 1.18-.53 1.89 0 1.1.38 1.97 1.13 2.63.76.65 1.71.98 2.85.98.73 0 1.39-.14 1.98-.42Zm8.86 1.96c-1.42.4-2.6 1.11-3.54 2.14-.93 1.02-1.4 2.4-1.4 4.12 0 1.11.17 2.09.51 2.94.36.85.82 1.62 1.38 2.34.22.28.55.65.98 1.11.37.4.64.72.8.96.18.24.27.47.27.69 0 .5-.4.87-1.2 1.09-.8.21-1.62.31-2.47.31-.1-.01-.22-.02-.33-.02l1.02 6.94c.42.07.92.11 1.51.11 1.9 0 3.6-.28 5.1-.85 1.5-.56 2.68-1.42 3.54-2.56.88-1.14 1.31-2.55 1.31-4.23 0-.68-.07-1.31-.22-1.87-.13-.58-.32-1.09-.56-1.54a6.64 6.64 0 0 0-.8-1.27c-.3-.37-.74-.82-1.34-1.36-.39-.33-.67-.59-.85-.8-.18-.22-.27-.45-.27-.67 0-.46.26-.79.78-.98.53-.19 1.17-.29 1.91-.29.25 0 .51.01.78.04l-.71-6.88a10.4 10.4 0 0 0-1.56-.11c-1.66 0-3.21.21-4.65.62Zm19.54 15.71c-.99 0-1.71-.23-2.14-.69-.42-.47-.62-1.18-.62-2.11v-6.57h4.21V8.66h-4.21V3.38l-7.34 1.85V24.1c0 2.45.47 4.29 1.4 5.52.95 1.22 2.45 1.83 4.49 1.83.95 0 1.86-.07 2.74-.22.88-.13 1.62-.34 2.25-.62l1.38-6.3c-.55.1-1.27.16-2.16.16Zm4.13-15.8v22.26h7.34V8.66h-7.34Zm5.67-1.87c.61-.3 1.08-.71 1.42-1.25.36-.55.53-1.19.53-1.94s-.18-1.34-.53-1.89a3.43 3.43 0 0 0-1.42-1.27c-.59-.3-1.25-.45-1.98-.45s-1.42.15-2.02.45c-.59.3-1.07.72-1.42 1.27-.36.55-.53 1.18-.53 1.89 0 1.1.38 1.97 1.14 2.63.76.65 1.71.98 2.85.98.73 0 1.39-.14 1.98-.42Zm27.51 1.87v22.26h-7.34v-2.28c-.41.43-.85.83-1.34 1.19-1.44 1.07-3.12 1.6-5.05 1.6s-3.61-.52-5.1-1.56c-1.48-1.05-2.63-2.47-3.45-4.25-.82-1.78-1.22-3.73-1.22-5.85s.41-4.07 1.22-5.83c.82-1.78 1.97-3.19 3.45-4.23 1.48-1.05 3.18-1.58 5.1-1.58s3.61.53 5.05 1.6c.48.36.93.75 1.34 1.19V8.66h7.34Zm-7.1 11.11c0-.8-.19-1.53-.56-2.18-.37-.67-.88-1.19-1.54-1.58-.64-.39-1.34-.58-2.09-.58s-1.45.19-2.09.58c-.64.39-1.15.91-1.54 1.58-.37.67-.56 1.39-.56 2.18s.19 1.51.56 2.18c.39.67.9 1.19 1.54 1.58.64.39 1.34.58 2.09.58s1.45-.19 2.09-.58c.65-.39 1.16-.91 1.54-1.56.37-.67.56-1.4.56-2.2Z" })
+      children: /* @__PURE__ */ jsx205("path", { d: "M70.16 8.66v15.18c0 1.68-.35 3.09-1.05 4.23a6.612 6.612 0 0 1-2.85 2.54c-1.19.55-2.52.82-4.01.82s-2.8-.28-4.01-.85a6.655 6.655 0 0 1-3.11-2.96c-.08.15-.16.29-.24.42a6.552 6.552 0 0 1-2.87 2.54c-1.2.56-2.54.85-4.01.85s-2.8-.27-3.94-.82a6.214 6.214 0 0 1-2.71-2.52c-.67-1.14-1.01-2.56-1.02-4.25l-.22-15.18h7.34V22.3c0 .82.19 1.37.56 1.67.39.28.85.42 1.38.42s1.02-.15 1.45-.45c.43-.3.65-.85.65-1.65V8.65h7.3v13.64c0 .8.22 1.35.65 1.65.43.3.91.45 1.45.45s.99-.14 1.36-.42c.39-.3.58-.85.58-1.67V8.66h7.34Zm2.45 0v22.26h7.34V8.66h-7.34Zm5.67-1.87c.61-.3 1.08-.71 1.42-1.25.36-.55.53-1.19.53-1.94s-.18-1.34-.53-1.89A3.43 3.43 0 0 0 78.28.44c-.59-.3-1.25-.45-1.98-.45s-1.42.15-2.02.45c-.59.3-1.07.72-1.42 1.27-.36.55-.53 1.18-.53 1.89 0 1.1.38 1.97 1.13 2.63.76.65 1.71.98 2.85.98.73 0 1.39-.14 1.98-.42Zm8.86 1.96c-1.42.4-2.6 1.11-3.54 2.14-.93 1.02-1.4 2.4-1.4 4.12 0 1.11.17 2.09.51 2.94.36.85.82 1.62 1.38 2.34.22.28.55.65.98 1.11.37.4.64.72.8.96.18.24.27.47.27.69 0 .5-.4.87-1.2 1.09-.8.21-1.62.31-2.47.31-.1-.01-.22-.02-.33-.02l1.02 6.94c.42.07.92.11 1.51.11 1.9 0 3.6-.28 5.1-.85 1.5-.56 2.68-1.42 3.54-2.56.88-1.14 1.31-2.55 1.31-4.23 0-.68-.07-1.31-.22-1.87-.13-.58-.32-1.09-.56-1.54a6.64 6.64 0 0 0-.8-1.27c-.3-.37-.74-.82-1.34-1.36-.39-.33-.67-.59-.85-.8-.18-.22-.27-.45-.27-.67 0-.46.26-.79.78-.98.53-.19 1.17-.29 1.91-.29.25 0 .51.01.78.04l-.71-6.88a10.4 10.4 0 0 0-1.56-.11c-1.66 0-3.21.21-4.65.62Zm19.54 15.71c-.99 0-1.71-.23-2.14-.69-.42-.47-.62-1.18-.62-2.11v-6.57h4.21V8.66h-4.21V3.38l-7.34 1.85V24.1c0 2.45.47 4.29 1.4 5.52.95 1.22 2.45 1.83 4.49 1.83.95 0 1.86-.07 2.74-.22.88-.13 1.62-.34 2.25-.62l1.38-6.3c-.55.1-1.27.16-2.16.16Zm4.13-15.8v22.26h7.34V8.66h-7.34Zm5.67-1.87c.61-.3 1.08-.71 1.42-1.25.36-.55.53-1.19.53-1.94s-.18-1.34-.53-1.89a3.43 3.43 0 0 0-1.42-1.27c-.59-.3-1.25-.45-1.98-.45s-1.42.15-2.02.45c-.59.3-1.07.72-1.42 1.27-.36.55-.53 1.18-.53 1.89 0 1.1.38 1.97 1.14 2.63.76.65 1.71.98 2.85.98.73 0 1.39-.14 1.98-.42Zm27.51 1.87v22.26h-7.34v-2.28c-.41.43-.85.83-1.34 1.19-1.44 1.07-3.12 1.6-5.05 1.6s-3.61-.52-5.1-1.56c-1.48-1.05-2.63-2.47-3.45-4.25-.82-1.78-1.22-3.73-1.22-5.85s.41-4.07 1.22-5.83c.82-1.78 1.97-3.19 3.45-4.23 1.48-1.05 3.18-1.58 5.1-1.58s3.61.53 5.05 1.6c.48.36.93.75 1.34 1.19V8.66h7.34Zm-7.1 11.11c0-.8-.19-1.53-.56-2.18-.37-.67-.88-1.19-1.54-1.58-.64-.39-1.34-.58-2.09-.58s-1.45.19-2.09.58c-.64.39-1.15.91-1.54 1.58-.37.67-.56 1.39-.56 2.18s.19 1.51.56 2.18c.39.67.9 1.19 1.54 1.58.64.39 1.34.58 2.09.58s1.45-.19 2.09-.58c.65-.39 1.16-.91 1.54-1.56.37-.67.56-1.4.56-2.2Z" })
     }
   );
 };
@@ -8751,7 +8646,7 @@ var computedViewBox = (iconOnly) => {
   }
   return "0 0 144 31.47";
 };
-var WistiaLogoComponent = styled42.svg`
+var WistiaLogoComponent = styled40.svg`
   height: ${({ height }) => `${height}px`};
 
   /* ensure it will always fit on mobile */
@@ -8793,7 +8688,7 @@ var WistiaLogo = ({
   };
   const brandmarkColor = VARIANT_COLORS[variant].brandmark;
   const logotypeColor = VARIANT_COLORS[variant].logotype;
-  const Logo = /* @__PURE__ */ jsxs25(
+  const Logo = /* @__PURE__ */ jsxs24(
     WistiaLogoComponent,
     {
       $hoverColor: hoverColor,
@@ -8803,14 +8698,14 @@ var WistiaLogo = ({
       xmlns: "http://www.w3.org/2000/svg",
       ...otherProps,
       children: [
-        /* @__PURE__ */ jsx206("title", { children: title }),
-        isNotNil18(description) ? /* @__PURE__ */ jsx206("desc", { children: description }) : null,
+        /* @__PURE__ */ jsx205("title", { children: title }),
+        isNotNil17(description) ? /* @__PURE__ */ jsx205("desc", { children: description }) : null,
         renderBrandmark(brandmarkColor, iconOnly),
         renderLogotype(logotypeColor, iconOnly)
       ]
     }
   );
-  return href !== void 0 ? /* @__PURE__ */ jsx206("a", { href, children: Logo }) : Logo;
+  return href !== void 0 ? /* @__PURE__ */ jsx205("a", { href, children: Logo }) : Logo;
 };
 WistiaLogo.displayName = "WistiaLogo";
 export {
@@ -8850,8 +8745,6 @@ export {
   RadioGroup,
   RadioMenuItem,
   ScreenReaderOnly,
-  SegmentedControl,
-  SegmentedControlItem,
   Stack,
   SubMenu,
   Tag,