@perses-dev/components 0.8.1 → 0.10.0

package/dist/cjs/utils/theme-gen.js

@@ -1,4 +1,3 @@
-"use strict";
 // Copyright 2022 The Perses Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
 // you may not use this file except in compliance with the License.
@@ -11,104 +10,116 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.generateChartsTheme = void 0;
-const merge_1 = __importDefault(require("lodash/merge"));
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "generateChartsTheme", {
+    enumerable: true,
+    get: ()=>generateChartsTheme
+});
+const _lodashEs = require("lodash-es");
 const DEFAULT_TEXT_COLOR = '#222';
 function generateChartsTheme(themeName, muiTheme, echartsTheme) {
-    var _a, _b, _c, _d, _e, _f;
-    const primaryTextColor = (_b = (_a = muiTheme.palette.text) === null || _a === void 0 ? void 0 : _a.primary) !== null && _b !== void 0 ? _b : DEFAULT_TEXT_COLOR;
+    var ref, ref1, ref2, ref3, ref4;
+    var ref5;
+    const primaryTextColor = (ref5 = (ref = muiTheme.palette.text) === null || ref === void 0 ? void 0 : ref.primary) !== null && ref5 !== void 0 ? ref5 : DEFAULT_TEXT_COLOR;
     const muiConvertedTheme = {
         title: {
-            show: false,
+            show: false
         },
         textStyle: {
             color: primaryTextColor,
             fontFamily: muiTheme.typography.fontFamily,
-            fontSize: 12,
+            fontSize: 12
         },
         grid: {
             top: 5,
             right: 20,
             bottom: 0,
             left: 20,
-            containLabel: true,
+            containLabel: true
         },
-        color: ['#8dd3c7', '#bebada', '#fb8072', '#80b1d3', '#fdb462'],
+        color: [
+            '#8dd3c7',
+            '#bebada',
+            '#fb8072',
+            '#80b1d3',
+            '#fdb462'
+        ],
         categoryAxis: {
             show: true,
             axisLabel: {
                 show: true,
                 color: primaryTextColor,
-                margin: 15,
+                margin: 15
             },
             axisTick: {
                 show: false,
                 length: 6,
                 lineStyle: {
-                    color: muiTheme.palette.grey[600],
-                },
+                    color: muiTheme.palette.grey[600]
+                }
             },
             axisLine: {
                 show: true,
                 lineStyle: {
-                    color: muiTheme.palette.grey[600],
-                },
+                    color: muiTheme.palette.grey[600]
+                }
             },
             splitLine: {
                 show: true,
                 lineStyle: {
                     width: 0.5,
                     color: muiTheme.palette.grey[300],
-                    opacity: 0.6,
-                },
+                    opacity: 0.6
+                }
             },
             splitArea: {
                 show: false,
                 areaStyle: {
-                    color: [muiTheme.palette.grey[300]],
-                },
-            },
+                    color: [
+                        muiTheme.palette.grey[300]
+                    ]
+                }
+            }
         },
         valueAxis: {
             show: true,
             axisLabel: {
                 color: primaryTextColor,
-                margin: 12,
+                margin: 12
             },
             axisLine: {
-                show: false,
+                show: false
             },
             splitLine: {
                 show: true,
                 lineStyle: {
                     width: 0.5,
                     color: muiTheme.palette.grey[300],
-                    opacity: 0.6,
-                },
-            },
+                    opacity: 0.6
+                }
+            }
         },
         legend: {
             orient: 'horizontal',
             textStyle: {
-                color: primaryTextColor,
+                color: primaryTextColor
             },
             pageTextStyle: {
-                color: muiTheme.palette.grey[600],
+                color: muiTheme.palette.grey[600]
             },
-            pageIconColor: (_d = (_c = muiTheme === null || muiTheme === void 0 ? void 0 : muiTheme.palette) === null || _c === void 0 ? void 0 : _c.action) === null || _d === void 0 ? void 0 : _d.active,
-            pageIconInactiveColor: (_f = (_e = muiTheme === null || muiTheme === void 0 ? void 0 : muiTheme.palette) === null || _e === void 0 ? void 0 : _e.action) === null || _f === void 0 ? void 0 : _f.disabled,
+            pageIconColor: muiTheme === null || muiTheme === void 0 ? void 0 : (ref1 = muiTheme.palette) === null || ref1 === void 0 ? void 0 : (ref2 = ref1.action) === null || ref2 === void 0 ? void 0 : ref2.active,
+            pageIconInactiveColor: muiTheme === null || muiTheme === void 0 ? void 0 : (ref3 = muiTheme.palette) === null || ref3 === void 0 ? void 0 : (ref4 = ref3.action) === null || ref4 === void 0 ? void 0 : ref4.disabled
         },
         toolbox: {
             show: true,
             top: 10,
             right: 10,
             iconStyle: {
-                borderColor: primaryTextColor,
-            },
+                borderColor: primaryTextColor
+            }
         },
         tooltip: {},
         line: {
@@ -117,64 +128,62 @@ function generateChartsTheme(themeName, muiTheme, echartsTheme) {
             symbolSize: 4,
             smooth: false,
             lineStyle: {
-                width: 1,
+                width: 1
             },
             emphasis: {
                 lineStyle: {
-                    width: 1.5,
-                },
-            },
+                    width: 1.5
+                }
+            }
         },
         bar: {
             barMaxWidth: 150,
             itemStyle: {
                 borderWidth: 0,
-                borderColor: muiTheme.palette.grey[300],
-            },
+                borderColor: muiTheme.palette.grey[300]
+            }
         },
         gauge: {
             detail: {
                 fontSize: 18,
                 fontWeight: 600,
-                valueAnimation: false,
+                valueAnimation: false
             },
             splitLine: {
                 distance: 0,
                 length: 4,
                 lineStyle: {
-                    width: 1,
-                },
+                    width: 1
+                }
             },
