@wistia/ui 0.18.2-beta.4003271.cf839cf → 0.18.2-beta.5887682f.a87d78e
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 +10 -12
- package/dist/index.cjs.map +1 -1
- package/dist/index.mjs +10 -12
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.18.2-beta.
|
|
3
|
+
* @license @wistia/ui v0.18.2-beta.5887682f.a87d78e
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2025, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -17935,9 +17935,11 @@ var StyledThumbnailContainer = styled106.div`
|
|
|
17935
17935
|
width: ${({ $width }) => $width};
|
|
17936
17936
|
display: flex;
|
|
17937
17937
|
overflow: hidden;
|
|
17938
|
+
${({ $isScrubbable }) => $isScrubbable && "cursor: pointer;"}
|
|
17938
17939
|
`;
|
|
17939
17940
|
var StyledThumbnail = styled106.div`
|
|
17940
17941
|
--wui-thumbnail-badge-offset: var(--wui-space-01);
|
|
17942
|
+
|
|
17941
17943
|
background-image: ${({ $backgroundUrl }) => isNotNil43($backgroundUrl) ? `url('${$backgroundUrl}')` : void 0};
|
|
17942
17944
|
${({ $backgroundUrl, $gradientBackground }) => (
|
|
17943
17945
|
// if we don't have $backgroundUrl show a gradient
|
|
@@ -17945,19 +17947,15 @@ var StyledThumbnail = styled106.div`
|
|
|
17945
17947
|
)};
|
|
17946
17948
|
background-position: center center;
|
|
17947
17949
|
background-size: cover;
|
|
17948
|
-
|
|
17949
17950
|
display: flex;
|
|
17950
17951
|
width: 100%;
|
|
17951
17952
|
overflow: hidden;
|
|
17952
17953
|
position: relative;
|
|
17953
|
-
display: flex;
|
|
17954
17954
|
border-radius: clamp(var(--wui-border-radius-01), 8cqh, var(--wui-border-radius-05));
|
|
17955
17955
|
|
|
17956
17956
|
@container (min-width: 200px) {
|
|
17957
17957
|
--wui-thumbnail-badge-offset: var(--wui-space-02);
|
|
17958
17958
|
}
|
|
17959
|
-
|
|
17960
|
-
${({ $isScrubbable }) => $isScrubbable && "cursor: pointer;"}
|
|
17961
17959
|
`;
|
|
17962
17960
|
var StoryboardRenderer = ({
|
|
17963
17961
|
storyboard,
|
|
@@ -18080,19 +18078,20 @@ var Thumbnail = forwardRef37(
|
|
|
18080
18078
|
{
|
|
18081
18079
|
ref,
|
|
18082
18080
|
$aspectRatio: aspectRatio,
|
|
18081
|
+
$isScrubbable: isScrubbable,
|
|
18083
18082
|
$width: width,
|
|
18084
|
-
"data-thumbnail-container": true,
|
|
18083
|
+
"data-wui-thumbnail-container": true,
|
|
18084
|
+
onBlur: handleMouseOut,
|
|
18085
|
+
onMouseMove: handleMouseMove,
|
|
18086
|
+
onMouseOut: handleMouseOut,
|
|
18087
|
+
role: "presentation",
|
|
18085
18088
|
...props,
|
|
18086
18089
|
children: /* @__PURE__ */ jsxs69(
|
|
18087
18090
|
StyledThumbnail,
|
|
18088
18091
|
{
|
|
18089
18092
|
$backgroundUrl: backgroundUrl,
|
|
18090
18093
|
$gradientBackground: gradientBackground,
|
|
18091
|
-
|
|
18092
|
-
onBlur: handleMouseOut,
|
|
18093
|
-
onMouseMove: handleMouseMove,
|
|
18094
|
-
onMouseOut: handleMouseOut,
|
|
18095
|
-
role: "presentation",
|
|
18094
|
+
"data-testid": "thumbnail-inner",
|
|
18096
18095
|
children: [
|
|
18097
18096
|
isNotNil43(children) ? children : null,
|
|
18098
18097
|
thumbnailContent
|
|
@@ -18154,7 +18153,6 @@ var StyledThumbnailCollage = styled107.div`
|
|
|
18154
18153
|
}
|
|
18155
18154
|
|
|
18156
18155
|
[data-thumbnail-container] {
|
|
18157
|
-
//allows for the border radius to be based off the collage's dimensions
|
|
18158
18156
|
container-type: unset;
|
|
18159
18157
|
aspect-ratio: unset;
|
|
18160
18158
|
height: 100%;
|