@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.
Files changed (140) hide show
  1. package/README.md +1 -0
  2. package/dist/BarChart/BarChart.d.ts +16 -0
  3. package/dist/BarChart/BarChart.d.ts.map +1 -0
  4. package/dist/BarChart/BarChart.js +129 -0
  5. package/dist/BarChart/BarChart.js.map +1 -0
  6. package/dist/BarChart/index.d.ts +2 -0
  7. package/dist/BarChart/index.d.ts.map +1 -0
  8. package/dist/BarChart/index.js +15 -0
  9. package/dist/BarChart/index.js.map +1 -0
  10. package/dist/Dialog/DiscardChangesConfirmationDialog.d.ts +10 -0
  11. package/dist/Dialog/DiscardChangesConfirmationDialog.d.ts.map +1 -0
  12. package/dist/Dialog/DiscardChangesConfirmationDialog.js +47 -0
  13. package/dist/Dialog/DiscardChangesConfirmationDialog.js.map +1 -0
  14. package/dist/Dialog/index.d.ts +1 -0
  15. package/dist/Dialog/index.d.ts.map +1 -1
  16. package/dist/Dialog/index.js +1 -0
  17. package/dist/Dialog/index.js.map +1 -1
  18. package/dist/GaugeChart/GaugeChart.js +1 -1
  19. package/dist/GaugeChart/GaugeChart.js.map +1 -1
  20. package/dist/Legend/ListLegendItem.d.ts +1 -1
  21. package/dist/LineChart/LineChart.d.ts.map +1 -1
  22. package/dist/LineChart/LineChart.js +9 -9
  23. package/dist/LineChart/LineChart.js.map +1 -1
  24. package/dist/ModeSelector/ModeSelector.d.ts +9 -0
  25. package/dist/ModeSelector/ModeSelector.d.ts.map +1 -0
  26. package/dist/ModeSelector/ModeSelector.js +43 -0
  27. package/dist/ModeSelector/ModeSelector.js.map +1 -0
  28. package/dist/ModeSelector/index.d.ts +2 -0
  29. package/dist/ModeSelector/index.d.ts.map +1 -0
  30. package/dist/ModeSelector/index.js +15 -0
  31. package/dist/ModeSelector/index.js.map +1 -0
  32. package/dist/SortSelector/SortSelector.d.ts +8 -0
  33. package/dist/SortSelector/SortSelector.d.ts.map +1 -0
  34. package/dist/SortSelector/SortSelector.js +42 -0
  35. package/dist/SortSelector/SortSelector.js.map +1 -0
  36. package/dist/SortSelector/index.d.ts +2 -0
  37. package/dist/SortSelector/index.d.ts.map +1 -0
  38. package/dist/SortSelector/index.js +15 -0
  39. package/dist/SortSelector/index.js.map +1 -0
  40. package/dist/StatChart/StatChart.js +1 -1
  41. package/dist/StatChart/StatChart.js.map +1 -1
  42. package/dist/StatChart/calculateFontSize.js +3 -3
  43. package/dist/StatChart/calculateFontSize.js.map +1 -1
  44. package/dist/ThresholdsEditor/ThresholdColorPicker.js +1 -1
  45. package/dist/ThresholdsEditor/ThresholdColorPicker.js.map +1 -1
  46. package/dist/ThresholdsEditor/ThresholdsEditor.d.ts.map +1 -1
  47. package/dist/ThresholdsEditor/ThresholdsEditor.js +3 -2
  48. package/dist/ThresholdsEditor/ThresholdsEditor.js.map +1 -1
  49. package/dist/TimeChart/TimeChart.d.ts +2 -1
  50. package/dist/TimeChart/TimeChart.d.ts.map +1 -1
  51. package/dist/TimeChart/TimeChart.js +120 -36
  52. package/dist/TimeChart/TimeChart.js.map +1 -1
  53. package/dist/TimeSeriesTooltip/LineChartTooltip.d.ts +6 -0
  54. package/dist/TimeSeriesTooltip/LineChartTooltip.d.ts.map +1 -1
  55. package/dist/TimeSeriesTooltip/LineChartTooltip.js +14 -6
  56. package/dist/TimeSeriesTooltip/LineChartTooltip.js.map +1 -1
  57. package/dist/TimeSeriesTooltip/TimeChartTooltip.d.ts +1 -0
  58. package/dist/TimeSeriesTooltip/TimeChartTooltip.d.ts.map +1 -1
  59. package/dist/TimeSeriesTooltip/TimeChartTooltip.js +3 -2
  60. package/dist/TimeSeriesTooltip/TimeChartTooltip.js.map +1 -1
  61. package/dist/TimeSeriesTooltip/TooltipHeader.d.ts +1 -0
  62. package/dist/TimeSeriesTooltip/TooltipHeader.d.ts.map +1 -1
  63. package/dist/TimeSeriesTooltip/TooltipHeader.js +5 -5
  64. package/dist/TimeSeriesTooltip/TooltipHeader.js.map +1 -1
  65. package/dist/TimeSeriesTooltip/nearby-series.d.ts +1 -1
  66. package/dist/TimeSeriesTooltip/nearby-series.d.ts.map +1 -1
  67. package/dist/TimeSeriesTooltip/nearby-series.js +97 -110
  68. package/dist/TimeSeriesTooltip/nearby-series.js.map +1 -1
  69. package/dist/TimeSeriesTooltip/tooltip-model.d.ts +4 -0
  70. package/dist/TimeSeriesTooltip/tooltip-model.d.ts.map +1 -1
  71. package/dist/TimeSeriesTooltip/tooltip-model.js +6 -0
  72. package/dist/TimeSeriesTooltip/tooltip-model.js.map +1 -1
  73. package/dist/UnitSelector/UnitSelector.d.ts +2 -1
  74. package/dist/UnitSelector/UnitSelector.d.ts.map +1 -1
  75. package/dist/UnitSelector/UnitSelector.js +3 -2
  76. package/dist/UnitSelector/UnitSelector.js.map +1 -1
  77. package/dist/cjs/BarChart/BarChart.js +135 -0
  78. package/dist/cjs/BarChart/index.js +28 -0
  79. package/dist/cjs/Dialog/DiscardChangesConfirmationDialog.js +53 -0
  80. package/dist/cjs/Dialog/index.js +1 -0
  81. package/dist/cjs/GaugeChart/GaugeChart.js +2 -2
  82. package/dist/cjs/LineChart/LineChart.js +8 -8
  83. package/dist/cjs/ModeSelector/ModeSelector.js +49 -0
  84. package/dist/cjs/ModeSelector/index.js +28 -0
  85. package/dist/cjs/SortSelector/SortSelector.js +48 -0
  86. package/dist/cjs/SortSelector/index.js +28 -0
  87. package/dist/cjs/StatChart/StatChart.js +2 -2
  88. package/dist/cjs/StatChart/calculateFontSize.js +3 -3
  89. package/dist/cjs/ThresholdsEditor/ThresholdColorPicker.js +2 -2
  90. package/dist/cjs/ThresholdsEditor/ThresholdsEditor.js +3 -2
  91. package/dist/cjs/TimeChart/TimeChart.js +121 -32
  92. package/dist/cjs/TimeSeriesTooltip/LineChartTooltip.js +13 -5
  93. package/dist/cjs/TimeSeriesTooltip/TimeChartTooltip.js +3 -2
  94. package/dist/cjs/TimeSeriesTooltip/TooltipHeader.js +4 -4
  95. package/dist/cjs/TimeSeriesTooltip/nearby-series.js +97 -110
  96. package/dist/cjs/TimeSeriesTooltip/tooltip-model.js +10 -1
  97. package/dist/cjs/UnitSelector/UnitSelector.js +3 -2
  98. package/dist/cjs/context/{ChartsThemeProvider.js → ChartsProvider.js} +24 -5
  99. package/dist/cjs/context/index.js +30 -0
  100. package/dist/cjs/index.js +4 -3
  101. package/dist/cjs/model/graph.js +35 -3
  102. package/dist/cjs/test-utils/theme.js +32 -19
  103. package/dist/cjs/utils/axis.js +4 -4
  104. package/dist/cjs/utils/chart-actions.js +99 -1
  105. package/dist/cjs/utils/theme-gen.js +34 -6
  106. package/dist/context/ChartsProvider.d.ts +19 -0
  107. package/dist/context/ChartsProvider.d.ts.map +1 -0
  108. package/dist/context/{ChartsThemeProvider.js → ChartsProvider.js} +24 -6
  109. package/dist/context/ChartsProvider.js.map +1 -0
  110. package/dist/context/index.d.ts +4 -0
  111. package/dist/context/index.d.ts.map +1 -0
  112. package/dist/context/index.js +17 -0
  113. package/dist/context/index.js.map +1 -0
  114. package/dist/index.d.ts +4 -3
  115. package/dist/index.d.ts.map +1 -1
  116. package/dist/index.js +4 -3
  117. package/dist/index.js.map +1 -1
  118. package/dist/model/graph.d.ts +11 -2
  119. package/dist/model/graph.d.ts.map +1 -1
  120. package/dist/model/graph.js +25 -0
  121. package/dist/model/graph.js.map +1 -1
  122. package/dist/test-utils/theme.d.ts +2 -0
  123. package/dist/test-utils/theme.d.ts.map +1 -1
  124. package/dist/test-utils/theme.js +23 -16
  125. package/dist/test-utils/theme.js.map +1 -1
  126. package/dist/utils/axis.d.ts +3 -3
  127. package/dist/utils/axis.d.ts.map +1 -1
  128. package/dist/utils/axis.js +4 -4
  129. package/dist/utils/axis.js.map +1 -1
  130. package/dist/utils/chart-actions.d.ts +7 -0
  131. package/dist/utils/chart-actions.d.ts.map +1 -1
  132. package/dist/utils/chart-actions.js +108 -0
  133. package/dist/utils/chart-actions.js.map +1 -1
  134. package/dist/utils/theme-gen.d.ts.map +1 -1
  135. package/dist/utils/theme-gen.js +34 -6
  136. package/dist/utils/theme-gen.js.map +1 -1
  137. package/package.json +3 -3
  138. package/dist/context/ChartsThemeProvider.d.ts +0 -10
  139. package/dist/context/ChartsThemeProvider.d.ts.map +0 -1
  140. package/dist/context/ChartsThemeProvider.js.map +0 -1
