@insync-stageplayer/plotly-chart 0.5.38-beta.3 → 0.6.0

package/lib/PlotlyGraph/EventMenu.d.ts

@@ -1,12 +1,13 @@
 import React from "react";
 declare type props = {
-    id: string;
+    selectedEvent: any;
     show: boolean;
     bottom: number;
     left: number;
     useMarkersActions: any;
     eventdatabyIds: any;
     events: any;
+    time: any;
 };
 export declare const EventMenu: React.FC<props>;
 export {};

package/lib/PlotlyGraph/EventMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EventMenu.d.ts","sourceRoot":"","sources":["../../src/PlotlyGraph/EventMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AA8BnD,aAAK,KAAK,GAAG;IACX,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,iBAAiB,EAAE,GAAG,CAAC;IACvB,cAAc,EAAE,GAAG,CAAC;IACpB,MAAM,EAAE,GAAG,CAAC;CACb,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAuFrC,CAAC"}
+{"version":3,"file":"EventMenu.d.ts","sourceRoot":"","sources":["../../src/PlotlyGraph/EventMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAsCnD,aAAK,KAAK,GAAG;IACX,aAAa,EAAE,GAAG,CAAC;IACnB,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,iBAAiB,EAAE,GAAG,CAAC;IACvB,cAAc,EAAE,GAAG,CAAC;IACpB,MAAM,EAAE,GAAG,CAAC;IACZ,IAAI,EAAE,GAAG,CAAC;CACX,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAwXrC,CAAC"}

package/lib/PlotlyGraph/EventMenu.js

@@ -2,7 +2,8 @@ import React, { useEffect, useState } from "react";
 import { parse } from "query-string";
 import styled from "styled-components";
 import { useTheme as useSelectedTheme } from "@insync-stageplayer/ui-components";
-import { deleteMarkerEvent } from "@insync-stageplayer/measurements";
+import { deleteMarkerEvent, updateMarkerEvent, } from "@insync-stageplayer/measurements";
+import { DeleteIcon2, LineIconStart, LineIconEnd, } from "@insync-stageplayer/ui-components";
 const MenuWrapper = styled.div `
   position: absolute;
   z-index: 99;
@@ -24,29 +25,74 @@ const MenuBubble = styled.div `
   transform: rotate(45deg);
   box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
 `;
-export const EventMenu = ({ id, show, bottom, left, useMarkersActions, eventdatabyIds, events, }) => {
+export const EventMenu = ({ selectedEvent, show, bottom, left, useMarkersActions, eventdatabyIds, events, time, }) => {
     const selectedTheme = useSelectedTheme();
     const params = parse(document.location.search);
     const [eventMenuHover, setEventMenuHover] = useState(false);
-    const [deleteMarker, setdeleteMarker] = useState({});
-    const [removeMarkerEvent, setremoveMarkerEvent] = useState(false);
+    const [deleteMarker, setDeleteMarker] = useState({});
+    const [removeMarkerEvent, setRemoveMarkerEvent] = useState(false);
+    const [updateMarker, setUpdateMarker] = useState({});
+    const [updateMarkerState, setUpdateMarkerState] = useState(false);
     const { setEvents } = useMarkersActions();
+    const [startDisabled, setStartDisabled] = useState(true);
+    const [endDisabled, setEndDisabled] = useState(true);
+    const [movePointDisabled, setMovePointDisabled] = useState(false);
+    const { id, name, type, relativeStartTimeMicroSeconds } = selectedEvent || {};
     const markerDeleting = deleteMarkerEvent({
         markerData: deleteMarker,
         dataType: "eventdatadelete",
         removeMarkerEvent,
     });
+    const markerUpdating = updateMarkerEvent({
+        markerData: updateMarker,
+        dataType: "eventUpdate",
+        updateMarkerState,
+    });
     const deleteEvent = () => {
         const [eventStreamId] = eventdatabyIds.eventStreamIds;
         const { file } = eventdatabyIds;
         const { projectId } = params;
-        setdeleteMarker({
+        setDeleteMarker({
             file,
             eventStreamId,
             MarkerEvents: [id],
             projectId,
         });
-        setremoveMarkerEvent(true);
+        setRemoveMarkerEvent(true);
+    };
+    const modifyStart = () => {
+        const [eventStreamId] = eventdatabyIds.eventStreamIds;
+        const { file } = eventdatabyIds;
+        const { projectId } = params;
+        setUpdateMarker({
+            file,
+            eventStreamId,
+            MarkerEvents: [
+                {
+                    eventId: id,
+                    relativeStartTimeMicroSeconds: time,
+                },
+            ],
+            projectId,
+        });
+        setUpdateMarkerState(true);
+    };
+    const modifyEnd = () => {
+        const [eventStreamId] = eventdatabyIds.eventStreamIds;
+        const { file } = eventdatabyIds;
+        const { projectId } = params;
+        setUpdateMarker({
+            file,
+            eventStreamId,
+            MarkerEvents: [
+                {
+                    eventId: id,
+                    relativeEndTimeMicroSeconds: time,
+                },
+            ],
+            projectId,
+        });
+        setUpdateMarkerState(true);
     };
     useEffect(() => {
         if (removeMarkerEvent && deleteMarker && markerDeleting) {
@@ -60,25 +106,198 @@ export const EventMenu = ({ id, show, bottom, left, useMarkersActions, eventdata
                 setEventMenuHover(false); // after delete hide menu
             });
         }
-        return setremoveMarkerEvent(false);
+        return setRemoveMarkerEvent(false);
     }, [removeMarkerEvent, deleteMarker, events, markerDeleting, setEvents]);
+    useEffect(() => {
+        if (updateMarkerState && updateMarker && markerUpdating) {
+            markerUpdating
+                .then((response) => response)
+                .then((data) => {
+                const updatedEvent = data.updatedEvents[0];
+                // First remove updated item temporary from the list
+                const updatedEventList = events === null || events === void 0 ? void 0 : events.filter((event) => {
+                    return event.id !== updatedEvent.id;
+                });
+                const reinsertPosition = updatedEventList === null || updatedEventList === void 0 ? void 0 : updatedEventList.findIndex((event) => {
+                    return (parseFloat(event.relativeStartTimeMicroSeconds) >
+                        parseFloat(updatedEvent.relativeStartTimeMicroSeconds));
+                });
+                // Next reinsert the updated item on the correct place
+                updatedEventList.splice(reinsertPosition > -1 ? reinsertPosition : updatedEventList.length, 0, updatedEvent);
+                setEvents(updatedEventList);
+                setEventMenuHover(false); // after action hide menu
+            });
+        }
+        return setUpdateMarkerState(false);
+    }, [updateMarkerState, updateMarker, events, markerUpdating, setEvents]);
+    useEffect(() => {
+        if (show) {
+            // filter out all events of this type
+            const trackItems = events.filter((event) => event.name === name);
+            // get selected event
+            const itemIndex = trackItems.findIndex((event) => {
+                return event.id === id;
+            });
+            if (itemIndex !== -1) {
+                if (type === "point") {
+                    const roundedTime = Math.round(time);
+                    // allow moving a point event if there is no other event at the same time
+                    if (trackItems[itemIndex].relativeStartTimeMicroSeconds < roundedTime) {
+                        // default allow this action
+                        setMovePointDisabled(false);
+                        // only check events after this event if they exactly match the time
+                        for (let i = itemIndex; i < trackItems.length; i++) {
+                            if (trackItems[i].relativeStartTimeMicroSeconds < roundedTime) {
+                            }
+                            else if (trackItems[i].relativeStartTimeMicroSeconds > roundedTime) {
+                                break;
+                            }
+                            else if (parseInt(trackItems[i].relativeStartTimeMicroSeconds) ===
+                                roundedTime) {
+                                setMovePointDisabled(true);
+                                break;
+                            }
+                        }
+                    }
+                    else if (trackItems[itemIndex].relativeStartTimeMicroSeconds > roundedTime) {
+                        // default allow this action
+                        setMovePointDisabled(false);
+                        // only check events before this event if they exactly match the time
+                        for (let i = itemIndex; i > 0; i--) {
+                            if (trackItems[i].relativeStartTimeMicroSeconds > roundedTime) {
+                            }
+                            else if (trackItems[i].relativeStartTimeMicroSeconds < roundedTime) {
+                                break;
+                            }
+                            else if (parseInt(trackItems[i].relativeStartTimeMicroSeconds) ===
+                                roundedTime) {
+                                setMovePointDisabled(true);
+                                break;
+                            }
+                        }
+                    }
+                }
+                else if (type === "state") {
+                    if ((trackItems[itemIndex].relativeStartTimeMicroSeconds > time ||
+                        trackItems[itemIndex].relativeEndTimeMicroSeconds > time) &&
+                        (itemIndex === 0 ||
+                            trackItems[itemIndex - 1].relativeEndTimeMicroSeconds < time)) {
+                        setStartDisabled(false);
+                    }
+                    else {
+                        setStartDisabled(true);
+                    }
+                    if ((trackItems[itemIndex].relativeStartTimeMicroSeconds < time ||
+                        trackItems[itemIndex].relativeEndTimeMicroSeconds < time) &&
+                        (itemIndex === trackItems.length - 1 ||
+                            trackItems[itemIndex + 1].relativeStartTimeMicroSeconds > time)) {
+                        setEndDisabled(false);
+                    }
+                    else {
+                        setEndDisabled(true);
+                    }
+                }
+                else if (type === "comments") {
+                    if ((trackItems[itemIndex].relativeStartTimeMicroSeconds > time ||
+                        trackItems[itemIndex].relativeEndTimeMicroSeconds > time) &&
+                        (itemIndex === 0 ||
+                            trackItems[itemIndex - 1].relativeEndTimeMicroSeconds < time)) {
+                        setStartDisabled(false);
+                    }
+                    else {
+                        setStartDisabled(true);
+                    }
+                    if ((trackItems[itemIndex].relativeStartTimeMicroSeconds < time ||
+                        trackItems[itemIndex].relativeEndTimeMicroSeconds < time) &&
+                        (itemIndex === trackItems.length - 1 ||
+                            trackItems[itemIndex + 1].relativeStartTimeMicroSeconds > time)) {
+                        setEndDisabled(false);
+                    }
+                    else {
+                        setEndDisabled(true);
+                    }
+                }
+            }
+        }
+    }, [show, time, events, id, name, startDisabled, endDisabled]);
     return (React.createElement(MenuWrapper, { style: {
             left: left + "px",
             bottom: bottom + "px",
         }, onMouseEnter: () => setEventMenuHover(true), onMouseLeave: () => setEventMenuHover(false) },
         React.createElement(Menu, { style: {
                 display: show || eventMenuHover ? "block" : "none",
-                backgroundColor: selectedTheme.colors.foreground,
+                backgroundColor: selectedTheme.colors.markerMenuSecondary,
             } },
-            React.createElement("button", { style: {
-                    padding: 0,
-                    border: "none",
-                    background: "none",
-                    color: selectedTheme.colors.background,
-                }, onClick: deleteEvent }, "delete")),
+            React.createElement("div", null,
+                React.createElement("button", { style: {
+                        padding: 0,
+                        border: "none",
+                        background: "none",
+                        color: selectedTheme.colors.foreground,
+                    }, onClick: deleteEvent },
+                    React.createElement(DeleteIcon2, null),
+                    "Delete")),
+            type === "point" && (React.createElement(React.Fragment, null,
+                React.createElement("div", null,
+                    React.createElement("button", { style: {
+                            padding: 0,
+                            border: "none",
+                            background: "none",
+                            color: movePointDisabled
+                                ? "#D3D3D3"
+                                : selectedTheme.colors.foreground,
+                        }, onClick: modifyStart, disabled: movePointDisabled },
+                        relativeStartTimeMicroSeconds <= time ? (React.createElement(LineIconStart, null)) : (React.createElement(LineIconEnd, null)),
+                        "Move to NOW")))),
+            type === "state" && (React.createElement(React.Fragment, null,
+                React.createElement("div", null,
+                    React.createElement("button", { style: {
+                            padding: 0,
+                            border: "none",
+                            background: "none",
+                            color: startDisabled
+                                ? "#D3D3D3"
+                                : selectedTheme.colors.foreground,
+                        }, onClick: modifyStart, disabled: startDisabled },
+                        React.createElement(LineIconStart, null),
+                        "Set START to NOW")),
+                React.createElement("div", null,
+                    React.createElement("button", { style: {
+                            padding: 0,
+                            border: "none",
+                            background: "none",
+                            color: endDisabled
+                                ? "#D3D3D3"
+                                : selectedTheme.colors.foreground,
+                        }, onClick: modifyEnd, disabled: endDisabled },
+                        React.createElement(LineIconEnd, null),
+                        "Set END to NOW")))),
+            type === "comments" && (React.createElement(React.Fragment, null,
+                React.createElement("div", null,
+                    React.createElement("button", { style: {
+                            padding: 0,
+                            border: "none",
+                            background: "none",
+                            color: startDisabled
+                                ? "#D3D3D3"
+                                : selectedTheme.colors.foreground,
+                        }, onClick: modifyStart, disabled: startDisabled },
+                        React.createElement(LineIconStart, null),
+                        "Set START to NOW")),
+                React.createElement("div", null,
+                    React.createElement("button", { style: {
+                            padding: 0,
+                            border: "none",
+                            background: "none",
+                            color: endDisabled
+                                ? "#D3D3D3"
+                                : selectedTheme.colors.foreground,
+                        }, onClick: modifyEnd, disabled: endDisabled },
+                        React.createElement(LineIconEnd, null),
+                        "Set END to NOW"))))),
         React.createElement(MenuBubble, { style: {
                 display: show || eventMenuHover ? "block" : "none",
-                backgroundColor: selectedTheme.colors.foreground,
+                backgroundColor: selectedTheme.colors.markerMenuSecondary,
             } })));
 };
 //# sourceMappingURL=EventMenu.js.map

package/lib/PlotlyGraph/EventMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"EventMenu.js","sourceRoot":"","sources":["../../src/PlotlyGraph/EventMenu.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"EventMenu.js","sourceRoot":"","sources":["../../src/PlotlyGraph/EventMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AACrC,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,QAAQ,IAAI,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AACjF,OAAO,EACL,iBAAiB,EACjB,iBAAiB,GAClB,MAAM,kCAAkC,CAAC;AAC1C,OAAO,EACL,WAAW,EACX,aAAa,EACb,WAAW,GACZ,MAAM,mCAAmC,CAAC;AAE3C,MAAM,WAAW,GAAG,MAAM,CAAC,GAAG,CAAA;;;CAG7B,CAAC;AAEF,MAAM,IAAI,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;CAMtB,CAAC;AAEF,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;CAS5B,CAAC;AAaF,MAAM,CAAC,MAAM,SAAS,GAAoB,CAAC,EACzC,aAAa,EACb,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,iBAAiB,EACjB,cAAc,EACd,MAAM,EACN,IAAI,GACL,EAAE,EAAE;IACH,MAAM,aAAa,GAAG,gBAAgB,EAAE,CAAC;IACzC,MAAM,MAAM,GAAG,KAAK,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;IAC/C,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5D,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACrD,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClE,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACrD,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClE,MAAM,EAAE,SAAS,EAAE,GAAG,iBAAiB,EAAE,CAAC;IAC1C,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACzD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IACrD,MAAM,CAAC,iBAAiB,EAAE,oBAAoB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAElE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,6BAA6B,EAAE,GAAG,aAAa,IAAI,EAAE,CAAC;IAE9E,MAAM,cAAc,GAAG,iBAAiB,CAAC;QACvC,UAAU,EAAE,YAAY;QACxB,QAAQ,EAAE,iBAAiB;QAC3B,iBAAiB;KAClB,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG,iBAAiB,CAAC;QACvC,UAAU,EAAE,YAAY;QACxB,QAAQ,EAAE,aAAa;QACvB,iBAAiB;KAClB,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,MAAM,CAAC,aAAa,CAAC,GAAG,cAAc,CAAC,cAAc,CAAC;QACtD,MAAM,EAAE,IAAI,EAAE,GAAG,cAAc,CAAC;QAChC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC;QAC7B,eAAe,CAAC;YACd,IAAI;YACJ,aAAa;YACb,YAAY,EAAE,CAAC,EAAE,CAAC;YAClB,SAAS;SACV,CAAC,CAAC;QACH,oBAAoB,CAAC,IAAI,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,MAAM,CAAC,aAAa,CAAC,GAAG,cAAc,CAAC,cAAc,CAAC;QACtD,MAAM,EAAE,IAAI,EAAE,GAAG,cAAc,CAAC;QAChC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC;QAC7B,eAAe,CAAC;YACd,IAAI;YACJ,aAAa;YACb,YAAY,EAAE;gBACZ;oBACE,OAAO,EAAE,EAAE;oBACX,6BAA6B,EAAE,IAAI;iBACpC;aACF;YACD,SAAS;SACV,CAAC,CAAC;QACH,oBAAoB,CAAC,IAAI,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,MAAM,SAAS,GAAG,GAAG,EAAE;QACrB,MAAM,CAAC,aAAa,CAAC,GAAG,cAAc,CAAC,cAAc,CAAC;QACtD,MAAM,EAAE,IAAI,EAAE,GAAG,cAAc,CAAC;QAChC,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC;QAC7B,eAAe,CAAC;YACd,IAAI;YACJ,aAAa;YACb,YAAY,EAAE;gBACZ;oBACE,OAAO,EAAE,EAAE;oBACX,2BAA2B,EAAE,IAAI;iBAClC;aACF;YACD,SAAS;SACV,CAAC,CAAC;QACH,oBAAoB,CAAC,IAAI,CAAC,CAAC;IAC7B,CAAC,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,iBAAiB,IAAI,YAAY,IAAI,cAAc,EAAE;YACvD,cAAc;iBACX,IAAI,CAAC,CAAC,QAAa,EAAE,EAAE,CAAC,QAAQ,CAAC;iBACjC,IAAI,CAAC,CAAC,IAAS,EAAE,EAAE;gBAClB,MAAM,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,SAAS,CAAC;gBAClC,SAAS,CACP,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,CAAC,CAAC,IAAiB,EAAE,EAAE;oBACnC,OAAO,IAAI,CAAC,EAAE,KAAK,QAAQ,CAAC;gBAC9B,CAAC,CAAC,CACH,CAAC;gBACF,iBAAiB,CAAC,KAAK,CAAC,CAAC,CAAC,yBAAyB;YACrD,CAAC,CAAC,CAAC;SACN;QACD,OAAO,oBAAoB,CAAC,KAAK,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,iBAAiB,EAAE,YAAY,EAAE,MAAM,EAAE,cAAc,EAAE,SAAS,CAAC,CAAC,CAAC;IAEzE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,iBAAiB,IAAI,YAAY,IAAI,cAAc,EAAE;YACvD,cAAc;iBACX,IAAI,CAAC,CAAC,QAAa,EAAE,EAAE,CAAC,QAAQ,CAAC;iBACjC,IAAI,CAAC,CAAC,IAAS,EAAE,EAAE;gBAClB,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;gBAE3C,oDAAoD;gBACpD,MAAM,gBAAgB,GAAG,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,CAAC,CAAC,KAAU,EAAE,EAAE;oBACrD,OAAO,KAAK,CAAC,EAAE,KAAK,YAAY,CAAC,EAAE,CAAC;gBACtC,CAAC,CAAC,CAAC;gBAEH,MAAM,gBAAgB,GAAG,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,SAAS,CAAC,CAAC,KAAU,EAAE,EAAE;oBAClE,OAAO,CACL,UAAU,CAAC,KAAK,CAAC,6BAA6B,CAAC;wBAC/C,UAAU,CAAC,YAAY,CAAC,6BAA6B,CAAC,CACvD,CAAC;gBACJ,CAAC,CAAC,CAAC;gBAEH,sDAAsD;gBACtD,gBAAgB,CAAC,MAAM,CACrB,gBAAgB,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,gBAAgB,CAAC,MAAM,EAClE,CAAC,EACD,YAAY,CACb,CAAC;gBAEF,SAAS,CAAC,gBAAgB,CAAC,CAAC;gBAC5B,iBAAiB,CAAC,KAAK,CAAC,CAAC,CAAC,yBAAyB;YACrD,CAAC,CAAC,CAAC;SACN;QACD,OAAO,oBAAoB,CAAC,KAAK,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,iBAAiB,EAAE,YAAY,EAAE,MAAM,EAAE,cAAc,EAAE,SAAS,CAAC,CAAC,CAAC;IAEzE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,EAAE;YACR,qCAAqC;YACrC,MAAM,UAAU,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,KAAU,EAAE,EAAE,CAAC,KAAK,CAAC,IAAI,KAAK,IAAI,CAAC,CAAC;YAEtE,qBAAqB;YACrB,MAAM,SAAS,GAAG,UAAU,CAAC,SAAS,CAAC,CAAC,KAAU,EAAE,EAAE;gBACpD,OAAO,KAAK,CAAC,EAAE,KAAK,EAAE,CAAC;YACzB,CAAC,CAAC,CAAC;YAEH,IAAI,SAAS,KAAK,CAAC,CAAC,EAAE;gBACpB,IAAI,IAAI,KAAK,OAAO,EAAE;oBACpB,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;oBACrC,yEAAyE;oBACzE,IACE,UAAU,CAAC,SAAS,CAAC,CAAC,6BAA6B,GAAG,WAAW,EACjE;wBACA,4BAA4B;wBAC5B,oBAAoB,CAAC,KAAK,CAAC,CAAC;wBAC5B,oEAAoE;wBACpE,KAAK,IAAI,CAAC,GAAG,SAAS,EAAE,CAAC,GAAG,UAAU,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;4BAClD,IAAI,UAAU,CAAC,CAAC,CAAC,CAAC,6BAA6B,GAAG,WAAW,EAAE;6BAC9D;iCAAM,IACL,UAAU,CAAC,CAAC,CAAC,CAAC,6BAA6B,GAAG,WAAW,EACzD;gCACA,MAAM;6BACP;iCAAM,IACL,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,6BAA6B,CAAC;gCACrD,WAAW,EACX;gCACA,oBAAoB,CAAC,IAAI,CAAC,CAAC;gCAC3B,MAAM;6BACP;yBACF;qBACF;yBAAM,IACL,UAAU,CAAC,SAAS,CAAC,CAAC,6BAA6B,GAAG,WAAW,EACjE;wBACA,4BAA4B;wBAC5B,oBAAoB,CAAC,KAAK,CAAC,CAAC;wBAC5B,qEAAqE;wBACrE,KAAK,IAAI,CAAC,GAAG,SAAS,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,EAAE;4BAClC,IAAI,UAAU,CAAC,CAAC,CAAC,CAAC,6BAA6B,GAAG,WAAW,EAAE;6BAC9D;iCAAM,IACL,UAAU,CAAC,CAAC,CAAC,CAAC,6BAA6B,GAAG,WAAW,EACzD;gCACA,MAAM;6BACP;iCAAM,IACL,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,6BAA6B,CAAC;gCACrD,WAAW,EACX;gCACA,oBAAoB,CAAC,IAAI,CAAC,CAAC;gCAC3B,MAAM;6BACP;yBACF;qBACF;iBACF;qBAAM,IAAI,IAAI,KAAK,OAAO,EAAE;oBAC3B,IACE,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,6BAA6B,GAAG,IAAI;wBACzD,UAAU,CAAC,SAAS,CAAC,CAAC,2BAA2B,GAAG,IAAI,CAAC;wBAC3D,CAAC,SAAS,KAAK,CAAC;4BACd,UAAU,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,2BAA2B,GAAG,IAAI,CAAC,EAC/D;wBACA,gBAAgB,CAAC,KAAK,CAAC,CAAC;qBACzB;yBAAM;wBACL,gBAAgB,CAAC,IAAI,CAAC,CAAC;qBACxB;oBACD,IACE,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,6BAA6B,GAAG,IAAI;wBACzD,UAAU,CAAC,SAAS,CAAC,CAAC,2BAA2B,GAAG,IAAI,CAAC;wBAC3D,CAAC,SAAS,KAAK,UAAU,CAAC,MAAM,GAAG,CAAC;4BAClC,UAAU,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,6BAA6B,GAAG,IAAI,CAAC,EACjE;wBACA,cAAc,CAAC,KAAK,CAAC,CAAC;qBACvB;yBAAM;wBACL,cAAc,CAAC,IAAI,CAAC,CAAC;qBACtB;iBACF;qBAAM,IAAI,IAAI,KAAK,UAAU,EAAE;oBAC9B,IACE,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,6BAA6B,GAAG,IAAI;wBACzD,UAAU,CAAC,SAAS,CAAC,CAAC,2BAA2B,GAAG,IAAI,CAAC;wBAC3D,CAAC,SAAS,KAAK,CAAC;4BACd,UAAU,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,2BAA2B,GAAG,IAAI,CAAC,EAC/D;wBACA,gBAAgB,CAAC,KAAK,CAAC,CAAC;qBACzB;yBAAM;wBACL,gBAAgB,CAAC,IAAI,CAAC,CAAC;qBACxB;oBACD,IACE,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,6BAA6B,GAAG,IAAI;wBACzD,UAAU,CAAC,SAAS,CAAC,CAAC,2BAA2B,GAAG,IAAI,CAAC;wBAC3D,CAAC,SAAS,KAAK,UAAU,CAAC,MAAM,GAAG,CAAC;4BAClC,UAAU,CAAC,SAAS,GAAG,CAAC,CAAC,CAAC,6BAA6B,GAAG,IAAI,CAAC,EACjE;wBACA,cAAc,CAAC,KAAK,CAAC,CAAC;qBACvB;yBAAM;wBACL,cAAc,CAAC,IAAI,CAAC,CAAC;qBACtB;iBACF;aACF;SACF;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,IAAI,EAAE,aAAa,EAAE,WAAW,CAAC,CAAC,CAAC;IAE/D,OAAO,CACL,oBAAC,WAAW,IACV,KAAK,EAAE;YACL,IAAI,EAAE,IAAI,GAAG,IAAI;YACjB,MAAM,EAAE,MAAM,GAAG,IAAI;SACtB,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,IAAI,CAAC,EAC3C,YAAY,EAAE,GAAG,EAAE,CAAC,iBAAiB,CAAC,KAAK,CAAC;QAE5C,oBAAC,IAAI,IACH,KAAK,EAAE;gBACL,OAAO,EAAE,IAAI,IAAI,cAAc,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;gBAClD,eAAe,EAAE,aAAa,CAAC,MAAM,CAAC,mBAAmB;aAC1D;YAED;gBACE,gCACE,KAAK,EAAE;wBACL,OAAO,EAAE,CAAC;wBACV,MAAM,EAAE,MAAM;wBACd,UAAU,EAAE,MAAM;wBAClB,KAAK,EAAE,aAAa,CAAC,MAAM,CAAC,UAAU;qBACvC,EACD,OAAO,EAAE,WAAW;oBAEpB,oBAAC,WAAW,OAAG;6BAER,CACL;YACL,IAAI,KAAK,OAAO,IAAI,CACnB;gBACE;oBACE,gCACE,KAAK,EAAE;4BACL,OAAO,EAAE,CAAC;4BACV,MAAM,EAAE,MAAM;4BACd,UAAU,EAAE,MAAM;4BAClB,KAAK,EAAE,iBAAiB;gCACtB,CAAC,CAAC,SAAS;gCACX,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,UAAU;yBACpC,EACD,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,iBAAiB;wBAE1B,6BAA6B,IAAI,IAAI,CAAC,CAAC,CAAC,CACvC,oBAAC,aAAa,OAAG,CAClB,CAAC,CAAC,CAAC,CACF,oBAAC,WAAW,OAAG,CAChB;sCAEM,CACL,CACL,CACJ;YACA,IAAI,KAAK,OAAO,IAAI,CACnB;gBACE;oBACE,gCACE,KAAK,EAAE;4BACL,OAAO,EAAE,CAAC;4BACV,MAAM,EAAE,MAAM;4BACd,UAAU,EAAE,MAAM;4BAClB,KAAK,EAAE,aAAa;gCAClB,CAAC,CAAC,SAAS;gCACX,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,UAAU;yBACpC,EACD,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,aAAa;wBAEvB,oBAAC,aAAa,OAAG;2CAEV,CACL;gBACN;oBACE,gCACE,KAAK,EAAE;4BACL,OAAO,EAAE,CAAC;4BACV,MAAM,EAAE,MAAM;4BACd,UAAU,EAAE,MAAM;4BAClB,KAAK,EAAE,WAAW;gCAChB,CAAC,CAAC,SAAS;gCACX,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,UAAU;yBACpC,EACD,OAAO,EAAE,SAAS,EAClB,QAAQ,EAAE,WAAW;wBAErB,oBAAC,WAAW,OAAG;yCAER,CACL,CACL,CACJ;YACA,IAAI,KAAK,UAAU,IAAI,CACtB;gBACE;oBACE,gCACE,KAAK,EAAE;4BACL,OAAO,EAAE,CAAC;4BACV,MAAM,EAAE,MAAM;4BACd,UAAU,EAAE,MAAM;4BAClB,KAAK,EAAE,aAAa;gCAClB,CAAC,CAAC,SAAS;gCACX,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,UAAU;yBACpC,EACD,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,aAAa;wBAEvB,oBAAC,aAAa,OAAG;2CAEV,CACL;gBACN;oBACE,gCACE,KAAK,EAAE;4BACL,OAAO,EAAE,CAAC;4BACV,MAAM,EAAE,MAAM;4BACd,UAAU,EAAE,MAAM;4BAClB,KAAK,EAAE,WAAW;gCAChB,CAAC,CAAC,SAAS;gCACX,CAAC,CAAC,aAAa,CAAC,MAAM,CAAC,UAAU;yBACpC,EACD,OAAO,EAAE,SAAS,EAClB,QAAQ,EAAE,WAAW;wBAErB,oBAAC,WAAW,OAAG;yCAER,CACL,CACL,CACJ,CACI;QACP,oBAAC,UAAU,IACT,KAAK,EAAE;gBACL,OAAO,EAAE,IAAI,IAAI,cAAc,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM;gBAClD,eAAe,EAAE,aAAa,CAAC,MAAM,CAAC,mBAAmB;aAC1D,GACD,CACU,CACf,CAAC;AACJ,CAAC,CAAC"}

package/lib/PlotlyGraph/EventSelected.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+declare type props = {
+    id: string;
+    show: boolean;
+    bottom: number;
+    left: number;
+};
+export declare const EventMenu: React.FC<props>;
+export {};
+//# sourceMappingURL=EventSelected.d.ts.map

package/lib/PlotlyGraph/EventSelected.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EventSelected.d.ts","sourceRoot":"","sources":["../../src/PlotlyGraph/EventSelected.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAcnD,aAAK,KAAK,GAAG;IACX,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAWrC,CAAC"}

package/lib/PlotlyGraph/EventSelected.js

@@ -0,0 +1,22 @@
+import React from "react";
+import styled from "styled-components";
+const MenuBubble = styled.div `
+  position: relative;
+  display: block;
+  left: 8px;
+  height: 10px;
+  width: 10px;
+  bottom: 0;
+  transform: rotate(45deg);
+  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
+`;
+export const EventMenu = ({ id, show, bottom, left }) => {
+    return (React.createElement(React.Fragment, null,
+        React.createElement(MenuBubble
+        /*style={{
+          display: show || eventMenuHover ? "block" : "none",
+          backgroundColor: selectedTheme.colors.foreground,
+        }}*/
+        , null)));
+};
+//# sourceMappingURL=EventSelected.js.map

package/lib/PlotlyGraph/EventSelected.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EventSelected.js","sourceRoot":"","sources":["../../src/PlotlyGraph/EventSelected.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AACnD,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;CAS5B,CAAC;AASF,MAAM,CAAC,MAAM,SAAS,GAAoB,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,EAAE,EAAE;IACvE,OAAO,CACL;QACE,oBAAC,UAAU;QACX;;;YAGI;eACF,CACD,CACJ,CAAC;AACJ,CAAC,CAAC"}

package/lib/PlotlyGraph/InfoMenu.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+declare type props = {
+    selectedEvent: any;
+    show: boolean;
+    bottom: number;
+    left: number;
+    useMarkersActions: any;
+    formatSecondsEventMarker: (markerTime: any) => {};
+    eventdatabyIds: any;
+    events: any;
+    editEvent: any;
+};
+export declare const InfoMenu: React.FC<props>;
+export {};
+//# sourceMappingURL=InfoMenu.d.ts.map

package/lib/PlotlyGraph/InfoMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoMenu.d.ts","sourceRoot":"","sources":["../../src/PlotlyGraph/InfoMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAOnD,aAAK,KAAK,GAAG;IACX,aAAa,EAAE,GAAG,CAAC;IACnB,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,iBAAiB,EAAE,GAAG,CAAC;IACvB,wBAAwB,EAAE,CAAC,UAAU,EAAE,GAAG,KAAK,EAAE,CAAC;IAClD,cAAc,EAAE,GAAG,CAAC;IACpB,MAAM,EAAE,GAAG,CAAC;IACZ,SAAS,EAAE,GAAG,CAAC;CAChB,CAAC;AAuCF,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAqPpC,CAAC"}

package/lib/PlotlyGraph/InfoMenu.js

@@ -0,0 +1,175 @@
+import React, { useEffect, useState } from "react";
+import { parse } from "query-string";
+import styled from "styled-components";
+import { useTheme as useSelectedTheme } from "@insync-stageplayer/ui-components";
+import { DeleteIcon2, EditIcon } from "@insync-stageplayer/ui-components";
+import { deleteMarkerEvent } from "@insync-stageplayer/measurements";
+const DiamondShape = styled.div `
+  transform: rotate(45deg);
+  width: 0.65em;
+  height: 0.65em;
+  margin: 0.4em;
+`;
+const StateShape = styled.div `
+  width: 0.8em;
+  height: 0.8em;
+  border-radius: 0.2em;
+  margin: 0.35em;
+`;
+const MenuWrapper = styled.div `
+  position: absolute;
+  z-index: 99;
+`;
+const Menu = styled.div `
+  position: relative;
+  border-radius: 8px;
+  bottom: -5px;
+  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
+`;
+const MenuBubble = styled.div `
+  position: relative;
+  display: block;
+  left: 8px;
+  height: 10px;
+  width: 10px;
+  bottom: 0;
+  transform: rotate(45deg);
+  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3);
+`;
+export const InfoMenu = ({ selectedEvent, show, bottom, left, formatSecondsEventMarker, useMarkersActions, eventdatabyIds, events, editEvent, }) => {
+    const selectedTheme = useSelectedTheme();
+    const params = parse(document.location.search);
+    const [infoMenuHover, setInfoMenuHover] = useState(false);
+    const { setEvents } = useMarkersActions();
+    const [deleteMarker, setDeleteMarker] = useState({});
+    const [removeMarkerEvent, setRemoveMarkerEvent] = useState(false);
+    const { id, name, type, remarks, color, relativeStartTimeMicroSeconds, relativeEndTimeMicroSeconds, } = selectedEvent || {};
+    const markerDeleting = deleteMarkerEvent({
+        markerData: deleteMarker,
+        dataType: "eventdatadelete",
+        removeMarkerEvent,
+    });
+    const deleteEvent = () => {
+        const [eventStreamId] = eventdatabyIds.eventStreamIds;
+        const { file } = eventdatabyIds;
+        const { projectId } = params;
+        setDeleteMarker({
+            file,
+            eventStreamId,
+            MarkerEvents: [id],
+            projectId,
+        });
+        setRemoveMarkerEvent(true);
+    };
+    const eventEdit = () => {
+        editEvent();
+    };
+    useEffect(() => {
+        if (removeMarkerEvent && deleteMarker && markerDeleting) {
+            markerDeleting
+                .then((response) => response)
+                .then((data) => {
+                const [deleteId] = data.eventData;
+                setEvents(events === null || events === void 0 ? void 0 : events.filter((list) => {
+                    return list.id !== deleteId;
+                }));
+                setInfoMenuHover(false); // after delete hide menu
+            });
+        }
+        return setRemoveMarkerEvent(false);
+    }, [removeMarkerEvent, deleteMarker, events, markerDeleting, setEvents]);
+    return (React.createElement(MenuWrapper, { style: {
+            left: left + "px",
+            bottom: bottom + "px",
+        }, onMouseEnter: () => setInfoMenuHover(true), onMouseLeave: () => setInfoMenuHover(false) },
+        React.createElement(Menu, { style: {
+                display: show || infoMenuHover ? "flex" : "none",
+                backgroundColor: selectedTheme.colors.markerMenuPrimary,
+                flexDirection: "column",
+            } },
+            React.createElement("div", { style: {
+                    color: selectedTheme.colors.foreground,
+                    padding: "5px 5px",
+                    display: "flex",
+                    justifyContent: "space-between",
+                } },
+                React.createElement("div", { style: {
+                        display: "flex",
+                    } },
+                    type === "point" ? (React.createElement(DiamondShape, { style: {
+                            backgroundColor: color,
+                        } })) : (React.createElement(StateShape, { style: {
+                            backgroundColor: color,
+                        } })),
+                    React.createElement("span", null, name)),
+                React.createElement("div", { style: {
+                        marginLeft: "20px",
+                    } },
+                    React.createElement("button", { style: {
+                            padding: 0,
+                            border: "none",
+                            background: "none",
+                            color: selectedTheme.colors.foreground,
+                        }, onClick: eventEdit },
+                        React.createElement(EditIcon, null)),
+                    React.createElement("button", { style: {
+                            padding: 0,
+                            border: "none",
+                            background: "none",
+                            color: selectedTheme.colors.foreground,
+                        }, onClick: deleteEvent },
+                        React.createElement(DeleteIcon2, null)))),
+            React.createElement("div", { style: {
+                    backgroundColor: selectedTheme.colors.markerMenuSecondary,
+                    padding: remarks !== "" ? "5px 10px 5px 10px" : "5px 10px 10px 10px",
+                    borderRadius: remarks !== "" ? "0" : "0 0 8px 8px",
+                    color: selectedTheme.colors.foreground,
+                    display: "flex",
+                    fontSize: "0.75em",
+                } }, type === "point" ? (React.createElement(React.Fragment, null,
+                React.createElement("div", { style: {
+                        flex: "1",
+                    } },
+                    "Start:",
+                    React.createElement("span", { style: {
+                            fontWeight: 700,
+                            padding: "0 16px 0 2px",
+                        } }, formatSecondsEventMarker(relativeStartTimeMicroSeconds))))) : (React.createElement(React.Fragment, null,
+                React.createElement("div", { style: {
+                        flex: "1 1 33%",
+                    } },
+                    "Start:",
+                    React.createElement("span", { style: {
+                            fontWeight: 700,
+                            padding: "0 16px 0 2px",
+                        } }, formatSecondsEventMarker(relativeStartTimeMicroSeconds))),
+                React.createElement("div", { style: {
+                        flex: "1 1 33%",
+                    } },
+                    "Duration:",
+                    React.createElement("span", { style: {
+                            fontWeight: 700,
+                            padding: "0 16px 0 2px",
+                        } }, formatSecondsEventMarker(relativeEndTimeMicroSeconds - relativeStartTimeMicroSeconds))),
+                React.createElement("div", { style: {
+                        flex: "1 1 33%",
+                    } },
+                    "End:",
+                    React.createElement("span", { style: {
+                            fontWeight: 700,
+                            padding: "0 16px 0 2px",
+                        } }, formatSecondsEventMarker(relativeEndTimeMicroSeconds)))))),
+            remarks !== "" && (React.createElement("div", { style: {
+                    color: selectedTheme.colors.foreground,
+                    backgroundColor: selectedTheme.colors.markerMenuSecondary,
+                    padding: "0 10px 10px 10px",
+                    borderRadius: "0 0 8px 8px",
+                    display: "flex",
+                    fontSize: "0.75em",
+                } }, remarks))),
+        React.createElement(MenuBubble, { style: {
+                display: show || infoMenuHover ? "block" : "none",
+                backgroundColor: selectedTheme.colors.markerMenuSecondary,
+            } })));
+};
+//# sourceMappingURL=InfoMenu.js.map

package/lib/PlotlyGraph/InfoMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoMenu.js","sourceRoot":"","sources":["../../src/PlotlyGraph/InfoMenu.tsx"],"names":[],"mappings":"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"}

package/lib/PlotlyGraph/MarkerTracks.d.ts

@@ -11,10 +11,11 @@ declare type props = {
     formatSecondsEventMarker: any;
     useMarkersActions: any;
     eventdatabyIds: any;
-    totalTime: any;
-    scrubbing: boolean;
-    seekTime: number;
-    nowLine: number;
+    time: any;
+    setRunning: any;
+    editEvent: any;
+    selectEvent: any;
+    selectedEvent: any;
 };
 export declare const MarkerTracks: React.FC<props>;
 export {};

package/lib/PlotlyGraph/MarkerTracks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MarkerTracks.d.ts","sourceRoot":"","sources":["../../src/PlotlyGraph/MarkerTracks.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAkBnD,aAAK,KAAK,GAAG;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,GAAG,CAAC;IACf,MAAM,EAAE,GAAG,CAAC;IACZ,OAAO,EAAE,GAAG,CAAC;IACb,MAAM,EAAE,GAAG,CAAC;IACZ,OAAO,EAAE,cAAc,GAAG,IAAI,CAAC;IAC/B,gBAAgB,EAAE,GAAG,CAAC;IACtB,wBAAwB,EAAE,GAAG,CAAC;IAC9B,iBAAiB,EAAE,GAAG,CAAC;IACvB,cAAc,EAAE,GAAG,CAAC;IACpB,SAAS,EAAE,GAAG,CAAC;IACf,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC;AAMF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA+XxC,CAAC"}
+{"version":3,"file":"MarkerTracks.d.ts","sourceRoot":"","sources":["../../src/PlotlyGraph/MarkerTracks.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAyBnD,aAAK,KAAK,GAAG;IACX,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,GAAG,CAAC;IACf,MAAM,EAAE,GAAG,CAAC;IACZ,OAAO,EAAE,GAAG,CAAC;IACb,MAAM,EAAE,GAAG,CAAC;IACZ,OAAO,EAAE,cAAc,GAAG,IAAI,CAAC;IAC/B,gBAAgB,EAAE,GAAG,CAAC;IACtB,wBAAwB,EAAE,GAAG,CAAC;IAC9B,iBAAiB,EAAE,GAAG,CAAC;IACvB,cAAc,EAAE,GAAG,CAAC;IACpB,IAAI,EAAE,GAAG,CAAC;IACV,UAAU,EAAE,GAAG,CAAC;IAChB,SAAS,EAAE,GAAG,CAAC;IACf,WAAW,EAAE,GAAG,CAAC;IACjB,aAAa,EAAE,GAAG,CAAC;CACpB,CAAC;AAOF,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA+axC,CAAC"}