@ioca/react 1.3.4 → 1.3.6

package/lib/es/components/upload/upload.js

@@ -0,0 +1,123 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { PlusSharp } from '@ricons/material';
+import { useReactive } from 'ahooks';
+import classNames from 'classnames';
+import { uid } from 'radash';
+import { useRef, useMemo, useEffect, useImperativeHandle } from 'react';
+import { SortableItem } from 'react-easy-sort';
+import usePreview from '../../js/usePreview/index.js';
+import { arrayMove } from '../../js/utils.js';
+import '../button/index.js';
+import Icon from '../icon/icon.js';
+import InputContainer from '../input/container.js';
+import FileListItem, { ListContainer } from './renderFile.js';
+import Button from '../button/button.js';
+
+const Upload = (props) => {
+    const { ref, label, labelInline, value, files = [], initialFiles, placeholder, status = "normal", message, className, style, children, defaultText = "Upload", mode = "default", cardSize = "4em", disabled, sortable, limit = props.multiple ? Infinity : 1, multiple, renderItem, shouldUpload = () => true, uploader, onChange, onFilesChange, onUpload, ...restProps } = props;
+    const state = useReactive({
+        files,
+        value,
+        status,
+        message,
+    });
+    const inputRef = useRef(null);
+    const preview = usePreview();
+    const trigger = useMemo(() => {
+        if (children)
+            return children;
+        switch (mode) {
+            case "card":
+                return (jsx(Button, { className: 'i-upload-card-btn color-5', square: true, flat: true, outline: true, disabled: disabled, children: jsx(Icon, { icon: jsx(PlusSharp, {}) }) }));
+            default:
+                return (jsx(Button, { className: 'i-upload-btn', disabled: disabled, children: defaultText }));
+        }
+    }, [mode, children]);
+    const handleChange = (e) => {
+        const files = Array.from(e.target.files || []);
+        const { files: before } = state;
+        const changed = [];
+        files.map((f) => {
+            const { id, name, size, type } = f;
+            const same = before.find((pf) => {
+                const { name: n, size: s, type: t } = pf;
+                return n === name && s === size && t === type;
+            });
+            const src = URL.createObjectURL(f);
+            Object.assign(f, {
+                id: id ?? uid(7),
+                src: src ?? f.name,
+                url: src ?? f.name,
+            });
+            !same && changed.push(f);
+        });
+        const after = [...before, ...changed];
+        Object.assign(state, {
+            files: multiple ? after.slice(0, limit) : [after.at(-1)],
+            status,
+            message,
+        });
+        onFilesChange?.(state.files, changed, e);
+        onChange?.(state.files, e);
+        handleUpload(changed);
+        inputRef.current && (inputRef.current.value = "");
+    };
+    const handleRemove = (i) => {
+        const [...files] = state.files;
+        const changed = files.splice(i, 1);
+        URL.revokeObjectURL(changed[0]?.src || "");
+        state.files = files;
+        onFilesChange?.(files, changed);
+        onChange?.(files);
+        inputRef.current && (inputRef.current.value = "");
+    };
+    const handleUpload = async (files) => {
+        if (!uploader)
+            return;
+        const shouldUploadFiles = files.filter(shouldUpload);
+        const result = Promise.all(shouldUploadFiles.map(uploader));
+        return onUpload?.(result);
+    };
+    const handlePreview = (i) => {
+        preview({ items: state.files, initial: i });
+    };
+    const setFileList = (files) => {
+        if (!files)
+            return;
+        state.files = files.map((f) => {
+            return { ...f, id: f.id ?? uid(7) };
+        });
+    };
+    const handleSortEnd = (before, after) => {
+        const [...files] = state.files;
+        state.files = arrayMove(files, before, after);
+        onChange?.(state.files);
+    };
+    useEffect(() => {
+        Object.assign(state, {
+            status,
+            message,
+        });
+    }, [status, message]);
+    useEffect(() => {
+        state.files = value?.filter?.((file) => !!file.id) ?? [];
+    }, [value]);
+    useEffect(() => {
+        setFileList(initialFiles);
+    }, []);
+    useImperativeHandle(ref, () => ({
+        getFileList: () => state.files,
+        setFileList,
+    }), []);
+    return (jsx(InputContainer, { as: 'div', label: label, labelInline: labelInline, className: classNames("i-input-label-file", className), style: style, children: jsxs("div", { className: classNames("i-upload-inner", {
+                [`i-upload-${mode}`]: mode !== "default",
+            }), style: { ["--upload-card-size"]: cardSize }, children: [jsx(ListContainer, { sortable: sortable, onSortEnd: handleSortEnd, children: state.files.map((file, i) => {
+                        const node = (jsx(FileListItem, { index: i, file: file, mode: mode, renderItem: renderItem, onRemove: handleRemove, onPreview: handlePreview }, i));
+                        if (!sortable)
+                            return node;
+                        return jsx(SortableItem, { children: node }, i);
+                    }) }), state.message && (jsx("span", { className: 'i-upload-message', children: state.message })), state.files.length < limit && (jsxs("label", { children: [jsx("input", { ...restProps, disabled: disabled, ref: inputRef, type: 'file', className: 'i-input-file-hidden', multiple: multiple, onChange: handleChange }), trigger] }))] }) }));
+};
+
+export { Upload as default };
+//# sourceMappingURL=upload.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"upload.js","sources":["../../../../packages/components/upload/upload.tsx"],"sourcesContent":["import { PlusSharp } from \"@ricons/material\";\nimport { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { uid } from \"radash\";\nimport {\n\tChangeEvent,\n\tCSSProperties,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseMemo,\n\tuseRef,\n} from \"react\";\nimport { SortableItem } from \"react-easy-sort\";\nimport usePreview from \"../../js/usePreview\";\nimport { TPreviewItem } from \"../../js/usePreview/type\";\nimport { arrayMove } from \"../../js/utils\";\nimport Button from \"../button\";\nimport Icon from \"../icon\";\nimport InputContainer from \"../input/container\";\nimport \"./index.css\";\nimport FileListItem, { ListContainer } from \"./renderFile\";\nimport { IFile, IUpload } from \"./type\";\n\nconst Upload = (props: IUpload) => {\n\tconst {\n\t\tref,\n\t\tlabel,\n\t\tlabelInline,\n\t\tvalue,\n\t\tfiles = [],\n\t\tinitialFiles,\n\t\tplaceholder,\n\t\tstatus = \"normal\",\n\t\tmessage,\n\t\tclassName,\n\t\tstyle,\n\t\tchildren,\n\t\tdefaultText = \"Upload\",\n\t\tmode = \"default\",\n\t\tcardSize = \"4em\",\n\t\tdisabled,\n\t\tsortable,\n\t\tlimit = props.multiple ? Infinity : 1,\n\t\tmultiple,\n\t\trenderItem,\n\t\tshouldUpload = () => true,\n\t\tuploader,\n\t\tonChange,\n\t\tonFilesChange,\n\t\tonUpload,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive({\n\t\tfiles,\n\t\tvalue,\n\t\tstatus,\n\t\tmessage,\n\t});\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\tconst preview = usePreview();\n\n\tconst trigger = useMemo(() => {\n\t\tif (children) return children;\n\n\t\tswitch (mode) {\n\t\t\tcase \"card\":\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName='i-upload-card-btn color-5'\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tflat\n\t\t\t\t\t\toutline\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<PlusSharp />} />\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\tdefault:\n\t\t\t\treturn (\n\t\t\t\t\t<Button className='i-upload-btn' disabled={disabled}>\n\t\t\t\t\t\t{defaultText}\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t}\n\t}, [mode, children]);\n\n\tconst handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tconst files = Array.from(e.target.files || []) as IFile[];\n\t\tconst { files: before } = state;\n\t\tconst changed: IFile[] = [];\n\n\t\tfiles.map((f) => {\n\t\t\tconst { id, name, size, type } = f;\n\t\t\tconst same = before.find((pf) => {\n\t\t\t\tconst { name: n, size: s, type: t } = pf;\n\t\t\t\treturn n === name && s === size && t === type;\n\t\t\t});\n\t\t\tconst src = URL.createObjectURL(f);\n\n\t\t\tObject.assign(f, {\n\t\t\t\tid: id ?? uid(7),\n\t\t\t\tsrc: src ?? f.name,\n\t\t\t\turl: src ?? f.name,\n\t\t\t});\n\t\t\t!same && changed.push(f);\n\t\t});\n\n\t\tconst after = [...before, ...changed];\n\n\t\tObject.assign(state, {\n\t\t\tfiles: multiple ? after.slice(0, limit) : [after.at(-1)],\n\t\t\tstatus,\n\t\t\tmessage,\n\t\t});\n\n\t\tonFilesChange?.(state.files, changed, e);\n\t\tonChange?.(state.files, e);\n\n\t\thandleUpload(changed);\n\t\tinputRef.current && (inputRef.current.value = \"\");\n\t};\n\n\tconst handleRemove = (i: number) => {\n\t\tconst [...files] = state.files;\n\n\t\tconst changed = files.splice(i, 1);\n\t\tURL.revokeObjectURL(changed[0]?.src || \"\");\n\n\t\tstate.files = files;\n\t\tonFilesChange?.(files, changed);\n\t\tonChange?.(files);\n\n\t\tinputRef.current && (inputRef.current.value = \"\");\n\t};\n\n\tconst handleUpload = async (files: IFile[]) => {\n\t\tif (!uploader) return;\n\n\t\tconst shouldUploadFiles = files.filter(shouldUpload);\n\n\t\tconst result = Promise.all(shouldUploadFiles.map(uploader));\n\n\t\treturn onUpload?.(result);\n\t};\n\n\tconst handlePreview = (i: number) => {\n\t\tpreview({ items: state.files as TPreviewItem[], initial: i });\n\t};\n\n\tconst setFileList = (files?: IFile[] | File[]) => {\n\t\tif (!files) return;\n\n\t\tstate.files = files.map((f) => {\n\t\t\treturn { ...f, id: f.id ?? uid(7) };\n\t\t});\n\t};\n\n\tconst handleSortEnd = (before, after) => {\n\t\tconst [...files] = state.files;\n\n\t\tstate.files = arrayMove(files, before, after);\n\t\tonChange?.(state.files);\n\t};\n\n\tuseEffect(() => {\n\t\tObject.assign(state, {\n\t\t\tstatus,\n\t\t\tmessage,\n\t\t});\n\t}, [status, message]);\n\n\tuseEffect(() => {\n\t\tstate.files = value?.filter?.((file) => !!file.id) ?? [];\n\t}, [value]);\n\n\tuseEffect(() => {\n\t\tsetFileList(initialFiles);\n\t}, []);\n\n\tuseImperativeHandle(\n\t\tref,\n\t\t() => ({\n\t\t\tgetFileList: () => state.files,\n\n\t\t\tsetFileList,\n\t\t}),\n\t\t[]\n\t);\n\n\treturn (\n\t\t<InputContainer\n\t\t\tas='div'\n\t\t\tlabel={label}\n\t\t\tlabelInline={labelInline}\n\t\t\tclassName={classNames(\"i-input-label-file\", className)}\n\t\t\tstyle={style}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-upload-inner\", {\n\t\t\t\t\t[`i-upload-${mode}`]: mode !== \"default\",\n\t\t\t\t})}\n\t\t\t\tstyle={{ [\"--upload-card-size\"]: cardSize } as CSSProperties}\n\t\t\t>\n\t\t\t\t<ListContainer sortable={sortable} onSortEnd={handleSortEnd}>\n\t\t\t\t\t{state.files.map((file: IFile, i: number) => {\n\t\t\t\t\t\tconst node = (\n\t\t\t\t\t\t\t<FileListItem\n\t\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\t\tindex={i}\n\t\t\t\t\t\t\t\tfile={file}\n\t\t\t\t\t\t\t\tmode={mode}\n\t\t\t\t\t\t\t\trenderItem={renderItem}\n\t\t\t\t\t\t\t\tonRemove={handleRemove}\n\t\t\t\t\t\t\t\tonPreview={handlePreview}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\tif (!sortable) return node;\n\n\t\t\t\t\t\treturn <SortableItem key={i}>{node}</SortableItem>;\n\t\t\t\t\t})}\n\t\t\t\t</ListContainer>\n\n\t\t\t\t{state.message && (\n\t\t\t\t\t<span className='i-upload-message'>{state.message}</span>\n\t\t\t\t)}\n\n\t\t\t\t{state.files.length < limit && (\n\t\t\t\t\t<label>\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t{...restProps}\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\tref={inputRef}\n\t\t\t\t\t\t\ttype='file'\n\t\t\t\t\t\t\tclassName='i-input-file-hidden'\n\t\t\t\t\t\t\tmultiple={multiple}\n\t\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{trigger}\n\t\t\t\t\t</label>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</InputContainer>\n\t);\n};\n\nexport default Upload;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/lib/es/components/utils/empty/index.js

