@wistia/ui 0.13.4-beta.e06c6f96.83781c4 → 0.13.4

package/dist/index.cjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.13.4-beta.e06c6f96.83781c4
+ * @license @wistia/ui v0.13.4
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -2776,7 +2776,7 @@ var Ellipsis = ({ children, lines, ...props }) => /* @__PURE__ */ (0, import_jsx
     children
   }
 );
-Ellipsis.displayName = "Ellipsis_UI";
+Ellipsis.displayName = "Ellipsis";
 
 // src/private/helpers/getColorScheme/getColorScheme.ts
 var import_styled_components15 = require("styled-components");
@@ -7227,7 +7227,7 @@ var Icon = ({
     }
   );
 };
-Icon.displayName = "Icon_UI";
+Icon.displayName = "Icon";
 
 // src/components/Link/Link.tsx
 var import_react22 = require("react");
@@ -7367,7 +7367,7 @@ var Link = (0, import_react22.forwardRef)(
     return null;
   }
 );
-Link.displayName = "Link_UI";
+Link.displayName = "Link";
 
 // src/components/Button/Button.tsx
 var import_jsx_runtime197 = require("react/jsx-runtime");
@@ -7509,7 +7509,7 @@ var Button = (0, import_react23.forwardRef)(
     );
   }
 );
-Button.displayName = "Button_UI";
+Button.displayName = "Button";
 
 // src/components/ActionButton/ActionButton.tsx
 var import_jsx_runtime198 = require("react/jsx-runtime");
@@ -7649,7 +7649,7 @@ var ActionButton = (0, import_react24.forwardRef)(
     );
   }
 );
-ActionButton.displayName = "ActionButton_UI";
+ActionButton.displayName = "ActionButton";
 
 // src/components/Avatar/Avatar.tsx
 var import_react25 = require("react");
@@ -7721,7 +7721,7 @@ var Image = ({
     ...props
   }
 );
-Image.displayName = "Image_UI";
+Image.displayName = "Image";
 
 // src/components/ColorSchemeWrapper/ColorSchemeWrapper.tsx
 var import_styled_components24 = __toESM(require("styled-components"));
@@ -7764,7 +7764,7 @@ var ColorSchemeWrapper = ({
     children
   }
 );
-ColorSchemeWrapper.displayName = "ColorSchemeWrapper_UI";
+ColorSchemeWrapper.displayName = "ColorSchemeWrapper";
 
 // src/components/Avatar/Avatar.tsx
 var import_jsx_runtime201 = require("react/jsx-runtime");
@@ -7901,7 +7901,7 @@ var Avatar = ({
     }
   );
 };
-Avatar.displayName = "Avatar_UI";
+Avatar.displayName = "Avatar";
 
 // src/components/Badge/Badge.tsx
 var import_react26 = require("react");
@@ -7952,7 +7952,7 @@ var Badge = (0, import_react26.forwardRef)(
     );
   }
 );
-Badge.displayName = "Badge_UI";
+Badge.displayName = "Badge";
 
 // src/components/Banner/Banner.tsx
 var import_react31 = require("react");
@@ -8144,7 +8144,7 @@ var BoxComponent = (0, import_react27.forwardRef)(
     );
   }
 );
-BoxComponent.displayName = "Box_UI";
+BoxComponent.displayName = "Box";
 var Box = makePolymorphic(BoxComponent);
 
 // src/components/Heading/Heading.tsx
@@ -8283,7 +8283,7 @@ var HeadingComponent = (0, import_react28.forwardRef)(
     }
   )
 );
-HeadingComponent.displayName = "Heading_UI";
+HeadingComponent.displayName = "Heading";
 var Heading = makePolymorphic(HeadingComponent);
 
 // src/components/Text/Text.tsx
@@ -8493,7 +8493,7 @@ var TextComponent = (0, import_react29.forwardRef)(
     );
   }
 );
-TextComponent.displayName = "Text_UI";
+TextComponent.displayName = "Text";
 var Text = makePolymorphic(TextComponent);
 
 // src/components/ButtonGroup/ButtonGroup.tsx
@@ -8573,7 +8573,7 @@ var ButtonGroup = ({
     }
   );
 };
-ButtonGroup.displayName = "ButtonGroup_UI";
+ButtonGroup.displayName = "ButtonGroup";
 
 // src/components/IconButton/IconButton.tsx
 var import_react30 = require("react");
@@ -8611,7 +8611,7 @@ var IconButton = (0, import_react30.forwardRef)(
     );
   }
 );
-IconButton.displayName = "IconButton_UI";
+IconButton.displayName = "IconButton";
 
 // src/components/Banner/Banner.tsx
 var import_jsx_runtime208 = require("react/jsx-runtime");