@@ -75,6 +75,10 @@ export declare const useMousePosition: () => CursorData['coords'];
75
75
  export declare type TooltipConfig = {
76
76
  wrapLabels: boolean;
77
77
  hidden?: boolean;
78
+ enablePinning?: boolean;
78
79
  };
80
+ export declare const DEFAULT_TOOLTIP_CONFIG: TooltipConfig;
81
+ export declare const PIN_TOOLTIP_HELP_TEXT = "Click chart to pin";
82
+ export declare const UNPIN_TOOLTIP_HELP_TEXT = "Click chart to unpin";
79
83
  export {};
80
84
  //# sourceMappingURL=tooltip-model.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"tooltip-model.d.ts","sourceRoot":"","sources":["../../src/TimeSeriesTooltip/tooltip-model.ts"],"names":[],"mappings":"AAcA,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAEpD,eAAO,MAAM,iBAAiB,MAAM,CAAC;AACrC,eAAO,MAAM,iBAAiB,MAAM,CAAC;AACrC,eAAO,MAAM,kBAAkB,MAAM,CAAC;AACtC,eAAO,MAAM,wBAAwB,QAA0B,CAAC;AAChE,eAAO,MAAM,+BAA+B,OAAO,CAAC;AACpD,eAAO,MAAM,eAAe,IAAI,CAAC;AAEjC,eAAO,MAAM,oBAAoB,MAAM,CAAC;AAExC,eAAO,MAAM,yBAAyB,qCAAqC,CAAC;AAC5E,eAAO,MAAM,6BAA6B,iDAAiD,CAAC;AAE5F,eAAO,MAAM,yBAAyB,YAAY,CAAC;AAEnD,eAAO,MAAM,mBAAmB,qBAQ9B,CAAC;AAEH,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;CAa7B,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;CAG5B,CAAC;AAEF,MAAM,WAAW,UAAU;IACzB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC;IACnB,UAAU,EAAE,UAAU,CAAC;IACvB,OAAO,CAAC,EAAE;QACR,CAAC,CAAC,EAAE,MAAM,CAAC;QACX,CAAC,CAAC,EAAE,MAAM,CAAC;KACZ,CAAC;IACF,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;CAC5B;AAED,MAAM,WAAW,UAAU;IACzB,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAAC;IACjC,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,WAAW;IAC1B,aAAa,EAAE,iBAAiB,GAAG,IAAI,CAAC;IACxC,MAAM,EAAE,UAAU,CAAC;CACpB;AAED,aAAK,iBAAiB,GAAG;IACvB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,cAAc,GAAG,gBAAgB,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,oBAAY,eAAe,GAAG,UAAU,GAAG,iBAAiB,CAAC;AAE7D,eAAO,MAAM,gBAAgB,QAAO,UAAU,CAAC,QAAQ,CAoCtD,CAAC;AAEF,oBAAY,aAAa,GAAG;IAC1B,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB,CAAC"}
