@se-studio/core-ui 1.14.3 → 1.14.5
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/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,20 @@
|
|
|
1
1
|
# @se-studio/core-ui
|
|
2
2
|
|
|
3
|
+
## 1.14.5
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 90358cb: LazyVideo SSR shell includes poster image (or accessible name) so crawlers no longer see an empty aspect-ratio box under video headings.
|
|
8
|
+
- Updated dependencies [ef0affb]
|
|
9
|
+
- @se-studio/contentful-rest-api@1.16.4
|
|
10
|
+
|
|
11
|
+
## 1.14.4
|
|
12
|
+
|
|
13
|
+
### Patch Changes
|
|
14
|
+
|
|
15
|
+
- Updated dependencies [859e6f8]
|
|
16
|
+
- @se-studio/contentful-rest-api@1.16.3
|
|
17
|
+
|
|
3
18
|
## 1.14.3
|
|
4
19
|
|
|
5
20
|
### Patch Changes
|
|
@@ -1,5 +1,14 @@
|
|
|
1
1
|
import type { VideoComponentProps } from './VideoComponent';
|
|
2
2
|
type Props = VideoComponentProps;
|
|
3
|
+
/**
|
|
4
|
+
* Lazy-loads {@link VideoComponent} (local / external embeds) after the shell
|
|
5
|
+
* approaches the viewport (or immediately when `loading="eager"` /
|
|
6
|
+
* `fetchPriority="high"`).
|
|
7
|
+
*
|
|
8
|
+
* The pre-load shell must not be empty: crawlers and a11y scanners (e.g.
|
|
9
|
+
* Siteimprove “content missing after heading”) only see the SSR HTML. Always
|
|
10
|
+
* reserve aspect ratio and, when available, render poster + accessible name.
|
|
11
|
+
*/
|
|
3
12
|
export declare function LazyVideo(maybeProps: Props | null | undefined): import("react").JSX.Element | null;
|
|
4
13
|
export {};
|
|
5
14
|
//# sourceMappingURL=LazyVideo.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LazyVideo.d.ts","sourceRoot":"","sources":["../../src/components/LazyVideo.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"LazyVideo.d.ts","sourceRoot":"","sources":["../../src/components/LazyVideo.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAE5D,KAAK,KAAK,GAAG,mBAAmB,CAAC;AAyBjC;;;;;;;;GAQG;AACH,wBAAgB,SAAS,CAAC,UAAU,EAAE,KAAK,GAAG,IAAI,GAAG,SAAS,sCAiG7D"}
|
|
@@ -1,6 +1,36 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { isExternalVideo } from '@se-studio/core-data-types';
|
|
4
|
+
import Image from 'next/image';
|
|
3
5
|
import { useEffect, useRef, useState } from 'react';
|
|
6
|
+
/**
|
|
7
|
+
* Poster URL for the pre-load shell. External videos often only have
|
|
8
|
+
* `embed.thumbnailUrl` (oEmbed); local/full may set `poster` on the video.
|
|
9
|
+
*/
|
|
10
|
+
function getVideoPosterUrl(video) {
|
|
11
|
+
if (!video) {
|
|
12
|
+
return undefined;
|
|
13
|
+
}
|
|
14
|
+
if (video.poster) {
|
|
15
|
+
return video.poster;
|
|
16
|
+
}
|
|
17
|
+
if (isExternalVideo(video) && video.embed?.thumbnailUrl) {
|
|
18
|
+
return video.embed.thumbnailUrl;
|
|
19
|
+
}
|
|
20
|
+
return undefined;
|
|
21
|
+
}
|
|
22
|
+
function getVideoAccessibleName(video) {
|
|
23
|
+
return video?.name?.trim() || 'Video';
|
|
24
|
+
}
|
|
25
|
+
/**
|
|
26
|
+
* Lazy-loads {@link VideoComponent} (local / external embeds) after the shell
|
|
27
|
+
* approaches the viewport (or immediately when `loading="eager"` /
|
|
28
|
+
* `fetchPriority="high"`).
|
|
29
|
+
*
|
|
30
|
+
* The pre-load shell must not be empty: crawlers and a11y scanners (e.g.
|
|
31
|
+
* Siteimprove “content missing after heading”) only see the SSR HTML. Always
|
|
32
|
+
* reserve aspect ratio and, when available, render poster + accessible name.
|
|
33
|
+
*/
|
|
4
34
|
export function LazyVideo(maybeProps) {
|
|
5
35
|
const ref = useRef(null);
|
|
6
36
|
const [Loaded, setLoaded] = useState(null);
|
|
@@ -47,6 +77,29 @@ export function LazyVideo(maybeProps) {
|
|
|
47
77
|
const w = video?.width;
|
|
48
78
|
const h = video?.height;
|
|
49
79
|
const aspectRatio = w && h ? `${w} / ${h}` : '16 / 9';
|
|
50
|
-
|
|
80
|
+
const poster = getVideoPosterUrl(video);
|
|
81
|
+
const name = getVideoAccessibleName(video);
|
|
82
|
+
const shellStyle = {
|
|
83
|
+
aspectRatio,
|
|
84
|
+
position: 'relative',
|
|
85
|
+
overflow: 'hidden',
|
|
86
|
+
...style,
|
|
87
|
+
};
|
|
88
|
+
return (_jsx("div", { ref: ref, className: className, style: shellStyle, children: poster ? (_jsx(Image, { src: poster, alt: name, width: w ?? 1920, height: h ?? 1080, sizes: "100vw", style: {
|
|
89
|
+
display: 'block',
|
|
90
|
+
width: '100%',
|
|
91
|
+
height: '100%',
|
|
92
|
+
objectFit: 'cover',
|
|
93
|
+
} })) : (_jsx("span", { style: {
|
|
94
|
+
position: 'absolute',
|
|
95
|
+
width: 1,
|
|
96
|
+
height: 1,
|
|
97
|
+
padding: 0,
|
|
98
|
+
margin: -1,
|
|
99
|
+
overflow: 'hidden',
|
|
100
|
+
clip: 'rect(0, 0, 0, 0)',
|
|
101
|
+
whiteSpace: 'nowrap',
|
|
102
|
+
border: 0,
|
|
103
|
+
}, children: name })) }));
|
|
51
104
|
}
|
|
52
105
|
//# sourceMappingURL=LazyVideo.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LazyVideo.js","sourceRoot":"","sources":["../../src/components/LazyVideo.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"LazyVideo.js","sourceRoot":"","sources":["../../src/components/LazyVideo.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@se-studio/core-ui",
|
|
3
|
-
"version": "1.14.
|
|
3
|
+
"version": "1.14.5",
|
|
4
4
|
"description": "Shared React UI component library with Tailwind CSS v4 for SE Studio applications",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -75,7 +75,7 @@
|
|
|
75
75
|
"mustache": "4.2.0",
|
|
76
76
|
"server-only": "0.0.1",
|
|
77
77
|
"tailwind-merge": "^3.6.0",
|
|
78
|
-
"@se-studio/contentful-rest-api": "1.16.
|
|
78
|
+
"@se-studio/contentful-rest-api": "1.16.4",
|
|
79
79
|
"@se-studio/core-data-types": "1.6.1"
|
|
80
80
|
},
|
|
81
81
|
"devDependencies": {
|