@@ -8787,7 +8787,7 @@ var Banner = ({
     }
   );
 };
-Banner.displayName = "Banner_UI";
+Banner.displayName = "Banner";
 
 // src/components/Breadcrumbs/Breadcrumbs.tsx
 var import_react32 = require("react");
@@ -8835,7 +8835,7 @@ var Breadcrumbs = ({ children, ...props }) => {
     )
   ] });
 };
-Breadcrumbs.displayName = "Breadcrumbs_UI";
+Breadcrumbs.displayName = "Breadcrumbs";
 
 // src/components/Breadcrumbs/Breadcrumb.tsx
 var import_styled_components34 = __toESM(require("styled-components"));
@@ -8928,7 +8928,7 @@ var Card = ({
     children
   }
 );
-Card.displayName = "Card_UI";
+Card.displayName = "Card";
 
 // src/components/Center/Center.tsx
 var import_react33 = require("react");
@@ -8959,7 +8959,7 @@ var Center = (0, import_react33.forwardRef)(
     }
   )
 );
-Center.displayName = "Center_UI";
+Center.displayName = "Center";
 
 // src/components/Checkbox/Checkbox.tsx
 var import_react38 = require("react");
@@ -9026,7 +9026,7 @@ var ScreenReaderOnly = ({
   }
   return /* @__PURE__ */ (0, import_jsx_runtime214.jsx)(VisuallyHidden, { ...props, children: accessibleText });
 };
-ScreenReaderOnly.displayName = "ScreenReaderOnly_UI";
+ScreenReaderOnly.displayName = "ScreenReaderOnly";
 
 // src/private/components/FormControlLabel/FormControlLabel.tsx
 var import_jsx_runtime215 = require("react/jsx-runtime");
@@ -9124,7 +9124,7 @@ var StackComponent = (0, import_react34.forwardRef)(
     );
   }
 );
-StackComponent.displayName = "Stack_UI";
+StackComponent.displayName = "Stack";
 var Stack = makePolymorphic(StackComponent);
 
 // src/components/FormGroup/FormGroup.tsx
@@ -9188,7 +9188,7 @@ var FormGroup = ({
     }
   );
 };
-FormGroup.displayName = "FormGroup_UI";
+FormGroup.displayName = "FormGroup";
 
 // src/components/Form/Form.tsx
 var import_react36 = require("react");
@@ -9335,7 +9335,7 @@ var CheckboxGroup = ({
   }, [name, derivedValue, onChange]);
   return /* @__PURE__ */ (0, import_jsx_runtime219.jsx)(CheckboxGroupContext.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime219.jsx)(FormGroup, { ...props, children }) });
 };
-CheckboxGroup.displayName = "CheckboxGroup_UI";
+CheckboxGroup.displayName = "CheckboxGroup";
 
 // src/components/Checkbox/Checkbox.tsx
 var import_jsx_runtime220 = require("react/jsx-runtime");
@@ -9499,7 +9499,7 @@ var Checkbox = (0, import_react38.forwardRef)(
     ] });
   }
 );
-Checkbox.displayName = "Checkbox_UI";
+Checkbox.displayName = "Checkbox";
 
 // src/components/ClickRegion/ClickRegion.tsx
 var import_react39 = require("react");
@@ -9542,7 +9542,7 @@ var ClickRegion = ({ children, targetRef }) => {
     onClick: handleClick
   });
 };
-ClickRegion.displayName = "ClickRegion_UI";
+ClickRegion.displayName = "ClickRegion";
 
 // src/components/Collapsible/Collapsible.tsx
 var import_react_collapsible = require("@radix-ui/react-collapsible");
@@ -9567,7 +9567,7 @@ var Collapsible = ({
   };
   return /* @__PURE__ */ (0, import_jsx_runtime221.jsx)(StyledRoot, { ...controlProps, children });
 };
-Collapsible.displayName = "Collapsible_UI";
+Collapsible.displayName = "Collapsible";
 
 // src/components/Collapsible/CollapsibleTrigger.tsx
 var import_react40 = require("react");
@@ -9620,7 +9620,7 @@ var CollapsibleTriggerIcon = ({ type, ...props }) => {
     }
   );
 };
-CollapsibleTriggerIcon.displayName = "CollapsibleTriggerIcon_UI";
+CollapsibleTriggerIcon.displayName = "CollapsibleTriggerIcon";
 
 // src/components/Collapsible/CollapsibleContent.tsx
 var import_styled_components46 = __toESM(require("styled-components"));
@@ -10201,7 +10201,7 @@ var ColorGrid = ({ children }) => {
     }
   );
 };
-ColorGrid.displayName = "ColorGrid_UI";
+ColorGrid.displayName = "ColorGrid";
 
 // src/components/ColorPicker/ColorGridOption.tsx
 var import_styled_components50 = __toESM(require("styled-components"));