@@ -0,0 +1,11 @@
+import { jsx } from 'react/jsx-runtime';
+import { InboxTwotone } from '@ricons/material';
+import classNames from 'classnames';
+
+function Empty(props) {
+    const { className, ...restProps } = props;
+    return (jsx(InboxTwotone, { className: classNames("i-empty", className), ...restProps }));
+}
+
+export { Empty as default };
+//# sourceMappingURL=index.js.map

package/lib/es/components/utils/empty/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../packages/components/utils/empty/index.tsx"],"sourcesContent":["import { InboxTwotone } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport \"./index.css\";\n\nexport default function Empty(props) {\n\tconst { className, ...restProps } = props;\n\n\treturn (\n\t\t<InboxTwotone\n\t\t\tclassName={classNames(\"i-empty\", className)}\n\t\t\t{...restProps}\n\t\t/>\n\t);\n}\n"],"names":["_jsx"],"mappings":";;;;AAIwB,SAAA,KAAK,CAAC,KAAK,EAAA;IAClC,MAAM,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK;AAEzC,IAAA,QACCA,GAAC,CAAA,YAAY,EACZ,EAAA,SAAS,EAAE,UAAU,CAAC,SAAS,EAAE,SAAS,CAAC,EAAA,GACvC,SAAS,EAAA,CACZ;AAEJ;;;;"}

