@perses-dev/plugin-system 0.0.0-snapshot-time-range-height-80d08fc

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 (242) hide show
  1. package/LICENSE +201 -0
  2. package/dist/cjs/components/CalculationSelector/CalculationSelector.js +52 -0
  3. package/dist/cjs/components/CalculationSelector/CalculationSelector.test.js +65 -0
  4. package/dist/cjs/components/CalculationSelector/index.js +28 -0
  5. package/dist/cjs/components/DatasourceSelect.js +76 -0
  6. package/dist/cjs/components/OptionsEditorTabs/OptionsEditorTabs.js +102 -0
  7. package/dist/cjs/components/OptionsEditorTabs/OptionsEditorTabs.test.js +167 -0
  8. package/dist/cjs/components/OptionsEditorTabs/TabPanel.js +37 -0
  9. package/dist/cjs/components/OptionsEditorTabs/index.js +28 -0
  10. package/dist/cjs/components/PluginEditor/PluginEditor.js +67 -0
  11. package/dist/cjs/components/PluginEditor/PluginEditor.test.js +150 -0
  12. package/dist/cjs/components/PluginEditor/index.js +29 -0
  13. package/dist/cjs/components/PluginEditor/plugin-editor-api.js +101 -0
  14. package/dist/cjs/components/PluginKindSelect.js +41 -0
  15. package/dist/cjs/components/PluginKindSelect.test.js +86 -0
  16. package/dist/cjs/components/PluginRegistry/PluginRegistry.js +85 -0
  17. package/dist/cjs/components/PluginRegistry/PluginRegistry.test.js +144 -0
  18. package/dist/cjs/components/PluginRegistry/index.js +28 -0
  19. package/dist/cjs/components/PluginRegistry/plugin-indexes.js +78 -0
  20. package/dist/cjs/components/PluginSpecEditor.js +43 -0
  21. package/dist/cjs/components/PluginSpecEditor.test.js +70 -0
  22. package/dist/cjs/components/TimeSeriesQueryEditor.js +42 -0
  23. package/dist/cjs/components/index.js +35 -0
  24. package/dist/cjs/index.js +31 -0
  25. package/dist/cjs/model/calculations.js +77 -0
  26. package/dist/cjs/model/datasource.js +16 -0
  27. package/dist/cjs/model/index.js +35 -0
  28. package/dist/cjs/model/panels.js +16 -0
  29. package/dist/cjs/model/plugin-base.js +22 -0
  30. package/dist/cjs/model/plugin-loading.js +38 -0
  31. package/dist/cjs/model/plugins.js +16 -0
  32. package/dist/cjs/model/time-series-queries.js +16 -0
  33. package/dist/cjs/model/variables.js +16 -0
  34. package/dist/cjs/runtime/TimeRangeProvider/TimeRangeProvider.js +118 -0
  35. package/dist/cjs/runtime/TimeRangeProvider/index.js +29 -0
  36. package/dist/cjs/runtime/TimeRangeProvider/query-params.js +161 -0
  37. package/dist/cjs/runtime/datasources.js +44 -0
  38. package/dist/cjs/runtime/index.js +32 -0
  39. package/dist/cjs/runtime/plugin-registry.js +75 -0
  40. package/dist/cjs/runtime/template-variables.js +57 -0
  41. package/dist/cjs/runtime/time-series-queries.js +140 -0
  42. package/dist/cjs/test/index.js +28 -0
  43. package/dist/cjs/test/render.js +52 -0
  44. package/dist/cjs/test/setup-tests.js +20 -0
  45. package/dist/cjs/test/test-plugins/bert/index.js +77 -0
  46. package/dist/cjs/test/test-plugins/ernie/index.js +58 -0
  47. package/dist/cjs/test/test-plugins/index.js +77 -0
  48. package/dist/cjs/test-utils/index.js +28 -0
  49. package/dist/cjs/test-utils/mock-plugin-registry.js +68 -0
  50. package/dist/components/CalculationSelector/CalculationSelector.d.ts +8 -0
  51. package/dist/components/CalculationSelector/CalculationSelector.d.ts.map +1 -0
  52. package/dist/components/CalculationSelector/CalculationSelector.js +46 -0
  53. package/dist/components/CalculationSelector/CalculationSelector.js.map +1 -0
  54. package/dist/components/CalculationSelector/CalculationSelector.test.d.ts +2 -0
  55. package/dist/components/CalculationSelector/CalculationSelector.test.d.ts.map +1 -0
  56. package/dist/components/CalculationSelector/CalculationSelector.test.js +58 -0
  57. package/dist/components/CalculationSelector/CalculationSelector.test.js.map +1 -0
  58. package/dist/components/CalculationSelector/index.d.ts +2 -0
  59. package/dist/components/CalculationSelector/index.d.ts.map +1 -0
  60. package/dist/components/CalculationSelector/index.js +15 -0
  61. package/dist/components/CalculationSelector/index.js.map +1 -0
  62. package/dist/components/DatasourceSelect.d.ts +16 -0
  63. package/dist/components/DatasourceSelect.d.ts.map +1 -0
  64. package/dist/components/DatasourceSelect.js +73 -0
  65. package/dist/components/DatasourceSelect.js.map +1 -0
  66. package/dist/components/OptionsEditorTabs/OptionsEditorTabs.d.ts +34 -0
  67. package/dist/components/OptionsEditorTabs/OptionsEditorTabs.d.ts.map +1 -0
  68. package/dist/components/OptionsEditorTabs/OptionsEditorTabs.js +96 -0
  69. package/dist/components/OptionsEditorTabs/OptionsEditorTabs.js.map +1 -0
  70. package/dist/components/OptionsEditorTabs/OptionsEditorTabs.test.d.ts +2 -0
  71. package/dist/components/OptionsEditorTabs/OptionsEditorTabs.test.d.ts.map +1 -0
  72. package/dist/components/OptionsEditorTabs/OptionsEditorTabs.test.js +160 -0
  73. package/dist/components/OptionsEditorTabs/OptionsEditorTabs.test.js.map +1 -0
  74. package/dist/components/OptionsEditorTabs/TabPanel.d.ts +9 -0
  75. package/dist/components/OptionsEditorTabs/TabPanel.d.ts.map +1 -0
  76. package/dist/components/OptionsEditorTabs/TabPanel.js +31 -0
  77. package/dist/components/OptionsEditorTabs/TabPanel.js.map +1 -0
  78. package/dist/components/OptionsEditorTabs/index.d.ts +2 -0
  79. package/dist/components/OptionsEditorTabs/index.d.ts.map +1 -0
  80. package/dist/components/OptionsEditorTabs/index.js +15 -0
  81. package/dist/components/OptionsEditorTabs/index.js.map +1 -0
  82. package/dist/components/PluginEditor/PluginEditor.d.ts +12 -0
  83. package/dist/components/PluginEditor/PluginEditor.d.ts.map +1 -0
  84. package/dist/components/PluginEditor/PluginEditor.js +68 -0
  85. package/dist/components/PluginEditor/PluginEditor.js.map +1 -0
  86. package/dist/components/PluginEditor/PluginEditor.test.d.ts +2 -0
  87. package/dist/components/PluginEditor/PluginEditor.test.d.ts.map +1 -0
  88. package/dist/components/PluginEditor/PluginEditor.test.js +143 -0
  89. package/dist/components/PluginEditor/PluginEditor.test.js.map +1 -0
  90. package/dist/components/PluginEditor/index.d.ts +3 -0
  91. package/dist/components/PluginEditor/index.d.ts.map +1 -0
  92. package/dist/components/PluginEditor/index.js +16 -0
  93. package/dist/components/PluginEditor/index.js.map +1 -0
  94. package/dist/components/PluginEditor/plugin-editor-api.d.ts +30 -0
  95. package/dist/components/PluginEditor/plugin-editor-api.d.ts.map +1 -0
  96. package/dist/components/PluginEditor/plugin-editor-api.js +100 -0
  97. package/dist/components/PluginEditor/plugin-editor-api.js.map +1 -0
  98. package/dist/components/PluginKindSelect.d.ts +12 -0
  99. package/dist/components/PluginKindSelect.d.ts.map +1 -0
  100. package/dist/components/PluginKindSelect.js +38 -0
  101. package/dist/components/PluginKindSelect.js.map +1 -0
  102. package/dist/components/PluginKindSelect.test.d.ts +2 -0
  103. package/dist/components/PluginKindSelect.test.d.ts.map +1 -0
  104. package/dist/components/PluginKindSelect.test.js +79 -0
  105. package/dist/components/PluginKindSelect.test.js.map +1 -0
  106. package/dist/components/PluginRegistry/PluginRegistry.d.ts +13 -0
  107. package/dist/components/PluginRegistry/PluginRegistry.d.ts.map +1 -0
  108. package/dist/components/PluginRegistry/PluginRegistry.js +82 -0
  109. package/dist/components/PluginRegistry/PluginRegistry.js.map +1 -0
  110. package/dist/components/PluginRegistry/PluginRegistry.test.d.ts +2 -0
  111. package/dist/components/PluginRegistry/PluginRegistry.test.d.ts.map +1 -0
  112. package/dist/components/PluginRegistry/PluginRegistry.test.js +137 -0
  113. package/dist/components/PluginRegistry/PluginRegistry.test.js.map +1 -0
  114. package/dist/components/PluginRegistry/index.d.ts +2 -0
  115. package/dist/components/PluginRegistry/index.d.ts.map +1 -0
  116. package/dist/components/PluginRegistry/index.js +15 -0
  117. package/dist/components/PluginRegistry/index.js.map +1 -0
  118. package/dist/components/PluginRegistry/plugin-indexes.d.ts +14 -0
  119. package/dist/components/PluginRegistry/plugin-indexes.d.ts.map +1 -0
  120. package/dist/components/PluginRegistry/plugin-indexes.js +70 -0
  121. package/dist/components/PluginRegistry/plugin-indexes.js.map +1 -0
  122. package/dist/components/PluginSpecEditor.d.ts +9 -0
  123. package/dist/components/PluginSpecEditor.d.ts.map +1 -0
  124. package/dist/components/PluginSpecEditor.js +37 -0
  125. package/dist/components/PluginSpecEditor.js.map +1 -0
  126. package/dist/components/PluginSpecEditor.test.d.ts +2 -0
  127. package/dist/components/PluginSpecEditor.test.d.ts.map +1 -0
  128. package/dist/components/PluginSpecEditor.test.js +63 -0
  129. package/dist/components/PluginSpecEditor.test.js.map +1 -0
  130. package/dist/components/TimeSeriesQueryEditor.d.ts +14 -0
  131. package/dist/components/TimeSeriesQueryEditor.d.ts.map +1 -0
  132. package/dist/components/TimeSeriesQueryEditor.js +38 -0
  133. package/dist/components/TimeSeriesQueryEditor.js.map +1 -0
  134. package/dist/components/index.d.ts +9 -0
  135. package/dist/components/index.d.ts.map +1 -0
  136. package/dist/components/index.js +22 -0
  137. package/dist/components/index.js.map +1 -0
  138. package/dist/index.d.ts +5 -0
  139. package/dist/index.d.ts.map +1 -0
  140. package/dist/index.js +18 -0
  141. package/dist/index.js.map +1 -0
  142. package/dist/model/calculations.d.ts +21 -0
  143. package/dist/model/calculations.d.ts.map +1 -0
  144. package/dist/model/calculations.js +64 -0
  145. package/dist/model/calculations.js.map +1 -0
  146. package/dist/model/datasource.d.ts +12 -0
  147. package/dist/model/datasource.d.ts.map +1 -0
  148. package/dist/model/datasource.js +15 -0
  149. package/dist/model/datasource.js.map +1 -0
  150. package/dist/model/index.d.ts +9 -0
  151. package/dist/model/index.d.ts.map +1 -0
  152. package/dist/model/index.js +22 -0
  153. package/dist/model/index.js.map +1 -0
  154. package/dist/model/panels.d.ts +20 -0
  155. package/dist/model/panels.d.ts.map +1 -0
  156. package/dist/model/panels.js +15 -0
  157. package/dist/model/panels.js.map +1 -0
  158. package/dist/model/plugin-base.d.ts +22 -0
  159. package/dist/model/plugin-base.d.ts.map +1 -0
  160. package/dist/model/plugin-base.js +15 -0
  161. package/dist/model/plugin-base.js.map +1 -0
  162. package/dist/model/plugin-loading.d.ts +22 -0
  163. package/dist/model/plugin-loading.d.ts.map +1 -0
  164. package/dist/model/plugin-loading.js +35 -0
  165. package/dist/model/plugin-loading.js.map +1 -0
  166. package/dist/model/plugins.d.ts +54 -0
  167. package/dist/model/plugins.d.ts.map +1 -0
  168. package/dist/model/plugins.js +15 -0
  169. package/dist/model/plugins.js.map +1 -0
  170. package/dist/model/time-series-queries.d.ts +42 -0
  171. package/dist/model/time-series-queries.d.ts.map +1 -0
  172. package/dist/model/time-series-queries.js +15 -0
  173. package/dist/model/time-series-queries.js.map +1 -0
  174. package/dist/model/variables.d.ts +35 -0
  175. package/dist/model/variables.d.ts.map +1 -0
  176. package/dist/model/variables.js +15 -0
  177. package/dist/model/variables.js.map +1 -0
  178. package/dist/runtime/TimeRangeProvider/TimeRangeProvider.d.ts +25 -0
  179. package/dist/runtime/TimeRangeProvider/TimeRangeProvider.d.ts.map +1 -0
  180. package/dist/runtime/TimeRangeProvider/TimeRangeProvider.js +69 -0
  181. package/dist/runtime/TimeRangeProvider/TimeRangeProvider.js.map +1 -0
  182. package/dist/runtime/TimeRangeProvider/index.d.ts +3 -0
  183. package/dist/runtime/TimeRangeProvider/index.d.ts.map +1 -0
  184. package/dist/runtime/TimeRangeProvider/index.js +16 -0
  185. package/dist/runtime/TimeRangeProvider/index.js.map +1 -0
  186. package/dist/runtime/TimeRangeProvider/query-params.d.ts +25 -0
  187. package/dist/runtime/TimeRangeProvider/query-params.d.ts.map +1 -0
  188. package/dist/runtime/TimeRangeProvider/query-params.js +153 -0
  189. package/dist/runtime/TimeRangeProvider/query-params.js.map +1 -0
  190. package/dist/runtime/datasources.d.ts +25 -0
  191. package/dist/runtime/datasources.d.ts.map +1 -0
  192. package/dist/runtime/datasources.js +34 -0
  193. package/dist/runtime/datasources.js.map +1 -0
  194. package/dist/runtime/index.d.ts +6 -0
  195. package/dist/runtime/index.d.ts.map +1 -0
  196. package/dist/runtime/index.js +19 -0
  197. package/dist/runtime/index.js.map +1 -0
  198. package/dist/runtime/plugin-registry.d.ts +32 -0
  199. package/dist/runtime/plugin-registry.d.ts.map +1 -0
  200. package/dist/runtime/plugin-registry.js +69 -0
  201. package/dist/runtime/plugin-registry.js.map +1 -0
  202. package/dist/runtime/template-variables.d.ts +17 -0
  203. package/dist/runtime/template-variables.d.ts.map +1 -0
  204. package/dist/runtime/template-variables.js +44 -0
  205. package/dist/runtime/template-variables.js.map +1 -0
  206. package/dist/runtime/time-series-queries.d.ts +13 -0
  207. package/dist/runtime/time-series-queries.d.ts.map +1 -0
  208. package/dist/runtime/time-series-queries.js +132 -0
  209. package/dist/runtime/time-series-queries.js.map +1 -0
  210. package/dist/test/index.d.ts +2 -0
  211. package/dist/test/index.d.ts.map +1 -0
  212. package/dist/test/index.js +15 -0
  213. package/dist/test/index.js.map +1 -0
  214. package/dist/test/render.d.ts +13 -0
  215. package/dist/test/render.d.ts.map +1 -0
  216. package/dist/test/render.js +49 -0
  217. package/dist/test/render.js.map +1 -0
  218. package/dist/test/setup-tests.d.ts +2 -0
  219. package/dist/test/setup-tests.d.ts.map +1 -0
  220. package/dist/test/setup-tests.js +18 -0
  221. package/dist/test/setup-tests.js.map +1 -0
  222. package/dist/test/test-plugins/bert/index.d.ts +8 -0
  223. package/dist/test/test-plugins/bert/index.d.ts.map +1 -0
  224. package/dist/test/test-plugins/bert/index.js +66 -0
  225. package/dist/test/test-plugins/bert/index.js.map +1 -0
  226. package/dist/test/test-plugins/ernie/index.d.ts +5 -0
  227. package/dist/test/test-plugins/ernie/index.d.ts.map +1 -0
  228. package/dist/test/test-plugins/ernie/index.js +53 -0
  229. package/dist/test/test-plugins/ernie/index.js.map +1 -0
  230. package/dist/test/test-plugins/index.d.ts +6 -0
  231. package/dist/test/test-plugins/index.d.ts.map +1 -0
  232. package/dist/test/test-plugins/index.js +29 -0
  233. package/dist/test/test-plugins/index.js.map +1 -0
  234. package/dist/test-utils/index.d.ts +2 -0
  235. package/dist/test-utils/index.d.ts.map +1 -0
  236. package/dist/test-utils/index.js +15 -0
  237. package/dist/test-utils/index.js.map +1 -0
  238. package/dist/test-utils/mock-plugin-registry.d.ts +20 -0
  239. package/dist/test-utils/mock-plugin-registry.d.ts.map +1 -0
  240. package/dist/test-utils/mock-plugin-registry.js +62 -0
  241. package/dist/test-utils/mock-plugin-registry.js.map +1 -0
  242. package/package.json +45 -0
