@perses-dev/components 0.0.0-snapshot-scatterplot-fix-imports-95e1b59 → 0.0.0-snapshot-histogram-types-78c5104

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 (523) hide show
  1. package/dist/AlignSelector/AlignSelector.d.ts +9 -0
  2. package/dist/AlignSelector/AlignSelector.d.ts.map +1 -0
  3. package/dist/AlignSelector/AlignSelector.js +42 -0
  4. package/dist/AlignSelector/AlignSelector.js.map +1 -0
  5. package/dist/AlignSelector/index.d.ts +2 -0
  6. package/dist/AlignSelector/index.d.ts.map +1 -0
  7. package/dist/AlignSelector/index.js +15 -0
  8. package/dist/AlignSelector/index.js.map +1 -0
  9. package/dist/BarChart/BarChart.d.ts +2 -1
  10. package/dist/BarChart/BarChart.d.ts.map +1 -1
  11. package/dist/BarChart/BarChart.js +11 -6
  12. package/dist/BarChart/BarChart.js.map +1 -1
  13. package/dist/ColorPicker/ColorPicker.d.ts +3 -1
  14. package/dist/ColorPicker/ColorPicker.d.ts.map +1 -1
  15. package/dist/ColorPicker/ColorPicker.js +28 -13
  16. package/dist/ColorPicker/ColorPicker.js.map +1 -1
  17. package/dist/ColorPicker/OptionsColorPicker.d.ts +9 -0
  18. package/dist/ColorPicker/OptionsColorPicker.d.ts.map +1 -0
  19. package/dist/{ThresholdsEditor/ThresholdColorPicker.js → ColorPicker/OptionsColorPicker.js} +16 -13
  20. package/dist/ColorPicker/OptionsColorPicker.js.map +1 -0
  21. package/dist/ColorPicker/index.d.ts +1 -0
  22. package/dist/ColorPicker/index.d.ts.map +1 -1
  23. package/dist/ColorPicker/index.js +1 -0
  24. package/dist/ColorPicker/index.js.map +1 -1
  25. package/dist/ContentWithLegend/ContentWithLegend.d.ts +2 -1
  26. package/dist/ContentWithLegend/ContentWithLegend.d.ts.map +1 -1
  27. package/dist/ContentWithLegend/ContentWithLegend.js +8 -5
  28. package/dist/ContentWithLegend/ContentWithLegend.js.map +1 -1
  29. package/dist/ContentWithLegend/model/content-with-legend-model.js +2 -3
  30. package/dist/ContentWithLegend/model/content-with-legend-model.js.map +1 -1
  31. package/dist/DensitySelector/DensitySelector.d.ts +8 -0
  32. package/dist/DensitySelector/DensitySelector.d.ts.map +1 -0
  33. package/dist/DensitySelector/DensitySelector.js +46 -0
  34. package/dist/DensitySelector/DensitySelector.js.map +1 -0
  35. package/dist/DensitySelector/index.d.ts +2 -0
  36. package/dist/DensitySelector/index.d.ts.map +1 -0
  37. package/dist/DensitySelector/index.js +15 -0
  38. package/dist/DensitySelector/index.js.map +1 -0
  39. package/dist/Dialog/Dialog.d.ts +9 -14
  40. package/dist/Dialog/Dialog.d.ts.map +1 -1
  41. package/dist/Dialog/Dialog.js +7 -3
  42. package/dist/Dialog/Dialog.js.map +1 -1
  43. package/dist/Dialog/DiscardChangesConfirmationDialog.d.ts +2 -1
  44. package/dist/Dialog/DiscardChangesConfirmationDialog.d.ts.map +1 -1
  45. package/dist/Dialog/DiscardChangesConfirmationDialog.js.map +1 -1
  46. package/dist/DragAndDrop/DragAndDropList.d.ts +24 -0
  47. package/dist/DragAndDrop/DragAndDropList.d.ts.map +1 -0
  48. package/dist/DragAndDrop/DragAndDropList.js +153 -0
  49. package/dist/DragAndDrop/DragAndDropList.js.map +1 -0
  50. package/dist/DragAndDrop/DragButton.d.ts +13 -0
  51. package/dist/DragAndDrop/DragButton.d.ts.map +1 -0
  52. package/dist/DragAndDrop/DragButton.js +99 -0
  53. package/dist/DragAndDrop/DragButton.js.map +1 -0
  54. package/dist/DragAndDrop/DropIndicator.d.ts +3 -0
  55. package/dist/DragAndDrop/DropIndicator.d.ts.map +1 -0
  56. package/dist/DragAndDrop/DropIndicator.js +44 -0
  57. package/dist/DragAndDrop/DropIndicator.js.map +1 -0
  58. package/dist/DragAndDrop/index.d.ts +4 -0
  59. package/dist/DragAndDrop/index.d.ts.map +1 -0
  60. package/dist/DragAndDrop/index.js +17 -0
  61. package/dist/DragAndDrop/index.js.map +1 -0
  62. package/dist/DragAndDrop/model.d.ts +11 -0
  63. package/dist/DragAndDrop/model.d.ts.map +1 -0
  64. package/dist/DragAndDrop/model.js +17 -0
  65. package/dist/DragAndDrop/model.js.map +1 -0
  66. package/dist/Drawer/Drawer.d.ts +2 -1
  67. package/dist/Drawer/Drawer.d.ts.map +1 -1
  68. package/dist/Drawer/Drawer.js +1 -1
  69. package/dist/Drawer/Drawer.js.map +1 -1
  70. package/dist/EChart/EChart.d.ts +3 -2
  71. package/dist/EChart/EChart.d.ts.map +1 -1
  72. package/dist/EChart/EChart.js +26 -9
  73. package/dist/EChart/EChart.js.map +1 -1
  74. package/dist/ErrorAlert.d.ts +2 -1
  75. package/dist/ErrorAlert.d.ts.map +1 -1
  76. package/dist/ErrorAlert.js.map +1 -1
  77. package/dist/FontSizeSelector/FontSizeSelector.d.ts +2 -1
  78. package/dist/FontSizeSelector/FontSizeSelector.d.ts.map +1 -1
  79. package/dist/FontSizeSelector/FontSizeSelector.js.map +1 -1
  80. package/dist/FormEditor/FormActions.d.ts +16 -0
  81. package/dist/FormEditor/FormActions.d.ts.map +1 -0
  82. package/dist/FormEditor/FormActions.js +75 -0
  83. package/dist/FormEditor/FormActions.js.map +1 -0
  84. package/dist/FormEditor/index.d.ts +2 -0
  85. package/dist/FormEditor/index.d.ts.map +1 -0
  86. package/dist/FormEditor/index.js +15 -0
  87. package/dist/FormEditor/index.js.map +1 -0
  88. package/dist/FormatControls/FormatControls.d.ts +2 -1
  89. package/dist/FormatControls/FormatControls.d.ts.map +1 -1
  90. package/dist/FormatControls/FormatControls.js +2 -2
  91. package/dist/FormatControls/FormatControls.js.map +1 -1
  92. package/dist/GaugeChart/GaugeChart.d.ts +2 -1
  93. package/dist/GaugeChart/GaugeChart.d.ts.map +1 -1
  94. package/dist/GaugeChart/GaugeChart.js +4 -7
  95. package/dist/GaugeChart/GaugeChart.js.map +1 -1
  96. package/dist/InfoTooltip/InfoTooltip.d.ts +3 -3
  97. package/dist/InfoTooltip/InfoTooltip.d.ts.map +1 -1
  98. package/dist/InfoTooltip/InfoTooltip.js +5 -5
  99. package/dist/InfoTooltip/InfoTooltip.js.map +1 -1
  100. package/dist/JSONEditor.d.ts +2 -1
  101. package/dist/JSONEditor.d.ts.map +1 -1
  102. package/dist/JSONEditor.js +5 -6
  103. package/dist/JSONEditor.js.map +1 -1
  104. package/dist/Legend/CompactLegend.d.ts +2 -1
  105. package/dist/Legend/CompactLegend.d.ts.map +1 -1
  106. package/dist/Legend/CompactLegend.js.map +1 -1
  107. package/dist/Legend/Legend.d.ts +2 -1
  108. package/dist/Legend/Legend.d.ts.map +1 -1
  109. package/dist/Legend/Legend.js +8 -4
  110. package/dist/Legend/Legend.js.map +1 -1
  111. package/dist/Legend/LegendColorBadge.d.ts +2 -2
  112. package/dist/Legend/LegendColorBadge.d.ts.map +1 -1
  113. package/dist/Legend/LegendColorBadge.js +2 -2
  114. package/dist/Legend/LegendColorBadge.js.map +1 -1
  115. package/dist/Legend/ListLegend.d.ts +2 -1
  116. package/dist/Legend/ListLegend.d.ts.map +1 -1
  117. package/dist/Legend/ListLegend.js.map +1 -1
  118. package/dist/Legend/ListLegendItem.d.ts +5 -5
  119. package/dist/Legend/ListLegendItem.d.ts.map +1 -1
  120. package/dist/Legend/ListLegendItem.js +8 -12
  121. package/dist/Legend/ListLegendItem.js.map +1 -1
  122. package/dist/Legend/TableLegend.d.ts +2 -1
  123. package/dist/Legend/TableLegend.d.ts.map +1 -1
  124. package/dist/Legend/TableLegend.js +1 -0
  125. package/dist/Legend/TableLegend.js.map +1 -1
  126. package/dist/Legend/legend-model.d.ts.map +1 -1
  127. package/dist/Legend/legend-model.js.map +1 -1
  128. package/dist/LineChart/LineChart.d.ts +1 -1
  129. package/dist/LineChart/LineChart.d.ts.map +1 -1
  130. package/dist/LineChart/LineChart.js +6 -11
  131. package/dist/LineChart/LineChart.js.map +1 -1
  132. package/dist/LinksEditor/LinksEditor.d.ts +8 -0
  133. package/dist/LinksEditor/LinksEditor.d.ts.map +1 -0
  134. package/dist/LinksEditor/LinksEditor.js +161 -0
  135. package/dist/LinksEditor/LinksEditor.js.map +1 -0
  136. package/dist/LinksEditor/index.d.ts +2 -0
  137. package/dist/LinksEditor/index.d.ts.map +1 -0
  138. package/dist/LinksEditor/index.js +15 -0
  139. package/dist/LinksEditor/index.js.map +1 -0
  140. package/dist/ModeSelector/ModeSelector.d.ts +2 -1
  141. package/dist/ModeSelector/ModeSelector.d.ts.map +1 -1
  142. package/dist/ModeSelector/ModeSelector.js.map +1 -1
  143. package/dist/OptionsEditorLayout/OptionsEditorColumn.d.ts +2 -2
  144. package/dist/OptionsEditorLayout/OptionsEditorColumn.d.ts.map +1 -1
  145. package/dist/OptionsEditorLayout/OptionsEditorColumn.js.map +1 -1
  146. package/dist/OptionsEditorLayout/OptionsEditorControl.d.ts +2 -1
  147. package/dist/OptionsEditorLayout/OptionsEditorControl.d.ts.map +1 -1
  148. package/dist/OptionsEditorLayout/OptionsEditorControl.js.map +1 -1
  149. package/dist/OptionsEditorLayout/OptionsEditorGrid.d.ts +2 -2
  150. package/dist/OptionsEditorLayout/OptionsEditorGrid.d.ts.map +1 -1
  151. package/dist/OptionsEditorLayout/OptionsEditorGrid.js.map +1 -1
  152. package/dist/OptionsEditorLayout/OptionsEditorGroup.d.ts +2 -2
  153. package/dist/OptionsEditorLayout/OptionsEditorGroup.d.ts.map +1 -1
  154. package/dist/OptionsEditorLayout/OptionsEditorGroup.js.map +1 -1
  155. package/dist/Overlay/Overlay.d.ts +16 -0
  156. package/dist/Overlay/Overlay.d.ts.map +1 -0
  157. package/dist/Overlay/Overlay.js +52 -0
  158. package/dist/Overlay/Overlay.js.map +1 -0
  159. package/dist/Overlay/index.d.ts +2 -0
  160. package/dist/Overlay/index.d.ts.map +1 -0
  161. package/dist/Overlay/index.js +15 -0
  162. package/dist/Overlay/index.js.map +1 -0
  163. package/dist/PieChart/PieChart.d.ts +14 -0
  164. package/dist/PieChart/PieChart.d.ts.map +1 -0
  165. package/dist/PieChart/PieChart.js +92 -0
  166. package/dist/PieChart/PieChart.js.map +1 -0
  167. package/dist/PieChart/index.d.ts +2 -0
  168. package/dist/PieChart/index.d.ts.map +1 -0
  169. package/dist/PieChart/index.js +15 -0
  170. package/dist/PieChart/index.js.map +1 -0
  171. package/dist/RefreshIntervalPicker/RefreshIntervalPicker.d.ts +2 -1
  172. package/dist/RefreshIntervalPicker/RefreshIntervalPicker.d.ts.map +1 -1
  173. package/dist/RefreshIntervalPicker/RefreshIntervalPicker.js.map +1 -1
  174. package/dist/SettingsAutocomplete/SettingsAutocomplete.d.ts +2 -2
  175. package/dist/SettingsAutocomplete/SettingsAutocomplete.d.ts.map +1 -1
  176. package/dist/SettingsAutocomplete/SettingsAutocomplete.js +6 -5
  177. package/dist/SettingsAutocomplete/SettingsAutocomplete.js.map +1 -1
  178. package/dist/SortSelector/SortSelector.d.ts +2 -1
  179. package/dist/SortSelector/SortSelector.d.ts.map +1 -1
  180. package/dist/SortSelector/SortSelector.js.map +1 -1
  181. package/dist/SortSelector/SortSelectorButtons.d.ts +9 -0
  182. package/dist/SortSelector/SortSelectorButtons.d.ts.map +1 -0
  183. package/dist/SortSelector/SortSelectorButtons.js +42 -0
  184. package/dist/SortSelector/SortSelectorButtons.js.map +1 -0
  185. package/dist/SortSelector/index.d.ts +1 -0
  186. package/dist/SortSelector/index.d.ts.map +1 -1
  187. package/dist/SortSelector/index.js +2 -1
  188. package/dist/SortSelector/index.js.map +1 -1
  189. package/dist/StatChart/StatChart.d.ts +6 -5
  190. package/dist/StatChart/StatChart.d.ts.map +1 -1
  191. package/dist/StatChart/StatChart.js +16 -18
  192. package/dist/StatChart/StatChart.js.map +1 -1
  193. package/dist/StatChart/calculateFontSize.d.ts.map +1 -1
  194. package/dist/StatChart/calculateFontSize.js +2 -4
  195. package/dist/StatChart/calculateFontSize.js.map +1 -1
  196. package/dist/StatChart/utils/formatStatChartValue.d.ts +3 -0
  197. package/dist/StatChart/utils/formatStatChartValue.d.ts.map +1 -0
  198. package/dist/StatChart/utils/formatStatChartValue.js +26 -0
  199. package/dist/StatChart/utils/formatStatChartValue.js.map +1 -0
  200. package/dist/StatusHistoryChart/StatusHistoryChart.d.ts +27 -0
  201. package/dist/StatusHistoryChart/StatusHistoryChart.d.ts.map +1 -0
  202. package/dist/StatusHistoryChart/StatusHistoryChart.js +132 -0
  203. package/dist/StatusHistoryChart/StatusHistoryChart.js.map +1 -0
  204. package/dist/StatusHistoryChart/StatusHistoryTooltip.d.ts +13 -0
  205. package/dist/StatusHistoryChart/StatusHistoryTooltip.d.ts.map +1 -0
  206. package/dist/StatusHistoryChart/StatusHistoryTooltip.js +47 -0
  207. package/dist/StatusHistoryChart/StatusHistoryTooltip.js.map +1 -0
  208. package/dist/StatusHistoryChart/get-formatted-axis-label.d.ts +2 -0
  209. package/dist/StatusHistoryChart/get-formatted-axis-label.d.ts.map +1 -0
  210. package/dist/StatusHistoryChart/get-formatted-axis-label.js +41 -0
  211. package/dist/StatusHistoryChart/get-formatted-axis-label.js.map +1 -0
  212. package/dist/StatusHistoryChart/index.d.ts +3 -0
  213. package/dist/StatusHistoryChart/index.d.ts.map +1 -0
  214. package/dist/StatusHistoryChart/index.js +16 -0
  215. package/dist/StatusHistoryChart/index.js.map +1 -0
  216. package/dist/StatusHistoryChart/utils/get-color.d.ts +6 -0
  217. package/dist/StatusHistoryChart/utils/get-color.d.ts.map +1 -0
  218. package/dist/StatusHistoryChart/utils/get-color.js +100 -0
  219. package/dist/StatusHistoryChart/utils/get-color.js.map +1 -0
  220. package/dist/StatusHistoryChart/utils/get-tooltip-position.d.ts +3 -0
  221. package/dist/StatusHistoryChart/utils/get-tooltip-position.d.ts.map +1 -0
  222. package/dist/StatusHistoryChart/utils/get-tooltip-position.js +27 -0
  223. package/dist/StatusHistoryChart/utils/get-tooltip-position.js.map +1 -0
  224. package/dist/Table/InnerTable.d.ts.map +1 -1
  225. package/dist/Table/InnerTable.js +2 -1
  226. package/dist/Table/InnerTable.js.map +1 -1
  227. package/dist/Table/Table.d.ts +2 -1
  228. package/dist/Table/Table.d.ts.map +1 -1
  229. package/dist/Table/Table.js +23 -10
  230. package/dist/Table/Table.js.map +1 -1
  231. package/dist/Table/TableCell.d.ts +5 -2
  232. package/dist/Table/TableCell.d.ts.map +1 -1
  233. package/dist/Table/TableCell.js +31 -7
  234. package/dist/Table/TableCell.js.map +1 -1
  235. package/dist/Table/TableCheckbox.d.ts +2 -1
  236. package/dist/Table/TableCheckbox.d.ts.map +1 -1
  237. package/dist/Table/TableCheckbox.js.map +1 -1
  238. package/dist/Table/TableFoot.d.ts +4 -0
  239. package/dist/Table/TableFoot.d.ts.map +1 -0
  240. package/dist/Table/TableFoot.js +23 -0
  241. package/dist/Table/TableFoot.js.map +1 -0
  242. package/dist/Table/TableHeaderCell.d.ts +3 -2
  243. package/dist/Table/TableHeaderCell.d.ts.map +1 -1
  244. package/dist/Table/TableHeaderCell.js.map +1 -1
  245. package/dist/Table/VirtualizedTable.d.ts +6 -4
  246. package/dist/Table/VirtualizedTable.d.ts.map +1 -1
  247. package/dist/Table/VirtualizedTable.js +49 -15
  248. package/dist/Table/VirtualizedTable.js.map +1 -1
  249. package/dist/Table/hooks/useTableKeyboardNav.d.ts +2 -2
  250. package/dist/Table/hooks/useTableKeyboardNav.d.ts.map +1 -1
  251. package/dist/Table/hooks/useTableKeyboardNav.js +1 -1
  252. package/dist/Table/hooks/useTableKeyboardNav.js.map +1 -1
  253. package/dist/Table/hooks/useVirtualizedTableKeyboardNav.d.ts +10 -12
  254. package/dist/Table/hooks/useVirtualizedTableKeyboardNav.d.ts.map +1 -1
  255. package/dist/Table/hooks/useVirtualizedTableKeyboardNav.js +7 -13
  256. package/dist/Table/hooks/useVirtualizedTableKeyboardNav.js.map +1 -1
  257. package/dist/Table/index.d.ts +1 -2
  258. package/dist/Table/index.d.ts.map +1 -1
  259. package/dist/Table/index.js +1 -1
  260. package/dist/Table/index.js.map +1 -1
  261. package/dist/Table/model/table-model.d.ts +40 -4
  262. package/dist/Table/model/table-model.d.ts.map +1 -1
  263. package/dist/Table/model/table-model.js +31 -23
  264. package/dist/Table/model/table-model.js.map +1 -1
  265. package/dist/ThresholdsEditor/ThresholdInput.d.ts +2 -2
  266. package/dist/ThresholdsEditor/ThresholdInput.d.ts.map +1 -1
  267. package/dist/ThresholdsEditor/ThresholdInput.js +2 -2
  268. package/dist/ThresholdsEditor/ThresholdInput.js.map +1 -1
  269. package/dist/ThresholdsEditor/ThresholdsEditor.d.ts +2 -1
  270. package/dist/ThresholdsEditor/ThresholdsEditor.d.ts.map +1 -1
  271. package/dist/ThresholdsEditor/ThresholdsEditor.js +19 -27
  272. package/dist/ThresholdsEditor/ThresholdsEditor.js.map +1 -1
  273. package/dist/TimeChart/TimeChart.d.ts.map +1 -1
  274. package/dist/TimeChart/TimeChart.js +9 -12
  275. package/dist/TimeChart/TimeChart.js.map +1 -1
  276. package/dist/TimeRangeSelector/DateTimeRangePicker.d.ts +19 -0
  277. package/dist/TimeRangeSelector/DateTimeRangePicker.d.ts.map +1 -0
  278. package/dist/{DateTimeRangePicker/AbsoluteTimePicker.js → TimeRangeSelector/DateTimeRangePicker.js} +44 -29
  279. package/dist/TimeRangeSelector/DateTimeRangePicker.js.map +1 -0
  280. package/dist/TimeRangeSelector/TimeRangeSelector.d.ts +36 -0
  281. package/dist/TimeRangeSelector/TimeRangeSelector.d.ts.map +1 -0
  282. package/dist/TimeRangeSelector/TimeRangeSelector.js +119 -0
  283. package/dist/TimeRangeSelector/TimeRangeSelector.js.map +1 -0
  284. package/dist/{DateTimeRangePicker → TimeRangeSelector}/index.d.ts +1 -2
  285. package/dist/TimeRangeSelector/index.d.ts.map +1 -0
  286. package/dist/{DateTimeRangePicker → TimeRangeSelector}/index.js +2 -3
  287. package/dist/TimeRangeSelector/index.js.map +1 -0
  288. package/dist/TimeRangeSelector/utils.d.ts +25 -0
  289. package/dist/TimeRangeSelector/utils.d.ts.map +1 -0
  290. package/dist/{DateTimeRangePicker → TimeRangeSelector}/utils.js +23 -2
  291. package/dist/TimeRangeSelector/utils.js.map +1 -0
  292. package/dist/TimeSeriesTooltip/LineChartTooltip.d.ts +2 -2
  293. package/dist/TimeSeriesTooltip/LineChartTooltip.d.ts.map +1 -1
  294. package/dist/TimeSeriesTooltip/LineChartTooltip.js +6 -14
  295. package/dist/TimeSeriesTooltip/LineChartTooltip.js.map +1 -1
  296. package/dist/TimeSeriesTooltip/SeriesInfo.d.ts +2 -1
  297. package/dist/TimeSeriesTooltip/SeriesInfo.d.ts.map +1 -1
  298. package/dist/TimeSeriesTooltip/SeriesInfo.js +1 -2
  299. package/dist/TimeSeriesTooltip/SeriesInfo.js.map +1 -1
  300. package/dist/TimeSeriesTooltip/SeriesLabelsStack.d.ts +2 -1
  301. package/dist/TimeSeriesTooltip/SeriesLabelsStack.d.ts.map +1 -1
  302. package/dist/TimeSeriesTooltip/SeriesLabelsStack.js.map +1 -1
  303. package/dist/TimeSeriesTooltip/SeriesMarker.d.ts +2 -1
  304. package/dist/TimeSeriesTooltip/SeriesMarker.d.ts.map +1 -1
  305. package/dist/TimeSeriesTooltip/SeriesMarker.js.map +1 -1
  306. package/dist/TimeSeriesTooltip/TimeChartTooltip.d.ts +2 -2
  307. package/dist/TimeSeriesTooltip/TimeChartTooltip.d.ts.map +1 -1
  308. package/dist/TimeSeriesTooltip/TimeChartTooltip.js +2 -6
  309. package/dist/TimeSeriesTooltip/TimeChartTooltip.js.map +1 -1
  310. package/dist/TimeSeriesTooltip/TooltipContent.d.ts +2 -1
  311. package/dist/TimeSeriesTooltip/TooltipContent.d.ts.map +1 -1
  312. package/dist/TimeSeriesTooltip/TooltipContent.js.map +1 -1
  313. package/dist/TimeSeriesTooltip/TooltipHeader.d.ts.map +1 -1
  314. package/dist/TimeSeriesTooltip/TooltipHeader.js +6 -14
  315. package/dist/TimeSeriesTooltip/TooltipHeader.js.map +1 -1
  316. package/dist/TimeSeriesTooltip/nearby-series.d.ts.map +1 -1
  317. package/dist/TimeSeriesTooltip/nearby-series.js +15 -25
  318. package/dist/TimeSeriesTooltip/nearby-series.js.map +1 -1
  319. package/dist/TimeSeriesTooltip/tooltip-model.d.ts +8 -1
  320. package/dist/TimeSeriesTooltip/tooltip-model.d.ts.map +1 -1
  321. package/dist/TimeSeriesTooltip/tooltip-model.js +13 -2
  322. package/dist/TimeSeriesTooltip/tooltip-model.js.map +1 -1
  323. package/dist/TimeSeriesTooltip/utils.d.ts +2 -22
  324. package/dist/TimeSeriesTooltip/utils.d.ts.map +1 -1
  325. package/dist/TimeSeriesTooltip/utils.js +29 -27
  326. package/dist/TimeSeriesTooltip/utils.js.map +1 -1
  327. package/dist/ToolbarIconButton/ToolbarIconButton.js.map +1 -1
  328. package/dist/TransformsEditor/TransformEditor.d.ts +9 -0
  329. package/dist/TransformsEditor/TransformEditor.d.ts.map +1 -0
  330. package/dist/TransformsEditor/TransformEditor.js +289 -0
  331. package/dist/TransformsEditor/TransformEditor.js.map +1 -0
  332. package/dist/TransformsEditor/TransformEditorContainer.d.ts +10 -0
  333. package/dist/TransformsEditor/TransformEditorContainer.d.ts.map +1 -0
  334. package/dist/TransformsEditor/TransformEditorContainer.js +118 -0
  335. package/dist/TransformsEditor/TransformEditorContainer.js.map +1 -0
  336. package/dist/TransformsEditor/TransformsEditor.d.ts +9 -0
  337. package/dist/TransformsEditor/TransformsEditor.d.ts.map +1 -0
  338. package/dist/TransformsEditor/TransformsEditor.js +90 -0
  339. package/dist/TransformsEditor/TransformsEditor.js.map +1 -0
  340. package/dist/TransformsEditor/index.d.ts +2 -0
  341. package/dist/TransformsEditor/index.d.ts.map +1 -0
  342. package/dist/TransformsEditor/index.js +15 -0
  343. package/dist/TransformsEditor/index.js.map +1 -0
  344. package/dist/ValueMappingEditor/ValueMappingEditor.d.ts +10 -0
  345. package/dist/ValueMappingEditor/ValueMappingEditor.d.ts.map +1 -0
  346. package/dist/ValueMappingEditor/ValueMappingEditor.js +374 -0
  347. package/dist/ValueMappingEditor/ValueMappingEditor.js.map +1 -0
  348. package/dist/ValueMappingEditor/ValueMappingsEditor.d.ts +8 -0
  349. package/dist/ValueMappingEditor/ValueMappingsEditor.d.ts.map +1 -0
  350. package/dist/ValueMappingEditor/ValueMappingsEditor.js +118 -0
  351. package/dist/ValueMappingEditor/ValueMappingsEditor.js.map +1 -0
  352. package/dist/ValueMappingEditor/index.d.ts +2 -0
  353. package/dist/ValueMappingEditor/index.d.ts.map +1 -0
  354. package/dist/ValueMappingEditor/index.js +15 -0
  355. package/dist/ValueMappingEditor/index.js.map +1 -0
  356. package/dist/YAxisLabel.d.ts +2 -1
  357. package/dist/YAxisLabel.d.ts.map +1 -1
  358. package/dist/YAxisLabel.js +4 -2
  359. package/dist/YAxisLabel.js.map +1 -1
  360. package/dist/cjs/AlignSelector/AlignSelector.js +50 -0
  361. package/dist/cjs/AlignSelector/index.js +30 -0
  362. package/dist/cjs/BarChart/BarChart.js +12 -7
  363. package/dist/cjs/ColorPicker/ColorPicker.js +28 -54
  364. package/dist/cjs/{ThresholdsEditor/ThresholdColorPicker.js → ColorPicker/OptionsColorPicker.js} +18 -15
  365. package/dist/cjs/ColorPicker/index.js +1 -0
  366. package/dist/cjs/ContentWithLegend/ContentWithLegend.js +8 -10
  367. package/dist/cjs/ContentWithLegend/model/content-with-legend-model.js +2 -3
  368. package/dist/cjs/DensitySelector/DensitySelector.js +54 -0
  369. package/dist/cjs/DensitySelector/index.js +30 -0
  370. package/dist/cjs/Dialog/Dialog.js +7 -3
  371. package/dist/cjs/DragAndDrop/DragAndDropList.js +159 -0
  372. package/dist/cjs/DragAndDrop/DragButton.js +123 -0
  373. package/dist/cjs/DragAndDrop/DropIndicator.js +52 -0
  374. package/dist/cjs/DragAndDrop/index.js +32 -0
  375. package/dist/cjs/DragAndDrop/model.js +25 -0
  376. package/dist/cjs/Drawer/Drawer.js +1 -1
  377. package/dist/cjs/EChart/EChart.js +25 -49
  378. package/dist/cjs/FormEditor/FormActions.js +83 -0
  379. package/dist/cjs/FormEditor/index.js +30 -0
  380. package/dist/cjs/FormatControls/FormatControls.js +2 -2
  381. package/dist/cjs/GaugeChart/GaugeChart.js +5 -8
  382. package/dist/cjs/InfoTooltip/InfoTooltip.js +5 -10
  383. package/dist/cjs/JSONEditor.js +4 -5
  384. package/dist/cjs/Legend/Legend.js +8 -4
  385. package/dist/cjs/Legend/LegendColorBadge.js +2 -7
  386. package/dist/cjs/Legend/ListLegendItem.js +6 -50
  387. package/dist/cjs/Legend/TableLegend.js +1 -0
  388. package/dist/cjs/LineChart/LineChart.js +8 -13
  389. package/dist/cjs/LinksEditor/LinksEditor.js +174 -0
  390. package/dist/cjs/LinksEditor/index.js +30 -0
  391. package/dist/cjs/Overlay/Overlay.js +71 -0
  392. package/dist/cjs/Overlay/index.js +30 -0
  393. package/dist/cjs/PieChart/PieChart.js +100 -0
  394. package/dist/cjs/PieChart/index.js +30 -0
  395. package/dist/cjs/SettingsAutocomplete/SettingsAutocomplete.js +6 -5
  396. package/dist/cjs/SortSelector/SortSelectorButtons.js +50 -0
  397. package/dist/cjs/SortSelector/index.js +2 -1
  398. package/dist/cjs/StatChart/StatChart.js +19 -21
  399. package/dist/cjs/StatChart/calculateFontSize.js +2 -4
  400. package/dist/cjs/StatChart/utils/formatStatChartValue.js +34 -0
  401. package/dist/cjs/StatusHistoryChart/StatusHistoryChart.js +140 -0
  402. package/dist/cjs/StatusHistoryChart/StatusHistoryTooltip.js +55 -0
  403. package/dist/cjs/StatusHistoryChart/get-formatted-axis-label.js +48 -0
  404. package/dist/cjs/StatusHistoryChart/index.js +31 -0
  405. package/dist/cjs/StatusHistoryChart/utils/get-color.js +125 -0
  406. package/dist/cjs/StatusHistoryChart/utils/get-tooltip-position.js +35 -0
  407. package/dist/cjs/Table/InnerTable.js +2 -1
  408. package/dist/cjs/Table/Table.js +21 -8
  409. package/dist/cjs/Table/TableCell.js +31 -7
  410. package/dist/cjs/Table/TableFoot.js +31 -0
  411. package/dist/cjs/Table/VirtualizedTable.js +48 -14
  412. package/dist/cjs/Table/hooks/useTableKeyboardNav.js +1 -1
  413. package/dist/cjs/Table/hooks/useVirtualizedTableKeyboardNav.js +7 -13
  414. package/dist/cjs/Table/index.js +1 -7
  415. package/dist/cjs/Table/model/table-model.js +37 -23
  416. package/dist/cjs/ThresholdsEditor/ThresholdInput.js +2 -2
  417. package/dist/cjs/ThresholdsEditor/ThresholdsEditor.js +27 -35
  418. package/dist/cjs/TimeChart/TimeChart.js +8 -11
  419. package/dist/cjs/{DateTimeRangePicker/AbsoluteTimePicker.js → TimeRangeSelector/DateTimeRangePicker.js} +39 -32
  420. package/dist/cjs/TimeRangeSelector/TimeRangeSelector.js +127 -0
  421. package/dist/cjs/{DateTimeRangePicker → TimeRangeSelector}/index.js +2 -3
  422. package/dist/cjs/{DateTimeRangePicker → TimeRangeSelector}/utils.js +24 -1
  423. package/dist/cjs/TimeSeriesTooltip/LineChartTooltip.js +5 -13
  424. package/dist/cjs/TimeSeriesTooltip/SeriesInfo.js +1 -2
  425. package/dist/cjs/TimeSeriesTooltip/TimeChartTooltip.js +1 -5
  426. package/dist/cjs/TimeSeriesTooltip/TooltipHeader.js +6 -14
  427. package/dist/cjs/TimeSeriesTooltip/nearby-series.js +15 -25
  428. package/dist/cjs/TimeSeriesTooltip/tooltip-model.js +22 -2
  429. package/dist/cjs/TimeSeriesTooltip/utils.js +28 -26
  430. package/dist/cjs/TransformsEditor/TransformEditor.js +297 -0
  431. package/dist/cjs/TransformsEditor/TransformEditorContainer.js +131 -0
  432. package/dist/cjs/TransformsEditor/TransformsEditor.js +103 -0
  433. package/dist/cjs/TransformsEditor/index.js +30 -0
  434. package/dist/cjs/ValueMappingEditor/ValueMappingEditor.js +387 -0
  435. package/dist/cjs/ValueMappingEditor/ValueMappingsEditor.js +131 -0
  436. package/dist/cjs/ValueMappingEditor/index.js +30 -0
  437. package/dist/cjs/YAxisLabel.js +4 -2
  438. package/dist/cjs/context/TimeZoneProvider.js +1 -1
  439. package/dist/cjs/controls/TextField.js +54 -0
  440. package/dist/cjs/controls/index.js +30 -0
  441. package/dist/cjs/index.js +12 -1
  442. package/dist/cjs/model/timeOption.js +19 -1
  443. package/dist/cjs/theme/index.js +1 -0
  444. package/dist/cjs/theme/palette/background.js +2 -0
  445. package/dist/cjs/theme/theme.js +6 -6
  446. package/dist/cjs/utils/chart-actions.js +2 -3
  447. package/dist/cjs/utils/format.js +19 -1
  448. package/dist/cjs/utils/theme-gen.js +5 -7
  449. package/dist/context/ChartsProvider.d.ts +2 -2
  450. package/dist/context/ChartsProvider.d.ts.map +1 -1
  451. package/dist/context/ChartsProvider.js.map +1 -1
  452. package/dist/context/SnackbarProvider.js.map +1 -1
  453. package/dist/context/TimeZoneProvider.d.ts +4 -4
  454. package/dist/context/TimeZoneProvider.d.ts.map +1 -1
  455. package/dist/context/TimeZoneProvider.js +1 -1
  456. package/dist/context/TimeZoneProvider.js.map +1 -1
  457. package/dist/controls/TextField.d.ts +9 -0
  458. package/dist/controls/TextField.d.ts.map +1 -0
  459. package/dist/controls/TextField.js +41 -0
  460. package/dist/controls/TextField.js.map +1 -0
  461. package/dist/controls/index.d.ts +2 -0
  462. package/dist/controls/index.d.ts.map +1 -0
  463. package/dist/controls/index.js +15 -0
  464. package/dist/controls/index.js.map +1 -0
  465. package/dist/index.d.ts +12 -1
  466. package/dist/index.d.ts.map +1 -1
  467. package/dist/index.js +12 -1
  468. package/dist/index.js.map +1 -1
  469. package/dist/model/timeOption.d.ts +2 -1
  470. package/dist/model/timeOption.d.ts.map +1 -1
  471. package/dist/model/timeOption.js +13 -2
  472. package/dist/model/timeOption.js.map +1 -1
  473. package/dist/test/render.d.ts +3 -3
  474. package/dist/test/render.d.ts.map +1 -1
  475. package/dist/test/render.js.map +1 -1
  476. package/dist/theme/component-overrides/alert.js.map +1 -1
  477. package/dist/theme/index.d.ts +2 -0
  478. package/dist/theme/index.d.ts.map +1 -1
  479. package/dist/theme/index.js +1 -0
  480. package/dist/theme/index.js.map +1 -1
  481. package/dist/theme/palette/background.d.ts.map +1 -1
  482. package/dist/theme/palette/background.js +2 -0
  483. package/dist/theme/palette/background.js.map +1 -1
  484. package/dist/theme/theme.d.ts +2 -2
  485. package/dist/theme/theme.d.ts.map +1 -1
  486. package/dist/theme/theme.js +5 -5
  487. package/dist/theme/theme.js.map +1 -1
  488. package/dist/utils/axis.d.ts +1 -7
  489. package/dist/utils/axis.d.ts.map +1 -1
  490. package/dist/utils/axis.js.map +1 -1
  491. package/dist/utils/chart-actions.d.ts.map +1 -1
  492. package/dist/utils/chart-actions.js +2 -3
  493. package/dist/utils/chart-actions.js.map +1 -1
  494. package/dist/utils/component-ids.d.ts.map +1 -1
  495. package/dist/utils/component-ids.js.map +1 -1
  496. package/dist/utils/format.d.ts +10 -4
  497. package/dist/utils/format.d.ts.map +1 -1
  498. package/dist/utils/format.js +16 -1
  499. package/dist/utils/format.js.map +1 -1
  500. package/dist/utils/theme-gen.js +5 -7
  501. package/dist/utils/theme-gen.js.map +1 -1
  502. package/package.json +14 -13
  503. package/dist/DateTimeRangePicker/AbsoluteTimePicker.d.ts +0 -9
  504. package/dist/DateTimeRangePicker/AbsoluteTimePicker.d.ts.map +0 -1
  505. package/dist/DateTimeRangePicker/AbsoluteTimePicker.js.map +0 -1
  506. package/dist/DateTimeRangePicker/DateTimeRangePicker.d.ts +0 -11
  507. package/dist/DateTimeRangePicker/DateTimeRangePicker.d.ts.map +0 -1
  508. package/dist/DateTimeRangePicker/DateTimeRangePicker.js +0 -80
  509. package/dist/DateTimeRangePicker/DateTimeRangePicker.js.map +0 -1
  510. package/dist/DateTimeRangePicker/TimeRangeSelector.d.ts +0 -13
  511. package/dist/DateTimeRangePicker/TimeRangeSelector.d.ts.map +0 -1
  512. package/dist/DateTimeRangePicker/TimeRangeSelector.js +0 -67
  513. package/dist/DateTimeRangePicker/TimeRangeSelector.js.map +0 -1
  514. package/dist/DateTimeRangePicker/index.d.ts.map +0 -1
  515. package/dist/DateTimeRangePicker/index.js.map +0 -1
  516. package/dist/DateTimeRangePicker/utils.d.ts +0 -7
  517. package/dist/DateTimeRangePicker/utils.d.ts.map +0 -1
  518. package/dist/DateTimeRangePicker/utils.js.map +0 -1
  519. package/dist/ThresholdsEditor/ThresholdColorPicker.d.ts +0 -3
  520. package/dist/ThresholdsEditor/ThresholdColorPicker.d.ts.map +0 -1
  521. package/dist/ThresholdsEditor/ThresholdColorPicker.js.map +0 -1
  522. package/dist/cjs/DateTimeRangePicker/DateTimeRangePicker.js +0 -88
  523. package/dist/cjs/DateTimeRangePicker/TimeRangeSelector.js +0 -80
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import { MouseEvent } from 'react';
2
2
  import { ListItemProps } from '@mui/material';
