@perses-dev/components 0.0.0-snapshot-panel-extra-content-3-17f9c42 → 0.0.0-snapshot-scatterplot-fix-imports-95e1b59

package/dist/cjs/DateTimeRangePicker/AbsoluteTimePicker.js

@@ -16,18 +16,20 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "AbsoluteTimePicker", {
     enumerable: true,
-    get: ()=>AbsoluteTimePicker
+    get: function() {
+        return AbsoluteTimePicker;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
+const _jsxruntime = require("react/jsx-runtime");
 const _react = require("react");
 const _material = require("@mui/material");
-const _xDatePickers = require("@mui/x-date-pickers");
-const _adapterDateFns = require("@mui/x-date-pickers/AdapterDateFns");
-const _timeZoneProvider = require("../context/TimeZoneProvider");
+const _xdatepickers = require("@mui/x-date-pickers");
+const _AdapterDateFns = require("@mui/x-date-pickers/AdapterDateFns");
+const _TimeZoneProvider = require("../context/TimeZoneProvider");
 const _utils = require("./utils");
 const DATE_TIME_FORMAT = 'yyyy-MM-dd HH:mm:ss';
-const AbsoluteTimePicker = ({ initialTimeRange , onChange , onCancel  })=>{
-    const { formatWithUserTimeZone  } = (0, _timeZoneProvider.useTimeZone)();
+const AbsoluteTimePicker = ({ initialTimeRange, onChange, onCancel })=>{
+    const { formatWithUserTimeZone } = (0, _TimeZoneProvider.useTimeZone)();
     // Time range values as dates that can be used as a time range.
     const [timeRange, setTimeRange] = (0, _react.useState)(initialTimeRange);
     // Time range values as strings used to populate the text inputs. May not
@@ -82,34 +84,29 @@ const AbsoluteTimePicker = ({ initialTimeRange , onChange , onCancel  })=>{
             onChange(newDates);
         }
     };
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_xDatePickers.LocalizationProvider, {
-        dateAdapter: _adapterDateFns.AdapterDateFns,
-        children: /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_material.Stack, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_xdatepickers.LocalizationProvider, {
+        dateAdapter: _AdapterDateFns.AdapterDateFns,
+        children: /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
             spacing: 2,
             sx: (theme)=>({
                     padding: theme.spacing(1, 0, 2)
                 }),
             children: [
-                showStartCalendar && /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_material.Box, {
+                showStartCalendar && /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Box, {
                     sx: (theme)=>({
                             // TODO: create separate reusable calendar component
-                            '.MuiPickerStaticWrapper-content': {
+                            '.MuiPickersLayout-contentWrapper': {
                                 backgroundColor: theme.palette.background.default
-                            },
-                            // reposition AM and PM buttons
-                            '.MuiIconButton-sizeMedium': {
-                                top: 80,
-                                bottom: 'auto',
-                                margin: theme.spacing(0, 3)
                             }
                         }),
                     children: [
-                        /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Typography, {
+                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Typography, {
                             variant: "h3",
                             padding: 1,
+                            paddingLeft: 2,
                             children: "Select Start Time"
                         }),
-                        /*#__PURE__*/ (0, _jsxRuntime.jsx)(_xDatePickers.StaticDateTimePicker, {
+                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_xdatepickers.StaticDateTimePicker, {
                             displayStaticWrapperAs: "desktop",
                             openTo: "day",
                             disableHighlightToday: true,
@@ -120,32 +117,24 @@ const AbsoluteTimePicker = ({ initialTimeRange , onChange , onCancel  })=>{
                             },
                             onAccept: ()=>{
                                 setShowStartCalendar(false);
-                            },
-                            renderInput: (params)=>/*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.TextField, {
-                                    ...params
-                                })
+                            }
                         })
                     ]
                 }),
-                !showStartCalendar && /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_material.Box, {
+                !showStartCalendar && /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Box, {
                     sx: (theme)=>({
-                            '.MuiPickerStaticWrapper-content': {
+                            '.MuiPickersLayout-contentWrapper': {
                                 backgroundColor: theme.palette.background.default
-                            },
-                            // reposition AM and PM buttons
-                            '.MuiIconButton-sizeMedium': {
-                                top: 80,
-                                bottom: 'auto',
-                                margin: theme.spacing(0, 3)
                             }
                         }),
                     children: [
-                        /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Typography, {
+                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Typography, {
                             variant: "h3",
                             padding: 1,
+                            paddingLeft: 2,
                             children: "Select End Time"
                         }),
-                        /*#__PURE__*/ (0, _jsxRuntime.jsx)(_xDatePickers.StaticDateTimePicker, {
+                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_xdatepickers.StaticDateTimePicker, {
                             displayStaticWrapperAs: "desktop",
                             openTo: "day",
                             disableHighlightToday: true,
@@ -159,21 +148,18 @@ const AbsoluteTimePicker = ({ initialTimeRange , onChange , onCancel  })=>{
                                 if (newValue === null) return;
                                 setShowStartCalendar(true);
                                 onChangeEndTime(newValue);
-                            },
-                            renderInput: (params)=>/*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.TextField, {
-                                    ...params
-                                })
+                            }
                         })
                     ]
                 }),
-                /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_material.Stack, {
+                /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
                     direction: "row",
                     alignItems: "center",
                     gap: 1,
                     pl: 1,
                     pr: 1,
                     children: [
-                        /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.TextField, {
+                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
                             onChange: (event)=>{
                                 // TODO: add helperText, fix validation after we decide on form state solution
                                 onChangeStartTime(event.target.value);
@@ -185,7 +171,7 @@ const AbsoluteTimePicker = ({ initialTimeRange , onChange , onCancel  })=>{
                             // tel used to match MUI DateTimePicker, may change in future: https://github.com/mui/material-ui/issues/27590
                             type: "tel"
                         }),
-                        /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.TextField, {
+                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.TextField, {
                             onChange: (event)=>{
                                 onChangeEndTime(event.target.value);
                             },
@@ -197,20 +183,20 @@ const AbsoluteTimePicker = ({ initialTimeRange , onChange , onCancel  })=>{
                         })
                     ]
                 }),
-                /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_material.Stack, {
+                /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
                     direction: "row",
                     sx: {
                         padding: (theme)=>theme.spacing(0, 1)
                     },
                     gap: 1,
                     children: [
-                        /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Button, {
+                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Button, {
                             variant: "contained",
                             onClick: ()=>onApply(),
                             fullWidth: true,
                             children: "Apply"
                         }),
-                        /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Button, {
+                        /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Button, {
                             variant: "outlined",
                             onClick: ()=>onCancel(),
                             fullWidth: true,

package/dist/cjs/DateTimeRangePicker/DateTimeRangePicker.js

@@ -16,16 +16,18 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "DateTimeRangePicker", {
     enumerable: true,
-    get: ()=>DateTimeRangePicker
+    get: function() {
+        return DateTimeRangePicker;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
+const _jsxruntime = require("react/jsx-runtime");
 const _react = require("react");
 const _material = require("@mui/material");
 const _core = require("@perses-dev/core");
-const _absoluteTimePicker = require("./AbsoluteTimePicker");
-const _timeRangeSelector = require("./TimeRangeSelector");
+const _AbsoluteTimePicker = require("./AbsoluteTimePicker");
+const _TimeRangeSelector = require("./TimeRangeSelector");
 function DateTimeRangePicker(props) {
-    const { value , onChange , timeOptions , height  } = props;
+    const { value, onChange, timeOptions, height } = props;
     const [showCustomDateSelector, setShowCustomDateSelector] = (0, _react.useState)(false);
     const anchorEl = (0, _react.useRef)();
     const convertedTimeRange = (0, _react.useMemo)(()=>{
@@ -33,12 +35,12 @@ function DateTimeRangePicker(props) {
     }, [
         value
     ]);
-    return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_material.Stack, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Stack, {
         direction: "row",
         spacing: 1,
         height: height,
         children: [
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Popover, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Popover, {
                 anchorEl: anchorEl.current,
                 anchorOrigin: {
                     vertical: 'bottom',
@@ -49,7 +51,7 @@ function DateTimeRangePicker(props) {
                 sx: (theme)=>({
                         padding: theme.spacing(2)
                     }),
-                children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_absoluteTimePicker.AbsoluteTimePicker, {
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_AbsoluteTimePicker.AbsoluteTimePicker, {
                     initialTimeRange: convertedTimeRange,
                     onChange: (value)=>{
                         onChange(value);
@@ -58,11 +60,11 @@ function DateTimeRangePicker(props) {
                     onCancel: ()=>setShowCustomDateSelector(false)
                 })
             }),
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.FormControl, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.FormControl, {
                 fullWidth: true,
-                children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Box, {
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Box, {
                     ref: anchorEl,
-                    children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_timeRangeSelector.TimeRangeSelector, {
+                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_TimeRangeSelector.TimeRangeSelector, {
                         timeOptions: timeOptions,
                         value: value,
                         height: height,

package/dist/cjs/DateTimeRangePicker/TimeRangeSelector.js

@@ -16,28 +16,30 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "TimeRangeSelector", {
     enumerable: true,
-    get: ()=>TimeRangeSelector
+    get: function() {
+        return TimeRangeSelector;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
+const _jsxruntime = require("react/jsx-runtime");
 const _material = require("@mui/material");
-const _calendar = /*#__PURE__*/ _interopRequireDefault(require("mdi-material-ui/Calendar"));
+const _Calendar = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/Calendar"));
 const _core = require("@perses-dev/core");
-const _timeZoneProvider = require("../context/TimeZoneProvider");
+const _TimeZoneProvider = require("../context/TimeZoneProvider");
 const _utils = require("./utils");
-function _interopRequireDefault(obj) {
+function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
 }
 const DATE_TIME_FORMAT = 'yyyy-MM-dd HH:mm:ss';
 function TimeRangeSelector(props) {
-    const { value , timeOptions , onSelectChange , onCustomClick , height  } = props;
-    const { timeZone  } = (0, _timeZoneProvider.useTimeZone)();
+    const { value, timeOptions, onSelectChange, onCustomClick, height } = props;
+    const { timeZone } = (0, _TimeZoneProvider.useTimeZone)();
     const formattedValue = !(0, _core.isRelativeTimeRange)(value) ? (0, _utils.formatAbsoluteRange)(value, DATE_TIME_FORMAT, timeZone) : value.pastDuration;
-    return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_material.Select, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Select, {
         value: formattedValue,
         onChange: onSelectChange,
-        IconComponent: _calendar.default,
+        IconComponent: _Calendar.default,
         inputProps: {
             'aria-label': `Select time range. Currently set to ${formattedValue}`
         },
@@ -57,16 +59,16 @@ function TimeRangeSelector(props) {
             } : {}
         },
         children: [
-            timeOptions.map((item, idx)=>/*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.MenuItem, {
+            timeOptions.map((item, idx)=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.MenuItem, {
                     value: item.value.pastDuration,
                     children: item.display
                 }, idx)),
-            (0, _core.isRelativeTimeRange)(value) ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.MenuItem, {
+            (0, _core.isRelativeTimeRange)(value) ? /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.MenuItem, {
                 onClick: ()=>{
                     onCustomClick();
                 },
                 children: "Custom time range"
-            }) : /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.MenuItem, {
+            }) : /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.MenuItem, {
                 value: formattedValue,
                 onClick: ()=>{
                     onCustomClick();

package/dist/cjs/DateTimeRangePicker/index.js

@@ -14,17 +14,19 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-_exportStar(require("./DateTimeRangePicker"), exports);
-_exportStar(require("./TimeRangeSelector"), exports);
-_exportStar(require("./AbsoluteTimePicker"), exports);
-function _exportStar(from, to) {
+_export_star(require("./DateTimeRangePicker"), exports);
+_export_star(require("./TimeRangeSelector"), exports);
+_export_star(require("./AbsoluteTimePicker"), exports);
+function _export_star(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];
-            }
-        });
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
     });
     return from;
 }

package/dist/cjs/DateTimeRangePicker/utils.js

@@ -21,18 +21,22 @@ function _export(target, all) {
     });
 }
 _export(exports, {
-    validateDateRange: ()=>validateDateRange,
-    formatAbsoluteRange: ()=>formatAbsoluteRange
+    formatAbsoluteRange: function() {
+        return formatAbsoluteRange;
+    },
+    validateDateRange: function() {
+        return validateDateRange;
+    }
 });
-const _dateFns = require("date-fns");
+const _datefns = require("date-fns");
 const _utils = require("../utils");
 function validateDateRange(startDate, endDate) {
     // TODO: display error as helperText
-    if (!(0, _dateFns.isValid)(startDate) || !(0, _dateFns.isValid)(endDate)) {
+    if (!(0, _datefns.isValid)(startDate) || !(0, _datefns.isValid)(endDate)) {
         console.error('Invalid Date');
         return false;
     }
-    if (!(0, _dateFns.isBefore)(startDate, endDate)) {
+    if (!(0, _datefns.isBefore)(startDate, endDate)) {
         console.error('End Time is before Start Time');
         return false;
     }

package/dist/cjs/Dialog/Dialog.js

@@ -16,35 +16,37 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "Dialog", {
     enumerable: true,
-    get: ()=>Dialog
+    get: function() {
+        return Dialog;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
-const _react = /*#__PURE__*/ _interopRequireDefault(require("react"));
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_default(require("react"));
 const _material = require("@mui/material");
-const _close = /*#__PURE__*/ _interopRequireDefault(require("mdi-material-ui/Close"));
+const _Close = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/Close"));
 const _utils = require("../utils");
-function _interopRequireDefault(obj) {
+function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
 }
-const Header = ({ children , onClose , ...props })=>{
-    return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+const Header = ({ children, onClose, ...props })=>{
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.DialogTitle, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.DialogTitle, {
                 ...props,
                 children: children
             }),
-            onClose && /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.IconButton, {
+            onClose && /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.IconButton, {
                 "aria-label": "Close",
                 onClick: onClose,
                 sx: dialogCloseIconButtonStyle,
-                children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_close.default, {})
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Close.default, {})
             })
         ]
     });
 };
-const Content = ({ children , width =500 , sx , ...props })=>/*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.DialogContent, {
+const Content = ({ children, width = 500, sx, ...props })=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.DialogContent, {
         dividers: true,
         ...props,
         sx: (0, _utils.combineSx)({
@@ -52,13 +54,13 @@ const Content = ({ children , width =500 , sx , ...props })=>/*#__PURE__*/ (0, _
         }, sx),
         children: children
     });
-const PrimaryButton = ({ children , ...props })=>/*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Button, {
+const PrimaryButton = ({ children, ...props })=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Button, {
         variant: "contained",
         type: "submit",
         ...props,
         children: children
     });
-const SecondaryButton = ({ children , ...props })=>/*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Button, {
+const SecondaryButton = ({ children, ...props })=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Button, {
         variant: "outlined",
         color: "secondary",
         ...props,
@@ -84,7 +86,7 @@ const SecondaryButton = ({ children , ...props })=>/*#__PURE__*/ (0, _jsxRuntime
         right: theme.spacing(0.5)
     };
 };
-const Dialog = ({ children , ...props })=>/*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Dialog, {
+const Dialog = ({ children, ...props })=>/*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Dialog, {
         ...props,
         children: children
     });

package/dist/cjs/Dialog/DiscardChangesConfirmationDialog.js

@@ -16,31 +16,33 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "DiscardChangesConfirmationDialog", {
     enumerable: true,
-    get: ()=>DiscardChangesConfirmationDialog
+    get: function() {
+        return DiscardChangesConfirmationDialog;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
+const _jsxruntime = require("react/jsx-runtime");
 const _material = require("@mui/material");
-const _dialog = require("./Dialog");
+const _Dialog = require("./Dialog");
 const DiscardChangesConfirmationDialog = (props)=>{
-    const { description , isOpen , onCancel , onDiscardChanges  } = props;
-    return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_dialog.Dialog, {
+    const { description, isOpen, onCancel, onDiscardChanges } = props;
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_Dialog.Dialog, {
         open: isOpen,
         "aria-labelledby": "discard-dialog",
         children: [
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_dialog.Dialog.Header, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_Dialog.Dialog.Header, {
                 children: "Discard Changes"
             }),
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_dialog.Dialog.Content, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_Dialog.Dialog.Content, {
                 children: description
             }),
-            /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_dialog.Dialog.Actions, {
+            /*#__PURE__*/ (0, _jsxruntime.jsxs)(_Dialog.Dialog.Actions, {
                 children: [
-                    /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Button, {
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Button, {
                         variant: "contained",
                         onClick: onDiscardChanges,
                         children: "Discard Changes"
                     }),
-                    /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Button, {
+                    /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Button, {
                         variant: "outlined",
                         color: "secondary",
                         onClick: onCancel,

package/dist/cjs/Dialog/index.js

@@ -14,16 +14,18 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-_exportStar(require("./Dialog"), exports);
-_exportStar(require("./DiscardChangesConfirmationDialog"), exports);
-function _exportStar(from, to) {
+_export_star(require("./Dialog"), exports);
+_export_star(require("./DiscardChangesConfirmationDialog"), exports);
+function _export_star(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];
-            }
-        });
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
     });
     return from;
 }

package/dist/cjs/Drawer/Drawer.js

@@ -16,14 +16,17 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "Drawer", {
     enumerable: true,
-    get: ()=>Drawer
+    get: function() {
+        return Drawer;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
+const _jsxruntime = require("react/jsx-runtime");
 const _material = require("@mui/material");
 const _utils = require("../utils");
 const DRAWER_DEFAULT_WIDTH = 1080;
-const Drawer = ({ anchor ='right' , isOpen , onClose , PaperProps , children , ...rest })=>{
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Drawer, {
+const Drawer = ({ anchor = 'right', isOpen, onClose, PaperProps, children, ...rest })=>{
+    const isSmaller = (0, _material.useMediaQuery)(`(max-width:${DRAWER_DEFAULT_WIDTH}px)`);
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Drawer, {
         ...rest,
         open: isOpen,
         onClose: onClose,
@@ -31,7 +34,7 @@ const Drawer = ({ anchor ='right' , isOpen , onClose , PaperProps , children , .
         PaperProps: {
             ...PaperProps,
             sx: (0, _utils.combineSx)({
-                width: `${DRAWER_DEFAULT_WIDTH}px`,
+                width: isSmaller ? '100%' : `${DRAWER_DEFAULT_WIDTH}px`,
                 overflow: 'hidden'
             }, PaperProps === null || PaperProps === void 0 ? void 0 : PaperProps.sx)
         },

package/dist/cjs/Drawer/index.js

@@ -14,15 +14,17 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-_exportStar(require("./Drawer"), exports);
-function _exportStar(from, to) {
+_export_star(require("./Drawer"), exports);
+function _export_star(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];
-            }
-        });
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
     });
     return from;
 }

package/dist/cjs/EChart/EChart.js

@@ -16,15 +16,17 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "EChart", {
     enumerable: true,
-    get: ()=>EChart
+    get: function() {
+        return EChart;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _jsxruntime = require("react/jsx-runtime");
+const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
 const _core = require("echarts/core");
 const _material = require("@mui/material");
-const _isEqual = /*#__PURE__*/ _interopRequireDefault(require("lodash/isEqual"));
-const _debounce = /*#__PURE__*/ _interopRequireDefault(require("lodash/debounce"));
-function _interopRequireDefault(obj) {
+const _isEqual = /*#__PURE__*/ _interop_require_default(require("lodash/isEqual"));
+const _debounce = /*#__PURE__*/ _interop_require_default(require("lodash/debounce"));
+function _interop_require_default(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
@@ -37,7 +39,7 @@ function _getRequireWildcardCache(nodeInterop) {
         return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
     })(nodeInterop);
 }
-function _interopRequireWildcard(obj, nodeInterop) {
+function _interop_require_wildcard(obj, nodeInterop) {
     if (!nodeInterop && obj && obj.__esModule) {
         return obj;
     }
@@ -50,7 +52,9 @@ function _interopRequireWildcard(obj, nodeInterop) {
     if (cache && cache.has(obj)) {
         return cache.get(obj);
     }
-    var newObj = {};
+    var newObj = {
+        __proto__: null
+    };
     var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
     for(var key in obj){
         if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
@@ -84,7 +88,7 @@ const batchEvents = [
     'downplay',
     'highlight'
 ];
-const EChart = /*#__PURE__*/ _react.default.memo(function EChart({ option , theme , renderer , sx , onEvents , _instance , syncGroup , onChartInitialized  }) {
+const EChart = /*#__PURE__*/ _react.default.memo(function EChart({ option, theme, renderer, sx, onEvents, _instance, syncGroup, onChartInitialized }) {
     const initialOption = (0, _react.useRef)(option);
     const prevOption = (0, _react.useRef)(option);
     const containerRef = (0, _react.useRef)(null);
@@ -176,7 +180,7 @@ const EChart = /*#__PURE__*/ _react.default.memo(function EChart({ option , them
     }, [
         sx
     ]);
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Box, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Box, {
         ref: containerRef,
         sx: sx
     });
@@ -197,8 +201,8 @@ function bindEvents(instance, events) {
     }
     for(const eventName in events){
         if (Object.prototype.hasOwnProperty.call(events, eventName)) {
-            var _eventName;
-            const customEvent = (_eventName = events[eventName]) !== null && _eventName !== void 0 ? _eventName : null;
+            var _events_eventName;
+            const customEvent = (_events_eventName = events[eventName]) !== null && _events_eventName !== void 0 ? _events_eventName : null;
             if (customEvent) {
                 bindEvent(eventName, customEvent);
             }