1
+ {"version":3,"file":"tooltip-model.d.ts","sourceRoot":"","sources":["../../src/TimeSeriesTooltip/tooltip-model.ts"],"names":[],"mappings":"AAcA,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC;AAEpD,eAAO,MAAM,iBAAiB,MAAM,CAAC;AACrC,eAAO,MAAM,iBAAiB,MAAM,CAAC;AACrC,eAAO,MAAM,kBAAkB,MAAM,CAAC;AACtC,eAAO,MAAM,wBAAwB,QAA0B,CAAC;AAChE,eAAO,MAAM,+BAA+B,OAAO,CAAC;AACpD,eAAO,MAAM,eAAe,IAAI,CAAC;AAEjC,eAAO,MAAM,oBAAoB,MAAM,CAAC;AAExC,eAAO,MAAM,yBAAyB,qCAAqC,CAAC;AAC5E,eAAO,MAAM,6BAA6B,iDAAiD,CAAC;AAE5F,eAAO,MAAM,yBAAyB,YAAY,CAAC;AAEnD,eAAO,MAAM,mBAAmB,qBAQ9B,CAAC;AAEH,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;CAa7B,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;CAG5B,CAAC;AAEF,MAAM,WAAW,UAAU;IACzB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX;AAED,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,EAAE,UAAU,CAAC;IACnB,UAAU,EAAE,UAAU,CAAC;IACvB,OAAO,CAAC,EAAE;QACR,CAAC,CAAC,EAAE,MAAM,CAAC;QACX,CAAC,CAAC,EAAE,MAAM,CAAC;KACZ,CAAC;IACF,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;CAC5B;AAED,MAAM,WAAW,UAAU;IACzB,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAAC;IACjC,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,MAAM,WAAW,WAAW;IAC1B,aAAa,EAAE,iBAAiB,GAAG,IAAI,CAAC;IACxC,MAAM,EAAE,UAAU,CAAC;CACpB;AAED,aAAK,iBAAiB,GAAG;IACvB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,cAAc,GAAG,gBAAgB,CAAC;IACnD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,oBAAY,eAAe,GAAG,UAAU,GAAG,iBAAiB,CAAC;AAE7D,eAAO,MAAM,gBAAgB,QAAO,UAAU,CAAC,QAAQ,CAoCtD,CAAC;AAEF,oBAAY,aAAa,GAAG;IAC1B,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,aAGpC,CAAC;AAEF,eAAO,MAAM,qBAAqB,uBAAuB,CAAC;AAE1D,eAAO,MAAM,uBAAuB,yBAAyB,CAAC"}
@@ -82,5 +82,11 @@ export const useMousePosition = ()=>{
82
82
  }, []);
83
83
  return coords;
84
84
  };
85
+ export const DEFAULT_TOOLTIP_CONFIG = {
86
+ wrapLabels: true,
87
+ enablePinning: true
88
+ };
89
+ export const PIN_TOOLTIP_HELP_TEXT = 'Click chart to pin';
90
+ export const UNPIN_TOOLTIP_HELP_TEXT = 'Click chart to unpin';
85
91
 
86
92
  //# sourceMappingURL=tooltip-model.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/TimeSeriesTooltip/tooltip-model.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 { useEffect, useState } from 'react';\nimport { NearbySeriesArray } from './nearby-series';\n\nexport const TOOLTIP_MIN_WIDTH = 375;\nexport const TOOLTIP_MAX_WIDTH = 650;\nexport const TOOLTIP_MAX_HEIGHT = 650;\nexport const TOOLTIP_LABELS_MAX_WIDTH = TOOLTIP_MAX_WIDTH - 150;\nexport const TOOLTIP_ADJUST_Y_POS_MULTIPLIER = 0.75;\nexport const TOOLTIP_PADDING = 8;\n\nexport const FALLBACK_CHART_WIDTH = 750;\n\nexport const NEARBY_SERIES_DESCRIPTION = 'nearby series showing in tooltip';\nexport const EMPHASIZED_SERIES_DESCRIPTION = 'emphasized series showing as bold in tooltip';\n\nexport const TOOLTIP_BG_COLOR_FALLBACK = '#2E313E';\n\nexport const TOOLTIP_DATE_FORMAT = new Intl.DateTimeFormat(undefined, {\n year: 'numeric',\n month: 'short',\n day: 'numeric',\n hour: 'numeric',\n minute: 'numeric',\n second: 'numeric',\n hour12: true,\n});\n\nexport const defaultCursorData = {\n coords: {\n plotCanvas: {\n x: 0,\n y: 0,\n },\n zrender: {\n x: 0,\n y: 0,\n },\n target: null,\n },\n chartWidth: 0,\n};\n\nexport const emptyTooltipData = {\n cursor: defaultCursorData,\n focusedSeries: null,\n};\n\nexport interface Coordinate {\n x: number;\n y: number;\n}\n\nexport interface CursorCoordinates {\n page: Coordinate;\n client: Coordinate;\n plotCanvas: Coordinate;\n zrender?: {\n x?: number;\n y?: number;\n };\n target: EventTarget | null;\n}\n\nexport interface CursorData {\n coords: CursorCoordinates | null;\n chartWidth?: number;\n}\n\nexport interface TooltipData {\n focusedSeries: NearbySeriesArray | null;\n cursor: CursorData;\n}\n\ntype ZREventProperties = {\n zrX?: number;\n zrY?: number;\n zrDelta?: number;\n zrEventControl?: 'no_globalout' | 'only_globalout';\n zrByTouch?: boolean;\n};\n\nexport type ZRRawMouseEvent = MouseEvent & ZREventProperties;\n\nexport const useMousePosition = (): CursorData['coords'] => {\n const [coords, setCoords] = useState<CursorData['coords']>(null);\n\n useEffect(() => {\n const setFromEvent = (e: ZRRawMouseEvent) => {\n return setCoords({\n page: {\n x: e.pageX,\n y: e.pageY,\n },\n client: {\n x: e.clientX,\n y: e.clientY,\n },\n plotCanvas: {\n x: e.offsetX,\n y: e.offsetY,\n },\n zrender: {\n // echarts canvas coordinates added automatically by zrender\n // zrX and zrY are similar to offsetX and offsetY but they return undefined when not hovering over a chart canvas\n x: e.zrX,\n y: e.zrY,\n },\n // necessary to check whether cursor target matches correct chart canvas (since each chart has its own mousemove listener)\n target: e.target,\n });\n };\n window.addEventListener('mousemove', setFromEvent);\n\n return () => {\n window.removeEventListener('mousemove', setFromEvent);\n };\n }, []);\n\n return coords;\n};\n\nexport type TooltipConfig = {\n wrapLabels: boolean;\n hidden?: boolean;\n};\n"],"names":["useEffect","useState","TOOLTIP_MIN_WIDTH","TOOLTIP_MAX_WIDTH","TOOLTIP_MAX_HEIGHT","TOOLTIP_LABELS_MAX_WIDTH","TOOLTIP_ADJUST_Y_POS_MULTIPLIER","TOOLTIP_PADDING","FALLBACK_CHART_WIDTH","NEARBY_SERIES_DESCRIPTION","EMPHASIZED_SERIES_DESCRIPTION","TOOLTIP_BG_COLOR_FALLBACK","TOOLTIP_DATE_FORMAT","Intl","DateTimeFormat","undefined","year","month","day","hour","minute","second","hour12","defaultCursorData","coords","plotCanvas","x","y","zrender","target","chartWidth","emptyTooltipData","cursor","focusedSeries","useMousePosition","setCoords","setFromEvent","e","page","pageX","pageY","client","clientX","clientY","offsetX","offsetY","zrX","zrY","window","addEventListener","removeEventListener"],"mappings":"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"}
