@evercam/ui 0.0.55-beta.15 → 0.0.55-beta.17

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

@@ -1,7 +1,7 @@
 import * as d3 from "d3";
 import { D3ZoomEvent } from "d3";
 import Vue from "vue";
-import { TimelineAxesConfig, TimelineAxis, TimelineCountEvent, TimelineEvent, TimelineEventsByType, TimelineEventsGroup, TimelineIntervalChangeTrigger, TimelineMarker, TimelinePrecision, TimelineTicksConfig, Timestamp } 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>>, {
     tooltip: HTMLElement;
     cursor: HTMLElement;
@@ -61,6 +61,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     selectedMilestoneId: any;
     isInitialized: boolean;
     lastValidTransform: d3.ZoomTransform;
+    lastPanTransform: d3.ZoomTransform;
+    isZoomingInterval: boolean;
 }, {
     updateTimeline(): void;
     initTimeline(startDate?: string, endDate?: string): void;
@@ -75,7 +77,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     updateYScaleDomain(): void;
     initZoomBehavior(): void;
     zoomToFitMarkers(): void;
-    translateMarkersIntoView(minTimestamp: number, maxTimestamp: number, scaleFactor: number): void;
+    zoomToTargetInterval(start?: string | number, end?: string | number): void;
+    translateIntervalIntoView(minTimestamp: number, maxTimestamp: number, scaleFactor: number): void;
     initSelectedTimestampCursor(): void;
     updateMarkers(): void;
     updateAndRedrawTimeline(): void;
@@ -138,8 +141,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     initCurtains(): void;
     createCurtains(): void;
     updateCurtains(): void;
-    initForbiddenIntervals(): void;
-    updateForbiddenIntervals(): void;
+    updateForbiddenIntervals(reset?: boolean): void;
     drawEventsGroups(): void;
     drawLineGraphEventsGroups(): void;
     drawLineGraph({ events, gElement, color, type, }: {
@@ -154,14 +156,13 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
         color: string;
         type: string;
     }): void;
-    drawSingleBarEventsGroup({ type, eventsGroup, index, milestone, height, dots, dotsSize, }: {
+    drawSingleBarEventsGroup({ type, eventsGroup, milestone, dots, dotsSize, bottom, }: {
         type: string;
         eventsGroup: TimelineEventsGroup;
-        index?: number | undefined;
         milestone?: boolean | undefined;
-        height?: number | undefined;
         dots?: boolean | undefined;
         dotsSize?: number | undefined;
+        bottom?: boolean | undefined;
     }): void;
     drawBarEventsGroups(): void;
     drawMilestonesPlaceholder(): void;
@@ -171,6 +172,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
         border: string;
     };
     getMilestoneGroupYPosition(groupName: string): number;
+    getBarGroupYPosition(groupName: string, bottom?: boolean): number;
+    getBarGroupHeight(eventsGroup: TimelineEventsGroup): number;
     updateMilestonesPositions(): void;
     drawBarChartEventsGroups(): void;
     drawProgressIndicator({ yPosition, type, isLoading, }: {
@@ -185,7 +188,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
         color: string;
         height?: number | undefined;
     }): void;
-    drawBars({ events, gElement, yPosition, color, type, dots, dotsSize, }: {
+    drawBars({ events, gElement, yPosition, color, type, dots, dotsSize, height, barBorderRadius, }: {
         events: TimelineEvent[];
         gElement: d3.Selection<SVGGElement, any, any, any>;
         yPosition: number;
@@ -193,6 +196,8 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
         type: string;
         dots?: boolean | undefined;
         dotsSize?: number | undefined;
+        height?: number | undefined;
+        barBorderRadius?: number | undefined;
     }): void;
     drawBarsChart({ events, gElement, color, yOffset, type, index, }: {
         events: TimelineEvent[];
@@ -246,6 +251,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     getSortedEvents(events: TimelineEvent[]): TimelineEvent[];
 }, {
     combinedBarsHeight: number;
+    combinedBottomBarsHeight: number;
     combinedMilestonesHeight: number;
     milestonesYOffset: number;
     chartsYOffset: number;
@@ -292,12 +298,11 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     barYPadding: number;
     barXPadding: number;
     chartMinHeight: number;
+    chartMinLabelHeight: number;
     minZoom: number;
     maxZoom: number;
     minDate: string;
     maxDate: string;
-    minVisibleDate: string;
-    maxVisibleDate: string;
     cursorTimestamp: string | undefined;
     selectedClass: string | undefined;
     panOnDateClick: boolean;
@@ -307,9 +312,13 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     markers: TimelineMarker[];
     stickyMarkers: boolean;
     fitMarkersOnChange: boolean;
-    fitMarkersTransitionDuration: number;
+    zoomToIntervalTransitionDuration: number;
     zoomToBoundariesTransitionDuration: number;
     milestoneBulletSize: number;
     milestonesFirst: boolean;
+    forbiddenIntervals: TimelineInterval[];
+    forbiddenIntervalColor: string;
+    focusedInterval: TimelineInterval | undefined;
+    locked: boolean;
 }, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin>;
 export default _default;

package/dist/src/index.d.ts

@@ -234,6 +234,8 @@ export declare const components: {
         selectedMilestoneId: any;
         isInitialized: boolean;
         lastValidTransform: import("d3-zoom").ZoomTransform;
+        lastPanTransform: import("d3-zoom").ZoomTransform;
+        isZoomingInterval: boolean;
     }, {
         updateTimeline(): void;
         initTimeline(startDate?: string | undefined, endDate?: string | undefined): void;
@@ -248,7 +250,8 @@ export declare const components: {
         updateYScaleDomain(): void;
         initZoomBehavior(): void;
         zoomToFitMarkers(): void;
-        translateMarkersIntoView(minTimestamp: number, maxTimestamp: number, scaleFactor: number): void;
+        zoomToTargetInterval(start?: string | number | undefined, end?: string | number | undefined): void;
+        translateIntervalIntoView(minTimestamp: number, maxTimestamp: number, scaleFactor: number): void;
         initSelectedTimestampCursor(): void;
         updateMarkers(): void;
         updateAndRedrawTimeline(): void;
@@ -311,8 +314,7 @@ export declare const components: {
         initCurtains(): void;
         createCurtains(): void;
         updateCurtains(): void;
-        initForbiddenIntervals(): void;
-        updateForbiddenIntervals(): void;
+        updateForbiddenIntervals(reset?: boolean): void;
         drawEventsGroups(): void;
         drawLineGraphEventsGroups(): void;
         drawLineGraph({ events, gElement, color, type, }: {
@@ -327,14 +329,13 @@ export declare const components: {
             color: string;
             type: string;
         }): void;
-        drawSingleBarEventsGroup({ type, eventsGroup, index, milestone, height, dots, dotsSize, }: {
+        drawSingleBarEventsGroup({ type, eventsGroup, milestone, dots, dotsSize, bottom, }: {
             type: string;
             eventsGroup: import('./types').TimelineEventsGroup;
-            index?: number | undefined;
             milestone?: boolean | undefined;
-            height?: number | undefined;
             dots?: boolean | undefined;
             dotsSize?: number | undefined;
+            bottom?: boolean | undefined;
         }): void;
         drawBarEventsGroups(): void;
         drawMilestonesPlaceholder(): void;
@@ -344,6 +345,8 @@ export declare const components: {
             border: string;
         };
         getMilestoneGroupYPosition(groupName: string): number;
+        getBarGroupYPosition(groupName: string, bottom?: boolean | undefined): number;
+        getBarGroupHeight(eventsGroup: import('./types').TimelineEventsGroup): number;
         updateMilestonesPositions(): void;
         drawBarChartEventsGroups(): void;
         drawProgressIndicator({ yPosition, type, isLoading, }: {
@@ -358,7 +361,7 @@ export declare const components: {
             color: string;
             height?: number | undefined;
         }): void;
-        drawBars({ events, gElement, yPosition, color, type, dots, dotsSize, }: {
+        drawBars({ events, gElement, yPosition, color, type, dots, dotsSize, height, barBorderRadius, }: {
             events: import('./types').TimelineEvent[];
             gElement: import("d3-selection").Selection<SVGGElement, any, any, any>;
             yPosition: number;
@@ -366,6 +369,8 @@ export declare const components: {
             type: string;
             dots?: boolean | undefined;
             dotsSize?: number | undefined;
+            height?: number | undefined;
+            barBorderRadius?: number | undefined;
         }): void;
         drawBarsChart({ events, gElement, color, yOffset, type, index, }: {
             events: import('./types').TimelineEvent[];
@@ -419,6 +424,7 @@ export declare const components: {
         getSortedEvents(events: import('./types').TimelineEvent[]): import('./types').TimelineEvent[];
     }, {
         combinedBarsHeight: number;
+        combinedBottomBarsHeight: number;
         combinedMilestonesHeight: number;
         milestonesYOffset: number;
         chartsYOffset: number;
@@ -465,12 +471,11 @@ export declare const components: {
         barYPadding: number;
         barXPadding: number;
         chartMinHeight: number;
+        chartMinLabelHeight: number;
         minZoom: number;
         maxZoom: number;
         minDate: string;
         maxDate: string;
-        minVisibleDate: string;
-        maxVisibleDate: string;
         cursorTimestamp: string | undefined;
         selectedClass: string | undefined;
         panOnDateClick: boolean;
@@ -480,10 +485,14 @@ export declare const components: {
         markers: import('./types').TimelineMarker[];
         stickyMarkers: boolean;
         fitMarkersOnChange: boolean;
-        fitMarkersTransitionDuration: number;
+        zoomToIntervalTransitionDuration: number;
         zoomToBoundariesTransitionDuration: number;
         milestoneBulletSize: number;
         milestonesFirst: boolean;
+        forbiddenIntervals: import('./types').TimelineInterval[];
+        forbiddenIntervalColor: string;
+        focusedInterval: import('./types').TimelineInterval | undefined;
+        locked: boolean;
     }, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin>;
     EVideoEmbed: import("vue").DefineComponent<{
         videoUrl: {

package/dist/src/types.d.ts

@@ -98,6 +98,8 @@ export type TimelineEventsGroup = {
     milestonesDotSize?: number;
     height?: number;
     dotsSize?: number;
+    bottom?: boolean;
+    barBorderRadius?: number;
 };
 export type TimelineEventsByType = {
     [eventsType: string]: TimelineEventsGroup;
@@ -120,6 +122,10 @@ export type TimelineMarker = {
     maxDate?: string;
     [key: string]: any;
 };
+export type TimelineInterval = {
+    startDate: Date | string | number;
+    endDate: Date | string | number;
+};
 export type HeatmapBarItem = {
     name: string;
     count: string;

package/dist/tags.json

@@ -98,12 +98,11 @@
       "bar-ypadding",
       "bar-xpadding",
       "chart-min-height",
+      "chart-min-label-height",
       "min-zoom",
       "max-zoom",
       "min-date",
       "max-date",
-      "min-visible-date",
-      "max-visible-date",
       "cursor-timestamp",
       "selected-class",
       "pan-on-date-click",
@@ -113,10 +112,14 @@
       "markers",
       "sticky-markers",
       "fit-markers-on-change",
-      "fit-markers-transition-duration",
+      "zoom-to-interval-transition-duration",
       "zoom-to-boundaries-transition-duration",
       "milestone-bullet-size",
-      "milestones-first"
+      "milestones-first",
+      "forbidden-intervals",
+      "forbidden-interval-color",
+      "focused-interval",
+      "locked"
     ],
     "description": ""
   },

package/dist/web-types.json

@@ -2,7 +2,7 @@
   "$schema": "http://json.schemastore.org/web-types",
   "framework": "vue",
   "name": "@evercam/ui",
-  "version": "0.0.55-beta.14",
+  "version": "0.0.55-beta.15",
   "contributions": {
     "html": {
       "types-syntax": "typescript",
@@ -704,43 +704,34 @@
               }
             },
             {
-              "name": "min-zoom",
+              "name": "chart-min-label-height",
               "doc-url": "https://www.npmjs.com/package/@evercam/ui",
-              "default": "0.0001",
+              "default": "18",
               "value": {
                 "kind": "expression",
                 "type": "number"
               }
             },
             {
-              "name": "max-zoom",
+              "name": "min-zoom",
               "doc-url": "https://www.npmjs.com/package/@evercam/ui",
-              "default": "850000",
+              "default": "0.0001",
               "value": {
                 "kind": "expression",
                 "type": "number"
               }
             },
             {
-              "name": "min-date",
-              "doc-url": "https://www.npmjs.com/package/@evercam/ui",
-              "default": "undefined",
-              "value": {
-                "kind": "expression",
-                "type": "string"
-              }
-            },
-            {
-              "name": "max-date",
+              "name": "max-zoom",
               "doc-url": "https://www.npmjs.com/package/@evercam/ui",
-              "default": "undefined",
+              "default": "850000",
               "value": {
                 "kind": "expression",
-                "type": "string"
+                "type": "number"
               }
             },
             {
-              "name": "min-visible-date",
+              "name": "min-date",
               "doc-url": "https://www.npmjs.com/package/@evercam/ui",
               "default": "undefined",
               "value": {
@@ -749,7 +740,7 @@
               }
             },
             {
-              "name": "max-visible-date",
+              "name": "max-date",
               "doc-url": "https://www.npmjs.com/package/@evercam/ui",
               "default": "undefined",
               "value": {
@@ -845,7 +836,7 @@
               }
             },
             {
-              "name": "fit-markers-transition-duration",
+              "name": "zoom-to-interval-transition-duration",
               "doc-url": "https://www.npmjs.com/package/@evercam/ui",
               "default": "800",
               "value": {
@@ -879,6 +870,45 @@
                 "kind": "expression",
                 "type": "boolean"
               }
+            },
+            {
+              "name": "forbidden-intervals",
+              "doc-url": "https://www.npmjs.com/package/@evercam/ui",
+              "default": "() => []",
+              "value": {
+                "kind": "expression",
+                "type": "array"
+              }
+            },
+            {
+              "name": "forbidden-interval-color",
+              "doc-url": "https://www.npmjs.com/package/@evercam/ui",
+              "default": "#ddd",
+              "value": {
+                "kind": "expression",
+                "type": "string"
+              }
+            },
+            {
+              "name": "focused-interval",
+              "doc-url": "https://www.npmjs.com/package/@evercam/ui",
+              "default": "undefined",
+              "value": {
+                "kind": "expression",
+                "type": [
+                  "object",
+                  "any"
+                ]
+              }
+            },
+            {
+              "name": "locked",
+              "doc-url": "https://www.npmjs.com/package/@evercam/ui",
+              "default": "false",
+              "value": {
+                "kind": "expression",
+                "type": "boolean"
+              }
             }
           ]
         },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@evercam/ui",
-  "version": "0.0.55-beta.15",
+  "version": "0.0.55-beta.17",
   "license": "MIT",
   "private": false,
   "author": "Evercam - Constuction Cameras.",