package/lib/es/components/utils/helpericon/helpericon.js

@@ -0,0 +1,24 @@
+import { jsx, Fragment } from 'react/jsx-runtime';
+import { CloseRound } from '@ricons/material';
+import classNames from 'classnames';
+import { uid } from 'radash';
+import { createElement } from 'react';
+import Icon from '../../icon/icon.js';
+
+const Helpericon = (props) => {
+    const { as = "a", active, className, icon = jsx(CloseRound, {}), ...restProps } = props;
+    if (!active)
+        return jsx(Fragment, {});
+    return createElement(as, {
+        className: classNames("i-helpericon", className),
+        ...restProps,
+    }, [
+        createElement(Icon, {
+            key: uid(3),
+            icon,
+        }),
+    ]);
+};
+
+export { Helpericon as default };
+//# sourceMappingURL=helpericon.js.map

package/lib/es/components/utils/helpericon/helpericon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpericon.js","sources":["../../../../../packages/components/utils/helpericon/helpericon.tsx"],"sourcesContent":["import { CloseRound } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { uid } from \"radash\";\nimport { createElement } from \"react\";\nimport Icon from \"../../icon\";\nimport \"./index.css\";\nimport { IHelperIcon } from \"./type\";\n\nconst Helpericon = (props: IHelperIcon) => {\n\tconst {\n\t\tas = \"a\",\n\t\tactive,\n\t\tclassName,\n\t\ticon = <CloseRound />,\n\t\t...restProps\n\t} = props;\n\n\tif (!active) return <></>;\n\n\treturn createElement(\n\t\tas,\n\t\t{\n\t\t\tclassName: classNames(\"i-helpericon\", className),\n\t\t\t...restProps,\n\t\t},\n\t\t[\n\t\t\tcreateElement(Icon, {\n\t\t\t\tkey: uid(3),\n\t\t\t\ticon,\n\t\t\t}),\n\t\t]\n\t);\n};\n\nexport default Helpericon;\n"],"names":["_jsx"],"mappings":";;;;;;;AAQA,MAAM,UAAU,GAAG,CAAC,KAAkB,KAAI;IACzC,MAAM,EACL,EAAE,GAAG,GAAG,EACR,MAAM,EACN,SAAS,EACT,IAAI,GAAGA,GAAC,CAAA,UAAU,KAAG,EACrB,GAAG,SAAS,EACZ,GAAG,KAAK;AAET,IAAA,IAAI,CAAC,MAAM;AAAE,QAAA,OAAOA,iBAAK;IAEzB,OAAO,aAAa,CACnB,EAAE,EACF;AACC,QAAA,SAAS,EAAE,UAAU,CAAC,cAAc,EAAE,SAAS,CAAC;AAChD,QAAA,GAAG,SAAS;KACZ,EACD;QACC,aAAa,CAAC,IAAI,EAAE;AACnB,YAAA,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC;YACX,IAAI;SACJ,CAAC;AACF,KAAA,CACD;AACF;;;;"}

