@evercam/ui 1.0.0-preview-ongoing-processing-89ca20a83 → 1.0.0-preview-fix-compare-370f7aa81

package/CHANGELOG.md

@@ -38,3 +38,5 @@
   0.0.58-preview-evercam-ui-ci-00c612b81 ([b0c521577](https://github.com/evercam/evercam-frontend/commit/b0c5215773e22c06ae410a0974e6baf020374b27))
 - feat: create release script for
   evercam-ui ([00c612b81](https://github.com/evercam/evercam-frontend/commit/00c612b81e68653aaf6bc9dcfd5a098426089811))
+
+//

package/README.md

@@ -39,8 +39,11 @@ export default {
 </script>
 ```
 
+
 ### Dev mode
 
 You can preview the components and their stories by running the [Histoire](https://histoire.dev) sever:
 
 `yarn story:dev`
+
+

package/dist/attributes.json

@@ -330,6 +330,10 @@
     "description": "",
     "default": true
   },
+  "ETimeline/label-width": {
+    "type": "number|any",
+    "description": ""
+  },
   "ETimeline/bar-height": {
     "type": "number",
     "description": "",
@@ -434,6 +438,16 @@
     "description": "",
     "default": true
   },
+  "ETimeline/transition-duration": {
+    "type": "number",
+    "description": "",
+    "default": 400
+  },
+  "ETimeline/scaling-duration": {
+    "type": "number",
+    "description": "",
+    "default": 400
+  },
   "EVideoEmbed/video-url": {
     "type": "string",
     "description": ""

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

@@ -21,8 +21,12 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
         height: number;
     };
     CompareMode: typeof CompareMode;
+    isBeforeImageLoaded: boolean;
+    isAfterImageLoaded: boolean;
 }, {
     onZoomChange(state: Record<string, any>): void;
+    handleAfterImageLoad(): void;
+    handleBeforeImageLoad(): void;
     handleResize(): void;
     handleMouseMove(event: MouseEvent): void;
     handleMouseDown(): void;
@@ -37,6 +41,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     windowBounds: Record<string, number>;
     watermarkStyle: Record<string, string>;
     computedSeparatorPositionX: number;
+    isComponentLoading: boolean;
 }, {
     beforeImageSrc: string;
     afterImageSrc: string;

package/dist/components/charts/ETimelineGroupContainer.vue.d.ts

@@ -73,6 +73,7 @@ declare const _default: import("vue/types/vue").ExtendedVue<Vue<Record<string, a
     label: string;
     color: string;
     backgroundColor: string;
+    preserveColors: boolean;
     x: number;
     y: number;
     height: number;

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

@@ -1,171 +1,3 @@
-import * as d3 from "d3";
 import Vue from "vue";
-import { TimelineChartType, TimelineCountEvent, TimelineDomain, TimelineEvent, TimelineEventsByType, TimelineEventsGroup, TimelineInterval, TimelineMarker, TimelinePrecision, Timestamp } from '../../types';
-import { NormalizedScopedSlot } from "vue/types/vnode";
-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;
-    timeline: HTMLElement;
-    svgElement: SVGSVGElement;
-    svg: d3.Selection<SVGSVGElement, any, any, any>;
-    axisHeight: number;
-    isHoveringEvent: boolean;
-    isHoveringGroupedEvents: boolean;
-    isAnimating: boolean;
-    hoveredEvent: TimelineEvent;
-    eventTooltipStyle: {};
-    hoveredEventType: string;
-    hoveredCounts: {
-        count: number;
-        type: string;
-        label?: string | undefined;
-    }[];
-    visibleFrom: Date;
-    visibleTo: Date;
-    characterWidth: number;
-    textPadding: number;
-    timeouts: number[];
-    groupsVisibility: Record<string, boolean>;
-    selectedMilestoneId: any;
-    isInitialized: boolean;
-    hoveredMilestone: TimelineEvent;
-    focusedDomain: TimelineDomain;
-    transitionDuration: number;
-    focusedTimestamp: string | Date;
-    hoveredGroupedEvents: TimelineEvent[];
-    TimelineChartType: typeof TimelineChartType;
-    width: number;
-}, {
-    handleVisibleIntervalChange({ fromDate, toDate, trigger, transform }: {
-        fromDate: any;
-        toDate: any;
-        trigger: any;
-        transform: any;
-    }): void;
-    getGroupByType(groups: TimelineEventsByType, types: TimelineChartType[]): {};
-    getPreviousCountsByTimestamp(index: number): Record<string, number>;
-    getChartsYPosition(groupId: string | number): number;
-    validateProps(): void;
-    initTimeline(): void;
-    initRefs(): void;
-    zoomToFitMarkers(): void;
-    clearTimeline(): void;
-    handleMouseLeave(): void;
-    handleMouseMove(mouseX: number, timestamp: string): void;
-    isForbiddenInterval(timestamp: string): boolean;
-    handleClick(timestamp: string): void;
-    handleMarkerClick(marker: TimelineMarker): void;
-    handleChartMouseOver(_event: MouseEvent, eventData: TimelineCountEvent, eventType: string): void;
-    handleChartMouseOut(): void;
-    handleBarMouseOver(event: MouseEvent, eventData: TimelineEvent, eventType: string): void;
-    handleBarGroupedEventsMouseOver(event: MouseEvent, events: TimelineEvent[], eventType: string): void;
-    handleBarMouseOut(): void;
-    handleTimeScaleChange(ts: d3.ScaleTime<any, any, unknown>): void;
-    zoomToStartAndEndDates(): void;
-    onAnimationStart(): void;
-    onAnimationEnd(): void;
-    getMilestoneClass(milestone: TimelineEvent): Record<string, boolean>;
-    getMilestoneColors(milestoneColor: string | undefined, groupColor: string): {
-        background: string;
-        border: string;
-    };
-    getMilestoneGroupYPosition(groupName: string | number): number;
-    getBarGroupYPosition(groupName: string | number, bottom?: boolean): number;
-    getBarGroupHeight(eventsGroup: TimelineEventsGroup): number;
-    getTextFillColor(baseColor: string, k?: number): string;
-    getLabelBackgroundColor(baseColor: string): string;
-    getCurrentGroupVisibility(type: string): boolean;
-    toggleGroupVisibility(type: string): void;
-    getExternalLabelStyles(type: string): {
-        background: string;
-        color: string;
-    };
-    getExternalLabelText(type: string): string;
-    getExternalLabelWrapperStyles(type: string): {
-        borderColor: string;
-    };
-    tzStringToDate(timestamp: Timestamp): Date;
-    getFormattedTimestamp(timestamp: Timestamp): string;
-    fillTimeGaps(events: TimelineEvent[]): (import('../../types').TimelineBarEvent | import('../../types').TimelineRangeEvent | TimelineCountEvent | import('../../types').TimelineMilestoneEvent | {
-        timestamp: string;
-        count: number;
-    })[];
-    fillEvents(events: TimelineEvent[]): TimelineEvent[];
-    onMilestoneClick(milestone: TimelineEvent, milestoneType: any): void;
-    getSortedEvents(events: TimelineEvent[]): TimelineEvent[];
-    onHoverMilestone(milestone: TimelineEvent): void;
-    onResizeContainer({ contentRect }: ResizeObserverEntry): void;
-}, {
-    filteredEventsGroups: TimelineEventsByType;
-    allEventsSorted: TimelineEvent[];
-    barGroups: TimelineEventsByType;
-    lineGraphGroups: TimelineEventsByType;
-    barChartGroups: TimelineEventsByType;
-    milestonesGroups: TimelineEventsByType;
-    combinedBarsHeight: number;
-    combinedBottomBarsHeight: number;
-    combinedMilestonesHeight: number;
-    milestonesYOffset: number;
-    chartsYOffset: number;
-    barsYOffset: number;
-    hasMilestones: boolean;
-    computedClasses: Record<string, string | Record<string, boolean>>;
-    chartHeight: number;
-    chartLabelHeight: number;
-    hasChart: boolean;
-    labelRectWidth: number;
-    combinedXAxesHeight: number;
-    timelineHeight: number;
-    oldestEvent: TimelineEvent;
-    latestEvent: TimelineEvent;
-    allLineChartTimestamps: string[];
-    placeholderLineChartGroup: TimelineEvent[];
-    filledGapsLineGraphGroups: TimelineEventsByType;
-    flattenedLinesCounts: TimelineCountEvent[];
-    flattenedBarsCounts: TimelineCountEvent[];
-    hiddenGroupsLabels: string[];
-    minHoverZone: number;
-    sortedMarkers: TimelineMarker[];
-    maxVisibleCount: number;
-    defaultMaxDomain: string[];
-    defaultFocusedDomain: string[];
-    domain: TimelineDomain;
-    svgLeft: number;
-    markersScopedSlots: Record<string, NormalizedScopedSlot | undefined>;
-    isHoveringMilestone: Boolean;
-    milestonesGroupsPlaceholder: TimelineEventsByType;
-    countsByTimestamp: Record<string, Record<string, number>>;
-}, {
-    eventsGroups: TimelineEventsByType;
-    dark: boolean;
-    startDate: string;
-    endDate: string;
-    selectedTimestamp: string;
-    showEventTooltip: boolean;
-    insertZerosAtInterval: TimelinePrecision;
-    flattenLineGraphEnds: boolean;
-    showLabels: boolean;
-    barHeight: number;
-    barYPadding: number;
-    chartMinHeight: number;
-    chartMinLabelHeight: number;
-    minDate: string;
-    maxDate: string;
-    panOnDateClick: boolean;
-    selectedDate: string;
-    markers: TimelineMarker[];
-    stickyMarkers: boolean;
-    fitMarkersOnChange: boolean;
-    milestoneBulletSize: number;
-    milestonesFirst: boolean;
-    forbiddenIntervals: TimelineInterval[];
-    forbiddenIntervalColor: string;
-    focusedInterval: TimelineInterval | undefined;
-    locked: boolean;
-    timezone: string | undefined;
-    stopClickPropagation: boolean;
-    tooltipPosition: string;
-    maxDomainPadding: number;
-    showCursor: boolean;
-}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin>;
+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>>, unknown, unknown, unknown, Record<never, any>, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin>;
 export default _default;

package/dist/index.d.ts

@@ -232,172 +232,7 @@ export declare const components: {
         fallbackSrc: string;
         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;
-        timeline: HTMLElement;
-        svgElement: SVGSVGElement;
-        svg: import("d3-selection").Selection<SVGSVGElement, any, any, any>;
-        axisHeight: number;
-        isHoveringEvent: boolean;
-        isHoveringGroupedEvents: boolean;
-        isAnimating: boolean;
-        hoveredEvent: import('./types').TimelineEvent;
-        eventTooltipStyle: {};
-        hoveredEventType: string;
-        hoveredCounts: {
-            count: number;
-            type: string;
-            label?: string | undefined;
-        }[];
-        visibleFrom: Date;
-        visibleTo: Date;
-        characterWidth: number;
-        textPadding: number;
-        timeouts: number[];
-        groupsVisibility: Record<string, boolean>;
-        selectedMilestoneId: any;
-        isInitialized: boolean;
-        hoveredMilestone: import('./types').TimelineEvent;
-        focusedDomain: import('./types').TimelineDomain;
-        transitionDuration: number;
-        focusedTimestamp: string | Date;
-        hoveredGroupedEvents: import('./types').TimelineEvent[];
-        TimelineChartType: typeof import('./types').TimelineChartType;
-        width: number;
-    }, {
-        handleVisibleIntervalChange({ fromDate, toDate, trigger, transform }: {
-            fromDate: any;
-            toDate: any;
-            trigger: any;
-            transform: any;
-        }): void;
-        getGroupByType(groups: import('./types').TimelineEventsByType, types: import('./types').TimelineChartType[]): {};
-        getPreviousCountsByTimestamp(index: number): Record<string, number>;
-        getChartsYPosition(groupId: string | number): number;
-        validateProps(): void;
-        initTimeline(): void;
-        initRefs(): void;
-        zoomToFitMarkers(): void;
-        clearTimeline(): void;
-        handleMouseLeave(): void;
-        handleMouseMove(mouseX: number, timestamp: string): void;
-        isForbiddenInterval(timestamp: string): boolean;
-        handleClick(timestamp: string): void;
-        handleMarkerClick(marker: import('./types').TimelineMarker): void;
-        handleChartMouseOver(_event: MouseEvent, eventData: import('./types').TimelineCountEvent, eventType: string): void;
-        handleChartMouseOut(): void;
-        handleBarMouseOver(event: MouseEvent, eventData: import('./types').TimelineEvent, eventType: string): void;
-        handleBarGroupedEventsMouseOver(event: MouseEvent, events: import('./types').TimelineEvent[], eventType: string): void;
-        handleBarMouseOut(): void;
-        handleTimeScaleChange(ts: import("d3-scale").ScaleTime<any, any, unknown>): void;
-        zoomToStartAndEndDates(): void;
-        onAnimationStart(): void;
-        onAnimationEnd(): void;
-        getMilestoneClass(milestone: import('./types').TimelineEvent): Record<string, boolean>;
-        getMilestoneColors(milestoneColor: string | undefined, groupColor: string): {
-            background: string;
-            border: string;
-        };
-        getMilestoneGroupYPosition(groupName: string | number): number;
-        getBarGroupYPosition(groupName: string | number, bottom?: boolean | undefined): number;
-        getBarGroupHeight(eventsGroup: import('./types').TimelineEventsGroup): number;
-        getTextFillColor(baseColor: string, k?: number): string;
-        getLabelBackgroundColor(baseColor: string): string;
-        getCurrentGroupVisibility(type: string): boolean;
-        toggleGroupVisibility(type: string): void;
-        getExternalLabelStyles(type: string): {
-            background: string;
-            color: string;
-        };
-        getExternalLabelText(type: string): string;
-        getExternalLabelWrapperStyles(type: string): {
-            borderColor: string;
-        };
-        tzStringToDate(timestamp: import('./types').Timestamp): Date;
-        getFormattedTimestamp(timestamp: import('./types').Timestamp): string;
-        fillTimeGaps(events: import('./types').TimelineEvent[]): (import('./types').TimelineBarEvent | import('./types').TimelineRangeEvent | import('./types').TimelineCountEvent | import('./types').TimelineMilestoneEvent | {
-            timestamp: string;
-            count: number;
-        })[];
-        fillEvents(events: import('./types').TimelineEvent[]): import('./types').TimelineEvent[];
-        onMilestoneClick(milestone: import('./types').TimelineEvent, milestoneType: any): void;
-        getSortedEvents(events: import('./types').TimelineEvent[]): import('./types').TimelineEvent[];
-        onHoverMilestone(milestone: import('./types').TimelineEvent): void;
-        onResizeContainer({ contentRect }: ResizeObserverEntry): void;
-    }, {
-        filteredEventsGroups: import('./types').TimelineEventsByType;
-        allEventsSorted: import('./types').TimelineEvent[];
-        barGroups: import('./types').TimelineEventsByType;
-        lineGraphGroups: import('./types').TimelineEventsByType;
-        barChartGroups: import('./types').TimelineEventsByType;
-        milestonesGroups: import('./types').TimelineEventsByType;
-        combinedBarsHeight: number;
-        combinedBottomBarsHeight: number;
-        combinedMilestonesHeight: number;
-        milestonesYOffset: number;
-        chartsYOffset: number;
-        barsYOffset: number;
-        hasMilestones: boolean;
-        computedClasses: Record<string, string | Record<string, boolean>>;
-        chartHeight: number;
-        chartLabelHeight: number;
-        hasChart: boolean;
-        labelRectWidth: number;
-        combinedXAxesHeight: number;
-        timelineHeight: number;
-        oldestEvent: import('./types').TimelineEvent;
-        latestEvent: import('./types').TimelineEvent;
-        allLineChartTimestamps: string[];
-        placeholderLineChartGroup: import('./types').TimelineEvent[];
-        filledGapsLineGraphGroups: import('./types').TimelineEventsByType;
-        flattenedLinesCounts: import('./types').TimelineCountEvent[];
-        flattenedBarsCounts: import('./types').TimelineCountEvent[];
-        hiddenGroupsLabels: string[];
-        minHoverZone: number;
-        sortedMarkers: import('./types').TimelineMarker[];
-        maxVisibleCount: number;
-        defaultMaxDomain: string[];
-        defaultFocusedDomain: string[];
-        domain: import('./types').TimelineDomain;
-        svgLeft: number;
-        markersScopedSlots: Record<string, import("vue/types/vnode").NormalizedScopedSlot | undefined>;
-        isHoveringMilestone: Boolean;
-        milestonesGroupsPlaceholder: import('./types').TimelineEventsByType;
-        countsByTimestamp: Record<string, Record<string, number>>;
-    }, {
-        eventsGroups: import('./types').TimelineEventsByType;
-        dark: boolean;
-        startDate: string;
-        endDate: string;
-        selectedTimestamp: string;
-        showEventTooltip: boolean;
-        insertZerosAtInterval: import('./types').TimelinePrecision;
-        flattenLineGraphEnds: boolean;
-        showLabels: boolean;
-        barHeight: number;
-        barYPadding: number;
-        chartMinHeight: number;
-        chartMinLabelHeight: number;
-        minDate: string;
-        maxDate: string;
-        panOnDateClick: boolean;
-        selectedDate: string;
-        markers: import('./types').TimelineMarker[];
-        stickyMarkers: boolean;
-        fitMarkersOnChange: boolean;
-        milestoneBulletSize: number;
-        milestonesFirst: boolean;
-        forbiddenIntervals: import('./types').TimelineInterval[];
-        forbiddenIntervalColor: string;
-        focusedInterval: import('./types').TimelineInterval | undefined;
-        locked: boolean;
-        timezone: string | undefined;
-        stopClickPropagation: boolean;
-        tooltipPosition: string;
-        maxDomainPadding: number;
-        showCursor: boolean;
-    }, {}, 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>>, unknown, unknown, unknown, Record<never, any>, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin>;
     EVideoEmbed: 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>>, unknown, unknown, {
         videoId: string | undefined;
         embedUrl: string;
@@ -536,8 +371,12 @@ export declare const components: {
             height: number;
         };
         CompareMode: typeof import('./types').CompareMode;
+        isBeforeImageLoaded: boolean;
+        isAfterImageLoaded: boolean;
     }, {
         onZoomChange(state: Record<string, any>): void;
+        handleAfterImageLoad(): void;
+        handleBeforeImageLoad(): void;
         handleResize(): void;
         handleMouseMove(event: MouseEvent): void;
         handleMouseDown(): void;
@@ -552,6 +391,7 @@ export declare const components: {
         windowBounds: Record<string, number>;
         watermarkStyle: Record<string, string>;
         computedSeparatorPositionX: number;
+        isComponentLoading: boolean;
     }, {
         beforeImageSrc: string;
         afterImageSrc: string;