@ioca/react 1.4.76 → 1.4.77

package/lib/es/components/video/video.js

@@ -1,173 +1,235 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { PlayArrowRound, PauseRound, StopRound, VolumeDownRound, VolumeOffRound, FullscreenRound, FullscreenExitRound } from '@ricons/material';
-import classNames from 'classnames';
-import { throttle } from 'radash';
-import { useRef, useImperativeHandle, useEffect } from 'react';
-import { useReactive } from '../../js/hooks.js';
-import { exitFullScreen, fullScreen } from '../../js/utils.js';
-import Button from '../button/button.js';
-import Icon from '../icon/icon.js';
-import Progress from '../progress/progress.js';
-import Text from '../text/text.js';
-
+import { useReactive } from "../../js/hooks.js";
+import button_default from "../button/index.js";
+import icon_default from "../icon/index.js";
+import { exitFullScreen, fullScreen } from "../../js/utils.js";
+import text_default from "../text/index.js";
+import progress_default from "../progress/index.js";
+import classNames from "classnames";
+import { throttle } from "/Users/iann/codes/ioca-react/node_modules/.pnpm/radash@12.1.1/node_modules/radash/dist/esm/index.mjs";
+import { useEffect, useImperativeHandle, useRef } from "react";
+import { FullscreenExitRound, FullscreenRound, PauseRound, PlayArrowRound, StopRound, VolumeDownRound, VolumeOffRound } from "/Users/iann/codes/ioca-react/node_modules/.pnpm/@ricons+material@0.12.0/node_modules/@ricons/material/es/index.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region packages/components/video/video.tsx
 const Video = (props) => {
-    const { ref, style, hideControls, autoplay, muted, volume = 50, height, width, useOriginControls, timeProgressProps = {
-        barClass: "bg-blue",
-    }, volumeProgressProps = {
-        barClass: "bg-blue",
-    }, className, onFullScreenChange, ...restProps } = props;
-    const state = useReactive({
-        playing: autoplay,
-        volume: muted ? 0 : volume,
-        volumeCache: 0,
-        muted,
-        current: 0,
-        duration: 0,
-        isFullscreen: false,
-        controlHidden: true,
-        draggingProgress: false,
-    });
-    const videoRef = useRef(null);
-    const hiddenTO = useRef(null);
-    const timeUpdateListener = (e) => {
-        const tar = e.target;
-        if (tar.paused || state.draggingProgress)
-            return;
-        Object.assign(state, {
-            current: tar.currentTime,
-        });
-    };
-    const playChangeListener = (e) => {
-        state.playing = !e.target.paused;
-    };
-    const fsChangeListener = () => {
-        if (typeof document === "undefined")
-            return;
-        const tar = videoRef.current?.parentElement;
-        if (!tar)
-            return;
-        state.isFullscreen = document.fullscreenElement === tar;
-    };
-    const volumeChangeListener = (e) => {
-        const tar = e.target;
-        Object.assign(state, {
-            volume: tar.volume * 100,
-            muted: tar.volume === 0,
-        });
-    };
-    const handlePlay = () => {
-        const v = videoRef.current;
-        if (!v)
-            return;
-        v.paused ? v.play() : v.pause();
-    };
-    const handleReady = (e) => {
-        const tar = e.target;
-        Object.assign(state, {
-            duration: tar.duration,
-            current: tar.currentTime,
-        });
-        tar.volume = state.volume / 100;
-    };
-    const handleMuted = () => {
-        const v = videoRef.current;
-        if (!v)
-            return;
-        if (v.volume > 0) {
-            state.volumeCache = v.volume;
-            v.volume = 0;
-            return;
-        }
-        v.volume = state.volumeCache === 0 ? 0.5 : state.volumeCache;
-    };
-    const handleStop = () => {
-        const v = videoRef.current;
-        if (!v)
-            return;
-        v.currentTime = 0;
-        v.pause();
-    };
-    const handleFullscreen = () => {
-        const tar = videoRef.current?.parentElement;
-        if (!tar)
-            return;
-        state.isFullscreen ? exitFullScreen() : fullScreen(tar);
-        onFullScreenChange?.(!state.isFullscreen);
-    };
-    const handleUpdateTime = (t) => {
-        const v = videoRef.current;
-        if (!v)
-            return;
-        v.currentTime = (state.duration * t) / 100;
-    };
-    const handleUpdateVolume = (t) => {
-        const v = videoRef.current;
-        if (!v)
-            return;
-        v.volume = t / 100;
-    };
-    const showControls = !hideControls && !useOriginControls;
-    const clearHiddenTO = () => {
-        if (!hiddenTO.current)
-            return;
-        clearTimeout(hiddenTO.current);
-        hiddenTO.current = null;
-    };
-    const setHiddenFalse = () => {
-        if (!showControls || !state.controlHidden)
-            return;
-        state.controlHidden = false;
-        clearHiddenTO();
-        hiddenTO.current = setTimeout(() => {
-            state.controlHidden = true;
-        }, 1000);
-    };
-    const handleDraggingProgress = (dragging) => {
-        state.draggingProgress = dragging;
-    };
-    const handleMouseMove = throttle({ interval: 900 }, setHiddenFalse);
-    useImperativeHandle(ref, () => ({
-        play: () => {
-            const v = videoRef.current;
-            if (!v)
-                return;
-            v.play();
-        },
-        pause: () => {
-            const v = videoRef.current;
-            if (!v)
-                return;
-            v.pause();
-        },
-        stop: handleStop,
-        fullscreen: handleFullscreen,
-        getVideo: () => videoRef.current,
-    }));
-    useEffect(() => {
-        if (typeof document === "undefined")
-            return;
-        const v = videoRef.current;
-        if (!v)
-            return;
-        v.addEventListener("timeupdate", timeUpdateListener);
-        v.addEventListener("play", playChangeListener);
-        v.addEventListener("pause", playChangeListener);
-        v.addEventListener("volumechange", volumeChangeListener);
-        document.addEventListener("fullscreenchange", fsChangeListener);
-        return () => {
-            clearHiddenTO();
-            v.removeEventListener("timeupdate", timeUpdateListener);
-            v.removeEventListener("play", playChangeListener);
-            v.removeEventListener("pause", playChangeListener);
-            v.removeEventListener("volumechange", volumeChangeListener);
-            document.removeEventListener("fullscreenchange", fsChangeListener);
-        };
-    }, []);
-    const currentValue = (state.current / state.duration) * 100;
-    return (jsxs("div", { className: classNames("i-video", className), style: { height, width, ...style }, onClick: handlePlay, onDoubleClick: () => handleFullscreen(), onMouseMove: handleMouseMove, children: [jsx("video", { ref: videoRef, onCanPlay: handleReady, ...restProps, controls: useOriginControls }), showControls && (jsxs("div", { className: classNames("i-video-controls", {
-                    "i-video-controls-hidden": state.controlHidden,
-                }), onClick: (e) => e.stopPropagation(), children: [jsx(Button.Toggle, { className: 'i-video-btn', flat: true, square: true, after: jsx(Icon, { icon: jsx(PauseRound, {}) }), active: state.playing, onClick: handlePlay, children: jsx(Icon, { icon: jsx(PlayArrowRound, {}) }) }), jsx(Button, { className: 'i-video-btn', flat: true, square: true, onClick: handleStop, children: jsx(Icon, { icon: jsx(StopRound, {}) }) }), jsxs("span", { className: 'i-video-times font-sm', children: [jsx(Text.Time, { seconds: state.current }), " /", jsx(Text.Time, { seconds: state.duration })] }), jsx(Progress, { ...timeProgressProps, value: currentValue, onChange: handleUpdateTime, onDraggingChange: handleDraggingProgress }), jsxs("div", { className: 'i-video-control-volume', children: [jsx(Button.Toggle, { className: 'i-video-btn', flat: true, square: true, active: state.volume <= 0, after: jsx(Icon, { icon: jsx(VolumeOffRound, {}), style: { padding: ".125em" } }), onClick: handleMuted, children: jsx(Icon, { icon: jsx(VolumeDownRound, {}) }) }), jsx("div", { className: 'i-video-volume', children: jsx(Progress, { style: { height: 100 }, vertical: true, ...volumeProgressProps, value: state.volume, onChange: handleUpdateVolume }) })] }), jsx(Button.Toggle, { className: 'i-video-btn', flat: true, square: true, after: jsx(Icon, { icon: jsx(FullscreenExitRound, {}) }), active: state.isFullscreen, onClick: () => handleFullscreen(), children: jsx(Icon, { icon: jsx(FullscreenRound, {}) }) })] }))] }));
+	const { ref, style, hideControls, autoplay, muted, volume = 50, height, width, useOriginControls, timeProgressProps = { barClass: "bg-blue" }, volumeProgressProps = { barClass: "bg-blue" }, className, onFullScreenChange, ...restProps } = props;
+	const state = useReactive({
+		playing: autoplay,
+		volume: muted ? 0 : volume,
+		volumeCache: 0,
+		muted,
+		current: 0,
+		duration: 0,
+		isFullscreen: false,
+		controlHidden: true,
+		draggingProgress: false
+	});
+	const videoRef = useRef(null);
+	const hiddenTO = useRef(null);
+	const timeUpdateListener = (e) => {
+		const tar = e.target;
+		if (tar.paused || state.draggingProgress) return;
+		Object.assign(state, { current: tar.currentTime });
+	};
+	const playChangeListener = (e) => {
+		state.playing = !e.target.paused;
+	};
+	const fsChangeListener = () => {
+		if (typeof document === "undefined") return;
+		const tar = videoRef.current?.parentElement;
+		if (!tar) return;
+		state.isFullscreen = document.fullscreenElement === tar;
+	};
+	const volumeChangeListener = (e) => {
+		const tar = e.target;
+		Object.assign(state, {
+			volume: tar.volume * 100,
+			muted: tar.volume === 0
+		});
+	};
+	const handlePlay = () => {
+		const v = videoRef.current;
+		if (!v) return;
+		v.paused ? v.play() : v.pause();
+	};
+	const handleReady = (e) => {
+		const tar = e.target;
+		Object.assign(state, {
+			duration: tar.duration,
+			current: tar.currentTime
+		});
+		tar.volume = state.volume / 100;
+	};
+	const handleMuted = () => {
+		const v = videoRef.current;
+		if (!v) return;
+		if (v.volume > 0) {
+			state.volumeCache = v.volume;
+			v.volume = 0;
+			return;
+		}
+		v.volume = state.volumeCache === 0 ? .5 : state.volumeCache;
+	};
+	const handleStop = () => {
+		const v = videoRef.current;
+		if (!v) return;
+		v.currentTime = 0;
+		v.pause();
+	};
+	const handleFullscreen = () => {
+		const tar = videoRef.current?.parentElement;
+		if (!tar) return;
+		state.isFullscreen ? exitFullScreen() : fullScreen(tar);
+		onFullScreenChange?.(!state.isFullscreen);
+	};
+	const handleUpdateTime = (t) => {
+		const v = videoRef.current;
+		if (!v) return;
+		v.currentTime = state.duration * t / 100;
+	};
+	const handleUpdateVolume = (t) => {
+		const v = videoRef.current;
+		if (!v) return;
+		v.volume = t / 100;
+	};
+	const showControls = !hideControls && !useOriginControls;
+	const clearHiddenTO = () => {
+		if (!hiddenTO.current) return;
+		clearTimeout(hiddenTO.current);
+		hiddenTO.current = null;
+	};
+	const setHiddenFalse = () => {
+		if (!showControls || !state.controlHidden) return;
+		state.controlHidden = false;
+		clearHiddenTO();
+		hiddenTO.current = setTimeout(() => {
+			state.controlHidden = true;
+		}, 1e3);
+	};
+	const handleDraggingProgress = (dragging) => {
+		state.draggingProgress = dragging;
+	};
+	const handleMouseMove = throttle({ interval: 900 }, setHiddenFalse);
+	useImperativeHandle(ref, () => ({
+		play: () => {
+			const v = videoRef.current;
+			if (!v) return;
+			v.play();
+		},
+		pause: () => {
+			const v = videoRef.current;
+			if (!v) return;
+			v.pause();
+		},
+		stop: handleStop,
+		fullscreen: handleFullscreen,
+		getVideo: () => videoRef.current
+	}));
+	useEffect(() => {
+		if (typeof document === "undefined") return;
+		const v = videoRef.current;
+		if (!v) return;
+		v.addEventListener("timeupdate", timeUpdateListener);
+		v.addEventListener("play", playChangeListener);
+		v.addEventListener("pause", playChangeListener);
+		v.addEventListener("volumechange", volumeChangeListener);
+		document.addEventListener("fullscreenchange", fsChangeListener);
+		return () => {
+			clearHiddenTO();
+			v.removeEventListener("timeupdate", timeUpdateListener);
+			v.removeEventListener("play", playChangeListener);
+			v.removeEventListener("pause", playChangeListener);
+			v.removeEventListener("volumechange", volumeChangeListener);
+			document.removeEventListener("fullscreenchange", fsChangeListener);
+		};
+	}, []);
+	const currentValue = state.current / state.duration * 100;
+	return /* @__PURE__ */ jsxs("div", {
+		className: classNames("i-video", className),
+		style: {
+			height,
+			width,
+			...style
+		},
+		onClick: handlePlay,
+		onDoubleClick: () => handleFullscreen(),
+		onMouseMove: handleMouseMove,
+		children: [/* @__PURE__ */ jsx("video", {
+			ref: videoRef,
+			onCanPlay: handleReady,
+			...restProps,
+			controls: useOriginControls
+		}), showControls && /* @__PURE__ */ jsxs("div", {
+			className: classNames("i-video-controls", { "i-video-controls-hidden": state.controlHidden }),
+			onClick: (e) => e.stopPropagation(),
+			children: [
+				/* @__PURE__ */ jsx(button_default.Toggle, {
+					className: "i-video-btn",
+					flat: true,
+					square: true,
+					after: /* @__PURE__ */ jsx(icon_default, { icon: /* @__PURE__ */ jsx(PauseRound, {}) }),
+					active: state.playing,
+					onClick: handlePlay,
+					children: /* @__PURE__ */ jsx(icon_default, { icon: /* @__PURE__ */ jsx(PlayArrowRound, {}) })
+				}),
+				/* @__PURE__ */ jsx(button_default, {
+					className: "i-video-btn",
+					flat: true,
+					square: true,
+					onClick: handleStop,
+					children: /* @__PURE__ */ jsx(icon_default, { icon: /* @__PURE__ */ jsx(StopRound, {}) })
+				}),
+				/* @__PURE__ */ jsxs("span", {
+					className: "i-video-times font-sm",
+					children: [
+						/* @__PURE__ */ jsx(text_default.Time, { seconds: state.current }),
+						" /",
+						/* @__PURE__ */ jsx(text_default.Time, { seconds: state.duration })
+					]
+				}),
+				/* @__PURE__ */ jsx(progress_default, {
+					...timeProgressProps,
+					value: currentValue,
+					onChange: handleUpdateTime,
+					onDraggingChange: handleDraggingProgress
+				}),
+				/* @__PURE__ */ jsxs("div", {
+					className: "i-video-control-volume",
+					children: [/* @__PURE__ */ jsx(button_default.Toggle, {
+						className: "i-video-btn",
+						flat: true,
+						square: true,
+						active: state.volume <= 0,
+						after: /* @__PURE__ */ jsx(icon_default, {
+							icon: /* @__PURE__ */ jsx(VolumeOffRound, {}),
+							style: { padding: ".125em" }
+						}),
+						onClick: handleMuted,
+						children: /* @__PURE__ */ jsx(icon_default, { icon: /* @__PURE__ */ jsx(VolumeDownRound, {}) })
+					}), /* @__PURE__ */ jsx("div", {
+						className: "i-video-volume",
+						children: /* @__PURE__ */ jsx(progress_default, {
+							style: { height: 100 },
+							vertical: true,
+							...volumeProgressProps,
+							value: state.volume,
+							onChange: handleUpdateVolume
+						})
+					})]
+				}),
+				/* @__PURE__ */ jsx(button_default.Toggle, {
+					className: "i-video-btn",
+					flat: true,
+					square: true,
+					after: /* @__PURE__ */ jsx(icon_default, { icon: /* @__PURE__ */ jsx(FullscreenExitRound, {}) }),
+					active: state.isFullscreen,
+					onClick: () => handleFullscreen(),
+					children: /* @__PURE__ */ jsx(icon_default, { icon: /* @__PURE__ */ jsx(FullscreenRound, {}) })
+				})
+			]
+		})]
+	});
 };
