@wistia/ui 0.9.1-beta.e028a78e.bb9fef4 → 0.9.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.mjs CHANGED
@@ -1,6 +1,6 @@
1
1
 
2
2
  /*
3
- * @license @wistia/ui v0.9.1-beta.e028a78e.bb9fef4
3
+ * @license @wistia/ui v0.9.1
4
4
  *
5
5
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
6
6
  *
@@ -10208,7 +10208,6 @@ var KeyboardShortcut = ({
10208
10208
  KeyboardShortcut.displayName = "KeyboardShortcut";
10209
10209
 
10210
10210
  // src/components/Menu/Menu.tsx
10211
- import { forwardRef as forwardRef15, useMemo as useMemo7 } from "react";
10212
10211
  import styled40, { css as css29, keyframes as keyframes3 } from "styled-components";
10213
10212
  import {
10214
10213
  DropdownMenu,
@@ -10217,6 +10216,7 @@ import {
10217
10216
  DropdownMenuContent
10218
10217
  } from "@radix-ui/react-dropdown-menu";
10219
10218
  import { isNotNil as isNotNil19, isNotUndefined as isNotUndefined10 } from "@wistia/type-guards";
10219
+ import { useMemo as useMemo7 } from "react";
10220
10220
 
10221
10221
  // src/components/Menu/MenuContext.tsx
10222
10222
  import { createContext as createContext6, useContext as useContext5 } from "react";
@@ -10311,70 +10311,65 @@ var menuContentCss = css29`
10311
10311
  `;
10312
10312
  var MenuContent = styled40(DropdownMenuContent)`
10313
10313
  ${menuContentCss}
10314
- min-width: var(--radix-dropdown-menu-trigger-width);
10315
10314
  `;
10316
- var Menu = forwardRef15(
10317
- ({
10318
- align = "start",
10319
- children,
10320
- disabled = false,
10321
- compact = false,
10322
- trigger,
10323
- label,
10324
- isOpen,
10325
- triggerProps = {},
10326
- onOpenChange,
10327
- onInteractOutside,
10328
- ...props
10329
- }, ref) => {
10330
- const contextValue = useMemo7(() => ({ compact }), [compact]);
10331
- let controlProps = {
10332
- ...isNotNil19(onOpenChange) && isNotNil19(isOpen) ? { open: isOpen, onOpenChange } : {}
10315
+ var Menu = ({
10316
+ align = "start",
10317
+ children,
10318
+ disabled = false,
10319
+ compact = false,
10320
+ trigger,
10321
+ label,
10322
+ isOpen,
10323
+ triggerProps = {},
10324
+ onOpenChange,
10325
+ onInteractOutside,
10326
+ ...props
10327
+ }) => {
10328
+ const contextValue = useMemo7(() => ({ compact }), [compact]);
10329
+ let controlProps = {
10330
+ ...isNotNil19(onOpenChange) && isNotNil19(isOpen) ? { open: isOpen, onOpenChange } : {}
10331
+ };
10332
+ if (disabled) {
10333
+ controlProps = {
10334
+ open: false,
10335
+ onOpenChange: () => null
10333
10336
  };
10334
- if (disabled) {
10335
- controlProps = {
10336
- open: false,
10337
- onOpenChange: () => null
10338
- };
10339
- }
10340
- return /* @__PURE__ */ jsx232(MenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs26(
10341
- DropdownMenu,
10342
- {
10343
- modal: false,
10344
- ...controlProps,
10345
- children: [
10346
- /* @__PURE__ */ jsx232(DropdownMenuTrigger, { asChild: true, children: isNotUndefined10(trigger) ? trigger : /* @__PURE__ */ jsx232(
10347
- Button,
10348
- {
10349
- ref,
10350
- "aria-expanded": isOpen,
10351
- disabled,
10352
- forceState: isOpen ? "active" : void 0,
10353
- rightIcon: /* @__PURE__ */ jsx232(Icon, { type: "caret-down" }),
10354
- ...triggerProps,
10355
- children: label
10356
- }
10357
- ) }),
10358
- /* @__PURE__ */ jsx232(DropdownMenuPortal, { children: /* @__PURE__ */ jsx232(
10359
- MenuContent,
10360
- {
10361
- ...props,
10362
- $compact: compact,
10363
- align,
10364
- collisionPadding: 8,
10365
- sideOffset: 6,
10366
- onFocusOutside: (event) => {
10367
- event.preventDefault();
10368
- },
10369
- children
10370
- }
10371
- ) })
10372
- ]
10373
- }
10374
- ) });
10375
10337
  }
10376
- );
10377
- Menu.displayName = "Menu";
10338
+ return /* @__PURE__ */ jsx232(MenuContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs26(
10339
+ DropdownMenu,
10340
+ {
10341
+ modal: false,
10342
+ ...controlProps,
10343
+ children: [
10344
+ /* @__PURE__ */ jsx232(DropdownMenuTrigger, { asChild: true, children: isNotUndefined10(trigger) ? trigger : /* @__PURE__ */ jsx232(
10345
+ Button,
10346
+ {
10347
+ "aria-expanded": isOpen,
10348
+ disabled,
10349
+ forceState: isOpen ? "active" : void 0,
10350
+ rightIcon: /* @__PURE__ */ jsx232(Icon, { type: "caret-down" }),
10351
+ ...triggerProps,
10352
+ children: label
10353
+ }
10354
+ ) }),
10355
+ /* @__PURE__ */ jsx232(DropdownMenuPortal, { children: /* @__PURE__ */ jsx232(
10356
+ MenuContent,
10357
+ {
10358
+ ...props,
10359
+ $compact: compact,
10360
+ align,
10361
+ collisionPadding: 8,
10362
+ sideOffset: 6,
10363
+ onFocusOutside: (event) => {
10364
+ event.preventDefault();
10365
+ },
10366
+ children
10367
+ }
10368
+ ) })
10369
+ ]
10370
+ }
10371
+ ) });
10372
+ };
10378
10373
  Menu.displayName = "Menu";
10379
10374
 
10380
10375
  // src/components/Menu/MenuLabel.tsx
