@wistia/ui 0.14.34 → 0.14.35

package/dist/index.cjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.14.34
+ * @license @wistia/ui v0.14.35
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -1665,7 +1665,7 @@ var UIProviderNestingContext = (0, import_react3.createContext)(false);
 var UIProvider = ({ children }) => {
   const isNested = (0, import_react3.useContext)(UIProviderNestingContext);
   if (isNested) {
-    console.warn("UIProvider is nested. Only one instance of UIProvider.");
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_jsx_runtime3.Fragment, { children });
   }
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(UIProviderNestingContext.Provider, { value: true, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(AriaLiveProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react_tooltip.Provider, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(GlobalStyle, {}),
@@ -2970,6 +2970,7 @@ var StyledToast = import_styled_components16.default.div`
   svg {
     height: 16px;
     width: 16px;
+    flex: 0 0 16px;
   }
 `;
 var Action = ({ actionButton }) => {
@@ -3191,6 +3192,7 @@ var buttonBaseStyles = import_styled_components18.css`
       color: var(--button-color-icon);
       width: var(--button-icon-size);
       height: var(--button-icon-size);
+      flex: 0 0 var(--button-icon-size);
     }
   }
 
@@ -7239,6 +7241,7 @@ var StyledIcon = import_styled_components19.default.svg`
   --wui-icon-size: var(--wui-icon-inline-size, ${({ $height }) => $height}px);
   --wui-icon-vertical-align: middle;
 
+  flex: 0 0 var(--wui-icon-size);
   height: var(--wui-icon-size);
   width: var(--wui-icon-size);
 `;
@@ -7329,6 +7332,7 @@ var StyledLink = import_styled_components20.default.a`
     svg {
       width: 14px;
       height: 14px;
+      flex: 0 0 14px;
     }
   }
 `;
@@ -7629,6 +7633,7 @@ var StyledMainIcon = import_styled_components22.default.div`
     svg {
       width: 24px;
       height: 24px;
+      flex: 0 0 24px;
     }
   }
 `;
@@ -7655,6 +7660,7 @@ var StyledSecondaryIcon = import_styled_components22.default.div`
     svg {
       width: 24px;
       height: 24px;
+      flex: 0 0 24px;
     }
   }
 `;
@@ -7990,6 +7996,7 @@ var StyledBadge = import_styled_components26.default.div`
       color: var(--wui-color-icon);
       height: 12px;
       width: 12px;
+      flex: 0 0 12px;
     }
   }
 `;
@@ -12091,6 +12098,7 @@ var TagLabel = import_styled_components66.default.a`
   svg {
     height: 12px;
     width: 12px;
+    flex: 0 0 12px;
   }
 
   &:focus-visible {
@@ -12386,12 +12394,25 @@ var extractOptions = (children) => {
   });
   return options;
 };
+var defaultDisplayValues = (values, onRemove) => {
+  return values.map((selectedValue) => /* @__PURE__ */ (0, import_jsx_runtime254.jsx)(
+    Tag,
+    {
+      href: "https://example.com",
+      label: selectedValue,
+      onClickRemove: () => onRemove(selectedValue),
+      onClickRemoveLabel: `Remove ${selectedValue}`
+    },
+    selectedValue
+  ));
+};
 var Combobox2 = ({
   placeholder,
   value = [],
   onChange,
   searchValue,
   onSearchValueChange,
+  displayValues = defaultDisplayValues,
   children,
   fullWidth = true
 }) => {
@@ -12437,17 +12458,14 @@ var Combobox2 = ({
             ref: comboboxWrapperRef,
             $fullWidth: fullWidth,
             children: [
-              value.map((selectedValue) => /* @__PURE__ */ (0, import_jsx_runtime254.jsx)(
-                Tag,
+              displayValues(value, handleRemoveValue),
+              /* @__PURE__ */ (0, import_jsx_runtime254.jsx)(
+                ComboboxInput,
                 {
-                  href: "https://example.com",
-                  label: selectedValue,
-                  onClickRemove: () => handleRemoveValue(selectedValue),
-                  onClickRemoveLabel: `Remove ${selectedValue}`
-                },
-                selectedValue
-              )),
-              /* @__PURE__ */ (0, import_jsx_runtime254.jsx)(ComboboxInput, { placeholder })
+                  autoSelect: true,
+                  placeholder
+                }
+              )
             ]
           }
         ),
@@ -12746,6 +12764,7 @@ var StyledLeftIconContainer = import_styled_components71.default.div`
     svg {
       height: var(--menu-item-left-icon-size);
       width: var(--menu-item-left-icon-size);
+      flex: 0 0 var(--menu-item-left-icon-size);
     }
   }
 `;
@@ -12757,6 +12776,7 @@ var StyledRightIconContainer = import_styled_components71.default.div`
     svg {
       height: var(--menu-item-right-icon-size);
       width: var(--menu-item-right-icon-size);
+      flex: 0 0 var(--menu-item-right-icon-size);
     }
   }
 `;
@@ -16279,6 +16299,7 @@ var segmentedControlItemStyles = import_styled_components108.css`
   svg {
     height: 16px;
     width: 16px;
+    flex: 0 0 16px;
 
     /* add right margin if there's a label and an icon */
     ${({ $hasLabel }) => $hasLabel ? "margin-right: var(--wui-space-01)" : ""}
@@ -17019,6 +17040,7 @@ var StyledThumbnailBadge = import_styled_components122.default.div`
   svg {
     height: 12px;
     width: 12px;
+    flex: 0 0 12px;
 
     path {
       color: var(--wui-color-icon-on-fill);