@perses-dev/dashboards 0.0.0-snapshot-color-palette-gen-test-bc1b508 → 0.0.0-snapshot-tooltip-highlight-c995fc8

package/dist/components/PanelDrawer/usePanelEditor.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+import { PanelDefinition, QueryDefinition } from '@perses-dev/core';
+/**
+ * UsePanelEditor is used in PanelEditorForm
+ * This hook stores the states of panel definition and returns the onChange handlers for each state
+ */
+export declare const usePanelEditor: (panelDefinition: PanelDefinition) => {
+    panelDefinition: PanelDefinition<import("@perses-dev/core").UnknownSpec>;
+    setName: import("react").Dispatch<import("react").SetStateAction<string>>;
+    setDescription: import("react").Dispatch<import("react").SetStateAction<string | undefined>>;
+    setQueries: (queries?: QueryDefinition[], hideQueryEditor?: boolean) => void;
+    setPlugin: import("react").Dispatch<import("react").SetStateAction<import("@perses-dev/core").Definition<import("@perses-dev/core").UnknownSpec>>>;
+    setPanelDefinition: (panelDefinition: PanelDefinition) => void;
+};
+//# sourceMappingURL=usePanelEditor.d.ts.map

package/dist/components/PanelDrawer/usePanelEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePanelEditor.d.ts","sourceRoot":"","sources":["../../../src/components/PanelDrawer/usePanelEditor.tsx"],"names":[],"mappings":";AAcA,OAAO,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAEpE;;;GAGG;AACH,eAAO,MAAM,cAAc,oBAAqB,eAAe;;;;2BAehD,eAAe,EAAE,oBAAoB,OAAO;;0CAarC,eAAe;CA4BpC,CAAC"}

package/dist/components/PanelDrawer/usePanelEditor.js

@@ -0,0 +1,84 @@
+// Copyright 2023 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+import { useCallback, useMemo, useState } from 'react';
+/**
+ * UsePanelEditor is used in PanelEditorForm
+ * This hook stores the states of panel definition and returns the onChange handlers for each state
+ */ export const usePanelEditor = (panelDefinition)=>{
+    const { display , plugin: pluginDefinition , queries: initialQueries  } = panelDefinition.spec;
+    const [name, setName] = useState(display.name);
+    const [description, setDescription] = useState(display.description);
+    const [plugin, setPlugin] = useState(pluginDefinition);
+    // need to keep track of prevQueries if switching from a panel with no queries (ex: markdown) to one with queries
+    const [prevQueries, setPrevQueries] = useState(initialQueries);
+    const [currentQueries, setCurrentQueries] = useState(initialQueries);
+    /**
+   * If hideQueryEditor is true, set panelDefinition.spec.queries to undefined.
+   * If hideQueryEditor is false and query is undefined, set panelDefinition.spec.queries to previous queries.
+   */ const setQueries = useCallback((queries, hideQueryEditor)=>{
+        if (hideQueryEditor) {
+            setPrevQueries(currentQueries);
+            setCurrentQueries(undefined);
+        } else {
+            setCurrentQueries(queries === undefined ? prevQueries : queries);
+        }
+    }, [
+        setCurrentQueries,
+        currentQueries,
+        setPrevQueries,
+        prevQueries
+    ]);
+    // reset panel definition
+    const setPanelDefinition = useCallback((panelDefinition)=>{
+        const { display , plugin , queries  } = panelDefinition.spec;
+        setName(display.name);
+        setDescription(display.description);
+        setPlugin(plugin);
+        setQueries(queries);
+    }, [
+        setName,
+        setDescription,
+        setPlugin,
+        setQueries
+    ]);
+    return useMemo(()=>({
+            panelDefinition: {
+                kind: 'Panel',
+                spec: {
+                    display: {
+                        name,
+                        description
+                    },
+                    plugin,
+                    queries: currentQueries
+                }
+            },
+            setName,
+            setDescription,
+            setQueries,
+            setPlugin,
+            setPanelDefinition
+        }), [
+        name,
+        description,
+        plugin,
+        currentQueries,
+        setName,
+        setDescription,
+        setQueries,
+        setPlugin,
+        setPanelDefinition
+    ]);
+};
+
+//# sourceMappingURL=usePanelEditor.js.map

