wimui 0.63.0 → 0.63.2

package/dist/components/media/ImageCompare/ImageCompare.js

@@ -1,104 +1,105 @@
 "use client";
 import { useWimTranslation as e } from "../../../i18n/useWimTranslation.js";
 import { commonNs as t } from "../../../i18n/generated/common.js";
-import n from "../../../icon/chevron-left.js";
-import r from "../../../icon/chevron-right.js";
-import { Icon as i } from "../Icon/Icon.js";
-import a from "./image-compare.module.js";
-import o, { useCallback as s, useRef as c, useState as l } from "react";
-import u from "classnames";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { composeEventHandlers as n } from "../../_internal/composeEventHandlers.js";
+import r from "../../../icon/chevron-left.js";
+import i from "../../../icon/chevron-right.js";
+import { Icon as a } from "../Icon/Icon.js";
+import o from "./image-compare.module.js";
+import s, { useCallback as c, useRef as l, useState as u } from "react";
+import d from "classnames";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
 //#region src/components/media/ImageCompare/ImageCompare.tsx
-var p = (e) => Math.max(0, Math.min(100, e)), m = o.forwardRef(({ before: o, after: m, beforeAlt: h = "", afterAlt: g = "", beforeLabel: _, afterLabel: v, defaultPosition: y = 50, position: b, onPositionChange: x, orientation: S = "horizontal", width: C, height: w, radius: T = "md", labels: E, className: D, "aria-label": O, "aria-labelledby": k, "aria-describedby": A, ...j }, M) => {
-	let { t: N } = e(t), { handleAriaLabel: P = N("imageCompare.handle") } = E ?? {}, F = b !== void 0, [I, L] = l(p(y)), R = p(F ? b : I), z = S === "vertical", B = c(null), V = c(!1), H = s((e) => {
-		B.current = e, typeof M == "function" ? M(e) : M && (M.current = e);
-	}, [M]), U = s((e) => {
-		let t = p(e);
-		F || L(t), x?.(t);
-	}, [F, x]), W = s((e, t) => {
-		let n = B.current?.getBoundingClientRect();
+var m = (e) => Math.max(0, Math.min(100, e)), h = s.forwardRef(({ before: s, after: h, beforeAlt: g = "", afterAlt: _ = "", beforeLabel: v, afterLabel: y, defaultPosition: b = 50, position: x, onPositionChange: S, orientation: C = "horizontal", width: w, height: T, radius: E = "md", labels: D, className: O, "aria-label": k, "aria-labelledby": A, "aria-describedby": j, ...M }, N) => {
+	let { t: P } = e(t), { handleAriaLabel: F = P("imageCompare.handle") } = D ?? {}, I = x !== void 0, [L, R] = u(m(b)), z = m(I ? x : L), B = C === "vertical", V = l(null), H = l(!1), U = c((e) => {
+		V.current = e, typeof N == "function" ? N(e) : N && (N.current = e);
+	}, [N]), W = c((e) => {
+		let t = m(e);
+		I || R(t), S?.(t);
+	}, [I, S]), G = c((e, t) => {
+		let n = V.current?.getBoundingClientRect();
 		if (!n) return;
-		let r = z ? (t - n.top) / n.height * 100 : (e - n.left) / n.width * 100;
-		U(r);
-	}, [z, U]), G = (e) => {
-		V.current = !0, e.currentTarget.setPointerCapture(e.pointerId), W(e.clientX, e.clientY);
-	}, K = (e) => {
-		V.current && W(e.clientX, e.clientY);
+		let r = B ? (t - n.top) / n.height * 100 : (e - n.left) / n.width * 100;
+		W(r);
+	}, [B, W]), K = (e) => {
+		H.current = !0, e.currentTarget.setPointerCapture(e.pointerId), G(e.clientX, e.clientY);
 	}, q = (e) => {
-		V.current = !1, e.currentTarget.releasePointerCapture?.(e.pointerId);
+		H.current && G(e.clientX, e.clientY);
 	}, J = (e) => {
-		let t = e.shiftKey ? 10 : 2, n = z ? "ArrowUp" : "ArrowLeft", r = z ? "ArrowDown" : "ArrowRight";
-		e.key === n ? (e.preventDefault(), U(R - t)) : e.key === r ? (e.preventDefault(), U(R + t)) : e.key === "Home" ? (e.preventDefault(), U(0)) : e.key === "End" && (e.preventDefault(), U(100));
-	}, Y = z ? { clipPath: `inset(0 0 ${100 - R}% 0)` } : { clipPath: `inset(0 ${100 - R}% 0 0)` }, X = z ? { top: `${R}%` } : { left: `${R}%` };
-	return /* @__PURE__ */ f("div", {
-		ref: H,
-		className: u("wim-image-compare", a.root, z && a.vertical, a[`radius-${T}`], D),
-		onPointerDown: G,
-		onPointerMove: K,
-		onPointerUp: q,
-		...j,
+		H.current = !1, e.currentTarget.releasePointerCapture?.(e.pointerId);
+	}, Y = (e) => {
+		let t = e.shiftKey ? 10 : 2, n = B ? "ArrowUp" : "ArrowLeft", r = B ? "ArrowDown" : "ArrowRight";
+		e.key === n ? (e.preventDefault(), W(z - t)) : e.key === r ? (e.preventDefault(), W(z + t)) : e.key === "Home" ? (e.preventDefault(), W(0)) : e.key === "End" && (e.preventDefault(), W(100));
+	}, X = B ? { clipPath: `inset(0 0 ${100 - z}% 0)` } : { clipPath: `inset(0 ${100 - z}% 0 0)` }, Z = B ? { top: `${z}%` } : { left: `${z}%` };
+	return /* @__PURE__ */ p("div", {
+		ref: U,
+		className: d("wim-image-compare", o.root, B && o.vertical, o[`radius-${E}`], O),
+		...M,
+		onPointerDown: n(M.onPointerDown, K),
+		onPointerMove: n(M.onPointerMove, q),
+		onPointerUp: n(M.onPointerUp, J),
 		style: {
-			width: C,
-			height: w,
-			...j.style
+			width: w,
+			height: T,
+			...M.style
 		},
 		children: [
-			/* @__PURE__ */ d("img", {
-				className: a.image,
-				src: m,
-				alt: g,
+			/* @__PURE__ */ f("img", {
+				className: o.image,
+				src: h,
+				alt: _,
 				draggable: !1
 			}),
-			v && /* @__PURE__ */ d("span", {
-				className: u(a.label, a.afterLabel),
-				children: v
+			y && /* @__PURE__ */ f("span", {
+				className: d(o.label, o.afterLabel),
+				children: y
 			}),
-			/* @__PURE__ */ f("div", {
-				className: a.beforeLayer,
-				style: Y,
-				children: [/* @__PURE__ */ d("img", {
-					className: a.image,
-					src: o,
-					alt: h,
+			/* @__PURE__ */ p("div", {
+				className: o.beforeLayer,
+				style: X,
+				children: [/* @__PURE__ */ f("img", {
+					className: o.image,
+					src: s,
+					alt: g,
 					draggable: !1
-				}), _ && /* @__PURE__ */ d("span", {
-					className: u(a.label, a.beforeLabel),
-					children: _
+				}), v && /* @__PURE__ */ f("span", {
+					className: d(o.label, o.beforeLabel),
+					children: v
 				})]
 			}),
-			/* @__PURE__ */ f("div", {
-				className: a.divider,
-				style: X,
-				children: [/* @__PURE__ */ d("span", {
-					className: a.line,
+			/* @__PURE__ */ p("div", {
+				className: o.divider,
+				style: Z,
+				children: [/* @__PURE__ */ f("span", {
+					className: o.line,
 					"aria-hidden": "true"
-				}), /* @__PURE__ */ f("button", {
+				}), /* @__PURE__ */ p("button", {
 					type: "button",
-					className: a.handle,
+					className: o.handle,
 					role: "slider",
-					"aria-label": k ? void 0 : O ?? P,
-					"aria-labelledby": k,
-					"aria-describedby": A,
-					"aria-orientation": S,
-					"aria-valuenow": Math.round(R),
+					"aria-label": A ? void 0 : k ?? F,
+					"aria-labelledby": A,
+					"aria-describedby": j,
+					"aria-orientation": C,
+					"aria-valuenow": Math.round(z),
 					"aria-valuemin": 0,
 					"aria-valuemax": 100,
-					onKeyDown: J,
-					onPointerDown: G,
-					children: [/* @__PURE__ */ d(i, {
-						component: n,
-						size: "sm",
-						className: a.arrow
-					}), /* @__PURE__ */ d(i, {
+					onKeyDown: Y,
+					onPointerDown: K,
+					children: [/* @__PURE__ */ f(a, {
 						component: r,
 						size: "sm",
-						className: a.arrow
+						className: o.arrow
+					}), /* @__PURE__ */ f(a, {
+						component: i,
+						size: "sm",
+						className: o.arrow
 					})]
 				})]
 			})
 		]
 	});
 });
-m.displayName = "ImageCompare";
+h.displayName = "ImageCompare";
 //#endregion
-export { m as ImageCompare };
+export { h as ImageCompare };

package/dist/components/media/Video/Video.cjs

@@ -1,2 +1,2 @@
 "use client";
-const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../../i18n/generated/common.cjs"),r=require("../Icon/Icon.cjs"),ee=require("../../../hooks/useMediaLoader.cjs"),i=require("./hooks/useVideoPlayer.cjs"),a=require("./components/VideoAdvancedMenu.cjs"),o=require("./components/VideoControls.cjs"),s=require("./video.module.cjs");let c=require("react");c=e.__toESM(c,1);let l=require("classnames");l=e.__toESM(l,1);let u=require("react/jsx-runtime");var d=({src:e,width:d,height:te,autoPlay:f=!1,loop:p=!1,muted:m=!1,controls:h=!0,poster:g,radius:_=`none`,shadow:v=!1,border:y=!1,fit:b=`cover`,preload:x,caption:S,className:C,style:ne,customControls:w=!1,advancedControls:T=!1,videoId:E,resumePlayback:D=!1,playlist:O,autoPlayNext:k=!1,qualities:A,loading:j=`lazy`,fadeIn:M=!1,demoDelay:N,labels:P={},tracks:F,...I})=>{let{t:L}=t.useWimTranslation(n.commonNs),{videoAriaLabel:R=L(`video.label`),seconds:z=`s`}=P,{containerRef:B,isLoaded:V,isIntersecting:H,notifyLoaded:U,shouldShowSkeleton:W}=ee.useMediaLoader({loading:j,src:A?.[0]?.src||O?.[0]?.src||e,demoDelay:N}),G=i.useVideoPlayer({src:e,autoPlay:f,loop:p,muted:m,fit:b,videoId:E,resumePlayback:D,playlist:O,autoPlayNext:k,qualities:A,customControls:w,advancedControls:T,poster:g,containerRef:B}),{videoRef:K,isPlaying:q,activeSrc:J,activePoster:Y,showNativeControls:X,skipIndicator:Z,activeMenu:Q,setActiveMenu:$}=G;c.default.useEffect(()=>{let e=K.current;e&&(m?e.setAttribute(`muted`,``):e.removeAttribute(`muted`))},[m,K,J,H]);let re={width:`100%`,height:te||`auto`,objectFit:G.activeFit,...ne},ie=_===`none`?null:s.default[`radius${_.charAt(0).toUpperCase()+_.slice(1)}`];return(0,u.jsxs)(`figure`,{className:(0,l.default)(`wim-video`,s.default.root,C),style:{width:`100%`},"aria-label":R,"data-testid":`video-root`,children:[(0,u.jsxs)(`div`,{className:(0,l.default)(s.default.inner,ie,v&&s.default.shadow,y&&s.default.border,(w||T)&&s.default.custom,M&&s.default.fadeIn,M&&V&&s.default.isLoaded,W&&s.default.loading),ref:B,"data-testid":`video-inner`,children:[H&&(0,u.jsx)(`video`,{ref:K,src:J,className:s.default.video,style:re,autoPlay:f&&V,loop:p&&(!O||O.length<=1),muted:m,controls:X&&h,poster:Y,preload:x,playsInline:!0,onTimeUpdate:G.handleTimeUpdate,onLoadedMetadata:G.handleLoadedMetadata,onLoadedData:U,onEnded:G.handleEnded,onPlay:()=>{},onPause:()=>{},onClick:G.handleVideoClick,"data-testid":`video-element`,...I,children:F?.map((e,t)=>(0,u.jsx)(`track`,{...e},t))}),Z.show&&(0,u.jsxs)(`div`,{className:s.default.skipIndicator,children:[(0,u.jsx)(r.Icon,{name:Z.direction===`forward`?`ChevronRightIcon`:`ChevronLeftIcon`,size:`lg`}),(0,u.jsx)(r.Icon,{name:Z.direction===`forward`?`ChevronRightIcon`:`ChevronLeftIcon`,size:`lg`}),(0,u.jsx)(r.Icon,{name:Z.direction===`forward`?`ChevronRightIcon`:`ChevronLeftIcon`,size:`lg`}),(0,u.jsxs)(`span`,{children:[`10`,z]})]}),(w||T)&&(0,u.jsxs)(`div`,{role:`none`,className:s.default.customControls,onClick:()=>Q&&$(null),children:[T&&(0,u.jsx)(a.VideoAdvancedMenu,{styles:s.default,activeMenu:Q,setActiveMenu:$,qualities:A,currentQualityIndex:G.currentQualityIndex,handleQualityChange:G.handleQualityChange,playbackRate:G.playbackRate,setPlaybackRate:G.setPlaybackRate,activeFit:G.activeFit,setActiveFit:G.setActiveFit,playlist:O,currentPlayIndex:G.currentPlayIndex,playPlaylistItem:G.playPlaylistItem,labels:P}),(0,u.jsx)(o.VideoControls,{styles:s.default,playlist:O,advancedControls:T,currentPlayIndex:G.currentPlayIndex,setCurrentPlayIndex:G.setCurrentPlayIndex,skip:G.skip,isPlaying:q,togglePlay:G.togglePlay,currentTime:G.currentTime,duration:G.duration,handleSeek:G.handleSeek,volume:G.volume,isMuted:G.isMuted,toggleMute:G.toggleMute,handleVolumeChange:G.handleVolumeChange,activeMenu:Q,setActiveMenu:$,togglePiP:G.togglePiP,isFullscreen:G.isFullscreen,toggleFullscreen:G.toggleFullscreen,formatTime:G.formatTime,labels:P})]})]}),S&&(0,u.jsx)(`figcaption`,{className:s.default.caption,"data-testid":`video-caption`,children:S})]})};exports.Video=d;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../../i18n/generated/common.cjs"),r=require("../../_internal/composeEventHandlers.cjs"),i=require("../Icon/Icon.cjs"),a=require("../../../hooks/useMediaLoader.cjs"),ee=require("./hooks/useVideoPlayer.cjs"),o=require("./components/VideoAdvancedMenu.cjs"),s=require("./components/VideoControls.cjs"),c=require("./video.module.cjs");let l=require("react");l=e.__toESM(l,1);let u=require("classnames");u=e.__toESM(u,1);let d=require("react/jsx-runtime");var f=({src:e,width:f,height:p,autoPlay:m=!1,loop:h=!1,muted:g=!1,controls:_=!0,poster:te,radius:v=`none`,shadow:ne=!1,border:y=!1,fit:b=`cover`,preload:x,caption:S,className:C,style:w,customControls:T=!1,advancedControls:E=!1,videoId:D,resumePlayback:O=!1,playlist:k,autoPlayNext:A=!1,qualities:j,loading:M=`lazy`,fadeIn:N=!1,demoDelay:P,labels:F={},tracks:I,...L})=>{let{t:R}=t.useWimTranslation(n.commonNs),{videoAriaLabel:z=R(`video.label`),seconds:B=`s`}=F,{containerRef:V,isLoaded:H,isIntersecting:U,notifyLoaded:W,shouldShowSkeleton:G}=a.useMediaLoader({loading:M,src:j?.[0]?.src||k?.[0]?.src||e,demoDelay:P}),K=ee.useVideoPlayer({src:e,autoPlay:m,loop:h,muted:g,fit:b,videoId:D,resumePlayback:O,playlist:k,autoPlayNext:A,qualities:j,customControls:T,advancedControls:E,poster:te,containerRef:V}),{videoRef:q,isPlaying:J,activeSrc:Y,activePoster:X,showNativeControls:re,skipIndicator:Z,activeMenu:Q,setActiveMenu:$}=K;l.default.useEffect(()=>{let e=q.current;e&&(g?e.setAttribute(`muted`,``):e.removeAttribute(`muted`))},[g,q,Y,U]);let ie={width:`100%`,height:p||`auto`,objectFit:K.activeFit,...w},ae=v===`none`?null:c.default[`radius${v.charAt(0).toUpperCase()+v.slice(1)}`];return(0,d.jsxs)(`figure`,{className:(0,u.default)(`wim-video`,c.default.root,C),style:{width:`100%`},"aria-label":z,"data-testid":`video-root`,children:[(0,d.jsxs)(`div`,{className:(0,u.default)(c.default.inner,ae,ne&&c.default.shadow,y&&c.default.border,(T||E)&&c.default.custom,N&&c.default.fadeIn,N&&H&&c.default.isLoaded,G&&c.default.loading),ref:V,"data-testid":`video-inner`,children:[U&&(0,d.jsx)(`video`,{ref:q,src:Y,className:c.default.video,style:ie,autoPlay:m&&H,loop:h&&(!k||k.length<=1),muted:g,controls:re&&_,poster:X,preload:x,playsInline:!0,"data-testid":`video-element`,...L,onTimeUpdate:r.composeEventHandlers(L.onTimeUpdate,K.handleTimeUpdate),onLoadedMetadata:r.composeEventHandlers(L.onLoadedMetadata,K.handleLoadedMetadata),onLoadedData:r.composeEventHandlers(L.onLoadedData,W),onEnded:r.composeEventHandlers(L.onEnded,K.handleEnded),onPlay:r.composeEventHandlers(L.onPlay,()=>{}),onPause:r.composeEventHandlers(L.onPause,()=>{}),onClick:r.composeEventHandlers(L.onClick,K.handleVideoClick),children:I?.map((e,t)=>(0,d.jsx)(`track`,{...e},t))}),Z.show&&(0,d.jsxs)(`div`,{className:c.default.skipIndicator,children:[(0,d.jsx)(i.Icon,{name:Z.direction===`forward`?`ChevronRightIcon`:`ChevronLeftIcon`,size:`lg`}),(0,d.jsx)(i.Icon,{name:Z.direction===`forward`?`ChevronRightIcon`:`ChevronLeftIcon`,size:`lg`}),(0,d.jsx)(i.Icon,{name:Z.direction===`forward`?`ChevronRightIcon`:`ChevronLeftIcon`,size:`lg`}),(0,d.jsxs)(`span`,{children:[`10`,B]})]}),(T||E)&&(0,d.jsxs)(`div`,{role:`none`,className:c.default.customControls,onClick:()=>Q&&$(null),children:[E&&(0,d.jsx)(o.VideoAdvancedMenu,{styles:c.default,activeMenu:Q,setActiveMenu:$,qualities:j,currentQualityIndex:K.currentQualityIndex,handleQualityChange:K.handleQualityChange,playbackRate:K.playbackRate,setPlaybackRate:K.setPlaybackRate,activeFit:K.activeFit,setActiveFit:K.setActiveFit,playlist:k,currentPlayIndex:K.currentPlayIndex,playPlaylistItem:K.playPlaylistItem,labels:F}),(0,d.jsx)(s.VideoControls,{styles:c.default,playlist:k,advancedControls:E,currentPlayIndex:K.currentPlayIndex,setCurrentPlayIndex:K.setCurrentPlayIndex,skip:K.skip,isPlaying:J,togglePlay:K.togglePlay,currentTime:K.currentTime,duration:K.duration,handleSeek:K.handleSeek,volume:K.volume,isMuted:K.isMuted,toggleMute:K.toggleMute,handleVolumeChange:K.handleVolumeChange,activeMenu:Q,setActiveMenu:$,togglePiP:K.togglePiP,isFullscreen:K.isFullscreen,toggleFullscreen:K.toggleFullscreen,formatTime:K.formatTime,labels:F})]})]}),S&&(0,d.jsx)(`figcaption`,{className:c.default.caption,"data-testid":`video-caption`,children:S})]})};exports.Video=f;

package/dist/components/media/Video/Video.js

@@ -1,154 +1,155 @@
 "use client";
 import { useWimTranslation as e } from "../../../i18n/useWimTranslation.js";
 import { commonNs as t } from "../../../i18n/generated/common.js";
-import { Icon as n } from "../Icon/Icon.js";
-import { useMediaLoader as ee } from "../../../hooks/useMediaLoader.js";
-import { useVideoPlayer as r } from "./hooks/useVideoPlayer.js";
-import { VideoAdvancedMenu as i } from "./components/VideoAdvancedMenu.js";
-import { VideoControls as a } from "./components/VideoControls.js";
-import o from "./video.module.js";
-import s from "react";
-import c from "classnames";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
+import { composeEventHandlers as n } from "../../_internal/composeEventHandlers.js";
+import { Icon as r } from "../Icon/Icon.js";
+import { useMediaLoader as i } from "../../../hooks/useMediaLoader.js";
+import { useVideoPlayer as a } from "./hooks/useVideoPlayer.js";
+import { VideoAdvancedMenu as o } from "./components/VideoAdvancedMenu.js";
+import { VideoControls as s } from "./components/VideoControls.js";
+import c from "./video.module.js";
+import l from "react";
+import u from "classnames";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
 //#region src/components/media/Video/Video.tsx
-var d = ({ src: d, width: te, height: f, autoPlay: p = !1, loop: m = !1, muted: h = !1, controls: ne = !0, poster: re, radius: g = "none", shadow: _ = !1, border: v = !1, fit: y = "cover", preload: b, caption: x, className: S, style: C, customControls: w = !1, advancedControls: T = !1, videoId: E, resumePlayback: D = !1, playlist: O, autoPlayNext: k = !1, qualities: A, loading: j = "lazy", fadeIn: M = !1, demoDelay: N, labels: P = {}, tracks: F, ...I }) => {
-	let { t: L } = e(t), { videoAriaLabel: R = L("video.label"), seconds: z = "s" } = P, { containerRef: B, isLoaded: V, isIntersecting: H, notifyLoaded: U, shouldShowSkeleton: W } = ee({
-		loading: j,
-		src: A?.[0]?.src || O?.[0]?.src || d,
-		demoDelay: N
-	}), G = r({
-		src: d,
-		autoPlay: p,
-		loop: m,
-		muted: h,
-		fit: y,
-		videoId: E,
-		resumePlayback: D,
-		playlist: O,
-		autoPlayNext: k,
-		qualities: A,
-		customControls: w,
-		advancedControls: T,
-		poster: re,
-		containerRef: B
-	}), { videoRef: K, isPlaying: q, activeSrc: J, activePoster: Y, showNativeControls: X, skipIndicator: Z, activeMenu: Q, setActiveMenu: $ } = G;
-	s.useEffect(() => {
-		let e = K.current;
-		e && (h ? e.setAttribute("muted", "") : e.removeAttribute("muted"));
+var p = ({ src: p, width: ee, height: te, autoPlay: m = !1, loop: h = !1, muted: g = !1, controls: _ = !0, poster: v, radius: y = "none", shadow: b = !1, border: x = !1, fit: S = "cover", preload: C, caption: w, className: T, style: ne, customControls: E = !1, advancedControls: D = !1, videoId: O, resumePlayback: k = !1, playlist: A, autoPlayNext: j = !1, qualities: M, loading: N = "lazy", fadeIn: P = !1, demoDelay: F, labels: I = {}, tracks: L, ...R }) => {
+	let { t: z } = e(t), { videoAriaLabel: B = z("video.label"), seconds: V = "s" } = I, { containerRef: H, isLoaded: U, isIntersecting: W, notifyLoaded: G, shouldShowSkeleton: K } = i({
+		loading: N,
+		src: M?.[0]?.src || A?.[0]?.src || p,
+		demoDelay: F
+	}), q = a({
+		src: p,
+		autoPlay: m,
+		loop: h,
+		muted: g,
+		fit: S,
+		videoId: O,
+		resumePlayback: k,
+		playlist: A,
+		autoPlayNext: j,
+		qualities: M,
+		customControls: E,
+		advancedControls: D,
+		poster: v,
+		containerRef: H
+	}), { videoRef: J, isPlaying: Y, activeSrc: X, activePoster: re, showNativeControls: ie, skipIndicator: Z, activeMenu: Q, setActiveMenu: $ } = q;
+	l.useEffect(() => {
+		let e = J.current;
+		e && (g ? e.setAttribute("muted", "") : e.removeAttribute("muted"));
 	}, [
-		h,
-		K,
+		g,
 		J,
-		H
+		X,
+		W
 	]);
-	let ie = {
+	let ae = {
 		width: "100%",
-		height: f || "auto",
-		objectFit: G.activeFit,
-		...C
-	}, ae = g === "none" ? null : o[`radius${g.charAt(0).toUpperCase() + g.slice(1)}`];
-	return /* @__PURE__ */ u("figure", {
-		className: c("wim-video", o.root, S),
+		height: te || "auto",
+		objectFit: q.activeFit,
+		...ne
+	}, oe = y === "none" ? null : c[`radius${y.charAt(0).toUpperCase() + y.slice(1)}`];
+	return /* @__PURE__ */ f("figure", {
+		className: u("wim-video", c.root, T),
 		style: { width: "100%" },
-		"aria-label": R,
+		"aria-label": B,
 		"data-testid": "video-root",
-		children: [/* @__PURE__ */ u("div", {
-			className: c(o.inner, ae, _ && o.shadow, v && o.border, (w || T) && o.custom, M && o.fadeIn, M && V && o.isLoaded, W && o.loading),
-			ref: B,
+		children: [/* @__PURE__ */ f("div", {
+			className: u(c.inner, oe, b && c.shadow, x && c.border, (E || D) && c.custom, P && c.fadeIn, P && U && c.isLoaded, K && c.loading),
+			ref: H,
 			"data-testid": "video-inner",
 			children: [
-				H && /* @__PURE__ */ l("video", {
-					ref: K,
-					src: J,
-					className: o.video,
-					style: ie,
-					autoPlay: p && V,
-					loop: m && (!O || O.length <= 1),
-					muted: h,
-					controls: X && ne,
-					poster: Y,
-					preload: b,
+				W && /* @__PURE__ */ d("video", {
+					ref: J,
+					src: X,
+					className: c.video,
+					style: ae,
+					autoPlay: m && U,
+					loop: h && (!A || A.length <= 1),
+					muted: g,
+					controls: ie && _,
+					poster: re,
+					preload: C,
 					playsInline: !0,
-					onTimeUpdate: G.handleTimeUpdate,
-					onLoadedMetadata: G.handleLoadedMetadata,
-					onLoadedData: U,
-					onEnded: G.handleEnded,
-					onPlay: () => {},
-					onPause: () => {},
-					onClick: G.handleVideoClick,
 					"data-testid": "video-element",
-					...I,
-					children: F?.map((e, t) => /* @__PURE__ */ l("track", { ...e }, t))
+					...R,
+					onTimeUpdate: n(R.onTimeUpdate, q.handleTimeUpdate),
+					onLoadedMetadata: n(R.onLoadedMetadata, q.handleLoadedMetadata),
+					onLoadedData: n(R.onLoadedData, G),
+					onEnded: n(R.onEnded, q.handleEnded),
+					onPlay: n(R.onPlay, () => {}),
+					onPause: n(R.onPause, () => {}),
+					onClick: n(R.onClick, q.handleVideoClick),
+					children: L?.map((e, t) => /* @__PURE__ */ d("track", { ...e }, t))
 				}),
-				Z.show && /* @__PURE__ */ u("div", {
-					className: o.skipIndicator,
+				Z.show && /* @__PURE__ */ f("div", {
+					className: c.skipIndicator,
 					children: [
-						/* @__PURE__ */ l(n, {
+						/* @__PURE__ */ d(r, {
 							name: Z.direction === "forward" ? "ChevronRightIcon" : "ChevronLeftIcon",
 							size: "lg"
 						}),
-						/* @__PURE__ */ l(n, {
+						/* @__PURE__ */ d(r, {
 							name: Z.direction === "forward" ? "ChevronRightIcon" : "ChevronLeftIcon",
 							size: "lg"
 						}),
-						/* @__PURE__ */ l(n, {
+						/* @__PURE__ */ d(r, {
 							name: Z.direction === "forward" ? "ChevronRightIcon" : "ChevronLeftIcon",
 							size: "lg"
 						}),
-						/* @__PURE__ */ u("span", { children: ["10", z] })
+						/* @__PURE__ */ f("span", { children: ["10", V] })
 					]
 				}),
-				(w || T) && /* @__PURE__ */ u("div", {
+				(E || D) && /* @__PURE__ */ f("div", {
 					role: "none",
-					className: o.customControls,
+					className: c.customControls,
 					onClick: () => Q && $(null),
-					children: [T && /* @__PURE__ */ l(i, {
-						styles: o,
+					children: [D && /* @__PURE__ */ d(o, {
+						styles: c,
 						activeMenu: Q,
 						setActiveMenu: $,
-						qualities: A,
-						currentQualityIndex: G.currentQualityIndex,
-						handleQualityChange: G.handleQualityChange,
-						playbackRate: G.playbackRate,
-						setPlaybackRate: G.setPlaybackRate,
-						activeFit: G.activeFit,
-						setActiveFit: G.setActiveFit,
-						playlist: O,
-						currentPlayIndex: G.currentPlayIndex,
-						playPlaylistItem: G.playPlaylistItem,
-						labels: P
-					}), /* @__PURE__ */ l(a, {
-						styles: o,
-						playlist: O,
-						advancedControls: T,
-						currentPlayIndex: G.currentPlayIndex,
-						setCurrentPlayIndex: G.setCurrentPlayIndex,
-						skip: G.skip,
-						isPlaying: q,
-						togglePlay: G.togglePlay,
-						currentTime: G.currentTime,
-						duration: G.duration,
-						handleSeek: G.handleSeek,
-						volume: G.volume,
-						isMuted: G.isMuted,
-						toggleMute: G.toggleMute,
-						handleVolumeChange: G.handleVolumeChange,
+						qualities: M,
+						currentQualityIndex: q.currentQualityIndex,
+						handleQualityChange: q.handleQualityChange,
+						playbackRate: q.playbackRate,
+						setPlaybackRate: q.setPlaybackRate,
+						activeFit: q.activeFit,
+						setActiveFit: q.setActiveFit,
+						playlist: A,
+						currentPlayIndex: q.currentPlayIndex,
+						playPlaylistItem: q.playPlaylistItem,
+						labels: I
+					}), /* @__PURE__ */ d(s, {
+						styles: c,
+						playlist: A,
+						advancedControls: D,
+						currentPlayIndex: q.currentPlayIndex,
+						setCurrentPlayIndex: q.setCurrentPlayIndex,
+						skip: q.skip,
+						isPlaying: Y,
+						togglePlay: q.togglePlay,
+						currentTime: q.currentTime,
+						duration: q.duration,
+						handleSeek: q.handleSeek,
+						volume: q.volume,
+						isMuted: q.isMuted,
+						toggleMute: q.toggleMute,
+						handleVolumeChange: q.handleVolumeChange,
 						activeMenu: Q,
 						setActiveMenu: $,
-						togglePiP: G.togglePiP,
-						isFullscreen: G.isFullscreen,
-						toggleFullscreen: G.toggleFullscreen,
-						formatTime: G.formatTime,
-						labels: P
+						togglePiP: q.togglePiP,
+						isFullscreen: q.isFullscreen,
+						toggleFullscreen: q.toggleFullscreen,
+						formatTime: q.formatTime,
+						labels: I
 					})]
 				})
 			]
-		}), x && /* @__PURE__ */ l("figcaption", {
-			className: o.caption,
+		}), w && /* @__PURE__ */ d("figcaption", {
+			className: c.caption,
 			"data-testid": "video-caption",
-			children: x
+			children: w
 		})]
 	});
 };
 //#endregion
-export { d as Video };
+export { p as Video };

package/dist/components/navigation/Anchor/Anchor.cjs

@@ -1,2 +1,2 @@
 "use client";
-const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("./anchor.module.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("classnames");r=e.__toESM(r,1);let i=require("react/jsx-runtime");var a=({items:e=[],bounds:a=5,offset:o=0,direction:s=`vertical`,className:c,style:l,"aria-label":u,"aria-labelledby":d})=>{let[f,p]=(0,n.useState)(``),[m,h]=(0,n.useState)({}),g=(0,n.useRef)(null),_=(e,t)=>{e.preventDefault();let n=t.replace(`#`,``),r=document.getElementById(n);r&&(window.scrollTo({top:r.offsetTop-o,behavior:`smooth`}),p(t))};(0,n.useLayoutEffect)(()=>{let t=()=>{let t=(e,n)=>{let r=[];return e.forEach(e=>{r.push({href:e.href,parentHref:n}),e.children&&(r=r.concat(t(e.children,n||e.href)))}),r},n=t(e),r=``,i=window.scrollY||document.documentElement.scrollTop,c=document.documentElement.scrollHeight,l=document.documentElement.clientHeight;if(i>0&&Math.ceil(i+l)>=c&&n.length>0){let e=n[n.length-1];r=s===`horizontal`&&e.parentHref?e.parentHref:e.href}else for(let e of n){let t=e.href.replace(`#`,``),n=document.getElementById(t);if(n){if(n.getBoundingClientRect().top<=o+a)r=s===`horizontal`&&e.parentHref?e.parentHref:e.href;else break}}r&&r!==f&&p(r)};return window.addEventListener(`scroll`,t),t(),()=>window.removeEventListener(`scroll`,t)},[e,o,a,f,s]);let v=(0,n.useCallback)(()=>{if(!f||!g.current)return;let e=g.current.querySelector(`a[href="${f}"]`);if(e){let n=g.current.getBoundingClientRect();if(s===`vertical`){let t=e.getBoundingClientRect();h({top:t.top-n.top,height:t.height,opacity:1})}else{let r=g.current.querySelector(`.${t.default.list}`);if(r){let t=e.getBoundingClientRect(),i=r.getBoundingClientRect(),a=t.left-i.left+r.scrollLeft,o=a-i.width/2+t.width/2,s=r.scrollWidth-i.width,c=Math.max(0,Math.min(o,s)),l=a-c+(i.left-n.left);h({left:l,width:t.width,opacity:1}),r.scrollTo({left:c,behavior:`smooth`})}else{let t=e.getBoundingClientRect();h({left:t.left-g.current.getBoundingClientRect().left,width:t.width,opacity:1})}}}else h({opacity:0})},[f,s]);(0,n.useLayoutEffect)(()=>{v()},[v]),(0,n.useEffect)(()=>{let e=g.current;if(!e||typeof ResizeObserver>`u`)return;let t=new ResizeObserver(()=>v());return t.observe(e),e.querySelectorAll(`a`).forEach(e=>t.observe(e)),()=>t.disconnect()},[v,e]);let y=e=>(0,i.jsx)(`ul`,{className:(0,r.default)(t.default.list,t.default[s]),children:e.map(e=>(0,i.jsxs)(`li`,{className:(0,r.default)(t.default.item,f===e.href&&t.default.active),children:[(0,i.jsx)(`a`,{href:e.href,className:t.default.link,"aria-current":f===e.href?`location`:void 0,onClick:t=>_(t,e.href),title:typeof e.title==`string`?e.title:void 0,children:e.title}),e.children&&s===`vertical`&&y(e.children)]},e.key))});return(0,i.jsxs)(`div`,{className:(0,r.default)(`wim-anchor`,t.default.root,t.default[s],c),style:l,ref:g,role:u||d?`navigation`:void 0,"aria-label":d?void 0:u,"aria-labelledby":d,children:[(0,i.jsx)(`div`,{className:t.default.ink,children:(0,i.jsx)(`span`,{className:t.default.inkBall,style:m})}),y(e)]})};exports.Anchor=a,exports.default=a;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../_internal/observeMove.cjs"),n=require("./anchor.module.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("classnames");i=e.__toESM(i,1);let a=require("react/jsx-runtime");var o=({items:e=[],bounds:o=5,offset:s=0,direction:c=`vertical`,className:l,style:u,"aria-label":d,"aria-labelledby":f})=>{let[p,m]=(0,r.useState)(``),[h,g]=(0,r.useState)({}),_=(0,r.useRef)(null),v=(e,t)=>{e.preventDefault();let n=t.replace(`#`,``),r=document.getElementById(n);r&&(window.scrollTo({top:r.offsetTop-s,behavior:`smooth`}),m(t))};(0,r.useLayoutEffect)(()=>{let n=()=>{let t=(e,n)=>{let r=[];return e.forEach(e=>{r.push({href:e.href,parentHref:n}),e.children&&(r=r.concat(t(e.children,n||e.href)))}),r},n=t(e),r=``,i=window.scrollY||document.documentElement.scrollTop,a=document.documentElement.scrollHeight,l=document.documentElement.clientHeight;if(i>0&&Math.ceil(i+l)>=a&&n.length>0){let e=n[n.length-1];r=c===`horizontal`&&e.parentHref?e.parentHref:e.href}else for(let e of n){let t=e.href.replace(`#`,``),n=document.getElementById(t);if(n){if(n.getBoundingClientRect().top<=s+o)r=c===`horizontal`&&e.parentHref?e.parentHref:e.href;else break}}r&&r!==p&&m(r)};window.addEventListener(`scroll`,n),window.addEventListener(`resize`,n);let r=e=>e.flatMap(e=>[e.href,...e.children?r(e.children):[]]),i=r(e).map(e=>document.getElementById(e.replace(`#`,``))).filter(e=>e!==null).map(e=>t.observeMove(e,n));return n(),()=>{window.removeEventListener(`scroll`,n),window.removeEventListener(`resize`,n),i.forEach(e=>e())}},[e,s,o,p,c]);let y=(0,r.useCallback)(()=>{if(!p||!_.current)return;let e=_.current.querySelector(`a[href="${p}"]`);if(e){let t=_.current.getBoundingClientRect();if(c===`vertical`){let n=e.getBoundingClientRect();g({top:n.top-t.top,height:n.height,opacity:1})}else{let r=_.current.querySelector(`.${n.default.list}`);if(r){let n=e.getBoundingClientRect(),i=r.getBoundingClientRect(),a=n.left-i.left+r.scrollLeft,o=a-i.width/2+n.width/2,s=r.scrollWidth-i.width,c=Math.max(0,Math.min(o,s)),l=a-c+(i.left-t.left);g({left:l,width:n.width,opacity:1}),r.scrollTo({left:c,behavior:`smooth`})}else{let t=e.getBoundingClientRect();g({left:t.left-_.current.getBoundingClientRect().left,width:t.width,opacity:1})}}}else g({opacity:0})},[p,c]);(0,r.useLayoutEffect)(()=>{y()},[y]),(0,r.useEffect)(()=>{let e=_.current;if(!e||typeof ResizeObserver>`u`)return;let t=new ResizeObserver(()=>y());return t.observe(e),e.querySelectorAll(`a`).forEach(e=>t.observe(e)),()=>t.disconnect()},[y,e]);let b=e=>(0,a.jsx)(`ul`,{className:(0,i.default)(n.default.list,n.default[c]),children:e.map(e=>(0,a.jsxs)(`li`,{className:(0,i.default)(n.default.item,p===e.href&&n.default.active),children:[(0,a.jsx)(`a`,{href:e.href,className:n.default.link,"aria-current":p===e.href?`location`:void 0,onClick:t=>v(t,e.href),title:typeof e.title==`string`?e.title:void 0,children:e.title}),e.children&&c===`vertical`&&b(e.children)]},e.key))});return(0,a.jsxs)(`div`,{className:(0,i.default)(`wim-anchor`,n.default.root,n.default[c],l),style:u,ref:_,role:d||f?`navigation`:void 0,"aria-label":f?void 0:d,"aria-labelledby":f,children:[(0,a.jsx)(`div`,{className:n.default.ink,children:(0,a.jsx)(`span`,{className:n.default.inkBall,style:h})}),b(e)]})};exports.Anchor=o,exports.default=o;