react-video-seek-slider
Advanced tools
Comparing version 6.0.9 to 7.0.0
/*! For license information please see index.js.LICENSE.txt */ | ||
(()=>{"use strict";var e={20:(e,t,r)=>{var s=r(800),o=Symbol.for("react.element"),i=Symbol.for("react.fragment"),n=Object.prototype.hasOwnProperty,a=s.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,c={key:!0,ref:!0,__self:!0,__source:!0};function u(e,t,r){var s,i={},u=null,m=null;for(s in void 0!==r&&(u=""+r),void 0!==t.key&&(u=""+t.key),void 0!==t.ref&&(m=t.ref),t)n.call(t,s)&&!c.hasOwnProperty(s)&&(i[s]=t[s]);if(e&&e.defaultProps)for(s in t=e.defaultProps)void 0===i[s]&&(i[s]=t[s]);return{$$typeof:o,type:e,key:u,ref:m,props:i,_owner:a.current}}t.Fragment=i,t.jsx=u,t.jsxs=u},848:(e,t,r)=>{e.exports=r(20)},800:e=>{e.exports=require("react")}},t={};function r(s){var o=t[s];if(void 0!==o)return o.exports;var i=t[s]={exports:{}};return e[s](i,i.exports,r),i.exports}r.d=(e,t)=>{for(var s in t)r.o(t,s)&&!r.o(e,s)&&Object.defineProperty(e,s,{enumerable:!0,get:t[s]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};r.r(s),r.d(s,{VideoSeekSlider:()=>v});var o=r(848),i=r(800);const n=(e,t,r)=>e>=t&&e<=r;function a(e,t,r,s){const o=n(e,t,r);return s?1:o?(e-t)/(r-t):0}const c=(0,i.memo)((({label:e="",startTime:t,maxTime:r,endTime:s,currentTime:i,seekHoverTime:n,bufferTime:c,isTimePassed:u=!1,isBufferPassed:m=!1,isHoverPassed:l=!1,onHover:d=()=>{},withGap:f})=>{const v=100*t/(r||-1),h=(s-t)/r*100,p="main"+(f?" with-gap":""),T=a(i,t,s,u),x=a(n,t,s,l),b=a(c,t,s,m);return(0,o.jsxs)("div",{className:p,onMouseMove:()=>d(e),style:{width:`${h}%`,left:`${v}%`},children:[(0,o.jsx)("div",{className:"inner-seek-block buffered","data-test-id":"test-buffered",style:{transform:`scaleX(${b})`}}),(0,o.jsx)("div",{className:"inner-seek-block seek-hover","data-test-id":"test-seek-hover",style:{transform:`scaleX(${x})`}}),(0,o.jsx)("div",{className:"inner-seek-block connect",style:{transform:`scaleX(${T})`}})]})}));function u(e,t,r){const s=100*t/r;return Math.floor(e/100*+s)}const m=(e,t,r)=>t+1<e.length?e[t+1].fromMs:r,l=({max:e=1e3,currentTime:t=0,bufferTime:r=0,seekHoverPosition:s=0,timeCodes:a,trackWidth:l,mobileSeeking:d,label:f,setLabel:v})=>{const h=u(e,s,l),p=(0,i.useCallback)((e=>{f!==e&&v(e)}),[f]);return(0,i.useEffect)((()=>{if(!d)return;const r=a?.find((({fromMs:r},s)=>{const o=m(a,s,e);return n(t,r,o)}));r?.description!==f&&v(r?.description||"")}),[t,f,e,a]),(0,o.jsx)(o.Fragment,{children:a?.map((({fromMs:s,description:i},u)=>{const l=m(a,u,e),d=l<=t,f=l<=r,v=l<=h;let T=n(t,s,l);const x=d||!T?0:t;T=n(r,s,l);const b=f||!T?0:r;T=n(h,s,l);const g=v||!T?0:h;return(0,o.jsx)(c,{label:i,maxTime:e,startTime:s,endTime:l,isTimePassed:d,isBufferPassed:f,isHoverPassed:v,currentTime:x,bufferTime:b,seekHoverTime:g,onHover:p,withGap:!0},s)}))})};const d=({max:e,hoverTimeValue:t,offset:r,trackWidth:s,seekHoverPosition:n,isThumbActive:a,limitTimeTooltipBySides:c,label:u,minutesPrefix:m,secondsPrefix:l,getPreviewScreenUrl:d})=>{const f=(0,i.useRef)(null),v=a?"hover-time active":"hover-time",h=function(e,t,r,s){let o=0;return t&&(o=e-t.offsetWidth/2,s&&(o<0?o=0:o+t.offsetWidth>r&&(o=r-t.offsetWidth))),{transform:`translateX(${o}px)`}}(n,f?.current,s,c),p=function(e,t,r=0,s="",o=""){const i=function(e,t=0){const r=Math.round(e/1e3+t),s=Math.floor(r/3600),o=r%3600,i=Math.floor(o/60),n=Math.ceil(o%60);return{hh:s.toString(),mm:i<10?`0${i}`:i.toString(),ss:n<10?`0${n}`:n.toString()}}(t,r);return e+r<6e4?o+i.ss:e+r<36e5?`${s+i.mm}:${i.ss}`:`${i.hh}:${i.mm}:${i.ss}`}(e,t,r,m,l);return(0,o.jsxs)("div",{className:v,style:h,ref:f,"data-testid":"hover-time",children:[a&&d&&(0,o.jsx)("div",{className:"preview-screen",style:{backgroundImage:`url(${d(t)})`}}),u&&(0,o.jsx)("div",{children:u}),p]})},f=({max:e,currentTime:t,isThumbActive:r})=>(0,o.jsx)("div",{className:"thumb active","data-testid":"testThumb",style:{left:`calc(${t/e*100}% + -6px)`},children:(0,o.jsx)("div",{className:"handler"})}),v=({max:e=1e3,currentTime:t=0,bufferTime:r=0,hideThumbTooltip:s=!1,offset:a=0,secondsPrefix:v="",minutesPrefix:h="",limitTimeTooltipBySides:p=!0,timeCodes:T,onChange:x=()=>{},getPreviewScreenUrl:b})=>{const[g,k]=(0,i.useState)(0),[w,y]=(0,i.useState)(""),P=(0,i.useRef)(!1),S=(0,i.useRef)(!1),j=(0,i.useRef)(null),_=j.current?.offsetWidth||0,M=g>0||P.current,E=u(e,g,_),$=t=>{const r=j.current?.getBoundingClientRect(),s=r?.left||0,o=r?.width||0;let i=t-s;i=i<0?0:i,i=i>o?o:i;const n=+(100*i/o*(e/100)).toFixed(0);k(i),x(n,n+a)},L=e=>{if(e.preventDefault(),e.stopPropagation(),!S.current)return;const{changedTouches:t}=e;let r=t?.[t.length-1]?.pageX||0;r=r<0?0:r,$(r)},O=e=>{P.current&&$(e.pageX)},N=(e,t)=>{const r=j.current?.getBoundingClientRect().left||0,s=e?0:t.pageX-r;k(s)},H=(e=!0)=>{S.current=e,k(e?g:0)},R=(e,t)=>{t.preventDefault(),O(t),P.current=e,k(e?g:0)},B=e=>{R(!1,e)},C=()=>{H(!1)};return(0,i.useEffect)((()=>{if(!S.current)return;const r=T?.find((({fromMs:r},s)=>{const o=m(T,s,e);return n(t,r,o)}));r?.description!==w&&y(r?.description||"")}),[t,w,e,T]),(0,i.useEffect)((()=>(window.addEventListener("mousemove",O),window.addEventListener("mouseup",B),window.addEventListener("touchmove",L),window.addEventListener("touchend",C),()=>{window.removeEventListener("mousemove",O),window.removeEventListener("mouseup",B),window.removeEventListener("touchmove",L),window.removeEventListener("touchend",C)})),[e,a,_]),(0,o.jsxs)("div",{className:"ui-video-seek-slider",children:[(0,o.jsxs)("div",{className:M?"track active":"track",ref:j,onMouseMove:e=>N(!1,e),onMouseLeave:e=>N(!0,e),onMouseDown:e=>R(!0,e),onTouchStart:()=>H(!0),"data-testid":"main-track",children:[Boolean(T?.length)&&(0,o.jsx)(l,{currentTime:t,max:e,bufferTime:r,seekHoverPosition:g,timeCodes:T,mobileSeeking:S.current,trackWidth:_,label:w,setLabel:y}),!T&&(0,o.jsx)(c,{maxTime:e,startTime:0,endTime:e,currentTime:t,bufferTime:r,seekHoverTime:E})]}),!s&&(0,o.jsx)(d,{max:e,hoverTimeValue:E,isThumbActive:M,label:w,limitTimeTooltipBySides:p,offset:a,seekHoverPosition:g,trackWidth:_,getPreviewScreenUrl:b,minutesPrefix:h,secondsPrefix:v}),(0,o.jsx)(f,{max:e,currentTime:t,isThumbActive:M})]})};var h=exports;for(var p in s)h[p]=s[p];s.__esModule&&Object.defineProperty(h,"__esModule",{value:!0})})(); | ||
(()=>{"use strict";var e={698:(e,t)=>{var r=Symbol.for("react.transitional.element"),s=Symbol.for("react.fragment");function i(e,t,s){var i=null;if(void 0!==s&&(i=""+s),void 0!==t.key&&(i=""+t.key),"key"in t)for(var n in s={},t)"key"!==n&&(s[n]=t[n]);else s=t;return t=s.ref,{$$typeof:r,type:e,key:i,ref:void 0!==t?t:null,props:s}}t.Fragment=s,t.jsx=i,t.jsxs=i},848:(e,t,r)=>{e.exports=r(698)}},t={};function r(s){var i=t[s];if(void 0!==i)return i.exports;var n=t[s]={exports:{}};return e[s](n,n.exports,r),n.exports}r.d=(e,t)=>{for(var s in t)r.o(t,s)&&!r.o(e,s)&&Object.defineProperty(e,s,{enumerable:!0,get:t[s]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),r.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};r.r(s),r.d(s,{VideoSeekSlider:()=>v});var i=r(848);const n=require("react"),o=(e,t,r)=>e>=t&&e<=r;function a(e,t,r,s){const i=o(e,t,r);return s?1:i?(e-t)/(r-t):0}const c=(0,n.memo)((({label:e="",startTime:t,maxTime:r,endTime:s,currentTime:n,seekHoverTime:o,bufferTime:c,isTimePassed:m=!1,isBufferPassed:u=!1,isHoverPassed:l=!1,onHover:d=()=>{},withGap:f})=>{const v=100*t/(r||-1),h=(s-t)/r*100,T="main"+(f?" with-gap":""),x=a(n,t,s,m),p=a(o,t,s,l),b=a(c,t,s,u);return(0,i.jsxs)("div",{className:T,onMouseMove:()=>d(e),style:{width:`${h}%`,left:`${v}%`},children:[(0,i.jsx)("div",{className:"inner-seek-block buffered","data-test-id":"test-buffered",style:{transform:`scaleX(${b})`}}),(0,i.jsx)("div",{className:"inner-seek-block seek-hover","data-test-id":"test-seek-hover",style:{transform:`scaleX(${p})`}}),(0,i.jsx)("div",{className:"inner-seek-block connect",style:{transform:`scaleX(${x})`}})]})}));function m(e,t,r){const s=100*t/r;return Math.floor(e/100*+s)}const u=(e,t,r)=>t+1<e.length?e[t+1].fromMs:r,l=({max:e=1e3,currentTime:t=0,bufferTime:r=0,seekHoverPosition:s=0,timeCodes:a,trackWidth:l,mobileSeeking:d,label:f,setLabel:v})=>{const h=m(e,s,l),T=(0,n.useCallback)((e=>{f!==e&&v(e)}),[f]);return(0,n.useEffect)((()=>{if(!d)return;const r=a?.find((({fromMs:r},s)=>{const i=u(a,s,e);return o(t,r,i)}));r?.description!==f&&v(r?.description||"")}),[t,f,e,a]),(0,i.jsx)(i.Fragment,{children:a?.map((({fromMs:s,description:n},m)=>{const l=u(a,m,e),d=l<=t,f=l<=r,v=l<=h;let x=o(t,s,l);const p=d||!x?0:t;x=o(r,s,l);const b=f||!x?0:r;x=o(h,s,l);const k=v||!x?0:h;return(0,i.jsx)(c,{label:n,maxTime:e,startTime:s,endTime:l,isTimePassed:d,isBufferPassed:f,isHoverPassed:v,currentTime:p,bufferTime:b,seekHoverTime:k,onHover:T,withGap:!0},s)}))})};const d=({max:e,hoverTimeValue:t,offset:r,trackWidth:s,seekHoverPosition:o,isThumbActive:a,limitTimeTooltipBySides:c,label:m,minutesPrefix:u,secondsPrefix:l,getPreviewScreenUrl:d})=>{const f=(0,n.useRef)(null),v=a?"hover-time active":"hover-time",h=function(e,t,r,s){let i=0;return t&&(i=e-t.offsetWidth/2,s&&(i<0?i=0:i+t.offsetWidth>r&&(i=r-t.offsetWidth))),{transform:`translateX(${i}px)`}}(o,f?.current,s,c),T=function(e,t,r=0,s="",i=""){const n=function(e,t=0){const r=Math.round(e/1e3+t),s=Math.floor(r/3600),i=r%3600,n=Math.floor(i/60),o=Math.ceil(i%60);return{hh:s.toString(),mm:n<10?`0${n}`:n.toString(),ss:o<10?`0${o}`:o.toString()}}(t,r);return e+r<6e4?i+n.ss:e+r<36e5?`${s+n.mm}:${n.ss}`:`${n.hh}:${n.mm}:${n.ss}`}(e,t,r,u,l);return(0,i.jsxs)("div",{className:v,style:h,ref:f,"data-testid":"hover-time",children:[a&&d&&(0,i.jsx)("div",{className:"preview-screen",style:{backgroundImage:`url(${d(t)})`}}),m&&(0,i.jsx)("div",{children:m}),T]})},f=({max:e,currentTime:t,isThumbActive:r})=>(0,i.jsx)("div",{className:"thumb active","data-testid":"testThumb",style:{left:`calc(${t/e*100}% + -6px)`},children:(0,i.jsx)("div",{className:"handler"})}),v=({max:e=1e3,currentTime:t=0,bufferTime:r=0,hideThumbTooltip:s=!1,offset:a=0,secondsPrefix:v="",minutesPrefix:h="",limitTimeTooltipBySides:T=!0,timeCodes:x,onChange:p=()=>{},getPreviewScreenUrl:b})=>{const[k,g]=(0,n.useState)(0),[y,w]=(0,n.useState)(""),P=(0,n.useRef)(!1),j=(0,n.useRef)(!1),S=(0,n.useRef)(null),M=S.current?.offsetWidth||0,$=k>0||P.current,E=m(e,k,M),H=t=>{const r=S.current?.getBoundingClientRect(),s=r?.left||0,i=r?.width||0;let n=t-s;n=n<0?0:n,n=n>i?i:n;const o=+(100*n/i*(e/100)).toFixed(0);g(n),p(o,o+a)},L=e=>{if(e.preventDefault(),e.stopPropagation(),!j.current)return;const{changedTouches:t}=e;let r=t?.[t.length-1]?.pageX||0;r=r<0?0:r,H(r)},N=e=>{P.current&&H(e.pageX)},B=(e,t)=>{const r=S.current?.getBoundingClientRect().left||0,s=e?0:t.pageX-r;g(s)},W=(e=!0)=>{j.current=e,g(e?k:0)},C=(e,t)=>{t.preventDefault(),N(t),P.current=e,g(e?k:0)},X=e=>{C(!1,e)},O=()=>{W(!1)};return(0,n.useEffect)((()=>{if(!j.current)return;const r=x?.find((({fromMs:r},s)=>{const i=u(x,s,e);return o(t,r,i)}));r?.description!==y&&w(r?.description||"")}),[t,y,e,x]),(0,n.useEffect)((()=>(window.addEventListener("mousemove",N),window.addEventListener("mouseup",X),window.addEventListener("touchmove",L),window.addEventListener("touchend",O),()=>{window.removeEventListener("mousemove",N),window.removeEventListener("mouseup",X),window.removeEventListener("touchmove",L),window.removeEventListener("touchend",O)})),[e,a,M]),(0,i.jsxs)("div",{className:"ui-video-seek-slider",children:[(0,i.jsxs)("div",{className:$?"track active":"track",ref:S,onMouseMove:e=>B(!1,e),onMouseLeave:e=>B(!0,e),onMouseDown:e=>C(!0,e),onTouchStart:()=>W(!0),"data-testid":"main-track",children:[Boolean(x?.length)&&(0,i.jsx)(l,{currentTime:t,max:e,bufferTime:r,seekHoverPosition:k,timeCodes:x,mobileSeeking:j.current,trackWidth:M,label:y,setLabel:w}),!x&&(0,i.jsx)(c,{maxTime:e,startTime:0,endTime:e,currentTime:t,bufferTime:r,seekHoverTime:E})]}),!s&&(0,i.jsx)(d,{max:e,hoverTimeValue:E,isThumbActive:$,label:y,limitTimeTooltipBySides:T,offset:a,seekHoverPosition:k,trackWidth:M,getPreviewScreenUrl:b,minutesPrefix:h,secondsPrefix:v}),(0,i.jsx)(f,{max:e,currentTime:t,isThumbActive:$})]})};var h=exports;for(var T in s)h[T]=s[T];s.__esModule&&Object.defineProperty(h,"__esModule",{value:!0})})(); |
{ | ||
"name": "react-video-seek-slider", | ||
"description": "React video seek slider like youtube", | ||
"version": "6.0.9", | ||
"version": "7.0.0", | ||
"main": "/index.js", | ||
@@ -30,4 +30,4 @@ "author": "Sergey Egorov", | ||
"@types/jest": "^28.1.6", | ||
"@types/react": "18.0.15", | ||
"@types/react-dom": "18.0.6", | ||
"@types/react": "^19.0.2", | ||
"@types/react-dom": "^19.0.2", | ||
"@typescript-eslint/eslint-plugin": "^5.6.0", | ||
@@ -59,4 +59,4 @@ "@typescript-eslint/parser": "^5.6.0", | ||
"prettier": "^2.5.1", | ||
"react": "18.2.0", | ||
"react-dom": "18.2.0", | ||
"react": "^19.0.0", | ||
"react-dom": "^19.0.0", | ||
"sass": "1.39.0", | ||
@@ -78,5 +78,5 @@ "sass-loader": "12.1.0", | ||
"peerDependencies": { | ||
"react": ">=16.8.0 && <19.0.0", | ||
"react-dom": ">=16.8.0 && <19.0.0" | ||
"react": ">=19.0.0", | ||
"react-dom": ">=19.0.0" | ||
} | ||
} |
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
0
16901