@se-studio/core-ui 1.0.76 → 1.0.78

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @se-studio/core-ui
 
+## 1.0.78
+
+### Patch Changes
+
+- Bulk version bump: patch for all packages
+- Updated dependencies
+  - @se-studio/contentful-rest-api@1.0.78
+  - @se-studio/core-data-types@1.0.78
+
+## 1.0.77
+
+### Patch Changes
+
+- Bulk version bump: patch for all packages
+- Updated dependencies
+  - @se-studio/contentful-rest-api@1.0.77
+  - @se-studio/core-data-types@1.0.77
+
 ## 1.0.76
 
 ### Patch Changes
@@ -106,6 +124,11 @@
 - **CmsRendererConfig.previewHelpers** is now **required**. Apps must pass `previewHelpers` (and optionally `fetchHelpers`) on the renderer config so components and collections can use `getPreviewFieldProps(rendererConfig, id, fieldId)` without importing from cms-server. See `docs/SERVER_CLIENT_BOUNDARIES.md`.
 - **BackgroundMedia** no longer accepts `analyticsContext`. Section-level background media is not used for analytics tracking.
 
+### Documentation
+
+- **CmsContent** expects `pageContext`, `contents`, `rendererConfig`, and optionally `analyticsContext` (not `content`/`config`). Pass `analyticsContext` for link/click tracking.
+- **SectionLinks** (app-level element) requires `rendererConfig`; for correct tracking also pass `trackingLocation` (e.g. `cmsLabel`) and `analyticsContext` (e.g. `contentContext?.analyticsContext`).
+
 ## 1.0.65
 
 ### Patch Changes

package/dist/components/ExternalVimeoEmbed.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExternalVimeoEmbed.d.ts","sourceRoot":"","sources":["../../src/components/ExternalVimeoEmbed.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAIpF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAG3C,iBAAS,kBAAkB,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,SAAS,EACT,OAAO,EACP,gBAAgB,EAChB,cAAc,EACd,QAAQ,EACR,IAAI,EACJ,GAAG,KAAK,EACT,EAAE;IACD,KAAK,EAAE,cAAc,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,gBAAgB,EAAE,iBAAiB,GAAG,IAAI,GAAG,SAAS,CAAC;IACvD,cAAc,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;CAC3C,GAAG,WAAW,2CAoCd;AAED,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"ExternalVimeoEmbed.d.ts","sourceRoot":"","sources":["../../src/components/ExternalVimeoEmbed.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAKpF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AA6F3C,iBAAS,kBAAkB,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,SAAS,EACT,OAAO,EACP,gBAAgB,EAChB,cAAc,EACd,QAAQ,EACR,IAAI,EACJ,GAAG,KAAK,EACT,EAAE;IACD,KAAK,EAAE,cAAc,CAAC;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,gBAAgB,EAAE,iBAAiB,GAAG,IAAI,GAAG,SAAS,CAAC;IACvD,cAAc,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;CAC3C,GAAG,WAAW,2CA+Cd;AAED,eAAe,kBAAkB,CAAC"}

package/dist/components/ExternalVimeoEmbed.js

@@ -1,8 +1,52 @@
 'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Image from 'next/image';
+import { useEffect, useRef, useState } from 'react';
 import { cn } from '../utils/cn';
 import { calculateCropDetails } from './Visual';
