@wistia/ui 0.19.4-beta.9622bd7f.70f808c → 0.19.4-beta.b0e62da5.7943a99
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 +54 -19
- package/dist/index.cjs.map +1 -1
- package/dist/index.mjs +54 -19
- package/dist/index.mjs.map +1 -1
- package/package.json +16 -16
package/dist/index.cjs
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.b0e62da5.7943a99
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -222,6 +222,7 @@ var globalStyleAdjustmentsCss = import_styled_components.css`
|
|
|
222
222
|
-webkit-tap-highlight-color: rgb(0 0 0 / 0%); /* 2 */
|
|
223
223
|
-moz-text-size-adjust: none; /* 3 */
|
|
224
224
|
-webkit-text-size-adjust: none;
|
|
225
|
+
/* stylelint-disable-next-line plugin/use-baseline */
|
|
225
226
|
text-size-adjust: none;
|
|
226
227
|
height: -webkit-fill-available; /* 4 */
|
|
227
228
|
}
|
|
@@ -2526,7 +2527,9 @@ var differenceInCalendarDays = (dateLeft, dateRight) => {
|
|
|
2526
2527
|
|
|
2527
2528
|
// src/helpers/dateTime/timeAgoString.ts
|
|
2528
2529
|
var timeAgoString = (date, { nowAnchor = /* @__PURE__ */ new Date(), includeTime = true } = {}) => {
|
|
2529
|
-
if (isInvalidDate(date))
|
|
2530
|
+
if (isInvalidDate(date)) {
|
|
2531
|
+
return "";
|
|
2532
|
+
}
|
|
2530
2533
|
const minutesAgo = (nowAnchor.valueOf() - date.valueOf()) / (secondsInMinute * milisecondsInSecond);
|
|
2531
2534
|
const minutesAgoRounded = Math.round(minutesAgo);
|
|
2532
2535
|
const differenceInDays = differenceInCalendarDays(nowAnchor, date);
|
|
@@ -8782,7 +8785,9 @@ var getFillViewportStyle = (fillViewport) => {
|
|
|
8782
8785
|
return void 0;
|
|
8783
8786
|
};
|
|
8784
8787
|
var getFlexStyle = (flexMode) => {
|
|
8785
|
-
if (!flexMode)
|
|
8788
|
+
if (!flexMode) {
|
|
8789
|
+
return null;
|
|
8790
|
+
}
|
|
8786
8791
|
switch (flexMode) {
|
|
8787
8792
|
// grows to fill space, won't shrink, starts at 0
|
|
8788
8793
|
case "grow":
|
|
@@ -9509,13 +9514,19 @@ var Banner = ({
|
|
|
9509
9514
|
const hasImage = (0, import_type_guards25.isNotNil)(image);
|
|
9510
9515
|
const shouldShowImage = hasImage && (isVerticalLayout || width >= MIN_IMAGE_WIDTH);
|
|
9511
9516
|
const iconPosition = (0, import_react31.useMemo)(() => {
|
|
9512
|
-
if ((0, import_type_guards25.isNil)(icon))
|
|
9513
|
-
|
|
9517
|
+
if ((0, import_type_guards25.isNil)(icon)) {
|
|
9518
|
+
return "none";
|
|
9519
|
+
}
|
|
9520
|
+
if (isSmallContainer) {
|
|
9521
|
+
return shouldShowImage ? "inline" : "above";
|
|
9522
|
+
}
|
|
9514
9523
|
return prominence === "secondary" ? "inline" : "above";
|
|
9515
9524
|
}, [icon, isSmallContainer, shouldShowImage, prominence]);
|
|
9516
9525
|
const hasActions = (0, import_type_guards25.isNotNil)(primaryAction) || (0, import_type_guards25.isNotNil)(secondaryAction);
|
|
9517
9526
|
const contentDirection = (0, import_react31.useMemo)(() => {
|
|
9518
|
-
if (orientation === "horizontal" && !hasActions)
|
|
9527
|
+
if (orientation === "horizontal" && !hasActions) {
|
|
9528
|
+
return "row";
|
|
9529
|
+
}
|
|
9519
9530
|
return !shouldShowImage && prominence === "primary" && !isSmallContainer && !isVerticalLayout ? "row" : "column";
|
|
9520
9531
|
}, [orientation, shouldShowImage, prominence, isSmallContainer, isVerticalLayout, hasActions]);
|
|
9521
9532
|
const headingVariant = isSmallContainer || prominence === "primary" ? "heading5" : "heading3";
|
|
@@ -10259,8 +10270,12 @@ var sizeLarge = import_styled_components46.css`
|
|
|
10259
10270
|
--wui-checkbox-icon-size: 11px;
|
|
10260
10271
|
`;
|
|
10261
10272
|
var getSizeCss = (size) => {
|
|
10262
|
-
if (size === "sm")
|
|
10263
|
-
|
|
10273
|
+
if (size === "sm") {
|
|
10274
|
+
return sizeSmall;
|
|
10275
|
+
}
|
|
10276
|
+
if (size === "lg") {
|
|
10277
|
+
return sizeLarge;
|
|
10278
|
+
}
|
|
10264
10279
|
return sizeMedium;
|
|
10265
10280
|
};
|
|
10266
10281
|
var StyledCheckboxWrapper = import_styled_components46.styled.div`
|
|
@@ -10405,7 +10420,9 @@ Checkbox.displayName = "Checkbox_UI";
|
|
|
10405
10420
|
// src/components/ClickRegion/ClickRegion.tsx
|
|
10406
10421
|
var import_react39 = require("react");
|
|
10407
10422
|
var isClickableElement = (element) => {
|
|
10408
|
-
if (!element)
|
|
10423
|
+
if (!element) {
|
|
10424
|
+
return false;
|
|
10425
|
+
}
|
|
10409
10426
|
const el = element;
|
|
10410
10427
|
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;
|
|
10411
10428
|
};
|
|
@@ -14635,7 +14652,9 @@ var EditableHeading = ({
|
|
|
14635
14652
|
const [headingHeight, setHeadingHeight] = (0, import_react63.useState)("60");
|
|
14636
14653
|
const headingRef = (0, import_react63.useRef)(null);
|
|
14637
14654
|
const handleSetEditing = (editing) => {
|
|
14638
|
-
if (editingDisabled)
|
|
14655
|
+
if (editingDisabled) {
|
|
14656
|
+
return;
|
|
14657
|
+
}
|
|
14639
14658
|
if (editing && headingRef.current) {
|
|
14640
14659
|
setHeadingHeight(`${headingRef.current.offsetHeight}`);
|
|
14641
14660
|
}
|
|
@@ -14917,7 +14936,7 @@ var EditableTextDisplayComponent = (0, import_react65.forwardRef)(
|
|
|
14917
14936
|
};
|
|
14918
14937
|
const elementType = renderAs ?? getDefaultTypographicElement(typographicVariant);
|
|
14919
14938
|
const displayText = value.length > 0 ? value : placeholder;
|
|
14920
|
-
const isPlaceholderVisible = value.length === 0 &&
|
|
14939
|
+
const isPlaceholderVisible = value.length === 0 && Boolean(placeholder);
|
|
14921
14940
|
if (isEditing) {
|
|
14922
14941
|
return null;
|
|
14923
14942
|
}
|
|
@@ -15062,7 +15081,9 @@ var EditableTextInput = (props) => {
|
|
|
15062
15081
|
}, 0);
|
|
15063
15082
|
}
|
|
15064
15083
|
};
|
|
15065
|
-
if (!isEditing)
|
|
15084
|
+
if (!isEditing) {
|
|
15085
|
+
return null;
|
|
15086
|
+
}
|
|
15066
15087
|
return /* @__PURE__ */ (0, import_jsx_runtime289.jsx)(
|
|
15067
15088
|
StyledInput2,
|
|
15068
15089
|
{
|
|
@@ -15143,7 +15164,9 @@ var EditableTextSubmitButton = ({
|
|
|
15143
15164
|
onClick: handleClick,
|
|
15144
15165
|
"data-wui-editable-text-submit": true
|
|
15145
15166
|
};
|
|
15146
|
-
if (!isEditing)
|
|
15167
|
+
if (!isEditing) {
|
|
15168
|
+
return null;
|
|
15169
|
+
}
|
|
15147
15170
|
return (0, import_react68.cloneElement)(onlyChild, triggerProps);
|
|
15148
15171
|
};
|
|
15149
15172
|
|
|
@@ -15173,7 +15196,9 @@ var EditableTextCancelButton = ({
|
|
|
15173
15196
|
onClick: handleClick,
|
|
15174
15197
|
"data-wui-editable-text-cancel": true
|
|
15175
15198
|
};
|
|
15176
|
-
if (!isEditing)
|
|
15199
|
+
if (!isEditing) {
|
|
15200
|
+
return null;
|
|
15201
|
+
}
|
|
15177
15202
|
return (0, import_react69.cloneElement)(onlyChild, triggerProps);
|
|
15178
15203
|
};
|
|
15179
15204
|
|
|
@@ -15197,7 +15222,9 @@ var EditableTextTrigger = ({
|
|
|
15197
15222
|
"data-wui-editable-text-trigger": true,
|
|
15198
15223
|
...props
|
|
15199
15224
|
};
|
|
15200
|
-
if (isEditing)
|
|
15225
|
+
if (isEditing) {
|
|
15226
|
+
return null;
|
|
15227
|
+
}
|
|
15201
15228
|
return (0, import_react70.cloneElement)(onlyChild, triggerProps);
|
|
15202
15229
|
};
|
|
15203
15230
|
|
|
@@ -16622,8 +16649,12 @@ var sizeLarge2 = import_styled_components103.css`
|
|
|
16622
16649
|
--wui-radio-icon-size: 10px;
|
|
16623
16650
|
`;
|
|
16624
16651
|
var getSizeCss3 = (size) => {
|
|
16625
|
-
if (size === "sm")
|
|
16626
|
-
|
|
16652
|
+
if (size === "sm") {
|
|
16653
|
+
return sizeSmall2;
|
|
16654
|
+
}
|
|
16655
|
+
if (size === "lg") {
|
|
16656
|
+
return sizeLarge2;
|
|
16657
|
+
}
|
|
16627
16658
|
return sizeMedium2;
|
|
16628
16659
|
};
|
|
16629
16660
|
var StyledRadioWrapper = import_styled_components103.styled.div`
|
|
@@ -18565,7 +18596,9 @@ var Thumbnail = (0, import_react97.forwardRef)(
|
|
|
18565
18596
|
}, [storyboard]);
|
|
18566
18597
|
const handleMouseMove = (0, import_react97.useCallback)(
|
|
18567
18598
|
(mouseEvent) => {
|
|
18568
|
-
if (!isScrubbable)
|
|
18599
|
+
if (!isScrubbable) {
|
|
18600
|
+
return;
|
|
18601
|
+
}
|
|
18569
18602
|
const elem = mouseEvent.currentTarget;
|
|
18570
18603
|
const relMousePos = getRelativeMousePosition(elem, mouseEvent);
|
|
18571
18604
|
const newPercent = relMousePos.left / elem.clientWidth;
|
|
@@ -18577,7 +18610,9 @@ var Thumbnail = (0, import_react97.forwardRef)(
|
|
|
18577
18610
|
[isScrubbable, trackStoryboardLoadStatus]
|
|
18578
18611
|
);
|
|
18579
18612
|
const handleMouseOut = (0, import_react97.useCallback)(() => {
|
|
18580
|
-
if (!isScrubbable)
|
|
18613
|
+
if (!isScrubbable) {
|
|
18614
|
+
return;
|
|
18615
|
+
}
|
|
18581
18616
|
setIsMouseOver(false);
|
|
18582
18617
|
setCursorPosition(null);
|
|
18583
18618
|
}, [isScrubbable]);
|