1
+ {"version":3,"sources":["../../src/TimeSeriesTooltip/tooltip-model.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 { useEffect, useState } from 'react';\nimport { NearbySeriesArray } from './nearby-series';\n\nexport const TOOLTIP_MIN_WIDTH = 375;\nexport const TOOLTIP_MAX_WIDTH = 650;\nexport const TOOLTIP_MAX_HEIGHT = 650;\nexport const TOOLTIP_LABELS_MAX_WIDTH = TOOLTIP_MAX_WIDTH - 150;\nexport const TOOLTIP_ADJUST_Y_POS_MULTIPLIER = 0.75;\nexport const TOOLTIP_PADDING = 8;\n\nexport const FALLBACK_CHART_WIDTH = 750;\n\nexport const NEARBY_SERIES_DESCRIPTION = 'nearby series showing in tooltip';\nexport const EMPHASIZED_SERIES_DESCRIPTION = 'emphasized series showing as bold in tooltip';\n\nexport const TOOLTIP_BG_COLOR_FALLBACK = '#2E313E';\n\nexport const TOOLTIP_DATE_FORMAT = new Intl.DateTimeFormat(undefined, {\n year: 'numeric',\n month: 'short',\n day: 'numeric',\n hour: 'numeric',\n minute: 'numeric',\n second: 'numeric',\n hour12: true,\n});\n\nexport const defaultCursorData = {\n coords: {\n plotCanvas: {\n x: 0,\n y: 0,\n },\n zrender: {\n x: 0,\n y: 0,\n },\n target: null,\n },\n chartWidth: 0,\n};\n\nexport const emptyTooltipData = {\n cursor: defaultCursorData,\n focusedSeries: null,\n};\n\nexport interface Coordinate {\n x: number;\n y: number;\n}\n\nexport interface CursorCoordinates {\n page: Coordinate;\n client: Coordinate;\n plotCanvas: Coordinate;\n zrender?: {\n x?: number;\n y?: number;\n };\n target: EventTarget | null;\n}\n\nexport interface CursorData {\n coords: CursorCoordinates | null;\n chartWidth?: number;\n}\n\nexport interface TooltipData {\n focusedSeries: NearbySeriesArray | null;\n cursor: CursorData;\n}\n\ntype ZREventProperties = {\n zrX?: number;\n zrY?: number;\n zrDelta?: number;\n zrEventControl?: 'no_globalout' | 'only_globalout';\n zrByTouch?: boolean;\n};\n\nexport type ZRRawMouseEvent = MouseEvent & ZREventProperties;\n\nexport const useMousePosition = (): CursorData['coords'] => {\n const [coords, setCoords] = useState<CursorData['coords']>(null);\n\n useEffect(() => {\n const setFromEvent = (e: ZRRawMouseEvent) => {\n return setCoords({\n page: {\n x: e.pageX,\n y: e.pageY,\n },\n client: {\n x: e.clientX,\n y: e.clientY,\n },\n plotCanvas: {\n x: e.offsetX,\n y: e.offsetY,\n },\n zrender: {\n // echarts canvas coordinates added automatically by zrender\n // zrX and zrY are similar to offsetX and offsetY but they return undefined when not hovering over a chart canvas\n x: e.zrX,\n y: e.zrY,\n },\n // necessary to check whether cursor target matches correct chart canvas (since each chart has its own mousemove listener)\n target: e.target,\n });\n };\n window.addEventListener('mousemove', setFromEvent);\n\n return () => {\n window.removeEventListener('mousemove', setFromEvent);\n };\n }, []);\n\n return coords;\n};\n\nexport type TooltipConfig = {\n wrapLabels: boolean;\n hidden?: boolean;\n enablePinning?: boolean;\n};\n\nexport const DEFAULT_TOOLTIP_CONFIG: TooltipConfig = {\n wrapLabels: true,\n enablePinning: true,\n};\n\nexport const PIN_TOOLTIP_HELP_TEXT = 'Click chart to pin';\n\nexport const UNPIN_TOOLTIP_HELP_TEXT = 'Click chart to unpin';\n"],"names":["useEffect","useState","TOOLTIP_MIN_WIDTH","TOOLTIP_MAX_WIDTH","TOOLTIP_MAX_HEIGHT","TOOLTIP_LABELS_MAX_WIDTH","TOOLTIP_ADJUST_Y_POS_MULTIPLIER","TOOLTIP_PADDING","FALLBACK_CHART_WIDTH","NEARBY_SERIES_DESCRIPTION","EMPHASIZED_SERIES_DESCRIPTION","TOOLTIP_BG_COLOR_FALLBACK","TOOLTIP_DATE_FORMAT","Intl","DateTimeFormat","undefined","year","month","day","hour","minute","second","hour12","defaultCursorData","coords","plotCanvas","x","y","zrender","target","chartWidth","emptyTooltipData","cursor","focusedSeries","useMousePosition","setCoords","setFromEvent","e","page","pageX","pageY","client","clientX","clientY","offsetX","offsetY","zrX","zrY","window","addEventListener","removeEventListener","DEFAULT_TOOLTIP_CONFIG","wrapLabels","enablePinning","PIN_TOOLTIP_HELP_TEXT","UNPIN_TOOLTIP_HELP_TEXT"],"mappings":"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"}
@@ -3,6 +3,7 @@ import { UnitOptions } from '@perses-dev/core';
3
3
  export interface UnitSelectorProps {
4
4
  value: UnitOptions;
5
5
  onChange: (unit: UnitOptions) => void;
6
+ disabled?: boolean;
6
7
  }
