@wistia/ui 0.0.12 → 0.0.14

package/dist/index.mjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.0.12
+ * @license @wistia/ui v0.0.14
  *
  * Copyright (c) 2024-2024, Wistia, Inc. and its affiliates.
  *
@@ -1471,6 +1471,7 @@ var defaultScheme = css9`
   --color-bg-fill-hover: var(--blue-10);
   --color-bg-fill-active: var(--blue-12);
   --color-text: var(--gray-12);
+  --color-text-high-contrast: var(--gray-12);
   --color-text-link: var(--blue-9);
   --color-text-secondary: var(--gray-11);
   --color-text-on-fill: var(--gray-contrast);
@@ -4721,15 +4722,33 @@ var ThumbsUpIcon = (props) => /* @__PURE__ */ jsx143(
   }
 );
 
-// src/components/Icon/icons/TransitionsIcon.tsx
+// src/components/Icon/icons/TranscriptIcon.tsx
 import { jsx as jsx144 } from "react/jsx-runtime";
-var TransitionsIcon = (props) => /* @__PURE__ */ jsx144(
+var TranscriptIcon = (props) => /* @__PURE__ */ jsx144(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
     children: /* @__PURE__ */ jsx144(
+      "path",
+      {
+        d: "M19.4132 7.98019L14.9401 3.57694C14.5618 3.20457 14.0601 2.99982 13.5264 2.99982H7.14237C5.40865 2.99982 3.99951 4.38694 3.99951 6.09357V17.9061C3.99951 19.6127 5.40865 20.9998 7.14237 20.9998H16.8567C18.5904 20.9998 19.9995 19.6127 19.9995 17.9061V9.37182C19.9995 8.84644 19.7915 8.35144 19.4132 7.98019ZM8.28523 8.62482H10.5709C11.0441 8.62482 11.4281 9.00282 11.4281 9.46857C11.4281 9.93432 11.0441 10.3123 10.5709 10.3123H8.28523C7.81208 10.3123 7.42808 9.93432 7.42808 9.46857C7.42808 9.00282 7.81208 8.62482 8.28523 8.62482ZM15.7138 17.0623H8.28523C7.81208 17.0623 7.42808 16.6843 7.42808 16.2186C7.42808 15.7528 7.81208 15.3748 8.28523 15.3748H15.7138C16.1869 15.3748 16.5709 15.7528 16.5709 16.2186C16.5709 16.6843 16.1869 17.0623 15.7138 17.0623ZM15.7138 13.6873H8.28523C7.81208 13.6873 7.42808 13.3093 7.42808 12.8436C7.42808 12.3778 7.81208 11.9998 8.28523 11.9998H15.7138C16.1869 11.9998 16.5709 12.3778 16.5709 12.8436C16.5709 13.3093 16.1869 13.6873 15.7138 13.6873ZM18.2075 9.18732H14.8567C14.2281 9.18732 13.7138 8.68107 13.7138 8.06232V4.77619L13.7287 4.77057L18.2109 9.18169L18.2075 9.18732Z",
+        fill: "currentColor"
+      }
+    )
+  }
+);
+
+// src/components/Icon/icons/TransitionsIcon.tsx
+import { jsx as jsx145 } from "react/jsx-runtime";
+var TransitionsIcon = (props) => /* @__PURE__ */ jsx145(
+  "svg",
+  {
+    ...props,
+    viewBox: "0 0 24 24",
+    xmlns: "http://www.w3.org/2000/svg",
+    children: /* @__PURE__ */ jsx145(
       "path",
       {
         clipRule: "evenodd",
@@ -4742,14 +4761,14 @@ var TransitionsIcon = (props) => /* @__PURE__ */ jsx144(
 );
 
 // src/components/Icon/icons/TrimIcon.tsx
-import { jsx as jsx145 } from "react/jsx-runtime";
-var TrimIcon = (props) => /* @__PURE__ */ jsx145(
+import { jsx as jsx146 } from "react/jsx-runtime";
+var TrimIcon = (props) => /* @__PURE__ */ jsx146(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx145(
+    children: /* @__PURE__ */ jsx146(
       "path",
       {
         clipRule: "evenodd",
@@ -4762,14 +4781,14 @@ var TrimIcon = (props) => /* @__PURE__ */ jsx145(
 );
 
 // src/components/Icon/icons/TurnstileIcon.tsx
-import { jsx as jsx146 } from "react/jsx-runtime";
-var TurnstileIcon = (props) => /* @__PURE__ */ jsx146(
+import { jsx as jsx147 } from "react/jsx-runtime";
+var TurnstileIcon = (props) => /* @__PURE__ */ jsx147(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx146(
+    children: /* @__PURE__ */ jsx147(
       "path",
       {
         clipRule: "evenodd",
@@ -4782,14 +4801,14 @@ var TurnstileIcon = (props) => /* @__PURE__ */ jsx146(
 );
 
 // src/components/Icon/icons/UndoIcon.tsx
-import { jsx as jsx147 } from "react/jsx-runtime";
-var UndoIcon = (props) => /* @__PURE__ */ jsx147(
+import { jsx as jsx148 } from "react/jsx-runtime";
+var UndoIcon = (props) => /* @__PURE__ */ jsx148(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx147(
+    children: /* @__PURE__ */ jsx148(
       "path",
       {
         clipRule: "evenodd",
@@ -4802,14 +4821,14 @@ var UndoIcon = (props) => /* @__PURE__ */ jsx147(
 );
 
 // src/components/Icon/icons/UnlockIcon.tsx
-import { jsx as jsx148 } from "react/jsx-runtime";
-var UnlockIcon = (props) => /* @__PURE__ */ jsx148(
+import { jsx as jsx149 } from "react/jsx-runtime";
+var UnlockIcon = (props) => /* @__PURE__ */ jsx149(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx148(
+    children: /* @__PURE__ */ jsx149(
       "path",
       {
         clipRule: "evenodd",
@@ -4822,14 +4841,14 @@ var UnlockIcon = (props) => /* @__PURE__ */ jsx148(
 );
 
 // src/components/Icon/icons/UploadIcon.tsx
-import { jsx as jsx149 } from "react/jsx-runtime";
-var UploadIcon = (props) => /* @__PURE__ */ jsx149(
+import { jsx as jsx150 } from "react/jsx-runtime";
+var UploadIcon = (props) => /* @__PURE__ */ jsx150(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx149(
+    children: /* @__PURE__ */ jsx150(
       "path",
       {
         clipRule: "evenodd",
@@ -4842,14 +4861,14 @@ var UploadIcon = (props) => /* @__PURE__ */ jsx149(
 );
 
 // src/components/Icon/icons/UsersPermissionsIcon.tsx
-import { jsx as jsx150 } from "react/jsx-runtime";
-var UsersPermissionsIcon = (props) => /* @__PURE__ */ jsx150(
+import { jsx as jsx151 } from "react/jsx-runtime";
+var UsersPermissionsIcon = (props) => /* @__PURE__ */ jsx151(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx150(
+    children: /* @__PURE__ */ jsx151(
       "path",
       {
         clipRule: "evenodd",
@@ -4862,14 +4881,14 @@ var UsersPermissionsIcon = (props) => /* @__PURE__ */ jsx150(
 );
 
 // src/components/Icon/icons/ViewStreamIcon.tsx
-import { jsx as jsx151 } from "react/jsx-runtime";
-var ViewStreamIcon = (props) => /* @__PURE__ */ jsx151(
+import { jsx as jsx152 } from "react/jsx-runtime";
+var ViewStreamIcon = (props) => /* @__PURE__ */ jsx152(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx151(
+    children: /* @__PURE__ */ jsx152(
       "path",
       {
         clipRule: "evenodd",
@@ -4882,14 +4901,14 @@ var ViewStreamIcon = (props) => /* @__PURE__ */ jsx151(
 );
 
 // src/components/Icon/icons/VolumeIcon.tsx
-import { jsx as jsx152 } from "react/jsx-runtime";
-var VolumeIcon = (props) => /* @__PURE__ */ jsx152(
+import { jsx as jsx153 } from "react/jsx-runtime";
+var VolumeIcon = (props) => /* @__PURE__ */ jsx153(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx152(
+    children: /* @__PURE__ */ jsx153(
       "path",
       {
         d: "M19.133 2.08909C18.5996 1.79709 17.9476 1.81843 17.4356 2.14776L10.3756 6.66643H5.66763C4.01297 6.66643 2.66763 8.01176 2.66763 9.66643V14.3331C2.66763 15.9878 4.01297 17.3331 5.66763 17.3331H10.3756L17.4356 21.8518C17.709 22.0264 18.021 22.1158 18.3356 22.1158C18.6103 22.1158 18.885 22.0478 19.1343 21.9118C19.669 21.6198 20.001 21.0584 20.001 20.4491V3.55176C20.001 2.94243 19.6676 2.38243 19.133 2.08909Z",
@@ -4900,14 +4919,14 @@ var VolumeIcon = (props) => /* @__PURE__ */ jsx152(
 );
 
 // src/components/Icon/icons/VolumeOffIcon.tsx
-import { jsx as jsx153 } from "react/jsx-runtime";
-var VolumeOffIcon = (props) => /* @__PURE__ */ jsx153(
+import { jsx as jsx154 } from "react/jsx-runtime";
+var VolumeOffIcon = (props) => /* @__PURE__ */ jsx154(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx153(
+    children: /* @__PURE__ */ jsx154(
       "path",
       {
         clipRule: "evenodd",
@@ -4920,14 +4939,14 @@ var VolumeOffIcon = (props) => /* @__PURE__ */ jsx153(
 );
 
 // src/components/Icon/icons/VolumeUpIcon.tsx
-import { jsx as jsx154 } from "react/jsx-runtime";
-var VolumeUpIcon = (props) => /* @__PURE__ */ jsx154(
+import { jsx as jsx155 } from "react/jsx-runtime";
+var VolumeUpIcon = (props) => /* @__PURE__ */ jsx155(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx154(
+    children: /* @__PURE__ */ jsx155(
       "path",
       {
         clipRule: "evenodd",
@@ -4940,14 +4959,14 @@ var VolumeUpIcon = (props) => /* @__PURE__ */ jsx154(
 );
 
 // src/components/Icon/icons/VolumeXIcon.tsx
-import { jsx as jsx155 } from "react/jsx-runtime";
-var VolumeXIcon = (props) => /* @__PURE__ */ jsx155(
+import { jsx as jsx156 } from "react/jsx-runtime";
+var VolumeXIcon = (props) => /* @__PURE__ */ jsx156(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx155(
+    children: /* @__PURE__ */ jsx156(
       "path",
       {
         clipRule: "evenodd",
@@ -4960,14 +4979,14 @@ var VolumeXIcon = (props) => /* @__PURE__ */ jsx155(
 );
 
 // src/components/Icon/icons/WandIcon.tsx
-import { jsx as jsx156 } from "react/jsx-runtime";
-var WandIcon = (props) => /* @__PURE__ */ jsx156(
+import { jsx as jsx157 } from "react/jsx-runtime";
+var WandIcon = (props) => /* @__PURE__ */ jsx157(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx156(
+    children: /* @__PURE__ */ jsx157(
       "path",
       {
         clipRule: "evenodd",
@@ -4980,14 +4999,14 @@ var WandIcon = (props) => /* @__PURE__ */ jsx156(
 );
 
 // src/components/Icon/icons/ZoomInIcon.tsx
-import { jsx as jsx157 } from "react/jsx-runtime";
-var ZoomInIcon = (props) => /* @__PURE__ */ jsx157(
+import { jsx as jsx158 } from "react/jsx-runtime";
+var ZoomInIcon = (props) => /* @__PURE__ */ jsx158(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx157(
+    children: /* @__PURE__ */ jsx158(
       "path",
       {
         clipRule: "evenodd",
@@ -5000,14 +5019,14 @@ var ZoomInIcon = (props) => /* @__PURE__ */ jsx157(
 );
 
 // src/components/Icon/icons/ZoomOutIcon.tsx
-import { jsx as jsx158 } from "react/jsx-runtime";
-var ZoomOutIcon = (props) => /* @__PURE__ */ jsx158(
+import { jsx as jsx159 } from "react/jsx-runtime";
+var ZoomOutIcon = (props) => /* @__PURE__ */ jsx159(
   "svg",
   {
     ...props,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx158(
+    children: /* @__PURE__ */ jsx159(
       "path",
       {
         clipRule: "evenodd",
@@ -5159,6 +5178,7 @@ var iconMap = {
   "thumbs-down": ThumbsDownIcon,
   "thumbs-up": ThumbsUpIcon,
   transitions: TransitionsIcon,
+  transcript: TranscriptIcon,
   trim: TrimIcon,
   turnstile: TurnstileIcon,
   undo: UndoIcon,
@@ -5193,7 +5213,7 @@ var useResponsiveProp = (values) => {
 };
 
 // src/components/Icon/Icon.tsx
-import { jsx as jsx159 } from "react/jsx-runtime";
+import { jsx as jsx160 } from "react/jsx-runtime";
 var iconSizeMap = {
   sm: "12",
   md: "16",
@@ -5230,7 +5250,7 @@ var Icon = ({
     ...style
   };
   const iconColor = invertColor ? "var(--color-icon-on-fill)" : "var(--color-icon)";
-  return /* @__PURE__ */ jsx159(
+  return /* @__PURE__ */ jsx160(
     StyledIcon,
     {
       $colorScheme: colorScheme,
@@ -5254,7 +5274,7 @@ import { forwardRef as forwardRef2 } from "react";
 import { isNil as isNil7, isNotNil as isNotNil3, isNotUndefined as isNotUndefined2, isUndefined as isUndefined2 } from "@wistia/type-guards";
 import styled6 from "styled-components";
 import { Link as RouterLink, useInRouterContext } from "react-router-dom";
-import { jsx as jsx160 } from "react/jsx-runtime";
+import { jsx as jsx161 } from "react/jsx-runtime";
 var generateHref = (href, type, disabled) => {
   if (disabled || isNil7(href)) {
     return void 0;
@@ -5316,7 +5336,7 @@ var Link = forwardRef2(
       onClick: handleClick
     };
     if (isButton(props)) {
-      return /* @__PURE__ */ jsx160(
+      return /* @__PURE__ */ jsx161(
         StyledLink,
         {
           ref,
@@ -5336,7 +5356,7 @@ var Link = forwardRef2(
         ...commonProps,
         ...externalLinkProps
       };
-      return inRouterContext && type !== "external" ? /* @__PURE__ */ jsx160(
+      return inRouterContext && type !== "external" ? /* @__PURE__ */ jsx161(
         StyledLink,
         {
           as: RouterLink,
@@ -5344,7 +5364,7 @@ var Link = forwardRef2(
           to: to ?? "",
           children
         }
-      ) : /* @__PURE__ */ jsx160(
+      ) : /* @__PURE__ */ jsx161(
         StyledLink,
         {
           as: "a",
@@ -5360,7 +5380,7 @@ var Link = forwardRef2(
 Link.displayName = "Link";
 
 // src/components/Button/Button.tsx
-import { Fragment, jsx as jsx161, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx162, jsxs as jsxs5 } from "react/jsx-runtime";
 var isLink2 = (props) => isNotUndefined3(props.href);
 var StyledButton = styled7.button`
   ${buttonResetCss}