package/lib/es/components/utils/helpericon/index.js

@@ -0,0 +1,6 @@
+import Helpericon from './helpericon.js';
+
+
+
+export { Helpericon as default };
+//# sourceMappingURL=index.js.map

package/lib/es/components/utils/helpericon/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

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

@@ -0,0 +1,6 @@
+import Video from './video.js';
+
+
+
+export { Video as default };
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

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

@@ -0,0 +1,171 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { PauseRound, PlayArrowRound, StopRound, VolumeOffRound, VolumeDownRound, FullscreenExitRound, FullscreenRound } from '@ricons/material';
+import { useReactive } from 'ahooks';
+import classNames from 'classnames';
+import { throttle } from 'radash';
+import { useRef, useImperativeHandle, useEffect } from 'react';
+import { exitFullScreen, fullScreen } from '../../js/utils.js';
+import '../button/index.js';
+import Icon from '../icon/icon.js';
+import Progress from '../progress/progress.js';
+import '../text/index.js';
+import Button from '../button/button.js';
+import Text from '../text/text.js';
+
+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 = () => {
+        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(() => {
+        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, {}) }) })] }))] }));
+};
+
+export { Video as default };
+//# sourceMappingURL=video.js.map

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

@@ -0,0 +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 { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { throttle } from \"radash\";\nimport { useEffect, useImperativeHandle, useRef } from \"react\";\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\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\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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"}