7
- export declare function UnitSelector({ value, onChange }: UnitSelectorProps): JSX.Element;
8
+ export declare function UnitSelector({ value, onChange, disabled }: UnitSelectorProps): JSX.Element;
8
9
  //# sourceMappingURL=UnitSelector.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"UnitSelector.d.ts","sourceRoot":"","sources":["../../src/UnitSelector/UnitSelector.tsx"],"names":[],"mappings":";AAaA,OAAO,EAEL,WAAW,EAKZ,MAAM,kBAAkB,CAAC;AAI1B,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,WAAW,CAAC;IACnB,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;CACvC;AA0BD,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,iBAAiB,eAqElE"}
1
+ {"version":3,"file":"UnitSelector.d.ts","sourceRoot":"","sources":["../../src/UnitSelector/UnitSelector.tsx"],"names":[],"mappings":";AAaA,OAAO,EAEL,WAAW,EAKZ,MAAM,kBAAkB,CAAC;AAI1B,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,WAAW,CAAC;IACnB,QAAQ,EAAE,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AA0BD,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAgB,EAAE,EAAE,iBAAiB,eAsEpF"}
@@ -56,7 +56,7 @@ const DECIMAL_PLACES_OPTIONS = [
56
56
  function getOptionByDecimalPlaces(decimal_places) {
57
57
  return DECIMAL_PLACES_OPTIONS.find((o)=>o.decimal_places === decimal_places);
58
58
  }
59
- export function UnitSelector({ value , onChange }) {
59
+ export function UnitSelector({ value , onChange , disabled =false }) {
60
60
  const hasDecimalPlaces = isUnitWithDecimalPlaces(value);
61
61
  const hasAbbreviate = isUnitWithAbbreviate(value);
62
62
  const handleKindChange = (_, newValue)=>{
@@ -101,7 +101,8 @@ export function UnitSelector({ value , onChange }) {
101
101
  options: KIND_OPTIONS,
102
102
  groupBy: (option)=>option.group,
103
103
  onChange: handleKindChange,
104
- disableClearable: true
104
+ disableClearable: true,
105
+ disabled: disabled
105
106
  })
106
107
  }),
107
108
  /*#__PURE__*/ _jsx(OptionsEditorControl, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/UnitSelector/UnitSelector.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.\nimport { Switch, SwitchProps } from '@mui/material';\nimport {\n shouldAbbreviate,\n UnitOptions,\n UNIT_CONFIG,\n UnitConfig,\n isUnitWithDecimalPlaces,\n isUnitWithAbbreviate,\n} from '@perses-dev/core';\nimport { OptionsEditorControl } from '../OptionsEditorLayout';\nimport { SettingsAutocomplete } from '../SettingsAutocomplete';\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_PLACES_OPTIONS = [\n { id: 'default', label: 'Default', decimal_places: undefined },\n { id: '0', label: '0', decimal_places: 0 },\n { id: '1', label: '1', decimal_places: 1 },\n { id: '2', label: '2', decimal_places: 2 },\n { id: '3', label: '3', decimal_places: 3 },\n { id: '4', label: '4', decimal_places: 4 },\n];\n\nfunction getOptionByDecimalPlaces(decimal_places?: number) {\n return DECIMAL_PLACES_OPTIONS.find((o) => o.decimal_places === decimal_places);\n}\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 handleDecimalPlacesChange = (_: unknown, { decimal_places }: { decimal_places: number | undefined }) => {\n if (hasDecimalPlaces) {\n onChange({\n ...value,\n decimal_places: decimal_places,\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 ? shouldAbbreviate(value.abbreviate) : false}\n onChange={handleAbbreviateChange}\n disabled={!hasAbbreviate}\n />\n }\n />\n <OptionsEditorControl\n label=\"Unit\"\n control={\n <SettingsAutocomplete\n value={{ id: value.kind, ...kindConfig }}\n options={KIND_OPTIONS}\n groupBy={(option) => option.group}\n onChange={handleKindChange}\n disableClearable\n ></SettingsAutocomplete>\n }\n />\n <OptionsEditorControl\n label=\"Decimals\"\n control={\n <SettingsAutocomplete\n value={getOptionByDecimalPlaces(value.decimal_places)}\n options={DECIMAL_PLACES_OPTIONS}\n getOptionLabel={(o) => o.label}\n onChange={handleDecimalPlacesChange}\n disabled={!hasDecimalPlaces}\n disableClearable\n />\n }\n />\n </>\n );\n}\n"],"names":["Switch","shouldAbbreviate","UNIT_CONFIG","isUnitWithDecimalPlaces","isUnitWithAbbreviate","OptionsEditorControl","SettingsAutocomplete","KIND_OPTIONS","Object","entries","map","id","config","filter","disableSelectorOption","DECIMAL_PLACES_OPTIONS","label","decimal_places","undefined","getOptionByDecimalPlaces","find","o","UnitSelector","value","onChange","hasDecimalPlaces","hasAbbreviate","handleKindChange","_","newValue","kind","handleDecimalPlacesChange","handleAbbreviateChange","checked","abbreviate","kindConfig","control","disabled","options","groupBy","option","group","disableClearable","getOptionLabel"],"mappings":"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"}
1
+ {"version":3,"sources":["../../src/UnitSelector/UnitSelector.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.\nimport { Switch, SwitchProps } from '@mui/material';\nimport {\n shouldAbbreviate,\n UnitOptions,\n UNIT_CONFIG,\n UnitConfig,\n isUnitWithDecimalPlaces,\n isUnitWithAbbreviate,\n} from '@perses-dev/core';\nimport { OptionsEditorControl } from '../OptionsEditorLayout';\nimport { SettingsAutocomplete } from '../SettingsAutocomplete';\n\nexport interface UnitSelectorProps {\n value: UnitOptions;\n onChange: (unit: UnitOptions) => void;\n disabled?: boolean;\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_PLACES_OPTIONS = [\n { id: 'default', label: 'Default', decimal_places: undefined },\n { id: '0', label: '0', decimal_places: 0 },\n { id: '1', label: '1', decimal_places: 1 },\n { id: '2', label: '2', decimal_places: 2 },\n { id: '3', label: '3', decimal_places: 3 },\n { id: '4', label: '4', decimal_places: 4 },\n];\n\nfunction getOptionByDecimalPlaces(decimal_places?: number) {\n return DECIMAL_PLACES_OPTIONS.find((o) => o.decimal_places === decimal_places);\n}\n\nexport function UnitSelector({ value, onChange, disabled = false }: 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 handleDecimalPlacesChange = (_: unknown, { decimal_places }: { decimal_places: number | undefined }) => {\n if (hasDecimalPlaces) {\n onChange({\n ...value,\n decimal_places: decimal_places,\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 ? shouldAbbreviate(value.abbreviate) : false}\n onChange={handleAbbreviateChange}\n disabled={!hasAbbreviate}\n />\n }\n />\n <OptionsEditorControl\n label=\"Unit\"\n control={\n <SettingsAutocomplete\n value={{ id: value.kind, ...kindConfig }}\n options={KIND_OPTIONS}\n groupBy={(option) => option.group}\n onChange={handleKindChange}\n disableClearable\n disabled={disabled}\n ></SettingsAutocomplete>\n }\n />\n <OptionsEditorControl\n label=\"Decimals\"\n control={\n <SettingsAutocomplete\n value={getOptionByDecimalPlaces(value.decimal_places)}\n options={DECIMAL_PLACES_OPTIONS}\n getOptionLabel={(o) => o.label}\n onChange={handleDecimalPlacesChange}\n disabled={!hasDecimalPlaces}\n disableClearable\n />\n }\n />\n </>\n );\n}\n"],"names":["Switch","shouldAbbreviate","UNIT_CONFIG","isUnitWithDecimalPlaces","isUnitWithAbbreviate","OptionsEditorControl","SettingsAutocomplete","KIND_OPTIONS","Object","entries","map","id","config","filter","disableSelectorOption","DECIMAL_PLACES_OPTIONS","label","decimal_places","undefined","getOptionByDecimalPlaces","find","o","UnitSelector","value","onChange","disabled","hasDecimalPlaces","hasAbbreviate","handleKindChange","_","newValue","kind","handleDecimalPlacesChange","handleAbbreviateChange","checked","abbreviate","kindConfig","control","options","groupBy","option","group","disableClearable","getOptionLabel"],"mappings":"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"}
@@ -0,0 +1,135 @@
1
+ // Copyright 2023 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
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ Object.defineProperty(exports, "BarChart", {
18
+ enumerable: true,
19
+ get: ()=>BarChart
20
+ });
21
+ const _jsxRuntime = require("react/jsx-runtime");
22
+ const _react = require("react");
23
+ const _core = require("@perses-dev/core");
24
+ const _core1 = require("echarts/core");
25
+ const _charts = require("echarts/charts");
26
+ const _components = require("echarts/components");
27
+ const _renderers = require("echarts/renderers");
28
+ const _material = require("@mui/material");
29
+ const _chartsProvider = require("../context/ChartsProvider");
30
+ const _echart = require("../EChart");
31
+ const _utils = require("../utils");
32
+ (0, _core1.use)([
33
+ _charts.BarChart,
34
+ _components.GridComponent,
35
+ _components.DatasetComponent,
36
+ _components.TitleComponent,
37
+ _components.TooltipComponent,
38
+ _renderers.CanvasRenderer
39
+ ]);
40
+ const BAR_WIN_WIDTH = 14;
41
+ const BAR_GAP = 6;
42
+ function BarChart(props) {
43
+ const { width , height , data , unit ={
44
+ kind: 'Decimal'
45
+ } , mode ='value' } = props;
46
+ const chartsTheme = (0, _chartsProvider.useChartsTheme)();
47
+ const option = (0, _react.useMemo)(()=>{
48
+ if (data == null || !data.length) return chartsTheme.noDataOption;
49
+ const source = [];
50
+ data.map((d)=>{
51
+ source.push([
52
+ d.label,
53
+ d.value
54
+ ]);
55
+ });
56
+ return {
57
+ title: {
58
+ show: false
59
+ },
60
+ dataset: [
61
+ {
62
+ dimensions: [
63
+ 'label',
64
+ 'value'
65
+ ],
66
+ source: source
67
+ }
68
+ ],
69
+ xAxis: (0, _utils.getFormattedAxis)({}, unit),
70
+ yAxis: {
71
+ type: 'category',
72
+ splitLine: {
73
+ show: false
74
+ },
75
+ axisLabel: {
76
+ overflow: 'truncate',
77
+ width: width / 3
78
+ }
79
+ },
80
+ series: {
81
+ type: 'bar',
82
+ label: {
83
+ show: true,
84
+ position: 'right',
85
+ formatter: (params)=>{
86
+ if (mode === 'percentage') {
87
+ return params.data[1] && (0, _core.formatValue)(params.data[1], {
88
+ kind: 'Percent',
89
+ decimal_places: unit.decimal_places
90
+ });
91
+ }
92
+ return params.data[1] && (0, _core.formatValue)(params.data[1], unit);
93
+ },
94
+ barMinWidth: BAR_WIN_WIDTH,
95
+ barCategoryGap: BAR_GAP
96
+ },
97
+ itemStyle: {
98
+ borderRadius: 4,
99
+ color: chartsTheme.echartsTheme[0]
100
+ }
101
+ },
102
+ tooltip: {
103
+ appendToBody: true,
104
+ confine: true,
105
+ formatter: (params)=>params.data[1] && `<b>${params.name}</b> &emsp; ${(0, _core.formatValue)(params.data[1], unit)}`
106
+ },
107
+ // increase distance between grid and container to prevent y axis labels from getting cut off
108
+ grid: {
109
+ left: '5%',
110
+ right: '5%'
111
+ }
112
+ };
113
+ }, [
114
+ data,
115
+ chartsTheme,
116
+ width,
117
+ mode,
118
+ unit
119
+ ]);
120
+ return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Box, {
121
+ sx: {
122
+ width: width,
123
+ height: height,
124
+ overflow: 'auto'
125
+ },
126
+ children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_echart.EChart, {
127
+ sx: {
128
+ minHeight: height,
129
+ height: data ? data.length * (BAR_WIN_WIDTH + BAR_GAP) : '100%'
130
+ },
131
+ option: option,
132
+ theme: chartsTheme.echartsTheme
133
+ })
134
+ });
135
+ }
@@ -0,0 +1,28 @@
1
+ // Copyright 2023 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
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ _exportStar(require("./BarChart"), exports);
18
+ function _exportStar(from, to) {
19
+ Object.keys(from).forEach(function(k) {
20
+ if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {
21
+ enumerable: true,
22
+ get: function() {
23
+ return from[k];
24
+ }
25
+ });
26
+ });
27
+ return from;
28
+ }
@@ -0,0 +1,53 @@
1
+ // Copyright 2023 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
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ Object.defineProperty(exports, "DiscardChangesConfirmationDialog", {
18
+ enumerable: true,
19
+ get: ()=>DiscardChangesConfirmationDialog
20
+ });
21
+ const _jsxRuntime = require("react/jsx-runtime");
22
+ const _material = require("@mui/material");
23
+ const _dialog = require("./Dialog");
24
+ const DiscardChangesConfirmationDialog = (props)=>{
25
+ const { description , isOpen , onCancel , onDiscardChanges } = props;
26
+ return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_dialog.Dialog, {
27
+ open: isOpen,
28
+ "aria-labelledby": "discard-dialog",
29
+ children: [
30
+ /*#__PURE__*/ (0, _jsxRuntime.jsx)(_dialog.Dialog.Header, {
31
+ children: "Discard Changes"
32
+ }),
33
+ /*#__PURE__*/ (0, _jsxRuntime.jsx)(_dialog.Dialog.Content, {
34
+ children: description
35
+ }),
36
+ /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_dialog.Dialog.Actions, {
37
+ children: [
38
+ /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Button, {
39
+ variant: "contained",
40
+ onClick: onDiscardChanges,
41
+ children: "Discard Changes"
42
+ }),
43
+ /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Button, {
44
+ variant: "outlined",
45
+ color: "secondary",
46
+ onClick: onCancel,
47
+ children: "Cancel"
48
+ })
49
+ ]
50
+ })
51
+ ]
52
+ });
53
+ };
@@ -15,6 +15,7 @@ Object.defineProperty(exports, "__esModule", {
15
15
  value: true
16
16
  });
