@perses-dev/dashboards 0.0.0-snapshot-panel-extra-content-3-17f9c42 → 0.0.0-snapshot-scatter-chart-embed-8efdfab

package/dist/views/ViewDashboard/DashboardApp.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardApp.d.ts","sourceRoot":"","sources":["../../../src/views/ViewDashboard/DashboardApp.tsx"],"names":[],"mappings":";AAgBA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AACrD,OAAO,EAQL,mBAAmB,EAGpB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAkE,MAAM,eAAe,CAAC;AAEhH,MAAM,WAAW,iBAAiB;IAChC,mBAAmB,CAAC,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;IACnD,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,uBAAuB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACtC,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAChD,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,UAAU,EAAE,OAAO,CAAC;CACrB;AAED,eAAO,MAAM,YAAY,UAAW,iBAAiB,gBAwFpD,CAAC"}
+{"version":3,"file":"DashboardApp.d.ts","sourceRoot":"","sources":["../../../src/views/ViewDashboard/DashboardApp.tsx"],"names":[],"mappings":";AAgBA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAErD,OAAO,EAQL,mBAAmB,EAGpB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAkE,MAAM,eAAe,CAAC;AAEhH,MAAM,WAAW,iBAAiB;IAChC,mBAAmB,CAAC,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;IACnD,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,uBAAuB,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACtC,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,SAAS,CAAC,EAAE,CAAC,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;IAChD,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,YAAY,UAAW,iBAAiB,gBAgGpD,CAAC"}

package/dist/views/ViewDashboard/DashboardApp.js

@@ -13,14 +13,17 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { Box } from '@mui/material';
-import { ErrorAlert, ErrorBoundary } from '@perses-dev/components';
+import { ChartsProvider, ErrorAlert, ErrorBoundary, useChartsTheme } from '@perses-dev/components';
+import { useDatasourceStore } from '@perses-dev/plugin-system';
 import { PanelDrawer, Dashboard, PanelGroupDialog, DeletePanelGroupDialog, DashboardDiscardChangesConfirmationDialog, DashboardToolbar, DeletePanelDialog, EditJsonDialog, SaveChangesConfirmationDialog } from '../../components';
 import { useDashboard, useDiscardChangesConfirmationDialog, useEditMode } from '../../context';
 export const DashboardApp = (props)=>{
-    const { dashboardResource , dashboardTitleComponent , emptyDashboardProps , onSave , onDiscard , initialVariableIsSticky , isReadonly ,  } = props;
-    const { setEditMode  } = useEditMode();
+    const { dashboardResource , dashboardTitleComponent , emptyDashboardProps , onSave , onDiscard , initialVariableIsSticky , isReadonly , isCreating  } = props;
+    const chartsTheme = useChartsTheme();
+    const { isEditMode , setEditMode  } = useEditMode();
     const { dashboard , setDashboard  } = useDashboard();
     const [originalDashboard, setOriginalDashboard] = useState(undefined);
+    const { setSavedDatasources  } = useDatasourceStore();
     const { openDiscardChangesConfirmationDialog , closeDiscardChangesConfirmationDialog  } = useDiscardChangesConfirmationDialog();
     const handleDiscardChanges = ()=>{
         // Reset to the original spec and exit edit mode
@@ -36,6 +39,8 @@ export const DashboardApp = (props)=>{
     const onEditButtonClick = ()=>{
         setEditMode(true);
         setOriginalDashboard(dashboard);
+        var _dashboard_spec_datasources;
+        setSavedDatasources((_dashboard_spec_datasources = dashboard.spec.datasources) !== null && _dashboard_spec_datasources !== void 0 ? _dashboard_spec_datasources : {});
     };
     const onCancelButtonClick = ()=>{
         // check if dashboard has been modified
@@ -85,12 +90,19 @@ export const DashboardApp = (props)=>{
                             }
                         })
                     }),
-                    /*#__PURE__*/ _jsx(PanelDrawer, {}),
+                    /*#__PURE__*/ _jsx(ChartsProvider, {
+                        chartsTheme: chartsTheme,
+                        enablePinning: false,
+                        children: /*#__PURE__*/ _jsx(PanelDrawer, {})
+                    }),
                     /*#__PURE__*/ _jsx(PanelGroupDialog, {}),
                     /*#__PURE__*/ _jsx(DeletePanelGroupDialog, {}),
                     /*#__PURE__*/ _jsx(DeletePanelDialog, {}),
                     /*#__PURE__*/ _jsx(DashboardDiscardChangesConfirmationDialog, {}),