-
+//#endregion
 export { Video as default };
-//# sourceMappingURL=video.js.map
+
+//# sourceMappingURL=video.js.map

package/lib/es/components/video/video.js.map

@@ -1 +1 @@
-{"version":3,"file":"video.js","sources":["../../../../packages/components/video/video.tsx"],"sourcesContent":["import {\n\tFullscreenExitRound,\n\tFullscreenRound,\n\tPauseRound,\n\tPlayArrowRound,\n\tStopRound,\n\tVolumeDownRound,\n\tVolumeOffRound,\n} from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { throttle } from \"radash\";\nimport { useEffect, useImperativeHandle, useRef } from \"react\";\nimport { useReactive } from \"../../js/hooks\";\nimport { exitFullScreen, fullScreen } from \"../../js/utils\";\nimport Button from \"../button\";\nimport Icon from \"../icon\";\nimport Progress from \"../progress\";\nimport Text from \"../text\";\nimport \"./index.css\";\nimport { IVideo } from \"./type\";\n\nconst Video = (props: IVideo) => {\n\tconst {\n\t\tref,\n\t\tstyle,\n\t\thideControls,\n\t\tautoplay,\n\t\tmuted,\n\t\tvolume = 50,\n\t\theight,\n\t\twidth,\n\t\tuseOriginControls,\n\t\ttimeProgressProps = {\n\t\t\tbarClass: \"bg-blue\",\n\t\t},\n\t\tvolumeProgressProps = {\n\t\t\tbarClass: \"bg-blue\",\n\t\t},\n\t\tclassName,\n\t\tonFullScreenChange,\n\t\t...restProps\n\t} = props;\n\tconst state = useReactive({\n\t\tplaying: autoplay,\n\t\tvolume: muted ? 0 : volume,\n\t\tvolumeCache: 0,\n\t\tmuted,\n\t\tcurrent: 0,\n\t\tduration: 0,\n\t\tisFullscreen: false,\n\t\tcontrolHidden: true,\n\t\tdraggingProgress: false,\n\t});\n\tconst videoRef = useRef<HTMLVideoElement>(null);\n\tconst hiddenTO = useRef<any>(null);\n\n\tconst timeUpdateListener = (e) => {\n\t\tconst tar = e.target;\n\t\tif (tar.paused || state.draggingProgress) return;\n\n\t\tObject.assign(state, {\n\t\t\tcurrent: tar.currentTime,\n\t\t});\n\t};\n\n\tconst playChangeListener = (e) => {\n\t\tstate.playing = !e.target.paused;\n\t};\n\n\tconst fsChangeListener = () => {\n\t\tif (typeof document === \"undefined\") return;\n\t\tconst tar = videoRef.current?.parentElement;\n\t\tif (!tar) return;\n\n\t\tstate.isFullscreen = document.fullscreenElement === tar;\n\t};\n\n\tconst volumeChangeListener = (e) => {\n\t\tconst tar = e.target;\n\t\tObject.assign(state, {\n\t\t\tvolume: tar.volume * 100,\n\t\t\tmuted: tar.volume === 0,\n\t\t});\n\t};\n\n\tconst handlePlay = () => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.paused ? v.play() : v.pause();\n\t};\n\n\tconst handleReady = (e) => {\n\t\tconst tar = e.target;\n\t\tObject.assign(state, {\n\t\t\tduration: tar.duration,\n\t\t\tcurrent: tar.currentTime,\n\t\t});\n\t\ttar.volume = state.volume / 100;\n\t};\n\n\tconst handleMuted = () => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tif (v.volume > 0) {\n\t\t\tstate.volumeCache = v.volume;\n\t\t\tv.volume = 0;\n\t\t\treturn;\n\t\t}\n\t\tv.volume = state.volumeCache === 0 ? 0.5 : state.volumeCache;\n\t};\n\n\tconst handleStop = () => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.currentTime = 0;\n\t\tv.pause();\n\t};\n\n\tconst handleFullscreen = () => {\n\t\tconst tar = videoRef.current?.parentElement;\n\t\tif (!tar) return;\n\n\t\tstate.isFullscreen ? exitFullScreen() : fullScreen(tar);\n\t\tonFullScreenChange?.(!state.isFullscreen);\n\t};\n\n\tconst handleUpdateTime = (t) => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.currentTime = (state.duration * t) / 100;\n\t};\n\n\tconst handleUpdateVolume = (t) => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.volume = t / 100;\n\t};\n\n\tconst showControls = !hideControls && !useOriginControls;\n\n\tconst clearHiddenTO = () => {\n\t\tif (!hiddenTO.current) return;\n\t\tclearTimeout(hiddenTO.current);\n\t\thiddenTO.current = null;\n\t};\n\n\tconst setHiddenFalse = () => {\n\t\tif (!showControls || !state.controlHidden) return;\n\t\tstate.controlHidden = false;\n\n\t\tclearHiddenTO();\n\t\thiddenTO.current = setTimeout(() => {\n\t\t\tstate.controlHidden = true;\n\t\t}, 1000);\n\t};\n\n\tconst handleDraggingProgress = (dragging) => {\n\t\tstate.draggingProgress = dragging;\n\t};\n\n\tconst handleMouseMove = throttle({ interval: 900 }, setHiddenFalse);\n\n\tuseImperativeHandle(ref, () => ({\n\t\tplay: () => {\n\t\t\tconst v = videoRef.current;\n\t\t\tif (!v) return;\n\n\t\t\tv.play();\n\t\t},\n\t\tpause: () => {\n\t\t\tconst v = videoRef.current;\n\t\t\tif (!v) return;\n\n\t\t\tv.pause();\n\t\t},\n\t\tstop: handleStop,\n\t\tfullscreen: handleFullscreen,\n\t\tgetVideo: () => videoRef.current,\n\t}));\n\n\tuseEffect(() => {\n\t\tif (typeof document === \"undefined\") return;\n\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.addEventListener(\"timeupdate\", timeUpdateListener);\n\t\tv.addEventListener(\"play\", playChangeListener);\n\t\tv.addEventListener(\"pause\", playChangeListener);\n\t\tv.addEventListener(\"volumechange\", volumeChangeListener);\n\t\tdocument.addEventListener(\"fullscreenchange\", fsChangeListener);\n\n\t\treturn () => {\n\t\t\tclearHiddenTO();\n\t\t\tv.removeEventListener(\"timeupdate\", timeUpdateListener);\n\t\t\tv.removeEventListener(\"play\", playChangeListener);\n\t\t\tv.removeEventListener(\"pause\", playChangeListener);\n\t\t\tv.removeEventListener(\"volumechange\", volumeChangeListener);\n\t\t\tdocument.removeEventListener(\"fullscreenchange\", fsChangeListener);\n\t\t};\n\t}, []);\n\n\tconst currentValue = (state.current / state.duration) * 100;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\"i-video\", className)}\n\t\t\tstyle={{ height, width, ...style }}\n\t\t\tonClick={handlePlay}\n\t\t\tonDoubleClick={() => handleFullscreen()}\n\t\t\tonMouseMove={handleMouseMove}\n\t\t>\n\t\t\t<video\n\t\t\t\tref={videoRef}\n\t\t\t\tonCanPlay={handleReady}\n\t\t\t\t{...restProps}\n\t\t\t\tcontrols={useOriginControls}\n\t\t\t/>\n\n\t\t\t{showControls && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={classNames(\"i-video-controls\", {\n\t\t\t\t\t\t\"i-video-controls-hidden\": state.controlHidden,\n\t\t\t\t\t})}\n\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t>\n\t\t\t\t\t<Button.Toggle\n\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\tflat\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tafter={<Icon icon={<PauseRound />} />}\n\t\t\t\t\t\tactive={state.playing}\n\t\t\t\t\t\tonClick={handlePlay}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<PlayArrowRound />} />\n\t\t\t\t\t</Button.Toggle>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\tflat\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tonClick={handleStop}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<StopRound />} />\n\t\t\t\t\t</Button>\n\t\t\t\t\t<span className='i-video-times font-sm'>\n\t\t\t\t\t\t<Text.Time seconds={state.current} /> /\n\t\t\t\t\t\t<Text.Time seconds={state.duration} />\n\t\t\t\t\t</span>\n\t\t\t\t\t<Progress\n\t\t\t\t\t\t{...timeProgressProps}\n\t\t\t\t\t\tvalue={currentValue}\n\t\t\t\t\t\tonChange={handleUpdateTime}\n\t\t\t\t\t\tonDraggingChange={handleDraggingProgress}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<div className='i-video-control-volume'>\n\t\t\t\t\t\t<Button.Toggle\n\t\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\t\tflat\n\t\t\t\t\t\t\tsquare\n\t\t\t\t\t\t\tactive={state.volume <= 0}\n\t\t\t\t\t\t\tafter={\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\ticon={<VolumeOffRound />}\n\t\t\t\t\t\t\t\t\tstyle={{ padding: \".125em\" }}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick={handleMuted}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon icon={<VolumeDownRound />} />\n\t\t\t\t\t\t</Button.Toggle>\n\n\t\t\t\t\t\t<div className='i-video-volume'>\n\t\t\t\t\t\t\t<Progress\n\t\t\t\t\t\t\t\tstyle={{ height: 100 }}\n\t\t\t\t\t\t\t\tvertical\n\t\t\t\t\t\t\t\t{...volumeProgressProps}\n\t\t\t\t\t\t\t\tvalue={state.volume}\n\t\t\t\t\t\t\t\tonChange={handleUpdateVolume}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<Button.Toggle\n\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\tflat\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tafter={<Icon icon={<FullscreenExitRound />} />}\n\t\t\t\t\t\tactive={state.isFullscreen}\n\t\t\t\t\t\tonClick={() => handleFullscreen()}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<FullscreenRound />} />\n\t\t\t\t\t</Button.Toggle>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default Video;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"video.js","names":[],"sources":["../../../../packages/components/video/video.tsx"],"sourcesContent":["import {\n\tFullscreenExitRound,\n\tFullscreenRound,\n\tPauseRound,\n\tPlayArrowRound,\n\tStopRound,\n\tVolumeDownRound,\n\tVolumeOffRound,\n} from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { throttle } from \"radash\";\nimport { useEffect, useImperativeHandle, useRef } from \"react\";\nimport { useReactive } from \"../../js/hooks\";\nimport { exitFullScreen, fullScreen } from \"../../js/utils\";\nimport Button from \"../button\";\nimport Icon from \"../icon\";\nimport Progress from \"../progress\";\nimport Text from \"../text\";\nimport \"./index.css\";\nimport { IVideo } from \"./type\";\n\nconst Video = (props: IVideo) => {\n\tconst {\n\t\tref,\n\t\tstyle,\n\t\thideControls,\n\t\tautoplay,\n\t\tmuted,\n\t\tvolume = 50,\n\t\theight,\n\t\twidth,\n\t\tuseOriginControls,\n\t\ttimeProgressProps = {\n\t\t\tbarClass: \"bg-blue\",\n\t\t},\n\t\tvolumeProgressProps = {\n\t\t\tbarClass: \"bg-blue\",\n\t\t},\n\t\tclassName,\n\t\tonFullScreenChange,\n\t\t...restProps\n\t} = props;\n\tconst state = useReactive({\n\t\tplaying: autoplay,\n\t\tvolume: muted ? 0 : volume,\n\t\tvolumeCache: 0,\n\t\tmuted,\n\t\tcurrent: 0,\n\t\tduration: 0,\n\t\tisFullscreen: false,\n\t\tcontrolHidden: true,\n\t\tdraggingProgress: false,\n\t});\n\tconst videoRef = useRef<HTMLVideoElement>(null);\n\tconst hiddenTO = useRef<any>(null);\n\n\tconst timeUpdateListener = (e) => {\n\t\tconst tar = e.target;\n\t\tif (tar.paused || state.draggingProgress) return;\n\n\t\tObject.assign(state, {\n\t\t\tcurrent: tar.currentTime,\n\t\t});\n\t};\n\n\tconst playChangeListener = (e) => {\n\t\tstate.playing = !e.target.paused;\n\t};\n\n\tconst fsChangeListener = () => {\n\t\tif (typeof document === \"undefined\") return;\n\t\tconst tar = videoRef.current?.parentElement;\n\t\tif (!tar) return;\n\n\t\tstate.isFullscreen = document.fullscreenElement === tar;\n\t};\n\n\tconst volumeChangeListener = (e) => {\n\t\tconst tar = e.target;\n\t\tObject.assign(state, {\n\t\t\tvolume: tar.volume * 100,\n\t\t\tmuted: tar.volume === 0,\n\t\t});\n\t};\n\n\tconst handlePlay = () => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.paused ? v.play() : v.pause();\n\t};\n\n\tconst handleReady = (e) => {\n\t\tconst tar = e.target;\n\t\tObject.assign(state, {\n\t\t\tduration: tar.duration,\n\t\t\tcurrent: tar.currentTime,\n\t\t});\n\t\ttar.volume = state.volume / 100;\n\t};\n\n\tconst handleMuted = () => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tif (v.volume > 0) {\n\t\t\tstate.volumeCache = v.volume;\n\t\t\tv.volume = 0;\n\t\t\treturn;\n\t\t}\n\t\tv.volume = state.volumeCache === 0 ? 0.5 : state.volumeCache;\n\t};\n\n\tconst handleStop = () => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.currentTime = 0;\n\t\tv.pause();\n\t};\n\n\tconst handleFullscreen = () => {\n\t\tconst tar = videoRef.current?.parentElement;\n\t\tif (!tar) return;\n\n\t\tstate.isFullscreen ? exitFullScreen() : fullScreen(tar);\n\t\tonFullScreenChange?.(!state.isFullscreen);\n\t};\n\n\tconst handleUpdateTime = (t) => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.currentTime = (state.duration * t) / 100;\n\t};\n\n\tconst handleUpdateVolume = (t) => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.volume = t / 100;\n\t};\n\n\tconst showControls = !hideControls && !useOriginControls;\n\n\tconst clearHiddenTO = () => {\n\t\tif (!hiddenTO.current) return;\n\t\tclearTimeout(hiddenTO.current);\n\t\thiddenTO.current = null;\n\t};\n\n\tconst setHiddenFalse = () => {\n\t\tif (!showControls || !state.controlHidden) return;\n\t\tstate.controlHidden = false;\n\n\t\tclearHiddenTO();\n\t\thiddenTO.current = setTimeout(() => {\n\t\t\tstate.controlHidden = true;\n\t\t}, 1000);\n\t};\n\n\tconst handleDraggingProgress = (dragging) => {\n\t\tstate.draggingProgress = dragging;\n\t};\n\n\tconst handleMouseMove = throttle({ interval: 900 }, setHiddenFalse);\n\n\tuseImperativeHandle(ref, () => ({\n\t\tplay: () => {\n\t\t\tconst v = videoRef.current;\n\t\t\tif (!v) return;\n\n\t\t\tv.play();\n\t\t},\n\t\tpause: () => {\n\t\t\tconst v = videoRef.current;\n\t\t\tif (!v) return;\n\n\t\t\tv.pause();\n\t\t},\n\t\tstop: handleStop,\n\t\tfullscreen: handleFullscreen,\n\t\tgetVideo: () => videoRef.current,\n\t}));\n\n\tuseEffect(() => {\n\t\tif (typeof document === \"undefined\") return;\n\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.addEventListener(\"timeupdate\", timeUpdateListener);\n\t\tv.addEventListener(\"play\", playChangeListener);\n\t\tv.addEventListener(\"pause\", playChangeListener);\n\t\tv.addEventListener(\"volumechange\", volumeChangeListener);\n\t\tdocument.addEventListener(\"fullscreenchange\", fsChangeListener);\n\n\t\treturn () => {\n\t\t\tclearHiddenTO();\n\t\t\tv.removeEventListener(\"timeupdate\", timeUpdateListener);\n\t\t\tv.removeEventListener(\"play\", playChangeListener);\n\t\t\tv.removeEventListener(\"pause\", playChangeListener);\n\t\t\tv.removeEventListener(\"volumechange\", volumeChangeListener);\n\t\t\tdocument.removeEventListener(\"fullscreenchange\", fsChangeListener);\n\t\t};\n\t}, []);\n\n\tconst currentValue = (state.current / state.duration) * 100;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\"i-video\", className)}\n\t\t\tstyle={{ height, width, ...style }}\n\t\t\tonClick={handlePlay}\n\t\t\tonDoubleClick={() => handleFullscreen()}\n\t\t\tonMouseMove={handleMouseMove}\n\t\t>\n\t\t\t<video\n\t\t\t\tref={videoRef}\n\t\t\t\tonCanPlay={handleReady}\n\t\t\t\t{...restProps}\n\t\t\t\tcontrols={useOriginControls}\n\t\t\t/>\n\n\t\t\t{showControls && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={classNames(\"i-video-controls\", {\n\t\t\t\t\t\t\"i-video-controls-hidden\": state.controlHidden,\n\t\t\t\t\t})}\n\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t>\n\t\t\t\t\t<Button.Toggle\n\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\tflat\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tafter={<Icon icon={<PauseRound />} />}\n\t\t\t\t\t\tactive={state.playing}\n\t\t\t\t\t\tonClick={handlePlay}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<PlayArrowRound />} />\n\t\t\t\t\t</Button.Toggle>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\tflat\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tonClick={handleStop}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<StopRound />} />\n\t\t\t\t\t</Button>\n\t\t\t\t\t<span className='i-video-times font-sm'>\n\t\t\t\t\t\t<Text.Time seconds={state.current} /> /\n\t\t\t\t\t\t<Text.Time seconds={state.duration} />\n\t\t\t\t\t</span>\n\t\t\t\t\t<Progress\n\t\t\t\t\t\t{...timeProgressProps}\n\t\t\t\t\t\tvalue={currentValue}\n\t\t\t\t\t\tonChange={handleUpdateTime}\n\t\t\t\t\t\tonDraggingChange={handleDraggingProgress}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<div className='i-video-control-volume'>\n\t\t\t\t\t\t<Button.Toggle\n\t\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\t\tflat\n\t\t\t\t\t\t\tsquare\n\t\t\t\t\t\t\tactive={state.volume <= 0}\n\t\t\t\t\t\t\tafter={\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\ticon={<VolumeOffRound />}\n\t\t\t\t\t\t\t\t\tstyle={{ padding: \".125em\" }}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick={handleMuted}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon icon={<VolumeDownRound />} />\n\t\t\t\t\t\t</Button.Toggle>\n\n\t\t\t\t\t\t<div className='i-video-volume'>\n\t\t\t\t\t\t\t<Progress\n\t\t\t\t\t\t\t\tstyle={{ height: 100 }}\n\t\t\t\t\t\t\t\tvertical\n\t\t\t\t\t\t\t\t{...volumeProgressProps}\n\t\t\t\t\t\t\t\tvalue={state.volume}\n\t\t\t\t\t\t\t\tonChange={handleUpdateVolume}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<Button.Toggle\n\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\tflat\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tafter={<Icon icon={<FullscreenExitRound />} />}\n\t\t\t\t\t\tactive={state.isFullscreen}\n\t\t\t\t\t\tonClick={() => handleFullscreen()}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<FullscreenRound />} />\n\t\t\t\t\t</Button.Toggle>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default Video;\n"],"mappings":"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"}

