@perses-dev/components 0.32.0 → 0.34.0

package/dist/cjs/Legend/Legend.js

@@ -21,7 +21,7 @@ Object.defineProperty(exports, "Legend", {
 const _jsxRuntime = require("react/jsx-runtime");
 const _material = require("@mui/material");
 const _immer = require("immer");
-const _model = require("../model");
+const _core = require("@perses-dev/core");
 const _listLegend = require("./ListLegend");
 const _compactLegend = require("./CompactLegend");
 const _tableLegend = require("./TableLegend");
@@ -31,7 +31,7 @@ const _tableLegend = require("./TableLegend");
 // Set this number based on testing, but it may need to be tuned a bit on the
 // future as people test this out on different machines.
 const NEED_VIRTUALIZATION_LIMIT = 500;
-function Legend({ width , height , options , data , selectedItems , onSelectedItemsChange  }) {
+function Legend({ width , height , options , data , selectedItems , onSelectedItemsChange , tableProps  }) {
     const onLegendItemClick = (e, seriesId)=>{
         const isModifiedClick = e.metaKey || e.shiftKey;
         const newSelected = (0, _immer.produce)(selectedItems, (draft)=>{
@@ -64,7 +64,7 @@ function Legend({ width , height , options , data , selectedItems , onSelectedIt
         });
         onSelectedItemsChange(newSelected);
     };
-    const mode = (0, _model.getLegendMode)(options.mode);
+    const mode = (0, _core.getLegendMode)(options.mode);
     // The bottom legend is displayed as a list when the number of items is too
     // large and requires virtualization. Otherwise, it is rendered more compactly.
     // We do not need this check for the right-side legend because it is always
@@ -81,7 +81,8 @@ function Legend({ width , height , options , data , selectedItems , onSelectedIt
         legendContent = /*#__PURE__*/ (0, _jsxRuntime.jsx)(_tableLegend.TableLegend, {
             ...commonLegendProps,
             onSelectedItemsChange: onSelectedItemsChange,
-            width: width
+            width: width,
+            ...tableProps
         });
     } else if (options.position === 'Right' || needsVirtualization) {
         legendContent = /*#__PURE__*/ (0, _jsxRuntime.jsx)(_listLegend.ListLegend, {

package/dist/cjs/Legend/ListLegend.js

@@ -20,8 +20,8 @@ Object.defineProperty(exports, "ListLegend", {
 });
 const _jsxRuntime = require("react/jsx-runtime");
 const _reactVirtuoso = require("react-virtuoso");
-const _model = require("../model");
 const _listLegendItem = require("./ListLegendItem");
+const _legendModel = require("./legend-model");
 function ListLegend({ items , height , width , selectedItems , onLegendItemClick  }) {
     // show full labels on hover when there are many total series
     const truncateLabels = items.length > 5;
@@ -35,7 +35,7 @@ function ListLegend({ items , height , width , selectedItems , onLegendItemClick
             return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_listLegendItem.ListLegendItem, {
                 item: item,
                 truncateLabel: truncateLabels,
-                isVisuallySelected: (0, _model.isLegendItemVisuallySelected)(item, selectedItems),
+                isVisuallySelected: (0, _legendModel.isLegendItemVisuallySelected)(item, selectedItems),
                 onClick: onLegendItemClick,
                 sx: {
                     // Having an explicit width is important for the ellipsizing to

package/dist/cjs/Legend/TableLegend.js

@@ -40,7 +40,7 @@ const getRowId = (data)=>{
 const getCheckboxColor = (data)=>{
     return data.color;
 };
-function TableLegend({ items , selectedItems: initRowSelection , onSelectedItemsChange , height , width  }) {
+function TableLegend({ items , selectedItems: initRowSelection , onSelectedItemsChange , height , width , columns: additionalColumns = []  }) {
     const rowSelection = (0, _react.useMemo)(()=>{
         return typeof initRowSelection !== 'string' ? initRowSelection : // items for checkboxes.
         // TODO: clean this up if we switch to also using checkboxes in list legend.
@@ -52,13 +52,21 @@ function TableLegend({ items , selectedItems: initRowSelection , onSelectedItems
         initRowSelection,
         items
     ]);
+    const columns = (0, _react.useMemo)(()=>{
+        return [
+            ...COLUMNS,
+            ...additionalColumns
+        ];
+    }, [
+        additionalColumns
+    ]);
     return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_table.Table, {
         height: height,
         width: width,
         rowSelection: rowSelection,
         onRowSelectionChange: onSelectedItemsChange,
         data: items,
-        columns: COLUMNS,
+        columns: columns,
         density: "compact",
         getRowId: getRowId,
         getCheckboxColor: getCheckboxColor,

package/dist/cjs/Legend/index.js

@@ -15,6 +15,7 @@ Object.defineProperty(exports, "__esModule", {
     value: true
 });
 _exportStar(require("./Legend"), exports);
+_exportStar(require("./legend-model"), exports);
 function _exportStar(from, to) {
     Object.keys(from).forEach(function(k) {
         if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {

package/dist/cjs/{LegendOptionsEditor/index.js → Legend/legend-model.js}

@@ -14,15 +14,12 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-_exportStar(require("./LegendOptionsEditor"), exports);
-function _exportStar(from, to) {
-    Object.keys(from).forEach(function(k) {
-        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {
-            enumerable: true,
-            get: function() {
-                return from[k];
-            }
-        });
-    });
-    return from;
+Object.defineProperty(exports, "isLegendItemVisuallySelected", {
+    enumerable: true,
+    get: ()=>isLegendItemVisuallySelected
+});
+function isLegendItemVisuallySelected(item, selectedItems) {
+    // In the "ALL" case, technically all legend items are selected, but we do
+    // not render them differently.
+    return selectedItems !== 'ALL' && !!selectedItems[item.id];
 }

package/dist/cjs/LineChart/LineChart.js

@@ -84,7 +84,7 @@ function _interopRequireWildcard(obj, nodeInterop) {
 ]);
 function LineChart({ height , data , yAxis , unit , grid , legend , tooltipConfig ={
     wrapLabels: true
-} , noDataVariant ='message' , onDataZoom , onDoubleClick , __experimentalEChartsOptionsOverride  }) {
+} , noDataVariant ='message' , syncGroup , onDataZoom , onDoubleClick , __experimentalEChartsOptionsOverride  }) {
     var ref;
     const chartsTheme = (0, _chartsThemeProvider.useChartsTheme)();
     const chartRef = (0, _react.useRef)();
@@ -284,7 +284,8 @@ function LineChart({ height , data , yAxis , unit , grid , legend , tooltipConfi
                 option: option,
                 theme: chartsTheme.echartsTheme,
                 onEvents: handleEvents,
-                _instance: chartRef
+                _instance: chartRef,
+                syncGroup: syncGroup
             })
         ]
     });

package/dist/cjs/LineChart/utils.js

@@ -27,9 +27,14 @@ _export(exports, {
     getFormattedDate: ()=>getFormattedDate,
     getYAxes: ()=>getYAxes
 });
-const _lodashEs = require("lodash-es");
+const _merge = /*#__PURE__*/ _interopRequireDefault(require("lodash/merge"));
 const _model = require("../model");
 const _utils = require("../utils");
+function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
 function enableDataZoom(chart) {
     const chartModel = chart['_model'];
     if (chartModel === undefined) return;
@@ -90,6 +95,6 @@ function getYAxes(yAxis, unit) {
         }
     };
     return [
-        (0, _lodashEs.merge)(Y_AXIS_DEFAULT, yAxis)
+        (0, _merge.default)(Y_AXIS_DEFAULT, yAxis)
     ];
 }

package/dist/cjs/StatChart/StatChart.js

@@ -21,7 +21,7 @@ Object.defineProperty(exports, "StatChart", {
 const _jsxRuntime = require("react/jsx-runtime");
 const _react = require("react");
 const _material = require("@mui/material");
-const _lodashEs = require("lodash-es");
+const _merge = /*#__PURE__*/ _interopRequireDefault(require("lodash/merge"));
 const _core = require("echarts/core");
 const _charts = require("echarts/charts");
 const _components = require("echarts/components");
@@ -29,6 +29,11 @@ const _renderers = require("echarts/renderers");
 const _chartsThemeProvider = require("../context/ChartsThemeProvider");
 const _units = require("../model/units");
 const _echart = require("../EChart");
+function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
 (0, _core.use)([
     _charts.LineChart,
     _components.GridComponent,
@@ -58,7 +63,7 @@ function StatChart(props) {
                 animation: false,
                 silent: true
             };
-            const mergedSeries = (0, _lodashEs.merge)(lineSeries, sparkline);
+            const mergedSeries = (0, _merge.default)(lineSeries, sparkline);
             statSeries.push(mergedSeries);
         }
         const option = {

package/dist/cjs/Table/InnerTable.js

@@ -25,7 +25,7 @@ const StyledMuiTable = (0, _material.styled)(_material.Table)(({ theme  })=>({
         // This value is needed to have a consistent table layout when scrolling.
         tableLayout: 'fixed',
         borderCollapse: 'separate',
-        backgroundColor: theme.palette.background.paper
+        backgroundColor: theme.palette.background.default
     }));
 const TABLE_DENSITY_CONFIG = {
     compact: 'small',

package/dist/cjs/Table/Table.js

@@ -37,7 +37,7 @@ function Table({ data , columns , density ='standard' , checkboxSelection , onRo
     const checkboxColumn = (0, _react.useMemo)(()=>{
         return {
             id: 'checkboxRowSelect',
-            size: 32,
+            size: 28,
             header: ({ table  })=>{
                 return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_tableCheckbox.TableCheckbox, {
                     checked: table.getIsAllRowsSelected(),

package/dist/cjs/Table/TableCell.js

@@ -27,7 +27,7 @@ const StyledMuiTableCell = (0, _material.styled)(_material.TableCell)(({ theme
         backgroundColor: 'inherit',
         '&.MuiTableCell-head': {
             // Important to avoid scrolling behind the header showing through.
-            backgroundColor: theme.palette.background.paper
+            backgroundColor: theme.palette.background.default
         },
         '&:focus-visible': {
             outline: `solid 1px ${theme.palette.primary.main}`,
@@ -37,7 +37,7 @@ const StyledMuiTableCell = (0, _material.styled)(_material.TableCell)(({ theme
             borderRadius: 0
         }
     }));
-function TableCell({ children , density , variant , width , focusState ='none' , onFocusTrigger , ...otherProps }) {
+function TableCell({ children , density , variant , width , focusState ='none' , onFocusTrigger , isFirstColumn , isLastColumn , ...otherProps }) {
     const theme = (0, _material.useTheme)();
     const elRef = (0, _react.useRef)();
     const isHeader = variant === 'head';
@@ -83,7 +83,10 @@ function TableCell({ children , density , variant , width , focusState ='none' ,
         ref: elRef,
         children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Box, {
             sx: {
-                ...(0, _tableModel.getTableCellLayout)(theme, density),
+                ...(0, _tableModel.getTableCellLayout)(theme, density, {
+                    isLastColumn,
+                    isFirstColumn
+                }),
                 position: 'relative',
                 // Text truncation. Currently enforced on all cells. We may control
                 // this with a prop on column config in the future.

package/dist/cjs/Table/TableRow.js

@@ -26,9 +26,9 @@ const TableRow = /*#__PURE__*/ (0, _react.forwardRef)(function TableRow(props, r
         ...props,
         ref: ref,
         sx: {
-            backgroundColor: (theme)=>theme.palette.background.paper,
+            backgroundColor: (theme)=>theme.palette.background.default,
             '&:hover': {
-                backgroundColor: (theme)=>theme.palette.primary.light
+                backgroundColor: (theme)=>(0, _material.alpha)(theme.palette.primary.main, theme.palette.action.hoverOpacity)
             }
         }
     });

package/dist/cjs/Table/VirtualizedTable.js

@@ -107,7 +107,8 @@ function VirtualizedTable({ width , height , density , onRowClick , rows , colum
                     children: headers.map((headerGroup)=>{
                         return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_tableRow.TableRow, {
                             density: density,
-                            children: headerGroup.headers.map((header, i)=>{
+                            children: headerGroup.headers.map((header, i, headers)=>{
+                                var ref;
                                 const column = header.column;
                                 const position = {
                                     row: 0,
@@ -115,10 +116,13 @@ function VirtualizedTable({ width , height , density , onRowClick , rows , colum
                                 };
                                 return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_tableCell.TableCell, {
                                     width: column.getSize() || 'auto',
+                                    align: (ref = column.columnDef.meta) === null || ref === void 0 ? void 0 : ref.align,
                                     variant: "head",
                                     density: density,
                                     focusState: getFocusState(position),
                                     onFocusTrigger: ()=>keyboardNav.onCellFocus(position),
+                                    isFirstColumn: i === 0,
+                                    isLastColumn: i === headers.length - 1,
                                     children: (0, _reactTable.flexRender)(column.columnDef.header, header.getContext())
                                 }, header.id);
                             })
@@ -132,19 +136,21 @@ function VirtualizedTable({ width , height , density , onRowClick , rows , colum
                     return null;
                 }
                 return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-                    children: row.getVisibleCells().map((cell, i)=>{
+                    children: row.getVisibleCells().map((cell, i, cells)=>{
+                        var ref;
                         const position = {
                             // Add 1 to the row index because the header is row 0
                             row: index + 1,
                             column: i
                         };
                         return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_tableCell.TableCell, {
-                            sx: {
-                                width: cell.column.getSize() || 'auto'
-                            },
+                            width: cell.column.getSize() || 'auto',
+                            align: (ref = cell.column.columnDef.meta) === null || ref === void 0 ? void 0 : ref.align,
                             density: density,
                             focusState: getFocusState(position),
                             onFocusTrigger: ()=>keyboardNav.onCellFocus(position),
+                            isFirstColumn: i === 0,
+                            isLastColumn: i === cells.length - 1,
                             children: (0, _reactTable.flexRender)(cell.column.columnDef.cell, cell.getContext())
                         }, cell.id);
                     })

package/dist/cjs/Table/model/table-model.js

@@ -31,13 +31,16 @@ function calculateTableCellHeight(lineHeight, paddingY) {
     const verticalPaddingNum = typeof paddingY === 'string' ? parseInt(paddingY, 10) : paddingY;
     return lineHeightNum + verticalPaddingNum * 2;
 }
-function getTableCellLayout(theme, density) {
+function getTableCellLayout(theme, density, { isLastColumn , isFirstColumn  } = {}) {
     if (density === 'compact') {
         const paddingY = theme.spacing(0.5);
-        const paddingX = theme.spacing(0.25);
+        const basePaddingX = theme.spacing(0.5);
+        const edgePaddingX = theme.spacing(1);
+        const paddingLeft = isFirstColumn ? edgePaddingX : basePaddingX;
+        const paddingRight = isLastColumn ? edgePaddingX : basePaddingX;
         const lineHeight = theme.typography.body2.lineHeight;
         return {
-            padding: `${paddingY} ${paddingX}`,
+            padding: `${paddingY} ${paddingRight} ${paddingY} ${paddingLeft}`,
             height: calculateTableCellHeight(lineHeight, paddingY),
             fontSize: theme.typography.body2.fontSize,
             lineHeight: lineHeight
@@ -45,17 +48,20 @@ function getTableCellLayout(theme, density) {
     }
     // standard density
     const paddingY1 = theme.spacing(1);
-    const paddingX1 = theme.spacing(1.25);
+    const basePaddingX1 = theme.spacing(1.25);
+    const edgePaddingX1 = theme.spacing(2);
+    const paddingLeft1 = isFirstColumn ? edgePaddingX1 : basePaddingX1;
+    const paddingRight1 = isLastColumn ? edgePaddingX1 : basePaddingX1;
     const lineHeight1 = theme.typography.body1.lineHeight;
     return {
-        padding: `${paddingY1} ${paddingX1}`,
+        padding: `${paddingY1} ${paddingRight1} ${paddingY1} ${paddingLeft1}`,
         height: calculateTableCellHeight(lineHeight1, paddingY1),
         fontSize: theme.typography.body1.fontSize,
         lineHeight: lineHeight1
     };
 }
 function persesColumnsToTanstackColumns(columns) {
-    const tableCols = columns.map(({ width , ...otherProps })=>{
+    const tableCols = columns.map(({ width , align , ...otherProps })=>{
         // Tanstack Table does not support an "auto" value to naturally size to fit
         // the space in a table. We translate our custom "auto" setting to 0 size
         // for these columns, so it is easy to fall back to auto when rendering.
@@ -72,7 +78,12 @@ function persesColumnsToTanstackColumns(columns) {
         };
         const result = {
             ...otherProps,
-            ...sizeProps
+            ...sizeProps,
+            // Open-ended store for extra metadata in TanStack Table, so you can bake
+            // in your own features.
+            meta: {
+                align
+            }
         };
         return result;
     });

package/dist/cjs/TimeSeriesTooltip/nearby-series.js

@@ -117,14 +117,16 @@ function checkforNearbySeries(data, pointInGrid, yBuffer, chart, unit) {
             chart.dispatchAction({
                 type: 'highlight',
                 seriesIndex: emphasizedSeriesIndexes,
-                notBlur: false
+                notBlur: false,
+                escapeConnect: true
             });
         } else {
             // When no emphasized series with bold text, notBlur allows opacity fadeout to not trigger.
             chart.dispatchAction({
                 type: 'highlight',
                 seriesIndex: nearbySeriesIndexes,
-                notBlur: true
+                notBlur: true,
+                escapeConnect: true
             });
         }
     }

package/dist/cjs/index.js

@@ -26,7 +26,6 @@ _exportStar(require("./GaugeChart"), exports);
 _exportStar(require("./InfoTooltip"), exports);
 _exportStar(require("./JSONEditor"), exports);
 _exportStar(require("./Legend"), exports);
-_exportStar(require("./LegendOptionsEditor"), exports);
 _exportStar(require("./LineChart"), exports);
 _exportStar(require("./OptionsEditorLayout"), exports);
 _exportStar(require("./StatChart"), exports);

package/dist/cjs/model/index.js

@@ -15,7 +15,6 @@ Object.defineProperty(exports, "__esModule", {
     value: true
 });
 _exportStar(require("./graph"), exports);
-_exportStar(require("./legend"), exports);
 _exportStar(require("./theme"), exports);
 _exportStar(require("./units"), exports);
 function _exportStar(from, to) {

package/dist/cjs/theme/component-overrides/paper.js

@@ -0,0 +1,27 @@
+// Copyright 2023 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "MuiPaper", {
+    enumerable: true,
+    get: ()=>MuiPaper
+});
+const MuiPaper = {
+    styleOverrides: {
+        root: ({ theme  })=>({
+                backgroundColor: theme.palette.background.default
+            })
+    }
+};

package/dist/cjs/theme/palette/background.js

@@ -25,8 +25,8 @@ const background = (mode)=>{
     return mode === 'light' ? {
         navigation,
         overlay,
-        default: _colors.grey[50],
-        paper: _colors.white,
+        default: _colors.white,
+        paper: _colors.grey[50],
         tooltip: _colors.grey[100],
         border: _colors.grey[100]
     } : {

package/dist/cjs/theme/theme.js

@@ -20,6 +20,7 @@ Object.defineProperty(exports, "getTheme", {
 });
 const _material = require("@mui/material");
 const _alert = require("./component-overrides/alert");
+const _paper = require("./component-overrides/paper");
 const _paletteOptions = require("./palette/palette-options");
 const _typography = require("./typography");
 const getModalBackgroundStyle = ({ theme  })=>{
@@ -48,6 +49,7 @@ const components = {
             size: 'small'
         }
     },
+    MuiPaper: _paper.MuiPaper,
     MuiTextField: {
         defaultProps: {
             size: 'small'

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

@@ -18,7 +18,12 @@ Object.defineProperty(exports, "generateChartsTheme", {
     enumerable: true,
     get: ()=>generateChartsTheme
 });
-const _lodashEs = require("lodash-es");
+const _merge = /*#__PURE__*/ _interopRequireDefault(require("lodash/merge"));
+function _interopRequireDefault(obj) {
+    return obj && obj.__esModule ? obj : {
+        default: obj
+    };
+}
 const DEFAULT_TEXT_COLOR = '#222';
 function generateChartsTheme(muiTheme, echartsTheme) {
     var ref, ref1, ref2, ref3, ref4;
@@ -163,7 +168,7 @@ function generateChartsTheme(muiTheme, echartsTheme) {
         }
     };
     return {
-        echartsTheme: (0, _lodashEs.merge)(muiConvertedTheme, echartsTheme),
+        echartsTheme: (0, _merge.default)(muiConvertedTheme, echartsTheme),
         noDataOption: {
             title: {
                 show: true,

package/dist/index.d.ts

@@ -10,7 +10,6 @@ export * from './GaugeChart';
 export * from './InfoTooltip';
 export * from './JSONEditor';
 export * from './Legend';
-export * from './LegendOptionsEditor';
 export * from './LineChart';
 export * from './OptionsEditorLayout';
 export * from './StatChart';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAaA,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,+BAA+B,CAAC;AAC9C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAaA,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,+BAA+B,CAAC;AAC9C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC"}

package/dist/index.js

@@ -22,7 +22,6 @@ export * from './GaugeChart';
 export * from './InfoTooltip';
 export * from './JSONEditor';
 export * from './Legend';
-export * from './LegendOptionsEditor';
 export * from './LineChart';
 export * from './OptionsEditorLayout';
 export * from './StatChart';

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.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\nexport * from './ColorPicker';\nexport * from './ContentWithLegend';\nexport * from './DateTimeRangePicker';\nexport * from './Dialog';\nexport * from './Drawer';\nexport * from './EChart';\nexport * from './ErrorAlert';\nexport * from './ErrorBoundary';\nexport * from './GaugeChart';\nexport * from './InfoTooltip';\nexport * from './JSONEditor';\nexport * from './Legend';\nexport * from './LegendOptionsEditor';\nexport * from './LineChart';\nexport * from './OptionsEditorLayout';\nexport * from './StatChart';\nexport * from './Table';\nexport * from './ThresholdsEditor';\nexport * from './TimeSeriesTooltip';\nexport * from './UnitSelector';\nexport * from './YAxisLabel';\nexport * from './context/ChartsThemeProvider';\nexport * from './context/TimeZoneProvider';\nexport * from './context/SnackbarProvider';\nexport * from './utils';\nexport * from './model';\nexport * from './test-utils';\nexport * from './theme';\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,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,+BAA+B,CAAC;AAC9C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC"}
+{"version":3,"sources":["../src/index.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\nexport * from './ColorPicker';\nexport * from './ContentWithLegend';\nexport * from './DateTimeRangePicker';\nexport * from './Dialog';\nexport * from './Drawer';\nexport * from './EChart';\nexport * from './ErrorAlert';\nexport * from './ErrorBoundary';\nexport * from './GaugeChart';\nexport * from './InfoTooltip';\nexport * from './JSONEditor';\nexport * from './Legend';\nexport * from './LineChart';\nexport * from './OptionsEditorLayout';\nexport * from './StatChart';\nexport * from './Table';\nexport * from './ThresholdsEditor';\nexport * from './TimeSeriesTooltip';\nexport * from './UnitSelector';\nexport * from './YAxisLabel';\nexport * from './context/ChartsThemeProvider';\nexport * from './context/TimeZoneProvider';\nexport * from './context/SnackbarProvider';\nexport * from './utils';\nexport * from './model';\nexport * from './test-utils';\nexport * from './theme';\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,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,uBAAuB,CAAC;AACtC,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,cAAc,CAAC;AAC7B,cAAc,+BAA+B,CAAC;AAC9C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC"}

package/dist/model/graph.d.ts

@@ -1,6 +1,6 @@
 import { TimeSeriesValueTuple } from '@perses-dev/core';
 import { LineSeriesOption } from 'echarts/charts';
-import { LegendItem } from './legend';
+import { LegendItem } from '../Legend';
 export declare const OPTIMIZED_MODE_SERIES_LIMIT = 1000;
 export declare type UnixTimeMs = number;
 export interface GraphSeries {

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

@@ -1 +1 @@
-{"version":3,"file":"graph.d.ts","sourceRoot":"","sources":["../../src/model/graph.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAGtC,eAAO,MAAM,2BAA2B,OAAO,CAAC;AAEhD,oBAAY,UAAU,GAAG,MAAM,CAAC;AAEhC,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,oBAAoB,EAAE,CAAC;CAChC;AAED,oBAAY,aAAa,GAAG,MAAM,GAAG,IAAI,GAAG,GAAG,CAAC;AAEhD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,gBAAgB,EAAE,MAAM,CAAC;IAEvE,IAAI,EAAE,aAAa,EAAE,CAAC;CACvB;AAED,oBAAY,iBAAiB,GAAG;IAC9B,UAAU,EAAE,iBAAiB,EAAE,CAAC;IAChC,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC"}
+{"version":3,"file":"graph.d.ts","sourceRoot":"","sources":["../../src/model/graph.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AACxD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAGvC,eAAO,MAAM,2BAA2B,OAAO,CAAC;AAEhD,oBAAY,UAAU,GAAG,MAAM,CAAC;AAEhC,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,oBAAoB,EAAE,CAAC;CAChC;AAED,oBAAY,aAAa,GAAG,MAAM,GAAG,IAAI,GAAG,GAAG,CAAC;AAEhD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,gBAAgB,EAAE,MAAM,CAAC;IAEvE,IAAI,EAAE,aAAa,EAAE,CAAC;CACvB;AAED,oBAAY,iBAAiB,GAAG;IAC9B,UAAU,EAAE,iBAAiB,EAAE,CAAC;IAChC,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;IAC3B,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC3B,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC"}

package/dist/model/graph.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/model/graph.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 { TimeSeriesValueTuple } from '@perses-dev/core';\nimport { LineSeriesOption } from 'echarts/charts';\nimport { LegendItem } from './legend';\n\n// adjust display when there are many time series to help with performance\nexport const OPTIMIZED_MODE_SERIES_LIMIT = 1000;\n\nexport type UnixTimeMs = number;\n\nexport interface GraphSeries {\n  name: string;\n  values: TimeSeriesValueTuple[];\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: EChartsValues[];\n}\n\nexport type EChartsDataFormat = {\n  timeSeries: EChartsTimeSeries[];\n  xAxis: number[];\n  legendItems?: LegendItem[];\n  xAxisMax?: number | string;\n  rangeMs?: number;\n};\n"],"names":["OPTIMIZED_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;AAMjC,0EAA0E;AAC1E,OAAO,MAAMA,2BAA2B,GAAG,IAAI,CAAC"}
+{"version":3,"sources":["../../src/model/graph.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 { TimeSeriesValueTuple } from '@perses-dev/core';\nimport { LineSeriesOption } from 'echarts/charts';\nimport { LegendItem } from '../Legend';\n\n// adjust display when there are many time series to help with performance\nexport const OPTIMIZED_MODE_SERIES_LIMIT = 1000;\n\nexport type UnixTimeMs = number;\n\nexport interface GraphSeries {\n  name: string;\n  values: TimeSeriesValueTuple[];\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: EChartsValues[];\n}\n\nexport type EChartsDataFormat = {\n  timeSeries: EChartsTimeSeries[];\n  xAxis: number[];\n  legendItems?: LegendItem[];\n  xAxisMax?: number | string;\n  rangeMs?: number;\n};\n"],"names":["OPTIMIZED_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;AAMjC,0EAA0E;AAC1E,OAAO,MAAMA,2BAA2B,GAAG,IAAI,CAAC"}

package/dist/model/index.d.ts

@@ -1,5 +1,4 @@
 export * from './graph';
-export * from './legend';
 export * from './theme';
 export * from './units';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/model/index.ts"],"names":[],"mappings":"AAaA,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/model/index.ts"],"names":[],"mappings":"AAaA,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}

package/dist/model/index.js

@@ -11,7 +11,6 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 export * from './graph';
-export * from './legend';
 export * from './theme';
 export * from './units';
 

package/dist/model/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/model/index.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\nexport * from './graph';\nexport * from './legend';\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,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}
+{"version":3,"sources":["../../src/model/index.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\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/theme/component-overrides/paper.d.ts

@@ -0,0 +1,3 @@
+import { Components, Theme } from '@mui/material';
+export declare const MuiPaper: Components<Theme>['MuiPaper'];
+//# sourceMappingURL=paper.d.ts.map

package/dist/theme/component-overrides/paper.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"paper.d.ts","sourceRoot":"","sources":["../../../src/theme/component-overrides/paper.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,UAAU,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAElD,eAAO,MAAM,QAAQ,EAAE,UAAU,CAAC,KAAK,CAAC,CAAC,UAAU,CAMlD,CAAC"}

package/dist/{LegendOptionsEditor/index.js → theme/component-overrides/paper.js}

@@ -10,6 +10,12 @@
 // 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 './LegendOptionsEditor';
+export const MuiPaper = {
+    styleOverrides: {
+        root: ({ theme  })=>({
+                backgroundColor: theme.palette.background.default
+            })
+    }
+};
 
-//# sourceMappingURL=index.js.map
+//# sourceMappingURL=paper.js.map

package/dist/theme/component-overrides/paper.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/theme/component-overrides/paper.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 { Components, Theme } from '@mui/material';\n\nexport const MuiPaper: Components<Theme>['MuiPaper'] = {\n  styleOverrides: {\n    root: ({ theme }) => ({\n      backgroundColor: theme.palette.background.default,\n    }),\n  },\n};\n"],"names":["MuiPaper","styleOverrides","root","theme","backgroundColor","palette","background","default"],"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,QAAQ,GAAkC;IACrDC,cAAc,EAAE;QACdC,IAAI,EAAE,CAAC,EAAEC,KAAK,CAAA,EAAE,GAAM,CAAA;gBACpBC,eAAe,EAAED,KAAK,CAACE,OAAO,CAACC,UAAU,CAACC,OAAO;aAClD,CAAA,AAAC;KACH;CACF,CAAC"}