@perses-dev/dashboards 0.53.0-beta.2 → 0.53.0-beta.4

package/dist/cjs/components/GridLayout/GridLayout.js

@@ -17,14 +17,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    GridLayout: function() {
+    get GridLayout () {
         return GridLayout;
     },
-    RepeatGridLayout: function() {
+    get RepeatGridLayout () {
         return RepeatGridLayout;
     }
 });

package/dist/cjs/components/LeaveDialog/LeaveDialog.js

@@ -17,14 +17,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    LeaveDialog: function() {
+    get LeaveDialog () {
         return LeaveDialog;
     },
-    Prompt: function() {
+    get Prompt () {
         return Prompt;
     }
 });

package/dist/cjs/components/Panel/PanelActions.js

@@ -33,6 +33,7 @@ const _DragVertical = /*#__PURE__*/ _interop_require_default(require("mdi-materi
 const _ContentCopy = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/ContentCopy"));
 const _Menu = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/Menu"));
 const _Alert = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/Alert"));
+const _AlertCircle = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/AlertCircle"));
 const _InformationOutline = /*#__PURE__*/ _interop_require_default(require("mdi-material-ui/InformationOutline"));
 const _constants = require("../../constants");
 const _HeaderIconButton = require("./HeaderIconButton");
@@ -42,6 +43,19 @@ function _interop_require_default(obj) {
         default: obj
     };
 }
+const noticeTypeToIcon = {
+    error: /*#__PURE__*/ (0, _jsxruntime.jsx)(_AlertCircle.default, {
+        color: "error"
+    }),
+    warning: /*#__PURE__*/ (0, _jsxruntime.jsx)(_Alert.default, {
+        fontSize: "inherit",
+        color: "warning"
+    }),
+    info: /*#__PURE__*/ (0, _jsxruntime.jsx)(_InformationOutline.default, {
+        fontSize: "inherit",
+        color: "info"
+    })
+};
 const ConditionalBox = (0, _material.styled)(_material.Box)({
     display: 'none',
     alignItems: 'center',
@@ -106,6 +120,24 @@ const PanelActions = ({ editHandlers, readHandlers, viewQueriesHandler, extra, t
     }, [
         queryResults
     ]);
+    const noticesIndicator = (0, _react.useMemo)(()=>{
+        const notices = queryResults.flatMap((q)=>{
+            return q.data?.metadata?.notices ?? [];
+        });
+        if (notices.length > 0) {
+            const lastNotice = notices[notices.length - 1];
+            return /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.InfoTooltip, {
+                description: lastNotice.message,
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_HeaderIconButton.HeaderIconButton, {
+                    "aria-label": "panel notices",
+                    size: "small",
+                    children: noticeTypeToIcon[lastNotice.type]
+                })
+            });
+        }
+    }, [
+        queryResults
+    ]);
     const readActions = (0, _react.useMemo)(()=>{
         if (readHandlers !== undefined) {
             return /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.InfoTooltip, {
@@ -253,6 +285,8 @@ const PanelActions = ({ editHandlers, readHandlers, viewQueriesHandler, extra, t
                                     " ",
                                     queryStateIndicator,
                                     " ",
+                                    noticesIndicator,
+                                    " ",
                                     extraActions,
                                     " ",
                                     viewQueryAction,
@@ -284,6 +318,7 @@ const PanelActions = ({ editHandlers, readHandlers, viewQueriesHandler, extra, t
                     divider,
                     " ",
                     queryStateIndicator,
+                    noticesIndicator,
                     /*#__PURE__*/ (0, _jsxruntime.jsxs)(OnHover, {
                         children: [
                             extraActions,
@@ -322,6 +357,7 @@ const PanelActions = ({ editHandlers, readHandlers, viewQueriesHandler, extra, t
                     divider,
                     " ",
                     queryStateIndicator,
+                    noticesIndicator,
                     /*#__PURE__*/ (0, _jsxruntime.jsxs)(OnHover, {
                         children: [
                             extraActions,

package/dist/cjs/components/Panel/PanelPluginLoader.js

@@ -30,6 +30,8 @@ function PanelPluginLoader(props) {
     });
     const PanelComponent = plugin?.PanelComponent;
     const supportedQueryTypes = plugin?.supportedQueryTypes || [];
+    // Clear out the queryResults parameter for plugins which don't support any query types
+    const supportedQueryResults = supportedQueryTypes.length > 0 ? queryResults : [];
     // Show fullsize skeleton if the panel plugin is loading.
     if (isPanelLoading) {
         return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Skeleton, {
@@ -42,7 +44,7 @@ function PanelPluginLoader(props) {
     if (PanelComponent === undefined) {
         throw new Error(`Missing PanelComponent from panel plugin for kind '${kind}'`);
     }
-    for (const queryResult of queryResults){
+    for (const queryResult of supportedQueryResults){
         if (!supportedQueryTypes.includes(queryResult.definition.kind)) {
             throw new Error(`This panel does not support queries of type '${queryResult.definition.kind}'. Supported query types: ${supportedQueryTypes.join(', ')}.`);
         }
@@ -51,6 +53,6 @@ function PanelPluginLoader(props) {
         spec: spec,
         contentDimensions: contentDimensions,
         definition: definition,
-        queryResults: queryResults
+        queryResults: supportedQueryResults
     });
 }

package/dist/cjs/components/PanelDrawer/PanelEditorForm.js

@@ -17,14 +17,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    PanelEditorForm: function() {
+    get PanelEditorForm () {
         return PanelEditorForm;
     },
-    panelEditorFormId: function() {
+    get panelEditorFormId () {
         return panelEditorFormId;
     }
 });
@@ -41,7 +41,6 @@ const _usePanelEditor = require("./usePanelEditor");
 const _PanelQueriesSharedControls = require("./PanelQueriesSharedControls");
 function PanelEditorForm(props) {
     const { initialValues, initialAction, onSave, onClose } = props;
-    const pluginEditorRef = (0, _react.useRef)(null);
     const panelGroups = (0, _context.useListPanelGroups)();
     const { panelDefinition, setName, setDescription, setLinks, setQueries, setPlugin, setPanelDefinition } = (0, _usePanelEditor.usePanelEditor)(initialValues.panelDefinition);
     const { plugin } = panelDefinition.spec;
@@ -128,7 +127,6 @@ function PanelEditorForm(props) {
         name: 'panelDefinition.spec.plugin.kind'
     });
     const handleSubmit = (0, _react.useCallback)(()=>{
-        pluginEditorRef.current?.flushChanges?.();
         form.handleSubmit(processForm)();
     }, [
         form,

package/dist/cjs/components/PanelDrawer/PanelQueriesSharedControls.js

@@ -29,16 +29,31 @@ const _react = require("react");
 function PanelQueriesSharedControls({ plugin, control, panelDefinition, onQueriesChange, onPluginSpecChange, onJSONChange }) {
     const { data: pluginPreview } = (0, _pluginsystem.usePlugin)('Panel', plugin.kind);
     const panelEditorContext = (0, _react.useContext)(_dashboards.PanelEditorContext);
-    const pluginQueryOptions = typeof pluginPreview?.queryOptions === 'function' ? pluginPreview?.queryOptions(panelDefinition.spec.plugin.spec) : pluginPreview?.queryOptions;
     const suggestedStepMs = (0, _pluginsystem.useSuggestedStepMs)(panelEditorContext?.preview.previewPanelWidth);
-    const definitions = panelDefinition.spec.queries?.map((query)=>{
-        return {
-            kind: query.spec.plugin.kind,
-            spec: query.spec.plugin.spec
-        };
-    }) ?? [];
+    const pluginQueryOptions = (0, _react.useMemo)(()=>typeof pluginPreview?.queryOptions === 'function' ? pluginPreview?.queryOptions(panelDefinition.spec.plugin.spec) : pluginPreview?.queryOptions, [
+        panelDefinition.spec.plugin.spec,
+        pluginPreview
+    ]);
+    const [previewDefinition, setPreviewDefinition] = (0, _react.useState)(()=>panelDefinition.spec.queries?.map((query)=>{
+            return {
+                kind: query.spec.plugin.kind,
+                spec: query.spec.plugin.spec
+            };
+        }) ?? []);
+    const handleRunQuery = (0, _react.useCallback)((index, newDef)=>{
+        setPreviewDefinition((prev)=>{
+            const newDefinitions = [
+                ...prev
+            ];
+            newDefinitions[index] = {
+                kind: newDef.spec.plugin.kind,
+                spec: newDef.spec.plugin.spec
+            };
+            return newDefinitions;
+        });
+    }, []);
     return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_pluginsystem.DataQueriesProvider, {
-        definitions: definitions,
+        definitions: previewDefinition,
         options: {
             suggestedStepMs,
             ...pluginQueryOptions
@@ -71,6 +86,7 @@ function PanelQueriesSharedControls({ plugin, control, panelDefinition, onQuerie
                         panelDefinition: panelDefinition,
                         onJSONChange: onJSONChange,
                         onQueriesChange: onQueriesChange,
+                        onQueryRun: handleRunQuery,
                         onPluginSpecChange: onPluginSpecChange
                     })
                 })

package/dist/cjs/components/PanelGroupDialog/PanelGroupEditorForm.js

@@ -17,14 +17,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    PanelGroupEditorForm: function() {
+    get PanelGroupEditorForm () {
         return PanelGroupEditorForm;
     },
-    panelGroupEditorFormId: function() {
+    get panelGroupEditorFormId () {
         return panelGroupEditorFormId;
     }
 });

package/dist/cjs/components/Variables/ListVariableListBox.js

@@ -17,17 +17,17 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    ListVariableListBox: function() {
+    get ListVariableListBox () {
         return ListVariableListBox;
     },
-    ListVariableListBoxProvider: function() {
+    get ListVariableListBoxProvider () {
         return ListVariableListBoxProvider;
     },
-    useListVariableListBoxContext: function() {
+    get useListVariableListBoxContext () {
         return useListVariableListBoxContext;
     }
 });

package/dist/cjs/components/Variables/Variable.js

@@ -17,14 +17,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    Variable: function() {
+    get Variable () {
         return Variable;
     },
-    useListVariableState: function() {
+    get useListVariableState () {
         return useListVariableState;
     }
 });

package/dist/cjs/components/Variables/VariableEditor.js

@@ -17,14 +17,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    VariableEditor: function() {
+    get VariableEditor () {
         return VariableEditor;
     },
-    VariableName: function() {
+    get VariableName () {
         return VariableName;
     }
 });

package/dist/cjs/components/Variables/VariableList.js

@@ -17,14 +17,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    VariableList: function() {
+    get VariableList () {
         return VariableList;
     },
-    VariableListItem: function() {
+    get VariableListItem () {
         return VariableListItem;
     }
 });

package/dist/cjs/constants/grid-layout-config.js

@@ -17,14 +17,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    GRID_LAYOUT_COLS: function() {
+    get GRID_LAYOUT_COLS () {
         return GRID_LAYOUT_COLS;
     },
-    GRID_LAYOUT_SMALL_BREAKPOINT: function() {
+    get GRID_LAYOUT_SMALL_BREAKPOINT () {
         return GRID_LAYOUT_SMALL_BREAKPOINT;
     }
 });

package/dist/cjs/constants/styles.js

@@ -17,26 +17,26 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    HEADER_ACTIONS_CONTAINER_NAME: function() {
+    get HEADER_ACTIONS_CONTAINER_NAME () {
         return HEADER_ACTIONS_CONTAINER_NAME;
     },
-    HEADER_MEDIUM_WIDTH: function() {
+    get HEADER_MEDIUM_WIDTH () {
         return HEADER_MEDIUM_WIDTH;
     },
-    HEADER_SMALL_WIDTH: function() {
+    get HEADER_SMALL_WIDTH () {
         return HEADER_SMALL_WIDTH;
     },
-    MAX_VARIABLE_WIDTH: function() {
+    get MAX_VARIABLE_WIDTH () {
         return MAX_VARIABLE_WIDTH;
     },
-    MIN_VARIABLE_WIDTH: function() {
+    get MIN_VARIABLE_WIDTH () {
         return MIN_VARIABLE_WIDTH;
     },
-    editButtonStyle: function() {
+    get editButtonStyle () {
         return editButtonStyle;
     }
 });

package/dist/cjs/constants/user-interface-text.js

@@ -17,14 +17,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    ARIA_LABEL_TEXT: function() {
+    get ARIA_LABEL_TEXT () {
         return ARIA_LABEL_TEXT;
     },
-    TOOLTIP_TEXT: function() {
+    get TOOLTIP_TEXT () {
         return TOOLTIP_TEXT;
     }
 });

package/dist/cjs/context/DashboardProvider/DashboardProvider.js

@@ -17,17 +17,17 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    DashboardContext: function() {
+    get DashboardContext () {
         return DashboardContext;
     },
-    DashboardProvider: function() {
+    get DashboardProvider () {
         return DashboardProvider;
     },
-    useDashboardStore: function() {
+    get useDashboardStore () {
         return useDashboardStore;
     }
 });

package/dist/cjs/context/DashboardProvider/common.js

@@ -17,14 +17,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    createPanelDefinition: function() {
+    get createPanelDefinition () {
         return createPanelDefinition;
     },
-    generateId: function() {
+    get generateId () {
         return generateId;
     }
 });

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

@@ -17,62 +17,62 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    useDashboardActions: function() {
+    get useDashboardActions () {
         return useDashboardActions;
     },
-    useDashboardDuration: function() {
+    get useDashboardDuration () {
         return useDashboardDuration;
     },
-    useDeletePanelDialog: function() {
+    get useDeletePanelDialog () {
         return useDeletePanelDialog;
     },
-    useDeletePanelGroupDialog: function() {
+    get useDeletePanelGroupDialog () {
         return useDeletePanelGroupDialog;
     },
-    useDiscardChangesConfirmationDialog: function() {
+    get useDiscardChangesConfirmationDialog () {
         return useDiscardChangesConfirmationDialog;
     },
-    useEditJsonDialog: function() {
+    get useEditJsonDialog () {
         return useEditJsonDialog;
     },
-    useEditMode: function() {
+    get useEditMode () {
         return useEditMode;
     },
-    useListPanelGroups: function() {
+    get useListPanelGroups () {
         return useListPanelGroups;
     },
-    usePanel: function() {
+    get usePanel () {
         return usePanel;
     },
-    usePanelActions: function() {
+    get usePanelActions () {
         return usePanelActions;
     },
-    usePanelEditor: function() {
+    get usePanelEditor () {
         return usePanelEditor;
     },
-    usePanelGroup: function() {
+    get usePanelGroup () {
         return usePanelGroup;
     },
-    usePanelGroupActions: function() {
+    get usePanelGroupActions () {
         return usePanelGroupActions;
     },
-    usePanelGroupEditor: function() {
+    get usePanelGroupEditor () {
         return usePanelGroupEditor;
     },
-    usePanelGroupIds: function() {
+    get usePanelGroupIds () {
         return usePanelGroupIds;
     },
-    useSaveChangesConfirmationDialog: function() {
+    get useSaveChangesConfirmationDialog () {
         return useSaveChangesConfirmationDialog;
     },
-    useViewPanel: function() {
+    get useViewPanel () {
         return useViewPanel;
     },
-    useViewPanelGroup: function() {
+    get useViewPanelGroup () {
         return useViewPanelGroup;
     }
 });

package/dist/cjs/context/DashboardProvider/duplicate-panel-slice.js

@@ -49,7 +49,7 @@ function createDuplicatePanelSlice() {
                     if (matchingLayout === undefined) {
                         throw new Error(`Cannot find layout for Panel with key '${panelKey}'`);
                     }
-                    const dupePanelKey = crypto.randomUUID().replaceAll('-', '');
+                    const dupePanelKey = (0, _panelUtils.generatePanelKey)();
                     state.panels[dupePanelKey] = panelToDupe;
                     const duplicateLayout = {
                         i: (0, _common.generateId)().toString(),

package/dist/cjs/context/DashboardProvider/panel-editor-slice.js

@@ -110,7 +110,7 @@ function createPanelEditorSlice() {
                         panelDefinition: get().initialValues?.panelDefinition ?? (0, _common.createPanelDefinition)()
                     },
                     applyChanges: (next)=>{
-                        const panelKey = crypto.randomUUID().replaceAll('-', '');
+                        const panelKey = (0, _utils.generatePanelKey)();
                         set((state)=>{
                             // Add a panel
                             state.panels[panelKey] = next.panelDefinition;

package/dist/cjs/context/DashboardProvider/panel-group-slice.js

@@ -17,20 +17,20 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    addPanelGroup: function() {
+    get addPanelGroup () {
         return addPanelGroup;
     },
-    convertLayoutsToPanelGroups: function() {
+    get convertLayoutsToPanelGroups () {
         return convertLayoutsToPanelGroups;
     },
-    createEmptyPanelGroup: function() {
+    get createEmptyPanelGroup () {
         return createEmptyPanelGroup;
     },
-    createPanelGroupSlice: function() {
+    get createPanelGroupSlice () {
         return createPanelGroupSlice;
     }
 });

package/dist/cjs/context/PanelEditorProvider/PanelEditorProvider.js

@@ -17,14 +17,14 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    PanelEditorContext: function() {
+    get PanelEditorContext () {
         return PanelEditorContext;
     },
-    PanelEditorProvider: function() {
+    get PanelEditorProvider () {
         return PanelEditorProvider;
     }
 });
@@ -39,8 +39,7 @@ const PanelEditorProvider = ({ children })=>{
                 setPreviewPanelWidth
             }
         }), [
-        previewPanelWidth,
-        setPreviewPanelWidth
+        previewPanelWidth
     ]);
     return /*#__PURE__*/ (0, _jsxruntime.jsx)(PanelEditorContext.Provider, {
         value: ctx,

package/dist/cjs/context/VariableProvider/VariableProvider.js

@@ -17,32 +17,32 @@ Object.defineProperty(exports, "__esModule", {
 function _export(target, all) {
     for(var name in all)Object.defineProperty(target, name, {
         enumerable: true,
-        get: all[name]
+        get: Object.getOwnPropertyDescriptor(all, name).get
     });
 }
 _export(exports, {
-    VariableProvider: function() {
+    get VariableProvider () {
         return VariableProvider;
     },
-    VariableProviderWithQueryParams: function() {
+    get VariableProviderWithQueryParams () {
         return VariableProviderWithQueryParams;
     },
-    useExternalVariableDefinitions: function() {
+    get useExternalVariableDefinitions () {
         return useExternalVariableDefinitions;
     },
-    useVariableDefinitionActions: function() {
+    get useVariableDefinitionActions () {
         return useVariableDefinitionActions;
     },
-    useVariableDefinitionAndState: function() {
+    get useVariableDefinitionAndState () {
         return useVariableDefinitionAndState;
     },
-    useVariableDefinitionStates: function() {
+    get useVariableDefinitionStates () {
         return useVariableDefinitionStates;
     },
-    useVariableDefinitionStoreCtx: function() {
+    get useVariableDefinitionStoreCtx () {
         return useVariableDefinitionStoreCtx;
     },
-    useVariableDefinitions: function() {
+    get useVariableDefinitions () {
         return useVariableDefinitions;
     }
 });