@wistia/ui 0.11.2 → 0.11.3-beta.1372b62c.f85a71e

package/dist/index.cjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.11.2
+ * @license @wistia/ui v0.11.3-beta.1372b62c.f85a71e
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -273,7 +273,7 @@ var globalStyleAdjustmentsCss = import_styled_components.css`
   }
 
   /* Anything that has been anchored to should have extra scroll margin */
-  :target {
+  &:target {
     scroll-margin-block: 5ex;
   }
 
@@ -3091,7 +3091,7 @@ var buttonExtraLargeStyles = import_styled_components18.css`
   --button-label-gap: 8px;
 `;
 var ghostButtonVariant = import_styled_components18.css`
-  --button-color-bg: transparent;
+  --button-color-bg-override: transparent;
   --button-color-bg-hover: var(--wui-color-bg-surface-hover);
   --button-color-bg-active: var(--wui-color-bg-surface-active);
   --button-color-text: var(--wui-color-text-button);
@@ -3118,9 +3118,9 @@ var solidButtonVariant = import_styled_components18.css`
   --button-color-icon: var(--wui-color-icon-on-fill);
 `;
 var disabledButtonVariant = import_styled_components18.css`
-  --button-color-bg: var(--wui-color-bg-surface-disabled);
-  --button-color-bg-hover: var(--wui-color-bg-surface-disabled);
-  --button-color-bg-active: var(--wui-color-bg-surface-disabled);
+  --button-color-bg: var(--button-color-bg-override, var(--wui-color-bg-surface-disabled));
+  --button-color-bg-hover: var(--button-color-bg-override, var(--wui-color-bg-surface-disabled));
+  --button-color-bg-active: var(--button-color-bg-override, var(--wui-color-bg-surface-disabled));
   --button-color-text: var(--wui-color-text-disabled);
   --button-color-icon: var(--wui-color-icon-disabled);
   --button-color-border: var(--wui-color-border-disabled);
@@ -8478,7 +8478,7 @@ var ButtonGroupComponent = import_styled_components30.default.div`
     flex-direction: row;
   }
 
-  :not([data-wistia-ui-icon-button]) {
+  &:not([data-wistia-ui-icon-button]) {
     ${mq.smAndDown} {
       width: 100%;
     }
@@ -10617,7 +10617,7 @@ Input.displayName = "Input";
 // src/components/EditableHeading/EditableHeading.tsx
 var import_jsx_runtime232 = require("react/jsx-runtime");
 var StyledInput = (0, import_styled_components56.default)(Input)`
-  :not([rows]) {
+  &:not([rows]) {
     min-height: unset;
   }
 
@@ -10923,28 +10923,46 @@ var StyledErrorList = import_styled_components58.default.ul`
   gap: var(--wui-space-01);
 `;
 var ErrorMessages = ({ errors, id }) => {
-  const isMultipleErrors = (0, import_type_guards37.isArray)(errors);
-  return isMultipleErrors ? /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(StyledErrorList, { children: errors.map((error, index) => /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+  const isErrorArray = (0, import_type_guards37.isArray)(errors);
+  const isMultipleErrors = isErrorArray && errors.length > 1;
+  if (!isErrorArray) {
+    return /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+      Text,
+      {
+        colorScheme: "error",
+        id,
+        prominence: "secondary",
+        variant: "label4",
+        children: errors
+      },
+      id
+    );
+  }
+  if (!isMultipleErrors) {
+    return /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
+      Text,
+      {
+        colorScheme: "error",
+        id,
+        prominence: "secondary",
+        variant: "label4",
+        children: errors[0]
+      },
+      id
+    );
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(StyledErrorList, { children: errors.map((error, index) => /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
     Text,
     {
       colorScheme: "error",
       id: `${id}-${index}`,
+      prominence: "secondary",
       renderAs: "li",
       variant: "label4",
       children: error
     },
     `${id}-${index}`
-  )) }) : /* @__PURE__ */ (0, import_jsx_runtime235.jsx)(
-    Text,
-    {
-      colorScheme: "error",
-      id,
-      prominence: "secondary",
-      variant: "label4",
-      children: errors
-    },
-    id
-  );
+  )) });
 };
 var FormField = ({
   children,