package/dist/components/PanelDrawer/usePanelEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/PanelDrawer/usePanelEditor.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 { useCallback, useMemo, useState } from 'react';\nimport { PanelDefinition, QueryDefinition } from '@perses-dev/core';\n\n/**\n * UsePanelEditor is used in PanelEditorForm\n * This hook stores the states of panel definition and returns the onChange handlers for each state\n */\nexport const usePanelEditor = (panelDefinition: PanelDefinition) => {\n  const { display, plugin: pluginDefinition, queries: initialQueries } = panelDefinition.spec;\n  const [name, setName] = useState(display.name);\n  const [description, setDescription] = useState(display.description);\n  const [plugin, setPlugin] = useState(pluginDefinition);\n\n  // need to keep track of prevQueries if switching from a panel with no queries (ex: markdown) to one with queries\n  const [prevQueries, setPrevQueries] = useState(initialQueries);\n  const [currentQueries, setCurrentQueries] = useState(initialQueries);\n\n  /**\n   * If hideQueryEditor is true, set panelDefinition.spec.queries to undefined.\n   * If hideQueryEditor is false and query is undefined, set panelDefinition.spec.queries to previous queries.\n   */\n  const setQueries = useCallback(\n    (queries?: QueryDefinition[], hideQueryEditor?: boolean) => {\n      if (hideQueryEditor) {\n        setPrevQueries(currentQueries);\n        setCurrentQueries(undefined);\n      } else {\n        setCurrentQueries(queries === undefined ? prevQueries : queries);\n      }\n    },\n    [setCurrentQueries, currentQueries, setPrevQueries, prevQueries]\n  );\n\n  // reset panel definition\n  const setPanelDefinition = useCallback(\n    (panelDefinition: PanelDefinition) => {\n      const { display, plugin, queries } = panelDefinition.spec;\n      setName(display.name);\n      setDescription(display.description);\n      setPlugin(plugin);\n      setQueries(queries);\n    },\n    [setName, setDescription, setPlugin, setQueries]\n  );\n\n  return useMemo(\n    () => ({\n      panelDefinition: {\n        kind: 'Panel',\n        spec: {\n          display: { name, description },\n          plugin,\n          queries: currentQueries,\n        },\n      } as PanelDefinition,\n      setName,\n      setDescription,\n      setQueries,\n      setPlugin,\n      setPanelDefinition,\n    }),\n    [name, description, plugin, currentQueries, setName, setDescription, setQueries, setPlugin, setPanelDefinition]\n  );\n};\n"],"names":["useCallback","useMemo","useState","usePanelEditor","panelDefinition","display","plugin","pluginDefinition","queries","initialQueries","spec","name","setName","description","setDescription","setPlugin","prevQueries","setPrevQueries","currentQueries","setCurrentQueries","setQueries","hideQueryEditor","undefined","setPanelDefinition","kind"],"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,WAAW,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO,CAAC;AAGvD;;;CAGC,GACD,OAAO,MAAMC,cAAc,GAAG,CAACC,eAAgC,GAAK;IAClE,MAAM,EAAEC,OAAO,CAAA,EAAEC,MAAM,EAAEC,gBAAgB,CAAA,EAAEC,OAAO,EAAEC,cAAc,CAAA,EAAE,GAAGL,eAAe,CAACM,IAAI,AAAC;IAC5F,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAGV,QAAQ,CAACG,OAAO,CAACM,IAAI,CAAC,AAAC;IAC/C,MAAM,CAACE,WAAW,EAAEC,cAAc,CAAC,GAAGZ,QAAQ,CAACG,OAAO,CAACQ,WAAW,CAAC,AAAC;IACpE,MAAM,CAACP,MAAM,EAAES,SAAS,CAAC,GAAGb,QAAQ,CAACK,gBAAgB,CAAC,AAAC;IAEvD,iHAAiH;IACjH,MAAM,CAACS,WAAW,EAAEC,cAAc,CAAC,GAAGf,QAAQ,CAACO,cAAc,CAAC,AAAC;IAC/D,MAAM,CAACS,cAAc,EAAEC,iBAAiB,CAAC,GAAGjB,QAAQ,CAACO,cAAc,CAAC,AAAC;IAErE;;;GAGC,GACD,MAAMW,UAAU,GAAGpB,WAAW,CAC5B,CAACQ,OAA2B,EAAEa,eAAyB,GAAK;QAC1D,IAAIA,eAAe,EAAE;YACnBJ,cAAc,CAACC,cAAc,CAAC,CAAC;YAC/BC,iBAAiB,CAACG,SAAS,CAAC,CAAC;QAC/B,OAAO;YACLH,iBAAiB,CAACX,OAAO,KAAKc,SAAS,GAAGN,WAAW,GAAGR,OAAO,CAAC,CAAC;QACnE,CAAC;IACH,CAAC,EACD;QAACW,iBAAiB;QAAED,cAAc;QAAED,cAAc;QAAED,WAAW;KAAC,CACjE,AAAC;IAEF,yBAAyB;IACzB,MAAMO,kBAAkB,GAAGvB,WAAW,CACpC,CAACI,eAAgC,GAAK;QACpC,MAAM,EAAEC,OAAO,CAAA,EAAEC,MAAM,CAAA,EAAEE,OAAO,CAAA,EAAE,GAAGJ,eAAe,CAACM,IAAI,AAAC;QAC1DE,OAAO,CAACP,OAAO,CAACM,IAAI,CAAC,CAAC;QACtBG,cAAc,CAACT,OAAO,CAACQ,WAAW,CAAC,CAAC;QACpCE,SAAS,CAACT,MAAM,CAAC,CAAC;QAClBc,UAAU,CAACZ,OAAO,CAAC,CAAC;IACtB,CAAC,EACD;QAACI,OAAO;QAAEE,cAAc;QAAEC,SAAS;QAAEK,UAAU;KAAC,CACjD,AAAC;IAEF,OAAOnB,OAAO,CACZ,IAAO,CAAA;YACLG,eAAe,EAAE;gBACfoB,IAAI,EAAE,OAAO;gBACbd,IAAI,EAAE;oBACJL,OAAO,EAAE;wBAAEM,IAAI;wBAAEE,WAAW;qBAAE;oBAC9BP,MAAM;oBACNE,OAAO,EAAEU,cAAc;iBACxB;aACF;YACDN,OAAO;YACPE,cAAc;YACdM,UAAU;YACVL,SAAS;YACTQ,kBAAkB;SACnB,CAAA,AAAC,EACF;QAACZ,IAAI;QAAEE,WAAW;QAAEP,MAAM;QAAEY,cAAc;QAAEN,OAAO;QAAEE,cAAc;QAAEM,UAAU;QAAEL,SAAS;QAAEQ,kBAAkB;KAAC,CAChH,CAAC;AACJ,CAAC,CAAC"}

package/dist/components/TimeRangeControls/TimeRangeControls.js

@@ -17,7 +17,7 @@ import { DateTimeRangePicker, InfoTooltip } from '@perses-dev/components';
 import { useTimeRange } from '@perses-dev/plugin-system';
 import { isDurationString } from '@perses-dev/core';
 import { TOOLTIP_TEXT } from '../../constants';
-import { useDefaultTimeRange } from '../../context';
+import { useDashboardDuration } from '../../context';
 import { ToolbarIconButton } from '../ToolbarIconButton';
 export const TIME_OPTIONS = [
     {
@@ -79,17 +79,17 @@ const DEFAULT_HEIGHT = '34px';
 export function TimeRangeControls({ heightPx , showRefresh =true  }) {
     const { timeRange , setTimeRange , refresh  } = useTimeRange();
     // TODO: Remove this since it couples to the dashboard context
-    const defaultTimeRange = useDefaultTimeRange();
+    const dashboardDuration = useDashboardDuration();
     // Convert height to a string, then use the string for styling
     const height = heightPx === undefined ? DEFAULT_HEIGHT : `${heightPx}px`;
     // add time shortcut if one does not match duration from dashboard JSON
-    if (!TIME_OPTIONS.some((option)=>option.value.pastDuration === defaultTimeRange.pastDuration)) {
-        if (isDurationString(defaultTimeRange.pastDuration)) {
+    if (!TIME_OPTIONS.some((option)=>option.value.pastDuration === dashboardDuration)) {
+        if (isDurationString(dashboardDuration)) {
             TIME_OPTIONS.push({
                 value: {
-                    pastDuration: defaultTimeRange.pastDuration
+                    pastDuration: dashboardDuration
                 },
-                display: `Last ${defaultTimeRange.pastDuration}`
+                display: `Last ${dashboardDuration}`
             });
         }
     }

package/dist/components/TimeRangeControls/TimeRangeControls.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/TimeRangeControls/TimeRangeControls.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 RefreshIcon from 'mdi-material-ui/Refresh';\nimport { Stack } from '@mui/material';\nimport { DateTimeRangePicker, InfoTooltip, TimeOption } from '@perses-dev/components';\nimport { useTimeRange } from '@perses-dev/plugin-system';\nimport { isDurationString } from '@perses-dev/core';\nimport { TOOLTIP_TEXT } from '../../constants';\nimport { useDefaultTimeRange } from '../../context';\nimport { ToolbarIconButton } from '../ToolbarIconButton';\n\nexport const TIME_OPTIONS: TimeOption[] = [\n  { value: { pastDuration: '5m' }, display: 'Last 5 minutes' },\n  { value: { pastDuration: '15m' }, display: 'Last 15 minutes' },\n  { value: { pastDuration: '30m' }, display: 'Last 30 minutes' },\n  { value: { pastDuration: '1h' }, display: 'Last 1 hour' },\n  { value: { pastDuration: '6h' }, display: 'Last 6 hours' },\n  { value: { pastDuration: '12h' }, display: 'Last 12 hours' },\n  { value: { pastDuration: '24h' }, display: 'Last 1 day' },\n  { value: { pastDuration: '7d' }, display: 'Last 7 days' },\n  { value: { pastDuration: '14d' }, display: 'Last 14 days' },\n];\n\nconst DEFAULT_HEIGHT = '34px';\n\ninterface TimeRangeControlsProps {\n  // The controls look best at heights >= 28 pixels\n  heightPx?: number;\n\n  // Whether to show the refresh button or not\n  showRefresh?: boolean;\n}\n\nexport function TimeRangeControls({ heightPx, showRefresh = true }: TimeRangeControlsProps) {\n  const { timeRange, setTimeRange, refresh } = useTimeRange();\n  // TODO: Remove this since it couples to the dashboard context\n  const defaultTimeRange = useDefaultTimeRange();\n\n  // Convert height to a string, then use the string for styling\n  const height = heightPx === undefined ? DEFAULT_HEIGHT : `${heightPx}px`;\n\n  // add time shortcut if one does not match duration from dashboard JSON\n  if (!TIME_OPTIONS.some((option) => option.value.pastDuration === defaultTimeRange.pastDuration)) {\n    if (isDurationString(defaultTimeRange.pastDuration)) {\n      TIME_OPTIONS.push({\n        value: { pastDuration: defaultTimeRange.pastDuration },\n        display: `Last ${defaultTimeRange.pastDuration}`,\n      });\n    }\n  }\n\n  return (\n    <Stack direction=\"row\" spacing={1}>\n      <DateTimeRangePicker timeOptions={TIME_OPTIONS} value={timeRange} onChange={setTimeRange} height={height} />\n      {showRefresh && (\n        <InfoTooltip description={TOOLTIP_TEXT.refreshDashboard}>\n          <ToolbarIconButton aria-label={TOOLTIP_TEXT.refreshDashboard} onClick={refresh} sx={{ height }}>\n            <RefreshIcon />\n          </ToolbarIconButton>\n        </InfoTooltip>\n      )}\n    </Stack>\n  );\n}\n"],"names":["RefreshIcon","Stack","DateTimeRangePicker","InfoTooltip","useTimeRange","isDurationString","TOOLTIP_TEXT","useDefaultTimeRange","ToolbarIconButton","TIME_OPTIONS","value","pastDuration","display","DEFAULT_HEIGHT","TimeRangeControls","heightPx","showRefresh","timeRange","setTimeRange","refresh","defaultTimeRange","height","undefined","some","option","push","direction","spacing","timeOptions","onChange","description","refreshDashboard","aria-label","onClick","sx"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/TimeRangeControls/TimeRangeControls.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 RefreshIcon from 'mdi-material-ui/Refresh';\nimport { Stack } from '@mui/material';\nimport { DateTimeRangePicker, InfoTooltip, TimeOption } from '@perses-dev/components';\nimport { useTimeRange } from '@perses-dev/plugin-system';\nimport { isDurationString } from '@perses-dev/core';\nimport { TOOLTIP_TEXT } from '../../constants';\nimport { useDashboardDuration } from '../../context';\nimport { ToolbarIconButton } from '../ToolbarIconButton';\n\nexport const TIME_OPTIONS: TimeOption[] = [\n  { value: { pastDuration: '5m' }, display: 'Last 5 minutes' },\n  { value: { pastDuration: '15m' }, display: 'Last 15 minutes' },\n  { value: { pastDuration: '30m' }, display: 'Last 30 minutes' },\n  { value: { pastDuration: '1h' }, display: 'Last 1 hour' },\n  { value: { pastDuration: '6h' }, display: 'Last 6 hours' },\n  { value: { pastDuration: '12h' }, display: 'Last 12 hours' },\n  { value: { pastDuration: '24h' }, display: 'Last 1 day' },\n  { value: { pastDuration: '7d' }, display: 'Last 7 days' },\n  { value: { pastDuration: '14d' }, display: 'Last 14 days' },\n];\n\nconst DEFAULT_HEIGHT = '34px';\n\ninterface TimeRangeControlsProps {\n  // The controls look best at heights >= 28 pixels\n  heightPx?: number;\n\n  // Whether to show the refresh button or not\n  showRefresh?: boolean;\n}\n\nexport function TimeRangeControls({ heightPx, showRefresh = true }: TimeRangeControlsProps) {\n  const { timeRange, setTimeRange, refresh } = useTimeRange();\n  // TODO: Remove this since it couples to the dashboard context\n  const dashboardDuration = useDashboardDuration();\n\n  // Convert height to a string, then use the string for styling\n  const height = heightPx === undefined ? DEFAULT_HEIGHT : `${heightPx}px`;\n\n  // add time shortcut if one does not match duration from dashboard JSON\n  if (!TIME_OPTIONS.some((option) => option.value.pastDuration === dashboardDuration)) {\n    if (isDurationString(dashboardDuration)) {\n      TIME_OPTIONS.push({\n        value: { pastDuration: dashboardDuration },\n        display: `Last ${dashboardDuration}`,\n      });\n    }\n  }\n\n  return (\n    <Stack direction=\"row\" spacing={1}>\n      <DateTimeRangePicker timeOptions={TIME_OPTIONS} value={timeRange} onChange={setTimeRange} height={height} />\n      {showRefresh && (\n        <InfoTooltip description={TOOLTIP_TEXT.refreshDashboard}>\n          <ToolbarIconButton aria-label={TOOLTIP_TEXT.refreshDashboard} onClick={refresh} sx={{ height }}>\n            <RefreshIcon />\n          </ToolbarIconButton>\n        </InfoTooltip>\n      )}\n    </Stack>\n  );\n}\n"],"names":["RefreshIcon","Stack","DateTimeRangePicker","InfoTooltip","useTimeRange","isDurationString","TOOLTIP_TEXT","useDashboardDuration","ToolbarIconButton","TIME_OPTIONS","value","pastDuration","display","DEFAULT_HEIGHT","TimeRangeControls","heightPx","showRefresh","timeRange","setTimeRange","refresh","dashboardDuration","height","undefined","some","option","push","direction","spacing","timeOptions","onChange","description","refreshDashboard","aria-label","onClick","sx"],"mappings":"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"}

package/dist/components/Variables/VariableEditorForm/VariableEditorForm.js

@@ -130,7 +130,7 @@ export function VariableEditForm({ initialVariableDefinition , onChange , onCanc
     const refreshPreview = ()=>{
         setPreviewKey((prev)=>prev + 1);
     };
-    /** We use the `previewKey` that we increment to know when to explicity update the
+    /** We use the `previewKey` that we increment to know when to explicitly update the
    * spec that will be used for preview. The reason why we do this is to avoid
    * having to re-fetch the values when the user is still editing the spec.
    */ const previewSpec = useMemo(()=>{

package/dist/components/Variables/VariableEditorForm/VariableEditorForm.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Variables/VariableEditorForm/VariableEditorForm.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 React, { useMemo, useState } from 'react';\nimport {\n  Box,\n  Typography,\n  Switch,\n  TextField,\n  Grid,\n  FormControl,\n  InputLabel,\n  MenuItem,\n  Select,\n  Button,\n  Stack,\n  Alert,\n  Chip,\n  IconButton,\n  ClickAwayListener,\n} from '@mui/material';\nimport { useImmer } from 'use-immer';\nimport { PluginEditor } from '@perses-dev/plugin-system';\nimport { VariableDefinition, ListVariableDefinition } from '@perses-dev/core';\nimport { ErrorBoundary, InfoTooltip } from '@perses-dev/components';\nimport Refresh from 'mdi-material-ui/Refresh';\nimport Clipboard from 'mdi-material-ui/ClipboardOutline';\n\nimport { TOOLTIP_TEXT } from '../../../constants';\nimport { useListVariablePluginValues, VARIABLE_TYPES } from '../variable-model';\nimport { VariableEditorState, getVariableDefinitionFromState, getInitialState } from './variable-editor-form-model';\n\nconst DEFAULT_MAX_PREVIEW_VALUES = 50;\n\n// TODO: Replace with proper validation library\nfunction getValidation(state: ReturnType<typeof getInitialState>) {\n  /** Name validation */\n  let name = null;\n  if (!state.name) {\n    name = 'Name is required';\n  }\n  // name can only contain alphanumeric characters and underscores and no spaces\n  if (state.name && !/^[a-zA-Z0-9_-]+$/.test(state.name)) {\n    name = 'Name can only contain alphanumeric characters, underscores, and dashes';\n  }\n\n  return {\n    name,\n    isValid: !name,\n  };\n}\n\nconst SectionHeader = ({ children }: React.PropsWithChildren) => (\n  <Typography pb={2} variant=\"subtitle1\">\n    {children}\n  </Typography>\n);\n\nfunction VariableListPreview({ definition, onRefresh }: { definition: ListVariableDefinition; onRefresh: () => void }) {\n  const { data, isFetching, error } = useListVariablePluginValues(definition);\n  const [maxValues, setMaxValues] = useState<number | undefined>(DEFAULT_MAX_PREVIEW_VALUES);\n  const showAll = () => {\n    setMaxValues(undefined);\n  };\n  let notShown = 0;\n\n  if (data && data?.length > 0 && maxValues) {\n    notShown = data.length - maxValues;\n  }\n  const errorMessage = (error as Error)?.message;\n\n  return (\n    <Box>\n      <Stack direction={'row'} spacing={1} alignItems=\"center\">\n        <Typography variant=\"caption\">Preview Values</Typography>\n        <InfoTooltip description={TOOLTIP_TEXT.refreshVariableValues}>\n          <IconButton onClick={onRefresh} size=\"small\">\n            <Refresh />\n          </IconButton>\n        </InfoTooltip>\n        <InfoTooltip description={TOOLTIP_TEXT.copyVariableValues}>\n          <IconButton\n            onClick={async () => {\n              if (data?.length) {\n                await navigator.clipboard.writeText(data.map((d) => d.label).join(','));\n                alert('Copied to clipboard!');\n              }\n            }}\n            size=\"small\"\n          >\n            <Clipboard />\n          </IconButton>\n        </InfoTooltip>\n      </Stack>\n      {errorMessage && <Alert severity=\"error\">{errorMessage}</Alert>}\n      {isFetching && 'Loading...'}\n      {data?.length === 0 && <Alert severity=\"info\">No results</Alert>}\n      <>\n        {data?.slice(0, maxValues).map((val) => (\n          <Chip sx={{ mr: 1, mb: 1 }} size=\"small\" key={val.value} label={val.label} />\n        ))}\n        {notShown > 0 && (\n          <Chip onClick={showAll} variant=\"outlined\" sx={{ mr: 1, mb: 1 }} size=\"small\" label={`+${notShown} more`} />\n        )}\n      </>\n    </Box>\n  );\n}\n\nexport function VariableEditForm({\n  initialVariableDefinition,\n  onChange,\n  onCancel,\n}: {\n  initialVariableDefinition: VariableDefinition;\n  onChange: (def: VariableDefinition) => void;\n  onCancel: () => void;\n}) {\n  const [state, setState] = useImmer(getInitialState(initialVariableDefinition));\n  const validation = useMemo(() => getValidation(state), [state]);\n\n  const [previewKey, setPreviewKey] = React.useState(0);\n\n  const refreshPreview = () => {\n    setPreviewKey((prev) => prev + 1);\n  };\n\n  /** We use the `previewKey` that we increment to know when to explicity update the\n   * spec that will be used for preview. The reason why we do this is to avoid\n   * having to re-fetch the values when the user is still editing the spec.\n   */\n  const previewSpec = useMemo(() => {\n    return getVariableDefinitionFromState(state) as ListVariableDefinition;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [previewKey]);\n\n  return (\n    <>\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          padding: (theme) => theme.spacing(1, 2),\n          borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n        }}\n      >\n        <Typography variant=\"h2\">Edit Variable</Typography>\n        <Stack direction=\"row\" spacing={1} sx={{ marginLeft: 'auto' }}>\n          <Button\n            disabled={!validation.isValid}\n            variant=\"contained\"\n            onClick={() => {\n              onChange(getVariableDefinitionFromState(state));\n            }}\n          >\n            Update\n          </Button>\n          <Button\n            color=\"secondary\"\n            variant=\"outlined\"\n            onClick={() => {\n              onCancel();\n            }}\n          >\n            Cancel\n          </Button>\n        </Stack>\n      </Box>\n      <Box padding={2} sx={{ overflowY: 'scroll' }}>\n        <SectionHeader>General</SectionHeader>\n        <Grid container spacing={2} mb={2}>\n          <Grid item xs={6}>\n            <TextField\n              required\n              error={!!validation.name}\n              fullWidth\n              label=\"Name\"\n              value={state.name}\n              helperText={validation.name}\n              onChange={(v) => {\n                setState((draft) => {\n                  draft.name = v.target.value as string;\n                });\n              }}\n            />\n          </Grid>\n          <Grid item xs={6}>\n            <FormControl fullWidth>\n              <InputLabel id=\"variable-type-select-label\">Type</InputLabel>\n              <Select\n                labelId=\"variable-type-select-label\"\n                id=\"variable-type-select\"\n                label=\"Type\"\n                value={state.kind}\n                onChange={(v) => {\n                  setState((draft) => {\n                    draft.kind = v.target.value as VariableEditorState['kind'];\n                  });\n                }}\n              >\n                {VARIABLE_TYPES.map((v) => (\n                  <MenuItem key={v.kind} value={v.kind}>\n                    {v.label}\n                  </MenuItem>\n                ))}\n              </Select>\n            </FormControl>\n          </Grid>\n          <Grid item xs={6}>\n            <TextField\n              fullWidth\n              label=\"Display Label\"\n              value={state.title || ''}\n              onChange={(v) => {\n                setState((draft) => {\n                  draft.title = v.target.value;\n                });\n              }}\n            />\n          </Grid>\n          <Grid item xs={12}>\n            <TextField\n              fullWidth\n              label=\"Description\"\n              value={state.description}\n              onChange={(v) => {\n                setState((draft) => {\n                  draft.description = v.target.value;\n                });\n              }}\n            />\n          </Grid>\n        </Grid>\n\n        {state.kind === 'TextVariable' && (\n          <>\n            <SectionHeader>Text Options</SectionHeader>\n            <Grid container spacing={2} mb={2}>\n              <Grid item xs={12}>\n                <TextField\n                  label=\"Value\"\n                  value={state.textVariableFields.value}\n                  onChange={(v) => {\n                    setState((draft) => {\n                      draft.textVariableFields.value = v.target.value;\n                    });\n                  }}\n                />\n              </Grid>\n            </Grid>\n          </>\n        )}\n\n        {state.kind === 'ListVariable' && (\n          <>\n            <SectionHeader>List Options</SectionHeader>\n            <Grid container spacing={2} mb={2}>\n              <Grid item xs={6}>\n                {/** Hack?: Cool technique to refresh the preview to simulate onBlur event */}\n                <ClickAwayListener onClickAway={() => refreshPreview()}>\n                  <Box />\n                </ClickAwayListener>\n                {/** */}\n                <PluginEditor\n                  width={500}\n                  pluginType=\"Variable\"\n                  pluginKindLabel=\"Source\"\n                  value={state.listVariableFields.plugin}\n                  onChange={(val) => {\n                    setState((draft) => {\n                      draft.listVariableFields.plugin = val;\n                    });\n                  }}\n                />\n              </Grid>\n\n              {state.listVariableFields.plugin.kind && (\n                <Grid item xs={12}>\n                  <TextField\n                    sx={{ mb: 1 }}\n                    label=\"Capturing Regexp Filter\"\n                    value={state.listVariableFields.capturing_regexp || ''}\n                    onChange={(e) => {\n                      setState((draft) => {\n                        draft.listVariableFields.capturing_regexp = e.target.value;\n                      });\n                    }}\n                  />\n                  <ErrorBoundary FallbackComponent={() => <div>Error previewing values</div>} resetKeys={[previewSpec]}>\n                    <VariableListPreview onRefresh={refreshPreview} definition={previewSpec} />\n                  </ErrorBoundary>\n                </Grid>\n              )}\n            </Grid>\n\n            <SectionHeader>Dropdown Options</SectionHeader>\n            <Grid container spacing={1} mb={1}>\n              <Grid item xs={12}>\n                Allow Multiple\n                <Switch\n                  checked={state.listVariableFields.allowMultiple}\n                  onChange={(e) => {\n                    setState((draft) => {\n                      draft.listVariableFields.allowMultiple = e.target.checked;\n                    });\n                  }}\n                />\n              </Grid>\n              <Grid item xs={12}>\n                Allow All\n                <Switch\n                  checked={state.listVariableFields.allowAll}\n                  onChange={(e) => {\n                    setState((draft) => {\n                      draft.listVariableFields.allowAll = e.target.checked;\n                    });\n                  }}\n                />\n              </Grid>\n            </Grid>\n          </>\n        )}\n      </Box>\n    </>\n  );\n}\n"],"names":["React","useMemo","useState","Box","Typography","Switch","TextField","Grid","FormControl","InputLabel","MenuItem","Select","Button","Stack","Alert","Chip","IconButton","ClickAwayListener","useImmer","PluginEditor","ErrorBoundary","InfoTooltip","Refresh","Clipboard","TOOLTIP_TEXT","useListVariablePluginValues","VARIABLE_TYPES","getVariableDefinitionFromState","getInitialState","DEFAULT_MAX_PREVIEW_VALUES","getValidation","state","name","test","isValid","SectionHeader","children","pb","variant","VariableListPreview","definition","onRefresh","data","isFetching","error","maxValues","setMaxValues","showAll","undefined","notShown","length","errorMessage","message","direction","spacing","alignItems","description","refreshVariableValues","onClick","size","copyVariableValues","navigator","clipboard","writeText","map","d","label","join","alert","severity","slice","val","sx","mr","mb","value","VariableEditForm","initialVariableDefinition","onChange","onCancel","setState","validation","previewKey","setPreviewKey","refreshPreview","prev","previewSpec","display","padding","theme","borderBottom","palette","divider","marginLeft","disabled","color","overflowY","container","item","xs","required","fullWidth","helperText","v","draft","target","id","labelId","kind","title","textVariableFields","onClickAway","width","pluginType","pluginKindLabel","listVariableFields","plugin","capturing_regexp","e","FallbackComponent","div","resetKeys","checked","allowMultiple","allowAll"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/Variables/VariableEditorForm/VariableEditorForm.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 React, { useMemo, useState } from 'react';\nimport {\n  Box,\n  Typography,\n  Switch,\n  TextField,\n  Grid,\n  FormControl,\n  InputLabel,\n  MenuItem,\n  Select,\n  Button,\n  Stack,\n  Alert,\n  Chip,\n  IconButton,\n  ClickAwayListener,\n} from '@mui/material';\nimport { useImmer } from 'use-immer';\nimport { PluginEditor } from '@perses-dev/plugin-system';\nimport { VariableDefinition, ListVariableDefinition } from '@perses-dev/core';\nimport { ErrorBoundary, InfoTooltip } from '@perses-dev/components';\nimport Refresh from 'mdi-material-ui/Refresh';\nimport Clipboard from 'mdi-material-ui/ClipboardOutline';\n\nimport { TOOLTIP_TEXT } from '../../../constants';\nimport { useListVariablePluginValues, VARIABLE_TYPES } from '../variable-model';\nimport { VariableEditorState, getVariableDefinitionFromState, getInitialState } from './variable-editor-form-model';\n\nconst DEFAULT_MAX_PREVIEW_VALUES = 50;\n\n// TODO: Replace with proper validation library\nfunction getValidation(state: ReturnType<typeof getInitialState>) {\n  /** Name validation */\n  let name = null;\n  if (!state.name) {\n    name = 'Name is required';\n  }\n  // name can only contain alphanumeric characters and underscores and no spaces\n  if (state.name && !/^[a-zA-Z0-9_-]+$/.test(state.name)) {\n    name = 'Name can only contain alphanumeric characters, underscores, and dashes';\n  }\n\n  return {\n    name,\n    isValid: !name,\n  };\n}\n\nconst SectionHeader = ({ children }: React.PropsWithChildren) => (\n  <Typography pb={2} variant=\"subtitle1\">\n    {children}\n  </Typography>\n);\n\nfunction VariableListPreview({ definition, onRefresh }: { definition: ListVariableDefinition; onRefresh: () => void }) {\n  const { data, isFetching, error } = useListVariablePluginValues(definition);\n  const [maxValues, setMaxValues] = useState<number | undefined>(DEFAULT_MAX_PREVIEW_VALUES);\n  const showAll = () => {\n    setMaxValues(undefined);\n  };\n  let notShown = 0;\n\n  if (data && data?.length > 0 && maxValues) {\n    notShown = data.length - maxValues;\n  }\n  const errorMessage = (error as Error)?.message;\n\n  return (\n    <Box>\n      <Stack direction={'row'} spacing={1} alignItems=\"center\">\n        <Typography variant=\"caption\">Preview Values</Typography>\n        <InfoTooltip description={TOOLTIP_TEXT.refreshVariableValues}>\n          <IconButton onClick={onRefresh} size=\"small\">\n            <Refresh />\n          </IconButton>\n        </InfoTooltip>\n        <InfoTooltip description={TOOLTIP_TEXT.copyVariableValues}>\n          <IconButton\n            onClick={async () => {\n              if (data?.length) {\n                await navigator.clipboard.writeText(data.map((d) => d.label).join(','));\n                alert('Copied to clipboard!');\n              }\n            }}\n            size=\"small\"\n          >\n            <Clipboard />\n          </IconButton>\n        </InfoTooltip>\n      </Stack>\n      {errorMessage && <Alert severity=\"error\">{errorMessage}</Alert>}\n      {isFetching && 'Loading...'}\n      {data?.length === 0 && <Alert severity=\"info\">No results</Alert>}\n      <>\n        {data?.slice(0, maxValues).map((val) => (\n          <Chip sx={{ mr: 1, mb: 1 }} size=\"small\" key={val.value} label={val.label} />\n        ))}\n        {notShown > 0 && (\n          <Chip onClick={showAll} variant=\"outlined\" sx={{ mr: 1, mb: 1 }} size=\"small\" label={`+${notShown} more`} />\n        )}\n      </>\n    </Box>\n  );\n}\n\nexport function VariableEditForm({\n  initialVariableDefinition,\n  onChange,\n  onCancel,\n}: {\n  initialVariableDefinition: VariableDefinition;\n  onChange: (def: VariableDefinition) => void;\n  onCancel: () => void;\n}) {\n  const [state, setState] = useImmer(getInitialState(initialVariableDefinition));\n  const validation = useMemo(() => getValidation(state), [state]);\n\n  const [previewKey, setPreviewKey] = React.useState(0);\n\n  const refreshPreview = () => {\n    setPreviewKey((prev) => prev + 1);\n  };\n\n  /** We use the `previewKey` that we increment to know when to explicitly update the\n   * spec that will be used for preview. The reason why we do this is to avoid\n   * having to re-fetch the values when the user is still editing the spec.\n   */\n  const previewSpec = useMemo(() => {\n    return getVariableDefinitionFromState(state) as ListVariableDefinition;\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [previewKey]);\n\n  return (\n    <>\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          padding: (theme) => theme.spacing(1, 2),\n          borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n        }}\n      >\n        <Typography variant=\"h2\">Edit Variable</Typography>\n        <Stack direction=\"row\" spacing={1} sx={{ marginLeft: 'auto' }}>\n          <Button\n            disabled={!validation.isValid}\n            variant=\"contained\"\n            onClick={() => {\n              onChange(getVariableDefinitionFromState(state));\n            }}\n          >\n            Update\n          </Button>\n          <Button\n            color=\"secondary\"\n            variant=\"outlined\"\n            onClick={() => {\n              onCancel();\n            }}\n          >\n            Cancel\n          </Button>\n        </Stack>\n      </Box>\n      <Box padding={2} sx={{ overflowY: 'scroll' }}>\n        <SectionHeader>General</SectionHeader>\n        <Grid container spacing={2} mb={2}>\n          <Grid item xs={6}>\n            <TextField\n              required\n              error={!!validation.name}\n              fullWidth\n              label=\"Name\"\n              value={state.name}\n              helperText={validation.name}\n              onChange={(v) => {\n                setState((draft) => {\n                  draft.name = v.target.value as string;\n                });\n              }}\n            />\n          </Grid>\n          <Grid item xs={6}>\n            <FormControl fullWidth>\n              <InputLabel id=\"variable-type-select-label\">Type</InputLabel>\n              <Select\n                labelId=\"variable-type-select-label\"\n                id=\"variable-type-select\"\n                label=\"Type\"\n                value={state.kind}\n                onChange={(v) => {\n                  setState((draft) => {\n                    draft.kind = v.target.value as VariableEditorState['kind'];\n                  });\n                }}\n              >\n                {VARIABLE_TYPES.map((v) => (\n                  <MenuItem key={v.kind} value={v.kind}>\n                    {v.label}\n                  </MenuItem>\n                ))}\n              </Select>\n            </FormControl>\n          </Grid>\n          <Grid item xs={6}>\n            <TextField\n              fullWidth\n              label=\"Display Label\"\n              value={state.title || ''}\n              onChange={(v) => {\n                setState((draft) => {\n                  draft.title = v.target.value;\n                });\n              }}\n            />\n          </Grid>\n          <Grid item xs={12}>\n            <TextField\n              fullWidth\n              label=\"Description\"\n              value={state.description}\n              onChange={(v) => {\n                setState((draft) => {\n                  draft.description = v.target.value;\n                });\n              }}\n            />\n          </Grid>\n        </Grid>\n\n        {state.kind === 'TextVariable' && (\n          <>\n            <SectionHeader>Text Options</SectionHeader>\n            <Grid container spacing={2} mb={2}>\n              <Grid item xs={12}>\n                <TextField\n                  label=\"Value\"\n                  value={state.textVariableFields.value}\n                  onChange={(v) => {\n                    setState((draft) => {\n                      draft.textVariableFields.value = v.target.value;\n                    });\n                  }}\n                />\n              </Grid>\n            </Grid>\n          </>\n        )}\n\n        {state.kind === 'ListVariable' && (\n          <>\n            <SectionHeader>List Options</SectionHeader>\n            <Grid container spacing={2} mb={2}>\n              <Grid item xs={6}>\n                {/** Hack?: Cool technique to refresh the preview to simulate onBlur event */}\n                <ClickAwayListener onClickAway={() => refreshPreview()}>\n                  <Box />\n                </ClickAwayListener>\n                {/** */}\n                <PluginEditor\n                  width={500}\n                  pluginType=\"Variable\"\n                  pluginKindLabel=\"Source\"\n                  value={state.listVariableFields.plugin}\n                  onChange={(val) => {\n                    setState((draft) => {\n                      draft.listVariableFields.plugin = val;\n                    });\n                  }}\n                />\n              </Grid>\n\n              {state.listVariableFields.plugin.kind && (\n                <Grid item xs={12}>\n                  <TextField\n                    sx={{ mb: 1 }}\n                    label=\"Capturing Regexp Filter\"\n                    value={state.listVariableFields.capturing_regexp || ''}\n                    onChange={(e) => {\n                      setState((draft) => {\n                        draft.listVariableFields.capturing_regexp = e.target.value;\n                      });\n                    }}\n                  />\n                  <ErrorBoundary FallbackComponent={() => <div>Error previewing values</div>} resetKeys={[previewSpec]}>\n                    <VariableListPreview onRefresh={refreshPreview} definition={previewSpec} />\n                  </ErrorBoundary>\n                </Grid>\n              )}\n            </Grid>\n\n            <SectionHeader>Dropdown Options</SectionHeader>\n            <Grid container spacing={1} mb={1}>\n              <Grid item xs={12}>\n                Allow Multiple\n                <Switch\n                  checked={state.listVariableFields.allowMultiple}\n                  onChange={(e) => {\n                    setState((draft) => {\n                      draft.listVariableFields.allowMultiple = e.target.checked;\n                    });\n                  }}\n                />\n              </Grid>\n              <Grid item xs={12}>\n                Allow All\n                <Switch\n                  checked={state.listVariableFields.allowAll}\n                  onChange={(e) => {\n                    setState((draft) => {\n                      draft.listVariableFields.allowAll = e.target.checked;\n                    });\n                  }}\n                />\n              </Grid>\n            </Grid>\n          </>\n        )}\n      </Box>\n    </>\n  );\n}\n"],"names":["React","useMemo","useState","Box","Typography","Switch","TextField","Grid","FormControl","InputLabel","MenuItem","Select","Button","Stack","Alert","Chip","IconButton","ClickAwayListener","useImmer","PluginEditor","ErrorBoundary","InfoTooltip","Refresh","Clipboard","TOOLTIP_TEXT","useListVariablePluginValues","VARIABLE_TYPES","getVariableDefinitionFromState","getInitialState","DEFAULT_MAX_PREVIEW_VALUES","getValidation","state","name","test","isValid","SectionHeader","children","pb","variant","VariableListPreview","definition","onRefresh","data","isFetching","error","maxValues","setMaxValues","showAll","undefined","notShown","length","errorMessage","message","direction","spacing","alignItems","description","refreshVariableValues","onClick","size","copyVariableValues","navigator","clipboard","writeText","map","d","label","join","alert","severity","slice","val","sx","mr","mb","value","VariableEditForm","initialVariableDefinition","onChange","onCancel","setState","validation","previewKey","setPreviewKey","refreshPreview","prev","previewSpec","display","padding","theme","borderBottom","palette","divider","marginLeft","disabled","color","overflowY","container","item","xs","required","fullWidth","helperText","v","draft","target","id","labelId","kind","title","textVariableFields","onClickAway","width","pluginType","pluginKindLabel","listVariableFields","plugin","capturing_regexp","e","FallbackComponent","div","resetKeys","checked","allowMultiple","allowAll"],"mappings":"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"}

package/dist/components/Variables/VariableEditorForm/variable-editor-form-model.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"variable-editor-form-model.d.ts","sourceRoot":"","sources":["../../../../src/components/Variables/VariableEditorForm/variable-editor-form-model.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,kBAAkB,EAAmC,MAAM,kBAAkB,CAAC;AAEvF,wBAAgB,eAAe,CAAC,yBAAyB,EAAE,kBAAkB;;;;;;;;;;;;;;;;;EA6B5E;AAED,oBAAY,mBAAmB,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAErE,wBAAgB,8BAA8B,CAAC,KAAK,EAAE,mBAAmB,GAAG,kBAAkB,CAiC7F"}
+{"version":3,"file":"variable-editor-form-model.d.ts","sourceRoot":"","sources":["../../../../src/components/Variables/VariableEditorForm/variable-editor-form-model.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,kBAAkB,EAAmC,MAAM,kBAAkB,CAAC;AAEvF,wBAAgB,eAAe,CAAC,yBAAyB,EAAE,kBAAkB;;;;;;;;;;;;;;;;;EA6B5E;AAED,oBAAY,mBAAmB,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAErE,wBAAgB,8BAA8B,CAAC,KAAK,EAAE,mBAAmB,GAAG,kBAAkB,CA8B7F"}

package/dist/components/Variables/VariableEditorForm/variable-editor-form-model.js

@@ -44,17 +44,15 @@ export function getInitialState(initialVariableDefinition) {
 }
 export function getVariableDefinitionFromState(state) {
     const { name , title , kind  } = state;
-    const commonSpec = {
-        name,
-        display: {
-            name: title
-        }
-    };
+    const display = title ? {
+        name: title
+    } : undefined;
     if (kind === 'TextVariable') {
         return {
             kind,
             spec: {
-                ...commonSpec,
+                name,
+                display,
                 ...state.textVariableFields
             }
         };
@@ -63,7 +61,8 @@ export function getVariableDefinitionFromState(state) {
         return {
             kind,
             spec: {
-                ...commonSpec,
+                name,
+                display,
                 allow_multiple: state.listVariableFields.allowMultiple,
                 allow_all_value: state.listVariableFields.allowAll,
                 capturing_regexp: state.listVariableFields.capturing_regexp,

package/dist/components/Variables/VariableEditorForm/variable-editor-form-model.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Variables/VariableEditorForm/variable-editor-form-model.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, TextVariableDefinition, Display } from '@perses-dev/core';\n\nexport function getInitialState(initialVariableDefinition: VariableDefinition) {\n  const textVariableFields = {\n    value: (initialVariableDefinition as TextVariableDefinition).spec.value ?? '',\n  };\n\n  const listVariableFields = {\n    allowMultiple: false,\n    allowAll: false,\n    capturing_regexp: undefined as string | undefined,\n    plugin: {\n      kind: '',\n      spec: {},\n    },\n  };\n  if (initialVariableDefinition.kind === 'ListVariable') {\n    listVariableFields.allowMultiple = initialVariableDefinition.spec.allow_all_value ?? false;\n    listVariableFields.allowAll = initialVariableDefinition.spec.allow_all_value ?? false;\n    listVariableFields.capturing_regexp = initialVariableDefinition.spec.capturing_regexp;\n    listVariableFields.plugin = initialVariableDefinition.spec.plugin;\n  }\n\n  return {\n    name: initialVariableDefinition.spec.name,\n    title: initialVariableDefinition.spec.display?.name,\n    kind: initialVariableDefinition.kind,\n    description: '',\n    listVariableFields,\n    textVariableFields,\n  };\n}\n\nexport type VariableEditorState = ReturnType<typeof getInitialState>;\n\nexport function getVariableDefinitionFromState(state: VariableEditorState): VariableDefinition {\n  const { name, title, kind } = state;\n\n  const commonSpec = {\n    name,\n    display: {\n      name: title,\n    } as Display,\n  };\n\n  if (kind === 'TextVariable') {\n    return {\n      kind,\n      spec: {\n        ...commonSpec,\n        ...state.textVariableFields,\n      },\n    };\n  }\n\n  if (kind === 'ListVariable') {\n    return {\n      kind,\n      spec: {\n        ...commonSpec,\n        allow_multiple: state.listVariableFields.allowMultiple,\n        allow_all_value: state.listVariableFields.allowAll,\n        capturing_regexp: state.listVariableFields.capturing_regexp,\n        plugin: state.listVariableFields.plugin,\n      },\n    };\n  }\n  throw new Error(`Unknown variable kind: ${kind}`);\n}\n"],"names":["getInitialState","initialVariableDefinition","textVariableFields","value","spec","listVariableFields","allowMultiple","allowAll","capturing_regexp","undefined","plugin","kind","allow_all_value","name","title","display","description","getVariableDefinitionFromState","state","commonSpec","allow_multiple","Error"],"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;AAIjC,OAAO,SAASA,eAAe,CAACC,yBAA6C,EAAE;QAuBpEA,GAAsC;QArBtC,MAAgE;IADzE,MAAMC,kBAAkB,GAAG;QACzBC,KAAK,EAAE,CAAA,MAAgE,GAAhE,AAACF,yBAAyB,CAA4BG,IAAI,CAACD,KAAK,cAAhE,MAAgE,cAAhE,MAAgE,GAAI,EAAE;KAC9E,AAAC;IAEF,MAAME,kBAAkB,GAAG;QACzBC,aAAa,EAAE,KAAK;QACpBC,QAAQ,EAAE,KAAK;QACfC,gBAAgB,EAAEC,SAAS;QAC3BC,MAAM,EAAE;YACNC,IAAI,EAAE,EAAE;YACRP,IAAI,EAAE,EAAE;SACT;KACF,AAAC;IACF,IAAIH,yBAAyB,CAACU,IAAI,KAAK,cAAc,EAAE;YAClBV,gBAA8C;QAAjFI,kBAAkB,CAACC,aAAa,GAAGL,CAAAA,gBAA8C,GAA9CA,yBAAyB,CAACG,IAAI,CAACQ,eAAe,cAA9CX,gBAA8C,cAA9CA,gBAA8C,GAAI,KAAK,CAAC;YAC7DA,iBAA8C;QAA5EI,kBAAkB,CAACE,QAAQ,GAAGN,CAAAA,iBAA8C,GAA9CA,yBAAyB,CAACG,IAAI,CAACQ,eAAe,cAA9CX,iBAA8C,cAA9CA,iBAA8C,GAAI,KAAK,CAAC;QACtFI,kBAAkB,CAACG,gBAAgB,GAAGP,yBAAyB,CAACG,IAAI,CAACI,gBAAgB,CAAC;QACtFH,kBAAkB,CAACK,MAAM,GAAGT,yBAAyB,CAACG,IAAI,CAACM,MAAM,CAAC;IACpE,CAAC;IAED,OAAO;QACLG,IAAI,EAAEZ,yBAAyB,CAACG,IAAI,CAACS,IAAI;QACzCC,KAAK,EAAEb,CAAAA,GAAsC,GAAtCA,yBAAyB,CAACG,IAAI,CAACW,OAAO,cAAtCd,GAAsC,WAAM,GAA5CA,KAAAA,CAA4C,GAA5CA,GAAsC,CAAEY,IAAI;QACnDF,IAAI,EAAEV,yBAAyB,CAACU,IAAI;QACpCK,WAAW,EAAE,EAAE;QACfX,kBAAkB;QAClBH,kBAAkB;KACnB,CAAC;AACJ,CAAC;AAID,OAAO,SAASe,8BAA8B,CAACC,KAA0B,EAAsB;IAC7F,MAAM,EAAEL,IAAI,CAAA,EAAEC,KAAK,CAAA,EAAEH,IAAI,CAAA,EAAE,GAAGO,KAAK,AAAC;IAEpC,MAAMC,UAAU,GAAG;QACjBN,IAAI;QACJE,OAAO,EAAE;YACPF,IAAI,EAAEC,KAAK;SACZ;KACF,AAAC;IAEF,IAAIH,IAAI,KAAK,cAAc,EAAE;QAC3B,OAAO;YACLA,IAAI;YACJP,IAAI,EAAE;gBACJ,GAAGe,UAAU;gBACb,GAAGD,KAAK,CAAChB,kBAAkB;aAC5B;SACF,CAAC;IACJ,CAAC;IAED,IAAIS,IAAI,KAAK,cAAc,EAAE;QAC3B,OAAO;YACLA,IAAI;YACJP,IAAI,EAAE;gBACJ,GAAGe,UAAU;gBACbC,cAAc,EAAEF,KAAK,CAACb,kBAAkB,CAACC,aAAa;gBACtDM,eAAe,EAAEM,KAAK,CAACb,kBAAkB,CAACE,QAAQ;gBAClDC,gBAAgB,EAAEU,KAAK,CAACb,kBAAkB,CAACG,gBAAgB;gBAC3DE,MAAM,EAAEQ,KAAK,CAACb,kBAAkB,CAACK,MAAM;aACxC;SACF,CAAC;IACJ,CAAC;IACD,MAAM,IAAIW,KAAK,CAAC,CAAC,uBAAuB,EAAEV,IAAI,CAAC,CAAC,CAAC,CAAC;AACpD,CAAC"}
+{"version":3,"sources":["../../../../src/components/Variables/VariableEditorForm/variable-editor-form-model.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, TextVariableDefinition, Display } from '@perses-dev/core';\n\nexport function getInitialState(initialVariableDefinition: VariableDefinition) {\n  const textVariableFields = {\n    value: (initialVariableDefinition as TextVariableDefinition).spec.value ?? '',\n  };\n\n  const listVariableFields = {\n    allowMultiple: false,\n    allowAll: false,\n    capturing_regexp: undefined as string | undefined,\n    plugin: {\n      kind: '',\n      spec: {},\n    },\n  };\n  if (initialVariableDefinition.kind === 'ListVariable') {\n    listVariableFields.allowMultiple = initialVariableDefinition.spec.allow_all_value ?? false;\n    listVariableFields.allowAll = initialVariableDefinition.spec.allow_all_value ?? false;\n    listVariableFields.capturing_regexp = initialVariableDefinition.spec.capturing_regexp;\n    listVariableFields.plugin = initialVariableDefinition.spec.plugin;\n  }\n\n  return {\n    name: initialVariableDefinition.spec.name,\n    title: initialVariableDefinition.spec.display?.name,\n    kind: initialVariableDefinition.kind,\n    description: '',\n    listVariableFields,\n    textVariableFields,\n  };\n}\n\nexport type VariableEditorState = ReturnType<typeof getInitialState>;\n\nexport function getVariableDefinitionFromState(state: VariableEditorState): VariableDefinition {\n  const { name, title, kind } = state;\n\n  const display: Display | undefined = title ? { name: title } : undefined;\n\n  if (kind === 'TextVariable') {\n    return {\n      kind,\n      spec: {\n        name,\n        display,\n        ...state.textVariableFields,\n      },\n    };\n  }\n\n  if (kind === 'ListVariable') {\n    return {\n      kind,\n      spec: {\n        name,\n        display,\n        allow_multiple: state.listVariableFields.allowMultiple,\n        allow_all_value: state.listVariableFields.allowAll,\n        capturing_regexp: state.listVariableFields.capturing_regexp,\n        plugin: state.listVariableFields.plugin,\n      },\n    };\n  }\n  throw new Error(`Unknown variable kind: ${kind}`);\n}\n"],"names":["getInitialState","initialVariableDefinition","textVariableFields","value","spec","listVariableFields","allowMultiple","allowAll","capturing_regexp","undefined","plugin","kind","allow_all_value","name","title","display","description","getVariableDefinitionFromState","state","allow_multiple","Error"],"mappings":"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"}

package/dist/context/DashboardProvider/DashboardProvider.d.ts

@@ -1,6 +1,6 @@
 import type { StoreApi } from 'zustand';
 import { ReactNode } from 'react';
-import { DashboardResource, Display, ProjectMetadata, RelativeTimeRange } from '@perses-dev/core';
+import { DashboardResource, Display, ProjectMetadata, DurationString } from '@perses-dev/core';
 import { PanelGroupEditorSlice } from './panel-group-editor-slice';
 import { PanelGroupSlice } from './panel-group-slice';
 import { PanelEditorSlice } from './panel-editor-slice';
@@ -13,9 +13,9 @@ import { EditJsonDialogSlice } from './edit-json-dialog-slice';
 export interface DashboardStoreState extends PanelGroupSlice, PanelSlice, PanelGroupEditorSlice, DeletePanelGroupSlice, PanelEditorSlice, DeletePanelSlice, DiscardChangesConfirmationDialogSlice, DuplicatePanelSlice, EditJsonDialogSlice {
     isEditMode: boolean;
     setEditMode: (isEditMode: boolean) => void;
-    defaultTimeRange: RelativeTimeRange;
     setDashboard: (dashboard: DashboardResource) => void;
     metadata: ProjectMetadata;
+    duration: DurationString;
     display?: Display;
 }
 export interface DashboardStoreProps {

package/dist/context/DashboardProvider/DashboardProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DashboardProvider.d.ts","sourceRoot":"","sources":["../../../src/context/DashboardProvider/DashboardProvider.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAIxC,OAAO,EAAiB,SAAS,EAAgD,MAAM,OAAO,CAAC;AAC/F,OAAO,EAAE,iBAAiB,EAAE,OAAO,EAAE,eAAe,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAC;AAElG,OAAO,EAA+B,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAChG,OAAO,EAAsD,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC1G,OAAO,EAA0B,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAChF,OAAO,EAAoB,UAAU,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,EAA+B,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAChG,OAAO,EAA0B,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAChF,OAAO,EAAmC,qCAAqC,EAAE,MAAM,gCAAgC,CAAC;AACxH,OAAO,EAA6B,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AACzF,OAAO,EAA6B,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAE1F,MAAM,WAAW,mBACf,SAAQ,eAAe,EACrB,UAAU,EACV,qBAAqB,EACrB,qBAAqB,EACrB,gBAAgB,EAChB,gBAAgB,EAChB,qCAAqC,EACrC,mBAAmB,EACnB,mBAAmB;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,gBAAgB,EAAE,iBAAiB,CAAC;IACpC,YAAY,EAAE,CAAC,SAAS,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACrD,QAAQ,EAAE,eAAe,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,mBAAmB;IAClC,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,WAAW,sBAAsB;IACrC,YAAY,EAAE,mBAAmB,CAAC;IAClC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,gBAAgB,oEAAsE,CAAC;AAEpG,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,CAAC,KAM/E;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,eAsB9D"}
+{"version":3,"file":"DashboardProvider.d.ts","sourceRoot":"","sources":["../../../src/context/DashboardProvider/DashboardProvider.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAIxC,OAAO,EAAiB,SAAS,EAAgD,MAAM,OAAO,CAAC;AAC/F,OAAO,EAAE,iBAAiB,EAAE,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAE/F,OAAO,EAA+B,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAChG,OAAO,EAAsD,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC1G,OAAO,EAA0B,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAChF,OAAO,EAAoB,UAAU,EAAE,MAAM,eAAe,CAAC;AAC7D,OAAO,EAA+B,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAChG,OAAO,EAA0B,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAChF,OAAO,EAAmC,qCAAqC,EAAE,MAAM,gCAAgC,CAAC;AACxH,OAAO,EAA6B,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AACzF,OAAO,EAA6B,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAG1F,MAAM,WAAW,mBACf,SAAQ,eAAe,EACrB,UAAU,EACV,qBAAqB,EACrB,qBAAqB,EACrB,gBAAgB,EAChB,gBAAgB,EAChB,qCAAqC,EACrC,mBAAmB,EACnB,mBAAmB;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,YAAY,EAAE,CAAC,SAAS,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACrD,QAAQ,EAAE,eAAe,CAAC;IAC1B,QAAQ,EAAE,cAAc,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,mBAAmB;IAClC,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,WAAW,sBAAsB;IACrC,YAAY,EAAE,mBAAmB,CAAC;IAClC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,gBAAgB,oEAAsE,CAAC;AAEpG,wBAAgB,iBAAiB,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,CAAC,KAM/E;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,eA0B9D"}

package/dist/context/DashboardProvider/DashboardProvider.js

@@ -26,6 +26,7 @@ import { createDeletePanelSlice } from './delete-panel-slice';
 import { createDiscardChangesDialogSlice } from './discard-changes-dialog-slice';
 import { createDuplicatePanelSlice } from './duplicate-panel-slice';
 import { createEditJsonDialogSlice } from './edit-json-dialog-slice';
+import { createPanelDefinition } from './common';
 export const DashboardContext = /*#__PURE__*/ createContext(undefined);
 export function useDashboardStore(selector) {
     const store = useContext(DashboardContext);
@@ -46,12 +47,11 @@ export function DashboardProvider(props) {
     const [store] = useState(createDashboardStore(props)); // prevent calling createDashboardStore every time it rerenders
     useEffect(()=>{
         if (plugin === undefined) return;
-        const spec = plugin.createInitialOptions();
-        // set default panel kind and spec for add panel editor
+        const defaultPanelSpec = plugin.createInitialOptions();
+        // set default panel kind, spec, and queries for add panel editor
         store.setState({
             initialValues: {
-                kind: defaultPanelKind,
-                spec
+                panelDefinition: createPanelDefinition(defaultPanelKind, defaultPanelSpec)
             }
         });
     }, [
@@ -85,14 +85,12 @@ function initStore(props) {
             ...createEditJsonDialogSlice(...args),
             metadata,
             display,
-            defaultTimeRange: {
-                pastDuration: duration
-            },
+            duration,
             isEditMode: !!isEditMode,
             setEditMode: (isEditMode)=>set({
                     isEditMode
                 }),
-            setDashboard: ({ metadata , spec: { display , panels ={} , layouts =[]  }  })=>{
+            setDashboard: ({ metadata , spec: { display , panels ={} , layouts =[] , duration  }  })=>{
                 set((state)=>{
                     state.metadata = metadata;
                     state.display = display;
@@ -100,6 +98,7 @@ function initStore(props) {
                     const { panelGroups , panelGroupOrder  } = convertLayoutsToPanelGroups(layouts);
                     state.panelGroups = panelGroups;
                     state.panelGroupOrder = panelGroupOrder;
+                    state.duration = duration;
                 });
             }
         };

package/dist/context/DashboardProvider/DashboardProvider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/context/DashboardProvider/DashboardProvider.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 { createStore, useStore } from 'zustand';\nimport type { StoreApi } from 'zustand';\nimport { devtools } from 'zustand/middleware';\nimport { immer } from 'zustand/middleware/immer';\nimport { shallow } from 'zustand/shallow';\nimport { createContext, ReactNode, useCallback, useContext, useEffect, useState } from 'react';\nimport { DashboardResource, Display, ProjectMetadata, RelativeTimeRange } from '@perses-dev/core';\nimport { usePlugin, usePluginRegistry } from '@perses-dev/plugin-system';\nimport { createPanelGroupEditorSlice, PanelGroupEditorSlice } from './panel-group-editor-slice';\nimport { convertLayoutsToPanelGroups, createPanelGroupSlice, PanelGroupSlice } from './panel-group-slice';\nimport { createPanelEditorSlice, PanelEditorSlice } from './panel-editor-slice';\nimport { createPanelSlice, PanelSlice } from './panel-slice';\nimport { createDeletePanelGroupSlice, DeletePanelGroupSlice } from './delete-panel-group-slice';\nimport { createDeletePanelSlice, DeletePanelSlice } from './delete-panel-slice';\nimport { createDiscardChangesDialogSlice, DiscardChangesConfirmationDialogSlice } from './discard-changes-dialog-slice';\nimport { createDuplicatePanelSlice, DuplicatePanelSlice } from './duplicate-panel-slice';\nimport { createEditJsonDialogSlice, EditJsonDialogSlice } from './edit-json-dialog-slice';\n\nexport interface DashboardStoreState\n  extends PanelGroupSlice,\n    PanelSlice,\n    PanelGroupEditorSlice,\n    DeletePanelGroupSlice,\n    PanelEditorSlice,\n    DeletePanelSlice,\n    DiscardChangesConfirmationDialogSlice,\n    DuplicatePanelSlice,\n    EditJsonDialogSlice {\n  isEditMode: boolean;\n  setEditMode: (isEditMode: boolean) => void;\n  defaultTimeRange: RelativeTimeRange;\n  setDashboard: (dashboard: DashboardResource) => void;\n  metadata: ProjectMetadata;\n  display?: Display;\n}\n\nexport interface DashboardStoreProps {\n  dashboardResource: DashboardResource;\n  isEditMode?: boolean;\n}\n\nexport interface DashboardProviderProps {\n  initialState: DashboardStoreProps;\n  children?: ReactNode;\n}\n\nexport const DashboardContext = createContext<StoreApi<DashboardStoreState> | undefined>(undefined);\n\nexport function useDashboardStore<T>(selector: (state: DashboardStoreState) => T) {\n  const store = useContext(DashboardContext);\n  if (store === undefined) {\n    throw new Error('No DashboardContext found. Did you forget a Provider?');\n  }\n  return useStore(store, selector, shallow);\n}\n\nexport function DashboardProvider(props: DashboardProviderProps) {\n  const createDashboardStore = useCallback(initStore, [props]);\n\n  // load plugin to retrieve initial spec if default panel kind is defined\n  const { defaultPluginKinds } = usePluginRegistry();\n  const defaultPanelKind = defaultPluginKinds?.['Panel'] ?? '';\n  const { data: plugin } = usePlugin('Panel', defaultPanelKind);\n\n  const [store] = useState(createDashboardStore(props)); // prevent calling createDashboardStore every time it rerenders\n\n  useEffect(() => {\n    if (plugin === undefined) return;\n    const spec = plugin.createInitialOptions();\n    // set default panel kind and spec for add panel editor\n    store.setState({ initialValues: { kind: defaultPanelKind, spec } });\n  }, [plugin, store, defaultPanelKind]);\n\n  return (\n    <DashboardContext.Provider value={store as StoreApi<DashboardStoreState>}>\n      {props.children}\n    </DashboardContext.Provider>\n  );\n}\n\nfunction initStore(props: DashboardProviderProps) {\n  const {\n    initialState: { dashboardResource, isEditMode },\n  } = props;\n\n  const {\n    spec: { display, duration },\n    metadata,\n  } = dashboardResource;\n\n  let {\n    spec: { layouts, panels },\n  } = dashboardResource;\n\n  // Set fallbacks in case the frontend is used with a non-Perses backend\n  layouts = layouts ?? [];\n  panels = panels ?? {};\n\n  const store = createStore<DashboardStoreState>()(\n    immer(\n      devtools((...args) => {\n        const [set] = args;\n        return {\n          /* Groups */\n          ...createPanelGroupSlice(layouts)(...args),\n          ...createPanelGroupEditorSlice(...args),\n          ...createDeletePanelGroupSlice(...args),\n          /* Panels */\n          ...createPanelSlice(panels)(...args),\n          ...createPanelEditorSlice()(...args),\n          ...createDeletePanelSlice()(...args),\n          ...createDuplicatePanelSlice()(...args),\n          /* General */\n          ...createDiscardChangesDialogSlice(...args),\n          ...createEditJsonDialogSlice(...args),\n          metadata,\n          display,\n          defaultTimeRange: { pastDuration: duration },\n          isEditMode: !!isEditMode,\n          setEditMode: (isEditMode: boolean) => set({ isEditMode }),\n          setDashboard: ({ metadata, spec: { display, panels = {}, layouts = [] } }) => {\n            set((state) => {\n              state.metadata = metadata;\n              state.display = display;\n              state.panels = panels;\n              const { panelGroups, panelGroupOrder } = convertLayoutsToPanelGroups(layouts);\n              state.panelGroups = panelGroups;\n              state.panelGroupOrder = panelGroupOrder;\n            });\n          },\n        };\n      })\n    )\n  );\n\n  return store;\n}\n"],"names":["createStore","useStore","devtools","immer","shallow","createContext","useCallback","useContext","useEffect","useState","usePlugin","usePluginRegistry","createPanelGroupEditorSlice","convertLayoutsToPanelGroups","createPanelGroupSlice","createPanelEditorSlice","createPanelSlice","createDeletePanelGroupSlice","createDeletePanelSlice","createDiscardChangesDialogSlice","createDuplicatePanelSlice","createEditJsonDialogSlice","DashboardContext","undefined","useDashboardStore","selector","store","Error","DashboardProvider","props","createDashboardStore","initStore","defaultPluginKinds","defaultPanelKind","data","plugin","spec","createInitialOptions","setState","initialValues","kind","Provider","value","children","initialState","dashboardResource","isEditMode","display","duration","metadata","layouts","panels","args","set","defaultTimeRange","pastDuration","setEditMode","setDashboard","state","panelGroups","panelGroupOrder"],"mappings":"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"}
+{"version":3,"sources":["../../../src/context/DashboardProvider/DashboardProvider.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 { createStore, useStore } from 'zustand';\nimport type { StoreApi } from 'zustand';\nimport { devtools } from 'zustand/middleware';\nimport { immer } from 'zustand/middleware/immer';\nimport { shallow } from 'zustand/shallow';\nimport { createContext, ReactNode, useCallback, useContext, useEffect, useState } from 'react';\nimport { DashboardResource, Display, ProjectMetadata, DurationString } from '@perses-dev/core';\nimport { usePlugin, usePluginRegistry } from '@perses-dev/plugin-system';\nimport { createPanelGroupEditorSlice, PanelGroupEditorSlice } from './panel-group-editor-slice';\nimport { convertLayoutsToPanelGroups, createPanelGroupSlice, PanelGroupSlice } from './panel-group-slice';\nimport { createPanelEditorSlice, PanelEditorSlice } from './panel-editor-slice';\nimport { createPanelSlice, PanelSlice } from './panel-slice';\nimport { createDeletePanelGroupSlice, DeletePanelGroupSlice } from './delete-panel-group-slice';\nimport { createDeletePanelSlice, DeletePanelSlice } from './delete-panel-slice';\nimport { createDiscardChangesDialogSlice, DiscardChangesConfirmationDialogSlice } from './discard-changes-dialog-slice';\nimport { createDuplicatePanelSlice, DuplicatePanelSlice } from './duplicate-panel-slice';\nimport { createEditJsonDialogSlice, EditJsonDialogSlice } from './edit-json-dialog-slice';\nimport { createPanelDefinition } from './common';\n\nexport interface DashboardStoreState\n  extends PanelGroupSlice,\n    PanelSlice,\n    PanelGroupEditorSlice,\n    DeletePanelGroupSlice,\n    PanelEditorSlice,\n    DeletePanelSlice,\n    DiscardChangesConfirmationDialogSlice,\n    DuplicatePanelSlice,\n    EditJsonDialogSlice {\n  isEditMode: boolean;\n  setEditMode: (isEditMode: boolean) => void;\n  setDashboard: (dashboard: DashboardResource) => void;\n  metadata: ProjectMetadata;\n  duration: DurationString;\n  display?: Display;\n}\n\nexport interface DashboardStoreProps {\n  dashboardResource: DashboardResource;\n  isEditMode?: boolean;\n}\n\nexport interface DashboardProviderProps {\n  initialState: DashboardStoreProps;\n  children?: ReactNode;\n}\n\nexport const DashboardContext = createContext<StoreApi<DashboardStoreState> | undefined>(undefined);\n\nexport function useDashboardStore<T>(selector: (state: DashboardStoreState) => T) {\n  const store = useContext(DashboardContext);\n  if (store === undefined) {\n    throw new Error('No DashboardContext found. Did you forget a Provider?');\n  }\n  return useStore(store, selector, shallow);\n}\n\nexport function DashboardProvider(props: DashboardProviderProps) {\n  const createDashboardStore = useCallback(initStore, [props]);\n\n  // load plugin to retrieve initial spec if default panel kind is defined\n  const { defaultPluginKinds } = usePluginRegistry();\n  const defaultPanelKind = defaultPluginKinds?.['Panel'] ?? '';\n  const { data: plugin } = usePlugin('Panel', defaultPanelKind);\n\n  const [store] = useState(createDashboardStore(props)); // prevent calling createDashboardStore every time it rerenders\n\n  useEffect(() => {\n    if (plugin === undefined) return;\n    const defaultPanelSpec = plugin.createInitialOptions();\n    // set default panel kind, spec, and queries for add panel editor\n    store.setState({\n      initialValues: {\n        panelDefinition: createPanelDefinition(defaultPanelKind, defaultPanelSpec),\n      },\n    });\n  }, [plugin, store, defaultPanelKind]);\n\n  return (\n    <DashboardContext.Provider value={store as StoreApi<DashboardStoreState>}>\n      {props.children}\n    </DashboardContext.Provider>\n  );\n}\n\nfunction initStore(props: DashboardProviderProps) {\n  const {\n    initialState: { dashboardResource, isEditMode },\n  } = props;\n\n  const {\n    spec: { display, duration },\n    metadata,\n  } = dashboardResource;\n\n  let {\n    spec: { layouts, panels },\n  } = dashboardResource;\n\n  // Set fallbacks in case the frontend is used with a non-Perses backend\n  layouts = layouts ?? [];\n  panels = panels ?? {};\n\n  const store = createStore<DashboardStoreState>()(\n    immer(\n      devtools((...args) => {\n        const [set] = args;\n        return {\n          /* Groups */\n          ...createPanelGroupSlice(layouts)(...args),\n          ...createPanelGroupEditorSlice(...args),\n          ...createDeletePanelGroupSlice(...args),\n          /* Panels */\n          ...createPanelSlice(panels)(...args),\n          ...createPanelEditorSlice()(...args),\n          ...createDeletePanelSlice()(...args),\n          ...createDuplicatePanelSlice()(...args),\n          /* General */\n          ...createDiscardChangesDialogSlice(...args),\n          ...createEditJsonDialogSlice(...args),\n          metadata,\n          display,\n          duration,\n          isEditMode: !!isEditMode,\n          setEditMode: (isEditMode: boolean) => set({ isEditMode }),\n          setDashboard: ({ metadata, spec: { display, panels = {}, layouts = [], duration } }) => {\n            set((state) => {\n              state.metadata = metadata;\n              state.display = display;\n              state.panels = panels;\n              const { panelGroups, panelGroupOrder } = convertLayoutsToPanelGroups(layouts);\n              state.panelGroups = panelGroups;\n              state.panelGroupOrder = panelGroupOrder;\n              state.duration = duration;\n            });\n          },\n        };\n      })\n    )\n  );\n\n  return store;\n}\n"],"names":["createStore","useStore","devtools","immer","shallow","createContext","useCallback","useContext","useEffect","useState","usePlugin","usePluginRegistry","createPanelGroupEditorSlice","convertLayoutsToPanelGroups","createPanelGroupSlice","createPanelEditorSlice","createPanelSlice","createDeletePanelGroupSlice","createDeletePanelSlice","createDiscardChangesDialogSlice","createDuplicatePanelSlice","createEditJsonDialogSlice","createPanelDefinition","DashboardContext","undefined","useDashboardStore","selector","store","Error","DashboardProvider","props","createDashboardStore","initStore","defaultPluginKinds","defaultPanelKind","data","plugin","defaultPanelSpec","createInitialOptions","setState","initialValues","panelDefinition","Provider","value","children","initialState","dashboardResource","isEditMode","spec","display","duration","metadata","layouts","panels","args","set","setEditMode","setDashboard","state","panelGroups","panelGroupOrder"],"mappings":"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"}

package/dist/context/DashboardProvider/common.d.ts

@@ -1,3 +1,4 @@
+import { PanelDefinition, UnknownSpec } from '@perses-dev/core';
 /**
  * The middleware applied to the DashboardStore (can be used as generic argument in StateCreator).
  */
@@ -9,4 +10,5 @@ declare global {
  * Helper function to generate unique IDs for things in the dashboard store that don't have a "natural" ID.
  */
 export declare function generateId(): number;
+export declare function createPanelDefinition(defaultPanelKind?: string, defaultPanelSpec?: UnknownSpec): PanelDefinition;
 //# sourceMappingURL=common.d.ts.map

package/dist/context/DashboardProvider/common.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../../src/context/DashboardProvider/common.ts"],"names":[],"mappings":"AAaA;;GAEG;AACH,oBAAY,UAAU,GAAG,CAAC,CAAC,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,EAAE,KAAK,CAAC,CAAC,CAAC;AAEjF,OAAO,CAAC,MAAM,CAAC;IAEb,IAAI,gBAAgB,EAAE,MAAM,CAAC;CAC9B;AAED;;GAEG;AACH,wBAAgB,UAAU,WAKzB"}
+{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../../src/context/DashboardProvider/common.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,eAAe,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAEhE;;GAEG;AACH,oBAAY,UAAU,GAAG,CAAC,CAAC,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,EAAE,KAAK,CAAC,CAAC,CAAC;AAEjF,OAAO,CAAC,MAAM,CAAC;IAEb,IAAI,gBAAgB,EAAE,MAAM,CAAC;CAC9B;AAED;;GAEG;AACH,wBAAgB,UAAU,WAKzB;AAGD,wBAAgB,qBAAqB,CAAC,gBAAgB,CAAC,EAAE,MAAM,EAAE,gBAAgB,CAAC,EAAE,WAAW,GAAG,eAAe,CAehH"}

package/dist/context/DashboardProvider/common.js

@@ -11,8 +11,6 @@
 // See the License for the specific language governing permissions and
 // limitations under the License.
 /**
- * The middleware applied to the DashboardStore (can be used as generic argument in StateCreator).
- */ /**
  * Helper function to generate unique IDs for things in the dashboard store that don't have a "natural" ID.
  */ export function generateId() {
     if (globalThis.dashboardStoreId === undefined) {
@@ -20,5 +18,22 @@
     }
     return globalThis.dashboardStoreId++;
 }
+// Helper function to create initial PanelDefinitions
+export function createPanelDefinition(defaultPanelKind, defaultPanelSpec) {
+    return {
+        kind: 'Panel',
+        spec: {
+            display: {
+                name: '',
+                description: undefined
+            },
+            plugin: {
+                kind: defaultPanelKind !== null && defaultPanelKind !== void 0 ? defaultPanelKind : '',
+                spec: defaultPanelSpec !== null && defaultPanelSpec !== void 0 ? defaultPanelSpec : {}
+            },
+            queries: []
+        }
+    };
+}
 
 //# sourceMappingURL=common.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/context/DashboardProvider/common.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\n/**\n * The middleware applied to the DashboardStore (can be used as generic argument in StateCreator).\n */\nexport type Middleware = [['zustand/immer', never], ['zustand/devtools', never]];\n\ndeclare global {\n  // eslint-disable-next-line no-var\n  var dashboardStoreId: number;\n}\n\n/**\n * Helper function to generate unique IDs for things in the dashboard store that don't have a \"natural\" ID.\n */\nexport function generateId() {\n  if (globalThis.dashboardStoreId === undefined) {\n    globalThis.dashboardStoreId = 0;\n  }\n  return globalThis.dashboardStoreId++;\n}\n"],"names":["generateId","globalThis","dashboardStoreId","undefined"],"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;;CAEC,GACD,AAOA;;CAEC,GACD,OAAO,SAASA,UAAU,GAAG;IAC3B,IAAIC,UAAU,CAACC,gBAAgB,KAAKC,SAAS,EAAE;QAC7CF,UAAU,CAACC,gBAAgB,GAAG,CAAC,CAAC;IAClC,CAAC;IACD,OAAOD,UAAU,CAACC,gBAAgB,EAAE,CAAC;AACvC,CAAC"}
+{"version":3,"sources":["../../../src/context/DashboardProvider/common.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 { PanelDefinition, UnknownSpec } from '@perses-dev/core';\n\n/**\n * The middleware applied to the DashboardStore (can be used as generic argument in StateCreator).\n */\nexport type Middleware = [['zustand/immer', never], ['zustand/devtools', never]];\n\ndeclare global {\n  // eslint-disable-next-line no-var\n  var dashboardStoreId: number;\n}\n\n/**\n * Helper function to generate unique IDs for things in the dashboard store that don't have a \"natural\" ID.\n */\nexport function generateId() {\n  if (globalThis.dashboardStoreId === undefined) {\n    globalThis.dashboardStoreId = 0;\n  }\n  return globalThis.dashboardStoreId++;\n}\n\n// Helper function to create initial PanelDefinitions\nexport function createPanelDefinition(defaultPanelKind?: string, defaultPanelSpec?: UnknownSpec): PanelDefinition {\n  return {\n    kind: 'Panel',\n    spec: {\n      display: {\n        name: '',\n        description: undefined,\n      },\n      plugin: {\n        kind: defaultPanelKind ?? '',\n        spec: defaultPanelSpec ?? {},\n      },\n      queries: [],\n    },\n  };\n}\n"],"names":["generateId","globalThis","dashboardStoreId","undefined","createPanelDefinition","defaultPanelKind","defaultPanelSpec","kind","spec","display","name","description","plugin","queries"],"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;AAcjC;;CAEC,GACD,OAAO,SAASA,UAAU,GAAG;IAC3B,IAAIC,UAAU,CAACC,gBAAgB,KAAKC,SAAS,EAAE;QAC7CF,UAAU,CAACC,gBAAgB,GAAG,CAAC,CAAC;IAClC,CAAC;IACD,OAAOD,UAAU,CAACC,gBAAgB,EAAE,CAAC;AACvC,CAAC;AAED,qDAAqD;AACrD,OAAO,SAASE,qBAAqB,CAACC,gBAAyB,EAAEC,gBAA8B,EAAmB;IAChH,OAAO;QACLC,IAAI,EAAE,OAAO;QACbC,IAAI,EAAE;YACJC,OAAO,EAAE;gBACPC,IAAI,EAAE,EAAE;gBACRC,WAAW,EAAER,SAAS;aACvB;YACDS,MAAM,EAAE;gBACNL,IAAI,EAAEF,gBAAgB,aAAhBA,gBAAgB,cAAhBA,gBAAgB,GAAI,EAAE;gBAC5BG,IAAI,EAAEF,gBAAgB,aAAhBA,gBAAgB,cAAhBA,gBAAgB,GAAI,EAAE;aAC7B;YACDO,OAAO,EAAE,EAAE;SACZ;KACF,CAAC;AACJ,CAAC"}

package/dist/context/DashboardProvider/dashboard-provider-api.d.ts

@@ -71,7 +71,7 @@ export declare function useDeletePanelDialog(): {
     deletePanel: (panelGroupItemId: PanelGroupItemId) => void;
     closeDeletePanelDialog: () => void;
 };
-export declare function useDefaultTimeRange(): import("@perses-dev/core").RelativeTimeRange;
+export declare function useDashboardDuration(): import("@perses-dev/core").DurationString;
 export declare function useDiscardChangesConfirmationDialog(): {
     discardChangesConfirmationDialog: import("./discard-changes-dialog-slice").DiscardChangesConfirmationDialogState | undefined;
     openDiscardChangesConfirmationDialog: (discardChangesConfirmationDialog: import("./discard-changes-dialog-slice").DiscardChangesConfirmationDialogState) => void;