@perses-dev/components 0.14.0 → 0.16.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.
Files changed (178) hide show
  1. package/dist/{TimeRangeSelector → DateTimeRangePicker}/AbsoluteTimePicker.d.ts +0 -0
  2. package/dist/DateTimeRangePicker/AbsoluteTimePicker.d.ts.map +1 -0
  3. package/dist/{TimeRangeSelector → DateTimeRangePicker}/AbsoluteTimePicker.js +38 -33
  4. package/dist/DateTimeRangePicker/AbsoluteTimePicker.js.map +1 -0
  5. package/dist/DateTimeRangePicker/DateTimeRangePicker.d.ts +11 -0
  6. package/dist/DateTimeRangePicker/DateTimeRangePicker.d.ts.map +1 -0
  7. package/dist/DateTimeRangePicker/DateTimeRangePicker.js +77 -0
  8. package/dist/DateTimeRangePicker/DateTimeRangePicker.js.map +1 -0
  9. package/dist/{TimeRangeSelector → DateTimeRangePicker}/TimeRangeSelector.d.ts +0 -0
  10. package/dist/DateTimeRangePicker/TimeRangeSelector.d.ts.map +1 -0
  11. package/dist/{TimeRangeSelector → DateTimeRangePicker}/TimeRangeSelector.js +0 -0
  12. package/dist/DateTimeRangePicker/TimeRangeSelector.js.map +1 -0
  13. package/dist/{TimeRangeSelector → DateTimeRangePicker}/index.d.ts +1 -0
  14. package/dist/DateTimeRangePicker/index.d.ts.map +1 -0
  15. package/dist/{TimeRangeSelector → DateTimeRangePicker}/index.js +1 -0
  16. package/dist/DateTimeRangePicker/index.js.map +1 -0
  17. package/dist/{TimeRangeSelector → DateTimeRangePicker}/utils.d.ts +0 -0
  18. package/dist/DateTimeRangePicker/utils.d.ts.map +1 -0
  19. package/dist/{TimeRangeSelector → DateTimeRangePicker}/utils.js +0 -0
  20. package/dist/DateTimeRangePicker/utils.js.map +1 -0
  21. package/dist/Legend/CompactLegend.d.ts +6 -1
  22. package/dist/Legend/CompactLegend.d.ts.map +1 -1
  23. package/dist/Legend/CompactLegend.js +16 -7
  24. package/dist/Legend/CompactLegend.js.map +1 -1
  25. package/dist/Legend/Legend.d.ts.map +1 -1
  26. package/dist/Legend/Legend.js +4 -9
  27. package/dist/Legend/Legend.js.map +1 -1
  28. package/dist/Legend/ListLegend.d.ts +3 -0
  29. package/dist/Legend/ListLegend.d.ts.map +1 -1
  30. package/dist/Legend/ListLegend.js +18 -2
  31. package/dist/Legend/ListLegend.js.map +1 -1
  32. package/dist/Legend/ListLegendItem.d.ts +2 -1
  33. package/dist/Legend/ListLegendItem.d.ts.map +1 -1
  34. package/dist/Legend/ListLegendItem.js +11 -9
  35. package/dist/Legend/ListLegendItem.js.map +1 -1
  36. package/dist/LineChart/LineChart.js +2 -1
  37. package/dist/LineChart/LineChart.js.map +1 -1
  38. package/dist/OptionsEditorLayout/OptionsEditorColumn.d.ts +13 -0
  39. package/dist/OptionsEditorLayout/OptionsEditorColumn.d.ts.map +1 -0
  40. package/dist/OptionsEditorLayout/OptionsEditorColumn.js +28 -0
  41. package/dist/OptionsEditorLayout/OptionsEditorColumn.js.map +1 -0
  42. package/dist/OptionsEditorLayout/OptionsEditorControl.d.ts +5 -0
  43. package/dist/OptionsEditorLayout/OptionsEditorControl.d.ts.map +1 -0
  44. package/dist/OptionsEditorLayout/OptionsEditorControl.js +50 -0
  45. package/dist/OptionsEditorLayout/OptionsEditorControl.js.map +1 -0
  46. package/dist/OptionsEditorLayout/OptionsEditorGrid.d.ts +13 -0
  47. package/dist/OptionsEditorLayout/OptionsEditorGrid.d.ts.map +1 -0
  48. package/dist/OptionsEditorLayout/OptionsEditorGrid.js +26 -0
  49. package/dist/OptionsEditorLayout/OptionsEditorGrid.js.map +1 -0
  50. package/dist/OptionsEditorLayout/OptionsEditorGroup.d.ts +13 -0
  51. package/dist/OptionsEditorLayout/OptionsEditorGroup.d.ts.map +1 -0
  52. package/dist/OptionsEditorLayout/OptionsEditorGroup.js +36 -0
  53. package/dist/OptionsEditorLayout/OptionsEditorGroup.js.map +1 -0
  54. package/dist/OptionsEditorLayout/index.d.ts +5 -0
  55. package/dist/OptionsEditorLayout/index.d.ts.map +1 -0
  56. package/dist/OptionsEditorLayout/index.js +18 -0
  57. package/dist/OptionsEditorLayout/index.js.map +1 -0
  58. package/dist/Tooltip/SeriesInfo.d.ts +1 -0
  59. package/dist/Tooltip/SeriesInfo.d.ts.map +1 -1
  60. package/dist/Tooltip/SeriesInfo.js +3 -3
  61. package/dist/Tooltip/SeriesInfo.js.map +1 -1
  62. package/dist/Tooltip/Tooltip.d.ts +2 -1
  63. package/dist/Tooltip/Tooltip.d.ts.map +1 -1
  64. package/dist/Tooltip/Tooltip.js +2 -2
  65. package/dist/Tooltip/Tooltip.js.map +1 -1
  66. package/dist/Tooltip/TooltipContent.d.ts.map +1 -1
  67. package/dist/Tooltip/TooltipContent.js +2 -1
  68. package/dist/Tooltip/TooltipContent.js.map +1 -1
  69. package/dist/Tooltip/focused-series.d.ts +4 -3
  70. package/dist/Tooltip/focused-series.d.ts.map +1 -1
  71. package/dist/Tooltip/focused-series.js +6 -3
  72. package/dist/Tooltip/focused-series.js.map +1 -1
  73. package/dist/Tooltip/focused-series.test.js +20 -2
  74. package/dist/Tooltip/focused-series.test.js.map +1 -1
  75. package/dist/UnitSelector/UnitSelector.d.ts +8 -0
  76. package/dist/UnitSelector/UnitSelector.d.ts.map +1 -0
  77. package/dist/UnitSelector/UnitSelector.js +112 -0
  78. package/dist/UnitSelector/UnitSelector.js.map +1 -0
  79. package/dist/UnitSelector/UnitSelector.test.d.ts +2 -0
  80. package/dist/UnitSelector/UnitSelector.test.d.ts.map +1 -0
  81. package/dist/UnitSelector/UnitSelector.test.js +211 -0
  82. package/dist/UnitSelector/UnitSelector.test.js.map +1 -0
  83. package/dist/UnitSelector/index.d.ts +2 -0
  84. package/dist/UnitSelector/index.d.ts.map +1 -0
  85. package/dist/UnitSelector/index.js +15 -0
  86. package/dist/UnitSelector/index.js.map +1 -0
  87. package/dist/cjs/{TimeRangeSelector → DateTimeRangePicker}/AbsoluteTimePicker.js +37 -32
  88. package/dist/cjs/DateTimeRangePicker/DateTimeRangePicker.js +83 -0
  89. package/dist/cjs/{TimeRangeSelector → DateTimeRangePicker}/TimeRangeSelector.js +0 -0
  90. package/dist/cjs/{TimeRangeSelector → DateTimeRangePicker}/index.js +1 -0
  91. package/dist/cjs/{TimeRangeSelector → DateTimeRangePicker}/utils.js +0 -0
  92. package/dist/cjs/Legend/CompactLegend.js +12 -6
  93. package/dist/cjs/Legend/Legend.js +4 -9
  94. package/dist/cjs/Legend/ListLegend.js +15 -1
  95. package/dist/cjs/Legend/ListLegendItem.js +48 -13
  96. package/dist/cjs/LineChart/LineChart.js +2 -1
  97. package/dist/cjs/OptionsEditorLayout/OptionsEditorColumn.js +32 -0
  98. package/dist/cjs/OptionsEditorLayout/OptionsEditorControl.js +61 -0
  99. package/dist/cjs/OptionsEditorLayout/OptionsEditorGrid.js +29 -0
  100. package/dist/cjs/OptionsEditorLayout/OptionsEditorGroup.js +40 -0
  101. package/dist/cjs/OptionsEditorLayout/index.js +31 -0
  102. package/dist/cjs/Tooltip/SeriesInfo.js +3 -3
  103. package/dist/cjs/Tooltip/Tooltip.js +2 -2
  104. package/dist/cjs/Tooltip/TooltipContent.js +2 -1
  105. package/dist/cjs/Tooltip/focused-series.js +6 -3
  106. package/dist/cjs/Tooltip/focused-series.test.js +20 -2
  107. package/dist/cjs/UnitSelector/UnitSelector.js +118 -0
  108. package/dist/cjs/UnitSelector/UnitSelector.test.js +218 -0
  109. package/dist/cjs/UnitSelector/index.js +28 -0
  110. package/dist/cjs/index.js +4 -2
  111. package/dist/cjs/model/units/bytes.js +60 -0
  112. package/dist/cjs/model/units/constants.js +23 -0
  113. package/dist/cjs/model/units/decimal.js +67 -0
  114. package/dist/cjs/model/units/index.js +30 -0
  115. package/dist/cjs/model/units/percent.js +64 -0
  116. package/dist/cjs/model/units/time.js +138 -0
  117. package/dist/cjs/model/units/types.js +28 -0
  118. package/dist/cjs/model/units/units.js +104 -0
  119. package/dist/cjs/utils/component-ids.js +31 -0
  120. package/dist/cjs/utils/index.js +1 -0
  121. package/dist/index.d.ts +4 -2
  122. package/dist/index.d.ts.map +1 -1
  123. package/dist/index.js +4 -2
  124. package/dist/index.js.map +1 -1
  125. package/dist/model/units/bytes.d.ts +12 -0
  126. package/dist/model/units/bytes.d.ts.map +1 -0
  127. package/dist/model/units/bytes.js +48 -0
  128. package/dist/model/units/bytes.js.map +1 -0
  129. package/dist/model/units/constants.d.ts +2 -0
  130. package/dist/model/units/constants.d.ts.map +1 -0
  131. package/dist/model/units/constants.js +17 -0
  132. package/dist/model/units/constants.js.map +1 -0
  133. package/dist/model/units/decimal.d.ts +24 -0
  134. package/dist/model/units/decimal.d.ts.map +1 -0
  135. package/dist/model/units/decimal.js +59 -0
  136. package/dist/model/units/decimal.js.map +1 -0
  137. package/dist/model/units/index.d.ts +4 -0
  138. package/dist/model/units/index.d.ts.map +1 -0
  139. package/dist/model/units/index.js +17 -0
  140. package/dist/model/units/index.js.map +1 -0
  141. package/dist/model/units/percent.d.ts +12 -0
  142. package/dist/model/units/percent.d.ts.map +1 -0
  143. package/dist/model/units/percent.js +51 -0
  144. package/dist/model/units/percent.js.map +1 -0
  145. package/dist/model/units/time.d.ts +11 -0
  146. package/dist/model/units/time.d.ts.map +1 -0
  147. package/dist/model/units/time.js +125 -0
  148. package/dist/model/units/time.js.map +1 -0
  149. package/dist/model/units/types.d.ts +38 -0
  150. package/dist/model/units/types.d.ts.map +1 -0
  151. package/dist/model/units/types.js +22 -0
  152. package/dist/model/units/types.js.map +1 -0
  153. package/dist/model/units/units.d.ts +40 -0
  154. package/dist/model/units/units.d.ts.map +1 -0
  155. package/dist/model/units/units.js +83 -0
  156. package/dist/model/units/units.js.map +1 -0
  157. package/dist/utils/component-ids.d.ts +8 -0
  158. package/dist/utils/component-ids.d.ts.map +1 -0
  159. package/dist/utils/component-ids.js +27 -0
  160. package/dist/utils/component-ids.js.map +1 -0
  161. package/dist/utils/index.d.ts +1 -0
  162. package/dist/utils/index.d.ts.map +1 -1
  163. package/dist/utils/index.js +1 -0
  164. package/dist/utils/index.js.map +1 -1
  165. package/package.json +2 -2
  166. package/dist/TimeRangeSelector/AbsoluteTimePicker.d.ts.map +0 -1
  167. package/dist/TimeRangeSelector/AbsoluteTimePicker.js.map +0 -1
  168. package/dist/TimeRangeSelector/TimeRangeSelector.d.ts.map +0 -1
  169. package/dist/TimeRangeSelector/TimeRangeSelector.js.map +0 -1
  170. package/dist/TimeRangeSelector/index.d.ts.map +0 -1
  171. package/dist/TimeRangeSelector/index.js.map +0 -1
  172. package/dist/TimeRangeSelector/utils.d.ts.map +0 -1
  173. package/dist/TimeRangeSelector/utils.js.map +0 -1
  174. package/dist/cjs/model/units.js +0 -203
  175. package/dist/model/units.d.ts +0 -36
  176. package/dist/model/units.d.ts.map +0 -1
  177. package/dist/model/units.js +0 -196
  178. package/dist/model/units.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"focused-series.d.ts","sourceRoot":"","sources":["../../src/Tooltip/focused-series.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACnD,OAAO,EAAE,UAAU,EAA0C,MAAM,iBAAiB,CAAC;AAErF,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,oBAAY,kBAAkB,GAAG,iBAAiB,EAAE,CAAC;AAErD;;;GAGG;AACH,wBAAgB,eAAe,CAAC,IAAI,EAAE,iBAAiB,EAAE,WAAW,EAAE,MAAM,EAAE,EAAE,OAAO,EAAE,MAAM,GAAG,kBAAkB,CA0CnH;AAED;;;GAGG;AACH,wBAAgB,oBAAoB,CAClC,QAAQ,EAAE,UAAU,CAAC,QAAQ,CAAC,EAC9B,SAAS,EAAE,iBAAiB,EAC5B,SAAS,EAAE,UAAU,CAAC,QAAQ,CAAC,EAC/B,KAAK,CAAC,EAAE,eAAe,sBA2CxB"}
