@wistia/ui 0.19.4-beta.3c56092c.db889dd → 0.19.4-beta.9622bd7f.70f808c
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +19 -53
- package/dist/index.cjs.map +1 -1
- package/dist/index.mjs +19 -53
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/dist/index.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.19.4-beta.
|
|
3
|
+
* @license @wistia/ui v0.19.4-beta.9622bd7f.70f808c
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -2335,9 +2335,7 @@ var differenceInCalendarDays = (dateLeft, dateRight) => {
|
|
|
2335
2335
|
|
|
2336
2336
|
// src/helpers/dateTime/timeAgoString.ts
|
|
2337
2337
|
var timeAgoString = (date, { nowAnchor = /* @__PURE__ */ new Date(), includeTime = true } = {}) => {
|
|
2338
|
-
if (isInvalidDate(date))
|
|
2339
|
-
return "";
|
|
2340
|
-
}
|
|
2338
|
+
if (isInvalidDate(date)) return "";
|
|
2341
2339
|
const minutesAgo = (nowAnchor.valueOf() - date.valueOf()) / (secondsInMinute * milisecondsInSecond);
|
|
2342
2340
|
const minutesAgoRounded = Math.round(minutesAgo);
|
|
2343
2341
|
const differenceInDays = differenceInCalendarDays(nowAnchor, date);
|
|
@@ -8602,9 +8600,7 @@ var getFillViewportStyle = (fillViewport) => {
|
|
|
8602
8600
|
return void 0;
|
|
8603
8601
|
};
|
|
8604
8602
|
var getFlexStyle = (flexMode) => {
|
|
8605
|
-
if (!flexMode)
|
|
8606
|
-
return null;
|
|
8607
|
-
}
|
|
8603
|
+
if (!flexMode) return null;
|
|
8608
8604
|
switch (flexMode) {
|
|
8609
8605
|
// grows to fill space, won't shrink, starts at 0
|
|
8610
8606
|
case "grow":
|
|
@@ -9331,19 +9327,13 @@ var Banner = ({
|
|
|
9331
9327
|
const hasImage = isNotNil13(image);
|
|
9332
9328
|
const shouldShowImage = hasImage && (isVerticalLayout || width >= MIN_IMAGE_WIDTH);
|
|
9333
9329
|
const iconPosition = useMemo5(() => {
|
|
9334
|
-
if (isNil11(icon))
|
|
9335
|
-
|
|
9336
|
-
}
|
|
9337
|
-
if (isSmallContainer) {
|
|
9338
|
-
return shouldShowImage ? "inline" : "above";
|
|
9339
|
-
}
|
|
9330
|
+
if (isNil11(icon)) return "none";
|
|
9331
|
+
if (isSmallContainer) return shouldShowImage ? "inline" : "above";
|
|
9340
9332
|
return prominence === "secondary" ? "inline" : "above";
|
|
9341
9333
|
}, [icon, isSmallContainer, shouldShowImage, prominence]);
|
|
9342
9334
|
const hasActions = isNotNil13(primaryAction) || isNotNil13(secondaryAction);
|
|
9343
9335
|
const contentDirection = useMemo5(() => {
|
|
9344
|
-
if (orientation === "horizontal" && !hasActions)
|
|
9345
|
-
return "row";
|
|
9346
|
-
}
|
|
9336
|
+
if (orientation === "horizontal" && !hasActions) return "row";
|
|
9347
9337
|
return !shouldShowImage && prominence === "primary" && !isSmallContainer && !isVerticalLayout ? "row" : "column";
|
|
9348
9338
|
}, [orientation, shouldShowImage, prominence, isSmallContainer, isVerticalLayout, hasActions]);
|
|
9349
9339
|
const headingVariant = isSmallContainer || prominence === "primary" ? "heading5" : "heading3";
|
|
@@ -10087,12 +10077,8 @@ var sizeLarge = css26`
|
|
|
10087
10077
|
--wui-checkbox-icon-size: 11px;
|
|
10088
10078
|
`;
|
|
10089
10079
|
var getSizeCss = (size) => {
|
|
10090
|
-
if (size === "sm")
|
|
10091
|
-
|
|
10092
|
-
}
|
|
10093
|
-
if (size === "lg") {
|
|
10094
|
-
return sizeLarge;
|
|
10095
|
-
}
|
|
10080
|
+
if (size === "sm") return sizeSmall;
|
|
10081
|
+
if (size === "lg") return sizeLarge;
|
|
10096
10082
|
return sizeMedium;
|
|
10097
10083
|
};
|
|
10098
10084
|
var StyledCheckboxWrapper = styled29.div`
|
|
@@ -10237,9 +10223,7 @@ Checkbox.displayName = "Checkbox_UI";
|
|
|
10237
10223
|
// src/components/ClickRegion/ClickRegion.tsx
|
|
10238
10224
|
import { Children as Children3, cloneElement as cloneElement3, useCallback as useCallback8, useEffect as useEffect9 } from "react";
|
|
10239
10225
|
var isClickableElement = (element) => {
|
|
10240
|
-
if (!element)
|
|
10241
|
-
return false;
|
|
10242
|
-
}
|
|
10226
|
+
if (!element) return false;
|
|
10243
10227
|
const el = element;
|
|
10244
10228
|
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;
|
|
10245
10229
|
};
|
|
@@ -14499,9 +14483,7 @@ var EditableHeading = ({
|
|
|
14499
14483
|
const [headingHeight, setHeadingHeight] = useState18("60");
|
|
14500
14484
|
const headingRef = useRef16(null);
|
|
14501
14485
|
const handleSetEditing = (editing) => {
|
|
14502
|
-
if (editingDisabled)
|
|
14503
|
-
return;
|
|
14504
|
-
}
|
|
14486
|
+
if (editingDisabled) return;
|
|
14505
14487
|
if (editing && headingRef.current) {
|
|
14506
14488
|
setHeadingHeight(`${headingRef.current.offsetHeight}`);
|
|
14507
14489
|
}
|
|
@@ -14783,7 +14765,7 @@ var EditableTextDisplayComponent = forwardRef21(
|
|
|
14783
14765
|
};
|
|
14784
14766
|
const elementType = renderAs ?? getDefaultTypographicElement(typographicVariant);
|
|
14785
14767
|
const displayText = value.length > 0 ? value : placeholder;
|
|
14786
|
-
const isPlaceholderVisible = value.length === 0 &&
|
|
14768
|
+
const isPlaceholderVisible = value.length === 0 && !!placeholder;
|
|
14787
14769
|
if (isEditing) {
|
|
14788
14770
|
return null;
|
|
14789
14771
|
}
|
|
@@ -14928,9 +14910,7 @@ var EditableTextInput = (props) => {
|
|
|
14928
14910
|
}, 0);
|
|
14929
14911
|
}
|
|
14930
14912
|
};
|
|
14931
|
-
if (!isEditing)
|
|
14932
|
-
return null;
|
|
14933
|
-
}
|
|
14913
|
+
if (!isEditing) return null;
|
|
14934
14914
|
return /* @__PURE__ */ jsx289(
|
|
14935
14915
|
StyledInput2,
|
|
14936
14916
|
{
|
|
@@ -15011,9 +14991,7 @@ var EditableTextSubmitButton = ({
|
|
|
15011
14991
|
onClick: handleClick,
|
|
15012
14992
|
"data-wui-editable-text-submit": true
|
|
15013
14993
|
};
|
|
15014
|
-
if (!isEditing)
|
|
15015
|
-
return null;
|
|
15016
|
-
}
|
|
14994
|
+
if (!isEditing) return null;
|
|
15017
14995
|
return cloneElement5(onlyChild, triggerProps);
|
|
15018
14996
|
};
|
|
15019
14997
|
|
|
@@ -15043,9 +15021,7 @@ var EditableTextCancelButton = ({
|
|
|
15043
15021
|
onClick: handleClick,
|
|
15044
15022
|
"data-wui-editable-text-cancel": true
|
|
15045
15023
|
};
|
|
15046
|
-
if (!isEditing)
|
|
15047
|
-
return null;
|
|
15048
|
-
}
|
|
15024
|
+
if (!isEditing) return null;
|
|
15049
15025
|
return cloneElement6(onlyChild, triggerProps);
|
|
15050
15026
|
};
|
|
15051
15027
|
|
|
@@ -15069,9 +15045,7 @@ var EditableTextTrigger = ({
|
|
|
15069
15045
|
"data-wui-editable-text-trigger": true,
|
|
15070
15046
|
...props
|
|
15071
15047
|
};
|
|
15072
|
-
if (isEditing)
|
|
15073
|
-
return null;
|
|
15074
|
-
}
|
|
15048
|
+
if (isEditing) return null;
|
|
15075
15049
|
return cloneElement7(onlyChild, triggerProps);
|
|
15076
15050
|
};
|
|
15077
15051
|
|
|
@@ -16496,12 +16470,8 @@ var sizeLarge2 = css42`
|
|
|
16496
16470
|
--wui-radio-icon-size: 10px;
|
|
16497
16471
|
`;
|
|
16498
16472
|
var getSizeCss3 = (size) => {
|
|
16499
|
-
if (size === "sm")
|
|
16500
|
-
|
|
16501
|
-
}
|
|
16502
|
-
if (size === "lg") {
|
|
16503
|
-
return sizeLarge2;
|
|
16504
|
-
}
|
|
16473
|
+
if (size === "sm") return sizeSmall2;
|
|
16474
|
+
if (size === "lg") return sizeLarge2;
|
|
16505
16475
|
return sizeMedium2;
|
|
16506
16476
|
};
|
|
16507
16477
|
var StyledRadioWrapper = styled84.div`
|
|
@@ -18464,9 +18434,7 @@ var Thumbnail = forwardRef37(
|
|
|
18464
18434
|
}, [storyboard]);
|
|
18465
18435
|
const handleMouseMove = useCallback20(
|
|
18466
18436
|
(mouseEvent) => {
|
|
18467
|
-
if (!isScrubbable)
|
|
18468
|
-
return;
|
|
18469
|
-
}
|
|
18437
|
+
if (!isScrubbable) return;
|
|
18470
18438
|
const elem = mouseEvent.currentTarget;
|
|
18471
18439
|
const relMousePos = getRelativeMousePosition(elem, mouseEvent);
|
|
18472
18440
|
const newPercent = relMousePos.left / elem.clientWidth;
|
|
@@ -18478,9 +18446,7 @@ var Thumbnail = forwardRef37(
|
|
|
18478
18446
|
[isScrubbable, trackStoryboardLoadStatus]
|
|
18479
18447
|
);
|
|
18480
18448
|
const handleMouseOut = useCallback20(() => {
|
|
18481
|
-
if (!isScrubbable)
|
|
18482
|
-
return;
|
|
18483
|
-
}
|
|
18449
|
+
if (!isScrubbable) return;
|
|
18484
18450
|
setIsMouseOver(false);
|
|
18485
18451
|
setCursorPosition(null);
|
|
18486
18452
|
}, [isScrubbable]);
|