@@ -5398,7 +5418,7 @@ var ButtonContent = ({
   children
 }) => {
   return /* @__PURE__ */ jsxs5(Fragment, { children: [
-    isLoading ? /* @__PURE__ */ jsx161(StyledButtonLoading, { children: /* @__PURE__ */ jsx161(Icon, { type: "spinner" }) }) : null,
+    isLoading ? /* @__PURE__ */ jsx162(StyledButtonLoading, { children: /* @__PURE__ */ jsx162(Icon, { type: "spinner" }) }) : null,
     /* @__PURE__ */ jsxs5(
       StyledButtonContent,
       {
@@ -5407,7 +5427,7 @@ var ButtonContent = ({
         $isLoading: isLoading,
         children: [
           leftIcon ?? null,
-          /* @__PURE__ */ jsx161(StyledButtonContentLabel, { children }),
+          /* @__PURE__ */ jsx162(StyledButtonContentLabel, { children }),
           rightIcon ?? null
         ]
       }
@@ -5449,14 +5469,14 @@ var Button = forwardRef3(
       commonProps.className = `${className ?? ""} force-state-${forceState}`;
     }
     if (isLink2(props)) {
-      return /* @__PURE__ */ jsx161(
+      return /* @__PURE__ */ jsx162(
         StyledButton,
         {
           ref,
           as: Link,
           ...props,
           ...commonProps,
-          children: /* @__PURE__ */ jsx161(
+          children: /* @__PURE__ */ jsx162(
             ButtonContent,
             {
               isLoading,
@@ -5477,7 +5497,7 @@ var Button = forwardRef3(
         onClick(event);
       }
     };
-    return /* @__PURE__ */ jsx161(
+    return /* @__PURE__ */ jsx162(
       StyledButton,
       {
         ref,
@@ -5485,7 +5505,7 @@ var Button = forwardRef3(
         type: "button",
         ...props,
         ...commonProps,
-        children: /* @__PURE__ */ jsx161(
+        children: /* @__PURE__ */ jsx162(
           ButtonContent,
           {
             isLoading,
@@ -5503,7 +5523,7 @@ Button.displayName = "Button";
 // src/components/ButtonGroup/ButtonGroup.tsx
 import styled8 from "styled-components";
 import { isNil as isNil8 } from "@wistia/type-guards";
-import { jsx as jsx162 } from "react/jsx-runtime";
+import { jsx as jsx163 } from "react/jsx-runtime";
 var getAlignment = (align) => {
   if (align === "center") {
     return "center";
@@ -5545,7 +5565,7 @@ var ButtonGroup = ({
   if (isNil8(children)) {
     return null;
   }
-  return /* @__PURE__ */ jsx162(
+  return /* @__PURE__ */ jsx163(
     ButtonGroupComponent,
     {
       $align: align,
@@ -5559,7 +5579,7 @@ ButtonGroup.displayName = "ButtonGroup";
 
 // src/components/Divider/Divider.tsx
 import styled9 from "styled-components";
-import { jsx as jsx163 } from "react/jsx-runtime";
+import { jsx as jsx164 } from "react/jsx-runtime";
 var sizeToPixelMap = {
   lg: 4,
   sm: 1
@@ -5579,7 +5599,7 @@ var DividerComponent = styled9.hr`
 `;
 var Divider = ({ size = "sm", ...otherProps }) => {
   const responsiveSize = useResponsiveProp(size);
-  return /* @__PURE__ */ jsx163(
+  return /* @__PURE__ */ jsx164(
     DividerComponent,
     {
       $borderHeight: sizeToPixelMap[responsiveSize],
@@ -5592,7 +5612,7 @@ Divider.displayName = "Divider";
 // src/components/Ellipsis/Ellipsis.tsx
 import { isNotNil as isNotNil5 } from "@wistia/type-guards";
 import styled10, { css as css12 } from "styled-components";
-import { jsx as jsx164 } from "react/jsx-runtime";
+import { jsx as jsx165 } from "react/jsx-runtime";
 var ellipsisStyle = css12`
   overflow: hidden;
   text-overflow: ellipsis;
@@ -5633,7 +5653,7 @@ var EllipsisComponent = styled10.div`
   return void 0;
 }}
 `;
-var Ellipsis = ({ children, lines, ...otherProps }) => /* @__PURE__ */ jsx164(
+var Ellipsis = ({ children, lines, ...otherProps }) => /* @__PURE__ */ jsx165(
   EllipsisComponent,
   {
     $lines: lines,
@@ -5653,7 +5673,7 @@ var makePolymorphic = (component) => {
 };
 
 // src/components/Heading/Heading.tsx
-import { jsx as jsx165 } from "react/jsx-runtime";
+import { jsx as jsx166 } from "react/jsx-runtime";
 var heroStyle = css13`
   --font-family: var(--typography-heading-hero-family);
   --font-size: var(--typography-heading-hero-size);
@@ -5749,7 +5769,7 @@ var HeadingComponent = forwardRef4(
     variant = "heading1",
     renderAs,
     ...otherProps
-  }, ref) => /* @__PURE__ */ jsx165(
+  }, ref) => /* @__PURE__ */ jsx166(
     StyledHeading,
     {
       ref,
@@ -5781,7 +5801,7 @@ import {
   Arrow
 } from "@radix-ui/react-tooltip";
 import styled12, { css as css14 } from "styled-components";
-import { jsx as jsx166, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx167, jsxs as jsxs6 } from "react/jsx-runtime";
 var CompactTooltipStyles = css14`
   --tooltip-font-size: var(--typography-label-4-size);
   --tooltip-line-height: var(--typography-label-4-line-height);
@@ -5853,8 +5873,8 @@ var Tooltip = ({
       delayDuration: delay,
       ...rootProps,
       children: [
-        /* @__PURE__ */ jsx166(Trigger, { asChild: true, children }),
-        /* @__PURE__ */ jsx166(Portal, { children: /* @__PURE__ */ jsxs6(
+        /* @__PURE__ */ jsx167(Trigger, { asChild: true, children }),
+        /* @__PURE__ */ jsx167(Portal, { children: /* @__PURE__ */ jsxs6(
           StyledContent,
           {
             $compact: compact,
@@ -5862,7 +5882,7 @@ var Tooltip = ({
             sideOffset: hideArrow ? VISUAL_OFFSET : VISUAL_OFFSET - 2,
             children: [
               content,
-              !hideArrow ? /* @__PURE__ */ jsx166(Arrow, { asChild: true, children: /* @__PURE__ */ jsx166(
+              !hideArrow ? /* @__PURE__ */ jsx167(Arrow, { asChild: true, children: /* @__PURE__ */ jsx167(
                 "svg",
                 {
                   fill: "var(--tooltip-bg)",
@@ -5871,7 +5891,7 @@ var Tooltip = ({
                   viewBox: "0 0 12 8",
                   width: "12",
                   xmlns: "http://www.w3.org/2000/svg",
-                  children: /* @__PURE__ */ jsx166("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__ */ jsx167("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
             ]
@@ -5884,7 +5904,7 @@ var Tooltip = ({
 Tooltip.displayName = "Tooltip";
 
 // src/components/IconButton/IconButton.tsx
-import { jsx as jsx167 } from "react/jsx-runtime";
+import { jsx as jsx168 } from "react/jsx-runtime";
 var StyledButton2 = styled13(Button)`
   --icon-button-size-sm: 24px;
   --icon-button-size-md: 32px;
@@ -5902,7 +5922,7 @@ var StyledButton2 = styled13(Button)`
 var IconButton = forwardRef5(
   ({ children, label, disableTooltip = false, size = "md", ...props }, ref) => {
     const responsiveSize = useResponsiveProp(size);
-    const button = /* @__PURE__ */ jsx167(
+    const button = /* @__PURE__ */ jsx168(
       StyledButton2,
       {
         ...props,
@@ -5918,14 +5938,14 @@ var IconButton = forwardRef5(
     if (disableTooltip) {
       return button;
     }
-    return /* @__PURE__ */ jsx167(Tooltip, { content: label, children: button });
+    return /* @__PURE__ */ jsx168(Tooltip, { content: label, children: button });
   }
 );
 IconButton.displayName = "IconButton";
 
 // src/components/Label/Label.tsx
 import styled14, { css as css15 } from "styled-components";
-import { jsx as jsx168 } from "react/jsx-runtime";
+import { jsx as jsx169 } from "react/jsx-runtime";
 var requiredStyle = css15`
   &::after {
     color: red; /* TODO need a color for this */
@@ -5969,7 +5989,7 @@ var Label = ({
   required = false,
   screenReaderOnly = false,
   ...otherProps
-}) => /* @__PURE__ */ jsx168(
+}) => /* @__PURE__ */ jsx169(
   StyledLabel,
   {
     disabled,
@@ -5984,7 +6004,7 @@ Label.displayName = "Label";
 // src/components/ScreenReaderOnly/ScreenReaderOnly.tsx
 import styled15 from "styled-components";
 import { isNotNil as isNotNil6 } from "@wistia/type-guards";
-import { jsx as jsx169 } from "react/jsx-runtime";
+import { jsx as jsx170 } from "react/jsx-runtime";
 var VisuallyHidden = styled15.div({ ...visuallyHiddenStyle });
 var VisuallyHiddenButFocusable = styled15.div({
   "&:not(:focus-within)": visuallyHiddenStyle
@@ -5997,16 +6017,16 @@ var ScreenReaderOnly = ({
 }) => {
   const accessibleText = isNotNil6(text) ? text : children;
   if (focusable) {
-    return /* @__PURE__ */ jsx169(VisuallyHiddenButFocusable, { ...otherProps, children: accessibleText });
+    return /* @__PURE__ */ jsx170(VisuallyHiddenButFocusable, { ...otherProps, children: accessibleText });
   }
-  return /* @__PURE__ */ jsx169(VisuallyHidden, { ...otherProps, children: accessibleText });
+  return /* @__PURE__ */ jsx170(VisuallyHidden, { ...otherProps, children: accessibleText });
 };
 ScreenReaderOnly.displayName = "ScreenReaderOnly";
 
 // src/components/Stack/Stack.tsx
 import { forwardRef as forwardRef6 } from "react";
 import styled16 from "styled-components";
-import { jsx as jsx170 } from "react/jsx-runtime";
+import { jsx as jsx171 } from "react/jsx-runtime";
 var DEFAULT_ELEMENT2 = "div";
 var StyledStack = styled16.div`
   display: flex;
@@ -6021,7 +6041,7 @@ var StackComponent = forwardRef6(
   ({ renderAs, direction = "vertical", gap = "space-02", ...props }, ref) => {
     const responsiveGap = useResponsiveProp(gap);
     const responsiveDirection = useResponsiveProp(direction);
-    return /* @__PURE__ */ jsx170(
+    return /* @__PURE__ */ jsx171(
       StyledStack,
       {
         ref,
@@ -6039,7 +6059,7 @@ var Stack = makePolymorphic(StackComponent);
 // src/components/Text/Text.tsx
 import { forwardRef as forwardRef7 } from "react";
 import styled17, { css as css16 } from "styled-components";
-import { jsx as jsx171 } from "react/jsx-runtime";
+import { jsx as jsx172 } from "react/jsx-runtime";
 var bodyBoldStyles = css16`
   > strong,
   b {
@@ -6194,7 +6214,7 @@ var TextComponent = forwardRef7(
     renderAs,
     ...otherProps
   }, ref) => {
-    return /* @__PURE__ */ jsx171(
+    return /* @__PURE__ */ jsx172(
       StyledText,
       {
         ref,
@@ -6218,18 +6238,18 @@ var Text = makePolymorphic(TextComponent);
 // src/components/WistiaLogo/WistiaLogo.tsx
 import styled18 from "styled-components";
 import { isNotNil as isNotNil7 } from "@wistia/type-guards";
-import { jsx as jsx172, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx173, jsxs as jsxs7 } from "react/jsx-runtime";
 var renderBrandmark = (brandmarkColor, iconOnly) => {
   if (iconOnly) {
-    return /* @__PURE__ */ jsx172("g", { fill: brandmarkColor, children: /* @__PURE__ */ jsx172("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__ */ jsx173("g", { fill: brandmarkColor, children: /* @__PURE__ */ jsx173("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__ */ jsx172("g", { fill: brandmarkColor, children: /* @__PURE__ */ jsx172("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" }) });
+  return /* @__PURE__ */ jsx173("g", { fill: brandmarkColor, children: /* @__PURE__ */ jsx173("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" }) });
 };
 var renderLogotype = (logotypeColor, iconOnly) => {
   if (iconOnly) {
     return null;
   }
-  return /* @__PURE__ */ jsx172("g", { fill: logotypeColor, children: /* @__PURE__ */ jsx172("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" }) });
+  return /* @__PURE__ */ jsx173("g", { fill: logotypeColor, children: /* @__PURE__ */ jsx173("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" }) });
 };
 var computedViewBox = (iconOnly) => {
   if (iconOnly) {
@@ -6289,14 +6309,14 @@ var WistiaLogo = ({
       xmlns: "http://www.w3.org/2000/svg",
       ...otherProps,
       children: [
-        /* @__PURE__ */ jsx172("title", { children: title }),
-        isNotNil7(description) ? /* @__PURE__ */ jsx172("desc", { children: description }) : null,
+        /* @__PURE__ */ jsx173("title", { children: title }),
+        isNotNil7(description) ? /* @__PURE__ */ jsx173("desc", { children: description }) : null,
         renderBrandmark(brandmarkColor, iconOnly),
         renderLogotype(logotypeColor, iconOnly)
       ]
     }
   );
-  return href !== void 0 ? /* @__PURE__ */ jsx172("a", { href, children: Logo }) : Logo;
+  return href !== void 0 ? /* @__PURE__ */ jsx173("a", { href, children: Logo }) : Logo;
 };
 WistiaLogo.displayName = "WistiaLogo";
 export {