@perses-dev/dashboards 0.38.0 → 0.39.0

package/dist/context/TemplateVariableProvider/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/context/TemplateVariableProvider/utils.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAK7D,wBAAgB,+BAA+B,CAAC,WAAW,EAAE,kBAAkB,EAAE,EAAE,QAAQ,EAAE,gBAAgB;;;EAoB5G"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/context/TemplateVariableProvider/utils.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAClE,OAAO,EAAE,0BAA0B,EAAE,MAAM,wBAAwB,CAAC;AAKpE,wBAAgB,+BAA+B,CAAC,WAAW,EAAE,kBAAkB,EAAE,EAAE,QAAQ,EAAE,qBAAqB;;;EAqBjH;AAED;;;;;GAKG;AACH,wBAAgB,wBAAwB,CACtC,MAAM,EAAE,kBAAkB,EAAE,EAC5B,SAAS,EAAE,0BAA0B,EAAE,GACtC,kBAAkB,EAAE,CAYtB;AAED;;;;;;GAMG;AACH,wBAAgB,4BAA4B,CAC1C,IAAI,EAAE,MAAM,EACZ,gBAAgB,EAAE,kBAAkB,EAAE,EACtC,mBAAmB,EAAE,0BAA0B,EAAE,GAChD,kBAAkB,GAAG,SAAS,CAEhC;AAED;;;;;;;GAOG;AACH,wBAAgB,yBAAyB,CACvC,MAAM,EAAE,kBAAkB,EAAE,EAC5B,SAAS,EAAE,0BAA0B,EAAE,EACvC,UAAU,EAAE,CAAC,MAAM,EAAE,kBAAkB,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,MAAM,KAAK,IAAI,QAIhF"}

package/dist/context/TemplateVariableProvider/utils.js

@@ -16,17 +16,22 @@
     let isSavedVariableModified = false;
     const modifiedVariableNames = [];
     for (const savedVariable of definitions){
+        const name = savedVariable.spec.name;
         if (savedVariable.kind === 'ListVariable') {
-            const currentVariable = varState[savedVariable.spec.name];
+            const currentVariable = varState.get({
+                name
+            });
             if ((currentVariable === null || currentVariable === void 0 ? void 0 : currentVariable.value) !== null && (currentVariable === null || currentVariable === void 0 ? void 0 : currentVariable.value) !== savedVariable.spec.default_value) {
-                modifiedVariableNames.push(savedVariable.spec.name);
+                modifiedVariableNames.push(name);
                 isSavedVariableModified = true;
             }
         } else if (savedVariable.kind === 'TextVariable') {
-            const currentVariable1 = varState[savedVariable.spec.name];
+            const currentVariable1 = varState.get({
+                name
+            });
             const currentVariableValue = typeof (currentVariable1 === null || currentVariable1 === void 0 ? void 0 : currentVariable1.value) === 'string' ? currentVariable1.value : '';
             if (savedVariable.spec.value !== currentVariableValue) {
-                modifiedVariableNames.push(savedVariable.spec.name);
+                modifiedVariableNames.push(name);
                 isSavedVariableModified = true;
             }
         }
@@ -36,5 +41,42 @@
         modifiedVariableNames
     };
 }
+/**
+ * Merge the different kind of variable definition into a list without any duplicates (same name).
+ * Respects the order of priority explained in {@link forEachVariableDefinition}
+ * @param locals
+ * @param externals
+ */ export function mergeVariableDefinitions(locals, externals) {
+    const pushed = {};
+    const result = [];
+    // Append the value only if it's not already appended
+    forEachVariableDefinition(locals, externals, (value, name)=>{
+        if (!pushed[name]) {
+            result.push(value);
+            pushed[name] = true;
+        }
+    });
+    return result;
+}
+/**
+ * Find a definition by its name.
+ * Respects the order of priority explained in {@link forEachVariableDefinition}
+ * @param name
+ * @param localDefinitions
+ * @param externalDefinitions
+ */ export function findVariableDefinitionByName(name, localDefinitions, externalDefinitions) {
+    return mergeVariableDefinitions(localDefinitions, externalDefinitions).find((d)=>d.spec.name === name);
+}
+/**
+ * Loop on local and external variable definitions, respecting the order of priority:
+ * - local var defs override external var defs of same name
+ * - each external var defs override the external var defs coming after.
+ * @param locals
+ * @param externals
+ * @param callbackFn
+ */ export function forEachVariableDefinition(locals, externals, callbackFn) {
+    locals.forEach((v)=>callbackFn(v, v.spec.name));
+    externals.forEach((ext)=>ext.definitions.forEach((v)=>callbackFn(v, v.spec.name, ext.source)));
+}
 
 //# sourceMappingURL=utils.js.map