package/lib/es/index.js

@@ -1,42 +1,42 @@
-export { default as Affix } from './components/affix/affix.js';
-export { default as Badge } from './components/badge/badge.js';
-export { default as Button } from './components/button/button.js';
-export { default as Card } from './components/card/card.js';
-export { default as Checkbox } from './components/checkbox/checkbox.js';
-export { default as Collapse } from './components/collapse/collapse.js';
-export { default as Datagrid } from './components/datagrid/datagrid.js';
-export { default as Description } from './components/description/description.js';
-export { default as Drawer } from './components/drawer/drawer.js';
-export { default as Dropdown } from './components/dropdown/dropdown.js';
-export { default as Editor } from './components/editor/editor.js';
-export { default as Flex } from './components/flex/flex.js';
-export { default as Form } from './components/form/form.js';
-export { default as Icon } from './components/icon/icon.js';
-export { default as Image } from './components/image/image.js';
-export { default as Input } from './components/input/input.js';
-export { default as List } from './components/list/list.js';
-export { default as Loading } from './components/loading/loading.js';
-export { default as Message } from './components/message/message.js';
-export { default as Modal } from './components/modal/modal.js';
-export { default as Pagination } from './components/pagination/pagination.js';
-export { default as ColorPicker } from './components/picker/colors/index.js';
-export { default as DatePicker } from './components/picker/dates/index.js';
-export { default as TimePicker } from './components/picker/time/index.js';
-export { default as Popconfirm } from './components/popconfirm/popconfirm.js';
-export { default as Popup } from './components/popup/popup.js';
-export { default as Progress } from './components/progress/progress.js';
-export { default as Radio } from './components/radio/radio.js';
-export { default as Resizable } from './components/resizable/resizable.js';
-export { default as River } from './components/river/river.js';
-export { default as Select } from './components/select/select.js';
-export { default as Step } from './components/step/step.js';
-export { default as Swiper } from './components/swiper/swiper.js';
-export { default as Tabs } from './components/tabs/tabs.js';
-export { default as Tag } from './components/tag/tag.js';
-export { default as Text } from './components/text/text.js';
-export { default as Tree } from './components/tree/tree.js';
-export { default as Upload } from './components/upload/upload.js';
-export { default as Video } from './components/video/video.js';
-export { default as usePreview } from './js/usePreview/index.js';
-export { default as useTheme } from './js/useTheme/index.js';
-//# sourceMappingURL=index.js.map
+import loading_default from "./components/loading/index.js";
+import button_default from "./components/button/index.js";
+import icon_default from "./components/icon/index.js";
+import affix_default from "./components/affix/index.js";
+import badge_default from "./components/badge/index.js";
+import card_default from "./components/card/index.js";
+import checkbox_default from "./components/checkbox/index.js";
+import collapse_default from "./components/collapse/index.js";
+import datagrid_default from "./components/datagrid/index.js";
+import description_default from "./components/description/index.js";
+import drawer_default from "./components/drawer/index.js";
+import list_default from "./components/list/index.js";
+import popup_default from "./components/popup/index.js";
+import dropdown_default from "./components/dropdown/index.js";
+import editor_default from "./components/editor/index.js";
+import flex_default from "./components/flex/index.js";
+import form_default from "./components/form/index.js";
+import text_default from "./components/text/index.js";
+import progress_default from "./components/progress/index.js";
+import video_default from "./components/video/index.js";
+import usePreview from "./js/usePreview/index.js";
+import image_default from "./components/image/index.js";
+import input_default from "./components/input/index.js";
+import message_default from "./components/message/index.js";
+import modal_default from "./components/modal/index.js";
+import pagination_default from "./components/pagination/index.js";
+import tag_default from "./components/tag/index.js";
+import select_default from "./components/select/index.js";
+import ColorPicker from "./components/picker/colors/index.js";
+import Datepicker from "./components/picker/dates/index.js";
+import TimePicker from "./components/picker/time/index.js";
+import popconfirm_default from "./components/popconfirm/index.js";
+import radio_default from "./components/radio/index.js";
+import resizable_default from "./components/resizable/index.js";
+import river_default from "./components/river/index.js";
+import step_default from "./components/step/index.js";
+import swiper_default from "./components/swiper/index.js";
+import tabs_default from "./components/tabs/index.js";
+import tree_default from "./components/tree/index.js";
+import upload_default from "./components/upload/index.js";
+import useTheme from "./js/useTheme/index.js";
+export { affix_default as Affix, badge_default as Badge, button_default as Button, card_default as Card, checkbox_default as Checkbox, collapse_default as Collapse, ColorPicker, datagrid_default as Datagrid, Datepicker as DatePicker, description_default as Description, drawer_default as Drawer, dropdown_default as Dropdown, editor_default as Editor, flex_default as Flex, form_default as Form, icon_default as Icon, image_default as Image, input_default as Input, list_default as List, loading_default as Loading, message_default as Message, modal_default as Modal, pagination_default as Pagination, popconfirm_default as Popconfirm, popup_default as Popup, progress_default as Progress, radio_default as Radio, resizable_default as Resizable, river_default as River, select_default as Select, step_default as Step, swiper_default as Swiper, tabs_default as Tabs, tag_default as Tag, text_default as Text, TimePicker, tree_default as Tree, upload_default as Upload, video_default as Video, usePreview, useTheme };