@perses-dev/dashboards 0.19.0 → 0.21.0

package/dist/cjs/context/DashboardProvider/dashboard-provider-api.js

@@ -33,7 +33,8 @@ _export(exports, {
     usePanelActions: ()=>usePanelActions,
     usePanelEditor: ()=>usePanelEditor,
     useDeletePanelDialog: ()=>useDeletePanelDialog,
-    useDefaultTimeRange: ()=>useDefaultTimeRange
+    useDefaultTimeRange: ()=>useDefaultTimeRange,
+    useDiscardChangesConfirmationDialog: ()=>useDiscardChangesConfirmationDialog
 });
 const _react = require("react");
 const _dashboardProvider = require("./DashboardProvider");
@@ -189,3 +190,11 @@ const selectDefaultTimeRange = (state)=>state.defaultTimeRange;
 function useDefaultTimeRange() {
     return (0, _dashboardProvider.useDashboardStore)(selectDefaultTimeRange);
 }
+const selectDiscardChangesConfirmationDialog = ({ discardChangesConfirmationDialog , openDiscardChangesConfirmationDialog , closeDiscardChangesConfirmationDialog  })=>({
+        discardChangesConfirmationDialog,
+        openDiscardChangesConfirmationDialog,
+        closeDiscardChangesConfirmationDialog
+    });
+function useDiscardChangesConfirmationDialog() {
+    return (0, _dashboardProvider.useDashboardStore)(selectDiscardChangesConfirmationDialog);
+}

package/dist/cjs/context/DashboardProvider/discard-changes-dialog-slice.js

@@ -0,0 +1,33 @@
+// 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.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "createDiscardChangesDialogSlice", {
+    enumerable: true,
+    get: ()=>createDiscardChangesDialogSlice
+});
+const createDiscardChangesDialogSlice = (set)=>({
+        isOpen: false,
+        openDiscardChangesConfirmationDialog (dialog) {
+            set((state)=>{
+                state.discardChangesConfirmationDialog = dialog;
+            });
+        },
+        closeDiscardChangesConfirmationDialog () {
+            set((state)=>{
+                state.discardChangesConfirmationDialog = undefined;
+            });
+        }
+    });

package/dist/cjs/views/ViewDashboard/DashboardApp.js

@@ -25,22 +25,18 @@ const _components = require("@perses-dev/components");
 const _components1 = require("../../components");
 const _context = require("../../context");
 const DashboardApp = (props)=>{
-    const { dashboardResource , dashboardTitleComponent , initialVariableIsSticky , isReadonly  } = props;
+    const { dashboardResource , dashboardTitleComponent , onSave , initialVariableIsSticky , isReadonly  } = props;
     const { setEditMode  } = (0, _context.useEditMode)();
     const { dashboard , setDashboard  } = (0, _context.useDashboard)();
     const [originalDashboard, setOriginalDashboard] = (0, _react.useState)(undefined);
-    const [isUnsavedDashboardDialogOpen, setUnsavedDashboardDialogIsOpen] = (0, _react.useState)(false);
-    const saveDashboard = async ()=>{
-        setEditMode(false);
-        setUnsavedDashboardDialogIsOpen(false);
-    };
-    const cancelDashboard = ()=>{
+    const { openDiscardChangesConfirmationDialog , closeDiscardChangesConfirmationDialog  } = (0, _context.useDiscardChangesConfirmationDialog)();
+    const handleDiscardChanges = ()=>{
         // Reset to the original spec and exit edit mode
         if (originalDashboard) {
             setDashboard(originalDashboard);
         }
-        setUnsavedDashboardDialogIsOpen(false);
         setEditMode(false);
+        closeDiscardChangesConfirmationDialog();
     };
     const onEditButtonClick = ()=>{
         setEditMode(true);
@@ -51,7 +47,14 @@ const DashboardApp = (props)=>{
         if (JSON.stringify(dashboard) === JSON.stringify(originalDashboard)) {
             setEditMode(false);
         } else {
-            setUnsavedDashboardDialogIsOpen(true);
+            openDiscardChangesConfirmationDialog({
+                onDiscardChanges: ()=>{
+                    handleDiscardChanges();
+                },
+                onCancel: ()=>{
+                    closeDiscardChangesConfirmationDialog();
+                }
+            });
         }
     };
     return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_material.Box, {
@@ -67,6 +70,7 @@ const DashboardApp = (props)=>{
                 dashboardName: dashboardResource.metadata.name,
                 dashboardTitleComponent: dashboardTitleComponent,
                 initialVariableIsSticky: initialVariableIsSticky,
+                onSave: onSave,
                 isReadonly: isReadonly,
                 onEditButtonClick: onEditButtonClick,
                 onCancelButtonClick: onCancelButtonClick
@@ -84,11 +88,7 @@ const DashboardApp = (props)=>{
                     /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components1.PanelGroupDialog, {}),
                     /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components1.DeletePanelGroupDialog, {}),
                     /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components1.DeletePanelDialog, {}),
-                    /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components1.UnsavedChangesConfirmationDialog, {
-                        isOpen: isUnsavedDashboardDialogOpen,
-                        onSave: saveDashboard,
-                        onClose: cancelDashboard
-                    })
+                    /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components1.DiscardChangesConfirmationDialog, {})
                 ]
             })
         ]

package/dist/cjs/views/ViewDashboard/ViewDashboard.js

