@wistia/vhs 4.0.0-beta.7034eb93.0e6bb17 → 4.0.0-beta.8eac0c1a.5bcb9ae

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/vhs v4.0.0-beta.7034eb93.0e6bb17
3
+ * @license @wistia/vhs v4.0.0-beta.8eac0c1a.5bcb9ae
4
4
  *
5
5
  * Copyright (c) 2021-2025, Wistia, Inc. and its affiliates.
6
6
  *
@@ -96,6 +96,7 @@ __export(index_exports, {
96
96
  ScreenReaderOnly: () => ScreenReaderOnly,
97
97
  Select: () => Select,
98
98
  Slider: () => Slider,
99
+ Stack: () => Stack,
99
100
  SubMenu: () => SubMenu,
100
101
  Switch: () => Switch,
101
102
  Text: () => Text,
@@ -13500,10 +13501,39 @@ var Slider = ({
13500
13501
  };
13501
13502
  Slider.displayName = "Slider_VHS";
13502
13503
 
13503
- // src/components/Switch/Switch.tsx
13504
+ // src/components/Stack/Stack.tsx
13505
+ var import_react63 = require("react");
13504
13506
  var import_styled_components77 = require("styled-components");
13505
13507
  var import_jsx_runtime209 = require("react/jsx-runtime");
13506
- var SwitchComponent = import_styled_components77.styled.button`
13508
+ var StyledStack = import_styled_components77.styled.div`
13509
+ display: flex;
13510
+ flex-direction: ${({ $direction }) => $direction === "horizontal" ? "row" : "column"};
13511
+ gap: ${({ $gap, theme: theme2 }) => theme2.spacing[$gap]};
13512
+
13513
+ > * {
13514
+ flex: 1;
13515
+ }
13516
+ `;
13517
+ var Stack = (0, import_react63.forwardRef)(
13518
+ ({ renderAs = "div", direction = "vertical", gap = "space02", ...props }, ref) => {
13519
+ return /* @__PURE__ */ (0, import_jsx_runtime209.jsx)(
13520
+ StyledStack,
13521
+ {
13522
+ ...props,
13523
+ ref,
13524
+ $direction: direction,
13525
+ $gap: gap,
13526
+ as: renderAs
13527
+ }
13528
+ );
13529
+ }
13530
+ );
13531
+ Stack.displayName = "Stack_VHS";
13532
+
13533
+ // src/components/Switch/Switch.tsx
13534
+ var import_styled_components78 = require("styled-components");
13535
+ var import_jsx_runtime210 = require("react/jsx-runtime");
13536
+ var SwitchComponent = import_styled_components78.styled.button`
13507
13537
  background-color: white;
13508
13538
  border-color: ${({ theme: theme2 }) => theme2.color.grey700};
13509
13539
  border-radius: 20px;
@@ -13540,7 +13570,7 @@ var SwitchComponent = import_styled_components77.styled.button`
13540
13570
  opacity: 0.5;
13541
13571
  }
13542
13572
  `;
13543
- var ShowTextStyles = import_styled_components77.css`
13573
+ var ShowTextStyles = import_styled_components78.css`
13544
13574
  &::before,
13545
13575
  &::after {
13546
13576
  display: inline-block;
@@ -13568,7 +13598,7 @@ var ShowTextStyles = import_styled_components77.css`
13568
13598
  }
13569
13599
  }
13570
13600
  `;
13571
- var SwitchKnob = import_styled_components77.styled.div`
13601
+ var SwitchKnob = import_styled_components78.styled.div`
13572
13602
  background-color: ${({ theme: theme2 }) => theme2.color.grey700};
13573
13603
  border-radius: 50%;
13574
13604
  height: 12px;
@@ -13603,7 +13633,7 @@ var Switch = ({
13603
13633
  onChange(!isChecked);
13604
13634
  }
13605
13635
  };
13606
- return /* @__PURE__ */ (0, import_jsx_runtime209.jsx)(
13636
+ return /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(
13607
13637
  SwitchComponent,
13608
13638
  {
13609
13639
  $colorOverride: colorOverride,
@@ -13615,17 +13645,17 @@ var Switch = ({
13615
13645
  role: "switch",
13616
13646
  type: "button",
13617
13647
  ...otherProps,
13618
- children: /* @__PURE__ */ (0, import_jsx_runtime209.jsx)(SwitchKnob, { $hideText: hideText })
13648
+ children: /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(SwitchKnob, { $hideText: hideText })
13619
13649
  }
13620
13650
  );
13621
13651
  };
13622
13652
  Switch.displayName = "Switch_VHS";
13623
13653
 
13624
13654
  // src/components/Thumbnail/Thumbnail.tsx
13625
- var import_styled_components78 = require("styled-components");
13655
+ var import_styled_components79 = require("styled-components");
13626
13656
  var import_type_guards71 = require("@wistia/type-guards");
13627
- var import_jsx_runtime210 = require("react/jsx-runtime");
13628
- var ThumbnailComponent = import_styled_components78.styled.div`
13657
+ var import_jsx_runtime211 = require("react/jsx-runtime");
13658
+ var ThumbnailComponent = import_styled_components79.styled.div`
13629
13659
  ${({ $gradientBackground }) => getBackgroundGradient($gradientBackground)};
13630
13660
  aspect-ratio: 16 / 9;
13631
13661
  background-image: ${({ $backgroundUrl }) => $backgroundUrl};
@@ -13637,17 +13667,17 @@ var ThumbnailComponent = import_styled_components78.styled.div`
13637
13667
  position: relative;
13638
13668
  width: ${({ $width }) => $width};
13639
13669
  `;
13640
- var WideThumbnailImage = import_styled_components78.styled.img`
13670
+ var WideThumbnailImage = import_styled_components79.styled.img`
13641
13671
  height: 100%;
13642
13672
  object-fit: cover;
13643
13673
  width: 100%;
13644
13674
  `;
13645
- var SquareThumbnailImage = import_styled_components78.styled.img`
13675
+ var SquareThumbnailImage = import_styled_components79.styled.img`
13646
13676
  backdrop-filter: blur(8px);
13647
13677
  object-fit: contain;
13648
13678
  width: 100%;
13649
13679
  `;
13650
- var BottomRightText = import_styled_components78.styled.div`
13680
+ var BottomRightText = import_styled_components79.styled.div`
13651
13681
  align-items: center;
13652
13682
  background-color: rgb(0 0 0 / 50%);
13653
13683
  border-radius: 2px;
@@ -13664,7 +13694,7 @@ var BottomRightText = import_styled_components78.styled.div`
13664
13694
  right: 0;
13665
13695
  z-index: 1;
13666
13696
  `;
13667
- var IconContainer3 = import_styled_components78.styled.div`
13697
+ var IconContainer3 = import_styled_components79.styled.div`
13668
13698
  align-self: center;
13669
13699
  aspect-ratio: 1;
13670
13700
  margin: 30%;
@@ -13677,7 +13707,7 @@ var IconContainer3 = import_styled_components78.styled.div`
13677
13707
  `;
13678
13708
  var ThumbnailImage = ({ $thumbnailImageType, $thumbnailUrl }) => {
13679
13709
  if ($thumbnailImageType === "wide") {
13680
- return /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(
13710
+ return /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(
13681
13711
  WideThumbnailImage,
13682
13712
  {
13683
13713
  alt: "",
@@ -13686,7 +13716,7 @@ var ThumbnailImage = ({ $thumbnailImageType, $thumbnailUrl }) => {
13686
13716
  );
13687
13717
  }
13688
13718
  if ($thumbnailImageType === "square") {
13689
- return /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(
13719
+ return /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(
13690
13720
  SquareThumbnailImage,
13691
13721
  {
13692
13722
  alt: "",
@@ -13696,13 +13726,13 @@ var ThumbnailImage = ({ $thumbnailImageType, $thumbnailUrl }) => {
13696
13726
  }
13697
13727
  return null;
13698
13728
  };
13699
- var Collage = import_styled_components78.styled.div`
13729
+ var Collage = import_styled_components79.styled.div`
13700
13730
  display: grid;
13701
13731
  grid-template-columns: auto auto;
13702
13732
  grid-template-rows: 50% 50%;
13703
13733
  width: 100%;
13704
13734
  `;
13705
- var CollageImage = import_styled_components78.styled.div`
13735
+ var CollageImage = import_styled_components79.styled.div`
13706
13736
  background-image: ${({ $thumbnailUrl }) => `url(${$thumbnailUrl})`};
13707
13737
  background-position: center;
13708
13738
  background-size: cover;
@@ -13730,7 +13760,7 @@ var Thumbnail = ({
13730
13760
  ...otherProps
13731
13761
  }) => {
13732
13762
  const thumbnailUrlToUse = Array.isArray(thumbnailUrl) ? thumbnailUrl[0] : thumbnailUrl;
13733
- return /* @__PURE__ */ (0, import_jsx_runtime210.jsxs)(
13763
+ return /* @__PURE__ */ (0, import_jsx_runtime211.jsxs)(
13734
13764
  ThumbnailComponent,
13735
13765
  {
13736
13766
  $backgroundUrl: thumbnailImageType === "square" && (0, import_type_guards71.isNotNil)(thumbnailUrlToUse) ? `url(${thumbnailUrlToUse})` : "",
@@ -13738,31 +13768,31 @@ var Thumbnail = ({
13738
13768
  $width: width,
13739
13769
  ...otherProps,
13740
13770
  children: [
13741
- (0, import_type_guards71.isNotNil)(bottomRightText) ? /* @__PURE__ */ (0, import_jsx_runtime210.jsxs)(BottomRightText, { children: [
13742
- bottomRightIcon ? /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(
13771
+ (0, import_type_guards71.isNotNil)(bottomRightText) ? /* @__PURE__ */ (0, import_jsx_runtime211.jsxs)(BottomRightText, { children: [
13772
+ bottomRightIcon ? /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(
13743
13773
  Icon,
13744
13774
  {
13745
13775
  size: "sm",
13746
13776
  type: bottomRightIcon
13747
13777
  }
13748
13778
  ) : null,
13749
- /* @__PURE__ */ (0, import_jsx_runtime210.jsx)("span", { children: bottomRightText })
13779
+ /* @__PURE__ */ (0, import_jsx_runtime211.jsx)("span", { children: bottomRightText })
13750
13780
  ] }) : null,
13751
- (0, import_type_guards71.isNotNil)(icon) && /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(IconContainer3, { children: /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(
13781
+ (0, import_type_guards71.isNotNil)(icon) && /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(IconContainer3, { children: /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(
13752
13782
  Icon,
13753
13783
  {
13754
13784
  color: iconColor,
13755
13785
  type: icon
13756
13786
  }
13757
13787
  ) }),
13758
- !Array.isArray(thumbnailUrl) && (0, import_type_guards71.isNotNil)(thumbnailImageType) && (0, import_type_guards71.isNotNil)(thumbnailUrl) && /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(
13788
+ !Array.isArray(thumbnailUrl) && (0, import_type_guards71.isNotNil)(thumbnailImageType) && (0, import_type_guards71.isNotNil)(thumbnailUrl) && /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(
13759
13789
  ThumbnailImage,
13760
13790
  {
13761
13791
  $thumbnailImageType: thumbnailImageType,
13762
13792
  $thumbnailUrl: thumbnailUrl
13763
13793
  }
13764
13794
  ),
13765
- Array.isArray(thumbnailUrl) && (0, import_type_guards71.isNotNil)(thumbnailImageType) && (0, import_type_guards71.isNotNil)(thumbnailUrl) && /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(Collage, { "data-testid": "thumbnail-collage", children: thumbnailUrl.map((url, index) => /* @__PURE__ */ (0, import_jsx_runtime210.jsx)(
13795
+ Array.isArray(thumbnailUrl) && (0, import_type_guards71.isNotNil)(thumbnailImageType) && (0, import_type_guards71.isNotNil)(thumbnailUrl) && /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(Collage, { "data-testid": "thumbnail-collage", children: thumbnailUrl.map((url, index) => /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(
13766
13796
  CollageImage,
13767
13797
  {
13768
13798
  $thumbnailUrl: url,
@@ -13778,10 +13808,10 @@ var Thumbnail = ({
13778
13808
  Thumbnail.displayName = "Thumbnail_VHS";
13779
13809
 
13780
13810
  // src/components/ThumbnailCollage/ThumbnailCollage.tsx
13781
- var import_styled_components79 = require("styled-components");
13811
+ var import_styled_components80 = require("styled-components");
13782
13812
  var import_type_guards72 = require("@wistia/type-guards");
13783
- var import_jsx_runtime211 = require("react/jsx-runtime");
13784
- var ThumbnailCollageContainer = import_styled_components79.styled.div`
13813
+ var import_jsx_runtime212 = require("react/jsx-runtime");
13814
+ var ThumbnailCollageContainer = import_styled_components80.styled.div`
13785
13815
  display: grid;
13786
13816
  grid-template-columns: 3fr 2fr;
13787
13817
  grid-template-rows: 1fr 1fr;
@@ -13789,7 +13819,7 @@ var ThumbnailCollageContainer = import_styled_components79.styled.div`
13789
13819
  grid-gap: ${({ theme: theme2 }) => theme2.spacing.space01};
13790
13820
  height: 100%;
13791
13821
  `;
13792
- var CollageImage2 = import_styled_components79.styled.div`
13822
+ var CollageImage2 = import_styled_components80.styled.div`
13793
13823
  ${({ $thumbnailUrl }) => (0, import_type_guards72.isNotNil)($thumbnailUrl) && `background-image: url(${$thumbnailUrl})`};
13794
13824
  ${({ $backgroundGradient }) => $backgroundGradient && getBackgroundGradient($backgroundGradient)};
13795
13825
  background-position: center;
@@ -13819,37 +13849,37 @@ var ThumbnailCollage = ({
13819
13849
  gradientBackground = "defaultMidOne",
13820
13850
  ...props
13821
13851
  }) => {
13822
- return /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(
13852
+ return /* @__PURE__ */ (0, import_jsx_runtime212.jsx)(
13823
13853
  ThumbnailCollageContainer,
13824
13854
  {
13825
13855
  role: "presentation",
13826
13856
  ...props,
13827
- children: thumbnailUrls.length ? thumbnailUrls.map((thumbnailUrl) => /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(
13857
+ children: thumbnailUrls.length ? thumbnailUrls.map((thumbnailUrl) => /* @__PURE__ */ (0, import_jsx_runtime212.jsx)(
13828
13858
  CollageImage2,
13829
13859
  {
13830
13860
  $thumbnailUrl: thumbnailUrl
13831
13861
  },
13832
13862
  thumbnailUrl
13833
- )) : /* @__PURE__ */ (0, import_jsx_runtime211.jsx)(CollageImage2, { $backgroundGradient: gradientBackground })
13863
+ )) : /* @__PURE__ */ (0, import_jsx_runtime212.jsx)(CollageImage2, { $backgroundGradient: gradientBackground })
13834
13864
  }
13835
13865
  );
13836
13866
  };
13837
13867
 
13838
13868
  // src/components/WistiaLogo/WistiaLogo.tsx
13839
- var import_styled_components80 = require("styled-components");
13869
+ var import_styled_components81 = require("styled-components");
13840
13870
  var import_type_guards73 = require("@wistia/type-guards");
13841
- var import_jsx_runtime212 = require("react/jsx-runtime");
13871
+ var import_jsx_runtime213 = require("react/jsx-runtime");
13842
13872
  var renderBrandmark = (brandmarkColor, iconOnly) => {
13843
13873
  if (iconOnly) {
13844
- return /* @__PURE__ */ (0, import_jsx_runtime212.jsx)("g", { fill: brandmarkColor, children: /* @__PURE__ */ (0, import_jsx_runtime212.jsx)("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" }) });
13874
+ return /* @__PURE__ */ (0, import_jsx_runtime213.jsx)("g", { fill: brandmarkColor, children: /* @__PURE__ */ (0, import_jsx_runtime213.jsx)("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" }) });
13845
13875
  }
13846
- return /* @__PURE__ */ (0, import_jsx_runtime212.jsx)("g", { fill: brandmarkColor, children: /* @__PURE__ */ (0, import_jsx_runtime212.jsx)("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" }) });
13876
+ return /* @__PURE__ */ (0, import_jsx_runtime213.jsx)("g", { fill: brandmarkColor, children: /* @__PURE__ */ (0, import_jsx_runtime213.jsx)("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" }) });
13847
13877
  };
13848
13878
  var renderLogotype = (logotypeColor, iconOnly) => {
13849
13879
  if (iconOnly) {
13850
13880
  return null;
13851
13881
  }
13852
- return /* @__PURE__ */ (0, import_jsx_runtime212.jsx)("g", { fill: logotypeColor, children: /* @__PURE__ */ (0, import_jsx_runtime212.jsx)("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" }) });
13882
+ return /* @__PURE__ */ (0, import_jsx_runtime213.jsx)("g", { fill: logotypeColor, children: /* @__PURE__ */ (0, import_jsx_runtime213.jsx)("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" }) });
13853
13883
  };
13854
13884
  var computedViewBox = (iconOnly) => {
13855
13885
  if (iconOnly) {
@@ -13857,7 +13887,7 @@ var computedViewBox = (iconOnly) => {
13857
13887
  }
13858
13888
  return "0 0 144 31.47";
13859
13889
  };
13860
- var WistiaLogoComponent = import_styled_components80.styled.svg`
13890
+ var WistiaLogoComponent = import_styled_components81.styled.svg`
13861
13891
  height: ${({ height }) => `${height}px`};
13862
13892
 
13863
13893
  /* ensure it will always fit on mobile */
@@ -13899,7 +13929,7 @@ var WistiaLogo = ({
13899
13929
  };
13900
13930
  const brandmarkColor = VARIANT_COLORS[variant].brandmark;
13901
13931
  const logotypeColor = VARIANT_COLORS[variant].logotype;
13902
- const Logo = /* @__PURE__ */ (0, import_jsx_runtime212.jsxs)(
13932
+ const Logo = /* @__PURE__ */ (0, import_jsx_runtime213.jsxs)(
13903
13933
  WistiaLogoComponent,
13904
13934
  {
13905
13935
  $hoverColor: hoverColor,
@@ -13909,14 +13939,14 @@ var WistiaLogo = ({
13909
13939
  xmlns: "http://www.w3.org/2000/svg",
13910
13940
  ...otherProps,
13911
13941
  children: [
13912
- /* @__PURE__ */ (0, import_jsx_runtime212.jsx)("title", { children: title }),
13913
- (0, import_type_guards73.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime212.jsx)("desc", { children: description }) : null,
13942
+ /* @__PURE__ */ (0, import_jsx_runtime213.jsx)("title", { children: title }),
13943
+ (0, import_type_guards73.isNotNil)(description) ? /* @__PURE__ */ (0, import_jsx_runtime213.jsx)("desc", { children: description }) : null,
13914
13944
  renderBrandmark(brandmarkColor, iconOnly),
13915
13945
  renderLogotype(logotypeColor, iconOnly)
13916
13946
  ]
13917
13947
  }
13918
13948
  );
13919
- return href !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime212.jsx)("a", { href, children: Logo }) : Logo;
13949
+ return href !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime213.jsx)("a", { href, children: Logo }) : Logo;
13920
13950
  };
13921
13951
  WistiaLogo.displayName = "WistiaLogo_VHS";
13922
13952
  // Annotate the CommonJS export names for ESM import in node:
@@ -13978,6 +14008,7 @@ WistiaLogo.displayName = "WistiaLogo_VHS";
13978
14008
  ScreenReaderOnly,
13979
14009
  Select,
13980
14010
  Slider,
14011
+ Stack,
13981
14012
  SubMenu,
13982
14013
  Switch,
13983
14014
  Text,