@moderneinc/react-charts 1.2.0-next.ceab4e → 1.2.0-next.d2aaa2

package/dist/components/chrono-chart/chrono-chart.types.d.ts

@@ -4,6 +4,8 @@ export type ChronoCategory = {
     id: string;
     label: string;
     color: string;
+    /** Optional dash pattern for the stroke (e.g., '5 5' for dashed lines with no fill) */
+    strokeDasharray?: string;
     parliamentMapping?: {
         isSpecialCategory: boolean;
         hatchPattern?: string;
@@ -16,7 +18,7 @@ export type ChronoData = {
     }>;
     categories: ChronoCategory[];
     metadata: {
-        totalRepositories: number;
+        total: number;
         specialCounts?: {
             notApplicable: number;
             noLst: number;
@@ -50,6 +52,13 @@ export type ChronoChartProps = {
     showGrid?: boolean;
     enableAnimation?: boolean;
     animationDuration?: number;
+    /**
+     * Disable the timeline in historical mode.
+     * By default, the timeline is always shown in historical mode, even when there are no events.
+     * Set this to true to hide the timeline.
+     * @default false
+     */
+    disableTimeline?: boolean;
     formatDate?: (timestamp: number) => string;
     formatValue?: (value: number) => string;
     onAnimationStateChange?: (isAnimating: boolean) => void;

package/dist/components/d3-stacked-area-chart/d3-stacked-area-chart.types.d.ts

@@ -68,6 +68,7 @@ export type D3StackedAreaChartProps = {
         timestamp: number;
         label?: string;
         color?: string;
+        strokeDasharray?: string;
     }>;
     /** Marker visibility mode: 'hover' shows only nearest marker on hover, 'always' shows all markers */
     markerVisibilityMode?: 'always' | 'hover';

package/dist/components/d3-stacked-area-chart/hooks/use-d3-stacked-area.hook.d.ts

@@ -25,8 +25,10 @@ type UseD3StackedAreaProps = {
         timestamp: number;
         label?: string;
         color?: string;
+        strokeDasharray?: string;
     }>;
     markerVisibilityMode?: 'always' | 'hover';
+    onMarkerHoverChange?: (isHovering: boolean) => void;
 };
-export declare const useD3StackedArea: ({ containerRef, data, categories, width, height, margin, timeRange, showGrid, showXAxis, showYAxis, enableBrush, zoomToSelection, onTimeRangeChange, formatDate, formatValue, markers, markerVisibilityMode }: UseD3StackedAreaProps) => void;
+export declare const useD3StackedArea: ({ containerRef, data, categories, width, height, margin, timeRange, showGrid, showXAxis, showYAxis, enableBrush, zoomToSelection, onTimeRangeChange, formatDate, formatValue, markers, markerVisibilityMode, onMarkerHoverChange }: UseD3StackedAreaProps) => void;
 export {};

package/dist/components/morph-chart/hooks/use-morph-chart.hook.d.ts

@@ -39,11 +39,47 @@ type UseMorphChartProps = {
     onTimeRangeChange?: (range: [number, number]) => void;
     showScaleIndicator?: boolean;
     reposPerSeat?: number;
+    timelineEvents?: Array<{
+        timestamp: number;
+        eventName: string;
+        color?: string;
+    }>;
+    showTimeline?: boolean;
+    timelineHeight?: number;
+    timelineOffset?: number;
 };
-export declare const useMorphChart: ({ containerRef, data, categories, mode, width, height, margin, timeRange, showGrid, showAxes, formatDate, formatValue, markers: _markers, arcAngle, parliamentRadius, seatSize, animationDuration, onMorphComplete, onAnimationStateChange, onTimelineReady, onAnimationProgress, onHoveredDataChange, hoveredCategory: externalHoveredCategory, maxSeats, parliamentTimestamp, enableBrush, onTimeRangeChange, showScaleIndicator, reposPerSeat }: UseMorphChartProps) => {
+export declare const useMorphChart: ({ containerRef, data, categories, mode, width, height, margin, timeRange, showGrid, showAxes, formatDate, formatValue, markers, arcAngle, parliamentRadius, seatSize, animationDuration, onMorphComplete, onAnimationStateChange, onTimelineReady, onAnimationProgress, onHoveredDataChange, hoveredCategory: externalHoveredCategory, maxSeats, parliamentTimestamp, enableBrush, onTimeRangeChange, showScaleIndicator, reposPerSeat, timelineEvents, showTimeline, timelineHeight, timelineOffset }: UseMorphChartProps) => {
     isMorphing: boolean;
     currentMode: MorphMode;
     hoveredCategory: string | null;
     scaleIndicatorOpacity: number;
+    visibleMarkers: {
+        timestamp: number;
+        label?: string;
+        color?: string;
+        x: number;
+    }[];
+    hoveredMarker: {
+        timestamp: number;
+        label?: string;
+        color?: string;
+        x: number;
+    } | null;
+    setHoveredMarker: import('react').Dispatch<import('react').SetStateAction<{
+        timestamp: number;
+        label?: string;
+        color?: string;
+        x: number;
+    } | null>>;
+    hoveredTimelineEvent: {
+        timestamp: number;
+        eventName: string;
+        x: number;
+    } | null;
+    setHoveredTimelineEvent: import('react').Dispatch<import('react').SetStateAction<{
+        timestamp: number;
+        eventName: string;
+        x: number;
+    } | null>>;
 };
 export {};

package/dist/components/morph-chart/morph-chart.types.d.ts

@@ -94,6 +94,18 @@ export type MorphChartProps = {
      * If not provided, defaults to the rightmost (most recent) timestamp.
      */
     parliamentTimestamp?: number;
+    /** Timeline events to display below the x-axis (area mode only) */
+    timelineEvents?: Array<{
+        timestamp: number;
+        eventName: string;
+        color?: string;
+    }>;
+    /** Show timeline track (default: false) */
+    showTimeline?: boolean;
+    /** Timeline track height in pixels (default: 40) */
+    timelineHeight?: number;
+    /** Space between x-axis and timeline in pixels (default: 35) */
+    timelineOffset?: number;
 };
 /**
  * Seat position in parliament layout

package/dist/components/timeline-chart/timeline-chart.types.d.ts

@@ -3,6 +3,12 @@ export type TimelineEvent = {
     date: Date;
     timestamp: number;
     eventName: string;
+    /**
+     * Optional color for the event marker.
+     * If not provided, defaults to #2F42FF (Digital Blue 500).
+     * Accepts any valid CSS color string.
+     */
+    color?: string;
     [key: string]: unknown;
 };
 export type TimelineSelection = {