+function getVimeoHash(url) {
+    const match = url.match(/[?&]h=([^&]+)/);
+    const value = match?.[1];
+    return value ?? null;
+}
+function buildVimeoAutoplaySrc(vimeoId, externalUrl, loop) {
+    const params = new URLSearchParams();
+    params.set('autoplay', '1');
+    params.set('muted', '1');
+    params.set('background', '1');
+    if (loop) {
+        params.set('loop', '1');
+    }
+    const hash = getVimeoHash(externalUrl);
+    if (hash) {
+        params.set('h', hash);
+    }
+    return `https://player.vimeo.com/video/${vimeoId}?${params.toString()}`;
+}
+function AutoplayVimeoIframe({ video, vimeoId, style, className, loop, }) {
+    const containerRef = useRef(null);
+    const [shouldLoad, setShouldLoad] = useState(false);
+    const embed = video.embed;
+    useEffect(() => {
+        const el = containerRef.current;
+        if (!el)
+            return;
+        const io = new IntersectionObserver((entries) => {
+            const entry = entries[0];
+            if (entry?.isIntersecting) {
+                setShouldLoad(true);
+            }
+        }, { rootMargin: '50px', threshold: 0 });
+        io.observe(el);
+        return () => io.disconnect();
+    }, []);
+    const fullStyle = {
+        ...style,
+        ...calculateCropDetails(video),
+        aspectRatio: embed ? `${embed.width / embed.height}` : undefined,
+    };
+    return (_jsxs("div", { ref: containerRef, className: cn('relative w-full overflow-hidden', className), style: fullStyle, children: [!shouldLoad && video.poster && (_jsx(Image, { src: video.poster, alt: video.name, width: video.width ?? 1920, height: video.height ?? 1080, style: { objectFit: 'cover' }, sizes: "100vw", className: "h-full w-full" })), shouldLoad && (_jsx("iframe", { src: buildVimeoAutoplaySrc(vimeoId, video.external, loop ?? false), title: video.name, className: "absolute inset-0 h-full w-full border-0", allow: "autoplay; fullscreen; picture-in-picture", allowFullScreen: true }))] }));
+}
 function ExternalVimeoEmbed({ video, style, className, vimeoId, analyticsContext, componentLabel, autoPlay, loop, ...props }) {
     const cropProperties = calculateCropDetails(video);
     const embed = video.embed;
@@ -11,7 +55,10 @@ function ExternalVimeoEmbed({ video, style, className, vimeoId, analyticsContext
         ...cropProperties,
         aspectRatio: embed ? `${embed.width / embed.height}` : undefined,
     };
-    return (_jsx("div", { className: cn('w-full', className), style: fullStyle, children: _jsx("lite-vimeo", { videoid: vimeoId, title: video.name, className: "h-full w-full", autoload: true, autoplay: autoPlay, ...props, children: video.poster && (_jsx(Image, { slot: "image", src: video.poster, alt: video.name, width: video.width ?? 1920, height: video.height ?? 1080, style: {
+    if (autoPlay) {
+        return (_jsx(AutoplayVimeoIframe, { video: video, vimeoId: vimeoId, style: style, className: className, loop: loop }));
+    }
+    return (_jsx("div", { className: cn('w-full', className), style: fullStyle, children: _jsx("lite-vimeo", { videoid: vimeoId, title: video.name, className: "h-full w-full", autoload: true, ...props, children: video.poster && (_jsx(Image, { slot: "image", src: video.poster, alt: video.name, width: video.width ?? 1920, height: video.height ?? 1080, style: {
                     objectFit: 'cover',
                 }, sizes: "100vw", className: "h-full w-full" })) }) }));
 }

package/dist/components/ExternalVimeoEmbed.js.map

@@ -1 +1 @@
-{"version":3,"file":"ExternalVimeoEmbed.js","sourceRoot":"","sources":["../../src/components/ExternalVimeoEmbed.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,KAAK,MAAM,YAAY,CAAC;AAE/B,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAEjC,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAEhD,SAAS,kBAAkB,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,SAAS,EACT,OAAO,EACP,gBAAgB,EAChB,cAAc,EACd,QAAQ,EACR,IAAI,EACJ,GAAG,KAAK,EAMK;IACb,MAAM,cAAc,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;IACnD,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;IAC1B,MAAM,SAAS,GAAkB;QAC/B,GAAG,KAAK;QACR,GAAG,cAAc;QACjB,WAAW,EAAE,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,SAAS;KACjE,CAAC;IAEF,OAAO,CACL,cAAK,SAAS,EAAE,EAAE,CAAC,QAAQ,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,SAAS,YACvD,qBACE,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,CAAC,IAAI,EACjB,SAAS,EAAC,eAAe,EACzB,QAAQ,QACR,QAAQ,EAAE,QAAQ,KACd,KAAK,YAER,KAAK,CAAC,MAAM,IAAI,CACf,KAAC,KAAK,IACJ,IAAI,EAAC,OAAO,EACZ,GAAG,EAAE,KAAK,CAAC,MAAM,EACjB,GAAG,EAAE,KAAK,CAAC,IAAI,EACf,KAAK,EAAE,KAAK,CAAC,KAAK,IAAI,IAAI,EAC1B,MAAM,EAAE,KAAK,CAAC,MAAM,IAAI,IAAI,EAC5B,KAAK,EAAE;oBACL,SAAS,EAAE,OAAO;iBACnB,EACD,KAAK,EAAC,OAAO,EACb,SAAS,EAAC,eAAe,GACzB,CACH,GACU,GACT,CACP,CAAC;AACJ,CAAC;AAED,eAAe,kBAAkB,CAAC"}
+{"version":3,"file":"ExternalVimeoEmbed.js","sourceRoot":"","sources":["../../src/components/ExternalVimeoEmbed.tsx"],"names":[],"mappings":"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"}

package/dist/components/ImageKitClientVideo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ImageKitClientVideo.d.ts","sourceRoot":"","sources":["../../src/components/ImageKitClientVideo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAmC,MAAM,4BAA4B,CAAC;AACjG,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AA4C3C,iBAAS,aAAa,CAAC,EACrB,GAAG,EACH,WAAW,EACX,QAAQ,EACR,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,KAAK,EACL,MAAM,EACN,QAAQ,EACR,oBAAoB,EACpB,sBAAsB,EACtB,KAAK,EACL,MAAM,EACN,WAAW,EACX,OAAO,EACP,aAAa,EACb,QAAQ,EACR,GAAG,KAAK,EACT,EAAE;IACD,GAAG,EAAE,MAAM,CAAC;IACZ,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;CAC5B,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,eAAe,CAAC,GAC/D,WAAW,2CA0CZ;AAED,eAAe,aAAa,CAAC"}
+{"version":3,"file":"ImageKitClientVideo.d.ts","sourceRoot":"","sources":["../../src/components/ImageKitClientVideo.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,aAAa,EAAmC,MAAM,4BAA4B,CAAC;AACjG,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAgE3C,iBAAS,aAAa,CAAC,EACrB,GAAG,EACH,WAAW,EACX,QAAQ,EACR,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,KAAK,EACL,MAAM,EACN,QAAQ,EACR,oBAAoB,EACpB,sBAAsB,EACtB,KAAK,EACL,MAAM,EACN,WAAW,EACX,OAAO,EACP,aAAa,EACb,QAAQ,EACR,GAAG,KAAK,EACT,EAAE;IACD,GAAG,EAAE,MAAM,CAAC;IACZ,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;CAC5B,GAAG,IAAI,CAAC,aAAa,EAAE,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,eAAe,CAAC,GAC/D,WAAW,2CA+CZ;AAED,eAAe,aAAa,CAAC"}

package/dist/components/ImageKitClientVideo.js

@@ -1,18 +1,37 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { processSizes } from '@se-studio/core-data-types';
 import { calculateCropDetails } from './Visual';
+/** Extra viewport widths for high-DPI video sources (srcset-style). */
+const VIDEO_EXPANSION_VIEWPORTS = [1280, 1920, 2560, 3840];
+function expandBreakpointsForVideo(breakpoints) {
+    if (!breakpoints?.length)
+        return breakpoints ?? [];
+    const sorted = [...breakpoints].sort((a, b) => a.minWidth - b.minWidth);
+    const max = sorted[sorted.length - 1];
+    if (!max)
+        return breakpoints;
+    const ratio = max.pixels / max.minWidth;
+    const existingWidths = new Set(breakpoints.map((b) => b.minWidth));
+    const expanded = [...sorted];
+    for (const vw of VIDEO_EXPANSION_VIEWPORTS) {
+        if (vw > max.minWidth && !existingWidths.has(vw)) {
+            expanded.push({ minWidth: vw, pixels: Math.round(vw * ratio) });
+            existingWidths.add(vw);
+        }
+    }
+    return expanded.sort((a, b) => a.minWidth - b.minWidth);
+}
 const VideoSources = ({ baseSrc, videoPrefix, width, visualSizes }) => {
     if (!visualSizes) {
         return _jsx("source", { src: `${videoPrefix}${baseSrc}`, type: "video/mp4" });
     }
-    const sizes = processSizes(visualSizes)
-        ?.breakpoints?.filter((x) => !width || x.pixels < width)
-        .sort((a, b) => a.minWidth - b.minWidth);
-    return (_jsxs(_Fragment, { children: [sizes?.map(({ minWidth, pixels }, index, arr) => {
-                // For video sources, convert minWidth back to max-width media queries
-                const nextBreakpoint = arr[index + 1];
-                const maxWidth = nextBreakpoint ? nextBreakpoint.minWidth - 1 : undefined;
-                return maxWidth ? (_jsx("source", { src: `${videoPrefix}${baseSrc}?tr=w-${pixels}`, media: `(max-width: ${maxWidth}px)`, type: "video/mp4" }, minWidth)) : null;
+    const processed = processSizes(visualSizes)?.breakpoints;
+    const expanded = expandBreakpointsForVideo(processed);
+    const sizes = expanded
+        .filter((x) => !width || x.pixels < width)
+        .sort((a, b) => b.minWidth - a.minWidth);
+    return (_jsxs(_Fragment, { children: [sizes?.map(({ minWidth, pixels }) => {
+                return (_jsx("source", { src: `${videoPrefix}${baseSrc}?tr=w-${pixels}`, media: `(min-width: ${minWidth}px)`, type: "video/mp4" }, minWidth));
             }), visualSizes.defaultPixels ? (_jsx("source", { src: `${videoPrefix}${baseSrc}?tr=w-${visualSizes.defaultPixels}`, type: "video/mp4" })) : (_jsx("source", { src: `${videoPrefix}${baseSrc}`, type: "video/mp4" }))] }));
 };
 function ImageKitVideo({ url, videoPrefix, autoPlay, loop, muted, controls, style, poster, dontCrop, verticalCropPosition, horizontalCropPosition, width, height, visualSizes, loading, fetchPriority, noPoster, ...props }) {
@@ -33,7 +52,7 @@ function ImageKitVideo({ url, videoPrefix, autoPlay, loop, muted, controls, styl
             ? 'auto'
             : loading === 'lazy'
                 ? 'metadata'
-                : undefined, fetchPriority: fetchPriority, ...props, poster: realPoster, children: [_jsx(VideoSources, { videoPrefix: videoPrefix, baseSrc: baseSrc, visualSizes: visualSizes }), realMuted && _jsx("track", { kind: "captions", default: true })] }));
+                : undefined, fetchPriority: fetchPriority, ...props, poster: realPoster, children: [_jsx(VideoSources, { width: width, videoPrefix: videoPrefix, baseSrc: baseSrc, visualSizes: visualSizes }), realMuted && _jsx("track", { kind: "captions", default: true })] }));
 }
 export default ImageKitVideo;
 //# sourceMappingURL=ImageKitClientVideo.js.map

package/dist/components/ImageKitClientVideo.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageKitClientVideo.js","sourceRoot":"","sources":["../../src/components/ImageKitClientVideo.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ImageKitClientVideo.js","sourceRoot":"","sources":["../../src/components/ImageKitClientVideo.tsx"],"names":[],"mappings":"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"}

package/dist/components/ImageKitHlsVideoClient.d.ts

@@ -0,0 +1,13 @@
+import type { IVideoProps } from './Video';
+interface ImageKitHlsVideoClientProps extends Omit<IVideoProps, 'poster'> {
+    hlsSrc: string;
+    /** Optional MP4 URL used when HLS fails fatally (e.g. unsupported codec or network error). */
+    fallbackMp4Url?: string | null;
+    poster?: string | null;
+    width?: number;
+    height?: number;
+    noPoster?: boolean;
+}
+export default function ImageKitHlsVideoClient({ hlsSrc, fallbackMp4Url, autoPlay, loop, muted, controls, style, poster, width, height, loading, fetchPriority, noPoster, visualSizes: _visualSizes, ...props }: ImageKitHlsVideoClientProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ImageKitHlsVideoClient.d.ts.map

package/dist/components/ImageKitHlsVideoClient.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageKitHlsVideoClient.d.ts","sourceRoot":"","sources":["../../src/components/ImageKitHlsVideoClient.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C,UAAU,2BAA4B,SAAQ,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC;IACvE,MAAM,EAAE,MAAM,CAAC;IACf,8FAA8F;IAC9F,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,CAAC,OAAO,UAAU,sBAAsB,CAAC,EAC7C,MAAM,EACN,cAAc,EACd,QAAQ,EACR,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,KAAK,EACL,MAAM,EACN,KAAK,EACL,MAAM,EACN,OAAO,EACP,aAAa,EACb,QAAQ,EACR,WAAW,EAAE,YAAY,EACzB,GAAG,KAAK,EACT,EAAE,2BAA2B,2CAyE7B"}

package/dist/components/ImageKitHlsVideoClient.js

@@ -0,0 +1,51 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
+export default function ImageKitHlsVideoClient({ hlsSrc, fallbackMp4Url, autoPlay, loop, muted, controls, style, poster, width, height, loading, fetchPriority, noPoster, visualSizes: _visualSizes, ...props }) {
+    const videoRef = useRef(null);
+    const [useFallbackMp4, setUseFallbackMp4] = useState(false);
+    const realAutoPlay = !!autoPlay;
+    const realMuted = muted ?? realAutoPlay;
+    const realControls = !realAutoPlay || controls;
+    const realPoster = noPoster ? undefined : (poster ?? undefined);
+    useEffect(() => {
+        if (useFallbackMp4)
+            return;
+        const video = videoRef.current;
+        if (!video)
+            return;
+        let hlsInstance = null;
+        const setupHls = async () => {
+            const Hls = (await import('hls.js')).default;
+            if (!Hls.isSupported()) {
+                if (fallbackMp4Url)
+                    setUseFallbackMp4(true);
+                return;
+            }
+            hlsInstance = new Hls();
+            hlsInstance.loadSource(hlsSrc);
+            hlsInstance.attachMedia(video);
+            hlsInstance.on(Hls.Events.ERROR, (_event, data) => {
+                if (data.fatal) {
+                    hlsInstance?.destroy();
+                    hlsInstance = null;
+                    if (fallbackMp4Url)
+                        setUseFallbackMp4(true);
+                }
+            });
+        };
+        setupHls();
+        return () => {
+            if (hlsInstance) {
+                hlsInstance.destroy();
+            }
+        };
+    }, [hlsSrc, fallbackMp4Url, useFallbackMp4]);
+    const useMp4 = useFallbackMp4 && fallbackMp4Url;
+    return (_jsx("video", { ref: videoRef, src: useMp4 ? fallbackMp4Url : undefined, "aria-hidden": realMuted && loop, playsInline: true, autoPlay: realAutoPlay, loop: loop, muted: realMuted, controls: realControls, style: style, width: width, height: height, poster: realPoster ?? undefined, preload: fetchPriority === 'high' || loading === 'eager'
+            ? 'auto'
+            : loading === 'lazy'
+                ? 'metadata'
+                : undefined, fetchPriority: fetchPriority, ...props, children: realMuted && _jsx("track", { kind: "captions", default: true }) }));
+}
+//# sourceMappingURL=ImageKitHlsVideoClient.js.map

package/dist/components/ImageKitHlsVideoClient.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageKitHlsVideoClient.js","sourceRoot":"","sources":["../../src/components/ImageKitHlsVideoClient.tsx"],"names":[],"mappings":"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"}

package/dist/components/LocalVideoServer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LocalVideoServer.d.ts","sourceRoot":"","sources":["../../src/components/LocalVideoServer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAEjF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAqC3C,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAC9B;IACE,KAAK,EAAE,WAAW,CAAC;IACnB,gBAAgB,EAAE,iBAAiB,GAAG,IAAI,GAAG,SAAS,CAAC;IACvD,cAAc,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;CAC3C,GAAG,WAAW,CA4BhB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"LocalVideoServer.d.ts","sourceRoot":"","sources":["../../src/components/LocalVideoServer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAGjF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAsC3C,QAAA,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAC9B;IACE,KAAK,EAAE,WAAW,CAAC;IACnB,gBAAgB,EAAE,iBAAiB,GAAG,IAAI,GAAG,SAAS,CAAC;IACvD,cAAc,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;CAC3C,GAAG,WAAW,CAqEhB,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/components/LocalVideoServer.js

@@ -1,5 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import ImageKitVideo from './ImageKitClientVideo';
+import ImageKitHlsVideoClient from './ImageKitHlsVideoClient';
+import { calculateCropDetails } from './Visual';
 async function tryGetVideoMetadata(url) {
     const imagekitUrl = process.env.IMAGEKIT_URL;
     const privateKey = process.env.IMAGEKIT_PRIVATE_KEY;
@@ -25,7 +27,28 @@ async function tryGetVideoMetadata(url) {
 }
 const LocalVideoServer = async ({ video, autoPlay, loop, controls, poster, analyticsContext, componentLabel, ...props }) => {
     const videoMetadata = await tryGetVideoMetadata(video.preview.videoUrl);
-    return (_jsx(ImageKitVideo, { url: video.preview.videoUrl, videoPrefix: video.videoPrefix, width: videoMetadata?.width, height: videoMetadata?.height, autoPlay: video.autoPlay ?? autoPlay, loop: video.loop ?? loop, controls: !video.hideControls && controls, poster: video.poster ?? poster, dontCrop: video.dontCrop, verticalCropPosition: video.verticalCropPosition, horizontalCropPosition: video.horizontalCropPosition, ...props }));
+    const useHls = process.env.IMAGEKIT_VIDEO_HLS === 'true' || process.env.IMAGEKIT_VIDEO_HLS === '1';
+    const resolvedAutoPlay = video.autoPlay ?? autoPlay;
+    const resolvedLoop = video.loop ?? loop;
+    const resolvedControls = !video.hideControls && controls;
+    const resolvedPoster = video.poster ?? poster;
+    if (useHls) {
+        const fullUrl = new URL(video.preview.videoUrl);
+        const pathname = fullUrl.pathname;
+        const basePath = pathname.replace(/\/$/, '');
+        const mp4Extension = pathname.endsWith('.mp4') ? '' : '/ik-video.mp4';
+        const representations = process.env.IMAGEKIT_VIDEO_HLS_REPRESENTATIONS ?? '240_360_480_720_1080';
+        const hlsSrc = `${video.videoPrefix}${basePath}/ik-master.m3u8?tr=sr-${representations}`;
+        const fallbackMp4Url = `${video.videoPrefix}${pathname}${mp4Extension}`;
+        const posterUrl = resolvedPoster ?? `${video.videoPrefix}${pathname}${mp4Extension}/ik-thumbnail.jpg`;
+        const cropStyle = calculateCropDetails({
+            dontCrop: video.dontCrop,
+            verticalCropPosition: video.verticalCropPosition,
+            horizontalCropPosition: video.horizontalCropPosition,
+        });
+        return (_jsx(ImageKitHlsVideoClient, { hlsSrc: hlsSrc, fallbackMp4Url: fallbackMp4Url, width: videoMetadata?.width, height: videoMetadata?.height, autoPlay: resolvedAutoPlay, loop: resolvedLoop, controls: resolvedControls, poster: posterUrl, style: { ...props.style, ...cropStyle }, ...props }));
+    }
+    return (_jsx(ImageKitVideo, { url: video.preview.videoUrl, videoPrefix: video.videoPrefix, width: videoMetadata?.width, height: videoMetadata?.height, autoPlay: resolvedAutoPlay, loop: resolvedLoop, controls: resolvedControls, poster: resolvedPoster, dontCrop: video.dontCrop, verticalCropPosition: video.verticalCropPosition, horizontalCropPosition: video.horizontalCropPosition, ...props }));
 };
 export default LocalVideoServer;
 //# sourceMappingURL=LocalVideoServer.js.map

package/dist/components/LocalVideoServer.js.map

@@ -1 +1 @@
-{"version":3,"file":"LocalVideoServer.js","sourceRoot":"","sources":["../../src/components/LocalVideoServer.tsx"],"names":[],"mappings":";AACA,OAAO,aAAa,MAAM,uBAAuB,CAAC;AAYlD,KAAK,UAAU,mBAAmB,CAAC,GAAW;IAC5C,MAAM,WAAW,GAAG,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC;IAC7C,MAAM,UAAU,GAAG,OAAO,CAAC,GAAG,CAAC,oBAAoB,CAAC;IACpD,IAAI,CAAC,WAAW,IAAI,CAAC,UAAU,EAAE,CAAC;QAChC,MAAM,IAAI,KAAK,CAAC,yCAAyC,CAAC,CAAC;IAC7D,CAAC;IACD,MAAM,OAAO,GAAG,IAAI,GAAG,CAAC,GAAG,CAAC,CAAC;IAC7B,MAAM,GAAG,GAAG,GAAG,WAAW,GAAG,OAAO,CAAC,QAAQ,eAAe,CAAC;IAE7D,MAAM,OAAO,GAAG,2CAA2C,kBAAkB,CAAC,GAAG,CAAC,EAAE,CAAC;IACrF,MAAM,WAAW,GAAgB;QAC/B,MAAM,EAAE,KAAK;QACb,OAAO,EAAE;YACP,aAAa,EAAE,SAAS,MAAM,CAAC,IAAI,CAAC,GAAG,UAAU,GAAG,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;SAC3E;QACD,KAAK,EAAE,aAAa;KACrB,CAAC;IACF,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;IACnD,IAAI,QAAQ,CAAC,EAAE,EAAE,CAAC;QAChB,MAAM,QAAQ,GAAG,CAAC,MAAM,QAAQ,CAAC,IAAI,EAAE,CAA8B,CAAC;QACtE,OAAO,QAAQ,CAAC;IAClB,CAAC;IAED,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,MAAM,gBAAgB,GAMlB,KAAK,EAAE,EACT,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,gBAAgB,EAChB,cAAc,EACd,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,aAAa,GAAG,MAAM,mBAAmB,CAAC,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IACxE,OAAO,CACL,KAAC,aAAa,IACZ,GAAG,EAAE,KAAK,CAAC,OAAO,CAAC,QAAQ,EAC3B,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,KAAK,EAAE,aAAa,EAAE,KAAK,EAC3B,MAAM,EAAE,aAAa,EAAE,MAAM,EAC7B,QAAQ,EAAE,KAAK,CAAC,QAAQ,IAAI,QAAQ,EACpC,IAAI,EAAE,KAAK,CAAC,IAAI,IAAI,IAAI,EACxB,QAAQ,EAAE,CAAC,KAAK,CAAC,YAAY,IAAI,QAAQ,EACzC,MAAM,EAAE,KAAK,CAAC,MAAM,IAAI,MAAM,EAC9B,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,oBAAoB,EAAE,KAAK,CAAC,oBAAoB,EAChD,sBAAsB,EAAE,KAAK,CAAC,sBAAsB,KAChD,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
+{"version":3,"file":"LocalVideoServer.js","sourceRoot":"","sources":["../../src/components/LocalVideoServer.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@se-studio/core-ui",
-  "version": "1.0.76",
+  "version": "1.0.78",
   "description": "Shared React UI component library with Tailwind CSS v4 for SE Studio applications",
   "repository": {
     "type": "git",
@@ -56,11 +56,12 @@
     "@radix-ui/react-slot": "^1.2.4",
     "@types/mustache": "4.2.6",
     "clsx": "^2.1.1",
+    "hls.js": "^1.6.0",
     "html-entities": "^2.6.0",
     "mustache": "4.2.0",
     "tailwind-merge": "^3.4.0",
-    "@se-studio/contentful-rest-api": "1.0.76",
-    "@se-studio/core-data-types": "1.0.76"
+    "@se-studio/contentful-rest-api": "1.0.78",
+    "@se-studio/core-data-types": "1.0.78"
   },
   "devDependencies": {
     "@biomejs/biome": "^2.3.15",