@perses-dev/dashboards 0.38.0 → 0.40.0

package/dist/components/PanelGroupDialog/PanelGroupDialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PanelGroupDialog/PanelGroupDialog.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 { IconButton, Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@mui/material';\nimport CloseIcon from 'mdi-material-ui/Close';\nimport { useState } from 'react';\nimport { usePanelGroupEditor } from '../../context';\nimport { PanelGroupEditorForm, panelGroupEditorFormId, PanelGroupEditorFormProps } from './PanelGroupEditorForm';\n\n/**\n * A dialog for adding or editing a Panel Group. Open and initial state is controlled by the DashboardStore.\n */\nexport function PanelGroupDialog() {\n  const panelGroupEditor = usePanelGroupEditor();\n\n  // When the user clicks close, start closing but don't call the store yet to keep values stable during animtation\n  const [isClosing, setIsClosing] = useState(false);\n  const handleClose = () => setIsClosing(true);\n\n  // Don't call close on the store until the Dialog has completely transitioned out\n  const handleExited = () => {\n    panelGroupEditor?.close();\n    setIsClosing(false);\n  };\n\n  // Dialog is open if we have a model and we're not transitioning out\n  const isOpen = panelGroupEditor !== undefined && isClosing === false;\n\n  const handleSubmit: PanelGroupEditorFormProps['onSubmit'] = (values) => {\n    // This shouldn't happen since we don't render the submit button until we have a model, but check to make TS happy\n    if (panelGroupEditor === undefined) {\n      throw new Error('Cannot apply changes');\n    }\n    panelGroupEditor.applyChanges(values);\n    handleClose();\n  };\n\n  return (\n    <Dialog open={isOpen} TransitionProps={{ onExited: handleExited }}>\n      {panelGroupEditor !== undefined && (\n        <>\n          <DialogTitle>{panelGroupEditor.mode} Panel Group</DialogTitle>\n          <IconButton\n            aria-label=\"Close\"\n            onClick={panelGroupEditor.close}\n            sx={(theme) => ({\n              position: 'absolute',\n              top: theme.spacing(0.5),\n              right: theme.spacing(0.5),\n            })}\n          >\n            <CloseIcon />\n          </IconButton>\n          <DialogContent dividers sx={{ width: '500px' }}>\n            <PanelGroupEditorForm initialValues={panelGroupEditor.initialValues} onSubmit={handleSubmit} />\n          </DialogContent>\n          <DialogActions>\n            <Button variant=\"contained\" type=\"submit\" form={panelGroupEditorFormId}>\n              {panelGroupEditor.mode === 'Edit' ? 'Apply' : 'Add'}\n            </Button>\n            <Button variant=\"outlined\" color=\"secondary\" onClick={panelGroupEditor.close}>\n              Cancel\n            </Button>\n          </DialogActions>\n        </>\n      )}\n    </Dialog>\n  );\n}\n"],"names":["IconButton","Dialog","DialogTitle","DialogContent","DialogActions","Button","CloseIcon","useState","usePanelGroupEditor","PanelGroupEditorForm","panelGroupEditorFormId","PanelGroupDialog","panelGroupEditor","isClosing","setIsClosing","handleClose","handleExited","close","isOpen","undefined","handleSubmit","values","Error","applyChanges","open","TransitionProps","onExited","mode","aria-label","onClick","sx","theme","position","top","spacing","right","dividers","width","initialValues","onSubmit","variant","type","form","color"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/PanelGroupDialog/PanelGroupDialog.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 { IconButton, Dialog, DialogTitle, DialogContent, DialogActions, Button } from '@mui/material';\nimport CloseIcon from 'mdi-material-ui/Close';\nimport { useState } from 'react';\nimport { usePanelGroupEditor } from '../../context';\nimport { PanelGroupEditorForm, panelGroupEditorFormId, PanelGroupEditorFormProps } from './PanelGroupEditorForm';\n\n/**\n * A dialog for adding or editing a Panel Group. Open and initial state is controlled by the DashboardStore.\n */\nexport function PanelGroupDialog() {\n  const panelGroupEditor = usePanelGroupEditor();\n\n  // When the user clicks close, start closing but don't call the store yet to keep values stable during animtation\n  const [isClosing, setIsClosing] = useState(false);\n  const handleClose = () => setIsClosing(true);\n\n  // Don't call close on the store until the Dialog has completely transitioned out\n  const handleExited = () => {\n    panelGroupEditor?.close();\n    setIsClosing(false);\n  };\n\n  // Dialog is open if we have a model and we're not transitioning out\n  const isOpen = panelGroupEditor !== undefined && isClosing === false;\n\n  const handleSubmit: PanelGroupEditorFormProps['onSubmit'] = (values) => {\n    // This shouldn't happen since we don't render the submit button until we have a model, but check to make TS happy\n    if (panelGroupEditor === undefined) {\n      throw new Error('Cannot apply changes');\n    }\n    panelGroupEditor.applyChanges(values);\n    handleClose();\n  };\n\n  return (\n    <Dialog open={isOpen} TransitionProps={{ onExited: handleExited }}>\n      {panelGroupEditor !== undefined && (\n        <>\n          <DialogTitle>{panelGroupEditor.mode} Panel Group</DialogTitle>\n          <IconButton\n            aria-label=\"Close\"\n            onClick={panelGroupEditor.close}\n            sx={(theme) => ({\n              position: 'absolute',\n              top: theme.spacing(0.5),\n              right: theme.spacing(0.5),\n            })}\n          >\n            <CloseIcon />\n          </IconButton>\n          <DialogContent dividers sx={{ width: '500px' }}>\n            <PanelGroupEditorForm initialValues={panelGroupEditor.initialValues} onSubmit={handleSubmit} />\n          </DialogContent>\n          <DialogActions>\n            <Button variant=\"contained\" type=\"submit\" form={panelGroupEditorFormId}>\n              {panelGroupEditor.mode === 'Edit' ? 'Apply' : 'Add'}\n            </Button>\n            <Button variant=\"outlined\" color=\"secondary\" onClick={panelGroupEditor.close}>\n              Cancel\n            </Button>\n          </DialogActions>\n        </>\n      )}\n    </Dialog>\n  );\n}\n"],"names":["IconButton","Dialog","DialogTitle","DialogContent","DialogActions","Button","CloseIcon","useState","usePanelGroupEditor","PanelGroupEditorForm","panelGroupEditorFormId","PanelGroupDialog","panelGroupEditor","isClosing","setIsClosing","handleClose","handleExited","close","isOpen","undefined","handleSubmit","values","Error","applyChanges","open","TransitionProps","onExited","mode","aria-label","onClick","sx","theme","position","top","spacing","right","dividers","width","initialValues","onSubmit","variant","type","form","color"],"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,UAAU,EAAEC,MAAM,EAAEC,WAAW,EAAEC,aAAa,EAAEC,aAAa,EAAEC,MAAM,QAAQ,gBAAgB;AACtG,OAAOC,eAAe,wBAAwB;AAC9C,SAASC,QAAQ,QAAQ,QAAQ;AACjC,SAASC,mBAAmB,QAAQ,gBAAgB;AACpD,SAASC,oBAAoB,EAAEC,sBAAsB,QAAmC,yBAAyB;AAEjH;;CAEC,GACD,OAAO,SAASC;IACd,MAAMC,mBAAmBJ;IAEzB,iHAAiH;IACjH,MAAM,CAACK,WAAWC,aAAa,GAAGP,SAAS;IAC3C,MAAMQ,cAAc,IAAMD,aAAa;IAEvC,iFAAiF;IACjF,MAAME,eAAe;QACnBJ,6BAAAA,8BAAAA,KAAAA,IAAAA,iBAAkBK;QAClBH,aAAa;IACf;IAEA,oEAAoE;IACpE,MAAMI,SAASN,qBAAqBO,aAAaN,cAAc;IAE/D,MAAMO,eAAsD,CAACC;QAC3D,kHAAkH;QAClH,IAAIT,qBAAqBO,WAAW;YAClC,MAAM,IAAIG,MAAM;QAClB;QACAV,iBAAiBW,aAAaF;QAC9BN;IACF;IAEA,qBACE,KAACd;QAAOuB,MAAMN;QAAQO,iBAAiB;YAAEC,UAAUV;QAAa;kBAC7DJ,qBAAqBO,2BACpB;;8BACE,MAACjB;;wBAAaU,iBAAiBe;wBAAK;;;8BACpC,KAAC3B;oBACC4B,cAAW;oBACXC,SAASjB,iBAAiBK;oBAC1Ba,IAAI,CAACC,QAAW,CAAA;4BACdC,UAAU;4BACVC,KAAKF,MAAMG,QAAQ;4BACnBC,OAAOJ,MAAMG,QAAQ;wBACvB,CAAA;8BAEA,cAAA,KAAC5B;;8BAEH,KAACH;oBAAciC,QAAQ;oBAACN,IAAI;wBAAEO,OAAO;oBAAQ;8BAC3C,cAAA,KAAC5B;wBAAqB6B,eAAe1B,iBAAiB0B;wBAAeC,UAAUnB;;;8BAEjF,MAAChB;;sCACC,KAACC;4BAAOmC,SAAQ;4BAAYC,MAAK;4BAASC,MAAMhC;sCAC7CE,iBAAiBe,SAAS,SAAS,UAAU;;sCAEhD,KAACtB;4BAAOmC,SAAQ;4BAAWG,OAAM;4BAAYd,SAASjB,iBAAiBK;sCAAO;;;;;;;AAQ1F"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PanelGroupDialog/PanelGroupEditorForm.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 { FormEventHandler, useState } from 'react';\nimport { FormControl, InputLabel, TextField, Select, SelectProps, MenuItem } from '@mui/material';\nimport { PanelGroupEditorValues } from '../../context';\n\ntype CollapsedState = 'Open' | 'Closed';\n\nexport interface PanelGroupEditorFormProps {\n  initialValues: PanelGroupEditorValues;\n  onSubmit: (next: PanelGroupEditorValues) => void;\n}\n\nexport function PanelGroupEditorForm(props: PanelGroupEditorFormProps) {\n  const { initialValues, onSubmit } = props;\n\n  const [title, setTitle] = useState(initialValues.title);\n  const [isCollapsed, setIsCollapsed] = useState(initialValues.isCollapsed);\n\n  const handleCollapsedChange: SelectProps<CollapsedState>['onChange'] = (e) => {\n    const next = e.target.value;\n    setIsCollapsed(next === 'Closed');\n  };\n\n  const handleSubmit: FormEventHandler = (e) => {\n    e.preventDefault();\n    onSubmit({ title, isCollapsed });\n  };\n\n  return (\n    <form id={panelGroupEditorFormId} onSubmit={handleSubmit}>\n      <FormControl fullWidth margin=\"normal\">\n        <TextField required label=\"Name\" variant=\"outlined\" value={title} onChange={(e) => setTitle(e.target.value)} />\n      </FormControl>\n      <FormControl fullWidth margin=\"normal\">\n        <InputLabel id=\"select-collapse-state\">Collapse State</InputLabel>\n        <Select<CollapsedState>\n          required\n          displayEmpty\n          labelId=\"select-collapse-state\"\n          label=\"Collapse State\"\n          size=\"small\"\n          value={isCollapsed ? 'Closed' : 'Open'}\n          onChange={handleCollapsedChange}\n        >\n          <MenuItem value=\"Open\">Open</MenuItem>\n          <MenuItem value=\"Closed\">Closed</MenuItem>\n        </Select>\n      </FormControl>\n    </form>\n  );\n}\n\n/**\n * The `id` attribute added to the `PanelGroupEditorForm` component, allowing submit buttons to live outside the form.\n */\nexport const panelGroupEditorFormId = 'panel-group-editor-form';\n"],"names":["useState","FormControl","InputLabel","TextField","Select","MenuItem","PanelGroupEditorForm","props","initialValues","onSubmit","title","setTitle","isCollapsed","setIsCollapsed","handleCollapsedChange","e","next","target","value","handleSubmit","preventDefault","form","id","panelGroupEditorFormId","fullWidth","margin","required","label","variant","onChange","displayEmpty","labelId","size"],"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,SAA2BA,QAAQ,QAAQ,OAAO,CAAC;AACnD,SAASC,WAAW,EAAEC,UAAU,EAAEC,SAAS,EAAEC,MAAM,EAAeC,QAAQ,QAAQ,eAAe,CAAC;AAUlG,OAAO,SAASC,oBAAoB,CAACC,KAAgC,EAAE;IACrE,MAAM,EAAEC,aAAa,CAAA,EAAEC,QAAQ,CAAA,EAAE,GAAGF,KAAK,AAAC;IAE1C,MAAM,CAACG,KAAK,EAAEC,QAAQ,CAAC,GAAGX,QAAQ,CAACQ,aAAa,CAACE,KAAK,CAAC,AAAC;IACxD,MAAM,CAACE,WAAW,EAAEC,cAAc,CAAC,GAAGb,QAAQ,CAACQ,aAAa,CAACI,WAAW,CAAC,AAAC;IAE1E,MAAME,qBAAqB,GAA4C,CAACC,CAAC,GAAK;QAC5E,MAAMC,IAAI,GAAGD,CAAC,CAACE,MAAM,CAACC,KAAK,AAAC;QAC5BL,cAAc,CAACG,IAAI,KAAK,QAAQ,CAAC,CAAC;IACpC,CAAC,AAAC;IAEF,MAAMG,YAAY,GAAqB,CAACJ,CAAC,GAAK;QAC5CA,CAAC,CAACK,cAAc,EAAE,CAAC;QACnBX,QAAQ,CAAC;YAAEC,KAAK;YAAEE,WAAW;SAAE,CAAC,CAAC;IACnC,CAAC,AAAC;IAEF,qBACE,MAACS,MAAI;QAACC,EAAE,EAAEC,sBAAsB;QAAEd,QAAQ,EAAEU,YAAY;;0BACtD,KAAClB,WAAW;gBAACuB,SAAS;gBAACC,MAAM,EAAC,QAAQ;0BACpC,cAAA,KAACtB,SAAS;oBAACuB,QAAQ;oBAACC,KAAK,EAAC,MAAM;oBAACC,OAAO,EAAC,UAAU;oBAACV,KAAK,EAAER,KAAK;oBAAEmB,QAAQ,EAAE,CAACd,CAAC,GAAKJ,QAAQ,CAACI,CAAC,CAACE,MAAM,CAACC,KAAK,CAAC;kBAAI;cACnG;0BACd,MAACjB,WAAW;gBAACuB,SAAS;gBAACC,MAAM,EAAC,QAAQ;;kCACpC,KAACvB,UAAU;wBAACoB,EAAE,EAAC,uBAAuB;kCAAC,gBAAc;sBAAa;kCAClE,MAAClB,MAAM;wBACLsB,QAAQ;wBACRI,YAAY;wBACZC,OAAO,EAAC,uBAAuB;wBAC/BJ,KAAK,EAAC,gBAAgB;wBACtBK,IAAI,EAAC,OAAO;wBACZd,KAAK,EAAEN,WAAW,GAAG,QAAQ,GAAG,MAAM;wBACtCiB,QAAQ,EAAEf,qBAAqB;;0CAE/B,KAACT,QAAQ;gCAACa,KAAK,EAAC,MAAM;0CAAC,MAAI;8BAAW;0CACtC,KAACb,QAAQ;gCAACa,KAAK,EAAC,QAAQ;0CAAC,QAAM;8BAAW;;sBACnC;;cACG;;MACT,CACP;AACJ,CAAC;AAED;;CAEC,GACD,OAAO,MAAMK,sBAAsB,GAAG,yBAAyB,CAAC"}
+{"version":3,"sources":["../../../src/components/PanelGroupDialog/PanelGroupEditorForm.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 { FormEventHandler, useState } from 'react';\nimport { FormControl, InputLabel, TextField, Select, SelectProps, MenuItem } from '@mui/material';\nimport { PanelGroupEditorValues } from '../../context';\n\ntype CollapsedState = 'Open' | 'Closed';\n\nexport interface PanelGroupEditorFormProps {\n  initialValues: PanelGroupEditorValues;\n  onSubmit: (next: PanelGroupEditorValues) => void;\n}\n\nexport function PanelGroupEditorForm(props: PanelGroupEditorFormProps) {\n  const { initialValues, onSubmit } = props;\n\n  const [title, setTitle] = useState(initialValues.title);\n  const [isCollapsed, setIsCollapsed] = useState(initialValues.isCollapsed);\n\n  const handleCollapsedChange: SelectProps<CollapsedState>['onChange'] = (e) => {\n    const next = e.target.value;\n    setIsCollapsed(next === 'Closed');\n  };\n\n  const handleSubmit: FormEventHandler = (e) => {\n    e.preventDefault();\n    onSubmit({ title, isCollapsed });\n  };\n\n  return (\n    <form id={panelGroupEditorFormId} onSubmit={handleSubmit}>\n      <FormControl fullWidth margin=\"normal\">\n        <TextField required label=\"Name\" variant=\"outlined\" value={title} onChange={(e) => setTitle(e.target.value)} />\n      </FormControl>\n      <FormControl fullWidth margin=\"normal\">\n        <InputLabel id=\"select-collapse-state\">Collapse State</InputLabel>\n        <Select<CollapsedState>\n          required\n          displayEmpty\n          labelId=\"select-collapse-state\"\n          label=\"Collapse State\"\n          size=\"small\"\n          value={isCollapsed ? 'Closed' : 'Open'}\n          onChange={handleCollapsedChange}\n        >\n          <MenuItem value=\"Open\">Open</MenuItem>\n          <MenuItem value=\"Closed\">Closed</MenuItem>\n        </Select>\n      </FormControl>\n    </form>\n  );\n}\n\n/**\n * The `id` attribute added to the `PanelGroupEditorForm` component, allowing submit buttons to live outside the form.\n */\nexport const panelGroupEditorFormId = 'panel-group-editor-form';\n"],"names":["useState","FormControl","InputLabel","TextField","Select","MenuItem","PanelGroupEditorForm","props","initialValues","onSubmit","title","setTitle","isCollapsed","setIsCollapsed","handleCollapsedChange","e","next","target","value","handleSubmit","preventDefault","form","id","panelGroupEditorFormId","fullWidth","margin","required","label","variant","onChange","displayEmpty","labelId","size"],"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,SAA2BA,QAAQ,QAAQ,QAAQ;AACnD,SAASC,WAAW,EAAEC,UAAU,EAAEC,SAAS,EAAEC,MAAM,EAAeC,QAAQ,QAAQ,gBAAgB;AAUlG,OAAO,SAASC,qBAAqBC,KAAgC;IACnE,MAAM,EAAEC,cAAa,EAAEC,SAAQ,EAAE,GAAGF;IAEpC,MAAM,CAACG,OAAOC,SAAS,GAAGX,SAASQ,cAAcE;IACjD,MAAM,CAACE,aAAaC,eAAe,GAAGb,SAASQ,cAAcI;IAE7D,MAAME,wBAAiE,CAACC;QACtE,MAAMC,OAAOD,EAAEE,OAAOC;QACtBL,eAAeG,SAAS;IAC1B;IAEA,MAAMG,eAAiC,CAACJ;QACtCA,EAAEK;QACFX,SAAS;YAAEC;YAAOE;QAAY;IAChC;IAEA,qBACE,MAACS;QAAKC,IAAIC;QAAwBd,UAAUU;;0BAC1C,KAAClB;gBAAYuB,SAAS;gBAACC,QAAO;0BAC5B,cAAA,KAACtB;oBAAUuB,QAAQ;oBAACC,OAAM;oBAAOC,SAAQ;oBAAWV,OAAOR;oBAAOmB,UAAU,CAACd,IAAMJ,SAASI,EAAEE,OAAOC;;;0BAEvG,MAACjB;gBAAYuB,SAAS;gBAACC,QAAO;;kCAC5B,KAACvB;wBAAWoB,IAAG;kCAAwB;;kCACvC,MAAClB;wBACCsB,QAAQ;wBACRI,YAAY;wBACZC,SAAQ;wBACRJ,OAAM;wBACNK,MAAK;wBACLd,OAAON,cAAc,WAAW;wBAChCiB,UAAUf;;0CAEV,KAACT;gCAASa,OAAM;0CAAO;;0CACvB,KAACb;gCAASa,OAAM;0CAAS;;;;;;;;AAKnC;AAEA;;CAEC,GACD,OAAO,MAAMK,yBAAyB,0BAA0B"}

package/dist/components/PanelGroupDialog/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PanelGroupDialog/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './PanelGroupDialog';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,oBAAoB,CAAC"}
+{"version":3,"sources":["../../../src/components/PanelGroupDialog/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './PanelGroupDialog';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,qBAAqB"}

package/dist/components/QuerySummaryTable/QuerySummaryTable.js

@@ -32,12 +32,12 @@ export function QuerySummaryTable(props) {
     }
     const warnings = [];
     querySummary.forEach((query)=>{
-        var ref;
+        var _queryData_metadata;
         const queryData = query.state.data;
-        if (queryData && ((ref = queryData.metadata) === null || ref === void 0 ? void 0 : ref.notices)) {
-            var ref1;
+        if (queryData && ((_queryData_metadata = queryData.metadata) === null || _queryData_metadata === void 0 ? void 0 : _queryData_metadata.notices)) {
+            var _queryData_metadata_notices_;
             const queryKey = query.queryKey;
-            const warningMessage = (ref1 = queryData.metadata.notices[0]) === null || ref1 === void 0 ? void 0 : ref1.message;
+            const warningMessage = (_queryData_metadata_notices_ = queryData.metadata.notices[0]) === null || _queryData_metadata_notices_ === void 0 ? void 0 : _queryData_metadata_notices_.message;
             if (warningMessage) {
                 warnings.push({
                     query: String(queryKey[0].spec.plugin.spec.query),

package/dist/components/QuerySummaryTable/QuerySummaryTable.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/QuerySummaryTable/QuerySummaryTable.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 {\n  Box,\n  Button,\n  Paper,\n  Table,\n  TableBody,\n  TableCell,\n  TableContainer,\n  TableHead,\n  TableRow,\n  Typography,\n  Stack,\n} from '@mui/material';\nimport { useQueryClient } from '@tanstack/react-query';\nimport { TimeSeriesQueryDefinition, UnknownSpec } from '@perses-dev/core';\nimport { useActiveTimeSeriesQueries, useDatasourceClient, useTimeRange } from '@perses-dev/plugin-system';\n\nexport interface WarningDisplay {\n  query: string;\n  summary: string;\n}\n\nconst TABLE_MAX_WIDTH = 1000;\n\ninterface QuerySummaryTableProps {\n  showTotalQueries?: boolean;\n}\n\nexport function QuerySummaryTable(props: QuerySummaryTableProps) {\n  const { showTotalQueries = true } = props;\n  const datasourcClient = useDatasourceClient({ kind: 'PrometheusDatasource' });\n  const { absoluteTimeRange } = useTimeRange();\n\n  // for displaying a summary of recent query results\n  const queryClient = useQueryClient();\n  const queries = queryClient.getQueryCache().findAll();\n  const activeQueries = queries.filter((query) => query.state.status === 'loading');\n  const completedQueries = queries.filter((query) => query.state.status === 'success');\n  const querySummary = useActiveTimeSeriesQueries();\n\n  if (datasourcClient.isLoading === true) {\n    return null;\n  }\n\n  const warnings: WarningDisplay[] = [];\n  querySummary.forEach((query) => {\n    const queryData = query.state.data;\n    if (queryData && queryData.metadata?.notices) {\n      const queryKey = query.queryKey as [TimeSeriesQueryDefinition<UnknownSpec>];\n      const warningMessage = queryData.metadata.notices[0]?.message;\n      if (warningMessage) {\n        warnings.push({\n          query: String(queryKey[0].spec.plugin.spec.query),\n          summary: warningMessage,\n        });\n      }\n    }\n  });\n\n  return (\n    <Stack\n      spacing={1}\n      mb={2}\n      sx={{\n        maxWidth: TABLE_MAX_WIDTH,\n      }}\n    >\n      <Box sx={{ p: 1 }}>\n        <Typography variant=\"h2\" mb={1}>\n          Query Summary\n        </Typography>\n        <TableContainer component={Paper}>\n          <Table size=\"small\" aria-label=\"query summary table\">\n            <TableHead>\n              <TableRow>\n                <TableCell>Queries Loading</TableCell>\n                <TableCell>Recent Time Series Queries</TableCell>\n                {showTotalQueries && <TableCell>Total Queries</TableCell>}\n                <TableCell>Start Time</TableCell>\n                <TableCell>End Time</TableCell>\n              </TableRow>\n            </TableHead>\n            <TableBody>\n              <TableRow>\n                <TableCell>{activeQueries.length}</TableCell>\n                <TableCell>{querySummary.length}</TableCell>\n                {showTotalQueries && <TableCell>{completedQueries.length}</TableCell>}\n                <TableCell>{absoluteTimeRange.start.toString()}</TableCell>\n                <TableCell>{absoluteTimeRange.end.toString()}</TableCell>\n              </TableRow>\n            </TableBody>\n          </Table>\n        </TableContainer>\n      </Box>\n\n      {warnings.length > 0 && (\n        <Box sx={{ p: 1, m: 0 }}>\n          <Typography variant=\"h3\" mb={1}>\n            Warnings\n          </Typography>\n          <TableContainer component={Paper} sx={{ mb: 2 }}>\n            <Table size=\"small\" aria-label=\"query warnings table\">\n              <TableHead>\n                <TableRow>\n                  <TableCell>Query</TableCell>\n                  <TableCell>Summary</TableCell>\n                </TableRow>\n              </TableHead>\n              <TableBody>\n                {warnings.map((details, idx) => {\n                  return (\n                    <TableRow key={idx}>\n                      <TableCell>{details.query}</TableCell>\n                      <TableCell>{details.summary}</TableCell>\n                    </TableRow>\n                  );\n                })}\n              </TableBody>\n            </Table>\n          </TableContainer>\n          <Button disabled variant=\"outlined\">\n            TODO: Action Button\n          </Button>\n        </Box>\n      )}\n    </Stack>\n  );\n}\n"],"names":["Box","Button","Paper","Table","TableBody","TableCell","TableContainer","TableHead","TableRow","Typography","Stack","useQueryClient","useActiveTimeSeriesQueries","useDatasourceClient","useTimeRange","TABLE_MAX_WIDTH","QuerySummaryTable","props","showTotalQueries","datasourcClient","kind","absoluteTimeRange","queryClient","queries","getQueryCache","findAll","activeQueries","filter","query","state","status","completedQueries","querySummary","isLoading","warnings","forEach","queryData","data","metadata","notices","queryKey","warningMessage","message","push","String","spec","plugin","summary","spacing","mb","sx","maxWidth","p","variant","component","size","aria-label","length","start","toString","end","m","map","details","idx","disabled"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/QuerySummaryTable/QuerySummaryTable.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 {\n  Box,\n  Button,\n  Paper,\n  Table,\n  TableBody,\n  TableCell,\n  TableContainer,\n  TableHead,\n  TableRow,\n  Typography,\n  Stack,\n} from '@mui/material';\nimport { useQueryClient } from '@tanstack/react-query';\nimport { TimeSeriesQueryDefinition, UnknownSpec } from '@perses-dev/core';\nimport { useActiveTimeSeriesQueries, useDatasourceClient, useTimeRange } from '@perses-dev/plugin-system';\n\nexport interface WarningDisplay {\n  query: string;\n  summary: string;\n}\n\nconst TABLE_MAX_WIDTH = 1000;\n\ninterface QuerySummaryTableProps {\n  showTotalQueries?: boolean;\n}\n\nexport function QuerySummaryTable(props: QuerySummaryTableProps) {\n  const { showTotalQueries = true } = props;\n  const datasourcClient = useDatasourceClient({ kind: 'PrometheusDatasource' });\n  const { absoluteTimeRange } = useTimeRange();\n\n  // for displaying a summary of recent query results\n  const queryClient = useQueryClient();\n  const queries = queryClient.getQueryCache().findAll();\n  const activeQueries = queries.filter((query) => query.state.status === 'loading');\n  const completedQueries = queries.filter((query) => query.state.status === 'success');\n  const querySummary = useActiveTimeSeriesQueries();\n\n  if (datasourcClient.isLoading === true) {\n    return null;\n  }\n\n  const warnings: WarningDisplay[] = [];\n  querySummary.forEach((query) => {\n    const queryData = query.state.data;\n    if (queryData && queryData.metadata?.notices) {\n      const queryKey = query.queryKey as [TimeSeriesQueryDefinition<UnknownSpec>];\n      const warningMessage = queryData.metadata.notices[0]?.message;\n      if (warningMessage) {\n        warnings.push({\n          query: String(queryKey[0].spec.plugin.spec.query),\n          summary: warningMessage,\n        });\n      }\n    }\n  });\n\n  return (\n    <Stack\n      spacing={1}\n      mb={2}\n      sx={{\n        maxWidth: TABLE_MAX_WIDTH,\n      }}\n    >\n      <Box sx={{ p: 1 }}>\n        <Typography variant=\"h2\" mb={1}>\n          Query Summary\n        </Typography>\n        <TableContainer component={Paper}>\n          <Table size=\"small\" aria-label=\"query summary table\">\n            <TableHead>\n              <TableRow>\n                <TableCell>Queries Loading</TableCell>\n                <TableCell>Recent Time Series Queries</TableCell>\n                {showTotalQueries && <TableCell>Total Queries</TableCell>}\n                <TableCell>Start Time</TableCell>\n                <TableCell>End Time</TableCell>\n              </TableRow>\n            </TableHead>\n            <TableBody>\n              <TableRow>\n                <TableCell>{activeQueries.length}</TableCell>\n                <TableCell>{querySummary.length}</TableCell>\n                {showTotalQueries && <TableCell>{completedQueries.length}</TableCell>}\n                <TableCell>{absoluteTimeRange.start.toString()}</TableCell>\n                <TableCell>{absoluteTimeRange.end.toString()}</TableCell>\n              </TableRow>\n            </TableBody>\n          </Table>\n        </TableContainer>\n      </Box>\n\n      {warnings.length > 0 && (\n        <Box sx={{ p: 1, m: 0 }}>\n          <Typography variant=\"h3\" mb={1}>\n            Warnings\n          </Typography>\n          <TableContainer component={Paper} sx={{ mb: 2 }}>\n            <Table size=\"small\" aria-label=\"query warnings table\">\n              <TableHead>\n                <TableRow>\n                  <TableCell>Query</TableCell>\n                  <TableCell>Summary</TableCell>\n                </TableRow>\n              </TableHead>\n              <TableBody>\n                {warnings.map((details, idx) => {\n                  return (\n                    <TableRow key={idx}>\n                      <TableCell>{details.query}</TableCell>\n                      <TableCell>{details.summary}</TableCell>\n                    </TableRow>\n                  );\n                })}\n              </TableBody>\n            </Table>\n          </TableContainer>\n          <Button disabled variant=\"outlined\">\n            TODO: Action Button\n          </Button>\n        </Box>\n      )}\n    </Stack>\n  );\n}\n"],"names":["Box","Button","Paper","Table","TableBody","TableCell","TableContainer","TableHead","TableRow","Typography","Stack","useQueryClient","useActiveTimeSeriesQueries","useDatasourceClient","useTimeRange","TABLE_MAX_WIDTH","QuerySummaryTable","props","showTotalQueries","datasourcClient","kind","absoluteTimeRange","queryClient","queries","getQueryCache","findAll","activeQueries","filter","query","state","status","completedQueries","querySummary","isLoading","warnings","forEach","queryData","data","metadata","notices","queryKey","warningMessage","message","push","String","spec","plugin","summary","spacing","mb","sx","maxWidth","p","variant","component","size","aria-label","length","start","toString","end","m","map","details","idx","disabled"],"mappings":"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"}

package/dist/components/QuerySummaryTable/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/QuerySummaryTable/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './QuerySummaryTable';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,qBAAqB,CAAC"}
+{"version":3,"sources":["../../../src/components/QuerySummaryTable/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './QuerySummaryTable';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,sBAAsB"}

package/dist/components/SaveChangesConfirmationDialog/SaveChangesConfirmationDialog.js

@@ -19,10 +19,10 @@ import { Dialog } from '@perses-dev/components';
 import { useSaveChangesConfirmationDialog, useTemplateVariableActions } from '../../context';
 export const SaveChangesConfirmationDialog = ()=>{
     const { saveChangesConfirmationDialog: dialog  } = useSaveChangesConfirmationDialog();
-    var ref;
-    const isSavedDurationModified = (ref = dialog === null || dialog === void 0 ? void 0 : dialog.isSavedDurationModified) !== null && ref !== void 0 ? ref : true;
-    var ref1;
-    const isSavedVariableModified = (ref1 = dialog === null || dialog === void 0 ? void 0 : dialog.isSavedVariableModified) !== null && ref1 !== void 0 ? ref1 : true;
+    var _dialog_isSavedDurationModified;
+    const isSavedDurationModified = (_dialog_isSavedDurationModified = dialog === null || dialog === void 0 ? void 0 : dialog.isSavedDurationModified) !== null && _dialog_isSavedDurationModified !== void 0 ? _dialog_isSavedDurationModified : true;
+    var _dialog_isSavedVariableModified;
+    const isSavedVariableModified = (_dialog_isSavedVariableModified = dialog === null || dialog === void 0 ? void 0 : dialog.isSavedVariableModified) !== null && _dialog_isSavedVariableModified !== void 0 ? _dialog_isSavedVariableModified : true;
     const [saveDefaultTimeRange, setSaveDefaultTimeRange] = useState(isSavedDurationModified);
     const [saveDefaultVariables, setSaveDefaultVariables] = useState(isSavedVariableModified);
     const { getSavedVariablesStatus  } = useTemplateVariableActions();

package/dist/components/SaveChangesConfirmationDialog/SaveChangesConfirmationDialog.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SaveChangesConfirmationDialog/SaveChangesConfirmationDialog.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 { Checkbox, FormGroup, FormControlLabel, Typography } from '@mui/material';\nimport { useTimeRange } from '@perses-dev/plugin-system';\nimport { isRelativeTimeRange, SAVE_DEFAULTS_DIALOG_TEXT } from '@perses-dev/core';\nimport { Dialog } from '@perses-dev/components';\nimport { useSaveChangesConfirmationDialog, useTemplateVariableActions } from '../../context';\n\nexport const SaveChangesConfirmationDialog = () => {\n  const { saveChangesConfirmationDialog: dialog } = useSaveChangesConfirmationDialog();\n  const isSavedDurationModified = dialog?.isSavedDurationModified ?? true;\n  const isSavedVariableModified = dialog?.isSavedVariableModified ?? true;\n  const [saveDefaultTimeRange, setSaveDefaultTimeRange] = useState(isSavedDurationModified);\n  const [saveDefaultVariables, setSaveDefaultVariables] = useState(isSavedVariableModified);\n\n  const { getSavedVariablesStatus } = useTemplateVariableActions();\n  const { modifiedVariableNames } = getSavedVariablesStatus();\n\n  const isOpen = dialog !== undefined;\n\n  const { timeRange } = useTimeRange();\n  const currentTimeRangeText = isRelativeTimeRange(timeRange)\n    ? `(Last ${timeRange.pastDuration})`\n    : '(Absolute time ranges can not be saved)';\n\n  const saveTimeRangeText = `Save current time range as new default ${currentTimeRangeText}`;\n\n  const saveVariablesText = `Save current variable values as new default (${\n    modifiedVariableNames.length > 0 ? modifiedVariableNames.join(', ') : 'No modified variables'\n  })`;\n\n  return (\n    <Dialog open={isOpen}>\n      {dialog !== undefined && (\n        <>\n          <Dialog.Header onClose={() => dialog.onCancel()}>Save Dashboard</Dialog.Header>\n\n          <Dialog.Content>\n            <Typography marginBottom={2}>{dialog.description || SAVE_DEFAULTS_DIALOG_TEXT}</Typography>\n            <FormGroup>\n              <FormControlLabel\n                control={\n                  <Checkbox\n                    disabled={!isSavedDurationModified || !isRelativeTimeRange(timeRange)}\n                    checked={saveDefaultTimeRange && isSavedDurationModified && isRelativeTimeRange(timeRange)}\n                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => setSaveDefaultTimeRange(e.target.checked)}\n                  />\n                }\n                label={saveTimeRangeText}\n              />\n              <FormControlLabel\n                control={\n                  <Checkbox\n                    disabled={!isSavedVariableModified}\n                    checked={saveDefaultVariables && isSavedVariableModified}\n                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => setSaveDefaultVariables(e.target.checked)}\n                  />\n                }\n                label={saveVariablesText}\n              />\n            </FormGroup>\n          </Dialog.Content>\n\n          <Dialog.Actions>\n            <Dialog.PrimaryButton\n              onClick={() => {\n                return dialog.onSaveChanges(saveDefaultTimeRange, saveDefaultVariables);\n              }}\n            >\n              Save Changes\n            </Dialog.PrimaryButton>\n            <Dialog.SecondaryButton onClick={() => dialog.onCancel()}>Cancel</Dialog.SecondaryButton>\n          </Dialog.Actions>\n        </>\n      )}\n    </Dialog>\n  );\n};\n"],"names":["useState","Checkbox","FormGroup","FormControlLabel","Typography","useTimeRange","isRelativeTimeRange","SAVE_DEFAULTS_DIALOG_TEXT","Dialog","useSaveChangesConfirmationDialog","useTemplateVariableActions","SaveChangesConfirmationDialog","saveChangesConfirmationDialog","dialog","isSavedDurationModified","isSavedVariableModified","saveDefaultTimeRange","setSaveDefaultTimeRange","saveDefaultVariables","setSaveDefaultVariables","getSavedVariablesStatus","modifiedVariableNames","isOpen","undefined","timeRange","currentTimeRangeText","pastDuration","saveTimeRangeText","saveVariablesText","length","join","open","Header","onClose","onCancel","Content","marginBottom","description","control","disabled","checked","onChange","e","target","label","Actions","PrimaryButton","onClick","onSaveChanges","SecondaryButton"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/SaveChangesConfirmationDialog/SaveChangesConfirmationDialog.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 { Checkbox, FormGroup, FormControlLabel, Typography } from '@mui/material';\nimport { useTimeRange } from '@perses-dev/plugin-system';\nimport { isRelativeTimeRange, SAVE_DEFAULTS_DIALOG_TEXT } from '@perses-dev/core';\nimport { Dialog } from '@perses-dev/components';\nimport { useSaveChangesConfirmationDialog, useTemplateVariableActions } from '../../context';\n\nexport const SaveChangesConfirmationDialog = () => {\n  const { saveChangesConfirmationDialog: dialog } = useSaveChangesConfirmationDialog();\n  const isSavedDurationModified = dialog?.isSavedDurationModified ?? true;\n  const isSavedVariableModified = dialog?.isSavedVariableModified ?? true;\n  const [saveDefaultTimeRange, setSaveDefaultTimeRange] = useState(isSavedDurationModified);\n  const [saveDefaultVariables, setSaveDefaultVariables] = useState(isSavedVariableModified);\n\n  const { getSavedVariablesStatus } = useTemplateVariableActions();\n  const { modifiedVariableNames } = getSavedVariablesStatus();\n\n  const isOpen = dialog !== undefined;\n\n  const { timeRange } = useTimeRange();\n  const currentTimeRangeText = isRelativeTimeRange(timeRange)\n    ? `(Last ${timeRange.pastDuration})`\n    : '(Absolute time ranges can not be saved)';\n\n  const saveTimeRangeText = `Save current time range as new default ${currentTimeRangeText}`;\n\n  const saveVariablesText = `Save current variable values as new default (${\n    modifiedVariableNames.length > 0 ? modifiedVariableNames.join(', ') : 'No modified variables'\n  })`;\n\n  return (\n    <Dialog open={isOpen}>\n      {dialog !== undefined && (\n        <>\n          <Dialog.Header onClose={() => dialog.onCancel()}>Save Dashboard</Dialog.Header>\n\n          <Dialog.Content>\n            <Typography marginBottom={2}>{dialog.description || SAVE_DEFAULTS_DIALOG_TEXT}</Typography>\n            <FormGroup>\n              <FormControlLabel\n                control={\n                  <Checkbox\n                    disabled={!isSavedDurationModified || !isRelativeTimeRange(timeRange)}\n                    checked={saveDefaultTimeRange && isSavedDurationModified && isRelativeTimeRange(timeRange)}\n                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => setSaveDefaultTimeRange(e.target.checked)}\n                  />\n                }\n                label={saveTimeRangeText}\n              />\n              <FormControlLabel\n                control={\n                  <Checkbox\n                    disabled={!isSavedVariableModified}\n                    checked={saveDefaultVariables && isSavedVariableModified}\n                    onChange={(e: React.ChangeEvent<HTMLInputElement>) => setSaveDefaultVariables(e.target.checked)}\n                  />\n                }\n                label={saveVariablesText}\n              />\n            </FormGroup>\n          </Dialog.Content>\n\n          <Dialog.Actions>\n            <Dialog.PrimaryButton\n              onClick={() => {\n                return dialog.onSaveChanges(saveDefaultTimeRange, saveDefaultVariables);\n              }}\n            >\n              Save Changes\n            </Dialog.PrimaryButton>\n            <Dialog.SecondaryButton onClick={() => dialog.onCancel()}>Cancel</Dialog.SecondaryButton>\n          </Dialog.Actions>\n        </>\n      )}\n    </Dialog>\n  );\n};\n"],"names":["useState","Checkbox","FormGroup","FormControlLabel","Typography","useTimeRange","isRelativeTimeRange","SAVE_DEFAULTS_DIALOG_TEXT","Dialog","useSaveChangesConfirmationDialog","useTemplateVariableActions","SaveChangesConfirmationDialog","saveChangesConfirmationDialog","dialog","isSavedDurationModified","isSavedVariableModified","saveDefaultTimeRange","setSaveDefaultTimeRange","saveDefaultVariables","setSaveDefaultVariables","getSavedVariablesStatus","modifiedVariableNames","isOpen","undefined","timeRange","currentTimeRangeText","pastDuration","saveTimeRangeText","saveVariablesText","length","join","open","Header","onClose","onCancel","Content","marginBottom","description","control","disabled","checked","onChange","e","target","label","Actions","PrimaryButton","onClick","onSaveChanges","SecondaryButton"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAEjC,SAASA,QAAQ,QAAQ,QAAQ;AACjC,SAASC,QAAQ,EAAEC,SAAS,EAAEC,gBAAgB,EAAEC,UAAU,QAAQ,gBAAgB;AAClF,SAASC,YAAY,QAAQ,4BAA4B;AACzD,SAASC,mBAAmB,EAAEC,yBAAyB,QAAQ,mBAAmB;AAClF,SAASC,MAAM,QAAQ,yBAAyB;AAChD,SAASC,gCAAgC,EAAEC,0BAA0B,QAAQ,gBAAgB;AAE7F,OAAO,MAAMC,gCAAgC;IAC3C,MAAM,EAAEC,+BAA+BC,OAAM,EAAE,GAAGJ;QAClBI;IAAhC,MAAMC,0BAA0BD,CAAAA,kCAAAA,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQC,qCAARD,6CAAAA,kCAAmC;QACnCA;IAAhC,MAAME,0BAA0BF,CAAAA,kCAAAA,mBAAAA,oBAAAA,KAAAA,IAAAA,OAAQE,qCAARF,6CAAAA,kCAAmC;IACnE,MAAM,CAACG,sBAAsBC,wBAAwB,GAAGjB,SAASc;IACjE,MAAM,CAACI,sBAAsBC,wBAAwB,GAAGnB,SAASe;IAEjE,MAAM,EAAEK,wBAAuB,EAAE,GAAGV;IACpC,MAAM,EAAEW,sBAAqB,EAAE,GAAGD;IAElC,MAAME,SAAST,WAAWU;IAE1B,MAAM,EAAEC,UAAS,EAAE,GAAGnB;IACtB,MAAMoB,uBAAuBnB,oBAAoBkB,aAC7C,CAAC,MAAM,EAAEA,UAAUE,aAAa,CAAC,CAAC,GAClC;IAEJ,MAAMC,oBAAoB,CAAC,uCAAuC,EAAEF,qBAAqB,CAAC;IAE1F,MAAMG,oBAAoB,CAAC,6CAA6C,EACtEP,sBAAsBQ,SAAS,IAAIR,sBAAsBS,KAAK,QAAQ,wBACvE,CAAC,CAAC;IAEH,qBACE,KAACtB;QAAOuB,MAAMT;kBACXT,WAAWU,2BACV;;8BACE,KAACf,OAAOwB;oBAAOC,SAAS,IAAMpB,OAAOqB;8BAAY;;8BAEjD,MAAC1B,OAAO2B;;sCACN,KAAC/B;4BAAWgC,cAAc;sCAAIvB,OAAOwB,eAAe9B;;sCACpD,MAACL;;8CACC,KAACC;oCACCmC,uBACE,KAACrC;wCACCsC,UAAU,CAACzB,2BAA2B,CAACR,oBAAoBkB;wCAC3DgB,SAASxB,wBAAwBF,2BAA2BR,oBAAoBkB;wCAChFiB,UAAU,CAACC,IAA2CzB,wBAAwByB,EAAEC,OAAOH;;oCAG3FI,OAAOjB;;8CAET,KAACxB;oCACCmC,uBACE,KAACrC;wCACCsC,UAAU,CAACxB;wCACXyB,SAAStB,wBAAwBH;wCACjC0B,UAAU,CAACC,IAA2CvB,wBAAwBuB,EAAEC,OAAOH;;oCAG3FI,OAAOhB;;;;;;8BAKb,MAACpB,OAAOqC;;sCACN,KAACrC,OAAOsC;4BACNC,SAAS;gCACP,OAAOlC,OAAOmC,cAAchC,sBAAsBE;4BACpD;sCACD;;sCAGD,KAACV,OAAOyC;4BAAgBF,SAAS,IAAMlC,OAAOqB;sCAAY;;;;;;;AAMtE,EAAE"}

package/dist/components/SaveChangesConfirmationDialog/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SaveChangesConfirmationDialog/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './SaveChangesConfirmationDialog';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,iCAAiC,CAAC"}
+{"version":3,"sources":["../../../src/components/SaveChangesConfirmationDialog/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './SaveChangesConfirmationDialog';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,kCAAkC"}

package/dist/components/SaveDashboardButton/SaveDashboardButton.js

@@ -26,7 +26,9 @@ export const SaveDashboardButton = ({ onSave , isDisabled , variant ='contained'
     const { openSaveChangesConfirmationDialog , closeSaveChangesConfirmationDialog  } = useSaveChangesConfirmationDialog();
     const onSaveButtonClick = ()=>{
         const isSavedDurationModified = isRelativeTimeRange(timeRange) && dashboard.spec.duration !== timeRange.pastDuration;
-        // Save dashboard if active timeRange from plugin-system is relative and different than currently saved
+        // Save dashboard
+        // - if active timeRange from plugin-system is relative and different from currently saved
+        // - or if the saved variables are different from currently saved
         if (isSavedDurationModified || isSavedVariableModified) {
             openSaveChangesConfirmationDialog({
                 onSaveChanges: (saveDefaultTimeRange, saveDefaultVariables)=>{
@@ -60,9 +62,7 @@ export const SaveDashboardButton = ({ onSave , isDisabled , variant ='contained'
             } catch (error) {
                 throw new Error(`An error occurred while saving the dashboard. ${error}`);
             } finally{
-                if (isSavingDashboard) {
-                    setSavingDashboard(false);
-                }
+                setSavingDashboard(false);
             }
         } else {
             setEditMode(false);

package/dist/components/SaveDashboardButton/SaveDashboardButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SaveDashboardButton/SaveDashboardButton.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 { Button, ButtonProps } from '@mui/material';\nimport { isRelativeTimeRange } from '@perses-dev/core';\nimport { useTimeRange } from '@perses-dev/plugin-system';\nimport {\n  OnSaveDashboard,\n  useDashboard,\n  useEditMode,\n  useSaveChangesConfirmationDialog,\n  useTemplateVariableActions,\n} from '../../context';\n\nexport interface SaveDashboardButtonProps extends Pick<ButtonProps, 'fullWidth'> {\n  onSave?: OnSaveDashboard;\n  isDisabled: boolean;\n  variant?: 'contained' | 'text' | 'outlined';\n}\n\nexport const SaveDashboardButton = ({ onSave, isDisabled, variant = 'contained' }: SaveDashboardButtonProps) => {\n  const [isSavingDashboard, setSavingDashboard] = useState<boolean>(false);\n  const { dashboard, setDashboard } = useDashboard();\n  const { getSavedVariablesStatus, setVariableDefaultValues } = useTemplateVariableActions();\n  const { isSavedVariableModified } = getSavedVariablesStatus();\n  const { timeRange } = useTimeRange();\n  const { setEditMode } = useEditMode();\n  const { openSaveChangesConfirmationDialog, closeSaveChangesConfirmationDialog } = useSaveChangesConfirmationDialog();\n\n  const onSaveButtonClick = () => {\n    const isSavedDurationModified =\n      isRelativeTimeRange(timeRange) && dashboard.spec.duration !== timeRange.pastDuration;\n\n    // Save dashboard if active timeRange from plugin-system is relative and different than currently saved\n    if (isSavedDurationModified || isSavedVariableModified) {\n      openSaveChangesConfirmationDialog({\n        onSaveChanges: (saveDefaultTimeRange, saveDefaultVariables) => {\n          if (isRelativeTimeRange(timeRange) && saveDefaultTimeRange === true) {\n            dashboard.spec.duration = timeRange.pastDuration;\n          }\n          if (saveDefaultVariables === true) {\n            const variables = setVariableDefaultValues();\n            dashboard.spec.variables = variables;\n          }\n          setDashboard(dashboard);\n          saveDashboard();\n        },\n        onCancel: () => {\n          closeSaveChangesConfirmationDialog();\n        },\n        isSavedDurationModified,\n        isSavedVariableModified,\n      });\n    } else {\n      saveDashboard();\n    }\n  };\n\n  const saveDashboard = async () => {\n    if (onSave) {\n      try {\n        setSavingDashboard(true);\n        await onSave(dashboard);\n        closeSaveChangesConfirmationDialog();\n        setEditMode(false);\n      } catch (error) {\n        throw new Error(`An error occurred while saving the dashboard. ${error}`);\n      } finally {\n        if (isSavingDashboard) {\n          setSavingDashboard(false);\n        }\n      }\n    } else {\n      setEditMode(false);\n    }\n  };\n\n  return (\n    <Button variant={variant} onClick={onSaveButtonClick} disabled={isDisabled || isSavingDashboard}>\n      Save\n    </Button>\n  );\n};\n"],"names":["useState","Button","isRelativeTimeRange","useTimeRange","useDashboard","useEditMode","useSaveChangesConfirmationDialog","useTemplateVariableActions","SaveDashboardButton","onSave","isDisabled","variant","isSavingDashboard","setSavingDashboard","dashboard","setDashboard","getSavedVariablesStatus","setVariableDefaultValues","isSavedVariableModified","timeRange","setEditMode","openSaveChangesConfirmationDialog","closeSaveChangesConfirmationDialog","onSaveButtonClick","isSavedDurationModified","spec","duration","pastDuration","onSaveChanges","saveDefaultTimeRange","saveDefaultVariables","variables","saveDashboard","onCancel","error","Error","onClick","disabled"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/SaveDashboardButton/SaveDashboardButton.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 { Button, ButtonProps } from '@mui/material';\nimport { isRelativeTimeRange } from '@perses-dev/core';\nimport { useTimeRange } from '@perses-dev/plugin-system';\nimport {\n  OnSaveDashboard,\n  useDashboard,\n  useEditMode,\n  useSaveChangesConfirmationDialog,\n  useTemplateVariableActions,\n} from '../../context';\n\nexport interface SaveDashboardButtonProps extends Pick<ButtonProps, 'fullWidth'> {\n  onSave?: OnSaveDashboard;\n  isDisabled: boolean;\n  variant?: 'contained' | 'text' | 'outlined';\n}\n\nexport const SaveDashboardButton = ({ onSave, isDisabled, variant = 'contained' }: SaveDashboardButtonProps) => {\n  const [isSavingDashboard, setSavingDashboard] = useState<boolean>(false);\n  const { dashboard, setDashboard } = useDashboard();\n  const { getSavedVariablesStatus, setVariableDefaultValues } = useTemplateVariableActions();\n  const { isSavedVariableModified } = getSavedVariablesStatus();\n  const { timeRange } = useTimeRange();\n  const { setEditMode } = useEditMode();\n  const { openSaveChangesConfirmationDialog, closeSaveChangesConfirmationDialog } = useSaveChangesConfirmationDialog();\n\n  const onSaveButtonClick = () => {\n    const isSavedDurationModified =\n      isRelativeTimeRange(timeRange) && dashboard.spec.duration !== timeRange.pastDuration;\n\n    // Save dashboard\n    // - if active timeRange from plugin-system is relative and different from currently saved\n    // - or if the saved variables are different from currently saved\n    if (isSavedDurationModified || isSavedVariableModified) {\n      openSaveChangesConfirmationDialog({\n        onSaveChanges: (saveDefaultTimeRange, saveDefaultVariables) => {\n          if (isRelativeTimeRange(timeRange) && saveDefaultTimeRange === true) {\n            dashboard.spec.duration = timeRange.pastDuration;\n          }\n          if (saveDefaultVariables === true) {\n            const variables = setVariableDefaultValues();\n            dashboard.spec.variables = variables;\n          }\n          setDashboard(dashboard);\n          saveDashboard();\n        },\n        onCancel: () => {\n          closeSaveChangesConfirmationDialog();\n        },\n        isSavedDurationModified,\n        isSavedVariableModified,\n      });\n    } else {\n      saveDashboard();\n    }\n  };\n\n  const saveDashboard = async () => {\n    if (onSave) {\n      try {\n        setSavingDashboard(true);\n        await onSave(dashboard);\n        closeSaveChangesConfirmationDialog();\n        setEditMode(false);\n      } catch (error) {\n        throw new Error(`An error occurred while saving the dashboard. ${error}`);\n      } finally {\n        setSavingDashboard(false);\n      }\n    } else {\n      setEditMode(false);\n    }\n  };\n\n  return (\n    <Button variant={variant} onClick={onSaveButtonClick} disabled={isDisabled || isSavingDashboard}>\n      Save\n    </Button>\n  );\n};\n"],"names":["useState","Button","isRelativeTimeRange","useTimeRange","useDashboard","useEditMode","useSaveChangesConfirmationDialog","useTemplateVariableActions","SaveDashboardButton","onSave","isDisabled","variant","isSavingDashboard","setSavingDashboard","dashboard","setDashboard","getSavedVariablesStatus","setVariableDefaultValues","isSavedVariableModified","timeRange","setEditMode","openSaveChangesConfirmationDialog","closeSaveChangesConfirmationDialog","onSaveButtonClick","isSavedDurationModified","spec","duration","pastDuration","onSaveChanges","saveDefaultTimeRange","saveDefaultVariables","variables","saveDashboard","onCancel","error","Error","onClick","disabled"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;;AAEjC,SAASA,QAAQ,QAAQ,QAAQ;AACjC,SAASC,MAAM,QAAqB,gBAAgB;AACpD,SAASC,mBAAmB,QAAQ,mBAAmB;AACvD,SAASC,YAAY,QAAQ,4BAA4B;AACzD,SAEEC,YAAY,EACZC,WAAW,EACXC,gCAAgC,EAChCC,0BAA0B,QACrB,gBAAgB;AAQvB,OAAO,MAAMC,sBAAsB,CAAC,EAAEC,OAAM,EAAEC,WAAU,EAAEC,SAAU,YAAW,EAA4B;IACzG,MAAM,CAACC,mBAAmBC,mBAAmB,GAAGb,SAAkB;IAClE,MAAM,EAAEc,UAAS,EAAEC,aAAY,EAAE,GAAGX;IACpC,MAAM,EAAEY,wBAAuB,EAAEC,yBAAwB,EAAE,GAAGV;IAC9D,MAAM,EAAEW,wBAAuB,EAAE,GAAGF;IACpC,MAAM,EAAEG,UAAS,EAAE,GAAGhB;IACtB,MAAM,EAAEiB,YAAW,EAAE,GAAGf;IACxB,MAAM,EAAEgB,kCAAiC,EAAEC,mCAAkC,EAAE,GAAGhB;IAElF,MAAMiB,oBAAoB;QACxB,MAAMC,0BACJtB,oBAAoBiB,cAAcL,UAAUW,KAAKC,aAAaP,UAAUQ;QAE1E,iBAAiB;QACjB,0FAA0F;QAC1F,iEAAiE;QACjE,IAAIH,2BAA2BN,yBAAyB;YACtDG,kCAAkC;gBAChCO,eAAe,CAACC,sBAAsBC;oBACpC,IAAI5B,oBAAoBiB,cAAcU,yBAAyB,MAAM;wBACnEf,UAAUW,KAAKC,WAAWP,UAAUQ;oBACtC;oBACA,IAAIG,yBAAyB,MAAM;wBACjC,MAAMC,YAAYd;wBAClBH,UAAUW,KAAKM,YAAYA;oBAC7B;oBACAhB,aAAaD;oBACbkB;gBACF;gBACAC,UAAU;oBACRX;gBACF;gBACAE;gBACAN;YACF;QACF,OAAO;YACLc;QACF;IACF;IAEA,MAAMA,gBAAgB;QACpB,IAAIvB,QAAQ;YACV,IAAI;gBACFI,mBAAmB;gBACnB,MAAMJ,OAAOK;gBACbQ;gBACAF,YAAY;YACd,EAAE,OAAOc,OAAO;gBACd,MAAM,IAAIC,MAAM,CAAC,8CAA8C,EAAED,MAAM,CAAC;YAC1E,SAAU;gBACRrB,mBAAmB;YACrB;QACF,OAAO;YACLO,YAAY;QACd;IACF;IAEA,qBACE,KAACnB;QAAOU,SAASA;QAASyB,SAASb;QAAmBc,UAAU3B,cAAcE;kBAAmB;;AAIrG,EAAE"}

package/dist/components/SaveDashboardButton/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/SaveDashboardButton/index.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\nexport * from './SaveDashboardButton';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,uBAAuB,CAAC"}
+{"version":3,"sources":["../../../src/components/SaveDashboardButton/index.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\nexport * from './SaveDashboardButton';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,wBAAwB"}

package/dist/components/TimeRangeControls/TimeRangeControls.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TimeRangeControls.d.ts","sourceRoot":"","sources":["../../../src/components/TimeRangeControls/TimeRangeControls.tsx"],"names":[],"mappings":";AAeA,OAAO,EAA2D,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAO7G,eAAO,MAAM,0BAA0B,EAAE,UAAU,EAUlD,CAAC;AAEF,eAAO,MAAM,gCAAgC,EAAE,UAAU,EAOxD,CAAC;AAIF,UAAU,sBAAsB;IAE9B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;CAC5B;AAED,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,qBAA4B,EAC5B,iBAAwB,EACxB,mBAA0B,EAC1B,WAAwC,GACzC,EAAE,sBAAsB,eAwCxB"}
+{"version":3,"file":"TimeRangeControls.d.ts","sourceRoot":"","sources":["../../../src/components/TimeRangeControls/TimeRangeControls.tsx"],"names":[],"mappings":";AAeA,OAAO,EAA2D,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAS7G,eAAO,MAAM,0BAA0B,EAAE,UAAU,EAUlD,CAAC;AAEF,eAAO,MAAM,gCAAgC,EAAE,UAAU,EAOxD,CAAC;AAIF,UAAU,sBAAsB;IAE9B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,WAAW,CAAC,EAAE,UAAU,EAAE,CAAC;CAC5B;AAED,wBAAgB,iBAAiB,CAAC,EAChC,QAAQ,EACR,qBAA4B,EAC5B,iBAAwB,EACxB,mBAA0B,EAC1B,WAAwC,GACzC,EAAE,sBAAsB,eAwDxB"}

package/dist/components/TimeRangeControls/TimeRangeControls.js

@@ -16,9 +16,11 @@ import { Stack } from '@mui/material';
 import { DateTimeRangePicker, RefreshIntervalPicker, InfoTooltip } from '@perses-dev/components';
 import { useTimeRange } from '@perses-dev/plugin-system';
 import { isDurationString } from '@perses-dev/core';
+import { useCallback } from 'react';
 import { TOOLTIP_TEXT } from '../../constants';
 import { useDashboardDuration } from '../../context';
 import { ToolbarIconButton } from '../ToolbarIconButton';
+import { useDashboard } from '../../context/useDashboard';
 export const DEFAULT_TIME_RANGE_OPTIONS = [
     {
         value: {
@@ -118,6 +120,7 @@ export function TimeRangeControls({ heightPx , showTimeRangeSelector =true , sho
     const { timeRange , setTimeRange , refresh , refreshInterval , setRefreshInterval  } = useTimeRange();
     // TODO: Remove this since it couples to the dashboard context
     const dashboardDuration = useDashboardDuration();
+    const { dashboard , setDashboard  } = useDashboard();
     // 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
@@ -131,6 +134,21 @@ export function TimeRangeControls({ heightPx , showTimeRangeSelector =true , sho
             });
         }
     }
+    // set the new refresh interval both in the dashboard context & as query param
+    const handleRefreshIntervalChange = useCallback((duration)=>{
+        setDashboard({
+            ...dashboard,
+            spec: {
+                ...dashboard.spec,
+                refreshInterval: duration
+            }
+        });
+        setRefreshInterval(duration);
+    }, [
+        dashboard,
+        setDashboard,
+        setRefreshInterval
+    ]);
     return /*#__PURE__*/ _jsxs(Stack, {
         direction: "row",
         spacing: 1,
@@ -155,7 +173,7 @@ export function TimeRangeControls({ heightPx , showTimeRangeSelector =true , sho
             showRefreshInterval && /*#__PURE__*/ _jsx(RefreshIntervalPicker, {
                 timeOptions: DEFAULT_REFRESH_INTERVAL_OPTIONS,
                 value: refreshInterval,
-                onChange: setRefreshInterval,
+                onChange: handleRefreshIntervalChange,
                 height: height
             })
         ]

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, RefreshIntervalPicker, 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 DEFAULT_TIME_RANGE_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\nexport const DEFAULT_REFRESH_INTERVAL_OPTIONS: TimeOption[] = [\n  { value: { pastDuration: '0s' }, display: 'Off' },\n  { value: { pastDuration: '5s' }, display: '5s' },\n  { value: { pastDuration: '10s' }, display: '10s' },\n  { value: { pastDuration: '15s' }, display: '15s' },\n  { value: { pastDuration: '30s' }, display: '30s' },\n  { value: { pastDuration: '60s' }, display: '1m' },\n];\n\nconst DEFAULT_HEIGHT = '34px';\n\ninterface TimeRangeControlsProps {\n  // The controls look best at heights >= 28 pixels\n  heightPx?: number;\n  showTimeRangeSelector?: boolean;\n  showRefreshButton?: boolean;\n  showRefreshInterval?: boolean;\n  timePresets?: TimeOption[];\n}\n\nexport function TimeRangeControls({\n  heightPx,\n  showTimeRangeSelector = true,\n  showRefreshButton = true,\n  showRefreshInterval = true,\n  timePresets = DEFAULT_TIME_RANGE_OPTIONS,\n}: TimeRangeControlsProps) {\n  const { timeRange, setTimeRange, refresh, refreshInterval, setRefreshInterval } = 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 (!timePresets.some((option) => option.value.pastDuration === dashboardDuration)) {\n    if (isDurationString(dashboardDuration)) {\n      timePresets.push({\n        value: { pastDuration: dashboardDuration },\n        display: `Last ${dashboardDuration}`,\n      });\n    }\n  }\n\n  return (\n    <Stack direction=\"row\" spacing={1}>\n      {showTimeRangeSelector && (\n        <DateTimeRangePicker timeOptions={timePresets} value={timeRange} onChange={setTimeRange} height={height} />\n      )}\n      {showRefreshButton && (\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      {showRefreshInterval && (\n        <RefreshIntervalPicker\n          timeOptions={DEFAULT_REFRESH_INTERVAL_OPTIONS}\n          value={refreshInterval}\n          onChange={setRefreshInterval}\n          height={height}\n        />\n      )}\n    </Stack>\n  );\n}\n"],"names":["RefreshIcon","Stack","DateTimeRangePicker","RefreshIntervalPicker","InfoTooltip","useTimeRange","isDurationString","TOOLTIP_TEXT","useDashboardDuration","ToolbarIconButton","DEFAULT_TIME_RANGE_OPTIONS","value","pastDuration","display","DEFAULT_REFRESH_INTERVAL_OPTIONS","DEFAULT_HEIGHT","TimeRangeControls","heightPx","showTimeRangeSelector","showRefreshButton","showRefreshInterval","timePresets","timeRange","setTimeRange","refresh","refreshInterval","setRefreshInterval","dashboardDuration","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, RefreshIntervalPicker, InfoTooltip, TimeOption } from '@perses-dev/components';\nimport { useTimeRange } from '@perses-dev/plugin-system';\nimport { isDurationString, DurationString } from '@perses-dev/core';\nimport { useCallback } from 'react';\nimport { TOOLTIP_TEXT } from '../../constants';\nimport { useDashboardDuration } from '../../context';\nimport { ToolbarIconButton } from '../ToolbarIconButton';\nimport { useDashboard } from '../../context/useDashboard';\n\nexport const DEFAULT_TIME_RANGE_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\nexport const DEFAULT_REFRESH_INTERVAL_OPTIONS: TimeOption[] = [\n  { value: { pastDuration: '0s' }, display: 'Off' },\n  { value: { pastDuration: '5s' }, display: '5s' },\n  { value: { pastDuration: '10s' }, display: '10s' },\n  { value: { pastDuration: '15s' }, display: '15s' },\n  { value: { pastDuration: '30s' }, display: '30s' },\n  { value: { pastDuration: '60s' }, display: '1m' },\n];\n\nconst DEFAULT_HEIGHT = '34px';\n\ninterface TimeRangeControlsProps {\n  // The controls look best at heights >= 28 pixels\n  heightPx?: number;\n  showTimeRangeSelector?: boolean;\n  showRefreshButton?: boolean;\n  showRefreshInterval?: boolean;\n  timePresets?: TimeOption[];\n}\n\nexport function TimeRangeControls({\n  heightPx,\n  showTimeRangeSelector = true,\n  showRefreshButton = true,\n  showRefreshInterval = true,\n  timePresets = DEFAULT_TIME_RANGE_OPTIONS,\n}: TimeRangeControlsProps) {\n  const { timeRange, setTimeRange, refresh, refreshInterval, setRefreshInterval } = useTimeRange();\n  // TODO: Remove this since it couples to the dashboard context\n  const dashboardDuration = useDashboardDuration();\n  const { dashboard, setDashboard } = useDashboard();\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 (!timePresets.some((option) => option.value.pastDuration === dashboardDuration)) {\n    if (isDurationString(dashboardDuration)) {\n      timePresets.push({\n        value: { pastDuration: dashboardDuration },\n        display: `Last ${dashboardDuration}`,\n      });\n    }\n  }\n\n  // set the new refresh interval both in the dashboard context & as query param\n  const handleRefreshIntervalChange = useCallback(\n    (duration: DurationString) => {\n      setDashboard({\n        ...dashboard,\n        spec: {\n          ...dashboard.spec,\n          refreshInterval: duration,\n        },\n      });\n      setRefreshInterval(duration);\n    },\n    [dashboard, setDashboard, setRefreshInterval]\n  );\n\n  return (\n    <Stack direction=\"row\" spacing={1}>\n      {showTimeRangeSelector && (\n        <DateTimeRangePicker timeOptions={timePresets} value={timeRange} onChange={setTimeRange} height={height} />\n      )}\n      {showRefreshButton && (\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      {showRefreshInterval && (\n        <RefreshIntervalPicker\n          timeOptions={DEFAULT_REFRESH_INTERVAL_OPTIONS}\n          value={refreshInterval}\n          onChange={handleRefreshIntervalChange}\n          height={height}\n        />\n      )}\n    </Stack>\n  );\n}\n"],"names":["RefreshIcon","Stack","DateTimeRangePicker","RefreshIntervalPicker","InfoTooltip","useTimeRange","isDurationString","useCallback","TOOLTIP_TEXT","useDashboardDuration","ToolbarIconButton","useDashboard","DEFAULT_TIME_RANGE_OPTIONS","value","pastDuration","display","DEFAULT_REFRESH_INTERVAL_OPTIONS","DEFAULT_HEIGHT","TimeRangeControls","heightPx","showTimeRangeSelector","showRefreshButton","showRefreshInterval","timePresets","timeRange","setTimeRange","refresh","refreshInterval","setRefreshInterval","dashboardDuration","dashboard","setDashboard","height","undefined","some","option","push","handleRefreshIntervalChange","duration","spec","direction","spacing","timeOptions","onChange","description","refreshDashboard","aria-label","onClick","sx"],"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,OAAOA,iBAAiB,0BAA0B;AAClD,SAASC,KAAK,QAAQ,gBAAgB;AACtC,SAASC,mBAAmB,EAAEC,qBAAqB,EAAEC,WAAW,QAAoB,yBAAyB;AAC7G,SAASC,YAAY,QAAQ,4BAA4B;AACzD,SAASC,gBAAgB,QAAwB,mBAAmB;AACpE,SAASC,WAAW,QAAQ,QAAQ;AACpC,SAASC,YAAY,QAAQ,kBAAkB;AAC/C,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,iBAAiB,QAAQ,uBAAuB;AACzD,SAASC,YAAY,QAAQ,6BAA6B;AAE1D,OAAO,MAAMC,6BAA2C;IACtD;QAAEC,OAAO;YAAEC,cAAc;QAAK;QAAGC,SAAS;IAAiB;IAC3D;QAAEF,OAAO;YAAEC,cAAc;QAAM;QAAGC,SAAS;IAAkB;IAC7D;QAAEF,OAAO;YAAEC,cAAc;QAAM;QAAGC,SAAS;IAAkB;IAC7D;QAAEF,OAAO;YAAEC,cAAc;QAAK;QAAGC,SAAS;IAAc;IACxD;QAAEF,OAAO;YAAEC,cAAc;QAAK;QAAGC,SAAS;IAAe;IACzD;QAAEF,OAAO;YAAEC,cAAc;QAAM;QAAGC,SAAS;IAAgB;IAC3D;QAAEF,OAAO;YAAEC,cAAc;QAAM;QAAGC,SAAS;IAAa;IACxD;QAAEF,OAAO;YAAEC,cAAc;QAAK;QAAGC,SAAS;IAAc;IACxD;QAAEF,OAAO;YAAEC,cAAc;QAAM;QAAGC,SAAS;IAAe;CAC3D,CAAC;AAEF,OAAO,MAAMC,mCAAiD;IAC5D;QAAEH,OAAO;YAAEC,cAAc;QAAK;QAAGC,SAAS;IAAM;IAChD;QAAEF,OAAO;YAAEC,cAAc;QAAK;QAAGC,SAAS;IAAK;IAC/C;QAAEF,OAAO;YAAEC,cAAc;QAAM;QAAGC,SAAS;IAAM;IACjD;QAAEF,OAAO;YAAEC,cAAc;QAAM;QAAGC,SAAS;IAAM;IACjD;QAAEF,OAAO;YAAEC,cAAc;QAAM;QAAGC,SAAS;IAAM;IACjD;QAAEF,OAAO;YAAEC,cAAc;QAAM;QAAGC,SAAS;IAAK;CACjD,CAAC;AAEF,MAAME,iBAAiB;AAWvB,OAAO,SAASC,kBAAkB,EAChCC,SAAQ,EACRC,uBAAwB,KAAI,EAC5BC,mBAAoB,KAAI,EACxBC,qBAAsB,KAAI,EAC1BC,aAAcX,2BAA0B,EACjB;IACvB,MAAM,EAAEY,UAAS,EAAEC,aAAY,EAAEC,QAAO,EAAEC,gBAAe,EAAEC,mBAAkB,EAAE,GAAGvB;IAClF,8DAA8D;IAC9D,MAAMwB,oBAAoBpB;IAC1B,MAAM,EAAEqB,UAAS,EAAEC,aAAY,EAAE,GAAGpB;IAEpC,8DAA8D;IAC9D,MAAMqB,SAASb,aAAac,YAAYhB,iBAAiB,CAAC,EAAEE,SAAS,EAAE,CAAC;IAExE,uEAAuE;IACvE,IAAI,CAACI,YAAYW,KAAK,CAACC,SAAWA,OAAOtB,MAAMC,iBAAiBe,oBAAoB;QAClF,IAAIvB,iBAAiBuB,oBAAoB;YACvCN,YAAYa,KAAK;gBACfvB,OAAO;oBAAEC,cAAce;gBAAkB;gBACzCd,SAAS,CAAC,KAAK,EAAEc,kBAAkB,CAAC;YACtC;QACF;IACF;IAEA,8EAA8E;IAC9E,MAAMQ,8BAA8B9B,YAClC,CAAC+B;QACCP,aAAa;YACX,GAAGD,SAAS;YACZS,MAAM;gBACJ,GAAGT,UAAUS,IAAI;gBACjBZ,iBAAiBW;YACnB;QACF;QACAV,mBAAmBU;IACrB,GACA;QAACR;QAAWC;QAAcH;KAAmB;IAG/C,qBACE,MAAC3B;QAAMuC,WAAU;QAAMC,SAAS;;YAC7BrB,uCACC,KAAClB;gBAAoBwC,aAAanB;gBAAaV,OAAOW;gBAAWmB,UAAUlB;gBAAcO,QAAQA;;YAElGX,mCACC,KAACjB;gBAAYwC,aAAapC,aAAaqC;0BACrC,cAAA,KAACnC;oBAAkBoC,cAAYtC,aAAaqC;oBAAkBE,SAASrB;oBAASsB,IAAI;wBAAEhB;oBAAO;8BAC3F,cAAA,KAAChC;;;YAINsB,qCACC,KAACnB;gBACCuC,aAAa1B;gBACbH,OAAOc;gBACPgB,UAAUN;gBACVL,QAAQA;;;;AAKlB"}

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/TimeRangeControls/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './TimeRangeControls';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,qBAAqB,CAAC"}
+{"version":3,"sources":["../../../src/components/TimeRangeControls/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './TimeRangeControls';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,sBAAsB"}

package/dist/components/ToolbarIconButton/ToolbarIconButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ToolbarIconButton/ToolbarIconButton.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 { ForwardedRef, forwardRef } from 'react';\nimport { Button, styled, ButtonProps } from '@mui/material';\n\ntype ToolbarIconButtonProps = ButtonProps;\n\nfunction IconButton(props: ToolbarIconButtonProps, ref: ForwardedRef<HTMLButtonElement>) {\n  return <StyledIconButton ref={ref} variant=\"outlined\" color=\"secondary\" {...props} />;\n}\n\nconst StyledIconButton = styled(Button)(({ theme }) => ({\n  // Using a button with some adjusted styles because it is easier to inherit\n  // styling and variants from themes than with an IconButton.\n  padding: theme.spacing(0.5),\n  minWidth: 'auto',\n}));\n\nexport const ToolbarIconButton = forwardRef(IconButton);\n"],"names":["forwardRef","Button","styled","IconButton","props","ref","StyledIconButton","variant","color","theme","padding","spacing","minWidth","ToolbarIconButton"],"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,SAAuBA,UAAU,QAAQ,OAAO,CAAC;AACjD,SAASC,MAAM,EAAEC,MAAM,QAAqB,eAAe,CAAC;AAI5D,SAASC,UAAU,CAACC,KAA6B,EAAEC,GAAoC,EAAE;IACvF,qBAAO,KAACC,gBAAgB;QAACD,GAAG,EAAEA,GAAG;QAAEE,OAAO,EAAC,UAAU;QAACC,KAAK,EAAC,WAAW;QAAE,GAAGJ,KAAK;MAAI,CAAC;AACxF,CAAC;AAED,MAAME,gBAAgB,GAAGJ,MAAM,CAACD,MAAM,CAAC,CAAC,CAAC,EAAEQ,KAAK,CAAA,EAAE,GAAM,CAAA;QACtD,2EAA2E;QAC3E,4DAA4D;QAC5DC,OAAO,EAAED,KAAK,CAACE,OAAO,CAAC,GAAG,CAAC;QAC3BC,QAAQ,EAAE,MAAM;KACjB,CAAA,AAAC,CAAC,AAAC;AAEJ,OAAO,MAAMC,iBAAiB,iBAAGb,UAAU,CAACG,UAAU,CAAC,CAAC"}
+{"version":3,"sources":["../../../src/components/ToolbarIconButton/ToolbarIconButton.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 { ForwardedRef, forwardRef } from 'react';\nimport { Button, styled, ButtonProps } from '@mui/material';\n\ntype ToolbarIconButtonProps = ButtonProps;\n\nfunction IconButton(props: ToolbarIconButtonProps, ref: ForwardedRef<HTMLButtonElement>) {\n  return <StyledIconButton ref={ref} variant=\"outlined\" color=\"secondary\" {...props} />;\n}\n\nconst StyledIconButton = styled(Button)(({ theme }) => ({\n  // Using a button with some adjusted styles because it is easier to inherit\n  // styling and variants from themes than with an IconButton.\n  padding: theme.spacing(0.5),\n  minWidth: 'auto',\n}));\n\nexport const ToolbarIconButton = forwardRef(IconButton);\n"],"names":["forwardRef","Button","styled","IconButton","props","ref","StyledIconButton","variant","color","theme","padding","spacing","minWidth","ToolbarIconButton"],"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,SAAuBA,UAAU,QAAQ,QAAQ;AACjD,SAASC,MAAM,EAAEC,MAAM,QAAqB,gBAAgB;AAI5D,SAASC,WAAWC,KAA6B,EAAEC,GAAoC;IACrF,qBAAO,KAACC;QAAiBD,KAAKA;QAAKE,SAAQ;QAAWC,OAAM;QAAa,GAAGJ,KAAK;;AACnF;AAEA,MAAME,mBAAmBJ,OAAOD,QAAQ,CAAC,EAAEQ,MAAK,EAAE,GAAM,CAAA;QACtD,2EAA2E;QAC3E,4DAA4D;QAC5DC,SAASD,MAAME,QAAQ;QACvBC,UAAU;IACZ,CAAA;AAEA,OAAO,MAAMC,kCAAoBb,WAAWG,YAAY"}

package/dist/components/ToolbarIconButton/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ToolbarIconButton/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './ToolbarIconButton';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,qBAAqB,CAAC"}
+{"version":3,"sources":["../../../src/components/ToolbarIconButton/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './ToolbarIconButton';\n"],"names":[],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,cAAc,sBAAsB"}

package/dist/components/Variables/BuiltinVariableAccordions.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { BuiltinVariableDefinition } from '@perses-dev/core';
+declare type BuiltinVariableAccordionsProps = {
+    builtinVariableDefinitions: BuiltinVariableDefinition[];
+};
+export declare function BuiltinVariableAccordions({ builtinVariableDefinitions }: BuiltinVariableAccordionsProps): JSX.Element;
+export {};
+//# sourceMappingURL=BuiltinVariableAccordions.d.ts.map

package/dist/components/Variables/BuiltinVariableAccordions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BuiltinVariableAccordions.d.ts","sourceRoot":"","sources":["../../../src/components/Variables/BuiltinVariableAccordions.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAE,yBAAyB,EAAE,MAAM,kBAAkB,CAAC;AAiB7D,aAAK,8BAA8B,GAAG;IACpC,0BAA0B,EAAE,yBAAyB,EAAE,CAAC;CACzD,CAAC;AAEF,wBAAgB,yBAAyB,CAAC,EAAE,0BAA0B,EAAE,EAAE,8BAA8B,eA0EvG"}