@perses-dev/components 0.37.2 → 0.39.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -0
- package/dist/BarChart/BarChart.d.ts +16 -0
- package/dist/BarChart/BarChart.d.ts.map +1 -0
- package/dist/BarChart/BarChart.js +129 -0
- package/dist/BarChart/BarChart.js.map +1 -0
- package/dist/BarChart/index.d.ts +2 -0
- package/dist/BarChart/index.d.ts.map +1 -0
- package/dist/BarChart/index.js +15 -0
- package/dist/BarChart/index.js.map +1 -0
- package/dist/Dialog/DiscardChangesConfirmationDialog.d.ts +10 -0
- package/dist/Dialog/DiscardChangesConfirmationDialog.d.ts.map +1 -0
- package/dist/Dialog/DiscardChangesConfirmationDialog.js +47 -0
- package/dist/Dialog/DiscardChangesConfirmationDialog.js.map +1 -0
- package/dist/Dialog/index.d.ts +1 -0
- package/dist/Dialog/index.d.ts.map +1 -1
- package/dist/Dialog/index.js +1 -0
- package/dist/Dialog/index.js.map +1 -1
- package/dist/GaugeChart/GaugeChart.js +1 -1
- package/dist/GaugeChart/GaugeChart.js.map +1 -1
- package/dist/Legend/ListLegendItem.d.ts +1 -1
- package/dist/LineChart/LineChart.d.ts.map +1 -1
- package/dist/LineChart/LineChart.js +9 -9
- package/dist/LineChart/LineChart.js.map +1 -1
- package/dist/ModeSelector/ModeSelector.d.ts +9 -0
- package/dist/ModeSelector/ModeSelector.d.ts.map +1 -0
- package/dist/ModeSelector/ModeSelector.js +43 -0
- package/dist/ModeSelector/ModeSelector.js.map +1 -0
- package/dist/ModeSelector/index.d.ts +2 -0
- package/dist/ModeSelector/index.d.ts.map +1 -0
- package/dist/ModeSelector/index.js +15 -0
- package/dist/ModeSelector/index.js.map +1 -0
- package/dist/SortSelector/SortSelector.d.ts +8 -0
- package/dist/SortSelector/SortSelector.d.ts.map +1 -0
- package/dist/SortSelector/SortSelector.js +42 -0
- package/dist/SortSelector/SortSelector.js.map +1 -0
- package/dist/SortSelector/index.d.ts +2 -0
- package/dist/SortSelector/index.d.ts.map +1 -0
- package/dist/SortSelector/index.js +15 -0
- package/dist/SortSelector/index.js.map +1 -0
- package/dist/StatChart/StatChart.js +1 -1
- package/dist/StatChart/StatChart.js.map +1 -1
- package/dist/StatChart/calculateFontSize.js +3 -3
- package/dist/StatChart/calculateFontSize.js.map +1 -1
- package/dist/ThresholdsEditor/ThresholdColorPicker.js +1 -1
- package/dist/ThresholdsEditor/ThresholdColorPicker.js.map +1 -1
- package/dist/ThresholdsEditor/ThresholdsEditor.d.ts.map +1 -1
- package/dist/ThresholdsEditor/ThresholdsEditor.js +3 -2
- package/dist/ThresholdsEditor/ThresholdsEditor.js.map +1 -1
- package/dist/TimeChart/TimeChart.d.ts +2 -1
- package/dist/TimeChart/TimeChart.d.ts.map +1 -1
- package/dist/TimeChart/TimeChart.js +120 -36
- package/dist/TimeChart/TimeChart.js.map +1 -1
- package/dist/TimeSeriesTooltip/LineChartTooltip.d.ts +6 -0
- package/dist/TimeSeriesTooltip/LineChartTooltip.d.ts.map +1 -1
- package/dist/TimeSeriesTooltip/LineChartTooltip.js +14 -6
- package/dist/TimeSeriesTooltip/LineChartTooltip.js.map +1 -1
- package/dist/TimeSeriesTooltip/TimeChartTooltip.d.ts +1 -0
- package/dist/TimeSeriesTooltip/TimeChartTooltip.d.ts.map +1 -1
- package/dist/TimeSeriesTooltip/TimeChartTooltip.js +3 -2
- package/dist/TimeSeriesTooltip/TimeChartTooltip.js.map +1 -1
- package/dist/TimeSeriesTooltip/TooltipHeader.d.ts +1 -0
- package/dist/TimeSeriesTooltip/TooltipHeader.d.ts.map +1 -1
- package/dist/TimeSeriesTooltip/TooltipHeader.js +5 -5
- package/dist/TimeSeriesTooltip/TooltipHeader.js.map +1 -1
- package/dist/TimeSeriesTooltip/nearby-series.d.ts +1 -1
- package/dist/TimeSeriesTooltip/nearby-series.d.ts.map +1 -1
- package/dist/TimeSeriesTooltip/nearby-series.js +97 -110
- package/dist/TimeSeriesTooltip/nearby-series.js.map +1 -1
- package/dist/TimeSeriesTooltip/tooltip-model.d.ts +4 -0
- package/dist/TimeSeriesTooltip/tooltip-model.d.ts.map +1 -1
- package/dist/TimeSeriesTooltip/tooltip-model.js +6 -0
- package/dist/TimeSeriesTooltip/tooltip-model.js.map +1 -1
- package/dist/UnitSelector/UnitSelector.d.ts +2 -1
- package/dist/UnitSelector/UnitSelector.d.ts.map +1 -1
- package/dist/UnitSelector/UnitSelector.js +3 -2
- package/dist/UnitSelector/UnitSelector.js.map +1 -1
- package/dist/cjs/BarChart/BarChart.js +135 -0
- package/dist/cjs/BarChart/index.js +28 -0
- package/dist/cjs/Dialog/DiscardChangesConfirmationDialog.js +53 -0
- package/dist/cjs/Dialog/index.js +1 -0
- package/dist/cjs/GaugeChart/GaugeChart.js +2 -2
- package/dist/cjs/LineChart/LineChart.js +8 -8
- package/dist/cjs/ModeSelector/ModeSelector.js +49 -0
- package/dist/cjs/ModeSelector/index.js +28 -0
- package/dist/cjs/SortSelector/SortSelector.js +48 -0
- package/dist/cjs/SortSelector/index.js +28 -0
- package/dist/cjs/StatChart/StatChart.js +2 -2
- package/dist/cjs/StatChart/calculateFontSize.js +3 -3
- package/dist/cjs/ThresholdsEditor/ThresholdColorPicker.js +2 -2
- package/dist/cjs/ThresholdsEditor/ThresholdsEditor.js +3 -2
- package/dist/cjs/TimeChart/TimeChart.js +121 -32
- package/dist/cjs/TimeSeriesTooltip/LineChartTooltip.js +13 -5
- package/dist/cjs/TimeSeriesTooltip/TimeChartTooltip.js +3 -2
- package/dist/cjs/TimeSeriesTooltip/TooltipHeader.js +4 -4
- package/dist/cjs/TimeSeriesTooltip/nearby-series.js +97 -110
- package/dist/cjs/TimeSeriesTooltip/tooltip-model.js +10 -1
- package/dist/cjs/UnitSelector/UnitSelector.js +3 -2
- package/dist/cjs/context/{ChartsThemeProvider.js → ChartsProvider.js} +24 -5
- package/dist/cjs/context/index.js +30 -0
- package/dist/cjs/index.js +4 -3
- package/dist/cjs/model/graph.js +35 -3
- package/dist/cjs/test-utils/theme.js +32 -19
- package/dist/cjs/utils/axis.js +4 -4
- package/dist/cjs/utils/chart-actions.js +99 -1
- package/dist/cjs/utils/theme-gen.js +34 -6
- package/dist/context/ChartsProvider.d.ts +19 -0
- package/dist/context/ChartsProvider.d.ts.map +1 -0
- package/dist/context/{ChartsThemeProvider.js → ChartsProvider.js} +24 -6
- package/dist/context/ChartsProvider.js.map +1 -0
- package/dist/context/index.d.ts +4 -0
- package/dist/context/index.d.ts.map +1 -0
- package/dist/context/index.js +17 -0
- package/dist/context/index.js.map +1 -0
- package/dist/index.d.ts +4 -3
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +4 -3
- package/dist/index.js.map +1 -1
- package/dist/model/graph.d.ts +11 -2
- package/dist/model/graph.d.ts.map +1 -1
- package/dist/model/graph.js +25 -0
- package/dist/model/graph.js.map +1 -1
- package/dist/test-utils/theme.d.ts +2 -0
- package/dist/test-utils/theme.d.ts.map +1 -1
- package/dist/test-utils/theme.js +23 -16
- package/dist/test-utils/theme.js.map +1 -1
- package/dist/utils/axis.d.ts +3 -3
- package/dist/utils/axis.d.ts.map +1 -1
- package/dist/utils/axis.js +4 -4
- package/dist/utils/axis.js.map +1 -1
- package/dist/utils/chart-actions.d.ts +7 -0
- package/dist/utils/chart-actions.d.ts.map +1 -1
- package/dist/utils/chart-actions.js +108 -0
- package/dist/utils/chart-actions.js.map +1 -1
- package/dist/utils/theme-gen.d.ts.map +1 -1
- package/dist/utils/theme-gen.js +34 -6
- package/dist/utils/theme-gen.js.map +1 -1
- package/package.json +3 -3
- package/dist/context/ChartsThemeProvider.d.ts +0 -10
- package/dist/context/ChartsThemeProvider.d.ts.map +0 -1
- package/dist/context/ChartsThemeProvider.js.map +0 -1
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import { ECharts as EChartsInstance } from 'echarts/core';
|
|
2
|
+
import { TimeSeries, TimeSeriesValueTuple } from '@perses-dev/core';
|
|
3
|
+
import { DatapointInfo, TimeChartSeriesMapping } from '../model';
|
|
2
4
|
export interface ZoomEventData {
|
|
3
5
|
start: number;
|
|
4
6
|
end: number;
|
|
@@ -15,4 +17,9 @@ export declare function enableDataZoom(chart: EChartsInstance): void;
|
|
|
15
17
|
*/
|
|
16
18
|
export declare function restoreChart(chart: EChartsInstance): void;
|
|
17
19
|
export declare function clearHighlightedSeries(chart: EChartsInstance, totalSeries: number): void;
|
|
20
|
+
export declare function getPointInGrid(cursorCoordX: number, cursorCoordY: number, chart?: EChartsInstance): number[] | null;
|
|
21
|
+
export declare function batchDispatchNearbySeriesActions(chart: EChartsInstance, nearbySeriesIndexes: number[], emphasizedSeriesIndexes: number[], nonEmphasizedSeriesIndexes: number[], emphasizedDatapoints: DatapointInfo[], duplicateDatapoints: DatapointInfo[]): void;
|
|
22
|
+
export declare function checkCrosshairPinnedStatus(seriesMapping: TimeChartSeriesMapping): boolean;
|
|
23
|
+
export declare function getClosestTimestamp(timeSeriesValues?: TimeSeriesValueTuple[], cursorX?: number): number | null;
|
|
24
|
+
export declare function getClosestTimestampInFullDataset(data: TimeSeries[], cursorX?: number): number | null;
|
|
18
25
|
//# sourceMappingURL=chart-actions.d.ts.map
|
|
@@ -1 +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;
|
|
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,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"}
|
|
@@ -10,6 +10,7 @@
|
|
|
10
10
|
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
11
11
|
// See the License for the specific language governing permissions and
|
|
12
12
|
// limitations under the License.
|
|
13
|
+
import { PINNED_CROSSHAIR_SERIES_NAME } from '../model';
|
|
13
14
|
/**
|
|
14
15
|
* Enable dataZoom without requring user to click toolbox icon.
|
|
15
16
|
* https://stackoverflow.com/questions/57183297/is-there-a-way-to-use-zoom-of-type-select-without-showing-the-toolbar
|
|
@@ -48,5 +49,112 @@
|
|
|
48
49
|
}
|
|
49
50
|
}
|
|
50
51
|
}
|
|
52
|
+
/*
|
|
53
|
+
* Convert a point from pixel coordinate to logical coordinate.
|
|
54
|
+
* Used to determine if cursor is over chart canvas and closest datapoint.
|
|
55
|
+
* https://echarts.apache.org/en/api.html#echartsInstance.convertFromPixel
|
|
56
|
+
*/ export function getPointInGrid(cursorCoordX, cursorCoordY, chart) {
|
|
57
|
+
if (chart === undefined) {
|
|
58
|
+
return null;
|
|
59
|
+
}
|
|
60
|
+
const pointInPixel = [
|
|
61
|
+
cursorCoordX,
|
|
62
|
+
cursorCoordY
|
|
63
|
+
];
|
|
64
|
+
if (!chart.containPixel('grid', pointInPixel)) {
|
|
65
|
+
return null;
|
|
66
|
+
}
|
|
67
|
+
const pointInGrid = chart.convertFromPixel('grid', pointInPixel);
|
|
68
|
+
return pointInGrid;
|
|
69
|
+
}
|
|
70
|
+
/*
|
|
71
|
+
* TimeSeriesChart tooltip is built custom to support finding nearby series instead of single or all series.
|
|
72
|
+
* This means ECharts actions need to be dispatched manually for series highlighting, datapoint select state, etc.
|
|
73
|
+
* More info: https://echarts.apache.org/en/api.html#action
|
|
74
|
+
*/ export function batchDispatchNearbySeriesActions(chart, nearbySeriesIndexes, emphasizedSeriesIndexes, nonEmphasizedSeriesIndexes, emphasizedDatapoints, duplicateDatapoints) {
|
|
75
|
+
// Accounts for multiple series that are rendered direct on top of eachother.
|
|
76
|
+
// Only applies select state to the datapoint that is visible to avoid color mismatch.
|
|
77
|
+
const lastEmphasizedDatapoint = duplicateDatapoints.length > 0 ? duplicateDatapoints[duplicateDatapoints.length - 1] : emphasizedDatapoints[emphasizedDatapoints.length - 1];
|
|
78
|
+
if (lastEmphasizedDatapoint !== undefined) {
|
|
79
|
+
// Corresponds to select options inside getTimeSeries util.
|
|
80
|
+
// https://echarts.apache.org/en/option.html#series-line.select.itemStyle
|
|
81
|
+
chart.dispatchAction({
|
|
82
|
+
type: 'select',
|
|
83
|
+
seriesIndex: lastEmphasizedDatapoint.seriesIndex,
|
|
84
|
+
dataIndex: lastEmphasizedDatapoint.dataIndex,
|
|
85
|
+
// Shared crosshair should not emphasize datapoints on adjacent charts.
|
|
86
|
+
escapeConnect: true
|
|
87
|
+
});
|
|
88
|
+
}
|
|
89
|
+
// Clears emphasis state of all lines that are not emphasized.
|
|
90
|
+
// Emphasized is a subset of just the nearby series that are closest to cursor.
|
|
91
|
+
chart.dispatchAction({
|
|
92
|
+
type: 'downplay',
|
|
93
|
+
seriesIndex: nonEmphasizedSeriesIndexes
|
|
94
|
+
});
|
|
95
|
+
// https://echarts.apache.org/en/api.html#action.highlight
|
|
96
|
+
if (emphasizedSeriesIndexes.length > 0) {
|
|
97
|
+
// Fadeout opacity of all series not closest to cursor.
|
|
98
|
+
chart.dispatchAction({
|
|
99
|
+
type: 'highlight',
|
|
100
|
+
seriesIndex: emphasizedSeriesIndexes,
|
|
101
|
+
notBlur: false,
|
|
102
|
+
escapeConnect: true
|
|
103
|
+
});
|
|
104
|
+
} else {
|
|
105
|
+
// When no emphasized series with bold text, notBlur allows opacity fadeout to not trigger.
|
|
106
|
+
chart.dispatchAction({
|
|
107
|
+
type: 'highlight',
|
|
108
|
+
seriesIndex: nearbySeriesIndexes,
|
|
109
|
+
notBlur: true,
|
|
110
|
+
escapeConnect: true
|
|
111
|
+
});
|
|
112
|
+
// Clears selected datapoints since no bold series in tooltip, restore does not impact highlighting
|
|
113
|
+
chart.dispatchAction({
|
|
114
|
+
type: 'toggleSelect'
|
|
115
|
+
});
|
|
116
|
+
}
|
|
117
|
+
}
|
|
118
|
+
/*
|
|
119
|
+
* Determine whether a markLine was pushed into the final series, which means crosshair was already pinned onClick
|
|
120
|
+
*/ export function checkCrosshairPinnedStatus(seriesMapping) {
|
|
121
|
+
var ref;
|
|
122
|
+
const isCrosshairPinned = ((ref = seriesMapping[seriesMapping.length - 1]) === null || ref === void 0 ? void 0 : ref.name) === PINNED_CROSSHAIR_SERIES_NAME;
|
|
123
|
+
return isCrosshairPinned;
|
|
124
|
+
}
|
|
125
|
+
/*
|
|
126
|
+
* Find closest timestamp to logical x coordinate returned from echartsInstance.convertFromPixel
|
|
127
|
+
* Used to find nearby series in time series tooltip.
|
|
128
|
+
*/ export function getClosestTimestamp(timeSeriesValues, cursorX) {
|
|
129
|
+
if (timeSeriesValues === undefined || cursorX === undefined) {
|
|
130
|
+
return null;
|
|
131
|
+
}
|
|
132
|
+
let currentClosestTimestamp = null;
|
|
133
|
+
let currentClosestDistance = Infinity;
|
|
134
|
+
for (const [timestamp] of timeSeriesValues){
|
|
135
|
+
const distance = Math.abs(timestamp - cursorX);
|
|
136
|
+
if (distance < currentClosestDistance) {
|
|
137
|
+
currentClosestTimestamp = timestamp;
|
|
138
|
+
currentClosestDistance = distance;
|
|
139
|
+
}
|
|
140
|
+
}
|
|
141
|
+
return currentClosestTimestamp;
|
|
142
|
+
}
|
|
143
|
+
/*
|
|
144
|
+
* Find closest timestamp in full dataset, used to snap crosshair into place onClick when tooltip is pinned.
|
|
145
|
+
*/ export function getClosestTimestampInFullDataset(data, cursorX) {
|
|
146
|
+
if (cursorX === undefined) {
|
|
147
|
+
return null;
|
|
148
|
+
}
|
|
149
|
+
const totalSeries = data.length;
|
|
150
|
+
let closestTimestamp = null;
|
|
151
|
+
for(let seriesIdx = 0; seriesIdx < totalSeries; seriesIdx++){
|
|
152
|
+
const currentDataset = totalSeries > 0 ? data[seriesIdx] : null;
|
|
153
|
+
if (currentDataset == null) break;
|
|
154
|
+
const currentValues = currentDataset.values;
|
|
155
|
+
closestTimestamp = getClosestTimestamp(currentValues, cursorX);
|
|
156
|
+
}
|
|
157
|
+
return closestTimestamp;
|
|
158
|
+
}
|
|
51
159
|
|
|
52
160
|
//# sourceMappingURL=chart-actions.js.map
|
|
@@ -1 +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';\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"],"names":["enableDataZoom","chart","chartModel","undefined","option","toolbox","length","feature","dataZoom","iconStatus","zoom","dispatchAction","type","key","dataZoomSelectActive","restoreChart","clearHighlightedSeries","totalSeries","i","seriesIndex"],"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;AAYjC;;;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"}
|
|
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 { 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":"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,SAAwBA,4BAA4B,QAAgC,UAAU,CAAC;AAU/F;;;CAGC,GACD,OAAO,SAASC,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;AAED;;CAEC,GACD,OAAO,SAASyB,0BAA0B,CAACC,aAAqC,EAAE;QACtDA,GAAuC;IAAjE,MAAMC,iBAAiB,GAAGD,CAAAA,CAAAA,GAAuC,GAAvCA,aAAa,CAACA,aAAa,CAAChC,MAAM,GAAG,CAAC,CAAC,cAAvCgC,GAAuC,WAAM,GAA7CA,KAAAA,CAA6C,GAA7CA,GAAuC,CAAEE,IAAI,CAAA,KAAKzC,4BAA4B,AAAC;IACzG,OAAOwC,iBAAiB,CAAC;AAC3B,CAAC;AAED;;;CAGC,GACD,OAAO,SAASE,mBAAmB,CAACC,gBAAyC,EAAEC,OAAgB,EAAiB;IAC9G,IAAID,gBAAgB,KAAKvC,SAAS,IAAIwC,OAAO,KAAKxC,SAAS,EAAE;QAC3D,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAIyC,uBAAuB,GAAkB,IAAI,AAAC;IAClD,IAAIC,sBAAsB,GAAGC,QAAQ,AAAC;IAEtC,KAAK,MAAM,CAACC,SAAS,CAAC,IAAIL,gBAAgB,CAAE;QAC1C,MAAMM,QAAQ,GAAGC,IAAI,CAACC,GAAG,CAACH,SAAS,GAAGJ,OAAO,CAAC,AAAC;QAC/C,IAAIK,QAAQ,GAAGH,sBAAsB,EAAE;YACrCD,uBAAuB,GAAGG,SAAS,CAAC;YACpCF,sBAAsB,GAAGG,QAAQ,CAAC;QACpC,CAAC;IACH,CAAC;IACD,OAAOJ,uBAAuB,CAAC;AACjC,CAAC;AAED;;CAEC,GACD,OAAO,SAASO,gCAAgC,CAACC,IAAkB,EAAET,OAAgB,EAAiB;IACpG,IAAIA,OAAO,KAAKxC,SAAS,EAAE;QACzB,OAAO,IAAI,CAAC;IACd,CAAC;IACD,MAAMc,WAAW,GAAGmC,IAAI,CAAC9C,MAAM,AAAC;IAChC,IAAI+C,gBAAgB,GAAG,IAAI,AAAC;IAC5B,IAAK,IAAIC,SAAS,GAAG,CAAC,EAAEA,SAAS,GAAGrC,WAAW,EAAEqC,SAAS,EAAE,CAAE;QAC5D,MAAMC,cAAc,GAAGtC,WAAW,GAAG,CAAC,GAAGmC,IAAI,CAACE,SAAS,CAAC,GAAG,IAAI,AAAC;QAChE,IAAIC,cAAc,IAAI,IAAI,EAAE,MAAM;QAClC,MAAMC,aAAa,GAA2BD,cAAc,CAACE,MAAM,AAAC;QACpEJ,gBAAgB,GAAGZ,mBAAmB,CAACe,aAAa,EAAEb,OAAO,CAAC,CAAC;IACjE,CAAC;IACD,OAAOU,gBAAgB,CAAC;AAC1B,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme-gen.d.ts","sourceRoot":"","sources":["../../src/utils/theme-gen.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEtC,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAK3D,aAAK,QAAQ,GAAG,IAAI,CAAC,KAAK,EAAE,YAAY,CAAC,CAAC;AAE1C,wBAAgB,mBAAmB,CACjC,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY;AAC1B;;;GAGG;AACH,wBAAwB,CAAC,EAAE,MAAM,GAChC,iBAAiB,
|
|
1
|
+
{"version":3,"file":"theme-gen.d.ts","sourceRoot":"","sources":["../../src/utils/theme-gen.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAEtC,OAAO,EAAE,YAAY,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAK3D,aAAK,QAAQ,GAAG,IAAI,CAAC,KAAK,EAAE,YAAY,CAAC,CAAC;AAE1C,wBAAgB,mBAAmB,CACjC,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY;AAC1B;;;GAGG;AACH,wBAAwB,CAAC,EAAE,MAAM,GAChC,iBAAiB,CA+OnB"}
|
package/dist/utils/theme-gen.js
CHANGED
|
@@ -16,9 +16,9 @@ export function generateChartsTheme(muiTheme, echartsTheme, /**
|
|
|
16
16
|
* The id of the container that will have the chart tooltip appended to it.
|
|
17
17
|
* By default, chart tooltip uses the body of the top-level document object.
|
|
18
18
|
*/ tooltipPortalContainerId) {
|
|
19
|
-
var ref, ref1, ref2, ref3, ref4;
|
|
20
|
-
var
|
|
21
|
-
const primaryTextColor = (
|
|
19
|
+
var ref, ref1, ref2, ref3, ref4, ref5, ref6;
|
|
20
|
+
var ref7;
|
|
21
|
+
const primaryTextColor = (ref7 = (ref = muiTheme.palette.text) === null || ref === void 0 ? void 0 : ref.primary) !== null && ref7 !== void 0 ? ref7 : DEFAULT_TEXT_COLOR;
|
|
22
22
|
const muiConvertedTheme = {
|
|
23
23
|
title: {
|
|
24
24
|
show: false
|
|
@@ -70,7 +70,7 @@ export function generateChartsTheme(muiTheme, echartsTheme, /**
|
|
|
70
70
|
lineStyle: {
|
|
71
71
|
width: 0.5,
|
|
72
72
|
color: muiTheme.palette.grey[300],
|
|
73
|
-
opacity: 0.
|
|
73
|
+
opacity: 0.4
|
|
74
74
|
}
|
|
75
75
|
},
|
|
76
76
|
splitArea: {
|
|
@@ -107,7 +107,7 @@ export function generateChartsTheme(muiTheme, echartsTheme, /**
|
|
|
107
107
|
lineStyle: {
|
|
108
108
|
width: 0.5,
|
|
109
109
|
color: muiTheme.palette.grey[300],
|
|
110
|
-
opacity: 0.
|
|
110
|
+
opacity: 0.4
|
|
111
111
|
}
|
|
112
112
|
},
|
|
113
113
|
splitArea: {
|
|
@@ -156,7 +156,30 @@ export function generateChartsTheme(muiTheme, echartsTheme, /**
|
|
|
156
156
|
borderColor: primaryTextColor
|
|
157
157
|
}
|
|
158
158
|
},
|
|
159
|
-
tooltip: {
|
|
159
|
+
tooltip: {
|
|
160
|
+
backgroundColor: (ref5 = muiTheme.palette.designSystem) === null || ref5 === void 0 ? void 0 : ref5.grey[800],
|
|
161
|
+
borderColor: (ref6 = muiTheme.palette.designSystem) === null || ref6 === void 0 ? void 0 : ref6.grey[800],
|
|
162
|
+
textStyle: {
|
|
163
|
+
color: '#fff',
|
|
164
|
+
fontSize: 11
|
|
165
|
+
}
|
|
166
|
+
},
|
|
167
|
+
axisPointer: {
|
|
168
|
+
lineStyle: {
|
|
169
|
+
color: muiTheme.palette.grey[500]
|
|
170
|
+
}
|
|
171
|
+
},
|
|
172
|
+
markLine: {
|
|
173
|
+
symbol: 'none',
|
|
174
|
+
symbolSize: 0,
|
|
175
|
+
itemStyle: {
|
|
176
|
+
color: muiTheme.palette.grey[500]
|
|
177
|
+
},
|
|
178
|
+
lineStyle: {
|
|
179
|
+
type: 'dashed',
|
|
180
|
+
width: 1
|
|
181
|
+
}
|
|
182
|
+
},
|
|
160
183
|
line: {
|
|
161
184
|
showSymbol: false,
|
|
162
185
|
symbol: 'circle',
|
|
@@ -175,7 +198,12 @@ export function generateChartsTheme(muiTheme, echartsTheme, /**
|
|
|
175
198
|
barMaxWidth: 150,
|
|
176
199
|
itemStyle: {
|
|
177
200
|
borderWidth: 0,
|
|
201
|
+
borderRadius: 0,
|
|
178
202
|
borderColor: muiTheme.palette.grey[300]
|
|
203
|
+
},
|
|
204
|
+
label: {
|
|
205
|
+
show: false,
|
|
206
|
+
color: primaryTextColor
|
|
179
207
|
}
|
|
180
208
|
},
|
|
181
209
|
gauge: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/utils/theme-gen.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 { Theme } from '@mui/material';\nimport merge from 'lodash/merge';\nimport { EChartsTheme, PersesChartsTheme } from '../model';\n\nconst DEFAULT_TEXT_COLOR = '#222';\n\n// avoid component override type errors since only palette and typography are used\ntype MuiTheme = Omit<Theme, 'components'>;\n\nexport function generateChartsTheme(\n muiTheme: MuiTheme,\n echartsTheme: EChartsTheme,\n /**\n * The id of the container that will have the chart tooltip appended to it.\n * By default, chart tooltip uses the body of the top-level document object.\n */\n tooltipPortalContainerId?: string\n): PersesChartsTheme {\n const primaryTextColor = muiTheme.palette.text?.primary ?? DEFAULT_TEXT_COLOR;\n\n const muiConvertedTheme: EChartsTheme = {\n title: {\n show: false,\n },\n textStyle: {\n color: primaryTextColor,\n fontFamily: muiTheme.typography.fontFamily,\n fontSize: 12,\n },\n grid: {\n top: 5,\n right: 20,\n bottom: 0,\n left: 20,\n containLabel: true,\n },\n // Accessible categorical palette from: https://davidmathlogic.com/colorblind\n color: [\n '#56B4E9', // lt blue\n '#009E73', // med green\n '#0072B2', // dk blue\n '#CC79A7', // lt purple\n '#F0E442', // yellow\n '#E69F00', // orange\n '#D55E00', // red\n ],\n categoryAxis: {\n show: true,\n axisLabel: {\n show: true,\n color: primaryTextColor,\n margin: 15,\n },\n axisTick: {\n show: false,\n length: 6,\n lineStyle: {\n color: muiTheme.palette.grey[600],\n },\n },\n axisLine: {\n show: true,\n lineStyle: {\n color: muiTheme.palette.grey[600],\n },\n },\n splitLine: {\n show: true,\n lineStyle: {\n width: 0.5,\n color: muiTheme.palette.grey[300],\n opacity: 0.6,\n },\n },\n splitArea: {\n show: false,\n areaStyle: {\n color: [muiTheme.palette.grey[300]],\n },\n },\n },\n timeAxis: {\n show: true,\n axisLabel: {\n show: true,\n color: primaryTextColor,\n margin: 15,\n },\n axisTick: {\n show: false,\n length: 6,\n lineStyle: {\n color: muiTheme.palette.grey[600],\n },\n },\n axisLine: {\n show: true,\n lineStyle: {\n color: muiTheme.palette.grey[600],\n },\n },\n splitLine: {\n show: true,\n lineStyle: {\n width: 0.5,\n color: muiTheme.palette.grey[300],\n opacity: 0.6,\n },\n },\n splitArea: {\n show: false,\n areaStyle: {\n color: [muiTheme.palette.grey[300]],\n },\n },\n },\n valueAxis: {\n show: true,\n axisLabel: {\n color: primaryTextColor,\n margin: 12,\n },\n axisLine: {\n show: false,\n },\n splitLine: {\n show: true,\n lineStyle: {\n width: 0.5,\n color: muiTheme.palette.grey[300],\n opacity: 0.6,\n },\n },\n },\n legend: {\n orient: 'horizontal',\n textStyle: {\n color: primaryTextColor,\n },\n pageTextStyle: {\n color: muiTheme.palette.grey[600],\n },\n pageIconColor: muiTheme?.palette?.action?.active,\n pageIconInactiveColor: muiTheme?.palette?.action?.disabled,\n },\n toolbox: {\n show: true,\n top: 10,\n right: 10,\n iconStyle: {\n borderColor: primaryTextColor,\n },\n },\n tooltip: {},\n line: {\n showSymbol: false,\n symbol: 'circle',\n symbolSize: 4,\n smooth: false,\n lineStyle: {\n width: 1,\n },\n emphasis: {\n lineStyle: {\n width: 1.5,\n },\n },\n },\n bar: {\n barMaxWidth: 150,\n itemStyle: {\n borderWidth: 0,\n borderColor: muiTheme.palette.grey[300],\n },\n },\n gauge: {\n detail: {\n fontSize: 18,\n fontWeight: 600,\n valueAnimation: false,\n },\n splitLine: {\n distance: 0,\n length: 4,\n lineStyle: {\n width: 1,\n },\n },\n splitNumber: 12,\n },\n };\n\n return {\n tooltipPortalContainerId,\n echartsTheme: merge(muiConvertedTheme, echartsTheme),\n noDataOption: {\n title: {\n show: true,\n textStyle: {\n color: primaryTextColor,\n fontSize: 16,\n fontWeight: 400,\n },\n text: 'No data',\n left: 'center',\n top: 'center',\n },\n xAxis: {\n show: false,\n },\n yAxis: {\n show: false,\n },\n },\n sparkline: {\n width: 2,\n color: '#1976d2',\n },\n container: {\n padding: {\n default: parseInt(muiTheme.spacing(1.5), 10),\n },\n },\n thresholds: {\n defaultColor: muiTheme.palette.success.main,\n palette: ['#FFCC00', muiTheme.palette.warning.main, muiTheme.palette.error.main],\n },\n };\n}\n"],"names":["merge","DEFAULT_TEXT_COLOR","generateChartsTheme","muiTheme","echartsTheme","tooltipPortalContainerId","primaryTextColor","palette","text","primary","muiConvertedTheme","title","show","textStyle","color","fontFamily","typography","fontSize","grid","top","right","bottom","left","containLabel","categoryAxis","axisLabel","margin","axisTick","length","lineStyle","grey","axisLine","splitLine","width","opacity","splitArea","areaStyle","timeAxis","valueAxis","legend","orient","pageTextStyle","pageIconColor","action","active","pageIconInactiveColor","disabled","toolbox","iconStyle","borderColor","tooltip","line","showSymbol","symbol","symbolSize","smooth","emphasis","bar","barMaxWidth","itemStyle","borderWidth","gauge","detail","fontWeight","valueAnimation","distance","splitNumber","noDataOption","xAxis","yAxis","sparkline","container","padding","default","parseInt","spacing","thresholds","defaultColor","success","main","warning","error"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../src/utils/theme-gen.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 { Theme } from '@mui/material';\nimport merge from 'lodash/merge';\nimport { EChartsTheme, PersesChartsTheme } from '../model';\n\nconst DEFAULT_TEXT_COLOR = '#222';\n\n// avoid component override type errors since only palette and typography are used\ntype MuiTheme = Omit<Theme, 'components'>;\n\nexport function generateChartsTheme(\n muiTheme: MuiTheme,\n echartsTheme: EChartsTheme,\n /**\n * The id of the container that will have the chart tooltip appended to it.\n * By default, chart tooltip uses the body of the top-level document object.\n */\n tooltipPortalContainerId?: string\n): PersesChartsTheme {\n const primaryTextColor = muiTheme.palette.text?.primary ?? DEFAULT_TEXT_COLOR;\n\n const muiConvertedTheme: EChartsTheme = {\n title: {\n show: false,\n },\n textStyle: {\n color: primaryTextColor,\n fontFamily: muiTheme.typography.fontFamily,\n fontSize: 12,\n },\n grid: {\n top: 5,\n right: 20,\n bottom: 0,\n left: 20,\n containLabel: true,\n },\n // Accessible categorical palette from: https://davidmathlogic.com/colorblind\n color: [\n '#56B4E9', // lt blue\n '#009E73', // med green\n '#0072B2', // dk blue\n '#CC79A7', // lt purple\n '#F0E442', // yellow\n '#E69F00', // orange\n '#D55E00', // red\n ],\n categoryAxis: {\n show: true,\n axisLabel: {\n show: true,\n color: primaryTextColor,\n margin: 15,\n },\n axisTick: {\n show: false,\n length: 6,\n lineStyle: {\n color: muiTheme.palette.grey[600],\n },\n },\n axisLine: {\n show: true,\n lineStyle: {\n color: muiTheme.palette.grey[600],\n },\n },\n splitLine: {\n show: true,\n lineStyle: {\n width: 0.5,\n color: muiTheme.palette.grey[300],\n opacity: 0.4,\n },\n },\n splitArea: {\n show: false,\n areaStyle: {\n color: [muiTheme.palette.grey[300]],\n },\n },\n },\n timeAxis: {\n show: true,\n axisLabel: {\n show: true,\n color: primaryTextColor,\n margin: 15,\n },\n axisTick: {\n show: false,\n length: 6,\n lineStyle: {\n color: muiTheme.palette.grey[600],\n },\n },\n axisLine: {\n show: true,\n lineStyle: {\n color: muiTheme.palette.grey[600],\n },\n },\n splitLine: {\n show: true,\n lineStyle: {\n width: 0.5,\n color: muiTheme.palette.grey[300],\n opacity: 0.4,\n },\n },\n splitArea: {\n show: false,\n areaStyle: {\n color: [muiTheme.palette.grey[300]],\n },\n },\n },\n valueAxis: {\n show: true,\n axisLabel: {\n color: primaryTextColor,\n margin: 12,\n },\n axisLine: {\n show: false,\n },\n splitLine: {\n show: true,\n lineStyle: {\n width: 0.5,\n color: muiTheme.palette.grey[300],\n opacity: 0.6,\n },\n },\n },\n legend: {\n orient: 'horizontal',\n textStyle: {\n color: primaryTextColor,\n },\n pageTextStyle: {\n color: muiTheme.palette.grey[600],\n },\n pageIconColor: muiTheme?.palette?.action?.active,\n pageIconInactiveColor: muiTheme?.palette?.action?.disabled,\n },\n toolbox: {\n show: true,\n top: 10,\n right: 10,\n iconStyle: {\n borderColor: primaryTextColor,\n },\n },\n tooltip: {\n backgroundColor: muiTheme.palette.designSystem?.grey[800],\n borderColor: muiTheme.palette.designSystem?.grey[800],\n textStyle: {\n color: '#fff',\n fontSize: 11,\n },\n },\n axisPointer: {\n lineStyle: {\n color: muiTheme.palette.grey[500],\n },\n },\n markLine: {\n symbol: 'none',\n symbolSize: 0,\n itemStyle: {\n color: muiTheme.palette.grey[500],\n },\n lineStyle: {\n type: 'dashed',\n width: 1,\n },\n },\n line: {\n showSymbol: false,\n symbol: 'circle',\n symbolSize: 4,\n smooth: false,\n lineStyle: {\n width: 1,\n },\n emphasis: {\n lineStyle: {\n width: 1.5,\n },\n },\n },\n bar: {\n barMaxWidth: 150,\n itemStyle: {\n borderWidth: 0,\n borderRadius: 0,\n borderColor: muiTheme.palette.grey[300],\n },\n label: {\n show: false,\n color: primaryTextColor,\n },\n },\n gauge: {\n detail: {\n fontSize: 18,\n fontWeight: 600,\n valueAnimation: false,\n },\n splitLine: {\n distance: 0,\n length: 4,\n lineStyle: {\n width: 1,\n },\n },\n splitNumber: 12,\n },\n };\n\n return {\n tooltipPortalContainerId,\n echartsTheme: merge(muiConvertedTheme, echartsTheme),\n noDataOption: {\n title: {\n show: true,\n textStyle: {\n color: primaryTextColor,\n fontSize: 16,\n fontWeight: 400,\n },\n text: 'No data',\n left: 'center',\n top: 'center',\n },\n xAxis: {\n show: false,\n },\n yAxis: {\n show: false,\n },\n },\n sparkline: {\n width: 2,\n color: '#1976d2',\n },\n container: {\n padding: {\n default: parseInt(muiTheme.spacing(1.5), 10),\n },\n },\n thresholds: {\n defaultColor: muiTheme.palette.success.main,\n palette: ['#FFCC00', muiTheme.palette.warning.main, muiTheme.palette.error.main],\n },\n };\n}\n"],"names":["merge","DEFAULT_TEXT_COLOR","generateChartsTheme","muiTheme","echartsTheme","tooltipPortalContainerId","primaryTextColor","palette","text","primary","muiConvertedTheme","title","show","textStyle","color","fontFamily","typography","fontSize","grid","top","right","bottom","left","containLabel","categoryAxis","axisLabel","margin","axisTick","length","lineStyle","grey","axisLine","splitLine","width","opacity","splitArea","areaStyle","timeAxis","valueAxis","legend","orient","pageTextStyle","pageIconColor","action","active","pageIconInactiveColor","disabled","toolbox","iconStyle","borderColor","tooltip","backgroundColor","designSystem","axisPointer","markLine","symbol","symbolSize","itemStyle","type","line","showSymbol","smooth","emphasis","bar","barMaxWidth","borderWidth","borderRadius","label","gauge","detail","fontWeight","valueAnimation","distance","splitNumber","noDataOption","xAxis","yAxis","sparkline","container","padding","default","parseInt","spacing","thresholds","defaultColor","success","main","warning","error"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@perses-dev/components",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.39.0",
|
|
4
4
|
"description": "Common UI components used across Perses features",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"homepage": "https://github.com/perses/perses/blob/main/README.md",
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
"@codemirror/lang-json": "^6.0.1",
|
|
37
37
|
"@fontsource/lato": "^4.5.10",
|
|
38
38
|
"@mui/x-date-pickers": "^5.0.0-beta.1",
|
|
39
|
-
"@perses-dev/core": "0.
|
|
39
|
+
"@perses-dev/core": "0.39.0",
|
|
40
40
|
"@tanstack/react-table": "^8.9.1",
|
|
41
41
|
"@uiw/react-codemirror": "^4.19.1",
|
|
42
42
|
"date-fns": "^2.28.0",
|
|
@@ -50,7 +50,7 @@
|
|
|
50
50
|
"react-virtuoso": "^4.3.6"
|
|
51
51
|
},
|
|
52
52
|
"devDependencies": {
|
|
53
|
-
"@perses-dev/storybook": "0.
|
|
53
|
+
"@perses-dev/storybook": "0.39.0"
|
|
54
54
|
},
|
|
55
55
|
"peerDependencies": {
|
|
56
56
|
"@mui/material": "^5.10.0",
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { PersesChartsTheme } from '../model';
|
|
3
|
-
export interface ChartsThemeProviderProps {
|
|
4
|
-
chartsTheme?: PersesChartsTheme;
|
|
5
|
-
children?: React.ReactNode;
|
|
6
|
-
}
|
|
7
|
-
export declare function ChartsThemeProvider(props: ChartsThemeProviderProps): JSX.Element;
|
|
8
|
-
export declare const ChartsThemeContext: React.Context<PersesChartsTheme | undefined>;
|
|
9
|
-
export declare function useChartsTheme(): PersesChartsTheme;
|
|
10
|
-
//# sourceMappingURL=ChartsThemeProvider.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"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"}
|