@@ -10418,7 +10413,7 @@ import {
10418
10413
  import { isNotNil as isNotNil21 } from "@wistia/type-guards";
10419
10414
 
10420
10415
  // src/components/Menu/MenuItemButton.tsx
10421
- import { forwardRef as forwardRef16 } from "react";
10416
+ import { forwardRef as forwardRef15 } from "react";
10422
10417
  import styled42 from "styled-components";
10423
10418
  import { isNotNil as isNotNil20, isNotUndefined as isNotUndefined11 } from "@wistia/type-guards";
10424
10419
  import { jsx as jsx234, jsxs as jsxs27 } from "react/jsx-runtime";
@@ -10495,7 +10490,7 @@ var StyledBadgeContainer = styled42.div`
10495
10490
  font-size: var(--wui-typography-label-4-size);
10496
10491
  color: var(--wui-color-text-secondary);
10497
10492
  `;
10498
- var MenuItemButton = forwardRef16(({ children, appearance, command, icon, ...props }, ref) => {
10493
+ var MenuItemButton = forwardRef15(({ children, appearance, command, icon, ...props }, ref) => {
10499
10494
  let { colorScheme, badge } = props;
10500
10495
  if (appearance === "dangerous") {
10501
10496
  if (isNotUndefined11(colorScheme)) {
@@ -10624,10 +10619,10 @@ var SubMenu = ({
10624
10619
  SubMenu.displayName = "SubMenu";
10625
10620
 
10626
10621
  // src/components/Menu/MenuItem.tsx
10627
- import { forwardRef as forwardRef17 } from "react";
10622
+ import { forwardRef as forwardRef16 } from "react";
10628
10623
  import { DropdownMenuItem as DropdownMenuItem2 } from "@radix-ui/react-dropdown-menu";
10629
10624
  import { jsx as jsx237 } from "react/jsx-runtime";
10630
- var MenuItem = forwardRef17(
10625
+ var MenuItem = forwardRef16(
10631
10626
  ({ onSelect = () => null, ...props }, ref) => {
10632
10627
  return /* @__PURE__ */ jsx237(
10633
10628
  DropdownMenuItem2,
@@ -10783,103 +10778,8 @@ var CheckboxMenuItem = ({
10783
10778
  };
10784
10779
  CheckboxMenuItem.displayName = "CheckboxMenuItem";
10785
10780
 
10786
- // src/components/Menu/FilterMenu.tsx
10787
- import { Children as Children6, forwardRef as forwardRef18 } from "react";
10788
- import { jsx as jsx241, jsxs as jsxs30 } from "react/jsx-runtime";
10789
- var FilterMenuItem = CheckboxMenuItem;
10790
- var FilterMenu = forwardRef18(
10791
- ({ value, onChange, searchValue, onSearchValueChange, children, ...props }, ref) => {
10792
- return /* @__PURE__ */ jsxs30(
10793
- Menu,
10794
- {
10795
- ...props,
10796
- ref,
10797
- isOpen: true,
10798
- children: [
10799
- /* @__PURE__ */ jsx241(
10800
- Card,
10801
- {
10802
- alignItems: "flex-end",
10803
- border: false,
10804
- borderRadius: "border-radius-02",
10805
- paddingSize: "space-01",
10806
- prominence: "default",
10807
- style: {
10808
- position: "absolute",
10809
- top: 0,
10810
- left: 0,
10811
- right: 0,
10812
- margin: "1px"
10813
- },
10814
- children: /* @__PURE__ */ jsx241(
10815
- Input,
10816
- {
10817
- autoFocus: true,
10818
- onChange: (event) => {
10819
- onSearchValueChange(event.target.value);
10820
- },
10821
- onClick: (event) => event.preventDefault(),
10822
- onKeyDown: (event) => {
10823
- if (event.key === "ArrowDown") {
10824
- event.preventDefault();
10825
- const menu = document.querySelector('[role="menu"]');
10826
- const firstMenuItem = menu?.querySelector('[role="menuitemcheckbox"]');
10827
- if (firstMenuItem) {
10828
- firstMenuItem.focus();
10829
- }
10830
- }
10831
- event.stopPropagation();
10832
- },
10833
- placeholder: "Search...",
10834
- tabIndex: 0,
10835
- type: "search"
10836
- }
10837
- )
10838
- }
10839
- ),
10840
- /* @__PURE__ */ jsx241(
10841
- MenuItem,
10842
- {
10843
- disabled: true,
10844
- style: { padding: "16px" },
10845
- children: " "
10846
- }
10847
- ),
10848
- Children6.toArray(children).length > 0 ? children : /* @__PURE__ */ jsx241(MenuItem, { disabled: true, children: "No results found" }),
10849
- value.length > 0 && /* @__PURE__ */ jsx241(MenuItem, { disabled: true, children: /* @__PURE__ */ jsx241(
10850
- Card,
10851
- {
10852
- alignItems: "flex-end",
10853
- border: false,
10854
- borderRadius: "border-radius-02",
10855
- paddingSize: "space-01",
10856
- prominence: "default",
10857
- style: {
10858
- position: "absolute",
10859
- bottom: 0,
10860
- left: 0,
10861
- right: 0,
10862
- margin: "1px"
10863
- },
10864
- children: /* @__PURE__ */ jsx241(
10865
- Button,
10866
- {
10867
- onClick: () => onChange([]),
10868
- size: "sm",
10869
- children: "Clear"
10870
- }
10871
- )
10872
- }
10873
- ) })
10874
- ]
10875
- }
10876
- );
10877
- }
10878
- );
10879
- FilterMenu.displayName = "FilterMenu";
10880
-
10881
10781
  // src/components/Modal/Modal.tsx
10882
- import { forwardRef as forwardRef21 } from "react";
10782
+ import { forwardRef as forwardRef19 } from "react";
10883
10783
  import styled49 from "styled-components";
10884
10784
  import { Root as DialogRoot, Portal as DialogPortal } from "@radix-ui/react-dialog";
10885
10785
  import { isNotNil as isNotNil24 } from "@wistia/type-guards";
@@ -10891,24 +10791,24 @@ import { Title as DialogTitle } from "@radix-ui/react-dialog";
10891
10791
  // src/components/Modal/ModalCloseButton.tsx
10892
10792
  import styled45 from "styled-components";
10893
10793
  import { Close as DialogClose } from "@radix-ui/react-dialog";
10894
- import { jsx as jsx242 } from "react/jsx-runtime";
10794
+ import { jsx as jsx241 } from "react/jsx-runtime";
10895
10795
  var CloseButton = styled45(DialogClose)`
10896
10796
  align-self: start;
10897
10797
  `;
10898
10798
  var ModalCloseButton = () => {
10899
- return /* @__PURE__ */ jsx242(CloseButton, { asChild: true, children: /* @__PURE__ */ jsx242(
10799
+ return /* @__PURE__ */ jsx241(CloseButton, { asChild: true, children: /* @__PURE__ */ jsx241(
10900
10800
  IconButton,
10901
10801
  {
10902
10802
  label: "Dismiss modal",
10903
10803
  size: "sm",
10904
10804
  variant: "ghost",
10905
- children: /* @__PURE__ */ jsx242(Icon, { type: "close" })
10805
+ children: /* @__PURE__ */ jsx241(Icon, { type: "close" })
10906
10806
  }
10907
10807
  ) });
10908
10808
  };
10909
10809
 
10910
10810
  // src/components/Modal/ModalHeader.tsx
10911
- import { jsx as jsx243, jsxs as jsxs31 } from "react/jsx-runtime";
10811
+ import { jsx as jsx242, jsxs as jsxs30 } from "react/jsx-runtime";
10912
10812
  var Header = styled46.header`
10913
10813
  display: flex;
10914
10814
  order: 1;
@@ -10931,15 +10831,15 @@ var ModalHeader = ({
10931
10831
  hideTitle,
10932
10832
  hideCloseButton
10933
10833
  }) => {
10934
- const TitleComponent = hideTitle ? /* @__PURE__ */ jsx243(ScreenReaderOnly, { children: /* @__PURE__ */ jsx243(Title, { children: title }) }) : /* @__PURE__ */ jsx243(Title, { children: title });
10935
- return /* @__PURE__ */ jsxs31(Header, { $hideTitle: hideTitle, children: [
10834
+ const TitleComponent = hideTitle ? /* @__PURE__ */ jsx242(ScreenReaderOnly, { children: /* @__PURE__ */ jsx242(Title, { children: title }) }) : /* @__PURE__ */ jsx242(Title, { children: title });
10835
+ return /* @__PURE__ */ jsxs30(Header, { $hideTitle: hideTitle, children: [
10936
10836
  TitleComponent,
10937
- hideCloseButton ? null : /* @__PURE__ */ jsx243(ModalCloseButton, {})
10837
+ hideCloseButton ? null : /* @__PURE__ */ jsx242(ModalCloseButton, {})
10938
10838
  ] });
10939
10839
  };
10940
10840
 
10941
10841
  // src/components/Modal/ModalContent.tsx
10942
- import { forwardRef as forwardRef19 } from "react";
10842
+ import { forwardRef as forwardRef17 } from "react";
10943
10843
  import styled47, { css as css30 } from "styled-components";
10944
10844
  import { Content as DialogContent } from "@radix-ui/react-dialog";
10945
10845
 
@@ -10963,7 +10863,7 @@ var useFocusRestore = () => {
10963
10863
  };
10964
10864
 
10965
10865
  // src/components/Modal/ModalContent.tsx
10966
- import { jsx as jsx244 } from "react/jsx-runtime";
10866
+ import { jsx as jsx243 } from "react/jsx-runtime";
10967
10867
  var alignTopStyles = css30`
10968
10868
  --wui-modal-translate-y: 0;
10969
10869
 
@@ -11042,10 +10942,10 @@ var StyledModalContent = styled47(DialogContent)`
11042
10942
  }
11043
10943
  }
11044
10944
  `;
11045
- var ModalContent = forwardRef19(
10945
+ var ModalContent = forwardRef17(
11046
10946
  ({ fullHeight, width, alignHorizontal, alignVertical, children, ...props }, ref) => {
11047
10947
  useFocusRestore();
11048
- return /* @__PURE__ */ jsx244(
10948
+ return /* @__PURE__ */ jsx243(
11049
10949
  StyledModalContent,
11050
10950
  {
11051
10951
  ref,
@@ -11062,9 +10962,9 @@ var ModalContent = forwardRef19(
11062
10962
  );
11063
10963
 
11064
10964
  // src/private/components/Backdrop/Backdrop.tsx
11065
- import { forwardRef as forwardRef20 } from "react";
10965
+ import { forwardRef as forwardRef18 } from "react";
11066
10966
  import styled48 from "styled-components";
11067
- import { jsx as jsx245 } from "react/jsx-runtime";
10967
+ import { jsx as jsx244 } from "react/jsx-runtime";
11068
10968
  var alignVerticalMap = {
11069
10969
  stretch: "normal",
11070
10970
  top: "start",
@@ -11102,8 +11002,8 @@ var BackdropComponent = styled48.div`
11102
11002
  }
11103
11003
  }
11104
11004
  `;
11105
- var Backdrop = forwardRef20(
11106
- ({ alignHorizontal = "center", alignVertical = "center", children, ...otherProps }, ref) => /* @__PURE__ */ jsx245(
11005
+ var Backdrop = forwardRef18(
11006
+ ({ alignHorizontal = "center", alignVertical = "center", children, ...otherProps }, ref) => /* @__PURE__ */ jsx244(
11107
11007
  BackdropComponent,
11108
11008
  {
11109
11009
  ref,
@@ -11117,7 +11017,7 @@ var Backdrop = forwardRef20(
11117
11017
  Backdrop.displayName = "Backdrop";
11118
11018
 
11119
11019
  // src/components/Modal/Modal.tsx
11120
- import { jsx as jsx246, jsxs as jsxs32 } from "react/jsx-runtime";
11020
+ import { jsx as jsx245, jsxs as jsxs31 } from "react/jsx-runtime";
11121
11021
  var DEFAULT_MODAL_WIDTH = "532px";
11122
11022
  var ModalBody = styled49.div`
11123
11023
  flex-direction: column;
@@ -11125,7 +11025,7 @@ var ModalBody = styled49.div`
11125
11025
  flex: 1 0 0;
11126
11026
  order: 2;
11127
11027
  `;
11128
- var Modal = forwardRef21(
11028
+ var Modal = forwardRef19(
11129
11029
  ({
11130
11030
  children,
11131
11031
  fullHeight = false,
@@ -11140,7 +11040,7 @@ var Modal = forwardRef21(
11140
11040
  alignVertical = "center",
11141
11041
  ...props
11142
11042
  }, ref) => {
11143
- return /* @__PURE__ */ jsx246(
11043
+ return /* @__PURE__ */ jsx245(
11144
11044
  DialogRoot,
11145
11045
  {
11146
11046
  onOpenChange: (open2) => {
@@ -11149,9 +11049,9 @@ var Modal = forwardRef21(
11149
11049
  }
11150
11050
  },
11151
11051
  open: isOpen,
11152
- children: /* @__PURE__ */ jsxs32(DialogPortal, { children: [
11153
- /* @__PURE__ */ jsx246(Backdrop, {}),
11154
- /* @__PURE__ */ jsxs32(
11052
+ children: /* @__PURE__ */ jsxs31(DialogPortal, { children: [
11053
+ /* @__PURE__ */ jsx245(Backdrop, {}),
11054
+ /* @__PURE__ */ jsxs31(
11155
11055
  ModalContent,
11156
11056
  {
11157
11057
  ref,
@@ -11169,8 +11069,8 @@ var Modal = forwardRef21(
11169
11069
  width,
11170
11070
  ...props,
11171
11071
  children: [
11172
- /* @__PURE__ */ jsx246(ModalBody, { children }),
11173
- /* @__PURE__ */ jsx246(
11072
+ /* @__PURE__ */ jsx245(ModalBody, { children }),
11073
+ /* @__PURE__ */ jsx245(
11174
11074
  ModalHeader,
11175
11075
  {
11176
11076
  hideCloseButton,
@@ -11201,7 +11101,7 @@ var getControlProps = (isOpen, onOpenChange) => {
11201
11101
  // src/components/Popover/PopoverArrow.tsx
11202
11102
  import { PopoverArrow as RadixPopoverArrow } from "@radix-ui/react-popover";
11203
11103
  import styled50, { css as css31, keyframes as keyframes4 } from "styled-components";
11204
- import { jsx as jsx247, jsxs as jsxs33 } from "react/jsx-runtime";
11104
+ import { jsx as jsx246, jsxs as jsxs32 } from "react/jsx-runtime";
11205
11105
  var StyledPath = styled50.path`
11206
11106
  fill: var(--wui-color-border-secondary);
11207
11107
  `;
@@ -11240,7 +11140,7 @@ var StyledCircle = styled50.circle`
11240
11140
  }
11241
11141
  `;
11242
11142
  var PopoverArrow = ({ isAnimated }) => {
11243
- return /* @__PURE__ */ jsx247(RadixPopoverArrow, { asChild: true, children: /* @__PURE__ */ jsxs33(
11143
+ return /* @__PURE__ */ jsx246(RadixPopoverArrow, { asChild: true, children: /* @__PURE__ */ jsxs32(
11244
11144
  "svg",
11245
11145
  {
11246
11146
  fill: "none",
@@ -11249,8 +11149,8 @@ var PopoverArrow = ({ isAnimated }) => {
11249
11149
  width: "48",
11250
11150
  xmlns: "http://www.w3.org/2000/svg",
11251
11151
  children: [
11252
- /* @__PURE__ */ jsx247(StyledPath, { d: "M24 26.6667C21.0545 26.6667 18.6667 29.0545 18.6667 32C18.6667 34.9455 21.0545 37.3333 24 37.3333C26.9455 37.3333 29.3333 34.9455 29.3333 32C29.3333 29.0545 26.9455 26.6667 24 26.6667ZM23 0V32H25V0H23Z" }),
11253
- /* @__PURE__ */ jsx247(
11152
+ /* @__PURE__ */ jsx246(StyledPath, { d: "M24 26.6667C21.0545 26.6667 18.6667 29.0545 18.6667 32C18.6667 34.9455 21.0545 37.3333 24 37.3333C26.9455 37.3333 29.3333 34.9455 29.3333 32C29.3333 29.0545 26.9455 26.6667 24 26.6667ZM23 0V32H25V0H23Z" }),
11153
+ /* @__PURE__ */ jsx246(
11254
11154
  StyledCircle,
11255
11155
  {
11256
11156
  $isAnimated: isAnimated,
@@ -11261,7 +11161,7 @@ var PopoverArrow = ({ isAnimated }) => {
11261
11161
  strokeWidth: "4"
11262
11162
  }
11263
11163
  ),
11264
- /* @__PURE__ */ jsx247(
11164
+ /* @__PURE__ */ jsx246(
11265
11165
  StyledCircle,
11266
11166
  {
11267
11167
  $isAnimated: isAnimated,
@@ -11279,7 +11179,7 @@ var PopoverArrow = ({ isAnimated }) => {
11279
11179
  PopoverArrow.displayName = "PopoverArrow";
11280
11180
 
11281
11181
  // src/components/Popover/Popover.tsx
11282
- import { jsx as jsx248, jsxs as jsxs34 } from "react/jsx-runtime";
11182
+ import { jsx as jsx247, jsxs as jsxs33 } from "react/jsx-runtime";
11283
11183
  var StyledContent2 = styled51(Content2)`
11284
11184
  ${({ $colorScheme }) => getColorScheme($colorScheme)};
11285
11185
  ${({ $unstyled }) => !$unstyled && css32`
@@ -11318,9 +11218,9 @@ var Popover = ({
11318
11218
  "--wui-popover-max-width": maxWidth,
11319
11219
  "--wui-popover-max-height": maxHeight
11320
11220
  };
11321
- return /* @__PURE__ */ jsxs34(Root, { ...getControlProps(isOpen, onOpenChange), children: [
11322
- /* @__PURE__ */ jsx248(Trigger2, { asChild: true, children: trigger }),
11323
- /* @__PURE__ */ jsx248(Portal, { children: /* @__PURE__ */ jsxs34(
11221
+ return /* @__PURE__ */ jsxs33(Root, { ...getControlProps(isOpen, onOpenChange), children: [
11222
+ /* @__PURE__ */ jsx247(Trigger2, { asChild: true, children: trigger }),
11223
+ /* @__PURE__ */ jsx247(Portal, { children: /* @__PURE__ */ jsxs33(
11324
11224
  StyledContent2,
11325
11225
  {
11326
11226
  $colorScheme: colorScheme,
@@ -11329,17 +11229,17 @@ var Popover = ({
11329
11229
  $unstyled: unstyled,
11330
11230
  style,
11331
11231
  children: [
11332
- !hideCloseButton && /* @__PURE__ */ jsx248(Close, { asChild: true, children: /* @__PURE__ */ jsx248(
11232
+ !hideCloseButton && /* @__PURE__ */ jsx247(Close, { asChild: true, children: /* @__PURE__ */ jsx247(
11333
11233
  IconButton,
11334
11234
  {
11335
11235
  "data-wui-popover-close": true,
11336
11236
  label: "Close",
11337
11237
  variant: "ghost",
11338
- children: /* @__PURE__ */ jsx248(Icon, { type: "close" })
11238
+ children: /* @__PURE__ */ jsx247(Icon, { type: "close" })
11339
11239
  }
11340
11240
  ) }),
11341
- withArrow ? /* @__PURE__ */ jsx248(PopoverArrow, { isAnimated }) : null,
11342
- /* @__PURE__ */ jsx248("div", { children })
11241
+ withArrow ? /* @__PURE__ */ jsx247(PopoverArrow, { isAnimated }) : null,
11242
+ /* @__PURE__ */ jsx247("div", { children })
11343
11243
  ]
11344
11244
  }
11345
11245
  ) })
@@ -11351,7 +11251,7 @@ Popover.displayName = "Popover";
11351
11251
  import styled52 from "styled-components";
11352
11252
  import { Root as ProgressRoot, Indicator as ProgressIndicator } from "@radix-ui/react-progress";
11353
11253
  import { isNotNil as isNotNil26 } from "@wistia/type-guards";
11354
- import { jsx as jsx249, jsxs as jsxs35 } from "react/jsx-runtime";
11254
+ import { jsx as jsx248, jsxs as jsxs34 } from "react/jsx-runtime";
11355
11255
  var ProgressBarWrapper = styled52.div`
11356
11256
  --progress-bar-height: 8px;
11357
11257
  --progress-bar-indicator-color: var(--wui-color-bg-fill);
@@ -11404,15 +11304,15 @@ var ProgressBar = ({
11404
11304
  labelRight,
11405
11305
  ...props
11406
11306
  }) => {
11407
- return /* @__PURE__ */ jsxs35(ProgressBarWrapper, { children: [
11408
- isNotNil26(labelLeft) ? /* @__PURE__ */ jsx249(ProgressBarLabel, { children: labelLeft }) : null,
11409
- /* @__PURE__ */ jsx249(
11307
+ return /* @__PURE__ */ jsxs34(ProgressBarWrapper, { children: [
11308
+ isNotNil26(labelLeft) ? /* @__PURE__ */ jsx248(ProgressBarLabel, { children: labelLeft }) : null,
11309
+ /* @__PURE__ */ jsx248(
11410
11310
  StyledProgressBar,
11411
11311
  {
11412
11312
  max,
11413
11313
  value: progress,
11414
11314
  ...props,
11415
- children: /* @__PURE__ */ jsx249(
11315
+ children: /* @__PURE__ */ jsx248(
11416
11316
  StyledProgressIndicator,
11417
11317
  {
11418
11318
  $max: max,
@@ -11421,17 +11321,17 @@ var ProgressBar = ({
11421
11321
  )
11422
11322
  }
11423
11323
  ),
11424
- isNotNil26(labelRight) ? /* @__PURE__ */ jsx249(ProgressBarLabel, { children: labelRight }) : null
11324
+ isNotNil26(labelRight) ? /* @__PURE__ */ jsx248(ProgressBarLabel, { children: labelRight }) : null
11425
11325
  ] });
11426
11326
  };
11427
11327
  ProgressBar.displayName = "ProgressBar";
11428
11328
 
11429
11329
  // src/components/Radio/Radio.tsx
11430
- import { forwardRef as forwardRef22, useId as useId3 } from "react";
11330
+ import { forwardRef as forwardRef20, useId as useId3 } from "react";
11431
11331
  import styled53, { css as css33 } from "styled-components";
11432
11332
  import { isNonEmptyString as isNonEmptyString3 } from "@wistia/type-guards";
11433
- import { jsx as jsx250, jsxs as jsxs36 } from "react/jsx-runtime";
11434
- var RadioIcon = () => /* @__PURE__ */ jsx250(
11333
+ import { jsx as jsx249, jsxs as jsxs35 } from "react/jsx-runtime";
11334
+ var RadioIcon = () => /* @__PURE__ */ jsx249(
11435
11335
  "svg",
11436
11336
  {
11437
11337
  fill: "inherit",
@@ -11439,7 +11339,7 @@ var RadioIcon = () => /* @__PURE__ */ jsx250(
11439
11339
  viewBox: "0 0 1 1",
11440
11340
  width: "1",
11441
11341
  xmlns: "http://www.w3.org/2000/svg",
11442
- children: /* @__PURE__ */ jsx250(
11342
+ children: /* @__PURE__ */ jsx249(
11443
11343
  "circle",
11444
11344
  {
11445
11345
  cx: "0.5",
@@ -11530,7 +11430,7 @@ var StyledHiddenRadioInput = styled53.input`
11530
11430
  display: block;
11531
11431
  }
11532
11432
  `;
11533
- var Radio = forwardRef22(
11433
+ var Radio = forwardRef20(
11534
11434
  ({
11535
11435
  checked,
11536
11436
  disabled = false,
@@ -11547,13 +11447,13 @@ var Radio = forwardRef22(
11547
11447
  }, ref) => {
11548
11448
  const generatedId = useId3();
11549
11449
  const computedId = isNonEmptyString3(id) ? id : `wistia-ui-radio-${generatedId}`;
11550
- return /* @__PURE__ */ jsxs36(
11450
+ return /* @__PURE__ */ jsxs35(
11551
11451
  StyledRadioWrapper,
11552
11452
  {
11553
11453
  $disabled: disabled,
11554
11454
  "aria-invalid": props["aria-invalid"],
11555
11455
  children: [
11556
- /* @__PURE__ */ jsx250(
11456
+ /* @__PURE__ */ jsx249(
11557
11457
  StyledHiddenRadioInput,
11558
11458
  {
11559
11459
  ...props,
@@ -11568,16 +11468,16 @@ var Radio = forwardRef22(
11568
11468
  value
11569
11469
  }
11570
11470
  ),
11571
- /* @__PURE__ */ jsx250(
11471
+ /* @__PURE__ */ jsx249(
11572
11472
  FormControlLabel,
11573
11473
  {
11574
- controlSlot: /* @__PURE__ */ jsx250(
11474
+ controlSlot: /* @__PURE__ */ jsx249(
11575
11475
  StyledRadioInput,
11576
11476
  {
11577
11477
  $disabled: disabled,
11578
11478
  $size: size,
11579
11479
  "data-wui-faux-input": "true",
11580
- children: /* @__PURE__ */ jsx250(RadioIcon, {})
11480
+ children: /* @__PURE__ */ jsx249(RadioIcon, {})
11581
11481
  }
11582
11482
  ),
11583
11483
  description,
@@ -11595,14 +11495,14 @@ var Radio = forwardRef22(
11595
11495
  Radio.displayName = "Radio";
11596
11496
 
11597
11497
  // src/components/SegmentedControl/SegmentedControl.tsx
11598
- import { forwardRef as forwardRef23 } from "react";
11498
+ import { forwardRef as forwardRef21 } from "react";
11599
11499
  import styled55, { css as css34 } from "styled-components";
11600
11500
  import { Root as ToggleGroupRoot } from "@radix-ui/react-toggle-group";
11601
11501
  import { isNil as isNil13 } from "@wistia/type-guards";
11602
11502
 
11603
11503
  // src/components/SegmentedControl/useSelectedItemStyle.tsx
11604
11504
  import { createContext as createContext7, useContext as useContext6, useMemo as useMemo8, useState as useState14 } from "react";
11605
- import { jsx as jsx251 } from "react/jsx-runtime";
11505
+ import { jsx as jsx250 } from "react/jsx-runtime";
11606
11506
  var SelectedItemStyleContext = createContext7(null);
11607
11507
  var SelectedItemStyleProvider = ({
11608
11508
  children
@@ -11625,7 +11525,7 @@ var SelectedItemStyleProvider = ({
11625
11525
  }),
11626
11526
  [selectedItemIndicatorStyle]
11627
11527
  );
11628
- return /* @__PURE__ */ jsx251(SelectedItemStyleContext.Provider, { value: contextValue, children });
11528
+ return /* @__PURE__ */ jsx250(SelectedItemStyleContext.Provider, { value: contextValue, children });
11629
11529
  };
11630
11530
  var useSelectedItemStyle = () => {
11631
11531
  const context = useContext6(SelectedItemStyleContext);
@@ -11651,7 +11551,7 @@ var useSegmentedControlValue = () => {
11651
11551
  };
11652
11552
 
11653
11553
  // src/components/SegmentedControl/SelectedItemIndicator.tsx
11654
- import { jsx as jsx252 } from "react/jsx-runtime";
11554
+ import { jsx as jsx251 } from "react/jsx-runtime";
11655
11555
  var SelectedItemIndicatorDiv = styled54.div`
11656
11556
  background-color: var(--wui-color-bg-fill-white);
11657
11557
  border-radius: var(--wui-border-radius-rounded);
@@ -11670,11 +11570,11 @@ var SelectedItemIndicator = () => {
11670
11570
  if (!selectedValue) {
11671
11571
  return null;
11672
11572
  }
11673
- return /* @__PURE__ */ jsx252(SelectedItemIndicatorDiv, { style: selectedItemIndicatorStyle });
11573
+ return /* @__PURE__ */ jsx251(SelectedItemIndicatorDiv, { style: selectedItemIndicatorStyle });
11674
11574
  };
11675
11575
 
11676
11576
  // src/components/SegmentedControl/SegmentedControl.tsx
11677
- import { jsx as jsx253, jsxs as jsxs37 } from "react/jsx-runtime";
11577
+ import { jsx as jsx252, jsxs as jsxs36 } from "react/jsx-runtime";
11678
11578
  var segmentedControlStyles = css34`
11679
11579
  display: inline-flex;
11680
11580
  background-color: var(--wui-color-bg-surface-secondary);
@@ -11689,7 +11589,7 @@ var segmentedControlStyles = css34`
11689
11589
  var StyledSegmentedControl = styled55(ToggleGroupRoot)`
11690
11590
  ${segmentedControlStyles}
11691
11591
  `;
11692
- var SegmentedControl = forwardRef23(
11592
+ var SegmentedControl = forwardRef21(
11693
11593
  ({
11694
11594
  children,
11695
11595
  disabled = false,
@@ -11701,7 +11601,7 @@ var SegmentedControl = forwardRef23(
11701
11601
  if (isNil13(children)) {
11702
11602
  return null;
11703
11603
  }
11704
- return /* @__PURE__ */ jsx253(
11604
+ return /* @__PURE__ */ jsx252(
11705
11605
  StyledSegmentedControl,
11706
11606
  {
11707
11607
  ref,
@@ -11713,8 +11613,8 @@ var SegmentedControl = forwardRef23(
11713
11613
  type: "single",
11714
11614
  value: selectedValue,
11715
11615
  ...props,
11716
- children: /* @__PURE__ */ jsx253(SegmentedControlValueProvider, { value: selectedValue, children: /* @__PURE__ */ jsxs37(SelectedItemStyleProvider, { children: [
11717
- /* @__PURE__ */ jsx253(SelectedItemIndicator, {}),
11616
+ children: /* @__PURE__ */ jsx252(SegmentedControlValueProvider, { value: selectedValue, children: /* @__PURE__ */ jsxs36(SelectedItemStyleProvider, { children: [
11617
+ /* @__PURE__ */ jsx252(SelectedItemIndicator, {}),
11718
11618
  children
11719
11619
  ] }) })
11720
11620
  }
@@ -11724,11 +11624,11 @@ var SegmentedControl = forwardRef23(
11724
11624
  SegmentedControl.displayName = "SegmentedControl";
11725
11625
 
11726
11626
  // src/components/SegmentedControl/SegmentedControlItem.tsx
11727
- import { forwardRef as forwardRef24, useEffect as useEffect11, useRef as useRef12 } from "react";
11627
+ import { forwardRef as forwardRef22, useEffect as useEffect11, useRef as useRef12 } from "react";
11728
11628
  import styled56, { css as css35 } from "styled-components";
11729
11629
  import { Item as ToggleGroupItem } from "@radix-ui/react-toggle-group";
11730
11630
  import { isNotNil as isNotNil27 } from "@wistia/type-guards";
11731
- import { jsxs as jsxs38 } from "react/jsx-runtime";
11631
+ import { jsxs as jsxs37 } from "react/jsx-runtime";
11732
11632
  var segmentedControlItemStyles = css35`
11733
11633
  all: unset; /* ToggleGroupItem is a button element */
11734
11634
  align-items: center;
@@ -11792,7 +11692,7 @@ var segmentedControlItemStyles = css35`
11792
11692
  var StyledSegmentedControlItem = styled56(ToggleGroupItem)`
11793
11693
  ${segmentedControlItemStyles}
11794
11694
  `;
11795
- var SegmentedControlItem = forwardRef24(
11695
+ var SegmentedControlItem = forwardRef22(
11796
11696
  ({ disabled, icon, label, "aria-label": ariaLabel, value }, forwardedRef) => {
11797
11697
  const selectedValue = useSegmentedControlValue();
11798
11698
  const { setSelectedItemMeasurements } = useSelectedItemStyle();
@@ -11830,7 +11730,7 @@ var SegmentedControlItem = forwardRef24(
11830
11730
  resizeObserver.disconnect();
11831
11731
  };
11832
11732
  }, [selectedValue, setSelectedItemMeasurements, value]);
11833
- return /* @__PURE__ */ jsxs38(
11733
+ return /* @__PURE__ */ jsxs37(
11834
11734
  StyledSegmentedControlItem,
11835
11735
  {
11836
11736
  ref: combinedRef,
@@ -11860,9 +11760,9 @@ import {
11860
11760
  Value,
11861
11761
  ScrollDownButton
11862
11762
  } from "@radix-ui/react-select";
11863
- import { forwardRef as forwardRef25 } from "react";
11763
+ import { forwardRef as forwardRef23 } from "react";
11864
11764
  import styled57 from "styled-components";
11865
- import { jsx as jsx254, jsxs as jsxs39 } from "react/jsx-runtime";
11765
+ import { jsx as jsx253, jsxs as jsxs38 } from "react/jsx-runtime";
11866
11766
  var StyledTrigger = styled57(Trigger3)`
11867
11767
  ${({ $colorScheme }) => getColorScheme($colorScheme)};
11868
11768
  ${inputCssVariables};
@@ -11925,7 +11825,7 @@ var StyledContent3 = styled57(Content3)`
11925
11825
  max-height: var(--radix-select-content-available-height);
11926
11826
  z-index: var(--wui-zindex-select);
11927
11827
  `;
11928
- var Select = forwardRef25(
11828
+ var Select = forwardRef23(
11929
11829
  ({
11930
11830
  colorScheme = "inherit",
11931
11831
  children,
@@ -11935,13 +11835,13 @@ var Select = forwardRef25(
11935
11835
  ...props
11936
11836
  }, forwardedRef) => {
11937
11837
  const responsiveFullWidth = useResponsiveProp(fullWidth);
11938
- return /* @__PURE__ */ jsxs39(
11838
+ return /* @__PURE__ */ jsxs38(
11939
11839
  Root2,
11940
11840
  {
11941
11841
  ...props,
11942
11842
  onValueChange: onChange,
11943
11843
  children: [
11944
- /* @__PURE__ */ jsxs39(
11844
+ /* @__PURE__ */ jsxs38(
11945
11845
  StyledTrigger,
11946
11846
  {
11947
11847
  ref: forwardedRef,
@@ -11949,8 +11849,8 @@ var Select = forwardRef25(
11949
11849
  $fullWidth: responsiveFullWidth,
11950
11850
  ...props,
11951
11851
  children: [
11952
- /* @__PURE__ */ jsx254(Value, { placeholder }),
11953
- /* @__PURE__ */ jsx254(
11852
+ /* @__PURE__ */ jsx253(Value, { placeholder }),
11853
+ /* @__PURE__ */ jsx253(
11954
11854
  Icon,
11955
11855
  {
11956
11856
  size: "md",
@@ -11960,10 +11860,10 @@ var Select = forwardRef25(
11960
11860
  ]
11961
11861
  }
11962
11862
  ),
11963
- /* @__PURE__ */ jsx254(Portal2, { children: /* @__PURE__ */ jsxs39(StyledContent3, { position: "popper", children: [
11964
- /* @__PURE__ */ jsx254(ScrollUpButton, { children: /* @__PURE__ */ jsx254(Icon, { type: "caret-up" }) }),
11965
- /* @__PURE__ */ jsx254(Viewport, { children }),
11966
- /* @__PURE__ */ jsx254(ScrollDownButton, { children: /* @__PURE__ */ jsx254(Icon, { type: "caret-down" }) })
11863
+ /* @__PURE__ */ jsx253(Portal2, { children: /* @__PURE__ */ jsxs38(StyledContent3, { position: "popper", children: [
11864
+ /* @__PURE__ */ jsx253(ScrollUpButton, { children: /* @__PURE__ */ jsx253(Icon, { type: "caret-up" }) }),
11865
+ /* @__PURE__ */ jsx253(Viewport, { children }),
11866
+ /* @__PURE__ */ jsx253(ScrollDownButton, { children: /* @__PURE__ */ jsx253(Icon, { type: "caret-down" }) })
11967
11867
  ] }) })
11968
11868
  ]
11969
11869
  }
@@ -11974,10 +11874,10 @@ Select.displayName = "Select";
11974
11874
 
11975
11875
  // src/components/Select/SelectOption.tsx
11976
11876
  import { Item, ItemText, ItemIndicator } from "@radix-ui/react-select";
11977
- import { forwardRef as forwardRef26 } from "react";
11877
+ import { forwardRef as forwardRef24 } from "react";
11978
11878
  import styled58 from "styled-components";
11979
11879
  import { isNotNil as isNotNil28 } from "@wistia/type-guards";
11980
- import { jsx as jsx255, jsxs as jsxs40 } from "react/jsx-runtime";
11880
+ import { jsx as jsx254, jsxs as jsxs39 } from "react/jsx-runtime";
11981
11881
  var StyledItem = styled58(Item)`
11982
11882
  ${variantStyleMap2.body3};
11983
11883
  display: flex;
@@ -12005,25 +11905,25 @@ var StyledItem = styled58(Item)`
12005
11905
  var StyledIconContainer = styled58.span`
12006
11906
  width: 12px;
12007
11907
  `;
12008
- var SelectOption = forwardRef26(
11908
+ var SelectOption = forwardRef24(
12009
11909
  ({ children, selectedDisplayValue, ...props }, forwardedRef) => {
12010
- return /* @__PURE__ */ jsxs40(
11910
+ return /* @__PURE__ */ jsxs39(
12011
11911
  StyledItem,
12012
11912
  {
12013
11913
  ...props,
12014
11914
  ref: forwardedRef,
12015
11915
  children: [
12016
- /* @__PURE__ */ jsx255(StyledIconContainer, { "data-indicator": true, children: /* @__PURE__ */ jsx255(ItemIndicator, { children: /* @__PURE__ */ jsx255(
11916
+ /* @__PURE__ */ jsx254(StyledIconContainer, { "data-indicator": true, children: /* @__PURE__ */ jsx254(ItemIndicator, { children: /* @__PURE__ */ jsx254(
12017
11917
  Icon,
12018
11918
  {
12019
11919
  size: "sm",
12020
11920
  type: "checkmark"
12021
11921
  }
12022
11922
  ) }) }),
12023
- isNotNil28(selectedDisplayValue) ? /* @__PURE__ */ jsxs40("div", { children: [
11923
+ isNotNil28(selectedDisplayValue) ? /* @__PURE__ */ jsxs39("div", { children: [
12024
11924
  children,
12025
- /* @__PURE__ */ jsx255("div", { style: { display: "none" }, children: /* @__PURE__ */ jsx255(ItemText, { children: selectedDisplayValue }) })
12026
- ] }) : /* @__PURE__ */ jsx255(ItemText, { children })
11925
+ /* @__PURE__ */ jsx254("div", { style: { display: "none" }, children: /* @__PURE__ */ jsx254(ItemText, { children: selectedDisplayValue }) })
11926
+ ] }) : /* @__PURE__ */ jsx254(ItemText, { children })
12027
11927
  ]
12028
11928
  }
12029
11929
  );
@@ -12034,13 +11934,13 @@ SelectOption.displayName = "SelectOption";
12034
11934
  // src/components/Select/SelectOptionGroup.tsx
12035
11935
  import { Group, Label as Label3 } from "@radix-ui/react-select";
12036
11936
  import styled59 from "styled-components";
12037
- import { jsx as jsx256, jsxs as jsxs41 } from "react/jsx-runtime";
11937
+ import { jsx as jsx255, jsxs as jsxs40 } from "react/jsx-runtime";
12038
11938
  var StyledLabel4 = styled59(Label3)`
12039
11939
  padding: var(--wui-select-option-padding);
12040
11940
  `;
12041
11941
  var SelectOptionGroup = ({ children, label, ...props }) => {
12042
- return /* @__PURE__ */ jsxs41(Group, { ...props, children: [
12043
- /* @__PURE__ */ jsx256(StyledLabel4, { children: /* @__PURE__ */ jsx256(
11942
+ return /* @__PURE__ */ jsxs40(Group, { ...props, children: [
11943
+ /* @__PURE__ */ jsx255(StyledLabel4, { children: /* @__PURE__ */ jsx255(
12044
11944
  Text,
12045
11945
  {
12046
11946
  prominence: "secondary",
@@ -12053,10 +11953,10 @@ var SelectOptionGroup = ({ children, label, ...props }) => {
12053
11953
  };
12054
11954
 
12055
11955
  // src/components/Switch/Switch.tsx
12056
- import { forwardRef as forwardRef27, useId as useId4 } from "react";
11956
+ import { forwardRef as forwardRef25, useId as useId4 } from "react";
12057
11957
  import styled60, { css as css36 } from "styled-components";
12058
11958
  import { isNonEmptyString as isNonEmptyString4 } from "@wistia/type-guards";
12059
- import { jsx as jsx257, jsxs as jsxs42 } from "react/jsx-runtime";
11959
+ import { jsx as jsx256, jsxs as jsxs41 } from "react/jsx-runtime";
12060
11960
  var sizeSmall3 = css36`
12061
11961
  --wui-size-small-width: 24px;
12062
11962
  --wui-size-small-height: 14px;
@@ -12158,7 +12058,7 @@ var StyledHiddenSwitchInput = styled60.input`
12158
12058
  }
12159
12059
  }
12160
12060
  `;
12161
- var Switch = forwardRef27(
12061
+ var Switch = forwardRef25(
12162
12062
  ({
12163
12063
  checked,
12164
12064
  disabled = false,
@@ -12175,8 +12075,8 @@ var Switch = forwardRef27(
12175
12075
  }, ref) => {
12176
12076
  const generatedId = useId4();
12177
12077
  const computedId = isNonEmptyString4(id) ? id : `wistia-ui-switch-${generatedId}`;
12178
- return /* @__PURE__ */ jsxs42(StyledSwitchWrapper, { $disabled: disabled, children: [
12179
- /* @__PURE__ */ jsx257(
12078
+ return /* @__PURE__ */ jsxs41(StyledSwitchWrapper, { $disabled: disabled, children: [
12079
+ /* @__PURE__ */ jsx256(
12180
12080
  StyledHiddenSwitchInput,
12181
12081
  {
12182
12082
  ...props,
@@ -12191,10 +12091,10 @@ var Switch = forwardRef27(
12191
12091
  value
12192
12092
  }
12193
12093
  ),
12194
- /* @__PURE__ */ jsx257(
12094
+ /* @__PURE__ */ jsx256(
12195
12095
  FormControlLabel,
12196
12096
  {
12197
- controlSlot: /* @__PURE__ */ jsx257(
12097
+ controlSlot: /* @__PURE__ */ jsx256(
12198
12098
  StyledSwitchInput,
12199
12099
  {
12200
12100
  $disabled: disabled,
@@ -12217,7 +12117,7 @@ Switch.displayName = "Switch";
12217
12117
 
12218
12118
  // src/components/Table/Table.tsx
12219
12119
  import styled61, { css as css37 } from "styled-components";
12220
- import { jsx as jsx258 } from "react/jsx-runtime";
12120
+ import { jsx as jsx257 } from "react/jsx-runtime";
12221
12121
  var StyledTable = styled61.table`
12222
12122
  width: 100%;
12223
12123
  border-collapse: collapse;
@@ -12247,7 +12147,7 @@ var Table = ({
12247
12147
  visuallyHiddenHeader = false,
12248
12148
  ...props
12249
12149
  }) => {
12250
- return /* @__PURE__ */ jsx258(
12150
+ return /* @__PURE__ */ jsx257(
12251
12151
  StyledTable,
12252
12152
  {
12253
12153
  $divided: divided,
@@ -12267,16 +12167,16 @@ import { createContext as createContext9 } from "react";
12267
12167
  var TableSectionContext = createContext9(null);
12268
12168
 
12269
12169
  // src/components/Table/TableBody.tsx
12270
- import { jsx as jsx259 } from "react/jsx-runtime";
12170
+ import { jsx as jsx258 } from "react/jsx-runtime";
12271
12171
  var StyledTableBody = styled62.tbody``;
12272
12172
  var TableBody = ({ children, ...props }) => {
12273
- return /* @__PURE__ */ jsx259(TableSectionContext.Provider, { value: "body", children: /* @__PURE__ */ jsx259(StyledTableBody, { ...props, children }) });
12173
+ return /* @__PURE__ */ jsx258(TableSectionContext.Provider, { value: "body", children: /* @__PURE__ */ jsx258(StyledTableBody, { ...props, children }) });
12274
12174
  };
12275
12175
 
12276
12176
  // src/components/Table/TableCell.tsx
12277
12177
  import { useContext as useContext8 } from "react";
12278
12178
  import styled63, { css as css38 } from "styled-components";
12279
- import { jsx as jsx260 } from "react/jsx-runtime";
12179
+ import { jsx as jsx259 } from "react/jsx-runtime";
12280
12180
  var sharedStyles = css38`
12281
12181
  color: var(--wui-color-text);
12282
12182
  padding: var(--wui-space-02);
@@ -12297,37 +12197,37 @@ var StyledTd = styled63.td`
12297
12197
  var TableCell = ({ children, ...props }) => {
12298
12198
  const section = useContext8(TableSectionContext);
12299
12199
  if (section === "head") {
12300
- return /* @__PURE__ */ jsx260(StyledTh, { ...props, children });
12200
+ return /* @__PURE__ */ jsx259(StyledTh, { ...props, children });
12301
12201
  }
12302
- return /* @__PURE__ */ jsx260(StyledTd, { ...props, children });
12202
+ return /* @__PURE__ */ jsx259(StyledTd, { ...props, children });
12303
12203
  };
12304
12204
 
12305
12205
  // src/components/Table/TableFoot.tsx
12306
12206
  import styled64 from "styled-components";
12307
- import { jsx as jsx261 } from "react/jsx-runtime";
12207
+ import { jsx as jsx260 } from "react/jsx-runtime";
12308
12208
  var StyledTableFoot = styled64.tfoot``;
12309
12209
  var TableFoot = ({ children, ...props }) => {
12310
- return /* @__PURE__ */ jsx261(TableSectionContext.Provider, { value: "footer", children: /* @__PURE__ */ jsx261(StyledTableFoot, { ...props, children }) });
12210
+ return /* @__PURE__ */ jsx260(TableSectionContext.Provider, { value: "footer", children: /* @__PURE__ */ jsx260(StyledTableFoot, { ...props, children }) });
12311
12211
  };
12312
12212
 
12313
12213
  // src/components/Table/TableHead.tsx
12314
12214
  import styled65 from "styled-components";
12315
- import { jsx as jsx262 } from "react/jsx-runtime";
12215
+ import { jsx as jsx261 } from "react/jsx-runtime";
12316
12216
  var StyledThead = styled65.thead``;
12317
12217
  var TableHead = ({ children, ...props }) => {
12318
- return /* @__PURE__ */ jsx262(TableSectionContext.Provider, { value: "head", children: /* @__PURE__ */ jsx262(StyledThead, { ...props, children }) });
12218
+ return /* @__PURE__ */ jsx261(TableSectionContext.Provider, { value: "head", children: /* @__PURE__ */ jsx261(StyledThead, { ...props, children }) });
12319
12219
  };
12320
12220
 
12321
12221
  // src/components/Table/TableRow.tsx
12322
12222
  import styled66 from "styled-components";
12323
- import { jsx as jsx263 } from "react/jsx-runtime";
12223
+ import { jsx as jsx262 } from "react/jsx-runtime";
12324
12224
  var StyledTableRow = styled66.tr``;
12325
12225
  var TableRow = ({ children, ...props }) => {
12326
- return /* @__PURE__ */ jsx263(StyledTableRow, { ...props, children });
12226
+ return /* @__PURE__ */ jsx262(StyledTableRow, { ...props, children });
12327
12227
  };
12328
12228
 
12329
12229
  // src/components/Tabs/Tabs.tsx
12330
- import { forwardRef as forwardRef29, useState as useState15 } from "react";
12230
+ import { forwardRef as forwardRef27, useState as useState15 } from "react";
12331
12231
  import { Root as TabsRoot } from "@radix-ui/react-tabs";
12332
12232
  import { isNotNil as isNotNil30, isNil as isNil14 } from "@wistia/type-guards";
12333
12233
  import styled71 from "styled-components";
@@ -12335,13 +12235,13 @@ import styled71 from "styled-components";
12335
12235
  // src/components/Tabs/TabPanel.tsx
12336
12236
  import styled67 from "styled-components";
12337
12237
  import { Content as TabsContent } from "@radix-ui/react-tabs";
12338
- import { jsx as jsx264 } from "react/jsx-runtime";
12238
+ import { jsx as jsx263 } from "react/jsx-runtime";
12339
12239
  var StyledTabPanel = styled67(TabsContent)`
12340
12240
  display: flex;
12341
12241
  flex-direction: column;
12342
12242
  `;
12343
12243
  var TabPanel = ({ children, value, ...props }) => {
12344
- return /* @__PURE__ */ jsx264(
12244
+ return /* @__PURE__ */ jsx263(
12345
12245
  StyledTabPanel,
12346
12246
  {
12347
12247
  value,
@@ -12355,7 +12255,7 @@ TabPanel.displayName = "TabPanel";
12355
12255
  // src/components/Tabs/TabList.tsx
12356
12256
  import styled68 from "styled-components";
12357
12257
  import { List as RadixTabList } from "@radix-ui/react-tabs";
12358
- import { jsx as jsx265 } from "react/jsx-runtime";
12258
+ import { jsx as jsx264 } from "react/jsx-runtime";
12359
12259
  var StyledTabList = styled68(RadixTabList)`
12360
12260
  ${segmentedControlStyles}
12361
12261
 
@@ -12369,7 +12269,7 @@ var TabList = ({
12369
12269
  ariaLabel,
12370
12270
  ...props
12371
12271
  }) => {
12372
- return /* @__PURE__ */ jsx265(
12272
+ return /* @__PURE__ */ jsx264(
12373
12273
  StyledTabList,
12374
12274
  {
12375
12275
  $fullWidth: fullWidth,
@@ -12382,7 +12282,7 @@ var TabList = ({
12382
12282
  TabList.displayName = "TabList";
12383
12283
 
12384
12284
  // src/components/Tabs/TabItem.tsx
12385
- import { forwardRef as forwardRef28, useEffect as useEffect12, useRef as useRef13 } from "react";
12285
+ import { forwardRef as forwardRef26, useEffect as useEffect12, useRef as useRef13 } from "react";
12386
12286
  import styled69 from "styled-components";
12387
12287
  import { Trigger as RadixTab } from "@radix-ui/react-tabs";
12388
12288
  import { isNotNil as isNotNil29 } from "@wistia/type-guards";
@@ -12400,7 +12300,7 @@ var useTabsValue = () => {
12400
12300
  };
12401
12301
 
12402
12302
  // src/components/Tabs/TabItem.tsx
12403
- import { jsxs as jsxs43 } from "react/jsx-runtime";
12303
+ import { jsxs as jsxs42 } from "react/jsx-runtime";
12404
12304
  var StyledTabItem = styled69(RadixTab)`
12405
12305
  ${segmentedControlItemStyles}
12406
12306
 
@@ -12408,7 +12308,7 @@ var StyledTabItem = styled69(RadixTab)`
12408
12308
  outline: none;
12409
12309
  }
12410
12310
  `;
12411
- var TabItem = forwardRef28(
12311
+ var TabItem = forwardRef26(
12412
12312
  ({ disabled = false, icon, label, "aria-label": ariaLabel, value }, forwardedRef) => {
12413
12313
  const selectedValue = useTabsValue();
12414
12314
  const { setSelectedItemMeasurements } = useSelectedItemStyle();
@@ -12439,7 +12339,7 @@ var TabItem = forwardRef28(
12439
12339
  resizeObserver.disconnect();
12440
12340
  };
12441
12341
  }, [selectedValue, setSelectedItemMeasurements, value]);
12442
- return /* @__PURE__ */ jsxs43(
12342
+ return /* @__PURE__ */ jsxs42(
12443
12343
  StyledTabItem,
12444
12344
  {
12445
12345
  ref: combinedRef,
@@ -12458,10 +12358,10 @@ var TabItem = forwardRef28(
12458
12358
  TabItem.displayName = "TabItem";
12459
12359
 
12460
12360
  // src/components/Tabs/extractTabItems.ts
12461
- import { Children as Children7, Fragment as Fragment7, isValidElement as isValidElement2 } from "react";
12361
+ import { Children as Children6, Fragment as Fragment7, isValidElement as isValidElement2 } from "react";
12462
12362
  var extractTabItems = (children) => {
12463
12363
  const tabItems = [];
12464
- Children7.forEach(children, (child) => {
12364
+ Children6.forEach(children, (child) => {
12465
12365
  if (!isValidElement2(child)) {
12466
12366
  return;
12467
12367
  }
@@ -12481,7 +12381,7 @@ var extractTabItems = (children) => {
12481
12381
 
12482
12382
  // src/components/Tabs/SelectedItemIndicator.tsx
12483
12383
  import styled70 from "styled-components";
12484
- import { jsx as jsx266 } from "react/jsx-runtime";
12384
+ import { jsx as jsx265 } from "react/jsx-runtime";
12485
12385
  var TabsSelectedItemIndicatorDiv = styled70(SelectedItemIndicatorDiv)`
12486
12386
  &:has(~ ${StyledTabItem}:focus-visible) {
12487
12387
  outline: 2px solid var(--wui-color-focus-ring);
@@ -12493,11 +12393,11 @@ var SelectedItemIndicator2 = () => {
12493
12393
  if (selectedValue == null) {
12494
12394
  return null;
12495
12395
  }
12496
- return /* @__PURE__ */ jsx266(TabsSelectedItemIndicatorDiv, { style: selectedItemIndicatorStyle });
12396
+ return /* @__PURE__ */ jsx265(TabsSelectedItemIndicatorDiv, { style: selectedItemIndicatorStyle });
12497
12397
  };
12498
12398
 
12499
12399
  // src/components/Tabs/Tabs.tsx
12500
- import { jsx as jsx267, jsxs as jsxs44 } from "react/jsx-runtime";
12400
+ import { jsx as jsx266, jsxs as jsxs43 } from "react/jsx-runtime";
12501
12401
  var TabsContainer = styled71.div`
12502
12402
  display: flex;
12503
12403
  flex-direction: column;
@@ -12514,7 +12414,7 @@ var StyledTabsRoot = styled71(TabsRoot)`
12514
12414
  flex-direction: column;
12515
12415
  height: ${({ $stickyHeaders }) => $stickyHeaders ? "100%" : "auto"};
12516
12416
  `;
12517
- var Tabs = forwardRef29(
12417
+ var Tabs = forwardRef27(
12518
12418
  ({
12519
12419
  children,
12520
12420
  fullWidth = true,
@@ -12532,7 +12432,7 @@ var Tabs = forwardRef29(
12532
12432
  onValueChange: setInternalSelectedValue
12533
12433
  } : { value: selectedValue, onValueChange: onSelectedValueChange };
12534
12434
  const currentValue = defaultSelectedValue !== void 0 ? internalSelectedValue : selectedValue;
12535
- return /* @__PURE__ */ jsx267(TabsContainer, { $stickyHeaders: stickyHeaders, children: /* @__PURE__ */ jsx267(
12435
+ return /* @__PURE__ */ jsx266(TabsContainer, { $stickyHeaders: stickyHeaders, children: /* @__PURE__ */ jsx266(
12536
12436
  StyledTabsRoot,
12537
12437
  {
12538
12438
  ref,
@@ -12540,14 +12440,14 @@ var Tabs = forwardRef29(
12540
12440
  activationMode: "automatic",
12541
12441
  ...props,
12542
12442
  ...modeProps,
12543
- children: /* @__PURE__ */ jsx267(TabsValueProvider, { value: currentValue, children: /* @__PURE__ */ jsxs44(SelectedItemStyleProvider, { children: [
12544
- /* @__PURE__ */ jsxs44(
12443
+ children: /* @__PURE__ */ jsx266(TabsValueProvider, { value: currentValue, children: /* @__PURE__ */ jsxs43(SelectedItemStyleProvider, { children: [
12444
+ /* @__PURE__ */ jsxs43(
12545
12445
  TabList,
12546
12446
  {
12547
12447
  ariaLabel,
12548
12448
  fullWidth,
12549
12449
  children: [
12550
- /* @__PURE__ */ jsx267(SelectedItemIndicator2, {}),
12450
+ /* @__PURE__ */ jsx266(SelectedItemIndicator2, {}),
12551
12451
  tabItems.map((tab) => {
12552
12452
  const {
12553
12453
  value,
@@ -12557,7 +12457,7 @@ var Tabs = forwardRef29(
12557
12457
  "aria-label": ariaLabelForTab
12558
12458
  } = tab.props;
12559
12459
  if (isNil14(icon)) {
12560
- return /* @__PURE__ */ jsx267(
12460
+ return /* @__PURE__ */ jsx266(
12561
12461
  TabItem,
12562
12462
  {
12563
12463
  disabled,
@@ -12568,7 +12468,7 @@ var Tabs = forwardRef29(
12568
12468
  );
12569
12469
  }
12570
12470
  if (isNotNil30(label)) {
12571
- return /* @__PURE__ */ jsx267(
12471
+ return /* @__PURE__ */ jsx266(
12572
12472
  TabItem,
12573
12473
  {
12574
12474
  disabled,
@@ -12580,7 +12480,7 @@ var Tabs = forwardRef29(
12580
12480
  );
12581
12481
  }
12582
12482
  if (isNotNil30(ariaLabelForTab)) {
12583
- return /* @__PURE__ */ jsx267(
12483
+ return /* @__PURE__ */ jsx266(
12584
12484
  TabItem,
12585
12485
  {
12586
12486
  "aria-label": ariaLabelForTab,
@@ -12596,7 +12496,7 @@ var Tabs = forwardRef29(
12596
12496
  ]
12597
12497
  }
12598
12498
  ),
12599
- /* @__PURE__ */ jsx267(StickyTabContent, { $stickyHeaders: stickyHeaders, children: tabItems.map((tab) => /* @__PURE__ */ jsx267(
12499
+ /* @__PURE__ */ jsx266(StickyTabContent, { $stickyHeaders: stickyHeaders, children: tabItems.map((tab) => /* @__PURE__ */ jsx266(
12600
12500
  TabPanel,
12601
12501
  {
12602
12502
  value: tab.props.value,
@@ -12612,18 +12512,18 @@ var Tabs = forwardRef29(
12612
12512
  Tabs.displayName = "Tabs";
12613
12513
 
12614
12514
  // src/components/Tabs/Tab.tsx
12615
- import { forwardRef as forwardRef30 } from "react";
12616
- import { jsx as jsx268 } from "react/jsx-runtime";
12617
- var Tab = forwardRef30(({ children }, ref) => {
12618
- return /* @__PURE__ */ jsx268("div", { ref, children });
12515
+ import { forwardRef as forwardRef28 } from "react";
12516
+ import { jsx as jsx267 } from "react/jsx-runtime";
12517
+ var Tab = forwardRef28(({ children }, ref) => {
12518
+ return /* @__PURE__ */ jsx267("div", { ref, children });
12619
12519
  });
12620
12520
  Tab.displayName = "Tab";
12621
12521
 
12622
12522
  // src/components/Tag/Tag.tsx
12623
- import { forwardRef as forwardRef31 } from "react";
12523
+ import { forwardRef as forwardRef29 } from "react";
12624
12524
  import styled72 from "styled-components";
12625
12525
  import { isNil as isNil15, isNotNil as isNotNil31, isNonEmptyString as isNonEmptyString5 } from "@wistia/type-guards";
12626
- import { Fragment as Fragment8, jsx as jsx269, jsxs as jsxs45 } from "react/jsx-runtime";
12526
+ import { Fragment as Fragment8, jsx as jsx268, jsxs as jsxs44 } from "react/jsx-runtime";
12627
12527
  var TagLabel = styled72.a`
12628
12528
  ${({ $colorScheme }) => getColorScheme($colorScheme)};
12629
12529
  font-size: var(--wui-typography-label-4-size);
@@ -12715,40 +12615,40 @@ var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
12715
12615
  "for accessibility, onClickRemoveLabel must be provided if onClickRemove is provided"
12716
12616
  );
12717
12617
  }
12718
- return /* @__PURE__ */ jsxs45(Fragment8, { children: [
12719
- /* @__PURE__ */ jsx269(TagDivider, { $colorScheme: colorScheme }),
12720
- /* @__PURE__ */ jsxs45(
12618
+ return /* @__PURE__ */ jsxs44(Fragment8, { children: [
12619
+ /* @__PURE__ */ jsx268(TagDivider, { $colorScheme: colorScheme }),
12620
+ /* @__PURE__ */ jsxs44(
12721
12621
  StyledRemoveButton,
12722
12622
  {
12723
12623
  $colorScheme: colorScheme,
12724
12624
  onClick: onClickRemove,
12725
12625
  type: "button",
12726
12626
  children: [
12727
- /* @__PURE__ */ jsx269(
12627
+ /* @__PURE__ */ jsx268(
12728
12628
  Icon,
12729
12629
  {
12730
12630
  size: "sm",
12731
12631
  type: "close"
12732
12632
  }
12733
12633
  ),
12734
- /* @__PURE__ */ jsx269(ScreenReaderOnly, { children: onClickRemoveLabel })
12634
+ /* @__PURE__ */ jsx268(ScreenReaderOnly, { children: onClickRemoveLabel })
12735
12635
  ]
12736
12636
  }
12737
12637
  )
12738
12638
  ] });
12739
12639
  };
12740
- var Tag = forwardRef31(
12640
+ var Tag = forwardRef29(
12741
12641
  ({ onClickRemove, colorScheme = "inherit", href, icon, label, onClickRemoveLabel, ...props }, ref) => {
12742
12642
  const hasIcon = isNotNil31(icon);
12743
12643
  const labelProps = isNotNil31(href) && isNonEmptyString5(href) ? { href, as: "a" } : { as: "span" };
12744
- return /* @__PURE__ */ jsxs45(
12644
+ return /* @__PURE__ */ jsxs44(
12745
12645
  StyledTag,
12746
12646
  {
12747
12647
  ref,
12748
12648
  $colorScheme: colorScheme,
12749
12649
  ...props,
12750
12650
  children: [
12751
- /* @__PURE__ */ jsxs45(
12651
+ /* @__PURE__ */ jsxs44(
12752
12652
  TagLabel,
12753
12653
  {
12754
12654
  ...labelProps,
@@ -12759,7 +12659,7 @@ var Tag = forwardRef31(
12759
12659
  ]
12760
12660
  }
12761
12661
  ),
12762
- /* @__PURE__ */ jsx269(
12662
+ /* @__PURE__ */ jsx268(
12763
12663
  RemoveButton,
12764
12664
  {
12765
12665
  colorScheme,
@@ -12777,7 +12677,7 @@ Tag.displayName = "Tag";
12777
12677
  // src/components/Thumbnail/ThumbnailBadge.tsx
12778
12678
  import styled73 from "styled-components";
12779
12679
  import { isNotNil as isNotNil32 } from "@wistia/type-guards";
12780
- import { jsx as jsx270, jsxs as jsxs46 } from "react/jsx-runtime";
12680
+ import { jsx as jsx269, jsxs as jsxs45 } from "react/jsx-runtime";
12781
12681
  var StyledThumbnailBadge = styled73.div`
12782
12682
  align-items: center;
12783
12683
  background-color: rgb(0 0 0 / 50%);
@@ -12803,15 +12703,15 @@ var StyledThumbnailBadge = styled73.div`
12803
12703
  }
12804
12704
  `;
12805
12705
  var ThumbnailBadge = ({ icon, label, ...props }) => {
12806
- return /* @__PURE__ */ jsxs46(StyledThumbnailBadge, { ...props, children: [
12706
+ return /* @__PURE__ */ jsxs45(StyledThumbnailBadge, { ...props, children: [
12807
12707
  isNotNil32(icon) && icon,
12808
- /* @__PURE__ */ jsx270("span", { children: label })
12708
+ /* @__PURE__ */ jsx269("span", { children: label })
12809
12709
  ] });
12810
12710
  };
12811
12711
  ThumbnailBadge.displayName = "ThumbnailBadge";
12812
12712
 
12813
12713
  // src/components/Thumbnail/Thumbnail.tsx
12814
- import { forwardRef as forwardRef32, useState as useState16, useRef as useRef14, useCallback as useCallback10, useMemo as useMemo9 } from "react";
12714
+ import { forwardRef as forwardRef30, useState as useState16, useRef as useRef14, useCallback as useCallback10, useMemo as useMemo9 } from "react";
12815
12715
  import styled74 from "styled-components";
12816
12716
  import { isNil as isNil16, isNotNil as isNotNil34, isUndefined as isUndefined5, isEmptyString as isEmptyString2, isString as isString2 } from "@wistia/type-guards";
12817
12717
 
@@ -12948,7 +12848,7 @@ var getBackgroundGradient = (gradientName = void 0) => {
12948
12848
  };
12949
12849
 
12950
12850
  // src/components/Thumbnail/ThumbnailStoryboardViewer.tsx
12951
- import { jsx as jsx271 } from "react/jsx-runtime";
12851
+ import { jsx as jsx270 } from "react/jsx-runtime";
12952
12852
  var getScaledDimensions = (originalAspectRatio, targetAspectRatio, viewerWidth, viewerHeight) => {
12953
12853
  let scaledHeight = viewerHeight;
12954
12854
  let scaledWidth = viewerWidth;
@@ -13041,18 +12941,18 @@ var ThumbnailStoryboardViewer = ({
13041
12941
  backgroundPosition,
13042
12942
  backgroundSize
13043
12943
  };
13044
- return /* @__PURE__ */ jsx271(
12944
+ return /* @__PURE__ */ jsx270(
13045
12945
  "div",
13046
12946
  {
13047
12947
  ...props,
13048
12948
  style: viewerStyles,
13049
- children: /* @__PURE__ */ jsx271("div", { style: storyboardStyles })
12949
+ children: /* @__PURE__ */ jsx270("div", { style: storyboardStyles })
13050
12950
  }
13051
12951
  );
13052
12952
  };
13053
12953
 
13054
12954
  // src/components/Thumbnail/Thumbnail.tsx
13055
- import { jsx as jsx272, jsxs as jsxs47 } from "react/jsx-runtime";
12955
+ import { jsx as jsx271, jsxs as jsxs46 } from "react/jsx-runtime";
13056
12956
  var WideThumbnailImage = styled74.img`
13057
12957
  height: 100%;
13058
12958
  object-fit: cover;
@@ -13065,7 +12965,7 @@ var SquareThumbnailImage = styled74.img`
13065
12965
  `;
13066
12966
  var ThumbnailImage = ({ thumbnailImageType, thumbnailUrl }) => {
13067
12967
  if (thumbnailImageType === "wide") {
13068
- return /* @__PURE__ */ jsx272(
12968
+ return /* @__PURE__ */ jsx271(
13069
12969
  WideThumbnailImage,
13070
12970
  {
13071
12971
  alt: "",
@@ -13074,7 +12974,7 @@ var ThumbnailImage = ({ thumbnailImageType, thumbnailUrl }) => {
13074
12974
  }
13075
12975
  );
13076
12976
  }
13077
- return /* @__PURE__ */ jsx272(
12977
+ return /* @__PURE__ */ jsx271(
13078
12978
  SquareThumbnailImage,
13079
12979
  {
13080
12980
  alt: "",
@@ -13112,7 +13012,7 @@ var getRelativeMousePosition = (elem, mouseEvent) => {
13112
13012
  left: relativeLeft
13113
13013
  };
13114
13014
  };
13115
- var Thumbnail = forwardRef32(
13015
+ var Thumbnail = forwardRef30(
13116
13016
  ({
13117
13017
  gradientBackground = "defaultMidOne",
13118
13018
  thumbnailImageType = "square",
@@ -13173,7 +13073,7 @@ var Thumbnail = forwardRef32(
13173
13073
  aspectRatio
13174
13074
  } = storyboard;
13175
13075
  const targetWidth = isString2(width) ? parseInt(width, 10) : Number(width);
13176
- return /* @__PURE__ */ jsx272(
13076
+ return /* @__PURE__ */ jsx271(
13177
13077
  ThumbnailStoryboardViewer,
13178
13078
  {
13179
13079
  frameCount,
@@ -13192,7 +13092,7 @@ var Thumbnail = forwardRef32(
13192
13092
  if (shouldRenderStoryboard) {
13193
13093
  thumbnailContent = renderStoryboard();
13194
13094
  } else if (isNotNil34(thumbnailUrl)) {
13195
- thumbnailContent = /* @__PURE__ */ jsx272(
13095
+ thumbnailContent = /* @__PURE__ */ jsx271(
13196
13096
  ThumbnailImage,
13197
13097
  {
13198
13098
  thumbnailImageType,
@@ -13202,7 +13102,7 @@ var Thumbnail = forwardRef32(
13202
13102
  } else {
13203
13103
  thumbnailContent = null;
13204
13104
  }
13205
- return /* @__PURE__ */ jsxs47(
13105
+ return /* @__PURE__ */ jsxs46(
13206
13106
  StyledThumbnail,
13207
13107
  {
13208
13108
  ref,
@@ -13229,7 +13129,7 @@ Thumbnail.displayName = "Thumbnail";
13229
13129
  import React2 from "react";
13230
13130
  import styled75 from "styled-components";
13231
13131
  import { isNonEmptyArray } from "@wistia/type-guards";
13232
- import { jsx as jsx273 } from "react/jsx-runtime";
13132
+ import { jsx as jsx272 } from "react/jsx-runtime";
13233
13133
  var StyledThumbnailCollage = styled75.div`
13234
13134
  display: grid;
13235
13135
  gap: var(--wui-space-01);
@@ -13312,7 +13212,7 @@ var ThumbnailCollage = ({
13312
13212
  });
13313
13213
  }) : [
13314
13214
  // ThumbnailCollage will fallback to a Thumbnail with a gradient background if no children are provided
13315
- /* @__PURE__ */ jsx273(
13215
+ /* @__PURE__ */ jsx272(
13316
13216
  Thumbnail,
13317
13217
  {
13318
13218
  gradientBackground,
@@ -13321,7 +13221,7 @@ var ThumbnailCollage = ({
13321
13221
  "fallback"
13322
13222
  )
13323
13223
  ];
13324
- return /* @__PURE__ */ jsx273(
13224
+ return /* @__PURE__ */ jsx272(
13325
13225
  StyledThumbnailCollage,
13326
13226
  {
13327
13227
  $gradientBackground: gradientBackground,
@@ -13335,24 +13235,24 @@ var ThumbnailCollage = ({
13335
13235
  // src/components/WistiaLogo/WistiaLogo.tsx
13336
13236
  import styled76, { css as css40 } from "styled-components";
13337
13237
  import { isNotNil as isNotNil35 } from "@wistia/type-guards";
13338
- import { jsx as jsx274, jsxs as jsxs48 } from "react/jsx-runtime";
13238
+ import { jsx as jsx273, jsxs as jsxs47 } from "react/jsx-runtime";
13339
13239
  var renderBrandmark = (brandmarkColor, iconOnly) => {
13340
13240
  if (iconOnly) {
13341
- return /* @__PURE__ */ jsx274(
13241
+ return /* @__PURE__ */ jsx273(
13342
13242
  "g",
13343
13243
  {
13344
13244
  "data-testid": "ui-wistia-logo-brandmark",
13345
13245
  fill: brandmarkColor,
13346
- children: /* @__PURE__ */ jsx274("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" })
13246
+ children: /* @__PURE__ */ jsx273("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" })
13347
13247
  }
13348
13248
  );
13349
13249
  }
13350
- return /* @__PURE__ */ jsx274(
13250
+ return /* @__PURE__ */ jsx273(
13351
13251
  "g",
13352
13252
  {
13353
13253
  "data-testid": "ui-wistia-logo-brandmark",
13354
13254
  fill: brandmarkColor,
13355
- children: /* @__PURE__ */ jsx274("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" })
13255
+ children: /* @__PURE__ */ jsx273("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" })
13356
13256
  }
13357
13257
  );
13358
13258
  };
@@ -13360,12 +13260,12 @@ var renderLogotype = (logotypeColor, iconOnly) => {
13360
13260
  if (iconOnly) {
13361
13261
  return null;
13362
13262
  }
13363
- return /* @__PURE__ */ jsx274(
13263
+ return /* @__PURE__ */ jsx273(
13364
13264
  "g",
13365
13265
  {
13366
13266
  "data-testid": "ui-wistia-logo-logotype",
13367
13267
  fill: logotypeColor,
13368
- children: /* @__PURE__ */ jsx274("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" })
13268
+ children: /* @__PURE__ */ jsx273("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" })
13369
13269
  }
13370
13270
  );
13371
13271
  };
@@ -13433,7 +13333,7 @@ var WistiaLogo = ({
13433
13333
  };
13434
13334
  const brandmarkColor = VARIANT_COLORS[variant].brandmark;
13435
13335
  const logotypeColor = VARIANT_COLORS[variant].logotype;
13436
- const Logo = /* @__PURE__ */ jsxs48(
13336
+ const Logo = /* @__PURE__ */ jsxs47(
13437
13337
  WistiaLogoComponent,
13438
13338
  {
13439
13339
  $hoverColor: hoverColor,
@@ -13446,14 +13346,14 @@ var WistiaLogo = ({
13446
13346
  xmlns: "http://www.w3.org/2000/svg",
13447
13347
  ...props,
13448
13348
  children: [
13449
- /* @__PURE__ */ jsx274("title", { children: title }),
13450
- isNotNil35(description) ? /* @__PURE__ */ jsx274("desc", { children: description }) : null,
13349
+ /* @__PURE__ */ jsx273("title", { children: title }),
13350
+ isNotNil35(description) ? /* @__PURE__ */ jsx273("desc", { children: description }) : null,
13451
13351
  renderBrandmark(brandmarkColor, iconOnly),
13452
13352
  renderLogotype(logotypeColor, iconOnly)
13453
13353
  ]
13454
13354
  }
13455
13355
  );
13456
- return href !== void 0 ? /* @__PURE__ */ jsx274("a", { href, children: Logo }) : Logo;
13356
+ return href !== void 0 ? /* @__PURE__ */ jsx273("a", { href, children: Logo }) : Logo;
13457
13357
  };
13458
13358
  WistiaLogo.displayName = "WistiaLogo";
13459
13359
 
@@ -13464,7 +13364,7 @@ import styled78, { css as css41 } from "styled-components";
13464
13364
  // src/components/List/ListItem.tsx
13465
13365
  import styled77 from "styled-components";
13466
13366
  import { isNil as isNil17 } from "@wistia/type-guards";
13467
- import { jsx as jsx275 } from "react/jsx-runtime";
13367
+ import { jsx as jsx274 } from "react/jsx-runtime";
13468
13368
  var ListItemComponent = styled77.li`
13469
13369
  margin-bottom: var(--wui-space-02);
13470
13370
  `;
@@ -13472,12 +13372,12 @@ var ListItem = ({ children }) => {
13472
13372
  if (isNil17(children)) {
13473
13373
  return null;
13474
13374
  }
13475
- return /* @__PURE__ */ jsx275(ListItemComponent, { children });
13375
+ return /* @__PURE__ */ jsx274(ListItemComponent, { children });
13476
13376
  };
13477
13377
  ListItem.displayName = "ListItem";
13478
13378
 
13479
13379
  // src/components/List/List.tsx
13480
- import { jsx as jsx276, jsxs as jsxs49 } from "react/jsx-runtime";
13380
+ import { jsx as jsx275, jsxs as jsxs48 } from "react/jsx-runtime";
13481
13381
  var spacesStyle = css41`
13482
13382
  overflow: hidden;
13483
13383
  padding-left: 0;
@@ -13563,7 +13463,7 @@ var ListComponent = styled78.ul`
13563
13463
  `;
13564
13464
  var renderListComponent = (listItems, variant, { ...otherProps }) => {
13565
13465
  const elementType = variant === "ordered" ? "ol" : "ul";
13566
- return /* @__PURE__ */ jsx276(
13466
+ return /* @__PURE__ */ jsx275(
13567
13467
  ListComponent,
13568
13468
  {
13569
13469
  as: elementType,
@@ -13580,7 +13480,7 @@ var renderListFromArray = (listItems, variant, otherProps) => {
13580
13480
  const nextItem = listItems[i + 1];
13581
13481
  const key = `item-${itemCount += 1}`;
13582
13482
  if (Array.isArray(nextItem)) {
13583
- return /* @__PURE__ */ jsxs49(ListItem, { children: [
13483
+ return /* @__PURE__ */ jsxs48(ListItem, { children: [
13584
13484
  item,
13585
13485
  renderListFromArray(nextItem, variant, otherProps)
13586
13486
  ] }, key);
@@ -13588,7 +13488,7 @@ var renderListFromArray = (listItems, variant, otherProps) => {
13588
13488
  if (Array.isArray(item)) {
13589
13489
  return null;
13590
13490
  }
13591
- return /* @__PURE__ */ jsx276(ListItem, { children: item }, key);
13491
+ return /* @__PURE__ */ jsx275(ListItem, { children: item }, key);
13592
13492
  });
13593
13493
  return renderListComponent(items, variant, otherProps);
13594
13494
  };
@@ -13642,8 +13542,6 @@ export {
13642
13542
  FileAmountLimitValidator,
13643
13543
  FileSizeValidator,
13644
13544
  FileTypeValidator,
13645
- FilterMenu,
13646
- FilterMenuItem,
13647
13545
  Form,
13648
13546
  FormErrorSummary,
13649
13547
  FormField,