1
+ {"version":3,"file":"focused-series.d.ts","sourceRoot":"","sources":["../../src/Tooltip/focused-series.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,cAAc,CAAC;AAC1D,OAAO,EAAe,WAAW,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AACvE,OAAO,EAAE,UAAU,EAA0C,MAAM,iBAAiB,CAAC;AAErF,MAAM,WAAW,iBAAiB;IAChC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAC;IACxB,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,oBAAY,kBAAkB,GAAG,iBAAiB,EAAE,CAAC;AAErD;;;GAGG;AACH,wBAAgB,eAAe,CAC7B,IAAI,EAAE,iBAAiB,EACvB,WAAW,EAAE,MAAM,EAAE,EACrB,OAAO,EAAE,MAAM,EACf,IAAI,CAAC,EAAE,WAAW,GACjB,kBAAkB,CA4CpB;AAED;;;GAGG;AACH,wBAAgB,oBAAoB,CAClC,QAAQ,EAAE,UAAU,CAAC,QAAQ,CAAC,EAC9B,SAAS,EAAE,iBAAiB,EAC5B,SAAS,EAAE,UAAU,CAAC,QAAQ,CAAC,EAC/B,KAAK,CAAC,EAAE,eAAe,EACvB,IAAI,CAAC,EAAE,WAAW,sBA2CnB"}
@@ -10,11 +10,12 @@
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 { formatValue } from '../model';
13
14
  import { TOOLTIP_DATE_FORMAT, TOOLTIP_MAX_ITEMS } from './tooltip-model';
14
15
  /**
15
16
  * Returns formatted series data for the points that are close to the user's cursor
16
17
  * Adjust yBuffer to increase or decrease number of series shown
17
- */ export function getNearbySeries(data, pointInGrid, yBuffer) {
18
+ */ export function getNearbySeries(data, pointInGrid, yBuffer, unit) {
18
19
  const currentFocusedData = [];
19
20
  var ref;
20
21
  const focusedX = (ref = pointInGrid[0]) !== null && ref !== void 0 ? ref : null;
@@ -42,6 +43,7 @@ import { TOOLTIP_DATE_FORMAT, TOOLTIP_MAX_ITEMS } from './tooltip-model';
42
43
  // determine whether to convert timestamp to ms, see: https://stackoverflow.com/a/23982005/17575201
43
44
  const xValueMilliSeconds = xValue > 99999999999 ? xValue : xValue * 1000;
44
45
  const formattedDate = TOOLTIP_DATE_FORMAT.format(xValueMilliSeconds);
46
+ const formattedY = formatValue(yValue, unit);
45
47
  currentFocusedData.push({
46
48
  seriesIdx: seriesIdx,
47
49
  datumIdx: datumIdx,
@@ -49,6 +51,7 @@ import { TOOLTIP_DATE_FORMAT, TOOLTIP_MAX_ITEMS } from './tooltip-model';
49
51
  date: formattedDate,
50
52
  x: xValue,
51
53
  y: yValue,
54
+ formattedY: formattedY,
52
55
  markerColor: markerColor.toString()
53
56
  });
54
57
  }
@@ -63,7 +66,7 @@ import { TOOLTIP_DATE_FORMAT, TOOLTIP_MAX_ITEMS } from './tooltip-model';
63
66
  /**
64
67
  * Uses mouse position to determine whether user is hovering over a chart canvas
65
68
  * If yes, convert from pixel values to logical cartesian coordinates and return all focused series
66
- */ export function getFocusedSeriesData(mousePos, chartData, pinnedPos, chart) {
69
+ */ export function getFocusedSeriesData(mousePos, chartData, pinnedPos, chart, unit) {
67
70
  if (chart === undefined || mousePos === null) return [];
68
71
  // prevents multiple tooltips showing from adjacent charts
69
72
  let cursorTargetMatchesChart = false;
@@ -99,7 +102,7 @@ import { TOOLTIP_DATE_FORMAT, TOOLTIP_MAX_ITEMS } from './tooltip-model';
99
102
  if (chart.containPixel('grid', pointInPixel)) {
100
103
  const pointInGrid = chart.convertFromPixel('grid', pointInPixel);
101
104
  if (pointInGrid[0] !== undefined && pointInGrid[1] !== undefined) {
102
- return getNearbySeries(chartData, pointInGrid, yBuffer);
105
+ return getNearbySeries(chartData, pointInGrid, yBuffer, unit);
103
106
  }
104
107
  }
105
108
  return [];
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Tooltip/focused-series.ts"],"sourcesContent":["// Copyright 2022 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 { EChartsDataFormat } from '../model/graph';\nimport { CursorData, TOOLTIP_DATE_FORMAT, TOOLTIP_MAX_ITEMS } from './tooltip-model';\n\nexport interface FocusedSeriesInfo {\n seriesIdx: number | null;\n datumIdx: number | null;\n seriesName: string;\n date: string;\n markerColor: string;\n x: number;\n y: number;\n}\n\nexport type FocusedSeriesArray = FocusedSeriesInfo[];\n\n/**\n * Returns formatted series data for the points that are close to the user's cursor\n * Adjust yBuffer to increase or decrease number of series shown\n */\nexport function getNearbySeries(data: EChartsDataFormat, pointInGrid: number[], yBuffer: number): FocusedSeriesArray {\n const currentFocusedData: FocusedSeriesArray = [];\n const focusedX: number | null = pointInGrid[0] ?? null;\n const focusedY: number | null = pointInGrid[1] ?? null;\n\n if (focusedX === null || focusedY === null) {\n return currentFocusedData;\n }\n\n if (Array.isArray(data.xAxis) && Array.isArray(data.timeSeries)) {\n for (let seriesIdx = 0; seriesIdx < data.timeSeries.length; seriesIdx++) {\n const currentSeries = data.timeSeries[seriesIdx];\n if (currentFocusedData.length >= TOOLTIP_MAX_ITEMS) break;\n if (currentSeries !== undefined) {\n const currentSeriesName = currentSeries.name ? currentSeries.name.toString() : '';\n const markerColor = currentSeries.color ?? '#000';\n if (Array.isArray(currentSeries.data)) {\n for (let datumIdx = 0; datumIdx < currentSeries.data.length; datumIdx++) {\n const xValue = data.xAxis[datumIdx] ?? 0;\n const yValue = currentSeries.data[datumIdx] ?? 0;\n if (focusedX === datumIdx) {\n if (yValue !== '-' && focusedY <= yValue + yBuffer && focusedY >= yValue - yBuffer) {\n // determine whether to convert timestamp to ms, see: https://stackoverflow.com/a/23982005/17575201\n const xValueMilliSeconds = xValue > 99999999999 ? xValue : xValue * 1000;\n const formattedDate = TOOLTIP_DATE_FORMAT.format(xValueMilliSeconds);\n currentFocusedData.push({\n seriesIdx: seriesIdx,\n datumIdx: datumIdx,\n seriesName: currentSeriesName,\n date: formattedDate,\n x: xValue,\n y: yValue,\n markerColor: markerColor.toString(),\n });\n }\n }\n }\n }\n }\n }\n }\n return currentFocusedData;\n}\n\n/**\n * Uses mouse position to determine whether user is hovering over a chart canvas\n * If yes, convert from pixel values to logical cartesian coordinates and return all focused series\n */\nexport function getFocusedSeriesData(\n mousePos: CursorData['coords'],\n chartData: EChartsDataFormat,\n pinnedPos: CursorData['coords'],\n chart?: EChartsInstance\n) {\n if (chart === undefined || mousePos === null) return [];\n\n // prevents multiple tooltips showing from adjacent charts\n let cursorTargetMatchesChart = false;\n if (mousePos.target !== null) {\n const currentParent = (<HTMLElement>mousePos.target).parentElement;\n if (currentParent !== null) {\n const currentGrandparent = currentParent.parentElement;\n if (currentGrandparent !== null) {\n const chartDom = chart.getDom();\n if (chartDom === currentGrandparent) {\n cursorTargetMatchesChart = true;\n }\n }\n }\n }\n\n // allows moving cursor inside tooltip\n if (pinnedPos !== null) {\n mousePos = pinnedPos;\n cursorTargetMatchesChart = true;\n }\n\n if (cursorTargetMatchesChart === false) return [];\n\n if (chart['_model'] === undefined) return [];\n const chartModel = chart['_model'];\n const yAxisInterval = chartModel.getComponent('yAxis').axis.scale._interval;\n\n const seriesNum = chartData.timeSeries.length;\n // tooltip trigger area gets smaller with more series\n const yBuffer = seriesNum > TOOLTIP_MAX_ITEMS ? yAxisInterval * 0.5 : yAxisInterval * 2;\n\n const pointInPixel = [mousePos.plotCanvas.x ?? 0, mousePos.plotCanvas.y ?? 0];\n if (chart.containPixel('grid', pointInPixel)) {\n const pointInGrid = chart.convertFromPixel('grid', pointInPixel);\n if (pointInGrid[0] !== undefined && pointInGrid[1] !== undefined) {\n return getNearbySeries(chartData, pointInGrid, yBuffer);\n }\n }\n return [];\n}\n"],"names":["TOOLTIP_DATE_FORMAT","TOOLTIP_MAX_ITEMS","getNearbySeries","data","pointInGrid","yBuffer","currentFocusedData","focusedX","focusedY","Array","isArray","xAxis","timeSeries","seriesIdx","length","currentSeries","undefined","currentSeriesName","name","toString","markerColor","color","datumIdx","xValue","yValue","xValueMilliSeconds","formattedDate","format","push","seriesName","date","x","y","getFocusedSeriesData","mousePos","chartData","pinnedPos","chart","cursorTargetMatchesChart","target","currentParent","parentElement","currentGrandparent","chartDom","getDom","chartModel","yAxisInterval","getComponent","axis","scale","_interval","seriesNum","pointInPixel","plotCanvas","containPixel","convertFromPixel"],"mappings":"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"}
1
+ {"version":3,"sources":["../../src/Tooltip/focused-series.ts"],"sourcesContent":["// Copyright 2022 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 { formatValue, UnitOptions, EChartsDataFormat } from '../model';\nimport { CursorData, TOOLTIP_DATE_FORMAT, TOOLTIP_MAX_ITEMS } from './tooltip-model';\n\nexport interface FocusedSeriesInfo {\n seriesIdx: number | null;\n datumIdx: number | null;\n seriesName: string;\n date: string;\n markerColor: string;\n x: number;\n y: number;\n formattedY: string;\n}\n\nexport type FocusedSeriesArray = FocusedSeriesInfo[];\n\n/**\n * Returns formatted series data for the points that are close to the user's cursor\n * Adjust yBuffer to increase or decrease number of series shown\n */\nexport function getNearbySeries(\n data: EChartsDataFormat,\n pointInGrid: number[],\n yBuffer: number,\n unit?: UnitOptions\n): FocusedSeriesArray {\n const currentFocusedData: FocusedSeriesArray = [];\n const focusedX: number | null = pointInGrid[0] ?? null;\n const focusedY: number | null = pointInGrid[1] ?? null;\n\n if (focusedX === null || focusedY === null) {\n return currentFocusedData;\n }\n\n if (Array.isArray(data.xAxis) && Array.isArray(data.timeSeries)) {\n for (let seriesIdx = 0; seriesIdx < data.timeSeries.length; seriesIdx++) {\n const currentSeries = data.timeSeries[seriesIdx];\n if (currentFocusedData.length >= TOOLTIP_MAX_ITEMS) break;\n if (currentSeries !== undefined) {\n const currentSeriesName = currentSeries.name ? currentSeries.name.toString() : '';\n const markerColor = currentSeries.color ?? '#000';\n if (Array.isArray(currentSeries.data)) {\n for (let datumIdx = 0; datumIdx < currentSeries.data.length; datumIdx++) {\n const xValue = data.xAxis[datumIdx] ?? 0;\n const yValue = currentSeries.data[datumIdx] ?? 0;\n if (focusedX === datumIdx) {\n if (yValue !== '-' && focusedY <= yValue + yBuffer && focusedY >= yValue - yBuffer) {\n // determine whether to convert timestamp to ms, see: https://stackoverflow.com/a/23982005/17575201\n const xValueMilliSeconds = xValue > 99999999999 ? xValue : xValue * 1000;\n const formattedDate = TOOLTIP_DATE_FORMAT.format(xValueMilliSeconds);\n const formattedY = formatValue(yValue, unit);\n currentFocusedData.push({\n seriesIdx: seriesIdx,\n datumIdx: datumIdx,\n seriesName: currentSeriesName,\n date: formattedDate,\n x: xValue,\n y: yValue,\n formattedY: formattedY,\n markerColor: markerColor.toString(),\n });\n }\n }\n }\n }\n }\n }\n }\n return currentFocusedData;\n}\n\n/**\n * Uses mouse position to determine whether user is hovering over a chart canvas\n * If yes, convert from pixel values to logical cartesian coordinates and return all focused series\n */\nexport function getFocusedSeriesData(\n mousePos: CursorData['coords'],\n chartData: EChartsDataFormat,\n pinnedPos: CursorData['coords'],\n chart?: EChartsInstance,\n unit?: UnitOptions\n) {\n if (chart === undefined || mousePos === null) return [];\n\n // prevents multiple tooltips showing from adjacent charts\n let cursorTargetMatchesChart = false;\n if (mousePos.target !== null) {\n const currentParent = (<HTMLElement>mousePos.target).parentElement;\n if (currentParent !== null) {\n const currentGrandparent = currentParent.parentElement;\n if (currentGrandparent !== null) {\n const chartDom = chart.getDom();\n if (chartDom === currentGrandparent) {\n cursorTargetMatchesChart = true;\n }\n }\n }\n }\n\n // allows moving cursor inside tooltip\n if (pinnedPos !== null) {\n mousePos = pinnedPos;\n cursorTargetMatchesChart = true;\n }\n\n if (cursorTargetMatchesChart === false) return [];\n\n if (chart['_model'] === undefined) return [];\n const chartModel = chart['_model'];\n const yAxisInterval = chartModel.getComponent('yAxis').axis.scale._interval;\n\n const seriesNum = chartData.timeSeries.length;\n // tooltip trigger area gets smaller with more series\n const yBuffer = seriesNum > TOOLTIP_MAX_ITEMS ? yAxisInterval * 0.5 : yAxisInterval * 2;\n\n const pointInPixel = [mousePos.plotCanvas.x ?? 0, mousePos.plotCanvas.y ?? 0];\n if (chart.containPixel('grid', pointInPixel)) {\n const pointInGrid = chart.convertFromPixel('grid', pointInPixel);\n if (pointInGrid[0] !== undefined && pointInGrid[1] !== undefined) {\n return getNearbySeries(chartData, pointInGrid, yBuffer, unit);\n }\n }\n return [];\n}\n"],"names":["formatValue","TOOLTIP_DATE_FORMAT","TOOLTIP_MAX_ITEMS","getNearbySeries","data","pointInGrid","yBuffer","unit","currentFocusedData","focusedX","focusedY","Array","isArray","xAxis","timeSeries","seriesIdx","length","currentSeries","undefined","currentSeriesName","name","toString","markerColor","color","datumIdx","xValue","yValue","xValueMilliSeconds","formattedDate","format","formattedY","push","seriesName","date","x","y","getFocusedSeriesData","mousePos","chartData","pinnedPos","chart","cursorTargetMatchesChart","target","currentParent","parentElement","currentGrandparent","chartDom","getDom","chartModel","yAxisInterval","getComponent","axis","scale","_interval","seriesNum","pointInPixel","plotCanvas","containPixel","convertFromPixel"],"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;AAGjC,SAASA,WAAW,QAAwC,UAAU,CAAC;AACvE,SAAqBC,mBAAmB,EAAEC,iBAAiB,QAAQ,iBAAiB,CAAC;AAerF;;;CAGC,GACD,OAAO,SAASC,eAAe,CAC7BC,IAAuB,EACvBC,WAAqB,EACrBC,OAAe,EACfC,IAAkB,EACE;IACpB,MAAMC,kBAAkB,GAAuB,EAAE,AAAC;QAClBH,GAAc;IAA9C,MAAMI,QAAQ,GAAkBJ,CAAAA,GAAc,GAAdA,WAAW,CAAC,CAAC,CAAC,cAAdA,GAAc,cAAdA,GAAc,GAAI,IAAI,AAAC;QACvBA,IAAc;IAA9C,MAAMK,QAAQ,GAAkBL,CAAAA,IAAc,GAAdA,WAAW,CAAC,CAAC,CAAC,cAAdA,IAAc,cAAdA,IAAc,GAAI,IAAI,AAAC;IAEvD,IAAII,QAAQ,KAAK,IAAI,IAAIC,QAAQ,KAAK,IAAI,EAAE;QAC1C,OAAOF,kBAAkB,CAAC;IAC5B,CAAC;IAED,IAAIG,KAAK,CAACC,OAAO,CAACR,IAAI,CAACS,KAAK,CAAC,IAAIF,KAAK,CAACC,OAAO,CAACR,IAAI,CAACU,UAAU,CAAC,EAAE;QAC/D,IAAK,IAAIC,SAAS,GAAG,CAAC,EAAEA,SAAS,GAAGX,IAAI,CAACU,UAAU,CAACE,MAAM,EAAED,SAAS,EAAE,CAAE;YACvE,MAAME,aAAa,GAAGb,IAAI,CAACU,UAAU,CAACC,SAAS,CAAC,AAAC;YACjD,IAAIP,kBAAkB,CAACQ,MAAM,IAAId,iBAAiB,EAAE,MAAM;YAC1D,IAAIe,aAAa,KAAKC,SAAS,EAAE;gBAC/B,MAAMC,iBAAiB,GAAGF,aAAa,CAACG,IAAI,GAAGH,aAAa,CAACG,IAAI,CAACC,QAAQ,EAAE,GAAG,EAAE,AAAC;oBAC9DJ,MAAmB;gBAAvC,MAAMK,WAAW,GAAGL,CAAAA,MAAmB,GAAnBA,aAAa,CAACM,KAAK,cAAnBN,MAAmB,cAAnBA,MAAmB,GAAI,MAAM,AAAC;gBAClD,IAAIN,KAAK,CAACC,OAAO,CAACK,aAAa,CAACb,IAAI,CAAC,EAAE;oBACrC,IAAK,IAAIoB,QAAQ,GAAG,CAAC,EAAEA,QAAQ,GAAGP,aAAa,CAACb,IAAI,CAACY,MAAM,EAAEQ,QAAQ,EAAE,CAAE;4BACxDpB,SAAoB;wBAAnC,MAAMqB,MAAM,GAAGrB,CAAAA,SAAoB,GAApBA,IAAI,CAACS,KAAK,CAACW,QAAQ,CAAC,cAApBpB,SAAoB,cAApBA,SAAoB,GAAI,CAAC,AAAC;4BAC1Ba,UAA4B;wBAA3C,MAAMS,MAAM,GAAGT,CAAAA,UAA4B,GAA5BA,aAAa,CAACb,IAAI,CAACoB,QAAQ,CAAC,cAA5BP,UAA4B,cAA5BA,UAA4B,GAAI,CAAC,AAAC;wBACjD,IAAIR,QAAQ,KAAKe,QAAQ,EAAE;4BACzB,IAAIE,MAAM,KAAK,GAAG,IAAIhB,QAAQ,IAAIgB,MAAM,GAAGpB,OAAO,IAAII,QAAQ,IAAIgB,MAAM,GAAGpB,OAAO,EAAE;gCAClF,mGAAmG;gCACnG,MAAMqB,kBAAkB,GAAGF,MAAM,GAAG,WAAW,GAAGA,MAAM,GAAGA,MAAM,GAAG,IAAI,AAAC;gCACzE,MAAMG,aAAa,GAAG3B,mBAAmB,CAAC4B,MAAM,CAACF,kBAAkB,CAAC,AAAC;gCACrE,MAAMG,UAAU,GAAG9B,WAAW,CAAC0B,MAAM,EAAEnB,IAAI,CAAC,AAAC;gCAC7CC,kBAAkB,CAACuB,IAAI,CAAC;oCACtBhB,SAAS,EAAEA,SAAS;oCACpBS,QAAQ,EAAEA,QAAQ;oCAClBQ,UAAU,EAAEb,iBAAiB;oCAC7Bc,IAAI,EAAEL,aAAa;oCACnBM,CAAC,EAAET,MAAM;oCACTU,CAAC,EAAET,MAAM;oCACTI,UAAU,EAAEA,UAAU;oCACtBR,WAAW,EAAEA,WAAW,CAACD,QAAQ,EAAE;iCACpC,CAAC,CAAC;4BACL,CAAC;wBACH,CAAC;oBACH,CAAC;gBACH,CAAC;YACH,CAAC;QACH,CAAC;IACH,CAAC;IACD,OAAOb,kBAAkB,CAAC;AAC5B,CAAC;AAED;;;CAGC,GACD,OAAO,SAAS4B,oBAAoB,CAClCC,QAA8B,EAC9BC,SAA4B,EAC5BC,SAA+B,EAC/BC,KAAuB,EACvBjC,IAAkB,EAClB;IACA,IAAIiC,KAAK,KAAKtB,SAAS,IAAImB,QAAQ,KAAK,IAAI,EAAE,OAAO,EAAE,CAAC;IAExD,0DAA0D;IAC1D,IAAII,wBAAwB,GAAG,KAAK,AAAC;IACrC,IAAIJ,QAAQ,CAACK,MAAM,KAAK,IAAI,EAAE;QAC5B,MAAMC,aAAa,GAAG,AAAcN,QAAQ,CAACK,MAAM,CAAEE,aAAa,AAAC;QACnE,IAAID,aAAa,KAAK,IAAI,EAAE;YAC1B,MAAME,kBAAkB,GAAGF,aAAa,CAACC,aAAa,AAAC;YACvD,IAAIC,kBAAkB,KAAK,IAAI,EAAE;gBAC/B,MAAMC,QAAQ,GAAGN,KAAK,CAACO,MAAM,EAAE,AAAC;gBAChC,IAAID,QAAQ,KAAKD,kBAAkB,EAAE;oBACnCJ,wBAAwB,GAAG,IAAI,CAAC;gBAClC,CAAC;YACH,CAAC;QACH,CAAC;IACH,CAAC;IAED,sCAAsC;IACtC,IAAIF,SAAS,KAAK,IAAI,EAAE;QACtBF,QAAQ,GAAGE,SAAS,CAAC;QACrBE,wBAAwB,GAAG,IAAI,CAAC;IAClC,CAAC;IAED,IAAIA,wBAAwB,KAAK,KAAK,EAAE,OAAO,EAAE,CAAC;IAElD,IAAID,KAAK,CAAC,QAAQ,CAAC,KAAKtB,SAAS,EAAE,OAAO,EAAE,CAAC;IAC7C,MAAM8B,UAAU,GAAGR,KAAK,CAAC,QAAQ,CAAC,AAAC;IACnC,MAAMS,aAAa,GAAGD,UAAU,CAACE,YAAY,CAAC,OAAO,CAAC,CAACC,IAAI,CAACC,KAAK,CAACC,SAAS,AAAC;IAE5E,MAAMC,SAAS,GAAGhB,SAAS,CAACxB,UAAU,CAACE,MAAM,AAAC;IAC9C,qDAAqD;IACrD,MAAMV,OAAO,GAAGgD,SAAS,GAAGpD,iBAAiB,GAAG+C,aAAa,GAAG,GAAG,GAAGA,aAAa,GAAG,CAAC,AAAC;QAElEZ,EAAqB,EAAOA,EAAqB;IAAvE,MAAMkB,YAAY,GAAG;QAAClB,CAAAA,EAAqB,GAArBA,QAAQ,CAACmB,UAAU,CAACtB,CAAC,cAArBG,EAAqB,cAArBA,EAAqB,GAAI,CAAC;QAAEA,CAAAA,EAAqB,GAArBA,QAAQ,CAACmB,UAAU,CAACrB,CAAC,cAArBE,EAAqB,cAArBA,EAAqB,GAAI,CAAC;KAAC,AAAC;IAC9E,IAAIG,KAAK,CAACiB,YAAY,CAAC,MAAM,EAAEF,YAAY,CAAC,EAAE;QAC5C,MAAMlD,WAAW,GAAGmC,KAAK,CAACkB,gBAAgB,CAAC,MAAM,EAAEH,YAAY,CAAC,AAAC;QACjE,IAAIlD,WAAW,CAAC,CAAC,CAAC,KAAKa,SAAS,IAAIb,WAAW,CAAC,CAAC,CAAC,KAAKa,SAAS,EAAE;YAChE,OAAOf,eAAe,CAACmC,SAAS,EAAEjC,WAAW,EAAEC,OAAO,EAAEC,IAAI,CAAC,CAAC;QAChE,CAAC;IACH,CAAC;IACD,OAAO,EAAE,CAAC;AACZ,CAAC"}
@@ -64,11 +64,29 @@ describe('getNearbySeries', ()=>{
64
64
  seriesName: 'env="demo", instance="demo.do.prometheus", job="node", mode="test alt"',
65
65
  seriesIdx: 1,
66
66
  x: 1654007895000,
67
- y: 0.0524463040446356
67
+ y: 0.0524463040446356,
68
+ formattedY: '0.05'
68
69
  }
69
70
  ];
70
71
  it('should return focused series data for points nearby the cursor', ()=>{
71
- expect(getNearbySeries(chartData, pointInGrid, yBuffer)).toEqual(focusedSeriesOutput);
72
+ const decimalUnit = {
73
+ kind: 'Decimal',
74
+ decimal_places: 2
75
+ };
76
+ expect(getNearbySeries(chartData, pointInGrid, yBuffer, decimalUnit)).toEqual(focusedSeriesOutput);
77
+ });
78
+ it('should return series values formatted as a percent', ()=>{
79
+ const percentFormattedOutput = [
80
+ ...focusedSeriesOutput
81
+ ];
82
+ if (percentFormattedOutput[0]) {
83
+ percentFormattedOutput[0].formattedY = '5%';
84
+ }
85
+ const percentFormattedUnit = {
86
+ kind: 'PercentDecimal',
87
+ decimal_places: 0
88
+ };
89
+ expect(getNearbySeries(chartData, pointInGrid, yBuffer, percentFormattedUnit)).toEqual(percentFormattedOutput);
72
90
  });
73
91
  });
74
92
 
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Tooltip/focused-series.test.ts"],"sourcesContent":["// Copyright 2022 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 { EChartsDataFormat } from '../model';\nimport { getNearbySeries } from './focused-series';\n\ndescribe('getNearbySeries', () => {\n const chartData: EChartsDataFormat = {\n timeSeries: [\n {\n type: 'line',\n name: 'env=\"demo\", instance=\"demo.do.prometheus\", job=\"node\", mode=\"test\"',\n color: 'hsla(-1365438424,50%,50%,0.8)',\n data: [\n 0.0002315202231525094, 0.00022873082287300112, 0.00023152022315149463, 0.00023152022315149463,\n 0.00022873082287300112,\n ],\n symbol: 'circle',\n },\n {\n type: 'line',\n name: 'env=\"demo\", instance=\"demo.do.prometheus\", job=\"node\", mode=\"test alt\"',\n color: 'hsla(286664040,50%,50%,0.8)',\n data: [0.05245188284519867, 0.0524463040446356, 0.0524463040446356, 0.05247140864723438, 0.052482566248230646],\n symbol: 'circle',\n },\n ],\n xAxis: [1654007865000, 1654007880000, 1654007895000, 1654007910000, 1654007925000],\n rangeMs: 60000,\n };\n\n // https://echarts.apache.org/en/api.html#echartsInstance.convertFromPixel\n const pointInGrid = [2, 0.0560655737704918]; // converted from chart.getZr() mousemove coordinates\n\n const yBuffer = 0.02; // calculated from y axis interval\n\n const focusedSeriesOutput = [\n {\n date: 'May 31, 2022, 2:38:15 PM',\n datumIdx: 2,\n markerColor: 'hsla(286664040,50%,50%,0.8)',\n seriesName: 'env=\"demo\", instance=\"demo.do.prometheus\", job=\"node\", mode=\"test alt\"',\n seriesIdx: 1,\n x: 1654007895000,\n y: 0.0524463040446356,\n },\n ];\n\n it('should return focused series data for points nearby the cursor', () => {\n expect(getNearbySeries(chartData, pointInGrid, yBuffer)).toEqual(focusedSeriesOutput);\n });\n});\n"],"names":["getNearbySeries","describe","chartData","timeSeries","type","name","color","data","symbol","xAxis","rangeMs","pointInGrid","yBuffer","focusedSeriesOutput","date","datumIdx","markerColor","seriesName","seriesIdx","x","y","it","expect","toEqual"],"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;AAGjC,SAASA,eAAe,QAAQ,kBAAkB,CAAC;AAEnDC,QAAQ,CAAC,iBAAiB,EAAE,IAAM;IAChC,MAAMC,SAAS,GAAsB;QACnCC,UAAU,EAAE;YACV;gBACEC,IAAI,EAAE,MAAM;gBACZC,IAAI,EAAE,oEAAoE;gBAC1EC,KAAK,EAAE,+BAA+B;gBACtCC,IAAI,EAAE;AACJ,yCAAqB;AAAE,0CAAsB;AAAE,0CAAsB;AAAE,0CAAsB;AAC7F,0CAAsB;iBACvB;gBACDC,MAAM,EAAE,QAAQ;aACjB;YACD;gBACEJ,IAAI,EAAE,MAAM;gBACZC,IAAI,EAAE,wEAAwE;gBAC9EC,KAAK,EAAE,6BAA6B;gBACpCC,IAAI,EAAE;AAAC,uCAAmB;AAAE,sCAAkB;AAAE,sCAAkB;AAAE,uCAAmB;AAAE,wCAAoB;iBAAC;gBAC9GC,MAAM,EAAE,QAAQ;aACjB;SACF;QACDC,KAAK,EAAE;AAAC,yBAAa;AAAE,yBAAa;AAAE,yBAAa;AAAE,yBAAa;AAAE,yBAAa;SAAC;QAClFC,OAAO,EAAE,KAAK;KACf,AAAC;IAEF,0EAA0E;IAC1E,MAAMC,WAAW,GAAG;AAAC,SAAC;AAAE,0BAAkB;KAAC,AAAC,EAAC,qDAAqD;IAElG,MAAMC,OAAO,GAAG,IAAI,AAAC,EAAC,kCAAkC;IAExD,MAAMC,mBAAmB,GAAG;QAC1B;YACEC,IAAI,EAAE,0BAA0B;YAChCC,QAAQ,EAAE,CAAC;YACXC,WAAW,EAAE,6BAA6B;YAC1CC,UAAU,EAAE,wEAAwE;YACpFC,SAAS,EAAE,CAAC;YACZC,CAAC,EAAE,aAAa;YAChBC,CAAC,EAAE,kBAAkB;SACtB;KACF,AAAC;IAEFC,EAAE,CAAC,gEAAgE,EAAE,IAAM;QACzEC,MAAM,CAACtB,eAAe,CAACE,SAAS,EAAES,WAAW,EAAEC,OAAO,CAAC,CAAC,CAACW,OAAO,CAACV,mBAAmB,CAAC,CAAC;IACxF,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
1
+ {"version":3,"sources":["../../src/Tooltip/focused-series.test.ts"],"sourcesContent":["// Copyright 2022 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 { EChartsDataFormat, UnitOptions } from '../model';\nimport { getNearbySeries } from './focused-series';\n\ndescribe('getNearbySeries', () => {\n const chartData: EChartsDataFormat = {\n timeSeries: [\n {\n type: 'line',\n name: 'env=\"demo\", instance=\"demo.do.prometheus\", job=\"node\", mode=\"test\"',\n color: 'hsla(-1365438424,50%,50%,0.8)',\n data: [\n 0.0002315202231525094, 0.00022873082287300112, 0.00023152022315149463, 0.00023152022315149463,\n 0.00022873082287300112,\n ],\n symbol: 'circle',\n },\n {\n type: 'line',\n name: 'env=\"demo\", instance=\"demo.do.prometheus\", job=\"node\", mode=\"test alt\"',\n color: 'hsla(286664040,50%,50%,0.8)',\n data: [0.05245188284519867, 0.0524463040446356, 0.0524463040446356, 0.05247140864723438, 0.052482566248230646],\n symbol: 'circle',\n },\n ],\n xAxis: [1654007865000, 1654007880000, 1654007895000, 1654007910000, 1654007925000],\n rangeMs: 60000,\n };\n\n // https://echarts.apache.org/en/api.html#echartsInstance.convertFromPixel\n const pointInGrid = [2, 0.0560655737704918]; // converted from chart.getZr() mousemove coordinates\n\n const yBuffer = 0.02; // calculated from y axis interval\n\n const focusedSeriesOutput = [\n {\n date: 'May 31, 2022, 2:38:15 PM',\n datumIdx: 2,\n markerColor: 'hsla(286664040,50%,50%,0.8)',\n seriesName: 'env=\"demo\", instance=\"demo.do.prometheus\", job=\"node\", mode=\"test alt\"',\n seriesIdx: 1,\n x: 1654007895000,\n y: 0.0524463040446356,\n formattedY: '0.05',\n },\n ];\n\n it('should return focused series data for points nearby the cursor', () => {\n const decimalUnit: UnitOptions = {\n kind: 'Decimal',\n decimal_places: 2,\n };\n expect(getNearbySeries(chartData, pointInGrid, yBuffer, decimalUnit)).toEqual(focusedSeriesOutput);\n });\n\n it('should return series values formatted as a percent', () => {\n const percentFormattedOutput = [...focusedSeriesOutput];\n if (percentFormattedOutput[0]) {\n percentFormattedOutput[0].formattedY = '5%';\n }\n const percentFormattedUnit: UnitOptions = {\n kind: 'PercentDecimal',\n decimal_places: 0,\n };\n expect(getNearbySeries(chartData, pointInGrid, yBuffer, percentFormattedUnit)).toEqual(percentFormattedOutput);\n });\n});\n"],"names":["getNearbySeries","describe","chartData","timeSeries","type","name","color","data","symbol","xAxis","rangeMs","pointInGrid","yBuffer","focusedSeriesOutput","date","datumIdx","markerColor","seriesName","seriesIdx","x","y","formattedY","it","decimalUnit","kind","decimal_places","expect","toEqual","percentFormattedOutput","percentFormattedUnit"],"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;AAGjC,SAASA,eAAe,QAAQ,kBAAkB,CAAC;AAEnDC,QAAQ,CAAC,iBAAiB,EAAE,IAAM;IAChC,MAAMC,SAAS,GAAsB;QACnCC,UAAU,EAAE;YACV;gBACEC,IAAI,EAAE,MAAM;gBACZC,IAAI,EAAE,oEAAoE;gBAC1EC,KAAK,EAAE,+BAA+B;gBACtCC,IAAI,EAAE;AACJ,yCAAqB;AAAE,0CAAsB;AAAE,0CAAsB;AAAE,0CAAsB;AAC7F,0CAAsB;iBACvB;gBACDC,MAAM,EAAE,QAAQ;aACjB;YACD;gBACEJ,IAAI,EAAE,MAAM;gBACZC,IAAI,EAAE,wEAAwE;gBAC9EC,KAAK,EAAE,6BAA6B;gBACpCC,IAAI,EAAE;AAAC,uCAAmB;AAAE,sCAAkB;AAAE,sCAAkB;AAAE,uCAAmB;AAAE,wCAAoB;iBAAC;gBAC9GC,MAAM,EAAE,QAAQ;aACjB;SACF;QACDC,KAAK,EAAE;AAAC,yBAAa;AAAE,yBAAa;AAAE,yBAAa;AAAE,yBAAa;AAAE,yBAAa;SAAC;QAClFC,OAAO,EAAE,KAAK;KACf,AAAC;IAEF,0EAA0E;IAC1E,MAAMC,WAAW,GAAG;AAAC,SAAC;AAAE,0BAAkB;KAAC,AAAC,EAAC,qDAAqD;IAElG,MAAMC,OAAO,GAAG,IAAI,AAAC,EAAC,kCAAkC;IAExD,MAAMC,mBAAmB,GAAG;QAC1B;YACEC,IAAI,EAAE,0BAA0B;YAChCC,QAAQ,EAAE,CAAC;YACXC,WAAW,EAAE,6BAA6B;YAC1CC,UAAU,EAAE,wEAAwE;YACpFC,SAAS,EAAE,CAAC;YACZC,CAAC,EAAE,aAAa;YAChBC,CAAC,EAAE,kBAAkB;YACrBC,UAAU,EAAE,MAAM;SACnB;KACF,AAAC;IAEFC,EAAE,CAAC,gEAAgE,EAAE,IAAM;QACzE,MAAMC,WAAW,GAAgB;YAC/BC,IAAI,EAAE,SAAS;YACfC,cAAc,EAAE,CAAC;SAClB,AAAC;QACFC,MAAM,CAAC1B,eAAe,CAACE,SAAS,EAAES,WAAW,EAAEC,OAAO,EAAEW,WAAW,CAAC,CAAC,CAACI,OAAO,CAACd,mBAAmB,CAAC,CAAC;IACrG,CAAC,CAAC,CAAC;IAEHS,EAAE,CAAC,oDAAoD,EAAE,IAAM;QAC7D,MAAMM,sBAAsB,GAAG;eAAIf,mBAAmB;SAAC,AAAC;QACxD,IAAIe,sBAAsB,CAAC,CAAC,CAAC,EAAE;YAC7BA,sBAAsB,CAAC,CAAC,CAAC,CAACP,UAAU,GAAG,IAAI,CAAC;QAC9C,CAAC;QACD,MAAMQ,oBAAoB,GAAgB;YACxCL,IAAI,EAAE,gBAAgB;YACtBC,cAAc,EAAE,CAAC;SAClB,AAAC;QACFC,MAAM,CAAC1B,eAAe,CAACE,SAAS,EAAES,WAAW,EAAEC,OAAO,EAAEiB,oBAAoB,CAAC,CAAC,CAACF,OAAO,CAACC,sBAAsB,CAAC,CAAC;IACjH,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
@@ -0,0 +1,8 @@
1
+ /// <reference types="react" />
2
+ import { UnitOptions } from '../model';
3
+ export interface UnitSelectorProps {
4
+ value: UnitOptions;
5
+ onChange: (unit: UnitOptions) => void;
6
+ }
7
+ export declare function UnitSelector({ value, onChange }: UnitSelectorProps): JSX.Element;
8
+ //# sourceMappingURL=UnitSelector.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"UnitSelector.d.ts","sourceRoot":"","sources":["../../src/UnitSelector/UnitSelector.tsx"],"names":[],"mappings":";AAaA,OAAO,EACL,WAAW,EAMZ,MAAM,UAAU,CAAC;AAGlB,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,WAAW,CAAC;IACnB,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;CACvC;AAeD,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,iBAAiB,eAiFlE"}
@@ -0,0 +1,112 @@
1
+ // Copyright 2022 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
14
+ import { Box, Switch, TextField, Autocomplete } from '@mui/material';
15
+ import { UNIT_CONFIG, DEFAULT_DECIMAL_PLACES, isUnitWithDecimalPlaces, isUnitWithAbbreviate } from '../model';
16
+ import { OptionsEditorControl } from '../OptionsEditorLayout';
17
+ const KIND_OPTIONS = Object.entries(UNIT_CONFIG).map(([id, config])=>{
18
+ return {
19
+ id: id,
20
+ ...config
21
+ };
22
+ }).filter((config)=>!config.disableSelectorOption);
23
+ const DECIMAL_OPTIONS = [
24
+ 0,
25
+ 1,
26
+ 2,
27
+ 3,
28
+ 4
29
+ ];
30
+ export function UnitSelector({ value , onChange }) {
31
+ const hasDecimalPlaces = isUnitWithDecimalPlaces(value);
32
+ const hasAbbreviate = isUnitWithAbbreviate(value);
33
+ const handleKindChange = (_, newValue)=>{
34
+ onChange({
35
+ kind: newValue.id
36
+ });
37
+ };
38
+ const handleDecimalChange = (_, newValue)=>{
39
+ if (hasDecimalPlaces) {
40
+ onChange({
41
+ ...value,
42
+ decimal_places: newValue
43
+ });
44
+ }
45
+ };
46
+ const handleAbbreviateChange = (_, checked)=>{
47
+ if (hasAbbreviate) {
48
+ onChange({
49
+ ...value,
50
+ abbreviate: checked
51
+ });
52
+ }
53
+ };
54
+ const kindConfig = UNIT_CONFIG[value.kind];
55
+ var _decimal_places;
56
+ return /*#__PURE__*/ _jsxs(_Fragment, {
57
+ children: [
58
+ /*#__PURE__*/ _jsx(OptionsEditorControl, {
59
+ label: "Abbreviate",
60
+ control: /*#__PURE__*/ _jsx(Switch, {
61
+ checked: hasAbbreviate ? !!value.abbreviate : false,
62
+ onChange: handleAbbreviateChange,
63
+ disabled: !hasAbbreviate
64
+ })
65
+ }),
66
+ /*#__PURE__*/ _jsx(OptionsEditorControl, {
67
+ label: "Units",
68
+ control: /*#__PURE__*/ _jsx(Autocomplete, {
69
+ value: {
70
+ id: value.kind,
71
+ ...kindConfig
72
+ },
73
+ options: KIND_OPTIONS,
74
+ isOptionEqualToValue: (option, value)=>option.id === value.id,
75
+ groupBy: (option)=>option.group,
76
+ renderInput: (params)=>/*#__PURE__*/ _jsx(TextField, {
77
+ ...params
78
+ }),
79
+ renderOption: (renderOptsProps, option)=>{
80
+ // Custom option needed to get some increased left padding to make
81
+ // the items more distinct from the group label.
82
+ return /*#__PURE__*/ _jsx("li", {
83
+ ...renderOptsProps,
84
+ children: /*#__PURE__*/ _jsx(Box, {
85
+ paddingLeft: (theme)=>theme.spacing(1),
86
+ children: option.label
87
+ })
88
+ });
89
+ },
90
+ onChange: handleKindChange,
91
+ disableClearable: true
92
+ })
93
+ }),
94
+ /*#__PURE__*/ _jsx(OptionsEditorControl, {
95
+ label: "Decimal",
96
+ control: /*#__PURE__*/ _jsx(Autocomplete, {
97
+ value: hasDecimalPlaces ? (_decimal_places = value.decimal_places) !== null && _decimal_places !== void 0 ? _decimal_places : DEFAULT_DECIMAL_PLACES : 0,
98
+ options: DECIMAL_OPTIONS,
99
+ getOptionLabel: (option)=>`${option}`,
100
+ renderInput: (params)=>/*#__PURE__*/ _jsx(TextField, {
101
+ ...params
102
+ }),
103
+ onChange: handleDecimalChange,
104
+ disabled: !hasDecimalPlaces,
105
+ disableClearable: true
106
+ })
107
+ })
108
+ ]
109
+ });
110
+ }
111
+
112
+ //# sourceMappingURL=UnitSelector.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/UnitSelector/UnitSelector.tsx"],"sourcesContent":["// Copyright 2022 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.\nimport { Box, Switch, TextField, Autocomplete, SwitchProps } from '@mui/material';\nimport {\n UnitOptions,\n UNIT_CONFIG,\n DEFAULT_DECIMAL_PLACES,\n UnitConfig,\n isUnitWithDecimalPlaces,\n isUnitWithAbbreviate,\n} from '../model';\nimport { OptionsEditorControl } from '../OptionsEditorLayout';\n\nexport interface UnitSelectorProps {\n value: UnitOptions;\n onChange: (unit: UnitOptions) => void;\n}\n\ntype AutocompleteKindOption = UnitConfig & { id: UnitOptions['kind'] };\n\nconst KIND_OPTIONS: AutocompleteKindOption[] = Object.entries(UNIT_CONFIG)\n .map(([id, config]) => {\n return {\n id: id as UnitOptions['kind'],\n ...config,\n };\n })\n .filter((config) => !config.disableSelectorOption);\n\nconst DECIMAL_OPTIONS = [0, 1, 2, 3, 4];\n\nexport function UnitSelector({ value, onChange }: UnitSelectorProps) {\n const hasDecimalPlaces = isUnitWithDecimalPlaces(value);\n const hasAbbreviate = isUnitWithAbbreviate(value);\n\n const handleKindChange = (_: unknown, newValue: AutocompleteKindOption) => {\n onChange({\n kind: newValue.id,\n });\n };\n\n const handleDecimalChange = (_: unknown, newValue: number) => {\n if (hasDecimalPlaces) {\n onChange({\n ...value,\n decimal_places: newValue,\n });\n }\n };\n\n const handleAbbreviateChange: SwitchProps['onChange'] = (_: unknown, checked: boolean) => {\n if (hasAbbreviate) {\n onChange({\n ...value,\n abbreviate: checked,\n });\n }\n };\n\n const kindConfig = UNIT_CONFIG[value.kind];\n\n return (\n <>\n <OptionsEditorControl\n label=\"Abbreviate\"\n control={\n <Switch\n checked={hasAbbreviate ? !!value.abbreviate : false}\n onChange={handleAbbreviateChange}\n disabled={!hasAbbreviate}\n />\n }\n />\n <OptionsEditorControl\n label=\"Units\"\n control={\n <Autocomplete\n value={{ id: value.kind, ...kindConfig }}\n options={KIND_OPTIONS}\n isOptionEqualToValue={(option, value) => option.id === value.id}\n groupBy={(option) => option.group}\n renderInput={(params) => <TextField {...params} />}\n renderOption={(renderOptsProps, option) => {\n // Custom option needed to get some increased left padding to make\n // the items more distinct from the group label.\n return (\n <li {...renderOptsProps}>\n <Box paddingLeft={(theme) => theme.spacing(1)}>{option.label}</Box>\n </li>\n );\n }}\n onChange={handleKindChange}\n disableClearable\n ></Autocomplete>\n }\n />\n <OptionsEditorControl\n label=\"Decimal\"\n control={\n <Autocomplete\n value={hasDecimalPlaces ? value.decimal_places ?? DEFAULT_DECIMAL_PLACES : 0}\n options={DECIMAL_OPTIONS}\n getOptionLabel={(option) => `${option}`}\n renderInput={(params) => <TextField {...params} />}\n onChange={handleDecimalChange}\n disabled={!hasDecimalPlaces}\n disableClearable\n ></Autocomplete>\n }\n />\n </>\n );\n}\n"],"names":["Box","Switch","TextField","Autocomplete","UNIT_CONFIG","DEFAULT_DECIMAL_PLACES","isUnitWithDecimalPlaces","isUnitWithAbbreviate","OptionsEditorControl","KIND_OPTIONS","Object","entries","map","id","config","filter","disableSelectorOption","DECIMAL_OPTIONS","UnitSelector","value","onChange","hasDecimalPlaces","hasAbbreviate","handleKindChange","_","newValue","kind","handleDecimalChange","decimal_places","handleAbbreviateChange","checked","abbreviate","kindConfig","label","control","disabled","options","isOptionEqualToValue","option","groupBy","group","renderInput","params","renderOption","renderOptsProps","li","paddingLeft","theme","spacing","disableClearable","getOptionLabel"],"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;AACjC;AAAA,SAASA,GAAG,EAAEC,MAAM,EAAEC,SAAS,EAAEC,YAAY,QAAqB,eAAe,CAAC;AAClF,SAEEC,WAAW,EACXC,sBAAsB,EAEtBC,uBAAuB,EACvBC,oBAAoB,QACf,UAAU,CAAC;AAClB,SAASC,oBAAoB,QAAQ,wBAAwB,CAAC;AAS9D,MAAMC,YAAY,GAA6BC,MAAM,CAACC,OAAO,CAACP,WAAW,CAAC,CACvEQ,GAAG,CAAC,CAAC,CAACC,EAAE,EAAEC,MAAM,CAAC,GAAK;IACrB,OAAO;QACLD,EAAE,EAAEA,EAAE;QACN,GAAGC,MAAM;KACV,CAAC;AACJ,CAAC,CAAC,CACDC,MAAM,CAAC,CAACD,MAAM,GAAK,CAACA,MAAM,CAACE,qBAAqB,CAAC,AAAC;AAErD,MAAMC,eAAe,GAAG;AAAC,KAAC;AAAE,KAAC;AAAE,KAAC;AAAE,KAAC;AAAE,KAAC;CAAC,AAAC;AAExC,OAAO,SAASC,YAAY,CAAC,EAAEC,KAAK,CAAA,EAAEC,QAAQ,CAAA,EAAqB,EAAE;IACnE,MAAMC,gBAAgB,GAAGf,uBAAuB,CAACa,KAAK,CAAC,AAAC;IACxD,MAAMG,aAAa,GAAGf,oBAAoB,CAACY,KAAK,CAAC,AAAC;IAElD,MAAMI,gBAAgB,GAAG,CAACC,CAAU,EAAEC,QAAgC,GAAK;QACzEL,QAAQ,CAAC;YACPM,IAAI,EAAED,QAAQ,CAACZ,EAAE;SAClB,CAAC,CAAC;IACL,CAAC,AAAC;IAEF,MAAMc,mBAAmB,GAAG,CAACH,CAAU,EAAEC,QAAgB,GAAK;QAC5D,IAAIJ,gBAAgB,EAAE;YACpBD,QAAQ,CAAC;gBACP,GAAGD,KAAK;gBACRS,cAAc,EAAEH,QAAQ;aACzB,CAAC,CAAC;QACL,CAAC;IACH,CAAC,AAAC;IAEF,MAAMI,sBAAsB,GAA4B,CAACL,CAAU,EAAEM,OAAgB,GAAK;QACxF,IAAIR,aAAa,EAAE;YACjBF,QAAQ,CAAC;gBACP,GAAGD,KAAK;gBACRY,UAAU,EAAED,OAAO;aACpB,CAAC,CAAC;QACL,CAAC;IACH,CAAC,AAAC;IAEF,MAAME,UAAU,GAAG5B,WAAW,CAACe,KAAK,CAACO,IAAI,CAAC,AAAC;QAyCPP,eAAoB;IAvCxD,qBACE;;0BACE,KAACX,oBAAoB;gBACnByB,KAAK,EAAC,YAAY;gBAClBC,OAAO,gBACL,KAACjC,MAAM;oBACL6B,OAAO,EAAER,aAAa,GAAG,CAAC,CAACH,KAAK,CAACY,UAAU,GAAG,KAAK;oBACnDX,QAAQ,EAAES,sBAAsB;oBAChCM,QAAQ,EAAE,CAACb,aAAa;kBACxB;cAEJ;0BACF,KAACd,oBAAoB;gBACnByB,KAAK,EAAC,OAAO;gBACbC,OAAO,gBACL,KAAC/B,YAAY;oBACXgB,KAAK,EAAE;wBAAEN,EAAE,EAAEM,KAAK,CAACO,IAAI;wBAAE,GAAGM,UAAU;qBAAE;oBACxCI,OAAO,EAAE3B,YAAY;oBACrB4B,oBAAoB,EAAE,CAACC,MAAM,EAAEnB,KAAK,GAAKmB,MAAM,CAACzB,EAAE,KAAKM,KAAK,CAACN,EAAE;oBAC/D0B,OAAO,EAAE,CAACD,MAAM,GAAKA,MAAM,CAACE,KAAK;oBACjCC,WAAW,EAAE,CAACC,MAAM,iBAAK,KAACxC,SAAS;4BAAE,GAAGwC,MAAM;0BAAI;oBAClDC,YAAY,EAAE,CAACC,eAAe,EAAEN,MAAM,GAAK;wBACzC,kEAAkE;wBAClE,gDAAgD;wBAChD,qBACE,KAACO,IAAE;4BAAE,GAAGD,eAAe;sCACrB,cAAA,KAAC5C,GAAG;gCAAC8C,WAAW,EAAE,CAACC,KAAK,GAAKA,KAAK,CAACC,OAAO,CAAC,CAAC,CAAC;0CAAGV,MAAM,CAACL,KAAK;8BAAO;0BAChE,CACL;oBACJ,CAAC;oBACDb,QAAQ,EAAEG,gBAAgB;oBAC1B0B,gBAAgB;kBACF;cAElB;0BACF,KAACzC,oBAAoB;gBACnByB,KAAK,EAAC,SAAS;gBACfC,OAAO,gBACL,KAAC/B,YAAY;oBACXgB,KAAK,EAAEE,gBAAgB,GAAGF,CAAAA,eAAoB,GAApBA,KAAK,CAACS,cAAc,cAApBT,eAAoB,cAApBA,eAAoB,GAAId,sBAAsB,GAAG,CAAC;oBAC5E+B,OAAO,EAAEnB,eAAe;oBACxBiC,cAAc,EAAE,CAACZ,MAAM,GAAK,CAAC,EAAEA,MAAM,CAAC,CAAC;oBACvCG,WAAW,EAAE,CAACC,MAAM,iBAAK,KAACxC,SAAS;4BAAE,GAAGwC,MAAM;0BAAI;oBAClDtB,QAAQ,EAAEO,mBAAmB;oBAC7BQ,QAAQ,EAAE,CAACd,gBAAgB;oBAC3B4B,gBAAgB;kBACF;cAElB;;MACD,CACH;AACJ,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=UnitSelector.test.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"UnitSelector.test.d.ts","sourceRoot":"","sources":["../../src/UnitSelector/UnitSelector.test.tsx"],"names":[],"mappings":""}
@@ -0,0 +1,211 @@
1
+ // Copyright 2022 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ import { jsx as _jsx } from "react/jsx-runtime";
14
+ import { render, screen } from '@testing-library/react';
15
+ import userEvent from '@testing-library/user-event';
16
+ import { UnitSelector } from './UnitSelector';
17
+ describe('UnitSelector', ()=>{
18
+ const renderUnitSelector = (value, onChange = jest.fn())=>{
19
+ render(/*#__PURE__*/ _jsx("div", {
20
+ children: /*#__PURE__*/ _jsx(UnitSelector, {
21
+ value: value,
22
+ onChange: onChange
23
+ })
24
+ }));
25
+ };
26
+ const getUnitSelector = ()=>{
27
+ return screen.getByRole('combobox', {
28
+ name: 'Units'
29
+ });
30
+ };
31
+ const getDecimalSelector = ()=>{
32
+ return screen.getByRole('combobox', {
33
+ name: 'Decimal'
34
+ });
35
+ };
36
+ const getAbbreviateSwitch = ()=>{
37
+ return screen.getByRole('checkbox', {
38
+ name: 'Abbreviate'
39
+ });
40
+ };
41
+ it('can change the unit kind by clicking', ()=>{
42
+ const onChange = jest.fn();
43
+ renderUnitSelector({
44
+ kind: 'Minutes'
45
+ }, onChange);
46
+ const unitSelector = getUnitSelector();
47
+ userEvent.click(unitSelector);
48
+ const decimalOption = screen.getByRole('option', {
49
+ name: 'Decimal'
50
+ });
51
+ userEvent.click(decimalOption);
52
+ expect(onChange).toHaveBeenCalledWith({
53
+ kind: 'Decimal'
54
+ });
55
+ });
56
+ it('can change the unit kind using a keyboard', ()=>{
57
+ const onChange = jest.fn();
58
+ renderUnitSelector({
59
+ kind: 'Bytes'
60
+ }, onChange);
61
+ const unitSelector = getUnitSelector();
62
+ // Note that this tab order can change depending on the type because the
63
+ // abbreviate comes first and is disabled in some cases.
64
+ userEvent.tab();
65
+ expect(unitSelector).toHaveFocus();
66
+ userEvent.clear(unitSelector);
67
+ userEvent.keyboard('years');
68
+ screen.getByRole('option', {
69
+ name: 'Years'
70
+ });
71
+ userEvent.keyboard('{arrowup}{enter}');
72
+ expect(onChange).toHaveBeenCalledWith({
73
+ kind: 'Years'
74
+ });
75
+ });
76
+ it('can change the decimal places by clicking', ()=>{
77
+ const onChange = jest.fn();
78
+ renderUnitSelector({
79
+ kind: 'Decimal',
80
+ decimal_places: 0,
81
+ abbreviate: true
82
+ }, onChange);
83
+ userEvent.click(getDecimalSelector());
84
+ const decimalOption = screen.getByRole('option', {
85
+ name: '1'
86
+ });
87
+ userEvent.click(decimalOption);
88
+ expect(onChange).toHaveBeenCalledWith({
89
+ kind: 'Decimal',
90
+ decimal_places: 1,
91
+ abbreviate: true
92
+ });
93
+ });
94
+ it('can change the decimal places using a keyboard', ()=>{
95
+ const onChange = jest.fn();
96
+ renderUnitSelector({
97
+ kind: 'Percent'
98
+ }, onChange);
99
+ const decimalSelector = getDecimalSelector();
100
+ userEvent.tab();
101
+ userEvent.tab();
102
+ expect(decimalSelector).toHaveFocus();
103
+ userEvent.clear(decimalSelector);
104
+ userEvent.keyboard('3');
105
+ screen.getByRole('option', {
106
+ name: '3'
107
+ });
108
+ userEvent.keyboard('{arrowup}{enter}');
109
+ expect(onChange).toHaveBeenCalledWith({
110
+ kind: 'Percent',
111
+ decimal_places: 3
112
+ });
113
+ });
114
+ it('can change abbreviate by clicking', ()=>{
115
+ const onChange = jest.fn();
116
+ renderUnitSelector({
117
+ kind: 'Decimal',
118
+ decimal_places: 3,
119
+ abbreviate: true
120
+ }, onChange);
121
+ userEvent.click(getAbbreviateSwitch());
122
+ expect(onChange).toHaveBeenCalledWith({
123
+ kind: 'Decimal',
124
+ decimal_places: 3,
125
+ abbreviate: false
126
+ });
127
+ });
128
+ it('can change abbreviate using a keyboard', ()=>{
129
+ const onChange = jest.fn();
130
+ renderUnitSelector({
131
+ kind: 'Decimal',
132
+ decimal_places: 0
133
+ }, onChange);
134
+ userEvent.tab();
135
+ userEvent.keyboard('{space}');
136
+ expect(onChange).toHaveBeenCalledWith({
137
+ kind: 'Decimal',
138
+ decimal_places: 0,
139
+ abbreviate: true
140
+ });
141
+ });
142
+ describe('with a time unit selected', ()=>{
143
+ it('does not allow the user to modify the decimal places', ()=>{
144
+ renderUnitSelector({
145
+ kind: 'Hours'
146
+ });
147
+ expect(getDecimalSelector()).toBeDisabled();
148
+ });
149
+ it('does not allow the user to set abbreviate', ()=>{
150
+ renderUnitSelector({
151
+ kind: 'Minutes'
152
+ });
153
+ expect(getAbbreviateSwitch()).toBeDisabled();
154
+ });
155
+ });
156
+ describe('with a percent unit selected', ()=>{
157
+ it('allows the user to modify the decimal places', ()=>{
158
+ renderUnitSelector({
159
+ kind: 'Percent'
160
+ });
161
+ expect(getDecimalSelector()).toBeEnabled();
162
+ });
163
+ it('does not allow the user to set abbreviate', ()=>{
164
+ renderUnitSelector({
165
+ kind: 'PercentDecimal'
166
+ });
167
+ expect(getAbbreviateSwitch()).toBeDisabled();
168
+ });
169
+ });
170
+ describe('with a decimal unit selected', ()=>{
171
+ it('allows the user to modify the decimal places', ()=>{
172
+ renderUnitSelector({
173
+ kind: 'Decimal'
174
+ });
175
+ expect(getDecimalSelector()).toBeEnabled();
176
+ });
177
+ it('allows the user to set abbreviate', ()=>{
178
+ renderUnitSelector({
179
+ kind: 'Decimal'
180
+ });
181
+ expect(getAbbreviateSwitch()).toBeEnabled();
182
+ });
183
+ });
184
+ describe('with a bytes unit selected', ()=>{
185
+ it('allows the user to modify the decimal places', ()=>{
186
+ renderUnitSelector({
187
+ kind: 'Bytes'
188
+ });
189
+ expect(getDecimalSelector()).toBeEnabled();
190
+ });
191
+ it('does not allow the user to set abbreviate', ()=>{
192
+ renderUnitSelector({
193
+ kind: 'Bytes'
194
+ });
195
+ expect(getAbbreviateSwitch()).toBeDisabled();
196
+ });
197
+ });
198
+ it('should not show an option for disabled units', ()=>{
199
+ const onChange = jest.fn();
200
+ renderUnitSelector({
201
+ kind: 'Decimal'
202
+ }, onChange);
203
+ userEvent.click(getUnitSelector());
204
+ const percentShorthandOption = screen.queryByRole('option', {
205
+ name: '%'
206
+ });
207
+ expect(percentShorthandOption).not.toBeInTheDocument();
208
+ });
209
+ });
210
+
211
+ //# sourceMappingURL=UnitSelector.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/UnitSelector/UnitSelector.test.tsx"],"sourcesContent":["// Copyright 2022 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 { render, screen } from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport { UnitOptions } from '../model';\nimport { UnitSelector } from './UnitSelector';\n\ndescribe('UnitSelector', () => {\n const renderUnitSelector = (value: UnitOptions, onChange = jest.fn()) => {\n render(\n <div>\n <UnitSelector value={value} onChange={onChange} />\n </div>\n );\n };\n\n const getUnitSelector = () => {\n return screen.getByRole('combobox', { name: 'Units' });\n };\n\n const getDecimalSelector = () => {\n return screen.getByRole('combobox', { name: 'Decimal' });\n };\n\n const getAbbreviateSwitch = () => {\n return screen.getByRole('checkbox', { name: 'Abbreviate' });\n };\n\n it('can change the unit kind by clicking', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Minutes' }, onChange);\n\n const unitSelector = getUnitSelector();\n userEvent.click(unitSelector);\n const decimalOption = screen.getByRole('option', {\n name: 'Decimal',\n });\n userEvent.click(decimalOption);\n\n expect(onChange).toHaveBeenCalledWith({\n kind: 'Decimal',\n });\n });\n\n it('can change the unit kind using a keyboard', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Bytes' }, onChange);\n\n const unitSelector = getUnitSelector();\n // Note that this tab order can change depending on the type because the\n // abbreviate comes first and is disabled in some cases.\n userEvent.tab();\n expect(unitSelector).toHaveFocus();\n\n userEvent.clear(unitSelector);\n userEvent.keyboard('years');\n screen.getByRole('option', {\n name: 'Years',\n });\n\n userEvent.keyboard('{arrowup}{enter}');\n\n expect(onChange).toHaveBeenCalledWith({\n kind: 'Years',\n });\n });\n\n it('can change the decimal places by clicking', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Decimal', decimal_places: 0, abbreviate: true }, onChange);\n\n userEvent.click(getDecimalSelector());\n const decimalOption = screen.getByRole('option', {\n name: '1',\n });\n userEvent.click(decimalOption);\n\n expect(onChange).toHaveBeenCalledWith({\n kind: 'Decimal',\n decimal_places: 1,\n abbreviate: true,\n });\n });\n\n it('can change the decimal places using a keyboard', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Percent' }, onChange);\n\n const decimalSelector = getDecimalSelector();\n userEvent.tab();\n userEvent.tab();\n expect(decimalSelector).toHaveFocus();\n\n userEvent.clear(decimalSelector);\n userEvent.keyboard('3');\n screen.getByRole('option', {\n name: '3',\n });\n\n userEvent.keyboard('{arrowup}{enter}');\n\n expect(onChange).toHaveBeenCalledWith({\n kind: 'Percent',\n decimal_places: 3,\n });\n });\n\n it('can change abbreviate by clicking', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Decimal', decimal_places: 3, abbreviate: true }, onChange);\n\n userEvent.click(getAbbreviateSwitch());\n\n expect(onChange).toHaveBeenCalledWith({\n kind: 'Decimal',\n decimal_places: 3,\n abbreviate: false,\n });\n });\n\n it('can change abbreviate using a keyboard', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Decimal', decimal_places: 0 }, onChange);\n\n userEvent.tab();\n userEvent.keyboard('{space}');\n\n expect(onChange).toHaveBeenCalledWith({\n kind: 'Decimal',\n decimal_places: 0,\n abbreviate: true,\n });\n });\n\n describe('with a time unit selected', () => {\n it('does not allow the user to modify the decimal places', () => {\n renderUnitSelector({ kind: 'Hours' });\n expect(getDecimalSelector()).toBeDisabled();\n });\n\n it('does not allow the user to set abbreviate', () => {\n renderUnitSelector({ kind: 'Minutes' });\n expect(getAbbreviateSwitch()).toBeDisabled();\n });\n });\n\n describe('with a percent unit selected', () => {\n it('allows the user to modify the decimal places', () => {\n renderUnitSelector({ kind: 'Percent' });\n expect(getDecimalSelector()).toBeEnabled();\n });\n\n it('does not allow the user to set abbreviate', () => {\n renderUnitSelector({ kind: 'PercentDecimal' });\n expect(getAbbreviateSwitch()).toBeDisabled();\n });\n });\n\n describe('with a decimal unit selected', () => {\n it('allows the user to modify the decimal places', () => {\n renderUnitSelector({ kind: 'Decimal' });\n expect(getDecimalSelector()).toBeEnabled();\n });\n\n it('allows the user to set abbreviate', () => {\n renderUnitSelector({ kind: 'Decimal' });\n expect(getAbbreviateSwitch()).toBeEnabled();\n });\n });\n\n describe('with a bytes unit selected', () => {\n it('allows the user to modify the decimal places', () => {\n renderUnitSelector({ kind: 'Bytes' });\n expect(getDecimalSelector()).toBeEnabled();\n });\n\n it('does not allow the user to set abbreviate', () => {\n renderUnitSelector({ kind: 'Bytes' });\n expect(getAbbreviateSwitch()).toBeDisabled();\n });\n });\n\n it('should not show an option for disabled units', () => {\n const onChange = jest.fn();\n renderUnitSelector({ kind: 'Decimal' }, onChange);\n\n userEvent.click(getUnitSelector());\n const percentShorthandOption = screen.queryByRole('option', {\n name: '%',\n });\n expect(percentShorthandOption).not.toBeInTheDocument();\n });\n});\n"],"names":["render","screen","userEvent","UnitSelector","describe","renderUnitSelector","value","onChange","jest","fn","div","getUnitSelector","getByRole","name","getDecimalSelector","getAbbreviateSwitch","it","kind","unitSelector","click","decimalOption","expect","toHaveBeenCalledWith","tab","toHaveFocus","clear","keyboard","decimal_places","abbreviate","decimalSelector","toBeDisabled","toBeEnabled","percentShorthandOption","queryByRole","not","toBeInTheDocument"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ export * from './UnitSelector';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/UnitSelector/index.ts"],"names":[],"mappings":"AAaA,cAAc,gBAAgB,CAAC"}
@@ -0,0 +1,15 @@
1
+ // Copyright 2022 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ export * from './UnitSelector';
14
+
15
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/UnitSelector/index.ts"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './UnitSelector';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,gBAAgB,CAAC"}