-            splitNumber: 12,
-        },
+            splitNumber: 12
+        }
     };
     return {
         themeName,
-        echartsTheme: (0, merge_1.default)(muiConvertedTheme, echartsTheme),
+        echartsTheme: (0, _lodashEs.merge)(muiConvertedTheme, echartsTheme),
         noDataOption: {
             title: {
                 show: true,
                 textStyle: {
                     color: primaryTextColor,
                     fontSize: 16,
-                    fontWeight: 400,
+                    fontWeight: 400
                 },
                 text: 'No data',
                 left: 'center',
-                top: 'center',
+                top: 'center'
             },
             xAxis: {
-                show: false,
+                show: false
             },
             yAxis: {
-                show: false,
-            },
+                show: false
+            }
         },
         sparkline: {
             width: 2,
-            color: '#1976d2',
-        },
-        // TODO: add thresholdColors to theme
+            color: '#1976d2'
+        }
     };
 }
-exports.generateChartsTheme = generateChartsTheme;

package/dist/cjs/utils/theme-gen.test.js

@@ -1,4 +1,3 @@
-"use strict";
 // Copyright 2022 The Perses Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
 // you may not use this file except in compliance with the License.
@@ -11,24 +10,27 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-Object.defineProperty(exports, "__esModule", { value: true });
-const material_1 = require("@mui/material");
-const theme_gen_1 = require("./theme-gen");
-describe('generateChartsTheme', () => {
-    const muiTheme = (0, material_1.createTheme)({});
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _material = require("@mui/material");
+const _themeGen = require("./theme-gen");
+describe('generateChartsTheme', ()=>{
+    const muiTheme = (0, _material.createTheme)({});
     const echartsThemeOverrides = {
         legend: {
             textStyle: {
-                color: 'yellow',
-            },
+                color: 'yellow'
+            }
         },
         line: {
             showSymbol: true,
-            smooth: true,
-        },
+            smooth: true
+        }
     };
-    const chartsTheme = (0, theme_gen_1.generateChartsTheme)('perses', muiTheme, echartsThemeOverrides);
-    it('should return perses specific charts theme from converted MUI theme', () => {
+    const chartsTheme = (0, _themeGen.generateChartsTheme)('perses', muiTheme, echartsThemeOverrides);
+    it('should return perses specific charts theme from converted MUI theme', ()=>{
         expect(chartsTheme).toMatchInlineSnapshot(`
       Object {
         "echartsTheme": Object {

package/dist/context/ChartsThemeProvider.js

@@ -1 +1,36 @@
-import{jsx as _jsx}from"react/jsx-runtime";import{createContext,useContext}from"react";import{registerTheme}from"echarts";export function ChartsThemeProvider(e){const{children:t,themeName:r,chartsTheme:o}=e;return void 0!==o&&void 0!==o.echartsTheme&&registerTheme(r,o.echartsTheme),_jsx(ChartsThemeContext.Provider,{value:o,children:t})}export const ChartsThemeContext=createContext(void 0);export function useChartsTheme(){const e=useContext(ChartsThemeContext);if(void 0===e)throw new Error("No ChartsThemeContext found. Did you forget a Provider?");return e}
+// Copyright 2022 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+import { jsx as _jsx } from "react/jsx-runtime";
+import React, { createContext, useContext } from 'react';
+import { registerTheme } from 'echarts';
+export function ChartsThemeProvider(props) {
+    const { children , themeName , chartsTheme  } = props;
+    if (chartsTheme !== undefined && chartsTheme.echartsTheme !== undefined) {
+        // register ECharts theme to be used in individual charts, see: https://apache.github.io/echarts-handbook/en/concepts/style/#theme
+        registerTheme(themeName, chartsTheme.echartsTheme);
+    }
+    return /*#__PURE__*/ _jsx(ChartsThemeContext.Provider, {
+        value: chartsTheme,
+        children: children
+    });
+}
+export const ChartsThemeContext = /*#__PURE__*/ createContext(undefined);
+export function useChartsTheme() {
+    const ctx = useContext(ChartsThemeContext);
+    if (ctx === undefined) {
+        throw new Error('No ChartsThemeContext found. Did you forget a Provider?');
+    }
+    return ctx;
+}
+
+//# sourceMappingURL=ChartsThemeProvider.js.map

package/dist/context/ChartsThemeProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/context/ChartsThemeProvider.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 React, { createContext, useContext } from 'react';\nimport { registerTheme } from 'echarts';\nimport { PersesChartsTheme } from '../model';\n\nexport interface ChartsThemeProviderProps {\n  themeName: string;\n  chartsTheme?: PersesChartsTheme;\n  children?: React.ReactNode;\n}\n\nexport function ChartsThemeProvider(props: ChartsThemeProviderProps) {\n  const { children, themeName, chartsTheme } = props;\n\n  if (chartsTheme !== undefined && chartsTheme.echartsTheme !== undefined) {\n    // register ECharts theme to be used in individual charts, see: https://apache.github.io/echarts-handbook/en/concepts/style/#theme\n    registerTheme(themeName, chartsTheme.echartsTheme);\n  }\n\n  return <ChartsThemeContext.Provider value={chartsTheme}>{children}</ChartsThemeContext.Provider>;\n}\n\nexport const ChartsThemeContext = createContext<PersesChartsTheme | undefined>(undefined);\n\nexport function useChartsTheme(): PersesChartsTheme {\n  const ctx = useContext(ChartsThemeContext);\n  if (ctx === undefined) {\n    throw new Error('No ChartsThemeContext found. Did you forget a Provider?');\n  }\n  return ctx;\n}\n"],"names":["React","createContext","useContext","registerTheme","ChartsThemeProvider","props","children","themeName","chartsTheme","undefined","echartsTheme","ChartsThemeContext","Provider","value","useChartsTheme","ctx","Error"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,OAAOA,KAAK,IAAIC,aAAa,EAAEC,UAAU,QAAQ,OAAO,CAAC;AACzD,SAASC,aAAa,QAAQ,SAAS,CAAC;AASxC,OAAO,SAASC,mBAAmB,CAACC,KAA+B,EAAE;IACnE,MAAM,EAAEC,QAAQ,CAAA,EAAEC,SAAS,CAAA,EAAEC,WAAW,CAAA,EAAE,GAAGH,KAAK,AAAC;IAEnD,IAAIG,WAAW,KAAKC,SAAS,IAAID,WAAW,CAACE,YAAY,KAAKD,SAAS,EAAE;QACvE,kIAAkI;QAClIN,aAAa,CAACI,SAAS,EAAEC,WAAW,CAACE,YAAY,CAAC,CAAC;IACrD,CAAC;IAED,qBAAO,KAACC,kBAAkB,CAACC,QAAQ;QAACC,KAAK,EAAEL,WAAW;kBAAGF,QAAQ;MAA+B,CAAC;AACnG,CAAC;AAED,OAAO,MAAMK,kBAAkB,iBAAGV,aAAa,CAAgCQ,SAAS,CAAC,CAAC;AAE1F,OAAO,SAASK,cAAc,GAAsB;IAClD,MAAMC,GAAG,GAAGb,UAAU,CAACS,kBAAkB,CAAC,AAAC;IAC3C,IAAII,GAAG,KAAKN,SAAS,EAAE;QACrB,MAAM,IAAIO,KAAK,CAAC,yDAAyD,CAAC,CAAC;IAC7E,CAAC;IACD,OAAOD,GAAG,CAAC;AACb,CAAC"}

package/dist/index.js

@@ -1 +1,26 @@
-export*from"./Drawer";export*from"./EChart";export*from"./ErrorAlert";export*from"./ErrorBoundary";export*from"./InfoTooltip";export*from"./LineChart";export*from"./GaugeChart";export*from"./StatChart";export*from"./TimeRangeSelector";export*from"./context/ChartsThemeProvider";export*from"./utils";export*from"./model";
+// Copyright 2022 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+export * from './Drawer';
+export * from './EChart';
+export * from './ErrorAlert';
+export * from './ErrorBoundary';
+export * from './InfoTooltip';
+export * from './LineChart';
+export * from './GaugeChart';
+export * from './StatChart';
+export * from './TimeRangeSelector';
+export * from './context/ChartsThemeProvider';
+export * from './utils';
+export * from './model';
+
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/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 './Drawer';\nexport * from './EChart';\nexport * from './ErrorAlert';\nexport * from './ErrorBoundary';\nexport * from './InfoTooltip';\nexport * from './LineChart';\nexport * from './GaugeChart';\nexport * from './StatChart';\nexport * from './TimeRangeSelector';\nexport * from './context/ChartsThemeProvider';\nexport * from './utils';\nexport * from './model';\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,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,qBAAqB,CAAC;AACpC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}

package/dist/model/graph.js

@@ -1 +1,15 @@
-export const PROGRESSIVE_MODE_SERIES_LIMIT=500;
+// Copyright 2022 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+export const PROGRESSIVE_MODE_SERIES_LIMIT = 500;
+
+//# sourceMappingURL=graph.js.map

package/dist/model/graph.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/model/graph.ts"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { LineSeriesOption } from 'echarts/charts';\n\nexport const PROGRESSIVE_MODE_SERIES_LIMIT = 500;\n\nexport type UnixTimeMs = number;\n\nexport type GraphSeriesValueTuple = [timestamp: UnixTimeMs, value: number];\n\nexport interface GraphSeries {\n  name: string;\n  values: Iterable<GraphSeriesValueTuple>;\n}\n\nexport type EChartsValues = number | null | '-';\n\nexport interface EChartsTimeSeries extends Omit<LineSeriesOption, 'data'> {\n  // TODO: support dataset and both category / time xAxis types\n  data: Iterable<GraphSeriesValueTuple> | EChartsValues[];\n}\n\nexport type EChartsDataFormat = {\n  timeSeries: EChartsTimeSeries[];\n  xAxis: number[];\n  xAxisMax?: number | string;\n  rangeMs?: number;\n};\n"],"names":["PROGRESSIVE_MODE_SERIES_LIMIT"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAIjC,OAAO,MAAMA,6BAA6B,GAAG,GAAG,CAAC"}

package/dist/model/index.js

@@ -1 +1,17 @@
-export*from"./graph";export*from"./theme";export*from"./units";
+// Copyright 2022 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+export * from './graph';
+export * from './theme';
+export * from './units';
+
+//# sourceMappingURL=index.js.map

package/dist/model/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/model/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 './graph';\nexport * from './theme';\nexport * from './units';\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,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}

package/dist/model/theme.js

@@ -1 +1,15 @@
-export{};
+// Copyright 2022 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+export { };
+
+//# sourceMappingURL=theme.js.map

package/dist/model/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/model/theme.ts"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport type { EChartsOption, EChartsCoreOption, BarSeriesOption, LineSeriesOption, GaugeSeriesOption } from 'echarts';\n\nexport interface PersesChartsTheme {\n  themeName: string;\n  echartsTheme: EChartsTheme;\n  noDataOption: EChartsCoreOption;\n  sparkline: {\n    width: number;\n    color: string;\n  };\n}\n\n// https://github.com/apache/echarts/issues/12489#issuecomment-643185207\nexport interface EChartsTheme extends EChartsOption {\n  bar?: BarSeriesOption;\n  line?: LineSeriesOption;\n  gauge?: GaugeSeriesOption;\n}\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,WAiBC"}

package/dist/model/units.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"units.d.ts","sourceRoot":"","sources":["../../src/model/units.ts"],"names":[],"mappings":"AAgBA,eAAO,MAAM,sBAAsB,IAAI,CAAC;AAExC,oBAAY,WAAW,GAAG,eAAe,GAAG,kBAAkB,GAAG,kBAAkB,GAAG,gBAAgB,CAAC;AAEvG,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,WAAW,GAAG,MAAM,CAwB5E;AAGD,QAAA,MAAM,aAAa,8FAA+F,CAAC;AAGnH,aAAK,eAAe,GAAG;IACrB,IAAI,EAAE,OAAO,aAAa,CAAC,MAAM,CAAC,CAAC;CACpC,CAAC;AA2EF,QAAA,MAAM,gBAAgB,6CAA8C,CAAC;AAGrE,aAAK,kBAAkB,GAAG;IACxB,IAAI,EAAE,OAAO,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACtC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAiBF,QAAA,MAAM,gBAAgB,sBAAuB,CAAC;AAG9C,aAAK,kBAAkB,GAAG;IACxB,IAAI,EAAE,OAAO,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACtC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAuBF;;;;GAIG;AACH,wBAAgB,qBAAqB,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,SAAI,UAG9D;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,CAYlF;AAGD,QAAA,MAAM,cAAc,oBAAqB,CAAC;AAG1C,aAAK,gBAAgB,GAAG;IACtB,IAAI,EAAE,OAAO,cAAc,CAAC,MAAM,CAAC,CAAC;IACpC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC"}
+{"version":3,"file":"units.d.ts","sourceRoot":"","sources":["../../src/model/units.ts"],"names":[],"mappings":"AAgBA,eAAO,MAAM,sBAAsB,IAAI,CAAC;AAExC,oBAAY,WAAW,GAAG,eAAe,GAAG,kBAAkB,GAAG,kBAAkB,GAAG,gBAAgB,CAAC;AAEvG,wBAAgB,WAAW,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,CAAC,EAAE,WAAW,GAAG,MAAM,CAwB5E;AAGD,QAAA,MAAM,aAAa,8FAA+F,CAAC;AAGnH,aAAK,eAAe,GAAG;IACrB,IAAI,EAAE,OAAO,aAAa,CAAC,MAAM,CAAC,CAAC;CACpC,CAAC;AA4EF,QAAA,MAAM,gBAAgB,6CAA8C,CAAC;AAGrE,aAAK,kBAAkB,GAAG;IACxB,IAAI,EAAE,OAAO,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACtC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAiBF,QAAA,MAAM,gBAAgB,sBAAuB,CAAC;AAG9C,aAAK,kBAAkB,GAAG;IACxB,IAAI,EAAE,OAAO,gBAAgB,CAAC,MAAM,CAAC,CAAC;IACtC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAuBF;;;;GAIG;AACH,wBAAgB,qBAAqB,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,SAAI,UAG9D;AAED;;;GAGG;AACH,wBAAgB,YAAY,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,KAAK,MAAM,GAAG,MAAM,CAYlF;AAGD,QAAA,MAAM,cAAc,oBAAqB,CAAC;AAG1C,aAAK,gBAAgB,GAAG;IACtB,IAAI,EAAE,OAAO,cAAc,CAAC,MAAM,CAAC,CAAC;IACpC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC"}

package/dist/model/units.js

@@ -1 +1,196 @@
-import{milliseconds}from"date-fns";import{round}from"mathjs";export const DEFAULT_DECIMAL_PLACES=2;export function formatValue(e,t){var n;if(void 0===t)return e.toString();if(isDecimalUnit(t))return formatDecimal(e,t);if(isTimeUnit(t))return formatTime(e,t);if(isPercentUnit(t))return formatPercent(e,t);if(isBytesUnit(t))return formatBytes(e,null!==(n=t.decimal_places)&&void 0!==n?n:2);throw new Error(`Unknown unit options ${t}`)}const timeUnitKinds=["Milliseconds","Seconds","Minutes","Hours","Days","Weeks","Months","Years"],timeUnitKindsSet=new Set(timeUnitKinds);function isTimeUnit(e){return timeUnitKindsSet.has(e.kind)}function formatTime(e,t){const n={};switch(t.kind){case"Milliseconds":n.seconds=e/1e3;break;case"Seconds":n.seconds=e;break;case"Minutes":n.minutes=e;break;case"Hours":n.hours=e;break;case"Days":n.days=e;break;case"Weeks":n.weeks=e;break;case"Months":n.months=e;break;case"Years":n.years=e;break;default:const i=t.kind;throw new Error(`Unknown time unit type ${i}`)}const i=milliseconds(n),r=i/1e3;if(r<1)return`${i.toFixed()} milliseconds`;const s=r/60;if(s<1)return`${r.toFixed()} seconds`;const o=s/60;if(o<1)return`${s.toFixed()} minutes`;const a=o/24;if(a<1)return`${o.toFixed()} hours`;const c=a/7;if(c<1)return`${a.toFixed()} days`;const d=c/52;return d<1?`${c.toFixed()} weeks`:`${d.toFixed()} years`}const percentUnitKinds=["Percent","PercentDecimal","%"],percentUnitKindsSet=new Set(percentUnitKinds);function isPercentUnit(e){return percentUnitKindsSet.has(e.kind)}function formatPercent(e,t){var n;const i=null!==(n=t.decimal_places)&&void 0!==n?n:2;return"PercentDecimal"===t.kind&&(e*=100),e.toFixed(i)+"%"}const decimalUnitKinds=["Decimal"],decimalUnitKindsSet=new Set(decimalUnitKinds);function isDecimalUnit(e){return decimalUnitKindsSet.has(e.kind)}function formatDecimal(e,t){var n;const i=null!==(n=t.decimal_places)&&void 0!==n?n:2;if(!0===t.abbreviate)return abbreviateLargeNumber(e,i);const r={style:"decimal",minimumFractionDigits:0,maximumFractionDigits:i,useGrouping:!0};return new Intl.NumberFormat("en-US",r).format(e)}export function abbreviateLargeNumber(e,t=2){return formatNumber(e,(e=>round(e,t)))}export function formatNumber(e,t){const n=null!=t?t:Math.round;return e>=1e12?n(e/1e12)+"T":e>=1e9?n(e/1e9)+"B":e>=1e6?n(e/1e6)+"M":e>=1e3?n(e/1e3)+"K":e.toString()}const bytesUnitKinds=["Bytes"],bytesUnitKindsSet=new Set(bytesUnitKinds);function isBytesUnit(e){return bytesUnitKindsSet.has(e.kind)}function formatBytes(e,t=2){if(0===e)return"0 Bytes";const n=t<0?0:t,i=Math.max(0,Math.floor(Math.log(e)/Math.log(1024)));return parseFloat((e/Math.pow(1024,i)).toFixed(n))+" "+["Bytes","KB","MB","GB","TB","PB","EB","ZB","YB"][i]}
+// Copyright 2022 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+import { milliseconds } from 'date-fns';
+import { round } from 'mathjs';
+export const DEFAULT_DECIMAL_PLACES = 2;
+export function formatValue(value, unitOptions) {
+    if (unitOptions === undefined) {
+        return value.toString();
+    }
+    if (isDecimalUnit(unitOptions)) {
+        return formatDecimal(value, unitOptions);
+    }
+    if (isTimeUnit(unitOptions)) {
+        return formatTime(value, unitOptions);
+    }
+    if (isPercentUnit(unitOptions)) {
+        return formatPercent(value, unitOptions);
+    }
+    if (isBytesUnit(unitOptions)) {
+        var _decimal_places;
+        const decimals = (_decimal_places = unitOptions.decimal_places) !== null && _decimal_places !== void 0 ? _decimal_places : DEFAULT_DECIMAL_PLACES;
+        return formatBytes(value, decimals);
+    }
+    const exhaustive = unitOptions;
+    throw new Error(`Unknown unit options ${exhaustive}`);
+}
+/* Time Unit Conversion */ const timeUnitKinds = [
+    'Milliseconds',
+    'Seconds',
+    'Minutes',
+    'Hours',
+    'Days',
+    'Weeks',
+    'Months',
+    'Years'
+];
+const timeUnitKindsSet = new Set(timeUnitKinds);
+function isTimeUnit(unitOptions) {
+    return timeUnitKindsSet.has(unitOptions.kind);
+}
+function formatTime(value, unitOptions) {
+    // Create a Duration from the value based on what time unit it is
+    const duration = {};
+    switch(unitOptions.kind){
+        case 'Milliseconds':
+            duration.seconds = value / 1000;
+            break;
+        case 'Seconds':
+            duration.seconds = value;
+            break;
+        case 'Minutes':
+            duration.minutes = value;
+            break;
+        case 'Hours':
+            duration.hours = value;
+            break;
+        case 'Days':
+            duration.days = value;
+            break;
+        case 'Weeks':
+            duration.weeks = value;
+            break;
+        case 'Months':
+            duration.months = value;
+            break;
+        case 'Years':
+            duration.years = value;
+            break;
+        default:
+            {
+                const exhaustive = unitOptions.kind;
+                throw new Error(`Unknown time unit type ${exhaustive}`);
+            }
+    }
+    // Find the largest whole time unit we can display the value in and use it
+    const ms = milliseconds(duration);
+    const seconds = ms / 1000;
+    if (seconds < 1) {
+        return `${ms.toFixed()} milliseconds`;
+    }
+    const minutes = seconds / 60;
+    if (minutes < 1) {
+        return `${seconds.toFixed()} seconds`;
+    }
+    const hours = minutes / 60;
+    if (hours < 1) {
+        return `${minutes.toFixed()} minutes`;
+    }
+    const days = hours / 24;
+    if (days < 1) {
+        return `${hours.toFixed()} hours`;
+    }
+    const weeks = days / 7;
+    if (weeks < 1) {
+        return `${days.toFixed()} days`;
+    }
+    const years = weeks / 52;
+    if (years < 1) {
+        return `${weeks.toFixed()} weeks`;
+    }
+    return `${years.toFixed()} years`;
+}
+/* Percent Unit Conversion */ const percentUnitKinds = [
+    'Percent',
+    'PercentDecimal',
+    '%'
+];
+const percentUnitKindsSet = new Set(percentUnitKinds);
+function isPercentUnit(unitOptions) {
+    return percentUnitKindsSet.has(unitOptions.kind);
+}
+function formatPercent(value, unitOptions) {
+    var _decimal_places;
+    const decimals = (_decimal_places = unitOptions.decimal_places) !== null && _decimal_places !== void 0 ? _decimal_places : DEFAULT_DECIMAL_PLACES;
+    if (unitOptions.kind === 'PercentDecimal') {
+        value = value * 100;
+    }
+    return value.toFixed(decimals) + '%';
+}
+/* Decimal Unit Conversion */ const decimalUnitKinds = [
+    'Decimal'
+];
+const decimalUnitKindsSet = new Set(decimalUnitKinds);
+function isDecimalUnit(unitOptions) {
+    return decimalUnitKindsSet.has(unitOptions.kind);
+}
+function formatDecimal(value, unitOptions) {
+    var _decimal_places;
+    const decimals = (_decimal_places = unitOptions.decimal_places) !== null && _decimal_places !== void 0 ? _decimal_places : DEFAULT_DECIMAL_PLACES;
+    if (unitOptions.abbreviate === true) {
+        return abbreviateLargeNumber(value, decimals);
+    }
+    const formatParams = {
+        style: 'decimal',
+        minimumFractionDigits: 0,
+        maximumFractionDigits: decimals,
+        useGrouping: true
+    };
+    const decimalFormatter = new Intl.NumberFormat('en-US', formatParams);
+    return decimalFormatter.format(value);
+}
+/**
+ * Takes large numbers and abbreviates them with the appropriate suffix
+ * 10123 -> 10.123k
+ * 1000000 -> 1M
+ */ export function abbreviateLargeNumber(num, decimals = 2) {
+    const modifier = (n)=>round(n, decimals);
+    return formatNumber(num, modifier);
+}
+/**
+ * Takes large numbers, rounds and abbreviates them with the appropriate suffix
+ * Add modifier to run on output value prior to unit being added (defaults to rounding)
+ */ export function formatNumber(num, modifier) {
+    const fn = modifier !== null && modifier !== void 0 ? modifier : Math.round;
+    return num >= 1e12 ? fn(num / 1e12) + 'T' : num >= 1e9 ? fn(num / 1e9) + 'B' : num >= 1e6 ? fn(num / 1e6) + 'M' : num >= 1e3 ? fn(num / 1e3) + 'K' : num.toString();
+}
+/* Bytes Unit Conversion */ const bytesUnitKinds = [
+    'Bytes'
+];
+const bytesUnitKindsSet = new Set(bytesUnitKinds);
+function isBytesUnit(unitOptions) {
+    return bytesUnitKindsSet.has(unitOptions.kind);
+}
+// https://stackoverflow.com/questions/15900485/correct-way-to-convert-size-in-bytes-to-kb-mb-gb-in-javascript/18650828#18650828
+function formatBytes(bytes, decimals = 2) {
+    if (bytes === 0) return '0 Bytes';
+    const k = 1024;
+    const dm = decimals < 0 ? 0 : decimals;
+    const sizes = [
+        'Bytes',
+        'KB',
+        'MB',
+        'GB',
+        'TB',
+        'PB',
+        'EB',
+        'ZB',
+        'YB'
+    ];
+    // Math.max(0, ...) ensures that we don't return -1 as a value for the index.
+    // Why? When the number of bytes are between -1 and 1, Math.floor(Math.log(bytes)/Math.log(1024)) returns -1.
+    const i = Math.max(0, Math.floor(Math.log(bytes) / Math.log(k)));
+    return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
+}
+
+//# sourceMappingURL=units.js.map