@evercam/ui 0.0.63-preview-admin-deployment-c5e8d6e1c → 0.0.63-preview-fix-ios-fullscreen-bug-d8b40df4d

package/README.md

@@ -44,5 +44,4 @@ export default {
 You can preview the components and their stories by running the [Histoire](https://histoire.dev) sever:
 
 `yarn story:dev`
-.............
-//
+............

package/dist/attributes.json

@@ -278,6 +278,10 @@
     "type": "object",
     "description": ""
   },
+  "ETimeline/x-axes-config": {
+    "type": "object",
+    "description": ""
+  },
   "ETimeline/dark": {
     "type": "boolean",
     "description": "",
@@ -354,6 +358,16 @@
     "description": "",
     "default": 18
   },
+  "ETimeline/min-zoom": {
+    "type": "number",
+    "description": "",
+    "default": 0.0001
+  },
+  "ETimeline/max-zoom": {
+    "type": "number",
+    "description": "",
+    "default": 850000
+  },
   "ETimeline/min-date": {
     "type": "string",
     "description": ""
@@ -949,19 +963,5 @@
     "type": "boolean",
     "description": "",
     "default": false
-  },
-  "EChat/dark": {
-    "type": "boolean",
-    "description": "",
-    "default": false
-  },
-  "EChat/messages": {
-    "type": "array",
-    "description": ""
-  },
-  "EChat/user": {
-    "type": "string",
-    "description": "",
-    "default": "You"
   }
 }

package/dist/components/ETimeline.vue.d.ts

@@ -1,17 +1,21 @@
 import * as d3 from "d3";
+import { D3ZoomEvent } from "d3";
 import Vue from "vue";
-import { TimelineCountEvent, TimelineEvent, TimelineEventsByType, TimelineEventsGroup, TimelineInterval, TimelineIntervalChangeTrigger, TimelineMarker, TimelinePrecision, Timestamp, TimelineDomain } from '../types';
+import { TimelineAxesConfig, TimelineAxis, TimelineCountEvent, TimelineEvent, TimelineEventsByType, TimelineEventsGroup, TimelineInterval, TimelineIntervalChangeTrigger, TimelineMarker, TimelinePrecision, TimelineTicksConfig, Timestamp } from '../types';
 declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, any>, Record<string, any>, never, never, (event: string, ...args: any[]) => Vue<Record<string, any>, Record<string, any>, never, never, any>>, {
-    mainContainer: HTMLElement;
     tooltip: HTMLElement;
     cursor: HTMLElement;
     timeline: HTMLElement;
     wrapperDiv: HTMLElement;
     selectedTimestampCursor: HTMLElement;
-    svgElement: SVGSVGElement;
     svg: d3.Selection<SVGSVGElement, any, any, any>;
+    axesContainer: d3.Selection<SVGGElement, any, any, any>;
+    xAxes: Record<TimelineAxis, d3.Axis<Date>>;
     timeScale: d3.ScaleTime<any, any, unknown>;
+    initialTimeScale: d3.ScaleTime<any, any, unknown>;
     currentTimeScaleDensity: number;
+    zoomBehavior: d3.ZoomBehavior<SVGSVGElement, unknown>;
+    isMouseDown: boolean;
     axisHeight: number;
     isHoveringEvent: boolean;
     hoveredEvent: TimelineEvent;
@@ -20,6 +24,14 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     eventTooltipStyle: {};
     hoveredEventType: string;
     utcOffset: number;
+    lastTransform: {
+        x: number;
+        k: number;
+    };
+    transformDiff: {
+        translation: number;
+        scale: number;
+    };
     yScale: d3.ScaleLinear<any, any, never>;
     hoveredCounts: {
         count: number;
@@ -48,10 +60,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     initialMarkerDragMouseOffset: number;
     selectedMilestoneId: any;
     isInitialized: boolean;
-    transformDiff: {
-        translation: number;
-        scale: number;
-    };
+    lastValidTransform: d3.ZoomTransform;
+    lastPanTransform: d3.ZoomTransform;
     isZoomingInterval: boolean;
     defs: {
         transparencyGradient: string;
@@ -60,34 +70,45 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
         stripedPattern: string;
     };
     hoveredMilestone: TimelineEvent;
-    focusedDomain: TimelineDomain;
-    transitionDuration: number;
-    focusedTimestamp: string | Date;
 }, {
     updateTimeline(): void;
-    initTimeline(): void;
+    initTimeline(startDate?: string, endDate?: string): void;
     initRefs(): void;
     initOrUpdateSvg(): void;
     initOrUpdateDefs(): void;
     initUtcOffset(): void;
+    initTimeScale(start?: string, end?: string): void;
+    initXAxes(): void;
+    updateXAxes(): void;
     initYScale(): void;
     updateYScale(): void;
+    initZoomBehavior(): void;
     zoomToFitMarkers(): void;
+    zoomToTargetInterval(start?: string | number, end?: string | number): void;
+    translateIntervalIntoView(minTimestamp: number, maxTimestamp: number, scaleFactor: number): void;
     initSelectedTimestampCursor(): void;
     updateMarkers(): void;
     selectOrAppend({ parent, targetId, targetType, }: {
-        parent: d3.Selection<any, any, any, any>;
-        targetId: string;
-        targetType: string;
-    }): d3.Selection<d3.BaseType, any, any, any>;
+        parent: any;
+        selector: string;
+        nodeType: string;
+    }): any;
+    updateAndRedrawTimeline(): void;
     clearTimeline(): void;
     repositionSelectedTimestampCursor(): void;
     updateCurrentTimeScaleDensity(): void;
     registerEventsListeners(): void;
     emitVisibleInterval(trigger: TimelineIntervalChangeTrigger): void;