3
3
  import { LegendItem } from './legend-model';
4
4
  export type LegendItemEventOpts = {
@@ -19,9 +19,9 @@ export interface ListLegendItemProps extends Omit<ListItemProps<'div'>, 'onClick
19
19
  * selected.
20
20
  */
21
21
  isVisuallySelected?: boolean;
22
- onClick: (e: React.MouseEvent<HTMLElement, MouseEvent>, seriesId: string) => void;
23
- onMouseOver?: (e: React.MouseEvent, opts: LegendItemEventOpts) => void;
24
- onMouseOut?: (e: React.MouseEvent, opts: LegendItemEventOpts) => void;
22
+ onClick: (e: MouseEvent<HTMLElement>, seriesId: string) => void;
23
+ onMouseOver?: (e: MouseEvent, opts: LegendItemEventOpts) => void;
24
+ onMouseOut?: (e: MouseEvent, opts: LegendItemEventOpts) => void;
25
25
  /**
26
26
  * When `true`, will keep labels to a single line with overflow ellipsized. The
27
27
  * full content will be shown on hover.
@@ -30,5 +30,5 @@ export interface ListLegendItemProps extends Omit<ListItemProps<'div'>, 'onClick
30
30
  */
31
31
  truncateLabel?: boolean;
32
32
  }
