@vidispine/vdt-react-timeline 23.2.0-pre.1 → 23.2.0

package/dist/index.umd.cjs

@@ -0,0 +1,6 @@
+(function(_,g){typeof exports=="object"&&typeof module<"u"?g(exports,require("react/jsx-runtime"),require("react"),require("lodash.clamp"),require("clsx"),require("react-is"),require("react-konva"),require("lodash.sortby"),require("lodash.uniq")):typeof define=="function"&&define.amd?define(["exports","react/jsx-runtime","react","lodash.clamp","clsx","react-is","react-konva","lodash.sortby","lodash.uniq"],g):(_=typeof globalThis<"u"?globalThis:_||self,g(_["@vidispine/vdt-react-timeline"]={},_.jsxRuntime,_.react,_._clamp,_.clsx,_.reactIs,_.reactKonva,_._sortBy,_._uniq))})(this,function(_,g,j,ne,Q,je,V,Be,Ge){"use strict";const z=(r,i,s,n,l)=>r+(l-s)*(i-r)/(n-s),xe=(r,i,s)=>{process.env.NODE_ENV==="development"&&console[s](`${r?`${r}: `:""}${i}`)},K={error:(...r)=>xe(...r,"error"),warn:(...r)=>xe(...r,"warn")};function Xe(r,i){const s=[];for(let n=0;n<r.length-1;n+=1)s.push(i(r[n],r[n+1]));return s}function ie(...r){const i=getComputedStyle(document.body);return r.map(s=>i.getPropertyValue(s))}function $e({uncontrolledDefaultState:r=void 0,uncontrolledOnChange:i=void 0,controlledState:s=void 0,controlledOnChange:n=void 0,componentName:l,stateName:o}){const[f,d]=j.useState(r),m=j.useRef(null),h=a=>{m.current!==null&&m.current!==a&&(a?K.warn(l,`${o} changed from uncontrolled to controlled`):K.warn(l,`${o} changed from controlled to uncontrolled`)),m.current=a};return s!==void 0?(h(!0),[s,n]):(h(!1),[f,n?(...a)=>{i?i(d,...a):d(...a),n(...a)}:i||d])}function Ye(r,i,s){const n=s.end-s.start<100&&r==="in"?1:2;return r==="in"?1/n:n}function Ue({start:r,end:i,defaultPerspective:s,perspective:n,onChangePerspective:l,zoomMultiplier:o=Ye}){const[f,d]=$e({uncontrolledDefaultState:s||{start:r,end:i},controlledState:n,controlledOnChange:l,componentName:"VdtTimeline",stateName:"perspective"}),m=typeof o=="function"?o:c=>c==="in"?1/o:o,h=(c,p)=>{d({start:ne(Number(c),r,i),end:ne(Number(p),r,i)})};return{perspective:f,setPerspective:h,zoom:(c,p)=>{const P=f.end-f.start,E=(p-f.start)/P,T=m(c,p,f);if(T===1)return;const k=(f.end-f.start)*T,L=p-E*k,N=p+(1-E)*k,H=(()=>r>L?r-L:N>i?i-N:0)();h(L+H,N+H)}}}const le=j.createContext();function Ce({start:r,end:i,time:s,onChangeTime:n,timelineRef:l,children:o,perspective:f,onChangePerspective:d,defaultPerspective:m}){const h=Ue({start:r,end:i,perspective:f,onChangePerspective:d,defaultPerspective:m}),a=j.useMemo(()=>({...h,start:r,end:i,time:s,onChangeTime:n,timelineRef:l}),[i,n,r,s,h,l]);return g.jsx(le.Provider,{value:a,children:o})}function re(){return j.useContext(le)}var e={},Re={get exports(){return e},set exports(r){e=r}};/*
+object-assign
+(c) Sindre Sorhus
+@license MIT
+*/var ue,Ae;function Ze(){if(Ae)return ue;Ae=1;var r=Object.getOwnPropertySymbols,i=Object.prototype.hasOwnProperty,s=Object.prototype.propertyIsEnumerable;function n(o){if(o==null)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(o)}function l(){try{if(!Object.assign)return!1;var o=new String("abc");if(o[5]="de",Object.getOwnPropertyNames(o)[0]==="5")return!1;for(var f={},d=0;d<10;d++)f["_"+String.fromCharCode(d)]=d;var m=Object.getOwnPropertyNames(f).map(function(a){return f[a]});if(m.join("")!=="0123456789")return!1;var h={};return"abcdefghijklmnopqrst".split("").forEach(function(a){h[a]=a}),Object.keys(Object.assign({},h)).join("")==="abcdefghijklmnopqrst"}catch{return!1}}return ue=l()?Object.assign:function(o,f){for(var d,m=n(o),h,a=1;a<arguments.length;a++){d=Object(arguments[a]);for(var c in d)i.call(d,c)&&(m[c]=d[c]);if(r){h=r(d);for(var p=0;p<h.length;p++)s.call(d,h[p])&&(m[h[p]]=d[h[p]])}}return m},ue}var de,De;function fe(){if(De)return de;De=1;var r="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED";return de=r,de}var pe,Ie;function We(){return Ie||(Ie=1,pe=Function.call.bind(Object.prototype.hasOwnProperty)),pe}var ve,Le;function Fe(){if(Le)return ve;Le=1;var r=function(){};if(process.env.NODE_ENV!=="production"){var i=fe(),s={},n=We();r=function(o){var f="Warning: "+o;typeof console<"u"&&console.error(f);try{throw new Error(f)}catch{}}}function l(o,f,d,m,h){if(process.env.NODE_ENV!=="production"){for(var a in o)if(n(o,a)){var c;try{if(typeof o[a]!="function"){var p=Error((m||"React class")+": "+d+" type `"+a+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof o[a]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw p.name="Invariant Violation",p}c=o[a](f,a,m,d,null,i)}catch(E){c=E}if(c&&!(c instanceof Error)&&r((m||"React class")+": type specification of "+d+" `"+a+"` is invalid; the type checker function must return `null` or an `Error` but returned a "+typeof c+". You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument)."),c instanceof Error&&!(c.message in s)){s[c.message]=!0;var P=h?h():"";r("Failed "+d+" type: "+c.message+(P??""))}}}}return l.resetWarningCache=function(){process.env.NODE_ENV!=="production"&&(s={})},ve=l,ve}var he,_e;function Je(){if(_e)return he;_e=1;var r=je,i=Ze(),s=fe(),n=We(),l=Fe(),o=function(){};process.env.NODE_ENV!=="production"&&(o=function(d){var m="Warning: "+d;typeof console<"u"&&console.error(m);try{throw new Error(m)}catch{}});function f(){return null}return he=function(d,m){var h=typeof Symbol=="function"&&Symbol.iterator,a="@@iterator";function c(t){var u=t&&(h&&t[h]||t[a]);if(typeof u=="function")return u}var p="<<anonymous>>",P={array:L("array"),bigint:L("bigint"),bool:L("boolean"),func:L("function"),number:L("number"),object:L("object"),string:L("string"),symbol:L("symbol"),any:N(),arrayOf:H,element:W(),elementType:x(),instanceOf:$,node:M(),objectOf:q,oneOf:B,oneOfType:I,shape:J,exact:A};function E(t,u){return t===u?t!==0||1/t===1/u:t!==t&&u!==u}function T(t,u){this.message=t,this.data=u&&typeof u=="object"?u:{},this.stack=""}T.prototype=Error.prototype;function k(t){if(process.env.NODE_ENV!=="production")var u={},C=0;function b(D,S,w,v,y,R,U){if(v=v||p,R=R||w,U!==s){if(m){var X=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use `PropTypes.checkPropTypes()` to call them. Read more at http://fb.me/use-check-prop-types");throw X.name="Invariant Violation",X}else if(process.env.NODE_ENV!=="production"&&typeof console<"u"){var te=v+":"+w;!u[te]&&C<3&&(o("You are manually calling a React.PropTypes validation function for the `"+R+"` prop on `"+v+"`. This is deprecated and will throw in the standalone `prop-types` package. You may be seeing this warning due to a third-party PropTypes library. See https://fb.me/react-warning-dont-call-proptypes for details."),u[te]=!0,C++)}}return S[w]==null?D?S[w]===null?new T("The "+y+" `"+R+"` is marked as required "+("in `"+v+"`, but its value is `null`.")):new T("The "+y+" `"+R+"` is marked as required in "+("`"+v+"`, but its value is `undefined`.")):null:t(S,w,v,y,R)}var O=b.bind(null,!1);return O.isRequired=b.bind(null,!0),O}function L(t){function u(C,b,O,D,S,w){var v=C[b],y=Z(v);if(y!==t){var R=ee(v);return new T("Invalid "+D+" `"+S+"` of type "+("`"+R+"` supplied to `"+O+"`, expected ")+("`"+t+"`."),{expectedType:t})}return null}return k(u)}function N(){return k(f)}function H(t){function u(C,b,O,D,S){if(typeof t!="function")return new T("Property `"+S+"` of component `"+O+"` has invalid PropType notation inside arrayOf.");var w=C[b];if(!Array.isArray(w)){var v=Z(w);return new T("Invalid "+D+" `"+S+"` of type "+("`"+v+"` supplied to `"+O+"`, expected an array."))}for(var y=0;y<w.length;y++){var R=t(w,y,O,D,S+"["+y+"]",s);if(R instanceof Error)return R}return null}return k(u)}function W(){function t(u,C,b,O,D){var S=u[C];if(!d(S)){var w=Z(S);return new T("Invalid "+O+" `"+D+"` of type "+("`"+w+"` supplied to `"+b+"`, expected a single ReactElement."))}return null}return k(t)}function x(){function t(u,C,b,O,D){var S=u[C];if(!r.isValidElementType(S)){var w=Z(S);return new T("Invalid "+O+" `"+D+"` of type "+("`"+w+"` supplied to `"+b+"`, expected a single ReactElement type."))}return null}return k(t)}function $(t){function u(C,b,O,D,S){if(!(C[b]instanceof t)){var w=t.name||p,v=ke(C[b]);return new T("Invalid "+D+" `"+S+"` of type "+("`"+v+"` supplied to `"+O+"`, expected ")+("instance of `"+w+"`."))}return null}return k(u)}function B(t){if(!Array.isArray(t))return process.env.NODE_ENV!=="production"&&(arguments.length>1?o("Invalid arguments supplied to oneOf, expected an array, got "+arguments.length+" arguments. A common mistake is to write oneOf(x, y, z) instead of oneOf([x, y, z])."):o("Invalid argument supplied to oneOf, expected an array.")),f;function u(C,b,O,D,S){for(var w=C[b],v=0;v<t.length;v++)if(E(w,t[v]))return null;var y=JSON.stringify(t,function(U,X){var te=ee(X);return te==="symbol"?String(X):X});return new T("Invalid "+D+" `"+S+"` of value `"+String(w)+"` "+("supplied to `"+O+"`, expected one of "+y+"."))}return k(u)}function q(t){function u(C,b,O,D,S){if(typeof t!="function")return new T("Property `"+S+"` of component `"+O+"` has invalid PropType notation inside objectOf.");var w=C[b],v=Z(w);if(v!=="object")return new T("Invalid "+D+" `"+S+"` of type "+("`"+v+"` supplied to `"+O+"`, expected an object."));for(var y in w)if(n(w,y)){var R=t(w,y,O,D,S+"."+y,s);if(R instanceof Error)return R}return null}return k(u)}function I(t){if(!Array.isArray(t))return process.env.NODE_ENV!=="production"&&o("Invalid argument supplied to oneOfType, expected an instance of array."),f;for(var u=0;u<t.length;u++){var C=t[u];if(typeof C!="function")return o("Invalid argument supplied to oneOfType. Expected an array of check functions, but received "+we(C)+" at index "+u+"."),f}function b(O,D,S,w,v){for(var y=[],R=0;R<t.length;R++){var U=t[R],X=U(O,D,S,w,v,s);if(X==null)return null;X.data&&n(X.data,"expectedType")&&y.push(X.data.expectedType)}var te=y.length>0?", expected one of type ["+y.join(", ")+"]":"";return new T("Invalid "+w+" `"+v+"` supplied to "+("`"+S+"`"+te+"."))}return k(b)}function M(){function t(u,C,b,O,D){return G(u[C])?null:new T("Invalid "+O+" `"+D+"` supplied to "+("`"+b+"`, expected a ReactNode."))}return k(t)}function F(t,u,C,b,O){return new T((t||"React class")+": "+u+" type `"+C+"."+b+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+O+"`.")}function J(t){function u(C,b,O,D,S){var w=C[b],v=Z(w);if(v!=="object")return new T("Invalid "+D+" `"+S+"` of type `"+v+"` "+("supplied to `"+O+"`, expected `object`."));for(var y in t){var R=t[y];if(typeof R!="function")return F(O,D,S,y,ee(R));var U=R(w,y,O,D,S+"."+y,s);if(U)return U}return null}return k(u)}function A(t){function u(C,b,O,D,S){var w=C[b],v=Z(w);if(v!=="object")return new T("Invalid "+D+" `"+S+"` of type `"+v+"` "+("supplied to `"+O+"`, expected `object`."));var y=i({},C[b],t);for(var R in y){var U=t[R];if(n(t,R)&&typeof U!="function")return F(O,D,S,R,ee(U));if(!U)return new T("Invalid "+D+" `"+S+"` key `"+R+"` supplied to `"+O+"`.\nBad object: "+JSON.stringify(C[b],null,"  ")+`
+Valid keys: `+JSON.stringify(Object.keys(t),null,"  "));var X=U(w,R,O,D,S+"."+R,s);if(X)return X}return null}return k(u)}function G(t){switch(typeof t){case"number":case"string":case"undefined":return!0;case"boolean":return!t;case"object":if(Array.isArray(t))return t.every(G);if(t===null||d(t))return!0;var u=c(t);if(u){var C=u.call(t),b;if(u!==t.entries){for(;!(b=C.next()).done;)if(!G(b.value))return!1}else for(;!(b=C.next()).done;){var O=b.value;if(O&&!G(O[1]))return!1}}else return!1;return!0;default:return!1}}function Y(t,u){return t==="symbol"?!0:u?u["@@toStringTag"]==="Symbol"||typeof Symbol=="function"&&u instanceof Symbol:!1}function Z(t){var u=typeof t;return Array.isArray(t)?"array":t instanceof RegExp?"object":Y(u,t)?"symbol":u}function ee(t){if(typeof t>"u"||t===null)return""+t;var u=Z(t);if(u==="object"){if(t instanceof Date)return"date";if(t instanceof RegExp)return"regexp"}return u}function we(t){var u=ee(t);switch(u){case"array":case"object":return"an "+u;case"boolean":case"date":case"regexp":return"a "+u;default:return u}}function ke(t){return!t.constructor||!t.constructor.name?p:t.constructor.name}return P.checkPropTypes=l,P.resetWarningCache=l.resetWarningCache,P.PropTypes=P,P},he}var ye,qe;function Qe(){if(qe)return ye;qe=1;var r=fe();function i(){}function s(){}return s.resetWarningCache=i,ye=function(){function n(f,d,m,h,a,c){if(c!==r){var p=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw p.name="Invariant Violation",p}}n.isRequired=n;function l(){return n}var o={array:n,bigint:n,bool:n,func:n,number:n,object:n,string:n,symbol:n,any:n,arrayOf:l,element:n,elementType:n,instanceOf:l,node:n,objectOf:l,oneOf:l,oneOfType:l,shape:l,exact:l,checkPropTypes:s,resetWarningCache:i};return o.PropTypes=o,o},ye}if(process.env.NODE_ENV!=="production"){var Ke=je,et=!0;Re.exports=Je()(Ke.isElement,et)}else Re.exports=Qe()();const dt="";function me({start:r,end:i,time:s,onChangeTime:n,children:l,className:o,perspective:f,onChangePerspective:d,defaultPerspective:m,zoomMultiplier:h,...a}){const c=j.useRef();return g.jsx(Ce,{start:r,end:i,time:s,onChangeTime:n,timelineRef:c,perspective:f,onChangePerspective:d,defaultPerspective:m,zoomMultiplier:h,children:g.jsx("div",{ref:c,className:Q("VdtTimeline-root",o),...a,children:l})})}me.propTypes={start:e.number.isRequired,end:e.number.isRequired,time:e.number,children:e.oneOfType([e.arrayOf(e.node),e.node]),onChangeTime:e.func,perspective:e.shape({start:e.number,end:e.number}),onChangePerspective:e.func,defaultPerspective:e.shape({start:e.number,end:e.number}),zoomMultiplier:e.oneOfType([e.number,e.func]),className:e.string},me.defaultProps={time:void 0,children:void 0,onChangeTime:void 0,perspective:void 0,onChangePerspective:void 0,defaultPerspective:void 0,zoomMultiplier:void 0,className:void 0};const Me=15,Ve=100,ft="",[tt]=ie("--vdt-timeline-palette-secondary"),Ne=document.createElement("img");Ne.src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7";function ge({className:r,perspective:i,time:s,lineWidth:n,headWidth:l,headHeight:o,style:f,onDrag:d,HeadProps:m,...h}){var q;const{perspective:a,time:c,onChangeTime:p}=re()||{perspective:i,time:s};a===void 0&&K.error("VdtTimelinePlayhead","missing 'perspective' prop. If the component is used outside a VdtTimelineContext, 'perspective' must be passed explicitly");const P=j.useRef(),E=(q=P.current)==null?void 0:q.parentElement,T=(E==null?void 0:E.clientWidth)||0,[k,L]=j.useState(!1),[N,H]=j.useState(c),W=z(0,T,a.start,a.end,N),x=I=>I<=a.end&&I>=a.start,$=!x(N);j.useEffect(()=>{c!==void 0&&!k&&H(c)},[c,k]);const B=d||p&&((I,...M)=>p(...M));return g.jsx("div",{ref:P,className:Q("VdtTimelinePlayhead-root",r),style:{width:n,left:W,display:$&&"none",zIndex:Ve,...f},draggable:!0,onDragStart:I=>(L(!0),I.dataTransfer.setDragImage(Ne,0,0),!1),onDragEnd:()=>{L(!1),B!=null&&B.flush&&B.flush()},onDrag:I=>{if(B){const{x:M}=P.current.parentElement.getBoundingClientRect(),F=z(a.start,a.end,0,T,I.clientX-M);if(x(F)){const J=ne(F,a.start,a.end);B(I,J),H(J)}}},...h,children:g.jsx("div",{className:"VdtTimelinePlayhead-head",style:{position:"absolute",height:o,width:l,backgroundColor:tt,left:-(l/2-n/2),top:-o+1,clipPath:"polygon(0% 0%, 0% 70%, 50% 100%, 100% 70%, 100% 0%)"},...m})})}ge.propTypes={style:e.instanceOf(Object),headHeight:e.number,headWidth:e.number,lineWidth:e.number,perspective:e.shape({start:e.number,end:e.number}),time:e.number,onDrag:e.func,HeadProps:e.instanceOf(Object),className:e.string},ge.defaultProps={style:{},headHeight:16,headWidth:12,lineWidth:2,perspective:void 0,time:0,onDrag:void 0,HeadProps:{},className:void 0};function oe(r){const[i,s]=j.useState({}),n=j.useRef(new ResizeObserver(l=>{var f;const o=(f=l[0])==null?void 0:f.contentRect;o&&s(o)}));return j.useEffect(()=>{const l=n==null?void 0:n.current,o=r==null?void 0:r.current;return o&&l.observe(o),()=>{o&&l.unobserve(o)}},[r]),i}const pt="",vt="",[rt]=ie("--vdt-timeline-palette-primary"),nt=j.memo(({amplitudeSegments:r,pxPerTimeUnit:i,start:s,height:n,...l})=>r.map(({amplitude:o,start:f,end:d},m)=>{const h=i*(d-f),a=(f-s)*i,c=n*o,p=(n-c)/2;return g.jsx(V.Rect,{x:a,y:p,height:c,width:h,fill:rt,...l},m)}));function Te({className:r,waveform:i,start:s,end:n,perspective:l,StageProps:o,LayerProps:f,RectProps:d,WaveRectProps:m,...h}){const{start:a,end:c,perspective:p}=re()||{start:s,end:n,perspective:l};(a===void 0||c===void 0||p===void 0)&&K.error("VdtTimelineWaveform","missing 'start', 'end' or 'perspective' props. If the component is used outside a VdtTimelineContext, 'start', 'end' or 'perspective' must be passed explicitly");const P=j.useRef(),{width:E=0,height:T=0}=oe(P),k=j.useMemo(()=>i.map((W,x)=>({amplitude:W,start:z(a,c,0,i.length-1,x),end:z(a,c,0,i.length-1,x+1)})),[i,a,c]),L=E/(c-a),N=(c-a)/(p.end-p.start),H=z(0,N*E,a,c,p.start);return g.jsx("div",{ref:P,className:Q("VdtTimelineWaveform-root",r),...h,children:g.jsx(V.Stage,{height:T,width:E,x:-H,scaleX:N,...o,children:g.jsxs(V.Layer,{listening:!1,...f,children:[g.jsx(V.Rect,{x:0,y:0,width:E,height:T,...d}),g.jsx(nt,{amplitudeSegments:k,pxPerTimeUnit:L,start:a,height:T,...m})]})})})}Te.propTypes={waveform:e.arrayOf(e.number),start:e.number,end:e.number,perspective:e.shape({start:e.number,end:e.number}),StageProps:e.instanceOf(Object),LayerProps:e.instanceOf(Object),RectProps:e.instanceOf(Object),WaveRectProps:e.instanceOf(Object),className:e.string},Te.defaultProps={waveform:[],start:void 0,end:void 0,perspective:void 0,StageProps:{},LayerProps:{},RectProps:{},WaveRectProps:{},className:void 0};function se({hoverEffect:r=()=>{}}={}){const[i,s]=j.useState(!1),n=j.useRef(null);return{isHovering:i,onMouseEnter:l=>{s(!0),n.current=r(l)},onMouseLeave:()=>{s(!1),n.current&&n.current(),n.current=null}}}const[it,ot]=ie("--vdt-timeline-palette-primary","--vdt-timeline-palette-primary-dark"),be=5;function Pe({onClick:r,x:i,width:s,y:n,height:l,padding:o,start:f,end:d,onHover:m,onMove:h,onMoveStart:a,onMoveEnd:c,onResize:p,onResizeStart:P,onResizeEnd:E,...T}){[i,s,n,l].some(A=>A===void 0)&&K.error("VdtTimelineEvent","missing 'x', 'width', 'y', or 'height' props. If the component is not used as a direct child of VdtTimelineTrack, 'x', 'width', 'y', or 'height' must be passed explicitly");const k=j.useRef(),{isHovering:L,...N}=se({hoverEffect:A=>(m&&m(A,!0),()=>{m&&m(A,!1)})}),{isHovering:H,...W}=se({hoverEffect:A=>(p&&(A.target.getStage().container().style.cursor="col-resize"),()=>{p&&(A.target.getStage().container().style.cursor="default")})}),[x,$]=j.useState(!1),B=!!r;j.useEffect(()=>{if(k.current){const A=(()=>x?"grabbing":L&&B?"pointer":"default")();k.current.getStage().container().style.cursor=A}},[x,L,B]);const q=n+o,I=l-2*o,M={y:q,height:I,x:i,width:s},F=L||H?{fill:ot}:{},J=A=>{const G=A==="start"?i:i+s-be;return{onDragStart:()=>{P&&P(A)},draggable:!!p,dragBoundFunc:Y=>({x:Y.x,y:q}),onDragEnd:()=>{E&&E(A)},width:be,x:G,onDragMove:Y=>{if(!p)return;const{x:Z}=Y.target.position();Y.target.x(G);const ee=Math.floor(z(f,d,i,i+s,Z+(A==="start"?0:be)));p(Y,A,ee)}}};return g.jsxs(g.Fragment,{children:[g.jsx(V.Rect,{ref:k,draggable:!!h,dragBoundFunc:A=>({x:A.x,y:q}),onDragStart:A=>{h&&($(!0),a&&a(A))},onDragEnd:A=>{h&&($(!1),c&&c(A))},onDragMove:A=>{if(!h)return;const{x:G}=A.target.position();A.target.x(i);const Y=Math.floor(z(f,d,i,i+s,G));h(A,Y)},fill:it,onClick:r,...M,...F,...N,...T}),g.jsx(V.Rect,{...M,...W,...J("start")}),g.jsx(V.Rect,{...M,...W,...J("end")})]})}Pe.propTypes={onClick:e.func,onHover:e.func,onMove:e.func,onMoveStart:e.func,onMoveEnd:e.func,onResize:e.func,onResizeStart:e.func,onResizeEnd:e.func,x:e.number,width:e.number,y:e.number,height:e.number,padding:e.number,start:e.number.isRequired,end:e.number.isRequired,className:e.string},Pe.defaultProps={onClick:void 0,onHover:void 0,onMove:void 0,onMoveStart:void 0,onMoveEnd:void 0,onResize:void 0,onResizeStart:void 0,onResizeEnd:void 0,x:void 0,width:void 0,y:0,height:Me,padding:1,className:void 0};function Oe({className:r,children:i,perspective:s,onClick:n,style:l,onHover:o,StageProps:f,LayerProps:d,GroupProps:m,RectProps:h,...a}){const{perspective:c}=re()||{perspective:s};c===void 0&&K.error("VdtTimelineTrack","missing 'perspective' prop. If the component is used outside a VdtTimelineContext, 'perspective' must be passed explicitly");const p=j.Children.toArray(i).filter(({props:W={}})=>!(W.start>c.end||W.end<c.start)),P=j.useRef(),{width:E=0,height:T=0}=oe(P),k=Math.max(...j.Children.map(i,({props:{y:W=0,height:x=0}={}})=>W+x))||Me,L=W=>{const{start:x,end:$}=W.props||{},B=(()=>{if(x!==void 0&&$!==void 0){const q=z(0,E,c.start,c.end,x),I=z(0,E,c.start,c.end,$)-q;return{x:q,width:I}}return{}})();return j.cloneElement(W,{...W.props,...B})},{isHovering:N,...H}=se({hoverEffect:W=>{o&&o(W,!0);const x=W.target.getStage().container();return n&&(x.style.cursor="pointer"),()=>{o&&o(W,!1),n&&(x.style.cursor="default")}}});return g.jsx("div",{ref:P,className:Q("VdtTimelineTrack-root",r),style:{height:k,...l},...a,children:g.jsx(V.Stage,{height:T,width:E,...f,children:g.jsx(V.Layer,{...d,children:g.jsxs(V.Group,{...m,children:[g.jsx(V.Rect,{x:0,y:0,width:E,height:T,onClick:n,...H,...h}),j.Children.map(p,L)]})})})})}Oe.propTypes={children(r,i,s){const n=r[i];let l;return j.Children.forEach(n,o=>{const{props:{start:f,end:d}={}}=o;(f===void 0||d===void 0)&&(l=new Error(`children of ${s} must be passed a 'start' and 'end' prop. These props are used to position the child within the track.`))}),l},perspective:e.shape({start:e.number,end:e.number}),onClick:e.func,onHover:e.func,StageProps:e.instanceOf(Object),LayerProps:e.instanceOf(Object),GroupProps:e.instanceOf(Object),RectProps:e.instanceOf(Object),className:e.string,style:e.instanceOf(Object)},Oe.defaultProps={style:{},children:void 0,perspective:void 0,onClick:void 0,onHover:void 0,StageProps:{},LayerProps:{},GroupProps:{},RectProps:{},className:void 0};const ht="";function ae({className:r,children:i,label:s,LabelProps:n,LabelTextProps:l,...o}){return g.jsxs("div",{className:Q("VdtTimelineRow-root",r,{"VdtTimelineRow-hasLabel":!!s}),...o,children:[s&&g.jsx("div",{className:"VdtTimelineRow-label",...n,children:g.jsx("span",{className:"VdtTimelineRow-labelText",...l,children:s})}),i]})}ae.propTypes={children:e.oneOfType([e.arrayOf(e.node),e.node]),label:e.node,LabelProps:e.instanceOf(Object),LabelTextProps:e.instanceOf(Object),className:e.string,style:e.instanceOf(Object)},ae.defaultProps={children:void 0,label:void 0,LabelProps:{},LabelTextProps:{},className:void 0,style:{}};const yt="",He=2,[st,at]=ie("--vdt-timeline-palette-text-primary","--vdt-timeline-palette-text-secondary");function ct({x:r,y:i,minX:s,maxX:n,label:l,TickGroupProps:o,TickTextProps:f,TickLineProps:d}){const m=l!==void 0,{color:h,tickWidth:a,tickSize:c}=m?{color:st,tickWidth:2,tickSize:8}:{color:at,tickWidth:1,tickSize:4},[p,P]=j.useState(),E=j.useRef();j.useEffect(()=>{E.current&&P(E.current.getTextWidth())},[]);const T=ne(r-p/2,s+He,n-p-He)||void 0;return r<s||r>n?null:g.jsxs(V.Group,{...o,children:[g.jsx(V.Text,{ref:E,x:T,y:i-c-20,fontFamily:"Helvetica",text:l,fontStyle:"bold",fontSize:10,fill:h,...f}),g.jsx(V.Line,{points:[r,i-c,r,i],stroke:h,strokeWidth:a,...d})]})}function ze({width:r,perspective:i}){const s=Math.max(Math.floor(r/90),2),n=Ge([...Array(s).keys()].map(o=>z(i.start,i.end,0,s-1,o))).map(o=>({time:o,label:String(Math.round(o))})),l=Xe(n,(o,f)=>{const d=(f.time-o.time)/10;return[...Array(9).keys()].map(m=>({time:o.time+(m+1)*d}))}).flat();return Be([...n,...l],["time"])}function Se({className:r,children:i,ticks:s,onClick:n,onHover:l,onWheel:o,onDrag:f,start:d,end:m,perspective:h,timelineRef:a,StageProps:c,LayerProps:p,GroupProps:P,RectProps:E,TickGroupProps:T,TickTextProps:k,TickLineProps:L,...N}){var S,w;const{start:H,end:W,perspective:x,setPerspective:$,zoom:B,onChangeTime:q,timelineRef:I}=re()||{start:d,end:m,perspective:h,timelineRef:a};(H===void 0||W===void 0||x===void 0)&&K.error("VdtTimelinePlayheadTrack","missing 'start', 'end' or 'perspective' props. If the component is used outside a VdtTimelineContext, 'start', 'end' and 'perspective' must be passed explicitly"),I===void 0&&(i==null?void 0:i.length)>0&&K.warn("VdtTimelinePlayheadTrack","missing 'timelineRef' prop. This ref is used to set the height of the playhead within the timeline.");const M=o||B&&((v,...y)=>B(...y)),F=n||q&&((v,...y)=>q(...y)),J=f||$&&((v,...y)=>$(...y)),A=j.useRef(),{width:G=0,height:Y=0}=oe(A),Z=s||ze,we=(typeof Z=="function"?Z({start:H,end:W,width:G,perspective:x}):Z).map(({label:v,time:y})=>({x:z(0,G,x.start,x.end,y),label:v,time:y})),{height:ke}=oe(I),t=(((S=A==null?void 0:A.current)==null?void 0:S.offsetTop)||0)-(((w=I==null?void 0:I.current)==null?void 0:w.offsetTop)||0),u=Y,C=ke-Y-t||void 0,b=j.useRef(),{isHovering:O,...D}=se({hoverEffect:v=>{l&&l(v,!0);const y=v.target.getStage().container();return F&&(y.style.cursor="pointer"),()=>{l&&l(v,!1),F&&(y.style.cursor="default")}}});return g.jsxs("div",{ref:A,className:Q("VdtTimelinePlayheadTrack-root",r),...N,children:[j.Children.map(i,v=>j.cloneElement(v,{style:{top:u,height:C}})),g.jsx(V.Stage,{height:Y,width:G,...c,children:g.jsx(V.Layer,{...p,children:g.jsxs(V.Group,{onClick:v=>{if(b.current&&F){const{x:y}=b.current.getRelativePointerPosition();F(v,z(x.start,x.end,0,G,y))}},onWheel:v=>{if(b.current&&M){const{x:y}=b.current.getRelativePointerPosition();M(v,v.evt.deltaY<0?"in":"out",z(x.start,x.end,0,G,y))}},draggable:!0,dragBoundFunc:()=>({x:0,y:0}),onDragStart:v=>{const y=v.target.getStage().container();y.style.cursor="grabbing"},onDragEnd:v=>{const y=v.target.getStage().container();y.style.cursor="pointer"},onDragMove:v=>{if(J){const{movementX:y}=v.evt;if(y===0)return;const R=z(x.start,x.end,0,G,-y),U=x.end-x.start,X=ne(R,H,W-U),te=X+U;J(v,X,te)}},...D,...P,children:[g.jsx(V.Rect,{ref:b,x:0,y:0,width:G,height:Y,...E}),we.map(({x:v,label:y,time:R})=>g.jsx(ct,{minX:0,maxX:G,x:v,label:y,y:Y,TickGroupProps:T,TickLineProps:L,TickTextProps:k},R))]})})})]})}Se.propTypes={onClick:e.func,onHover:e.func,ticks:e.oneOfType([e.arrayOf(e.shape({time:e.number,label:e.string})),e.func]),onWheel:e.func,onDrag:e.func,children:e.oneOfType([e.arrayOf(e.node),e.node]),start:e.number,end:e.number,perspective:e.shape({start:e.number,end:e.number}),timelineRef:e.shape({current:e.instanceOf(Element)}),StageProps:e.instanceOf(Object),LayerProps:e.instanceOf(Object),GroupProps:e.instanceOf(Object),RectProps:e.instanceOf(Object),TickGroupProps:e.instanceOf(Object),TickTextProps:e.instanceOf(Object),TickLineProps:e.instanceOf(Object),className:e.string,style:e.instanceOf(Object)},Se.defaultProps={onClick:void 0,onHover:void 0,ticks:ze,children:void 0,start:void 0,end:void 0,perspective:void 0,onWheel:void 0,onDrag:void 0,timelineRef:void 0,StageProps:{},LayerProps:{},GroupProps:{},RectProps:{},TickGroupProps:{},TickTextProps:{},TickLineProps:{},className:void 0,style:{}};const mt="",[lt]=ie("--vdt-timeline-palette-secondary");function ce({className:r,onScroll:i,onClick:s,start:n,end:l,perspective:o,style:f,StageProps:d,LayerProps:m,RectProps:h,...a}){const{start:c,end:p,perspective:P,setPerspective:E}=re()||{start:n,end:l,perspective:o};(c===void 0||p===void 0||P===void 0)&&K.error("VdtTimelineScroll","missing 'start', 'end' or 'perspective' props. If the component is used outside a VdtTimelineContext, 'start', 'end' and 'perspective' must be passed explicitly");const T=j.useRef(),{width:k=0,height:L=0}=oe(T),N=z(0,k,c,p,P.start),H=P.end-P.start,W=z(0,k,0,p-c,H),x=i||E&&((q,...I)=>E(...I)),$=s||E&&((q,...I)=>E(...I)),B=c!==P.start||p!==P.end;return g.jsx("div",{className:Q("VdtTimelineScroll-root",r),style:{display:!B&&"none",zIndex:Ve+1,...f},ref:T,...a,children:g.jsx(V.Stage,{height:L,width:k,onClick:q=>{if(!$)return;const{x:I}=q.currentTarget.getRelativePointerPosition();let M;I>N+W?M=Math.floor(z(c,p,0,k,I-W)):I<N&&(M=Math.floor(z(c,p,0,k,I))),M!==void 0&&M!==P.start&&$(q,M,M+H)},...d,children:g.jsx(V.Layer,{...m,children:g.jsx(V.Rect,{x:N,y:0,width:W,height:L,fill:lt,draggable:!0,dragBoundFunc:q=>({x:ne(q.x,0,k-W),y:0}),onDragMove:q=>{if(!x)return;const{x:I}=q.target.position();q.target.x(N);const M=Math.floor(z(c,p,0,k,I));x(q,M,M+H)},...h})})})})}ce.propTypes={onScroll:e.func,onClick:e.func,start:e.number,end:e.number,perspective:e.shape({start:e.number,end:e.number}),style:e.instanceOf(Object),StageProps:e.instanceOf(Object),LayerProps:e.instanceOf(Object),RectProps:e.instanceOf(Object),className:e.string},ce.defaultProps={onScroll:void 0,onClick:void 0,start:void 0,end:void 0,perspective:void 0,style:{},StageProps:{},LayerProps:{},RectProps:{},className:void 0};const gt="";function ut(r,{start:i,end:s}){return Math.floor(.02*(i-s))}function Ee({className:r,children:i,getScrollDistance:s,RowProps:n,ScrollProps:l,...o}){const{start:f,end:d,perspective:m,setPerspective:h}=re();return g.jsxs("div",{className:Q("VdtTimelineScrollContainer-root",r),onWheel:a=>{if(a.shiftKey){const c=s(a,{start:f,end:d,perspective:m}),p=m.start+(a.deltaY>0?-c:c),P=m.end-m.start,E=p+P;E>d?h(d-P,d):p<f?h(f,P):h(p,E)}},...o,children:[i,g.jsx(ae,{className:Q("VdtTimelineScrollContainer-timelineRow"),...n,children:g.jsx(ce,{...l})})]})}Ee.propTypes={className:e.string,children:e.oneOfType([e.arrayOf(e.node),e.node]),getScrollDistance:e.func,RowProps:e.instanceOf(Object),ScrollProps:e.instanceOf(Object)},Ee.defaultProps={children:void 0,getScrollDistance:ut,RowProps:{},ScrollProps:{},className:void 0},_.Timeline=me,_.TimelineContext=le,_.TimelineEvent=Pe,_.TimelinePlayhead=ge,_.TimelinePlayheadTrack=Se,_.TimelineProvider=Ce,_.TimelineRow=ae,_.TimelineScroll=ce,_.TimelineScrollContainer=Ee,_.TimelineTrack=Oe,_.TimelineWaveform=Te,_.useTimeline=re,Object.defineProperty(_,Symbol.toStringTag,{value:"Module"})});

package/dist/style.css

@@ -0,0 +1 @@
+.VdtTimeline-root{display:flex;flex-direction:column;padding:0 8px 8px;background-color:var(--vdt-timeline-palette-background-primary)}.VdtTimelinePlayhead-root{background-color:var(--vdt-timeline-palette-secondary);position:absolute}.VdtTimelinePlayhead-root:hover{cursor:ew-resize}.VdtTimelineWaveform-root{height:40px}.VdtTimelineRow-root{display:flex}.VdtTimelineRow-root.VdtTimelineRow-hasLabel:hover{background-color:var(--vdt-timeline-palette-background-hover)}.VdtTimelineRow-root.VdtTimelineRow-hasLabel{border-width:2px 0 0 0;border-style:solid;border-color:var(--vdt-timeline-palette-background-secondary)}.VdtTimelineRow-root.VdtTimelineRow-hasLabel>:first-child{width:98px;border-width:0 2px 0 0;border-style:solid;border-color:var(--vdt-timeline-palette-background-secondary)}.VdtTimelineRow-root>:not(.VdtTimelineRow-label){flex-grow:1;margin:4px 0}.VdtTimelineRow-root:not(.VdtTimelineRow-hasLabel)>:first-child{margin-left:100px}.VdtTimelineRow-label{display:flex;align-items:center;flex-basis:98px}.VdtTimelineRow-labelText{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;padding:0 8px}.VdtTimelinePlayheadTrack-root{height:40px;position:relative}:root{--vdt-timeline-palette-primary: #49a6dd;--vdt-timeline-palette-primary-dark: #3c8bb8;--vdt-timeline-palette-secondary: #f50057;--vdt-timeline-palette-background-primary: #20232a;--vdt-timeline-palette-background-secondary: #282c34;--vdt-timeline-palette-background-hover: rgba(255, 255, 255, .08);--vdt-timeline-palette-text-primary: #fff;--vdt-timeline-palette-text-secondary: rgba(255, 255, 255, .7)}.VdtTimelineScroll-root{height:4px;background-color:var(--vdt-timeline-palette-background-secondary)}.VdtTimelineScrollContainer-timelineRow>:not(.VdtTimelineRow-label){margin:0}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vidispine/vdt-react-timeline",
-  "version": "23.2.0-pre.1",
+  "version": "23.2.0",
   "license": "SEE LICENSE IN LICENSE.md",
   "publishConfig": {
     "access": "public"
@@ -12,21 +12,26 @@
     "url": "https://github.com/vidispine/vdt.git",
     "directory": "packages/vdt-react-timeline"
   },
-  "main": "dist/index.js",
-  "module": "dist/index.js",
-  "sideEffects": false,
+  "type": "module",
+  "main": "./dist/index.umd.cjs",
+  "module": "./dist/index.js",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/index.umd.cjs"
+    }
+  },
   "files": [
     "dist"
   ],
   "scripts": {
-    "build": "rimraf dist && rollup -c",
-    "build:watch": "yarn build -w --environment DEVELOPMENT",
-    "lint": "eslint . --max-warnings=0",
+    "build": "yarn vite build",
+    "build:watch": "yarn vite build --watch --mode development",
+    "lint": "eslint . --cache --max-warnings=0 --ext .js,.jsx,.ts,.tsx,.md,.mdx",
     "format": "prettier . --check"
   },
   "dependencies": {
-    "@babel/runtime": "^7.21.0",
-    "@vidispine/vdt-js": "23.2.0-pre.1",
+    "@vidispine/vdt-js": "23.2.0",
     "clsx": "^1.2.1",
     "konva": "^8.4.2",
     "lodash.clamp": "^4.0.3",
@@ -39,25 +44,15 @@
     "react-dom": "^17.0.0"
   },
   "devDependencies": {
-    "@babel/core": "7.21.0",
-    "@babel/plugin-external-helpers": "7.18.6",
-    "@babel/plugin-transform-runtime": "7.21.0",
-    "@babel/preset-env": "7.20.2",
-    "@babel/preset-react": "7.18.6",
-    "@rollup/plugin-babel": "5.3.1",
-    "@rollup/plugin-commonjs": "21.1.0",
-    "@rollup/plugin-node-resolve": "13.3.0",
-    "@vidispine/eslint-config-mdx": "23.2.0-pre.1",
-    "@vidispine/eslint-config-react": "23.2.0-pre.1",
-    "@vidispine/eslint-config-storybook": "23.2.0-pre.1",
-    "@vidispine/prettier-config": "23.2.0-pre.1",
-    "babel-plugin-transform-react-remove-prop-types": "0.4.24",
+    "@vidispine/eslint-config-mdx": "23.2.0",
+    "@vidispine/eslint-config-react": "23.2.0",
+    "@vidispine/eslint-config-storybook": "23.2.0",
+    "@vidispine/prettier-config": "23.2.0",
+    "@vitejs/plugin-react": "3.1.0",
     "eslint": "8.34.0",
     "prettier": "2.8.4",
     "prop-types": "15.8.1",
-    "rimraf": "3.0.2",
-    "rollup": "2.79.1",
-    "rollup-plugin-styles": "4.0.0"
+    "vite": "4.3.1"
   },
   "eslintConfig": {
     "extends": [

package/dist/Timeline/Timeline.js

@@ -1,10 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { useRef } from 'react';
-import clsx from 'clsx';
-import { TimelineProvider } from '../TimelineContext.js';
-import { jsx } from 'react/jsx-runtime';
-
-var _excluded=["start","end","time","onChangeTime","children","className","perspective","onChangePerspective","defaultPerspective","zoomMultiplier"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;})),keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key]);}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}return target;}function Timeline(_ref){var start=_ref.start,end=_ref.end,time=_ref.time,onChangeTime=_ref.onChangeTime,children=_ref.children,className=_ref.className,perspective=_ref.perspective,onChangePerspective=_ref.onChangePerspective,defaultPerspective=_ref.defaultPerspective,zoomMultiplier=_ref.zoomMultiplier,props=_objectWithoutProperties(_ref,_excluded);var timelineRef=useRef();return/*#__PURE__*/jsx(TimelineProvider,{start:start,end:end,time:time,onChangeTime:onChangeTime,timelineRef:timelineRef,perspective:perspective,onChangePerspective:onChangePerspective,defaultPerspective:defaultPerspective,zoomMultiplier:zoomMultiplier,children:/*#__PURE__*/jsx("div",_objectSpread(_objectSpread({ref:timelineRef,className:clsx('VdtTimeline-root',className)},props),{},{children:children}))});}Timeline.defaultProps={time:undefined,children:undefined,onChangeTime:undefined,perspective:undefined,onChangePerspective:undefined,defaultPerspective:undefined,zoomMultiplier:undefined,className:undefined};
-
-export { Timeline as default };

package/dist/TimelineContext.js

@@ -1,8 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import { createContext, useMemo, useContext } from 'react';
-import useTimelinePerspective from './useTimelinePerspective.js';
-import { jsx } from 'react/jsx-runtime';
-
-function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;})),keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key]);}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}return target;}var TimelineContext=/*#__PURE__*/createContext();function TimelineProvider(_ref){var start=_ref.start,end=_ref.end,time=_ref.time,onChangeTime=_ref.onChangeTime,timelineRef=_ref.timelineRef,children=_ref.children,perspective=_ref.perspective,onChangePerspective=_ref.onChangePerspective,defaultPerspective=_ref.defaultPerspective;var timelinePerspective=useTimelinePerspective({start:start,end:end,perspective:perspective,onChangePerspective:onChangePerspective,defaultPerspective:defaultPerspective});var contextValue=useMemo(function(){return _objectSpread(_objectSpread({},timelinePerspective),{},{start:start,end:end,time:time,onChangeTime:onChangeTime,timelineRef:timelineRef});},[end,onChangeTime,start,time,timelinePerspective,timelineRef]);return/*#__PURE__*/jsx(TimelineContext.Provider,{value:contextValue,children:children});}function useTimeline(){return useContext(TimelineContext);}
-
-export { TimelineContext, TimelineProvider, useTimeline };

package/dist/TimelineEvent/TimelineEvent.js

@@ -1,13 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useRef, useState, useEffect } from 'react';
-import { Rect } from 'react-konva';
-import { DEFAULT_EVENT_HEIGHT } from '../_consts.js';
-import { vLog, interpolate, getStyleProperties } from '../_utils.js';
-import useHover from '../useHover.js';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-
-var _excluded=["onClick","x","width","y","height","padding","start","end","onHover","onMove","onMoveStart","onMoveEnd","onResize","onResizeStart","onResizeEnd"],_excluded2=["isHovering"],_excluded3=["isHovering"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;})),keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key]);}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}return target;}var _getStyleProperties=getStyleProperties('--vdt-timeline-palette-primary','--vdt-timeline-palette-primary-dark'),_getStyleProperties2=_slicedToArray(_getStyleProperties,2),palettePrimary=_getStyleProperties2[0],palettePrimaryDark=_getStyleProperties2[1];var EVENT_RESIZER_THUMB_WIDTH=5;function TimelineEvent(_ref){var onClick=_ref.onClick,x=_ref.x,width=_ref.width,y=_ref.y,height=_ref.height,padding=_ref.padding,start=_ref.start,end=_ref.end,onHover=_ref.onHover,onMove=_ref.onMove,onMoveStart=_ref.onMoveStart,onMoveEnd=_ref.onMoveEnd,onResize=_ref.onResize,onResizeStart=_ref.onResizeStart,onResizeEnd=_ref.onResizeEnd,props=_objectWithoutProperties(_ref,_excluded);if([x,width,y,height].some(function(v){return v===undefined;})){vLog.error('VdtTimelineEvent',"missing 'x', 'width', 'y', or 'height' props. If the component is not used as a direct child of VdtTimelineTrack, 'x', 'width', 'y', or 'height' must be passed explicitly");}var eventRef=useRef();var _useHover=useHover({hoverEffect:function hoverEffect(e){if(onHover)onHover(e,true);return function(){if(onHover)onHover(e,false);};}}),isHovering=_useHover.isHovering,hoverProps=_objectWithoutProperties(_useHover,_excluded2);var _useHover2=useHover({hoverEffect:function hoverEffect(e){if(onResize){e.target.getStage().container().style.cursor='col-resize';}return function(){if(onResize){e.target.getStage().container().style.cursor='default';}};}}),isHoveringResize=_useHover2.isHovering,resizeHoverProps=_objectWithoutProperties(_useHover2,_excluded3);var _useState=useState(false),_useState2=_slicedToArray(_useState,2),isMoving=_useState2[0],setIsMoving=_useState2[1];var hasOnClick=!!onClick;useEffect(function(){if(eventRef.current){var cursor=function(){if(isMoving)return 'grabbing';if(isHovering&&hasOnClick)return 'pointer';return 'default';}();eventRef.current.getStage().container().style.cursor=cursor;}},[isMoving,isHovering,hasOnClick]);var paddedY=y+padding;var paddedHeight=height-2*padding;var posProps={y:paddedY,height:paddedHeight,x:x,width:width};var defaultHoverProps=isHovering||isHoveringResize?{fill:palettePrimaryDark}:{};var resizerProps=function resizerProps(which){var resizerX=which==='start'?x:x+width-EVENT_RESIZER_THUMB_WIDTH;return {onDragStart:function onDragStart(){if(!onResizeStart)return;onResizeStart(which);},draggable:!!onResize,dragBoundFunc:function dragBoundFunc(pos){return {x:pos.x,y:paddedY};},onDragEnd:function onDragEnd(){if(!onResizeEnd)return;onResizeEnd(which);},width:EVENT_RESIZER_THUMB_WIDTH,x:resizerX,onDragMove:function onDragMove(e){if(!onResize)return;var _e$target$position=e.target.position(),newX=_e$target$position.x;e.target.x(resizerX);var newPos=Math.floor(interpolate(start,end,x,x+width,newX+(which==='start'?0:EVENT_RESIZER_THUMB_WIDTH)));onResize(e,which,newPos);}};};return/*#__PURE__*/jsxs(Fragment,{children:[/*#__PURE__*/jsx(Rect,_objectSpread(_objectSpread(_objectSpread(_objectSpread({ref:eventRef,draggable:!!onMove,dragBoundFunc:function dragBoundFunc(pos){return {x:pos.x,y:paddedY};},onDragStart:function onDragStart(e){if(!onMove)return;setIsMoving(true);if(onMoveStart){onMoveStart(e);}},onDragEnd:function onDragEnd(e){if(!onMove)return;setIsMoving(false);if(onMoveEnd){onMoveEnd(e);}},onDragMove:function onDragMove(e){if(!onMove)return;var _e$target$position2=e.target.position(),newX=_e$target$position2.x;e.target.x(x);var newStart=Math.floor(interpolate(start,end,x,x+width,newX));onMove(e,newStart);},fill:palettePrimary,onClick:onClick},posProps),defaultHoverProps),hoverProps),props)),/*#__PURE__*/jsx(Rect,_objectSpread(_objectSpread(_objectSpread({},posProps),resizeHoverProps),resizerProps('start'))),/*#__PURE__*/jsx(Rect,_objectSpread(_objectSpread(_objectSpread({},posProps),resizeHoverProps),resizerProps('end')))]});}TimelineEvent.defaultProps={onClick:undefined,onHover:undefined,onMove:undefined,onMoveStart:undefined,onMoveEnd:undefined,onResize:undefined,onResizeStart:undefined,onResizeEnd:undefined,x:undefined,width:undefined,y:0,height:DEFAULT_EVENT_HEIGHT,padding:1,className:undefined};
-
-export { TimelineEvent as default };

package/dist/TimelinePlayhead/TimelinePlayhead.js

@@ -1,14 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useRef, useState, useEffect } from 'react';
-import clsx from 'clsx';
-import clamp from 'lodash.clamp';
-import { DEFAULT_PLAYHEAD_ZINDEX } from '../_consts.js';
-import { vLog, interpolate, getStyleProperties } from '../_utils.js';
-import { useTimeline } from '../TimelineContext.js';
-import { jsx } from 'react/jsx-runtime';
-
-var _excluded=["className","perspective","time","lineWidth","headWidth","headHeight","style","onDrag","HeadProps"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;})),keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key]);}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}return target;}var _getStyleProperties=getStyleProperties('--vdt-timeline-palette-secondary'),_getStyleProperties2=_slicedToArray(_getStyleProperties,1),paletteSecondary=_getStyleProperties2[0];var EmptyImage=document.createElement('img');EmptyImage.src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7';function TimelinePlayhead(_ref){var _ref$current;var className=_ref.className,propPerspective=_ref.perspective,propTime=_ref.time,lineWidth=_ref.lineWidth,headWidth=_ref.headWidth,headHeight=_ref.headHeight,style=_ref.style,onDrag=_ref.onDrag,HeadProps=_ref.HeadProps,props=_objectWithoutProperties(_ref,_excluded);var _ref2=useTimeline()||{perspective:propPerspective,time:propTime},perspective=_ref2.perspective,time=_ref2.time,onChangeTime=_ref2.onChangeTime;if(perspective===undefined){vLog.error('VdtTimelinePlayhead',"missing 'perspective' prop. If the component is used outside a VdtTimelineContext, 'perspective' must be passed explicitly");}var ref=useRef();var containerEl=(_ref$current=ref.current)===null||_ref$current===void 0?void 0:_ref$current.parentElement;var containerWidth=(containerEl===null||containerEl===void 0?void 0:containerEl.clientWidth)||0;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),isDragging=_useState2[0],setIsDragging=_useState2[1];var _useState3=useState(time),_useState4=_slicedToArray(_useState3,2),localTime=_useState4[0],setLocalTime=_useState4[1];var markerLeft=interpolate(0,containerWidth,perspective.start,perspective.end,localTime);var isValidTime=function isValidTime(f){return f<=perspective.end&&f>=perspective.start;};var hide=!isValidTime(localTime);useEffect(function(){if(time!==undefined&&!isDragging){setLocalTime(time);}},[time,isDragging]);var handleDrag=onDrag||onChangeTime&&function(e){for(var _len=arguments.length,args=new Array(_len>1?_len-1:0),_key=1;_key<_len;_key++){args[_key-1]=arguments[_key];}return onChangeTime.apply(void 0,args);};return/*#__PURE__*/jsx("div",_objectSpread(_objectSpread({ref:ref,className:clsx('VdtTimelinePlayhead-root',className),style:_objectSpread({width:lineWidth,left:markerLeft,display:hide&&'none',zIndex:DEFAULT_PLAYHEAD_ZINDEX},style),draggable:true,onDragStart:function onDragStart(e){setIsDragging(true);e.dataTransfer.setDragImage(EmptyImage,0,0);return false;},onDragEnd:function onDragEnd(){setIsDragging(false);if(handleDrag!==null&&handleDrag!==void 0&&handleDrag.flush){handleDrag.flush();}},onDrag:function onDrag(e){if(handleDrag){var _ref$current$parentEl=ref.current.parentElement.getBoundingClientRect(),containerX=_ref$current$parentEl.x;var newTime=interpolate(perspective.start,perspective.end,0,containerWidth,e.clientX-containerX);if(isValidTime(newTime)){var clampedNewTime=clamp(newTime,perspective.start,perspective.end);handleDrag(e,clampedNewTime);setLocalTime(clampedNewTime);}}}},props),{},{children:/*#__PURE__*/jsx("div",_objectSpread({className:"VdtTimelinePlayhead-head",style:{position:'absolute',height:headHeight,width:headWidth,backgroundColor:paletteSecondary,left:-(headWidth/2-lineWidth/2),top:-headHeight+1,clipPath:'polygon(0% 0%, 0% 70%, 50% 100%, 100% 70%, 100% 0%)'}},HeadProps))}));}TimelinePlayhead.defaultProps={style:{},headHeight:16,headWidth:12,lineWidth:2,perspective:undefined,time:0,onDrag:undefined,HeadProps:{},className:undefined};
-
-export { TimelinePlayhead as default };

package/dist/TimelinePlayheadTrack/TimelinePlayheadTrack.js

@@ -1,19 +0,0 @@
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useRef, Children, cloneElement, useState, useEffect } from 'react';
-import clsx from 'clsx';
-import clamp from 'lodash.clamp';
-import sortBy from 'lodash.sortby';
-import uniq from 'lodash.uniq';
-import { Stage, Layer, Group, Rect, Text, Line } from 'react-konva';
-import { vLog, interpolate, getStyleProperties, mapPairs } from '../_utils.js';
-import { useTimeline } from '../TimelineContext.js';
-import useHover from '../useHover.js';
-import useResizeObserver from '../useResizeObserver.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var _excluded=["className","children","ticks","onClick","onHover","onWheel","onDrag","start","end","perspective","timelineRef","StageProps","LayerProps","GroupProps","RectProps","TickGroupProps","TickTextProps","TickLineProps"],_excluded2=["isHovering"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;})),keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key]);}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}return target;}var LABEL_EDGE_MARGIN=2;var _getStyleProperties=getStyleProperties('--vdt-timeline-palette-text-primary','--vdt-timeline-palette-text-secondary'),_getStyleProperties2=_slicedToArray(_getStyleProperties,2),paletteTextPrimary=_getStyleProperties2[0],paletteTextSecondary=_getStyleProperties2[1];function TimelineTick(_ref){var x=_ref.x,y=_ref.y,minX=_ref.minX,maxX=_ref.maxX,label=_ref.label,TickGroupProps=_ref.TickGroupProps,TickTextProps=_ref.TickTextProps,TickLineProps=_ref.TickLineProps;var hasLabel=label!==undefined;var _ref2=hasLabel?{color:paletteTextPrimary,tickWidth:2,tickSize:8}:{color:paletteTextSecondary,tickWidth:1,tickSize:4},color=_ref2.color,tickWidth=_ref2.tickWidth,tickSize=_ref2.tickSize;var _useState=useState(),_useState2=_slicedToArray(_useState,2),labelWidth=_useState2[0],setLabelWidth=_useState2[1];var textRef=useRef();useEffect(function(){if(textRef.current){setLabelWidth(textRef.current.getTextWidth());}},[]);var textX=clamp(x-labelWidth/2,minX+LABEL_EDGE_MARGIN,maxX-labelWidth-LABEL_EDGE_MARGIN)||undefined;if(x<minX||x>maxX){return null;}return/*#__PURE__*/jsxs(Group,_objectSpread(_objectSpread({},TickGroupProps),{},{children:[/*#__PURE__*/jsx(Text,_objectSpread({ref:textRef,x:textX,y:y-tickSize-20,fontFamily:"Helvetica",text:label,fontStyle:"bold",fontSize:10,fill:color},TickTextProps)),/*#__PURE__*/jsx(Line,_objectSpread({points:[x,y-tickSize,x,y],stroke:color,strokeWidth:tickWidth},TickLineProps))]}));}function defaultTicks(_ref3){var width=_ref3.width,perspective=_ref3.perspective;var numTicks=Math.max(Math.floor(width/90),2);var labeledTicks=uniq(_toConsumableArray(Array(numTicks).keys()).map(function(i){return interpolate(perspective.start,perspective.end,0,numTicks-1,i);})).map(function(time){return {time:time,label:String(Math.round(time))};});var unlabeledTicks=mapPairs(labeledTicks,function(curr,next){var tickDelta=(next.time-curr.time)/10;return _toConsumableArray(Array(9).keys()).map(function(i){return {time:curr.time+(i+1)*tickDelta};});}).flat();return sortBy([].concat(_toConsumableArray(labeledTicks),_toConsumableArray(unlabeledTicks)),['time']);}function TimelinePlayheadTrack(_ref4){var _trackContainerRef$cu,_timelineRef$current;var className=_ref4.className,children=_ref4.children,propTicks=_ref4.ticks,onClick=_ref4.onClick,onHover=_ref4.onHover,onWheel=_ref4.onWheel,onDrag=_ref4.onDrag,propStart=_ref4.start,propEnd=_ref4.end,propPerspective=_ref4.perspective,propTimelineRef=_ref4.timelineRef,StageProps=_ref4.StageProps,LayerProps=_ref4.LayerProps,GroupProps=_ref4.GroupProps,RectProps=_ref4.RectProps,TickGroupProps=_ref4.TickGroupProps,TickTextProps=_ref4.TickTextProps,TickLineProps=_ref4.TickLineProps,props=_objectWithoutProperties(_ref4,_excluded);var _ref5=useTimeline()||{start:propStart,end:propEnd,perspective:propPerspective,timelineRef:propTimelineRef},start=_ref5.start,end=_ref5.end,perspective=_ref5.perspective,setPerspective=_ref5.setPerspective,zoom=_ref5.zoom,onChangeTime=_ref5.onChangeTime,timelineRef=_ref5.timelineRef;if(start===undefined||end===undefined||perspective===undefined){vLog.error('VdtTimelinePlayheadTrack',"missing 'start', 'end' or 'perspective' props. If the component is used outside a VdtTimelineContext, 'start', 'end' and 'perspective' must be passed explicitly");}if(timelineRef===undefined&&(children===null||children===void 0?void 0:children.length)>0){vLog.warn('VdtTimelinePlayheadTrack',"missing 'timelineRef' prop. This ref is used to set the height of the playhead within the timeline.");}var handleWheel=onWheel||zoom&&function(e){for(var _len=arguments.length,args=new Array(_len>1?_len-1:0),_key=1;_key<_len;_key++){args[_key-1]=arguments[_key];}return zoom.apply(void 0,args);};var handleClick=onClick||onChangeTime&&function(e){for(var _len2=arguments.length,args=new Array(_len2>1?_len2-1:0),_key2=1;_key2<_len2;_key2++){args[_key2-1]=arguments[_key2];}return onChangeTime.apply(void 0,args);};var handleDrag=onDrag||setPerspective&&function(e){for(var _len3=arguments.length,args=new Array(_len3>1?_len3-1:0),_key3=1;_key3<_len3;_key3++){args[_key3-1]=arguments[_key3];}return setPerspective.apply(void 0,args);};var trackContainerRef=useRef();var _useResizeObserver=useResizeObserver(trackContainerRef),_useResizeObserver$wi=_useResizeObserver.width,width=_useResizeObserver$wi===void 0?0:_useResizeObserver$wi,_useResizeObserver$he=_useResizeObserver.height,height=_useResizeObserver$he===void 0?0:_useResizeObserver$he;var getTicks=propTicks||defaultTicks;var timeTicks=typeof getTicks==='function'?getTicks({start:start,end:end,width:width,perspective:perspective}):getTicks;var ticks=timeTicks.map(function(_ref6){var label=_ref6.label,time=_ref6.time;return {x:interpolate(0,width,perspective.start,perspective.end,time),label:label,time:time};});var _useResizeObserver2=useResizeObserver(timelineRef),timelineHeight=_useResizeObserver2.height;var timelineOffsetTop=((trackContainerRef===null||trackContainerRef===void 0?void 0:(_trackContainerRef$cu=trackContainerRef.current)===null||_trackContainerRef$cu===void 0?void 0:_trackContainerRef$cu.offsetTop)||0)-((timelineRef===null||timelineRef===void 0?void 0:(_timelineRef$current=timelineRef.current)===null||_timelineRef$current===void 0?void 0:_timelineRef$current.offsetTop)||0);var playheadTop=height;var playheadHeight=timelineHeight-height-timelineOffsetTop||undefined;var trackRectRef=useRef();var _useHover=useHover({hoverEffect:function hoverEffect(e){if(onHover)onHover(e,true);var container=e.target.getStage().container();if(handleClick){container.style.cursor='pointer';}return function(){if(onHover)onHover(e,false);if(handleClick){container.style.cursor='default';}};}});_useHover.isHovering;var hoverProps=_objectWithoutProperties(_useHover,_excluded2);return/*#__PURE__*/jsxs("div",_objectSpread(_objectSpread({ref:trackContainerRef,className:clsx('VdtTimelinePlayheadTrack-root',className)},props),{},{children:[Children.map(children,function(child){return/*#__PURE__*/cloneElement(child,{style:{top:playheadTop,height:playheadHeight}});}),/*#__PURE__*/jsx(Stage,_objectSpread(_objectSpread({height:height,width:width},StageProps),{},{children:/*#__PURE__*/jsx(Layer,_objectSpread(_objectSpread({},LayerProps),{},{children:/*#__PURE__*/jsxs(Group,_objectSpread(_objectSpread(_objectSpread({onClick:function onClick(e){if(trackRectRef.current&&handleClick){var _trackRectRef$current=trackRectRef.current.getRelativePointerPosition(),x=_trackRectRef$current.x;handleClick(e,interpolate(perspective.start,perspective.end,0,width,x));}},onWheel:function onWheel(e){if(trackRectRef.current&&handleWheel){var _trackRectRef$current2=trackRectRef.current.getRelativePointerPosition(),x=_trackRectRef$current2.x;handleWheel(e,e.evt.deltaY<0?'in':'out',interpolate(perspective.start,perspective.end,0,width,x));}},draggable:true,dragBoundFunc:function dragBoundFunc(){return {x:0,y:0};},onDragStart:function onDragStart(e){var container=e.target.getStage().container();container.style.cursor='grabbing';},onDragEnd:function onDragEnd(e){var container=e.target.getStage().container();container.style.cursor='pointer';},onDragMove:function onDragMove(e){if(handleDrag){var movementX=e.evt.movementX;if(movementX===0)return;var newStart=interpolate(perspective.start,perspective.end,0,width,-movementX);var perspectiveDuration=perspective.end-perspective.start;var clampedNewStart=clamp(newStart,start,end-perspectiveDuration);var newEnd=clampedNewStart+perspectiveDuration;handleDrag(e,clampedNewStart,newEnd);}}},hoverProps),GroupProps),{},{children:[/*#__PURE__*/jsx(Rect,_objectSpread({ref:trackRectRef,x:0,y:0,width:width,height:height},RectProps)),ticks.map(function(_ref7){var x=_ref7.x,label=_ref7.label,time=_ref7.time;return/*#__PURE__*/jsx(TimelineTick,{minX:0,maxX:width,x:x,label:label,y:height,TickGroupProps:TickGroupProps,TickLineProps:TickLineProps,TickTextProps:TickTextProps},time);})]}))}))}))]}));}TimelinePlayheadTrack.defaultProps={onClick:undefined,onHover:undefined,ticks:defaultTicks,children:undefined,start:undefined,end:undefined,perspective:undefined,onWheel:undefined,onDrag:undefined,timelineRef:undefined,StageProps:{},LayerProps:{},GroupProps:{},RectProps:{},TickGroupProps:{},TickTextProps:{},TickLineProps:{},className:undefined,style:{}};
-
-export { TimelinePlayheadTrack as default };

package/dist/TimelineRow/TimelineRow.js

@@ -1,8 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import clsx from 'clsx';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var _excluded=["className","children","label","LabelProps","LabelTextProps"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;})),keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key]);}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}return target;}function TimelineRow(_ref){var className=_ref.className,children=_ref.children,label=_ref.label,LabelProps=_ref.LabelProps,LabelTextProps=_ref.LabelTextProps,props=_objectWithoutProperties(_ref,_excluded);return/*#__PURE__*/jsxs("div",_objectSpread(_objectSpread({className:clsx('VdtTimelineRow-root',className,{'VdtTimelineRow-hasLabel':!!label})},props),{},{children:[label&&/*#__PURE__*/jsx("div",_objectSpread(_objectSpread({className:"VdtTimelineRow-label"},LabelProps),{},{children:/*#__PURE__*/jsx("span",_objectSpread(_objectSpread({className:"VdtTimelineRow-labelText"},LabelTextProps),{},{children:label}))})),children]}));}TimelineRow.defaultProps={children:undefined,label:undefined,LabelProps:{},LabelTextProps:{},className:undefined,style:{}};
-
-export { TimelineRow as default };

package/dist/TimelineScroll/TimelineScroll.js

@@ -1,16 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useRef } from 'react';
-import clsx from 'clsx';
-import clamp from 'lodash.clamp';
-import { Stage, Layer, Rect } from 'react-konva';
-import { DEFAULT_PLAYHEAD_ZINDEX } from '../_consts.js';
-import { vLog, interpolate, getStyleProperties } from '../_utils.js';
-import { useTimeline } from '../TimelineContext.js';
-import useResizeObserver from '../useResizeObserver.js';
-import { jsx } from 'react/jsx-runtime';
-
-var _excluded=["className","onScroll","onClick","start","end","perspective","style","StageProps","LayerProps","RectProps"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;})),keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key]);}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}return target;}var _getStyleProperties=getStyleProperties('--vdt-timeline-palette-secondary'),_getStyleProperties2=_slicedToArray(_getStyleProperties,1),paletteSecondary=_getStyleProperties2[0];function TimelineScroll(_ref){var className=_ref.className,onScroll=_ref.onScroll,onClick=_ref.onClick,propStart=_ref.start,propEnd=_ref.end,propPerspective=_ref.perspective,style=_ref.style,StageProps=_ref.StageProps,LayerProps=_ref.LayerProps,RectProps=_ref.RectProps,props=_objectWithoutProperties(_ref,_excluded);var _ref2=useTimeline()||{start:propStart,end:propEnd,perspective:propPerspective},start=_ref2.start,end=_ref2.end,perspective=_ref2.perspective,setPerspective=_ref2.setPerspective;if(start===undefined||end===undefined||perspective===undefined){vLog.error('VdtTimelineScroll',"missing 'start', 'end' or 'perspective' props. If the component is used outside a VdtTimelineContext, 'start', 'end' and 'perspective' must be passed explicitly");}var ref=useRef();var _useResizeObserver=useResizeObserver(ref),_useResizeObserver$wi=_useResizeObserver.width,scrollTrackWidth=_useResizeObserver$wi===void 0?0:_useResizeObserver$wi,_useResizeObserver$he=_useResizeObserver.height,height=_useResizeObserver$he===void 0?0:_useResizeObserver$he;var scrollLeft=interpolate(0,scrollTrackWidth,start,end,perspective.start);var perspectiveDuration=perspective.end-perspective.start;var scrollWidth=interpolate(0,scrollTrackWidth,0,end-start,perspectiveDuration);var handleScroll=onScroll||setPerspective&&function(e){for(var _len=arguments.length,args=new Array(_len>1?_len-1:0),_key=1;_key<_len;_key++){args[_key-1]=arguments[_key];}return setPerspective.apply(void 0,args);};var handleClick=onClick||setPerspective&&function(e){for(var _len2=arguments.length,args=new Array(_len2>1?_len2-1:0),_key2=1;_key2<_len2;_key2++){args[_key2-1]=arguments[_key2];}return setPerspective.apply(void 0,args);};var isZoomed=start!==perspective.start||end!==perspective.end;return/*#__PURE__*/jsx("div",_objectSpread(_objectSpread({className:clsx('VdtTimelineScroll-root',className),style:_objectSpread({display:!isZoomed&&'none',zIndex:DEFAULT_PLAYHEAD_ZINDEX+1},style),ref:ref},props),{},{children:/*#__PURE__*/jsx(Stage,_objectSpread(_objectSpread({height:height,width:scrollTrackWidth,onClick:function onClick(e){if(!handleClick)return;var _e$currentTarget$getR=e.currentTarget.getRelativePointerPosition(),x=_e$currentTarget$getR.x;var newStart;if(x>scrollLeft+scrollWidth){newStart=Math.floor(interpolate(start,end,0,scrollTrackWidth,x-scrollWidth));}else if(x<scrollLeft){newStart=Math.floor(interpolate(start,end,0,scrollTrackWidth,x));}if(newStart!==undefined&&newStart!==perspective.start){handleClick(e,newStart,newStart+perspectiveDuration);}}},StageProps),{},{children:/*#__PURE__*/jsx(Layer,_objectSpread(_objectSpread({},LayerProps),{},{children:/*#__PURE__*/jsx(Rect,_objectSpread({x:scrollLeft,y:0,width:scrollWidth,height:height,fill:paletteSecondary,draggable:true,dragBoundFunc:function dragBoundFunc(pos){return {x:clamp(pos.x,0,scrollTrackWidth-scrollWidth),y:0};},onDragMove:function onDragMove(e){if(!handleScroll)return;var _e$target$position=e.target.position(),x=_e$target$position.x;e.target.x(scrollLeft);var newStart=Math.floor(interpolate(start,end,0,scrollTrackWidth,x));handleScroll(e,newStart,newStart+perspectiveDuration);}},RectProps))}))}))}));}TimelineScroll.defaultProps={onScroll:undefined,onClick:undefined,start:undefined,end:undefined,perspective:undefined,style:{},StageProps:{},LayerProps:{},RectProps:{},className:undefined};
-
-export { TimelineScroll as default };

package/dist/TimelineScrollContainer/TimelineScrollContainer.js

@@ -1,11 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import clsx from 'clsx';
-import { useTimeline } from '../TimelineContext.js';
-import { jsxs, jsx } from 'react/jsx-runtime';
-import TimelineRow from '../TimelineRow/TimelineRow.js';
-import TimelineScroll from '../TimelineScroll/TimelineScroll.js';
-
-var _excluded=["className","children","getScrollDistance","RowProps","ScrollProps"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;})),keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key]);}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}return target;}function defaultGetScrollDistance(e,_ref){var start=_ref.start,end=_ref.end;return Math.floor(0.02*(start-end));}function TimelineScrollContainer(_ref2){var className=_ref2.className,children=_ref2.children,getScrollDistance=_ref2.getScrollDistance,RowProps=_ref2.RowProps,ScrollProps=_ref2.ScrollProps,props=_objectWithoutProperties(_ref2,_excluded);var _useTimeline=useTimeline(),start=_useTimeline.start,end=_useTimeline.end,perspective=_useTimeline.perspective,setPerspective=_useTimeline.setPerspective;return/*#__PURE__*/jsxs("div",_objectSpread(_objectSpread({className:clsx('VdtTimelineScrollContainer-root',className),onWheel:function onWheel(e){if(e.shiftKey){var delta=getScrollDistance(e,{start:start,end:end,perspective:perspective});var newPerspectiveStart=perspective.start+(e.deltaY>0?-delta:delta);var perspectiveDuration=perspective.end-perspective.start;var newPerspectiveEnd=newPerspectiveStart+perspectiveDuration;if(newPerspectiveEnd>end){setPerspective(end-perspectiveDuration,end);}else if(newPerspectiveStart<start){setPerspective(start,perspectiveDuration);}else {setPerspective(newPerspectiveStart,newPerspectiveEnd);}}}},props),{},{children:[children,/*#__PURE__*/jsx(TimelineRow,_objectSpread(_objectSpread({className:clsx('VdtTimelineScrollContainer-timelineRow')},RowProps),{},{children:/*#__PURE__*/jsx(TimelineScroll,_objectSpread({},ScrollProps))}))]}));}TimelineScrollContainer.defaultProps={children:undefined,getScrollDistance:defaultGetScrollDistance,RowProps:{},ScrollProps:{},className:undefined};
-
-export { TimelineScrollContainer as default };

package/dist/TimelineTrack/TimelineTrack.js

@@ -1,17 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { Children, useRef, cloneElement } from 'react';
-import clsx from 'clsx';
-import { Stage, Layer, Group, Rect } from 'react-konva';
-import { DEFAULT_EVENT_HEIGHT } from '../_consts.js';
-import { vLog, interpolate } from '../_utils.js';
-import { useTimeline } from '../TimelineContext.js';
-import useHover from '../useHover.js';
-import useResizeObserver from '../useResizeObserver.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-var _excluded=["className","children","perspective","onClick","style","onHover","StageProps","LayerProps","GroupProps","RectProps"],_excluded2=["isHovering"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;})),keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key]);}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}return target;}function TimelineTrack(_ref){var className=_ref.className,children=_ref.children,propPerspective=_ref.perspective,onClick=_ref.onClick,style=_ref.style,onHover=_ref.onHover,StageProps=_ref.StageProps,LayerProps=_ref.LayerProps,GroupProps=_ref.GroupProps,RectProps=_ref.RectProps,props=_objectWithoutProperties(_ref,_excluded);var _ref2=useTimeline()||{perspective:propPerspective},perspective=_ref2.perspective;if(perspective===undefined){vLog.error('VdtTimelineTrack',"missing 'perspective' prop. If the component is used outside a VdtTimelineContext, 'perspective' must be passed explicitly");}var visibleChildren=Children.toArray(children).filter(function(_ref3){var _ref3$props=_ref3.props,childProps=_ref3$props===void 0?{}:_ref3$props;var isOutsidePerspective=childProps.start>perspective.end||childProps.end<perspective.start;return !isOutsidePerspective;});var eventsContainerRef=useRef();var _useResizeObserver=useResizeObserver(eventsContainerRef),_useResizeObserver$wi=_useResizeObserver.width,eventContainerWidth=_useResizeObserver$wi===void 0?0:_useResizeObserver$wi,_useResizeObserver$he=_useResizeObserver.height,eventContainerHeight=_useResizeObserver$he===void 0?0:_useResizeObserver$he;// expect children to be passed 'y' and 'height' props so that we can calculate the track height
-var eventsContainerHeight=Math.max.apply(Math,_toConsumableArray(Children.map(children,function(_ref4){var _ref4$props=_ref4.props;_ref4$props=_ref4$props===void 0?{}:_ref4$props;var _ref4$props$y=_ref4$props.y,y=_ref4$props$y===void 0?0:_ref4$props$y,_ref4$props$height=_ref4$props.height,height=_ref4$props$height===void 0?0:_ref4$props$height;return y+height;})))||DEFAULT_EVENT_HEIGHT;var cloneChild=function cloneChild(child){var _ref5=child.props||{},childStart=_ref5.start,childEnd=_ref5.end;var xProps=function(){if(childStart!==undefined&&childEnd!==undefined){var childX=interpolate(0,eventContainerWidth,perspective.start,perspective.end,childStart);var childWidth=interpolate(0,eventContainerWidth,perspective.start,perspective.end,childEnd)-childX;return {x:childX,width:childWidth};}return {};}();return/*#__PURE__*/cloneElement(child,_objectSpread(_objectSpread({},child.props),xProps));};var _useHover=useHover({hoverEffect:function hoverEffect(e){if(onHover)onHover(e,true);var container=e.target.getStage().container();if(onClick){container.style.cursor='pointer';}return function(){if(onHover)onHover(e,false);if(onClick){container.style.cursor='default';}};}});_useHover.isHovering;var hoverProps=_objectWithoutProperties(_useHover,_excluded2);return/*#__PURE__*/jsx("div",_objectSpread(_objectSpread({ref:eventsContainerRef,className:clsx('VdtTimelineTrack-root',className),style:_objectSpread({height:eventsContainerHeight},style)},props),{},{children:/*#__PURE__*/jsx(Stage,_objectSpread(_objectSpread({height:eventContainerHeight,width:eventContainerWidth},StageProps),{},{children:/*#__PURE__*/jsx(Layer,_objectSpread(_objectSpread({},LayerProps),{},{children:/*#__PURE__*/jsxs(Group,_objectSpread(_objectSpread({},GroupProps),{},{children:[/*#__PURE__*/jsx(Rect,_objectSpread(_objectSpread({x:0,y:0,width:eventContainerWidth,height:eventContainerHeight,onClick:onClick},hoverProps),RectProps)),Children.map(visibleChildren,cloneChild)]}))}))}))}));}TimelineTrack.defaultProps={style:{},children:undefined,perspective:undefined,onClick:undefined,onHover:undefined,StageProps:{},LayerProps:{},GroupProps:{},RectProps:{},className:undefined};
-
-export { TimelineTrack as default };

package/dist/TimelineWaveform/TimelineWaveform.js

@@ -1,15 +0,0 @@
-import _defineProperty from '@babel/runtime/helpers/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useRef, useMemo, memo } from 'react';
-import clsx from 'clsx';
-import { Stage, Layer, Rect } from 'react-konva';
-import { getStyleProperties, vLog, interpolate } from '../_utils.js';
-import { useTimeline } from '../TimelineContext.js';
-import useResizeObserver from '../useResizeObserver.js';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-var _excluded=["amplitudeSegments","pxPerTimeUnit","start","height"],_excluded2=["className","waveform","start","end","perspective","StageProps","LayerProps","RectProps","WaveRectProps"];function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;})),keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach(function(key){_defineProperty(target,key,source[key]);}):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach(function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key));});}return target;}var _getStyleProperties=getStyleProperties('--vdt-timeline-palette-primary'),_getStyleProperties2=_slicedToArray(_getStyleProperties,1),palettePrimary=_getStyleProperties2[0];var TimelineWaveFormRects=/*#__PURE__*/memo(function(_ref){var amplitudeSegments=_ref.amplitudeSegments,pxPerTimeUnit=_ref.pxPerTimeUnit,start=_ref.start,height=_ref.height,props=_objectWithoutProperties(_ref,_excluded);return amplitudeSegments.map(function(_ref2,i){var amplitude=_ref2.amplitude,segmentStart=_ref2.start,segmentEnd=_ref2.end;var rectWidth=pxPerTimeUnit*(segmentEnd-segmentStart);var rectX=(segmentStart-start)*pxPerTimeUnit;var rectHeight=height*amplitude;var centeredY=(height-rectHeight)/2;return/*#__PURE__*/jsx(Rect// eslint-disable-next-line react/no-array-index-key
-,_objectSpread({x:rectX,y:centeredY,height:rectHeight,width:rectWidth,fill:palettePrimary},props),i);});});function TimelineWaveform(_ref3){var className=_ref3.className,waveform=_ref3.waveform,propStart=_ref3.start,propEnd=_ref3.end,propPerspective=_ref3.perspective,StageProps=_ref3.StageProps,LayerProps=_ref3.LayerProps,RectProps=_ref3.RectProps,WaveRectProps=_ref3.WaveRectProps,props=_objectWithoutProperties(_ref3,_excluded2);var _ref4=useTimeline()||{start:propStart,end:propEnd,perspective:propPerspective},start=_ref4.start,end=_ref4.end,perspective=_ref4.perspective;if(start===undefined||end===undefined||perspective===undefined){vLog.error('VdtTimelineWaveform',"missing 'start', 'end' or 'perspective' props. If the component is used outside a VdtTimelineContext, 'start', 'end' or 'perspective' must be passed explicitly");}var ref=useRef();var _useResizeObserver=useResizeObserver(ref),_useResizeObserver$wi=_useResizeObserver.width,width=_useResizeObserver$wi===void 0?0:_useResizeObserver$wi,_useResizeObserver$he=_useResizeObserver.height,height=_useResizeObserver$he===void 0?0:_useResizeObserver$he;var amplitudeSegments=useMemo(function(){return waveform.map(function(amplitude,i){return {amplitude:amplitude,start:interpolate(start,end,0,waveform.length-1,i),end:interpolate(start,end,0,waveform.length-1,i+1)};});},[waveform,start,end]);var pxPerTimeUnit=width/(end-start);var scaleX=(end-start)/(perspective.end-perspective.start);var offsetX=interpolate(0,scaleX*width,start,end,perspective.start);return/*#__PURE__*/jsx("div",_objectSpread(_objectSpread({ref:ref,className:clsx('VdtTimelineWaveform-root',className)},props),{},{children:/*#__PURE__*/jsx(Stage,_objectSpread(_objectSpread({height:height,width:width,x:-offsetX,scaleX:scaleX},StageProps),{},{children:/*#__PURE__*/jsxs(Layer,_objectSpread(_objectSpread({listening:false},LayerProps),{},{children:[/*#__PURE__*/jsx(Rect,_objectSpread({x:0,y:0,width:width,height:height},RectProps)),/*#__PURE__*/jsx(TimelineWaveFormRects,_objectSpread({amplitudeSegments:amplitudeSegments,pxPerTimeUnit:pxPerTimeUnit,start:start,height:height},WaveRectProps))]}))}))}));}TimelineWaveform.defaultProps={waveform:[],start:undefined,end:undefined,perspective:undefined,StageProps:{},LayerProps:{},RectProps:{},WaveRectProps:{},className:undefined};
-
-export { TimelineWaveform as default };

package/dist/_consts.js

@@ -1,3 +0,0 @@
-var DEFAULT_EVENT_HEIGHT=15;var DEFAULT_PLAYHEAD_ZINDEX=100;
-
-export { DEFAULT_EVENT_HEIGHT, DEFAULT_PLAYHEAD_ZINDEX };

package/dist/_utils.js

@@ -1,4 +0,0 @@
-var interpolate=function interpolate(y0,y1,x0,x1,x){return y0+(x-x0)*(y1-y0)/(x1-x0);};var vLogImpl=function vLogImpl(component,msg,level){if(process.env.NODE_ENV==='development'){// eslint-disable-next-line no-console
-console[level]("".concat(component?"".concat(component,": "):'').concat(msg));}};var vLog={error:function error(){for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}return vLogImpl.apply(void 0,args.concat(['error']));},warn:function warn(){for(var _len2=arguments.length,args=new Array(_len2),_key2=0;_key2<_len2;_key2++){args[_key2]=arguments[_key2];}return vLogImpl.apply(void 0,args.concat(['warn']));}};function mapPairs(arr,func){var result=[];for(var i=0;i<arr.length-1;i+=1){result.push(func(arr[i],arr[i+1]));}return result;}function getStyleProperties(){var style=getComputedStyle(document.body);for(var _len3=arguments.length,properties=new Array(_len3),_key3=0;_key3<_len3;_key3++){properties[_key3]=arguments[_key3];}return properties.map(function(prop){return style.getPropertyValue(prop);});}
-
-export { getStyleProperties, interpolate, mapPairs, vLog };

package/dist/useHover.js

@@ -1,6 +0,0 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useState, useRef } from 'react';
-
-function useHover(){var _ref=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{},_ref$hoverEffect=_ref.hoverEffect,hoverEffect=_ref$hoverEffect===void 0?function(){}:_ref$hoverEffect;var _useState=useState(false),_useState2=_slicedToArray(_useState,2),isHovering=_useState2[0],setIsHovering=_useState2[1];var cleanupHover=useRef(null);return {isHovering:isHovering,onMouseEnter:function onMouseEnter(e){setIsHovering(true);cleanupHover.current=hoverEffect(e);},onMouseLeave:function onMouseLeave(){setIsHovering(false);if(cleanupHover.current){cleanupHover.current();}cleanupHover.current=null;}};}
-
-export { useHover as default };

package/dist/useOptionallyControlledState.js

@@ -1,7 +0,0 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useState, useRef } from 'react';
-import { vLog } from './_utils.js';
-
-function useOptionallyControlledState(_ref){var _ref$uncontrolledDefa=_ref.uncontrolledDefaultState,uncontrolledDefaultState=_ref$uncontrolledDefa===void 0?undefined:_ref$uncontrolledDefa,_ref$uncontrolledOnCh=_ref.uncontrolledOnChange,uncontrolledOnChange=_ref$uncontrolledOnCh===void 0?undefined:_ref$uncontrolledOnCh,_ref$controlledState=_ref.controlledState,controlledState=_ref$controlledState===void 0?undefined:_ref$controlledState,_ref$controlledOnChan=_ref.controlledOnChange,controlledOnChange=_ref$controlledOnChan===void 0?undefined:_ref$controlledOnChan,componentName=_ref.componentName,stateName=_ref.stateName;var _useState=useState(uncontrolledDefaultState),_useState2=_slicedToArray(_useState,2),uncontrolledState=_useState2[0],setUncontrolledState=_useState2[1];var isControlled=useRef(null);var setIsControlled=function setIsControlled(newValue){if(isControlled.current!==null&&isControlled.current!==newValue){if(newValue){vLog.warn(componentName,"".concat(stateName," changed from uncontrolled to controlled"));}else {vLog.warn(componentName,"".concat(stateName," changed from controlled to uncontrolled"));}}isControlled.current=newValue;};if(controlledState!==undefined){setIsControlled(true);return [controlledState,controlledOnChange];}setIsControlled(false);return [uncontrolledState,controlledOnChange?function(){for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}if(uncontrolledOnChange){uncontrolledOnChange.apply(void 0,[setUncontrolledState].concat(args));}else {setUncontrolledState.apply(void 0,args);}controlledOnChange.apply(void 0,args);}:uncontrolledOnChange||setUncontrolledState];}
-
-export { useOptionallyControlledState as default };

package/dist/useResizeObserver.js

@@ -1,6 +0,0 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { useState, useRef, useEffect } from 'react';
-
-function useResizeObserver(ref){var _useState=useState({}),_useState2=_slicedToArray(_useState,2),rect=_useState2[0],setRect=_useState2[1];var observerRef=useRef(new ResizeObserver(function(entries){var _entries$;var contentRect=(_entries$=entries[0])===null||_entries$===void 0?void 0:_entries$.contentRect;if(contentRect){setRect(contentRect);}}));useEffect(function(){var observer=observerRef===null||observerRef===void 0?void 0:observerRef.current;var el=ref===null||ref===void 0?void 0:ref.current;if(el){observer.observe(el);}return function(){if(el){observer.unobserve(el);}};},[ref]);return rect;}
-
-export { useResizeObserver as default };

package/dist/useTimelinePerspective.js

@@ -1,7 +0,0 @@
-import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import clamp from 'lodash.clamp';
-import useOptionallyControlledState from './useOptionallyControlledState.js';
-
-function defaultGetZoomMultiplier(direction,time,perspective){var multiplier=perspective.end-perspective.start<100&&direction==='in'?1:2;return direction==='in'?1/multiplier:multiplier;}function useTimelinePerspective(_ref){var start=_ref.start,end=_ref.end,propDefaultPerspective=_ref.defaultPerspective,propPerspective=_ref.perspective,propOnChangePerspective=_ref.onChangePerspective,_ref$zoomMultiplier=_ref.zoomMultiplier,zoomMultiplier=_ref$zoomMultiplier===void 0?defaultGetZoomMultiplier:_ref$zoomMultiplier;var _useOptionallyControl=useOptionallyControlledState({uncontrolledDefaultState:propDefaultPerspective||{start:start,end:end},controlledState:propPerspective,controlledOnChange:propOnChangePerspective,componentName:'VdtTimeline',stateName:'perspective'}),_useOptionallyControl2=_slicedToArray(_useOptionallyControl,2),perspective=_useOptionallyControl2[0],setPerspective=_useOptionallyControl2[1];var getZoomMultiplier=typeof zoomMultiplier==='function'?zoomMultiplier:function(direction){return direction==='in'?1/zoomMultiplier:zoomMultiplier;};var checkedSetPerspective=function checkedSetPerspective(perspectiveStart,perspectiveEnd){setPerspective({start:clamp(Number(perspectiveStart),start,end),end:clamp(Number(perspectiveEnd),start,end)});};var zoom=function zoom(direction,time){var perspectiveDuration=perspective.end-perspective.start;var normalizedTimeOffset=(time-perspective.start)/perspectiveDuration;var currZoomMultiplier=getZoomMultiplier(direction,time,perspective);if(currZoomMultiplier===1){return;}var newPerspectiveDuration=(perspective.end-perspective.start)*currZoomMultiplier;var newPerspectiveStart=time-normalizedTimeOffset*newPerspectiveDuration;var newPerspectiveEnd=time+(1-normalizedTimeOffset)*newPerspectiveDuration;var perspectiveMisalignmentCorrection=function(){if(start>newPerspectiveStart){return start-newPerspectiveStart;}if(newPerspectiveEnd>end){return end-newPerspectiveEnd;}return 0;}();checkedSetPerspective(newPerspectiveStart+perspectiveMisalignmentCorrection,newPerspectiveEnd+perspectiveMisalignmentCorrection);};return {perspective:perspective,setPerspective:checkedSetPerspective,zoom:zoom};}
-
-export { useTimelinePerspective as default };