@wistia/ui 0.8.5-beta.7902c369.c4c8fbc → 0.8.5

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.cjs CHANGED
@@ -1,6 +1,6 @@
1
1
 
2
2
  /*
3
- * @license @wistia/ui v0.8.5-beta.7902c369.c4c8fbc
3
+ * @license @wistia/ui v0.8.5
4
4
  *
5
5
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
6
6
  *
@@ -10469,7 +10469,6 @@ RadioMenuItem.displayName = "RadioMenuItem";
10469
10469
 
10470
10470
  // src/components/Menu/CheckboxMenuItem.tsx
10471
10471
  var import_react_dropdown_menu7 = require("@radix-ui/react-dropdown-menu");
10472
- var import_type_guards38 = require("@wistia/type-guards");
10473
10472
  var import_jsx_runtime238 = require("react/jsx-runtime");
10474
10473
  var CheckboxIndicator = ({ checked, ...props }) => {
10475
10474
  return checked ? /* @__PURE__ */ (0, import_jsx_runtime238.jsxs)(
@@ -10543,8 +10542,7 @@ var CheckboxMenuItem = ({
10543
10542
  MenuItemButton,
10544
10543
  {
10545
10544
  ...props,
10546
- leftIcon: (0, import_type_guards38.isNotNil)(props.icon) ? props.icon : /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(CheckboxIndicator, { checked }),
10547
- rightIcon: (0, import_type_guards38.isNotNil)(props.icon) ? /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(import_react_dropdown_menu7.DropdownMenuItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(Icon, { type: "checkmark" }) }) : void 0
10545
+ leftIcon: /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(CheckboxIndicator, { checked })
10548
10546
  }
10549
10547
  )
10550
10548
  }
@@ -10556,7 +10554,7 @@ CheckboxMenuItem.displayName = "CheckboxMenuItem";
10556
10554
  var import_react47 = require("react");
10557
10555
  var import_styled_components63 = __toESM(require("styled-components"));
10558
10556
  var import_react_dialog4 = require("@radix-ui/react-dialog");
10559
- var import_type_guards40 = require("@wistia/type-guards");
10557
+ var import_type_guards39 = require("@wistia/type-guards");
10560
10558
 
10561
10559
  // src/components/Modal/ModalHeader.tsx
10562
10560
  var import_styled_components60 = __toESM(require("styled-components"));
@@ -10619,7 +10617,7 @@ var import_react_dialog3 = require("@radix-ui/react-dialog");
10619
10617
 
10620
10618
  // src/private/hooks/useFocusRestore/useFocusRestore.ts
10621
10619
  var import_react44 = require("react");
