@wistia/ui 0.4.10-beta.956100ac.87f8dee → 0.4.10-beta.a2f4e707.bc921c7

package/dist/index.cjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.4.10-beta.956100ac.87f8dee
+ * @license @wistia/ui v0.4.10-beta.a2f4e707.bc921c7
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -6074,6 +6074,13 @@ Badge.displayName = "Badge";
 var import_react16 = require("react");
 var import_styled_components23 = __toESM(require("styled-components"));
 var import_type_guards15 = require("@wistia/type-guards");
+
+// src/private/helpers/makePolymorphic/makePolymorphic.tsx
+var makePolymorphic = (component) => {
+  return component;
+};
+
+// src/components/Box/Box.tsx
 var import_jsx_runtime167 = require("react/jsx-runtime");
 var isDev = process.env["NODE_ENV"] === "development" || process.env["NODE_ENV"] === "test";
 var getGapStyle = (gap) => {
@@ -6117,7 +6124,7 @@ var getFillViewportStyle = (fillViewport) => {
   }
   return void 0;
 };
-var BoxComponent = import_styled_components23.default.div`
+var StyledBoxComponent = import_styled_components23.default.div`
   align-content: ${({ $alignContent }) => $alignContent};
   align-items: ${({ $alignItems }) => $alignItems};
   align-self: ${({ $alignSelf }) => $alignSelf ?? null};
@@ -6151,7 +6158,8 @@ var wrapChildren = (children) => {
   }
   return null;
 };
-var Box = (0, import_react16.forwardRef)(
+var DEFAULT_ELEMENT = "div";
+var BoxComponent = (0, import_react16.forwardRef)(
   ({
     alignContent = "stretch",
     alignItems = "flex-start",
@@ -6168,12 +6176,13 @@ var Box = (0, import_react16.forwardRef)(
     inline = false,
     justifyContent = "flex-start",
     order,
+    renderAs,
     shrink,
     wrapItems = false,
     ...otherProps
   }, ref) => {
     return /* @__PURE__ */ (0, import_jsx_runtime167.jsx)(
-      BoxComponent,
+      StyledBoxComponent,
       {
         ref,
         $alignContent: alignContent,
@@ -6190,14 +6199,15 @@ var Box = (0, import_react16.forwardRef)(
         $order: order,
         $shrink: shrink,
         $wrapItems: wrapItems,
-        as: "div",
+        as: renderAs ?? DEFAULT_ELEMENT,
         ...otherProps,
         children: wrapChildren(children)
       }
     );
   }
 );
-Box.displayName = "Box";
+BoxComponent.displayName = "Box";
+var Box = makePolymorphic(BoxComponent);
 
 // src/components/Breadcrumbs/Breadcrumbs.tsx
 var import_styled_components24 = __toESM(require("styled-components"));
@@ -6367,13 +6377,6 @@ var import_styled_components28 = __toESM(require("styled-components"));
 // src/components/Heading/Heading.tsx
 var import_react17 = require("react");
 var import_styled_components27 = __toESM(require("styled-components"));
-
-// src/private/helpers/makePolymorphic/makePolymorphic.tsx
-var makePolymorphic = (component) => {
-  return component;
-};
-
-// src/components/Heading/Heading.tsx
 var import_jsx_runtime172 = require("react/jsx-runtime");
 var heroStyle = import_styled_components27.css`
   --font-family: var(--wui-typography-heading-hero-family);
@@ -6426,7 +6429,7 @@ var variantStyleMap = {
   heading5: heading5TextStyle,
   heading6: heading6TextStyle
 };
-var DEFAULT_ELEMENT = "h1";
+var DEFAULT_ELEMENT2 = "h1";
 var StyledHeading = import_styled_components27.default.div`
   ${({ $colorScheme }) => getColorScheme($colorScheme)};
   font-family: var(--font-family);
@@ -6451,8 +6454,8 @@ var StyledHeading = import_styled_components27.default.div`
   margin: 0;
 `;
 var variantElementMap = {
-  hero: DEFAULT_ELEMENT,
-  heading1: DEFAULT_ELEMENT,
+  hero: DEFAULT_ELEMENT2,
+  heading1: DEFAULT_ELEMENT2,
   heading2: "h2",
   heading3: "h3",
   heading4: "h4",
@@ -6754,7 +6757,7 @@ var import_type_guards19 = require("@wistia/type-guards");
 var import_react19 = require("react");
 var import_styled_components32 = __toESM(require("styled-components"));
 var import_jsx_runtime177 = require("react/jsx-runtime");
-var DEFAULT_ELEMENT2 = "div";
+var DEFAULT_ELEMENT3 = "div";
 var StyledStack = import_styled_components32.default.div`
   display: flex;
   flex-direction: ${({ $direction }) => $direction === "horizontal" ? "row" : "column"};
@@ -6770,7 +6773,7 @@ var StackComponent = (0, import_react19.forwardRef)(
         ref,
         $direction: responsiveDirection,
         $gap: responsiveGap,
-        as: renderAs ?? DEFAULT_ELEMENT2,
+        as: renderAs ?? DEFAULT_ELEMENT3,
         ...props
       }
     );
@@ -7091,7 +7094,7 @@ var StyledText = import_styled_components34.default.div`
       display: block;
     `}
 `;
-var DEFAULT_ELEMENT3 = "div";
+var DEFAULT_ELEMENT4 = "div";
 var TextComponent = (0, import_react23.forwardRef)(
   ({
     align = "left",
@@ -7117,7 +7120,7 @@ var TextComponent = (0, import_react23.forwardRef)(
         $preventUserSelect: preventUserSelect,
         $prominence: prominence,
         $variant: variant,
-        as: renderAs ?? DEFAULT_ELEMENT3,
+        as: renderAs ?? DEFAULT_ELEMENT4,
         ...otherProps
       }
     );
@@ -8204,6 +8207,7 @@ var ModalContent = (0, import_react36.forwardRef)(
         ref,
         $fullHeight: fullHeight,
         $width: width,
+        "aria-describedby": void 0,
         ...otherProps,
         children
       }
@@ -8299,7 +8303,6 @@ var Modal = (0, import_react38.forwardRef)(
             ModalContent,
             {
               ref,
-              "aria-describedby": void 0,
               fullHeight,
               onOpenAutoFocus: (event) => {
                 if ((0, import_type_guards28.isNotNil)(initialFocusRef) && initialFocusRef.current) {