package/lib/es/index.js

@@ -0,0 +1,45 @@
+export { default as Affix } from './components/affix/affix.js';
+export { default as Badge } from './components/badge/badge.js';
+import './components/button/index.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';
+import './components/image/index.js';
+import './components/input/index.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';
+import './components/modal/index.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 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';
+import './components/text/index.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 Button } from './components/button/button.js';
+export { default as Image } from './components/image/image.js';
+export { default as Modal } from './components/modal/modal.js';
+export { default as Text } from './components/text/text.js';
+export { default as Input } from './components/input/input.js';
+//# sourceMappingURL=index.js.map

package/lib/es/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/es/js/hooks.js

@@ -0,0 +1,109 @@
+import { useEffect } from 'react';
+
+const MouseMoveEvents = new Set();
+const MouseUpEvents = new Set();
+const KeydownEvents = new Set();
+const touchable = "ontouchend" in document;
+const EVENTS = {
+    MOVE: touchable ? "touchmove" : "mousemove",
+    UP: touchable ? "touchend" : "mouseup",
+    KEYDOWN: "keydown",
+};
+document.addEventListener(EVENTS.MOVE, (e) => {
+    for (const listener of MouseMoveEvents.values()) {
+        listener(e);
+    }
+}, { passive: false });
+document.addEventListener(EVENTS.UP, (e) => {
+    for (const listener of MouseUpEvents.values()) {
+        listener(e);
+    }
+});
+document.addEventListener(EVENTS.KEYDOWN, (e) => {
+    for (const listener of KeydownEvents.values()) {
+        listener(e);
+    }
+});
+function useMouseMove(listener, options) {
+    useEffect(() => {
+        MouseMoveEvents.add(listener);
+        return () => {
+            MouseMoveEvents.delete(listener);
+        };
+    }, [listener]);
+}
+function useMouseUp(listener, options) {
+    useEffect(() => {
+        MouseUpEvents.add(listener);
+        return () => {
+            MouseUpEvents.delete(listener);
+        };
+    }, [listener]);
+}
+function useKeydown(listener, options) {
+    useEffect(() => {
+        if (options?.disabled)
+            return;
+        KeydownEvents.add(listener);
+        return () => {
+            KeydownEvents.delete(listener);
+        };
+    }, [listener]);
+}
+function useIntersectionObserver(configs) {
+    const WM = new WeakMap();
+    const IO = new IntersectionObserver((entries) => {
+        entries.map((entry) => {
+            const callback = WM.get(entry.target);
+            callback?.(entry.target, entry.isIntersecting);
+        });
+    }, configs);
+    function observe(target, callback) {
+        if (WM.get(target))
+            return;
+        WM.set(target, callback);
+        target && IO.observe(target);
+    }
+    function unobserve(target) {
+        target && IO.unobserve(target);
+        WM.delete(target);
+    }
+    function disconnect() {
+        IO.disconnect();
+    }
+    return {
+        observe,
+        unobserve,
+        disconnect,
+    };
+}
+function useResizeObserver() {
+    const WM = new WeakMap();
+    const IO = new ResizeObserver((entries) => {
+        entries.map((entry) => {
+            const callback = WM.get(entry.target);
+            callback?.(entry.target);
+        });
+    });
+    function observe(target, callback) {
+        if (WM.get(target))
+            return;
+        target && IO.observe(target);
+        WM.set(target, callback);
+    }
+    function unobserve(target) {
+        target && IO.unobserve(target);
+        WM.delete(target);
+    }
+    function disconnect() {
+        IO.disconnect();
+    }
+    return {
+        observe,
+        unobserve,
+        disconnect,
+    };
+}
+
+export { useIntersectionObserver, useKeydown, useMouseMove, useMouseUp, useResizeObserver };
+//# sourceMappingURL=hooks.js.map

