@perses-dev/scatter-chart-plugin 0.11.0 → 0.12.0-beta.2

package/lib/ScatterChart.d.ts

@@ -1,6 +1,6 @@
-import { PanelPlugin } from '@perses-dev/plugin-system';
-import { ScatterChartOptions } from './scatter-chart-model';
-import { ScatterChartPanelProps } from './ScatterChartPanel';
+import type { PanelPlugin } from '@perses-dev/plugin-system';
+import type { ScatterChartOptions } from './scatter-chart-model';
+import type { ScatterChartPanelProps } from './ScatterChartPanel';
 /**
  * The core ScatterChart panel plugin for Perses.
  */

package/lib/ScatterChart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScatterChart.d.ts","sourceRoot":"","sources":["../../src/ScatterChart.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACxD,OAAO,EAAoC,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC9F,OAAO,EAAqB,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAEhF;;GAEG;AACH,eAAO,MAAM,YAAY,EAAE,WAAW,CAAC,mBAAmB,EAAE,sBAAsB,CAMjF,CAAC"}
+{"version":3,"file":"ScatterChart.d.ts","sourceRoot":"","sources":["../../src/ScatterChart.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAE7D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAGlE;;GAEG;AACH,eAAO,MAAM,YAAY,EAAE,WAAW,CAAC,mBAAmB,EAAE,sBAAsB,CAMjF,CAAC"}

package/lib/ScatterChart.js

@@ -10,8 +10,8 @@
 // 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 { createInitialScatterChartOptions } from './scatter-chart-model';
-import { ScatterChartPanel } from './ScatterChartPanel';
+import { createInitialScatterChartOptions } from "./scatter-chart-model.js";
+import { ScatterChartPanel } from "./ScatterChartPanel.js";
 /**
  * The core ScatterChart panel plugin for Perses.
  */ export const ScatterChart = {

package/lib/ScatterChart.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ScatterChart.ts"],"sourcesContent":["// Copyright 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 { PanelPlugin } from '@perses-dev/plugin-system';\nimport { createInitialScatterChartOptions, ScatterChartOptions } from './scatter-chart-model';\nimport { ScatterChartPanel, ScatterChartPanelProps } from './ScatterChartPanel';\n\n/**\n * The core ScatterChart panel plugin for Perses.\n */\nexport const ScatterChart: PanelPlugin<ScatterChartOptions, ScatterChartPanelProps> = {\n  PanelComponent: ScatterChartPanel,\n  // TODO: add a chart options editor plugin, for example:\n  // panelOptionsEditorComponents: [{ label: 'Settings', content: ScatterChartOptionsEditorSettings }],\n  supportedQueryTypes: ['TraceQuery'],\n  createInitialOptions: createInitialScatterChartOptions,\n};\n"],"names":["createInitialScatterChartOptions","ScatterChartPanel","ScatterChart","PanelComponent","supportedQueryTypes","createInitialOptions"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAGjC,SAASA,gCAAgC,QAA6B,wBAAwB;AAC9F,SAASC,iBAAiB,QAAgC,sBAAsB;AAEhF;;CAEC,GACD,OAAO,MAAMC,eAAyE;IACpFC,gBAAgBF;IAChB,wDAAwD;IACxD,qGAAqG;IACrGG,qBAAqB;QAAC;KAAa;IACnCC,sBAAsBL;AACxB,EAAE"}
+{"version":3,"sources":["../../src/ScatterChart.ts"],"sourcesContent":["// Copyright 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 type { PanelPlugin } from '@perses-dev/plugin-system';\n\nimport type { ScatterChartOptions } from './scatter-chart-model';\nimport { createInitialScatterChartOptions } from './scatter-chart-model';\nimport type { ScatterChartPanelProps } from './ScatterChartPanel';\nimport { ScatterChartPanel } from './ScatterChartPanel';\n\n/**\n * The core ScatterChart panel plugin for Perses.\n */\nexport const ScatterChart: PanelPlugin<ScatterChartOptions, ScatterChartPanelProps> = {\n  PanelComponent: ScatterChartPanel,\n  // TODO: add a chart options editor plugin, for example:\n  // panelOptionsEditorComponents: [{ label: 'Settings', content: ScatterChartOptionsEditorSettings }],\n  supportedQueryTypes: ['TraceQuery'],\n  createInitialOptions: createInitialScatterChartOptions,\n};\n"],"names":["createInitialScatterChartOptions","ScatterChartPanel","ScatterChart","PanelComponent","supportedQueryTypes","createInitialOptions"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAKjC,SAASA,gCAAgC,QAAQ,2BAAwB;AAEzE,SAASC,iBAAiB,QAAQ,yBAAsB;AAExD;;CAEC,GACD,OAAO,MAAMC,eAAyE;IACpFC,gBAAgBF;IAChB,wDAAwD;IACxD,qGAAqG;IACrGG,qBAAqB;QAAC;KAAa;IACnCC,sBAAsBL;AACxB,EAAE"}

package/lib/ScatterChartPanel.d.ts

@@ -1,7 +1,7 @@
-import { PanelProps } from '@perses-dev/plugin-system';
-import { ReactElement } from 'react';
-import { TraceData, TraceSearchResult } from '@perses-dev/spec';
-import { ScatterChartOptions } from './scatter-chart-model';
+import type { PanelProps } from '@perses-dev/plugin-system';
+import type { TraceData, TraceSearchResult } from '@perses-dev/spec';
+import type { ReactElement } from 'react';
+import type { ScatterChartOptions } from './scatter-chart-model';
 export interface EChartTraceValue extends Omit<TraceSearchResult, 'startTimeUnixMs' | 'serviceStats'> {
     name: string;
     linkVariables: Record<string, string>;

package/lib/ScatterChartPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScatterChartPanel.d.ts","sourceRoot":"","sources":["../../src/ScatterChartPanel.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,EAAE,YAAY,EAAW,MAAM,OAAO,CAAC;AAG9C,OAAO,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAEhE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,iBAAiB,GAAG,cAAc,CAAC;IACnG,IAAI,EAAE,MAAM,CAAC;IACb,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACtC,SAAS,EAAE,IAAI,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,MAAM,sBAAsB,GAAG,UAAU,CAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC;AAKhF;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,GAAG,YAAY,GAAG,IAAI,CA+GpF;AAGD,wBAAgB,aAAa,CAC3B,SAAS,EAAE,MAAM,EACjB,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,EAChC,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,GAC1B,MAAM,CAYR"}
+{"version":3,"file":"ScatterChartPanel.d.ts","sourceRoot":"","sources":["../../src/ScatterChartPanel.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAGjE,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,iBAAiB,GAAG,cAAc,CAAC;IACnG,IAAI,EAAE,MAAM,CAAC;IACb,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACtC,SAAS,EAAE,IAAI,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,MAAM,sBAAsB,GAAG,UAAU,CAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC;AAKhF;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,GAAG,YAAY,GAAG,IAAI,CA+GpF;AAGD,wBAAgB,aAAa,CAC3B,SAAS,EAAE,MAAM,EACjB,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,EAChC,SAAS,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,GAC1B,MAAM,CAYR"}

package/lib/ScatterChartPanel.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 // Copyright 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.
@@ -10,10 +11,9 @@
 // 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 { jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import { NoDataOverlay, useChartsTheme } from '@perses-dev/components';
-import { Scatterplot } from './Scatterplot';
+import { NoDataOverlay, useChartsTheme } from "@perses-dev/components";
+import { useMemo } from "react";
+import { Scatterplot } from "./Scatterplot.js";
 /** default size range of the circles diameter */ const DEFAULT_SIZE_RANGE = [
     6,
     20

package/lib/ScatterChartPanel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/ScatterChartPanel.tsx"],"sourcesContent":["// Copyright 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 { PanelProps } from '@perses-dev/plugin-system';\nimport { ReactElement, useMemo } from 'react';\nimport { EChartsOption, SeriesOption } from 'echarts';\nimport { NoDataOverlay, useChartsTheme } from '@perses-dev/components';\nimport { TraceData, TraceSearchResult } from '@perses-dev/spec';\nimport { Scatterplot } from './Scatterplot';\nimport { ScatterChartOptions } from './scatter-chart-model';\n\nexport interface EChartTraceValue extends Omit<TraceSearchResult, 'startTimeUnixMs' | 'serviceStats'> {\n  name: string;\n  linkVariables: Record<string, string>;\n  startTime: Date;\n  spanCount: number;\n  errorCount: number;\n}\n\nexport type ScatterChartPanelProps = PanelProps<ScatterChartOptions, TraceData>;\n\n/** default size range of the circles diameter */\nconst DEFAULT_SIZE_RANGE: [number, number] = [6, 20];\n\n/**\n * ScatterChartPanel receives data from the DataQueriesProvider and transforms it\n * into a `dataset` object that Apache ECharts can consume. Additionally,\n * data formatting is also dictated in this component. Formatting includes\n * datapoint size and color.\n *\n * Documentation for data structures accepted by Apache ECharts:\n *  https://echarts.apache.org/handbook/en/concepts/dataset\n *\n * Examples for scatter chart formatting in Apache ECharts:\n *  https://echarts.apache.org/examples/en/index.html#chart-type-scatter\n *\n * @returns a `ScatterPlot` component that contains an EChart which will handle\n * visualization of the data.\n */\nexport function ScatterChartPanel(props: ScatterChartPanelProps): ReactElement | null {\n  const { spec, contentDimensions, queryResults: traceResults } = props;\n  const chartsTheme = useChartsTheme();\n  const defaultColor = chartsTheme.thresholds.defaultColor || 'blue';\n  const sizeRange = spec.sizeRange || DEFAULT_SIZE_RANGE;\n\n  // Generate dataset\n  // Transform Tempo API response to fit 'dataset' structure from Apache ECharts\n  // https://echarts.apache.org/handbook/en/concepts/dataset\n  const { dataset, minSpanCount, maxSpanCount } = useMemo(() => {\n    const dataset = [];\n    let minSpanCount: number | undefined;\n    let maxSpanCount: number | undefined;\n    for (const result of traceResults) {\n      if (result.data.searchResult === undefined) continue;\n      const dataSeries = result.data.searchResult.map((trace) => {\n        let spanCount = 0;\n        let errorCount = 0;\n        for (const stats of Object.values(trace.serviceStats)) {\n          spanCount += stats.spanCount;\n          errorCount += stats.errorCount ?? 0;\n        }\n\n        if (minSpanCount === undefined || spanCount < minSpanCount) {\n          minSpanCount = spanCount;\n        }\n        if (maxSpanCount === undefined || spanCount > maxSpanCount) {\n          maxSpanCount = spanCount;\n        }\n\n        const pluginSpec = result.definition.spec.plugin.spec as { datasource?: { name?: string } } | undefined;\n        const newTraceValue: EChartTraceValue = {\n          ...trace,\n          linkVariables: {\n            datasourceName: pluginSpec?.datasource?.name ?? '',\n            traceId: trace.traceId,\n          },\n          name: `${trace.rootServiceName}: ${trace.rootTraceName}`,\n          startTime: new Date(trace.startTimeUnixMs), // convert unix epoch time to Date\n          spanCount,\n          errorCount,\n        };\n        return newTraceValue;\n      });\n      dataset.push({\n        source: dataSeries,\n      });\n    }\n    return { dataset, minSpanCount: minSpanCount ?? 0, maxSpanCount: maxSpanCount ?? 0 };\n  }, [traceResults]);\n\n  // Formatting for the dataset\n  // 1. Map x,y coordinates\n  // 2. Datapoint size corresponds to the number of spans in a trace\n  // 3. Color datapoint red if the trace contains an error\n  const series = useMemo(() => {\n    const seriesTemplate2: SeriesOption = {\n      type: 'scatter',\n      encode: {\n        // Map to x-axis.\n        x: 'startTime',\n        // Map to y-axis.\n        y: 'durationMs',\n      },\n      symbolSize: function (data) {\n        // returns the diameter of the circles\n        return getSymbolSize(data.spanCount, [minSpanCount, maxSpanCount], sizeRange);\n      },\n      itemStyle: {\n        color: function (params) {\n          const traceData: EChartTraceValue = params.data as EChartTraceValue;\n          // If the trace contains an error, color the datapoint in red\n          if (traceData.errorCount > 0) {\n            return 'red';\n          }\n          // Else return default color\n          return defaultColor;\n        },\n      },\n    };\n\n    // Each data set needs to have a corresponding series formatting object\n    const series = [];\n    for (let i = 0; i < dataset.length; i++) {\n      series.push({ ...seriesTemplate2, datasetIndex: i });\n    }\n    return series;\n  }, [dataset, defaultColor, minSpanCount, maxSpanCount, sizeRange]);\n\n  const tracesFound = traceResults.some((traceData) => (traceData.data?.searchResult ?? []).length > 0);\n  if (!tracesFound) {\n    return <NoDataOverlay resource=\"traces\" />;\n  }\n\n  const options: EChartsOption = {\n    dataset: dataset,\n    series: series,\n  };\n\n  if (contentDimensions === undefined) return null;\n\n  return (\n    <div data-testid=\"ScatterChartPanel_ScatterPlot\">\n      <Scatterplot\n        width={contentDimensions.width}\n        height={contentDimensions.height}\n        options={options}\n        link={spec.link}\n      />\n    </div>\n  );\n}\n\n// exported for tests\nexport function getSymbolSize(\n  spanCount: number,\n  spanCountRange: [number, number],\n  sizeRange: [number, number]\n): number {\n  const [minSize, maxSize] = sizeRange;\n  const [minSpanCount, maxSpanCount] = spanCountRange;\n\n  // catch divison by zero\n  if (maxSpanCount - minSpanCount === 0) {\n    return maxSize;\n  }\n\n  // apply linear scale of spanCount from range [minSpanCount,maxSpanCount] to a value from range [minSize,maxSize]\n  const rel = (spanCount - minSpanCount) / (maxSpanCount - minSpanCount);\n  return minSize + (maxSize - minSize) * rel;\n}\n"],"names":["useMemo","NoDataOverlay","useChartsTheme","Scatterplot","DEFAULT_SIZE_RANGE","ScatterChartPanel","props","spec","contentDimensions","queryResults","traceResults","chartsTheme","defaultColor","thresholds","sizeRange","dataset","minSpanCount","maxSpanCount","result","data","searchResult","undefined","dataSeries","map","trace","spanCount","errorCount","stats","Object","values","serviceStats","pluginSpec","definition","plugin","newTraceValue","linkVariables","datasourceName","datasource","name","traceId","rootServiceName","rootTraceName","startTime","Date","startTimeUnixMs","push","source","series","seriesTemplate2","type","encode","x","y","symbolSize","getSymbolSize","itemStyle","color","params","traceData","i","length","datasetIndex","tracesFound","some","resource","options","div","data-testid","width","height","link","spanCountRange","minSize","maxSize","rel"],"mappings":"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"}
+{"version":3,"sources":["../../src/ScatterChartPanel.tsx"],"sourcesContent":["// Copyright 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 { NoDataOverlay, useChartsTheme } from '@perses-dev/components';\nimport type { PanelProps } from '@perses-dev/plugin-system';\nimport type { TraceData, TraceSearchResult } from '@perses-dev/spec';\nimport type { EChartsOption, SeriesOption } from 'echarts';\nimport type { ReactElement } from 'react';\nimport { useMemo } from 'react';\n\nimport type { ScatterChartOptions } from './scatter-chart-model';\nimport { Scatterplot } from './Scatterplot';\n\nexport interface EChartTraceValue extends Omit<TraceSearchResult, 'startTimeUnixMs' | 'serviceStats'> {\n  name: string;\n  linkVariables: Record<string, string>;\n  startTime: Date;\n  spanCount: number;\n  errorCount: number;\n}\n\nexport type ScatterChartPanelProps = PanelProps<ScatterChartOptions, TraceData>;\n\n/** default size range of the circles diameter */\nconst DEFAULT_SIZE_RANGE: [number, number] = [6, 20];\n\n/**\n * ScatterChartPanel receives data from the DataQueriesProvider and transforms it\n * into a `dataset` object that Apache ECharts can consume. Additionally,\n * data formatting is also dictated in this component. Formatting includes\n * datapoint size and color.\n *\n * Documentation for data structures accepted by Apache ECharts:\n *  https://echarts.apache.org/handbook/en/concepts/dataset\n *\n * Examples for scatter chart formatting in Apache ECharts:\n *  https://echarts.apache.org/examples/en/index.html#chart-type-scatter\n *\n * @returns a `ScatterPlot` component that contains an EChart which will handle\n * visualization of the data.\n */\nexport function ScatterChartPanel(props: ScatterChartPanelProps): ReactElement | null {\n  const { spec, contentDimensions, queryResults: traceResults } = props;\n  const chartsTheme = useChartsTheme();\n  const defaultColor = chartsTheme.thresholds.defaultColor || 'blue';\n  const sizeRange = spec.sizeRange || DEFAULT_SIZE_RANGE;\n\n  // Generate dataset\n  // Transform Tempo API response to fit 'dataset' structure from Apache ECharts\n  // https://echarts.apache.org/handbook/en/concepts/dataset\n  const { dataset, minSpanCount, maxSpanCount } = useMemo(() => {\n    const dataset = [];\n    let minSpanCount: number | undefined;\n    let maxSpanCount: number | undefined;\n    for (const result of traceResults) {\n      if (result.data.searchResult === undefined) continue;\n      const dataSeries = result.data.searchResult.map((trace) => {\n        let spanCount = 0;\n        let errorCount = 0;\n        for (const stats of Object.values(trace.serviceStats)) {\n          spanCount += stats.spanCount;\n          errorCount += stats.errorCount ?? 0;\n        }\n\n        if (minSpanCount === undefined || spanCount < minSpanCount) {\n          minSpanCount = spanCount;\n        }\n        if (maxSpanCount === undefined || spanCount > maxSpanCount) {\n          maxSpanCount = spanCount;\n        }\n\n        const pluginSpec = result.definition.spec.plugin.spec as { datasource?: { name?: string } } | undefined;\n        const newTraceValue: EChartTraceValue = {\n          ...trace,\n          linkVariables: {\n            datasourceName: pluginSpec?.datasource?.name ?? '',\n            traceId: trace.traceId,\n          },\n          name: `${trace.rootServiceName}: ${trace.rootTraceName}`,\n          startTime: new Date(trace.startTimeUnixMs), // convert unix epoch time to Date\n          spanCount,\n          errorCount,\n        };\n        return newTraceValue;\n      });\n      dataset.push({\n        source: dataSeries,\n      });\n    }\n    return { dataset, minSpanCount: minSpanCount ?? 0, maxSpanCount: maxSpanCount ?? 0 };\n  }, [traceResults]);\n\n  // Formatting for the dataset\n  // 1. Map x,y coordinates\n  // 2. Datapoint size corresponds to the number of spans in a trace\n  // 3. Color datapoint red if the trace contains an error\n  const series = useMemo(() => {\n    const seriesTemplate2: SeriesOption = {\n      type: 'scatter',\n      encode: {\n        // Map to x-axis.\n        x: 'startTime',\n        // Map to y-axis.\n        y: 'durationMs',\n      },\n      symbolSize: function (data) {\n        // returns the diameter of the circles\n        return getSymbolSize(data.spanCount, [minSpanCount, maxSpanCount], sizeRange);\n      },\n      itemStyle: {\n        color: function (params) {\n          const traceData: EChartTraceValue = params.data as EChartTraceValue;\n          // If the trace contains an error, color the datapoint in red\n          if (traceData.errorCount > 0) {\n            return 'red';\n          }\n          // Else return default color\n          return defaultColor;\n        },\n      },\n    };\n\n    // Each data set needs to have a corresponding series formatting object\n    const series = [];\n    for (let i = 0; i < dataset.length; i++) {\n      series.push({ ...seriesTemplate2, datasetIndex: i });\n    }\n    return series;\n  }, [dataset, defaultColor, minSpanCount, maxSpanCount, sizeRange]);\n\n  const tracesFound = traceResults.some((traceData) => (traceData.data?.searchResult ?? []).length > 0);\n  if (!tracesFound) {\n    return <NoDataOverlay resource=\"traces\" />;\n  }\n\n  const options: EChartsOption = {\n    dataset: dataset,\n    series: series,\n  };\n\n  if (contentDimensions === undefined) return null;\n\n  return (\n    <div data-testid=\"ScatterChartPanel_ScatterPlot\">\n      <Scatterplot\n        width={contentDimensions.width}\n        height={contentDimensions.height}\n        options={options}\n        link={spec.link}\n      />\n    </div>\n  );\n}\n\n// exported for tests\nexport function getSymbolSize(\n  spanCount: number,\n  spanCountRange: [number, number],\n  sizeRange: [number, number],\n): number {\n  const [minSize, maxSize] = sizeRange;\n  const [minSpanCount, maxSpanCount] = spanCountRange;\n\n  // catch divison by zero\n  if (maxSpanCount - minSpanCount === 0) {\n    return maxSize;\n  }\n\n  // apply linear scale of spanCount from range [minSpanCount,maxSpanCount] to a value from range [minSize,maxSize]\n  const rel = (spanCount - minSpanCount) / (maxSpanCount - minSpanCount);\n  return minSize + (maxSize - minSize) * rel;\n}\n"],"names":["NoDataOverlay","useChartsTheme","useMemo","Scatterplot","DEFAULT_SIZE_RANGE","ScatterChartPanel","props","spec","contentDimensions","queryResults","traceResults","chartsTheme","defaultColor","thresholds","sizeRange","dataset","minSpanCount","maxSpanCount","result","data","searchResult","undefined","dataSeries","map","trace","spanCount","errorCount","stats","Object","values","serviceStats","pluginSpec","definition","plugin","newTraceValue","linkVariables","datasourceName","datasource","name","traceId","rootServiceName","rootTraceName","startTime","Date","startTimeUnixMs","push","source","series","seriesTemplate2","type","encode","x","y","symbolSize","getSymbolSize","itemStyle","color","params","traceData","i","length","datasetIndex","tracesFound","some","resource","options","div","data-testid","width","height","link","spanCountRange","minSize","maxSize","rel"],"mappings":"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"}

package/lib/Scatterplot.d.ts

@@ -1,5 +1,5 @@
-import { ReactElement } from 'react';
-import { EChartsOption } from 'echarts';
+import type { EChartsOption } from 'echarts';
+import type { ReactElement } from 'react';
 export interface ScatterplotProps {
     width: number;
     height: number;

package/lib/Scatterplot.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Scatterplot.d.ts","sourceRoot":"","sources":["../../src/Scatterplot.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,YAAY,EAAwB,MAAM,OAAO,CAAC;AAa3D,OAAO,EAAE,aAAa,EAAuB,MAAM,SAAS,CAAC;AA+B7D,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,aAAa,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,YAAY,CAiGjE"}
+{"version":3,"file":"Scatterplot.d.ts","sourceRoot":"","sources":["../../src/Scatterplot.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAE,aAAa,EAAuB,MAAM,SAAS,CAAC;AAalE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AA2B1C,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,aAAa,CAAC;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,YAAY,CAiGjE"}

package/lib/Scatterplot.js

@@ -1,4 +1,3 @@
-import { jsx as _jsx } from "react/jsx-runtime";
 // Copyright 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.
@@ -11,15 +10,16 @@ import { jsx as _jsx } from "react/jsx-runtime";
 // 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 { useCallback, useMemo } from 'react';
-import { EChart, formatValue, useChartsTheme, useTimeZone } from '@perses-dev/components';
-import { use } from 'echarts/core';
-import { ScatterChart as EChartsScatterChart } from 'echarts/charts';
-import { DatasetComponent, DataZoomComponent, LegendComponent, GridComponent, TitleComponent, TooltipComponent } from 'echarts/components';
-import { CanvasRenderer } from 'echarts/renderers';
-import { replaceVariablesInString, useAllVariableValues, useRouterContext, useTimeRange } from '@perses-dev/plugin-system';
-import { createTimezoneAwareAxisFormatter } from './utils/timezone-formatter';
-use([
+import { jsx as _jsx } from "react/jsx-runtime";
+import { EChart, formatValue, useChartsTheme, useTimeZone } from "@perses-dev/components";
+import { replaceVariablesInString, useAllVariableValues, useRouterContext, useTimeRange } from "@perses-dev/plugin-system";
+import { ScatterChart as EChartsScatterChart } from "echarts/charts";
+import { DatasetComponent, DataZoomComponent, LegendComponent, GridComponent, TitleComponent, TooltipComponent } from "echarts/components";
+import { use as registerECharts } from "echarts/core";
+import { CanvasRenderer } from "echarts/renderers";
+import { useCallback, useMemo } from "react";
+import { createTimezoneAwareAxisFormatter } from "./utils/timezone-formatter.js";
+registerECharts([
     DatasetComponent,
     DataZoomComponent,
     LegendComponent,

package/lib/Scatterplot.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Scatterplot.tsx"],"sourcesContent":["// Copyright 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 { ReactElement, useCallback, useMemo } from 'react';\nimport { EChart, formatValue, OnEventsType, useChartsTheme, useTimeZone } from '@perses-dev/components';\nimport { use, EChartsCoreOption } from 'echarts/core';\nimport { ScatterChart as EChartsScatterChart } from 'echarts/charts';\nimport {\n  DatasetComponent,\n  DataZoomComponent,\n  LegendComponent,\n  GridComponent,\n  TitleComponent,\n  TooltipComponent,\n} from 'echarts/components';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { EChartsOption, ScatterSeriesOption } from 'echarts';\nimport {\n  replaceVariablesInString,\n  useAllVariableValues,\n  useRouterContext,\n  useTimeRange,\n} from '@perses-dev/plugin-system';\nimport { EChartTraceValue } from './ScatterChartPanel';\nimport { createTimezoneAwareAxisFormatter } from './utils/timezone-formatter';\n\nuse([\n  DatasetComponent,\n  DataZoomComponent,\n  LegendComponent,\n  EChartsScatterChart,\n  GridComponent,\n  TitleComponent,\n  TooltipComponent,\n  CanvasRenderer,\n]);\n\nconst DATE_FORMAT_OPTIONS: Intl.DateTimeFormatOptions = {\n  year: 'numeric',\n  month: 'long',\n  day: 'numeric',\n  hour: 'numeric',\n  minute: 'numeric',\n  second: 'numeric',\n  fractionalSecondDigits: 3,\n};\n\nexport interface ScatterplotProps {\n  width: number;\n  height: number;\n  options: EChartsOption;\n  link?: string;\n}\n\nexport function Scatterplot(props: ScatterplotProps): ReactElement {\n  const { width, height, options, link: linkTemplate } = props;\n  const chartsTheme = useChartsTheme();\n  const { absoluteTimeRange } = useTimeRange();\n  const { timeZone, dateFormatOptionsWithUserTimeZone } = useTimeZone();\n\n  const dateFormatter = useMemo(() => {\n    const dateFormatOptions = dateFormatOptionsWithUserTimeZone(DATE_FORMAT_OPTIONS);\n    return new Intl.DateTimeFormat(undefined, dateFormatOptions).format;\n  }, [dateFormatOptionsWithUserTimeZone]);\n  const variableValues = useAllVariableValues();\n  const { navigate } = useRouterContext();\n\n  const rangeMs = absoluteTimeRange.end.valueOf() - absoluteTimeRange.start.valueOf();\n  const getAxisFormatter = useCallback(() => createTimezoneAwareAxisFormatter(rangeMs, timeZone), [rangeMs, timeZone]);\n\n  // Apache EChart Options Docs: https://echarts.apache.org/en/option.html\n  const eChartOptions: EChartsCoreOption = {\n    dataset: options.dataset,\n    series: options.series,\n    dataZoom: options.dataZoom,\n    grid: {\n      top: 45,\n      bottom: 20,\n      left: 30,\n      right: 20,\n    },\n    xAxis: {\n      type: 'time',\n      min: absoluteTimeRange.start,\n      max: absoluteTimeRange.end,\n      axisLabel: {\n        hideOverlap: true,\n        formatter: getAxisFormatter(),\n      },\n    },\n    yAxis: {\n      scale: true,\n      type: 'value',\n      name: 'Duration',\n      splitNumber: 4,\n      axisLabel: {\n        formatter: (durationMs: number) => formatValue(durationMs, { unit: 'milliseconds' }),\n      },\n    },\n    animation: false,\n    tooltip: {\n      padding: 5,\n      borderWidth: 1,\n      trigger: 'axis',\n      axisPointer: {\n        type: 'cross',\n      },\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      formatter: function (params: any) {\n        // TODO: import type from ECharts instead of using any\n        const data = params[0].data as EChartTraceValue;\n        return [\n          `<b>Service name</b>: ${data.rootServiceName}<br/>`,\n          `<b>Span name</b>: ${data.rootTraceName}<br/>`,\n          `<b>Time</b>: ${dateFormatter(data.startTime)}<br/>`,\n          `<b>Duration</b>: ${formatValue(data.durationMs, { unit: 'milliseconds' })}<br/>`,\n          `<b>Span count</b>: ${data.spanCount} (${data.errorCount} errors)<br/>`,\n        ].join('');\n      },\n    },\n    legend: {\n      show: true,\n      type: 'scroll',\n      orient: 'horizontal',\n      bottom: 0,\n    },\n  };\n\n  const handleEvents: OnEventsType<ScatterSeriesOption['data'] | unknown> = useMemo(() => {\n    const handlers: OnEventsType<ScatterSeriesOption['data'] | unknown> = {};\n    if (navigate && linkTemplate) {\n      handlers.click = (params): void => {\n        const linkVariables = params.data.linkVariables as Record<string, string> | undefined;\n        const link = replaceVariablesInString(linkTemplate, variableValues, linkVariables);\n        navigate(link);\n      };\n    }\n    return handlers;\n  }, [linkTemplate, navigate, variableValues]);\n\n  return (\n    <EChart\n      style={{\n        width: width,\n        height: height,\n      }}\n      option={eChartOptions}\n      theme={chartsTheme.echartsTheme}\n      onEvents={handleEvents}\n    />\n  );\n}\n"],"names":["useCallback","useMemo","EChart","formatValue","useChartsTheme","useTimeZone","use","ScatterChart","EChartsScatterChart","DatasetComponent","DataZoomComponent","LegendComponent","GridComponent","TitleComponent","TooltipComponent","CanvasRenderer","replaceVariablesInString","useAllVariableValues","useRouterContext","useTimeRange","createTimezoneAwareAxisFormatter","DATE_FORMAT_OPTIONS","year","month","day","hour","minute","second","fractionalSecondDigits","Scatterplot","props","width","height","options","link","linkTemplate","chartsTheme","absoluteTimeRange","timeZone","dateFormatOptionsWithUserTimeZone","dateFormatter","dateFormatOptions","Intl","DateTimeFormat","undefined","format","variableValues","navigate","rangeMs","end","valueOf","start","getAxisFormatter","eChartOptions","dataset","series","dataZoom","grid","top","bottom","left","right","xAxis","type","min","max","axisLabel","hideOverlap","formatter","yAxis","scale","name","splitNumber","durationMs","unit","animation","tooltip","padding","borderWidth","trigger","axisPointer","params","data","rootServiceName","rootTraceName","startTime","spanCount","errorCount","join","legend","show","orient","handleEvents","handlers","click","linkVariables","style","option","theme","echartsTheme","onEvents"],"mappings":"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"}
+{"version":3,"sources":["../../src/Scatterplot.tsx"],"sourcesContent":["// Copyright 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 type { OnEventsType } from '@perses-dev/components';\nimport { EChart, formatValue, useChartsTheme, useTimeZone } from '@perses-dev/components';\nimport {\n  replaceVariablesInString,\n  useAllVariableValues,\n  useRouterContext,\n  useTimeRange,\n} from '@perses-dev/plugin-system';\nimport type { EChartsOption, ScatterSeriesOption } from 'echarts';\nimport { ScatterChart as EChartsScatterChart } from 'echarts/charts';\nimport {\n  DatasetComponent,\n  DataZoomComponent,\n  LegendComponent,\n  GridComponent,\n  TitleComponent,\n  TooltipComponent,\n} from 'echarts/components';\nimport type { EChartsCoreOption } from 'echarts/core';\nimport { use as registerECharts } from 'echarts/core';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport type { ReactElement } from 'react';\nimport { useCallback, useMemo } from 'react';\n\nimport type { EChartTraceValue } from './ScatterChartPanel';\nimport { createTimezoneAwareAxisFormatter } from './utils/timezone-formatter';\n\nregisterECharts([\n  DatasetComponent,\n  DataZoomComponent,\n  LegendComponent,\n  EChartsScatterChart,\n  GridComponent,\n  TitleComponent,\n  TooltipComponent,\n  CanvasRenderer,\n]);\n\nconst DATE_FORMAT_OPTIONS: Intl.DateTimeFormatOptions = {\n  year: 'numeric',\n  month: 'long',\n  day: 'numeric',\n  hour: 'numeric',\n  minute: 'numeric',\n  second: 'numeric',\n  fractionalSecondDigits: 3,\n};\n\nexport interface ScatterplotProps {\n  width: number;\n  height: number;\n  options: EChartsOption;\n  link?: string;\n}\n\nexport function Scatterplot(props: ScatterplotProps): ReactElement {\n  const { width, height, options, link: linkTemplate } = props;\n  const chartsTheme = useChartsTheme();\n  const { absoluteTimeRange } = useTimeRange();\n  const { timeZone, dateFormatOptionsWithUserTimeZone } = useTimeZone();\n\n  const dateFormatter = useMemo(() => {\n    const dateFormatOptions = dateFormatOptionsWithUserTimeZone(DATE_FORMAT_OPTIONS);\n    return new Intl.DateTimeFormat(undefined, dateFormatOptions).format;\n  }, [dateFormatOptionsWithUserTimeZone]);\n  const variableValues = useAllVariableValues();\n  const { navigate } = useRouterContext();\n\n  const rangeMs = absoluteTimeRange.end.valueOf() - absoluteTimeRange.start.valueOf();\n  const getAxisFormatter = useCallback(() => createTimezoneAwareAxisFormatter(rangeMs, timeZone), [rangeMs, timeZone]);\n\n  // Apache EChart Options Docs: https://echarts.apache.org/en/option.html\n  const eChartOptions: EChartsCoreOption = {\n    dataset: options.dataset,\n    series: options.series,\n    dataZoom: options.dataZoom,\n    grid: {\n      top: 45,\n      bottom: 20,\n      left: 30,\n      right: 20,\n    },\n    xAxis: {\n      type: 'time',\n      min: absoluteTimeRange.start,\n      max: absoluteTimeRange.end,\n      axisLabel: {\n        hideOverlap: true,\n        formatter: getAxisFormatter(),\n      },\n    },\n    yAxis: {\n      scale: true,\n      type: 'value',\n      name: 'Duration',\n      splitNumber: 4,\n      axisLabel: {\n        formatter: (durationMs: number) => formatValue(durationMs, { unit: 'milliseconds' }),\n      },\n    },\n    animation: false,\n    tooltip: {\n      padding: 5,\n      borderWidth: 1,\n      trigger: 'axis',\n      axisPointer: {\n        type: 'cross',\n      },\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      formatter: function (params: any) {\n        // TODO: import type from ECharts instead of using any\n        const data = params[0].data as EChartTraceValue;\n        return [\n          `<b>Service name</b>: ${data.rootServiceName}<br/>`,\n          `<b>Span name</b>: ${data.rootTraceName}<br/>`,\n          `<b>Time</b>: ${dateFormatter(data.startTime)}<br/>`,\n          `<b>Duration</b>: ${formatValue(data.durationMs, { unit: 'milliseconds' })}<br/>`,\n          `<b>Span count</b>: ${data.spanCount} (${data.errorCount} errors)<br/>`,\n        ].join('');\n      },\n    },\n    legend: {\n      show: true,\n      type: 'scroll',\n      orient: 'horizontal',\n      bottom: 0,\n    },\n  };\n\n  const handleEvents: OnEventsType<ScatterSeriesOption['data'] | unknown> = useMemo(() => {\n    const handlers: OnEventsType<ScatterSeriesOption['data'] | unknown> = {};\n    if (navigate && linkTemplate) {\n      handlers.click = (params): void => {\n        const linkVariables = params.data.linkVariables as Record<string, string> | undefined;\n        const link = replaceVariablesInString(linkTemplate, variableValues, linkVariables);\n        navigate(link);\n      };\n    }\n    return handlers;\n  }, [linkTemplate, navigate, variableValues]);\n\n  return (\n    <EChart\n      style={{\n        width: width,\n        height: height,\n      }}\n      option={eChartOptions}\n      theme={chartsTheme.echartsTheme}\n      onEvents={handleEvents}\n    />\n  );\n}\n"],"names":["EChart","formatValue","useChartsTheme","useTimeZone","replaceVariablesInString","useAllVariableValues","useRouterContext","useTimeRange","ScatterChart","EChartsScatterChart","DatasetComponent","DataZoomComponent","LegendComponent","GridComponent","TitleComponent","TooltipComponent","use","registerECharts","CanvasRenderer","useCallback","useMemo","createTimezoneAwareAxisFormatter","DATE_FORMAT_OPTIONS","year","month","day","hour","minute","second","fractionalSecondDigits","Scatterplot","props","width","height","options","link","linkTemplate","chartsTheme","absoluteTimeRange","timeZone","dateFormatOptionsWithUserTimeZone","dateFormatter","dateFormatOptions","Intl","DateTimeFormat","undefined","format","variableValues","navigate","rangeMs","end","valueOf","start","getAxisFormatter","eChartOptions","dataset","series","dataZoom","grid","top","bottom","left","right","xAxis","type","min","max","axisLabel","hideOverlap","formatter","yAxis","scale","name","splitNumber","durationMs","unit","animation","tooltip","padding","borderWidth","trigger","axisPointer","params","data","rootServiceName","rootTraceName","startTime","spanCount","errorCount","join","legend","show","orient","handleEvents","handlers","click","linkVariables","style","option","theme","echartsTheme","onEvents"],"mappings":"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"}

package/lib/bootstrap.js

@@ -11,8 +11,8 @@ import { jsx as _jsx } from "react/jsx-runtime";
 // 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 React from 'react';
-import ReactDOM from 'react-dom/client';
+import React from "react";
+import ReactDOM from "react-dom/client";
 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(/*#__PURE__*/ _jsx(React.StrictMode, {}));
 

package/lib/getPluginModule.d.ts

@@ -1,4 +1,4 @@
-import { PluginModuleResource } from '@perses-dev/plugin-system';
+import type { PluginModuleResource } from '@perses-dev/plugin-system';
 /**
  * Returns the plugin module information from package.json
  */

package/lib/getPluginModule.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getPluginModule.d.ts","sourceRoot":"","sources":["../../src/getPluginModule.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,oBAAoB,EAAoB,MAAM,2BAA2B,CAAC;AAGnF;;GAEG;AACH,wBAAgB,eAAe,IAAI,oBAAoB,CAUtD"}
+{"version":3,"file":"getPluginModule.d.ts","sourceRoot":"","sources":["../../src/getPluginModule.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,oBAAoB,EAAoB,MAAM,2BAA2B,CAAC;AAIxF;;GAEG;AACH,wBAAgB,eAAe,IAAI,oBAAoB,CAUtD"}

package/lib/getPluginModule.js

@@ -10,7 +10,9 @@
 // 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 packageJson from '../package.json';
+import packageJson from "../package.json" with {
+    type: 'json'
+};
 /**
  * Returns the plugin module information from package.json
  */ export function getPluginModule() {

package/lib/getPluginModule.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/getPluginModule.ts"],"sourcesContent":["// Copyright 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 { PluginModuleResource, PluginModuleSpec } from '@perses-dev/plugin-system';\nimport packageJson from '../package.json';\n\n/**\n * Returns the plugin module information from package.json\n */\nexport function getPluginModule(): PluginModuleResource {\n  const { name, version, perses } = packageJson;\n  return {\n    kind: 'PluginModule',\n    metadata: {\n      name,\n      version,\n    },\n    spec: perses as PluginModuleSpec,\n  };\n}\n"],"names":["packageJson","getPluginModule","name","version","perses","kind","metadata","spec"],"mappings":"AAAA,+BAA+B;AAC/B,oEAAoE;AACpE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,sEAAsE;AACtE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAGjC,OAAOA,iBAAiB,kBAAkB;AAE1C;;CAEC,GACD,OAAO,SAASC;IACd,MAAM,EAAEC,IAAI,EAAEC,OAAO,EAAEC,MAAM,EAAE,GAAGJ;IAClC,OAAO;QACLK,MAAM;QACNC,UAAU;YACRJ;YACAC;QACF;QACAI,MAAMH;IACR;AACF"}
+{"version":3,"sources":["../../src/getPluginModule.ts"],"sourcesContent":["// Copyright 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 type { PluginModuleResource, PluginModuleSpec } from '@perses-dev/plugin-system';\n\nimport packageJson from '../package.json' with { type: 'json' };\n\n/**\n * Returns the plugin module information from package.json\n */\nexport function getPluginModule(): PluginModuleResource {\n  const { name, version, perses } = packageJson;\n  return {\n    kind: 'PluginModule',\n    metadata: {\n      name,\n      version,\n    },\n    spec: perses as PluginModuleSpec,\n  };\n}\n"],"names":["packageJson","type","getPluginModule","name","version","perses","kind","metadata","spec"],"mappings":"AAAA,+BAA+B;AAC/B,oEAAoE;AACpE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,sEAAsE;AACtE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAIjC,OAAOA,iBAAiB,uBAAuB;IAAEC,MAAM;AAAO,EAAE;AAEhE;;CAEC,GACD,OAAO,SAASC;IACd,MAAM,EAAEC,IAAI,EAAEC,OAAO,EAAEC,MAAM,EAAE,GAAGL;IAClC,OAAO;QACLM,MAAM;QACNC,UAAU;YACRJ;YACAC;QACF;QACAI,MAAMH;IACR;AACF"}

package/lib/index-federation.js

@@ -10,6 +10,6 @@
 // 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('./bootstrap');
+import("./bootstrap.js");
 
 //# sourceMappingURL=index-federation.js.map

package/lib/index.js

@@ -10,10 +10,10 @@
 // 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 { getPluginModule } from './getPluginModule';
-export * from './scatter-chart-model';
-export * from './ScatterChart';
-export * from './ScatterChartPanel';
-export * from './Scatterplot';
+export { getPluginModule } from "./getPluginModule.js";
+export * from "./scatter-chart-model.js";
+export * from "./ScatterChart.js";
+export * from "./ScatterChartPanel.js";
+export * from "./Scatterplot.js";
 
 //# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["// Copyright 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 { getPluginModule } from './getPluginModule';\nexport * from './scatter-chart-model';\nexport * from './ScatterChart';\nexport * from './ScatterChartPanel';\nexport * from './Scatterplot';\n"],"names":["getPluginModule"],"mappings":"AAAA,+BAA+B;AAC/B,oEAAoE;AACpE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,sEAAsE;AACtE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,eAAe,QAAQ,oBAAoB;AACpD,cAAc,wBAAwB;AACtC,cAAc,iBAAiB;AAC/B,cAAc,sBAAsB;AACpC,cAAc,gBAAgB"}
+{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["// Copyright 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 { getPluginModule } from './getPluginModule';\nexport * from './scatter-chart-model';\nexport * from './ScatterChart';\nexport * from './ScatterChartPanel';\nexport * from './Scatterplot';\n"],"names":["getPluginModule"],"mappings":"AAAA,+BAA+B;AAC/B,oEAAoE;AACpE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,sEAAsE;AACtE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,eAAe,QAAQ,uBAAoB;AACpD,cAAc,2BAAwB;AACtC,cAAc,oBAAiB;AAC/B,cAAc,yBAAsB;AACpC,cAAc,mBAAgB"}

package/lib/mock-trace-data.d.ts

@@ -1,4 +1,4 @@
-import { TraceData } from '@perses-dev/spec';
+import type { TraceData } from '@perses-dev/spec';
 /**
  * Mock data we get from getTraceData() in @perses/tempo-plugin.
  */

package/lib/mock-trace-data.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mock-trace-data.d.ts","sourceRoot":"","sources":["../../src/mock-trace-data.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAE7C;;GAEG;AACH,eAAO,MAAM,wBAAwB,EAAE,SAsBtC,CAAC;AAEF,eAAO,MAAM,8BAA8B,EAAE,SAK5C,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,qCAAqC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCjD,CAAC;AAEF,eAAO,MAAM,2CAA2C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCvD,CAAC"}
+{"version":3,"file":"mock-trace-data.d.ts","sourceRoot":"","sources":["../../src/mock-trace-data.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAElD;;GAEG;AACH,eAAO,MAAM,wBAAwB,EAAE,SAsBtC,CAAC;AAEF,eAAO,MAAM,8BAA8B,EAAE,SAK5C,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,qCAAqC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCjD,CAAC;AAEF,eAAO,MAAM,2CAA2C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCvD,CAAC"}

package/lib/mock-trace-data.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/mock-trace-data.ts"],"sourcesContent":["// Copyright 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 { TraceData } from '@perses-dev/spec';\n\n/**\n * Mock data we get from getTraceData() in @perses/tempo-plugin.\n */\nexport const MOCK_TRACE_SEARCH_RESULT: TraceData = {\n  searchResult: [\n    {\n      startTimeUnixMs: 1702915645000, // unix epoch time in milliseconds\n      durationMs: 100,\n      serviceStats: {\n        'service-name': {\n          spanCount: 10,\n        },\n        'second-service-name': {\n          spanCount: 3,\n          errorCount: 2,\n        },\n      },\n      traceId: '123',\n      rootServiceName: 'service-name',\n      rootTraceName: 'span-name',\n    },\n  ],\n  metadata: {\n    executedQueryString: '{duration > 500ms}',\n  },\n};\n\nexport const MOCK_TRACE_SEARCH_RESULT_EMPTY: TraceData = {\n  searchResult: [],\n  metadata: {\n    executedQueryString: '{duration > 500ms}',\n  },\n};\n\n/**\n * Mocks results obtained from useTraceQueries() in @perses/plugin-system/runtime.\n * This function uses then React TanStack function useQueries(fooQuery) to\n * handle fetching.\n */\nexport const MOCK_TRACE_SEARCH_RESULT_QUERY_RESULT = [\n  {\n    status: 'success',\n    fetchStatus: 'idle',\n    isLoading: false,\n    isSuccess: true,\n    isError: false,\n    data: MOCK_TRACE_SEARCH_RESULT,\n    dataUpdatedAt: 1666500979895,\n    definition: {\n      kind: 'TraceQuery',\n      spec: {\n        plugin: {\n          kind: 'TempoTraceQuery',\n          spec: {\n            query: '{}',\n            datasource: {\n              kind: 'TempoDatasource',\n              name: 'tempolocal',\n            },\n          },\n        },\n      },\n    },\n    error: null,\n    errorUpdatedAt: 0,\n    failureCount: 0,\n    errorUpdateCount: 0,\n    isFetched: true,\n    isFetchedAfterMount: true,\n    isFetching: false,\n    isRefetching: false,\n    isLoadingError: false,\n    isPaused: false,\n    isPlaceholderData: false,\n    isPreviousData: false,\n    isRefetchError: false,\n    isStale: true,\n  },\n];\n\nexport const MOCK_TRACE_SEARCH_RESULT_QUERY_RESULT_EMPTY = [\n  {\n    status: 'success',\n    fetchStatus: 'idle',\n    isLoading: false,\n    isSuccess: true,\n    isError: false,\n    data: MOCK_TRACE_SEARCH_RESULT_EMPTY,\n    dataUpdatedAt: 1666500979895,\n    definition: {\n      kind: 'TraceQuery',\n      spec: {\n        plugin: {\n          kind: 'TempoTraceQuery',\n          spec: {\n            query: '{}',\n            datasource: {\n              kind: 'TempoDatasource',\n              name: 'tempolocal',\n            },\n          },\n        },\n      },\n    },\n    error: null,\n    errorUpdatedAt: 0,\n    failureCount: 0,\n    errorUpdateCount: 0,\n    isFetched: true,\n    isFetchedAfterMount: true,\n    isFetching: false,\n    isRefetching: false,\n    isLoadingError: false,\n    isPaused: false,\n    isPlaceholderData: false,\n    isPreviousData: false,\n    isRefetchError: false,\n    isStale: true,\n  },\n];\n"],"names":["MOCK_TRACE_SEARCH_RESULT","searchResult","startTimeUnixMs","durationMs","serviceStats","spanCount","errorCount","traceId","rootServiceName","rootTraceName","metadata","executedQueryString","MOCK_TRACE_SEARCH_RESULT_EMPTY","MOCK_TRACE_SEARCH_RESULT_QUERY_RESULT","status","fetchStatus","isLoading","isSuccess","isError","data","dataUpdatedAt","definition","kind","spec","plugin","query","datasource","name","error","errorUpdatedAt","failureCount","errorUpdateCount","isFetched","isFetchedAfterMount","isFetching","isRefetching","isLoadingError","isPaused","isPlaceholderData","isPreviousData","isRefetchError","isStale","MOCK_TRACE_SEARCH_RESULT_QUERY_RESULT_EMPTY"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAIjC;;CAEC,GACD,OAAO,MAAMA,2BAAsC;IACjDC,cAAc;QACZ;YACEC,iBAAiB;YACjBC,YAAY;YACZC,cAAc;gBACZ,gBAAgB;oBACdC,WAAW;gBACb;gBACA,uBAAuB;oBACrBA,WAAW;oBACXC,YAAY;gBACd;YACF;YACAC,SAAS;YACTC,iBAAiB;YACjBC,eAAe;QACjB;KACD;IACDC,UAAU;QACRC,qBAAqB;IACvB;AACF,EAAE;AAEF,OAAO,MAAMC,iCAA4C;IACvDX,cAAc,EAAE;IAChBS,UAAU;QACRC,qBAAqB;IACvB;AACF,EAAE;AAEF;;;;CAIC,GACD,OAAO,MAAME,wCAAwC;IACnD;QACEC,QAAQ;QACRC,aAAa;QACbC,WAAW;QACXC,WAAW;QACXC,SAAS;QACTC,MAAMnB;QACNoB,eAAe;QACfC,YAAY;YACVC,MAAM;YACNC,MAAM;gBACJC,QAAQ;oBACNF,MAAM;oBACNC,MAAM;wBACJE,OAAO;wBACPC,YAAY;4BACVJ,MAAM;4BACNK,MAAM;wBACR;oBACF;gBACF;YACF;QACF;QACAC,OAAO;QACPC,gBAAgB;QAChBC,cAAc;QACdC,kBAAkB;QAClBC,WAAW;QACXC,qBAAqB;QACrBC,YAAY;QACZC,cAAc;QACdC,gBAAgB;QAChBC,UAAU;QACVC,mBAAmB;QACnBC,gBAAgB;QAChBC,gBAAgB;QAChBC,SAAS;IACX;CACD,CAAC;AAEF,OAAO,MAAMC,8CAA8C;IACzD;QACE5B,QAAQ;QACRC,aAAa;QACbC,WAAW;QACXC,WAAW;QACXC,SAAS;QACTC,MAAMP;QACNQ,eAAe;QACfC,YAAY;YACVC,MAAM;YACNC,MAAM;gBACJC,QAAQ;oBACNF,MAAM;oBACNC,MAAM;wBACJE,OAAO;wBACPC,YAAY;4BACVJ,MAAM;4BACNK,MAAM;wBACR;oBACF;gBACF;YACF;QACF;QACAC,OAAO;QACPC,gBAAgB;QAChBC,cAAc;QACdC,kBAAkB;QAClBC,WAAW;QACXC,qBAAqB;QACrBC,YAAY;QACZC,cAAc;QACdC,gBAAgB;QAChBC,UAAU;QACVC,mBAAmB;QACnBC,gBAAgB;QAChBC,gBAAgB;QAChBC,SAAS;IACX;CACD,CAAC"}
+{"version":3,"sources":["../../src/mock-trace-data.ts"],"sourcesContent":["// Copyright 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 type { TraceData } from '@perses-dev/spec';\n\n/**\n * Mock data we get from getTraceData() in @perses/tempo-plugin.\n */\nexport const MOCK_TRACE_SEARCH_RESULT: TraceData = {\n  searchResult: [\n    {\n      startTimeUnixMs: 1702915645000, // unix epoch time in milliseconds\n      durationMs: 100,\n      serviceStats: {\n        'service-name': {\n          spanCount: 10,\n        },\n        'second-service-name': {\n          spanCount: 3,\n          errorCount: 2,\n        },\n      },\n      traceId: '123',\n      rootServiceName: 'service-name',\n      rootTraceName: 'span-name',\n    },\n  ],\n  metadata: {\n    executedQueryString: '{duration > 500ms}',\n  },\n};\n\nexport const MOCK_TRACE_SEARCH_RESULT_EMPTY: TraceData = {\n  searchResult: [],\n  metadata: {\n    executedQueryString: '{duration > 500ms}',\n  },\n};\n\n/**\n * Mocks results obtained from useTraceQueries() in @perses/plugin-system/runtime.\n * This function uses then React TanStack function useQueries(fooQuery) to\n * handle fetching.\n */\nexport const MOCK_TRACE_SEARCH_RESULT_QUERY_RESULT = [\n  {\n    status: 'success',\n    fetchStatus: 'idle',\n    isLoading: false,\n    isSuccess: true,\n    isError: false,\n    data: MOCK_TRACE_SEARCH_RESULT,\n    dataUpdatedAt: 1666500979895,\n    definition: {\n      kind: 'TraceQuery',\n      spec: {\n        plugin: {\n          kind: 'TempoTraceQuery',\n          spec: {\n            query: '{}',\n            datasource: {\n              kind: 'TempoDatasource',\n              name: 'tempolocal',\n            },\n          },\n        },\n      },\n    },\n    error: null,\n    errorUpdatedAt: 0,\n    failureCount: 0,\n    errorUpdateCount: 0,\n    isFetched: true,\n    isFetchedAfterMount: true,\n    isFetching: false,\n    isRefetching: false,\n    isLoadingError: false,\n    isPaused: false,\n    isPlaceholderData: false,\n    isPreviousData: false,\n    isRefetchError: false,\n    isStale: true,\n  },\n];\n\nexport const MOCK_TRACE_SEARCH_RESULT_QUERY_RESULT_EMPTY = [\n  {\n    status: 'success',\n    fetchStatus: 'idle',\n    isLoading: false,\n    isSuccess: true,\n    isError: false,\n    data: MOCK_TRACE_SEARCH_RESULT_EMPTY,\n    dataUpdatedAt: 1666500979895,\n    definition: {\n      kind: 'TraceQuery',\n      spec: {\n        plugin: {\n          kind: 'TempoTraceQuery',\n          spec: {\n            query: '{}',\n            datasource: {\n              kind: 'TempoDatasource',\n              name: 'tempolocal',\n            },\n          },\n        },\n      },\n    },\n    error: null,\n    errorUpdatedAt: 0,\n    failureCount: 0,\n    errorUpdateCount: 0,\n    isFetched: true,\n    isFetchedAfterMount: true,\n    isFetching: false,\n    isRefetching: false,\n    isLoadingError: false,\n    isPaused: false,\n    isPlaceholderData: false,\n    isPreviousData: false,\n    isRefetchError: false,\n    isStale: true,\n  },\n];\n"],"names":["MOCK_TRACE_SEARCH_RESULT","searchResult","startTimeUnixMs","durationMs","serviceStats","spanCount","errorCount","traceId","rootServiceName","rootTraceName","metadata","executedQueryString","MOCK_TRACE_SEARCH_RESULT_EMPTY","MOCK_TRACE_SEARCH_RESULT_QUERY_RESULT","status","fetchStatus","isLoading","isSuccess","isError","data","dataUpdatedAt","definition","kind","spec","plugin","query","datasource","name","error","errorUpdatedAt","failureCount","errorUpdateCount","isFetched","isFetchedAfterMount","isFetching","isRefetching","isLoadingError","isPaused","isPlaceholderData","isPreviousData","isRefetchError","isStale","MOCK_TRACE_SEARCH_RESULT_QUERY_RESULT_EMPTY"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAIjC;;CAEC,GACD,OAAO,MAAMA,2BAAsC;IACjDC,cAAc;QACZ;YACEC,iBAAiB;YACjBC,YAAY;YACZC,cAAc;gBACZ,gBAAgB;oBACdC,WAAW;gBACb;gBACA,uBAAuB;oBACrBA,WAAW;oBACXC,YAAY;gBACd;YACF;YACAC,SAAS;YACTC,iBAAiB;YACjBC,eAAe;QACjB;KACD;IACDC,UAAU;QACRC,qBAAqB;IACvB;AACF,EAAE;AAEF,OAAO,MAAMC,iCAA4C;IACvDX,cAAc,EAAE;IAChBS,UAAU;QACRC,qBAAqB;IACvB;AACF,EAAE;AAEF;;;;CAIC,GACD,OAAO,MAAME,wCAAwC;IACnD;QACEC,QAAQ;QACRC,aAAa;QACbC,WAAW;QACXC,WAAW;QACXC,SAAS;QACTC,MAAMnB;QACNoB,eAAe;QACfC,YAAY;YACVC,MAAM;YACNC,MAAM;gBACJC,QAAQ;oBACNF,MAAM;oBACNC,MAAM;wBACJE,OAAO;wBACPC,YAAY;4BACVJ,MAAM;4BACNK,MAAM;wBACR;oBACF;gBACF;YACF;QACF;QACAC,OAAO;QACPC,gBAAgB;QAChBC,cAAc;QACdC,kBAAkB;QAClBC,WAAW;QACXC,qBAAqB;QACrBC,YAAY;QACZC,cAAc;QACdC,gBAAgB;QAChBC,UAAU;QACVC,mBAAmB;QACnBC,gBAAgB;QAChBC,gBAAgB;QAChBC,SAAS;IACX;CACD,CAAC;AAEF,OAAO,MAAMC,8CAA8C;IACzD;QACE5B,QAAQ;QACRC,aAAa;QACbC,WAAW;QACXC,WAAW;QACXC,SAAS;QACTC,MAAMP;QACNQ,eAAe;QACfC,YAAY;YACVC,MAAM;YACNC,MAAM;gBACJC,QAAQ;oBACNF,MAAM;oBACNC,MAAM;wBACJE,OAAO;wBACPC,YAAY;4BACVJ,MAAM;4BACNK,MAAM;wBACR;oBACF;gBACF;YACF;QACF;QACAC,OAAO;QACPC,gBAAgB;QAChBC,cAAc;QACdC,kBAAkB;QAClBC,WAAW;QACXC,qBAAqB;QACrBC,YAAY;QACZC,cAAc;QACdC,gBAAgB;QAChBC,UAAU;QACVC,mBAAmB;QACnBC,gBAAgB;QAChBC,gBAAgB;QAChBC,SAAS;IACX;CACD,CAAC"}

package/lib/scatter-chart-model.d.ts

@@ -1,4 +1,4 @@
-import { QueryDefinition, UnknownSpec } from '@perses-dev/spec';
+import type { QueryDefinition, UnknownSpec } from '@perses-dev/spec';
 export type TraceQueryDefinition<PluginSpec = UnknownSpec> = QueryDefinition<'TraceQuery', PluginSpec>;
 /**
  * The Options object type supported by the ScatterChart panel plugin.

package/lib/scatter-chart-model.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"scatter-chart-model.d.ts","sourceRoot":"","sources":["../../src/scatter-chart-model.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAEhE,MAAM,MAAM,oBAAoB,CAAC,UAAU,GAAG,WAAW,IAAI,eAAe,CAAC,YAAY,EAAE,UAAU,CAAC,CAAC;AAEvG;;GAEG;AAKH,MAAM,WAAW,mBAAmB;IAClC,oCAAoC;IACpC,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAE7B;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,wBAAgB,gCAAgC,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAE1E"}
+{"version":3,"file":"scatter-chart-model.d.ts","sourceRoot":"","sources":["../../src/scatter-chart-model.ts"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAErE,MAAM,MAAM,oBAAoB,CAAC,UAAU,GAAG,WAAW,IAAI,eAAe,CAAC,YAAY,EAAE,UAAU,CAAC,CAAC;AAEvG;;GAEG;AAKH,MAAM,WAAW,mBAAmB;IAClC,oCAAoC;IACpC,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAE7B;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,wBAAgB,gCAAgC,IAAI,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAE1E"}

package/lib/scatter-chart-model.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/scatter-chart-model.ts"],"sourcesContent":["// Copyright 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 { QueryDefinition, UnknownSpec } from '@perses-dev/spec';\n\nexport type TraceQueryDefinition<PluginSpec = UnknownSpec> = QueryDefinition<'TraceQuery', PluginSpec>;\n\n/**\n * The Options object type supported by the ScatterChart panel plugin.\n */\n// TODO: Add support for scatter chart formatting options.\n// Some scaffolding has been done to support formatting options.\n// This includes the interface below which still needs implementation.\n// Note: The interface attributes must match schemas/scatter.cue\nexport interface ScatterChartOptions {\n  /** range of the circles diameter */\n  sizeRange?: [number, number];\n\n  /**\n   * Where to navigate after clicking on a bubble.\n   * Supported variables: datasourceName, traceId\n   */\n  link?: string;\n}\n\n/**\n * Creates the initial/empty options for a ScatterChart panel.\n */\nexport function createInitialScatterChartOptions(): Record<string, unknown> {\n  return {};\n}\n"],"names":["createInitialScatterChartOptions"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAwBjC;;CAEC,GACD,OAAO,SAASA;IACd,OAAO,CAAC;AACV"}
+{"version":3,"sources":["../../src/scatter-chart-model.ts"],"sourcesContent":["// Copyright 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 type { QueryDefinition, UnknownSpec } from '@perses-dev/spec';\n\nexport type TraceQueryDefinition<PluginSpec = UnknownSpec> = QueryDefinition<'TraceQuery', PluginSpec>;\n\n/**\n * The Options object type supported by the ScatterChart panel plugin.\n */\n// TODO: Add support for scatter chart formatting options.\n// Some scaffolding has been done to support formatting options.\n// This includes the interface below which still needs implementation.\n// Note: The interface attributes must match schemas/scatter.cue\nexport interface ScatterChartOptions {\n  /** range of the circles diameter */\n  sizeRange?: [number, number];\n\n  /**\n   * Where to navigate after clicking on a bubble.\n   * Supported variables: datasourceName, traceId\n   */\n  link?: string;\n}\n\n/**\n * Creates the initial/empty options for a ScatterChart panel.\n */\nexport function createInitialScatterChartOptions(): Record<string, unknown> {\n  return {};\n}\n"],"names":["createInitialScatterChartOptions"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAwBjC;;CAEC,GACD,OAAO,SAASA;IACd,OAAO,CAAC;AACV"}

package/lib/setup-tests.d.ts

@@ -1,2 +1,2 @@
-import '@testing-library/jest-dom';
+import '@testing-library/jest-dom/vitest';
 //# sourceMappingURL=setup-tests.d.ts.map

package/lib/setup-tests.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"setup-tests.d.ts","sourceRoot":"","sources":["../../src/setup-tests.ts"],"names":[],"mappings":"AAaA,OAAO,2BAA2B,CAAC"}
+{"version":3,"file":"setup-tests.d.ts","sourceRoot":"","sources":["../../src/setup-tests.ts"],"names":[],"mappings":"AAaA,OAAO,kCAAkC,CAAC"}

package/lib/setup-tests.js

@@ -10,8 +10,8 @@
 // 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 '@testing-library/jest-dom';
+import "@testing-library/jest-dom/vitest";
 // Always mock e-charts during tests since we don't have a proper canvas in jsdom
-jest.mock('echarts/core');
+vi.mock('echarts/core');
 
 //# sourceMappingURL=setup-tests.js.map

package/lib/setup-tests.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/setup-tests.ts"],"sourcesContent":["// Copyright 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 '@testing-library/jest-dom';\n\n// Always mock e-charts during tests since we don't have a proper canvas in jsdom\njest.mock('echarts/core');\n"],"names":["jest","mock"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,OAAO,4BAA4B;AAEnC,iFAAiF;AACjFA,KAAKC,IAAI,CAAC"}
+{"version":3,"sources":["../../src/setup-tests.ts"],"sourcesContent":["// Copyright 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 '@testing-library/jest-dom/vitest';\n\n// Always mock e-charts during tests since we don't have a proper canvas in jsdom\nvi.mock('echarts/core');\n"],"names":["vi","mock"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,OAAO,mCAAmC;AAE1C,iFAAiF;AACjFA,GAAGC,IAAI,CAAC"}

package/lib/utils/timezone-formatter.js

@@ -10,7 +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 { formatWithTimeZone } from '@perses-dev/components';
+import { formatWithTimeZone } from "@perses-dev/components";
 const DAY_MS = 86400000;
 const YEAR_MS = 31536000000;
 /**