package/dist/context/TemplateVariableProvider/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/context/TemplateVariableProvider/utils.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\nimport { VariableDefinition } from '@perses-dev/core';\nimport { VariableStateMap } from '@perses-dev/plugin-system';\n\n/*\n * Check whether saved variable definitions are out of date with current default list values in Zustand store\n */\nexport function checkSavedDefaultVariableStatus(definitions: VariableDefinition[], varState: VariableStateMap) {\n  let isSavedVariableModified = false;\n  const modifiedVariableNames: string[] = [];\n  for (const savedVariable of definitions) {\n    if (savedVariable.kind === 'ListVariable') {\n      const currentVariable = varState[savedVariable.spec.name];\n      if (currentVariable?.value !== null && currentVariable?.value !== savedVariable.spec.default_value) {\n        modifiedVariableNames.push(savedVariable.spec.name);\n        isSavedVariableModified = true;\n      }\n    } else if (savedVariable.kind === 'TextVariable') {\n      const currentVariable = varState[savedVariable.spec.name];\n      const currentVariableValue = typeof currentVariable?.value === 'string' ? currentVariable.value : '';\n      if (savedVariable.spec.value !== currentVariableValue) {\n        modifiedVariableNames.push(savedVariable.spec.name);\n        isSavedVariableModified = true;\n      }\n    }\n  }\n  return { isSavedVariableModified, modifiedVariableNames };\n}\n"],"names":["checkSavedDefaultVariableStatus","definitions","varState","isSavedVariableModified","modifiedVariableNames","savedVariable","kind","currentVariable","spec","name","value","default_value","push","currentVariableValue"],"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;AAKjC;;CAEC,GACD,OAAO,SAASA,+BAA+B,CAACC,WAAiC,EAAEC,QAA0B,EAAE;IAC7G,IAAIC,uBAAuB,GAAG,KAAK,AAAC;IACpC,MAAMC,qBAAqB,GAAa,EAAE,AAAC;IAC3C,KAAK,MAAMC,aAAa,IAAIJ,WAAW,CAAE;QACvC,IAAII,aAAa,CAACC,IAAI,KAAK,cAAc,EAAE;YACzC,MAAMC,eAAe,GAAGL,QAAQ,CAACG,aAAa,CAACG,IAAI,CAACC,IAAI,CAAC,AAAC;YAC1D,IAAIF,CAAAA,eAAe,aAAfA,eAAe,WAAO,GAAtBA,KAAAA,CAAsB,GAAtBA,eAAe,CAAEG,KAAK,CAAA,KAAK,IAAI,IAAIH,CAAAA,eAAe,aAAfA,eAAe,WAAO,GAAtBA,KAAAA,CAAsB,GAAtBA,eAAe,CAAEG,KAAK,CAAA,KAAKL,aAAa,CAACG,IAAI,CAACG,aAAa,EAAE;gBAClGP,qBAAqB,CAACQ,IAAI,CAACP,aAAa,CAACG,IAAI,CAACC,IAAI,CAAC,CAAC;gBACpDN,uBAAuB,GAAG,IAAI,CAAC;YACjC,CAAC;QACH,OAAO,IAAIE,aAAa,CAACC,IAAI,KAAK,cAAc,EAAE;YAChD,MAAMC,gBAAe,GAAGL,QAAQ,CAACG,aAAa,CAACG,IAAI,CAACC,IAAI,CAAC,AAAC;YAC1D,MAAMI,oBAAoB,GAAG,OAAON,CAAAA,gBAAe,aAAfA,gBAAe,WAAO,GAAtBA,KAAAA,CAAsB,GAAtBA,gBAAe,CAAEG,KAAK,CAAA,KAAK,QAAQ,GAAGH,gBAAe,CAACG,KAAK,GAAG,EAAE,AAAC;YACrG,IAAIL,aAAa,CAACG,IAAI,CAACE,KAAK,KAAKG,oBAAoB,EAAE;gBACrDT,qBAAqB,CAACQ,IAAI,CAACP,aAAa,CAACG,IAAI,CAACC,IAAI,CAAC,CAAC;gBACpDN,uBAAuB,GAAG,IAAI,CAAC;YACjC,CAAC;QACH,CAAC;IACH,CAAC;IACD,OAAO;QAAEA,uBAAuB;QAAEC,qBAAqB;KAAE,CAAC;AAC5D,CAAC"}
+{"version":3,"sources":["../../../src/context/TemplateVariableProvider/utils.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\nimport { VariableDefinition } from '@perses-dev/core';\nimport { VariableStoreStateMap } from '@perses-dev/plugin-system';\nimport { ExternalVariableDefinition } from '@perses-dev/dashboards';\n\n/*\n * Check whether saved variable definitions are out of date with current default list values in Zustand store\n */\nexport function checkSavedDefaultVariableStatus(definitions: VariableDefinition[], varState: VariableStoreStateMap) {\n  let isSavedVariableModified = false;\n  const modifiedVariableNames: string[] = [];\n  for (const savedVariable of definitions) {\n    const name = savedVariable.spec.name;\n    if (savedVariable.kind === 'ListVariable') {\n      const currentVariable = varState.get({ name });\n      if (currentVariable?.value !== null && currentVariable?.value !== savedVariable.spec.default_value) {\n        modifiedVariableNames.push(name);\n        isSavedVariableModified = true;\n      }\n    } else if (savedVariable.kind === 'TextVariable') {\n      const currentVariable = varState.get({ name });\n      const currentVariableValue = typeof currentVariable?.value === 'string' ? currentVariable.value : '';\n      if (savedVariable.spec.value !== currentVariableValue) {\n        modifiedVariableNames.push(name);\n        isSavedVariableModified = true;\n      }\n    }\n  }\n  return { isSavedVariableModified, modifiedVariableNames };\n}\n\n/**\n * Merge the different kind of variable definition into a list without any duplicates (same name).\n * Respects the order of priority explained in {@link forEachVariableDefinition}\n * @param locals\n * @param externals\n */\nexport function mergeVariableDefinitions(\n  locals: VariableDefinition[],\n  externals: ExternalVariableDefinition[]\n): VariableDefinition[] {\n  const pushed: Record<string, boolean> = {};\n  const result: VariableDefinition[] = [];\n\n  // Append the value only if it's not already appended\n  forEachVariableDefinition(locals, externals, (value: VariableDefinition, name: string) => {\n    if (!pushed[name]) {\n      result.push(value);\n      pushed[name] = true;\n    }\n  });\n  return result;\n}\n\n/**\n * Find a definition by its name.\n * Respects the order of priority explained in {@link forEachVariableDefinition}\n * @param name\n * @param localDefinitions\n * @param externalDefinitions\n */\nexport function findVariableDefinitionByName(\n  name: string,\n  localDefinitions: VariableDefinition[],\n  externalDefinitions: ExternalVariableDefinition[]\n): VariableDefinition | undefined {\n  return mergeVariableDefinitions(localDefinitions, externalDefinitions).find((d) => d.spec.name === name);\n}\n\n/**\n * Loop on local and external variable definitions, respecting the order of priority:\n * - local var defs override external var defs of same name\n * - each external var defs override the external var defs coming after.\n * @param locals\n * @param externals\n * @param callbackFn\n */\nexport function forEachVariableDefinition(\n  locals: VariableDefinition[],\n  externals: ExternalVariableDefinition[],\n  callbackFn: (varDef: VariableDefinition, name: string, source?: string) => void\n) {\n  locals.forEach((v) => callbackFn(v, v.spec.name));\n  externals.forEach((ext) => ext.definitions.forEach((v) => callbackFn(v, v.spec.name, ext.source)));\n}\n"],"names":["checkSavedDefaultVariableStatus","definitions","varState","isSavedVariableModified","modifiedVariableNames","savedVariable","name","spec","kind","currentVariable","get","value","default_value","push","currentVariableValue","mergeVariableDefinitions","locals","externals","pushed","result","forEachVariableDefinition","findVariableDefinitionByName","localDefinitions","externalDefinitions","find","d","callbackFn","forEach","v","ext","source"],"mappings":"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"}