@@ -10411,7 +10411,7 @@ var Tooltip = ({
     }
   );
 };
-Tooltip.displayName = "Tooltip_UI";
+Tooltip.displayName = "Tooltip";
 
 // src/components/ColorPicker/ColorGridOption.tsx
 var import_jsx_runtime229 = require("react/jsx-runtime");
@@ -10454,7 +10454,7 @@ var ColorGridOption = ({ value, name }) => {
     }
   );
 };
-ColorGridOption.displayName = "ColorGridOption_UI";
+ColorGridOption.displayName = "ColorGridOption";
 
 // src/components/ColorPicker/ColorList.tsx
 var import_react43 = require("react");
@@ -10488,7 +10488,7 @@ var ColorList = ({ children }) => {
     }
   );
 };
-ColorList.displayName = "ColorList_UI";
+ColorList.displayName = "ColorList";
 
 // src/components/ColorPicker/ColorListGroup.tsx
 var import_styled_components52 = __toESM(require("styled-components"));
@@ -10518,7 +10518,7 @@ var ColorListGroup = ({ label, children }) => {
     }
   );
 };
-ColorListGroup.displayName = "ColorListGroup_UI";
+ColorListGroup.displayName = "ColorListGroup";
 
 // src/components/ColorPicker/ColorListOption.tsx
 var import_styled_components53 = __toESM(require("styled-components"));
@@ -10613,7 +10613,7 @@ var ColorListOption = ({ value, name }) => {
     }
   );
 };
-ColorListOption.displayName = "ColorListOption_UI";
+ColorListOption.displayName = "ColorListOption";
 
 // src/components/ColorPicker/ColorPicker.tsx
 var import_react_popover = require("@radix-ui/react-popover");
@@ -10638,7 +10638,7 @@ var ColorPicker = ({
     }
   ) });
 };
-ColorPicker.displayName = "ColorPicker_UI";
+ColorPicker.displayName = "ColorPicker";
 
 // src/components/ColorPicker/ColorPickerPopoverContent.tsx
 var import_react_popover2 = require("@radix-ui/react-popover");
@@ -10667,7 +10667,7 @@ var ColorPickerPopoverContent = ({
     }
   ) });
 };
-ColorPickerPopoverContent.displayName = "ColorPickerPopoverContent_UI";
+ColorPickerPopoverContent.displayName = "ColorPickerPopoverContent";
 
 // src/components/ColorPicker/ColorPickerSection.tsx
 var import_styled_components55 = __toESM(require("styled-components"));