-                    /*#__PURE__*/ _jsx(EditJsonDialog, {}),
+                    /*#__PURE__*/ _jsx(EditJsonDialog, {
+                        isReadonly: !isEditMode,
+                        disableMetadataEdition: !isCreating
+                    }),
                     /*#__PURE__*/ _jsx(SaveChangesConfirmationDialog, {})
                 ]
             })

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/views/ViewDashboard/DashboardApp.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { useState } from 'react';\nimport { Box } from '@mui/material';\nimport { ErrorAlert, ErrorBoundary } from '@perses-dev/components';\nimport { DashboardResource } from '@perses-dev/core';\nimport {\n  PanelDrawer,\n  Dashboard,\n  PanelGroupDialog,\n  DeletePanelGroupDialog,\n  DashboardDiscardChangesConfirmationDialog,\n  DashboardToolbar,\n  DeletePanelDialog,\n  EmptyDashboardProps,\n  EditJsonDialog,\n  SaveChangesConfirmationDialog,\n} from '../../components';\nimport { OnSaveDashboard, useDashboard, useDiscardChangesConfirmationDialog, useEditMode } from '../../context';\n\nexport interface DashboardAppProps {\n  emptyDashboardProps?: Partial<EmptyDashboardProps>;\n  dashboardResource: DashboardResource;\n  dashboardTitleComponent?: JSX.Element;\n  onSave?: OnSaveDashboard;\n  onDiscard?: (entity: DashboardResource) => void;\n  initialVariableIsSticky?: boolean;\n  isReadonly: boolean;\n}\n\nexport const DashboardApp = (props: DashboardAppProps) => {\n  const {\n    dashboardResource,\n    dashboardTitleComponent,\n    emptyDashboardProps,\n    onSave,\n    onDiscard,\n    initialVariableIsSticky,\n    isReadonly,\n  } = props;\n  const { setEditMode } = useEditMode();\n  const { dashboard, setDashboard } = useDashboard();\n  const [originalDashboard, setOriginalDashboard] = useState<DashboardResource | undefined>(undefined);\n\n  const { openDiscardChangesConfirmationDialog, closeDiscardChangesConfirmationDialog } =\n    useDiscardChangesConfirmationDialog();\n\n  const handleDiscardChanges = () => {\n    // Reset to the original spec and exit edit mode\n    if (originalDashboard) {\n      setDashboard(originalDashboard);\n    }\n    setEditMode(false);\n    closeDiscardChangesConfirmationDialog();\n    if (onDiscard) {\n      onDiscard(dashboard);\n    }\n  };\n\n  const onEditButtonClick = () => {\n    setEditMode(true);\n    setOriginalDashboard(dashboard);\n  };\n\n  const onCancelButtonClick = () => {\n    // check if dashboard has been modified\n    if (JSON.stringify(dashboard) === JSON.stringify(originalDashboard)) {\n      setEditMode(false);\n    } else {\n      openDiscardChangesConfirmationDialog({\n        onDiscardChanges: () => {\n          handleDiscardChanges();\n        },\n        onCancel: () => {\n          closeDiscardChangesConfirmationDialog();\n        },\n      });\n    }\n  };\n\n  return (\n    <Box\n      sx={{\n        flexGrow: 1,\n        overflowX: 'hidden',\n        overflowY: 'auto',\n        display: 'flex',\n        flexDirection: 'column',\n      }}\n    >\n      <DashboardToolbar\n        dashboardName={dashboardResource.metadata.name}\n        dashboardTitleComponent={dashboardTitleComponent}\n        initialVariableIsSticky={initialVariableIsSticky}\n        onSave={onSave}\n        isReadonly={isReadonly}\n        onEditButtonClick={onEditButtonClick}\n        onCancelButtonClick={onCancelButtonClick}\n      />\n      <Box sx={{ padding: (theme) => theme.spacing(2), height: '100%' }}>\n        <ErrorBoundary FallbackComponent={ErrorAlert}>\n          <Dashboard\n            emptyDashboardProps={{\n              onEditButtonClick,\n              ...emptyDashboardProps,\n            }}\n          />\n        </ErrorBoundary>\n        <PanelDrawer />\n        <PanelGroupDialog />\n        <DeletePanelGroupDialog />\n        <DeletePanelDialog />\n        <DashboardDiscardChangesConfirmationDialog />\n        <EditJsonDialog />\n        <SaveChangesConfirmationDialog />\n      </Box>\n    </Box>\n  );\n};\n"],"names":["useState","Box","ErrorAlert","ErrorBoundary","PanelDrawer","Dashboard","PanelGroupDialog","DeletePanelGroupDialog","DashboardDiscardChangesConfirmationDialog","DashboardToolbar","DeletePanelDialog","EditJsonDialog","SaveChangesConfirmationDialog","useDashboard","useDiscardChangesConfirmationDialog","useEditMode","DashboardApp","props","dashboardResource","dashboardTitleComponent","emptyDashboardProps","onSave","onDiscard","initialVariableIsSticky","isReadonly","setEditMode","dashboard","setDashboard","originalDashboard","setOriginalDashboard","undefined","openDiscardChangesConfirmationDialog","closeDiscardChangesConfirmationDialog","handleDiscardChanges","onEditButtonClick","onCancelButtonClick","JSON","stringify","onDiscardChanges","onCancel","sx","flexGrow","overflowX","overflowY","display","flexDirection","dashboardName","metadata","name","padding","theme","spacing","height","FallbackComponent"],"mappings":"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"}
+{"version":3,"sources":["../../../src/views/ViewDashboard/DashboardApp.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { useState } from 'react';\nimport { Box } from '@mui/material';\nimport { ChartsProvider, ErrorAlert, ErrorBoundary, useChartsTheme } from '@perses-dev/components';\nimport { DashboardResource } from '@perses-dev/core';\nimport { useDatasourceStore } from '@perses-dev/plugin-system';\nimport {\n  PanelDrawer,\n  Dashboard,\n  PanelGroupDialog,\n  DeletePanelGroupDialog,\n  DashboardDiscardChangesConfirmationDialog,\n  DashboardToolbar,\n  DeletePanelDialog,\n  EmptyDashboardProps,\n  EditJsonDialog,\n  SaveChangesConfirmationDialog,\n} from '../../components';\nimport { OnSaveDashboard, useDashboard, useDiscardChangesConfirmationDialog, useEditMode } from '../../context';\n\nexport interface DashboardAppProps {\n  emptyDashboardProps?: Partial<EmptyDashboardProps>;\n  dashboardResource: DashboardResource;\n  dashboardTitleComponent?: JSX.Element;\n  onSave?: OnSaveDashboard;\n  onDiscard?: (entity: DashboardResource) => void;\n  initialVariableIsSticky?: boolean;\n  isReadonly: boolean;\n  isCreating?: boolean;\n}\n\nexport const DashboardApp = (props: DashboardAppProps) => {\n  const {\n    dashboardResource,\n    dashboardTitleComponent,\n    emptyDashboardProps,\n    onSave,\n    onDiscard,\n    initialVariableIsSticky,\n    isReadonly,\n    isCreating,\n  } = props;\n\n  const chartsTheme = useChartsTheme();\n\n  const { isEditMode, setEditMode } = useEditMode();\n  const { dashboard, setDashboard } = useDashboard();\n  const [originalDashboard, setOriginalDashboard] = useState<DashboardResource | undefined>(undefined);\n  const { setSavedDatasources } = useDatasourceStore();\n\n  const { openDiscardChangesConfirmationDialog, closeDiscardChangesConfirmationDialog } =\n    useDiscardChangesConfirmationDialog();\n\n  const handleDiscardChanges = () => {\n    // Reset to the original spec and exit edit mode\n    if (originalDashboard) {\n      setDashboard(originalDashboard);\n    }\n    setEditMode(false);\n    closeDiscardChangesConfirmationDialog();\n    if (onDiscard) {\n      onDiscard(dashboard);\n    }\n  };\n\n  const onEditButtonClick = () => {\n    setEditMode(true);\n    setOriginalDashboard(dashboard);\n    setSavedDatasources(dashboard.spec.datasources ?? {});\n  };\n\n  const onCancelButtonClick = () => {\n    // check if dashboard has been modified\n    if (JSON.stringify(dashboard) === JSON.stringify(originalDashboard)) {\n      setEditMode(false);\n    } else {\n      openDiscardChangesConfirmationDialog({\n        onDiscardChanges: () => {\n          handleDiscardChanges();\n        },\n        onCancel: () => {\n          closeDiscardChangesConfirmationDialog();\n        },\n      });\n    }\n  };\n\n  return (\n    <Box\n      sx={{\n        flexGrow: 1,\n        overflowX: 'hidden',\n        overflowY: 'auto',\n        display: 'flex',\n        flexDirection: 'column',\n      }}\n    >\n      <DashboardToolbar\n        dashboardName={dashboardResource.metadata.name}\n        dashboardTitleComponent={dashboardTitleComponent}\n        initialVariableIsSticky={initialVariableIsSticky}\n        onSave={onSave}\n        isReadonly={isReadonly}\n        onEditButtonClick={onEditButtonClick}\n        onCancelButtonClick={onCancelButtonClick}\n      />\n      <Box sx={{ padding: (theme) => theme.spacing(2), height: '100%' }}>\n        <ErrorBoundary FallbackComponent={ErrorAlert}>\n          <Dashboard\n            emptyDashboardProps={{\n              onEditButtonClick,\n              ...emptyDashboardProps,\n            }}\n          />\n        </ErrorBoundary>\n        <ChartsProvider chartsTheme={chartsTheme} enablePinning={false}>\n          <PanelDrawer />\n        </ChartsProvider>\n        <PanelGroupDialog />\n        <DeletePanelGroupDialog />\n        <DeletePanelDialog />\n        <DashboardDiscardChangesConfirmationDialog />\n        <EditJsonDialog isReadonly={!isEditMode} disableMetadataEdition={!isCreating} />\n        <SaveChangesConfirmationDialog />\n      </Box>\n    </Box>\n  );\n};\n"],"names":["useState","Box","ChartsProvider","ErrorAlert","ErrorBoundary","useChartsTheme","useDatasourceStore","PanelDrawer","Dashboard","PanelGroupDialog","DeletePanelGroupDialog","DashboardDiscardChangesConfirmationDialog","DashboardToolbar","DeletePanelDialog","EditJsonDialog","SaveChangesConfirmationDialog","useDashboard","useDiscardChangesConfirmationDialog","useEditMode","DashboardApp","props","dashboardResource","dashboardTitleComponent","emptyDashboardProps","onSave","onDiscard","initialVariableIsSticky","isReadonly","isCreating","chartsTheme","isEditMode","setEditMode","dashboard","setDashboard","originalDashboard","setOriginalDashboard","undefined","setSavedDatasources","openDiscardChangesConfirmationDialog","closeDiscardChangesConfirmationDialog","handleDiscardChanges","onEditButtonClick","spec","datasources","onCancelButtonClick","JSON","stringify","onDiscardChanges","onCancel","sx","flexGrow","overflowX","overflowY","display","flexDirection","dashboardName","metadata","name","padding","theme","spacing","height","FallbackComponent","enablePinning","disableMetadataEdition"],"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,SAASA,QAAQ,QAAQ,QAAQ;AACjC,SAASC,GAAG,QAAQ,gBAAgB;AACpC,SAASC,cAAc,EAAEC,UAAU,EAAEC,aAAa,EAAEC,cAAc,QAAQ,yBAAyB;AAEnG,SAASC,kBAAkB,QAAQ,4BAA4B;AAC/D,SACEC,WAAW,EACXC,SAAS,EACTC,gBAAgB,EAChBC,sBAAsB,EACtBC,yCAAyC,EACzCC,gBAAgB,EAChBC,iBAAiB,EAEjBC,cAAc,EACdC,6BAA6B,QACxB,mBAAmB;AAC1B,SAA0BC,YAAY,EAAEC,mCAAmC,EAAEC,WAAW,QAAQ,gBAAgB;AAahH,OAAO,MAAMC,eAAe,CAACC;IAC3B,MAAM,EACJC,kBAAiB,EACjBC,wBAAuB,EACvBC,oBAAmB,EACnBC,OAAM,EACNC,UAAS,EACTC,wBAAuB,EACvBC,WAAU,EACVC,WAAU,EACX,GAAGR;IAEJ,MAAMS,cAAcxB;IAEpB,MAAM,EAAEyB,WAAU,EAAEC,YAAW,EAAE,GAAGb;IACpC,MAAM,EAAEc,UAAS,EAAEC,aAAY,EAAE,GAAGjB;IACpC,MAAM,CAACkB,mBAAmBC,qBAAqB,GAAGnC,SAAwCoC;IAC1F,MAAM,EAAEC,oBAAmB,EAAE,GAAG/B;IAEhC,MAAM,EAAEgC,qCAAoC,EAAEC,sCAAqC,EAAE,GACnFtB;IAEF,MAAMuB,uBAAuB;QAC3B,gDAAgD;QAChD,IAAIN,mBAAmB;YACrBD,aAAaC;QACf;QACAH,YAAY;QACZQ;QACA,IAAId,WAAW;YACbA,UAAUO;QACZ;IACF;IAEA,MAAMS,oBAAoB;QACxBV,YAAY;QACZI,qBAAqBH;YACDA;QAApBK,oBAAoBL,CAAAA,8BAAAA,UAAUU,KAAKC,yBAAfX,yCAAAA,8BAA8B,CAAC;IACrD;IAEA,MAAMY,sBAAsB;QAC1B,uCAAuC;QACvC,IAAIC,KAAKC,UAAUd,eAAea,KAAKC,UAAUZ,oBAAoB;YACnEH,YAAY;QACd,OAAO;YACLO,qCAAqC;gBACnCS,kBAAkB;oBAChBP;gBACF;gBACAQ,UAAU;oBACRT;gBACF;YACF;QACF;IACF;IAEA,qBACE,MAACtC;QACCgD,IAAI;YACFC,UAAU;YACVC,WAAW;YACXC,WAAW;YACXC,SAAS;YACTC,eAAe;QACjB;;0BAEA,KAAC1C;gBACC2C,eAAelC,kBAAkBmC,SAASC;gBAC1CnC,yBAAyBA;gBACzBI,yBAAyBA;gBACzBF,QAAQA;gBACRG,YAAYA;gBACZc,mBAAmBA;gBACnBG,qBAAqBA;;0BAEvB,MAAC3C;gBAAIgD,IAAI;oBAAES,SAAS,CAACC,QAAUA,MAAMC,QAAQ;oBAAIC,QAAQ;gBAAO;;kCAC9D,KAACzD;wBAAc0D,mBAAmB3D;kCAChC,cAAA,KAACK;4BACCe,qBAAqB;gCACnBkB;gCACA,GAAGlB,mBAAmB;4BACxB;;;kCAGJ,KAACrB;wBAAe2B,aAAaA;wBAAakC,eAAe;kCACvD,cAAA,KAACxD;;kCAEH,KAACE;kCACD,KAACC;kCACD,KAACG;kCACD,KAACF;kCACD,KAACG;wBAAea,YAAY,CAACG;wBAAYkC,wBAAwB,CAACpC;;kCAClE,KAACb;;;;;AAIT,EAAE"}

package/dist/views/ViewDashboard/ViewDashboard.d.ts

@@ -6,6 +6,7 @@ export interface ViewDashboardProps extends Omit<BoxProps, 'children'>, Dashboar
     datasourceApi: DatasourceStoreProviderProps['datasourceApi'];
     externalVariableDefinitions?: TemplateVariableProviderProps['externalVariableDefinitions'];
     isEditing?: boolean;
+    isCreating?: boolean;
 }
 /**
  * The View for displaying a Dashboard, along with the UI for selecting variable values.

package/dist/views/ViewDashboard/ViewDashboard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ViewDashboard.d.ts","sourceRoot":"","sources":["../../../src/views/ViewDashboard/ViewDashboard.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAO,QAAQ,EAAE,MAAM,eAAe,CAAC;AAI9C,OAAO,EAGL,4BAA4B,EAE5B,6BAA6B,EAC9B,MAAM,eAAe,CAAC;AACvB,OAAO,EAAgB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAEjE,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,EAAE,iBAAiB;IACvF,aAAa,EAAE,4BAA4B,CAAC,eAAe,CAAC,CAAC;IAC7D,2BAA2B,CAAC,EAAE,6BAA6B,CAAC,6BAA6B,CAAC,CAAC;IAC3F,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,eA+DtD"}
+{"version":3,"file":"ViewDashboard.d.ts","sourceRoot":"","sources":["../../../src/views/ViewDashboard/ViewDashboard.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAO,QAAQ,EAAE,MAAM,eAAe,CAAC;AAU9C,OAAO,EAEL,4BAA4B,EAE5B,6BAA6B,EAE9B,MAAM,eAAe,CAAC;AACvB,OAAO,EAAgB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAEjE,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,EAAE,iBAAiB;IACvF,aAAa,EAAE,4BAA4B,CAAC,eAAe,CAAC,CAAC;IAC7D,2BAA2B,CAAC,EAAE,6BAA6B,CAAC,6BAA6B,CAAC,CAAC;IAC3F,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,eAqGtD"}

package/dist/views/ViewDashboard/ViewDashboard.js

@@ -14,20 +14,60 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Box } from '@mui/material';
 import { DEFAULT_DASHBOARD_DURATION, DEFAULT_REFRESH_INTERVAL } from '@perses-dev/core';
 import { ErrorBoundary, ErrorAlert, combineSx } from '@perses-dev/components';
-import { TimeRangeProvider, useInitialRefreshInterval, useInitialTimeRange } from '@perses-dev/plugin-system';
-import { TemplateVariableProvider, DashboardProvider, DatasourceStoreProvider } from '../../context';
+import { TimeRangeProviderWithQueryParams, useInitialRefreshInterval, useInitialTimeRange, usePluginBuiltinVariableDefinitions } from '@perses-dev/plugin-system';
+import { useMemo } from 'react';
+import { DashboardProvider, DatasourceStoreProvider, TemplateVariableProviderWithQueryParams } from '../../context';
 import { DashboardApp } from './DashboardApp';
 /**
  * The View for displaying a Dashboard, along with the UI for selecting variable values.
  */ export function ViewDashboard(props) {
-    const { dashboardResource , datasourceApi , externalVariableDefinitions , dashboardTitleComponent , emptyDashboardProps , onSave , onDiscard , initialVariableIsSticky , isReadonly , isEditing , sx , ...others } = props;
+    const { dashboardResource , datasourceApi , externalVariableDefinitions , dashboardTitleComponent , emptyDashboardProps , onSave , onDiscard , initialVariableIsSticky , isReadonly , isEditing , isCreating , sx , ...others } = props;
     const { spec  } = dashboardResource;
-    var _duration;
-    const dashboardDuration = (_duration = spec.duration) !== null && _duration !== void 0 ? _duration : DEFAULT_DASHBOARD_DURATION;
-    var _refreshInterval;
-    const dashboardRefreshInterval = (_refreshInterval = spec.refreshInterval) !== null && _refreshInterval !== void 0 ? _refreshInterval : DEFAULT_REFRESH_INTERVAL;
+    var _spec_duration;
+    const dashboardDuration = (_spec_duration = spec.duration) !== null && _spec_duration !== void 0 ? _spec_duration : DEFAULT_DASHBOARD_DURATION;
+    var _spec_refreshInterval;
+    const dashboardRefreshInterval = (_spec_refreshInterval = spec.refreshInterval) !== null && _spec_refreshInterval !== void 0 ? _spec_refreshInterval : DEFAULT_REFRESH_INTERVAL;
     const initialTimeRange = useInitialTimeRange(dashboardDuration);
     const initialRefreshInterval = useInitialRefreshInterval(dashboardRefreshInterval);
+    const { data  } = usePluginBuiltinVariableDefinitions();
+    const builtinVariables = useMemo(()=>{
+        const result = [
+            {
+                kind: 'BuiltinVariable',
+                spec: {
+                    name: '__dashboard',
+                    value: ()=>dashboardResource.metadata.name,
+                    source: 'Dashboard',
+                    display: {
+                        name: '__dashboard',
+                        description: 'The name of the current dashboard',
+                        hidden: true
+                    }
+                }
+            },
+            {
+                kind: 'BuiltinVariable',
+                spec: {
+                    name: '__project',
+                    value: ()=>dashboardResource.metadata.project,
+                    source: 'Dashboard',
+                    display: {
+                        name: '__project',
+                        description: 'The name of the current dashboard project',
+                        hidden: true
+                    }
+                }
+            }
+        ];
+        if (data) {
+            data.forEach((def)=>result.push(def));
+        }
+        return result;
+    }, [
+        dashboardResource.metadata.name,
+        dashboardResource.metadata.project,
+        data
+    ]);
     return /*#__PURE__*/ _jsx(DatasourceStoreProvider, {
         dashboardResource: dashboardResource,
         datasourceApi: datasourceApi,
@@ -36,13 +76,13 @@ import { DashboardApp } from './DashboardApp';
                 dashboardResource,
                 isEditMode: !!isEditing
             },
-            children: /*#__PURE__*/ _jsx(TimeRangeProvider, {
+            children: /*#__PURE__*/ _jsx(TimeRangeProviderWithQueryParams, {
                 initialTimeRange: initialTimeRange,
                 initialRefreshInterval: initialRefreshInterval,
-                enabledURLParams: true,
-                children: /*#__PURE__*/ _jsx(TemplateVariableProvider, {
+                children: /*#__PURE__*/ _jsx(TemplateVariableProviderWithQueryParams, {
                     initialVariableDefinitions: spec.variables,
                     externalVariableDefinitions: externalVariableDefinitions,
+                    builtinVariables: builtinVariables,
                     children: /*#__PURE__*/ _jsx(Box, {
                         sx: combineSx({
                             display: 'flex',
@@ -61,7 +101,8 @@ import { DashboardApp } from './DashboardApp';
                                 onSave: onSave,
                                 onDiscard: onDiscard,
                                 initialVariableIsSticky: initialVariableIsSticky,
-                                isReadonly: isReadonly
+                                isReadonly: isReadonly,
+                                isCreating: isCreating
                             })
                         })
                     })

package/dist/views/ViewDashboard/ViewDashboard.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/views/ViewDashboard/ViewDashboard.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, BoxProps } from '@mui/material';\nimport { DEFAULT_DASHBOARD_DURATION, DEFAULT_REFRESH_INTERVAL } from '@perses-dev/core';\nimport { ErrorBoundary, ErrorAlert, combineSx } from '@perses-dev/components';\nimport { TimeRangeProvider, useInitialRefreshInterval, useInitialTimeRange } from '@perses-dev/plugin-system';\nimport {\n  TemplateVariableProvider,\n  DashboardProvider,\n  DatasourceStoreProviderProps,\n  DatasourceStoreProvider,\n  TemplateVariableProviderProps,\n} from '../../context';\nimport { DashboardApp, DashboardAppProps } from './DashboardApp';\n\nexport interface ViewDashboardProps extends Omit<BoxProps, 'children'>, DashboardAppProps {\n  datasourceApi: DatasourceStoreProviderProps['datasourceApi'];\n  externalVariableDefinitions?: TemplateVariableProviderProps['externalVariableDefinitions'];\n  isEditing?: boolean;\n}\n\n/**\n * The View for displaying a Dashboard, along with the UI for selecting variable values.\n */\nexport function ViewDashboard(props: ViewDashboardProps) {\n  const {\n    dashboardResource,\n    datasourceApi,\n    externalVariableDefinitions,\n    dashboardTitleComponent,\n    emptyDashboardProps,\n    onSave,\n    onDiscard,\n    initialVariableIsSticky,\n    isReadonly,\n    isEditing,\n    sx,\n    ...others\n  } = props;\n  const { spec } = dashboardResource;\n  const dashboardDuration = spec.duration ?? DEFAULT_DASHBOARD_DURATION;\n  const dashboardRefreshInterval = spec.refreshInterval ?? DEFAULT_REFRESH_INTERVAL;\n  const initialTimeRange = useInitialTimeRange(dashboardDuration);\n  const initialRefreshInterval = useInitialRefreshInterval(dashboardRefreshInterval);\n\n  return (\n    <DatasourceStoreProvider dashboardResource={dashboardResource} datasourceApi={datasourceApi}>\n      <DashboardProvider initialState={{ dashboardResource, isEditMode: !!isEditing }}>\n        <TimeRangeProvider\n          initialTimeRange={initialTimeRange}\n          initialRefreshInterval={initialRefreshInterval}\n          enabledURLParams={true}\n        >\n          <TemplateVariableProvider\n            initialVariableDefinitions={spec.variables}\n            externalVariableDefinitions={externalVariableDefinitions}\n          >\n            <Box\n              sx={combineSx(\n                {\n                  display: 'flex',\n                  width: '100%',\n                  height: '100%',\n                  position: 'relative',\n                  overflow: 'hidden',\n                },\n                sx\n              )}\n              {...others}\n            >\n              <ErrorBoundary FallbackComponent={ErrorAlert}>\n                <DashboardApp\n                  dashboardResource={dashboardResource}\n                  dashboardTitleComponent={dashboardTitleComponent}\n                  emptyDashboardProps={emptyDashboardProps}\n                  onSave={onSave}\n                  onDiscard={onDiscard}\n                  initialVariableIsSticky={initialVariableIsSticky}\n                  isReadonly={isReadonly}\n                />\n              </ErrorBoundary>\n            </Box>\n          </TemplateVariableProvider>\n        </TimeRangeProvider>\n      </DashboardProvider>\n    </DatasourceStoreProvider>\n  );\n}\n"],"names":["Box","DEFAULT_DASHBOARD_DURATION","DEFAULT_REFRESH_INTERVAL","ErrorBoundary","ErrorAlert","combineSx","TimeRangeProvider","useInitialRefreshInterval","useInitialTimeRange","TemplateVariableProvider","DashboardProvider","DatasourceStoreProvider","DashboardApp","ViewDashboard","props","dashboardResource","datasourceApi","externalVariableDefinitions","dashboardTitleComponent","emptyDashboardProps","onSave","onDiscard","initialVariableIsSticky","isReadonly","isEditing","sx","others","spec","dashboardDuration","duration","dashboardRefreshInterval","refreshInterval","initialTimeRange","initialRefreshInterval","initialState","isEditMode","enabledURLParams","initialVariableDefinitions","variables","display","width","height","position","overflow","FallbackComponent"],"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,GAAG,QAAkB,eAAe,CAAC;AAC9C,SAASC,0BAA0B,EAAEC,wBAAwB,QAAQ,kBAAkB,CAAC;AACxF,SAASC,aAAa,EAAEC,UAAU,EAAEC,SAAS,QAAQ,wBAAwB,CAAC;AAC9E,SAASC,iBAAiB,EAAEC,yBAAyB,EAAEC,mBAAmB,QAAQ,2BAA2B,CAAC;AAC9G,SACEC,wBAAwB,EACxBC,iBAAiB,EAEjBC,uBAAuB,QAElB,eAAe,CAAC;AACvB,SAASC,YAAY,QAA2B,gBAAgB,CAAC;AAQjE;;CAEC,GACD,OAAO,SAASC,aAAa,CAACC,KAAyB,EAAE;IACvD,MAAM,EACJC,iBAAiB,CAAA,EACjBC,aAAa,CAAA,EACbC,2BAA2B,CAAA,EAC3BC,uBAAuB,CAAA,EACvBC,mBAAmB,CAAA,EACnBC,MAAM,CAAA,EACNC,SAAS,CAAA,EACTC,uBAAuB,CAAA,EACvBC,UAAU,CAAA,EACVC,SAAS,CAAA,EACTC,EAAE,CAAA,EACF,GAAGC,MAAM,EACV,GAAGZ,KAAK,AAAC;IACV,MAAM,EAAEa,IAAI,CAAA,EAAE,GAAGZ,iBAAiB,AAAC;QACTY,SAAa;IAAvC,MAAMC,iBAAiB,GAAGD,CAAAA,SAAa,GAAbA,IAAI,CAACE,QAAQ,cAAbF,SAAa,cAAbA,SAAa,GAAI1B,0BAA0B,AAAC;QACrC0B,gBAAoB;IAArD,MAAMG,wBAAwB,GAAGH,CAAAA,gBAAoB,GAApBA,IAAI,CAACI,eAAe,cAApBJ,gBAAoB,cAApBA,gBAAoB,GAAIzB,wBAAwB,AAAC;IAClF,MAAM8B,gBAAgB,GAAGxB,mBAAmB,CAACoB,iBAAiB,CAAC,AAAC;IAChE,MAAMK,sBAAsB,GAAG1B,yBAAyB,CAACuB,wBAAwB,CAAC,AAAC;IAEnF,qBACE,KAACnB,uBAAuB;QAACI,iBAAiB,EAAEA,iBAAiB;QAAEC,aAAa,EAAEA,aAAa;kBACzF,cAAA,KAACN,iBAAiB;YAACwB,YAAY,EAAE;gBAAEnB,iBAAiB;gBAAEoB,UAAU,EAAE,CAAC,CAACX,SAAS;aAAE;sBAC7E,cAAA,KAAClB,iBAAiB;gBAChB0B,gBAAgB,EAAEA,gBAAgB;gBAClCC,sBAAsB,EAAEA,sBAAsB;gBAC9CG,gBAAgB,EAAE,IAAI;0BAEtB,cAAA,KAAC3B,wBAAwB;oBACvB4B,0BAA0B,EAAEV,IAAI,CAACW,SAAS;oBAC1CrB,2BAA2B,EAAEA,2BAA2B;8BAExD,cAAA,KAACjB,GAAG;wBACFyB,EAAE,EAAEpB,SAAS,CACX;4BACEkC,OAAO,EAAE,MAAM;4BACfC,KAAK,EAAE,MAAM;4BACbC,MAAM,EAAE,MAAM;4BACdC,QAAQ,EAAE,UAAU;4BACpBC,QAAQ,EAAE,QAAQ;yBACnB,EACDlB,EAAE,CACH;wBACA,GAAGC,MAAM;kCAEV,cAAA,KAACvB,aAAa;4BAACyC,iBAAiB,EAAExC,UAAU;sCAC1C,cAAA,KAACQ,YAAY;gCACXG,iBAAiB,EAAEA,iBAAiB;gCACpCG,uBAAuB,EAAEA,uBAAuB;gCAChDC,mBAAmB,EAAEA,mBAAmB;gCACxCC,MAAM,EAAEA,MAAM;gCACdC,SAAS,EAAEA,SAAS;gCACpBC,uBAAuB,EAAEA,uBAAuB;gCAChDC,UAAU,EAAEA,UAAU;8BACtB;0BACY;sBACZ;kBACmB;cACT;UACF;MACI,CAC1B;AACJ,CAAC"}
+{"version":3,"sources":["../../../src/views/ViewDashboard/ViewDashboard.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, BoxProps } from '@mui/material';\nimport { BuiltinVariableDefinition, DEFAULT_DASHBOARD_DURATION, DEFAULT_REFRESH_INTERVAL } from '@perses-dev/core';\nimport { ErrorBoundary, ErrorAlert, combineSx } from '@perses-dev/components';\nimport {\n  TimeRangeProviderWithQueryParams,\n  useInitialRefreshInterval,\n  useInitialTimeRange,\n  usePluginBuiltinVariableDefinitions,\n} from '@perses-dev/plugin-system';\nimport { useMemo } from 'react';\nimport {\n  DashboardProvider,\n  DatasourceStoreProviderProps,\n  DatasourceStoreProvider,\n  TemplateVariableProviderProps,\n  TemplateVariableProviderWithQueryParams,\n} from '../../context';\nimport { DashboardApp, DashboardAppProps } from './DashboardApp';\n\nexport interface ViewDashboardProps extends Omit<BoxProps, 'children'>, DashboardAppProps {\n  datasourceApi: DatasourceStoreProviderProps['datasourceApi'];\n  externalVariableDefinitions?: TemplateVariableProviderProps['externalVariableDefinitions'];\n  isEditing?: boolean;\n  isCreating?: boolean;\n}\n\n/**\n * The View for displaying a Dashboard, along with the UI for selecting variable values.\n */\nexport function ViewDashboard(props: ViewDashboardProps) {\n  const {\n    dashboardResource,\n    datasourceApi,\n    externalVariableDefinitions,\n    dashboardTitleComponent,\n    emptyDashboardProps,\n    onSave,\n    onDiscard,\n    initialVariableIsSticky,\n    isReadonly,\n    isEditing,\n    isCreating,\n    sx,\n    ...others\n  } = props;\n  const { spec } = dashboardResource;\n  const dashboardDuration = spec.duration ?? DEFAULT_DASHBOARD_DURATION;\n  const dashboardRefreshInterval = spec.refreshInterval ?? DEFAULT_REFRESH_INTERVAL;\n  const initialTimeRange = useInitialTimeRange(dashboardDuration);\n  const initialRefreshInterval = useInitialRefreshInterval(dashboardRefreshInterval);\n  const { data } = usePluginBuiltinVariableDefinitions();\n\n  const builtinVariables = useMemo(() => {\n    const result = [\n      {\n        kind: 'BuiltinVariable',\n        spec: {\n          name: '__dashboard',\n          value: () => dashboardResource.metadata.name,\n          source: 'Dashboard',\n          display: {\n            name: '__dashboard',\n            description: 'The name of the current dashboard',\n            hidden: true,\n          },\n        },\n      } as BuiltinVariableDefinition,\n      {\n        kind: 'BuiltinVariable',\n        spec: {\n          name: '__project',\n          value: () => dashboardResource.metadata.project,\n          source: 'Dashboard',\n          display: {\n            name: '__project',\n            description: 'The name of the current dashboard project',\n            hidden: true,\n          },\n        },\n      } as BuiltinVariableDefinition,\n    ];\n    if (data) {\n      data.forEach((def: BuiltinVariableDefinition) => result.push(def));\n    }\n    return result;\n  }, [dashboardResource.metadata.name, dashboardResource.metadata.project, data]);\n\n  return (\n    <DatasourceStoreProvider dashboardResource={dashboardResource} datasourceApi={datasourceApi}>\n      <DashboardProvider initialState={{ dashboardResource, isEditMode: !!isEditing }}>\n        <TimeRangeProviderWithQueryParams\n          initialTimeRange={initialTimeRange}\n          initialRefreshInterval={initialRefreshInterval}\n        >\n          <TemplateVariableProviderWithQueryParams\n            initialVariableDefinitions={spec.variables}\n            externalVariableDefinitions={externalVariableDefinitions}\n            builtinVariables={builtinVariables}\n          >\n            <Box\n              sx={combineSx(\n                {\n                  display: 'flex',\n                  width: '100%',\n                  height: '100%',\n                  position: 'relative',\n                  overflow: 'hidden',\n                },\n                sx\n              )}\n              {...others}\n            >\n              <ErrorBoundary FallbackComponent={ErrorAlert}>\n                <DashboardApp\n                  dashboardResource={dashboardResource}\n                  dashboardTitleComponent={dashboardTitleComponent}\n                  emptyDashboardProps={emptyDashboardProps}\n                  onSave={onSave}\n                  onDiscard={onDiscard}\n                  initialVariableIsSticky={initialVariableIsSticky}\n                  isReadonly={isReadonly}\n                  isCreating={isCreating}\n                />\n              </ErrorBoundary>\n            </Box>\n          </TemplateVariableProviderWithQueryParams>\n        </TimeRangeProviderWithQueryParams>\n      </DashboardProvider>\n    </DatasourceStoreProvider>\n  );\n}\n"],"names":["Box","DEFAULT_DASHBOARD_DURATION","DEFAULT_REFRESH_INTERVAL","ErrorBoundary","ErrorAlert","combineSx","TimeRangeProviderWithQueryParams","useInitialRefreshInterval","useInitialTimeRange","usePluginBuiltinVariableDefinitions","useMemo","DashboardProvider","DatasourceStoreProvider","TemplateVariableProviderWithQueryParams","DashboardApp","ViewDashboard","props","dashboardResource","datasourceApi","externalVariableDefinitions","dashboardTitleComponent","emptyDashboardProps","onSave","onDiscard","initialVariableIsSticky","isReadonly","isEditing","isCreating","sx","others","spec","dashboardDuration","duration","dashboardRefreshInterval","refreshInterval","initialTimeRange","initialRefreshInterval","data","builtinVariables","result","kind","name","value","metadata","source","display","description","hidden","project","forEach","def","push","initialState","isEditMode","initialVariableDefinitions","variables","width","height","position","overflow","FallbackComponent"],"mappings":"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"}

package/dist/views/ViewDashboard/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/views/ViewDashboard/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './ViewDashboard';\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,iBAAiB,CAAC"}
+{"version":3,"sources":["../../../src/views/ViewDashboard/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './ViewDashboard';\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,kBAAkB"}

package/dist/views/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/views/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './ViewDashboard';\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,iBAAiB,CAAC"}
+{"version":3,"sources":["../../src/views/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './ViewDashboard';\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,kBAAkB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@perses-dev/dashboards",
-  "version": "0.0.0-snapshot-panel-extra-content-3-17f9c42",
+  "version": "0.0.0-snapshot-scatter-chart-embed-8efdfab",
   "description": "The dashboards feature in Perses",
   "license": "Apache-2.0",
   "homepage": "https://github.com/perses/perses/blob/main/README.md",
@@ -23,20 +23,21 @@
     "build:types": "tsc --project tsconfig.build.json",
     "type-check": "tsc --noEmit",
     "start": "concurrently -P \"npm:build:* -- {*}\" -- --watch",
-    "test": "TZ=UTC jest",
+    "test": "cross-env TZ=UTC jest",
     "test:watch": "npm run test -- --watch",
     "lint": "eslint src --ext .ts,.tsx",
     "lint:fix": "eslint --fix src --ext .ts,.tsx"
   },
   "dependencies": {
-    "@perses-dev/components": "0.0.0-snapshot-panel-extra-content-3-17f9c42",
-    "@perses-dev/core": "0.0.0-snapshot-panel-extra-content-3-17f9c42",
-    "@perses-dev/plugin-system": "0.0.0-snapshot-panel-extra-content-3-17f9c42",
+    "@perses-dev/components": "0.0.0-snapshot-scatter-chart-embed-8efdfab",
+    "@perses-dev/core": "0.0.0-snapshot-scatter-chart-embed-8efdfab",
+    "@perses-dev/plugin-system": "0.0.0-snapshot-scatter-chart-embed-8efdfab",
     "@types/react-grid-layout": "^1.3.2",
     "date-fns": "^2.28.0",
     "immer": "^9.0.15",
     "mdi-material-ui": "^7.4.0",
     "react-grid-layout": "^1.3.4",
+    "react-hook-form": "^7.46.1",
     "react-intersection-observer": "^9.4.0",
     "use-immer": "^0.7.0",
     "use-query-params": "^2.1.1",
@@ -44,8 +45,8 @@
     "zustand": "^4.3.3"
   },
   "devDependencies": {
-    "@perses-dev/internal-utils": "0.0.0-snapshot-panel-extra-content-3-17f9c42",
-    "@perses-dev/storybook": "0.0.0-snapshot-panel-extra-content-3-17f9c42",
+    "@perses-dev/internal-utils": "0.0.0-snapshot-scatter-chart-embed-8efdfab",
+    "@perses-dev/storybook": "0.0.0-snapshot-scatter-chart-embed-8efdfab",
     "history": "^5.3.0",
     "intersection-observer": "^0.12.2"
   },