@perses-dev/dashboards 0.54.0-beta.0 → 0.54.0-beta.2

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

@@ -25,7 +25,7 @@ const _material = require("@mui/material");
 const _reactintersectionobserver = require("react-intersection-observer");
 const _pluginsystem = require("@perses-dev/plugin-system");
 const _react = /*#__PURE__*/ _interop_require_wildcard(require("react"));
-const _core = require("@perses-dev/core");
+const _model = require("../../model");
 const _context = require("../../context");
 const _keyboardshortcuts = require("../../keyboard-shortcuts");
 const _Panel = require("../Panel");
@@ -103,7 +103,7 @@ function GridItemContent(props) {
         queries
     ]);
     const readHandlers = {
-        isPanelViewed: (0, _core.isPanelGroupItemIdEqual)(viewPanelGroupItemId, panelGroupItemId),
+        isPanelViewed: (0, _model.isPanelGroupItemIdEqual)(viewPanelGroupItemId, panelGroupItemId),
         onViewPanelClick: function() {
             if (viewPanelGroupItemId === undefined) {
                 viewPanel(panelGroupItemId);

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

@@ -79,7 +79,10 @@ const Panel = /*#__PURE__*/ (0, _react.memo)(function Panel(props) {
                 return;
             }
             try {
-                const plugin = await getPlugin('Panel', panelPluginKind);
+                const plugin = await getPlugin({
+                    kind: 'Panel',
+                    name: panelPluginKind
+                });
                 // More defensive checking for plugin and actions
                 if (!plugin || typeof plugin !== 'object' || !plugin.actions || !Array.isArray(plugin.actions) || plugin.actions.length === 0) {
                     setPluginActions([]);

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

@@ -77,8 +77,8 @@ function PanelEditorForm(props) {
             setQueries(undefined, isHidden);
         }
     });
-    const titleAction = (0, _pluginsystem.getTitleAction)(initialAction, true);
-    const submitText = (0, _pluginsystem.getSubmitText)(initialAction, true);
+    const titleAction = (0, _components.getTitleAction)(initialAction, true);
+    const submitText = (0, _components.getSubmitText)(initialAction, true);
     const links = (0, _reacthookform.useWatch)({
         control: form.control,
         name: 'panelDefinition.spec.links'

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

@@ -166,25 +166,25 @@ function VariableEditor(props) {
     };
     return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
-            currentEditingVariableDefinition && /*#__PURE__*/ (0, _jsxruntime.jsx)(_pluginsystem.ValidationProvider, {
-                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_pluginsystem.VariableEditorForm, {
-                    initialVariableDefinition: currentEditingVariableDefinition,
-                    action: variableFormAction,
-                    isDraft: true,
-                    onActionChange: setVariableFormAction,
-                    onSave: (definition)=>{
-                        setVariableDefinitions((draft)=>{
-                            draft[variableEditIdx] = definition;
-                            setVariableEditIdx(null);
-                        });
-                    },
-                    onClose: ()=>{
-                        if (variableFormAction === 'create') {
-                            removeVariable(variableEditIdx);
-                        }
+            currentEditingVariableDefinition && /*#__PURE__*/ (0, _jsxruntime.jsx)(VariableEditorFormWithContext, {
+                variableDefinitions: variableDefinitions,
+                externalVariableDefinitions: externalVariableDefinitions,
+                builtinVariableDefinitions: builtinVariableDefinitions,
+                currentEditingVariableDefinition: currentEditingVariableDefinition,
+                variableFormAction: variableFormAction,
+                onActionChange: setVariableFormAction,
+                onSave: (definition)=>{
+                    setVariableDefinitions((draft)=>{
+                        draft[variableEditIdx] = definition;
                         setVariableEditIdx(null);
+                    });
+                },
+                onClose: ()=>{
+                    if (variableFormAction === 'create') {
+                        removeVariable(variableEditIdx);
                     }
-                })
+                    setVariableEditIdx(null);
+                }
             }),
             !currentEditingVariableDefinition && /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
                 children: [
@@ -535,6 +535,40 @@ function VariableEditor(props) {
 const TableCell = (0, _material.styled)(_material.TableCell)(({ theme })=>({
         borderBottom: `solid 1px ${theme.palette.divider}`
     }));
+function VariableEditorFormWithContext({ variableDefinitions, externalVariableDefinitions, builtinVariableDefinitions, currentEditingVariableDefinition, variableFormAction, onActionChange, onSave, onClose }) {
+    const { initialVariableValues, isLoading } = (0, _pluginsystem.useResolveListVariableValues)(variableDefinitions);
+    if (isLoading) {
+        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Stack, {
+            sx: {
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'center',
+                height: '100%',
+                width: '100%',
+                overflow: 'hidden'
+            },
+            children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.CircularProgress, {
+                "aria-label": "loading"
+            })
+        });
+    }
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_context.VariableProvider, {
+        initialVariableDefinitions: variableDefinitions,
+        externalVariableDefinitions: externalVariableDefinitions,
+        builtinVariableDefinitions: builtinVariableDefinitions,
+        initialVariableValues: initialVariableValues,
+        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_pluginsystem.ValidationProvider, {
+            children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_pluginsystem.VariableEditorForm, {
+                initialVariableDefinition: currentEditingVariableDefinition,
+                action: variableFormAction,
+                isDraft: true,
+                onActionChange: onActionChange,
+                onSave: onSave,
+                onClose: onClose
+            })
+        })
+    });
+}
 function VariableName(props) {
     const { name, state } = props;
     return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {

package/dist/cjs/constants/defaults.js

@@ -0,0 +1,32 @@
+// Copyright 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
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: Object.getOwnPropertyDescriptor(all, name).get
+    });
+}
+_export(exports, {
+    get DEFAULT_DASHBOARD_DURATION () {
+        return DEFAULT_DASHBOARD_DURATION;
+    },
+    get DEFAULT_REFRESH_INTERVAL () {
+        return DEFAULT_REFRESH_INTERVAL;
+    }
+});
+const DEFAULT_DASHBOARD_DURATION = '1h';
+const DEFAULT_REFRESH_INTERVAL = '0s';

package/dist/cjs/constants/index.js

@@ -17,6 +17,7 @@ Object.defineProperty(exports, "__esModule", {
 _export_star(require("./grid-layout-config"), exports);
 _export_star(require("./styles"), exports);
 _export_star(require("./user-interface-text"), exports);
+_export_star(require("./defaults"), exports);
 function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {
         if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {

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

@@ -38,8 +38,8 @@ const _middleware = require("zustand/middleware");
 const _immer = require("zustand/middleware/immer");
 const _shallow = require("zustand/shallow");
 const _react = require("react");
-const _core = require("@perses-dev/core");
 const _pluginsystem = require("@perses-dev/plugin-system");
+const _constants = require("../../constants");
 const _panelgroupeditorslice = require("./panel-group-editor-slice");
 const _panelgroupslice = require("./panel-group-slice");
 const _paneleditorslice = require("./panel-editor-slice");
@@ -92,7 +92,7 @@ function DashboardProvider(props) {
 }
 function initStore(props) {
     const { initialState: { dashboardResource, isEditMode, viewPanelRef, setViewPanelRef } } = props;
-    const { kind, metadata, spec: { display, duration, refreshInterval = _core.DEFAULT_REFRESH_INTERVAL, datasources, layouts = [], panels = {} } } = dashboardResource;
+    const { kind, metadata, spec: { display, duration, refreshInterval = _constants.DEFAULT_REFRESH_INTERVAL, datasources, layouts = [], panels = {} } } = dashboardResource;
     const links = dashboardResource.spec.links ?? [];
     const ttl = 'ttl' in dashboardResource.spec ? dashboardResource.spec.ttl : undefined;
     const store = (0, _zustand.createStore)()((0, _immer.immer)((0, _middleware.devtools)((...args)=>{
@@ -133,7 +133,7 @@ function initStore(props) {
                     state.panelGroups = panelGroups;
                     state.panelGroupOrder = panelGroupOrder;
                     state.duration = duration;
-                    state.refreshInterval = refreshInterval ?? _core.DEFAULT_REFRESH_INTERVAL;
+                    state.refreshInterval = refreshInterval ?? _constants.DEFAULT_REFRESH_INTERVAL;
                     state.datasources = datasources;
                     state.links = links;
                 // TODO: add ttl here to e.g allow edition from JSON view, but probably requires quite some refactoring

package/dist/cjs/context/DatasourceStoreProvider.js

@@ -82,7 +82,10 @@ function DatasourceStoreProvider(props) {
         const { kind } = selector;
         const [{ spec, proxyUrl }, plugin] = await Promise.all([
             findDatasource(selector),
-            getPlugin('Datasource', kind)
+            getPlugin({
+                kind: 'Datasource',
+                name: kind
+            })
         ]);
         // allows extending client
         const client = plugin.createClient(spec.plugin.spec, {

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

@@ -55,7 +55,6 @@ const _middleware = require("zustand/middleware");
 const _shallow = require("zustand/shallow");
 const _immer1 = require("immer");
 const _pluginsystem = require("@perses-dev/plugin-system");
-const _core = require("@perses-dev/core");
 const _spec = require("@perses-dev/spec");
 const _utils = require("./utils");
 const _hydrationUtils = require("./hydrationUtils");
@@ -204,7 +203,7 @@ function PluginProvider({ children, builtinVariables }) {
                 kind: 'BuiltinVariable',
                 spec: {
                     name: '__range',
-                    value: ()=>(0, _spec.formatDuration)((0, _core.intervalToPrometheusDuration)(absoluteTimeRange)),
+                    value: ()=>(0, _spec.formatDuration)((0, _spec.intervalToDuration)(absoluteTimeRange)),
                     source: 'Dashboard',
                     display: {
                         name: '__range',
@@ -258,8 +257,12 @@ function PluginProvider({ children, builtinVariables }) {
         })
     });
 }
-function createVariableDefinitionStore({ initialVariableDefinitions = [], externalVariableDefinitions = [], queryParams }) {
-    const initialParams = (0, _queryparams.getInitalValuesFromQueryParameters)(queryParams ? queryParams[0] : {});
+function createVariableDefinitionStore({ initialVariableDefinitions = [], externalVariableDefinitions = [], queryParams, initialVariableValues }) {
+    const queryParamValues = (0, _queryparams.getInitalValuesFromQueryParameters)(queryParams ? queryParams[0] : {});
+    const initialParams = {
+        ...queryParamValues,
+        ...initialVariableValues
+    };
     const store = (0, _zustand.createStore)()((0, _middleware.devtools)((0, _immer.immer)((set, get)=>({
             variableState: (0, _hydrationUtils.hydrateVariableDefinitionStates)(initialVariableDefinitions, initialParams, externalVariableDefinitions),
             variableDefinitions: initialVariableDefinitions,
@@ -365,10 +368,11 @@ function createVariableDefinitionStore({ initialVariableDefinitions = [], extern
         }))));
     return store;
 }
-function VariableProvider({ children, initialVariableDefinitions = [], externalVariableDefinitions = [], builtinVariableDefinitions = [] }) {
+function VariableProvider({ children, initialVariableDefinitions = [], externalVariableDefinitions = [], builtinVariableDefinitions = [], initialVariableValues }) {
     const [store] = (0, _react.useState)(()=>createVariableDefinitionStore({
             initialVariableDefinitions,
-            externalVariableDefinitions
+            externalVariableDefinitions,
+            initialVariableValues
         }));
     return /*#__PURE__*/ (0, _jsxruntime.jsx)(VariableDefinitionStoreContext.Provider, {
         value: store,

package/dist/cjs/index.js

@@ -19,6 +19,7 @@ _export_star(require("./context"), exports);
 _export_star(require("./keyboard-shortcuts"), exports);
 _export_star(require("./views"), exports);
 _export_star(require("./model"), exports);
+_export_star(require("./constants"), exports);
 function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {
         if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {

package/dist/cjs/keyboard-shortcuts/index.js

@@ -30,6 +30,9 @@ _export(exports, {
     get buildShortcutOptions () {
         return _utils.buildShortcutOptions;
     },
+    get createModEnterHandler () {
+        return _utils.createModEnterHandler;
+    },
     get dispatchShortcutEvent () {
         return _utils.dispatchShortcutEvent;
     },

package/dist/cjs/keyboard-shortcuts/utils.js

@@ -24,6 +24,9 @@ _export(exports, {
     get buildShortcutOptions () {
         return buildShortcutOptions;
     },
+    get createModEnterHandler () {
+        return createModEnterHandler;
+    },
     get dispatchShortcutEvent () {
         return dispatchShortcutEvent;
     },
@@ -74,3 +77,11 @@ function requireShortcutEvent(def) {
 function dispatchShortcutEvent(eventName) {
     window.dispatchEvent(new CustomEvent(eventName));
 }
+function createModEnterHandler(execute) {
+    return (event)=>{
+        if (event.key === 'Enter' && (event.ctrlKey || event.metaKey) && !event.shiftKey && !event.altKey) {
+            event.preventDefault();
+            execute();
+        }
+    };
+}

package/dist/cjs/model/PanelGroupDefinition.js

@@ -0,0 +1,25 @@
+// Copyright 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, "isPanelGroupItemIdEqual", {
+    enumerable: true,
+    get: function() {
+        return isPanelGroupItemIdEqual;
+    }
+});
+function isPanelGroupItemIdEqual(a, b) {
+    return a?.panelGroupId === b?.panelGroupId && a?.panelGroupItemLayoutId === b?.panelGroupItemLayoutId;
+}

package/dist/cjs/model/VariableDefinition.js

@@ -0,0 +1,16 @@
+// Copyright 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
+});

package/dist/cjs/model/index.js

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

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

@@ -22,18 +22,18 @@ Object.defineProperty(exports, "ViewDashboard", {
 });
 const _jsxruntime = require("react/jsx-runtime");
 const _material = require("@mui/material");
-const _core = require("@perses-dev/core");
 const _components = require("@perses-dev/components");
 const _pluginsystem = require("@perses-dev/plugin-system");
 const _react = require("react");
+const _constants = require("../../constants");
 const _context = require("../../context");
 const _DashboardProviderWithQueryParams = require("../../context/DashboardProvider/DashboardProviderWithQueryParams");
 const _DashboardApp = require("./DashboardApp");
 function ViewDashboard(props) {
     const { dashboardResource, datasourceApi, externalVariableDefinitions, emptyDashboardProps, isReadonly, isVariableEnabled, isDatasourceEnabled, disableShortcuts, isEditing, isCreating, isInitialVariableSticky, isLeavingConfirmDialogEnabled, dashboardTitleComponent, onSave, onDiscard, sx, ...others } = props;
     const { spec } = dashboardResource;
-    const dashboardDuration = spec.duration ?? _core.DEFAULT_DASHBOARD_DURATION;
-    const dashboardRefreshInterval = spec.refreshInterval ?? _core.DEFAULT_REFRESH_INTERVAL;
+    const dashboardDuration = spec.duration ?? _constants.DEFAULT_DASHBOARD_DURATION;
+    const dashboardRefreshInterval = spec.refreshInterval ?? _constants.DEFAULT_REFRESH_INTERVAL;
     const initialTimeRange = (0, _pluginsystem.useInitialTimeRange)(dashboardDuration);
     const initialRefreshInterval = (0, _pluginsystem.useInitialRefreshInterval)(dashboardRefreshInterval);
     const { data } = (0, _pluginsystem.usePluginBuiltinVariableDefinitions)();

package/dist/components/AddGroupButton/AddGroupButton.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 // Copyright 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.
@@ -10,7 +11,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.
-import { jsx as _jsx } from "react/jsx-runtime";
 import { Button } from '@mui/material';
 import AddGroupIcon from 'mdi-material-ui/PlusBoxOutline';
 import { InfoTooltip } from '@perses-dev/components';

package/dist/components/AddGroupButton/AddGroupButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/AddGroupButton/AddGroupButton.tsx"],"sourcesContent":["// Copyright 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 { Button } from '@mui/material';\nimport AddGroupIcon from 'mdi-material-ui/PlusBoxOutline';\nimport { InfoTooltip } from '@perses-dev/components';\nimport { ReactElement } from 'react';\nimport { TOOLTIP_TEXT, editButtonStyle } from '../../constants';\nimport { useDashboardActions } from '../../context';\n\nexport const AddGroupButton = (): ReactElement => {\n  const { openAddPanelGroup } = useDashboardActions();\n\n  return (\n    <InfoTooltip description={TOOLTIP_TEXT.addGroup}>\n      <Button\n        startIcon={<AddGroupIcon />}\n        onClick={openAddPanelGroup}\n        aria-label={TOOLTIP_TEXT.addGroup}\n        sx={editButtonStyle}\n      >\n        Panel Group\n      </Button>\n    </InfoTooltip>\n  );\n};\n"],"names":["Button","AddGroupIcon","InfoTooltip","TOOLTIP_TEXT","editButtonStyle","useDashboardActions","AddGroupButton","openAddPanelGroup","description","addGroup","startIcon","onClick","aria-label","sx"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAEjC,SAASA,MAAM,QAAQ,gBAAgB;AACvC,OAAOC,kBAAkB,iCAAiC;AAC1D,SAASC,WAAW,QAAQ,yBAAyB;AAErD,SAASC,YAAY,EAAEC,eAAe,QAAQ,kBAAkB;AAChE,SAASC,mBAAmB,QAAQ,gBAAgB;AAEpD,OAAO,MAAMC,iBAAiB;IAC5B,MAAM,EAAEC,iBAAiB,EAAE,GAAGF;IAE9B,qBACE,KAACH;QAAYM,aAAaL,aAAaM,QAAQ;kBAC7C,cAAA,KAACT;YACCU,yBAAW,KAACT;YACZU,SAASJ;YACTK,cAAYT,aAAaM,QAAQ;YACjCI,IAAIT;sBACL;;;AAKP,EAAE"}
+{"version":3,"sources":["../../../src/components/AddGroupButton/AddGroupButton.tsx"],"sourcesContent":["// Copyright 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 { Button } from '@mui/material';\nimport AddGroupIcon from 'mdi-material-ui/PlusBoxOutline';\nimport { InfoTooltip } from '@perses-dev/components';\nimport { ReactElement } from 'react';\nimport { TOOLTIP_TEXT, editButtonStyle } from '../../constants';\nimport { useDashboardActions } from '../../context';\n\nexport const AddGroupButton = (): ReactElement => {\n  const { openAddPanelGroup } = useDashboardActions();\n\n  return (\n    <InfoTooltip description={TOOLTIP_TEXT.addGroup}>\n      <Button\n        startIcon={<AddGroupIcon />}\n        onClick={openAddPanelGroup}\n        aria-label={TOOLTIP_TEXT.addGroup}\n        sx={editButtonStyle}\n      >\n        Panel Group\n      </Button>\n    </InfoTooltip>\n  );\n};\n"],"names":["Button","AddGroupIcon","InfoTooltip","TOOLTIP_TEXT","editButtonStyle","useDashboardActions","AddGroupButton","openAddPanelGroup","description","addGroup","startIcon","onClick","aria-label","sx"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,MAAM,QAAQ,gBAAgB;AACvC,OAAOC,kBAAkB,iCAAiC;AAC1D,SAASC,WAAW,QAAQ,yBAAyB;AAErD,SAASC,YAAY,EAAEC,eAAe,QAAQ,kBAAkB;AAChE,SAASC,mBAAmB,QAAQ,gBAAgB;AAEpD,OAAO,MAAMC,iBAAiB;IAC5B,MAAM,EAAEC,iBAAiB,EAAE,GAAGF;IAE9B,qBACE,KAACH;QAAYM,aAAaL,aAAaM,QAAQ;kBAC7C,cAAA,KAACT;YACCU,yBAAW,KAACT;YACZU,SAASJ;YACTK,cAAYT,aAAaM,QAAQ;YACjCI,IAAIT;sBACL;;;AAKP,EAAE"}

package/dist/components/AddPanelButton/AddPanelButton.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 // Copyright 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.
@@ -10,7 +11,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.
-import { jsx as _jsx } from "react/jsx-runtime";
 import { Button } from '@mui/material';
 import AddPanelIcon from 'mdi-material-ui/ChartBoxPlusOutline';
 import { InfoTooltip } from '@perses-dev/components';

package/dist/components/AddPanelButton/AddPanelButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/AddPanelButton/AddPanelButton.tsx"],"sourcesContent":["// Copyright 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 { Button, ButtonProps } from '@mui/material';\nimport AddPanelIcon from 'mdi-material-ui/ChartBoxPlusOutline';\nimport { InfoTooltip } from '@perses-dev/components';\nimport { ReactElement } from 'react';\nimport { TOOLTIP_TEXT, editButtonStyle } from '../../constants';\nimport { useDashboardActions } from '../../context';\n\nexport interface AddPanelButtonProps extends Pick<ButtonProps, 'fullWidth'> {\n  /**\n   * The variant to use to display the button.\n   */\n  variant?: 'text' | 'outlined';\n\n  /**\n   * The color to use to display the button.\n   */\n  color?: 'primary' | 'secondary';\n\n  /**\n   * The label used inside the button.\n   */\n  label?: string;\n}\n\nexport const AddPanelButton = ({\n  variant = 'text',\n  color = 'primary',\n  label = 'Panel',\n  fullWidth,\n}: AddPanelButtonProps): ReactElement => {\n  const { openAddPanel } = useDashboardActions();\n\n  return (\n    <InfoTooltip description={TOOLTIP_TEXT.addPanel}>\n      <Button\n        startIcon={<AddPanelIcon />}\n        onClick={openAddPanel}\n        aria-label={TOOLTIP_TEXT.addPanel}\n        variant={variant}\n        color={color}\n        fullWidth={fullWidth}\n        sx={editButtonStyle}\n      >\n        {label}\n      </Button>\n    </InfoTooltip>\n  );\n};\n"],"names":["Button","AddPanelIcon","InfoTooltip","TOOLTIP_TEXT","editButtonStyle","useDashboardActions","AddPanelButton","variant","color","label","fullWidth","openAddPanel","description","addPanel","startIcon","onClick","aria-label","sx"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAEjC,SAASA,MAAM,QAAqB,gBAAgB;AACpD,OAAOC,kBAAkB,sCAAsC;AAC/D,SAASC,WAAW,QAAQ,yBAAyB;AAErD,SAASC,YAAY,EAAEC,eAAe,QAAQ,kBAAkB;AAChE,SAASC,mBAAmB,QAAQ,gBAAgB;AAmBpD,OAAO,MAAMC,iBAAiB,CAAC,EAC7BC,UAAU,MAAM,EAChBC,QAAQ,SAAS,EACjBC,QAAQ,OAAO,EACfC,SAAS,EACW;IACpB,MAAM,EAAEC,YAAY,EAAE,GAAGN;IAEzB,qBACE,KAACH;QAAYU,aAAaT,aAAaU,QAAQ;kBAC7C,cAAA,KAACb;YACCc,yBAAW,KAACb;YACZc,SAASJ;YACTK,cAAYb,aAAaU,QAAQ;YACjCN,SAASA;YACTC,OAAOA;YACPE,WAAWA;YACXO,IAAIb;sBAEHK;;;AAIT,EAAE"}
+{"version":3,"sources":["../../../src/components/AddPanelButton/AddPanelButton.tsx"],"sourcesContent":["// Copyright 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 { Button, ButtonProps } from '@mui/material';\nimport AddPanelIcon from 'mdi-material-ui/ChartBoxPlusOutline';\nimport { InfoTooltip } from '@perses-dev/components';\nimport { ReactElement } from 'react';\nimport { TOOLTIP_TEXT, editButtonStyle } from '../../constants';\nimport { useDashboardActions } from '../../context';\n\nexport interface AddPanelButtonProps extends Pick<ButtonProps, 'fullWidth'> {\n  /**\n   * The variant to use to display the button.\n   */\n  variant?: 'text' | 'outlined';\n\n  /**\n   * The color to use to display the button.\n   */\n  color?: 'primary' | 'secondary';\n\n  /**\n   * The label used inside the button.\n   */\n  label?: string;\n}\n\nexport const AddPanelButton = ({\n  variant = 'text',\n  color = 'primary',\n  label = 'Panel',\n  fullWidth,\n}: AddPanelButtonProps): ReactElement => {\n  const { openAddPanel } = useDashboardActions();\n\n  return (\n    <InfoTooltip description={TOOLTIP_TEXT.addPanel}>\n      <Button\n        startIcon={<AddPanelIcon />}\n        onClick={openAddPanel}\n        aria-label={TOOLTIP_TEXT.addPanel}\n        variant={variant}\n        color={color}\n        fullWidth={fullWidth}\n        sx={editButtonStyle}\n      >\n        {label}\n      </Button>\n    </InfoTooltip>\n  );\n};\n"],"names":["Button","AddPanelIcon","InfoTooltip","TOOLTIP_TEXT","editButtonStyle","useDashboardActions","AddPanelButton","variant","color","label","fullWidth","openAddPanel","description","addPanel","startIcon","onClick","aria-label","sx"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,MAAM,QAAqB,gBAAgB;AACpD,OAAOC,kBAAkB,sCAAsC;AAC/D,SAASC,WAAW,QAAQ,yBAAyB;AAErD,SAASC,YAAY,EAAEC,eAAe,QAAQ,kBAAkB;AAChE,SAASC,mBAAmB,QAAQ,gBAAgB;AAmBpD,OAAO,MAAMC,iBAAiB,CAAC,EAC7BC,UAAU,MAAM,EAChBC,QAAQ,SAAS,EACjBC,QAAQ,OAAO,EACfC,SAAS,EACW;IACpB,MAAM,EAAEC,YAAY,EAAE,GAAGN;IAEzB,qBACE,KAACH;QAAYU,aAAaT,aAAaU,QAAQ;kBAC7C,cAAA,KAACb;YACCc,yBAAW,KAACb;YACZc,SAASJ;YACTK,cAAYb,aAAaU,QAAQ;YACjCN,SAASA;YACTC,OAAOA;YACPE,WAAWA;YACXO,IAAIb;sBAEHK;;;AAIT,EAAE"}

package/dist/components/Dashboard/Dashboard.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Copyright 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.
@@ -10,7 +11,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.
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box } from '@mui/material';
 import { ErrorBoundary, ErrorAlert } from '@perses-dev/components';
 import { useRef } from 'react';

package/dist/components/Dashboard/Dashboard.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/Dashboard/Dashboard.tsx"],"sourcesContent":["// Copyright 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, BoxProps } from '@mui/material';\nimport { ErrorBoundary, ErrorAlert } from '@perses-dev/components';\nimport { ReactElement, useRef } from 'react';\nimport { usePanelGroupIds } from '../../context';\nimport { GridLayout } from '../GridLayout';\nimport { EmptyDashboard, EmptyDashboardProps } from '../EmptyDashboard';\nimport { PanelOptions } from '../Panel';\n\nexport type DashboardProps = BoxProps & {\n  /**\n   * Props for `EmptyDashboard` component that will be rendered when the dashboard\n   * is empty (i.e. has no panel groups). If not specified, the defaults will\n   * be used.\n   */\n  emptyDashboardProps?: EmptyDashboardProps;\n  panelOptions?: PanelOptions;\n};\nconst HEADER_HEIGHT = 165; // Approximate height of the header in dashboard view (including the navbar and variables toolbar)\n\n/**\n * Renders a Dashboard for the provided Dashboard spec.\n */\nexport function Dashboard({ emptyDashboardProps, panelOptions, ...boxProps }: DashboardProps): ReactElement {\n  const panelGroupIds = usePanelGroupIds();\n  const boxRef = useRef<HTMLDivElement>(null);\n  const isEmpty = !panelGroupIds.length;\n  const dashboardTopPosition = boxRef.current?.getBoundingClientRect().top ?? HEADER_HEIGHT;\n  const panelFullHeight = window.innerHeight - dashboardTopPosition - window.scrollY;\n\n  return (\n    <Box {...boxProps} sx={{ height: '100%' }} ref={boxRef}>\n      <ErrorBoundary FallbackComponent={ErrorAlert}>\n        {isEmpty && (\n          <Box sx={{ height: '100%', display: 'flex', alignItems: 'center' }}>\n            <EmptyDashboard {...emptyDashboardProps} />\n          </Box>\n        )}\n        {!isEmpty &&\n          panelGroupIds.map((panelGroupId) => (\n            <GridLayout\n              key={panelGroupId}\n              panelGroupId={panelGroupId}\n              panelOptions={panelOptions}\n              panelFullHeight={panelFullHeight}\n            />\n          ))}\n      </ErrorBoundary>\n    </Box>\n  );\n}\n"],"names":["Box","ErrorBoundary","ErrorAlert","useRef","usePanelGroupIds","GridLayout","EmptyDashboard","HEADER_HEIGHT","Dashboard","emptyDashboardProps","panelOptions","boxProps","panelGroupIds","boxRef","isEmpty","length","dashboardTopPosition","current","getBoundingClientRect","top","panelFullHeight","window","innerHeight","scrollY","sx","height","ref","FallbackComponent","display","alignItems","map","panelGroupId"],"mappings":"AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAEjC,SAASA,GAAG,QAAkB,gBAAgB;AAC9C,SAASC,aAAa,EAAEC,UAAU,QAAQ,yBAAyB;AACnE,SAAuBC,MAAM,QAAQ,QAAQ;AAC7C,SAASC,gBAAgB,QAAQ,gBAAgB;AACjD,SAASC,UAAU,QAAQ,gBAAgB;AAC3C,SAASC,cAAc,QAA6B,oBAAoB;AAYxE,MAAMC,gBAAgB,KAAK,kGAAkG;AAE7H;;CAEC,GACD,OAAO,SAASC,UAAU,EAAEC,mBAAmB,EAAEC,YAAY,EAAE,GAAGC,UAA0B;IAC1F,MAAMC,gBAAgBR;IACtB,MAAMS,SAASV,OAAuB;IACtC,MAAMW,UAAU,CAACF,cAAcG,MAAM;IACrC,MAAMC,uBAAuBH,OAAOI,OAAO,EAAEC,wBAAwBC,OAAOZ;IAC5E,MAAMa,kBAAkBC,OAAOC,WAAW,GAAGN,uBAAuBK,OAAOE,OAAO;IAElF,qBACE,KAACvB;QAAK,GAAGW,QAAQ;QAAEa,IAAI;YAAEC,QAAQ;QAAO;QAAGC,KAAKb;kBAC9C,cAAA,MAACZ;YAAc0B,mBAAmBzB;;gBAC/BY,yBACC,KAACd;oBAAIwB,IAAI;wBAAEC,QAAQ;wBAAQG,SAAS;wBAAQC,YAAY;oBAAS;8BAC/D,cAAA,KAACvB;wBAAgB,GAAGG,mBAAmB;;;gBAG1C,CAACK,WACAF,cAAckB,GAAG,CAAC,CAACC,6BACjB,KAAC1B;wBAEC0B,cAAcA;wBACdrB,cAAcA;wBACdU,iBAAiBA;uBAHZW;;;;AASnB"}
+{"version":3,"sources":["../../../src/components/Dashboard/Dashboard.tsx"],"sourcesContent":["// Copyright 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, BoxProps } from '@mui/material';\nimport { ErrorBoundary, ErrorAlert } from '@perses-dev/components';\nimport { ReactElement, useRef } from 'react';\nimport { usePanelGroupIds } from '../../context';\nimport { GridLayout } from '../GridLayout';\nimport { EmptyDashboard, EmptyDashboardProps } from '../EmptyDashboard';\nimport { PanelOptions } from '../Panel';\n\nexport type DashboardProps = BoxProps & {\n  /**\n   * Props for `EmptyDashboard` component that will be rendered when the dashboard\n   * is empty (i.e. has no panel groups). If not specified, the defaults will\n   * be used.\n   */\n  emptyDashboardProps?: EmptyDashboardProps;\n  panelOptions?: PanelOptions;\n};\nconst HEADER_HEIGHT = 165; // Approximate height of the header in dashboard view (including the navbar and variables toolbar)\n\n/**\n * Renders a Dashboard for the provided Dashboard spec.\n */\nexport function Dashboard({ emptyDashboardProps, panelOptions, ...boxProps }: DashboardProps): ReactElement {\n  const panelGroupIds = usePanelGroupIds();\n  const boxRef = useRef<HTMLDivElement>(null);\n  const isEmpty = !panelGroupIds.length;\n  const dashboardTopPosition = boxRef.current?.getBoundingClientRect().top ?? HEADER_HEIGHT;\n  const panelFullHeight = window.innerHeight - dashboardTopPosition - window.scrollY;\n\n  return (\n    <Box {...boxProps} sx={{ height: '100%' }} ref={boxRef}>\n      <ErrorBoundary FallbackComponent={ErrorAlert}>\n        {isEmpty && (\n          <Box sx={{ height: '100%', display: 'flex', alignItems: 'center' }}>\n            <EmptyDashboard {...emptyDashboardProps} />\n          </Box>\n        )}\n        {!isEmpty &&\n          panelGroupIds.map((panelGroupId) => (\n            <GridLayout\n              key={panelGroupId}\n              panelGroupId={panelGroupId}\n              panelOptions={panelOptions}\n              panelFullHeight={panelFullHeight}\n            />\n          ))}\n      </ErrorBoundary>\n    </Box>\n  );\n}\n"],"names":["Box","ErrorBoundary","ErrorAlert","useRef","usePanelGroupIds","GridLayout","EmptyDashboard","HEADER_HEIGHT","Dashboard","emptyDashboardProps","panelOptions","boxProps","panelGroupIds","boxRef","isEmpty","length","dashboardTopPosition","current","getBoundingClientRect","top","panelFullHeight","window","innerHeight","scrollY","sx","height","ref","FallbackComponent","display","alignItems","map","panelGroupId"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,GAAG,QAAkB,gBAAgB;AAC9C,SAASC,aAAa,EAAEC,UAAU,QAAQ,yBAAyB;AACnE,SAAuBC,MAAM,QAAQ,QAAQ;AAC7C,SAASC,gBAAgB,QAAQ,gBAAgB;AACjD,SAASC,UAAU,QAAQ,gBAAgB;AAC3C,SAASC,cAAc,QAA6B,oBAAoB;AAYxE,MAAMC,gBAAgB,KAAK,kGAAkG;AAE7H;;CAEC,GACD,OAAO,SAASC,UAAU,EAAEC,mBAAmB,EAAEC,YAAY,EAAE,GAAGC,UAA0B;IAC1F,MAAMC,gBAAgBR;IACtB,MAAMS,SAASV,OAAuB;IACtC,MAAMW,UAAU,CAACF,cAAcG,MAAM;IACrC,MAAMC,uBAAuBH,OAAOI,OAAO,EAAEC,wBAAwBC,OAAOZ;IAC5E,MAAMa,kBAAkBC,OAAOC,WAAW,GAAGN,uBAAuBK,OAAOE,OAAO;IAElF,qBACE,KAACvB;QAAK,GAAGW,QAAQ;QAAEa,IAAI;YAAEC,QAAQ;QAAO;QAAGC,KAAKb;kBAC9C,cAAA,MAACZ;YAAc0B,mBAAmBzB;;gBAC/BY,yBACC,KAACd;oBAAIwB,IAAI;wBAAEC,QAAQ;wBAAQG,SAAS;wBAAQC,YAAY;oBAAS;8BAC/D,cAAA,KAACvB;wBAAgB,GAAGG,mBAAmB;;;gBAG1C,CAACK,WACAF,cAAckB,GAAG,CAAC,CAACC,6BACjB,KAAC1B;wBAEC0B,cAAcA;wBACdrB,cAAcA;wBACdU,iBAAiBA;uBAHZW;;;;AASnB"}

package/dist/components/DashboardLinks/DashboardLinksEditor.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 // Copyright 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.
@@ -10,7 +11,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.
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from 'react';
 import { Button, Stack, Box, Typography, IconButton, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Collapse } from '@mui/material';
 import AddIcon from 'mdi-material-ui/Plus';

package/dist/components/DashboardLinks/DashboardLinksEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/DashboardLinks/DashboardLinksEditor.tsx"],"sourcesContent":["// Copyright 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 { useState, ReactElement } from 'react';\nimport {\n  Button,\n  Stack,\n  Box,\n  Typography,\n  IconButton,\n  Table,\n  TableBody,\n  TableCell,\n  TableContainer,\n  TableHead,\n  TableRow,\n  Collapse,\n} from '@mui/material';\nimport AddIcon from 'mdi-material-ui/Plus';\nimport TrashIcon from 'mdi-material-ui/TrashCan';\nimport ArrowUp from 'mdi-material-ui/ArrowUp';\nimport ArrowDown from 'mdi-material-ui/ArrowDown';\nimport PencilIcon from 'mdi-material-ui/Pencil';\nimport ChevronUp from 'mdi-material-ui/ChevronUp';\nimport { Link } from '@perses-dev/spec';\nimport { useImmer } from 'use-immer';\nimport { InfoTooltip, LinkEditorForm } from '@perses-dev/components';\nimport { useDiscardChangesConfirmationDialog } from '../../context';\n\nexport interface DashboardLinksEditorProps {\n  links: Link[];\n  onChange: (links: Link[]) => void;\n  onCancel: () => void;\n}\n\nconst DEFAULT_LINK: Link = {\n  url: '',\n  name: '',\n  tooltip: '',\n  renderVariables: true,\n  targetBlank: true,\n};\n\nexport function DashboardLinksEditor({\n  links: initialLinks,\n  onChange,\n  onCancel,\n}: DashboardLinksEditorProps): ReactElement {\n  const [links, setLinks] = useImmer(initialLinks);\n  const [expandedIndex, setExpandedIndex] = useState<number | null>(null);\n\n  const { openDiscardChangesConfirmationDialog, closeDiscardChangesConfirmationDialog } =\n    useDiscardChangesConfirmationDialog();\n\n  const handleCancel = (): void => {\n    if (JSON.stringify(initialLinks) !== JSON.stringify(links)) {\n      openDiscardChangesConfirmationDialog({\n        onDiscardChanges: () => {\n          closeDiscardChangesConfirmationDialog();\n          onCancel();\n        },\n        onCancel: closeDiscardChangesConfirmationDialog,\n      });\n    } else {\n      onCancel();\n    }\n  };\n\n  const handleAdd = (): void => {\n    setLinks((draft) => {\n      draft.push({ ...DEFAULT_LINK });\n    });\n    setExpandedIndex(links.length);\n  };\n\n  const handleRemove = (index: number): void => {\n    setLinks((draft) => {\n      draft.splice(index, 1);\n    });\n    if (expandedIndex === index) {\n      setExpandedIndex(null);\n    } else if (expandedIndex !== null && expandedIndex > index) {\n      setExpandedIndex(expandedIndex - 1);\n    }\n  };\n\n  const handleMoveUp = (index: number): void => {\n    if (index === 0) return;\n    setLinks((draft) => {\n      const temp = draft[index - 1];\n      if (temp && draft[index]) {\n        draft[index - 1] = draft[index]!;\n        draft[index] = temp;\n      }\n    });\n    if (expandedIndex === index) {\n      setExpandedIndex(index - 1);\n    } else if (expandedIndex === index - 1) {\n      setExpandedIndex(index);\n    }\n  };\n\n  const handleMoveDown = (index: number): void => {\n    if (index >= links.length - 1) return;\n    setLinks((draft) => {\n      const temp = draft[index + 1];\n      if (temp && draft[index]) {\n        draft[index + 1] = draft[index]!;\n        draft[index] = temp;\n      }\n    });\n    if (expandedIndex === index) {\n      setExpandedIndex(index + 1);\n    } else if (expandedIndex === index + 1) {\n      setExpandedIndex(index);\n    }\n  };\n\n  const handleUpdateLink = (index: number, link: Link): void => {\n    setLinks((draft) => {\n      draft[index] = link;\n    });\n  };\n\n  const isValid = links.every((link) => link.url.trim().length > 0);\n\n  return (\n    <>\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          padding: (theme) => theme.spacing(1, 2),\n          borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n        }}\n      >\n        <Typography variant=\"h2\">Edit Dashboard Links</Typography>\n        <Stack direction=\"row\" spacing={1} marginLeft=\"auto\">\n          <Button disabled={!isValid} variant=\"contained\" onClick={() => onChange(links)}>\n            Apply\n          </Button>\n          <Button color=\"secondary\" variant=\"outlined\" onClick={handleCancel}>\n            Cancel\n          </Button>\n        </Stack>\n      </Box>\n      <Box padding={2} sx={{ overflowY: 'scroll' }}>\n        <Stack spacing={2}>\n          <TableContainer>\n            <Table size=\"small\" sx={{ tableLayout: 'fixed', width: '100%' }} aria-label=\"table of dashboard links\">\n              <TableHead>\n                <TableRow>\n                  <TableCell>Name</TableCell>\n                  <TableCell>URL</TableCell>\n                  <TableCell width={80}>New Tab</TableCell>\n                  <TableCell align=\"right\" width={180}>\n                    Actions\n                  </TableCell>\n                </TableRow>\n              </TableHead>\n              <TableBody>\n                {links.map((link, index) => (\n                  <LinkTableRow\n                    key={index}\n                    link={link}\n                    index={index}\n                    isFirst={index === 0}\n                    isLast={index === links.length - 1}\n                    isExpanded={expandedIndex === index}\n                    onToggleExpand={() => setExpandedIndex(expandedIndex === index ? null : index)}\n                    onUpdate={(updatedLink) => handleUpdateLink(index, updatedLink)}\n                    onRemove={() => handleRemove(index)}\n                    onMoveUp={() => handleMoveUp(index)}\n                    onMoveDown={() => handleMoveDown(index)}\n                  />\n                ))}\n              </TableBody>\n            </Table>\n          </TableContainer>\n          {links.length === 0 && (\n            <Typography variant=\"body1\" color=\"text.secondary\" fontStyle=\"italic\" textAlign=\"center\" py={4}>\n              No links defined. Click &apos;Add Link&apos; to create one.\n            </Typography>\n          )}\n          <Button variant=\"contained\" startIcon={<AddIcon />} onClick={handleAdd} sx={{ alignSelf: 'flex-start' }}>\n            Add Link\n          </Button>\n        </Stack>\n      </Box>\n    </>\n  );\n}\n\ninterface LinkTableRowProps {\n  link: Link;\n  index: number;\n  isFirst: boolean;\n  isLast: boolean;\n  isExpanded: boolean;\n  onToggleExpand: () => void;\n  onUpdate: (link: Link) => void;\n  onRemove: () => void;\n  onMoveUp: () => void;\n  onMoveDown: () => void;\n}\n\nfunction LinkTableRow({\n  link,\n  index,\n  isFirst,\n  isLast,\n  isExpanded,\n  onToggleExpand,\n  onUpdate,\n  onRemove,\n  onMoveUp,\n  onMoveDown,\n}: LinkTableRowProps): ReactElement {\n  const displayName = link.name?.trim() || `Link ${index + 1}`;\n  const hasError = link.url.trim().length === 0;\n\n  return (\n    <>\n      <TableRow>\n        <TableCell component=\"th\" scope=\"row\" sx={{ fontWeight: 'bold', overflow: 'hidden', textOverflow: 'ellipsis' }}>\n          {displayName}\n        </TableCell>\n        <TableCell\n          sx={{\n            overflow: 'hidden',\n            textOverflow: 'ellipsis',\n            whiteSpace: 'nowrap',\n            color: hasError ? 'error.main' : undefined,\n          }}\n        >\n          <InfoTooltip description={link.url} enterDelay={100}>\n            {link.url || '(no URL)'}\n          </InfoTooltip>\n        </TableCell>\n        <TableCell>{link.targetBlank ? 'Yes' : 'No'}</TableCell>\n        <TableCell align=\"right\" sx={{ whiteSpace: 'nowrap' }}>\n          <IconButton onClick={onMoveUp} disabled={isFirst} aria-label=\"Move link up\">\n            <ArrowUp />\n          </IconButton>\n          <IconButton onClick={onMoveDown} disabled={isLast} aria-label=\"Move link down\">\n            <ArrowDown />\n          </IconButton>\n          <IconButton onClick={onToggleExpand} aria-label={isExpanded ? 'Collapse link editor' : 'Edit link'}>\n            {isExpanded ? <ChevronUp /> : <PencilIcon />}\n          </IconButton>\n          <IconButton onClick={onRemove} aria-label=\"Remove link\">\n            <TrashIcon />\n          </IconButton>\n        </TableCell>\n      </TableRow>\n      <TableRow>\n        <TableCell colSpan={4} sx={{ paddingBottom: 0, paddingTop: 0, border: isExpanded ? undefined : 'none' }}>\n          <Collapse in={isExpanded} timeout=\"auto\" unmountOnExit>\n            <Box sx={{ margin: 2 }}>\n              <LinkEditorForm\n                mode=\"modalEmbedded\"\n                url={{\n                  value: link.url,\n                  label: 'URL',\n                  error: { hasError: hasError, helperText: hasError ? 'URL is required' : undefined },\n                  placeholder: 'https://example.com/dashboard?var=$variable',\n                  onChange: (url) => onUpdate({ ...link, url }),\n                }}\n                name={{\n                  value: link.name ?? '',\n                  label: 'Display Name',\n                  onChange: (name) => onUpdate({ ...link, name }),\n                }}\n                tooltip={{\n                  value: link.tooltip ?? '',\n                  label: 'Tooltip',\n                  onChange: (tooltip) => onUpdate({ ...link, tooltip }),\n                }}\n                renderVariables={{\n                  value: link.renderVariables ?? true,\n                  label: 'Replace variables in URL',\n                  onChange: (renderVariables) => onUpdate({ ...link, renderVariables }),\n                }}\n                newTabOpen={{\n                  value: link.targetBlank ?? true,\n                  label: 'Open in new tab',\n                  onChange: (targetBlank) => onUpdate({ ...link, targetBlank }),\n                }}\n              />\n            </Box>\n          </Collapse>\n        </TableCell>\n      </TableRow>\n    </>\n  );\n}\n"],"names":["useState","Button","Stack","Box","Typography","IconButton","Table","TableBody","TableCell","TableContainer","TableHead","TableRow","Collapse","AddIcon","TrashIcon","ArrowUp","ArrowDown","PencilIcon","ChevronUp","useImmer","InfoTooltip","LinkEditorForm","useDiscardChangesConfirmationDialog","DEFAULT_LINK","url","name","tooltip","renderVariables","targetBlank","DashboardLinksEditor","links","initialLinks","onChange","onCancel","setLinks","expandedIndex","setExpandedIndex","openDiscardChangesConfirmationDialog","closeDiscardChangesConfirmationDialog","handleCancel","JSON","stringify","onDiscardChanges","handleAdd","draft","push","length","handleRemove","index","splice","handleMoveUp","temp","handleMoveDown","handleUpdateLink","link","isValid","every","trim","sx","display","alignItems","padding","theme","spacing","borderBottom","palette","divider","variant","direction","marginLeft","disabled","onClick","color","overflowY","size","tableLayout","width","aria-label","align","map","LinkTableRow","isFirst","isLast","isExpanded","onToggleExpand","onUpdate","updatedLink","onRemove","onMoveUp","onMoveDown","fontStyle","textAlign","py","startIcon","alignSelf","displayName","hasError","component","scope","fontWeight","overflow","textOverflow","whiteSpace","undefined","description","enterDelay","colSpan","paddingBottom","paddingTop","border","in","timeout","unmountOnExit","margin","mode","value","label","error","helperText","placeholder","newTabOpen"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/DashboardLinks/DashboardLinksEditor.tsx"],"sourcesContent":["// Copyright 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 { useState, ReactElement } from 'react';\nimport {\n  Button,\n  Stack,\n  Box,\n  Typography,\n  IconButton,\n  Table,\n  TableBody,\n  TableCell,\n  TableContainer,\n  TableHead,\n  TableRow,\n  Collapse,\n} from '@mui/material';\nimport AddIcon from 'mdi-material-ui/Plus';\nimport TrashIcon from 'mdi-material-ui/TrashCan';\nimport ArrowUp from 'mdi-material-ui/ArrowUp';\nimport ArrowDown from 'mdi-material-ui/ArrowDown';\nimport PencilIcon from 'mdi-material-ui/Pencil';\nimport ChevronUp from 'mdi-material-ui/ChevronUp';\nimport { Link } from '@perses-dev/spec';\nimport { useImmer } from 'use-immer';\nimport { InfoTooltip, LinkEditorForm } from '@perses-dev/components';\nimport { useDiscardChangesConfirmationDialog } from '../../context';\n\nexport interface DashboardLinksEditorProps {\n  links: Link[];\n  onChange: (links: Link[]) => void;\n  onCancel: () => void;\n}\n\nconst DEFAULT_LINK: Link = {\n  url: '',\n  name: '',\n  tooltip: '',\n  renderVariables: true,\n  targetBlank: true,\n};\n\nexport function DashboardLinksEditor({\n  links: initialLinks,\n  onChange,\n  onCancel,\n}: DashboardLinksEditorProps): ReactElement {\n  const [links, setLinks] = useImmer(initialLinks);\n  const [expandedIndex, setExpandedIndex] = useState<number | null>(null);\n\n  const { openDiscardChangesConfirmationDialog, closeDiscardChangesConfirmationDialog } =\n    useDiscardChangesConfirmationDialog();\n\n  const handleCancel = (): void => {\n    if (JSON.stringify(initialLinks) !== JSON.stringify(links)) {\n      openDiscardChangesConfirmationDialog({\n        onDiscardChanges: () => {\n          closeDiscardChangesConfirmationDialog();\n          onCancel();\n        },\n        onCancel: closeDiscardChangesConfirmationDialog,\n      });\n    } else {\n      onCancel();\n    }\n  };\n\n  const handleAdd = (): void => {\n    setLinks((draft) => {\n      draft.push({ ...DEFAULT_LINK });\n    });\n    setExpandedIndex(links.length);\n  };\n\n  const handleRemove = (index: number): void => {\n    setLinks((draft) => {\n      draft.splice(index, 1);\n    });\n    if (expandedIndex === index) {\n      setExpandedIndex(null);\n    } else if (expandedIndex !== null && expandedIndex > index) {\n      setExpandedIndex(expandedIndex - 1);\n    }\n  };\n\n  const handleMoveUp = (index: number): void => {\n    if (index === 0) return;\n    setLinks((draft) => {\n      const temp = draft[index - 1];\n      if (temp && draft[index]) {\n        draft[index - 1] = draft[index]!;\n        draft[index] = temp;\n      }\n    });\n    if (expandedIndex === index) {\n      setExpandedIndex(index - 1);\n    } else if (expandedIndex === index - 1) {\n      setExpandedIndex(index);\n    }\n  };\n\n  const handleMoveDown = (index: number): void => {\n    if (index >= links.length - 1) return;\n    setLinks((draft) => {\n      const temp = draft[index + 1];\n      if (temp && draft[index]) {\n        draft[index + 1] = draft[index]!;\n        draft[index] = temp;\n      }\n    });\n    if (expandedIndex === index) {\n      setExpandedIndex(index + 1);\n    } else if (expandedIndex === index + 1) {\n      setExpandedIndex(index);\n    }\n  };\n\n  const handleUpdateLink = (index: number, link: Link): void => {\n    setLinks((draft) => {\n      draft[index] = link;\n    });\n  };\n\n  const isValid = links.every((link) => link.url.trim().length > 0);\n\n  return (\n    <>\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          padding: (theme) => theme.spacing(1, 2),\n          borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n        }}\n      >\n        <Typography variant=\"h2\">Edit Dashboard Links</Typography>\n        <Stack direction=\"row\" spacing={1} marginLeft=\"auto\">\n          <Button disabled={!isValid} variant=\"contained\" onClick={() => onChange(links)}>\n            Apply\n          </Button>\n          <Button color=\"secondary\" variant=\"outlined\" onClick={handleCancel}>\n            Cancel\n          </Button>\n        </Stack>\n      </Box>\n      <Box padding={2} sx={{ overflowY: 'scroll' }}>\n        <Stack spacing={2}>\n          <TableContainer>\n            <Table size=\"small\" sx={{ tableLayout: 'fixed', width: '100%' }} aria-label=\"table of dashboard links\">\n              <TableHead>\n                <TableRow>\n                  <TableCell>Name</TableCell>\n                  <TableCell>URL</TableCell>\n                  <TableCell width={80}>New Tab</TableCell>\n                  <TableCell align=\"right\" width={180}>\n                    Actions\n                  </TableCell>\n                </TableRow>\n              </TableHead>\n              <TableBody>\n                {links.map((link, index) => (\n                  <LinkTableRow\n                    key={index}\n                    link={link}\n                    index={index}\n                    isFirst={index === 0}\n                    isLast={index === links.length - 1}\n                    isExpanded={expandedIndex === index}\n                    onToggleExpand={() => setExpandedIndex(expandedIndex === index ? null : index)}\n                    onUpdate={(updatedLink) => handleUpdateLink(index, updatedLink)}\n                    onRemove={() => handleRemove(index)}\n                    onMoveUp={() => handleMoveUp(index)}\n                    onMoveDown={() => handleMoveDown(index)}\n                  />\n                ))}\n              </TableBody>\n            </Table>\n          </TableContainer>\n          {links.length === 0 && (\n            <Typography variant=\"body1\" color=\"text.secondary\" fontStyle=\"italic\" textAlign=\"center\" py={4}>\n              No links defined. Click &apos;Add Link&apos; to create one.\n            </Typography>\n          )}\n          <Button variant=\"contained\" startIcon={<AddIcon />} onClick={handleAdd} sx={{ alignSelf: 'flex-start' }}>\n            Add Link\n          </Button>\n        </Stack>\n      </Box>\n    </>\n  );\n}\n\ninterface LinkTableRowProps {\n  link: Link;\n  index: number;\n  isFirst: boolean;\n  isLast: boolean;\n  isExpanded: boolean;\n  onToggleExpand: () => void;\n  onUpdate: (link: Link) => void;\n  onRemove: () => void;\n  onMoveUp: () => void;\n  onMoveDown: () => void;\n}\n\nfunction LinkTableRow({\n  link,\n  index,\n  isFirst,\n  isLast,\n  isExpanded,\n  onToggleExpand,\n  onUpdate,\n  onRemove,\n  onMoveUp,\n  onMoveDown,\n}: LinkTableRowProps): ReactElement {\n  const displayName = link.name?.trim() || `Link ${index + 1}`;\n  const hasError = link.url.trim().length === 0;\n\n  return (\n    <>\n      <TableRow>\n        <TableCell component=\"th\" scope=\"row\" sx={{ fontWeight: 'bold', overflow: 'hidden', textOverflow: 'ellipsis' }}>\n          {displayName}\n        </TableCell>\n        <TableCell\n          sx={{\n            overflow: 'hidden',\n            textOverflow: 'ellipsis',\n            whiteSpace: 'nowrap',\n            color: hasError ? 'error.main' : undefined,\n          }}\n        >\n          <InfoTooltip description={link.url} enterDelay={100}>\n            {link.url || '(no URL)'}\n          </InfoTooltip>\n        </TableCell>\n        <TableCell>{link.targetBlank ? 'Yes' : 'No'}</TableCell>\n        <TableCell align=\"right\" sx={{ whiteSpace: 'nowrap' }}>\n          <IconButton onClick={onMoveUp} disabled={isFirst} aria-label=\"Move link up\">\n            <ArrowUp />\n          </IconButton>\n          <IconButton onClick={onMoveDown} disabled={isLast} aria-label=\"Move link down\">\n            <ArrowDown />\n          </IconButton>\n          <IconButton onClick={onToggleExpand} aria-label={isExpanded ? 'Collapse link editor' : 'Edit link'}>\n            {isExpanded ? <ChevronUp /> : <PencilIcon />}\n          </IconButton>\n          <IconButton onClick={onRemove} aria-label=\"Remove link\">\n            <TrashIcon />\n          </IconButton>\n        </TableCell>\n      </TableRow>\n      <TableRow>\n        <TableCell colSpan={4} sx={{ paddingBottom: 0, paddingTop: 0, border: isExpanded ? undefined : 'none' }}>\n          <Collapse in={isExpanded} timeout=\"auto\" unmountOnExit>\n            <Box sx={{ margin: 2 }}>\n              <LinkEditorForm\n                mode=\"modalEmbedded\"\n                url={{\n                  value: link.url,\n                  label: 'URL',\n                  error: { hasError: hasError, helperText: hasError ? 'URL is required' : undefined },\n                  placeholder: 'https://example.com/dashboard?var=$variable',\n                  onChange: (url) => onUpdate({ ...link, url }),\n                }}\n                name={{\n                  value: link.name ?? '',\n                  label: 'Display Name',\n                  onChange: (name) => onUpdate({ ...link, name }),\n                }}\n                tooltip={{\n                  value: link.tooltip ?? '',\n                  label: 'Tooltip',\n                  onChange: (tooltip) => onUpdate({ ...link, tooltip }),\n                }}\n                renderVariables={{\n                  value: link.renderVariables ?? true,\n                  label: 'Replace variables in URL',\n                  onChange: (renderVariables) => onUpdate({ ...link, renderVariables }),\n                }}\n                newTabOpen={{\n                  value: link.targetBlank ?? true,\n                  label: 'Open in new tab',\n                  onChange: (targetBlank) => onUpdate({ ...link, targetBlank }),\n                }}\n              />\n            </Box>\n          </Collapse>\n        </TableCell>\n      </TableRow>\n    </>\n  );\n}\n"],"names":["useState","Button","Stack","Box","Typography","IconButton","Table","TableBody","TableCell","TableContainer","TableHead","TableRow","Collapse","AddIcon","TrashIcon","ArrowUp","ArrowDown","PencilIcon","ChevronUp","useImmer","InfoTooltip","LinkEditorForm","useDiscardChangesConfirmationDialog","DEFAULT_LINK","url","name","tooltip","renderVariables","targetBlank","DashboardLinksEditor","links","initialLinks","onChange","onCancel","setLinks","expandedIndex","setExpandedIndex","openDiscardChangesConfirmationDialog","closeDiscardChangesConfirmationDialog","handleCancel","JSON","stringify","onDiscardChanges","handleAdd","draft","push","length","handleRemove","index","splice","handleMoveUp","temp","handleMoveDown","handleUpdateLink","link","isValid","every","trim","sx","display","alignItems","padding","theme","spacing","borderBottom","palette","divider","variant","direction","marginLeft","disabled","onClick","color","overflowY","size","tableLayout","width","aria-label","align","map","LinkTableRow","isFirst","isLast","isExpanded","onToggleExpand","onUpdate","updatedLink","onRemove","onMoveUp","onMoveDown","fontStyle","textAlign","py","startIcon","alignSelf","displayName","hasError","component","scope","fontWeight","overflow","textOverflow","whiteSpace","undefined","description","enterDelay","colSpan","paddingBottom","paddingTop","border","in","timeout","unmountOnExit","margin","mode","value","label","error","helperText","placeholder","newTabOpen"],"mappings":"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"}

package/dist/components/DashboardLinks/EditDashboardLinksButton.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 // Copyright 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.
@@ -10,7 +11,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.
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from 'react';
 import { Button } from '@mui/material';
 import PencilIcon from 'mdi-material-ui/PencilOutline';