@@ -10678,7 +10678,7 @@ var Container5 = import_styled_components55.default.div`
 var ColorPickerSection = ({ children }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(Container5, { children: /* @__PURE__ */ (0, import_jsx_runtime236.jsx)(Stack, { children }) });
 };
-ColorPickerSection.displayName = "ColorPickerSection_UI";
+ColorPickerSection.displayName = "ColorPickerSection";
 
 // src/components/ColorPicker/ColorPickerTrigger.tsx
 var import_react44 = require("react");
@@ -10691,7 +10691,7 @@ var ValueSwatch = () => {
   const { valueAsHex } = useColorPickerState();
   return /* @__PURE__ */ (0, import_jsx_runtime237.jsx)(ColorSwatch, { value: valueAsHex });
 };
-ValueSwatch.displayName = "ValueSwatch_UI";
+ValueSwatch.displayName = "ValueSwatch";
 
 // src/components/ColorPicker/ValueNameOrHexCode.tsx
 var import_jsx_runtime238 = require("react/jsx-runtime");
@@ -10699,7 +10699,7 @@ var ValueNameOrHexCode = () => {
   const { valueAsHex } = useColorPickerState();
   return /* @__PURE__ */ (0, import_jsx_runtime238.jsx)(ColorNameOrHexCode, { hexCode: valueAsHex });
 };
-ValueNameOrHexCode.displayName = "ValueNameOrHexCode_UI";
+ValueNameOrHexCode.displayName = "ValueNameOrHexCode";
 
 // src/components/ColorPicker/ColorPickerTrigger.tsx
 var import_jsx_runtime239 = require("react/jsx-runtime");
@@ -10739,7 +10739,7 @@ var ColorPickerTrigger = (0, import_react44.forwardRef)(
     );
   }
 );
-ColorPickerTrigger.displayName = "ColorPickerTrigger_UI";
+ColorPickerTrigger.displayName = "ColorPickerTrigger";
 
 // src/components/ColorPicker/ContrastIndicator.tsx
 var import_styled_components57 = __toESM(require("styled-components"));
@@ -10960,7 +10960,7 @@ var Switch = (0, import_react45.forwardRef)(
     ] });
   }
 );
-Switch.displayName = "Switch_UI";
+Switch.displayName = "Switch";
 
 // src/components/ColorPicker/ContrastEnforcerSwitch.tsx
 var import_jsx_runtime242 = require("react/jsx-runtime");
@@ -11023,7 +11023,7 @@ var ContrastControls = () => {
     /* @__PURE__ */ (0, import_jsx_runtime244.jsx)(ContrastEnforcerSwitch, {})
   ] });
 };
-ContrastControls.displayName = "ContrastControls_UI";
+ContrastControls.displayName = "ContrastControls";
 
 // src/components/ColorPicker/HexColorInput.tsx
 var import_react48 = require("react");
@@ -11233,7 +11233,7 @@ var Input = (0, import_react47.forwardRef)(
     );
   }
 );
-Input.displayName = "Input_UI";
+Input.displayName = "Input";
 
 // src/components/ColorPicker/HexColorInput.tsx
 var import_jsx_runtime246 = require("react/jsx-runtime");
@@ -11396,7 +11396,7 @@ var HexColorInput = ({ autoFocus = true }) => {
     }
   );
 };
-HexColorInput.displayName = "HexColorInput_UI";
+HexColorInput.displayName = "HexColorInput";
 
 // src/components/ColorPicker/HueSlider.tsx
 var import_react50 = require("react");
@@ -11533,7 +11533,7 @@ var HueSlider = () => {
     /* @__PURE__ */ (0, import_jsx_runtime248.jsx)(HSVHueCanvas, { hsv: valueAsHsv })
   ] });
 };
-HueSlider.displayName = "HueSlider_UI";
+HueSlider.displayName = "HueSlider";
 
 // src/components/ColorPicker/SaturationAndValuePicker.tsx
 var import_react52 = require("react");
@@ -11905,7 +11905,7 @@ var SaturationAndValuePicker = ({
     )
   );
 };
-SaturationAndValuePicker.displayName = "SaturationAndValuePicker_UI";
+SaturationAndValuePicker.displayName = "SaturationAndValuePicker";
 
 // src/components/Combobox/Combobox.tsx
 var Ariakit = __toESM(require("@ariakit/react"));
@@ -12066,7 +12066,7 @@ var Tag = (0, import_react53.forwardRef)(
     );
   }
 );
-Tag.displayName = "Tag_UI";
+Tag.displayName = "Tag";
 
 // src/components/Combobox/Combobox.tsx
 var import_jsx_runtime252 = require("react/jsx-runtime");
@@ -12486,7 +12486,7 @@ var DataCard = (props) => {
   }
   return /* @__PURE__ */ (0, import_jsx_runtime253.jsx)(DataCardInner, { ...props });
 };
-DataCard.displayName = "DataCard_UI";
+DataCard.displayName = "DataCard";
 
 // src/components/DataCards/DataCards.tsx
 var import_styled_components68 = __toESM(require("styled-components"));
@@ -12520,7 +12520,7 @@ var DataCards = ({
     }
   );
 };
-DataCards.displayName = "DataCards_UI";
+DataCards.displayName = "DataCards";
 
 // src/components/DataCards/DataCardTrend.tsx
 var import_styled_components69 = __toESM(require("styled-components"));
@@ -12598,7 +12598,7 @@ var Divider = ({ orientation = "horizontal", ...props }) => {
     }
   );
 };
-Divider.displayName = "Divider_UI";
+Divider.displayName = "Divider";
 
 // src/components/EditableHeading/EditableHeading.tsx
 var import_styled_components71 = __toESM(require("styled-components"));
@@ -12872,7 +12872,7 @@ var Label = ({
     }
   );
 };
-Label.displayName = "Label_UI";
+Label.displayName = "Label";
 
 // src/components/FormField/FormField.tsx
 var import_jsx_runtime260 = require("react/jsx-runtime");
@@ -13030,7 +13030,7 @@ var FormField = ({
     }
   );
 };
-FormField.displayName = "FormField_UI";
+FormField.displayName = "FormField";
 
 // src/components/FormGroup/RadioGroup.tsx
 var import_react60 = require("react");
@@ -13057,7 +13057,7 @@ var RadioGroup = ({
   }, [name, derivedValue, onChange]);
   return /* @__PURE__ */ (0, import_jsx_runtime261.jsx)(RadioGroupContext.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime261.jsx)(FormGroup, { ...props, children }) });
 };
-RadioGroup.displayName = "RadioGroup_UI";
+RadioGroup.displayName = "RadioGroup";
 
 // src/components/Grid/Grid.tsx
 var import_react61 = require("react");
@@ -13065,57 +13065,49 @@ var import_styled_components74 = __toESM(require("styled-components"));
 var import_type_guards40 = require("@wistia/type-guards");
 var import_jsx_runtime262 = require("react/jsx-runtime");
 var DEFAULT_ELEMENT5 = "div";
-var getGridTemplateColumns = (maxColumns, minChildWidth, expandItems) => {
-  if (minChildWidth === "auto" && maxColumns === "auto") {
-    return import_styled_components74.css`
-      grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
-    `;
-  }
-  const gridMode = expandItems ? "auto-fit" : "auto-fill";
-  const minChildWidthValue = minChildWidth === "auto" ? 0 : minChildWidth;
-  if (maxColumns === "auto") {
-    return import_styled_components74.css`
-      grid-template-columns: repeat(${gridMode}, minmax(${minChildWidthValue}px, 1fr));
-    `;
-  }
-  return import_styled_components74.css`
-    /* Adapted from https://9elements.com/blog/building-a-rock-solid-auto-grid/ */
-    --wui-grid-min-column-size: ${minChildWidthValue}px;
-    --wui-grid-max-columns: ${maxColumns};
-    --wui-grid-column-gap-count: calc(var(--wui-grid-max-columns) - 1);
-    --wui-grid-total-column-gap-width: calc(
-      var(--wui-grid-column-gap-count) * var(--wui-grid-column-gap)
-    );
-    --wui-grid-max-column-width: calc(
-      (100% - var(--wui-grid-total-column-gap-width)) / var(--wui-grid-max-columns)
-    );
-
-    grid-template-columns: repeat(
-      ${gridMode},
-      minmax(max(var(--wui-grid-min-column-size), var(--wui-grid-max-column-width)), 1fr)
-    );
-  `;
-};
 var StyledGrid = import_styled_components74.default.div`
   --wui-grid-column-gap: ${({ $columnGap }) => `var(--wui-${$columnGap})`};
   --wui-grid-row-gap: ${({ $rowGap }) => `var(--wui-${$rowGap})`};