package/dist/test/render.js

@@ -18,7 +18,7 @@ import { createMemoryHistory } from 'history';
 import { QueryParamProvider } from 'use-query-params';
 import { ReactRouter6Adapter } from 'use-query-params/adapters/react-router-6';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { ChartsThemeProvider, SnackbarProvider, testChartsTheme } from '@perses-dev/components';
+import { ChartsProvider, SnackbarProvider, testChartsTheme } from '@perses-dev/components';
 import { mockPluginRegistry, PluginRegistry } from '@perses-dev/plugin-system';
 import { MOCK_PLUGINS } from './plugin-registry';
 /*
@@ -63,7 +63,7 @@ import { MOCK_PLUGINS } from './plugin-registry';
                             vertical: 'bottom',
                             horizontal: 'right'
                         },
-                        children: /*#__PURE__*/ _jsx(ChartsThemeProvider, {
+                        children: /*#__PURE__*/ _jsx(ChartsProvider, {
                             chartsTheme: testChartsTheme,
                             children: /*#__PURE__*/ _jsx(PluginRegistry, {
                                 ...mockPluginRegistry(...MOCK_PLUGINS),

package/dist/test/render.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/test/render.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 { useLayoutEffect, useState } from 'react';\nimport { render, RenderOptions } from '@testing-library/react';\nimport { Router } from 'react-router-dom';\nimport { createMemoryHistory, MemoryHistory } from 'history';\nimport { QueryParamProvider } from 'use-query-params';\nimport { ReactRouter6Adapter } from 'use-query-params/adapters/react-router-6';\nimport { QueryClient, QueryClientProvider } from '@tanstack/react-query';\nimport { ChartsThemeProvider, SnackbarProvider, testChartsTheme } from '@perses-dev/components';\nimport { mockPluginRegistry, PluginRegistry } from '@perses-dev/plugin-system';\nimport { MOCK_PLUGINS } from './plugin-registry';\n\ninterface CustomRouterProps {\n  history: MemoryHistory;\n  children: React.ReactNode;\n}\n\n/*\n * Workaround for React router upgrade type errors.\n * More details: https://stackoverflow.com/a/69948457/17575201\n */\nconst CustomRouter: React.FC<CustomRouterProps> = ({ history, children }) => {\n  const [state, setState] = useState({\n    action: history.action,\n    location: history.location,\n  });\n\n  useLayoutEffect(() => history.listen(setState), [history]);\n\n  return (\n    <Router location={state.location} navigationType={state.action} navigator={history}>\n      {children}\n    </Router>\n  );\n};\n\n/**\n * Test helper to render a React component with some common app-level providers wrapped around it.\n */\nexport function renderWithContext(\n  ui: React.ReactElement,\n  options?: Omit<RenderOptions, 'queries'>,\n  history?: MemoryHistory\n) {\n  // Create a new QueryClient for each test to avoid caching issues\n  const queryClient = new QueryClient({ defaultOptions: { queries: { refetchOnWindowFocus: false, retry: false } } });\n\n  const customHistory = history ?? createMemoryHistory();\n\n  const BaseRender = () => (\n    <CustomRouter history={customHistory}>\n      <QueryClientProvider client={queryClient}>\n        <QueryParamProvider adapter={ReactRouter6Adapter}>\n          <SnackbarProvider anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}>\n            <ChartsThemeProvider chartsTheme={testChartsTheme}>\n              <PluginRegistry {...mockPluginRegistry(...MOCK_PLUGINS)}>{ui}</PluginRegistry>\n            </ChartsThemeProvider>\n          </SnackbarProvider>\n        </QueryParamProvider>\n      </QueryClientProvider>\n    </CustomRouter>\n  );\n\n  return render(<BaseRender />, options);\n}\n"],"names":["useLayoutEffect","useState","render","Router","createMemoryHistory","QueryParamProvider","ReactRouter6Adapter","QueryClient","QueryClientProvider","ChartsThemeProvider","SnackbarProvider","testChartsTheme","mockPluginRegistry","PluginRegistry","MOCK_PLUGINS","CustomRouter","history","children","state","setState","action","location","listen","navigationType","navigator","renderWithContext","ui","options","queryClient","defaultOptions","queries","refetchOnWindowFocus","retry","customHistory","BaseRender","client","adapter","anchorOrigin","vertical","horizontal","chartsTheme"],"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,eAAe,EAAEC,QAAQ,QAAQ,OAAO,CAAC;AAClD,SAASC,MAAM,QAAuB,wBAAwB,CAAC;AAC/D,SAASC,MAAM,QAAQ,kBAAkB,CAAC;AAC1C,SAASC,mBAAmB,QAAuB,SAAS,CAAC;AAC7D,SAASC,kBAAkB,QAAQ,kBAAkB,CAAC;AACtD,SAASC,mBAAmB,QAAQ,0CAA0C,CAAC;AAC/E,SAASC,WAAW,EAAEC,mBAAmB,QAAQ,uBAAuB,CAAC;AACzE,SAASC,mBAAmB,EAAEC,gBAAgB,EAAEC,eAAe,QAAQ,wBAAwB,CAAC;AAChG,SAASC,kBAAkB,EAAEC,cAAc,QAAQ,2BAA2B,CAAC;AAC/E,SAASC,YAAY,QAAQ,mBAAmB,CAAC;AAOjD;;;CAGC,GACD,MAAMC,YAAY,GAAgC,CAAC,EAAEC,OAAO,CAAA,EAAEC,QAAQ,CAAA,EAAE,GAAK;IAC3E,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGlB,QAAQ,CAAC;QACjCmB,MAAM,EAAEJ,OAAO,CAACI,MAAM;QACtBC,QAAQ,EAAEL,OAAO,CAACK,QAAQ;KAC3B,CAAC,AAAC;IAEHrB,eAAe,CAAC,IAAMgB,OAAO,CAACM,MAAM,CAACH,QAAQ,CAAC,EAAE;QAACH,OAAO;KAAC,CAAC,CAAC;IAE3D,qBACE,KAACb,MAAM;QAACkB,QAAQ,EAAEH,KAAK,CAACG,QAAQ;QAAEE,cAAc,EAAEL,KAAK,CAACE,MAAM;QAAEI,SAAS,EAAER,OAAO;kBAC/EC,QAAQ;MACF,CACT;AACJ,CAAC,AAAC;AAEF;;CAEC,GACD,OAAO,SAASQ,iBAAiB,CAC/BC,EAAsB,EACtBC,OAAwC,EACxCX,OAAuB,EACvB;IACA,iEAAiE;IACjE,MAAMY,WAAW,GAAG,IAAIrB,WAAW,CAAC;QAAEsB,cAAc,EAAE;YAAEC,OAAO,EAAE;gBAAEC,oBAAoB,EAAE,KAAK;gBAAEC,KAAK,EAAE,KAAK;aAAE;SAAE;KAAE,CAAC,AAAC;IAEpH,MAAMC,aAAa,GAAGjB,OAAO,aAAPA,OAAO,cAAPA,OAAO,GAAIZ,mBAAmB,EAAE,AAAC;IAEvD,MAAM8B,UAAU,GAAG,kBACjB,KAACnB,YAAY;YAACC,OAAO,EAAEiB,aAAa;sBAClC,cAAA,KAACzB,mBAAmB;gBAAC2B,MAAM,EAAEP,WAAW;0BACtC,cAAA,KAACvB,kBAAkB;oBAAC+B,OAAO,EAAE9B,mBAAmB;8BAC9C,cAAA,KAACI,gBAAgB;wBAAC2B,YAAY,EAAE;4BAAEC,QAAQ,EAAE,QAAQ;4BAAEC,UAAU,EAAE,OAAO;yBAAE;kCACzE,cAAA,KAAC9B,mBAAmB;4BAAC+B,WAAW,EAAE7B,eAAe;sCAC/C,cAAA,KAACE,cAAc;gCAAE,GAAGD,kBAAkB,IAAIE,YAAY,CAAC;0CAAGY,EAAE;8BAAkB;0BAC1D;sBACL;kBACA;cACD;UACT,AAChB,AAAC;IAEF,OAAOxB,MAAM,eAAC,KAACgC,UAAU,KAAG,EAAEP,OAAO,CAAC,CAAC;AACzC,CAAC"}
+{"version":3,"sources":["../../src/test/render.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 { useLayoutEffect, useState } from 'react';\nimport { render, RenderOptions } from '@testing-library/react';\nimport { Router } from 'react-router-dom';\nimport { createMemoryHistory, MemoryHistory } from 'history';\nimport { QueryParamProvider } from 'use-query-params';\nimport { ReactRouter6Adapter } from 'use-query-params/adapters/react-router-6';\nimport { QueryClient, QueryClientProvider } from '@tanstack/react-query';\nimport { ChartsProvider, SnackbarProvider, testChartsTheme } from '@perses-dev/components';\nimport { mockPluginRegistry, PluginRegistry } from '@perses-dev/plugin-system';\nimport { MOCK_PLUGINS } from './plugin-registry';\n\ninterface CustomRouterProps {\n  history: MemoryHistory;\n  children: React.ReactNode;\n}\n\n/*\n * Workaround for React router upgrade type errors.\n * More details: https://stackoverflow.com/a/69948457/17575201\n */\nconst CustomRouter: React.FC<CustomRouterProps> = ({ history, children }) => {\n  const [state, setState] = useState({\n    action: history.action,\n    location: history.location,\n  });\n\n  useLayoutEffect(() => history.listen(setState), [history]);\n\n  return (\n    <Router location={state.location} navigationType={state.action} navigator={history}>\n      {children}\n    </Router>\n  );\n};\n\n/**\n * Test helper to render a React component with some common app-level providers wrapped around it.\n */\nexport function renderWithContext(\n  ui: React.ReactElement,\n  options?: Omit<RenderOptions, 'queries'>,\n  history?: MemoryHistory\n) {\n  // Create a new QueryClient for each test to avoid caching issues\n  const queryClient = new QueryClient({ defaultOptions: { queries: { refetchOnWindowFocus: false, retry: false } } });\n\n  const customHistory = history ?? createMemoryHistory();\n\n  const BaseRender = () => (\n    <CustomRouter history={customHistory}>\n      <QueryClientProvider client={queryClient}>\n        <QueryParamProvider adapter={ReactRouter6Adapter}>\n          <SnackbarProvider anchorOrigin={{ vertical: 'bottom', horizontal: 'right' }}>\n            <ChartsProvider chartsTheme={testChartsTheme}>\n              <PluginRegistry {...mockPluginRegistry(...MOCK_PLUGINS)}>{ui}</PluginRegistry>\n            </ChartsProvider>\n          </SnackbarProvider>\n        </QueryParamProvider>\n      </QueryClientProvider>\n    </CustomRouter>\n  );\n\n  return render(<BaseRender />, options);\n}\n"],"names":["useLayoutEffect","useState","render","Router","createMemoryHistory","QueryParamProvider","ReactRouter6Adapter","QueryClient","QueryClientProvider","ChartsProvider","SnackbarProvider","testChartsTheme","mockPluginRegistry","PluginRegistry","MOCK_PLUGINS","CustomRouter","history","children","state","setState","action","location","listen","navigationType","navigator","renderWithContext","ui","options","queryClient","defaultOptions","queries","refetchOnWindowFocus","retry","customHistory","BaseRender","client","adapter","anchorOrigin","vertical","horizontal","chartsTheme"],"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,eAAe,EAAEC,QAAQ,QAAQ,OAAO,CAAC;AAClD,SAASC,MAAM,QAAuB,wBAAwB,CAAC;AAC/D,SAASC,MAAM,QAAQ,kBAAkB,CAAC;AAC1C,SAASC,mBAAmB,QAAuB,SAAS,CAAC;AAC7D,SAASC,kBAAkB,QAAQ,kBAAkB,CAAC;AACtD,SAASC,mBAAmB,QAAQ,0CAA0C,CAAC;AAC/E,SAASC,WAAW,EAAEC,mBAAmB,QAAQ,uBAAuB,CAAC;AACzE,SAASC,cAAc,EAAEC,gBAAgB,EAAEC,eAAe,QAAQ,wBAAwB,CAAC;AAC3F,SAASC,kBAAkB,EAAEC,cAAc,QAAQ,2BAA2B,CAAC;AAC/E,SAASC,YAAY,QAAQ,mBAAmB,CAAC;AAOjD;;;CAGC,GACD,MAAMC,YAAY,GAAgC,CAAC,EAAEC,OAAO,CAAA,EAAEC,QAAQ,CAAA,EAAE,GAAK;IAC3E,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGlB,QAAQ,CAAC;QACjCmB,MAAM,EAAEJ,OAAO,CAACI,MAAM;QACtBC,QAAQ,EAAEL,OAAO,CAACK,QAAQ;KAC3B,CAAC,AAAC;IAEHrB,eAAe,CAAC,IAAMgB,OAAO,CAACM,MAAM,CAACH,QAAQ,CAAC,EAAE;QAACH,OAAO;KAAC,CAAC,CAAC;IAE3D,qBACE,KAACb,MAAM;QAACkB,QAAQ,EAAEH,KAAK,CAACG,QAAQ;QAAEE,cAAc,EAAEL,KAAK,CAACE,MAAM;QAAEI,SAAS,EAAER,OAAO;kBAC/EC,QAAQ;MACF,CACT;AACJ,CAAC,AAAC;AAEF;;CAEC,GACD,OAAO,SAASQ,iBAAiB,CAC/BC,EAAsB,EACtBC,OAAwC,EACxCX,OAAuB,EACvB;IACA,iEAAiE;IACjE,MAAMY,WAAW,GAAG,IAAIrB,WAAW,CAAC;QAAEsB,cAAc,EAAE;YAAEC,OAAO,EAAE;gBAAEC,oBAAoB,EAAE,KAAK;gBAAEC,KAAK,EAAE,KAAK;aAAE;SAAE;KAAE,CAAC,AAAC;IAEpH,MAAMC,aAAa,GAAGjB,OAAO,aAAPA,OAAO,cAAPA,OAAO,GAAIZ,mBAAmB,EAAE,AAAC;IAEvD,MAAM8B,UAAU,GAAG,kBACjB,KAACnB,YAAY;YAACC,OAAO,EAAEiB,aAAa;sBAClC,cAAA,KAACzB,mBAAmB;gBAAC2B,MAAM,EAAEP,WAAW;0BACtC,cAAA,KAACvB,kBAAkB;oBAAC+B,OAAO,EAAE9B,mBAAmB;8BAC9C,cAAA,KAACI,gBAAgB;wBAAC2B,YAAY,EAAE;4BAAEC,QAAQ,EAAE,QAAQ;4BAAEC,UAAU,EAAE,OAAO;yBAAE;kCACzE,cAAA,KAAC9B,cAAc;4BAAC+B,WAAW,EAAE7B,eAAe;sCAC1C,cAAA,KAACE,cAAc;gCAAE,GAAGD,kBAAkB,IAAIE,YAAY,CAAC;0CAAGY,EAAE;8BAAkB;0BAC/D;sBACA;kBACA;cACD;UACT,AAChB,AAAC;IAEF,OAAOxB,MAAM,eAAC,KAACgC,UAAU,KAAG,EAAEP,OAAO,CAAC,CAAC;AACzC,CAAC"}

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;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,gBA6FpD,CAAC"}

package/dist/views/ViewDashboard/DashboardApp.js

@@ -13,11 +13,12 @@
 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 { 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 chartsTheme = useChartsTheme();
     const { setEditMode  } = useEditMode();
     const { dashboard , setDashboard  } = useDashboard();
     const [originalDashboard, setOriginalDashboard] = useState(undefined);
@@ -85,7 +86,11 @@ 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, {}),

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 {\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\n  const chartsTheme = useChartsTheme();\n\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        <ChartsProvider chartsTheme={chartsTheme} enablePinning={false}>\n          <PanelDrawer />\n        </ChartsProvider>\n        <PanelGroupDialog />\n        <DeletePanelGroupDialog />\n        <DeletePanelDialog />\n        <DashboardDiscardChangesConfirmationDialog />\n        <EditJsonDialog />\n        <SaveChangesConfirmationDialog />\n      </Box>\n    </Box>\n  );\n};\n"],"names":["useState","Box","ChartsProvider","ErrorAlert","ErrorBoundary","useChartsTheme","PanelDrawer","Dashboard","PanelGroupDialog","DeletePanelGroupDialog","DashboardDiscardChangesConfirmationDialog","DashboardToolbar","DeletePanelDialog","EditJsonDialog","SaveChangesConfirmationDialog","useDashboard","useDiscardChangesConfirmationDialog","useEditMode","DashboardApp","props","dashboardResource","dashboardTitleComponent","emptyDashboardProps","onSave","onDiscard","initialVariableIsSticky","isReadonly","chartsTheme","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","enablePinning"],"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,QAAQ,QAAQ,OAAO,CAAC;AACjC,SAASC,GAAG,QAAQ,eAAe,CAAC;AACpC,SAASC,cAAc,EAAEC,UAAU,EAAEC,aAAa,EAAEC,cAAc,QAAQ,wBAAwB,CAAC;AAEnG,SACEC,WAAW,EACXC,SAAS,EACTC,gBAAgB,EAChBC,sBAAsB,EACtBC,yCAAyC,EACzCC,gBAAgB,EAChBC,iBAAiB,EAEjBC,cAAc,EACdC,6BAA6B,QACxB,kBAAkB,CAAC;AAC1B,SAA0BC,YAAY,EAAEC,mCAAmC,EAAEC,WAAW,QAAQ,eAAe,CAAC;AAYhH,OAAO,MAAMC,YAAY,GAAG,CAACC,KAAwB,GAAK;IACxD,MAAM,EACJC,iBAAiB,CAAA,EACjBC,uBAAuB,CAAA,EACvBC,mBAAmB,CAAA,EACnBC,MAAM,CAAA,EACNC,SAAS,CAAA,EACTC,uBAAuB,CAAA,EACvBC,UAAU,CAAA,IACX,GAAGP,KAAK,AAAC;IAEV,MAAMQ,WAAW,GAAGtB,cAAc,EAAE,AAAC;IAErC,MAAM,EAAEuB,WAAW,CAAA,EAAE,GAAGX,WAAW,EAAE,AAAC;IACtC,MAAM,EAAEY,SAAS,CAAA,EAAEC,YAAY,CAAA,EAAE,GAAGf,YAAY,EAAE,AAAC;IACnD,MAAM,CAACgB,iBAAiB,EAAEC,oBAAoB,CAAC,GAAGhC,QAAQ,CAAgCiC,SAAS,CAAC,AAAC;IAErG,MAAM,EAAEC,oCAAoC,CAAA,EAAEC,qCAAqC,CAAA,EAAE,GACnFnB,mCAAmC,EAAE,AAAC;IAExC,MAAMoB,oBAAoB,GAAG,IAAM;QACjC,gDAAgD;QAChD,IAAIL,iBAAiB,EAAE;YACrBD,YAAY,CAACC,iBAAiB,CAAC,CAAC;QAClC,CAAC;QACDH,WAAW,CAAC,KAAK,CAAC,CAAC;QACnBO,qCAAqC,EAAE,CAAC;QACxC,IAAIX,SAAS,EAAE;YACbA,SAAS,CAACK,SAAS,CAAC,CAAC;QACvB,CAAC;IACH,CAAC,AAAC;IAEF,MAAMQ,iBAAiB,GAAG,IAAM;QAC9BT,WAAW,CAAC,IAAI,CAAC,CAAC;QAClBI,oBAAoB,CAACH,SAAS,CAAC,CAAC;IAClC,CAAC,AAAC;IAEF,MAAMS,mBAAmB,GAAG,IAAM;QAChC,uCAAuC;QACvC,IAAIC,IAAI,CAACC,SAAS,CAACX,SAAS,CAAC,KAAKU,IAAI,CAACC,SAAS,CAACT,iBAAiB,CAAC,EAAE;YACnEH,WAAW,CAAC,KAAK,CAAC,CAAC;QACrB,OAAO;YACLM,oCAAoC,CAAC;gBACnCO,gBAAgB,EAAE,IAAM;oBACtBL,oBAAoB,EAAE,CAAC;gBACzB,CAAC;gBACDM,QAAQ,EAAE,IAAM;oBACdP,qCAAqC,EAAE,CAAC;gBAC1C,CAAC;aACF,CAAC,CAAC;QACL,CAAC;IACH,CAAC,AAAC;IAEF,qBACE,MAAClC,GAAG;QACF0C,EAAE,EAAE;YACFC,QAAQ,EAAE,CAAC;YACXC,SAAS,EAAE,QAAQ;YACnBC,SAAS,EAAE,MAAM;YACjBC,OAAO,EAAE,MAAM;YACfC,aAAa,EAAE,QAAQ;SACxB;;0BAED,KAACrC,gBAAgB;gBACfsC,aAAa,EAAE7B,iBAAiB,CAAC8B,QAAQ,CAACC,IAAI;gBAC9C9B,uBAAuB,EAAEA,uBAAuB;gBAChDI,uBAAuB,EAAEA,uBAAuB;gBAChDF,MAAM,EAAEA,MAAM;gBACdG,UAAU,EAAEA,UAAU;gBACtBW,iBAAiB,EAAEA,iBAAiB;gBACpCC,mBAAmB,EAAEA,mBAAmB;cACxC;0BACF,MAACrC,GAAG;gBAAC0C,EAAE,EAAE;oBAAES,OAAO,EAAE,CAACC,KAAK,GAAKA,KAAK,CAACC,OAAO,CAAC,CAAC,CAAC;oBAAEC,MAAM,EAAE,MAAM;iBAAE;;kCAC/D,KAACnD,aAAa;wBAACoD,iBAAiB,EAAErD,UAAU;kCAC1C,cAAA,KAACI,SAAS;4BACRe,mBAAmB,EAAE;gCACnBe,iBAAiB;gCACjB,GAAGf,mBAAmB;6BACvB;0BACD;sBACY;kCAChB,KAACpB,cAAc;wBAACyB,WAAW,EAAEA,WAAW;wBAAE8B,aAAa,EAAE,KAAK;kCAC5D,cAAA,KAACnD,WAAW,KAAG;sBACA;kCACjB,KAACE,gBAAgB,KAAG;kCACpB,KAACC,sBAAsB,KAAG;kCAC1B,KAACG,iBAAiB,KAAG;kCACrB,KAACF,yCAAyC,KAAG;kCAC7C,KAACG,cAAc,KAAG;kCAClB,KAACC,6BAA6B,KAAG;;cAC7B;;MACF,CACN;AACJ,CAAC,CAAC"}

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

@@ -1,9 +1,10 @@
 /// <reference types="react" />
 import { BoxProps } from '@mui/material';
-import { DatasourceStoreProviderProps } from '../../context';
+import { DatasourceStoreProviderProps, TemplateVariableProviderProps } from '../../context';
 import { DashboardAppProps } from './DashboardApp';
 export interface ViewDashboardProps extends Omit<BoxProps, 'children'>, DashboardAppProps {
     datasourceApi: DatasourceStoreProviderProps['datasourceApi'];
+    externalVariableDefinitions?: TemplateVariableProviderProps['externalVariableDefinitions'];
     isEditing?: boolean;
 }
 /**

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,EAE7B,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,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,eA2DtD"}
+{"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"}

package/dist/views/ViewDashboard/ViewDashboard.js

@@ -20,14 +20,14 @@ 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 , dashboardTitleComponent , emptyDashboardProps , onSave , onDiscard , initialVariableIsSticky , isReadonly , isEditing , sx , ...others } = props;
+    const { dashboardResource , datasourceApi , externalVariableDefinitions , dashboardTitleComponent , emptyDashboardProps , onSave , onDiscard , initialVariableIsSticky , isReadonly , isEditing , sx , ...others } = props;
     const { spec  } = dashboardResource;
     var _duration;
     const dashboardDuration = (_duration = spec.duration) !== null && _duration !== void 0 ? _duration : DEFAULT_DASHBOARD_DURATION;
     var _refreshInterval;
-    const dashhboardRefreshInterval = (_refreshInterval = spec.refreshInterval) !== null && _refreshInterval !== void 0 ? _refreshInterval : DEFAULT_REFRESH_INTERVAL;
+    const dashboardRefreshInterval = (_refreshInterval = spec.refreshInterval) !== null && _refreshInterval !== void 0 ? _refreshInterval : DEFAULT_REFRESH_INTERVAL;
     const initialTimeRange = useInitialTimeRange(dashboardDuration);
-    const initialRefreshInterval = useInitialRefreshInterval(dashhboardRefreshInterval);
+    const initialRefreshInterval = useInitialRefreshInterval(dashboardRefreshInterval);
     return /*#__PURE__*/ _jsx(DatasourceStoreProvider, {
         dashboardResource: dashboardResource,
         datasourceApi: datasourceApi,
@@ -42,6 +42,7 @@ import { DashboardApp } from './DashboardApp';
                 enabledURLParams: true,
                 children: /*#__PURE__*/ _jsx(TemplateVariableProvider, {
                     initialVariableDefinitions: spec.variables,
+                    externalVariableDefinitions: externalVariableDefinitions,
                     children: /*#__PURE__*/ _jsx(Box, {
                         sx: combineSx({
                             display: 'flex',

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} from '../../context';\nimport { DashboardApp, DashboardAppProps } from './DashboardApp';\n\nexport interface ViewDashboardProps extends Omit<BoxProps, 'children'>, DashboardAppProps {\n  datasourceApi: DatasourceStoreProviderProps['datasourceApi'];\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    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 dashhboardRefreshInterval = spec.refreshInterval ?? DEFAULT_REFRESH_INTERVAL;\n  const initialTimeRange = useInitialTimeRange(dashboardDuration);\n  const initialRefreshInterval = useInitialRefreshInterval(dashhboardRefreshInterval);\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 initialVariableDefinitions={spec.variables}>\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","dashboardTitleComponent","emptyDashboardProps","onSave","onDiscard","initialVariableIsSticky","isReadonly","isEditing","sx","others","spec","dashboardDuration","duration","dashhboardRefreshInterval","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,QAClB,eAAe,CAAC;AACvB,SAASC,YAAY,QAA2B,gBAAgB,CAAC;AAOjE;;CAEC,GACD,OAAO,SAASC,aAAa,CAACC,KAAyB,EAAE;IACvD,MAAM,EACJC,iBAAiB,CAAA,EACjBC,aAAa,CAAA,EACbC,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,GAAGX,KAAK,AAAC;IACV,MAAM,EAAEY,IAAI,CAAA,EAAE,GAAGX,iBAAiB,AAAC;QACTW,SAAa;IAAvC,MAAMC,iBAAiB,GAAGD,CAAAA,SAAa,GAAbA,IAAI,CAACE,QAAQ,cAAbF,SAAa,cAAbA,SAAa,GAAIzB,0BAA0B,AAAC;QACpCyB,gBAAoB;IAAtD,MAAMG,yBAAyB,GAAGH,CAAAA,gBAAoB,GAApBA,IAAI,CAACI,eAAe,cAApBJ,gBAAoB,cAApBA,gBAAoB,GAAIxB,wBAAwB,AAAC;IACnF,MAAM6B,gBAAgB,GAAGvB,mBAAmB,CAACmB,iBAAiB,CAAC,AAAC;IAChE,MAAMK,sBAAsB,GAAGzB,yBAAyB,CAACsB,yBAAyB,CAAC,AAAC;IAEpF,qBACE,KAAClB,uBAAuB;QAACI,iBAAiB,EAAEA,iBAAiB;QAAEC,aAAa,EAAEA,aAAa;kBACzF,cAAA,KAACN,iBAAiB;YAACuB,YAAY,EAAE;gBAAElB,iBAAiB;gBAAEmB,UAAU,EAAE,CAAC,CAACX,SAAS;aAAE;sBAC7E,cAAA,KAACjB,iBAAiB;gBAChByB,gBAAgB,EAAEA,gBAAgB;gBAClCC,sBAAsB,EAAEA,sBAAsB;gBAC9CG,gBAAgB,EAAE,IAAI;0BAEtB,cAAA,KAAC1B,wBAAwB;oBAAC2B,0BAA0B,EAAEV,IAAI,CAACW,SAAS;8BAClE,cAAA,KAACrC,GAAG;wBACFwB,EAAE,EAAEnB,SAAS,CACX;4BACEiC,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,KAACtB,aAAa;4BAACwC,iBAAiB,EAAEvC,UAAU;sCAC1C,cAAA,KAACQ,YAAY;gCACXG,iBAAiB,EAAEA,iBAAiB;gCACpCE,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 { 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":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@perses-dev/dashboards",
-  "version": "0.38.0",
+  "version": "0.39.0",
   "description": "The dashboards feature in Perses",
   "license": "Apache-2.0",
   "homepage": "https://github.com/perses/perses/blob/main/README.md",
@@ -29,9 +29,9 @@
     "lint:fix": "eslint --fix src --ext .ts,.tsx"
   },
   "dependencies": {
-    "@perses-dev/components": "0.38.0",
-    "@perses-dev/core": "0.38.0",
-    "@perses-dev/plugin-system": "0.38.0",
+    "@perses-dev/components": "0.39.0",
+    "@perses-dev/core": "0.39.0",
+    "@perses-dev/plugin-system": "0.39.0",
     "@types/react-grid-layout": "^1.3.2",
     "date-fns": "^2.28.0",
     "immer": "^9.0.15",
@@ -44,8 +44,8 @@
     "zustand": "^4.3.3"
   },
   "devDependencies": {
-    "@perses-dev/internal-utils": "0.38.0",
-    "@perses-dev/storybook": "0.38.0",
+    "@perses-dev/internal-utils": "0.39.0",
+    "@perses-dev/storybook": "0.39.0",
     "history": "^5.3.0",
     "intersection-observer": "^0.12.2"
   },