@wistia/ui 0.19.3 → 0.19.4-beta.3c56092c.db889dd

package/dist/index.mjs

@@ -1,6 +1,6 @@
 
 /*
- * @license @wistia/ui v0.19.3
+ * @license @wistia/ui v0.19.4-beta.3c56092c.db889dd
  *
  * Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
  *
@@ -2335,7 +2335,9 @@ var differenceInCalendarDays = (dateLeft, dateRight) => {
 
 // src/helpers/dateTime/timeAgoString.ts
 var timeAgoString = (date, { nowAnchor = /* @__PURE__ */ new Date(), includeTime = true } = {}) => {
-  if (isInvalidDate(date)) return "";
+  if (isInvalidDate(date)) {
+    return "";
+  }
   const minutesAgo = (nowAnchor.valueOf() - date.valueOf()) / (secondsInMinute * milisecondsInSecond);
   const minutesAgoRounded = Math.round(minutesAgo);
   const differenceInDays = differenceInCalendarDays(nowAnchor, date);
@@ -8600,7 +8602,9 @@ var getFillViewportStyle = (fillViewport) => {
   return void 0;
 };
 var getFlexStyle = (flexMode) => {
-  if (!flexMode) return null;
+  if (!flexMode) {
+    return null;
+  }
   switch (flexMode) {
     // grows to fill space, won't shrink, starts at 0
     case "grow":
@@ -9327,13 +9331,19 @@ var Banner = ({
   const hasImage = isNotNil13(image);
   const shouldShowImage = hasImage && (isVerticalLayout || width >= MIN_IMAGE_WIDTH);
   const iconPosition = useMemo5(() => {
-    if (isNil11(icon)) return "none";
-    if (isSmallContainer) return shouldShowImage ? "inline" : "above";
+    if (isNil11(icon)) {
+      return "none";
+    }
+    if (isSmallContainer) {
+      return shouldShowImage ? "inline" : "above";
+    }
     return prominence === "secondary" ? "inline" : "above";
   }, [icon, isSmallContainer, shouldShowImage, prominence]);
   const hasActions = isNotNil13(primaryAction) || isNotNil13(secondaryAction);
   const contentDirection = useMemo5(() => {
-    if (orientation === "horizontal" && !hasActions) return "row";
+    if (orientation === "horizontal" && !hasActions) {
+      return "row";
+    }
     return !shouldShowImage && prominence === "primary" && !isSmallContainer && !isVerticalLayout ? "row" : "column";
   }, [orientation, shouldShowImage, prominence, isSmallContainer, isVerticalLayout, hasActions]);
   const headingVariant = isSmallContainer || prominence === "primary" ? "heading5" : "heading3";
@@ -10077,8 +10087,12 @@ var sizeLarge = css26`
   --wui-checkbox-icon-size: 11px;
 `;
 var getSizeCss = (size) => {
-  if (size === "sm") return sizeSmall;
-  if (size === "lg") return sizeLarge;
+  if (size === "sm") {
+    return sizeSmall;
+  }
+  if (size === "lg") {
+    return sizeLarge;
+  }
   return sizeMedium;
 };
 var StyledCheckboxWrapper = styled29.div`
@@ -10223,7 +10237,9 @@ Checkbox.displayName = "Checkbox_UI";
 // src/components/ClickRegion/ClickRegion.tsx
 import { Children as Children3, cloneElement as cloneElement3, useCallback as useCallback8, useEffect as useEffect9 } from "react";
 var isClickableElement = (element) => {
-  if (!element) return false;
+  if (!element) {
+    return false;
+  }
   const el = element;
   return el.closest("button") !== null || el.closest("a") !== null || el.closest("input") !== null || el.closest("select") !== null || el.closest("textarea") !== null || el.closest("label") !== null || el.closest("[data-wui-faux-input]") !== null;
 };
@@ -14483,7 +14499,9 @@ var EditableHeading = ({
   const [headingHeight, setHeadingHeight] = useState18("60");
   const headingRef = useRef16(null);
   const handleSetEditing = (editing) => {
-    if (editingDisabled) return;
+    if (editingDisabled) {
+      return;
+    }
     if (editing && headingRef.current) {
       setHeadingHeight(`${headingRef.current.offsetHeight}`);
     }
@@ -14765,7 +14783,7 @@ var EditableTextDisplayComponent = forwardRef21(
     };
     const elementType = renderAs ?? getDefaultTypographicElement(typographicVariant);
     const displayText = value.length > 0 ? value : placeholder;
-    const isPlaceholderVisible = value.length === 0 && !!placeholder;
+    const isPlaceholderVisible = value.length === 0 && Boolean(placeholder);
     if (isEditing) {
       return null;
     }
@@ -14910,7 +14928,9 @@ var EditableTextInput = (props) => {
       }, 0);
     }
   };
-  if (!isEditing) return null;
+  if (!isEditing) {
+    return null;
+  }
   return /* @__PURE__ */ jsx289(
     StyledInput2,
     {
@@ -14991,7 +15011,9 @@ var EditableTextSubmitButton = ({
     onClick: handleClick,
     "data-wui-editable-text-submit": true
   };
-  if (!isEditing) return null;
+  if (!isEditing) {
+    return null;
+  }
   return cloneElement5(onlyChild, triggerProps);
 };
 
@@ -15021,7 +15043,9 @@ var EditableTextCancelButton = ({
     onClick: handleClick,
     "data-wui-editable-text-cancel": true
   };
-  if (!isEditing) return null;
+  if (!isEditing) {
+    return null;
+  }
   return cloneElement6(onlyChild, triggerProps);
 };
 
@@ -15045,7 +15069,9 @@ var EditableTextTrigger = ({
     "data-wui-editable-text-trigger": true,
     ...props
   };
-  if (isEditing) return null;
+  if (isEditing) {
+    return null;
+  }
   return cloneElement7(onlyChild, triggerProps);
 };
 
@@ -16470,8 +16496,12 @@ var sizeLarge2 = css42`
   --wui-radio-icon-size: 10px;
 `;
 var getSizeCss3 = (size) => {
-  if (size === "sm") return sizeSmall2;
-  if (size === "lg") return sizeLarge2;
+  if (size === "sm") {
+    return sizeSmall2;
+  }
+  if (size === "lg") {
+    return sizeLarge2;
+  }
   return sizeMedium2;
 };
 var StyledRadioWrapper = styled84.div`
@@ -17372,7 +17402,6 @@ var StyledContent3 = styled93(Content3)`
   --wui-select-option-bg-hover: var(--wui-color-bg-surface-hover);
 
   overflow: hidden;
-  transform: translateY(8px);
   background-color: var(--wui-select-content-bg);
   border: 1px solid var(--wui-select-content-border);
   border-radius: var(--wui-select-content-border-radius);
@@ -17437,23 +17466,30 @@ var Select = forwardRef34(
           ]
         }
       ),
-      /* @__PURE__ */ jsx319(Portal2, { children: /* @__PURE__ */ jsxs62(StyledContent3, { position: "popper", children: [
-        /* @__PURE__ */ jsx319(StyledScrollUpButton, { children: /* @__PURE__ */ jsx319(
-          Icon,
-          {
-            size: "sm",
-            type: "caret-up"
-          }
-        ) }),
-        /* @__PURE__ */ jsx319(Viewport, { children }),
-        /* @__PURE__ */ jsx319(StyledScrollDownButton, { children: /* @__PURE__ */ jsx319(
-          Icon,
-          {
-            size: "sm",
-            type: "caret-down"
-          }
-        ) })
-      ] }) })
+      /* @__PURE__ */ jsx319(Portal2, { children: /* @__PURE__ */ jsxs62(
+        StyledContent3,
+        {
+          position: "popper",
+          sideOffset: 8,
+          children: [
+            /* @__PURE__ */ jsx319(StyledScrollUpButton, { children: /* @__PURE__ */ jsx319(
+              Icon,
+              {
+                size: "sm",
+                type: "caret-up"
+              }
+            ) }),
+            /* @__PURE__ */ jsx319(Viewport, { children }),
+            /* @__PURE__ */ jsx319(StyledScrollDownButton, { children: /* @__PURE__ */ jsx319(
+              Icon,
+              {
+                size: "sm",
+                type: "caret-down"
+              }
+            ) })
+          ]
+        }
+      ) })
     ] });
   }
 );
@@ -18428,7 +18464,9 @@ var Thumbnail = forwardRef37(
     }, [storyboard]);
     const handleMouseMove = useCallback20(
       (mouseEvent) => {
-        if (!isScrubbable) return;
+        if (!isScrubbable) {
+          return;
+        }
         const elem = mouseEvent.currentTarget;
         const relMousePos = getRelativeMousePosition(elem, mouseEvent);
         const newPercent = relMousePos.left / elem.clientWidth;
@@ -18440,7 +18478,9 @@ var Thumbnail = forwardRef37(
       [isScrubbable, trackStoryboardLoadStatus]
     );
     const handleMouseOut = useCallback20(() => {
-      if (!isScrubbable) return;
+      if (!isScrubbable) {
+        return;
+      }
       setIsMouseOver(false);
       setCursorPosition(null);
     }, [isScrubbable]);