@@ -25,7 +25,7 @@ const _pluginSystem = require("@perses-dev/plugin-system");
 const _context = require("../../context");
 const _dashboardApp = require("./DashboardApp");
 function ViewDashboard(props) {
-    const { dashboardResource , datasourceApi , dashboardTitleComponent , initialVariableIsSticky , isReadonly , sx , ...others } = props;
+    const { dashboardResource , datasourceApi , dashboardTitleComponent , onSave , initialVariableIsSticky , isReadonly , sx , ...others } = props;
     const { spec  } = dashboardResource;
     var _duration;
     const dashboardDuration = (_duration = spec.duration) !== null && _duration !== void 0 ? _duration : '1h';
@@ -56,6 +56,7 @@ function ViewDashboard(props) {
                             children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_dashboardApp.DashboardApp, {
                                 dashboardResource: dashboardResource,
                                 dashboardTitleComponent: dashboardTitleComponent,
+                                onSave: onSave,
                                 initialVariableIsSticky: initialVariableIsSticky,
                                 isReadonly: isReadonly
                             })

package/dist/components/DashboardToolbar/DashboardToolbar.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
+import { DashboardResource } from '@perses-dev/core';
 export interface DashboardToolbarProps {
     dashboardName: string;
     dashboardTitleComponent?: JSX.Element;
@@ -6,6 +7,7 @@ export interface DashboardToolbarProps {
     isReadonly: boolean;
     onEditButtonClick: () => void;
     onCancelButtonClick: () => void;
+    onSave?: (entity: DashboardResource) => Promise<DashboardResource>;
 }
 export declare const DashboardToolbar: (props: DashboardToolbarProps) => JSX.Element;
 //# sourceMappingURL=DashboardToolbar.d.ts.map

package/dist/components/DashboardToolbar/DashboardToolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardToolbar.d.ts","sourceRoot":"","sources":["../../../src/components/DashboardToolbar/DashboardToolbar.tsx"],"names":[],"mappings":";AAuBA,MAAM,WAAW,qBAAqB;IACpC,aAAa,EAAE,MAAM,CAAC;IACtB,uBAAuB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACtC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,UAAU,EAAE,OAAO,CAAC;IACpB,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,mBAAmB,EAAE,MAAM,IAAI,CAAC;CACjC;AAED,eAAO,MAAM,gBAAgB,UAAW,qBAAqB,gBA0G5D,CAAC"}
+{"version":3,"file":"DashboardToolbar.d.ts","sourceRoot":"","sources":["../../../src/components/DashboardToolbar/DashboardToolbar.tsx"],"names":[],"mappings":";AAkBA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAOrD,MAAM,WAAW,qBAAqB;IACpC,aAAa,EAAE,MAAM,CAAC;IACtB,uBAAuB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACtC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,UAAU,EAAE,OAAO,CAAC;IACpB,iBAAiB,EAAE,MAAM,IAAI,CAAC;IAC9B,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,MAAM,CAAC,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,OAAO,CAAC,iBAAiB,CAAC,CAAC;CACpE;AAED,eAAO,MAAM,gBAAgB,UAAW,qBAAqB,gBAyH5D,CAAC"}

package/dist/components/DashboardToolbar/DashboardToolbar.js

@@ -16,21 +16,34 @@ import PencilIcon from 'mdi-material-ui/PencilOutline';
 import AddPanelGroupIcon from 'mdi-material-ui/PlusBoxOutline';
 import AddPanelIcon from 'mdi-material-ui/ChartBoxPlusOutline';
 import { ErrorBoundary, ErrorAlert } from '@perses-dev/components';
-import { useDashboardActions, useEditMode } from '../../context';
+import { useState } from 'react';
+import { useDashboard, useDashboardActions, useEditMode } from '../../context';
 import { TemplateVariableList } from '../Variables';
 import { TimeRangeControls } from '../TimeRangeControls';
 import { DownloadButton } from '../DownloadButton';
 export const DashboardToolbar = (props)=>{
-    const { dashboardName , dashboardTitleComponent , initialVariableIsSticky , isReadonly , onEditButtonClick , onCancelButtonClick ,  } = props;
+    const { dashboardName , dashboardTitleComponent , initialVariableIsSticky , isReadonly , onEditButtonClick , onCancelButtonClick , onSave ,  } = props;
     const { isEditMode , setEditMode  } = useEditMode();
+    const [isSavingDashboard, setSavingDashboard] = useState(false);
+    const dashboard = useDashboard();
     const { openAddPanelGroup , openAddPanel  } = useDashboardActions();
     const isLaptopSize = useMediaQuery(useTheme().breakpoints.up('sm'));
     const dashboardTitle = dashboardTitleComponent ? dashboardTitleComponent : /*#__PURE__*/ _jsx(Typography, {
         variant: "h2",
         children: dashboardName
     });
-    const onSave = ()=>{
-        setEditMode(false);
+    const onSaveButtonClick = ()=>{
+        if (onSave !== undefined) {
+            setSavingDashboard(true);
+            onSave(dashboard.dashboard).then(()=>{
+                setSavingDashboard(false);
+                setEditMode(false);
+            }).catch(()=>{
+                setSavingDashboard(false);
+            });
+        } else {
+            setEditMode(false);
+        }
     };
     return /*#__PURE__*/ _jsx(_Fragment, {
         children: isEditMode ? /*#__PURE__*/ _jsxs(Stack, {
@@ -59,8 +72,8 @@ export const DashboardToolbar = (props)=>{
                                 }),
                                 /*#__PURE__*/ _jsx(Button, {
                                     variant: "contained",
-                                    onClick: onSave,
-                                    disabled: isReadonly,
+                                    onClick: onSaveButtonClick,
+                                    disabled: isReadonly || isSavingDashboard,
                                     children: "Save"
                                 }),
                                 /*#__PURE__*/ _jsx(Button, {

package/dist/components/DashboardToolbar/DashboardToolbar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/DashboardToolbar/DashboardToolbar.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 { Typography, Stack, Button, Box, useTheme, useMediaQuery, Alert } from '@mui/material';\nimport PencilIcon from 'mdi-material-ui/PencilOutline';\nimport AddPanelGroupIcon from 'mdi-material-ui/PlusBoxOutline';\nimport AddPanelIcon from 'mdi-material-ui/ChartBoxPlusOutline';\nimport { ErrorBoundary, ErrorAlert } from '@perses-dev/components';\nimport { useDashboardActions, useEditMode } from '../../context';\nimport { TemplateVariableList } from '../Variables';\nimport { TimeRangeControls } from '../TimeRangeControls';\nimport { DownloadButton } from '../DownloadButton';\n\nexport interface DashboardToolbarProps {\n  dashboardName: string;\n  dashboardTitleComponent?: JSX.Element;\n  initialVariableIsSticky?: boolean;\n  isReadonly: boolean;\n  onEditButtonClick: () => void;\n  onCancelButtonClick: () => void;\n}\n\nexport const DashboardToolbar = (props: DashboardToolbarProps) => {\n  const {\n    dashboardName,\n    dashboardTitleComponent,\n    initialVariableIsSticky,\n    isReadonly,\n    onEditButtonClick,\n    onCancelButtonClick,\n  } = props;\n\n  const { isEditMode, setEditMode } = useEditMode();\n  const { openAddPanelGroup, openAddPanel } = useDashboardActions();\n  const isLaptopSize = useMediaQuery(useTheme().breakpoints.up('sm'));\n  const dashboardTitle = dashboardTitleComponent ? (\n    dashboardTitleComponent\n  ) : (\n    <Typography variant=\"h2\">{dashboardName}</Typography>\n  );\n\n  const onSave = () => {\n    setEditMode(false);\n  };\n\n  return (\n    <>\n      {isEditMode ? (\n        <Stack spacing={1}>\n          <Box p={2} display=\"flex\" sx={{ backgroundColor: (theme) => theme.palette.primary.main + '30' }}>\n            {dashboardTitle}\n            <Stack direction=\"row\" spacing={1} marginLeft=\"auto\">\n              {isReadonly && (\n                <Alert severity={'warning'} sx={{ backgroundColor: 'transparent', padding: 0 }}>\n                  Dashboard managed via code only. Download JSON and commit changes to save.\n                </Alert>\n              )}\n              <Button variant=\"contained\" onClick={onSave} disabled={isReadonly}>\n                Save\n              </Button>\n              <Button variant=\"outlined\" onClick={onCancelButtonClick}>\n                Cancel\n              </Button>\n            </Stack>\n          </Box>\n          <Box\n            sx={{\n              display: 'flex',\n              width: '100%',\n              alignItems: 'flex-start',\n              padding: (theme) => theme.spacing(0, 2, 2, 2),\n            }}\n          >\n            <ErrorBoundary FallbackComponent={ErrorAlert}>\n              <TemplateVariableList\n                initialVariableIsSticky={initialVariableIsSticky}\n                sx={{\n                  backgroundColor: ({ palette }) =>\n                    palette.mode === 'dark' ? palette.background.default : palette.background.paper,\n                }}\n              />\n            </ErrorBoundary>\n            <Stack direction=\"row\" spacing={1} marginLeft=\"auto\" sx={{ whiteSpace: 'nowrap' }}>\n              <Button startIcon={<AddPanelGroupIcon />} onClick={openAddPanelGroup}>\n                Add Panel Group\n              </Button>\n              <Button startIcon={<AddPanelIcon />} onClick={openAddPanel}>\n                Add Panel\n              </Button>\n              <TimeRangeControls />\n              <DownloadButton />\n            </Stack>\n          </Box>\n        </Stack>\n      ) : (\n        <Stack spacing={1} padding={2}>\n          <Box sx={{ display: 'flex', width: '100%' }}>\n            {dashboardTitle}\n            <Stack direction=\"row\" spacing={1} marginLeft=\"auto\">\n              <TimeRangeControls />\n              <DownloadButton />\n              {isLaptopSize && (\n                <Button\n                  variant=\"outlined\"\n                  startIcon={<PencilIcon />}\n                  onClick={onEditButtonClick}\n                  sx={{ marginLeft: 'auto' }}\n                >\n                  Edit\n                </Button>\n              )}\n            </Stack>\n          </Box>\n          <Box paddingY={2}>\n            <ErrorBoundary FallbackComponent={ErrorAlert}>\n              <TemplateVariableList\n                initialVariableIsSticky={initialVariableIsSticky}\n                sx={{\n                  backgroundColor: ({ palette }) =>\n                    palette.mode === 'dark' ? palette.background.default : palette.background.paper,\n                }}\n              />\n            </ErrorBoundary>\n          </Box>\n        </Stack>\n      )}\n    </>\n  );\n};\n"],"names":["Typography","Stack","Button","Box","useTheme","useMediaQuery","Alert","PencilIcon","AddPanelGroupIcon","AddPanelIcon","ErrorBoundary","ErrorAlert","useDashboardActions","useEditMode","TemplateVariableList","TimeRangeControls","DownloadButton","DashboardToolbar","props","dashboardName","dashboardTitleComponent","initialVariableIsSticky","isReadonly","onEditButtonClick","onCancelButtonClick","isEditMode","setEditMode","openAddPanelGroup","openAddPanel","isLaptopSize","breakpoints","up","dashboardTitle","variant","onSave","spacing","p","display","sx","backgroundColor","theme","palette","primary","main","direction","marginLeft","severity","padding","onClick","disabled","width","alignItems","FallbackComponent","mode","background","default","paper","whiteSpace","startIcon","paddingY"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/DashboardToolbar/DashboardToolbar.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 { Typography, Stack, Button, Box, useTheme, useMediaQuery, Alert } from '@mui/material';\nimport PencilIcon from 'mdi-material-ui/PencilOutline';\nimport AddPanelGroupIcon from 'mdi-material-ui/PlusBoxOutline';\nimport AddPanelIcon from 'mdi-material-ui/ChartBoxPlusOutline';\nimport { ErrorBoundary, ErrorAlert } from '@perses-dev/components';\nimport { DashboardResource } from '@perses-dev/core';\nimport { useState } from 'react';\nimport { useDashboard, useDashboardActions, useEditMode } from '../../context';\nimport { TemplateVariableList } from '../Variables';\nimport { TimeRangeControls } from '../TimeRangeControls';\nimport { DownloadButton } from '../DownloadButton';\n\nexport interface DashboardToolbarProps {\n  dashboardName: string;\n  dashboardTitleComponent?: JSX.Element;\n  initialVariableIsSticky?: boolean;\n  isReadonly: boolean;\n  onEditButtonClick: () => void;\n  onCancelButtonClick: () => void;\n  onSave?: (entity: DashboardResource) => Promise<DashboardResource>;\n}\n\nexport const DashboardToolbar = (props: DashboardToolbarProps) => {\n  const {\n    dashboardName,\n    dashboardTitleComponent,\n    initialVariableIsSticky,\n    isReadonly,\n    onEditButtonClick,\n    onCancelButtonClick,\n    onSave,\n  } = props;\n\n  const { isEditMode, setEditMode } = useEditMode();\n  const [isSavingDashboard, setSavingDashboard] = useState<boolean>(false);\n  const dashboard = useDashboard();\n  const { openAddPanelGroup, openAddPanel } = useDashboardActions();\n  const isLaptopSize = useMediaQuery(useTheme().breakpoints.up('sm'));\n  const dashboardTitle = dashboardTitleComponent ? (\n    dashboardTitleComponent\n  ) : (\n    <Typography variant=\"h2\">{dashboardName}</Typography>\n  );\n\n  const onSaveButtonClick = () => {\n    if (onSave !== undefined) {\n      setSavingDashboard(true);\n      onSave(dashboard.dashboard)\n        .then(() => {\n          setSavingDashboard(false);\n          setEditMode(false);\n        })\n        .catch(() => {\n          setSavingDashboard(false);\n        });\n    } else {\n      setEditMode(false);\n    }\n  };\n\n  return (\n    <>\n      {isEditMode ? (\n        <Stack spacing={1}>\n          <Box p={2} display=\"flex\" sx={{ backgroundColor: (theme) => theme.palette.primary.main + '30' }}>\n            {dashboardTitle}\n            <Stack direction=\"row\" spacing={1} marginLeft=\"auto\">\n              {isReadonly && (\n                <Alert severity={'warning'} sx={{ backgroundColor: 'transparent', padding: 0 }}>\n                  Dashboard managed via code only. Download JSON and commit changes to save.\n                </Alert>\n              )}\n              <Button variant=\"contained\" onClick={onSaveButtonClick} disabled={isReadonly || isSavingDashboard}>\n                Save\n              </Button>\n              <Button variant=\"outlined\" onClick={onCancelButtonClick}>\n                Cancel\n              </Button>\n            </Stack>\n          </Box>\n          <Box\n            sx={{\n              display: 'flex',\n              width: '100%',\n              alignItems: 'flex-start',\n              padding: (theme) => theme.spacing(0, 2, 2, 2),\n            }}\n          >\n            <ErrorBoundary FallbackComponent={ErrorAlert}>\n              <TemplateVariableList\n                initialVariableIsSticky={initialVariableIsSticky}\n                sx={{\n                  backgroundColor: ({ palette }) =>\n                    palette.mode === 'dark' ? palette.background.default : palette.background.paper,\n                }}\n              />\n            </ErrorBoundary>\n            <Stack direction=\"row\" spacing={1} marginLeft=\"auto\" sx={{ whiteSpace: 'nowrap' }}>\n              <Button startIcon={<AddPanelGroupIcon />} onClick={openAddPanelGroup}>\n                Add Panel Group\n              </Button>\n              <Button startIcon={<AddPanelIcon />} onClick={openAddPanel}>\n                Add Panel\n              </Button>\n              <TimeRangeControls />\n              <DownloadButton />\n            </Stack>\n          </Box>\n        </Stack>\n      ) : (\n        <Stack spacing={1} padding={2}>\n          <Box sx={{ display: 'flex', width: '100%' }}>\n            {dashboardTitle}\n            <Stack direction=\"row\" spacing={1} marginLeft=\"auto\">\n              <TimeRangeControls />\n              <DownloadButton />\n              {isLaptopSize && (\n                <Button\n                  variant=\"outlined\"\n                  startIcon={<PencilIcon />}\n                  onClick={onEditButtonClick}\n                  sx={{ marginLeft: 'auto' }}\n                >\n                  Edit\n                </Button>\n              )}\n            </Stack>\n          </Box>\n          <Box paddingY={2}>\n            <ErrorBoundary FallbackComponent={ErrorAlert}>\n              <TemplateVariableList\n                initialVariableIsSticky={initialVariableIsSticky}\n                sx={{\n                  backgroundColor: ({ palette }) =>\n                    palette.mode === 'dark' ? palette.background.default : palette.background.paper,\n                }}\n              />\n            </ErrorBoundary>\n          </Box>\n        </Stack>\n      )}\n    </>\n  );\n};\n"],"names":["Typography","Stack","Button","Box","useTheme","useMediaQuery","Alert","PencilIcon","AddPanelGroupIcon","AddPanelIcon","ErrorBoundary","ErrorAlert","useState","useDashboard","useDashboardActions","useEditMode","TemplateVariableList","TimeRangeControls","DownloadButton","DashboardToolbar","props","dashboardName","dashboardTitleComponent","initialVariableIsSticky","isReadonly","onEditButtonClick","onCancelButtonClick","onSave","isEditMode","setEditMode","isSavingDashboard","setSavingDashboard","dashboard","openAddPanelGroup","openAddPanel","isLaptopSize","breakpoints","up","dashboardTitle","variant","onSaveButtonClick","undefined","then","catch","spacing","p","display","sx","backgroundColor","theme","palette","primary","main","direction","marginLeft","severity","padding","onClick","disabled","width","alignItems","FallbackComponent","mode","background","default","paper","whiteSpace","startIcon","paddingY"],"mappings":"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"}

package/dist/components/DeletePanelDialog/DeletePanelDialog.js

@@ -50,6 +50,7 @@ const DeletePanelForm = ({ deletePanelDialog  })=>{
         onSubmit: handleDelete,
         children: [
             /*#__PURE__*/ _jsxs(DialogContent, {
+                dividers: true,
                 sx: {
                     width: '500px'
                 },
@@ -69,6 +70,7 @@ const DeletePanelForm = ({ deletePanelDialog  })=>{
                         children: "Delete"
                     }),
                     /*#__PURE__*/ _jsx(Button, {
+                        variant: "outlined",
                         onClick: ()=>closeDeletePanelDialog(),
                         children: "Cancel"
                     })

package/dist/components/DeletePanelDialog/DeletePanelDialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/DeletePanelDialog/DeletePanelDialog.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 { FormEvent } from 'react';\nimport { IconButton, Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@mui/material';\nimport CloseIcon from 'mdi-material-ui/Close';\nimport { useDeletePanelDialog, DeletePanelDialogState } from '../../context';\n\nexport const DeletePanelDialog = () => {\n  const { deletePanelDialog, closeDeletePanelDialog } = useDeletePanelDialog();\n\n  return (\n    <Dialog open={deletePanelDialog !== undefined}>\n      <DialogTitle>Delete Panel</DialogTitle>\n      <IconButton\n        aria-label=\"Close\"\n        onClick={() => closeDeletePanelDialog()}\n        sx={(theme) => ({\n          position: 'absolute',\n          top: theme.spacing(0.5),\n          right: theme.spacing(0.5),\n        })}\n      >\n        <CloseIcon />\n      </IconButton>\n      {deletePanelDialog && <DeletePanelForm deletePanelDialog={deletePanelDialog} />}\n    </Dialog>\n  );\n};\n\ninterface DeletePanelFormProps {\n  deletePanelDialog: DeletePanelDialogState;\n}\n\nconst DeletePanelForm = ({ deletePanelDialog }: DeletePanelFormProps) => {\n  const { deletePanel, closeDeletePanelDialog } = useDeletePanelDialog();\n\n  const handleDelete = (e: FormEvent) => {\n    e.preventDefault();\n    const { panelGroupItemId } = deletePanelDialog;\n    deletePanel(panelGroupItemId);\n    closeDeletePanelDialog();\n  };\n  return (\n    <form onSubmit={handleDelete}>\n      <DialogContent sx={{ width: '500px' }}>\n        Are you sure you want to delete {deletePanelDialog.panelName} from {deletePanelDialog.panelGroupName}? This\n        action cannot be undone.\n      </DialogContent>\n      <DialogActions>\n        <Button variant=\"contained\" type=\"submit\">\n          Delete\n        </Button>\n        <Button onClick={() => closeDeletePanelDialog()}>Cancel</Button>\n      </DialogActions>\n    </form>\n  );\n};\n"],"names":["IconButton","Dialog","DialogTitle","DialogContent","DialogActions","Button","CloseIcon","useDeletePanelDialog","DeletePanelDialog","deletePanelDialog","closeDeletePanelDialog","open","undefined","aria-label","onClick","sx","theme","position","top","spacing","right","DeletePanelForm","deletePanel","handleDelete","e","preventDefault","panelGroupItemId","form","onSubmit","width","panelName","panelGroupName","variant","type"],"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;AACA,SAASA,UAAU,EAAEC,MAAM,EAAEC,WAAW,EAAEC,aAAa,EAAEC,aAAa,EAAEC,MAAM,QAAQ,eAAe,CAAC;AACtG,OAAOC,SAAS,MAAM,uBAAuB,CAAC;AAC9C,SAASC,oBAAoB,QAAgC,eAAe,CAAC;AAE7E,OAAO,MAAMC,iBAAiB,GAAG,IAAM;IACrC,MAAM,EAAEC,iBAAiB,CAAA,EAAEC,sBAAsB,CAAA,EAAE,GAAGH,oBAAoB,EAAE,AAAC;IAE7E,qBACE,MAACN,MAAM;QAACU,IAAI,EAAEF,iBAAiB,KAAKG,SAAS;;0BAC3C,KAACV,WAAW;0BAAC,cAAY;cAAc;0BACvC,KAACF,UAAU;gBACTa,YAAU,EAAC,OAAO;gBAClBC,OAAO,EAAE,IAAMJ,sBAAsB,EAAE;gBACvCK,EAAE,EAAE,CAACC,KAAK,GAAM,CAAA;wBACdC,QAAQ,EAAE,UAAU;wBACpBC,GAAG,EAAEF,KAAK,CAACG,OAAO,CAAC,GAAG,CAAC;wBACvBC,KAAK,EAAEJ,KAAK,CAACG,OAAO,CAAC,GAAG,CAAC;qBAC1B,CAAA,AAAC;0BAEF,cAAA,KAACb,SAAS,KAAG;cACF;YACZG,iBAAiB,kBAAI,KAACY,eAAe;gBAACZ,iBAAiB,EAAEA,iBAAiB;cAAI;;MACxE,CACT;AACJ,CAAC,CAAC;AAMF,MAAMY,eAAe,GAAG,CAAC,EAAEZ,iBAAiB,CAAA,EAAwB,GAAK;IACvE,MAAM,EAAEa,WAAW,CAAA,EAAEZ,sBAAsB,CAAA,EAAE,GAAGH,oBAAoB,EAAE,AAAC;IAEvE,MAAMgB,YAAY,GAAG,CAACC,CAAY,GAAK;QACrCA,CAAC,CAACC,cAAc,EAAE,CAAC;QACnB,MAAM,EAAEC,gBAAgB,CAAA,EAAE,GAAGjB,iBAAiB,AAAC;QAC/Ca,WAAW,CAACI,gBAAgB,CAAC,CAAC;QAC9BhB,sBAAsB,EAAE,CAAC;IAC3B,CAAC,AAAC;IACF,qBACE,MAACiB,MAAI;QAACC,QAAQ,EAAEL,YAAY;;0BAC1B,MAACpB,aAAa;gBAACY,EAAE,EAAE;oBAAEc,KAAK,EAAE,OAAO;iBAAE;;oBAAE,kCACL;oBAACpB,iBAAiB,CAACqB,SAAS;oBAAC,QAAM;oBAACrB,iBAAiB,CAACsB,cAAc;oBAAC,iCAEvG;;cAAgB;0BAChB,MAAC3B,aAAa;;kCACZ,KAACC,MAAM;wBAAC2B,OAAO,EAAC,WAAW;wBAACC,IAAI,EAAC,QAAQ;kCAAC,QAE1C;sBAAS;kCACT,KAAC5B,MAAM;wBAACS,OAAO,EAAE,IAAMJ,sBAAsB,EAAE;kCAAE,QAAM;sBAAS;;cAClD;;MACX,CACP;AACJ,CAAC,AAAC"}
+{"version":3,"sources":["../../../src/components/DeletePanelDialog/DeletePanelDialog.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 { FormEvent } from 'react';\nimport { IconButton, Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@mui/material';\nimport CloseIcon from 'mdi-material-ui/Close';\nimport { useDeletePanelDialog, DeletePanelDialogState } from '../../context';\n\nexport const DeletePanelDialog = () => {\n  const { deletePanelDialog, closeDeletePanelDialog } = useDeletePanelDialog();\n\n  return (\n    <Dialog open={deletePanelDialog !== undefined}>\n      <DialogTitle>Delete Panel</DialogTitle>\n      <IconButton\n        aria-label=\"Close\"\n        onClick={() => closeDeletePanelDialog()}\n        sx={(theme) => ({\n          position: 'absolute',\n          top: theme.spacing(0.5),\n          right: theme.spacing(0.5),\n        })}\n      >\n        <CloseIcon />\n      </IconButton>\n      {deletePanelDialog && <DeletePanelForm deletePanelDialog={deletePanelDialog} />}\n    </Dialog>\n  );\n};\n\ninterface DeletePanelFormProps {\n  deletePanelDialog: DeletePanelDialogState;\n}\n\nconst DeletePanelForm = ({ deletePanelDialog }: DeletePanelFormProps) => {\n  const { deletePanel, closeDeletePanelDialog } = useDeletePanelDialog();\n\n  const handleDelete = (e: FormEvent) => {\n    e.preventDefault();\n    const { panelGroupItemId } = deletePanelDialog;\n    deletePanel(panelGroupItemId);\n    closeDeletePanelDialog();\n  };\n  return (\n    <form onSubmit={handleDelete}>\n      <DialogContent dividers sx={{ width: '500px' }}>\n        Are you sure you want to delete {deletePanelDialog.panelName} from {deletePanelDialog.panelGroupName}? This\n        action cannot be undone.\n      </DialogContent>\n      <DialogActions>\n        <Button variant=\"contained\" type=\"submit\">\n          Delete\n        </Button>\n        <Button variant=\"outlined\" onClick={() => closeDeletePanelDialog()}>\n          Cancel\n        </Button>\n      </DialogActions>\n    </form>\n  );\n};\n"],"names":["IconButton","Dialog","DialogTitle","DialogContent","DialogActions","Button","CloseIcon","useDeletePanelDialog","DeletePanelDialog","deletePanelDialog","closeDeletePanelDialog","open","undefined","aria-label","onClick","sx","theme","position","top","spacing","right","DeletePanelForm","deletePanel","handleDelete","e","preventDefault","panelGroupItemId","form","onSubmit","dividers","width","panelName","panelGroupName","variant","type"],"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;AACA,SAASA,UAAU,EAAEC,MAAM,EAAEC,WAAW,EAAEC,aAAa,EAAEC,aAAa,EAAEC,MAAM,QAAQ,eAAe,CAAC;AACtG,OAAOC,SAAS,MAAM,uBAAuB,CAAC;AAC9C,SAASC,oBAAoB,QAAgC,eAAe,CAAC;AAE7E,OAAO,MAAMC,iBAAiB,GAAG,IAAM;IACrC,MAAM,EAAEC,iBAAiB,CAAA,EAAEC,sBAAsB,CAAA,EAAE,GAAGH,oBAAoB,EAAE,AAAC;IAE7E,qBACE,MAACN,MAAM;QAACU,IAAI,EAAEF,iBAAiB,KAAKG,SAAS;;0BAC3C,KAACV,WAAW;0BAAC,cAAY;cAAc;0BACvC,KAACF,UAAU;gBACTa,YAAU,EAAC,OAAO;gBAClBC,OAAO,EAAE,IAAMJ,sBAAsB,EAAE;gBACvCK,EAAE,EAAE,CAACC,KAAK,GAAM,CAAA;wBACdC,QAAQ,EAAE,UAAU;wBACpBC,GAAG,EAAEF,KAAK,CAACG,OAAO,CAAC,GAAG,CAAC;wBACvBC,KAAK,EAAEJ,KAAK,CAACG,OAAO,CAAC,GAAG,CAAC;qBAC1B,CAAA,AAAC;0BAEF,cAAA,KAACb,SAAS,KAAG;cACF;YACZG,iBAAiB,kBAAI,KAACY,eAAe;gBAACZ,iBAAiB,EAAEA,iBAAiB;cAAI;;MACxE,CACT;AACJ,CAAC,CAAC;AAMF,MAAMY,eAAe,GAAG,CAAC,EAAEZ,iBAAiB,CAAA,EAAwB,GAAK;IACvE,MAAM,EAAEa,WAAW,CAAA,EAAEZ,sBAAsB,CAAA,EAAE,GAAGH,oBAAoB,EAAE,AAAC;IAEvE,MAAMgB,YAAY,GAAG,CAACC,CAAY,GAAK;QACrCA,CAAC,CAACC,cAAc,EAAE,CAAC;QACnB,MAAM,EAAEC,gBAAgB,CAAA,EAAE,GAAGjB,iBAAiB,AAAC;QAC/Ca,WAAW,CAACI,gBAAgB,CAAC,CAAC;QAC9BhB,sBAAsB,EAAE,CAAC;IAC3B,CAAC,AAAC;IACF,qBACE,MAACiB,MAAI;QAACC,QAAQ,EAAEL,YAAY;;0BAC1B,MAACpB,aAAa;gBAAC0B,QAAQ;gBAACd,EAAE,EAAE;oBAAEe,KAAK,EAAE,OAAO;iBAAE;;oBAAE,kCACd;oBAACrB,iBAAiB,CAACsB,SAAS;oBAAC,QAAM;oBAACtB,iBAAiB,CAACuB,cAAc;oBAAC,iCAEvG;;cAAgB;0BAChB,MAAC5B,aAAa;;kCACZ,KAACC,MAAM;wBAAC4B,OAAO,EAAC,WAAW;wBAACC,IAAI,EAAC,QAAQ;kCAAC,QAE1C;sBAAS;kCACT,KAAC7B,MAAM;wBAAC4B,OAAO,EAAC,UAAU;wBAACnB,OAAO,EAAE,IAAMJ,sBAAsB,EAAE;kCAAE,QAEpE;sBAAS;;cACK;;MACX,CACP;AACJ,CAAC,AAAC"}

package/dist/components/DeletePanelGroupDialog/DeletePanelGroupDialog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DeletePanelGroupDialog.d.ts","sourceRoot":"","sources":["../../../src/components/DeletePanelGroupDialog/DeletePanelGroupDialog.tsx"],"names":[],"mappings":";AAkBA,eAAO,MAAM,sBAAsB,mBA0ClC,CAAC"}
+{"version":3,"file":"DeletePanelGroupDialog.d.ts","sourceRoot":"","sources":["../../../src/components/DeletePanelGroupDialog/DeletePanelGroupDialog.tsx"],"names":[],"mappings":";AAkBA,eAAO,MAAM,sBAAsB,mBA4ClC,CAAC"}

package/dist/components/DeletePanelGroupDialog/DeletePanelGroupDialog.js

@@ -46,6 +46,7 @@ export const DeletePanelGroupDialog = ()=>{
                 onSubmit: handleDelete,
                 children: [
                     /*#__PURE__*/ _jsxs(DialogContent, {
+                        dividers: true,
                         sx: {
                             width: '500px'
                         },
@@ -63,6 +64,7 @@ export const DeletePanelGroupDialog = ()=>{
                                 children: "Delete"
                             }),
                             /*#__PURE__*/ _jsx(Button, {
+                                variant: "outlined",
                                 onClick: ()=>closeDeletePanelGroupDialog(),
                                 children: "Cancel"
                             })

package/dist/components/DeletePanelGroupDialog/DeletePanelGroupDialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/DeletePanelGroupDialog/DeletePanelGroupDialog.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 { FormEvent } from 'react';\nimport { IconButton, Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@mui/material';\nimport CloseIcon from 'mdi-material-ui/Close';\nimport { useDeletePanelGroupDialog } from '../../context';\n\nexport const DeletePanelGroupDialog = () => {\n  const { deletePanelGroupDialog, closeDeletePanelGroupDialog, deletePanelGroup } = useDeletePanelGroupDialog();\n\n  const panelGroupId = deletePanelGroupDialog?.panelGroupId;\n\n  const handleDelete = (e: FormEvent) => {\n    e.preventDefault();\n    if (panelGroupId == undefined) {\n      throw new Error('group index is undefined');\n    }\n    deletePanelGroup(panelGroupId);\n    closeDeletePanelGroupDialog();\n  };\n\n  return (\n    <Dialog open={deletePanelGroupDialog !== undefined}>\n      <DialogTitle>Delete Panel Group</DialogTitle>\n      <IconButton\n        aria-label=\"Close\"\n        onClick={() => closeDeletePanelGroupDialog()}\n        sx={(theme) => ({\n          position: 'absolute',\n          top: theme.spacing(0.5),\n          right: theme.spacing(0.5),\n        })}\n      >\n        <CloseIcon />\n      </IconButton>\n      <form onSubmit={handleDelete}>\n        <DialogContent sx={{ width: '500px' }}>\n          Are you sure you want to delete {deletePanelGroupDialog?.panelGroupName ?? 'panel group'}? This will delete\n          all the panels within the group.\n        </DialogContent>\n        <DialogActions>\n          <Button variant=\"contained\" type=\"submit\">\n            Delete\n          </Button>\n          <Button onClick={() => closeDeletePanelGroupDialog()}>Cancel</Button>\n        </DialogActions>\n      </form>\n    </Dialog>\n  );\n};\n"],"names":["IconButton","Dialog","DialogTitle","DialogContent","DialogActions","Button","CloseIcon","useDeletePanelGroupDialog","DeletePanelGroupDialog","deletePanelGroupDialog","closeDeletePanelGroupDialog","deletePanelGroup","panelGroupId","handleDelete","e","preventDefault","undefined","Error","open","aria-label","onClick","sx","theme","position","top","spacing","right","form","onSubmit","width","panelGroupName","variant","type"],"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;AACA,SAASA,UAAU,EAAEC,MAAM,EAAEC,WAAW,EAAEC,aAAa,EAAEC,aAAa,EAAEC,MAAM,QAAQ,eAAe,CAAC;AACtG,OAAOC,SAAS,MAAM,uBAAuB,CAAC;AAC9C,SAASC,yBAAyB,QAAQ,eAAe,CAAC;AAE1D,OAAO,MAAMC,sBAAsB,GAAG,IAAM;IAC1C,MAAM,EAAEC,sBAAsB,CAAA,EAAEC,2BAA2B,CAAA,EAAEC,gBAAgB,CAAA,EAAE,GAAGJ,yBAAyB,EAAE,AAAC;IAE9G,MAAMK,YAAY,GAAGH,sBAAsB,aAAtBA,sBAAsB,WAAc,GAApCA,KAAAA,CAAoC,GAApCA,sBAAsB,CAAEG,YAAY,AAAC;IAE1D,MAAMC,YAAY,GAAG,CAACC,CAAY,GAAK;QACrCA,CAAC,CAACC,cAAc,EAAE,CAAC;QACnB,IAAIH,YAAY,IAAII,SAAS,EAAE;YAC7B,MAAM,IAAIC,KAAK,CAAC,0BAA0B,CAAC,CAAC;QAC9C,CAAC;QACDN,gBAAgB,CAACC,YAAY,CAAC,CAAC;QAC/BF,2BAA2B,EAAE,CAAC;IAChC,CAAC,AAAC;QAkBuCD,GAAsC;IAhB/E,qBACE,MAACR,MAAM;QAACiB,IAAI,EAAET,sBAAsB,KAAKO,SAAS;;0BAChD,KAACd,WAAW;0BAAC,oBAAkB;cAAc;0BAC7C,KAACF,UAAU;gBACTmB,YAAU,EAAC,OAAO;gBAClBC,OAAO,EAAE,IAAMV,2BAA2B,EAAE;gBAC5CW,EAAE,EAAE,CAACC,KAAK,GAAM,CAAA;wBACdC,QAAQ,EAAE,UAAU;wBACpBC,GAAG,EAAEF,KAAK,CAACG,OAAO,CAAC,GAAG,CAAC;wBACvBC,KAAK,EAAEJ,KAAK,CAACG,OAAO,CAAC,GAAG,CAAC;qBAC1B,CAAA,AAAC;0BAEF,cAAA,KAACnB,SAAS,KAAG;cACF;0BACb,MAACqB,MAAI;gBAACC,QAAQ,EAAEf,YAAY;;kCAC1B,MAACV,aAAa;wBAACkB,EAAE,EAAE;4BAAEQ,KAAK,EAAE,OAAO;yBAAE;;4BAAE,kCACL;4BAACpB,CAAAA,GAAsC,GAAtCA,sBAAsB,aAAtBA,sBAAsB,WAAgB,GAAtCA,KAAAA,CAAsC,GAAtCA,sBAAsB,CAAEqB,cAAc,cAAtCrB,GAAsC,cAAtCA,GAAsC,GAAI,aAAa;4BAAC,qDAE3F;;sBAAgB;kCAChB,MAACL,aAAa;;0CACZ,KAACC,MAAM;gCAAC0B,OAAO,EAAC,WAAW;gCAACC,IAAI,EAAC,QAAQ;0CAAC,QAE1C;8BAAS;0CACT,KAAC3B,MAAM;gCAACe,OAAO,EAAE,IAAMV,2BAA2B,EAAE;0CAAE,QAAM;8BAAS;;sBACvD;;cACX;;MACA,CACT;AACJ,CAAC,CAAC"}
+{"version":3,"sources":["../../../src/components/DeletePanelGroupDialog/DeletePanelGroupDialog.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 { FormEvent } from 'react';\nimport { IconButton, Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@mui/material';\nimport CloseIcon from 'mdi-material-ui/Close';\nimport { useDeletePanelGroupDialog } from '../../context';\n\nexport const DeletePanelGroupDialog = () => {\n  const { deletePanelGroupDialog, closeDeletePanelGroupDialog, deletePanelGroup } = useDeletePanelGroupDialog();\n\n  const panelGroupId = deletePanelGroupDialog?.panelGroupId;\n\n  const handleDelete = (e: FormEvent) => {\n    e.preventDefault();\n    if (panelGroupId == undefined) {\n      throw new Error('group index is undefined');\n    }\n    deletePanelGroup(panelGroupId);\n    closeDeletePanelGroupDialog();\n  };\n\n  return (\n    <Dialog open={deletePanelGroupDialog !== undefined}>\n      <DialogTitle>Delete Panel Group</DialogTitle>\n      <IconButton\n        aria-label=\"Close\"\n        onClick={() => closeDeletePanelGroupDialog()}\n        sx={(theme) => ({\n          position: 'absolute',\n          top: theme.spacing(0.5),\n          right: theme.spacing(0.5),\n        })}\n      >\n        <CloseIcon />\n      </IconButton>\n      <form onSubmit={handleDelete}>\n        <DialogContent dividers sx={{ width: '500px' }}>\n          Are you sure you want to delete {deletePanelGroupDialog?.panelGroupName ?? 'panel group'}? This will delete\n          all the panels within the group.\n        </DialogContent>\n        <DialogActions>\n          <Button variant=\"contained\" type=\"submit\">\n            Delete\n          </Button>\n          <Button variant=\"outlined\" onClick={() => closeDeletePanelGroupDialog()}>\n            Cancel\n          </Button>\n        </DialogActions>\n      </form>\n    </Dialog>\n  );\n};\n"],"names":["IconButton","Dialog","DialogTitle","DialogContent","DialogActions","Button","CloseIcon","useDeletePanelGroupDialog","DeletePanelGroupDialog","deletePanelGroupDialog","closeDeletePanelGroupDialog","deletePanelGroup","panelGroupId","handleDelete","e","preventDefault","undefined","Error","open","aria-label","onClick","sx","theme","position","top","spacing","right","form","onSubmit","dividers","width","panelGroupName","variant","type"],"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;AACA,SAASA,UAAU,EAAEC,MAAM,EAAEC,WAAW,EAAEC,aAAa,EAAEC,aAAa,EAAEC,MAAM,QAAQ,eAAe,CAAC;AACtG,OAAOC,SAAS,MAAM,uBAAuB,CAAC;AAC9C,SAASC,yBAAyB,QAAQ,eAAe,CAAC;AAE1D,OAAO,MAAMC,sBAAsB,GAAG,IAAM;IAC1C,MAAM,EAAEC,sBAAsB,CAAA,EAAEC,2BAA2B,CAAA,EAAEC,gBAAgB,CAAA,EAAE,GAAGJ,yBAAyB,EAAE,AAAC;IAE9G,MAAMK,YAAY,GAAGH,sBAAsB,aAAtBA,sBAAsB,WAAc,GAApCA,KAAAA,CAAoC,GAApCA,sBAAsB,CAAEG,YAAY,AAAC;IAE1D,MAAMC,YAAY,GAAG,CAACC,CAAY,GAAK;QACrCA,CAAC,CAACC,cAAc,EAAE,CAAC;QACnB,IAAIH,YAAY,IAAII,SAAS,EAAE;YAC7B,MAAM,IAAIC,KAAK,CAAC,0BAA0B,CAAC,CAAC;QAC9C,CAAC;QACDN,gBAAgB,CAACC,YAAY,CAAC,CAAC;QAC/BF,2BAA2B,EAAE,CAAC;IAChC,CAAC,AAAC;QAkBuCD,GAAsC;IAhB/E,qBACE,MAACR,MAAM;QAACiB,IAAI,EAAET,sBAAsB,KAAKO,SAAS;;0BAChD,KAACd,WAAW;0BAAC,oBAAkB;cAAc;0BAC7C,KAACF,UAAU;gBACTmB,YAAU,EAAC,OAAO;gBAClBC,OAAO,EAAE,IAAMV,2BAA2B,EAAE;gBAC5CW,EAAE,EAAE,CAACC,KAAK,GAAM,CAAA;wBACdC,QAAQ,EAAE,UAAU;wBACpBC,GAAG,EAAEF,KAAK,CAACG,OAAO,CAAC,GAAG,CAAC;wBACvBC,KAAK,EAAEJ,KAAK,CAACG,OAAO,CAAC,GAAG,CAAC;qBAC1B,CAAA,AAAC;0BAEF,cAAA,KAACnB,SAAS,KAAG;cACF;0BACb,MAACqB,MAAI;gBAACC,QAAQ,EAAEf,YAAY;;kCAC1B,MAACV,aAAa;wBAAC0B,QAAQ;wBAACR,EAAE,EAAE;4BAAES,KAAK,EAAE,OAAO;yBAAE;;4BAAE,kCACd;4BAACrB,CAAAA,GAAsC,GAAtCA,sBAAsB,aAAtBA,sBAAsB,WAAgB,GAAtCA,KAAAA,CAAsC,GAAtCA,sBAAsB,CAAEsB,cAAc,cAAtCtB,GAAsC,cAAtCA,GAAsC,GAAI,aAAa;4BAAC,qDAE3F;;sBAAgB;kCAChB,MAACL,aAAa;;0CACZ,KAACC,MAAM;gCAAC2B,OAAO,EAAC,WAAW;gCAACC,IAAI,EAAC,QAAQ;0CAAC,QAE1C;8BAAS;0CACT,KAAC5B,MAAM;gCAAC2B,OAAO,EAAC,UAAU;gCAACZ,OAAO,EAAE,IAAMV,2BAA2B,EAAE;0CAAE,QAEzE;8BAAS;;sBACK;;cACX;;MACA,CACT;AACJ,CAAC,CAAC"}

package/dist/components/DiscardChangesConfirmationDialog/DiscardChangesConfirmationDialog.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+export declare const DiscardChangesConfirmationDialog: () => JSX.Element;
+//# sourceMappingURL=DiscardChangesConfirmationDialog.d.ts.map

package/dist/components/DiscardChangesConfirmationDialog/DiscardChangesConfirmationDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DiscardChangesConfirmationDialog.d.ts","sourceRoot":"","sources":["../../../src/components/DiscardChangesConfirmationDialog/DiscardChangesConfirmationDialog.tsx"],"names":[],"mappings":";AAiBA,eAAO,MAAM,gCAAgC,mBAoC5C,CAAC"}

package/dist/components/DiscardChangesConfirmationDialog/DiscardChangesConfirmationDialog.js

@@ -0,0 +1,63 @@
+// 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, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { IconButton, Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@mui/material';
+import CloseIcon from 'mdi-material-ui/Close';
+import { useDiscardChangesConfirmationDialog } from '../../context';
+export const DiscardChangesConfirmationDialog = ()=>{
+    const { discardChangesConfirmationDialog: dialog  } = useDiscardChangesConfirmationDialog();
+    const isOpen = dialog !== undefined;
+    return /*#__PURE__*/ _jsx(Dialog, {
+        open: isOpen,
+        children: dialog !== undefined && /*#__PURE__*/ _jsxs(_Fragment, {
+            children: [
+                /*#__PURE__*/ _jsx(DialogTitle, {
+                    children: "Discard Changes"
+                }),
+                /*#__PURE__*/ _jsx(IconButton, {
+                    "aria-label": "Close",
+                    onClick: dialog.onCancel,
+                    sx: (theme)=>({
+                            position: 'absolute',
+                            top: theme.spacing(0.5),
+                            right: theme.spacing(0.5)
+                        }),
+                    children: /*#__PURE__*/ _jsx(CloseIcon, {})
+                }),
+                /*#__PURE__*/ _jsx(DialogContent, {
+                    dividers: true,
+                    sx: {
+                        width: '500px'
+                    },
+                    children: dialog.description || 'You have unsaved changes in this dashboard. Are you sure you want to discard these changes? Changes cannot be recovered.'
+                }),
+                /*#__PURE__*/ _jsxs(DialogActions, {
+                    children: [
+                        /*#__PURE__*/ _jsx(Button, {
+                            variant: "contained",
+                            onClick: dialog.onDiscardChanges,
+                            children: "Discard Changes"
+                        }),
+                        /*#__PURE__*/ _jsx(Button, {
+                            variant: "outlined",
+                            onClick: dialog.onCancel,
+                            children: "Cancel"
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+};
+
+//# sourceMappingURL=DiscardChangesConfirmationDialog.js.map

package/dist/components/DiscardChangesConfirmationDialog/DiscardChangesConfirmationDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/DiscardChangesConfirmationDialog/DiscardChangesConfirmationDialog.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 { IconButton, Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@mui/material';\nimport CloseIcon from 'mdi-material-ui/Close';\nimport { useDiscardChangesConfirmationDialog } from '../../context';\n\nexport const DiscardChangesConfirmationDialog = () => {\n  const { discardChangesConfirmationDialog: dialog } = useDiscardChangesConfirmationDialog();\n  const isOpen = dialog !== undefined;\n\n  return (\n    <Dialog open={isOpen}>\n      {dialog !== undefined && (\n        <>\n          <DialogTitle>Discard Changes</DialogTitle>\n          <IconButton\n            aria-label=\"Close\"\n            onClick={dialog.onCancel}\n            sx={(theme) => ({\n              position: 'absolute',\n              top: theme.spacing(0.5),\n              right: theme.spacing(0.5),\n            })}\n          >\n            <CloseIcon />\n          </IconButton>\n          <DialogContent dividers sx={{ width: '500px' }}>\n            {dialog.description ||\n              'You have unsaved changes in this dashboard. Are you sure you want to discard these changes? Changes cannot be recovered.'}\n          </DialogContent>\n          <DialogActions>\n            <Button variant=\"contained\" onClick={dialog.onDiscardChanges}>\n              Discard Changes\n            </Button>\n            <Button variant=\"outlined\" onClick={dialog.onCancel}>\n              Cancel\n            </Button>\n          </DialogActions>\n        </>\n      )}\n    </Dialog>\n  );\n};\n"],"names":["IconButton","Dialog","DialogTitle","DialogContent","DialogActions","Button","CloseIcon","useDiscardChangesConfirmationDialog","DiscardChangesConfirmationDialog","discardChangesConfirmationDialog","dialog","isOpen","undefined","open","aria-label","onClick","onCancel","sx","theme","position","top","spacing","right","dividers","width","description","variant","onDiscardChanges"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,UAAU,EAAEC,MAAM,EAAEC,WAAW,EAAEC,aAAa,EAAEC,aAAa,EAAEC,MAAM,QAAQ,eAAe,CAAC;AACtG,OAAOC,SAAS,MAAM,uBAAuB,CAAC;AAC9C,SAASC,mCAAmC,QAAQ,eAAe,CAAC;AAEpE,OAAO,MAAMC,gCAAgC,GAAG,IAAM;IACpD,MAAM,EAAEC,gCAAgC,EAAEC,MAAM,CAAA,EAAE,GAAGH,mCAAmC,EAAE,AAAC;IAC3F,MAAMI,MAAM,GAAGD,MAAM,KAAKE,SAAS,AAAC;IAEpC,qBACE,KAACX,MAAM;QAACY,IAAI,EAAEF,MAAM;kBACjBD,MAAM,KAAKE,SAAS,kBACnB;;8BACE,KAACV,WAAW;8BAAC,iBAAe;kBAAc;8BAC1C,KAACF,UAAU;oBACTc,YAAU,EAAC,OAAO;oBAClBC,OAAO,EAAEL,MAAM,CAACM,QAAQ;oBACxBC,EAAE,EAAE,CAACC,KAAK,GAAM,CAAA;4BACdC,QAAQ,EAAE,UAAU;4BACpBC,GAAG,EAAEF,KAAK,CAACG,OAAO,CAAC,GAAG,CAAC;4BACvBC,KAAK,EAAEJ,KAAK,CAACG,OAAO,CAAC,GAAG,CAAC;yBAC1B,CAAA,AAAC;8BAEF,cAAA,KAACf,SAAS,KAAG;kBACF;8BACb,KAACH,aAAa;oBAACoB,QAAQ;oBAACN,EAAE,EAAE;wBAAEO,KAAK,EAAE,OAAO;qBAAE;8BAC3Cd,MAAM,CAACe,WAAW,IACjB,0HAA0H;kBAC9G;8BAChB,MAACrB,aAAa;;sCACZ,KAACC,MAAM;4BAACqB,OAAO,EAAC,WAAW;4BAACX,OAAO,EAAEL,MAAM,CAACiB,gBAAgB;sCAAE,iBAE9D;0BAAS;sCACT,KAACtB,MAAM;4BAACqB,OAAO,EAAC,UAAU;4BAACX,OAAO,EAAEL,MAAM,CAACM,QAAQ;sCAAE,QAErD;0BAAS;;kBACK;;UACf,AACJ;MACM,CACT;AACJ,CAAC,CAAC"}

package/dist/components/DiscardChangesConfirmationDialog/index.d.ts

@@ -0,0 +1,2 @@
+export * from './DiscardChangesConfirmationDialog';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/DiscardChangesConfirmationDialog/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/DiscardChangesConfirmationDialog/index.ts"],"names":[],"mappings":"AAaA,cAAc,oCAAoC,CAAC"}

package/dist/components/{UnsavedChangesConfirmationDialog → DiscardChangesConfirmationDialog}/index.js

@@ -10,6 +10,6 @@
 // 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 './UnsavedChangesConfirmationDialog';
+export * from './DiscardChangesConfirmationDialog';
 
 //# sourceMappingURL=index.js.map

package/dist/components/{UnsavedChangesConfirmationDialog → DiscardChangesConfirmationDialog}/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/UnsavedChangesConfirmationDialog/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 './UnsavedChangesConfirmationDialog';\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,oCAAoC,CAAC"}
+{"version":3,"sources":["../../../src/components/DiscardChangesConfirmationDialog/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 './DiscardChangesConfirmationDialog';\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,oCAAoC,CAAC"}

package/dist/components/GridLayout/GridTitle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GridTitle.d.ts","sourceRoot":"","sources":["../../../src/components/GridLayout/GridTitle.tsx"],"names":[],"mappings":";AAqBA,OAAO,EAAqC,YAAY,EAA6B,MAAM,eAAe,CAAC;AAE3G,MAAM,WAAW,cAAc;IAC7B,YAAY,EAAE,YAAY,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE;QACT,MAAM,EAAE,OAAO,CAAC;QAChB,YAAY,EAAE,MAAM,IAAI,CAAC;KAC1B,CAAC;CACH;AAED;;;GAGG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,eAwD9C"}
+{"version":3,"file":"GridTitle.d.ts","sourceRoot":"","sources":["../../../src/components/GridLayout/GridTitle.tsx"],"names":[],"mappings":";AAsBA,OAAO,EAAqC,YAAY,EAA6B,MAAM,eAAe,CAAC;AAE3G,MAAM,WAAW,cAAc;IAC7B,YAAY,EAAE,YAAY,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE;QACT,MAAM,EAAE,OAAO,CAAC;QAChB,YAAY,EAAE,MAAM,IAAI,CAAC;KAC1B,CAAC;CACH;AAED;;;GAGG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,eAyE9C"}

package/dist/components/GridLayout/GridTitle.js

@@ -19,6 +19,7 @@ import PencilIcon from 'mdi-material-ui/PencilOutline';
 import ArrowUpIcon from 'mdi-material-ui/ArrowUp';
 import ArrowDownIcon from 'mdi-material-ui/ArrowDown';
 import DeleteIcon from 'mdi-material-ui/DeleteOutline';
+import { InfoTooltip } from '@perses-dev/components';
 import { usePanelGroupActions, useEditMode, useDeletePanelGroupDialog } from '../../context';
 /**
  * Renders the title for a Grid section, optionally also supporting expanding
@@ -54,32 +55,47 @@ import { usePanelGroupActions, useEditMode, useDeletePanelGroupDialog } from '..
                     direction: "row",
                     marginLeft: "auto",
                     children: [
-                        /*#__PURE__*/ _jsx(IconButton, {
-                            "aria-label": `add panel to group ${title}`,
-                            onClick: openAddPanel,
-                            children: /*#__PURE__*/ _jsx(AddPanelIcon, {})
+                        /*#__PURE__*/ _jsx(InfoTooltip, {
+                            description: `Add a new panel to ${title}`,
+                            children: /*#__PURE__*/ _jsx(IconButton, {
+                                "aria-label": `add panel to group ${title}`,
+                                onClick: openAddPanel,
+                                children: /*#__PURE__*/ _jsx(AddPanelIcon, {})
+                            })
                         }),
-                        /*#__PURE__*/ _jsx(IconButton, {
-                            "aria-label": `edit group ${title}`,
-                            onClick: openEditPanelGroup,
-                            children: /*#__PURE__*/ _jsx(PencilIcon, {})
+                        /*#__PURE__*/ _jsx(InfoTooltip, {
+                            description: "Edit",
+                            children: /*#__PURE__*/ _jsx(IconButton, {
+                                "aria-label": `edit group ${title}`,
+                                onClick: openEditPanelGroup,
+                                children: /*#__PURE__*/ _jsx(PencilIcon, {})
+                            })
                         }),
-                        /*#__PURE__*/ _jsx(IconButton, {
-                            "aria-label": `delete group ${title}`,
-                            onClick: ()=>openDeletePanelGroupDialog(panelGroupId),
-                            children: /*#__PURE__*/ _jsx(DeleteIcon, {})
+                        /*#__PURE__*/ _jsx(InfoTooltip, {
+                            description: "Delete",
+                            children: /*#__PURE__*/ _jsx(IconButton, {
+                                "aria-label": `delete group ${title}`,
+                                onClick: ()=>openDeletePanelGroupDialog(panelGroupId),
+                                children: /*#__PURE__*/ _jsx(DeleteIcon, {})
+                            })
                         }),
-                        /*#__PURE__*/ _jsx(IconButton, {
-                            "aria-label": `move group ${title} down`,
-                            disabled: moveDown === undefined,
-                            onClick: moveDown,
-                            children: /*#__PURE__*/ _jsx(ArrowDownIcon, {})
+                        /*#__PURE__*/ _jsx(InfoTooltip, {
+                            description: "Move panel group down",
+                            children: /*#__PURE__*/ _jsx(IconButton, {
+                                "aria-label": `move group ${title} down`,
+                                disabled: moveDown === undefined,
+                                onClick: moveDown,
+                                children: /*#__PURE__*/ _jsx(ArrowDownIcon, {})
+                            })
                         }),
-                        /*#__PURE__*/ _jsx(IconButton, {
-                            "aria-label": `move group ${title} up`,
-                            disabled: moveUp === undefined,
-                            onClick: moveUp,
-                            children: /*#__PURE__*/ _jsx(ArrowUpIcon, {})
+                        /*#__PURE__*/ _jsx(InfoTooltip, {
+                            description: "Move panel group up",
+                            children: /*#__PURE__*/ _jsx(IconButton, {
+                                "aria-label": `move group ${title} up`,
+                                disabled: moveUp === undefined,
+                                onClick: moveUp,
+                                children: /*#__PURE__*/ _jsx(ArrowUpIcon, {})
+                            })
                         })
                     ]
                 })

package/dist/components/GridLayout/GridTitle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/GridLayout/GridTitle.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 { Box, IconButton, Stack, Typography } from '@mui/material';\nimport ExpandedIcon from 'mdi-material-ui/ChevronDown';\nimport CollapsedIcon from 'mdi-material-ui/ChevronRight';\nimport AddPanelIcon from 'mdi-material-ui/ChartBoxPlusOutline';\nimport PencilIcon from 'mdi-material-ui/PencilOutline';\nimport ArrowUpIcon from 'mdi-material-ui/ArrowUp';\nimport ArrowDownIcon from 'mdi-material-ui/ArrowDown';\nimport DeleteIcon from 'mdi-material-ui/DeleteOutline';\nimport { usePanelGroupActions, useEditMode, PanelGroupId, useDeletePanelGroupDialog } from '../../context';\n\nexport interface GridTitleProps {\n  panelGroupId: PanelGroupId;\n  title: string;\n  collapse?: {\n    isOpen: boolean;\n    onToggleOpen: () => void;\n  };\n}\n\n/**\n * Renders the title for a Grid section, optionally also supporting expanding\n * and collapsing\n */\nexport function GridTitle(props: GridTitleProps) {\n  const { panelGroupId, title, collapse } = props;\n\n  const { openAddPanel, openEditPanelGroup, moveUp, moveDown } = usePanelGroupActions(panelGroupId);\n  const { openDeletePanelGroupDialog } = useDeletePanelGroupDialog();\n  const { isEditMode } = useEditMode();\n\n  const text = (\n    <Typography variant=\"h2\" sx={{ marginLeft: collapse !== undefined ? 1 : undefined }}>\n      {title}\n    </Typography>\n  );\n\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        justifyContent: 'start',\n        alignItems: 'center',\n        padding: (theme) => theme.spacing(1),\n        backgroundColor: ({ palette }) =>\n          palette.mode === 'dark' ? palette.background.paper : palette.background.default,\n      }}\n    >\n      {collapse ? (\n        <>\n          <IconButton onClick={collapse.onToggleOpen}>\n            {collapse.isOpen ? <ExpandedIcon /> : <CollapsedIcon />}\n          </IconButton>\n          {text}\n          {isEditMode && (\n            <Stack direction=\"row\" marginLeft=\"auto\">\n              <IconButton aria-label={`add panel to group ${title}`} onClick={openAddPanel}>\n                <AddPanelIcon />\n              </IconButton>\n              <IconButton aria-label={`edit group ${title}`} onClick={openEditPanelGroup}>\n                <PencilIcon />\n              </IconButton>\n              <IconButton aria-label={`delete group ${title}`} onClick={() => openDeletePanelGroupDialog(panelGroupId)}>\n                <DeleteIcon />\n              </IconButton>\n              <IconButton aria-label={`move group ${title} down`} disabled={moveDown === undefined} onClick={moveDown}>\n                <ArrowDownIcon />\n              </IconButton>\n              <IconButton aria-label={`move group ${title} up`} disabled={moveUp === undefined} onClick={moveUp}>\n                <ArrowUpIcon />\n              </IconButton>\n            </Stack>\n          )}\n        </>\n      ) : (\n        // If we don't need expand/collapse, just render the title text\n        text\n      )}\n    </Box>\n  );\n}\n"],"names":["Box","IconButton","Stack","Typography","ExpandedIcon","CollapsedIcon","AddPanelIcon","PencilIcon","ArrowUpIcon","ArrowDownIcon","DeleteIcon","usePanelGroupActions","useEditMode","useDeletePanelGroupDialog","GridTitle","props","panelGroupId","title","collapse","openAddPanel","openEditPanelGroup","moveUp","moveDown","openDeletePanelGroupDialog","isEditMode","text","variant","sx","marginLeft","undefined","display","justifyContent","alignItems","padding","theme","spacing","backgroundColor","palette","mode","background","paper","default","onClick","onToggleOpen","isOpen","direction","aria-label","disabled"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/GridLayout/GridTitle.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 { Box, IconButton, Stack, Typography } from '@mui/material';\nimport ExpandedIcon from 'mdi-material-ui/ChevronDown';\nimport CollapsedIcon from 'mdi-material-ui/ChevronRight';\nimport AddPanelIcon from 'mdi-material-ui/ChartBoxPlusOutline';\nimport PencilIcon from 'mdi-material-ui/PencilOutline';\nimport ArrowUpIcon from 'mdi-material-ui/ArrowUp';\nimport ArrowDownIcon from 'mdi-material-ui/ArrowDown';\nimport DeleteIcon from 'mdi-material-ui/DeleteOutline';\nimport { InfoTooltip } from '@perses-dev/components';\nimport { usePanelGroupActions, useEditMode, PanelGroupId, useDeletePanelGroupDialog } from '../../context';\n\nexport interface GridTitleProps {\n  panelGroupId: PanelGroupId;\n  title: string;\n  collapse?: {\n    isOpen: boolean;\n    onToggleOpen: () => void;\n  };\n}\n\n/**\n * Renders the title for a Grid section, optionally also supporting expanding\n * and collapsing\n */\nexport function GridTitle(props: GridTitleProps) {\n  const { panelGroupId, title, collapse } = props;\n\n  const { openAddPanel, openEditPanelGroup, moveUp, moveDown } = usePanelGroupActions(panelGroupId);\n  const { openDeletePanelGroupDialog } = useDeletePanelGroupDialog();\n  const { isEditMode } = useEditMode();\n\n  const text = (\n    <Typography variant=\"h2\" sx={{ marginLeft: collapse !== undefined ? 1 : undefined }}>\n      {title}\n    </Typography>\n  );\n\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        justifyContent: 'start',\n        alignItems: 'center',\n        padding: (theme) => theme.spacing(1),\n        backgroundColor: ({ palette }) =>\n          palette.mode === 'dark' ? palette.background.paper : palette.background.default,\n      }}\n    >\n      {collapse ? (\n        <>\n          <IconButton onClick={collapse.onToggleOpen}>\n            {collapse.isOpen ? <ExpandedIcon /> : <CollapsedIcon />}\n          </IconButton>\n          {text}\n          {isEditMode && (\n            <Stack direction=\"row\" marginLeft=\"auto\">\n              <InfoTooltip description={`Add a new panel to ${title}`}>\n                <IconButton aria-label={`add panel to group ${title}`} onClick={openAddPanel}>\n                  <AddPanelIcon />\n                </IconButton>\n              </InfoTooltip>\n              <InfoTooltip description=\"Edit\">\n                <IconButton aria-label={`edit group ${title}`} onClick={openEditPanelGroup}>\n                  <PencilIcon />\n                </IconButton>\n              </InfoTooltip>\n              <InfoTooltip description=\"Delete\">\n                <IconButton\n                  aria-label={`delete group ${title}`}\n                  onClick={() => openDeletePanelGroupDialog(panelGroupId)}\n                >\n                  <DeleteIcon />\n                </IconButton>\n              </InfoTooltip>\n              <InfoTooltip description=\"Move panel group down\">\n                <IconButton\n                  aria-label={`move group ${title} down`}\n                  disabled={moveDown === undefined}\n                  onClick={moveDown}\n                >\n                  <ArrowDownIcon />\n                </IconButton>\n              </InfoTooltip>\n              <InfoTooltip description=\"Move panel group up\">\n                <IconButton aria-label={`move group ${title} up`} disabled={moveUp === undefined} onClick={moveUp}>\n                  <ArrowUpIcon />\n                </IconButton>\n              </InfoTooltip>\n            </Stack>\n          )}\n        </>\n      ) : (\n        // If we don't need expand/collapse, just render the title text\n        text\n      )}\n    </Box>\n  );\n}\n"],"names":["Box","IconButton","Stack","Typography","ExpandedIcon","CollapsedIcon","AddPanelIcon","PencilIcon","ArrowUpIcon","ArrowDownIcon","DeleteIcon","InfoTooltip","usePanelGroupActions","useEditMode","useDeletePanelGroupDialog","GridTitle","props","panelGroupId","title","collapse","openAddPanel","openEditPanelGroup","moveUp","moveDown","openDeletePanelGroupDialog","isEditMode","text","variant","sx","marginLeft","undefined","display","justifyContent","alignItems","padding","theme","spacing","backgroundColor","palette","mode","background","paper","default","onClick","onToggleOpen","isOpen","direction","description","aria-label","disabled"],"mappings":"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"}