@kteneyck/cesium-timeline-react 0.7.0 → 0.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +62 -0
- package/dist/cesium-timeline-react.js +828 -775
- package/dist/cesium-timeline-react.umd.cjs +4 -4
- package/dist/index.d.ts +6 -0
- package/package.json +6 -3
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
(function(
|
|
1
|
+
(function(at,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("react"),require("cesium"),require("@kteneyck/cesium-timeline-core")):typeof define=="function"&&define.amd?define(["exports","react","cesium","@kteneyck/cesium-timeline-core"],n):(at=typeof globalThis<"u"?globalThis:at||self,n(at.CesiumTimelineReact={},at.React,at.Cesium,at.CesiumTimelineCore))})(this,(function(at,n,Kt,b){"use strict";function Vt(v){const L=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(v){for(const J in v)if(J!=="default"){const i=Object.getOwnPropertyDescriptor(v,J);Object.defineProperty(L,J,i.get?i:{enumerable:!0,get:()=>v[J]})}}return L.default=v,Object.freeze(L)}const T=Vt(Kt);var Ct={exports:{}},Dt={};/**
|
|
2
2
|
* @license React
|
|
3
3
|
* react-jsx-runtime.production.js
|
|
4
4
|
*
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*
|
|
7
7
|
* This source code is licensed under the MIT license found in the
|
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
|
9
|
-
*/var
|
|
9
|
+
*/var Jt;function Zt(){if(Jt)return Dt;Jt=1;var v=Symbol.for("react.transitional.element"),L=Symbol.for("react.fragment");function J(i,C,I){var B=null;if(I!==void 0&&(B=""+I),C.key!==void 0&&(B=""+C.key),"key"in C){I={};for(var G in C)G!=="key"&&(I[G]=C[G])}else I=C;return C=I.ref,{$$typeof:v,type:i,key:B,ref:C!==void 0?C:null,props:I}}return Dt.Fragment=L,Dt.jsx=J,Dt.jsxs=J,Dt}var At={};/**
|
|
10
10
|
* @license React
|
|
11
11
|
* react-jsx-runtime.development.js
|
|
12
12
|
*
|
|
@@ -14,9 +14,9 @@
|
|
|
14
14
|
*
|
|
15
15
|
* This source code is licensed under the MIT license found in the
|
|
16
16
|
* LICENSE file in the root directory of this source tree.
|
|
17
|
-
*/var
|
|
17
|
+
*/var Xt;function Qt(){return Xt||(Xt=1,process.env.NODE_ENV!=="production"&&(function(){function v(e){if(e==null)return null;if(typeof e=="function")return e.$$typeof===h?null:e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case et:return"Fragment";case y:return"Profiler";case lt:return"StrictMode";case H:return"Suspense";case ot:return"SuspenseList";case j:return"Activity"}if(typeof e=="object")switch(typeof e.tag=="number"&&console.error("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),e.$$typeof){case ut:return"Portal";case $:return e.displayName||"Context";case R:return(e._context.displayName||"Context")+".Consumer";case M:var p=e.render;return e=e.displayName,e||(e=p.displayName||p.name||"",e=e!==""?"ForwardRef("+e+")":"ForwardRef"),e;case mt:return p=e.displayName||null,p!==null?p:v(e.type)||"Memo";case st:p=e._payload,e=e._init;try{return v(e(p))}catch{}}return null}function L(e){return""+e}function J(e){try{L(e);var p=!1}catch{p=!0}if(p){p=console;var E=p.error,D=typeof Symbol=="function"&&Symbol.toStringTag&&e[Symbol.toStringTag]||e.constructor.name||"Object";return E.call(p,"The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",D),L(e)}}function i(e){if(e===et)return"<>";if(typeof e=="object"&&e!==null&&e.$$typeof===st)return"<...>";try{var p=v(e);return p?"<"+p+">":"<...>"}catch{return"<...>"}}function C(){var e=x.A;return e===null?null:e.getOwner()}function I(){return Error("react-stack-top-frame")}function B(e){if(O.call(e,"key")){var p=Object.getOwnPropertyDescriptor(e,"key").get;if(p&&p.isReactWarning)return!1}return e.key!==void 0}function G(e,p){function E(){N||(N=!0,console.error("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",p))}E.isReactWarning=!0,Object.defineProperty(e,"key",{get:E,configurable:!0})}function ft(){var e=v(this.type);return k[e]||(k[e]=!0,console.error("Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release.")),e=this.props.ref,e!==void 0?e:null}function U(e,p,E,D,rt,gt){var Y=E.ref;return e={$$typeof:q,type:e,key:p,props:E,_owner:D},(Y!==void 0?Y:null)!==null?Object.defineProperty(e,"ref",{enumerable:!1,get:ft}):Object.defineProperty(e,"ref",{enumerable:!1,value:null}),e._store={},Object.defineProperty(e._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:0}),Object.defineProperty(e,"_debugInfo",{configurable:!1,enumerable:!1,writable:!0,value:null}),Object.defineProperty(e,"_debugStack",{configurable:!1,enumerable:!1,writable:!0,value:rt}),Object.defineProperty(e,"_debugTask",{configurable:!1,enumerable:!1,writable:!0,value:gt}),Object.freeze&&(Object.freeze(e.props),Object.freeze(e)),e}function Z(e,p,E,D,rt,gt){var Y=p.children;if(Y!==void 0)if(D)if(S(Y)){for(D=0;D<Y.length;D++)K(Y[D]);Object.freeze&&Object.freeze(Y)}else console.error("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else K(Y);if(O.call(p,"key")){Y=v(e);var A=Object.keys(p).filter(function(Rt){return Rt!=="key"});D=0<A.length?"{key: someKey, "+A.join(": ..., ")+": ...}":"{key: someKey}",P[Y+D]||(A=0<A.length?"{"+A.join(": ..., ")+": ...}":"{}",console.error(`A props object containing a "key" prop is being spread into JSX:
|
|
18
18
|
let props = %s;
|
|
19
19
|
<%s {...props} />
|
|
20
20
|
React keys must be passed directly to JSX without using spread:
|
|
21
21
|
let props = %s;
|
|
22
|
-
<%s key={someKey} {...props} />`,T,w,st,w),K[w+T]=!0)}if(w=null,v!==void 0&&(O(v),w=""+v),F(d)&&(O(d.key),w=""+d.key),"key"in d){v={};for(var ut in d)ut!=="key"&&(v[ut]=d[ut])}else v=d;return w&&J(v,typeof e=="function"?e.displayName||e.name||"Unknown":e),k(e,w,v,D(),ct,pt)}function W(e){rt(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===M&&(e._payload.status==="fulfilled"?rt(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function rt(e){return typeof e=="object"&&e!==null&&e.$$typeof===$}var Z=o,$=Symbol.for("react.transitional.element"),tt=Symbol.for("react.portal"),B=Symbol.for("react.fragment"),et=Symbol.for("react.strict_mode"),h=Symbol.for("react.profiler"),b=Symbol.for("react.consumer"),H=Symbol.for("react.context"),Q=Symbol.for("react.forward_ref"),f=Symbol.for("react.suspense"),E=Symbol.for("react.suspense_list"),N=Symbol.for("react.memo"),M=Symbol.for("react.lazy"),y=Symbol.for("react.activity"),ot=Symbol.for("react.client.reference"),Y=Z.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,nt=Object.prototype.hasOwnProperty,U=Array.isArray,j=console.createTask?console.createTask:function(){return null};Z={react_stack_bottom_frame:function(e){return e()}};var I,L={},l=Z.react_stack_bottom_frame.bind(Z,A)(),S=j(i(A)),K={};vt.Fragment=B,vt.jsx=function(e,d,v){var T=1e4>Y.recentlyCreatedOwnerStacks++;return G(e,d,v,!1,T?Error("react-stack-top-frame"):l,T?j(i(e)):S)},vt.jsxs=function(e,d,v){var T=1e4>Y.recentlyCreatedOwnerStacks++;return G(e,d,v,!0,T?Error("react-stack-top-frame"):l,T?j(i(e)):S)}})()),vt}var kt;function Bt(){return kt||(kt=1,process.env.NODE_ENV==="production"?Et.exports=zt():Et.exports=Wt()),Et.exports}var u=Bt();const Ht=520,Ut=()=>u.jsxs("svg",{width:"14",height:"16",viewBox:"0 0 14 16",fill:"currentColor","aria-hidden":"true",children:[u.jsx("rect",{x:"1",y:"0",width:"4",height:"16",rx:"1"}),u.jsx("rect",{x:"9",y:"0",width:"4",height:"16",rx:"1"})]}),Lt=()=>u.jsx("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:u.jsx("polyline",{points:"3,5 7,9 11,5"})}),Ot=()=>u.jsx("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:u.jsx("polyline",{points:"3,9 7,5 11,9"})}),It=({currentTime:g,isPlaying:_,multiplier:O,dateTimeFormat:i,timezone:D,isLive:A,hasStartTime:F,hasEndTime:J,showJumpToStart:z=!0,showJumpToEnd:k=!0,onPlayPause:G,onJumpToStart:W,onRewind:rt,onFastForward:Z,onJumpToEnd:$,onJumpToLive:tt,onResetSpeed:B,onDateTimeClick:et,theme:h,swimLanesVisible:b,onToggleSwimLanes:H,labels:Q})=>{const f=O<0,E=O>1,N=O===1,M=Math.abs(O),y=o.useMemo(()=>({...R.DEFAULT_LABELS,...Q}),[Q]),ot=o.useRef(null),[Y,nt]=o.useState(!1);o.useEffect(()=>{const l=ot.current;if(!l)return;const S=new ResizeObserver(([K])=>{nt(K.contentRect.width<Ht)});return S.observe(l),()=>S.disconnect()},[]);const U={background:"none",border:"1px solid transparent",cursor:"pointer",fontSize:"16px",padding:"0",display:"flex",alignItems:"center",justifyContent:"center",minWidth:"32px",width:"32px",height:"32px",borderRadius:"4px",transition:"background-color 0.15s, color 0.15s",fontFamily:"system-ui, -apple-system, sans-serif",flexShrink:0,lineHeight:1},j=l=>({...U,color:l?h.buttonActiveColor:h.buttonColor,borderColor:l?`${h.buttonActiveColor}33`:"transparent"}),I=(l,S)=>{l.currentTarget.style.backgroundColor=S?`${h.buttonActiveColor}22`:h.buttonHoverColor+"44"},L=l=>{l.currentTarget.style.backgroundColor="transparent"};return u.jsxs("div",{ref:ot,style:{display:Y?"flex":"grid",gridTemplateColumns:Y?void 0:"1fr auto 1fr",alignItems:"center",padding:"6px 16px",backgroundColor:h.controlBarBackground,borderBottom:`1px solid ${h.controlBarBorder}`,fontFamily:"system-ui, -apple-system, sans-serif"},children:[u.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",flexShrink:0},children:[u.jsx("div",{onClick:et,title:et?y.dateTimeClickTooltip:void 0,style:{color:h.labelColor,fontFamily:"monospace",lineHeight:1.15,cursor:et?"pointer":"default",borderRadius:"4px",padding:"2px 4px",transition:"background 0.15s"},onMouseEnter:l=>{et&&(l.currentTarget.style.background=h.buttonHoverColor+"44")},onMouseLeave:l=>l.currentTarget.style.background="transparent",children:(()=>{const{timeFormat:l,dateFormat:S}=R.splitForDisplay(i),K=R.getTimezoneAbbr(g,D);return u.jsxs(u.Fragment,{children:[l&&u.jsx("div",{style:{fontSize:"2em",fontWeight:"bold",letterSpacing:"0.02em"},children:R.formatDateTime(g,l,D)}),S&&u.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[u.jsx("span",{style:{fontSize:"1.15em",letterSpacing:"0.03em",color:h.buttonActiveColor},children:R.formatDateTime(g,S,D)}),K&&u.jsx("span",{style:{fontSize:"0.9em",color:h.labelColor,opacity:.7,fontWeight:"bold",letterSpacing:"0.04em"},children:K})]})]})})()}),u.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"2px",justifyContent:"center"},children:[u.jsx("button",{onClick:tt,style:{...U,fontSize:"11px",fontWeight:"bold",letterSpacing:"0.05em",width:"52px",minWidth:"52px",height:"20px",borderRadius:"3px",color:A?h.controlBarBackground:h.buttonActiveColor,backgroundColor:A?h.buttonActiveColor:"transparent",borderColor:h.buttonActiveColor,opacity:A?1:.55},onMouseEnter:l=>{l.currentTarget.style.opacity="1"},onMouseLeave:l=>{l.currentTarget.style.opacity=A?"1":"0.55"},title:A?y.liveActiveTooltip:y.liveTooltip,children:A?y.liveActiveLabel:y.liveLabel}),u.jsx("div",{style:{height:"20px",display:"flex",alignItems:"center"},children:!N&&u.jsx("button",{onClick:()=>B(),style:{...U,fontSize:"11px",color:h.buttonActiveColor,borderColor:`${h.buttonActiveColor}44`,width:"52px",minWidth:"52px",height:"20px"},onMouseEnter:l=>I(l,!0),onMouseLeave:L,title:y.resetSpeedTooltip,children:f?`◀ ${M}×`:`${M}× ▶`})})]})]}),u.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"2px",...Y?{flex:1,justifyContent:"center"}:{}},children:[z&&u.jsx("button",{onClick:F?W:void 0,disabled:!F,style:{...j(!1),opacity:F?1:.3,cursor:F?"pointer":"default"},onMouseEnter:F?l=>I(l,!1):void 0,onMouseLeave:F?L:void 0,title:F?y.jumpToStartTooltip:y.noStartTimeTooltip,children:"⏮"}),u.jsx("button",{onClick:rt,style:{...j(f),width:"64px",minWidth:"64px",gap:"3px"},onMouseEnter:l=>I(l,f),onMouseLeave:L,title:f?R.resolveLabel(y.rewindActiveTooltip,M):y.rewindTooltip,children:f?u.jsxs(u.Fragment,{children:[u.jsxs("span",{style:{fontSize:"11px",fontWeight:"bold"},children:[M,"×"]}),"◀◀"]}):"◀◀"}),u.jsx("button",{onClick:()=>G(!_),style:{...U,color:h.buttonActiveColor,fontSize:"18px",width:"40px",minWidth:"40px",height:"40px",borderColor:`${h.buttonActiveColor}55`,borderRadius:"50%",paddingLeft:_?"0":"2px"},onMouseEnter:l=>I(l,!0),onMouseLeave:L,title:_?y.pauseTooltip:f?y.playFromRewindTooltip:y.playTooltip,children:_?u.jsx(Ut,{}):"▶"}),u.jsx("button",{onClick:Z,style:{...j(E),width:"64px",minWidth:"64px",gap:"3px"},onMouseEnter:l=>I(l,E),onMouseLeave:L,title:E?R.resolveLabel(y.fastForwardActiveTooltip,M):y.fastForwardTooltip,children:E?u.jsxs(u.Fragment,{children:["▶▶",u.jsxs("span",{style:{fontSize:"11px",fontWeight:"bold"},children:[M,"×"]})]}):"▶▶"}),k&&u.jsx("button",{onClick:J?$:void 0,disabled:!J,style:{...j(!1),opacity:J?1:.3,cursor:J?"pointer":"default"},onMouseEnter:J?l=>I(l,!1):void 0,onMouseLeave:J?L:void 0,title:J?y.jumpToEndTooltip:y.noEndTimeTooltip,children:"⏭"})]}),!Y&&u.jsx("div",{style:{display:"flex",justifyContent:"flex-end",alignItems:"center"},children:H!=null&&b!=null&&u.jsx("button",{onClick:H,style:{...U,color:h.buttonActiveColor,borderColor:`${h.buttonActiveColor}33`},onMouseEnter:l=>I(l,b),onMouseLeave:L,title:b?y.collapseSwimLanesTooltip:y.expandSwimLanesTooltip,children:b?u.jsx(Lt,{}):u.jsx(Ot,{})})}),Y&&H!=null&&b!=null&&u.jsx("button",{onClick:H,style:{...U,color:h.buttonActiveColor,borderColor:`${h.buttonActiveColor}33`,marginLeft:"4px"},onMouseEnter:l=>I(l,b),onMouseLeave:L,title:b?y.collapseSwimLanesTooltip:y.expandSwimLanesTooltip,children:b?u.jsx(Lt,{}):u.jsx(Ot,{})})]})},yt=o.forwardRef((g,_)=>{const{currentTime:O,defaultStartMs:i,defaultEndMs:D,theme:A,maxTicks:F,timezone:J,onTimeChange:z,onDragStart:k,onDragEnd:G,swimLanes:W,showSwimLanes:rt,onSwimLaneItemClick:Z,onSwimLaneItemHover:$,onSwimLaneItemDoubleClick:tt,onSwimLaneItemContextMenu:B,onSwimLaneReorder:et}=g,h=o.useRef(null),b=o.useRef(A),H=o.useRef(F),Q=o.useRef(J),f=o.useRef(i),E=o.useRef(D),N=o.useRef(C.JulianDate.toDate(O).getTime());o.useEffect(()=>{b.current=A},[A]),o.useEffect(()=>{H.current=F},[F]),o.useEffect(()=>{Q.current=J,x()},[J]);const M=o.useRef(W??[]),y=o.useRef(rt??(W!=null&&W.length>0)),ot=o.useRef(0),Y=o.useRef(null),nt=o.useRef(null),U=o.useRef(Z),j=o.useRef($),I=o.useRef(tt),L=o.useRef(B),l=o.useRef(et);o.useEffect(()=>{U.current=Z},[Z]),o.useEffect(()=>{j.current=$},[$]),o.useEffect(()=>{I.current=tt},[tt]),o.useEffect(()=>{L.current=B},[B]),o.useEffect(()=>{l.current=et},[et]),o.useEffect(()=>{M.current=W??[],x()},[W]),o.useEffect(()=>{y.current=rt??(W!=null&&W.length>0),x()},[rt,W]);const S=o.useRef(null),K=o.useRef(null),e=o.useRef(!1),d=o.useRef(0),v=o.useRef("none"),T=o.useRef(0),ct=o.useRef(0),pt=o.useRef(0),w=o.useRef("none"),st=o.useRef(0),ut=o.useRef(0),gt=(t,n)=>Math.hypot(n.clientX-t.clientX,n.clientY-t.clientY),dt=o.useCallback(()=>({startMs:f.current,endMs:E.current,currentMs:N.current,theme:b.current,maxTicks:H.current,timezone:Q.current,swimLanes:M.current,showSwimLanes:y.current,scrollTop:ot.current,reorderState:nt.current}),[]);o.useImperativeHandle(_,()=>({zoomTo(t,n,r){const a=Math.max(R.MIN_SPAN_MS,Math.min(R.MAX_SPAN_MS,n-t)),s=(t+n)/2;f.current=s-a/2,E.current=s+a/2,r!==void 0&&(N.current=r),x()},getVisibleRange(){return{startMs:f.current,endMs:E.current}},startFollow(t){if(d.current=t,K.current!==null)return;e.current=!0;let n=performance.now();const r=()=>{const a=performance.now(),s=a-n;n=a;const c=s*d.current;f.current+=c,E.current+=c,N.current+=c,x(),K.current=requestAnimationFrame(r)};K.current=requestAnimationFrame(r)},stopFollow(){e.current=!1,K.current!==null&&(cancelAnimationFrame(K.current),K.current=null)},correctFollow(t){if(!e.current)return;const n=t-N.current;N.current=t,f.current+=n,E.current+=n},appendSwimLane(t){M.current=[...M.current,t],x()},updateSwimLane(t,n){M.current=M.current.map(r=>r.id===t?{...r,...n,id:r.id}:r),x()},removeSwimLane(t){M.current=M.current.filter(n=>n.id!==t),x()},reorderSwimLanes(t){const n=new Map(M.current.map(a=>[a.id,a])),r=[];for(const a of t){const s=n.get(a);s&&r.push(s)}M.current=r,x()}}));const x=o.useCallback(()=>{const t=h.current;if(!t)return;const n=t.getContext("2d");if(!n)return;const r=t.getBoundingClientRect(),a=r.width,s=r.height;if(a===0||s===0)return;const c=window.devicePixelRatio||1,p=Math.round(a*c),m=Math.round(s*c);(t.width!==p||t.height!==m)&&(t.width=p,t.height=m),n.save(),n.scale(c,c);const P=R.drawTimeline(n,a,s,dt());P!==ot.current&&(ot.current=P),n.restore()},[dt]);o.useLayoutEffect(()=>{x();const t=h.current;if(!t)return;const n=new ResizeObserver(()=>x());return n.observe(t),()=>n.disconnect()},[x]),o.useEffect(()=>{if(e.current)return;const t=C.JulianDate.toDate(O).getTime();N.current!==t&&(N.current=t,x())},[O,x]);const lt=o.useCallback(t=>{if(S.current!==null)return;const n=()=>{const r=h.current,a=E.current-f.current,s=t*a*.01;if(f.current+=s,E.current+=s,r){const c=r.getBoundingClientRect(),p=Math.max(0,Math.min(c.width,ct.current-c.left)),m=f.current+p/c.width*(E.current-f.current);N.current=m,z(C.JulianDate.fromDate(new Date(m)))}x(),S.current=requestAnimationFrame(n)};S.current=requestAnimationFrame(n)},[x,z]),X=o.useCallback(()=>{S.current!==null&&(cancelAnimationFrame(S.current),S.current=null)},[]),at=o.useCallback((t,n,r,a)=>R.hitTestSwimLane(t,n,r,a,dt()),[dt]),it=o.useCallback((t,n,r)=>R.hitTestLaneLabel(t,n,r,dt()),[dt]),ht=o.useCallback((t,n)=>R.isInSwimLaneRegion(t,n,dt()),[dt]),Tt=o.useCallback(t=>{t.preventDefault();const n=t.currentTarget.getBoundingClientRect(),r=t.clientX-n.left,a=t.clientY-n.top;if(t.button===0&&l.current){const s=it(r,a,n.height);if(s){const p=M.current.findIndex(m=>m.id===s.id);nt.current={dragging:!0,dragLaneId:s.id,dragStartY:t.clientY,currentY:t.clientY,insertIndex:p},t.currentTarget.style.cursor="grabbing";return}}if(t.button===0&&ht(a,n.height)){const s=(N.current-f.current)/(E.current-f.current)*n.width;if(!(Math.abs(r-s)<=10)&&at(r,a,n.width,n.height)){pt.current=performance.now();return}}if(t.button===0){v.current="scrub",ct.current=t.clientX,t.currentTarget.style.cursor="grabbing",k==null||k();const s=f.current+r/n.width*(E.current-f.current);N.current=s,x(),z(C.JulianDate.fromDate(new Date(s)))}else if(t.button===1)v.current="slide",T.current=t.clientX;else if(t.button===2){if(L.current&&ht(a,n.height))return;v.current="zoom",T.current=t.clientX}},[x,z,k,it,ht,at]);o.useEffect(()=>{const t=r=>{const a=nt.current;if(a&&a.dragging){a.currentY=r.clientY;const m=h.current;if(m){const P=m.getBoundingClientRect(),V=r.clientY-P.top;let Rt=-ot.current;const jt=M.current;let Jt=jt.length;for(let wt=0;wt<jt.length;wt++){const Nt=jt[wt].height??R.DEFAULT_LANE_HEIGHT,Vt=Rt+Nt/2;if(V<Vt){Jt=wt;break}Rt+=Nt+R.LANE_GAP}a.insertIndex=Jt}x();return}if(v.current==="none")return;const s=h.current;if(!s)return;const c=s.getBoundingClientRect(),p=c.width;if(v.current==="scrub"){ct.current=r.clientX;const m=r.clientX-c.left,P=p*.08;m<P?lt(-1):m>p-P?lt(1):X();const V=Math.max(0,Math.min(p,m)),ft=f.current+V/p*(E.current-f.current);N.current=ft,x(),z(C.JulianDate.fromDate(new Date(ft)))}else if(v.current==="slide"){const m=T.current-r.clientX;if(T.current=r.clientX,m!==0){const P=m/p*(E.current-f.current);f.current+=P,E.current+=P,x()}}else if(v.current==="zoom"){const m=T.current-r.clientX;T.current=r.clientX,m!==0&&mt(Math.pow(1.01,m))}},n=()=>{var a;const r=nt.current;if(r&&r.dragging){const s=Math.abs(r.currentY-r.dragStartY),c=M.current,p=c.findIndex(m=>m.id===r.dragLaneId);if(s>5&&p>=0&&r.insertIndex!==p&&r.insertIndex!==p+1){const m=[...c],[P]=m.splice(p,1),V=r.insertIndex>p?r.insertIndex-1:r.insertIndex;m.splice(V,0,P),M.current=m,(a=l.current)==null||a.call(l,m.map(ft=>ft.id))}nt.current=null,h.current&&(h.current.style.cursor="default"),x();return}X(),v.current="none",h.current&&(h.current.style.cursor="default"),G==null||G()};return document.addEventListener("mousemove",t),document.addEventListener("mouseup",n),()=>{document.removeEventListener("mousemove",t),document.removeEventListener("mouseup",n)}},[x,z,G,lt,X]);const mt=o.useCallback(t=>{const n=R.zoomRange(f.current,E.current,t);f.current=n.startMs,E.current=n.endMs,x()},[x]),bt=o.useCallback(t=>{t.preventDefault();const n=h.current;if(!n)return;const r=n.getBoundingClientRect(),a=t.clientY-r.top,s=y.current,c=M.current;if(s&&c.length>0){const p=Math.max(0,r.height-R.TICK_AREA_HEIGHT);if(a>=0&&a<p){let m=0;for(const V of c)m+=(V.height??R.DEFAULT_LANE_HEIGHT)+R.LANE_GAP;const P=Math.max(0,m-p);if(P>0){ot.current=Math.max(0,Math.min(P,ot.current+t.deltaY*R.SWIM_LANE_SCROLL_SPEED)),x();return}}}mt(Math.pow(1.05,t.deltaY>0?-1:1))},[mt,x]);o.useEffect(()=>{const t=h.current;if(t)return t.addEventListener("wheel",bt,{passive:!1}),()=>t.removeEventListener("wheel",bt)},[bt]),o.useEffect(()=>{const t=h.current;if(!t)return;const n=s=>{s.preventDefault();const c=t.getBoundingClientRect();if(s.touches.length===1){const p=s.touches[0].clientX-c.left,m=Math.max(0,Math.min(c.width,p)),P=f.current+m/c.width*(E.current-f.current);w.current="scrub",st.current=s.touches[0].clientX,ct.current=s.touches[0].clientX,N.current=P,x(),k==null||k(),z(C.JulianDate.fromDate(new Date(P)))}else s.touches.length>=2&&(w.current="pinch",ut.current=gt(s.touches[0],s.touches[1]))},r=s=>{s.preventDefault();const c=t.getBoundingClientRect();if(w.current==="scrub"&&s.touches.length>=1){const p=s.touches[0].clientX-c.left,m=c.width*.08;if(ct.current=s.touches[0].clientX,p<m)lt(-1);else if(p>c.width-m)lt(1);else{X();const P=Math.max(0,Math.min(c.width,p)),V=f.current+P/c.width*(E.current-f.current);N.current=V,x(),z(C.JulianDate.fromDate(new Date(V)))}}else if(w.current==="slide"&&s.touches.length>=1){const p=st.current-s.touches[0].clientX;if(st.current=s.touches[0].clientX,p!==0){const m=p/c.width*(E.current-f.current);f.current+=m,E.current+=m,x()}}else if(w.current==="pinch"&&s.touches.length>=2){const p=gt(s.touches[0],s.touches[1]);p>0&&ut.current>0&&mt(ut.current/p),ut.current=p}},a=s=>{X(),w.current==="scrub"&&(G==null||G()),s.touches.length===0?w.current="none":s.touches.length===1&&(w.current="slide",st.current=s.touches[0].clientX)};return t.addEventListener("touchstart",n,{passive:!1}),t.addEventListener("touchmove",r,{passive:!1}),t.addEventListener("touchend",a,{passive:!1}),()=>{t.removeEventListener("touchstart",n),t.removeEventListener("touchmove",r),t.removeEventListener("touchend",a)}},[x,k,G,z,mt,lt,X]);const Mt=o.useCallback(t=>{var p,m,P;if(v.current!=="none")return;const n=t.currentTarget.getBoundingClientRect(),r=t.clientX-n.left,a=t.clientY-n.top,s=(N.current-f.current)/(E.current-f.current)*n.width,c=Math.abs(r-s)<=10;if(ht(a,n.height)){const V=at(r,a,n.width,n.height),ft=Y.current;if(V)t.currentTarget.style.cursor=c?"grab":"pointer",(!ft||ft.item.id!==V.item.id||ft.lane.id!==V.lane.id)&&(Y.current=V,(p=j.current)==null||p.call(j,{laneId:V.lane.id,item:V.item,originalEvent:t.nativeEvent}),x());else if(ft&&(Y.current=null,(m=j.current)==null||m.call(j,null),x()),c)t.currentTarget.style.cursor="grab";else{const Rt=it(r,a,n.height);t.currentTarget.style.cursor=Rt&&l.current?"grab":"default"}return}Y.current&&(Y.current=null,(P=j.current)==null||P.call(j,null),x()),t.currentTarget.style.cursor=c?"grab":"default"},[x,at,ht,it]),Dt=o.useCallback(t=>{var p;if(performance.now()-pt.current>300)return;const r=t.currentTarget.getBoundingClientRect(),a=t.clientX-r.left,s=t.clientY-r.top,c=at(a,s,r.width,r.height);c&&((p=U.current)==null||p.call(U,{laneId:c.lane.id,item:c.item,originalEvent:t.nativeEvent}))},[at]),_t=o.useCallback(t=>{var c;const n=t.currentTarget.getBoundingClientRect(),r=t.clientX-n.left,a=t.clientY-n.top,s=at(r,a,n.width,n.height);s&&((c=I.current)==null||c.call(I,{laneId:s.lane.id,item:s.item,originalEvent:t.nativeEvent}))},[at]),At=o.useCallback(t=>{const n=t.currentTarget.getBoundingClientRect(),r=t.clientX-n.left,a=t.clientY-n.top,s=at(r,a,n.width,n.height);s&&L.current?(t.preventDefault(),L.current({laneId:s.lane.id,item:s.item,originalEvent:t.nativeEvent})):t.preventDefault()},[at]);return o.useEffect(()=>()=>{S.current!==null&&cancelAnimationFrame(S.current),K.current!==null&&cancelAnimationFrame(K.current)},[]),u.jsx("canvas",{ref:h,style:{width:"100%",flex:1,minHeight:0,display:"block",cursor:"default"},onMouseDown:Tt,onMouseMove:Mt,onClick:Dt,onDoubleClick:_t,onMouseLeave:()=>{var t;Y.current&&(Y.current=null,(t=j.current)==null||t.call(j,null),x()),v.current==="none"&&h.current&&(h.current.style.cursor="default")},onContextMenu:At})});yt.displayName="TimelineCanvas";const Ft=[2,4,8,16,32,100,1],Pt=[1,2,4,8,16,32,100],Gt=({startTime:g,endTime:_,currentTime:O,clock:i,onTimeChange:D,onPlayPause:A,onMultiplierChange:F,height:J,showControls:z=!0,showJumpToStart:k,showJumpToEnd:G,enableDrag:W=!0,dateTimeFormat:rt,onDateTimeClick:Z,jumpToTime:$,maxTicks:tt,ffSpeeds:B=Ft,rwSpeeds:et=Pt,theme:h,className:b,timezone:H,swimLanes:Q,showSwimLanes:f,onShowSwimLanesChange:E,swimLaneTransition:N="animated",onSwimLaneItemClick:M,onSwimLaneItemHover:y,onSwimLaneItemDoubleClick:ot,onSwimLaneItemContextMenu:Y,onSwimLaneReorder:nt,labels:U})=>{const j=()=>Date.now(),I=g?C.JulianDate.toDate(R.toJulianDate(g)).getTime():j()-432e5,L=_?C.JulianDate.toDate(R.toJulianDate(_)).getTime():j()+12*3600*1e3,[l,S]=o.useState(()=>R.toJulianDate(O??g??C.JulianDate.fromDate(new Date))),[K,e]=o.useState((i==null?void 0:i.shouldAnimate)??!1),[d,v]=o.useState((i==null?void 0:i.multiplier)??1),[T,ct]=o.useState(f??!0);o.useEffect(()=>{f!=null&&ct(f)},[f]);const pt=()=>{const t=!T;ct(t),E==null||E(t)},w=Q!=null&&Q.length>0,st=o.useRef(null),[ut,gt]=o.useState(0);o.useEffect(()=>{const t=st.current;if(!t)return;const n=new ResizeObserver(([r])=>gt(r.borderBoxSize[0].blockSize));return n.observe(t),()=>n.disconnect()},[z]);const x=w&&!T?`${ut+R.TICK_AREA_HEIGHT}px`:J!=null?`${J}px`:"100%",lt=o.useRef(!1),X=o.useRef(null),at={...R.defaultTheme,...h};o.useEffect(()=>{if(!i)return;const t=()=>{if(!lt.current){const n=C.JulianDate.clone(i.currentTime);if(S(n),e(i.shouldAnimate),v(i.multiplier),X.current){const{startMs:r,endMs:a}=X.current.getVisibleRange(),s=a-r,c=C.JulianDate.toDate(n).getTime(),p=c-r;p<=s*.1?X.current.zoomTo(c-s*.1,c+s*.9,c):p>=s*.9&&X.current.zoomTo(c-s*.9,c+s*.1,c)}}};return i.onTick.addEventListener(t),()=>{i.onTick.removeEventListener(t)}},[i]),o.useEffect(()=>{if(i)return;const t=setInterval(()=>{if(lt.current)return;const n=C.JulianDate.fromDate(new Date);if(S(n),X.current){const{startMs:r,endMs:a}=X.current.getVisibleRange(),s=a-r,c=C.JulianDate.toDate(n).getTime(),p=c-r;p<=s*.1?X.current.zoomTo(c-s*.1,c+s*.9,c):p>=s*.9&&X.current.zoomTo(c-s*.9,c+s*.1,c)}},1e3);return()=>clearInterval(t)},[i]),o.useEffect(()=>{if(!$)return;const t=R.toJulianDate($);if(ht(t),X.current){const{startMs:n,endMs:r}=X.current.getVisibleRange(),a=r-n,s=C.JulianDate.toDate(t).getTime();X.current.zoomTo(s-a/2,s+a/2)}},[$]);const it=(t,n=!0)=>{i&&(i.multiplier=t,n&&(i.shouldAnimate=!0)),v(t),n&&e(!0),F==null||F(t)},ht=t=>{S(t),i&&(i.currentTime=C.JulianDate.clone(t)),D==null||D(t)},Tt=t=>{t&&d<0&&it(1,!1),i&&(i.shouldAnimate=t),e(t),A==null||A(t)},mt=()=>{const t=B.length>0?B:Ft,n=d>1?d:1,r=t.indexOf(n),a=t[r<0||r===t.length-1?0:r+1];it(a)},bt=()=>{const t=et.length>0?et:Pt,n=d<0?Math.abs(d):0,r=t.indexOf(n),a=-t[r<0||r===t.length-1?0:r+1];it(a)},Mt=()=>{var n;const t=R.toJulianDate(g??C.JulianDate.fromDate(new Date(I)));i&&(i.currentTime=C.JulianDate.clone(t)),S(t),(n=X.current)==null||n.zoomTo(I,L)},Dt=()=>{var n;const t=R.toJulianDate(_??C.JulianDate.fromDate(new Date(L)));i&&(i.currentTime=C.JulianDate.clone(t)),S(t),(n=X.current)==null||n.zoomTo(I,L)},_t=()=>{var r;const t=C.JulianDate.fromDate(new Date);i&&(i.currentTime=C.JulianDate.clone(t)),S(t),it(1);const n=Date.now();(r=X.current)==null||r.zoomTo(n-12*3600*1e3,n+12*3600*1e3)},At=Math.abs(C.JulianDate.toDate(l).getTime()-Date.now())<1e4;return u.jsxs("div",{className:b,style:{width:"100%",height:x,overflow:"hidden",display:"flex",flexDirection:"column",fontFamily:"system-ui, -apple-system, sans-serif",transition:N==="animated"?"height 0.2s ease":void 0},children:[z&&u.jsx("div",{ref:st,children:u.jsx(It,{currentTime:l,isPlaying:K,multiplier:d,isLive:At,hasStartTime:g!=null,hasEndTime:_!=null,showJumpToStart:k,showJumpToEnd:G,onPlayPause:Tt,onJumpToStart:Mt,onRewind:bt,onFastForward:mt,onJumpToEnd:Dt,onJumpToLive:_t,onResetSpeed:()=>it(1),onDateTimeClick:Z,dateTimeFormat:rt,timezone:H,theme:at,swimLanesVisible:w?T:void 0,onToggleSwimLanes:w?pt:void 0,labels:U})}),W!==!1&&u.jsx(yt,{ref:X,currentTime:l,defaultStartMs:I,defaultEndMs:L,theme:at,maxTicks:tt,timezone:H,onTimeChange:ht,onDragStart:()=>{lt.current=!0},onDragEnd:()=>{lt.current=!1},swimLanes:Q,showSwimLanes:T,onSwimLaneItemClick:M,onSwimLaneItemHover:y,onSwimLaneItemDoubleClick:ot,onSwimLaneItemContextMenu:Y,onSwimLaneReorder:nt})]})},Kt=({startTime:g,endTime:_,currentTime:O,width:i,height:D,tickInterval:A,showLabels:F,snapToTicks:J,enableDrag:z,theme:k,onTimeChange:G,onVisibleRangeChange:W,onDragStart:rt,onDragEnd:Z})=>{const $=o.useMemo(()=>R.generateTicks(g,_,A,i),[g,_,A,i]),tt=o.useMemo(()=>R.timeToPosition(O,g,_,i),[O,g,_,i]),B=o.useRef(null),et=b=>{if(!z)return;const H=b.currentTarget.getBoundingClientRect(),Q=b.clientX-H.left,f=Math.max(0,Math.min(i,Q));if(!(Math.abs(f-tt)<=10)){let L=f;J&&(L=R.snapToTick(f,$,10));const l=new Date(g).getTime(),S=new Date(_).getTime();G(C.JulianDate.fromDate(new Date(l+L/i*(S-l))));return}rt==null||rt();const N=b.clientX,M=new Date(O).getTime(),y=new Date(g).getTime(),Y=(new Date(_).getTime()-y)/i;let nt=0,U=!1;const j=L=>{nt=L.clientX-N,U=!0,B.current||(B.current=requestAnimationFrame(()=>{if(U){const l=M+nt*Y;G(C.JulianDate.fromDate(new Date(l))),U=!1}B.current=null}))},I=()=>{document.removeEventListener("mousemove",j),document.removeEventListener("mouseup",I),B.current!==null&&(cancelAnimationFrame(B.current),B.current=null),Z==null||Z()};document.addEventListener("mousemove",j),document.addEventListener("mouseup",I)},h=b=>{b.preventDefault();const H=b.shiftKey?b.deltaY:b.deltaX!==0?b.deltaX:b.deltaY;if(Math.abs(H)<1)return;const Q=new Date(g).getTime(),f=new Date(_).getTime(),E=H/i*(f-Q)*.5;W==null||W(C.JulianDate.fromDate(new Date(Q+E)),C.JulianDate.fromDate(new Date(f+E)))};return u.jsxs("svg",{width:"100%",height:D,style:{backgroundColor:k.backgroundColor,display:"block",cursor:"default"},onMouseDown:et,onWheel:h,children:[u.jsx("rect",{width:i,height:D,fill:k.backgroundColor}),$.map((b,H)=>u.jsxs("g",{children:[u.jsx("line",{x1:b.position,y1:D-(b.isMajor?k.majorTickHeight:k.minorTickHeight),x2:b.position,y2:D,stroke:b.isMajor?k.majorTickColor:k.tickColor,strokeWidth:"1"}),F&&b.isMajor&&b.label&&u.jsx("text",{x:b.position,y:D-k.majorTickHeight-5,textAnchor:"middle",fill:k.labelColor,fontSize:k.fontSize,fontFamily:"monospace",children:b.label})]},H)),u.jsx("line",{x1:tt,y1:0,x2:tt,y2:D,stroke:k.indicatorColor,strokeWidth:k.indicatorLineWidth,pointerEvents:"none"}),z&&u.jsx("rect",{x:Math.max(0,tt-10),y:0,width:20,height:D,fill:"transparent",style:{cursor:"ew-resize"},pointerEvents:"visiblePainted"}),u.jsx("circle",{cx:tt,cy:5,r:4,fill:k.indicatorColor,pointerEvents:"none"})]})};Object.defineProperty(q,"TICK_AREA_HEIGHT",{enumerable:!0,get:()=>R.TICK_AREA_HEIGHT}),q.Timeline=Gt,q.TimelineCanvas=yt,q.TimelineControls=It,q.TimelineSVG=Kt,Object.keys(R).forEach(g=>{g!=="default"&&!Object.prototype.hasOwnProperty.call(q,g)&&Object.defineProperty(q,g,{enumerable:!0,get:()=>R[g]})}),Object.defineProperty(q,Symbol.toStringTag,{value:"Module"})}));
|
|
22
|
+
<%s key={someKey} {...props} />`,D,Y,A,Y),P[Y+D]=!0)}if(Y=null,E!==void 0&&(J(E),Y=""+E),B(p)&&(J(p.key),Y=""+p.key),"key"in p){E={};for(var dt in p)dt!=="key"&&(E[dt]=p[dt])}else E=p;return Y&&G(E,typeof e=="function"?e.displayName||e.name||"Unknown":e),U(e,Y,E,C(),rt,gt)}function K(e){F(e)?e._store&&(e._store.validated=1):typeof e=="object"&&e!==null&&e.$$typeof===st&&(e._payload.status==="fulfilled"?F(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function F(e){return typeof e=="object"&&e!==null&&e.$$typeof===q}var ct=n,q=Symbol.for("react.transitional.element"),ut=Symbol.for("react.portal"),et=Symbol.for("react.fragment"),lt=Symbol.for("react.strict_mode"),y=Symbol.for("react.profiler"),R=Symbol.for("react.consumer"),$=Symbol.for("react.context"),M=Symbol.for("react.forward_ref"),H=Symbol.for("react.suspense"),ot=Symbol.for("react.suspense_list"),mt=Symbol.for("react.memo"),st=Symbol.for("react.lazy"),j=Symbol.for("react.activity"),h=Symbol.for("react.client.reference"),x=ct.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,O=Object.prototype.hasOwnProperty,S=Array.isArray,tt=console.createTask?console.createTask:function(){return null};ct={react_stack_bottom_frame:function(e){return e()}};var N,k={},a=ct.react_stack_bottom_frame.bind(ct,I)(),Q=tt(i(I)),P={};At.Fragment=et,At.jsx=function(e,p,E){var D=1e4>x.recentlyCreatedOwnerStacks++;return Z(e,p,E,!1,D?Error("react-stack-top-frame"):a,D?tt(i(e)):Q)},At.jsxs=function(e,p,E){var D=1e4>x.recentlyCreatedOwnerStacks++;return Z(e,p,E,!0,D?Error("react-stack-top-frame"):a,D?tt(i(e)):Q)}})()),At}var Nt;function qt(){return Nt||(Nt=1,process.env.NODE_ENV==="production"?Ct.exports=Zt():Ct.exports=Qt()),Ct.exports}var l=qt();const $t=520,te=()=>l.jsxs("svg",{width:"14",height:"16",viewBox:"0 0 14 16",fill:"currentColor","aria-hidden":"true",children:[l.jsx("rect",{x:"1",y:"0",width:"4",height:"16",rx:"1"}),l.jsx("rect",{x:"9",y:"0",width:"4",height:"16",rx:"1"})]}),Yt=()=>l.jsx("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:l.jsx("polyline",{points:"3,5 7,9 11,5"})}),zt=()=>l.jsx("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",stroke:"currentColor",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round","aria-hidden":"true",children:l.jsx("polyline",{points:"3,9 7,5 11,9"})}),Wt=({currentTime:v,isPlaying:L,multiplier:J,dateTimeFormat:i,timezone:C,isLive:I,hasStartTime:B,hasEndTime:G,showJumpToStart:ft=!0,showJumpToEnd:U=!0,onPlayPause:Z,onJumpToStart:K,onRewind:F,onFastForward:ct,onJumpToEnd:q,onJumpToLive:ut,onResetSpeed:et,onDateTimeClick:lt,theme:y,swimLanesVisible:R,onToggleSwimLanes:$,labels:M})=>{const H=J<0,ot=J>1,mt=J===1,st=Math.abs(J),j=n.useMemo(()=>({...b.DEFAULT_LABELS,...M}),[M]),h=n.useRef(null),[x,O]=n.useState(!1);n.useEffect(()=>{const a=h.current;if(!a)return;const Q=new ResizeObserver(([P])=>{O(P.contentRect.width<$t)});return Q.observe(a),()=>Q.disconnect()},[]);const S={background:"none",border:"1px solid transparent",cursor:"pointer",fontSize:"16px",padding:"0",display:"flex",alignItems:"center",justifyContent:"center",minWidth:"32px",width:"32px",height:"32px",borderRadius:"4px",transition:"background-color 0.15s, color 0.15s",fontFamily:"system-ui, -apple-system, sans-serif",flexShrink:0,lineHeight:1},tt=a=>({...S,color:a?y.buttonActiveColor:y.buttonColor,borderColor:a?`${y.buttonActiveColor}33`:"transparent"}),N=(a,Q)=>{a.currentTarget.style.backgroundColor=Q?`${y.buttonActiveColor}22`:y.buttonHoverColor+"44"},k=a=>{a.currentTarget.style.backgroundColor="transparent"};return l.jsxs("div",{ref:h,style:{display:x?"flex":"grid",gridTemplateColumns:x?void 0:"1fr auto 1fr",alignItems:"center",padding:"6px 16px",backgroundColor:y.controlBarBackground,borderBottom:`1px solid ${y.controlBarBorder}`,fontFamily:"system-ui, -apple-system, sans-serif"},children:[l.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",flexShrink:0},children:[l.jsx("div",{onClick:lt,title:lt?j.dateTimeClickTooltip:void 0,style:{color:y.labelColor,fontFamily:"monospace",lineHeight:1.15,cursor:lt?"pointer":"default",borderRadius:"4px",padding:"2px 4px",transition:"background 0.15s"},onMouseEnter:a=>{lt&&(a.currentTarget.style.background=y.buttonHoverColor+"44")},onMouseLeave:a=>a.currentTarget.style.background="transparent",children:(()=>{const{timeFormat:a,dateFormat:Q}=b.splitForDisplay(i),P=b.getTimezoneAbbr(v,C);return l.jsxs(l.Fragment,{children:[a&&l.jsx("div",{style:{fontSize:"2em",fontWeight:"bold",letterSpacing:"0.02em"},children:b.formatDateTime(v,a,C)}),Q&&l.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"6px"},children:[l.jsx("span",{style:{fontSize:"1.15em",letterSpacing:"0.03em",color:y.buttonActiveColor},children:b.formatDateTime(v,Q,C)}),P&&l.jsx("span",{style:{fontSize:"0.9em",color:y.labelColor,opacity:.7,fontWeight:"bold",letterSpacing:"0.04em"},children:P})]})]})})()}),l.jsxs("div",{style:{display:"flex",flexDirection:"column",gap:"2px",justifyContent:"center"},children:[l.jsx("button",{onClick:ut,style:{...S,fontSize:"11px",fontWeight:"bold",letterSpacing:"0.05em",width:"52px",minWidth:"52px",height:"20px",borderRadius:"3px",color:I?y.controlBarBackground:y.buttonActiveColor,backgroundColor:I?y.buttonActiveColor:"transparent",borderColor:y.buttonActiveColor,opacity:I?1:.55},onMouseEnter:a=>{a.currentTarget.style.opacity="1"},onMouseLeave:a=>{a.currentTarget.style.opacity=I?"1":"0.55"},title:I?j.liveActiveTooltip:j.liveTooltip,children:I?j.liveActiveLabel:j.liveLabel}),l.jsx("div",{style:{height:"20px",display:"flex",alignItems:"center"},children:!mt&&l.jsx("button",{onClick:()=>et(),style:{...S,fontSize:"11px",color:y.buttonActiveColor,borderColor:`${y.buttonActiveColor}44`,width:"52px",minWidth:"52px",height:"20px"},onMouseEnter:a=>N(a,!0),onMouseLeave:k,title:j.resetSpeedTooltip,children:H?`◀ ${st}×`:`${st}× ▶`})})]})]}),l.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"2px",...x?{flex:1,justifyContent:"center"}:{}},children:[ft&&l.jsx("button",{onClick:B?K:void 0,disabled:!B,style:{...tt(!1),opacity:B?1:.3,cursor:B?"pointer":"default"},onMouseEnter:B?a=>N(a,!1):void 0,onMouseLeave:B?k:void 0,title:B?j.jumpToStartTooltip:j.noStartTimeTooltip,children:"⏮"}),l.jsx("button",{onClick:F,style:{...tt(H),width:"64px",minWidth:"64px",gap:"3px"},onMouseEnter:a=>N(a,H),onMouseLeave:k,title:H?b.resolveLabel(j.rewindActiveTooltip,st):j.rewindTooltip,children:H?l.jsxs(l.Fragment,{children:[l.jsxs("span",{style:{fontSize:"11px",fontWeight:"bold"},children:[st,"×"]}),"◀◀"]}):"◀◀"}),l.jsx("button",{onClick:()=>Z(!L),style:{...S,color:y.buttonActiveColor,fontSize:"18px",width:"40px",minWidth:"40px",height:"40px",borderColor:`${y.buttonActiveColor}55`,borderRadius:"50%",paddingLeft:L?"0":"2px"},onMouseEnter:a=>N(a,!0),onMouseLeave:k,title:L?j.pauseTooltip:H?j.playFromRewindTooltip:j.playTooltip,children:L?l.jsx(te,{}):"▶"}),l.jsx("button",{onClick:ct,style:{...tt(ot),width:"64px",minWidth:"64px",gap:"3px"},onMouseEnter:a=>N(a,ot),onMouseLeave:k,title:ot?b.resolveLabel(j.fastForwardActiveTooltip,st):j.fastForwardTooltip,children:ot?l.jsxs(l.Fragment,{children:["▶▶",l.jsxs("span",{style:{fontSize:"11px",fontWeight:"bold"},children:[st,"×"]})]}):"▶▶"}),U&&l.jsx("button",{onClick:G?q:void 0,disabled:!G,style:{...tt(!1),opacity:G?1:.3,cursor:G?"pointer":"default"},onMouseEnter:G?a=>N(a,!1):void 0,onMouseLeave:G?k:void 0,title:G?j.jumpToEndTooltip:j.noEndTimeTooltip,children:"⏭"})]}),!x&&l.jsx("div",{style:{display:"flex",justifyContent:"flex-end",alignItems:"center"},children:$!=null&&R!=null&&l.jsx("button",{onClick:$,style:{...S,color:y.buttonActiveColor,borderColor:`${y.buttonActiveColor}33`},onMouseEnter:a=>N(a,R),onMouseLeave:k,title:R?j.collapseSwimLanesTooltip:j.expandSwimLanesTooltip,children:R?l.jsx(Yt,{}):l.jsx(zt,{})})}),x&&$!=null&&R!=null&&l.jsx("button",{onClick:$,style:{...S,color:y.buttonActiveColor,borderColor:`${y.buttonActiveColor}33`,marginLeft:"4px"},onMouseEnter:a=>N(a,R),onMouseLeave:k,title:R?j.collapseSwimLanesTooltip:j.expandSwimLanesTooltip,children:R?l.jsx(Yt,{}):l.jsx(zt,{})})]})},Pt=n.forwardRef((v,L)=>{const{currentTime:J,defaultStartMs:i,defaultEndMs:C,theme:I,maxTicks:B,timezone:G,dateTimeFormat:ft,months:U,onTimeChange:Z,onDragStart:K,onDragEnd:F,onRangeSelect:ct,swimLanes:q,showSwimLanes:ut,onSwimLaneItemClick:et,onSwimLaneItemHover:lt,onSwimLaneItemDoubleClick:y,onSwimLaneItemContextMenu:R,onSwimLaneReorder:$}=v,M=n.useRef(null),H=n.useRef(I),ot=n.useRef(B),mt=n.useRef(G),st=n.useRef(ft),j=n.useRef(U),h=n.useRef(i),x=n.useRef(C),O=n.useRef(T.JulianDate.toDate(J).getTime());n.useEffect(()=>{H.current=I},[I]),n.useEffect(()=>{ot.current=B},[B]),n.useEffect(()=>{mt.current=G,g()},[G]),n.useEffect(()=>{st.current=ft,g()},[ft]),n.useEffect(()=>{j.current=U,g()},[U]);const S=n.useRef(q??[]),tt=n.useRef(ut??(q!=null&&q.length>0)),N=n.useRef(0),k=n.useRef(null),a=n.useRef(null),Q=n.useRef(et),P=n.useRef(lt),e=n.useRef(y),p=n.useRef(R),E=n.useRef($);n.useEffect(()=>{Q.current=et},[et]),n.useEffect(()=>{P.current=lt},[lt]),n.useEffect(()=>{e.current=y},[y]),n.useEffect(()=>{p.current=R},[R]),n.useEffect(()=>{E.current=$},[$]),n.useEffect(()=>{S.current=q??[],g()},[q]),n.useEffect(()=>{tt.current=ut??(q!=null&&q.length>0),g()},[ut,q]);const D=n.useRef(null),rt=n.useRef(null),gt=n.useRef(!1),Y=n.useRef(0),A=n.useRef("none"),dt=n.useRef(0),Rt=n.useRef(0),kt=n.useRef(0),_t=n.useRef(0),Lt=n.useRef(0),xt=n.useRef(null),V=n.useRef(ct);n.useEffect(()=>{V.current=ct},[ct]);const pt=n.useRef("none"),vt=n.useRef(0),yt=n.useRef(0),jt=n.useRef(0),St=n.useRef(0),It=(t,r)=>Math.hypot(r.clientX-t.clientX,r.clientY-t.clientY),bt=n.useCallback(()=>({startMs:h.current,endMs:x.current,currentMs:O.current,theme:H.current,maxTicks:ot.current,timezone:mt.current,use12h:/h/.test(st.current??""),months:j.current,swimLanes:S.current,showSwimLanes:tt.current,scrollTop:N.current,reorderState:a.current,rangeSelection:xt.current}),[]);n.useImperativeHandle(L,()=>({zoomTo(t,r,o){const d=Math.max(b.MIN_SPAN_MS,Math.min(b.MAX_SPAN_MS,r-t)),s=(t+r)/2;h.current=s-d/2,x.current=s+d/2,o!==void 0&&(O.current=o),g()},getVisibleRange(){return{startMs:h.current,endMs:x.current}},startFollow(t){if(Y.current=t,rt.current!==null)return;gt.current=!0;let r=performance.now();const o=()=>{const d=performance.now(),s=d-r;r=d;const c=s*Y.current;h.current+=c,x.current+=c,O.current+=c,g(),rt.current=requestAnimationFrame(o)};rt.current=requestAnimationFrame(o)},stopFollow(){gt.current=!1,rt.current!==null&&(cancelAnimationFrame(rt.current),rt.current=null)},correctFollow(t){if(!gt.current)return;const r=t-O.current;O.current=t,h.current+=r,x.current+=r},appendSwimLane(t){S.current=[...S.current,t],g()},updateSwimLane(t,r){S.current=S.current.map(o=>o.id===t?{...o,...r,id:o.id}:o),g()},removeSwimLane(t){S.current=S.current.filter(r=>r.id!==t),g()},reorderSwimLanes(t){const r=new Map(S.current.map(d=>[d.id,d])),o=[];for(const d of t){const s=r.get(d);s&&o.push(s)}S.current=o,g()}}));const g=n.useCallback(()=>{const t=M.current;if(!t)return;const r=t.getContext("2d");if(!r)return;const o=t.getBoundingClientRect(),d=o.width,s=o.height;if(d===0||s===0)return;const c=window.devicePixelRatio||1,m=Math.round(d*c),f=Math.round(s*c);(t.width!==m||t.height!==f)&&(t.width=m,t.height=f),r.save(),r.scale(c,c);const w=b.drawTimeline(r,d,s,bt());w!==N.current&&(N.current=w),r.restore()},[bt]);n.useLayoutEffect(()=>{g();const t=M.current;if(!t)return;const r=new ResizeObserver(()=>g());return r.observe(t),()=>r.disconnect()},[g]),n.useEffect(()=>{if(gt.current)return;const t=T.JulianDate.toDate(J).getTime();O.current!==t&&(O.current=t,g())},[J,g]);const Et=n.useCallback(t=>{if(D.current!==null)return;const r=()=>{const o=M.current,d=x.current-h.current,s=t*d*.01;if(h.current+=s,x.current+=s,o){const c=o.getBoundingClientRect(),m=Math.max(0,Math.min(c.width,Rt.current-c.left)),f=h.current+m/c.width*(x.current-h.current);O.current=f,Z(T.JulianDate.fromDate(new Date(f)))}g(),D.current=requestAnimationFrame(r)};D.current=requestAnimationFrame(r)},[g,Z]),wt=n.useCallback(()=>{D.current!==null&&(cancelAnimationFrame(D.current),D.current=null)},[]),u=n.useCallback((t,r,o,d)=>b.hitTestSwimLane(t,r,o,d,bt()),[bt]),_=n.useCallback((t,r,o)=>b.hitTestLaneLabel(t,r,o,bt()),[bt]),X=n.useCallback((t,r)=>b.isInSwimLaneRegion(t,r,bt()),[bt]),it=n.useCallback(t=>{t.preventDefault();const r=t.currentTarget.getBoundingClientRect(),o=t.clientX-r.left,d=t.clientY-r.top;if(t.button===0&&E.current){const s=_(o,d,r.height);if(s){const m=S.current.findIndex(f=>f.id===s.id);a.current={dragging:!0,dragLaneId:s.id,dragStartY:t.clientY,currentY:t.clientY,insertIndex:m},t.currentTarget.style.cursor="grabbing";return}}if(t.button===0&&X(d,r.height)){const s=(O.current-h.current)/(x.current-h.current)*r.width;if(!(Math.abs(o-s)<=10)&&u(o,d,r.width,r.height)){kt.current=performance.now();return}}if(t.button===0){const s=(O.current-h.current)/(x.current-h.current)*r.width,c=Math.abs(o-s)<=10,m=d>=r.height-b.TICK_AREA_HEIGHT;if(!c&&m)A.current="rangeSelectPending",Lt.current=o,_t.current=h.current+o/r.width*(x.current-h.current),t.currentTarget.style.cursor="crosshair",K==null||K();else{A.current="scrub",Rt.current=t.clientX,t.currentTarget.style.cursor="grabbing",K==null||K();const f=h.current+o/r.width*(x.current-h.current);O.current=f,g(),Z(T.JulianDate.fromDate(new Date(f)))}}else if(t.button===1)A.current="slide",dt.current=t.clientX;else if(t.button===2){if(p.current&&X(d,r.height))return;A.current="zoom",dt.current=t.clientX}},[g,Z,K,_,X,u]);n.useEffect(()=>{const t=o=>{const d=a.current;if(d&&d.dragging){d.currentY=o.clientY;const f=M.current;if(f){const w=f.getBoundingClientRect(),W=o.clientY-w.top;let Tt=-N.current;const Ft=S.current;let Gt=Ft.length;for(let Ot=0;Ot<Ft.length;Ot++){const Ut=Ft[Ot].height??b.DEFAULT_LANE_HEIGHT,ce=Tt+Ut/2;if(W<ce){Gt=Ot;break}Tt+=Ut+b.LANE_GAP}d.insertIndex=Gt}g();return}if(A.current==="none")return;const s=M.current;if(!s)return;const c=s.getBoundingClientRect(),m=c.width;if(A.current==="scrub"){Rt.current=o.clientX;const f=o.clientX-c.left,w=m*.08;f<w?Et(-1):f>m-w?Et(1):wt();const W=Math.max(0,Math.min(m,f)),ht=h.current+W/m*(x.current-h.current);O.current=ht,g(),Z(T.JulianDate.fromDate(new Date(ht)))}else if(A.current==="rangeSelectPending"||A.current==="rangeSelect"){const f=o.clientX-c.left,w=Math.abs(f-Lt.current);if(A.current==="rangeSelectPending"&&w>=3&&(A.current="rangeSelect"),A.current==="rangeSelect"){const W=Math.max(0,Math.min(m,f)),ht=h.current+W/m*(x.current-h.current);xt.current={startMs:_t.current,endMs:ht},g()}}else if(A.current==="slide"){const f=dt.current-o.clientX;if(dt.current=o.clientX,f!==0){const w=f/m*(x.current-h.current);h.current+=w,x.current+=w,g()}}else if(A.current==="zoom"){const f=dt.current-o.clientX;dt.current=o.clientX,f!==0&&z(Math.pow(1.01,f))}},r=()=>{var d,s;const o=a.current;if(o&&o.dragging){const c=Math.abs(o.currentY-o.dragStartY),m=S.current,f=m.findIndex(w=>w.id===o.dragLaneId);if(c>5&&f>=0&&o.insertIndex!==f&&o.insertIndex!==f+1){const w=[...m],[W]=w.splice(f,1),ht=o.insertIndex>f?o.insertIndex-1:o.insertIndex;w.splice(ht,0,W),S.current=w,(d=E.current)==null||d.call(E,w.map(Tt=>Tt.id))}a.current=null,M.current&&(M.current.style.cursor="default"),g();return}if(wt(),A.current==="rangeSelectPending"){O.current=_t.current,xt.current=null,A.current="none",M.current&&(M.current.style.cursor="default"),g(),Z(T.JulianDate.fromDate(new Date(_t.current))),F==null||F();return}if(A.current==="rangeSelect"){const c=xt.current;if(xt.current=null,c){const m=Math.min(c.startMs,c.endMs),f=Math.max(c.startMs,c.endMs);h.current=m,x.current=f;const w=T.JulianDate.fromDate(new Date(m)),W=T.JulianDate.fromDate(new Date(f));(s=V.current)==null||s.call(V,w,W)}A.current="none",M.current&&(M.current.style.cursor="default"),g(),F==null||F();return}A.current="none",M.current&&(M.current.style.cursor="default"),F==null||F()};return document.addEventListener("mousemove",t),document.addEventListener("mouseup",r),()=>{document.removeEventListener("mousemove",t),document.removeEventListener("mouseup",r)}},[g,Z,F,Et,wt]);const z=n.useCallback(t=>{const r=b.zoomRange(h.current,x.current,t);h.current=r.startMs,x.current=r.endMs,g()},[g]),nt=n.useCallback(t=>{t.preventDefault();const r=M.current;if(!r)return;const o=r.getBoundingClientRect(),d=t.clientY-o.top,s=tt.current,c=S.current;if(s&&c.length>0){const m=Math.max(0,o.height-b.TICK_AREA_HEIGHT);if(d>=0&&d<m){let f=0;for(const W of c)f+=(W.height??b.DEFAULT_LANE_HEIGHT)+b.LANE_GAP;const w=Math.max(0,f-m);if(w>0){N.current=Math.max(0,Math.min(w,N.current+t.deltaY*b.SWIM_LANE_SCROLL_SPEED)),g();return}}}z(Math.pow(1.05,t.deltaY>0?-1:1))},[z,g]);n.useEffect(()=>{const t=M.current;if(t)return t.addEventListener("wheel",nt,{passive:!1}),()=>t.removeEventListener("wheel",nt)},[nt]),n.useEffect(()=>{const t=M.current;if(!t)return;const r=s=>{s.preventDefault();const c=t.getBoundingClientRect();if(s.touches.length===1){const m=s.touches[0].clientX-c.left,f=Math.max(0,Math.min(c.width,m)),w=h.current+f/c.width*(x.current-h.current);St.current=O.current,pt.current="scrub",vt.current=s.touches[0].clientX,Rt.current=s.touches[0].clientX,O.current=w,g(),K==null||K(),Z(T.JulianDate.fromDate(new Date(w)))}else s.touches.length>=2&&(pt.current==="scrub"&&(O.current=St.current,g(),Z(T.JulianDate.fromDate(new Date(St.current)))),pt.current="pinch",yt.current=It(s.touches[0],s.touches[1]),jt.current=(s.touches[0].clientX+s.touches[1].clientX)/2-c.left)},o=s=>{s.preventDefault();const c=t.getBoundingClientRect();if(pt.current==="scrub"&&s.touches.length>=1){const m=s.touches[0].clientX-c.left,f=c.width*.08;if(Rt.current=s.touches[0].clientX,m<f)Et(-1);else if(m>c.width-f)Et(1);else{wt();const w=Math.max(0,Math.min(c.width,m)),W=h.current+w/c.width*(x.current-h.current);O.current=W,g(),Z(T.JulianDate.fromDate(new Date(W)))}}else if(pt.current==="slide"&&s.touches.length>=1){const m=vt.current-s.touches[0].clientX;if(vt.current=s.touches[0].clientX,m!==0){const f=m/c.width*(x.current-h.current);h.current+=f,x.current+=f,g()}}else if(pt.current==="pinch"&&s.touches.length>=2){const m=It(s.touches[0],s.touches[1]),f=(s.touches[0].clientX+s.touches[1].clientX)/2-c.left;if(m>0&&yt.current>0){const w=h.current+jt.current/c.width*(x.current-h.current),W=b.zoomAroundMs(h.current,x.current,yt.current/m,w);h.current=W.startMs,x.current=W.endMs,g()}yt.current=m,jt.current=f}},d=s=>{wt(),pt.current==="scrub"&&(F==null||F()),s.touches.length===0?pt.current="none":s.touches.length===1&&(pt.current="slide",vt.current=s.touches[0].clientX)};return t.addEventListener("touchstart",r,{passive:!1}),t.addEventListener("touchmove",o,{passive:!1}),t.addEventListener("touchend",d,{passive:!1}),()=>{t.removeEventListener("touchstart",r),t.removeEventListener("touchmove",o),t.removeEventListener("touchend",d)}},[g,K,F,Z,z,Et,wt]);const Mt=n.useCallback(t=>{var m,f,w;if(A.current!=="none")return;const r=t.currentTarget.getBoundingClientRect(),o=t.clientX-r.left,d=t.clientY-r.top,s=(O.current-h.current)/(x.current-h.current)*r.width,c=Math.abs(o-s)<=10;if(X(d,r.height)){const W=u(o,d,r.width,r.height),ht=k.current;if(W)t.currentTarget.style.cursor=c?"grab":"pointer",(!ht||ht.item.id!==W.item.id||ht.lane.id!==W.lane.id)&&(k.current=W,(m=P.current)==null||m.call(P,{laneId:W.lane.id,item:W.item,originalEvent:t.nativeEvent}),g());else if(ht&&(k.current=null,(f=P.current)==null||f.call(P,null),g()),c)t.currentTarget.style.cursor="grab";else{const Tt=_(o,d,r.height);t.currentTarget.style.cursor=Tt&&E.current?"grab":"default"}return}k.current&&(k.current=null,(w=P.current)==null||w.call(P,null),g()),c?t.currentTarget.style.cursor="grab":d>=r.height-b.TICK_AREA_HEIGHT?t.currentTarget.style.cursor="crosshair":t.currentTarget.style.cursor="default"},[g,u,X,_]),re=n.useCallback(t=>{var m;if(performance.now()-kt.current>300)return;const o=t.currentTarget.getBoundingClientRect(),d=t.clientX-o.left,s=t.clientY-o.top,c=u(d,s,o.width,o.height);c&&((m=Q.current)==null||m.call(Q,{laneId:c.lane.id,item:c.item,originalEvent:t.nativeEvent}))},[u]),oe=n.useCallback(t=>{var c;const r=t.currentTarget.getBoundingClientRect(),o=t.clientX-r.left,d=t.clientY-r.top,s=u(o,d,r.width,r.height);s&&((c=e.current)==null||c.call(e,{laneId:s.lane.id,item:s.item,originalEvent:t.nativeEvent}))},[u]),se=n.useCallback(t=>{const r=t.currentTarget.getBoundingClientRect(),o=t.clientX-r.left,d=t.clientY-r.top,s=u(o,d,r.width,r.height);s&&p.current?(t.preventDefault(),p.current({laneId:s.lane.id,item:s.item,originalEvent:t.nativeEvent})):t.preventDefault()},[u]);return n.useEffect(()=>()=>{D.current!==null&&cancelAnimationFrame(D.current),rt.current!==null&&cancelAnimationFrame(rt.current)},[]),l.jsx("canvas",{ref:M,style:{width:"100%",flex:1,minHeight:0,display:"block",cursor:"default"},onMouseDown:it,onMouseMove:Mt,onClick:re,onDoubleClick:oe,onMouseLeave:()=>{var t;k.current&&(k.current=null,(t=P.current)==null||t.call(P,null),g()),A.current==="none"&&M.current&&(M.current.style.cursor="default")},onContextMenu:se})});Pt.displayName="TimelineCanvas";const Bt=[2,4,8,16,32,100,1],Ht=[1,2,4,8,16,32,100],ee=({startTime:v,endTime:L,currentTime:J,clock:i,onTimeChange:C,onPlayPause:I,onMultiplierChange:B,height:G,showControls:ft=!0,showJumpToStart:U,showJumpToEnd:Z,enableDrag:K=!0,dateTimeFormat:F,onDateTimeClick:ct,jumpToTime:q,maxTicks:ut,ffSpeeds:et=Bt,rwSpeeds:lt=Ht,theme:y,className:R,timezone:$,swimLanes:M,showSwimLanes:H,onShowSwimLanesChange:ot,swimLaneTransition:mt="animated",onSwimLaneItemClick:st,onSwimLaneItemHover:j,onSwimLaneItemDoubleClick:h,onSwimLaneItemContextMenu:x,onSwimLaneReorder:O,onRangeSelect:S,labels:tt})=>{const N=()=>Date.now(),k=v?T.JulianDate.toDate(b.toJulianDate(v)).getTime():N()-432e5,a=L?T.JulianDate.toDate(b.toJulianDate(L)).getTime():N()+12*3600*1e3,[Q,P]=n.useState(()=>b.toJulianDate(J??v??T.JulianDate.fromDate(new Date))),[e,p]=n.useState((i==null?void 0:i.shouldAnimate)??!1),[E,D]=n.useState((i==null?void 0:i.multiplier)??1),[rt,gt]=n.useState(H??!0);n.useEffect(()=>{H!=null&>(H)},[H]);const Y=()=>{const u=!rt;gt(u),ot==null||ot(u)},A=M!=null&&M.length>0,dt=n.useRef(null),[Rt,kt]=n.useState(0);n.useEffect(()=>{const u=dt.current;if(!u)return;const _=new ResizeObserver(([X])=>kt(X.borderBoxSize[0].blockSize));return _.observe(u),()=>_.disconnect()},[ft]);const Lt=A&&!rt?`${Rt+b.TICK_AREA_HEIGHT}px`:G!=null?`${G}px`:"100%",xt=n.useRef(!1),V=n.useRef(null),pt={...b.defaultTheme,...y};n.useEffect(()=>{if(!i)return;const u=()=>{if(!xt.current){const _=T.JulianDate.clone(i.currentTime);if(P(_),p(i.shouldAnimate),D(i.multiplier),V.current){const{startMs:X,endMs:it}=V.current.getVisibleRange(),z=it-X,nt=T.JulianDate.toDate(_).getTime(),Mt=nt-X;Mt<=z*.1?V.current.zoomTo(nt-z*.1,nt+z*.9,nt):Mt>=z*.9&&V.current.zoomTo(nt-z*.9,nt+z*.1,nt)}}};return i.onTick.addEventListener(u),()=>{i.onTick.removeEventListener(u)}},[i]),n.useEffect(()=>{if(i)return;const u=setInterval(()=>{if(xt.current)return;const _=T.JulianDate.fromDate(new Date);if(P(_),V.current){const{startMs:X,endMs:it}=V.current.getVisibleRange(),z=it-X,nt=T.JulianDate.toDate(_).getTime(),Mt=nt-X;Mt<=z*.1?V.current.zoomTo(nt-z*.1,nt+z*.9,nt):Mt>=z*.9&&V.current.zoomTo(nt-z*.9,nt+z*.1,nt)}},1e3);return()=>clearInterval(u)},[i]),n.useEffect(()=>{if(!q)return;const u=b.toJulianDate(q);if(yt(u),V.current){const{startMs:_,endMs:X}=V.current.getVisibleRange(),it=X-_,z=T.JulianDate.toDate(u).getTime();V.current.zoomTo(z-it/2,z+it/2)}},[q]);const vt=(u,_=!0)=>{i&&(i.multiplier=u,_&&(i.shouldAnimate=!0)),D(u),_&&p(!0),B==null||B(u)},yt=u=>{P(u),i&&(i.currentTime=T.JulianDate.clone(u)),C==null||C(u)},jt=u=>{u&&E<0&&vt(1,!1),i&&(i.shouldAnimate=u),p(u),I==null||I(u)},St=()=>{const u=et.length>0?et:Bt,_=E>1?E:1,X=u.indexOf(_),it=u[X<0||X===u.length-1?0:X+1];vt(it)},It=()=>{const u=lt.length>0?lt:Ht,_=E<0?Math.abs(E):0,X=u.indexOf(_),it=-u[X<0||X===u.length-1?0:X+1];vt(it)},bt=()=>{var _;const u=b.toJulianDate(v??T.JulianDate.fromDate(new Date(k)));i&&(i.currentTime=T.JulianDate.clone(u)),P(u),(_=V.current)==null||_.zoomTo(k,a)},g=()=>{var _;const u=b.toJulianDate(L??T.JulianDate.fromDate(new Date(a)));i&&(i.currentTime=T.JulianDate.clone(u)),P(u),(_=V.current)==null||_.zoomTo(k,a)},Et=()=>{const u=T.JulianDate.fromDate(new Date);i&&(i.currentTime=T.JulianDate.clone(u)),P(u),vt(1);const _=Date.now();if(V.current){const{startMs:X,endMs:it}=V.current.getVisibleRange(),z=it-X;V.current.zoomTo(_-z/2,_+z/2)}},wt=Math.abs(T.JulianDate.toDate(Q).getTime()-Date.now())<1e4;return l.jsxs("div",{className:R,style:{width:"100%",height:Lt,overflow:"hidden",display:"flex",flexDirection:"column",fontFamily:"system-ui, -apple-system, sans-serif",transition:mt==="animated"?"height 0.2s ease":void 0},children:[ft&&l.jsx("div",{ref:dt,children:l.jsx(Wt,{currentTime:Q,isPlaying:e,multiplier:E,isLive:wt,hasStartTime:v!=null,hasEndTime:L!=null,showJumpToStart:U,showJumpToEnd:Z,onPlayPause:jt,onJumpToStart:bt,onRewind:It,onFastForward:St,onJumpToEnd:g,onJumpToLive:Et,onResetSpeed:()=>vt(1),onDateTimeClick:ct,dateTimeFormat:F,timezone:$,theme:pt,swimLanesVisible:A?rt:void 0,onToggleSwimLanes:A?Y:void 0,labels:tt})}),K!==!1&&l.jsx(Pt,{ref:V,currentTime:Q,defaultStartMs:k,defaultEndMs:a,theme:pt,maxTicks:ut,timezone:$,dateTimeFormat:F,months:tt==null?void 0:tt.months,onTimeChange:yt,onDragStart:()=>{xt.current=!0},onDragEnd:()=>{xt.current=!1},swimLanes:M,showSwimLanes:rt,onSwimLaneItemClick:st,onSwimLaneItemHover:j,onSwimLaneItemDoubleClick:h,onSwimLaneItemContextMenu:x,onSwimLaneReorder:O,onRangeSelect:S})]})},ne=({startTime:v,endTime:L,currentTime:J,width:i,height:C,tickInterval:I,showLabels:B,snapToTicks:G,enableDrag:ft,theme:U,onTimeChange:Z,onVisibleRangeChange:K,onDragStart:F,onDragEnd:ct})=>{const q=n.useMemo(()=>b.generateTicks(v,L,I,i),[v,L,I,i]),ut=n.useMemo(()=>b.timeToPosition(J,v,L,i),[J,v,L,i]),et=n.useRef(null),lt=R=>{if(!ft)return;const $=R.currentTarget.getBoundingClientRect(),M=R.clientX-$.left,H=Math.max(0,Math.min(i,M));if(!(Math.abs(H-ut)<=10)){let k=H;G&&(k=b.snapToTick(H,q,10));const a=new Date(v).getTime(),Q=new Date(L).getTime();Z(T.JulianDate.fromDate(new Date(a+k/i*(Q-a))));return}F==null||F();const mt=R.clientX,st=new Date(J).getTime(),j=new Date(v).getTime(),x=(new Date(L).getTime()-j)/i;let O=0,S=!1;const tt=k=>{O=k.clientX-mt,S=!0,et.current||(et.current=requestAnimationFrame(()=>{if(S){const a=st+O*x;Z(T.JulianDate.fromDate(new Date(a))),S=!1}et.current=null}))},N=()=>{document.removeEventListener("mousemove",tt),document.removeEventListener("mouseup",N),et.current!==null&&(cancelAnimationFrame(et.current),et.current=null),ct==null||ct()};document.addEventListener("mousemove",tt),document.addEventListener("mouseup",N)},y=R=>{R.preventDefault();const $=R.shiftKey?R.deltaY:R.deltaX!==0?R.deltaX:R.deltaY;if(Math.abs($)<1)return;const M=new Date(v).getTime(),H=new Date(L).getTime(),ot=$/i*(H-M)*.5;K==null||K(T.JulianDate.fromDate(new Date(M+ot)),T.JulianDate.fromDate(new Date(H+ot)))};return l.jsxs("svg",{width:"100%",height:C,style:{backgroundColor:U.backgroundColor,display:"block",cursor:"default"},onMouseDown:lt,onWheel:y,children:[l.jsx("rect",{width:i,height:C,fill:U.backgroundColor}),q.map((R,$)=>l.jsxs("g",{children:[l.jsx("line",{x1:R.position,y1:C-(R.isMajor?U.majorTickHeight:U.minorTickHeight),x2:R.position,y2:C,stroke:R.isMajor?U.majorTickColor:U.tickColor,strokeWidth:"1"}),B&&R.isMajor&&R.label&&l.jsx("text",{x:R.position,y:C-U.majorTickHeight-5,textAnchor:"middle",fill:U.labelColor,fontSize:U.fontSize,fontFamily:"monospace",children:R.label})]},$)),l.jsx("line",{x1:ut,y1:0,x2:ut,y2:C,stroke:U.indicatorColor,strokeWidth:U.indicatorLineWidth,pointerEvents:"none"}),ft&&l.jsx("rect",{x:Math.max(0,ut-10),y:0,width:20,height:C,fill:"transparent",style:{cursor:"ew-resize"},pointerEvents:"visiblePainted"}),l.jsx("circle",{cx:ut,cy:5,r:4,fill:U.indicatorColor,pointerEvents:"none"})]})};Object.defineProperty(at,"TICK_AREA_HEIGHT",{enumerable:!0,get:()=>b.TICK_AREA_HEIGHT}),at.Timeline=ee,at.TimelineCanvas=Pt,at.TimelineControls=Wt,at.TimelineSVG=ne,Object.keys(b).forEach(v=>{v!=="default"&&!Object.prototype.hasOwnProperty.call(at,v)&&Object.defineProperty(at,v,{enumerable:!0,get:()=>b[v]})}),Object.defineProperty(at,Symbol.toStringTag,{value:"Module"})}));
|
package/dist/index.d.ts
CHANGED
|
@@ -72,9 +72,14 @@ declare interface TimelineCanvasProps {
|
|
|
72
72
|
maxTicks?: number;
|
|
73
73
|
/** @see TimelineBaseProps.timezone */
|
|
74
74
|
timezone?: string;
|
|
75
|
+
/** @see TimelineBaseProps.dateTimeFormat */
|
|
76
|
+
dateTimeFormat?: string;
|
|
77
|
+
/** Abbreviated month names for tick labels. Falls back to English when omitted. */
|
|
78
|
+
months?: string[];
|
|
75
79
|
onTimeChange: (time: Cesium.JulianDate) => void;
|
|
76
80
|
onDragStart?: () => void;
|
|
77
81
|
onDragEnd?: () => void;
|
|
82
|
+
onRangeSelect?: (start: Cesium.JulianDate, end: Cesium.JulianDate) => void;
|
|
78
83
|
swimLanes?: SwimLane[];
|
|
79
84
|
showSwimLanes?: boolean;
|
|
80
85
|
onSwimLaneItemClick?: (info: SwimLaneEventInfo) => void;
|
|
@@ -118,6 +123,7 @@ export declare interface TimelineProps {
|
|
|
118
123
|
onSwimLaneItemDoubleClick?: (info: SwimLaneEventInfo) => void;
|
|
119
124
|
onSwimLaneItemContextMenu?: (info: SwimLaneEventInfo) => void;
|
|
120
125
|
onSwimLaneReorder?: (orderedLaneIds: string[]) => void;
|
|
126
|
+
onRangeSelect?: (start: Cesium.JulianDate, end: Cesium.JulianDate) => void;
|
|
121
127
|
/**
|
|
122
128
|
* Overrides for control-bar labels and tooltips.
|
|
123
129
|
* Useful for localisation or custom verbiage — provide only the strings you
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kteneyck/cesium-timeline-react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.9.0",
|
|
4
4
|
"description": "React timeline component for Cesium with clock integration",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "kteneyck",
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
],
|
|
43
43
|
"scripts": {
|
|
44
44
|
"build": "vite build",
|
|
45
|
-
"test": "vitest"
|
|
45
|
+
"test": "vitest run"
|
|
46
46
|
},
|
|
47
47
|
"peerDependencies": {
|
|
48
48
|
"cesium": "^1.100.0",
|
|
@@ -52,9 +52,12 @@
|
|
|
52
52
|
"@types/react-dom": ">=18"
|
|
53
53
|
},
|
|
54
54
|
"dependencies": {
|
|
55
|
-
"@kteneyck/cesium-timeline-core": "0.
|
|
55
|
+
"@kteneyck/cesium-timeline-core": "0.9.0"
|
|
56
56
|
},
|
|
57
57
|
"devDependencies": {
|
|
58
|
+
"@testing-library/jest-dom": "^6.0.0",
|
|
59
|
+
"@testing-library/react": "^16.0.0",
|
|
60
|
+
"@testing-library/user-event": "^14.0.0",
|
|
58
61
|
"@types/react": "19.0.1",
|
|
59
62
|
"@types/react-dom": "19.0.1",
|
|
60
63
|
"@vitejs/plugin-react": "^4.2.0",
|