33
- export declare const ListLegendItem: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<ListLegendItemProps, "ref"> & React.RefAttributes<HTMLDivElement>>>;
33
+ export declare const ListLegendItem: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Omit<ListLegendItemProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>>;
34
34
  //# sourceMappingURL=ListLegendItem.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"ListLegendItem.d.ts","sourceRoot":"","sources":["../../src/Legend/ListLegendItem.tsx"],"names":[],"mappings":"AAaA,OAAO,KAA+B,MAAM,OAAO,CAAC;AACpD,OAAO,EAA+B,aAAa,EAAE,MAAM,eAAe,CAAC;AAG3E,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,MAAM,mBAAmB,GAAG;IAChC;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,EAAE,SAAS,GAAG,aAAa,GAAG,YAAY,CAAC;IAC/G,IAAI,EAAE,UAAU,CAAC;IAEjB,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B,OAAO,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAElF,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACvE,UAAU,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAEtE;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AA0DD,eAAO,MAAM,cAAc,oIAAiC,CAAC"}
1
+ {"version":3,"file":"ListLegendItem.d.ts","sourceRoot":"","sources":["../../src/Legend/ListLegendItem.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAoB,UAAU,EAA6C,MAAM,OAAO,CAAC;AAChG,OAAO,EAAqB,aAAa,EAAkB,MAAM,eAAe,CAAC;AAGjF,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,MAAM,mBAAmB,GAAG;IAChC;;OAEG;IACH,EAAE,EAAE,MAAM,CAAC;IAEX;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,EAAE,SAAS,GAAG,aAAa,GAAG,YAAY,CAAC;IAC/G,IAAI,EAAE,UAAU,CAAC;IAEjB,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAE7B,OAAO,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,EAAE,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAEhE,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACjE,UAAU,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,EAAE,IAAI,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAEhE;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAwDD,eAAO,MAAM,cAAc,kKAA2B,CAAC"}
@@ -10,10 +10,9 @@
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 { jsx as _jsx } from "react/jsx-runtime";
14
- import { createElement as _createElement } from "react";
15
- import React, { forwardRef, useState } from 'react';
16
- import { Box, ListItemText, ListItem } from '@mui/material';
13
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
14
+ import { forwardRef, memo, useState } from 'react';
15
+ import { Box, ListItemText, ListItemButton } from '@mui/material';
17
16
  import { combineSx } from '../utils';
18
17
  import { LegendColorBadge } from './LegendColorBadge';
19
18
  const ListLegendItemBase = /*#__PURE__*/ forwardRef(function ListLegendItem({ item, sx, truncateLabel, onClick, isVisuallySelected, onMouseOver, onMouseOut, index, ...others }, ref) {
@@ -29,26 +28,23 @@ const ListLegendItemBase = /*#__PURE__*/ forwardRef(function ListLegendItem({ it
29
28
  }
30
29
  }
31
30
  const handleClick = (e)=>{
32
- var _item_onClick;
33
31
  onClick(e, item.id);
34
- (_item_onClick = item.onClick) === null || _item_onClick === void 0 ? void 0 : _item_onClick.call(item, e);
32
+ item.onClick?.(e);
35
33
  };
36
- return /*#__PURE__*/ _createElement(ListItem, {
34
+ return /*#__PURE__*/ _jsxs(ListItemButton, {
37
35
  ...others,
38
- component: "div",
39
36
  role: "listitem",
40
37
  sx: combineSx({
41
38
  padding: 0,
42
39
  cursor: 'pointer'
43
40
  }, sx),
44
41
  dense: true,
45
- key: item.id,
46
42
  onClick: handleClick,
47
- onMouseOver: (e)=>onMouseOver === null || onMouseOver === void 0 ? void 0 : onMouseOver(e, {
43
+ onMouseOver: (e)=>onMouseOver?.(e, {
48
44
  id: item.id,
49
45
  index
50
46
  }),
51
- onMouseOut: (e)=>onMouseOut === null || onMouseOut === void 0 ? void 0 : onMouseOut(e, {
47
+ onMouseOut: (e)=>onMouseOut?.(e, {
52
48
  id: item.id,
53
49
  index
54
50
  }),
@@ -75,6 +71,6 @@ const ListLegendItemBase = /*#__PURE__*/ forwardRef(function ListLegendItem({ it
75
71
  ]
76
72
  });
77
73
  });
78
- export const ListLegendItem = /*#__PURE__*/ React.memo(ListLegendItemBase);
74
+ export const ListLegendItem = /*#__PURE__*/ memo(ListLegendItemBase);
79
75
 
80
76
  //# sourceMappingURL=ListLegendItem.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Legend/ListLegendItem.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport React, { forwardRef, useState } from 'react';\nimport { Box, ListItemText, ListItem, ListItemProps } from '@mui/material';\nimport { combineSx } from '../utils';\nimport { LegendColorBadge } from './LegendColorBadge';\nimport { LegendItem } from './legend-model';\n\nexport type LegendItemEventOpts = {\n /**\n * Unique identifier for the legend item.\n */\n id: string;\n\n /**\n * Index of the row in the original data.\n */\n index: number;\n};\n\nexport interface ListLegendItemProps extends Omit<ListItemProps<'div'>, 'onClick' | 'onMouseOver' | 'onMouseOut'> {\n item: LegendItem;\n\n index: number;\n\n /**\n * When true, the item is rendered differently to visually communicate it is\n * selected.\n */\n isVisuallySelected?: boolean;\n\n onClick: (e: React.MouseEvent<HTMLElement, MouseEvent>, seriesId: string) => void;\n\n onMouseOver?: (e: React.MouseEvent, opts: LegendItemEventOpts) => void;\n onMouseOut?: (e: React.MouseEvent, opts: LegendItemEventOpts) => void;\n\n /**\n * When `true`, will keep labels to a single line with overflow ellipsized. The\n * full content will be shown on hover.\n *\n * When `false` or unset, will show the full label.\n */\n truncateLabel?: boolean;\n}\n\nconst ListLegendItemBase = forwardRef<HTMLDivElement, ListLegendItemProps>(function ListLegendItem(\n { item, sx, truncateLabel, onClick, isVisuallySelected, onMouseOver, onMouseOut, index, ...others },\n ref\n) {\n const [noWrap, setNoWrap] = useState(truncateLabel);\n\n function handleTextMouseOver() {\n if (truncateLabel) {\n setNoWrap(false);\n }\n }\n\n function handleTextMouseOut() {\n if (truncateLabel) {\n setNoWrap(true);\n }\n }\n\n const handleClick: React.MouseEventHandler<HTMLDivElement> = (e) => {\n onClick(e, item.id);\n item.onClick?.(e);\n };\n\n return (\n <ListItem\n {...others}\n component=\"div\"\n role=\"listitem\"\n sx={combineSx(\n {\n padding: 0,\n cursor: 'pointer',\n },\n sx\n )}\n dense={true}\n key={item.id}\n onClick={handleClick}\n onMouseOver={(e: React.MouseEvent) => onMouseOver?.(e, { id: item.id, index })}\n onMouseOut={(e: React.MouseEvent) => onMouseOut?.(e, { id: item.id, index })}\n selected={isVisuallySelected}\n ref={ref}\n >\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\n <LegendColorBadge color={item.color} />\n </Box>\n <ListItemText\n primary={item.label}\n primaryTypographyProps={{ noWrap: noWrap }}\n onMouseOver={handleTextMouseOver}\n onMouseOut={handleTextMouseOut}\n ></ListItemText>\n </ListItem>\n );\n});\n\nexport const ListLegendItem = React.memo(ListLegendItemBase);\n"],"names":["React","forwardRef","useState","Box","ListItemText","ListItem","combineSx","LegendColorBadge","ListLegendItemBase","ListLegendItem","item","sx","truncateLabel","onClick","isVisuallySelected","onMouseOver","onMouseOut","index","others","ref","noWrap","setNoWrap","handleTextMouseOver","handleTextMouseOut","handleClick","e","id","component","role","padding","cursor","dense","key","selected","display","alignItems","color","primary","label","primaryTypographyProps","memo"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;;AAEjC,OAAOA,SAASC,UAAU,EAAEC,QAAQ,QAAQ,QAAQ;AACpD,SAASC,GAAG,EAAEC,YAAY,EAAEC,QAAQ,QAAuB,gBAAgB;AAC3E,SAASC,SAAS,QAAQ,WAAW;AACrC,SAASC,gBAAgB,QAAQ,qBAAqB;AAwCtD,MAAMC,mCAAqBP,WAAgD,SAASQ,eAClF,EAAEC,IAAI,EAAEC,EAAE,EAAEC,aAAa,EAAEC,OAAO,EAAEC,kBAAkB,EAAEC,WAAW,EAAEC,UAAU,EAAEC,KAAK,EAAE,GAAGC,QAAQ,EACnGC,GAAG;IAEH,MAAM,CAACC,QAAQC,UAAU,GAAGnB,SAASU;IAErC,SAASU;QACP,IAAIV,eAAe;YACjBS,UAAU;QACZ;IACF;IAEA,SAASE;QACP,IAAIX,eAAe;YACjBS,UAAU;QACZ;IACF;IAEA,MAAMG,cAAuD,CAACC;YAE5Df;QADAG,QAAQY,GAAGf,KAAKgB,EAAE;SAClBhB,gBAAAA,KAAKG,OAAO,cAAZH,oCAAAA,mBAAAA,MAAee;IACjB;IAEA,qBACE,eAACpB;QACE,GAAGa,MAAM;QACVS,WAAU;QACVC,MAAK;QACLjB,IAAIL,UACF;YACEuB,SAAS;YACTC,QAAQ;QACV,GACAnB;QAEFoB,OAAO;QACPC,KAAKtB,KAAKgB,EAAE;QACZb,SAASW;QACTT,aAAa,CAACU,IAAwBV,wBAAAA,kCAAAA,YAAcU,GAAG;gBAAEC,IAAIhB,KAAKgB,EAAE;gBAAET;YAAM;QAC5ED,YAAY,CAACS,IAAwBT,uBAAAA,iCAAAA,WAAaS,GAAG;gBAAEC,IAAIhB,KAAKgB,EAAE;gBAAET;YAAM;QAC1EgB,UAAUnB;QACVK,KAAKA;;0BAEL,KAAChB;gBAAIQ,IAAI;oBAAEuB,SAAS;oBAAQC,YAAY;gBAAS;0BAC/C,cAAA,KAAC5B;oBAAiB6B,OAAO1B,KAAK0B,KAAK;;;0BAErC,KAAChC;gBACCiC,SAAS3B,KAAK4B,KAAK;gBACnBC,wBAAwB;oBAAEnB,QAAQA;gBAAO;gBACzCL,aAAaO;gBACbN,YAAYO;;;;AAIpB;AAEA,OAAO,MAAMd,+BAAiBT,MAAMwC,IAAI,CAAChC,oBAAoB"}
1
+ {"version":3,"sources":["../../src/Legend/ListLegendItem.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { forwardRef, memo, MouseEvent, MouseEventHandler, ReactElement, useState } from 'react';\nimport { Box, ListItemText, ListItemProps, ListItemButton } from '@mui/material';\nimport { combineSx } from '../utils';\nimport { LegendColorBadge } from './LegendColorBadge';\nimport { LegendItem } from './legend-model';\n\nexport type LegendItemEventOpts = {\n /**\n * Unique identifier for the legend item.\n */\n id: string;\n\n /**\n * Index of the row in the original data.\n */\n index: number;\n};\n\nexport interface ListLegendItemProps extends Omit<ListItemProps<'div'>, 'onClick' | 'onMouseOver' | 'onMouseOut'> {\n item: LegendItem;\n\n index: number;\n\n /**\n * When true, the item is rendered differently to visually communicate it is\n * selected.\n */\n isVisuallySelected?: boolean;\n\n onClick: (e: MouseEvent<HTMLElement>, seriesId: string) => void;\n\n onMouseOver?: (e: MouseEvent, opts: LegendItemEventOpts) => void;\n onMouseOut?: (e: MouseEvent, opts: LegendItemEventOpts) => void;\n\n /**\n * When `true`, will keep labels to a single line with overflow ellipsized. The\n * full content will be shown on hover.\n *\n * When `false` or unset, will show the full label.\n */\n truncateLabel?: boolean;\n}\n\nconst ListLegendItemBase = forwardRef<HTMLDivElement, ListLegendItemProps>(function ListLegendItem(\n { item, sx, truncateLabel, onClick, isVisuallySelected, onMouseOver, onMouseOut, index, ...others },\n ref\n): ReactElement {\n const [noWrap, setNoWrap] = useState(truncateLabel);\n\n function handleTextMouseOver(): void {\n if (truncateLabel) {\n setNoWrap(false);\n }\n }\n\n function handleTextMouseOut(): void {\n if (truncateLabel) {\n setNoWrap(true);\n }\n }\n\n const handleClick: MouseEventHandler<HTMLDivElement> = (e) => {\n onClick(e, item.id);\n item.onClick?.(e);\n };\n\n return (\n <ListItemButton\n {...others}\n role=\"listitem\"\n sx={combineSx(\n {\n padding: 0,\n cursor: 'pointer',\n },\n sx\n )}\n dense={true}\n onClick={handleClick}\n onMouseOver={(e: MouseEvent) => onMouseOver?.(e, { id: item.id, index })}\n onMouseOut={(e: MouseEvent) => onMouseOut?.(e, { id: item.id, index })}\n selected={isVisuallySelected}\n ref={ref}\n >\n <Box sx={{ display: 'flex', alignItems: 'center' }}>\n <LegendColorBadge color={item.color} />\n </Box>\n <ListItemText\n primary={item.label}\n primaryTypographyProps={{ noWrap: noWrap }}\n onMouseOver={handleTextMouseOver}\n onMouseOut={handleTextMouseOut}\n ></ListItemText>\n </ListItemButton>\n );\n});\n\nexport const ListLegendItem = memo(ListLegendItemBase);\n"],"names":["forwardRef","memo","useState","Box","ListItemText","ListItemButton","combineSx","LegendColorBadge","ListLegendItemBase","ListLegendItem","item","sx","truncateLabel","onClick","isVisuallySelected","onMouseOver","onMouseOut","index","others","ref","noWrap","setNoWrap","handleTextMouseOver","handleTextMouseOut","handleClick","e","id","role","padding","cursor","dense","selected","display","alignItems","color","primary","label","primaryTypographyProps"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAEjC,SAASA,UAAU,EAAEC,IAAI,EAA+CC,QAAQ,QAAQ,QAAQ;AAChG,SAASC,GAAG,EAAEC,YAAY,EAAiBC,cAAc,QAAQ,gBAAgB;AACjF,SAASC,SAAS,QAAQ,WAAW;AACrC,SAASC,gBAAgB,QAAQ,qBAAqB;AAwCtD,MAAMC,mCAAqBR,WAAgD,SAASS,eAClF,EAAEC,IAAI,EAAEC,EAAE,EAAEC,aAAa,EAAEC,OAAO,EAAEC,kBAAkB,EAAEC,WAAW,EAAEC,UAAU,EAAEC,KAAK,EAAE,GAAGC,QAAQ,EACnGC,GAAG;IAEH,MAAM,CAACC,QAAQC,UAAU,GAAGnB,SAASU;IAErC,SAASU;QACP,IAAIV,eAAe;YACjBS,UAAU;QACZ;IACF;IAEA,SAASE;QACP,IAAIX,eAAe;YACjBS,UAAU;QACZ;IACF;IAEA,MAAMG,cAAiD,CAACC;QACtDZ,QAAQY,GAAGf,KAAKgB,EAAE;QAClBhB,KAAKG,OAAO,GAAGY;IACjB;IAEA,qBACE,MAACpB;QACE,GAAGa,MAAM;QACVS,MAAK;QACLhB,IAAIL,UACF;YACEsB,SAAS;YACTC,QAAQ;QACV,GACAlB;QAEFmB,OAAO;QACPjB,SAASW;QACTT,aAAa,CAACU,IAAkBV,cAAcU,GAAG;gBAAEC,IAAIhB,KAAKgB,EAAE;gBAAET;YAAM;QACtED,YAAY,CAACS,IAAkBT,aAAaS,GAAG;gBAAEC,IAAIhB,KAAKgB,EAAE;gBAAET;YAAM;QACpEc,UAAUjB;QACVK,KAAKA;;0BAEL,KAAChB;gBAAIQ,IAAI;oBAAEqB,SAAS;oBAAQC,YAAY;gBAAS;0BAC/C,cAAA,KAAC1B;oBAAiB2B,OAAOxB,KAAKwB,KAAK;;;0BAErC,KAAC9B;gBACC+B,SAASzB,KAAK0B,KAAK;gBACnBC,wBAAwB;oBAAEjB,QAAQA;gBAAO;gBACzCL,aAAaO;gBACbN,YAAYO;;;;AAIpB;AAEA,OAAO,MAAMd,+BAAiBR,KAAKO,oBAAoB"}
@@ -1,3 +1,4 @@
1
+ import { ReactElement } from 'react';
1
2
  import { TableProps } from '../Table';
2
3
  import { LegendItem } from './legend-model';
3
4
  export interface TableLegendProps extends Pick<TableProps<LegendItem>, 'sorting' | 'onSortingChange'> {
@@ -10,5 +11,5 @@ export interface TableLegendProps extends Pick<TableProps<LegendItem>, 'sorting'
10
11
  onItemMouseOut?: TableProps<LegendItem>['onRowMouseOut'];
11
12
  columns?: TableProps<LegendItem>['columns'];
12
13
  }
13
- export declare function TableLegend({ items, selectedItems: initRowSelection, onSelectedItemsChange, onItemMouseOver, onItemMouseOut, height, width, columns: additionalColumns, sorting, onSortingChange, }: TableLegendProps): import("react/jsx-runtime").JSX.Element;
14
+ export declare function TableLegend({ items, selectedItems: initRowSelection, onSelectedItemsChange, onItemMouseOver, onItemMouseOut, height, width, columns: additionalColumns, sorting, onSortingChange, }: TableLegendProps): ReactElement;
14
15
  //# sourceMappingURL=TableLegend.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"TableLegend.d.ts","sourceRoot":"","sources":["../../src/Legend/TableLegend.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAS,UAAU,EAAqB,MAAM,UAAU,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,EAAE,SAAS,GAAG,iBAAiB,CAAC;IACnG,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,cAAc,CAAC,GAAG,KAAK,CAAC;IAC9D,qBAAqB,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,sBAAsB,CAAC,CAAC;IACtE,eAAe,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,gBAAgB,CAAC,CAAC;IAC3D,cAAc,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,eAAe,CAAC,CAAC;IACzD,OAAO,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,SAAS,CAAC,CAAC;CAC7C;AAuBD,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,aAAa,EAAE,gBAAgB,EAC/B,qBAAqB,EACrB,eAAe,EACf,cAAc,EACd,MAAM,EACN,KAAK,EACL,OAAO,EAAE,iBAAsB,EAC/B,OAAO,EACP,eAAe,GAChB,EAAE,gBAAgB,2CAuClB"}
1
+ {"version":3,"file":"TableLegend.d.ts","sourceRoot":"","sources":["../../src/Legend/TableLegend.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,YAAY,EAAW,MAAM,OAAO,CAAC;AAC9C,OAAO,EAAS,UAAU,EAAqB,MAAM,UAAU,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,UAAU,CAAC,UAAU,CAAC,EAAE,SAAS,GAAG,iBAAiB,CAAC;IACnG,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,cAAc,CAAC,GAAG,KAAK,CAAC;IAC9D,qBAAqB,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,sBAAsB,CAAC,CAAC;IACtE,eAAe,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,gBAAgB,CAAC,CAAC;IAC3D,cAAc,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,eAAe,CAAC,CAAC;IACzD,OAAO,CAAC,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC,SAAS,CAAC,CAAC;CAC7C;AAuBD,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,aAAa,EAAE,gBAAgB,EAC/B,qBAAqB,EACrB,eAAe,EACf,cAAc,EACd,MAAM,EACN,KAAK,EACL,OAAO,EAAE,iBAAsB,EAC/B,OAAO,EACP,eAAe,GAChB,EAAE,gBAAgB,GAAG,YAAY,CAwCjC"}
@@ -65,6 +65,7 @@ export function TableLegend({ items, selectedItems: initRowSelection, onSelected
65
65
  data: items,
66
66
  columns: columns,
67
67
  density: "compact",
68
+ defaultColumnWidth: "auto",
68
69
  getRowId: getRowId,
69
70
  getCheckboxColor: getCheckboxColor,
70
71
  checkboxSelection: true,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Legend/TableLegend.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { useMemo } from 'react';\nimport { Table, TableProps, TableColumnConfig } from '../Table';\nimport { LegendItem } from './legend-model';\n\nexport interface TableLegendProps extends Pick<TableProps<LegendItem>, 'sorting' | 'onSortingChange'> {\n items: LegendItem[];\n height: number;\n width: number;\n selectedItems: TableProps<LegendItem>['rowSelection'] | 'ALL';\n onSelectedItemsChange: TableProps<LegendItem>['onRowSelectionChange'];\n onItemMouseOver?: TableProps<LegendItem>['onRowMouseOver'];\n onItemMouseOut?: TableProps<LegendItem>['onRowMouseOut'];\n columns?: TableProps<LegendItem>['columns'];\n}\n\nconst COLUMNS: Array<TableColumnConfig<LegendItem>> = [\n {\n accessorKey: 'label',\n header: 'Name',\n enableSorting: true,\n\n // Starting with `title` attr instead of a tooltip because it is easier to\n // implement. We should try adding a tooltip in the future, but we'll need\n // to be very careful about performance when doing so with large tables.\n cell: ({ getValue }) => <span title={getValue()}>{getValue()}</span>,\n },\n];\n\nconst getRowId: NonNullable<TableProps<LegendItem>['getRowId']> = (data) => {\n return data.id;\n};\n\nconst getCheckboxColor: TableProps<LegendItem>['getCheckboxColor'] = (data) => {\n return data.color;\n};\n\nexport function TableLegend({\n items,\n selectedItems: initRowSelection,\n onSelectedItemsChange,\n onItemMouseOver,\n onItemMouseOut,\n height,\n width,\n columns: additionalColumns = [],\n sorting,\n onSortingChange,\n}: TableLegendProps) {\n const rowSelection = useMemo(() => {\n return typeof initRowSelection !== 'string'\n ? initRowSelection\n : // Turn \"ALL\" state into a table component friendly map of all of the selected\n // items for checkboxes.\n // TODO: clean this up if we switch to also using checkboxes in list legend.\n items.reduce(\n (allRowSelection, item, index) => {\n allRowSelection[getRowId(item, index)] = true;\n return allRowSelection;\n },\n {} as Record<string, boolean>\n );\n }, [initRowSelection, items]);\n\n const columns = useMemo(() => {\n return [...COLUMNS, ...additionalColumns];\n }, [additionalColumns]);\n\n return (\n <Table\n height={height}\n width={width}\n rowSelection={rowSelection}\n onRowSelectionChange={onSelectedItemsChange}\n onRowMouseOver={onItemMouseOver}\n onRowMouseOut={onItemMouseOut}\n sorting={sorting}\n onSortingChange={onSortingChange}\n data={items}\n columns={columns}\n density=\"compact\"\n getRowId={getRowId}\n getCheckboxColor={getCheckboxColor}\n checkboxSelection\n rowSelectionVariant=\"legend\"\n />\n );\n}\n"],"names":["useMemo","Table","COLUMNS","accessorKey","header","enableSorting","cell","getValue","span","title","getRowId","data","id","getCheckboxColor","color","TableLegend","items","selectedItems","initRowSelection","onSelectedItemsChange","onItemMouseOver","onItemMouseOut","height","width","columns","additionalColumns","sorting","onSortingChange","rowSelection","reduce","allRowSelection","item","index","onRowSelectionChange","onRowMouseOver","onRowMouseOut","density","checkboxSelection","rowSelectionVariant"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAEjC,SAASA,OAAO,QAAQ,QAAQ;AAChC,SAASC,KAAK,QAAuC,WAAW;AAchE,MAAMC,UAAgD;IACpD;QACEC,aAAa;QACbC,QAAQ;QACRC,eAAe;QAEf,0EAA0E;QAC1E,0EAA0E;QAC1E,wEAAwE;QACxEC,MAAM,CAAC,EAAEC,QAAQ,EAAE,iBAAK,KAACC;gBAAKC,OAAOF;0BAAaA;;IACpD;CACD;AAED,MAAMG,WAA4D,CAACC;IACjE,OAAOA,KAAKC,EAAE;AAChB;AAEA,MAAMC,mBAA+D,CAACF;IACpE,OAAOA,KAAKG,KAAK;AACnB;AAEA,OAAO,SAASC,YAAY,EAC1BC,KAAK,EACLC,eAAeC,gBAAgB,EAC/BC,qBAAqB,EACrBC,eAAe,EACfC,cAAc,EACdC,MAAM,EACNC,KAAK,EACLC,SAASC,oBAAoB,EAAE,EAC/BC,OAAO,EACPC,eAAe,EACE;IACjB,MAAMC,eAAe5B,QAAQ;QAC3B,OAAO,OAAOkB,qBAAqB,WAC/BA,mBAEA,wBAAwB;QACxB,4EAA4E;QAC5EF,MAAMa,MAAM,CACV,CAACC,iBAAiBC,MAAMC;YACtBF,eAAe,CAACpB,SAASqB,MAAMC,OAAO,GAAG;YACzC,OAAOF;QACT,GACA,CAAC;IAET,GAAG;QAACZ;QAAkBF;KAAM;IAE5B,MAAMQ,UAAUxB,QAAQ;QACtB,OAAO;eAAIE;eAAYuB;SAAkB;IAC3C,GAAG;QAACA;KAAkB;IAEtB,qBACE,KAACxB;QACCqB,QAAQA;QACRC,OAAOA;QACPK,cAAcA;QACdK,sBAAsBd;QACtBe,gBAAgBd;QAChBe,eAAed;QACfK,SAASA;QACTC,iBAAiBA;QACjBhB,MAAMK;QACNQ,SAASA;QACTY,SAAQ;QACR1B,UAAUA;QACVG,kBAAkBA;QAClBwB,iBAAiB;QACjBC,qBAAoB;;AAG1B"}
1
+ {"version":3,"sources":["../../src/Legend/TableLegend.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { ReactElement, useMemo } from 'react';\nimport { Table, TableProps, TableColumnConfig } from '../Table';\nimport { LegendItem } from './legend-model';\n\nexport interface TableLegendProps extends Pick<TableProps<LegendItem>, 'sorting' | 'onSortingChange'> {\n items: LegendItem[];\n height: number;\n width: number;\n selectedItems: TableProps<LegendItem>['rowSelection'] | 'ALL';\n onSelectedItemsChange: TableProps<LegendItem>['onRowSelectionChange'];\n onItemMouseOver?: TableProps<LegendItem>['onRowMouseOver'];\n onItemMouseOut?: TableProps<LegendItem>['onRowMouseOut'];\n columns?: TableProps<LegendItem>['columns'];\n}\n\nconst COLUMNS: Array<TableColumnConfig<LegendItem>> = [\n {\n accessorKey: 'label',\n header: 'Name',\n enableSorting: true,\n\n // Starting with `title` attr instead of a tooltip because it is easier to\n // implement. We should try adding a tooltip in the future, but we'll need\n // to be very careful about performance when doing so with large tables.\n cell: ({ getValue }) => <span title={getValue()}>{getValue()}</span>,\n },\n];\n\nconst getRowId: NonNullable<TableProps<LegendItem>['getRowId']> = (data) => {\n return data.id;\n};\n\nconst getCheckboxColor: TableProps<LegendItem>['getCheckboxColor'] = (data) => {\n return data.color;\n};\n\nexport function TableLegend({\n items,\n selectedItems: initRowSelection,\n onSelectedItemsChange,\n onItemMouseOver,\n onItemMouseOut,\n height,\n width,\n columns: additionalColumns = [],\n sorting,\n onSortingChange,\n}: TableLegendProps): ReactElement {\n const rowSelection = useMemo(() => {\n return typeof initRowSelection !== 'string'\n ? initRowSelection\n : // Turn \"ALL\" state into a table component friendly map of all of the selected\n // items for checkboxes.\n // TODO: clean this up if we switch to also using checkboxes in list legend.\n items.reduce(\n (allRowSelection, item, index) => {\n allRowSelection[getRowId(item, index)] = true;\n return allRowSelection;\n },\n {} as Record<string, boolean>\n );\n }, [initRowSelection, items]);\n\n const columns = useMemo(() => {\n return [...COLUMNS, ...additionalColumns];\n }, [additionalColumns]);\n\n return (\n <Table\n height={height}\n width={width}\n rowSelection={rowSelection}\n onRowSelectionChange={onSelectedItemsChange}\n onRowMouseOver={onItemMouseOver}\n onRowMouseOut={onItemMouseOut}\n sorting={sorting}\n onSortingChange={onSortingChange}\n data={items}\n columns={columns}\n density=\"compact\"\n defaultColumnWidth=\"auto\"\n getRowId={getRowId}\n getCheckboxColor={getCheckboxColor}\n checkboxSelection\n rowSelectionVariant=\"legend\"\n />\n );\n}\n"],"names":["useMemo","Table","COLUMNS","accessorKey","header","enableSorting","cell","getValue","span","title","getRowId","data","id","getCheckboxColor","color","TableLegend","items","selectedItems","initRowSelection","onSelectedItemsChange","onItemMouseOver","onItemMouseOut","height","width","columns","additionalColumns","sorting","onSortingChange","rowSelection","reduce","allRowSelection","item","index","onRowSelectionChange","onRowMouseOver","onRowMouseOut","density","defaultColumnWidth","checkboxSelection","rowSelectionVariant"],"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,SAAuBA,OAAO,QAAQ,QAAQ;AAC9C,SAASC,KAAK,QAAuC,WAAW;AAchE,MAAMC,UAAgD;IACpD;QACEC,aAAa;QACbC,QAAQ;QACRC,eAAe;QAEf,0EAA0E;QAC1E,0EAA0E;QAC1E,wEAAwE;QACxEC,MAAM,CAAC,EAAEC,QAAQ,EAAE,iBAAK,KAACC;gBAAKC,OAAOF;0BAAaA;;IACpD;CACD;AAED,MAAMG,WAA4D,CAACC;IACjE,OAAOA,KAAKC,EAAE;AAChB;AAEA,MAAMC,mBAA+D,CAACF;IACpE,OAAOA,KAAKG,KAAK;AACnB;AAEA,OAAO,SAASC,YAAY,EAC1BC,KAAK,EACLC,eAAeC,gBAAgB,EAC/BC,qBAAqB,EACrBC,eAAe,EACfC,cAAc,EACdC,MAAM,EACNC,KAAK,EACLC,SAASC,oBAAoB,EAAE,EAC/BC,OAAO,EACPC,eAAe,EACE;IACjB,MAAMC,eAAe5B,QAAQ;QAC3B,OAAO,OAAOkB,qBAAqB,WAC/BA,mBAEA,wBAAwB;QACxB,4EAA4E;QAC5EF,MAAMa,MAAM,CACV,CAACC,iBAAiBC,MAAMC;YACtBF,eAAe,CAACpB,SAASqB,MAAMC,OAAO,GAAG;YACzC,OAAOF;QACT,GACA,CAAC;IAET,GAAG;QAACZ;QAAkBF;KAAM;IAE5B,MAAMQ,UAAUxB,QAAQ;QACtB,OAAO;eAAIE;eAAYuB;SAAkB;IAC3C,GAAG;QAACA;KAAkB;IAEtB,qBACE,KAACxB;QACCqB,QAAQA;QACRC,OAAOA;QACPK,cAAcA;QACdK,sBAAsBd;QACtBe,gBAAgBd;QAChBe,eAAed;QACfK,SAASA;QACTC,iBAAiBA;QACjBhB,MAAMK;QACNQ,SAASA;QACTY,SAAQ;QACRC,oBAAmB;QACnB3B,UAAUA;QACVG,kBAAkBA;QAClByB,iBAAiB;QACjBC,qBAAoB;;AAG1B"}
@@ -1 +1 @@
1
- {"version":3,"file":"legend-model.d.ts","sourceRoot":"","sources":["../../src/Legend/legend-model.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AASrD,MAAM,MAAM,sBAAsB,GAAG,iBAAiB,CAAC;AAEvD,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAE/B,OAAO,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;CAC1C;AAED;;;;;;GAMG;AACH,MAAM,MAAM,uBAAuB,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC,GAAG,KAAK,CAAC;AAEhF,wBAAgB,4BAA4B,CAAC,IAAI,EAAE,UAAU,EAAE,aAAa,EAAE,uBAAuB,WAIpG"}
1
+ {"version":3,"file":"legend-model.d.ts","sourceRoot":"","sources":["../../src/Legend/legend-model.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AASrD,MAAM,MAAM,sBAAsB,GAAG,iBAAiB,CAAC;AAEvD,MAAM,WAAW,UAAU;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAE/B,OAAO,CAAC,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC;CAC1C;AAED;;;;;;GAMG;AACH,MAAM,MAAM,uBAAuB,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC,GAAG,KAAK,CAAC;AAEhF,wBAAgB,4BAA4B,CAAC,IAAI,EAAE,UAAU,EAAE,aAAa,EAAE,uBAAuB,GAAG,OAAO,CAI9G"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/Legend/legend-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 { MouseEventHandler } from 'react';\nimport { LegendOptionsBase } from '@perses-dev/core';\n\n// This file contains legend-related model code specific to the legend component.\n// See the `core` package for common/shared legend model code and the\n// `plugin-system` package for legend model code specific to panel plugin specs.\n\n// Note: explicitly defining different options for the legend component and\n// legend spec that extend from some common options, so we can allow the\n// component and the spec to diverge in some upcoming work.\nexport type LegendComponentOptions = LegendOptionsBase;\n\nexport interface LegendItem {\n id: string;\n label: string;\n color: string;\n\n /**\n * Additional data for the legend item. Useful for laying out additional\n * columns when using a table legend.\n */\n data?: Record<string, unknown>;\n\n onClick?: MouseEventHandler<HTMLElement>;\n}\n\n/**\n * State of selected items in the legend.\n * - When \"ALL\", all legend items are selected, but not visually highlighted.\n * - Otherwise, it is a Record that associates legend item ids with a boolean\n * value. When the associated entry for a legend item is `true`, that item\n * will be treated as selected and visually highlighted.\n */\nexport type SelectedLegendItemState = Record<LegendItem['id'], boolean> | 'ALL';\n\nexport function isLegendItemVisuallySelected(item: LegendItem, selectedItems: SelectedLegendItemState) {\n // In the \"ALL\" case, technically all legend items are selected, but we do\n // not render them differently.\n return selectedItems !== 'ALL' && !!selectedItems[item.id];\n}\n"],"names":["isLegendItemVisuallySelected","item","selectedItems","id"],"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;AAqCjC,OAAO,SAASA,6BAA6BC,IAAgB,EAAEC,aAAsC;IACnG,0EAA0E;IAC1E,+BAA+B;IAC/B,OAAOA,kBAAkB,SAAS,CAAC,CAACA,aAAa,CAACD,KAAKE,EAAE,CAAC;AAC5D"}
1
+ {"version":3,"sources":["../../src/Legend/legend-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 { MouseEventHandler } from 'react';\nimport { LegendOptionsBase } from '@perses-dev/core';\n\n// This file contains legend-related model code specific to the legend component.\n// See the `core` package for common/shared legend model code and the\n// `plugin-system` package for legend model code specific to panel plugin specs.\n\n// Note: explicitly defining different options for the legend component and\n// legend spec that extend from some common options, so we can allow the\n// component and the spec to diverge in some upcoming work.\nexport type LegendComponentOptions = LegendOptionsBase;\n\nexport interface LegendItem {\n id: string;\n label: string;\n color: string;\n\n /**\n * Additional data for the legend item. Useful for laying out additional\n * columns when using a table legend.\n */\n data?: Record<string, unknown>;\n\n onClick?: MouseEventHandler<HTMLElement>;\n}\n\n/**\n * State of selected items in the legend.\n * - When \"ALL\", all legend items are selected, but not visually highlighted.\n * - Otherwise, it is a Record that associates legend item ids with a boolean\n * value. When the associated entry for a legend item is `true`, that item\n * will be treated as selected and visually highlighted.\n */\nexport type SelectedLegendItemState = Record<LegendItem['id'], boolean> | 'ALL';\n\nexport function isLegendItemVisuallySelected(item: LegendItem, selectedItems: SelectedLegendItemState): boolean {\n // In the \"ALL\" case, technically all legend items are selected, but we do\n // not render them differently.\n return selectedItems !== 'ALL' && !!selectedItems[item.id];\n}\n"],"names":["isLegendItemVisuallySelected","item","selectedItems","id"],"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;AAqCjC,OAAO,SAASA,6BAA6BC,IAAgB,EAAEC,aAAsC;IACnG,0EAA0E;IAC1E,+BAA+B;IAC/B,OAAOA,kBAAkB,SAAS,CAAC,CAACA,aAAa,CAACD,KAAKE,EAAE,CAAC;AAC5D"}
@@ -1,7 +1,7 @@
1
1
  import { MouseEvent } from 'react';
2
2
  import { FormatOptions } from '@perses-dev/core';
3
3
  import type { EChartsCoreOption, GridComponentOption, LegendComponentOption, YAXisComponentOption } from 'echarts';
4
- import { EChartsDataFormat, ChartInstance } from '../model/graph';
4
+ import { EChartsDataFormat, ChartInstance } from '../model';
5
5
  import { TooltipConfig } from '../TimeSeriesTooltip';
6
6
  import { ZoomEventData } from '../utils';
7
7
  export interface LineChartProps {
@@ -1 +1 @@
1
- {"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../src/LineChart/LineChart.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAc,UAAU,EAAkD,MAAM,OAAO,CAAC;AAC/F,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD,OAAO,KAAK,EACV,iBAAiB,EACjB,mBAAmB,EAEnB,qBAAqB,EACrB,oBAAoB,EAErB,MAAM,SAAS,CAAC;AAgBjB,OAAO,EAAE,iBAAiB,EAA0B,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAE1F,OAAO,EAAuC,aAAa,EAA0B,MAAM,sBAAsB,CAAC;AAElH,OAAO,EAOL,aAAa,EACd,MAAM,UAAU,CAAC;AAgBlB,MAAM,WAAW,cAAc;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,iBAAiB,CAAC;IACxB,KAAK,CAAC,EAAE,oBAAoB,CAAC;IAC7B,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,MAAM,CAAC,EAAE,qBAAqB,CAAC;IAC/B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,aAAa,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,CAAC;IACxC,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACxC,oCAAoC,CAAC,EAAE,CAAC,OAAO,EAAE,iBAAiB,KAAK,iBAAiB,CAAC;CAC1F;AAED,eAAO,MAAM,SAAS,0GAuPpB,CAAC"}
1
+ {"version":3,"file":"LineChart.d.ts","sourceRoot":"","sources":["../../src/LineChart/LineChart.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAc,UAAU,EAAkD,MAAM,OAAO,CAAC;AAC/F,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAEjD,OAAO,KAAK,EACV,iBAAiB,EACjB,mBAAmB,EAEnB,qBAAqB,EACrB,oBAAoB,EAErB,MAAM,SAAS,CAAC;AAgBjB,OAAO,EAAE,iBAAiB,EAA0B,aAAa,EAAE,MAAM,UAAU,CAAC;AAEpF,OAAO,EAAuC,aAAa,EAA0B,MAAM,sBAAsB,CAAC;AAClH,OAAO,EAOL,aAAa,EACd,MAAM,UAAU,CAAC;AAgBlB,MAAM,WAAW,cAAc;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,iBAAiB,CAAC;IACxB,KAAK,CAAC,EAAE,oBAAoB,CAAC;IAC7B,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,MAAM,CAAC,EAAE,qBAAqB,CAAC;IAC/B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,aAAa,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,CAAC,CAAC,EAAE,aAAa,KAAK,IAAI,CAAC;IACxC,aAAa,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IACxC,oCAAoC,CAAC,EAAE,CAAC,OAAO,EAAE,iBAAiB,KAAK,iBAAiB,CAAC;CAC1F;AAED,eAAO,MAAM,SAAS,0GAmPpB,CAAC"}
@@ -18,9 +18,8 @@ import { LineChart as EChartsLineChart } from 'echarts/charts';
18
18
  import { GridComponent, DataZoomComponent, MarkAreaComponent, MarkLineComponent, MarkPointComponent, TitleComponent, ToolboxComponent, TooltipComponent, LegendComponent } from 'echarts/components';
19
19
  import { CanvasRenderer } from 'echarts/renderers';
20
20
  import { EChart } from '../EChart';
21
- import { useChartsTheme } from '../context/ChartsProvider';
21
+ import { useChartsTheme, useTimeZone } from '../context';
22
22
  import { LineChartTooltip, DEFAULT_TOOLTIP_CONFIG } from '../TimeSeriesTooltip';
23
- import { useTimeZone } from '../context/TimeZoneProvider';
24
23
  import { clearHighlightedSeries, enableDataZoom, getDateRange, getFormattedDate, getFormattedAxis, restoreChart } from '../utils';
25
24
  use([
26
25
  EChartsLineChart,
@@ -36,7 +35,6 @@ use([
36
35
  CanvasRenderer
37
36
  ]);
38
37
  export const LineChart = /*#__PURE__*/ forwardRef(function LineChart({ height, data, yAxis, format, grid, legend, tooltipConfig = DEFAULT_TOOLTIP_CONFIG, noDataVariant = 'message', syncGroup, onDataZoom, onDoubleClick, __experimentalEChartsOptionsOverride }, ref) {
39
- var _option_tooltip;
40
38
  const chartsTheme = useChartsTheme();
41
39
  const chartRef = useRef();
42
40
  const [showTooltip, setShowTooltip] = useState(true);
@@ -75,10 +73,8 @@ export const LineChart = /*#__PURE__*/ forwardRef(function LineChart({ height, d
75
73
  }, 10);
76
74
  }
77
75
  if (onDataZoom === undefined || params.batch[0] === undefined) return;
78
- var _params_batch__startValue;
79
- const startIndex = (_params_batch__startValue = params.batch[0].startValue) !== null && _params_batch__startValue !== void 0 ? _params_batch__startValue : 0;
80
- var _params_batch__endValue;
81
- const endIndex = (_params_batch__endValue = params.batch[0].endValue) !== null && _params_batch__endValue !== void 0 ? _params_batch__endValue : data.xAxis.length - 1;
76
+ const startIndex = params.batch[0].startValue ?? 0;
77
+ const endIndex = params.batch[0].endValue ?? data.xAxis.length - 1;
82
78
  const xAxisStartValue = data.xAxis[startIndex];
83
79
  const xAxisEndValue = data.xAxis[endIndex];
84
80
  if (xAxisStartValue !== undefined && xAxisEndValue !== undefined) {
@@ -106,8 +102,7 @@ export const LineChart = /*#__PURE__*/ forwardRef(function LineChart({ height, d
106
102
  // The "chart" `noDataVariant` is only used when the `timeSeries` is an
107
103
  // empty array because a `null` value will throw an error.
108
104
  if (data.timeSeries === null || data.timeSeries.length === 0 && noDataVariant === 'message') return noDataOption;
109
- var _data_rangeMs;
110
- const rangeMs = (_data_rangeMs = data.rangeMs) !== null && _data_rangeMs !== void 0 ? _data_rangeMs : getDateRange(data.xAxis);
105
+ const rangeMs = data.rangeMs ?? getDateRange(data.xAxis);
111
106
  const option = {
112
107
  series: data.timeSeries,
113
108
  xAxis: {
@@ -162,7 +157,7 @@ export const LineChart = /*#__PURE__*/ forwardRef(function LineChart({ height, d
162
157
  noDataVariant
163
158
  ]);
164
159
  return /*#__PURE__*/ _jsxs(Box, {
165
- sx: {
160
+ style: {
166
161
  height
167
162
  },
168
163
  onClick: (e)=>{
@@ -241,7 +236,7 @@ export const LineChart = /*#__PURE__*/ forwardRef(function LineChart({ height, d
241
236
  }
242
237
  },
243
238
  children: [
244
- showTooltip === true && ((_option_tooltip = option.tooltip) === null || _option_tooltip === void 0 ? void 0 : _option_tooltip.showContent) === false && tooltipConfig.hidden !== true && /*#__PURE__*/ _jsx(LineChartTooltip, {
239
+ showTooltip === true && option.tooltip?.showContent === false && tooltipConfig.hidden !== true && /*#__PURE__*/ _jsx(LineChartTooltip, {
245
240
  chartRef: chartRef,
246
241
  chartData: data,
247
242
  wrapLabels: tooltipConfig.wrapLabels,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/LineChart/LineChart.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { forwardRef, MouseEvent, useImperativeHandle, useMemo, useRef, useState } from 'react';\nimport { FormatOptions } from '@perses-dev/core';\nimport { Box } from '@mui/material';\nimport type {\n EChartsCoreOption,\n GridComponentOption,\n LineSeriesOption,\n LegendComponentOption,\n YAXisComponentOption,\n TooltipComponentOption,\n} from 'echarts';\nimport { ECharts as EChartsInstance, use } from 'echarts/core';\nimport { LineChart as EChartsLineChart } from 'echarts/charts';\nimport {\n GridComponent,\n DataZoomComponent,\n MarkAreaComponent,\n MarkLineComponent,\n MarkPointComponent,\n TitleComponent,\n ToolboxComponent,\n TooltipComponent,\n LegendComponent,\n} from 'echarts/components';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { EChart, OnEventsType } from '../EChart';\nimport { EChartsDataFormat, ChartInstanceFocusOpts, ChartInstance } from '../model/graph';\nimport { useChartsTheme } from '../context/ChartsProvider';\nimport { CursorCoordinates, LineChartTooltip, TooltipConfig, DEFAULT_TOOLTIP_CONFIG } from '../TimeSeriesTooltip';\nimport { useTimeZone } from '../context/TimeZoneProvider';\nimport {\n clearHighlightedSeries,\n enableDataZoom,\n getDateRange,\n getFormattedDate,\n getFormattedAxis,\n restoreChart,\n ZoomEventData,\n} from '../utils';\n\nuse([\n EChartsLineChart,\n GridComponent,\n DataZoomComponent,\n MarkAreaComponent,\n MarkLineComponent,\n MarkPointComponent,\n TitleComponent,\n ToolboxComponent,\n TooltipComponent,\n LegendComponent,\n CanvasRenderer,\n]);\n\nexport interface LineChartProps {\n height: number;\n data: EChartsDataFormat;\n yAxis?: YAXisComponentOption;\n format?: FormatOptions;\n grid?: GridComponentOption;\n legend?: LegendComponentOption;\n tooltipConfig?: TooltipConfig;\n noDataVariant?: 'chart' | 'message';\n syncGroup?: string;\n onDataZoom?: (e: ZoomEventData) => void;\n onDoubleClick?: (e: MouseEvent) => void;\n __experimentalEChartsOptionsOverride?: (options: EChartsCoreOption) => EChartsCoreOption;\n}\n\nexport const LineChart = forwardRef<ChartInstance, LineChartProps>(function LineChart(\n {\n height,\n data,\n yAxis,\n format,\n grid,\n legend,\n tooltipConfig = DEFAULT_TOOLTIP_CONFIG,\n noDataVariant = 'message',\n syncGroup,\n onDataZoom,\n onDoubleClick,\n __experimentalEChartsOptionsOverride,\n },\n ref\n) {\n const chartsTheme = useChartsTheme();\n const chartRef = useRef<EChartsInstance>();\n const [showTooltip, setShowTooltip] = useState<boolean>(true);\n const [tooltipPinnedCoords, setTooltipPinnedCoords] = useState<CursorCoordinates | null>(null);\n const { timeZone } = useTimeZone();\n\n const [isDragging, setIsDragging] = useState(false);\n const [startX, setStartX] = useState(0);\n\n useImperativeHandle(\n ref,\n () => {\n return {\n highlightSeries({ id }: ChartInstanceFocusOpts) {\n if (!chartRef.current) {\n // when chart undef, do not highlight series when hovering over legend\n return;\n }\n\n chartRef.current.dispatchAction({ type: 'highlight', seriesId: id });\n },\n clearHighlightedSeries: () => {\n if (!chartRef.current) {\n // when chart undef, do not clear highlight series\n return;\n }\n clearHighlightedSeries(chartRef.current);\n },\n };\n },\n []\n );\n\n const handleEvents: OnEventsType<LineSeriesOption['data'] | unknown> = useMemo(() => {\n return {\n datazoom: (params) => {\n if (onDataZoom === undefined) {\n setTimeout(() => {\n // workaround so unpin happens after click event\n setTooltipPinnedCoords(null);\n }, 10);\n }\n if (onDataZoom === undefined || params.batch[0] === undefined) return;\n const startIndex = params.batch[0].startValue ?? 0;\n const endIndex = params.batch[0].endValue ?? data.xAxis.length - 1;\n const xAxisStartValue = data.xAxis[startIndex];\n const xAxisEndValue = data.xAxis[endIndex];\n\n if (xAxisStartValue !== undefined && xAxisEndValue !== undefined) {\n const zoomEvent: ZoomEventData = {\n start: xAxisStartValue,\n end: xAxisEndValue,\n startIndex,\n endIndex,\n };\n onDataZoom(zoomEvent);\n }\n },\n };\n }, [data, onDataZoom, setTooltipPinnedCoords]);\n\n if (chartRef.current !== undefined) {\n enableDataZoom(chartRef.current);\n }\n\n const { noDataOption } = chartsTheme;\n\n const option: EChartsCoreOption = useMemo(() => {\n if (data.timeSeries === undefined) return {};\n\n // The \"chart\" `noDataVariant` is only used when the `timeSeries` is an\n // empty array because a `null` value will throw an error.\n if (data.timeSeries === null || (data.timeSeries.length === 0 && noDataVariant === 'message')) return noDataOption;\n\n const rangeMs = data.rangeMs ?? getDateRange(data.xAxis);\n\n const option: EChartsCoreOption = {\n series: data.timeSeries,\n xAxis: {\n type: 'category',\n data: data.xAxis,\n max: data.xAxisMax,\n axisLabel: {\n formatter: (value: number) => {\n return getFormattedDate(value, rangeMs, timeZone);\n },\n },\n },\n yAxis: getFormattedAxis(yAxis, format),\n animation: false,\n tooltip: {\n show: true,\n trigger: 'axis',\n showContent: false, // echarts tooltip content hidden since we use custom tooltip instead\n },\n // https://echarts.apache.org/en/option.html#axisPointer\n axisPointer: {\n type: 'line',\n z: 0, // ensure point symbol shows on top of dashed line\n triggerEmphasis: false, // https://github.com/apache/echarts/issues/18495\n triggerTooltip: false,\n snap: true,\n },\n toolbox: {\n feature: {\n dataZoom: {\n icon: null, // https://stackoverflow.com/a/67684076/17575201\n yAxisIndex: 'none',\n },\n },\n },\n grid,\n legend,\n };\n\n if (__experimentalEChartsOptionsOverride) {\n return __experimentalEChartsOptionsOverride(option);\n }\n return option;\n }, [data, yAxis, format, grid, legend, noDataOption, timeZone, __experimentalEChartsOptionsOverride, noDataVariant]);\n\n return (\n <Box\n sx={{ height }}\n onClick={(e) => {\n // Pin and unpin when clicking on chart canvas but not tooltip text.\n if (tooltipConfig.enablePinning && e.target instanceof HTMLCanvasElement) {\n setTooltipPinnedCoords((current) => {\n if (current === null) {\n return {\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.nativeEvent.offsetX,\n y: e.nativeEvent.offsetY,\n },\n target: e.target,\n };\n } else {\n return null;\n }\n });\n }\n }}\n onMouseDown={(e) => {\n const { clientX } = e;\n setIsDragging(true);\n setStartX(clientX);\n }}\n onMouseMove={(e) => {\n // Allow clicking inside tooltip to copy labels.\n if (!(e.target instanceof HTMLCanvasElement)) {\n return;\n }\n const { clientX } = e;\n if (isDragging) {\n const deltaX = clientX - startX;\n if (deltaX > 0) {\n // Hide tooltip when user drags to zoom.\n setShowTooltip(false);\n }\n }\n }}\n onMouseUp={() => {\n setIsDragging(false);\n setStartX(0);\n setShowTooltip(true);\n }}\n onMouseLeave={() => {\n if (tooltipPinnedCoords === null) {\n setShowTooltip(false);\n }\n if (chartRef.current !== undefined) {\n clearHighlightedSeries(chartRef.current);\n }\n }}\n onMouseEnter={() => {\n setShowTooltip(true);\n if (chartRef.current !== undefined) {\n enableDataZoom(chartRef.current);\n }\n }}\n onDoubleClick={(e) => {\n setTooltipPinnedCoords(null);\n // either dispatch ECharts restore action to return to orig state or allow consumer to define behavior\n if (onDoubleClick === undefined) {\n if (chartRef.current !== undefined) {\n restoreChart(chartRef.current);\n }\n } else {\n onDoubleClick(e);\n }\n }}\n >\n {/* Allows overrides prop to hide custom tooltip and use the ECharts option.tooltip instead */}\n {showTooltip === true &&\n (option.tooltip as TooltipComponentOption)?.showContent === false &&\n tooltipConfig.hidden !== true && (\n <LineChartTooltip\n chartRef={chartRef}\n chartData={data}\n wrapLabels={tooltipConfig.wrapLabels}\n enablePinning={tooltipConfig.enablePinning}\n pinnedPos={tooltipPinnedCoords}\n format={format}\n onUnpinClick={() => {\n setTooltipPinnedCoords(null);\n }}\n containerId={chartsTheme.tooltipPortalContainerId}\n />\n )}\n <EChart\n sx={{\n width: '100%',\n height: '100%',\n }}\n option={option}\n theme={chartsTheme.echartsTheme}\n onEvents={handleEvents}\n _instance={chartRef}\n syncGroup={syncGroup}\n />\n </Box>\n );\n});\n"],"names":["forwardRef","useImperativeHandle","useMemo","useRef","useState","Box","use","LineChart","EChartsLineChart","GridComponent","DataZoomComponent","MarkAreaComponent","MarkLineComponent","MarkPointComponent","TitleComponent","ToolboxComponent","TooltipComponent","LegendComponent","CanvasRenderer","EChart","useChartsTheme","LineChartTooltip","DEFAULT_TOOLTIP_CONFIG","useTimeZone","clearHighlightedSeries","enableDataZoom","getDateRange","getFormattedDate","getFormattedAxis","restoreChart","height","data","yAxis","format","grid","legend","tooltipConfig","noDataVariant","syncGroup","onDataZoom","onDoubleClick","__experimentalEChartsOptionsOverride","ref","option","chartsTheme","chartRef","showTooltip","setShowTooltip","tooltipPinnedCoords","setTooltipPinnedCoords","timeZone","isDragging","setIsDragging","startX","setStartX","highlightSeries","id","current","dispatchAction","type","seriesId","handleEvents","datazoom","params","undefined","setTimeout","batch","startIndex","startValue","endIndex","endValue","xAxis","length","xAxisStartValue","xAxisEndValue","zoomEvent","start","end","noDataOption","timeSeries","rangeMs","series","max","xAxisMax","axisLabel","formatter","value","animation","tooltip","show","trigger","showContent","axisPointer","z","triggerEmphasis","triggerTooltip","snap","toolbox","feature","dataZoom","icon","yAxisIndex","sx","onClick","e","enablePinning","target","HTMLCanvasElement","page","x","pageX","y","pageY","client","clientX","clientY","plotCanvas","nativeEvent","offsetX","offsetY","onMouseDown","onMouseMove","deltaX","onMouseUp","onMouseLeave","onMouseEnter","hidden","chartData","wrapLabels","pinnedPos","onUnpinClick","containerId","tooltipPortalContainerId","width","theme","echartsTheme","onEvents","_instance"],"mappings":"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"}
1
+ {"version":3,"sources":["../../src/LineChart/LineChart.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { forwardRef, MouseEvent, useImperativeHandle, useMemo, useRef, useState } from 'react';\nimport { FormatOptions } from '@perses-dev/core';\nimport { Box } from '@mui/material';\nimport type {\n EChartsCoreOption,\n GridComponentOption,\n LineSeriesOption,\n LegendComponentOption,\n YAXisComponentOption,\n TooltipComponentOption,\n} from 'echarts';\nimport { ECharts as EChartsInstance, use } from 'echarts/core';\nimport { LineChart as EChartsLineChart } from 'echarts/charts';\nimport {\n GridComponent,\n DataZoomComponent,\n MarkAreaComponent,\n MarkLineComponent,\n MarkPointComponent,\n TitleComponent,\n ToolboxComponent,\n TooltipComponent,\n LegendComponent,\n} from 'echarts/components';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport { EChart, OnEventsType } from '../EChart';\nimport { EChartsDataFormat, ChartInstanceFocusOpts, ChartInstance } from '../model';\nimport { useChartsTheme, useTimeZone } from '../context';\nimport { CursorCoordinates, LineChartTooltip, TooltipConfig, DEFAULT_TOOLTIP_CONFIG } from '../TimeSeriesTooltip';\nimport {\n clearHighlightedSeries,\n enableDataZoom,\n getDateRange,\n getFormattedDate,\n getFormattedAxis,\n restoreChart,\n ZoomEventData,\n} from '../utils';\n\nuse([\n EChartsLineChart,\n GridComponent,\n DataZoomComponent,\n MarkAreaComponent,\n MarkLineComponent,\n MarkPointComponent,\n TitleComponent,\n ToolboxComponent,\n TooltipComponent,\n LegendComponent,\n CanvasRenderer,\n]);\n\nexport interface LineChartProps {\n height: number;\n data: EChartsDataFormat;\n yAxis?: YAXisComponentOption;\n format?: FormatOptions;\n grid?: GridComponentOption;\n legend?: LegendComponentOption;\n tooltipConfig?: TooltipConfig;\n noDataVariant?: 'chart' | 'message';\n syncGroup?: string;\n onDataZoom?: (e: ZoomEventData) => void;\n onDoubleClick?: (e: MouseEvent) => void;\n __experimentalEChartsOptionsOverride?: (options: EChartsCoreOption) => EChartsCoreOption;\n}\n\nexport const LineChart = forwardRef<ChartInstance, LineChartProps>(function LineChart(\n {\n height,\n data,\n yAxis,\n format,\n grid,\n legend,\n tooltipConfig = DEFAULT_TOOLTIP_CONFIG,\n noDataVariant = 'message',\n syncGroup,\n onDataZoom,\n onDoubleClick,\n __experimentalEChartsOptionsOverride,\n },\n ref\n) {\n const chartsTheme = useChartsTheme();\n const chartRef = useRef<EChartsInstance>();\n const [showTooltip, setShowTooltip] = useState<boolean>(true);\n const [tooltipPinnedCoords, setTooltipPinnedCoords] = useState<CursorCoordinates | null>(null);\n const { timeZone } = useTimeZone();\n\n const [isDragging, setIsDragging] = useState(false);\n const [startX, setStartX] = useState(0);\n\n useImperativeHandle(ref, () => {\n return {\n highlightSeries({ id }: ChartInstanceFocusOpts): void {\n if (!chartRef.current) {\n // when chart undef, do not highlight series when hovering over legend\n return;\n }\n\n chartRef.current.dispatchAction({ type: 'highlight', seriesId: id });\n },\n clearHighlightedSeries: (): void => {\n if (!chartRef.current) {\n // when chart undef, do not clear highlight series\n return;\n }\n clearHighlightedSeries(chartRef.current);\n },\n };\n }, []);\n\n const handleEvents: OnEventsType<LineSeriesOption['data'] | unknown> = useMemo(() => {\n return {\n datazoom: (params): void => {\n if (onDataZoom === undefined) {\n setTimeout(() => {\n // workaround so unpin happens after click event\n setTooltipPinnedCoords(null);\n }, 10);\n }\n if (onDataZoom === undefined || params.batch[0] === undefined) return;\n const startIndex = params.batch[0].startValue ?? 0;\n const endIndex = params.batch[0].endValue ?? data.xAxis.length - 1;\n const xAxisStartValue = data.xAxis[startIndex];\n const xAxisEndValue = data.xAxis[endIndex];\n\n if (xAxisStartValue !== undefined && xAxisEndValue !== undefined) {\n const zoomEvent: ZoomEventData = {\n start: xAxisStartValue,\n end: xAxisEndValue,\n startIndex,\n endIndex,\n };\n onDataZoom(zoomEvent);\n }\n },\n };\n }, [data, onDataZoom, setTooltipPinnedCoords]);\n\n if (chartRef.current !== undefined) {\n enableDataZoom(chartRef.current);\n }\n\n const { noDataOption } = chartsTheme;\n\n const option: EChartsCoreOption = useMemo(() => {\n if (data.timeSeries === undefined) return {};\n\n // The \"chart\" `noDataVariant` is only used when the `timeSeries` is an\n // empty array because a `null` value will throw an error.\n if (data.timeSeries === null || (data.timeSeries.length === 0 && noDataVariant === 'message')) return noDataOption;\n\n const rangeMs = data.rangeMs ?? getDateRange(data.xAxis);\n\n const option: EChartsCoreOption = {\n series: data.timeSeries,\n xAxis: {\n type: 'category',\n data: data.xAxis,\n max: data.xAxisMax,\n axisLabel: {\n formatter: (value: number) => {\n return getFormattedDate(value, rangeMs, timeZone);\n },\n },\n },\n yAxis: getFormattedAxis(yAxis, format),\n animation: false,\n tooltip: {\n show: true,\n trigger: 'axis',\n showContent: false, // echarts tooltip content hidden since we use custom tooltip instead\n },\n // https://echarts.apache.org/en/option.html#axisPointer\n axisPointer: {\n type: 'line',\n z: 0, // ensure point symbol shows on top of dashed line\n triggerEmphasis: false, // https://github.com/apache/echarts/issues/18495\n triggerTooltip: false,\n snap: true,\n },\n toolbox: {\n feature: {\n dataZoom: {\n icon: null, // https://stackoverflow.com/a/67684076/17575201\n yAxisIndex: 'none',\n },\n },\n },\n grid,\n legend,\n };\n\n if (__experimentalEChartsOptionsOverride) {\n return __experimentalEChartsOptionsOverride(option);\n }\n return option;\n }, [data, yAxis, format, grid, legend, noDataOption, timeZone, __experimentalEChartsOptionsOverride, noDataVariant]);\n\n return (\n <Box\n style={{ height }}\n onClick={(e) => {\n // Pin and unpin when clicking on chart canvas but not tooltip text.\n if (tooltipConfig.enablePinning && e.target instanceof HTMLCanvasElement) {\n setTooltipPinnedCoords((current) => {\n if (current === null) {\n return {\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.nativeEvent.offsetX,\n y: e.nativeEvent.offsetY,\n },\n target: e.target,\n };\n } else {\n return null;\n }\n });\n }\n }}\n onMouseDown={(e) => {\n const { clientX } = e;\n setIsDragging(true);\n setStartX(clientX);\n }}\n onMouseMove={(e) => {\n // Allow clicking inside tooltip to copy labels.\n if (!(e.target instanceof HTMLCanvasElement)) {\n return;\n }\n const { clientX } = e;\n if (isDragging) {\n const deltaX = clientX - startX;\n if (deltaX > 0) {\n // Hide tooltip when user drags to zoom.\n setShowTooltip(false);\n }\n }\n }}\n onMouseUp={() => {\n setIsDragging(false);\n setStartX(0);\n setShowTooltip(true);\n }}\n onMouseLeave={() => {\n if (tooltipPinnedCoords === null) {\n setShowTooltip(false);\n }\n if (chartRef.current !== undefined) {\n clearHighlightedSeries(chartRef.current);\n }\n }}\n onMouseEnter={() => {\n setShowTooltip(true);\n if (chartRef.current !== undefined) {\n enableDataZoom(chartRef.current);\n }\n }}\n onDoubleClick={(e) => {\n setTooltipPinnedCoords(null);\n // either dispatch ECharts restore action to return to orig state or allow consumer to define behavior\n if (onDoubleClick === undefined) {\n if (chartRef.current !== undefined) {\n restoreChart(chartRef.current);\n }\n } else {\n onDoubleClick(e);\n }\n }}\n >\n {/* Allows overrides prop to hide custom tooltip and use the ECharts option.tooltip instead */}\n {showTooltip === true &&\n (option.tooltip as TooltipComponentOption)?.showContent === false &&\n tooltipConfig.hidden !== true && (\n <LineChartTooltip\n chartRef={chartRef}\n chartData={data}\n wrapLabels={tooltipConfig.wrapLabels}\n enablePinning={tooltipConfig.enablePinning}\n pinnedPos={tooltipPinnedCoords}\n format={format}\n onUnpinClick={() => {\n setTooltipPinnedCoords(null);\n }}\n containerId={chartsTheme.tooltipPortalContainerId}\n />\n )}\n <EChart\n sx={{\n width: '100%',\n height: '100%',\n }}\n option={option}\n theme={chartsTheme.echartsTheme}\n onEvents={handleEvents}\n _instance={chartRef}\n syncGroup={syncGroup}\n />\n </Box>\n );\n});\n"],"names":["forwardRef","useImperativeHandle","useMemo","useRef","useState","Box","use","LineChart","EChartsLineChart","GridComponent","DataZoomComponent","MarkAreaComponent","MarkLineComponent","MarkPointComponent","TitleComponent","ToolboxComponent","TooltipComponent","LegendComponent","CanvasRenderer","EChart","useChartsTheme","useTimeZone","LineChartTooltip","DEFAULT_TOOLTIP_CONFIG","clearHighlightedSeries","enableDataZoom","getDateRange","getFormattedDate","getFormattedAxis","restoreChart","height","data","yAxis","format","grid","legend","tooltipConfig","noDataVariant","syncGroup","onDataZoom","onDoubleClick","__experimentalEChartsOptionsOverride","ref","chartsTheme","chartRef","showTooltip","setShowTooltip","tooltipPinnedCoords","setTooltipPinnedCoords","timeZone","isDragging","setIsDragging","startX","setStartX","highlightSeries","id","current","dispatchAction","type","seriesId","handleEvents","datazoom","params","undefined","setTimeout","batch","startIndex","startValue","endIndex","endValue","xAxis","length","xAxisStartValue","xAxisEndValue","zoomEvent","start","end","noDataOption","option","timeSeries","rangeMs","series","max","xAxisMax","axisLabel","formatter","value","animation","tooltip","show","trigger","showContent","axisPointer","z","triggerEmphasis","triggerTooltip","snap","toolbox","feature","dataZoom","icon","yAxisIndex","style","onClick","e","enablePinning","target","HTMLCanvasElement","page","x","pageX","y","pageY","client","clientX","clientY","plotCanvas","nativeEvent","offsetX","offsetY","onMouseDown","onMouseMove","deltaX","onMouseUp","onMouseLeave","onMouseEnter","hidden","chartData","wrapLabels","pinnedPos","onUnpinClick","containerId","tooltipPortalContainerId","sx","width","theme","echartsTheme","onEvents","_instance"],"mappings":"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"}
@@ -0,0 +1,8 @@
1
+ import { HTMLAttributes, ReactElement } from 'react';
2
+ import { Control } from 'react-hook-form';
3
+ import { PanelEditorValues } from '@perses-dev/core';
4
+ export interface LinksEditorProps extends HTMLAttributes<HTMLDivElement> {
5
+ control: Control<PanelEditorValues>;
6
+ }
7
+ export declare function LinksEditor({ control, ...props }: LinksEditorProps): ReactElement;
8
+ //# sourceMappingURL=LinksEditor.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"LinksEditor.d.ts","sourceRoot":"","sources":["../../src/LinksEditor/LinksEditor.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAY,cAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,EAA6B,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAGrE,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD,MAAM,WAAW,gBAAiB,SAAQ,cAAc,CAAC,cAAc,CAAC;IACtE,OAAO,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CACrC;AAED,wBAAgB,WAAW,CAAC,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,gBAAgB,GAAG,YAAY,CA8BjF"}
@@ -0,0 +1,161 @@
1
+ // Copyright 2024 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 } from "react/jsx-runtime";
14
+ import { Fragment } from 'react';
15
+ import { Checkbox, Divider, FormControlLabel, IconButton, Stack, TextField, Typography } from '@mui/material';
16
+ import { Controller, useFieldArray } from 'react-hook-form';
17
+ import PlusIcon from 'mdi-material-ui/Plus';
18
+ import MinusIcon from 'mdi-material-ui/Minus';
19
+ export function LinksEditor({ control, ...props }) {
20
+ const { fields, append, remove } = useFieldArray({
21
+ control: control,
22
+ name: 'panelDefinition.spec.links'
23
+ });
24
+ return /*#__PURE__*/ _jsxs(Stack, {
25
+ ...props,
26
+ gap: 3,
27
+ children: [
28
+ fields && fields.length > 0 ? fields.map((field, index)=>/*#__PURE__*/ _jsxs(Fragment, {
29
+ children: [
30
+ /*#__PURE__*/ _jsxs(Stack, {
31
+ direction: "row",
32
+ gap: 1,
33
+ alignItems: "center",
34
+ children: [
35
+ /*#__PURE__*/ _jsx(LinkControl, {
36
+ control: control,
37
+ index: index
38
+ }),
39
+ /*#__PURE__*/ _jsx(IconButton, {
40
+ style: {
41
+ width: 'fit-content',
42
+ height: 'fit-content'
43
+ },
44
+ onClick: ()=>remove(index),
45
+ children: /*#__PURE__*/ _jsx(MinusIcon, {})
46
+ })
47
+ ]
48
+ }),
49
+ /*#__PURE__*/ _jsx(Divider, {})
50
+ ]
51
+ }, field.id)) : /*#__PURE__*/ _jsx(Typography, {
52
+ variant: "subtitle1",
53
+ mb: 2,
54
+ fontStyle: "italic",
55
+ children: "No links defined"
56
+ }),
57
+ /*#__PURE__*/ _jsx(IconButton, {
58
+ style: {
59
+ width: 'fit-content',
60
+ height: 'fit-content'
61
+ },
62
+ onClick: ()=>append({
63
+ url: ''
64
+ }),
65
+ children: /*#__PURE__*/ _jsx(PlusIcon, {})
66
+ })
67
+ ]
68
+ });
69
+ }
70
+ function LinkControl({ control, index }) {
71
+ return /*#__PURE__*/ _jsxs(Stack, {
72
+ gap: 2,
73
+ flexGrow: 1,
74
+ children: [
75
+ /*#__PURE__*/ _jsxs(Stack, {
76
+ direction: "row",
77
+ gap: 2,
78
+ children: [
79
+ /*#__PURE__*/ _jsx(Controller, {
80
+ control: control,
81
+ name: `panelDefinition.spec.links.${index}.url`,
82
+ render: ({ field, fieldState })=>/*#__PURE__*/ _jsx(TextField, {
83
+ ...field,
84
+ required: true,
85
+ fullWidth: true,
86
+ label: "URL",
87
+ error: !!fieldState.error,
88
+ helperText: fieldState.error?.message,
89
+ onChange: (event)=>{
90
+ field.onChange(event);
91
+ }
92
+ })
93
+ }),
94
+ /*#__PURE__*/ _jsx(Controller, {
95
+ control: control,
96
+ name: `panelDefinition.spec.links.${index}.name`,
97
+ render: ({ field, fieldState })=>/*#__PURE__*/ _jsx(TextField, {
98
+ ...field,
99
+ fullWidth: true,
100
+ label: "Name",
101
+ defaultValue: "",
102
+ error: !!fieldState.error,
103
+ helperText: fieldState.error?.message,
104
+ onChange: (event)=>{
105
+ field.onChange(event);
106
+ }
107
+ })
108
+ }),
109
+ /*#__PURE__*/ _jsx(Controller, {
110
+ control: control,
111
+ name: `panelDefinition.spec.links.${index}.tooltip`,
112
+ render: ({ field, fieldState })=>/*#__PURE__*/ _jsx(TextField, {
113
+ ...field,
114
+ fullWidth: true,
115
+ label: "Tooltip",
116
+ defaultValue: "",
117
+ error: !!fieldState.error,
118
+ helperText: fieldState.error?.message,
119
+ onChange: (event)=>{
120
+ field.onChange(event);
121
+ }
122
+ })
123
+ })
124
+ ]
125
+ }),
126
+ /*#__PURE__*/ _jsxs(Stack, {
127
+ gap: 2,
128
+ direction: "row",
129
+ alignItems: "center",
130
+ children: [
131
+ /*#__PURE__*/ _jsx(Controller, {
132
+ control: control,
133
+ name: `panelDefinition.spec.links.${index}.renderVariables`,
134
+ render: ({ field })=>/*#__PURE__*/ _jsx(FormControlLabel, {
135
+ label: "Render Variables",
136
+ control: /*#__PURE__*/ _jsx(Checkbox, {
137
+ ...field,
138
+ checked: field.value,
139
+ onChange: (e)=>field.onChange(e.target.checked)
140
+ })
141
+ })
142
+ }),
143
+ /*#__PURE__*/ _jsx(Controller, {
144
+ control: control,
145
+ name: `panelDefinition.spec.links.${index}.targetBlank`,
146
+ render: ({ field })=>/*#__PURE__*/ _jsx(FormControlLabel, {
147
+ label: "Open in new tab",
148
+ control: /*#__PURE__*/ _jsx(Checkbox, {
149
+ ...field,
150
+ checked: field.value,
151
+ onChange: (e)=>field.onChange(e.target.checked)
152
+ })
153
+ })
154
+ })
155
+ ]
156
+ })
157
+ ]
158
+ });
159
+ }
160
+
161
+ //# sourceMappingURL=LinksEditor.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/LinksEditor/LinksEditor.tsx"],"sourcesContent":["// Copyright 2024 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 { Fragment, HTMLAttributes, ReactElement } from 'react';\nimport { Checkbox, Divider, FormControlLabel, IconButton, Stack, TextField, Typography } from '@mui/material';\nimport { Controller, useFieldArray, Control } from 'react-hook-form';\nimport PlusIcon from 'mdi-material-ui/Plus';\nimport MinusIcon from 'mdi-material-ui/Minus';\nimport { PanelEditorValues } from '@perses-dev/core';\n\nexport interface LinksEditorProps extends HTMLAttributes<HTMLDivElement> {\n control: Control<PanelEditorValues>;\n}\n\nexport function LinksEditor({ control, ...props }: LinksEditorProps): ReactElement {\n const { fields, append, remove } = useFieldArray({\n control: control,\n name: 'panelDefinition.spec.links',\n });\n\n return (\n <Stack {...props} gap={3}>\n {fields && fields.length > 0 ? (\n fields.map((field, index) => (\n <Fragment key={field.id}>\n <Stack direction=\"row\" gap={1} alignItems=\"center\">\n <LinkControl control={control} index={index} />\n <IconButton style={{ width: 'fit-content', height: 'fit-content' }} onClick={() => remove(index)}>\n <MinusIcon />\n </IconButton>\n </Stack>\n <Divider />\n </Fragment>\n ))\n ) : (\n <Typography variant=\"subtitle1\" mb={2} fontStyle=\"italic\">\n No links defined\n </Typography>\n )}\n <IconButton style={{ width: 'fit-content', height: 'fit-content' }} onClick={() => append({ url: '' })}>\n <PlusIcon />\n </IconButton>\n </Stack>\n );\n}\n\nfunction LinkControl({ control, index }: { control: Control<PanelEditorValues>; index: number }): ReactElement {\n return (\n <Stack gap={2} flexGrow={1}>\n <Stack direction=\"row\" gap={2}>\n <Controller\n control={control}\n name={`panelDefinition.spec.links.${index}.url`}\n render={({ field, fieldState }) => (\n <TextField\n {...field}\n required\n fullWidth\n label=\"URL\"\n error={!!fieldState.error}\n helperText={fieldState.error?.message}\n onChange={(event) => {\n field.onChange(event);\n }}\n />\n )}\n />\n <Controller\n control={control}\n name={`panelDefinition.spec.links.${index}.name`}\n render={({ field, fieldState }) => (\n <TextField\n {...field}\n fullWidth\n label=\"Name\"\n defaultValue=\"\"\n error={!!fieldState.error}\n helperText={fieldState.error?.message}\n onChange={(event) => {\n field.onChange(event);\n }}\n />\n )}\n />\n <Controller\n control={control}\n name={`panelDefinition.spec.links.${index}.tooltip`}\n render={({ field, fieldState }) => (\n <TextField\n {...field}\n fullWidth\n label=\"Tooltip\"\n defaultValue=\"\"\n error={!!fieldState.error}\n helperText={fieldState.error?.message}\n onChange={(event) => {\n field.onChange(event);\n }}\n />\n )}\n />\n </Stack>\n <Stack gap={2} direction=\"row\" alignItems=\"center\">\n <Controller\n control={control}\n name={`panelDefinition.spec.links.${index}.renderVariables`}\n render={({ field }) => (\n <FormControlLabel\n label=\"Render Variables\"\n control={<Checkbox {...field} checked={field.value} onChange={(e) => field.onChange(e.target.checked)} />}\n />\n )}\n />\n <Controller\n control={control}\n name={`panelDefinition.spec.links.${index}.targetBlank`}\n render={({ field }) => (\n <FormControlLabel\n label=\"Open in new tab\"\n control={<Checkbox {...field} checked={field.value} onChange={(e) => field.onChange(e.target.checked)} />}\n />\n )}\n />\n </Stack>\n </Stack>\n );\n}\n"],"names":["Fragment","Checkbox","Divider","FormControlLabel","IconButton","Stack","TextField","Typography","Controller","useFieldArray","PlusIcon","MinusIcon","LinksEditor","control","props","fields","append","remove","name","gap","length","map","field","index","direction","alignItems","LinkControl","style","width","height","onClick","id","variant","mb","fontStyle","url","flexGrow","render","fieldState","required","fullWidth","label","error","helperText","message","onChange","event","defaultValue","checked","value","e","target"],"mappings":"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"}
@@ -0,0 +1,2 @@
1
+ export * from './LinksEditor';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/LinksEditor/index.ts"],"names":[],"mappings":"AAaA,cAAc,eAAe,CAAC"}
@@ -0,0 +1,15 @@
1
+ // Copyright 2024 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 './LinksEditor';
14
+
15
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/LinksEditor/index.ts"],"sourcesContent":["// Copyright 2024 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 './LinksEditor';\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"}