17
17
  _exportStar(require("./Dialog"), exports);
18
+ _exportStar(require("./DiscardChangesConfirmationDialog"), exports);
18
19
  function _exportStar(from, to) {
19
20
  Object.keys(from).forEach(function(k) {
20
21
  if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {
@@ -30,7 +30,7 @@ const _core1 = require("echarts/core");
30
30
  const _charts = require("echarts/charts");
31
31
  const _components = require("echarts/components");
32
32
  const _renderers = require("echarts/renderers");
33
- const _chartsThemeProvider = require("../context/ChartsThemeProvider");
33
+ const _chartsProvider = require("../context/ChartsProvider");
34
34
  const _echart = require("../EChart");
35
35
  (0, _core1.use)([
36
36
  _charts.GaugeChart,
@@ -44,7 +44,7 @@ const PROGRESS_WIDTH = 16;
44
44
  const GAUGE_SMALL_BREAKPOINT = 170;
45
45
  function GaugeChart(props) {
46
46
  const { width , height , data , unit , axisLine , max } = props;
47
- const chartsTheme = (0, _chartsThemeProvider.useChartsTheme)();
47
+ const chartsTheme = (0, _chartsProvider.useChartsTheme)();
48
48
  // useDeepMemo ensures value size util does not rerun everytime you hover on the chart
49
49
  const option = (0, _core.useDeepMemo)(()=>{
50
50
  var ref;
@@ -26,7 +26,7 @@ const _charts = require("echarts/charts");
26
26
  const _components = require("echarts/components");
27
27
  const _renderers = require("echarts/renderers");
28
28
  const _echart = require("../EChart");
29
- const _chartsThemeProvider = require("../context/ChartsThemeProvider");
29
+ const _chartsProvider = require("../context/ChartsProvider");
30
30
  const _timeSeriesTooltip = require("../TimeSeriesTooltip");
31
31
  const _timeZoneProvider = require("../context/TimeZoneProvider");
32
32
  const _utils = require("../utils");
@@ -43,11 +43,9 @@ const _utils = require("../utils");
43
43
  _components.LegendComponent,
44
44
  _renderers.CanvasRenderer
45
45
  ]);
46
- const LineChart = /*#__PURE__*/ (0, _react.forwardRef)(function LineChart({ height , data , yAxis , unit , grid , legend , tooltipConfig ={
47
- wrapLabels: true
48
- } , noDataVariant ='message' , syncGroup , onDataZoom , onDoubleClick , __experimentalEChartsOptionsOverride , }, ref) {
46
+ const LineChart = /*#__PURE__*/ (0, _react.forwardRef)(function LineChart({ height , data , yAxis , unit , grid , legend , tooltipConfig =_timeSeriesTooltip.DEFAULT_TOOLTIP_CONFIG , noDataVariant ='message' , syncGroup , onDataZoom , onDoubleClick , __experimentalEChartsOptionsOverride , }, ref) {
49
47
  var ref1;
50
- const chartsTheme = (0, _chartsThemeProvider.useChartsTheme)();
48
+ const chartsTheme = (0, _chartsProvider.useChartsTheme)();
51
49
  const chartRef = (0, _react.useRef)();
52
50
  const [showTooltip, setShowTooltip] = (0, _react.useState)(true);
53
51
  const [tooltipPinnedCoords, setTooltipPinnedCoords] = (0, _react.useState)(null);
@@ -132,7 +130,7 @@ const LineChart = /*#__PURE__*/ (0, _react.forwardRef)(function LineChart({ heig
132
130
  }
133
131
  }
134
132
  },
135
- yAxis: (0, _utils.getYAxes)(yAxis, unit),
133
+ yAxis: (0, _utils.getFormattedAxis)(yAxis, unit),
136
134
  animation: false,
137
135
  tooltip: {
138
136
  show: true,
@@ -179,7 +177,7 @@ const LineChart = /*#__PURE__*/ (0, _react.forwardRef)(function LineChart({ heig
179
177
  },
180
178
  onClick: (e)=>{
181
179
  // Pin and unpin when clicking on chart canvas but not tooltip text.
182
- if (e.target instanceof HTMLCanvasElement) {
180
+ if (tooltipConfig.enablePinning && e.target instanceof HTMLCanvasElement) {
183
181
  setTooltipPinnedCoords((current)=>{
184
182
  if (current === null) {
185
183
  return {
@@ -257,11 +255,13 @@ const LineChart = /*#__PURE__*/ (0, _react.forwardRef)(function LineChart({ heig
257
255
  chartRef: chartRef,
258
256
  chartData: data,
259
257
  wrapLabels: tooltipConfig.wrapLabels,
258
+ enablePinning: tooltipConfig.enablePinning,
260
259
  pinnedPos: tooltipPinnedCoords,
261
260
  unit: unit,
262
261
  onUnpinClick: ()=>{
263
262
  setTooltipPinnedCoords(null);
264
- }
263
+ },
264
+ containerId: chartsTheme.tooltipPortalContainerId
265
265
  }),
266
266
  /*#__PURE__*/ (0, _jsxRuntime.jsx)(_echart.EChart, {
267
267
  sx: {
@@ -0,0 +1,49 @@
1
+ // Copyright 2023 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
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ Object.defineProperty(exports, "ModeSelector", {
18
+ enumerable: true,
19
+ get: ()=>ModeSelector
20
+ });
21
+ const _jsxRuntime = require("react/jsx-runtime");
22
+ const _optionsEditorLayout = require("../OptionsEditorLayout");
23
+ const _settingsAutocomplete = require("../SettingsAutocomplete");
24
+ const MODE_OPTIONS = [
25
+ {
26
+ id: 'value',
27
+ label: 'Value'
28
+ },
29
+ {
30
+ id: 'percentage',
31
+ label: 'Percentage'
32
+ }
33
+ ];
34
+ function ModeSelector({ disablePercentageMode , onChange , value ='value' }) {
35
+ const handleModeChange = (_, { id })=>{
36
+ onChange(id);
37
+ };
38
+ return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_optionsEditorLayout.OptionsEditorControl, {
39
+ label: "Mode",
40
+ control: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_settingsAutocomplete.SettingsAutocomplete, {
41
+ value: MODE_OPTIONS.find((o)=>o.id === value),
42
+ options: MODE_OPTIONS,
43
+ getOptionLabel: (o)=>o.label,
44
+ getOptionDisabled: (o)=>o.id === 'percentage' && disablePercentageMode,
45
+ onChange: handleModeChange,
46
+ disableClearable: true
47
+ })
48
+ });
49
+ }
@@ -0,0 +1,28 @@
1
+ // Copyright 2023 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
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ _exportStar(require("./ModeSelector"), exports);
18
+ function _exportStar(from, to) {
19
+ Object.keys(from).forEach(function(k) {
20
+ if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {
21
+ enumerable: true,
22
+ get: function() {
23
+ return from[k];
24
+ }
25
+ });
26
+ });
27
+ return from;
28
+ }
@@ -0,0 +1,48 @@
1
+ // Copyright 2023 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
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ Object.defineProperty(exports, "SortSelector", {
18
+ enumerable: true,
19
+ get: ()=>SortSelector
20
+ });
21
+ const _jsxRuntime = require("react/jsx-runtime");
22
+ const _optionsEditorLayout = require("../OptionsEditorLayout");
23
+ const _settingsAutocomplete = require("../SettingsAutocomplete");
24
+ const SORT_OPTIONS = [
25
+ {
26
+ id: 'asc',
27
+ label: 'Ascending'
28
+ },
29
+ {
30
+ id: 'desc',
31
+ label: 'Descending'
32
+ }
33
+ ];
34
+ function SortSelector({ onChange , value ='desc' }) {
35
+ const handleSortChange = (_, { id })=>{
36
+ onChange(id);
37
+ };
38
+ return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_optionsEditorLayout.OptionsEditorControl, {
39
+ label: "Sort",
40
+ control: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_settingsAutocomplete.SettingsAutocomplete, {
41
+ value: SORT_OPTIONS.find((o)=>o.id === value),
42
+ options: SORT_OPTIONS,
43
+ getOptionLabel: (o)=>o.label,
44
+ onChange: handleSortChange,
45
+ disableClearable: true
46
+ })
47
+ });
48
+ }
@@ -0,0 +1,28 @@
1
+ // Copyright 2023 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
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ _exportStar(require("./SortSelector"), exports);
18
+ function _exportStar(from, to) {
19
+ Object.keys(from).forEach(function(k) {
20
+ if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {
21
+ enumerable: true,
22
+ get: function() {
23
+ return from[k];
24
+ }
25
+ });
26
+ });
27
+ return from;
28
+ }
@@ -27,7 +27,7 @@ const _core1 = require("echarts/core");
27
27
  const _charts = require("echarts/charts");
28
28
  const _components = require("echarts/components");
29
29
  const _renderers = require("echarts/renderers");
30
- const _chartsThemeProvider = require("../context/ChartsThemeProvider");
30
+ const _chartsProvider = require("../context/ChartsProvider");
31
31
  const _echart = require("../EChart");
32
32
  const _calculateFontSize = require("./calculateFontSize");
33
33
  function _interopRequireDefault(obj) {
@@ -50,7 +50,7 @@ const VALUE_FONT_WEIGHT = 700;
50
50
  function StatChart(props) {
51
51
  var ref, ref1;
52
52
  const { width , height , data , unit , color , sparkline , showSeriesName , valueFontSize } = props;
53
- const chartsTheme = (0, _chartsThemeProvider.useChartsTheme)();
53
+ const chartsTheme = (0, _chartsProvider.useChartsTheme)();
54
54
  let formattedValue = '';
55
55
  if (data.calculatedValue === null) {
56
56
  formattedValue = 'null';