+  --wui-grid-min-column-size: ${({ $minChildWidth }) => $minChildWidth === "auto" ? "0" : `${$minChildWidth}px`};
+  --wui-grid-max-columns: ${({ $maxColumns }) => $maxColumns === "auto" ? "infinity" : $maxColumns};
+  --wui-grid-column-gap-count: calc(var(--wui-grid-max-columns) - 1);
+  --wui-grid-total-column-gap-width: calc(
+    var(--wui-grid-column-gap-count) * var(--wui-grid-column-gap)
+  );
+  --wui-grid-max-column-width: calc(
+    (100% - var(--wui-grid-total-column-gap-width)) / var(--wui-grid-max-columns)
+  );
 
   display: grid;
   gap: var(--wui-grid-column-gap) var(--wui-grid-row-gap);
   width: 100%;
 
-  ${({ $maxColumns, $minChildWidth, $expandItems }) => getGridTemplateColumns($maxColumns, $minChildWidth, $expandItems)}
+  ${({ $maxColumns, $minChildWidth }) => {
+  if ($maxColumns === "auto" && $minChildWidth === "auto") {
+    return import_styled_components74.css`
+        grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
+      `;
+  }
+  if ($maxColumns !== "auto" && $minChildWidth === "auto") {
+    return import_styled_components74.css`
+        grid-template-columns: repeat(${$maxColumns}, minmax(0, 1fr));
+      `;
+  }
+  if ($maxColumns === "auto" && $minChildWidth !== "auto") {
+    return import_styled_components74.css`
+        grid-template-columns: repeat(auto-fit, minmax(${$minChildWidth}px, 1fr));
+      `;
+  }
+  return import_styled_components74.css`
+      grid-template-columns: repeat(
+        auto-fit,
+        minmax(max(var(--wui-grid-min-column-size), var(--wui-grid-max-column-width)), 1fr)
+      );
+    `;
+}}
 `;
 var GridComponent = (0, import_react61.forwardRef)(
-  ({
-    children,
-    columns = "auto",
-    minChildWidth = "auto",
-    gap = "space-02",
-    expandItems = false,
-    renderAs,
-    ...props
-  }, ref) => {
+  ({ children, columns = "auto", minChildWidth = "auto", gap = "space-02", renderAs, ...props }, ref) => {
     const responsiveGap = useResponsiveProp(gap);
     const { column, row } = (0, import_type_guards40.isRecord)(responsiveGap) ? responsiveGap : { column: responsiveGap, row: responsiveGap };
     const responsiveColumns = useResponsiveProp(columns);
@@ -13125,7 +13117,6 @@ var GridComponent = (0, import_react61.forwardRef)(
       {
         ref,
         $columnGap: column,
-        $expandItems: expandItems,
         $maxColumns: responsiveColumns,
         $minChildWidth: responsiveMinChildWidth,
         $rowGap: row,
@@ -13136,7 +13127,7 @@ var GridComponent = (0, import_react61.forwardRef)(
     );
   }
 );
-GridComponent.displayName = "Grid_UI";
+GridComponent.displayName = "Grid";
 var Grid = makePolymorphic(GridComponent);
 
 // src/components/InputClickToCopy/InputClickToCopy.tsx
@@ -13201,7 +13192,7 @@ var InputClickToCopy = (0, import_react62.forwardRef)(
     );
   }
 );
-InputClickToCopy.displayName = "InputClickToCopy_UI";
+InputClickToCopy.displayName = "InputClickToCopy";
 
 // src/components/KeyboardShortcut/KeyboardShortcut.tsx
 var import_styled_components76 = __toESM(require("styled-components"));
@@ -13310,7 +13301,7 @@ var KeyboardShortcut = ({
     ]
   }
 );
-KeyboardShortcut.displayName = "KeyboardShortcut_UI";
+KeyboardShortcut.displayName = "KeyboardShortcut";
 
 // src/components/List/List.tsx
 var import_type_guards44 = require("@wistia/type-guards");
@@ -13329,7 +13320,7 @@ var ListItem = ({ children }) => {
   }
   return /* @__PURE__ */ (0, import_jsx_runtime265.jsx)(ListItemComponent, { children });
 };
-ListItem.displayName = "ListItem_UI";
+ListItem.displayName = "ListItem";
 
 // src/components/List/List.tsx
 var import_jsx_runtime266 = require("react/jsx-runtime");
@@ -13468,7 +13459,7 @@ var List = ({
   }
   return null;
 };
-List.displayName = "List_UI";
+List.displayName = "List";
 
 // src/components/Menu/Menu.tsx
 var import_react64 = require("react");
@@ -13633,8 +13624,8 @@ var Menu = (0, import_react64.forwardRef)(
     ) });
   }
 );
-Menu.displayName = "Menu_UI";
-Menu.displayName = "Menu_UI";
+Menu.displayName = "Menu";
+Menu.displayName = "Menu";
 
 // src/components/Menu/MenuLabel.tsx
 var import_styled_components80 = __toESM(require("styled-components"));
@@ -13661,7 +13652,7 @@ var MenuLabel = ({ children, ...props }) => {
     }
   );
 };
-MenuLabel.displayName = "MenuLabel_UI";
+MenuLabel.displayName = "MenuLabel";
 
 // src/components/Menu/SubMenu.tsx
 var import_react66 = require("react");
@@ -13786,7 +13777,7 @@ var MenuItemButton = (0, import_react65.forwardRef)(({ children, appearance, com
     }
   );
 });
-MenuItemButton.displayName = "MenuItemButton_UI";
+MenuItemButton.displayName = "MenuItemButton";
 
 // src/components/Menu/MenuItemLabelDescription.tsx
 var import_styled_components82 = __toESM(require("styled-components"));
@@ -13873,7 +13864,7 @@ var SubMenu = ({
     /* @__PURE__ */ (0, import_jsx_runtime271.jsx)(StyledMobileSubMenuItems, { children: isExpanded ? children : null })
   ] });
 };
-SubMenu.displayName = "SubMenu_UI";
+SubMenu.displayName = "SubMenu";
 
 // src/components/Menu/MenuItem.tsx
 var import_react67 = require("react");
@@ -13898,7 +13889,7 @@ var MenuItem = (0, import_react67.forwardRef)(
     );
   }
 );
-MenuItem.displayName = "MenuItem_UI";
+MenuItem.displayName = "MenuItem";
 
 // src/components/Menu/MenuRadioGroup.tsx
 var import_react_dropdown_menu5 = require("@radix-ui/react-dropdown-menu");
@@ -13906,7 +13897,7 @@ var import_jsx_runtime273 = require("react/jsx-runtime");
 var MenuRadioGroup = ({ children, ...props }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime273.jsx)(import_react_dropdown_menu5.DropdownMenuRadioGroup, { ...props, children });
 };
-MenuRadioGroup.displayName = "MenuRadioGroup_UI";
+MenuRadioGroup.displayName = "MenuRadioGroup";
 
 // src/components/Menu/RadioMenuItem.tsx
 var import_react_dropdown_menu6 = require("@radix-ui/react-dropdown-menu");
@@ -13940,7 +13931,7 @@ var RadioMenuItem = ({
     }
   );
 };
-RadioMenuItem.displayName = "RadioMenuItem_UI";
+RadioMenuItem.displayName = "RadioMenuItem";
 
 // src/components/Menu/CheckboxMenuItem.tsx
 var import_react_dropdown_menu7 = require("@radix-ui/react-dropdown-menu");
@@ -14025,7 +14016,7 @@ var CheckboxMenuItem = ({
     }
   );
 };
-CheckboxMenuItem.displayName = "CheckboxMenuItem_UI";
+CheckboxMenuItem.displayName = "CheckboxMenuItem";
 
 // src/components/Menu/FilterMenu.tsx
 var import_react68 = require("react");
@@ -14127,7 +14118,7 @@ var FilterMenu = (0, import_react68.forwardRef)(
     );
   }
 );
-FilterMenu.displayName = "FilterMenu_UI";
+FilterMenu.displayName = "FilterMenu";
 
 // src/components/Modal/Modal.tsx
 var import_react71 = require("react");
@@ -14456,7 +14447,7 @@ var Modal = (0, import_react71.forwardRef)(
     );
   }
 );
-Modal.displayName = "Modal_UI";
+Modal.displayName = "Modal";
 
 // src/components/Popover/Popover.tsx
 var import_react_popover5 = require("@radix-ui/react-popover");
@@ -14546,7 +14537,7 @@ var PopoverArrow = ({ isAnimated }) => {
     }
   ) });
 };
-PopoverArrow.displayName = "PopoverArrow_UI";
+PopoverArrow.displayName = "PopoverArrow";
 
 // src/components/Popover/Popover.tsx
 var import_jsx_runtime282 = require("react/jsx-runtime");
@@ -14615,7 +14606,7 @@ var Popover2 = ({
     ) })
   ] });
 };
-Popover2.displayName = "Popover_UI";
+Popover2.displayName = "Popover";
 
 // src/components/ProgressBar/ProgressBar.tsx
 var import_styled_components91 = __toESM(require("styled-components"));
@@ -14694,7 +14685,7 @@ var ProgressBar = ({
     (0, import_type_guards52.isNotNil)(labelRight) ? /* @__PURE__ */ (0, import_jsx_runtime283.jsx)(ProgressBarLabel, { children: labelRight }) : null
   ] });
 };
-ProgressBar.displayName = "ProgressBar_UI";
+ProgressBar.displayName = "ProgressBar";
 
 // src/components/Radio/Radio.tsx
 var import_react72 = require("react");
@@ -14869,7 +14860,7 @@ var Radio = (0, import_react72.forwardRef)(
     );
   }
 );
-Radio.displayName = "Radio_UI";
+Radio.displayName = "Radio";
 
 // src/components/RadioCard/RadioCard.tsx
 var import_react74 = require("react");
@@ -15033,7 +15024,7 @@ var RadioCardRoot = (0, import_react73.forwardRef)(
     );
   }
 );
-RadioCardRoot.displayName = "RadioCardRoot_UI";
+RadioCardRoot.displayName = "RadioCardRoot";
 
 // src/components/RadioCard/RadioCardDefaultLayout.tsx
 var import_styled_components95 = __toESM(require("styled-components"));
@@ -15087,7 +15078,7 @@ var RadioCardIndicator = import_styled_components94.default.div`
     --wui-radio-card-indicator-background-color: var(--wui-color-bg-surface-disabled);
   }
 `;
-RadioCardIndicator.displayName = "RadioCardIndicator_UI";
+RadioCardIndicator.displayName = "RadioCardIndicator";
 
 // src/components/RadioCard/RadioCardDefaultLayout.tsx
 var import_jsx_runtime286 = require("react/jsx-runtime");
@@ -15135,7 +15126,7 @@ var RadioCardDefaultLayout = ({
     ] })
   ] });
 };
-RadioCardDefaultLayout.displayName = "RadioCardDefaultLayout_UI";
+RadioCardDefaultLayout.displayName = "RadioCardDefaultLayout";
 
 // src/components/RadioCard/RadioCard.tsx
 var import_jsx_runtime287 = require("react/jsx-runtime");
@@ -15159,7 +15150,7 @@ var RadioCard = (0, import_react74.forwardRef)(
     );
   }
 );
-RadioCard.displayName = "RadioCard_UI";
+RadioCard.displayName = "RadioCard";
 
 // src/components/RadioCard/RadioCardImage.tsx
 var import_react75 = require("react");
@@ -15187,7 +15178,7 @@ var RadioCardImage = (0, import_react75.forwardRef)(
     );
   }
 );
-RadioCardImage.displayName = "RadioCardImage_UI";
+RadioCardImage.displayName = "RadioCardImage";
 
 // src/components/SegmentedControl/SegmentedControl.tsx
 var import_react78 = require("react");
@@ -15324,7 +15315,7 @@ var SegmentedControl = (0, import_react78.forwardRef)(
     );
   }
 );
-SegmentedControl.displayName = "SegmentedControl_UI";
+SegmentedControl.displayName = "SegmentedControl";
 
 // src/components/SegmentedControl/SegmentedControlItem.tsx
 var import_react79 = require("react");
@@ -15458,7 +15449,7 @@ var SegmentedControlItem = (0, import_react79.forwardRef)(
     );
   }
 );
-SegmentedControlItem.displayName = "SegmentedControlItem_UI";
+SegmentedControlItem.displayName = "SegmentedControlItem";
 
 // src/components/Select/Select.tsx
 var import_react_select = require("@radix-ui/react-select");
@@ -15572,7 +15563,7 @@ var Select = (0, import_react80.forwardRef)(
     );
   }
 );
-Select.displayName = "Select_UI";
+Select.displayName = "Select";
 
 // src/components/Select/SelectOption.tsx
 var import_react_select2 = require("@radix-ui/react-select");
@@ -15631,7 +15622,7 @@ var SelectOption = (0, import_react81.forwardRef)(
     );
   }
 );
-SelectOption.displayName = "SelectOption_UI";
+SelectOption.displayName = "SelectOption";
 
 // src/components/Select/SelectOptionGroup.tsx
 var import_react_select3 = require("@radix-ui/react-select");
@@ -15779,7 +15770,7 @@ var Slider = ({
     }
   );
 };
-Slider.displayName = "Slider_UI";
+Slider.displayName = "Slider";
 
 // src/components/Table/Table.tsx
 var import_styled_components103 = __toESM(require("styled-components"));
@@ -15940,7 +15931,7 @@ var Tabs = ({
   }
   return /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(import_react_tabs.Root, { ...rootProps, children: /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(TabsValueProvider, { value: value ?? defaultValue, children: /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(SelectedItemStyleProvider, { children }) }) });
 };
-Tabs.displayName = "Tabs_UI";
+Tabs.displayName = "Tabs";
 
 // src/components/Tabs/TabsContent.tsx
 var import_react_tabs2 = require("@radix-ui/react-tabs");
@@ -15948,7 +15939,7 @@ var import_jsx_runtime304 = require("react/jsx-runtime");
 var TabsContent = ({ children, value }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime304.jsx)(import_react_tabs2.Content, { value, children });
 };
-TabsContent.displayName = "TabsContent_UI";
+TabsContent.displayName = "TabsContent";
 
 // src/components/Tabs/TabsList.tsx
 var import_react_tabs3 = require("@radix-ui/react-tabs");
@@ -16000,7 +15991,7 @@ var TabsList = ({ children, fullWidth = true, ...props }) => {
     }
   );
 };
-TabsList.displayName = "TabsList_UI";
+TabsList.displayName = "TabsList";
 
 // src/components/Tabs/TabsTrigger.tsx
 var import_react86 = require("react");
@@ -16067,7 +16058,7 @@ var TabsTrigger = (0, import_react86.forwardRef)(
     );
   }
 );
-TabsTrigger.displayName = "TabsTrigger_UI";
+TabsTrigger.displayName = "TabsTrigger";
 
 // src/components/Thumbnail/ThumbnailBadge.tsx
 var import_styled_components112 = __toESM(require("styled-components"));
@@ -16103,7 +16094,7 @@ var ThumbnailBadge = ({ icon, label, ...props }) => {
     /* @__PURE__ */ (0, import_jsx_runtime308.jsx)("span", { children: label })
   ] });
 };
-ThumbnailBadge.displayName = "ThumbnailBadge_UI";
+ThumbnailBadge.displayName = "ThumbnailBadge";
 
 // src/components/Thumbnail/Thumbnail.tsx
 var import_react87 = require("react");
@@ -16546,7 +16537,7 @@ var Thumbnail = (0, import_react87.forwardRef)(
     );
   }
 );
-Thumbnail.displayName = "Thumbnail_UI";
+Thumbnail.displayName = "Thumbnail";
 
 // src/components/ThumbnailCollage/ThumbnailCollage.tsx
 var import_react88 = __toESM(require("react"));
@@ -16780,7 +16771,7 @@ var WistiaLogo = ({
   );
   return href !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime312.jsx)("a", { href, children: Logo }) : Logo;
 };
-WistiaLogo.displayName = "WistiaLogo_UI";
+WistiaLogo.displayName = "WistiaLogo";
 
 // src/components/InputPassword/InputPassword.tsx
 var import_styled_components118 = __toESM(require("styled-components"));
@@ -16827,7 +16818,7 @@ var InputPassword = (0, import_react89.forwardRef)(
     );
   }
 );
-InputPassword.displayName = "InputPassword_UI";
+InputPassword.displayName = "InputPassword";
 
 // src/components/ContextMenu/ContextMenu.tsx
 var import_react90 = require("react");