10622
- var import_type_guards39 = require("@wistia/type-guards");
10620
+ var import_type_guards38 = require("@wistia/type-guards");
10623
10621
  var useFocusRestore = () => {
10624
10622
  const previouslyFocusedRef = (0, import_react44.useRef)(null);
10625
10623
  (0, import_react44.useEffect)(() => {
@@ -10627,7 +10625,7 @@ var useFocusRestore = () => {
10627
10625
  }, []);
10628
10626
  (0, import_react44.useEffect)(() => {
10629
10627
  return () => {
10630
- if ((0, import_type_guards39.isNotNil)(previouslyFocusedRef.current)) {
10628
+ if ((0, import_type_guards38.isNotNil)(previouslyFocusedRef.current)) {
10631
10629
  setTimeout(() => {
10632
10630
  previouslyFocusedRef.current?.focus();
10633
10631
  }, 0);
@@ -10774,7 +10772,7 @@ var Modal = (0, import_react47.forwardRef)(
10774
10772
  import_react_dialog4.Root,
10775
10773
  {
10776
10774
  onOpenChange: (open2) => {
10777
- if (!open2 && (0, import_type_guards40.isNotNil)(onRequestClose)) {
10775
+ if (!open2 && (0, import_type_guards39.isNotNil)(onRequestClose)) {
10778
10776
  onRequestClose();
10779
10777
  }
10780
10778
  },
@@ -10787,7 +10785,7 @@ var Modal = (0, import_react47.forwardRef)(
10787
10785
  ref,
10788
10786
  fullHeight,
10789
10787
  onOpenAutoFocus: (event) => {
10790
- if ((0, import_type_guards40.isNotNil)(initialFocusRef) && initialFocusRef.current) {
10788
+ if ((0, import_type_guards39.isNotNil)(initialFocusRef) && initialFocusRef.current) {
10791
10789
  event.preventDefault();
10792
10790
  requestAnimationFrame(() => {
10793
10791
  initialFocusRef.current?.focus();
@@ -10821,9 +10819,9 @@ var import_react_popover = require("@radix-ui/react-popover");
10821
10819
  var import_styled_components64 = __toESM(require("styled-components"));
10822
10820
 
10823
10821
  // src/private/helpers/getControls/getControlProps.tsx
10824
- var import_type_guards41 = require("@wistia/type-guards");
10822
+ var import_type_guards40 = require("@wistia/type-guards");
10825
10823
  var getControlProps = (isOpen, onOpenChange) => {
10826
- return (0, import_type_guards41.isNotNil)(onOpenChange) && (0, import_type_guards41.isNotNil)(isOpen) ? { open: isOpen, onOpenChange } : {};
10824
+ return (0, import_type_guards40.isNotNil)(onOpenChange) && (0, import_type_guards40.isNotNil)(isOpen) ? { open: isOpen, onOpenChange } : {};
10827
10825
  };
10828
10826
 
10829
10827
  // src/components/Popover/Popover.tsx
@@ -10894,7 +10892,7 @@ Popover.displayName = "Popover";
10894
10892
  // src/components/ProgressBar/ProgressBar.tsx
10895
10893
  var import_styled_components65 = __toESM(require("styled-components"));
10896
10894
  var import_react_progress = require("@radix-ui/react-progress");
10897
- var import_type_guards42 = require("@wistia/type-guards");
10895
+ var import_type_guards41 = require("@wistia/type-guards");
10898
10896
  var import_jsx_runtime245 = require("react/jsx-runtime");
10899
10897
  var ProgressBarWrapper = import_styled_components65.default.div`
10900
10898
  --progress-bar-height: 8px;
@@ -10949,7 +10947,7 @@ var ProgressBar = ({
10949
10947
  ...props
10950
10948
  }) => {
10951
10949
  return /* @__PURE__ */ (0, import_jsx_runtime245.jsxs)(ProgressBarWrapper, { children: [
10952
- (0, import_type_guards42.isNotNil)(labelLeft) ? /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(ProgressBarLabel, { children: labelLeft }) : null,
10950
+ (0, import_type_guards41.isNotNil)(labelLeft) ? /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(ProgressBarLabel, { children: labelLeft }) : null,
10953
10951
  /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(
10954
10952
  StyledProgressBar,
10955
10953
  {
@@ -10965,7 +10963,7 @@ var ProgressBar = ({
10965
10963
  )
10966
10964
  }
10967
10965
  ),
10968
- (0, import_type_guards42.isNotNil)(labelRight) ? /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(ProgressBarLabel, { children: labelRight }) : null
10966
+ (0, import_type_guards41.isNotNil)(labelRight) ? /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(ProgressBarLabel, { children: labelRight }) : null
10969
10967
  ] });
10970
10968
  };
10971
10969
  ProgressBar.displayName = "ProgressBar";
@@ -10973,7 +10971,7 @@ ProgressBar.displayName = "ProgressBar";
10973
10971
  // src/components/Radio/Radio.tsx
10974
10972
  var import_react48 = require("react");
10975
10973
  var import_styled_components66 = __toESM(require("styled-components"));
10976
- var import_type_guards43 = require("@wistia/type-guards");
10974
+ var import_type_guards42 = require("@wistia/type-guards");
10977
10975
  var import_jsx_runtime246 = require("react/jsx-runtime");
10978
10976
  var RadioIcon = () => /* @__PURE__ */ (0, import_jsx_runtime246.jsx)(
10979
10977
  "svg",
@@ -11090,7 +11088,7 @@ var Radio = (0, import_react48.forwardRef)(
11090
11088
  ...props
11091
11089
  }, ref) => {
11092
11090
  const generatedId = (0, import_react48.useId)();
11093
- const computedId = (0, import_type_guards43.isNonEmptyString)(id) ? id : `wistia-ui-radio-${generatedId}`;
11091
+ const computedId = (0, import_type_guards42.isNonEmptyString)(id) ? id : `wistia-ui-radio-${generatedId}`;
11094
11092
  return /* @__PURE__ */ (0, import_jsx_runtime246.jsxs)(
11095
11093
  StyledRadioWrapper,
11096
11094
  {
@@ -11142,7 +11140,7 @@ Radio.displayName = "Radio";
11142
11140
  var import_react52 = require("react");
11143
11141
  var import_styled_components68 = __toESM(require("styled-components"));
11144
11142
  var import_react_toggle_group = require("@radix-ui/react-toggle-group");
11145
- var import_type_guards44 = require("@wistia/type-guards");
11143
+ var import_type_guards43 = require("@wistia/type-guards");
11146
11144
 
11147
11145
  // src/components/SegmentedControl/useSelectedItemMeasurements.tsx
11148
11146
  var import_react49 = require("react");
@@ -11253,7 +11251,7 @@ var SegmentedControl = (0, import_react52.forwardRef)(
11253
11251
  onSelectedValueChange,
11254
11252
  ...props
11255
11253
  }, ref) => {
11256
- if ((0, import_type_guards44.isNil)(children)) {
11254
+ if ((0, import_type_guards43.isNil)(children)) {
11257
11255
  return null;
11258
11256
  }
11259
11257
  return /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
@@ -11282,7 +11280,7 @@ SegmentedControl.displayName = "SegmentedControl";
11282
11280
  var import_react53 = require("react");
11283
11281
  var import_styled_components69 = __toESM(require("styled-components"));
11284
11282
  var import_react_toggle_group2 = require("@radix-ui/react-toggle-group");
11285
- var import_type_guards45 = require("@wistia/type-guards");
11283
+ var import_type_guards44 = require("@wistia/type-guards");
11286
11284
  var import_jsx_runtime250 = require("react/jsx-runtime");
11287
11285
  var segmentedControlItemStyles = import_styled_components69.css`
11288
11286
  all: unset; /* ToggleGroupItem is a button element */
@@ -11389,8 +11387,8 @@ var SegmentedControlItem = (0, import_react53.forwardRef)(
11389
11387
  StyledSegmentedControlItem,
11390
11388
  {
11391
11389
  ref: combinedRef,
11392
- $hasLabel: (0, import_type_guards45.isNotNil)(label),
11393
- "aria-label": (0, import_type_guards45.isNotNil)(label) ? void 0 : ariaLabel,
11390
+ $hasLabel: (0, import_type_guards44.isNotNil)(label),
11391
+ "aria-label": (0, import_type_guards44.isNotNil)(label) ? void 0 : ariaLabel,
11394
11392
  disabled,
11395
11393
  onClick: handleClick,
11396
11394
  value,
@@ -11522,7 +11520,7 @@ Select.displayName = "Select";
11522
11520
  var import_react_select2 = require("@radix-ui/react-select");
11523
11521
  var import_react55 = require("react");
11524
11522
  var import_styled_components71 = __toESM(require("styled-components"));
11525
- var import_type_guards46 = require("@wistia/type-guards");
11523
+ var import_type_guards45 = require("@wistia/type-guards");
11526
11524
  var import_jsx_runtime252 = require("react/jsx-runtime");
11527
11525
  var StyledItem = (0, import_styled_components71.default)(import_react_select2.Item)`
11528
11526
  ${variantStyleMap2.body3};
@@ -11566,7 +11564,7 @@ var SelectOption = (0, import_react55.forwardRef)(
11566
11564
  type: "checkmark"
11567
11565
  }
11568
11566
  ) }) }),
11569
- (0, import_type_guards46.isNotNil)(selectedDisplayValue) ? /* @__PURE__ */ (0, import_jsx_runtime252.jsxs)("div", { children: [
11567
+ (0, import_type_guards45.isNotNil)(selectedDisplayValue) ? /* @__PURE__ */ (0, import_jsx_runtime252.jsxs)("div", { children: [
11570
11568
  children,
11571
11569
  /* @__PURE__ */ (0, import_jsx_runtime252.jsx)("div", { style: { display: "none" }, children: /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(import_react_select2.ItemText, { children: selectedDisplayValue }) })
11572
11570
  ] }) : /* @__PURE__ */ (0, import_jsx_runtime252.jsx)(import_react_select2.ItemText, { children })
@@ -11601,7 +11599,7 @@ var SelectOptionGroup = ({ children, label, ...props }) => {
11601
11599
  // src/components/Switch/Switch.tsx
11602
11600
  var import_react56 = require("react");
11603
11601
  var import_styled_components73 = __toESM(require("styled-components"));
11604
- var import_type_guards47 = require("@wistia/type-guards");
11602
+ var import_type_guards46 = require("@wistia/type-guards");
11605
11603
  var import_jsx_runtime254 = require("react/jsx-runtime");
11606
11604
  var sizeSmall3 = import_styled_components73.css`
11607
11605
  --wui-size-small-width: 24px;
@@ -11720,7 +11718,7 @@ var Switch = (0, import_react56.forwardRef)(
11720
11718
  ...props
11721
11719
  }, ref) => {
11722
11720
  const generatedId = (0, import_react56.useId)();
11723
- const computedId = (0, import_type_guards47.isNonEmptyString)(id) ? id : `wistia-ui-switch-${generatedId}`;
11721
+ const computedId = (0, import_type_guards46.isNonEmptyString)(id) ? id : `wistia-ui-switch-${generatedId}`;
11724
11722
  return /* @__PURE__ */ (0, import_jsx_runtime254.jsxs)(StyledSwitchWrapper, { $disabled: disabled, children: [
11725
11723
  /* @__PURE__ */ (0, import_jsx_runtime254.jsx)(
11726
11724
  StyledHiddenSwitchInput,
@@ -11867,7 +11865,7 @@ var TableRow = ({ children, ...props }) => {
11867
11865
  // src/components/Tabs/Tabs.tsx
11868
11866
  var import_react63 = require("react");
11869
11867
  var import_react_tabs4 = require("@radix-ui/react-tabs");
11870
- var import_type_guards49 = require("@wistia/type-guards");
11868
+ var import_type_guards48 = require("@wistia/type-guards");
11871
11869
  var import_styled_components84 = __toESM(require("styled-components"));
11872
11870
 
11873
11871
  // src/components/Tabs/TabPanel.tsx
@@ -11923,7 +11921,7 @@ TabList.displayName = "TabList";
11923
11921
  var import_react60 = require("react");
11924
11922
  var import_styled_components82 = __toESM(require("styled-components"));
11925
11923
  var import_react_tabs3 = require("@radix-ui/react-tabs");
11926
- var import_type_guards48 = require("@wistia/type-guards");
11924
+ var import_type_guards47 = require("@wistia/type-guards");
11927
11925
 
11928
11926
  // src/components/Tabs/useTabsValue.tsx
11929
11927
  var import_react59 = require("react");
@@ -11981,8 +11979,8 @@ var TabItem = (0, import_react60.forwardRef)(
11981
11979
  StyledTabItem,
11982
11980
  {
11983
11981
  ref: combinedRef,
11984
- $hasLabel: (0, import_type_guards48.isNotNil)(label),
11985
- "aria-label": (0, import_type_guards48.isNotNil)(label) ? void 0 : ariaLabel,
11982
+ $hasLabel: (0, import_type_guards47.isNotNil)(label),
11983
+ "aria-label": (0, import_type_guards47.isNotNil)(label) ? void 0 : ariaLabel,
11986
11984
  disabled,
11987
11985
  value,
11988
11986
  children: [
@@ -12112,7 +12110,7 @@ var Tabs = (0, import_react63.forwardRef)(
12112
12110
  label,
12113
12111
  "aria-label": ariaLabelForTab
12114
12112
  } = tab.props;
12115
- if ((0, import_type_guards49.isNil)(icon)) {
12113
+ if ((0, import_type_guards48.isNil)(icon)) {
12116
12114
  return /* @__PURE__ */ (0, import_jsx_runtime265.jsx)(
12117
12115
  TabItem,
12118
12116
  {
@@ -12123,7 +12121,7 @@ var Tabs = (0, import_react63.forwardRef)(
12123
12121
  value
12124
12122
  );
12125
12123
  }
12126
- if ((0, import_type_guards49.isNotNil)(label)) {
12124
+ if ((0, import_type_guards48.isNotNil)(label)) {
12127
12125
  return /* @__PURE__ */ (0, import_jsx_runtime265.jsx)(
12128
12126
  TabItem,
12129
12127
  {
@@ -12135,7 +12133,7 @@ var Tabs = (0, import_react63.forwardRef)(
12135
12133
  value
12136
12134
  );
12137
12135
  }
12138
- if ((0, import_type_guards49.isNotNil)(ariaLabelForTab)) {
12136
+ if ((0, import_type_guards48.isNotNil)(ariaLabelForTab)) {
12139
12137
  return /* @__PURE__ */ (0, import_jsx_runtime265.jsx)(
12140
12138
  TabItem,
12141
12139
  {
@@ -12178,7 +12176,7 @@ Tab.displayName = "Tab";
12178
12176
  // src/components/Tag/Tag.tsx
12179
12177
  var import_react65 = require("react");
12180
12178
  var import_styled_components85 = __toESM(require("styled-components"));
12181
- var import_type_guards50 = require("@wistia/type-guards");
12179
+ var import_type_guards49 = require("@wistia/type-guards");
12182
12180
  var import_jsx_runtime267 = require("react/jsx-runtime");
12183
12181
  var TagLabel = import_styled_components85.default.a`
12184
12182
  ${({ $colorScheme }) => getColorScheme($colorScheme)};
@@ -12263,10 +12261,10 @@ var StyledTag = import_styled_components85.default.div`
12263
12261
  }
12264
12262
  `;
12265
12263
  var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
12266
- if ((0, import_type_guards50.isNil)(onClickRemove)) {
12264
+ if ((0, import_type_guards49.isNil)(onClickRemove)) {
12267
12265
  return null;
12268
12266
  }
12269
- if ((0, import_type_guards50.isNil)(onClickRemoveLabel)) {
12267
+ if ((0, import_type_guards49.isNil)(onClickRemoveLabel)) {
12270
12268
  throw new Error(
12271
12269
  "for accessibility, onClickRemoveLabel must be provided if onClickRemove is provided"
12272
12270
  );
@@ -12295,8 +12293,8 @@ var RemoveButton = ({ onClickRemove, onClickRemoveLabel, colorScheme }) => {
12295
12293
  };
12296
12294
  var Tag = (0, import_react65.forwardRef)(
12297
12295
  ({ onClickRemove, colorScheme = "inherit", href, icon, label, onClickRemoveLabel, ...props }, ref) => {
12298
- const hasIcon = (0, import_type_guards50.isNotNil)(icon);
12299
- const labelProps = (0, import_type_guards50.isNotNil)(href) && (0, import_type_guards50.isNonEmptyString)(href) ? { href, as: "a" } : { as: "span" };
12296
+ const hasIcon = (0, import_type_guards49.isNotNil)(icon);
12297
+ const labelProps = (0, import_type_guards49.isNotNil)(href) && (0, import_type_guards49.isNonEmptyString)(href) ? { href, as: "a" } : { as: "span" };
12300
12298
  return /* @__PURE__ */ (0, import_jsx_runtime267.jsxs)(
12301
12299
  StyledTag,
12302
12300
  {
@@ -12332,7 +12330,7 @@ Tag.displayName = "Tag";
12332
12330
 
12333
12331
  // src/components/WistiaLogo/WistiaLogo.tsx
12334
12332
  var import_styled_components86 = __toESM(require("styled-components"));
12335
- var import_type_guards51 = require("@wistia/type-guards");
12333
+ var import_type_guards50 = require("@wistia/type-guards");
12336
12334
  var import_jsx_runtime268 = require("react/jsx-runtime");
12337
12335
  var renderBrandmark = (brandmarkColor, iconOnly) => {
12338
12336
  if (iconOnly) {
@@ -12445,7 +12443,7 @@ var WistiaLogo = ({
12445
12443
  ...props,
12446
12444
  children: [
12447
12445
  /* @__PURE__ */ (0, import_jsx_runtime268.jsx)("title", { children: title }),
12448
- (0, import_type_guards51.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime268.jsx)("desc", { children: description }) : null,
12446
+ (0, import_type_guards50.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime268.jsx)("desc", { children: description }) : null,
12449
12447
  renderBrandmark(brandmarkColor, iconOnly),
12450
12448
  renderLogotype(logotypeColor, iconOnly)
12451
12449
  ]
@@ -12457,7 +12455,7 @@ WistiaLogo.displayName = "WistiaLogo";
12457
12455
 
12458
12456
  // src/components/Thumbnail/ThumbnailBadge.tsx
12459
12457
  var import_styled_components87 = __toESM(require("styled-components"));
12460
- var import_type_guards52 = require("@wistia/type-guards");
12458
+ var import_type_guards51 = require("@wistia/type-guards");
12461
12459
  var import_jsx_runtime269 = require("react/jsx-runtime");
12462
12460
  var StyledThumbnailBadge = import_styled_components87.default.div`
12463
12461
  align-items: center;
@@ -12485,7 +12483,7 @@ var StyledThumbnailBadge = import_styled_components87.default.div`
12485
12483
  `;
12486
12484
  var ThumbnailBadge = ({ icon, label, ...props }) => {
12487
12485
  return /* @__PURE__ */ (0, import_jsx_runtime269.jsxs)(StyledThumbnailBadge, { ...props, children: [
12488
- (0, import_type_guards52.isNotNil)(icon) && icon,
12486
+ (0, import_type_guards51.isNotNil)(icon) && icon,
12489
12487
  /* @__PURE__ */ (0, import_jsx_runtime269.jsx)("span", { children: label })
12490
12488
  ] });
12491
12489
  };
@@ -12494,10 +12492,10 @@ ThumbnailBadge.displayName = "ThumbnailBadge";
12494
12492
  // src/components/Thumbnail/Thumbnail.tsx
12495
12493
  var import_react66 = require("react");
12496
12494
  var import_styled_components89 = __toESM(require("styled-components"));
12497
- var import_type_guards54 = require("@wistia/type-guards");
12495
+ var import_type_guards53 = require("@wistia/type-guards");
12498
12496
 
12499
12497
  // src/private/helpers/getBackgroundGradient/getBackgroundGradient.ts
12500
- var import_type_guards53 = require("@wistia/type-guards");
12498
+ var import_type_guards52 = require("@wistia/type-guards");
12501
12499
  var import_styled_components88 = require("styled-components");
12502
12500
  var gradients = {
12503
12501
  defaultDarkOne: import_styled_components88.css`
@@ -12625,7 +12623,7 @@ var gradients = {
12625
12623
  };
12626
12624
  var gradientMap = Object.keys(gradients);
12627
12625
  var getBackgroundGradient = (gradientName = void 0) => {
12628
- return (0, import_type_guards53.isNotNil)(gradientName) ? gradients[gradientName] : gradients.defaultDarkOne;
12626
+ return (0, import_type_guards52.isNotNil)(gradientName) ? gradients[gradientName] : gradients.defaultDarkOne;
12629
12627
  };
12630
12628
 
12631
12629
  // src/components/Thumbnail/Thumbnail.tsx
@@ -12659,10 +12657,10 @@ var ThumbnailImage = ({ thumbnailImageType, thumbnailUrl }) => {
12659
12657
  );
12660
12658
  };
12661
12659
  var StyledThumbnail = import_styled_components89.default.div`
12662
- background-image: ${({ $backgroundUrl }) => (0, import_type_guards54.isNotNil)($backgroundUrl) ? `url('${$backgroundUrl}')` : void 0};
12660
+ background-image: ${({ $backgroundUrl }) => (0, import_type_guards53.isNotNil)($backgroundUrl) ? `url('${$backgroundUrl}')` : void 0};
12663
12661
  ${({ $backgroundUrl, $gradientBackground }) => (
12664
12662
  // if we don't have $backgroundUrl show a gradient
12665
- (0, import_type_guards54.isNil)($backgroundUrl) ? getBackgroundGradient($gradientBackground) : void 0
12663
+ (0, import_type_guards53.isNil)($backgroundUrl) ? getBackgroundGradient($gradientBackground) : void 0
12666
12664
  )};
12667
12665
  background-position: center center;
12668
12666
  background-size: cover;
@@ -12686,7 +12684,7 @@ var Thumbnail = (0, import_react66.forwardRef)(
12686
12684
  children,
12687
12685
  ...props
12688
12686
  }, ref) => {
12689
- const backgroundUrl = thumbnailImageType === "square" && (0, import_type_guards54.isNotNil)(thumbnailUrl) ? thumbnailUrl : void 0;
12687
+ const backgroundUrl = thumbnailImageType === "square" && (0, import_type_guards53.isNotNil)(thumbnailUrl) ? thumbnailUrl : void 0;
12690
12688
  return /* @__PURE__ */ (0, import_jsx_runtime270.jsxs)(
12691
12689
  StyledThumbnail,
12692
12690
  {
@@ -12696,8 +12694,8 @@ var Thumbnail = (0, import_react66.forwardRef)(
12696
12694
  $width: width,
12697
12695
  ...props,
12698
12696
  children: [
12699
- (0, import_type_guards54.isNotNil)(children) ? children : null,
12700
- (0, import_type_guards54.isNotNil)(thumbnailUrl) ? /* @__PURE__ */ (0, import_jsx_runtime270.jsx)(
12697
+ (0, import_type_guards53.isNotNil)(children) ? children : null,
12698
+ (0, import_type_guards53.isNotNil)(thumbnailUrl) ? /* @__PURE__ */ (0, import_jsx_runtime270.jsx)(
12701
12699
  ThumbnailImage,
12702
12700
  {
12703
12701
  thumbnailImageType,
@@ -12714,7 +12712,7 @@ Thumbnail.displayName = "Thumbnail";
12714
12712
  // src/components/InputClickToCopy/InputClickToCopy.tsx
12715
12713
  var import_styled_components90 = __toESM(require("styled-components"));
12716
12714
  var import_react67 = require("react");
12717
- var import_type_guards55 = require("@wistia/type-guards");
12715
+ var import_type_guards54 = require("@wistia/type-guards");
12718
12716
  var import_jsx_runtime271 = require("react/jsx-runtime");
12719
12717
  var StyledInput2 = (0, import_styled_components90.default)(Input)`
12720
12718
  &:not([aria-disabled='true']) {
@@ -12742,12 +12740,12 @@ var InputClickToCopy = (0, import_react67.forwardRef)(
12742
12740
  }, [isCopied]);
12743
12741
  const handleClick = (event) => {
12744
12742
  event.preventDefault();
12745
- if ((0, import_type_guards55.isFunction)(props.onClick)) {
12743
+ if ((0, import_type_guards54.isFunction)(props.onClick)) {
12746
12744
  props.onClick(event);
12747
12745
  }
12748
12746
  void copyToClipboard(value).then(() => {
12749
12747
  setIsCopied(true);
12750
- if ((0, import_type_guards55.isFunction)(onCopy)) {
12748
+ if ((0, import_type_guards54.isFunction)(onCopy)) {
12751
12749
  onCopy(value);
12752
12750
  }
12753
12751
  return value;