+    createAxis(axisName: TimelineAxis): d3.Axis<Date>;
+    getAxisTicksConfig(configs: TimelineTicksConfig[]): {
+        formatFn: (d: Date) => string;
+        interval: any;
+    };
     onResize(resizeObserverEntry: ResizeObserverEntry): void;
     handleResize({ contentRect }: ResizeObserverEntry): void;
     handleDarkModeChange(): void;
+    handleMouseDown(): void;
+    handleDocumentMouseUp(_e: MouseEvent): void;
     handleMouseLeave(): void;
     handleMouseMove(event: MouseEvent): void;
     handleClick(event: MouseEvent): void;
@@ -98,11 +119,9 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     handleBarMouseOut(): void;
     handleLabelMouseOver(groupType: string): void;
     handleLabelMouseLeave(groupType: string): void;
-    handleTransformChange(transform: {
-        translation: number;
-        scale: number;
-    }): void;
-    handleTimeScaleChange(ts: d3.ScaleTime<any, any, unknown>): void;
+    isZoomAllowed(event: D3ZoomEvent<SVGSVGElement, any>): boolean;
+    handleZoom(event: D3ZoomEvent<SVGSVGElement, any>): void;
+    panToTimestamp(targetTimestamp: string | Date): void;
     emitCurtainChange(): void;
     calculateDateRangeFromCurtains(): {
         startDate: Date;
@@ -113,6 +132,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     handleLeftDrag(event: d3.D3DragEvent<SVGRectElement, any, any>): void;
     handleRightDrag(event: d3.D3DragEvent<SVGRectElement, any, any>): void;
     zoomToStartAndEndDates(): void;
+    rescaleAxis(axisName: string, newScale: d3.ScaleTime<any, any, unknown>): void;
+    translateTicksText(axisName: string): void;
     updateEventsBars(): void;
     updateBarChart(): void;
     updateLineGraphs(): void;
@@ -259,7 +280,6 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     hasChart: boolean;
     labelRectWidth: number;
     combinedXAxesHeight: number;
-    timelineWidth: number;
     timelineHeight: number;
     filteredEventsGroups: TimelineEventsByType;
     allEventsSorted: TimelineEvent[];
@@ -274,10 +294,9 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     minHoverZone: number;
     sortedMarkers: TimelineMarker[];
     maxVisibleCount: number;
-    defaultMaxDomain: string[];
-    domain: TimelineDomain;
 }, {
     eventsGroups: {};
+    xAxesConfig: TimelineAxesConfig;
     dark: boolean;
     startDate: string;
     endDate: string;
@@ -294,6 +313,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     barXPadding: number;
     chartMinHeight: number;
     chartMinLabelHeight: number;
+    minZoom: number;
+    maxZoom: number;
     minDate: string;
     maxDate: string;
     cursorTimestamp: string | undefined;

package/dist/index.d.ts

@@ -220,16 +220,19 @@ export declare const components: {
         hlsOptions: {};
     }, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin>;
     ETimeline: import("vue/types/vue").ExtendedVue<import("vue").default<Record<string, any>, Record<string, any>, never, never, (event: string, ...args: any[]) => import("vue").default<Record<string, any>, Record<string, any>, never, never, any>>, {
-        mainContainer: HTMLElement;
         tooltip: HTMLElement;
         cursor: HTMLElement;
         timeline: HTMLElement;
         wrapperDiv: HTMLElement;
         selectedTimestampCursor: HTMLElement;
-        svgElement: SVGSVGElement;
         svg: import("d3-selection").Selection<SVGSVGElement, any, any, any>;
+        axesContainer: import("d3-selection").Selection<SVGGElement, any, any, any>;
+        xAxes: Record<import('./types').TimelineAxis, import("d3-axis").Axis<Date>>;
         timeScale: import("d3-scale").ScaleTime<any, any, unknown>;
+        initialTimeScale: import("d3-scale").ScaleTime<any, any, unknown>;
         currentTimeScaleDensity: number;
+        zoomBehavior: import("d3-zoom").ZoomBehavior<SVGSVGElement, unknown>;
+        isMouseDown: boolean;
         axisHeight: number;
         isHoveringEvent: boolean;
         hoveredEvent: import('./types').TimelineEvent;
@@ -238,6 +241,14 @@ export declare const components: {
         eventTooltipStyle: {};
         hoveredEventType: string;
         utcOffset: number;
+        lastTransform: {
+            x: number;
+            k: number;
+        };
+        transformDiff: {
+            translation: number;
+            scale: number;
+        };
         yScale: import("d3-scale").ScaleLinear<any, any, never>;
         hoveredCounts: {
             count: number;
@@ -266,10 +277,8 @@ export declare const components: {
         initialMarkerDragMouseOffset: number;
         selectedMilestoneId: any;
         isInitialized: boolean;
-        transformDiff: {
-            translation: number;
-            scale: number;
-        };
+        lastValidTransform: import("d3-zoom").ZoomTransform;
+        lastPanTransform: import("d3-zoom").ZoomTransform;
         isZoomingInterval: boolean;
         defs: {
             transparencyGradient: string;
@@ -278,34 +287,45 @@ export declare const components: {
             stripedPattern: string;
         };
         hoveredMilestone: import('./types').TimelineEvent;
-        focusedDomain: import('./types').TimelineDomain;
-        transitionDuration: number;
-        focusedTimestamp: string | Date;
     }, {
         updateTimeline(): void;
-        initTimeline(): void;
+        initTimeline(startDate?: string | undefined, endDate?: string | undefined): void;
         initRefs(): void;
         initOrUpdateSvg(): void;
         initOrUpdateDefs(): void;
         initUtcOffset(): void;
+        initTimeScale(start?: string | undefined, end?: string | undefined): void;
+        initXAxes(): void;
+        updateXAxes(): void;
         initYScale(): void;
         updateYScale(): void;
+        initZoomBehavior(): void;
         zoomToFitMarkers(): void;
+        zoomToTargetInterval(start?: string | number | undefined, end?: string | number | undefined): void;
+        translateIntervalIntoView(minTimestamp: number, maxTimestamp: number, scaleFactor: number): void;
         initSelectedTimestampCursor(): void;
         updateMarkers(): void;
         selectOrAppend({ parent, targetId, targetType, }: {
-            parent: import("d3-selection").Selection<any, any, any, any>;
-            targetId: string;
-            targetType: string;
-        }): import("d3-selection").Selection<import("d3-selection").BaseType, any, any, any>;
+            parent: any;
+            selector: string;
+            nodeType: string;
+        }): any;
+        updateAndRedrawTimeline(): void;
         clearTimeline(): void;
         repositionSelectedTimestampCursor(): void;
         updateCurrentTimeScaleDensity(): void;
         registerEventsListeners(): void;
         emitVisibleInterval(trigger: import('./types').TimelineIntervalChangeTrigger): void;
+        createAxis(axisName: import('./types').TimelineAxis): import("d3-axis").Axis<Date>;
+        getAxisTicksConfig(configs: import('./types').TimelineTicksConfig[]): {
+            formatFn: (d: Date) => string;
+            interval: any;
+        };
         onResize(resizeObserverEntry: ResizeObserverEntry): void;
         handleResize({ contentRect }: ResizeObserverEntry): void;
         handleDarkModeChange(): void;
+        handleMouseDown(): void;
+        handleDocumentMouseUp(_e: MouseEvent): void;
         handleMouseLeave(): void;
         handleMouseMove(event: MouseEvent): void;
         handleClick(event: MouseEvent): void;
@@ -316,11 +336,9 @@ export declare const components: {
         handleBarMouseOut(): void;
         handleLabelMouseOver(groupType: string): void;
         handleLabelMouseLeave(groupType: string): void;
-        handleTransformChange(transform: {
-            translation: number;
-            scale: number;
-        }): void;
-        handleTimeScaleChange(ts: import("d3-scale").ScaleTime<any, any, unknown>): void;
+        isZoomAllowed(event: import("d3-zoom").D3ZoomEvent<SVGSVGElement, any>): boolean;
+        handleZoom(event: import("d3-zoom").D3ZoomEvent<SVGSVGElement, any>): void;
+        panToTimestamp(targetTimestamp: string | Date): void;
         emitCurtainChange(): void;
         calculateDateRangeFromCurtains(): {
             startDate: Date;
@@ -331,6 +349,8 @@ export declare const components: {
         handleLeftDrag(event: import("d3-drag").D3DragEvent<SVGRectElement, any, any>): void;
         handleRightDrag(event: import("d3-drag").D3DragEvent<SVGRectElement, any, any>): void;
         zoomToStartAndEndDates(): void;
+        rescaleAxis(axisName: string, newScale: import("d3-scale").ScaleTime<any, any, unknown>): void;
+        translateTicksText(axisName: string): void;
         updateEventsBars(): void;
         updateBarChart(): void;
         updateLineGraphs(): void;
@@ -477,7 +497,6 @@ export declare const components: {
         hasChart: boolean;
         labelRectWidth: number;
         combinedXAxesHeight: number;
-        timelineWidth: number;
         timelineHeight: number;
         filteredEventsGroups: import('./types').TimelineEventsByType;
         allEventsSorted: import('./types').TimelineEvent[];
@@ -492,10 +511,9 @@ export declare const components: {
         minHoverZone: number;
         sortedMarkers: import('./types').TimelineMarker[];
         maxVisibleCount: number;
-        defaultMaxDomain: string[];
-        domain: import('./types').TimelineDomain;
     }, {
         eventsGroups: {};
+        xAxesConfig: import('./types').TimelineAxesConfig;
         dark: boolean;
         startDate: string;
         endDate: string;
@@ -512,6 +530,8 @@ export declare const components: {
         barXPadding: number;
         chartMinHeight: number;
         chartMinLabelHeight: number;
+        minZoom: number;
+        maxZoom: number;
         minDate: string;
         maxDate: string;
         cursorTimestamp: string | undefined;
@@ -1091,27 +1111,6 @@ export declare const components: {
         $setTimeout(cb: Function, timeout?: number): number;
         $clearTimeouts(): void;
     }, unknown, Record<never, any>, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin>, import("vue").ComponentOptionsMixin>;
-    EChat: import("vue/types/vue").ExtendedVue<import("vue").default<Record<string, any>, Record<string, any>, never, never, (event: string, ...args: any[]) => import("vue").default<Record<string, any>, Record<string, any>, never, never, any>>, {
-        prompt: string;
-        containerHeight: number;
-        headerHeight: number;
-        bodyHeight: number;
-        footerHeight: number;
-    }, {
-        sendMessage(): void;
-        isUserMessage(message: import('./types').ChatMessage): boolean;
-        getMessageContent(message: import('./types').ChatMessage): string;
-        onBodyResized(): void;
-        updateChatBodyHeight(): void;
-    }, {
-        userInitials: string;
-        chatBodyStyle: Record<string, unknown>;
-    }, {
-        dark: boolean;
-        messages: import('./types').ChatMessage[];
-        user: string;
-    }, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin>;
-    EContextProvider: any;
 };
 declare const _default: {
     install(Vue: VueConstructor): void;