@wistia/ui 0.6.36 → 0.6.37

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.6.36
3
+ * @license @wistia/ui v0.6.37
4
4
  *
5
5
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
6
6
  *
@@ -119,6 +119,7 @@ __export(index_exports, {
119
119
  ellipsisFlexParentStyle: () => ellipsisFlexParentStyle,
120
120
  ellipsisStyle: () => ellipsisStyle,
121
121
  iconSizeMap: () => iconSizeMap,
122
+ mergeRefs: () => mergeRefs,
122
123
  mq: () => mq,
123
124
  useActiveMq: () => useActiveMq,
124
125
  useAriaLive: () => useAriaLive,
@@ -2006,6 +2007,20 @@ var dateTime = {
2006
2007
  timeOnlyString
2007
2008
  };
2008
2009
 
2010
+ // src/helpers/mergeRefs/mergeRefs.ts
2011
+ var import_type_guards5 = require("@wistia/type-guards");
2012
+ var mergeRefs = (refs) => (value) => {
2013
+ refs.forEach((ref) => {
2014
+ if ((0, import_type_guards5.isFunction)(ref)) {
2015
+ ref(value);
2016
+ return;
2017
+ }
2018
+ if ((0, import_type_guards5.isNotNil)(ref)) {
2019
+ ref.current = value;
2020
+ }
2021
+ });
2022
+ };
2023
+
2009
2024
  // src/helpers/mq/mq.ts
2010
2025
  var import_polished = require("polished");
2011
2026
 
@@ -2054,10 +2069,10 @@ var mq = {
2054
2069
 
2055
2070
  // src/hooks/useAriaLive/useAriaLive.tsx
2056
2071
  var import_react3 = require("react");
2057
- var import_type_guards5 = require("@wistia/type-guards");
2072
+ var import_type_guards6 = require("@wistia/type-guards");
2058
2073
  var useAriaLive = () => {
2059
2074
  const context = (0, import_react3.useContext)(AriaLiveContext);
2060
- if ((0, import_type_guards5.isNil)(context)) {
2075
+ if ((0, import_type_guards6.isNil)(context)) {
2061
2076
  throw new Error("useAriaLive must be used within an AriaLiveProvider");
2062
2077
  }
2063
2078
  return context;
@@ -2084,9 +2099,9 @@ var import_react6 = require("react");
2084
2099
  var import_react5 = require("react");
2085
2100
 
2086
2101
  // src/private/helpers/isValidRef/isValidRef.ts
2087
- var import_type_guards6 = require("@wistia/type-guards");
2102
+ var import_type_guards7 = require("@wistia/type-guards");
2088
2103
  var isValidRef = (value) => {
2089
- return (0, import_type_guards6.isNotNil)(value) && (0, import_type_guards6.isRecord)(value) && "current" in value;
2104
+ return (0, import_type_guards7.isNotNil)(value) && (0, import_type_guards7.isRecord)(value) && "current" in value;
2090
2105
  };
2091
2106
 
2092
2107
  // src/private/hooks/useEvent/useEvent.ts
@@ -2194,7 +2209,7 @@ var useLockBodyScroll = (locked) => {
2194
2209
  };
2195
2210
 
2196
2211
  // src/hooks/useMq/useMq.ts
2197
- var import_type_guards7 = require("@wistia/type-guards");
2212
+ var import_type_guards8 = require("@wistia/type-guards");
2198
2213
 
2199
2214
  // src/hooks/useWindowSize/useWindowSize.ts
2200
2215
  var import_react9 = require("react");
@@ -2256,7 +2271,7 @@ var useActiveMq = () => {
2256
2271
  const keys = Object.keys(mq2);
2257
2272
  return keys.filter((key) => {
2258
2273
  const value = mq2[key];
2259
- return (0, import_type_guards7.isBoolean)(value) && value;
2274
+ return (0, import_type_guards8.isBoolean)(value) && value;
2260
2275
  });
2261
2276
  };
2262
2277
 
@@ -2267,10 +2282,10 @@ var import_sonner2 = require("sonner");
2267
2282
  // src/private/components/Toast/Toast.tsx
2268
2283
  var import_react10 = require("react");
2269
2284
  var import_styled_components15 = __toESM(require("styled-components"));
2270
- var import_type_guards9 = require("@wistia/type-guards");
2285
+ var import_type_guards10 = require("@wistia/type-guards");
2271
2286
 
2272
2287
  // src/components/Ellipsis/Ellipsis.tsx
2273
- var import_type_guards8 = require("@wistia/type-guards");
2288
+ var import_type_guards9 = require("@wistia/type-guards");
2274
2289
  var import_styled_components13 = __toESM(require("styled-components"));
2275
2290
  var import_jsx_runtime4 = require("react/jsx-runtime");
2276
2291
  var ellipsisStyle = import_styled_components13.css`
@@ -2303,7 +2318,7 @@ var ellipsisFlexParentStyle = import_styled_components13.css`
2303
2318
  var EllipsisComponent = import_styled_components13.default.span`
2304
2319
  ${ellipsisStyle};
2305
2320
  ${({ $lines }) => {
2306
- if ((0, import_type_guards8.isNotNil)($lines)) {
2321
+ if ((0, import_type_guards9.isNotNil)($lines)) {
2307
2322
  return import_styled_components13.css`
2308
2323
  -webkit-box-orient: vertical;
2309
2324
  -webkit-line-clamp: ${$lines};
@@ -2495,7 +2510,7 @@ var StyledToast = import_styled_components15.default.div`
2495
2510
  }
2496
2511
  `;
2497
2512
  var Action = ({ actionButton }) => {
2498
- if ((0, import_type_guards9.isNotNil)(actionButton) && (0, import_react10.isValidElement)(actionButton)) {
2513
+ if ((0, import_type_guards10.isNotNil)(actionButton) && (0, import_react10.isValidElement)(actionButton)) {
2499
2514
  return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ActionWrapper, { children: (0, import_react10.cloneElement)(actionButton, {
2500
2515
  variant: "soft",
2501
2516
  // force Button variant
@@ -2519,7 +2534,7 @@ var Toast = ({
2519
2534
  $colorScheme: colorScheme,
2520
2535
  children: [
2521
2536
  /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(MessageWrapper, { children: [
2522
- (0, import_type_guards9.isNotNil)(icon) ? icon : null,
2537
+ (0, import_type_guards10.isNotNil)(icon) ? icon : null,
2523
2538
  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Message, { lines: 3, children: message })
2524
2539
  ] }),
2525
2540
  /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Action, { actionButton: action })
@@ -2560,7 +2575,7 @@ var import_styled_components21 = __toESM(require("styled-components"));
2560
2575
  // src/components/Button/Button.tsx
2561
2576
  var import_react14 = require("react");
2562
2577
  var import_styled_components20 = __toESM(require("styled-components"));
2563
- var import_type_guards13 = require("@wistia/type-guards");
2578
+ var import_type_guards14 = require("@wistia/type-guards");
2564
2579
 
2565
2580
  // src/css/buttonResetCss.tsx
2566
2581
  var import_styled_components16 = require("styled-components");
@@ -2764,7 +2779,7 @@ var buttonSizeStyles = {
2764
2779
  };
2765
2780
 
2766
2781
  // src/components/Icon/Icon.tsx
2767
- var import_type_guards11 = require("@wistia/type-guards");
2782
+ var import_type_guards12 = require("@wistia/type-guards");
2768
2783
  var import_styled_components18 = __toESM(require("styled-components"));
2769
2784
 
2770
2785
  // src/components/Icon/icons/AbTestIcon.tsx
@@ -6619,7 +6634,7 @@ var iconMap = {
6619
6634
  };
6620
6635
 
6621
6636
  // src/private/hooks/useResponsiveProp/useResponsiveProp.ts
6622
- var import_type_guards10 = require("@wistia/type-guards");
6637
+ var import_type_guards11 = require("@wistia/type-guards");
6623
6638
  var import_react12 = require("react");
6624
6639
  var isResponsiveObject = (values) => {
6625
6640
  return typeof values === "object" && values !== null && !Array.isArray(values) && "base" in values;
@@ -6627,9 +6642,9 @@ var isResponsiveObject = (values) => {
6627
6642
  var useResponsiveProp = (values) => {
6628
6643
  const activeMediaQueries = useActiveMq();
6629
6644
  return (0, import_react12.useMemo)(() => {
6630
- if ((0, import_type_guards10.isRecord)(values) && isResponsiveObject(values)) {
6645
+ if ((0, import_type_guards11.isRecord)(values) && isResponsiveObject(values)) {
6631
6646
  const mq2 = activeMediaQueries.find((key) => key in values);
6632
- return (0, import_type_guards10.isNotUndefined)(mq2) && (0, import_type_guards10.isNotUndefined)(values[mq2]) ? values[mq2] : values.base;
6647
+ return (0, import_type_guards11.isNotUndefined)(mq2) && (0, import_type_guards11.isNotUndefined)(values[mq2]) ? values[mq2] : values.base;
6633
6648
  }
6634
6649
  return values;
6635
6650
  }, [activeMediaQueries, values]);
@@ -6656,13 +6671,13 @@ var Icon = ({
6656
6671
  ...otherProps
6657
6672
  }) => {
6658
6673
  const responsiveSize = useResponsiveProp(size);
6659
- if ((0, import_type_guards11.isNil)(type)) {
6674
+ if ((0, import_type_guards12.isNil)(type)) {
6660
6675
  throw new Error("An Icon component requires a `type` prop to be provided");
6661
6676
  }
6662
- if ((0, import_type_guards11.isNil)(iconMap[type])) {
6677
+ if ((0, import_type_guards12.isNil)(iconMap[type])) {
6663
6678
  throw new Error(`Type "${type}" does not exist, please update type prop in Icon component.`);
6664
6679
  }
6665
- if ((0, import_type_guards11.isNil)(iconSizeMap[responsiveSize])) {
6680
+ if ((0, import_type_guards12.isNil)(iconSizeMap[responsiveSize])) {
6666
6681
  throw new Error(
6667
6682
  `Size "${responsiveSize}" does not exist, please update size prop in Icon component.`
6668
6683
  );
@@ -6694,12 +6709,12 @@ Icon.displayName = "Icon";
6694
6709
 
6695
6710
  // src/components/Link/Link.tsx
6696
6711
  var import_react13 = require("react");
6697
- var import_type_guards12 = require("@wistia/type-guards");
6712
+ var import_type_guards13 = require("@wistia/type-guards");
6698
6713
  var import_styled_components19 = __toESM(require("styled-components"));
6699
6714
  var import_react_router_dom = require("react-router-dom");
6700
6715
  var import_jsx_runtime192 = require("react/jsx-runtime");
6701
6716
  var generateHref = (href, type, disabled) => {
6702
- if (disabled || (0, import_type_guards12.isNil)(href)) {
6717
+ if (disabled || (0, import_type_guards13.isNil)(href)) {
6703
6718
  return void 0;
6704
6719
  }
6705
6720
  let to = href;
@@ -6711,12 +6726,12 @@ var generateHref = (href, type, disabled) => {
6711
6726
  }
6712
6727
  return to;
6713
6728
  };
6714
- var isButton = (props) => (0, import_type_guards12.isUndefined)(props.href);
6715
- var isLink = (props) => (0, import_type_guards12.isNotUndefined)(props.href);
6729
+ var isButton = (props) => (0, import_type_guards13.isUndefined)(props.href);
6730
+ var isLink = (props) => (0, import_type_guards13.isNotUndefined)(props.href);
6716
6731
  var StyledLink = import_styled_components19.default.a`
6717
6732
  --link-icon-size: 14px;
6718
6733
 
6719
- ${({ href }) => (0, import_type_guards12.isNil)(href) && buttonResetCss};
6734
+ ${({ href }) => (0, import_type_guards13.isNil)(href) && buttonResetCss};
6720
6735
  ${({ $colorScheme }) => getColorScheme($colorScheme)}
6721
6736
  cursor: pointer;
6722
6737
  font-family: var(--wui-typography-family-default);
@@ -6757,16 +6772,16 @@ var Link = (0, import_react13.forwardRef)(
6757
6772
  } catch (error) {
6758
6773
  console.error(error);
6759
6774
  } finally {
6760
- if ((0, import_type_guards12.isFunction)(props.onClick)) {
6775
+ if ((0, import_type_guards13.isFunction)(props.onClick)) {
6761
6776
  props.onClick(event);
6762
6777
  } else if (routingCallback !== null) {
6763
6778
  routingCallback();
6764
- } else if ((0, import_type_guards12.isNotNil)(to)) {
6779
+ } else if ((0, import_type_guards13.isNotNil)(to)) {
6765
6780
  window.location.assign(to);
6766
6781
  } else {
6767
6782
  }
6768
6783
  }
6769
- } else if ((0, import_type_guards12.isFunction)(props.onClick)) {
6784
+ } else if ((0, import_type_guards13.isFunction)(props.onClick)) {
6770
6785
  props.onClick(event);
6771
6786
  } else {
6772
6787
  }
@@ -6827,7 +6842,7 @@ Link.displayName = "Link";
6827
6842
 
6828
6843
  // src/components/Button/Button.tsx
6829
6844
  var import_jsx_runtime193 = require("react/jsx-runtime");
6830
- var isLink2 = (props) => (0, import_type_guards13.isNotUndefined)(props.href);
6845
+ var isLink2 = (props) => (0, import_type_guards14.isNotUndefined)(props.href);
6831
6846
  var StyledButton = import_styled_components20.default.button`
6832
6847
  ${buttonResetCss}
6833
6848
  ${({ $colorScheme }) => getColorScheme($colorScheme)}
@@ -6867,8 +6882,8 @@ var ButtonContent = ({
6867
6882
  /* @__PURE__ */ (0, import_jsx_runtime193.jsxs)(
6868
6883
  StyledButtonContent,
6869
6884
  {
6870
- $hasLeftIcon: (0, import_type_guards13.isNotNil)(leftIcon),
6871
- $hasRightIcon: (0, import_type_guards13.isNotNil)(rightIcon),
6885
+ $hasLeftIcon: (0, import_type_guards14.isNotNil)(leftIcon),
6886
+ $hasRightIcon: (0, import_type_guards14.isNotNil)(rightIcon),
6872
6887
  $isLoading: isLoading,
6873
6888
  children: [
6874
6889
  leftIcon ?? null,
@@ -6936,7 +6951,7 @@ var Button = (0, import_react14.forwardRef)(
6936
6951
  event.preventDefault();
6937
6952
  return;
6938
6953
  }
6939
- if ((0, import_type_guards13.isNotNil)(onClick)) {
6954
+ if ((0, import_type_guards14.isNotNil)(onClick)) {
6940
6955
  onClick(event);
6941
6956
  }
6942
6957
  };
@@ -7103,7 +7118,7 @@ ActionButton.displayName = "ActionButton";
7103
7118
 
7104
7119
  // src/components/Avatar/Avatar.tsx
7105
7120
  var import_react16 = require("react");
7106
- var import_type_guards15 = require("@wistia/type-guards");
7121
+ var import_type_guards16 = require("@wistia/type-guards");
7107
7122
  var import_styled_components23 = __toESM(require("styled-components"));
7108
7123
 
7109
7124
  // src/components/ColorSchemeWrapper/ColorSchemeWrapper.tsx
@@ -7146,13 +7161,13 @@ var ColorSchemeWrapper = ({
7146
7161
  ColorSchemeWrapper.displayName = "ColorSchemeWrapper";
7147
7162
 
7148
7163
  // src/components/Avatar/formatNameForDisplay.tsx
7149
- var import_type_guards14 = require("@wistia/type-guards");
7164
+ var import_type_guards15 = require("@wistia/type-guards");
7150
7165
  var containsEmojiCharacter = (char) => {
7151
7166
  const emojiRegex = /<a?:.+?:\d{18}>|\p{Extended_Pictographic}/gu;
7152
7167
  return emojiRegex.test(char);
7153
7168
  };
7154
7169
  var formatNameForDisplay = (name) => {
7155
- if ((0, import_type_guards14.isNil)(name) || !(0, import_type_guards14.isString)(name) || (0, import_type_guards14.isEmptyString)(name) || containsEmojiCharacter(name)) {
7170
+ if ((0, import_type_guards15.isNil)(name) || !(0, import_type_guards15.isString)(name) || (0, import_type_guards15.isEmptyString)(name) || containsEmojiCharacter(name)) {
7156
7171
  return "U";
7157
7172
  }
7158
7173
  const firstChar = name.trim().substring(0, 1);
@@ -7215,7 +7230,7 @@ var AvatarWrapper = import_styled_components23.default.div`
7215
7230
  max-height: ${({ $maxHeight }) => $maxHeight}px;
7216
7231
  `;
7217
7232
  var chooseColorScheme = (name) => {
7218
- if ((0, import_type_guards15.isNil)(name) || name === "Anonymous") {
7233
+ if ((0, import_type_guards16.isNil)(name) || name === "Anonymous") {
7219
7234
  return "default";
7220
7235
  }
7221
7236
  const filteredColors = colorSchemeOptions.filter(
@@ -7248,7 +7263,7 @@ var Avatar = ({
7248
7263
  };
7249
7264
  const avatarSize = heightAndWidth ?? avatarSizeMap[size];
7250
7265
  const avatarColor = (0, import_react16.useMemo)(() => chooseColorScheme(name), [name]);
7251
- const showInitials = (0, import_type_guards15.isNil)(imageUrl) || imageLoadState === "error";
7266
+ const showInitials = (0, import_type_guards16.isNil)(imageUrl) || imageLoadState === "error";
7252
7267
  return /* @__PURE__ */ (0, import_jsx_runtime196.jsx)(
7253
7268
  AvatarWrapper,
7254
7269
  {
@@ -7279,7 +7294,7 @@ Avatar.displayName = "Avatar";
7279
7294
  // src/components/Badge/Badge.tsx
7280
7295
  var import_react17 = require("react");
7281
7296
  var import_styled_components24 = __toESM(require("styled-components"));
7282
- var import_type_guards16 = require("@wistia/type-guards");
7297
+ var import_type_guards17 = require("@wistia/type-guards");
7283
7298
  var import_jsx_runtime197 = require("react/jsx-runtime");
7284
7299
  var StyledBadge = import_styled_components24.default.div`
7285
7300
  ${({ $colorScheme }) => getColorScheme($colorScheme)};
@@ -7303,7 +7318,7 @@ var StyledBadge = import_styled_components24.default.div`
7303
7318
  `;
7304
7319
  var Badge = (0, import_react17.forwardRef)(
7305
7320
  ({ colorScheme = "inherit", label, icon, ...otherProps }, ref) => {
7306
- const hasIcon = (0, import_type_guards16.isNotNil)(icon);
7321
+ const hasIcon = (0, import_type_guards17.isNotNil)(icon);
7307
7322
  return /* @__PURE__ */ (0, import_jsx_runtime197.jsxs)(
7308
7323
  StyledBadge,
7309
7324
  {
@@ -7324,7 +7339,7 @@ Badge.displayName = "Badge";
7324
7339
  // src/components/Box/Box.tsx
7325
7340
  var import_react18 = require("react");
7326
7341
  var import_styled_components25 = __toESM(require("styled-components"));
7327
- var import_type_guards17 = require("@wistia/type-guards");
7342
+ var import_type_guards18 = require("@wistia/type-guards");
7328
7343
 
7329
7344
  // src/private/helpers/makePolymorphic/makePolymorphic.tsx
7330
7345
  var makePolymorphic = (component) => {
@@ -7335,8 +7350,8 @@ var makePolymorphic = (component) => {
7335
7350
  var import_jsx_runtime198 = require("react/jsx-runtime");
7336
7351
  var isDev = process.env["NODE_ENV"] === "development" || process.env["NODE_ENV"] === "test";
7337
7352
  var getGapStyle = (gap) => {
7338
- if ((0, import_type_guards17.isNotNil)(gap)) {
7339
- if ((0, import_type_guards17.isRecord)(gap)) {
7353
+ if ((0, import_type_guards18.isNotNil)(gap)) {
7354
+ if ((0, import_type_guards18.isRecord)(gap)) {
7340
7355
  return Object.entries(gap).map(([key, value]) => {
7341
7356
  return `${key}-gap: var(--wui-${value})};`;
7342
7357
  }).join("");
@@ -7411,8 +7426,8 @@ var StyledBoxComponent = import_styled_components25.default.div`
7411
7426
  align-content: ${({ $alignContent }) => $alignContent};
7412
7427
  align-items: ${({ $alignItems }) => $alignItems};
7413
7428
  align-self: ${({ $alignSelf }) => $alignSelf ?? null};
7414
- display: ${({ $inline }) => (0, import_type_guards17.isNotNil)($inline) && $inline ? "inline-flex" : "flex"};
7415
- flex-basis: ${({ $basis }) => (0, import_type_guards17.isNotNil)($basis) ? $basis : null};
7429
+ display: ${({ $inline }) => (0, import_type_guards18.isNotNil)($inline) && $inline ? "inline-flex" : "flex"};
7430
+ flex-basis: ${({ $basis }) => (0, import_type_guards18.isNotNil)($basis) ? $basis : null};
7416
7431
  flex-direction: ${({ $flexDirection }) => $flexDirection};
7417
7432
  ${({ $fillBox: fill }) => getFillStyle(fill)};
7418
7433
  ${({ $fillViewport }) => getFillViewportStyle($fillViewport)};
@@ -7422,17 +7437,17 @@ var StyledBoxComponent = import_styled_components25.default.div`
7422
7437
  width: ${({ $width }) => $width ?? null};
7423
7438
 
7424
7439
  /* Box children styles */
7425
- flex-grow: ${({ $grow }) => (0, import_type_guards17.isNotNil)($grow) ? $grow : null};
7426
- flex-shrink: ${({ $shrink }) => (0, import_type_guards17.isNotNil)($shrink) ? $shrink : null};
7440
+ flex-grow: ${({ $grow }) => (0, import_type_guards18.isNotNil)($grow) ? $grow : null};
7441
+ flex-shrink: ${({ $shrink }) => (0, import_type_guards18.isNotNil)($shrink) ? $shrink : null};
7427
7442
  flex-wrap: ${({ $wrapItems }) => $wrapItems ? "wrap" : "nowrap"};
7428
7443
  justify-content: ${({ $justifyContent }) => $justifyContent};
7429
- order: ${({ $order }) => (0, import_type_guards17.isNotNil)($order) ? $order : null};
7444
+ order: ${({ $order }) => (0, import_type_guards18.isNotNil)($order) ? $order : null};
7430
7445
  `;
7431
7446
  var wrapChildren = (children) => {
7432
- if ((0, import_type_guards17.isNotNil)(children)) {
7447
+ if ((0, import_type_guards18.isNotNil)(children)) {
7433
7448
  if (typeof children === "object" && isDev) {
7434
7449
  return import_react18.Children.map(children, (child) => {
7435
- if ((0, import_type_guards17.isNil)(child)) return null;
7450
+ if ((0, import_type_guards18.isNil)(child)) return null;
7436
7451
  const elementParams = {};
7437
7452
  if (child.type?.displayName === "Box" || child.type?.displayName === "Box_UI") {
7438
7453
  elementParams.hasBoxParent = true;
@@ -7470,7 +7485,7 @@ var BoxComponent = (0, import_react18.forwardRef)(
7470
7485
  flexMode,
7471
7486
  ...otherProps
7472
7487
  }, ref) => {
7473
- if ((0, import_type_guards17.isNotUndefined)(height)) {
7488
+ if ((0, import_type_guards18.isNotUndefined)(height)) {
7474
7489
  if (fill === true || fill === "vertical") {
7475
7490
  throw new Error('Cannot use height prop with fill="vertical" or fill={true}');
7476
7491
  }
@@ -7480,7 +7495,7 @@ var BoxComponent = (0, import_react18.forwardRef)(
7480
7495
  );
7481
7496
  }
7482
7497
  }
7483
- if ((0, import_type_guards17.isNotUndefined)(width)) {
7498
+ if ((0, import_type_guards18.isNotUndefined)(width)) {
7484
7499
  if (fill === true || fill === "horizontal") {
7485
7500
  throw new Error('Cannot use width prop with fill="horizontal" or fill={true}');
7486
7501
  }
@@ -7605,7 +7620,7 @@ var Breadcrumb = ({ icon, href, children, ...props }) => {
7605
7620
 
7606
7621
  // src/components/ButtonGroup/ButtonGroup.tsx
7607
7622
  var import_styled_components28 = __toESM(require("styled-components"));
7608
- var import_type_guards18 = require("@wistia/type-guards");
7623
+ var import_type_guards19 = require("@wistia/type-guards");
7609
7624
  var import_jsx_runtime201 = require("react/jsx-runtime");
7610
7625
  var getAlignment = (align) => {
7611
7626
  if (align === "center") {
@@ -7651,7 +7666,7 @@ var ButtonGroup = ({
7651
7666
  collapseOnSmallScreens = true,
7652
7667
  ...otherProps
7653
7668
  }) => {
7654
- if ((0, import_type_guards18.isNil)(children)) {
7669
+ if ((0, import_type_guards19.isNil)(children)) {
7655
7670
  return null;
7656
7671
  }
7657
7672
  return /* @__PURE__ */ (0, import_jsx_runtime201.jsx)(
@@ -7758,15 +7773,15 @@ Center.displayName = "Center";
7758
7773
  // src/components/Checkbox/Checkbox.tsx
7759
7774
  var import_react21 = require("react");
7760
7775
  var import_styled_components34 = __toESM(require("styled-components"));
7761
- var import_type_guards22 = require("@wistia/type-guards");
7776
+ var import_type_guards23 = require("@wistia/type-guards");
7762
7777
 
7763
7778
  // src/private/components/FormControlLabel/FormControlLabel.tsx
7764
7779
  var import_styled_components33 = __toESM(require("styled-components"));
7765
- var import_type_guards21 = require("@wistia/type-guards");
7780
+ var import_type_guards22 = require("@wistia/type-guards");
7766
7781
 
7767
7782
  // src/private/components/FormControlLabel/FormControlLabelDescription.tsx
7768
7783
  var import_styled_components31 = __toESM(require("styled-components"));
7769
- var import_type_guards19 = require("@wistia/type-guards");
7784
+ var import_type_guards20 = require("@wistia/type-guards");
7770
7785
  var import_jsx_runtime204 = require("react/jsx-runtime");
7771
7786
  var disabledStyle = import_styled_components31.css`
7772
7787
  color: var(--wui-color-text-disabled);
@@ -7786,7 +7801,7 @@ var FormControlLabelDescription = ({
7786
7801
  disabled = false,
7787
7802
  ...props
7788
7803
  }) => {
7789
- if ((0, import_type_guards19.isNil)(children)) {
7804
+ if ((0, import_type_guards20.isNil)(children)) {
7790
7805
  return null;
7791
7806
  }
7792
7807
  return /* @__PURE__ */ (0, import_jsx_runtime204.jsx)(
@@ -7802,7 +7817,7 @@ FormControlLabelDescription.displayName = "FormControlLabelDescription";
7802
7817
 
7803
7818
  // src/components/ScreenReaderOnly/ScreenReaderOnly.tsx
7804
7819
  var import_styled_components32 = __toESM(require("styled-components"));
7805
- var import_type_guards20 = require("@wistia/type-guards");
7820
+ var import_type_guards21 = require("@wistia/type-guards");
7806
7821
  var import_jsx_runtime205 = require("react/jsx-runtime");
7807
7822
  var VisuallyHidden = import_styled_components32.default.div({ ...visuallyHiddenStyle });
7808
7823
  var VisuallyHiddenButFocusable = import_styled_components32.default.div({
@@ -7814,7 +7829,7 @@ var ScreenReaderOnly = ({
7814
7829
  focusable = false,
7815
7830
  ...otherProps
7816
7831
  }) => {
7817
- const accessibleText = (0, import_type_guards20.isNotNil)(text) ? text : children;
7832
+ const accessibleText = (0, import_type_guards21.isNotNil)(text) ? text : children;
7818
7833
  if (focusable) {
7819
7834
  return /* @__PURE__ */ (0, import_jsx_runtime205.jsx)(VisuallyHiddenButFocusable, { ...otherProps, children: accessibleText });
7820
7835
  }
@@ -7854,7 +7869,7 @@ var FormControlLabel = ({
7854
7869
  hideLabel = false,
7855
7870
  ...props
7856
7871
  }) => {
7857
- if ((0, import_type_guards21.isNil)(label)) {
7872
+ if ((0, import_type_guards22.isNil)(label)) {
7858
7873
  return null;
7859
7874
  }
7860
7875
  const labelContent = hideLabel ? /* @__PURE__ */ (0, import_jsx_runtime206.jsx)(ScreenReaderOnly, { children: label }) : /* @__PURE__ */ (0, import_jsx_runtime206.jsxs)(StyledLabelWrapper, { children: [
@@ -7868,7 +7883,7 @@ var FormControlLabel = ({
7868
7883
  htmlFor,
7869
7884
  ...props,
7870
7885
  children: [
7871
- (0, import_type_guards21.isNotNil)(controlSlot) ? controlSlot : null,
7886
+ (0, import_type_guards22.isNotNil)(controlSlot) ? controlSlot : null,
7872
7887
  labelContent
7873
7888
  ]
7874
7889
  }
@@ -7992,7 +8007,7 @@ var Checkbox = (0, import_react21.forwardRef)(
7992
8007
  ...props
7993
8008
  }, ref) => {
7994
8009
  const generatedId = (0, import_react21.useId)();
7995
- const computedId = (0, import_type_guards22.isNonEmptyString)(id) ? id : `wistia-ui-checkbox-${generatedId}`;
8010
+ const computedId = (0, import_type_guards23.isNonEmptyString)(id) ? id : `wistia-ui-checkbox-${generatedId}`;
7996
8011
  return /* @__PURE__ */ (0, import_jsx_runtime207.jsxs)(StyledCheckboxWrapper, { disabled, children: [
7997
8012
  /* @__PURE__ */ (0, import_jsx_runtime207.jsx)(
7998
8013
  StyledHiddenCheckboxInput,
@@ -8070,7 +8085,7 @@ ClickRegion.displayName = "ClickRegion";
8070
8085
 
8071
8086
  // src/components/Collapsible/Collapsible.tsx
8072
8087
  var import_react_collapsible = require("@radix-ui/react-collapsible");
8073
- var import_type_guards23 = require("@wistia/type-guards");
8088
+ var import_type_guards24 = require("@wistia/type-guards");
8074
8089
  var import_styled_components35 = __toESM(require("styled-components"));
8075
8090
  var import_jsx_runtime208 = require("react/jsx-runtime");
8076
8091
  var StyledRoot = (0, import_styled_components35.default)(import_react_collapsible.Root)`
@@ -8087,7 +8102,7 @@ var Collapsible = ({
8087
8102
  onOpenChange
8088
8103
  }) => {
8089
8104
  const controlProps = {
8090
- ...(0, import_type_guards23.isNotNil)(onOpenChange) && (0, import_type_guards23.isNotNil)(isOpen) ? { open: isOpen, onOpenChange } : {}
8105
+ ...(0, import_type_guards24.isNotNil)(onOpenChange) && (0, import_type_guards24.isNotNil)(isOpen) ? { open: isOpen, onOpenChange } : {}
8091
8106
  };
8092
8107
  return /* @__PURE__ */ (0, import_jsx_runtime208.jsx)(StyledRoot, { ...controlProps, children });
8093
8108
  };
@@ -8105,13 +8120,13 @@ var CollapsibleTrigger = ({ children }) => {
8105
8120
  // src/components/Collapsible/CollapsibleContent.tsx
8106
8121
  var import_styled_components36 = __toESM(require("styled-components"));
8107
8122
  var import_react_collapsible3 = require("@radix-ui/react-collapsible");
8108
- var import_type_guards24 = require("@wistia/type-guards");
8123
+ var import_type_guards25 = require("@wistia/type-guards");
8109
8124
  var import_jsx_runtime210 = require("react/jsx-runtime");
8110
8125
  var ClampedContent = import_styled_components36.default.div.attrs({ "data-wui-collapsible-content": true })`
8111
8126
  --wui-collapsible-content-clamp-lines: ${({ $clamp }) => $clamp};
8112
8127
  `;
8113
8128
  var CollapsibleContent = ({ clamp, children }) => {
8114
- if ((0, import_type_guards24.isNotUndefined)(clamp)) {
8129
+ if ((0, import_type_guards25.isNotUndefined)(clamp)) {
8115
8130
  return /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(ClampedContent, { $clamp: clamp, children });
8116
8131
  }
8117
8132
  return /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(import_react_collapsible3.Content, { children: /* @__PURE__ */ (0, import_jsx_runtime210.jsxs)(import_jsx_runtime210.Fragment, { children: [
@@ -8122,7 +8137,7 @@ var CollapsibleContent = ({ clamp, children }) => {
8122
8137
 
8123
8138
  // src/components/DataCards/DataCard.tsx
8124
8139
  var import_styled_components38 = __toESM(require("styled-components"));
8125
- var import_type_guards25 = require("@wistia/type-guards");
8140
+ var import_type_guards26 = require("@wistia/type-guards");
8126
8141
 
8127
8142
  // src/components/Heading/Heading.tsx
8128
8143
  var import_react24 = require("react");
@@ -8331,8 +8346,8 @@ var DataCard = ({
8331
8346
  children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime212.jsx)(StyledLoadingValue, {}) : value
8332
8347
  }
8333
8348
  ),
8334
- (0, import_type_guards25.isNotNull)(upperRightSlot) && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime212.jsx)(StyledSlot, { children: upperRightSlot }),
8335
- (0, import_type_guards25.isNotNull)(trend) && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime212.jsx)(StyledDataCardTrendContainer, { children: trend })
8349
+ (0, import_type_guards26.isNotNull)(upperRightSlot) && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime212.jsx)(StyledSlot, { children: upperRightSlot }),
8350
+ (0, import_type_guards26.isNotNull)(trend) && !isLoading && /* @__PURE__ */ (0, import_jsx_runtime212.jsx)(StyledDataCardTrendContainer, { children: trend })
8336
8351
  ]
8337
8352
  }
8338
8353
  );
@@ -8769,7 +8784,7 @@ Tooltip.displayName = "Tooltip";
8769
8784
  // src/components/Input/Input.tsx
8770
8785
  var import_react26 = require("react");
8771
8786
  var import_styled_components44 = __toESM(require("styled-components"));
8772
- var import_type_guards26 = require("@wistia/type-guards");
8787
+ var import_type_guards27 = require("@wistia/type-guards");
8773
8788
  var import_jsx_runtime218 = require("react/jsx-runtime");
8774
8789
  var inputStyles = import_styled_components44.css`
8775
8790
  --wui-input-color-bg: var(--wui-color-bg-surface);
@@ -8869,27 +8884,27 @@ var Input = (0, import_react26.forwardRef)(
8869
8884
  const internalRef = (0, import_react26.useRef)();
8870
8885
  const ref = (
8871
8886
  // eslint-disable-next-line react-compiler/react-compiler
8872
- (0, import_type_guards26.isNotNil)(externalRef) && (0, import_type_guards26.isRecord)(externalRef) && "current" in externalRef ? externalRef : internalRef
8887
+ (0, import_type_guards27.isNotNil)(externalRef) && (0, import_type_guards27.isRecord)(externalRef) && "current" in externalRef ? externalRef : internalRef
8873
8888
  );
8874
8889
  let leftIconToDisplay = leftIcon;
8875
- if ((0, import_type_guards26.isNil)(leftIcon) && type === "search") {
8890
+ if ((0, import_type_guards27.isNil)(leftIcon) && type === "search") {
8876
8891
  leftIconToDisplay = /* @__PURE__ */ (0, import_jsx_runtime218.jsx)(Icon, { type: "search" });
8877
8892
  }
8878
- if ((0, import_type_guards26.isNotNil)(leftIconToDisplay)) {
8893
+ if ((0, import_type_guards27.isNotNil)(leftIconToDisplay)) {
8879
8894
  leftIconToDisplay = (0, import_react26.cloneElement)(leftIconToDisplay, {
8880
8895
  size: "md",
8881
8896
  className: "wui-input-left-icon"
8882
8897
  });
8883
8898
  }
8884
8899
  let rightIconToDisplay = rightIcon;
8885
- if ((0, import_type_guards26.isNotNil)(rightIconToDisplay)) {
8900
+ if ((0, import_type_guards27.isNotNil)(rightIconToDisplay)) {
8886
8901
  rightIconToDisplay = (0, import_react26.cloneElement)(rightIconToDisplay, {
8887
8902
  size: "md",
8888
8903
  className: "wui-input-right-icon"
8889
8904
  });
8890
8905
  }
8891
8906
  const handleFocus = (event) => {
8892
- if ((0, import_type_guards26.isNotNil)(props.onFocus)) {
8907
+ if ((0, import_type_guards27.isNotNil)(props.onFocus)) {
8893
8908
  props.onFocus(event);
8894
8909
  }
8895
8910
  if (autoSelect && isValidRef(ref) && "current" in ref) {
@@ -9070,7 +9085,7 @@ var EditableHeading = ({
9070
9085
  // src/components/Form/Form.tsx
9071
9086
  var import_react29 = require("react");
9072
9087
  var import_styled_components47 = __toESM(require("styled-components"));
9073
- var import_type_guards27 = require("@wistia/type-guards");
9088
+ var import_type_guards28 = require("@wistia/type-guards");
9074
9089
 
9075
9090
  // src/components/Stack/Stack.tsx
9076
9091
  var import_react28 = require("react");
@@ -9136,7 +9151,7 @@ var FormComponent = ({
9136
9151
  const id = props.id ?? autoId;
9137
9152
  const handleValidate = (nextFormData) => {
9138
9153
  const nextData = Object.fromEntries(nextFormData.entries());
9139
- if ((0, import_type_guards27.isUndefined)(validate)) {
9154
+ if ((0, import_type_guards28.isUndefined)(validate)) {
9140
9155
  return {};
9141
9156
  }
9142
9157
  return validate(nextData);
@@ -9146,7 +9161,7 @@ var FormComponent = ({
9146
9161
  props.onBlur(event);
9147
9162
  }
9148
9163
  const formData = new FormData(event.currentTarget);
9149
- if ((0, import_type_guards27.isNotUndefined)(validate)) {
9164
+ if ((0, import_type_guards28.isNotUndefined)(validate)) {
9150
9165
  handleValidate(formData);
9151
9166
  }
9152
9167
  };
@@ -9243,7 +9258,7 @@ var useFormState = (action, initialData = {}) => {
9243
9258
 
9244
9259
  // src/components/Form/FormErrorSummary.tsx
9245
9260
  var import_react31 = require("react");
9246
- var import_type_guards28 = require("@wistia/type-guards");
9261
+ var import_type_guards29 = require("@wistia/type-guards");
9247
9262
  var import_jsx_runtime222 = require("react/jsx-runtime");
9248
9263
  var ErrorItem = ({ name, error, formId }) => {
9249
9264
  return /* @__PURE__ */ (0, import_jsx_runtime222.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime222.jsx)(Link, { href: `#${formId}-${name}`, children: error }) }, name);
@@ -9257,8 +9272,8 @@ var FormErrorSummary = ({ description }) => {
9257
9272
  }
9258
9273
  return /* @__PURE__ */ (0, import_jsx_runtime222.jsxs)("div", { ref, children: [
9259
9274
  /* @__PURE__ */ (0, import_jsx_runtime222.jsx)("p", { children: description }),
9260
- /* @__PURE__ */ (0, import_jsx_runtime222.jsx)("ul", { children: Object.entries(errors).filter(([, error]) => (0, import_type_guards28.isNotUndefined)(error)).map(
9261
- ([name, error]) => (0, import_type_guards28.isArray)(error) ? error.map((err) => /* @__PURE__ */ (0, import_jsx_runtime222.jsx)(
9275
+ /* @__PURE__ */ (0, import_jsx_runtime222.jsx)("ul", { children: Object.entries(errors).filter(([, error]) => (0, import_type_guards29.isNotUndefined)(error)).map(
9276
+ ([name, error]) => (0, import_type_guards29.isArray)(error) ? error.map((err) => /* @__PURE__ */ (0, import_jsx_runtime222.jsx)(
9262
9277
  ErrorItem,
9263
9278
  {
9264
9279
  error: err,
@@ -9282,7 +9297,7 @@ var FormErrorSummary = ({ description }) => {
9282
9297
  // src/components/FormField/FormField.tsx
9283
9298
  var import_react34 = require("react");
9284
9299
  var import_styled_components50 = __toESM(require("styled-components"));
9285
- var import_type_guards29 = require("@wistia/type-guards");
9300
+ var import_type_guards30 = require("@wistia/type-guards");
9286
9301
 
9287
9302
  // src/components/Label/Label.tsx
9288
9303
  var import_styled_components48 = __toESM(require("styled-components"));
@@ -9442,7 +9457,7 @@ var StyledErrorList = import_styled_components50.default.ul`
9442
9457
  gap: var(--wui-space-01);
9443
9458
  `;
9444
9459
  var ErrorMessages = ({ errors, id }) => {
9445
- const isMultipleErrors = (0, import_type_guards29.isArray)(errors);
9460
+ const isMultipleErrors = (0, import_type_guards30.isArray)(errors);
9446
9461
  return isMultipleErrors ? /* @__PURE__ */ (0, import_jsx_runtime226.jsx)(StyledErrorList, { children: errors.map((error, index) => /* @__PURE__ */ (0, import_jsx_runtime226.jsx)(
9447
9462
  Text,
9448
9463
  {
@@ -9492,19 +9507,19 @@ var FormField = ({
9492
9507
  "aria-describedby": ariaDescribedby,
9493
9508
  ...props
9494
9509
  };
9495
- if ((0, import_type_guards29.isUndefined)(value) && (0, import_type_guards29.isNotUndefined)(defaultValue)) {
9510
+ if ((0, import_type_guards30.isUndefined)(value) && (0, import_type_guards30.isNotUndefined)(defaultValue)) {
9496
9511
  childProps = {
9497
9512
  ...childProps,
9498
9513
  defaultValue
9499
9514
  };
9500
9515
  }
9501
- if ((0, import_type_guards29.isNotNil)(checkboxGroup)) {
9502
- const computedName = (0, import_type_guards29.isNotNil)(checkboxGroup.name) ? `${checkboxGroup.name}[${name}]` : name;
9516
+ if ((0, import_type_guards30.isNotNil)(checkboxGroup)) {
9517
+ const computedName = (0, import_type_guards30.isNotNil)(checkboxGroup.name) ? `${checkboxGroup.name}[${name}]` : name;
9503
9518
  const handleChange = (event) => {
9504
- if ((0, import_type_guards29.isNotUndefined)(props.onChange)) {
9519
+ if ((0, import_type_guards30.isNotUndefined)(props.onChange)) {
9505
9520
  props.onChange(event);
9506
9521
  }
9507
- if ((0, import_type_guards29.isNotUndefined)(checkboxGroup.onChange)) {
9522
+ if ((0, import_type_guards30.isNotUndefined)(checkboxGroup.onChange)) {
9508
9523
  checkboxGroup.onChange(event);
9509
9524
  }
9510
9525
  };
@@ -9512,7 +9527,7 @@ var FormField = ({
9512
9527
  ...childProps,
9513
9528
  name: computedName,
9514
9529
  onChange: handleChange,
9515
- "aria-invalid": (0, import_type_guards29.isNotNil)(error)
9530
+ "aria-invalid": (0, import_type_guards30.isNotNil)(error)
9516
9531
  };
9517
9532
  }
9518
9533
  import_react34.Children.only(children);
@@ -9523,9 +9538,9 @@ var FormField = ({
9523
9538
  "data-label-position": labelPosition ?? formState.labelPosition,
9524
9539
  children: [
9525
9540
  !isIntegratedLabel && /* @__PURE__ */ (0, import_jsx_runtime226.jsx)(Label, { htmlFor: computedId, children: label }),
9526
- (0, import_type_guards29.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime226.jsx)(FormControlLabelDescription, { id: descriptionId, children: description }) : null,
9541
+ (0, import_type_guards30.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime226.jsx)(FormControlLabelDescription, { id: descriptionId, children: description }) : null,
9527
9542
  (0, import_react34.cloneElement)(children, childProps),
9528
- (0, import_type_guards29.isNotNil)(computedError) ? /* @__PURE__ */ (0, import_jsx_runtime226.jsxs)(import_jsx_runtime226.Fragment, { children: [
9543
+ (0, import_type_guards30.isNotNil)(computedError) ? /* @__PURE__ */ (0, import_jsx_runtime226.jsxs)(import_jsx_runtime226.Fragment, { children: [
9529
9544
  /* @__PURE__ */ (0, import_jsx_runtime226.jsx)("div", {}),
9530
9545
  /* @__PURE__ */ (0, import_jsx_runtime226.jsx)(
9531
9546
  ErrorMessages,
@@ -9602,7 +9617,7 @@ IconButton.displayName = "IconButton";
9602
9617
 
9603
9618
  // src/components/Image/Image.tsx
9604
9619
  var import_styled_components52 = __toESM(require("styled-components"));
9605
- var import_type_guards30 = require("@wistia/type-guards");
9620
+ var import_type_guards31 = require("@wistia/type-guards");
9606
9621
  var import_jsx_runtime229 = require("react/jsx-runtime");
9607
9622
  var getFillStyle2 = (fillContainer) => {
9608
9623
  if (fillContainer === "horizontal") {
@@ -9620,7 +9635,7 @@ var getFillStyle2 = (fillContainer) => {
9620
9635
  return void 0;
9621
9636
  };
9622
9637
  var StyledImage = import_styled_components52.default.img`
9623
- border-radius: ${({ $borderRadius }) => (0, import_type_guards30.isNotNil)($borderRadius) ? `var(--wui-${$borderRadius})` : void 0};
9638
+ border-radius: ${({ $borderRadius }) => (0, import_type_guards31.isNotNil)($borderRadius) ? `var(--wui-${$borderRadius})` : void 0};
9624
9639
  ${({ $fillContainer }) => getFillStyle2($fillContainer)};
9625
9640
  object-fit: ${({ $objFit }) => $objFit};
9626
9641
  object-position: ${({ $objPosition }) => $objPosition};
@@ -9652,7 +9667,7 @@ Image.displayName = "Image";
9652
9667
  // src/components/Menu/Menu.tsx
9653
9668
  var import_styled_components53 = __toESM(require("styled-components"));
9654
9669
  var import_react_dropdown_menu = require("@radix-ui/react-dropdown-menu");
9655
- var import_type_guards31 = require("@wistia/type-guards");
9670
+ var import_type_guards32 = require("@wistia/type-guards");
9656
9671
  var import_react38 = require("react");
9657
9672
 
9658
9673
  // src/components/Menu/MenuContext.tsx
@@ -9764,7 +9779,7 @@ var Menu = ({
9764
9779
  }) => {
9765
9780
  const contextValue = (0, import_react38.useMemo)(() => ({ compact }), [compact]);
9766
9781
  let controlProps = {
9767
- ...(0, import_type_guards31.isNotNil)(onOpenChange) && (0, import_type_guards31.isNotNil)(isOpen) ? { open: isOpen, onOpenChange } : {}
9782
+ ...(0, import_type_guards32.isNotNil)(onOpenChange) && (0, import_type_guards32.isNotNil)(isOpen) ? { open: isOpen, onOpenChange } : {}
9768
9783
  };
9769
9784
  if (disabled) {
9770
9785
  controlProps = {
@@ -9778,7 +9793,7 @@ var Menu = ({
9778
9793
  modal: false,
9779
9794
  ...controlProps,
9780
9795
  children: [
9781
- /* @__PURE__ */ (0, import_jsx_runtime230.jsx)(import_react_dropdown_menu.DropdownMenuTrigger, { asChild: true, children: (0, import_type_guards31.isNotUndefined)(trigger) ? trigger : /* @__PURE__ */ (0, import_jsx_runtime230.jsx)(
9796
+ /* @__PURE__ */ (0, import_jsx_runtime230.jsx)(import_react_dropdown_menu.DropdownMenuTrigger, { asChild: true, children: (0, import_type_guards32.isNotUndefined)(trigger) ? trigger : /* @__PURE__ */ (0, import_jsx_runtime230.jsx)(
9782
9797
  Button,
9783
9798
  {
9784
9799
  "aria-expanded": isOpen,
@@ -9839,12 +9854,12 @@ MenuLabel.displayName = "MenuLabel";
9839
9854
  var import_react40 = require("react");
9840
9855
  var import_styled_components57 = __toESM(require("styled-components"));
9841
9856
  var import_react_dropdown_menu3 = require("@radix-ui/react-dropdown-menu");
9842
- var import_type_guards33 = require("@wistia/type-guards");
9857
+ var import_type_guards34 = require("@wistia/type-guards");
9843
9858
 
9844
9859
  // src/components/Menu/MenuItemButton.tsx
9845
9860
  var import_react39 = require("react");
9846
9861
  var import_styled_components55 = __toESM(require("styled-components"));
9847
- var import_type_guards32 = require("@wistia/type-guards");
9862
+ var import_type_guards33 = require("@wistia/type-guards");
9848
9863
  var import_jsx_runtime232 = require("react/jsx-runtime");
9849
9864
  var StyledButton3 = (0, import_styled_components55.default)(Button)`
9850
9865
  ${({ colorScheme }) => getColorScheme(colorScheme)};
@@ -9922,7 +9937,7 @@ var StyledBadgeContainer = import_styled_components55.default.div`
9922
9937
  var MenuItemButton = (0, import_react39.forwardRef)(({ children, appearance, command, icon, ...props }, ref) => {
9923
9938
  let { colorScheme, badge } = props;
9924
9939
  if (appearance === "dangerous") {
9925
- if ((0, import_type_guards32.isNotUndefined)(colorScheme)) {
9940
+ if ((0, import_type_guards33.isNotUndefined)(colorScheme)) {
9926
9941
  console.warn("colorScheme prop is ignored when appearance is dangerous");
9927
9942
  }
9928
9943
  colorScheme = "error";
@@ -9952,7 +9967,7 @@ var MenuItemButton = (0, import_react39.forwardRef)(({ children, appearance, com
9952
9967
  children: [
9953
9968
  props.leftIcon ? /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(StyledLeftIconContainer, { children: props.leftIcon }) : null,
9954
9969
  /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(StyledLabelAndDescriptionContainer, { children }),
9955
- (0, import_type_guards32.isNotNil)(badge) || (0, import_type_guards32.isNotNil)(command) ? /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(StyledBadgeContainer, { children: badge ?? command }) : null,
9970
+ (0, import_type_guards33.isNotNil)(badge) || (0, import_type_guards33.isNotNil)(command) ? /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(StyledBadgeContainer, { children: badge ?? command }) : null,
9956
9971
  props.rightIcon ? /* @__PURE__ */ (0, import_jsx_runtime232.jsx)(StyledRightIconContainer, { children: props.rightIcon }) : null
9957
9972
  ]
9958
9973
  }
@@ -10020,7 +10035,7 @@ var SubMenu = ({
10020
10035
  return isSmAndUp ? /* @__PURE__ */ (0, import_jsx_runtime234.jsxs)(import_react_dropdown_menu3.DropdownMenuSub, { onOpenChange, children: [
10021
10036
  /* @__PURE__ */ (0, import_jsx_runtime234.jsxs)(SubMenuTrigger, { ...props, children: [
10022
10037
  /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(MenuItemLabel, { children: label }),
10023
- (0, import_type_guards33.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(MenuItemDescription, { children: description }) : null
10038
+ (0, import_type_guards34.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(MenuItemDescription, { children: description }) : null
10024
10039
  ] }),
10025
10040
  /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(import_react_dropdown_menu3.DropdownMenuPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime234.jsx)(SubMenuContent, { $compact: compact, children }) })
10026
10041
  ] }) : /* @__PURE__ */ (0, import_jsx_runtime234.jsxs)(import_react_dropdown_menu3.DropdownMenuGroup, { children: [
@@ -10200,7 +10215,7 @@ CheckboxMenuItem.displayName = "CheckboxMenuItem";
10200
10215
  var import_react45 = require("react");
10201
10216
  var import_styled_components62 = __toESM(require("styled-components"));
10202
10217
  var import_react_dialog4 = require("@radix-ui/react-dialog");
10203
- var import_type_guards35 = require("@wistia/type-guards");
10218
+ var import_type_guards36 = require("@wistia/type-guards");
10204
10219
 
10205
10220
  // src/components/Modal/ModalHeader.tsx
10206
10221
  var import_styled_components59 = __toESM(require("styled-components"));
@@ -10263,7 +10278,7 @@ var import_react_dialog3 = require("@radix-ui/react-dialog");
10263
10278
 
10264
10279
  // src/private/hooks/useFocusRestore/useFocusRestore.ts
10265
10280
  var import_react42 = require("react");
10266
- var import_type_guards34 = require("@wistia/type-guards");
10281
+ var import_type_guards35 = require("@wistia/type-guards");
10267
10282
  var useFocusRestore = () => {
10268
10283
  const previouslyFocusedRef = (0, import_react42.useRef)(null);
10269
10284
  (0, import_react42.useEffect)(() => {
@@ -10271,7 +10286,7 @@ var useFocusRestore = () => {
10271
10286
  }, []);
10272
10287
  (0, import_react42.useEffect)(() => {
10273
10288
  return () => {
10274
- if ((0, import_type_guards34.isNotNil)(previouslyFocusedRef.current)) {
10289
+ if ((0, import_type_guards35.isNotNil)(previouslyFocusedRef.current)) {
10275
10290
  setTimeout(() => {
10276
10291
  previouslyFocusedRef.current?.focus();
10277
10292
  }, 0);
@@ -10418,7 +10433,7 @@ var Modal = (0, import_react45.forwardRef)(
10418
10433
  import_react_dialog4.Root,
10419
10434
  {
10420
10435
  onOpenChange: (open2) => {
10421
- if (!open2 && (0, import_type_guards35.isNotNil)(onRequestClose)) {
10436
+ if (!open2 && (0, import_type_guards36.isNotNil)(onRequestClose)) {
10422
10437
  onRequestClose();
10423
10438
  }
10424
10439
  },
@@ -10431,7 +10446,7 @@ var Modal = (0, import_react45.forwardRef)(
10431
10446
  ref,
10432
10447
  fullHeight,
10433
10448
  onOpenAutoFocus: (event) => {
10434
- if ((0, import_type_guards35.isNotNil)(initialFocusRef) && initialFocusRef.current) {
10449
+ if ((0, import_type_guards36.isNotNil)(initialFocusRef) && initialFocusRef.current) {
10435
10450
  event.preventDefault();
10436
10451
  requestAnimationFrame(() => {
10437
10452
  initialFocusRef.current?.focus();
@@ -10465,9 +10480,9 @@ var import_react_popover = require("@radix-ui/react-popover");
10465
10480
  var import_styled_components63 = __toESM(require("styled-components"));
10466
10481
 
10467
10482
  // src/private/helpers/getControls/getControlProps.tsx
10468
- var import_type_guards36 = require("@wistia/type-guards");
10483
+ var import_type_guards37 = require("@wistia/type-guards");
10469
10484
  var getControlProps = (isOpen, onOpenChange) => {
10470
- return (0, import_type_guards36.isNotNil)(onOpenChange) && (0, import_type_guards36.isNotNil)(isOpen) ? { open: isOpen, onOpenChange } : {};
10485
+ return (0, import_type_guards37.isNotNil)(onOpenChange) && (0, import_type_guards37.isNotNil)(isOpen) ? { open: isOpen, onOpenChange } : {};
10471
10486
  };
10472
10487
 
10473
10488
  // src/components/Popover/Popover.tsx
@@ -10526,7 +10541,7 @@ Popover.displayName = "Popover";
10526
10541
  // src/components/ProgressBar/ProgressBar.tsx
10527
10542
  var import_styled_components64 = __toESM(require("styled-components"));
10528
10543
  var import_react_progress = require("@radix-ui/react-progress");
10529
- var import_type_guards37 = require("@wistia/type-guards");
10544
+ var import_type_guards38 = require("@wistia/type-guards");
10530
10545
  var import_jsx_runtime245 = require("react/jsx-runtime");
10531
10546
  var ProgressBarWrapper = import_styled_components64.default.div`
10532
10547
  --progress-bar-height: 8px;
@@ -10581,7 +10596,7 @@ var ProgressBar = ({
10581
10596
  ...props
10582
10597
  }) => {
10583
10598
  return /* @__PURE__ */ (0, import_jsx_runtime245.jsxs)(ProgressBarWrapper, { children: [
10584
- (0, import_type_guards37.isNotNil)(labelLeft) ? /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(ProgressBarLabel, { children: labelLeft }) : null,
10599
+ (0, import_type_guards38.isNotNil)(labelLeft) ? /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(ProgressBarLabel, { children: labelLeft }) : null,
10585
10600
  /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(
10586
10601
  StyledProgressBar,
10587
10602
  {
@@ -10597,7 +10612,7 @@ var ProgressBar = ({
10597
10612
  )
10598
10613
  }
10599
10614
  ),
10600
- (0, import_type_guards37.isNotNil)(labelRight) ? /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(ProgressBarLabel, { children: labelRight }) : null
10615
+ (0, import_type_guards38.isNotNil)(labelRight) ? /* @__PURE__ */ (0, import_jsx_runtime245.jsx)(ProgressBarLabel, { children: labelRight }) : null
10601
10616
  ] });
10602
10617
  };
10603
10618
  ProgressBar.displayName = "ProgressBar";
@@ -10605,7 +10620,7 @@ ProgressBar.displayName = "ProgressBar";
10605
10620
  // src/components/Radio/Radio.tsx
10606
10621
  var import_react46 = require("react");
10607
10622
  var import_styled_components65 = __toESM(require("styled-components"));
10608
- var import_type_guards38 = require("@wistia/type-guards");
10623
+ var import_type_guards39 = require("@wistia/type-guards");
10609
10624
  var import_jsx_runtime246 = require("react/jsx-runtime");
10610
10625
  var RadioIcon = () => /* @__PURE__ */ (0, import_jsx_runtime246.jsx)(
10611
10626
  "svg",
@@ -10722,7 +10737,7 @@ var Radio = (0, import_react46.forwardRef)(
10722
10737
  ...props
10723
10738
  }, ref) => {
10724
10739
  const generatedId = (0, import_react46.useId)();
10725
- const computedId = (0, import_type_guards38.isNonEmptyString)(id) ? id : `wistia-ui-radio-${generatedId}`;
10740
+ const computedId = (0, import_type_guards39.isNonEmptyString)(id) ? id : `wistia-ui-radio-${generatedId}`;
10726
10741
  return /* @__PURE__ */ (0, import_jsx_runtime246.jsxs)(
10727
10742
  StyledRadioWrapper,
10728
10743
  {
@@ -10774,7 +10789,7 @@ Radio.displayName = "Radio";
10774
10789
  var import_react50 = require("react");
10775
10790
  var import_styled_components67 = __toESM(require("styled-components"));
10776
10791
  var import_react_toggle_group = require("@radix-ui/react-toggle-group");
10777
- var import_type_guards39 = require("@wistia/type-guards");
10792
+ var import_type_guards40 = require("@wistia/type-guards");
10778
10793
 
10779
10794
  // src/components/SegmentedControl/useSelectedItemMeasurements.tsx
10780
10795
  var import_react47 = require("react");
@@ -10885,7 +10900,7 @@ var SegmentedControl = (0, import_react50.forwardRef)(
10885
10900
  onSelectedValueChange,
10886
10901
  ...props
10887
10902
  }, ref) => {
10888
- if ((0, import_type_guards39.isNil)(children)) {
10903
+ if ((0, import_type_guards40.isNil)(children)) {
10889
10904
  return null;
10890
10905
  }
10891
10906
  return /* @__PURE__ */ (0, import_jsx_runtime249.jsx)(
@@ -10915,22 +10930,6 @@ var import_react51 = require("react");
10915
10930
  var import_styled_components68 = __toESM(require("styled-components"));
10916
10931
  var import_react_toggle_group2 = require("@radix-ui/react-toggle-group");
10917
10932
  var import_type_guards41 = require("@wistia/type-guards");
10918
-
10919
- // src/private/helpers/mergeRefs/mergeRefs.ts
10920
- var import_type_guards40 = require("@wistia/type-guards");
10921
- var mergeRefs = (refs) => (value) => {
10922
- refs.forEach((ref) => {
10923
- if ((0, import_type_guards40.isFunction)(ref)) {
10924
- ref(value);
10925
- return;
10926
- }
10927
- if ((0, import_type_guards40.isNotNil)(ref)) {
10928
- ref.current = value;
10929
- }
10930
- });
10931
- };
10932
-
10933
- // src/components/SegmentedControl/SegmentedControlItem.tsx
10934
10933
  var import_jsx_runtime250 = require("react/jsx-runtime");
10935
10934
  var segmentedControlItemStyles = import_styled_components68.css`
10936
10935
  all: unset; /* ToggleGroupItem is a button element */
@@ -12190,6 +12189,7 @@ WistiaLogo.displayName = "WistiaLogo";
12190
12189
  ellipsisFlexParentStyle,
12191
12190
  ellipsisStyle,
12192
12191
  iconSizeMap,
12192
+ mergeRefs,
12193
12193
  mq,
12194
12194
  useActiveMq,
12195
12195
  useAriaLive,