package/lib/es/js/hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.js","sources":["../../../packages/js/hooks.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\ntype TMouseEvent = (e: MouseEvent) => void;\ntype TKeyboardEvent = (e: KeyboardEvent) => void;\ntype TEventOption = {\n\tdisabled?: boolean;\n};\n\nconst ClickEvents = new Set<TMouseEvent>();\nconst MouseMoveEvents = new Set<TMouseEvent>();\nconst MouseUpEvents = new Set<TMouseEvent>();\nconst KeydownEvents = new Set<TKeyboardEvent>();\n\nconst touchable = \"ontouchend\" in document;\nconst EVENTS: any = {\n\tMOVE: touchable ? \"touchmove\" : \"mousemove\",\n\tUP: touchable ? \"touchend\" : \"mouseup\",\n\tKEYDOWN: \"keydown\",\n};\n\ndocument.addEventListener(\n\tEVENTS.MOVE,\n\t(e: MouseEvent) => {\n\t\tfor (const listener of MouseMoveEvents.values()) {\n\t\t\tlistener(e);\n\t\t}\n\t},\n\t{ passive: false }\n);\n\ndocument.addEventListener(EVENTS.UP, (e) => {\n\tfor (const listener of MouseUpEvents.values()) {\n\t\tlistener(e);\n\t}\n});\n\ndocument.addEventListener(EVENTS.KEYDOWN, (e) => {\n\tfor (const listener of KeydownEvents.values()) {\n\t\tlistener(e);\n\t}\n});\n\nexport function useMouseMove(listener: TMouseEvent, options?: TEventOption) {\n\tuseEffect(() => {\n\t\tif (options?.disabled) return;\n\n\t\tMouseMoveEvents.add(listener);\n\t\treturn () => {\n\t\t\tMouseMoveEvents.delete(listener);\n\t\t};\n\t}, [listener]);\n}\n\nexport function useMouseUp(listener: TMouseEvent, options?: TEventOption) {\n\tuseEffect(() => {\n\t\tif (options?.disabled) return;\n\n\t\tMouseUpEvents.add(listener);\n\t\treturn () => {\n\t\t\tMouseUpEvents.delete(listener);\n\t\t};\n\t}, [listener]);\n}\n\nexport function useKeydown(listener: TKeyboardEvent, options?: TEventOption) {\n\tuseEffect(() => {\n\t\tif (options?.disabled) return;\n\n\t\tKeydownEvents.add(listener);\n\t\treturn () => {\n\t\t\tKeydownEvents.delete(listener);\n\t\t};\n\t}, [listener]);\n}\n\nexport function useIntersectionObserver(configs?: IntersectionObserverInit) {\n\tconst WM = new WeakMap();\n\tconst IO = new IntersectionObserver((entries) => {\n\t\tentries.map((entry) => {\n\t\t\tconst callback = WM.get(entry.target);\n\n\t\t\tcallback?.(entry.target, entry.isIntersecting);\n\t\t});\n\t}, configs);\n\n\tfunction observe(target: HTMLElement, callback: Function) {\n\t\tif (WM.get(target)) return;\n\n\t\tWM.set(target, callback);\n\t\ttarget && IO.observe(target);\n\t}\n\n\tfunction unobserve(target: HTMLElement) {\n\t\ttarget && IO.unobserve(target);\n\t\tWM.delete(target);\n\t}\n\n\tfunction disconnect() {\n\t\tIO.disconnect();\n\t}\n\n\treturn {\n\t\tobserve,\n\t\tunobserve,\n\t\tdisconnect,\n\t};\n}\n\nexport function useResizeObserver() {\n\tconst WM = new WeakMap();\n\tconst IO = new ResizeObserver((entries) => {\n\t\tentries.map((entry) => {\n\t\t\tconst callback = WM.get(entry.target);\n\n\t\t\tcallback?.(entry.target);\n\t\t});\n\t});\n\n\tfunction observe(target: HTMLElement, callback: Function) {\n\t\tif (WM.get(target)) return;\n\n\t\ttarget && IO.observe(target);\n\t\tWM.set(target, callback);\n\t}\n\n\tfunction unobserve(target: HTMLElement) {\n\t\ttarget && IO.unobserve(target);\n\t\tWM.delete(target);\n\t}\n\n\tfunction disconnect() {\n\t\tIO.disconnect();\n\t}\n\n\treturn {\n\t\tobserve,\n\t\tunobserve,\n\t\tdisconnect,\n\t};\n}\n"],"names":[],"mappings":"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"}