feat: release v0.0.1
This commit is contained in:
7
dist/react/video-player/components/with-lazy/index.d.ts
vendored
Normal file
7
dist/react/video-player/components/with-lazy/index.d.ts
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
import { IWithErrorsVideoPlayerProps } from "../with-errors";
|
||||
export interface IWithLazyVideoPlayerProps extends IWithErrorsVideoPlayerProps {
|
||||
lazy?: boolean;
|
||||
}
|
||||
declare const WithLazy: ({ lazy, children, onShow, ...props }: IWithLazyVideoPlayerProps) => import("react/jsx-runtime").JSX.Element;
|
||||
export default WithLazy;
|
||||
//# sourceMappingURL=index.d.ts.map
|
||||
1
dist/react/video-player/components/with-lazy/index.d.ts.map
vendored
Normal file
1
dist/react/video-player/components/with-lazy/index.d.ts.map
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/react/video-player/components/with-lazy/index.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,2BAA2B,EAAE,MAAM,gBAAgB,CAAC;AAI7D,MAAM,WAAW,yBAA0B,SAAQ,2BAA2B;IAC5E,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,QAAA,MAAM,QAAQ,GAAI,sCAKf,yBAAyB,4CA2D3B,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
||||
49
dist/react/video-player/components/with-lazy/index.js
vendored
Normal file
49
dist/react/video-player/components/with-lazy/index.js
vendored
Normal file
@@ -0,0 +1,49 @@
|
||||
import { jsx as _jsx } from "react/jsx-runtime";
|
||||
import styles from "./with-lazy.module.scss";
|
||||
import React, { useCallback, useEffect, useRef, useState } from "react";
|
||||
import PlayerExtension from "../player-extension";
|
||||
import { debounce, throttle } from "lodash";
|
||||
const WithLazy = ({ lazy = false, children, onShow, ...props }) => {
|
||||
const containerRef = useRef(null);
|
||||
const [visible, setIsVisible] = useState(true);
|
||||
const show = useCallback((player) => {
|
||||
if (!visible) {
|
||||
setIsVisible(true);
|
||||
onShow && onShow(player);
|
||||
}
|
||||
}, [onShow, visible]);
|
||||
// Debounce для задержки выгрузки видео
|
||||
const debouncedHide = useCallback(debounce(() => {
|
||||
visible && setIsVisible(false);
|
||||
}, 5000), // задержка в миллисекундах
|
||||
[visible]);
|
||||
// Throttle для обработки видимости
|
||||
const handleVisibility = throttle((entry) => {
|
||||
debouncedHide.cancel();
|
||||
if (entry.isIntersecting && !visible) {
|
||||
setIsVisible(true);
|
||||
show(null);
|
||||
}
|
||||
else if (!entry.isIntersecting && visible) {
|
||||
debouncedHide();
|
||||
}
|
||||
}, 200);
|
||||
useEffect(() => {
|
||||
const container = containerRef.current;
|
||||
const observer = new IntersectionObserver(([entry]) => handleVisibility(entry), {
|
||||
threshold: 0,
|
||||
});
|
||||
if (container && lazy) {
|
||||
observer.observe(container);
|
||||
}
|
||||
return () => {
|
||||
if (container) {
|
||||
observer.unobserve(container);
|
||||
}
|
||||
handleVisibility.cancel();
|
||||
};
|
||||
}, [handleVisibility, lazy]);
|
||||
return (_jsx(PlayerExtension, { className: styles.lazyHolder, conteinerRef: containerRef, children: visible && React.cloneElement(children, { ...props, onShow }) }));
|
||||
};
|
||||
export default WithLazy;
|
||||
//# sourceMappingURL=index.js.map
|
||||
1
dist/react/video-player/components/with-lazy/index.js.map
vendored
Normal file
1
dist/react/video-player/components/with-lazy/index.js.map
vendored
Normal file
@@ -0,0 +1 @@
|
||||
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/react/video-player/components/with-lazy/index.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,yBAAyB,CAAC;AAC7C,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGxE,OAAO,eAAe,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAM5C,MAAM,QAAQ,GAAG,CAAC,EAChB,IAAI,GAAG,KAAK,EACZ,QAAQ,EACR,MAAM,EACN,GAAG,KAAK,EACkB,EAAE,EAAE;IAC9B,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;IAClC,MAAM,CAAC,OAAO,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAE/C,MAAM,IAAI,GAAG,WAAW,CACtB,CAAC,MAAqB,EAAE,EAAE;QACxB,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,YAAY,CAAC,IAAI,CAAC,CAAC;YACnB,MAAM,IAAI,MAAM,CAAC,MAAM,CAAC,CAAC;QAC3B,CAAC;IACH,CAAC,EACD,CAAC,MAAM,EAAE,OAAO,CAAC,CAClB,CAAC;IAEF,uCAAuC;IACvC,MAAM,aAAa,GAAG,WAAW,CAC/B,QAAQ,CAAC,GAAG,EAAE;QACZ,OAAO,IAAI,YAAY,CAAC,KAAK,CAAC,CAAC;IACjC,CAAC,EAAE,IAAI,CAAC,EAAE,2BAA2B;IACrC,CAAC,OAAO,CAAC,CACV,CAAC;IAEF,mCAAmC;IACnC,MAAM,gBAAgB,GAAG,QAAQ,CAAC,CAAC,KAAgC,EAAE,EAAE;QACrE,aAAa,CAAC,MAAM,EAAE,CAAC;QACvB,IAAI,KAAK,CAAC,cAAc,IAAI,CAAC,OAAO,EAAE,CAAC;YACrC,YAAY,CAAC,IAAI,CAAC,CAAC;YACnB,IAAI,CAAC,IAAI,CAAC,CAAC;QACb,CAAC;aAAM,IAAI,CAAC,KAAK,CAAC,cAAc,IAAI,OAAO,EAAE,CAAC;YAC5C,aAAa,EAAE,CAAC;QAClB,CAAC;IACH,CAAC,EAAE,GAAG,CAAC,CAAC;IAER,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,SAAS,GAAG,YAAY,CAAC,OAAO,CAAC;QACvC,MAAM,QAAQ,GAAG,IAAI,oBAAoB,CACvC,CAAC,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC,gBAAgB,CAAC,KAAK,CAAC,EACpC;YACE,SAAS,EAAE,CAAC;SACb,CACF,CAAC;QAEF,IAAI,SAAS,IAAI,IAAI,EAAE,CAAC;YACtB,QAAQ,CAAC,OAAO,CAAC,SAAS,CAAC,CAAC;QAC9B,CAAC;QAED,OAAO,GAAG,EAAE;YACV,IAAI,SAAS,EAAE,CAAC;gBACd,QAAQ,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;YAChC,CAAC;YACD,gBAAgB,CAAC,MAAM,EAAE,CAAC;QAC5B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,gBAAgB,EAAE,IAAI,CAAC,CAAC,CAAC;IAE7B,OAAO,CACL,KAAC,eAAe,IAAC,SAAS,EAAE,MAAM,CAAC,UAAU,EAAE,YAAY,EAAE,YAAY,YACtE,OAAO,IAAI,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,GAAG,KAAK,EAAE,MAAM,EAAE,CAAC,GAC9C,CACnB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
||||
3
dist/react/video-player/components/with-lazy/with-lazy.module.scss
vendored
Normal file
3
dist/react/video-player/components/with-lazy/with-lazy.module.scss
vendored
Normal file
@@ -0,0 +1,3 @@
|
||||
.lazyHolder {
|
||||
background: var(--Default-BgDarken, #f2f2f2);
|
||||
}
|
||||
Reference in New Issue
Block a user