@@ -0,0 +1,68 @@
1
+ // Copyright 2022 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ "use strict";
14
+ Object.defineProperty(exports, "__esModule", {
15
+ value: true
16
+ });
17
+ function _export(target, all) {
18
+ for(var name in all)Object.defineProperty(target, name, {
19
+ enumerable: true,
20
+ get: all[name]
21
+ });
22
+ }
23
+ _export(exports, {
24
+ mockPluginRegistry: ()=>mockPluginRegistry,
25
+ getMockPluginName: ()=>getMockPluginName
26
+ });
27
+ function mockPluginRegistry(...mockPlugins) {
28
+ const mockPluginResource = {
29
+ kind: 'PluginModule',
30
+ metadata: {
31
+ name: 'Fake Plugin Module for Tests',
32
+ created_at: '',
33
+ updated_at: '',
34
+ version: 0
35
+ },
36
+ spec: {
37
+ // Add metadata for all mock plugins
38
+ plugins: mockPlugins.map(({ pluginType , kind })=>({
39
+ pluginType,
40
+ kind,
41
+ display: {
42
+ name: getMockPluginName(pluginType, kind)
43
+ }
44
+ }))
45
+ }
46
+ };
47
+ const mockPluginModule = {};
48
+ for (const mockPlugin of mockPlugins){
49
+ // "Export" on the module under the same name as the kind the plugin handles
50
+ mockPluginModule[mockPlugin.kind] = mockPlugin.plugin;
51
+ }
52
+ const pluginLoader = {
53
+ getInstalledPlugins () {
54
+ return Promise.resolve([
55
+ mockPluginResource
56
+ ]);
57
+ },
58
+ importPluginModule () {
59
+ return Promise.resolve(mockPluginModule);
60
+ }
61
+ };
62
+ return {
63
+ pluginLoader
64
+ };
65
+ }
66
+ function getMockPluginName(pluginType, kind) {
67
+ return `${pluginType} Plugin for ${kind}`;
68
+ }
@@ -0,0 +1,8 @@
1
+ /// <reference types="react" />
2
+ import { CalculationType } from '../../model/calculations';
3
+ export interface CalculationSelectorProps {
4
+ value: CalculationType;
5
+ onChange: (unit: CalculationType) => void;
6
+ }
7
+ export declare function CalculationSelector({ value, onChange }: CalculationSelectorProps): JSX.Element;
8
+ //# sourceMappingURL=CalculationSelector.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CalculationSelector.d.ts","sourceRoot":"","sources":["../../../src/components/CalculationSelector/CalculationSelector.tsx"],"names":[],"mappings":";AAeA,OAAO,EAA0C,eAAe,EAAE,MAAM,0BAA0B,CAAC;AAUnG,MAAM,WAAW,wBAAwB;IACvC,KAAK,EAAE,eAAe,CAAC;IACvB,QAAQ,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,IAAI,CAAC;CAC3C;AAED,wBAAgB,mBAAmB,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,wBAAwB,eAyBhF"}
@@ -0,0 +1,46 @@
1
+ // Copyright 2022 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ import { jsx as _jsx } from "react/jsx-runtime";
14
+ import { TextField, Autocomplete } from '@mui/material';
15
+ import { OptionsEditorControl } from '@perses-dev/components';
16
+ import { CALCULATIONS_CONFIG } from '../../model/calculations';
17
+ const CALC_OPTIONS = Object.entries(CALCULATIONS_CONFIG).map(([id, config])=>{
18
+ return {
19
+ id: id,
20
+ ...config
21
+ };
22
+ });
23
+ export function CalculationSelector({ value , onChange }) {
24
+ const handleCalculationChange = (_, newValue)=>{
25
+ onChange(newValue.id);
26
+ };
27
+ const calcConfig = CALCULATIONS_CONFIG[value];
28
+ return /*#__PURE__*/ _jsx(OptionsEditorControl, {
29
+ label: "Calculation",
30
+ control: /*#__PURE__*/ _jsx(Autocomplete, {
31
+ value: {
32
+ ...calcConfig,
33
+ id: value
34
+ },
35
+ options: CALC_OPTIONS,
36
+ isOptionEqualToValue: (option, value)=>option.id === value.id,
37
+ renderInput: (params)=>/*#__PURE__*/ _jsx(TextField, {
38
+ ...params
39
+ }),
40
+ onChange: handleCalculationChange,
41
+ disableClearable: true
42
+ })
43
+ });
44
+ }
45
+
46
+ //# sourceMappingURL=CalculationSelector.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/CalculationSelector/CalculationSelector.tsx"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { TextField, Autocomplete } from '@mui/material';\nimport { OptionsEditorControl } from '@perses-dev/components';\nimport { CALCULATIONS_CONFIG, CalculationConfig, CalculationType } from '../../model/calculations';\n\ntype AutocompleteCalculationOption = CalculationConfig & { id: CalculationType };\nconst CALC_OPTIONS: AutocompleteCalculationOption[] = Object.entries(CALCULATIONS_CONFIG).map(([id, config]) => {\n return {\n id: id as CalculationType,\n ...config,\n };\n});\n\nexport interface CalculationSelectorProps {\n value: CalculationType;\n onChange: (unit: CalculationType) => void;\n}\n\nexport function CalculationSelector({ value, onChange }: CalculationSelectorProps) {\n const handleCalculationChange = (_: unknown, newValue: AutocompleteCalculationOption) => {\n onChange(newValue.id);\n };\n\n const calcConfig = CALCULATIONS_CONFIG[value];\n\n return (\n <OptionsEditorControl\n label=\"Calculation\"\n control={\n <Autocomplete\n value={{\n ...calcConfig,\n id: value,\n }}\n options={CALC_OPTIONS}\n isOptionEqualToValue={(option, value) => option.id === value.id}\n renderInput={(params) => <TextField {...params} />}\n onChange={handleCalculationChange}\n disableClearable\n ></Autocomplete>\n }\n />\n );\n}\n"],"names":["TextField","Autocomplete","OptionsEditorControl","CALCULATIONS_CONFIG","CALC_OPTIONS","Object","entries","map","id","config","CalculationSelector","value","onChange","handleCalculationChange","_","newValue","calcConfig","label","control","options","isOptionEqualToValue","option","renderInput","params","disableClearable"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,SAAS,EAAEC,YAAY,QAAQ,eAAe,CAAC;AACxD,SAASC,oBAAoB,QAAQ,wBAAwB,CAAC;AAC9D,SAASC,mBAAmB,QAA4C,0BAA0B,CAAC;AAGnG,MAAMC,YAAY,GAAoCC,MAAM,CAACC,OAAO,CAACH,mBAAmB,CAAC,CAACI,GAAG,CAAC,CAAC,CAACC,EAAE,EAAEC,MAAM,CAAC,GAAK;IAC9G,OAAO;QACLD,EAAE,EAAEA,EAAE;QACN,GAAGC,MAAM;KACV,CAAC;AACJ,CAAC,CAAC,AAAC;AAOH,OAAO,SAASC,mBAAmB,CAAC,EAAEC,KAAK,CAAA,EAAEC,QAAQ,CAAA,EAA4B,EAAE;IACjF,MAAMC,uBAAuB,GAAG,CAACC,CAAU,EAAEC,QAAuC,GAAK;QACvFH,QAAQ,CAACG,QAAQ,CAACP,EAAE,CAAC,CAAC;IACxB,CAAC,AAAC;IAEF,MAAMQ,UAAU,GAAGb,mBAAmB,CAACQ,KAAK,CAAC,AAAC;IAE9C,qBACE,KAACT,oBAAoB;QACnBe,KAAK,EAAC,aAAa;QACnBC,OAAO,gBACL,KAACjB,YAAY;YACXU,KAAK,EAAE;gBACL,GAAGK,UAAU;gBACbR,EAAE,EAAEG,KAAK;aACV;YACDQ,OAAO,EAAEf,YAAY;YACrBgB,oBAAoB,EAAE,CAACC,MAAM,EAAEV,KAAK,GAAKU,MAAM,CAACb,EAAE,KAAKG,KAAK,CAACH,EAAE;YAC/Dc,WAAW,EAAE,CAACC,MAAM,iBAAK,KAACvB,SAAS;oBAAE,GAAGuB,MAAM;kBAAI;YAClDX,QAAQ,EAAEC,uBAAuB;YACjCW,gBAAgB;UACF;MAElB,CACF;AACJ,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=CalculationSelector.test.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CalculationSelector.test.d.ts","sourceRoot":"","sources":["../../../src/components/CalculationSelector/CalculationSelector.test.tsx"],"names":[],"mappings":""}
@@ -0,0 +1,58 @@
1
+ // Copyright 2022 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ import { jsx as _jsx } from "react/jsx-runtime";
14
+ import { render, screen } from '@testing-library/react';
15
+ import userEvent from '@testing-library/user-event';
16
+ import { CalculationSelector } from './CalculationSelector';
17
+ describe('CalculationSelector', ()=>{
18
+ const renderCalculationSelector = (value, onChange = jest.fn())=>{
19
+ render(/*#__PURE__*/ _jsx("div", {
20
+ children: /*#__PURE__*/ _jsx(CalculationSelector, {
21
+ value: value,
22
+ onChange: onChange
23
+ })
24
+ }));
25
+ };
26
+ const getCalculationSelector = ()=>{
27
+ return screen.getByRole('combobox', {
28
+ name: 'Calculation'
29
+ });
30
+ };
31
+ it('can change the calculation by clicking', ()=>{
32
+ const onChange = jest.fn();
33
+ renderCalculationSelector('Last', onChange);
34
+ const calcSelector = getCalculationSelector();
35
+ userEvent.click(calcSelector);
36
+ const sumOption = screen.getByRole('option', {
37
+ name: 'Sum'
38
+ });
39
+ userEvent.click(sumOption);
40
+ expect(onChange).toHaveBeenCalledWith('Sum');
41
+ });
42
+ it('can change the calculation using a keyboard', ()=>{
43
+ const onChange = jest.fn();
44
+ renderCalculationSelector('First', onChange);
45
+ const calcSelector = getCalculationSelector();
46
+ userEvent.tab();
47
+ expect(calcSelector).toHaveFocus();
48
+ userEvent.clear(calcSelector);
49
+ userEvent.keyboard('first');
50
+ screen.getByRole('option', {
51
+ name: 'First'
52
+ });
53
+ userEvent.keyboard('{arrowup}{enter}');
54
+ expect(onChange).toHaveBeenCalledWith('First');
55
+ });
56
+ });
57
+
58
+ //# sourceMappingURL=CalculationSelector.test.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/CalculationSelector/CalculationSelector.test.tsx"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { render, screen } from '@testing-library/react';\nimport userEvent from '@testing-library/user-event';\nimport { CalculationType } from '../../model/calculations';\nimport { CalculationSelector } from './CalculationSelector';\n\ndescribe('CalculationSelector', () => {\n const renderCalculationSelector = (value: CalculationType, onChange = jest.fn()) => {\n render(\n <div>\n <CalculationSelector value={value} onChange={onChange} />\n </div>\n );\n };\n\n const getCalculationSelector = () => {\n return screen.getByRole('combobox', { name: 'Calculation' });\n };\n\n it('can change the calculation by clicking', () => {\n const onChange = jest.fn();\n renderCalculationSelector('Last', onChange);\n\n const calcSelector = getCalculationSelector();\n userEvent.click(calcSelector);\n const sumOption = screen.getByRole('option', {\n name: 'Sum',\n });\n userEvent.click(sumOption);\n\n expect(onChange).toHaveBeenCalledWith('Sum');\n });\n\n it('can change the calculation using a keyboard', () => {\n const onChange = jest.fn();\n renderCalculationSelector('First', onChange);\n\n const calcSelector = getCalculationSelector();\n userEvent.tab();\n expect(calcSelector).toHaveFocus();\n\n userEvent.clear(calcSelector);\n userEvent.keyboard('first');\n screen.getByRole('option', {\n name: 'First',\n });\n\n userEvent.keyboard('{arrowup}{enter}');\n\n expect(onChange).toHaveBeenCalledWith('First');\n });\n});\n"],"names":["render","screen","userEvent","CalculationSelector","describe","renderCalculationSelector","value","onChange","jest","fn","div","getCalculationSelector","getByRole","name","it","calcSelector","click","sumOption","expect","toHaveBeenCalledWith","tab","toHaveFocus","clear","keyboard"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,MAAM,EAAEC,MAAM,QAAQ,wBAAwB,CAAC;AACxD,OAAOC,SAAS,MAAM,6BAA6B,CAAC;AAEpD,SAASC,mBAAmB,QAAQ,uBAAuB,CAAC;AAE5DC,QAAQ,CAAC,qBAAqB,EAAE,IAAM;IACpC,MAAMC,yBAAyB,GAAG,CAACC,KAAsB,EAAEC,QAAQ,GAAGC,IAAI,CAACC,EAAE,EAAE,GAAK;QAClFT,MAAM,eACJ,KAACU,KAAG;sBACF,cAAA,KAACP,mBAAmB;gBAACG,KAAK,EAAEA,KAAK;gBAAEC,QAAQ,EAAEA,QAAQ;cAAI;UACrD,CACP,CAAC;IACJ,CAAC,AAAC;IAEF,MAAMI,sBAAsB,GAAG,IAAM;QACnC,OAAOV,MAAM,CAACW,SAAS,CAAC,UAAU,EAAE;YAAEC,IAAI,EAAE,aAAa;SAAE,CAAC,CAAC;IAC/D,CAAC,AAAC;IAEFC,EAAE,CAAC,wCAAwC,EAAE,IAAM;QACjD,MAAMP,QAAQ,GAAGC,IAAI,CAACC,EAAE,EAAE,AAAC;QAC3BJ,yBAAyB,CAAC,MAAM,EAAEE,QAAQ,CAAC,CAAC;QAE5C,MAAMQ,YAAY,GAAGJ,sBAAsB,EAAE,AAAC;QAC9CT,SAAS,CAACc,KAAK,CAACD,YAAY,CAAC,CAAC;QAC9B,MAAME,SAAS,GAAGhB,MAAM,CAACW,SAAS,CAAC,QAAQ,EAAE;YAC3CC,IAAI,EAAE,KAAK;SACZ,CAAC,AAAC;QACHX,SAAS,CAACc,KAAK,CAACC,SAAS,CAAC,CAAC;QAE3BC,MAAM,CAACX,QAAQ,CAAC,CAACY,oBAAoB,CAAC,KAAK,CAAC,CAAC;IAC/C,CAAC,CAAC,CAAC;IAEHL,EAAE,CAAC,6CAA6C,EAAE,IAAM;QACtD,MAAMP,QAAQ,GAAGC,IAAI,CAACC,EAAE,EAAE,AAAC;QAC3BJ,yBAAyB,CAAC,OAAO,EAAEE,QAAQ,CAAC,CAAC;QAE7C,MAAMQ,YAAY,GAAGJ,sBAAsB,EAAE,AAAC;QAC9CT,SAAS,CAACkB,GAAG,EAAE,CAAC;QAChBF,MAAM,CAACH,YAAY,CAAC,CAACM,WAAW,EAAE,CAAC;QAEnCnB,SAAS,CAACoB,KAAK,CAACP,YAAY,CAAC,CAAC;QAC9Bb,SAAS,CAACqB,QAAQ,CAAC,OAAO,CAAC,CAAC;QAC5BtB,MAAM,CAACW,SAAS,CAAC,QAAQ,EAAE;YACzBC,IAAI,EAAE,OAAO;SACd,CAAC,CAAC;QAEHX,SAAS,CAACqB,QAAQ,CAAC,kBAAkB,CAAC,CAAC;QAEvCL,MAAM,CAACX,QAAQ,CAAC,CAACY,oBAAoB,CAAC,OAAO,CAAC,CAAC;IACjD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC"}
@@ -0,0 +1,2 @@
1
+ export * from './CalculationSelector';
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CalculationSelector/index.ts"],"names":[],"mappings":"AAaA,cAAc,uBAAuB,CAAC"}
@@ -0,0 +1,15 @@
1
+ // Copyright 2022 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ export * from './CalculationSelector';
14
+
15
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/CalculationSelector/index.ts"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './CalculationSelector';\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,uBAAuB,CAAC"}
@@ -0,0 +1,16 @@
1
+ /// <reference types="react" />
2
+ import { SelectProps } from '@mui/material';
3
+ import { DatasourceSelector } from '@perses-dev/core';
4
+ declare type OmittedMuiProps = 'children' | 'value' | 'onChange';
5
+ export interface DatasourceSelectProps extends Omit<SelectProps<string>, OmittedMuiProps> {
6
+ value: DatasourceSelector;
7
+ onChange: (next: DatasourceSelector) => void;
8
+ datasourcePluginKind: string;
9
+ }
10
+ /**
11
+ * Displays a MUI input for selecting a Datasource of a particular kind. Note: The 'value' and `onChange` handler for
12
+ * the input deal with a `DatasourceSelector`.
13
+ */
14
+ export declare function DatasourceSelect(props: DatasourceSelectProps): JSX.Element;
15
+ export {};
16
+ //# sourceMappingURL=DatasourceSelect.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DatasourceSelect.d.ts","sourceRoot":"","sources":["../../src/components/DatasourceSelect.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAU,WAAW,EAAY,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAMtD,aAAK,eAAe,GAAG,UAAU,GAAG,OAAO,GAAG,UAAU,CAAC;AAEzD,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,EAAE,eAAe,CAAC;IACvF,KAAK,EAAE,kBAAkB,CAAC;IAC1B,QAAQ,EAAE,CAAC,IAAI,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC7C,oBAAoB,EAAE,MAAM,CAAC;CAC9B;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,eA6B5D"}
@@ -0,0 +1,73 @@
1
+ // Copyright 2022 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ import { jsx as _jsx } from "react/jsx-runtime";
14
+ import { Select, MenuItem } from '@mui/material';
15
+ import { useMemo } from 'react';
16
+ import { useListDatasources } from '../runtime';
17
+ /**
18
+ * Displays a MUI input for selecting a Datasource of a particular kind. Note: The 'value' and `onChange` handler for
19
+ * the input deal with a `DatasourceSelector`.
20
+ */ export function DatasourceSelect(props) {
21
+ const { datasourcePluginKind , value , onChange , ...others } = props;
22
+ const { data , isLoading } = useListDatasources(datasourcePluginKind);
23
+ // Convert the datasource list into menu items with name/value strings that the Select input can work with
24
+ const menuItems = useMemo(()=>{
25
+ if (data === undefined) return [];
26
+ return data.map((ds)=>({
27
+ name: ds.name,
28
+ value: selectorToOptionValue(ds.selector)
29
+ }));
30
+ }, [
31
+ data
32
+ ]);
33
+ // While loading available values, just use an empty string so MUI select doesn't warn about values out of range
34
+ const optionValue = isLoading ? '' : selectorToOptionValue(value);
35
+ // When the user makes a selection, convert the string option value back to a DatasourceSelector
36
+ const handleChange = (e)=>{
37
+ const next = optionValueToSelector(e.target.value);
38
+ onChange(next);
39
+ };
40
+ // TODO: Does this need a loading indicator of some kind?
41
+ return /*#__PURE__*/ _jsx(Select, {
42
+ ...others,
43
+ value: optionValue,
44
+ onChange: handleChange,
45
+ children: menuItems.map((menuItem)=>/*#__PURE__*/ _jsx(MenuItem, {
46
+ value: menuItem.value,
47
+ children: menuItem.name
48
+ }, menuItem.value))
49
+ });
50
+ }
51
+ // Delimiter used to stringify/parse option values
52
+ const OPTION_VALUE_DELIMITER = '_____';
53
+ // Given a DatasourceSelector, returns a string value like `{kind}_____{name}` that can be used as a Select input value
54
+ function selectorToOptionValue(selector) {
55
+ var _name;
56
+ return [
57
+ selector.kind,
58
+ (_name = selector.name) !== null && _name !== void 0 ? _name : ''
59
+ ].join(OPTION_VALUE_DELIMITER);
60
+ }
61
+ // Given an option value name like `{kind}_____{name}`, returns a DatasourceSelector
62
+ function optionValueToSelector(optionValue) {
63
+ const [kind, name] = optionValue.split(OPTION_VALUE_DELIMITER);
64
+ if (kind === undefined || name === undefined) {
65
+ throw new Error('Invalid optionValue string');
66
+ }
67
+ return {
68
+ kind,
69
+ name: name === '' ? undefined : name
70
+ };
71
+ }
72
+
73
+ //# sourceMappingURL=DatasourceSelect.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/components/DatasourceSelect.tsx"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Select, SelectProps, MenuItem } from '@mui/material';\nimport { DatasourceSelector } from '@perses-dev/core';\nimport { useMemo } from 'react';\nimport { useListDatasources } from '../runtime';\n\n// Props on MUI Select that we don't want people to pass because we're either redefining them or providing them in\n// this component\ntype OmittedMuiProps = 'children' | 'value' | 'onChange';\n\nexport interface DatasourceSelectProps extends Omit<SelectProps<string>, OmittedMuiProps> {\n value: DatasourceSelector;\n onChange: (next: DatasourceSelector) => void;\n datasourcePluginKind: string;\n}\n\n/**\n * Displays a MUI input for selecting a Datasource of a particular kind. Note: The 'value' and `onChange` handler for\n * the input deal with a `DatasourceSelector`.\n */\nexport function DatasourceSelect(props: DatasourceSelectProps) {\n const { datasourcePluginKind, value, onChange, ...others } = props;\n const { data, isLoading } = useListDatasources(datasourcePluginKind);\n\n // Convert the datasource list into menu items with name/value strings that the Select input can work with\n const menuItems = useMemo(() => {\n if (data === undefined) return [];\n return data.map((ds) => ({ name: ds.name, value: selectorToOptionValue(ds.selector) }));\n }, [data]);\n\n // While loading available values, just use an empty string so MUI select doesn't warn about values out of range\n const optionValue = isLoading ? '' : selectorToOptionValue(value);\n\n // When the user makes a selection, convert the string option value back to a DatasourceSelector\n const handleChange: SelectProps<string>['onChange'] = (e) => {\n const next = optionValueToSelector(e.target.value);\n onChange(next);\n };\n\n // TODO: Does this need a loading indicator of some kind?\n return (\n <Select {...others} value={optionValue} onChange={handleChange}>\n {menuItems.map((menuItem) => (\n <MenuItem key={menuItem.value} value={menuItem.value}>\n {menuItem.name}\n </MenuItem>\n ))}\n </Select>\n );\n}\n\n// Delimiter used to stringify/parse option values\nconst OPTION_VALUE_DELIMITER = '_____';\n\n// Given a DatasourceSelector, returns a string value like `{kind}_____{name}` that can be used as a Select input value\nfunction selectorToOptionValue(selector: DatasourceSelector): string {\n return [selector.kind, selector.name ?? ''].join(OPTION_VALUE_DELIMITER);\n}\n\n// Given an option value name like `{kind}_____{name}`, returns a DatasourceSelector\nfunction optionValueToSelector(optionValue: string): DatasourceSelector {\n const [kind, name] = optionValue.split(OPTION_VALUE_DELIMITER);\n if (kind === undefined || name === undefined) {\n throw new Error('Invalid optionValue string');\n }\n return {\n kind,\n name: name === '' ? undefined : name,\n };\n}\n"],"names":["Select","MenuItem","useMemo","useListDatasources","DatasourceSelect","props","datasourcePluginKind","value","onChange","others","data","isLoading","menuItems","undefined","map","ds","name","selectorToOptionValue","selector","optionValue","handleChange","e","next","optionValueToSelector","target","menuItem","OPTION_VALUE_DELIMITER","kind","join","split","Error"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,MAAM,EAAeC,QAAQ,QAAQ,eAAe,CAAC;AAE9D,SAASC,OAAO,QAAQ,OAAO,CAAC;AAChC,SAASC,kBAAkB,QAAQ,YAAY,CAAC;AAYhD;;;CAGC,GACD,OAAO,SAASC,gBAAgB,CAACC,KAA4B,EAAE;IAC7D,MAAM,EAAEC,oBAAoB,CAAA,EAAEC,KAAK,CAAA,EAAEC,QAAQ,CAAA,EAAE,GAAGC,MAAM,EAAE,GAAGJ,KAAK,AAAC;IACnE,MAAM,EAAEK,IAAI,CAAA,EAAEC,SAAS,CAAA,EAAE,GAAGR,kBAAkB,CAACG,oBAAoB,CAAC,AAAC;IAErE,0GAA0G;IAC1G,MAAMM,SAAS,GAAGV,OAAO,CAAC,IAAM;QAC9B,IAAIQ,IAAI,KAAKG,SAAS,EAAE,OAAO,EAAE,CAAC;QAClC,OAAOH,IAAI,CAACI,GAAG,CAAC,CAACC,EAAE,GAAM,CAAA;gBAAEC,IAAI,EAAED,EAAE,CAACC,IAAI;gBAAET,KAAK,EAAEU,qBAAqB,CAACF,EAAE,CAACG,QAAQ,CAAC;aAAE,CAAA,AAAC,CAAC,CAAC;IAC1F,CAAC,EAAE;QAACR,IAAI;KAAC,CAAC,AAAC;IAEX,gHAAgH;IAChH,MAAMS,WAAW,GAAGR,SAAS,GAAG,EAAE,GAAGM,qBAAqB,CAACV,KAAK,CAAC,AAAC;IAElE,gGAAgG;IAChG,MAAMa,YAAY,GAAoC,CAACC,CAAC,GAAK;QAC3D,MAAMC,IAAI,GAAGC,qBAAqB,CAACF,CAAC,CAACG,MAAM,CAACjB,KAAK,CAAC,AAAC;QACnDC,QAAQ,CAACc,IAAI,CAAC,CAAC;IACjB,CAAC,AAAC;IAEF,yDAAyD;IACzD,qBACE,KAACtB,MAAM;QAAE,GAAGS,MAAM;QAAEF,KAAK,EAAEY,WAAW;QAAEX,QAAQ,EAAEY,YAAY;kBAC3DR,SAAS,CAACE,GAAG,CAAC,CAACW,QAAQ,iBACtB,KAACxB,QAAQ;gBAAsBM,KAAK,EAAEkB,QAAQ,CAAClB,KAAK;0BACjDkB,QAAQ,CAACT,IAAI;eADDS,QAAQ,CAAClB,KAAK,CAElB,AACZ,CAAC;MACK,CACT;AACJ,CAAC;AAED,kDAAkD;AAClD,MAAMmB,sBAAsB,GAAG,OAAO,AAAC;AAEvC,uHAAuH;AACvH,SAAST,qBAAqB,CAACC,QAA4B,EAAU;QAC5CA,KAAa;IAApC,OAAO;QAACA,QAAQ,CAACS,IAAI;QAAET,CAAAA,KAAa,GAAbA,QAAQ,CAACF,IAAI,cAAbE,KAAa,cAAbA,KAAa,GAAI,EAAE;KAAC,CAACU,IAAI,CAACF,sBAAsB,CAAC,CAAC;AAC3E,CAAC;AAED,oFAAoF;AACpF,SAASH,qBAAqB,CAACJ,WAAmB,EAAsB;IACtE,MAAM,CAACQ,IAAI,EAAEX,IAAI,CAAC,GAAGG,WAAW,CAACU,KAAK,CAACH,sBAAsB,CAAC,AAAC;IAC/D,IAAIC,IAAI,KAAKd,SAAS,IAAIG,IAAI,KAAKH,SAAS,EAAE;QAC5C,MAAM,IAAIiB,KAAK,CAAC,4BAA4B,CAAC,CAAC;IAChD,CAAC;IACD,OAAO;QACLH,IAAI;QACJX,IAAI,EAAEA,IAAI,KAAK,EAAE,GAAGH,SAAS,GAAGG,IAAI;KACrC,CAAC;AACJ,CAAC"}
@@ -0,0 +1,34 @@
1
+ /// <reference types="react" />
2
+ import { TabProps } from '@mui/material';
3
+ interface BaseTabConfig {
4
+ /**
5
+ * Content rendered when the tab is active.
6
+ */
7
+ content: React.ReactNode;
8
+ }
9
+ interface OtherTabConfig extends BaseTabConfig {
10
+ id: string;
11
+ label: TabProps['label'];
12
+ }
13
+ declare type CommonTabId = 'query' | 'settings' | 'json';
14
+ /**
15
+ * Common tabs that are frequently used in the options editor across multiple
16
+ * plugins. The label and display order of these tabs is not configurable to
17
+ * avoid user experience inconsistencies across plugins.
18
+ */
19
+ declare type CommonTabs = {
20
+ [property in CommonTabId]?: BaseTabConfig;
21
+ };
22
+ /**
23
+ * Custom tabs specified for a given plugin. They are displayed after common
24
+ * tabs.
25
+ */
26
+ declare type OtherTabs = {
27
+ other?: OtherTabConfig[];
28
+ };
29
+ export declare type OptionsEditorTabsProps = {
30
+ tabs: CommonTabs & OtherTabs;
31
+ };
32
+ export declare const OptionsEditorTabs: ({ tabs }: OptionsEditorTabsProps) => JSX.Element;
33
+ export {};
34
+ //# sourceMappingURL=OptionsEditorTabs.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"OptionsEditorTabs.d.ts","sourceRoot":"","sources":["../../../src/components/OptionsEditorTabs/OptionsEditorTabs.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAO,QAAQ,EAAwB,MAAM,eAAe,CAAC;AAIpE,UAAU,aAAa;IACrB;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B;AAED,UAAU,cAAe,SAAQ,aAAa;IAC5C,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC;CAC1B;AAED,aAAK,WAAW,GAAG,OAAO,GAAG,UAAU,GAAG,MAAM,CAAC;AAEjD;;;;GAIG;AACH,aAAK,UAAU,GAAG;KAAG,QAAQ,IAAI,WAAW,CAAC,CAAC,EAAE,aAAa;CAAE,CAAC;AAEhE;;;GAGG;AACH,aAAK,SAAS,GAAG;IACf,KAAK,CAAC,EAAE,cAAc,EAAE,CAAC;CAC1B,CAAC;AAEF,oBAAY,sBAAsB,GAAG;IACnC,IAAI,EAAE,UAAU,GAAG,SAAS,CAAC;CAC9B,CAAC;AAcF,eAAO,MAAM,iBAAiB,aAAc,sBAAsB,gBAyDjE,CAAC"}
@@ -0,0 +1,96 @@
1
+ // Copyright 2022 The Perses Authors
2
+ // Licensed under the Apache License, Version 2.0 (the "License");
3
+ // you may not use this file except in compliance with the License.
4
+ // You may obtain a copy of the License at
5
+ //
6
+ // http://www.apache.org/licenses/LICENSE-2.0
7
+ //
8
+ // Unless required by applicable law or agreed to in writing, software
9
+ // distributed under the License is distributed on an "AS IS" BASIS,
10
+ // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ // See the License for the specific language governing permissions and
12
+ // limitations under the License.
13
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
14
+ import { Tab, Tabs, Box } from '@mui/material';
15
+ import { useState } from 'react';
16
+ import { TabPanel } from './TabPanel';
17
+ // Configuration of the order and labeling for tabs across plugins to enforce a
18
+ // consistent UX.
19
+ const TAB_CONFIG = [
20
+ {
21
+ id: 'query',
22
+ label: 'Query'
23
+ },
24
+ {
25
+ id: 'settings',
26
+ label: 'Settings'
27
+ },
28
+ // Custom tabs go between the visual common tabs and the raw JSON editor.
29
+ 'other',
30
+ {
31
+ id: 'json',
32
+ label: 'JSON'
33
+ }
34
+ ];
35
+ export const OptionsEditorTabs = ({ tabs })=>{
36
+ const [activeTab, setActiveTab] = useState(0);
37
+ const handleChange = (_, newValue)=>{
38
+ setActiveTab(newValue);
39
+ };
40
+ // Normalize the common tabs that are managed via constants in this file
41
+ // and custom tabs that bring their own config into a consistent shape for
42
+ // rendering.
43
+ const normalizedTabs = TAB_CONFIG.reduce((combinedTabs, tabConfig)=>{
44
+ // Custom tabs
45
+ if (tabConfig === 'other') {
46
+ const otherTabs = (tabs === null || tabs === void 0 ? void 0 : tabs.other) || [];
47
+ return [
48
+ ...combinedTabs,
49
+ ...otherTabs
50
+ ];
51
+ }
52
+ // Common tabs
53
+ const commonTab = tabs[tabConfig.id];
54
+ if (commonTab) {
55
+ return [
56
+ ...combinedTabs,
57
+ {
58
+ ...tabConfig,
59
+ ...commonTab
60
+ }
61
+ ];
62
+ }
63
+ return combinedTabs;
64
+ }, []);
65
+ return /*#__PURE__*/ _jsxs(_Fragment, {
66
+ children: [
67
+ /*#__PURE__*/ _jsx(Box, {
68
+ sx: {
69
+ borderBottom: 1,
70
+ borderColor: (theme)=>theme.palette.divider
71
+ },
72
+ children: /*#__PURE__*/ _jsx(Tabs, {
73
+ value: activeTab,
74
+ onChange: handleChange,
75
+ "aria-label": "Panel configuration tabs",
76
+ children: normalizedTabs.map(({ id , label }, i)=>{
77
+ return /*#__PURE__*/ _jsx(Tab, {
78
+ label: label,
79
+ id: `options-editor-tab-${i}`,
80
+ "aria-controls": `options-editor-tabpanel-${i}`
81
+ }, id);
82
+ })
83
+ })
84
+ }),
85
+ normalizedTabs.map(({ id , content }, i)=>{
86
+ return /*#__PURE__*/ _jsx(TabPanel, {
87
+ value: activeTab,
88
+ index: i,
89
+ children: content
90
+ }, id);
91
+ })
92
+ ]
93
+ });
94
+ };
95
+
96
+ //# sourceMappingURL=OptionsEditorTabs.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../src/components/OptionsEditorTabs/OptionsEditorTabs.tsx"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Tab, TabProps, Tabs, TabsProps, Box } from '@mui/material';\nimport { useState } from 'react';\nimport { TabPanel } from './TabPanel';\n\ninterface BaseTabConfig {\n /**\n * Content rendered when the tab is active.\n */\n content: React.ReactNode;\n}\n\ninterface OtherTabConfig extends BaseTabConfig {\n id: string;\n label: TabProps['label'];\n}\n\ntype CommonTabId = 'query' | 'settings' | 'json';\n\n/**\n * Common tabs that are frequently used in the options editor across multiple\n * plugins. The label and display order of these tabs is not configurable to\n * avoid user experience inconsistencies across plugins.\n */\ntype CommonTabs = { [property in CommonTabId]?: BaseTabConfig };\n\n/**\n * Custom tabs specified for a given plugin. They are displayed after common\n * tabs.\n */\ntype OtherTabs = {\n other?: OtherTabConfig[];\n};\n\nexport type OptionsEditorTabsProps = {\n tabs: CommonTabs & OtherTabs;\n};\n\n// Configuration of the order and labeling for tabs across plugins to enforce a\n// consistent UX.\nconst TAB_CONFIG = [\n { id: 'query', label: 'Query' },\n { id: 'settings', label: 'Settings' },\n\n // Custom tabs go between the visual common tabs and the raw JSON editor.\n 'other',\n\n { id: 'json', label: 'JSON' },\n] as const;\n\nexport const OptionsEditorTabs = ({ tabs }: OptionsEditorTabsProps) => {\n const [activeTab, setActiveTab] = useState(0);\n\n const handleChange: TabsProps['onChange'] = (_, newValue) => {\n setActiveTab(newValue);\n };\n\n // Normalize the common tabs that are managed via constants in this file\n // and custom tabs that bring their own config into a consistent shape for\n // rendering.\n const normalizedTabs = TAB_CONFIG.reduce((combinedTabs, tabConfig) => {\n // Custom tabs\n if (tabConfig === 'other') {\n const otherTabs = tabs?.other || [];\n return [...combinedTabs, ...otherTabs];\n }\n\n // Common tabs\n const commonTab = tabs[tabConfig.id];\n if (commonTab) {\n return [\n ...combinedTabs,\n {\n ...tabConfig,\n ...commonTab,\n },\n ];\n }\n\n return combinedTabs;\n }, [] as OtherTabConfig[]);\n\n return (\n <>\n <Box sx={{ borderBottom: 1, borderColor: (theme) => theme.palette.divider }}>\n <Tabs value={activeTab} onChange={handleChange} aria-label=\"Panel configuration tabs\">\n {normalizedTabs.map(({ id, label }, i) => {\n return (\n <Tab\n key={id}\n label={label}\n id={`options-editor-tab-${i}`}\n aria-controls={`options-editor-tabpanel-${i}`}\n />\n );\n })}\n </Tabs>\n </Box>\n {normalizedTabs.map(({ id, content }, i) => {\n return (\n <TabPanel key={id} value={activeTab} index={i}>\n {content}\n </TabPanel>\n );\n })}\n </>\n );\n};\n"],"names":["Tab","Tabs","Box","useState","TabPanel","TAB_CONFIG","id","label","OptionsEditorTabs","tabs","activeTab","setActiveTab","handleChange","_","newValue","normalizedTabs","reduce","combinedTabs","tabConfig","otherTabs","other","commonTab","sx","borderBottom","borderColor","theme","palette","divider","value","onChange","aria-label","map","i","aria-controls","content","index"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,GAAG,EAAYC,IAAI,EAAaC,GAAG,QAAQ,eAAe,CAAC;AACpE,SAASC,QAAQ,QAAQ,OAAO,CAAC;AACjC,SAASC,QAAQ,QAAQ,YAAY,CAAC;AAmCtC,+EAA+E;AAC/E,iBAAiB;AACjB,MAAMC,UAAU,GAAG;IACjB;QAAEC,EAAE,EAAE,OAAO;QAAEC,KAAK,EAAE,OAAO;KAAE;IAC/B;QAAED,EAAE,EAAE,UAAU;QAAEC,KAAK,EAAE,UAAU;KAAE;IAErC,yEAAyE;IACzE,OAAO;IAEP;QAAED,EAAE,EAAE,MAAM;QAAEC,KAAK,EAAE,MAAM;KAAE;CAC9B,AAAS,AAAC;AAEX,OAAO,MAAMC,iBAAiB,GAAG,CAAC,EAAEC,IAAI,CAAA,EAA0B,GAAK;IACrE,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGR,QAAQ,CAAC,CAAC,CAAC,AAAC;IAE9C,MAAMS,YAAY,GAA0B,CAACC,CAAC,EAAEC,QAAQ,GAAK;QAC3DH,YAAY,CAACG,QAAQ,CAAC,CAAC;IACzB,CAAC,AAAC;IAEF,wEAAwE;IACxE,0EAA0E;IAC1E,aAAa;IACb,MAAMC,cAAc,GAAGV,UAAU,CAACW,MAAM,CAAC,CAACC,YAAY,EAAEC,SAAS,GAAK;QACpE,cAAc;QACd,IAAIA,SAAS,KAAK,OAAO,EAAE;YACzB,MAAMC,SAAS,GAAGV,CAAAA,IAAI,aAAJA,IAAI,WAAO,GAAXA,KAAAA,CAAW,GAAXA,IAAI,CAAEW,KAAK,CAAA,IAAI,EAAE,AAAC;YACpC,OAAO;mBAAIH,YAAY;mBAAKE,SAAS;aAAC,CAAC;QACzC,CAAC;QAED,cAAc;QACd,MAAME,SAAS,GAAGZ,IAAI,CAACS,SAAS,CAACZ,EAAE,CAAC,AAAC;QACrC,IAAIe,SAAS,EAAE;YACb,OAAO;mBACFJ,YAAY;gBACf;oBACE,GAAGC,SAAS;oBACZ,GAAGG,SAAS;iBACb;aACF,CAAC;QACJ,CAAC;QAED,OAAOJ,YAAY,CAAC;IACtB,CAAC,EAAE,EAAE,CAAqB,AAAC;IAE3B,qBACE;;0BACE,KAACf,GAAG;gBAACoB,EAAE,EAAE;oBAAEC,YAAY,EAAE,CAAC;oBAAEC,WAAW,EAAE,CAACC,KAAK,GAAKA,KAAK,CAACC,OAAO,CAACC,OAAO;iBAAE;0BACzE,cAAA,KAAC1B,IAAI;oBAAC2B,KAAK,EAAElB,SAAS;oBAAEmB,QAAQ,EAAEjB,YAAY;oBAAEkB,YAAU,EAAC,0BAA0B;8BAClFf,cAAc,CAACgB,GAAG,CAAC,CAAC,EAAEzB,EAAE,CAAA,EAAEC,KAAK,CAAA,EAAE,EAAEyB,CAAC,GAAK;wBACxC,qBACE,KAAChC,GAAG;4BAEFO,KAAK,EAAEA,KAAK;4BACZD,EAAE,EAAE,CAAC,mBAAmB,EAAE0B,CAAC,CAAC,CAAC;4BAC7BC,eAAa,EAAE,CAAC,wBAAwB,EAAED,CAAC,CAAC,CAAC;2BAHxC1B,EAAE,CAIP,CACF;oBACJ,CAAC,CAAC;kBACG;cACH;YACLS,cAAc,CAACgB,GAAG,CAAC,CAAC,EAAEzB,EAAE,CAAA,EAAE4B,OAAO,CAAA,EAAE,EAAEF,CAAC,GAAK;gBAC1C,qBACE,KAAC5B,QAAQ;oBAAUwB,KAAK,EAAElB,SAAS;oBAAEyB,KAAK,EAAEH,CAAC;8BAC1CE,OAAO;mBADK5B,EAAE,CAEN,CACX;YACJ,CAAC,CAAC;;MACD,CACH;AACJ,CAAC,CAAC"}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=OptionsEditorTabs.test.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"OptionsEditorTabs.test.d.ts","sourceRoot":"","sources":["../../../src/components/OptionsEditorTabs/OptionsEditorTabs.test.tsx"],"names":[],"mappings":""}