@perses-dev/components 0.38.0 → 0.39.0

package/dist/cjs/utils/axis.js

@@ -21,7 +21,7 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    getYAxes: ()=>getYAxes,
+    getFormattedAxis: ()=>getFormattedAxis,
     getDateRange: ()=>getDateRange
 });
 const _merge = /*#__PURE__*/ _interopRequireDefault(require("lodash/merge"));
@@ -31,9 +31,9 @@ function _interopRequireDefault(obj) {
         default: obj
     };
 }
-function getYAxes(yAxis, unit) {
+function getFormattedAxis(axis, unit) {
     // TODO: support alternate yAxis that shows on right side
-    const Y_AXIS_DEFAULT = {
+    const AXIS_DEFAULT = {
         type: 'value',
         boundaryGap: [
             0,
@@ -46,7 +46,7 @@ function getYAxes(yAxis, unit) {
         }
     };
     return [
-        (0, _merge.default)(Y_AXIS_DEFAULT, yAxis)
+        (0, _merge.default)(AXIS_DEFAULT, axis)
     ];
 }
 function getDateRange(data) {

package/dist/cjs/utils/chart-actions.js

@@ -25,8 +25,12 @@ _export(exports, {
     restoreChart: ()=>restoreChart,
     clearHighlightedSeries: ()=>clearHighlightedSeries,
     getPointInGrid: ()=>getPointInGrid,
-    batchDispatchNearbySeriesActions: ()=>batchDispatchNearbySeriesActions
+    batchDispatchNearbySeriesActions: ()=>batchDispatchNearbySeriesActions,
+    checkCrosshairPinnedStatus: ()=>checkCrosshairPinnedStatus,
+    getClosestTimestamp: ()=>getClosestTimestamp,
+    getClosestTimestampInFullDataset: ()=>getClosestTimestampInFullDataset
 });
+const _model = require("../model");
 function enableDataZoom(chart) {
     const chartModel = chart['_model'];
     if (chartModel === undefined) return;
@@ -115,3 +119,37 @@ function batchDispatchNearbySeriesActions(chart, nearbySeriesIndexes, emphasized
         });
     }
 }
+function checkCrosshairPinnedStatus(seriesMapping) {
+    var ref;
+    const isCrosshairPinned = ((ref = seriesMapping[seriesMapping.length - 1]) === null || ref === void 0 ? void 0 : ref.name) === _model.PINNED_CROSSHAIR_SERIES_NAME;
+    return isCrosshairPinned;
+}
+function getClosestTimestamp(timeSeriesValues, cursorX) {
+    if (timeSeriesValues === undefined || cursorX === undefined) {
+        return null;
+    }
+    let currentClosestTimestamp = null;
+    let currentClosestDistance = Infinity;
+    for (const [timestamp] of timeSeriesValues){
+        const distance = Math.abs(timestamp - cursorX);
+        if (distance < currentClosestDistance) {
+            currentClosestTimestamp = timestamp;
+            currentClosestDistance = distance;
+        }
+    }
+    return currentClosestTimestamp;
+}
+function getClosestTimestampInFullDataset(data, cursorX) {
+    if (cursorX === undefined) {
+        return null;
+    }
+    const totalSeries = data.length;
+    let closestTimestamp = null;
+    for(let seriesIdx = 0; seriesIdx < totalSeries; seriesIdx++){
+        const currentDataset = totalSeries > 0 ? data[seriesIdx] : null;
+        if (currentDataset == null) break;
+        const currentValues = currentDataset.values;
+        closestTimestamp = getClosestTimestamp(currentValues, cursorX);
+    }
+    return closestTimestamp;
+}

package/dist/context/ChartsProvider.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { PersesChartsTheme } from '../model';
+import { CursorCoordinates } from '../TimeSeriesTooltip';
+export interface ChartsProviderProps {
+    chartsTheme: PersesChartsTheme;
+    enablePinning?: boolean;
+    children?: React.ReactNode;
+}
+export interface SharedChartsState {
+    chartsTheme: PersesChartsTheme;
+    enablePinning: boolean;
+    lastTooltipPinnedCoords: CursorCoordinates | null;
+    setLastTooltipPinnedCoords: (lastTooltipPinnedCoords: CursorCoordinates | null) => void;
+}
+export declare function ChartsProvider(props: ChartsProviderProps): JSX.Element;
+export declare const ChartsThemeContext: React.Context<SharedChartsState | undefined>;
+export declare function useChartsContext(): SharedChartsState;
+export declare function useChartsTheme(): PersesChartsTheme;
+//# sourceMappingURL=ChartsProvider.d.ts.map

package/dist/context/ChartsProvider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartsProvider.d.ts","sourceRoot":"","sources":["../../src/context/ChartsProvider.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAC5E,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAEzD,MAAM,WAAW,mBAAmB;IAClC,WAAW,EAAE,iBAAiB,CAAC;IAC/B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,MAAM,WAAW,iBAAiB;IAChC,WAAW,EAAE,iBAAiB,CAAC;IAC/B,aAAa,EAAE,OAAO,CAAC;IACvB,uBAAuB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAClD,0BAA0B,EAAE,CAAC,uBAAuB,EAAE,iBAAiB,GAAG,IAAI,KAAK,IAAI,CAAC;CACzF;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,eAexD;AAED,eAAO,MAAM,kBAAkB,8CAA0D,CAAC;AAE1F,wBAAgB,gBAAgB,IAAI,iBAAiB,CAMpD;AAED,wBAAgB,cAAc,IAAI,iBAAiB,CAGlD"}

package/dist/context/{ChartsThemeProvider.js → ChartsProvider.js}

@@ -11,21 +11,39 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 import { jsx as _jsx } from "react/jsx-runtime";
-import React, { createContext, useContext } from 'react';
-export function ChartsThemeProvider(props) {
-    const { children , chartsTheme  } = props;
+import React, { createContext, useContext, useMemo, useState } from 'react';
+export function ChartsProvider(props) {
+    const { children , chartsTheme , enablePinning =false  } = props;
+    const [lastTooltipPinnedCoords, setLastTooltipPinnedCoords] = useState(null);
+    const ctx = useMemo(()=>{
+        return {
+            chartsTheme,
+            enablePinning,
+            lastTooltipPinnedCoords,
+            setLastTooltipPinnedCoords
+        };
+    }, [
+        chartsTheme,
+        enablePinning,
+        lastTooltipPinnedCoords,
+        setLastTooltipPinnedCoords
+    ]);
     return /*#__PURE__*/ _jsx(ChartsThemeContext.Provider, {
-        value: chartsTheme,
+        value: ctx,
         children: children
     });
 }
 export const ChartsThemeContext = /*#__PURE__*/ createContext(undefined);
-export function useChartsTheme() {
+export function useChartsContext() {
     const ctx = useContext(ChartsThemeContext);
     if (ctx === undefined) {
         throw new Error('No ChartsThemeContext found. Did you forget a Provider?');
     }
     return ctx;
 }
+export function useChartsTheme() {
+    const ctx = useChartsContext();
+    return ctx.chartsTheme;
+}
 
-//# sourceMappingURL=ChartsThemeProvider.js.map
+//# sourceMappingURL=ChartsProvider.js.map

package/dist/context/ChartsProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/context/ChartsProvider.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport React, { createContext, useContext, useMemo, useState } from 'react';\nimport { PersesChartsTheme } from '../model';\nimport { CursorCoordinates } from '../TimeSeriesTooltip';\n\nexport interface ChartsProviderProps {\n  chartsTheme: PersesChartsTheme;\n  enablePinning?: boolean;\n  children?: React.ReactNode;\n}\n\nexport interface SharedChartsState {\n  chartsTheme: PersesChartsTheme;\n  enablePinning: boolean;\n  lastTooltipPinnedCoords: CursorCoordinates | null;\n  setLastTooltipPinnedCoords: (lastTooltipPinnedCoords: CursorCoordinates | null) => void;\n}\n\nexport function ChartsProvider(props: ChartsProviderProps) {\n  const { children, chartsTheme, enablePinning = false } = props;\n\n  const [lastTooltipPinnedCoords, setLastTooltipPinnedCoords] = useState<CursorCoordinates | null>(null);\n\n  const ctx = useMemo(() => {\n    return {\n      chartsTheme,\n      enablePinning,\n      lastTooltipPinnedCoords,\n      setLastTooltipPinnedCoords,\n    };\n  }, [chartsTheme, enablePinning, lastTooltipPinnedCoords, setLastTooltipPinnedCoords]);\n\n  return <ChartsThemeContext.Provider value={ctx}>{children}</ChartsThemeContext.Provider>;\n}\n\nexport const ChartsThemeContext = createContext<SharedChartsState | undefined>(undefined);\n\nexport function useChartsContext(): SharedChartsState {\n  const ctx = useContext(ChartsThemeContext);\n  if (ctx === undefined) {\n    throw new Error('No ChartsThemeContext found. Did you forget a Provider?');\n  }\n  return ctx;\n}\n\nexport function useChartsTheme(): PersesChartsTheme {\n  const ctx = useChartsContext();\n  return ctx.chartsTheme;\n}\n"],"names":["React","createContext","useContext","useMemo","useState","ChartsProvider","props","children","chartsTheme","enablePinning","lastTooltipPinnedCoords","setLastTooltipPinnedCoords","ctx","ChartsThemeContext","Provider","value","undefined","useChartsContext","Error","useChartsTheme"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,OAAOA,KAAK,IAAIC,aAAa,EAAEC,UAAU,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO,CAAC;AAiB5E,OAAO,SAASC,cAAc,CAACC,KAA0B,EAAE;IACzD,MAAM,EAAEC,QAAQ,CAAA,EAAEC,WAAW,CAAA,EAAEC,aAAa,EAAG,KAAK,CAAA,EAAE,GAAGH,KAAK,AAAC;IAE/D,MAAM,CAACI,uBAAuB,EAAEC,0BAA0B,CAAC,GAAGP,QAAQ,CAA2B,IAAI,CAAC,AAAC;IAEvG,MAAMQ,GAAG,GAAGT,OAAO,CAAC,IAAM;QACxB,OAAO;YACLK,WAAW;YACXC,aAAa;YACbC,uBAAuB;YACvBC,0BAA0B;SAC3B,CAAC;IACJ,CAAC,EAAE;QAACH,WAAW;QAAEC,aAAa;QAAEC,uBAAuB;QAAEC,0BAA0B;KAAC,CAAC,AAAC;IAEtF,qBAAO,KAACE,kBAAkB,CAACC,QAAQ;QAACC,KAAK,EAAEH,GAAG;kBAAGL,QAAQ;MAA+B,CAAC;AAC3F,CAAC;AAED,OAAO,MAAMM,kBAAkB,iBAAGZ,aAAa,CAAgCe,SAAS,CAAC,CAAC;AAE1F,OAAO,SAASC,gBAAgB,GAAsB;IACpD,MAAML,GAAG,GAAGV,UAAU,CAACW,kBAAkB,CAAC,AAAC;IAC3C,IAAID,GAAG,KAAKI,SAAS,EAAE;QACrB,MAAM,IAAIE,KAAK,CAAC,yDAAyD,CAAC,CAAC;IAC7E,CAAC;IACD,OAAON,GAAG,CAAC;AACb,CAAC;AAED,OAAO,SAASO,cAAc,GAAsB;IAClD,MAAMP,GAAG,GAAGK,gBAAgB,EAAE,AAAC;IAC/B,OAAOL,GAAG,CAACJ,WAAW,CAAC;AACzB,CAAC"}

package/dist/context/index.d.ts

@@ -0,0 +1,4 @@
+export * from './ChartsProvider';
+export * from './SnackbarProvider';
+export * from './TimeZoneProvider';
+//# sourceMappingURL=index.d.ts.map

package/dist/context/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/context/index.ts"],"names":[],"mappings":"AAaA,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC"}

package/dist/context/index.js

@@ -0,0 +1,17 @@
+// Copyright 2023 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+export * from './ChartsProvider';
+export * from './SnackbarProvider';
+export * from './TimeZoneProvider';
+
+//# sourceMappingURL=index.js.map

package/dist/context/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/context/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './ChartsProvider';\nexport * from './SnackbarProvider';\nexport * from './TimeZoneProvider';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC"}

package/dist/index.d.ts

@@ -24,9 +24,7 @@ export * from './TimeChart';
 export * from './TimeSeriesTooltip';
 export * from './UnitSelector';
 export * from './YAxisLabel';
-export * from './context/ChartsThemeProvider';
-export * from './context/TimeZoneProvider';
-export * from './context/SnackbarProvider';
+export * from './context';
 export * from './utils';
 export * from './model';
 export * from './test-utils';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAaA,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,+BAA+B,CAAC;AAC9C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,yBAAyB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAaA,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,yBAAyB,CAAC"}

package/dist/index.js

@@ -36,9 +36,7 @@ export * from './TimeChart';
 export * from './TimeSeriesTooltip';
 export * from './UnitSelector';
 export * from './YAxisLabel';
-export * from './context/ChartsThemeProvider';
-export * from './context/TimeZoneProvider';
-export * from './context/SnackbarProvider';
+export * from './context';
 export * from './utils';
 export * from './model';
 export * from './test-utils';

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './BarChart';\nexport * from './ColorPicker';\nexport * from './ContentWithLegend';\nexport * from './DateTimeRangePicker';\nexport * from './Dialog';\nexport * from './Drawer';\nexport * from './EChart';\nexport * from './ErrorAlert';\nexport * from './ErrorBoundary';\nexport * from './FontSizeSelector';\nexport * from './GaugeChart';\nexport * from './InfoTooltip';\nexport * from './JSONEditor';\nexport * from './Legend';\nexport * from './LineChart';\nexport * from './ModeSelector';\nexport * from './OptionsEditorLayout';\nexport * from './SettingsAutocomplete';\nexport * from './SortSelector';\nexport * from './StatChart';\nexport * from './Table';\nexport * from './ThresholdsEditor';\nexport * from './TimeChart';\nexport * from './TimeSeriesTooltip';\nexport * from './UnitSelector';\nexport * from './YAxisLabel';\nexport * from './context/ChartsThemeProvider';\nexport * from './context/TimeZoneProvider';\nexport * from './context/SnackbarProvider';\nexport * from './utils';\nexport * from './model';\nexport * from './test-utils';\nexport * from './theme';\nexport * from './RefreshIntervalPicker';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,+BAA+B,CAAC;AAC9C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,yBAAyB,CAAC"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './BarChart';\nexport * from './ColorPicker';\nexport * from './ContentWithLegend';\nexport * from './DateTimeRangePicker';\nexport * from './Dialog';\nexport * from './Drawer';\nexport * from './EChart';\nexport * from './ErrorAlert';\nexport * from './ErrorBoundary';\nexport * from './FontSizeSelector';\nexport * from './GaugeChart';\nexport * from './InfoTooltip';\nexport * from './JSONEditor';\nexport * from './Legend';\nexport * from './LineChart';\nexport * from './ModeSelector';\nexport * from './OptionsEditorLayout';\nexport * from './SettingsAutocomplete';\nexport * from './SortSelector';\nexport * from './StatChart';\nexport * from './Table';\nexport * from './ThresholdsEditor';\nexport * from './TimeChart';\nexport * from './TimeSeriesTooltip';\nexport * from './UnitSelector';\nexport * from './YAxisLabel';\nexport * from './context';\nexport * from './utils';\nexport * from './model';\nexport * from './test-utils';\nexport * from './theme';\nexport * from './RefreshIntervalPicker';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,YAAY,CAAC;AAC3B,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,oBAAoB,CAAC;AACnC,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,yBAAyB,CAAC"}

package/dist/test-utils/theme.d.ts

@@ -1,3 +1,5 @@
 import { PersesChartsTheme } from '../model';
+import { SharedChartsState } from '../context';
 export declare const testChartsTheme: PersesChartsTheme;
+export declare const mockChartsContext: SharedChartsState;
 //# sourceMappingURL=theme.d.ts.map

package/dist/test-utils/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/test-utils/theme.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAE7C,eAAO,MAAM,eAAe,EAAE,iBAgB7B,CAAC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/test-utils/theme.ts"],"names":[],"mappings":"AAcA,OAAO,EAAE,iBAAiB,EAAgB,MAAM,UAAU,CAAC;AAE3D,OAAO,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AAoB/C,eAAO,MAAM,eAAe,EAAE,iBAAyF,CAAC;AAExH,eAAO,MAAM,iBAAiB,EAAE,iBAK/B,CAAC"}

package/dist/test-utils/theme.js

@@ -10,26 +10,33 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-export const testChartsTheme = {
-    echartsTheme: {},
-    noDataOption: {},
-    sparkline: {
-        width: 1,
-        color: '#000000'
+import { createTheme as createMuiTheme } from '@mui/material';
+import { generateChartsTheme } from '../utils';
+// app specific echarts option overrides
+const TEST_ECHARTS_THEME_OVERRIDES = {
+    textStyle: {
+        fontFamily: 'Lato'
     },
-    container: {
-        padding: {
-            default: 12
+    categoryAxis: {
+        splitLine: {
+            show: false
         }
     },
-    thresholds: {
-        defaultColor: '#59CC8D',
-        palette: [
-            '#438FEB',
-            '#FFB249',
-            '#EE6C6C'
-        ]
+    timeAxis: {
+        splitLine: {
+            show: false
+        }
+    },
+    bar: {
+        barCategoryGap: 2
     }
 };
+export const testChartsTheme = generateChartsTheme(createMuiTheme({}), TEST_ECHARTS_THEME_OVERRIDES);
+export const mockChartsContext = {
+    chartsTheme: testChartsTheme,
+    enablePinning: false,
+    lastTooltipPinnedCoords: null,
+    setLastTooltipPinnedCoords: ()=>null
+};
 
 //# sourceMappingURL=theme.js.map

package/dist/test-utils/theme.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/test-utils/theme.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { PersesChartsTheme } from '../model';\n\nexport const testChartsTheme: PersesChartsTheme = {\n  echartsTheme: {},\n  noDataOption: {},\n  sparkline: {\n    width: 1,\n    color: '#000000',\n  },\n  container: {\n    padding: {\n      default: 12,\n    },\n  },\n  thresholds: {\n    defaultColor: '#59CC8D',\n    palette: ['#438FEB', '#FFB249', '#EE6C6C'],\n  },\n};\n"],"names":["testChartsTheme","echartsTheme","noDataOption","sparkline","width","color","container","padding","default","thresholds","defaultColor","palette"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAIjC,OAAO,MAAMA,eAAe,GAAsB;IAChDC,YAAY,EAAE,EAAE;IAChBC,YAAY,EAAE,EAAE;IAChBC,SAAS,EAAE;QACTC,KAAK,EAAE,CAAC;QACRC,KAAK,EAAE,SAAS;KACjB;IACDC,SAAS,EAAE;QACTC,OAAO,EAAE;YACPC,OAAO,EAAE,EAAE;SACZ;KACF;IACDC,UAAU,EAAE;QACVC,YAAY,EAAE,SAAS;QACvBC,OAAO,EAAE;YAAC,SAAS;YAAE,SAAS;YAAE,SAAS;SAAC;KAC3C;CACF,CAAC"}
+{"version":3,"sources":["../../src/test-utils/theme.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { createTheme as createMuiTheme } from '@mui/material';\nimport { PersesChartsTheme, EChartsTheme } from '../model';\nimport { generateChartsTheme } from '../utils';\nimport { SharedChartsState } from '../context';\n\n// app specific echarts option overrides\nconst TEST_ECHARTS_THEME_OVERRIDES: EChartsTheme = {\n  textStyle: { fontFamily: 'Lato' },\n  categoryAxis: {\n    splitLine: {\n      show: false,\n    },\n  },\n  timeAxis: {\n    splitLine: {\n      show: false,\n    },\n  },\n  bar: {\n    barCategoryGap: 2,\n  },\n};\n\nexport const testChartsTheme: PersesChartsTheme = generateChartsTheme(createMuiTheme({}), TEST_ECHARTS_THEME_OVERRIDES);\n\nexport const mockChartsContext: SharedChartsState = {\n  chartsTheme: testChartsTheme,\n  enablePinning: false,\n  lastTooltipPinnedCoords: null,\n  setLastTooltipPinnedCoords: () => null,\n};\n"],"names":["createTheme","createMuiTheme","generateChartsTheme","TEST_ECHARTS_THEME_OVERRIDES","textStyle","fontFamily","categoryAxis","splitLine","show","timeAxis","bar","barCategoryGap","testChartsTheme","mockChartsContext","chartsTheme","enablePinning","lastTooltipPinnedCoords","setLastTooltipPinnedCoords"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,WAAW,IAAIC,cAAc,QAAQ,eAAe,CAAC;AAE9D,SAASC,mBAAmB,QAAQ,UAAU,CAAC;AAG/C,wCAAwC;AACxC,MAAMC,4BAA4B,GAAiB;IACjDC,SAAS,EAAE;QAAEC,UAAU,EAAE,MAAM;KAAE;IACjCC,YAAY,EAAE;QACZC,SAAS,EAAE;YACTC,IAAI,EAAE,KAAK;SACZ;KACF;IACDC,QAAQ,EAAE;QACRF,SAAS,EAAE;YACTC,IAAI,EAAE,KAAK;SACZ;KACF;IACDE,GAAG,EAAE;QACHC,cAAc,EAAE,CAAC;KAClB;CACF,AAAC;AAEF,OAAO,MAAMC,eAAe,GAAsBV,mBAAmB,CAACD,cAAc,CAAC,EAAE,CAAC,EAAEE,4BAA4B,CAAC,CAAC;AAExH,OAAO,MAAMU,iBAAiB,GAAsB;IAClDC,WAAW,EAAEF,eAAe;IAC5BG,aAAa,EAAE,KAAK;IACpBC,uBAAuB,EAAE,IAAI;IAC7BC,0BAA0B,EAAE,IAAM,IAAI;CACvC,CAAC"}

package/dist/utils/axis.d.ts

@@ -1,12 +1,12 @@
-import type { YAXisComponentOption } from 'echarts';
+import type { XAXisComponentOption, YAXisComponentOption } from 'echarts';
 import { UnitOptions } from '@perses-dev/core';
-export declare function getYAxes(yAxis?: YAXisComponentOption, unit?: UnitOptions): ({
+export declare function getFormattedAxis(axis?: YAXisComponentOption | XAXisComponentOption, unit?: UnitOptions): ({
     type: string;
     boundaryGap: (string | number)[];
     axisLabel: {
         formatter: (value: number) => string;
     };
-} & (YAXisComponentOption | undefined))[];
+} & (YAXisComponentOption | XAXisComponentOption | undefined))[];
 /**
  * Calculate date range, used as a fallback when xAxis time range not passed as prop
  */

package/dist/utils/axis.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"axis.d.ts","sourceRoot":"","sources":["../../src/utils/axis.ts"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AACpD,OAAO,EAAe,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAK5D,wBAAgB,QAAQ,CAAC,KAAK,CAAC,EAAE,oBAAoB,EAAE,IAAI,CAAC,EAAE,WAAW;;;;2BAMhD,MAAM;;0CAM9B;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,EAAE,UAM1C"}
+{"version":3,"file":"axis.d.ts","sourceRoot":"","sources":["../../src/utils/axis.ts"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AAC1E,OAAO,EAAe,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAK5D,wBAAgB,gBAAgB,CAAC,IAAI,CAAC,EAAE,oBAAoB,GAAG,oBAAoB,EAAE,IAAI,CAAC,EAAE,WAAW;;;;2BAM9E,MAAM;;iEAM9B;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,IAAI,EAAE,MAAM,EAAE,UAM1C"}

package/dist/utils/axis.js

@@ -13,10 +13,10 @@
 import merge from 'lodash/merge';
 import { formatValue } from '@perses-dev/core';
 /*
- * Populate yAxis properties, returns an Array since multiple y axes will be supported in the future
- */ export function getYAxes(yAxis, unit) {
+ * Populate yAxis or xAxis properties, returns an Array since multiple axes will be supported in the future
+ */ export function getFormattedAxis(axis, unit) {
     // TODO: support alternate yAxis that shows on right side
-    const Y_AXIS_DEFAULT = {
+    const AXIS_DEFAULT = {
         type: 'value',
         boundaryGap: [
             0,
@@ -29,7 +29,7 @@ import { formatValue } from '@perses-dev/core';
         }
     };
     return [
-        merge(Y_AXIS_DEFAULT, yAxis)
+        merge(AXIS_DEFAULT, axis)
     ];
 }
 /**

package/dist/utils/axis.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/axis.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport merge from 'lodash/merge';\nimport type { YAXisComponentOption } from 'echarts';\nimport { formatValue, UnitOptions } from '@perses-dev/core';\n\n/*\n * Populate yAxis properties, returns an Array since multiple y axes will be supported in the future\n */\nexport function getYAxes(yAxis?: YAXisComponentOption, unit?: UnitOptions) {\n  // TODO: support alternate yAxis that shows on right side\n  const Y_AXIS_DEFAULT = {\n    type: 'value',\n    boundaryGap: [0, '10%'],\n    axisLabel: {\n      formatter: (value: number) => {\n        return formatValue(value, unit);\n      },\n    },\n  };\n  return [merge(Y_AXIS_DEFAULT, yAxis)];\n}\n\n/**\n * Calculate date range, used as a fallback when xAxis time range not passed as prop\n */\nexport function getDateRange(data: number[]) {\n  const defaultRange = 3600000; // hour in ms\n  if (data.length === 0) return defaultRange;\n  const lastDatum = data[data.length - 1];\n  if (data[0] === undefined || lastDatum === undefined) return defaultRange;\n  return lastDatum - data[0];\n}\n"],"names":["merge","formatValue","getYAxes","yAxis","unit","Y_AXIS_DEFAULT","type","boundaryGap","axisLabel","formatter","value","getDateRange","data","defaultRange","length","lastDatum","undefined"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,OAAOA,KAAK,MAAM,cAAc,CAAC;AAEjC,SAASC,WAAW,QAAqB,kBAAkB,CAAC;AAE5D;;CAEC,GACD,OAAO,SAASC,QAAQ,CAACC,KAA4B,EAAEC,IAAkB,EAAE;IACzE,yDAAyD;IACzD,MAAMC,cAAc,GAAG;QACrBC,IAAI,EAAE,OAAO;QACbC,WAAW,EAAE;AAAC,aAAC;YAAE,KAAK;SAAC;QACvBC,SAAS,EAAE;YACTC,SAAS,EAAE,CAACC,KAAa,GAAK;gBAC5B,OAAOT,WAAW,CAACS,KAAK,EAAEN,IAAI,CAAC,CAAC;YAClC,CAAC;SACF;KACF,AAAC;IACF,OAAO;QAACJ,KAAK,CAACK,cAAc,EAAEF,KAAK,CAAC;KAAC,CAAC;AACxC,CAAC;AAED;;CAEC,GACD,OAAO,SAASQ,YAAY,CAACC,IAAc,EAAE;IAC3C,MAAMC,YAAY,GAAG,OAAO,AAAC,EAAC,aAAa;IAC3C,IAAID,IAAI,CAACE,MAAM,KAAK,CAAC,EAAE,OAAOD,YAAY,CAAC;IAC3C,MAAME,SAAS,GAAGH,IAAI,CAACA,IAAI,CAACE,MAAM,GAAG,CAAC,CAAC,AAAC;IACxC,IAAIF,IAAI,CAAC,CAAC,CAAC,KAAKI,SAAS,IAAID,SAAS,KAAKC,SAAS,EAAE,OAAOH,YAAY,CAAC;IAC1E,OAAOE,SAAS,GAAGH,IAAI,CAAC,CAAC,CAAC,CAAC;AAC7B,CAAC"}
+{"version":3,"sources":["../../src/utils/axis.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport merge from 'lodash/merge';\nimport type { XAXisComponentOption, YAXisComponentOption } from 'echarts';\nimport { formatValue, UnitOptions } from '@perses-dev/core';\n\n/*\n * Populate yAxis or xAxis properties, returns an Array since multiple axes will be supported in the future\n */\nexport function getFormattedAxis(axis?: YAXisComponentOption | XAXisComponentOption, unit?: UnitOptions) {\n  // TODO: support alternate yAxis that shows on right side\n  const AXIS_DEFAULT = {\n    type: 'value',\n    boundaryGap: [0, '10%'],\n    axisLabel: {\n      formatter: (value: number) => {\n        return formatValue(value, unit);\n      },\n    },\n  };\n  return [merge(AXIS_DEFAULT, axis)];\n}\n\n/**\n * Calculate date range, used as a fallback when xAxis time range not passed as prop\n */\nexport function getDateRange(data: number[]) {\n  const defaultRange = 3600000; // hour in ms\n  if (data.length === 0) return defaultRange;\n  const lastDatum = data[data.length - 1];\n  if (data[0] === undefined || lastDatum === undefined) return defaultRange;\n  return lastDatum - data[0];\n}\n"],"names":["merge","formatValue","getFormattedAxis","axis","unit","AXIS_DEFAULT","type","boundaryGap","axisLabel","formatter","value","getDateRange","data","defaultRange","length","lastDatum","undefined"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,OAAOA,KAAK,MAAM,cAAc,CAAC;AAEjC,SAASC,WAAW,QAAqB,kBAAkB,CAAC;AAE5D;;CAEC,GACD,OAAO,SAASC,gBAAgB,CAACC,IAAkD,EAAEC,IAAkB,EAAE;IACvG,yDAAyD;IACzD,MAAMC,YAAY,GAAG;QACnBC,IAAI,EAAE,OAAO;QACbC,WAAW,EAAE;AAAC,aAAC;YAAE,KAAK;SAAC;QACvBC,SAAS,EAAE;YACTC,SAAS,EAAE,CAACC,KAAa,GAAK;gBAC5B,OAAOT,WAAW,CAACS,KAAK,EAAEN,IAAI,CAAC,CAAC;YAClC,CAAC;SACF;KACF,AAAC;IACF,OAAO;QAACJ,KAAK,CAACK,YAAY,EAAEF,IAAI,CAAC;KAAC,CAAC;AACrC,CAAC;AAED;;CAEC,GACD,OAAO,SAASQ,YAAY,CAACC,IAAc,EAAE;IAC3C,MAAMC,YAAY,GAAG,OAAO,AAAC,EAAC,aAAa;IAC3C,IAAID,IAAI,CAACE,MAAM,KAAK,CAAC,EAAE,OAAOD,YAAY,CAAC;IAC3C,MAAME,SAAS,GAAGH,IAAI,CAACA,IAAI,CAACE,MAAM,GAAG,CAAC,CAAC,AAAC;IACxC,IAAIF,IAAI,CAAC,CAAC,CAAC,KAAKI,SAAS,IAAID,SAAS,KAAKC,SAAS,EAAE,OAAOH,YAAY,CAAC;IAC1E,OAAOE,SAAS,GAAGH,IAAI,CAAC,CAAC,CAAC,CAAC;AAC7B,CAAC"}

package/dist/utils/chart-actions.d.ts

@@ -1,5 +1,6 @@
 import { ECharts as EChartsInstance } from 'echarts/core';
-import { DatapointInfo } from '../model';
+import { TimeSeries, TimeSeriesValueTuple } from '@perses-dev/core';
+import { DatapointInfo, TimeChartSeriesMapping } from '../model';
 export interface ZoomEventData {
     start: number;
     end: number;
@@ -18,4 +19,7 @@ export declare function restoreChart(chart: EChartsInstance): void;
 export declare function clearHighlightedSeries(chart: EChartsInstance, totalSeries: number): void;
 export declare function getPointInGrid(cursorCoordX: number, cursorCoordY: number, chart?: EChartsInstance): number[] | null;
 export declare function batchDispatchNearbySeriesActions(chart: EChartsInstance, nearbySeriesIndexes: number[], emphasizedSeriesIndexes: number[], nonEmphasizedSeriesIndexes: number[], emphasizedDatapoints: DatapointInfo[], duplicateDatapoints: DatapointInfo[]): void;
+export declare function checkCrosshairPinnedStatus(seriesMapping: TimeChartSeriesMapping): boolean;
+export declare function getClosestTimestamp(timeSeriesValues?: TimeSeriesValueTuple[], cursorX?: number): number | null;
+export declare function getClosestTimestampInFullDataset(data: TimeSeries[], cursorX?: number): number | null;
 //# sourceMappingURL=chart-actions.d.ts.map

package/dist/utils/chart-actions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart-actions.d.ts","sourceRoot":"","sources":["../../src/utils/chart-actions.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;IAEZ,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;GAGG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,eAAe,QAapD;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,eAAe,QAKlD;AAMD,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,QASjF;AAOD,wBAAgB,cAAc,CAAC,YAAY,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,eAAe,mBAYjG;AAOD,wBAAgB,gCAAgC,CAC9C,KAAK,EAAE,eAAe,EACtB,mBAAmB,EAAE,MAAM,EAAE,EAC7B,uBAAuB,EAAE,MAAM,EAAE,EACjC,0BAA0B,EAAE,MAAM,EAAE,EACpC,oBAAoB,EAAE,aAAa,EAAE,EACrC,mBAAmB,EAAE,aAAa,EAAE,QAkDrC"}
+{"version":3,"file":"chart-actions.d.ts","sourceRoot":"","sources":["../../src/utils/chart-actions.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,UAAU,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AACpE,OAAO,EAAE,aAAa,EAAgC,sBAAsB,EAAE,MAAM,UAAU,CAAC;AAE/F,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;IAEZ,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;GAGG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,eAAe,QAapD;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,eAAe,QAKlD;AAMD,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,QASjF;AAOD,wBAAgB,cAAc,CAAC,YAAY,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,eAAe,mBAYjG;AAOD,wBAAgB,gCAAgC,CAC9C,KAAK,EAAE,eAAe,EACtB,mBAAmB,EAAE,MAAM,EAAE,EAC7B,uBAAuB,EAAE,MAAM,EAAE,EACjC,0BAA0B,EAAE,MAAM,EAAE,EACpC,oBAAoB,EAAE,aAAa,EAAE,EACrC,mBAAmB,EAAE,aAAa,EAAE,QAkDrC;AAKD,wBAAgB,0BAA0B,CAAC,aAAa,EAAE,sBAAsB,WAG/E;AAMD,wBAAgB,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,oBAAoB,EAAE,EAAE,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAgB9G;AAKD,wBAAgB,gCAAgC,CAAC,IAAI,EAAE,UAAU,EAAE,EAAE,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAapG"}

package/dist/utils/chart-actions.js

@@ -10,6 +10,7 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
+import { PINNED_CROSSHAIR_SERIES_NAME } from '../model';
 /**
  * Enable dataZoom without requring user to click toolbox icon.
  * https://stackoverflow.com/questions/57183297/is-there-a-way-to-use-zoom-of-type-select-without-showing-the-toolbar
@@ -114,5 +115,46 @@
         });
     }
 }
+/*
+ * Determine whether a markLine was pushed into the final series, which means crosshair was already pinned onClick
+ */ export function checkCrosshairPinnedStatus(seriesMapping) {
+    var ref;
+    const isCrosshairPinned = ((ref = seriesMapping[seriesMapping.length - 1]) === null || ref === void 0 ? void 0 : ref.name) === PINNED_CROSSHAIR_SERIES_NAME;
+    return isCrosshairPinned;
+}
+/*
+ * Find closest timestamp to logical x coordinate returned from echartsInstance.convertFromPixel
+ * Used to find nearby series in time series tooltip.
+ */ export function getClosestTimestamp(timeSeriesValues, cursorX) {
+    if (timeSeriesValues === undefined || cursorX === undefined) {
+        return null;
+    }
+    let currentClosestTimestamp = null;
+    let currentClosestDistance = Infinity;
+    for (const [timestamp] of timeSeriesValues){
+        const distance = Math.abs(timestamp - cursorX);
+        if (distance < currentClosestDistance) {
+            currentClosestTimestamp = timestamp;
+            currentClosestDistance = distance;
+        }
+    }
+    return currentClosestTimestamp;
+}
+/*
+ * Find closest timestamp in full dataset, used to snap crosshair into place onClick when tooltip is pinned.
+ */ export function getClosestTimestampInFullDataset(data, cursorX) {
+    if (cursorX === undefined) {
+        return null;
+    }
+    const totalSeries = data.length;
+    let closestTimestamp = null;
+    for(let seriesIdx = 0; seriesIdx < totalSeries; seriesIdx++){
+        const currentDataset = totalSeries > 0 ? data[seriesIdx] : null;
+        if (currentDataset == null) break;
+        const currentValues = currentDataset.values;
+        closestTimestamp = getClosestTimestamp(currentValues, cursorX);
+    }
+    return closestTimestamp;
+}
 
 //# sourceMappingURL=chart-actions.js.map

package/dist/utils/chart-actions.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils/chart-actions.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { ECharts as EChartsInstance } from 'echarts/core';\nimport { DatapointInfo } from '../model';\n\nexport interface ZoomEventData {\n  start: number;\n  end: number;\n  // TODO: remove startIndex and endIndex once LineChart is deprecated\n  startIndex?: number;\n  endIndex?: number;\n}\n\n/**\n * Enable dataZoom without requring user to click toolbox icon.\n * https://stackoverflow.com/questions/57183297/is-there-a-way-to-use-zoom-of-type-select-without-showing-the-toolbar\n */\nexport function enableDataZoom(chart: EChartsInstance) {\n  const chartModel = chart['_model'];\n  if (chartModel === undefined) return;\n  if (chartModel.option.toolbox !== undefined && chartModel.option.toolbox.length > 0) {\n    // check if hidden data zoom icon is unselected (if selected it would be 'emphasis' instead of 'normal')\n    if (chartModel.option.toolbox[0].feature.dataZoom.iconStatus.zoom === 'normal') {\n      chart.dispatchAction({\n        type: 'takeGlobalCursor',\n        key: 'dataZoomSelect',\n        dataZoomSelectActive: true,\n      });\n    }\n  }\n}\n\n/**\n * Restore chart to original state before zoom or other actions were dispatched\n */\nexport function restoreChart(chart: EChartsInstance) {\n  // TODO: support incremental unzoom instead of restore to original state\n  chart.dispatchAction({\n    type: 'restore', // https://echarts.apache.org/en/api.html#events.restore\n  });\n}\n\n/*\n * Clear all highlighted series when cursor exits canvas\n * https://echarts.apache.org/en/api.html#action.downplay\n */\nexport function clearHighlightedSeries(chart: EChartsInstance, totalSeries: number) {\n  if (chart.dispatchAction !== undefined) {\n    for (let i = 0; i < totalSeries; i++) {\n      chart.dispatchAction({\n        type: 'downplay',\n        seriesIndex: i,\n      });\n    }\n  }\n}\n\n/*\n * Convert a point from pixel coordinate to logical coordinate.\n * Used to determine if cursor is over chart canvas and closest datapoint.\n * https://echarts.apache.org/en/api.html#echartsInstance.convertFromPixel\n */\nexport function getPointInGrid(cursorCoordX: number, cursorCoordY: number, chart?: EChartsInstance) {\n  if (chart === undefined) {\n    return null;\n  }\n\n  const pointInPixel = [cursorCoordX, cursorCoordY];\n  if (!chart.containPixel('grid', pointInPixel)) {\n    return null;\n  }\n\n  const pointInGrid: number[] = chart.convertFromPixel('grid', pointInPixel);\n  return pointInGrid;\n}\n\n/*\n * TimeSeriesChart tooltip is built custom to support finding nearby series instead of single or all series.\n * This means ECharts actions need to be dispatched manually for series highlighting, datapoint select state, etc.\n * More info: https://echarts.apache.org/en/api.html#action\n */\nexport function batchDispatchNearbySeriesActions(\n  chart: EChartsInstance,\n  nearbySeriesIndexes: number[],\n  emphasizedSeriesIndexes: number[],\n  nonEmphasizedSeriesIndexes: number[],\n  emphasizedDatapoints: DatapointInfo[],\n  duplicateDatapoints: DatapointInfo[]\n) {\n  // Accounts for multiple series that are rendered direct on top of eachother.\n  // Only applies select state to the datapoint that is visible to avoid color mismatch.\n  const lastEmphasizedDatapoint =\n    duplicateDatapoints.length > 0\n      ? duplicateDatapoints[duplicateDatapoints.length - 1]\n      : emphasizedDatapoints[emphasizedDatapoints.length - 1];\n  if (lastEmphasizedDatapoint !== undefined) {\n    // Corresponds to select options inside getTimeSeries util.\n    // https://echarts.apache.org/en/option.html#series-line.select.itemStyle\n    chart.dispatchAction({\n      type: 'select',\n      seriesIndex: lastEmphasizedDatapoint.seriesIndex,\n      dataIndex: lastEmphasizedDatapoint.dataIndex,\n      // Shared crosshair should not emphasize datapoints on adjacent charts.\n      escapeConnect: true, // TODO: try to remove escapeConnect and match by seriesName for cross panel correlation\n    });\n  }\n\n  // Clears emphasis state of all lines that are not emphasized.\n  // Emphasized is a subset of just the nearby series that are closest to cursor.\n  chart.dispatchAction({\n    type: 'downplay',\n    seriesIndex: nonEmphasizedSeriesIndexes,\n  });\n\n  // https://echarts.apache.org/en/api.html#action.highlight\n  if (emphasizedSeriesIndexes.length > 0) {\n    // Fadeout opacity of all series not closest to cursor.\n    chart.dispatchAction({\n      type: 'highlight',\n      seriesIndex: emphasizedSeriesIndexes,\n      notBlur: false, // ensure blur IS triggered, this is default but setting so it is explicit\n      escapeConnect: true, // shared crosshair should not emphasize series on adjacent charts\n    });\n  } else {\n    // When no emphasized series with bold text, notBlur allows opacity fadeout to not trigger.\n    chart.dispatchAction({\n      type: 'highlight',\n      seriesIndex: nearbySeriesIndexes,\n      notBlur: true, // do not trigger blur state when cursor is not immediately close to any series\n      escapeConnect: true, // shared crosshair should not emphasize series on adjacent charts\n    });\n\n    // Clears selected datapoints since no bold series in tooltip, restore does not impact highlighting\n    chart.dispatchAction({\n      type: 'toggleSelect', // https://echarts.apache.org/en/api.html#action.toggleSelect\n    });\n  }\n}\n"],"names":["enableDataZoom","chart","chartModel","undefined","option","toolbox","length","feature","dataZoom","iconStatus","zoom","dispatchAction","type","key","dataZoomSelectActive","restoreChart","clearHighlightedSeries","totalSeries","i","seriesIndex","getPointInGrid","cursorCoordX","cursorCoordY","pointInPixel","containPixel","pointInGrid","convertFromPixel","batchDispatchNearbySeriesActions","nearbySeriesIndexes","emphasizedSeriesIndexes","nonEmphasizedSeriesIndexes","emphasizedDatapoints","duplicateDatapoints","lastEmphasizedDatapoint","dataIndex","escapeConnect","notBlur"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAajC;;;CAGC,GACD,OAAO,SAASA,cAAc,CAACC,KAAsB,EAAE;IACrD,MAAMC,UAAU,GAAGD,KAAK,CAAC,QAAQ,CAAC,AAAC;IACnC,IAAIC,UAAU,KAAKC,SAAS,EAAE,OAAO;IACrC,IAAID,UAAU,CAACE,MAAM,CAACC,OAAO,KAAKF,SAAS,IAAID,UAAU,CAACE,MAAM,CAACC,OAAO,CAACC,MAAM,GAAG,CAAC,EAAE;QACnF,wGAAwG;QACxG,IAAIJ,UAAU,CAACE,MAAM,CAACC,OAAO,CAAC,CAAC,CAAC,CAACE,OAAO,CAACC,QAAQ,CAACC,UAAU,CAACC,IAAI,KAAK,QAAQ,EAAE;YAC9ET,KAAK,CAACU,cAAc,CAAC;gBACnBC,IAAI,EAAE,kBAAkB;gBACxBC,GAAG,EAAE,gBAAgB;gBACrBC,oBAAoB,EAAE,IAAI;aAC3B,CAAC,CAAC;QACL,CAAC;IACH,CAAC;AACH,CAAC;AAED;;CAEC,GACD,OAAO,SAASC,YAAY,CAACd,KAAsB,EAAE;IACnD,wEAAwE;IACxEA,KAAK,CAACU,cAAc,CAAC;QACnBC,IAAI,EAAE,SAAS;KAChB,CAAC,CAAC;AACL,CAAC;AAED;;;CAGC,GACD,OAAO,SAASI,sBAAsB,CAACf,KAAsB,EAAEgB,WAAmB,EAAE;IAClF,IAAIhB,KAAK,CAACU,cAAc,KAAKR,SAAS,EAAE;QACtC,IAAK,IAAIe,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGD,WAAW,EAAEC,CAAC,EAAE,CAAE;YACpCjB,KAAK,CAACU,cAAc,CAAC;gBACnBC,IAAI,EAAE,UAAU;gBAChBO,WAAW,EAAED,CAAC;aACf,CAAC,CAAC;QACL,CAAC;IACH,CAAC;AACH,CAAC;AAED;;;;CAIC,GACD,OAAO,SAASE,cAAc,CAACC,YAAoB,EAAEC,YAAoB,EAAErB,KAAuB,EAAE;IAClG,IAAIA,KAAK,KAAKE,SAAS,EAAE;QACvB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAMoB,YAAY,GAAG;QAACF,YAAY;QAAEC,YAAY;KAAC,AAAC;IAClD,IAAI,CAACrB,KAAK,CAACuB,YAAY,CAAC,MAAM,EAAED,YAAY,CAAC,EAAE;QAC7C,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAME,WAAW,GAAaxB,KAAK,CAACyB,gBAAgB,CAAC,MAAM,EAAEH,YAAY,CAAC,AAAC;IAC3E,OAAOE,WAAW,CAAC;AACrB,CAAC;AAED;;;;CAIC,GACD,OAAO,SAASE,gCAAgC,CAC9C1B,KAAsB,EACtB2B,mBAA6B,EAC7BC,uBAAiC,EACjCC,0BAAoC,EACpCC,oBAAqC,EACrCC,mBAAoC,EACpC;IACA,6EAA6E;IAC7E,sFAAsF;IACtF,MAAMC,uBAAuB,GAC3BD,mBAAmB,CAAC1B,MAAM,GAAG,CAAC,GAC1B0B,mBAAmB,CAACA,mBAAmB,CAAC1B,MAAM,GAAG,CAAC,CAAC,GACnDyB,oBAAoB,CAACA,oBAAoB,CAACzB,MAAM,GAAG,CAAC,CAAC,AAAC;IAC5D,IAAI2B,uBAAuB,KAAK9B,SAAS,EAAE;QACzC,2DAA2D;QAC3D,yEAAyE;QACzEF,KAAK,CAACU,cAAc,CAAC;YACnBC,IAAI,EAAE,QAAQ;YACdO,WAAW,EAAEc,uBAAuB,CAACd,WAAW;YAChDe,SAAS,EAAED,uBAAuB,CAACC,SAAS;YAC5C,uEAAuE;YACvEC,aAAa,EAAE,IAAI;SACpB,CAAC,CAAC;IACL,CAAC;IAED,8DAA8D;IAC9D,+EAA+E;IAC/ElC,KAAK,CAACU,cAAc,CAAC;QACnBC,IAAI,EAAE,UAAU;QAChBO,WAAW,EAAEW,0BAA0B;KACxC,CAAC,CAAC;IAEH,0DAA0D;IAC1D,IAAID,uBAAuB,CAACvB,MAAM,GAAG,CAAC,EAAE;QACtC,uDAAuD;QACvDL,KAAK,CAACU,cAAc,CAAC;YACnBC,IAAI,EAAE,WAAW;YACjBO,WAAW,EAAEU,uBAAuB;YACpCO,OAAO,EAAE,KAAK;YACdD,aAAa,EAAE,IAAI;SACpB,CAAC,CAAC;IACL,OAAO;QACL,2FAA2F;QAC3FlC,KAAK,CAACU,cAAc,CAAC;YACnBC,IAAI,EAAE,WAAW;YACjBO,WAAW,EAAES,mBAAmB;YAChCQ,OAAO,EAAE,IAAI;YACbD,aAAa,EAAE,IAAI;SACpB,CAAC,CAAC;QAEH,mGAAmG;QACnGlC,KAAK,CAACU,cAAc,CAAC;YACnBC,IAAI,EAAE,cAAc;SACrB,CAAC,CAAC;IACL,CAAC;AACH,CAAC"}
+{"version":3,"sources":["../../src/utils/chart-actions.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { ECharts as EChartsInstance } from 'echarts/core';\nimport { TimeSeries, TimeSeriesValueTuple } from '@perses-dev/core';\nimport { DatapointInfo, PINNED_CROSSHAIR_SERIES_NAME, TimeChartSeriesMapping } from '../model';\n\nexport interface ZoomEventData {\n  start: number;\n  end: number;\n  // TODO: remove startIndex and endIndex once LineChart is deprecated\n  startIndex?: number;\n  endIndex?: number;\n}\n\n/**\n * Enable dataZoom without requring user to click toolbox icon.\n * https://stackoverflow.com/questions/57183297/is-there-a-way-to-use-zoom-of-type-select-without-showing-the-toolbar\n */\nexport function enableDataZoom(chart: EChartsInstance) {\n  const chartModel = chart['_model'];\n  if (chartModel === undefined) return;\n  if (chartModel.option.toolbox !== undefined && chartModel.option.toolbox.length > 0) {\n    // check if hidden data zoom icon is unselected (if selected it would be 'emphasis' instead of 'normal')\n    if (chartModel.option.toolbox[0].feature.dataZoom.iconStatus.zoom === 'normal') {\n      chart.dispatchAction({\n        type: 'takeGlobalCursor',\n        key: 'dataZoomSelect',\n        dataZoomSelectActive: true,\n      });\n    }\n  }\n}\n\n/**\n * Restore chart to original state before zoom or other actions were dispatched\n */\nexport function restoreChart(chart: EChartsInstance) {\n  // TODO: support incremental unzoom instead of restore to original state\n  chart.dispatchAction({\n    type: 'restore', // https://echarts.apache.org/en/api.html#events.restore\n  });\n}\n\n/*\n * Clear all highlighted series when cursor exits canvas\n * https://echarts.apache.org/en/api.html#action.downplay\n */\nexport function clearHighlightedSeries(chart: EChartsInstance, totalSeries: number) {\n  if (chart.dispatchAction !== undefined) {\n    for (let i = 0; i < totalSeries; i++) {\n      chart.dispatchAction({\n        type: 'downplay',\n        seriesIndex: i,\n      });\n    }\n  }\n}\n\n/*\n * Convert a point from pixel coordinate to logical coordinate.\n * Used to determine if cursor is over chart canvas and closest datapoint.\n * https://echarts.apache.org/en/api.html#echartsInstance.convertFromPixel\n */\nexport function getPointInGrid(cursorCoordX: number, cursorCoordY: number, chart?: EChartsInstance) {\n  if (chart === undefined) {\n    return null;\n  }\n\n  const pointInPixel = [cursorCoordX, cursorCoordY];\n  if (!chart.containPixel('grid', pointInPixel)) {\n    return null;\n  }\n\n  const pointInGrid: number[] = chart.convertFromPixel('grid', pointInPixel);\n  return pointInGrid;\n}\n\n/*\n * TimeSeriesChart tooltip is built custom to support finding nearby series instead of single or all series.\n * This means ECharts actions need to be dispatched manually for series highlighting, datapoint select state, etc.\n * More info: https://echarts.apache.org/en/api.html#action\n */\nexport function batchDispatchNearbySeriesActions(\n  chart: EChartsInstance,\n  nearbySeriesIndexes: number[],\n  emphasizedSeriesIndexes: number[],\n  nonEmphasizedSeriesIndexes: number[],\n  emphasizedDatapoints: DatapointInfo[],\n  duplicateDatapoints: DatapointInfo[]\n) {\n  // Accounts for multiple series that are rendered direct on top of eachother.\n  // Only applies select state to the datapoint that is visible to avoid color mismatch.\n  const lastEmphasizedDatapoint =\n    duplicateDatapoints.length > 0\n      ? duplicateDatapoints[duplicateDatapoints.length - 1]\n      : emphasizedDatapoints[emphasizedDatapoints.length - 1];\n  if (lastEmphasizedDatapoint !== undefined) {\n    // Corresponds to select options inside getTimeSeries util.\n    // https://echarts.apache.org/en/option.html#series-line.select.itemStyle\n    chart.dispatchAction({\n      type: 'select',\n      seriesIndex: lastEmphasizedDatapoint.seriesIndex,\n      dataIndex: lastEmphasizedDatapoint.dataIndex,\n      // Shared crosshair should not emphasize datapoints on adjacent charts.\n      escapeConnect: true, // TODO: try to remove escapeConnect and match by seriesName for cross panel correlation\n    });\n  }\n\n  // Clears emphasis state of all lines that are not emphasized.\n  // Emphasized is a subset of just the nearby series that are closest to cursor.\n  chart.dispatchAction({\n    type: 'downplay',\n    seriesIndex: nonEmphasizedSeriesIndexes,\n  });\n\n  // https://echarts.apache.org/en/api.html#action.highlight\n  if (emphasizedSeriesIndexes.length > 0) {\n    // Fadeout opacity of all series not closest to cursor.\n    chart.dispatchAction({\n      type: 'highlight',\n      seriesIndex: emphasizedSeriesIndexes,\n      notBlur: false, // ensure blur IS triggered, this is default but setting so it is explicit\n      escapeConnect: true, // shared crosshair should not emphasize series on adjacent charts\n    });\n  } else {\n    // When no emphasized series with bold text, notBlur allows opacity fadeout to not trigger.\n    chart.dispatchAction({\n      type: 'highlight',\n      seriesIndex: nearbySeriesIndexes,\n      notBlur: true, // do not trigger blur state when cursor is not immediately close to any series\n      escapeConnect: true, // shared crosshair should not emphasize series on adjacent charts\n    });\n\n    // Clears selected datapoints since no bold series in tooltip, restore does not impact highlighting\n    chart.dispatchAction({\n      type: 'toggleSelect', // https://echarts.apache.org/en/api.html#action.toggleSelect\n    });\n  }\n}\n\n/*\n * Determine whether a markLine was pushed into the final series, which means crosshair was already pinned onClick\n */\nexport function checkCrosshairPinnedStatus(seriesMapping: TimeChartSeriesMapping) {\n  const isCrosshairPinned = seriesMapping[seriesMapping.length - 1]?.name === PINNED_CROSSHAIR_SERIES_NAME;\n  return isCrosshairPinned;\n}\n\n/*\n * Find closest timestamp to logical x coordinate returned from echartsInstance.convertFromPixel\n * Used to find nearby series in time series tooltip.\n */\nexport function getClosestTimestamp(timeSeriesValues?: TimeSeriesValueTuple[], cursorX?: number): number | null {\n  if (timeSeriesValues === undefined || cursorX === undefined) {\n    return null;\n  }\n\n  let currentClosestTimestamp: number | null = null;\n  let currentClosestDistance = Infinity;\n\n  for (const [timestamp] of timeSeriesValues) {\n    const distance = Math.abs(timestamp - cursorX);\n    if (distance < currentClosestDistance) {\n      currentClosestTimestamp = timestamp;\n      currentClosestDistance = distance;\n    }\n  }\n  return currentClosestTimestamp;\n}\n\n/*\n * Find closest timestamp in full dataset, used to snap crosshair into place onClick when tooltip is pinned.\n */\nexport function getClosestTimestampInFullDataset(data: TimeSeries[], cursorX?: number): number | null {\n  if (cursorX === undefined) {\n    return null;\n  }\n  const totalSeries = data.length;\n  let closestTimestamp = null;\n  for (let seriesIdx = 0; seriesIdx < totalSeries; seriesIdx++) {\n    const currentDataset = totalSeries > 0 ? data[seriesIdx] : null;\n    if (currentDataset == null) break;\n    const currentValues: TimeSeriesValueTuple[] = currentDataset.values;\n    closestTimestamp = getClosestTimestamp(currentValues, cursorX);\n  }\n  return closestTimestamp;\n}\n"],"names":["PINNED_CROSSHAIR_SERIES_NAME","enableDataZoom","chart","chartModel","undefined","option","toolbox","length","feature","dataZoom","iconStatus","zoom","dispatchAction","type","key","dataZoomSelectActive","restoreChart","clearHighlightedSeries","totalSeries","i","seriesIndex","getPointInGrid","cursorCoordX","cursorCoordY","pointInPixel","containPixel","pointInGrid","convertFromPixel","batchDispatchNearbySeriesActions","nearbySeriesIndexes","emphasizedSeriesIndexes","nonEmphasizedSeriesIndexes","emphasizedDatapoints","duplicateDatapoints","lastEmphasizedDatapoint","dataIndex","escapeConnect","notBlur","checkCrosshairPinnedStatus","seriesMapping","isCrosshairPinned","name","getClosestTimestamp","timeSeriesValues","cursorX","currentClosestTimestamp","currentClosestDistance","Infinity","timestamp","distance","Math","abs","getClosestTimestampInFullDataset","data","closestTimestamp","seriesIdx","currentDataset","currentValues","values"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@perses-dev/components",
-  "version": "0.38.0",
+  "version": "0.39.0",
   "description": "Common UI components used across Perses features",
   "license": "Apache-2.0",
   "homepage": "https://github.com/perses/perses/blob/main/README.md",
@@ -36,7 +36,7 @@
     "@codemirror/lang-json": "^6.0.1",
     "@fontsource/lato": "^4.5.10",
     "@mui/x-date-pickers": "^5.0.0-beta.1",
-    "@perses-dev/core": "0.38.0",
+    "@perses-dev/core": "0.39.0",
     "@tanstack/react-table": "^8.9.1",
     "@uiw/react-codemirror": "^4.19.1",
     "date-fns": "^2.28.0",
@@ -50,7 +50,7 @@
     "react-virtuoso": "^4.3.6"
   },
   "devDependencies": {
-    "@perses-dev/storybook": "0.38.0"
+    "@perses-dev/storybook": "0.39.0"
   },
   "peerDependencies": {
     "@mui/material": "^5.10.0",

package/dist/context/ChartsThemeProvider.d.ts

@@ -1,10 +0,0 @@
-import React from 'react';
-import { PersesChartsTheme } from '../model';
-export interface ChartsThemeProviderProps {
-    chartsTheme?: PersesChartsTheme;
-    children?: React.ReactNode;
-}
-export declare function ChartsThemeProvider(props: ChartsThemeProviderProps): JSX.Element;
-export declare const ChartsThemeContext: React.Context<PersesChartsTheme | undefined>;
-export declare function useChartsTheme(): PersesChartsTheme;
-//# sourceMappingURL=ChartsThemeProvider.d.ts.map

package/dist/context/ChartsThemeProvider.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ChartsThemeProvider.d.ts","sourceRoot":"","sources":["../../src/context/ChartsThemeProvider.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAoC,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAE7C,MAAM,WAAW,wBAAwB;IACvC,WAAW,CAAC,EAAE,iBAAiB,CAAC;IAChC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,eAGlE;AAED,eAAO,MAAM,kBAAkB,8CAA0D,CAAC;AAE1F,wBAAgB,cAAc,IAAI,iBAAiB,CAMlD"}

package/dist/context/ChartsThemeProvider.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/context/ChartsThemeProvider.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport React, { createContext, useContext } from 'react';\nimport { PersesChartsTheme } from '../model';\n\nexport interface ChartsThemeProviderProps {\n  chartsTheme?: PersesChartsTheme;\n  children?: React.ReactNode;\n}\n\nexport function ChartsThemeProvider(props: ChartsThemeProviderProps) {\n  const { children, chartsTheme } = props;\n  return <ChartsThemeContext.Provider value={chartsTheme}>{children}</ChartsThemeContext.Provider>;\n}\n\nexport const ChartsThemeContext = createContext<PersesChartsTheme | undefined>(undefined);\n\nexport function useChartsTheme(): PersesChartsTheme {\n  const ctx = useContext(ChartsThemeContext);\n  if (ctx === undefined) {\n    throw new Error('No ChartsThemeContext found. Did you forget a Provider?');\n  }\n  return ctx;\n}\n"],"names":["React","createContext","useContext","ChartsThemeProvider","props","children","chartsTheme","ChartsThemeContext","Provider","value","undefined","useChartsTheme","ctx","Error"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,OAAOA,KAAK,IAAIC,aAAa,EAAEC,UAAU,QAAQ,OAAO,CAAC;AAQzD,OAAO,SAASC,mBAAmB,CAACC,KAA+B,EAAE;IACnE,MAAM,EAAEC,QAAQ,CAAA,EAAEC,WAAW,CAAA,EAAE,GAAGF,KAAK,AAAC;IACxC,qBAAO,KAACG,kBAAkB,CAACC,QAAQ;QAACC,KAAK,EAAEH,WAAW;kBAAGD,QAAQ;MAA+B,CAAC;AACnG,CAAC;AAED,OAAO,MAAME,kBAAkB,iBAAGN,aAAa,CAAgCS,SAAS,CAAC,CAAC;AAE1F,OAAO,SAASC,cAAc,GAAsB;IAClD,MAAMC,GAAG,GAAGV,UAAU,CAACK,kBAAkB,CAAC,AAAC;IAC3C,IAAIK,GAAG,KAAKF,SAAS,EAAE;QACrB,MAAM,IAAIG,KAAK,CAAC,yDAAyD,CAAC,CAAC;IAC7E,CAAC;IACD,OAAOD,GAAG,CAAC;AACb,CAAC"}