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

package/dist/components/Annotations/AnnotationsEditor.js

@@ -0,0 +1,289 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// Copyright The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// 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 { useState, useMemo } from 'react';
+import { Button, Stack, Box, TableContainer, TableBody, TableRow, TableCell as MuiTableCell, Table, TableHead, Switch, Typography, IconButton, Alert, styled } from '@mui/material';
+import AddIcon from 'mdi-material-ui/Plus';
+import { useImmer } from 'use-immer';
+import PencilIcon from 'mdi-material-ui/Pencil';
+import TrashIcon from 'mdi-material-ui/TrashCan';
+import ArrowUp from 'mdi-material-ui/ArrowUp';
+import ArrowDown from 'mdi-material-ui/ArrowDown';
+import { ValidationProvider, AnnotationEditorForm } from '@perses-dev/plugin-system';
+import { useDiscardChangesConfirmationDialog } from '../../context';
+function validateAnnotationSpecs(annotationSpecs) {
+    const errors = [];
+    const annotationNames = [];
+    for (const annotationSpec of annotationSpecs){
+        if (annotationNames.includes(annotationSpec.display.name)) {
+            errors.push(`Duplicate annotation name: ${annotationSpec.display.name}`);
+        } else {
+            annotationNames.push(annotationSpec.display.name);
+        }
+    }
+    return {
+        errors: errors,
+        isValid: errors.length === 0
+    };
+}
+export function AnnotationEditor(props) {
+    const [annotationSpecs, setAnnotationSpecs] = useImmer(props.annotationSpecs);
+    const [annotationEditIdx, setAnnotationEditIdx] = useState(null);
+    const [annotationFormAction, setAnnotationFormAction] = useState('update');
+    const validation = useMemo(()=>validateAnnotationSpecs(annotationSpecs), [
+        annotationSpecs
+    ]);
+    const currentEditingAnnotationSpec = annotationEditIdx !== null ? annotationSpecs[annotationEditIdx] : undefined;
+    const { openDiscardChangesConfirmationDialog, closeDiscardChangesConfirmationDialog } = useDiscardChangesConfirmationDialog();
+    const handleCancel = ()=>{
+        if (JSON.stringify(props.annotationSpecs) !== JSON.stringify(annotationSpecs)) {
+            openDiscardChangesConfirmationDialog({
+                onDiscardChanges: ()=>{
+                    closeDiscardChangesConfirmationDialog();
+                    props.onCancel();
+                },
+                onCancel: ()=>{
+                    closeDiscardChangesConfirmationDialog();
+                },
+                description: 'You have unapplied changes. Are you sure you want to discard these changes? Changes cannot be recovered.'
+            });
+        } else {
+            props.onCancel();
+        }
+    };
+    const removeAnnotation = (index)=>{
+        setAnnotationSpecs((draft)=>{
+            draft.splice(index, 1);
+        });
+    };
+    const addAnnotation = ()=>{
+        setAnnotationFormAction('create');
+        setAnnotationSpecs((draft)=>{
+            draft.push({
+                display: {
+                    name: 'NewAnnotation'
+                },
+                plugin: {}
+            });
+        });
+        setAnnotationEditIdx(annotationSpecs.length);
+    };
+    const editAnnotation = (index)=>{
+        setAnnotationFormAction('update');
+        setAnnotationEditIdx(index);
+    };
+    const toggleAnnotationVisibility = (index, visible)=>{
+        setAnnotationSpecs((draft)=>{
+            const v = draft[index];
+            if (!v) {
+                return;
+            }
+            v.display.hidden = !visible;
+        });
+    };
+    const changeAnnotationOrder = (index, direction)=>{
+        const step = direction === 'up' ? -1 : 1;
+        setAnnotationSpecs((draft)=>{
+            const current = draft[index];
+            const adjacent = draft[index + step];
+            if (!current || !adjacent) {
+                return;
+            }
+            draft[index + step] = current;
+            draft[index] = adjacent;
+        });
+    };
+    return /*#__PURE__*/ _jsx(_Fragment, {
+        children: annotationEditIdx !== null && currentEditingAnnotationSpec ? /*#__PURE__*/ _jsx(ValidationProvider, {
+            children: /*#__PURE__*/ _jsx(AnnotationEditorForm, {
+                initialAnnotationSpec: currentEditingAnnotationSpec,
+                action: annotationFormAction,
+                isDraft: true,
+                onActionChange: setAnnotationFormAction,
+                onSave: (definition)=>{
+                    setAnnotationSpecs((draft)=>{
+                        draft[annotationEditIdx] = definition;
+                        setAnnotationEditIdx(null);
+                    });
+                },
+                onClose: ()=>{
+                    if (annotationFormAction === 'create') {
+                        removeAnnotation(annotationEditIdx);
+                    }
+                    setAnnotationEditIdx(null);
+                }
+            })
+        }) : /*#__PURE__*/ _jsxs(_Fragment, {
+            children: [
+                /*#__PURE__*/ _jsxs(Box, {
+                    sx: {
+                        display: 'flex',
+                        alignItems: 'center',
+                        padding: (theme)=>theme.spacing(1, 2),
+                        borderBottom: (theme)=>`1px solid ${theme.palette.divider}`
+                    },
+                    children: [
+                        /*#__PURE__*/ _jsx(Typography, {
+                            variant: "h2",
+                            children: "Edit Dashboard Annotations"
+                        }),
+                        /*#__PURE__*/ _jsxs(Stack, {
+                            direction: "row",
+                            spacing: 1,
+                            marginLeft: "auto",
+                            children: [
+                                /*#__PURE__*/ _jsx(Button, {
+                                    disabled: props.annotationSpecs === annotationSpecs || !validation.isValid,
+                                    variant: "contained",
+                                    onClick: ()=>{
+                                        props.onChange(annotationSpecs);
+                                    },
+                                    children: "Apply"
+                                }),
+                                /*#__PURE__*/ _jsx(Button, {
+                                    color: "secondary",
+                                    variant: "outlined",
+                                    onClick: handleCancel,
+                                    children: "Cancel"
+                                })
+                            ]
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ _jsx(Box, {
+                    padding: 2,
+                    sx: {
+                        overflowY: 'scroll'
+                    },
+                    children: /*#__PURE__*/ _jsx(Stack, {
+                        spacing: 2,
+                        children: /*#__PURE__*/ _jsxs(Stack, {
+                            spacing: 2,
+                            children: [
+                                !validation.isValid && validation.errors.map((error)=>/*#__PURE__*/ _jsx(Alert, {
+                                        severity: "error",
+                                        children: error
+                                    }, error)),
+                                /*#__PURE__*/ _jsx(TableContainer, {
+                                    children: /*#__PURE__*/ _jsxs(Table, {
+                                        sx: {
+                                            minWidth: 650
+                                        },
+                                        "aria-label": "table of annotations",
+                                        children: [
+                                            /*#__PURE__*/ _jsx(TableHead, {
+                                                children: /*#__PURE__*/ _jsxs(TableRow, {
+                                                    children: [
+                                                        /*#__PURE__*/ _jsx(TableCell, {
+                                                            children: "Visibility"
+                                                        }),
+                                                        /*#__PURE__*/ _jsx(TableCell, {
+                                                            children: "Name"
+                                                        }),
+                                                        /*#__PURE__*/ _jsx(TableCell, {
+                                                            children: "Type"
+                                                        }),
+                                                        /*#__PURE__*/ _jsx(TableCell, {
+                                                            children: "Description"
+                                                        }),
+                                                        /*#__PURE__*/ _jsx(TableCell, {
+                                                            align: "right",
+                                                            children: "Actions"
+                                                        })
+                                                    ]
+                                                })
+                                            }),
+                                            /*#__PURE__*/ _jsx(TableBody, {
+                                                children: annotationSpecs.map((v, idx)=>/*#__PURE__*/ _jsxs(TableRow, {
+                                                        children: [
+                                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                                component: "th",
+                                                                scope: "row",
+                                                                children: /*#__PURE__*/ _jsx(Switch, {
+                                                                    checked: v.display?.hidden !== true,
+                                                                    onChange: (e)=>{
+                                                                        toggleAnnotationVisibility(idx, e.target.checked);
+                                                                    }
+                                                                })
+                                                            }),
+                                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                                component: "th",
+                                                                scope: "row",
+                                                                sx: {
+                                                                    fontWeight: 'bold'
+                                                                },
+                                                                children: v.display.name
+                                                            }),
+                                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                                children: v.plugin.kind
+                                                            }),
+                                                            /*#__PURE__*/ _jsx(TableCell, {
+                                                                children: v.display?.description ?? ''
+                                                            }),
+                                                            /*#__PURE__*/ _jsxs(TableCell, {
+                                                                align: "right",
+                                                                sx: {
+                                                                    whiteSpace: 'nowrap'
+                                                                },
+                                                                children: [
+                                                                    /*#__PURE__*/ _jsx(IconButton, {
+                                                                        onClick: ()=>changeAnnotationOrder(idx, 'up'),
+                                                                        disabled: idx === 0,
+                                                                        children: /*#__PURE__*/ _jsx(ArrowUp, {})
+                                                                    }),
+                                                                    /*#__PURE__*/ _jsx(IconButton, {
+                                                                        onClick: ()=>changeAnnotationOrder(idx, 'down'),
+                                                                        disabled: idx === annotationSpecs.length - 1,
+                                                                        children: /*#__PURE__*/ _jsx(ArrowDown, {})
+                                                                    }),
+                                                                    /*#__PURE__*/ _jsx(IconButton, {
+                                                                        onClick: ()=>editAnnotation(idx),
+                                                                        children: /*#__PURE__*/ _jsx(PencilIcon, {})
+                                                                    }),
+                                                                    /*#__PURE__*/ _jsx(IconButton, {
+                                                                        onClick: ()=>removeAnnotation(idx),
+                                                                        children: /*#__PURE__*/ _jsx(TrashIcon, {})
+                                                                    })
+                                                                ]
+                                                            })
+                                                        ]
+                                                    }, v.display.name))
+                                            })
+                                        ]
+                                    })
+                                }),
+                                /*#__PURE__*/ _jsx(Box, {
+                                    display: "flex",
+                                    children: /*#__PURE__*/ _jsx(Button, {
+                                        variant: "contained",
+                                        startIcon: /*#__PURE__*/ _jsx(AddIcon, {}),
+                                        sx: {
+                                            marginLeft: 'auto'
+                                        },
+                                        onClick: addAnnotation,
+                                        children: "Add Annotation"
+                                    })
+                                })
+                            ]
+                        })
+                    })
+                })
+            ]
+        })
+    });
+}
+const TableCell = styled(MuiTableCell)(({ theme })=>({
+        borderBottom: `solid 1px ${theme.palette.divider}`
+    }));
+
+//# sourceMappingURL=AnnotationsEditor.js.map

package/dist/components/Annotations/AnnotationsEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Annotations/AnnotationsEditor.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { useState, useMemo, ReactElement } from 'react';\nimport {\n  Button,\n  Stack,\n  Box,\n  TableContainer,\n  TableBody,\n  TableRow,\n  TableCell as MuiTableCell,\n  Table,\n  TableHead,\n  Switch,\n  Typography,\n  IconButton,\n  Alert,\n  styled,\n} from '@mui/material';\nimport AddIcon from 'mdi-material-ui/Plus';\nimport { AnnotationSpec, Definition, UnknownSpec } from '@perses-dev/spec';\nimport { useImmer } from 'use-immer';\nimport PencilIcon from 'mdi-material-ui/Pencil';\nimport TrashIcon from 'mdi-material-ui/TrashCan';\nimport ArrowUp from 'mdi-material-ui/ArrowUp';\nimport ArrowDown from 'mdi-material-ui/ArrowDown';\n\nimport { ValidationProvider, AnnotationEditorForm } from '@perses-dev/plugin-system';\nimport { Action } from '@perses-dev/client';\nimport { useDiscardChangesConfirmationDialog } from '../../context';\n\nfunction validateAnnotationSpecs(annotationSpecs: AnnotationSpec[]): { isValid: boolean; errors: string[] } {\n  const errors: string[] = [];\n\n  const annotationNames: string[] = [];\n\n  for (const annotationSpec of annotationSpecs) {\n    if (annotationNames.includes(annotationSpec.display.name)) {\n      errors.push(`Duplicate annotation name: ${annotationSpec.display.name}`);\n    } else {\n      annotationNames.push(annotationSpec.display.name);\n    }\n  }\n\n  return {\n    errors: errors,\n    isValid: errors.length === 0,\n  };\n}\n\nexport function AnnotationEditor(props: {\n  annotationSpecs: AnnotationSpec[];\n  onChange: (annotationSpecs: AnnotationSpec[]) => void;\n  onCancel: () => void;\n}): ReactElement {\n  const [annotationSpecs, setAnnotationSpecs] = useImmer(props.annotationSpecs);\n  const [annotationEditIdx, setAnnotationEditIdx] = useState<number | null>(null);\n  const [annotationFormAction, setAnnotationFormAction] = useState<Action>('update');\n\n  const validation = useMemo(() => validateAnnotationSpecs(annotationSpecs), [annotationSpecs]);\n  const currentEditingAnnotationSpec: AnnotationSpec | undefined =\n    annotationEditIdx !== null ? annotationSpecs[annotationEditIdx] : undefined;\n\n  const { openDiscardChangesConfirmationDialog, closeDiscardChangesConfirmationDialog } =\n    useDiscardChangesConfirmationDialog();\n  const handleCancel = (): void => {\n    if (JSON.stringify(props.annotationSpecs) !== JSON.stringify(annotationSpecs)) {\n      openDiscardChangesConfirmationDialog({\n        onDiscardChanges: () => {\n          closeDiscardChangesConfirmationDialog();\n          props.onCancel();\n        },\n        onCancel: () => {\n          closeDiscardChangesConfirmationDialog();\n        },\n        description:\n          'You have unapplied changes. Are you sure you want to discard these changes? Changes cannot be recovered.',\n      });\n    } else {\n      props.onCancel();\n    }\n  };\n\n  const removeAnnotation = (index: number): void => {\n    setAnnotationSpecs((draft) => {\n      draft.splice(index, 1);\n    });\n  };\n\n  const addAnnotation = (): void => {\n    setAnnotationFormAction('create');\n    setAnnotationSpecs((draft) => {\n      draft.push({\n        display: { name: 'NewAnnotation' },\n        plugin: {} as Definition<UnknownSpec>,\n      });\n    });\n    setAnnotationEditIdx(annotationSpecs.length);\n  };\n\n  const editAnnotation = (index: number): void => {\n    setAnnotationFormAction('update');\n    setAnnotationEditIdx(index);\n  };\n\n  const toggleAnnotationVisibility = (index: number, visible: boolean): void => {\n    setAnnotationSpecs((draft) => {\n      const v = draft[index];\n      if (!v) {\n        return;\n      }\n      v.display.hidden = !visible;\n    });\n  };\n\n  const changeAnnotationOrder = (index: number, direction: 'up' | 'down'): void => {\n    const step = direction === 'up' ? -1 : 1;\n\n    setAnnotationSpecs((draft) => {\n      const current = draft[index];\n      const adjacent = draft[index + step];\n\n      if (!current || !adjacent) {\n        return;\n      }\n\n      draft[index + step] = current;\n      draft[index] = adjacent;\n    });\n  };\n\n  return (\n    <>\n      {annotationEditIdx !== null && currentEditingAnnotationSpec ? (\n        <ValidationProvider>\n          <AnnotationEditorForm\n            initialAnnotationSpec={currentEditingAnnotationSpec}\n            action={annotationFormAction}\n            isDraft={true}\n            onActionChange={setAnnotationFormAction}\n            onSave={(definition: AnnotationSpec) => {\n              setAnnotationSpecs((draft) => {\n                draft[annotationEditIdx] = definition;\n                setAnnotationEditIdx(null);\n              });\n            }}\n            onClose={() => {\n              if (annotationFormAction === 'create') {\n                removeAnnotation(annotationEditIdx);\n              }\n              setAnnotationEditIdx(null);\n            }}\n          />\n        </ValidationProvider>\n      ) : (\n        <>\n          <Box\n            sx={{\n              display: 'flex',\n              alignItems: 'center',\n              padding: (theme) => theme.spacing(1, 2),\n              borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n            }}\n          >\n            <Typography variant=\"h2\">Edit Dashboard Annotations</Typography>\n            <Stack direction=\"row\" spacing={1} marginLeft=\"auto\">\n              <Button\n                disabled={props.annotationSpecs === annotationSpecs || !validation.isValid}\n                variant=\"contained\"\n                onClick={() => {\n                  props.onChange(annotationSpecs);\n                }}\n              >\n                Apply\n              </Button>\n              <Button color=\"secondary\" variant=\"outlined\" onClick={handleCancel}>\n                Cancel\n              </Button>\n            </Stack>\n          </Box>\n          <Box padding={2} sx={{ overflowY: 'scroll' }}>\n            <Stack spacing={2}>\n              <Stack spacing={2}>\n                {!validation.isValid &&\n                  validation.errors.map((error) => (\n                    <Alert severity=\"error\" key={error}>\n                      {error}\n                    </Alert>\n                  ))}\n                <TableContainer>\n                  <Table sx={{ minWidth: 650 }} aria-label=\"table of annotations\">\n                    <TableHead>\n                      <TableRow>\n                        <TableCell>Visibility</TableCell>\n                        <TableCell>Name</TableCell>\n                        <TableCell>Type</TableCell>\n                        <TableCell>Description</TableCell>\n                        <TableCell align=\"right\">Actions</TableCell>\n                      </TableRow>\n                    </TableHead>\n                    <TableBody>\n                      {annotationSpecs.map((v, idx) => (\n                        <TableRow key={v.display.name}>\n                          <TableCell component=\"th\" scope=\"row\">\n                            <Switch\n                              checked={v.display?.hidden !== true}\n                              onChange={(e) => {\n                                toggleAnnotationVisibility(idx, e.target.checked);\n                              }}\n                            />\n                          </TableCell>\n                          <TableCell component=\"th\" scope=\"row\" sx={{ fontWeight: 'bold' }}>\n                            {v.display.name}\n                          </TableCell>\n                          <TableCell>{v.plugin.kind}</TableCell>\n                          <TableCell>{v.display?.description ?? ''}</TableCell>\n                          <TableCell align=\"right\" sx={{ whiteSpace: 'nowrap' }}>\n                            <IconButton onClick={() => changeAnnotationOrder(idx, 'up')} disabled={idx === 0}>\n                              <ArrowUp />\n                            </IconButton>\n                            <IconButton\n                              onClick={() => changeAnnotationOrder(idx, 'down')}\n                              disabled={idx === annotationSpecs.length - 1}\n                            >\n                              <ArrowDown />\n                            </IconButton>\n                            <IconButton onClick={() => editAnnotation(idx)}>\n                              <PencilIcon />\n                            </IconButton>\n                            <IconButton onClick={() => removeAnnotation(idx)}>\n                              <TrashIcon />\n                            </IconButton>\n                          </TableCell>\n                        </TableRow>\n                      ))}\n                    </TableBody>\n                  </Table>\n                </TableContainer>\n                <Box display=\"flex\">\n                  <Button\n                    variant=\"contained\"\n                    startIcon={<AddIcon />}\n                    sx={{ marginLeft: 'auto' }}\n                    onClick={addAnnotation}\n                  >\n                    Add Annotation\n                  </Button>\n                </Box>\n              </Stack>\n            </Stack>\n          </Box>\n        </>\n      )}\n    </>\n  );\n}\n\nconst TableCell = styled(MuiTableCell)(({ theme }) => ({\n  borderBottom: `solid 1px ${theme.palette.divider}`,\n}));\n"],"names":["useState","useMemo","Button","Stack","Box","TableContainer","TableBody","TableRow","TableCell","MuiTableCell","Table","TableHead","Switch","Typography","IconButton","Alert","styled","AddIcon","useImmer","PencilIcon","TrashIcon","ArrowUp","ArrowDown","ValidationProvider","AnnotationEditorForm","useDiscardChangesConfirmationDialog","validateAnnotationSpecs","annotationSpecs","errors","annotationNames","annotationSpec","includes","display","name","push","isValid","length","AnnotationEditor","props","setAnnotationSpecs","annotationEditIdx","setAnnotationEditIdx","annotationFormAction","setAnnotationFormAction","validation","currentEditingAnnotationSpec","undefined","openDiscardChangesConfirmationDialog","closeDiscardChangesConfirmationDialog","handleCancel","JSON","stringify","onDiscardChanges","onCancel","description","removeAnnotation","index","draft","splice","addAnnotation","plugin","editAnnotation","toggleAnnotationVisibility","visible","v","hidden","changeAnnotationOrder","direction","step","current","adjacent","initialAnnotationSpec","action","isDraft","onActionChange","onSave","definition","onClose","sx","alignItems","padding","theme","spacing","borderBottom","palette","divider","variant","marginLeft","disabled","onClick","onChange","color","overflowY","map","error","severity","minWidth","aria-label","align","idx","component","scope","checked","e","target","fontWeight","kind","whiteSpace","startIcon"],"mappings":"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"}

package/dist/components/Annotations/EditAnnotationsButton.d.ts

@@ -0,0 +1,18 @@
+import { ReactElement } from 'react';
+import { ButtonProps } from '@mui/material';
+export interface EditAnnotationsButtonProps extends Pick<ButtonProps, 'fullWidth'> {
+    /**
+     * The variant to use to display the button.
+     */
+    variant?: 'text' | 'outlined';
+    /**
+     * The color to use to display the button.
+     */
+    color?: 'primary' | 'secondary';
+    /**
+     * The label used inside the button.
+     */
+    label?: string;
+}
+export declare function EditAnnotationsButton({ variant, label, color, fullWidth, }: EditAnnotationsButtonProps): ReactElement;
+//# sourceMappingURL=EditAnnotationsButton.d.ts.map

package/dist/components/Annotations/EditAnnotationsButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditAnnotationsButton.d.ts","sourceRoot":"","sources":["../../../src/components/Annotations/EditAnnotationsButton.tsx"],"names":[],"mappings":"AAaA,OAAO,EAAE,YAAY,EAAY,MAAM,OAAO,CAAC;AAC/C,OAAO,EAAU,WAAW,EAAE,MAAM,eAAe,CAAC;AAQpD,MAAM,WAAW,0BAA2B,SAAQ,IAAI,CAAC,WAAW,EAAE,WAAW,CAAC;IAChF;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAE9B;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,GAAG,WAAW,CAAC;IAEhC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,qBAAqB,CAAC,EACpC,OAAgB,EAChB,KAAqB,EACrB,KAAiB,EACjB,SAAS,GACV,EAAE,0BAA0B,GAAG,YAAY,CA6C3C"}

package/dist/components/Annotations/EditAnnotationsButton.js

@@ -0,0 +1,70 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+// Copyright The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// 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 { useState } from 'react';
+import { Button } from '@mui/material';
+import PencilIcon from 'mdi-material-ui/PencilOutline';
+import { Drawer, InfoTooltip } from '@perses-dev/components';
+import { TOOLTIP_TEXT, editButtonStyle } from '../../constants';
+import { useAnnotationActions, useAnnotationSpecs } from '../../context';
+import { AnnotationEditor } from './AnnotationsEditor';
+export function EditAnnotationsButton({ variant = 'text', label = 'Annotations', color = 'primary', fullWidth }) {
+    const [isAnnotationEditorOpen, setIsAnnotationEditorOpen] = useState(false);
+    const annotationSpecs = useAnnotationSpecs();
+    const { setAnnotationSpecs } = useAnnotationActions();
+    const openAnnotationEditor = ()=>{
+        setIsAnnotationEditorOpen(true);
+    };
+    const closeAnnotationEditor = ()=>{
+        setIsAnnotationEditorOpen(false);
+    };
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx(InfoTooltip, {
+                description: TOOLTIP_TEXT.editAnnotations,
+                children: /*#__PURE__*/ _jsx(Button, {
+                    startIcon: /*#__PURE__*/ _jsx(PencilIcon, {}),
+                    onClick: openAnnotationEditor,
+                    "aria-label": TOOLTIP_TEXT.editAnnotations,
+                    variant: variant,
+                    color: color,
+                    fullWidth: fullWidth,
+                    sx: editButtonStyle,
+                    children: label
+                })
+            }),
+            /*#__PURE__*/ _jsx(Drawer, {
+                isOpen: isAnnotationEditorOpen,
+                onClose: closeAnnotationEditor,
+                slotProps: {
+                    paper: {
+                        sx: {
+                            width: '50%'
+                        }
+                    }
+                },
+                "data-testid": "annotation-editor",
+                children: /*#__PURE__*/ _jsx(AnnotationEditor, {
+                    annotationSpecs: annotationSpecs,
+                    onCancel: closeAnnotationEditor,
+                    onChange: (annotations)=>{
+                        setAnnotationSpecs(annotations);
+                        setIsAnnotationEditorOpen(false);
+                    }
+                })
+            })
+        ]
+    });
+}
+
+//# sourceMappingURL=EditAnnotationsButton.js.map

package/dist/components/Annotations/EditAnnotationsButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Annotations/EditAnnotationsButton.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { ReactElement, useState } from 'react';\nimport { Button, ButtonProps } from '@mui/material';\nimport PencilIcon from 'mdi-material-ui/PencilOutline';\nimport { Drawer, InfoTooltip } from '@perses-dev/components';\nimport { AnnotationSpec } from '@perses-dev/spec';\nimport { TOOLTIP_TEXT, editButtonStyle } from '../../constants';\nimport { useAnnotationActions, useAnnotationSpecs } from '../../context';\nimport { AnnotationEditor } from './AnnotationsEditor';\n\nexport interface EditAnnotationsButtonProps extends Pick<ButtonProps, 'fullWidth'> {\n  /**\n   * The variant to use to display the button.\n   */\n  variant?: 'text' | 'outlined';\n\n  /**\n   * The color to use to display the button.\n   */\n  color?: 'primary' | 'secondary';\n\n  /**\n   * The label used inside the button.\n   */\n  label?: string;\n}\n\nexport function EditAnnotationsButton({\n  variant = 'text',\n  label = 'Annotations',\n  color = 'primary',\n  fullWidth,\n}: EditAnnotationsButtonProps): ReactElement {\n  const [isAnnotationEditorOpen, setIsAnnotationEditorOpen] = useState(false);\n  const annotationSpecs: AnnotationSpec[] = useAnnotationSpecs();\n  const { setAnnotationSpecs } = useAnnotationActions();\n\n  const openAnnotationEditor = (): void => {\n    setIsAnnotationEditorOpen(true);\n  };\n\n  const closeAnnotationEditor = (): void => {\n    setIsAnnotationEditorOpen(false);\n  };\n\n  return (\n    <>\n      <InfoTooltip description={TOOLTIP_TEXT.editAnnotations}>\n        <Button\n          startIcon={<PencilIcon />}\n          onClick={openAnnotationEditor}\n          aria-label={TOOLTIP_TEXT.editAnnotations}\n          variant={variant}\n          color={color}\n          fullWidth={fullWidth}\n          sx={editButtonStyle}\n        >\n          {label}\n        </Button>\n      </InfoTooltip>\n      <Drawer\n        isOpen={isAnnotationEditorOpen}\n        onClose={closeAnnotationEditor}\n        slotProps={{ paper: { sx: { width: '50%' } } }}\n        data-testid=\"annotation-editor\"\n      >\n        <AnnotationEditor\n          annotationSpecs={annotationSpecs}\n          onCancel={closeAnnotationEditor}\n          onChange={(annotations: AnnotationSpec[]) => {\n            setAnnotationSpecs(annotations);\n            setIsAnnotationEditorOpen(false);\n          }}\n        />\n      </Drawer>\n    </>\n  );\n}\n"],"names":["useState","Button","PencilIcon","Drawer","InfoTooltip","TOOLTIP_TEXT","editButtonStyle","useAnnotationActions","useAnnotationSpecs","AnnotationEditor","EditAnnotationsButton","variant","label","color","fullWidth","isAnnotationEditorOpen","setIsAnnotationEditorOpen","annotationSpecs","setAnnotationSpecs","openAnnotationEditor","closeAnnotationEditor","description","editAnnotations","startIcon","onClick","aria-label","sx","isOpen","onClose","slotProps","paper","width","data-testid","onCancel","onChange","annotations"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAAuBA,QAAQ,QAAQ,QAAQ;AAC/C,SAASC,MAAM,QAAqB,gBAAgB;AACpD,OAAOC,gBAAgB,gCAAgC;AACvD,SAASC,MAAM,EAAEC,WAAW,QAAQ,yBAAyB;AAE7D,SAASC,YAAY,EAAEC,eAAe,QAAQ,kBAAkB;AAChE,SAASC,oBAAoB,EAAEC,kBAAkB,QAAQ,gBAAgB;AACzE,SAASC,gBAAgB,QAAQ,sBAAsB;AAmBvD,OAAO,SAASC,sBAAsB,EACpCC,UAAU,MAAM,EAChBC,QAAQ,aAAa,EACrBC,QAAQ,SAAS,EACjBC,SAAS,EACkB;IAC3B,MAAM,CAACC,wBAAwBC,0BAA0B,GAAGhB,SAAS;IACrE,MAAMiB,kBAAoCT;IAC1C,MAAM,EAAEU,kBAAkB,EAAE,GAAGX;IAE/B,MAAMY,uBAAuB;QAC3BH,0BAA0B;IAC5B;IAEA,MAAMI,wBAAwB;QAC5BJ,0BAA0B;IAC5B;IAEA,qBACE;;0BACE,KAACZ;gBAAYiB,aAAahB,aAAaiB,eAAe;0BACpD,cAAA,KAACrB;oBACCsB,yBAAW,KAACrB;oBACZsB,SAASL;oBACTM,cAAYpB,aAAaiB,eAAe;oBACxCX,SAASA;oBACTE,OAAOA;oBACPC,WAAWA;oBACXY,IAAIpB;8BAEHM;;;0BAGL,KAACT;gBACCwB,QAAQZ;gBACRa,SAASR;gBACTS,WAAW;oBAAEC,OAAO;wBAAEJ,IAAI;4BAAEK,OAAO;wBAAM;oBAAE;gBAAE;gBAC7CC,eAAY;0BAEZ,cAAA,KAACvB;oBACCQ,iBAAiBA;oBACjBgB,UAAUb;oBACVc,UAAU,CAACC;wBACTjB,mBAAmBiB;wBACnBnB,0BAA0B;oBAC5B;;;;;AAKV"}

package/dist/components/Dashboard/Dashboard.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Copyright The Perses Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
 // you may not use this file except in compliance with the License.
@@ -10,7 +11,6 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Box } from '@mui/material';
 import { ErrorBoundary, ErrorAlert } from '@perses-dev/components';
 import { useRef } from 'react';

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

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

package/dist/components/DashboardLinks/DashboardLinksEditor.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 // Copyright The Perses Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
 // you may not use this file except in compliance with the License.
@@ -10,7 +11,6 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from 'react';
 import { Button, Stack, Box, Typography, IconButton, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Collapse } from '@mui/material';
 import AddIcon from 'mdi-material-ui/Plus';

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/DashboardLinks/DashboardLinksEditor.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { useState, ReactElement } from 'react';\nimport {\n  Button,\n  Stack,\n  Box,\n  Typography,\n  IconButton,\n  Table,\n  TableBody,\n  TableCell,\n  TableContainer,\n  TableHead,\n  TableRow,\n  Collapse,\n} from '@mui/material';\nimport AddIcon from 'mdi-material-ui/Plus';\nimport TrashIcon from 'mdi-material-ui/TrashCan';\nimport ArrowUp from 'mdi-material-ui/ArrowUp';\nimport ArrowDown from 'mdi-material-ui/ArrowDown';\nimport PencilIcon from 'mdi-material-ui/Pencil';\nimport ChevronUp from 'mdi-material-ui/ChevronUp';\nimport { Link } from '@perses-dev/spec';\nimport { useImmer } from 'use-immer';\nimport { InfoTooltip, LinkEditorForm } from '@perses-dev/components';\nimport { useDiscardChangesConfirmationDialog } from '../../context';\n\nexport interface DashboardLinksEditorProps {\n  links: Link[];\n  onChange: (links: Link[]) => void;\n  onCancel: () => void;\n}\n\nconst DEFAULT_LINK: Link = {\n  url: '',\n  name: '',\n  tooltip: '',\n  renderVariables: true,\n  targetBlank: true,\n};\n\nexport function DashboardLinksEditor({\n  links: initialLinks,\n  onChange,\n  onCancel,\n}: DashboardLinksEditorProps): ReactElement {\n  const [links, setLinks] = useImmer(initialLinks);\n  const [expandedIndex, setExpandedIndex] = useState<number | null>(null);\n\n  const { openDiscardChangesConfirmationDialog, closeDiscardChangesConfirmationDialog } =\n    useDiscardChangesConfirmationDialog();\n\n  const handleCancel = (): void => {\n    if (JSON.stringify(initialLinks) !== JSON.stringify(links)) {\n      openDiscardChangesConfirmationDialog({\n        onDiscardChanges: () => {\n          closeDiscardChangesConfirmationDialog();\n          onCancel();\n        },\n        onCancel: closeDiscardChangesConfirmationDialog,\n      });\n    } else {\n      onCancel();\n    }\n  };\n\n  const handleAdd = (): void => {\n    setLinks((draft) => {\n      draft.push({ ...DEFAULT_LINK });\n    });\n    setExpandedIndex(links.length);\n  };\n\n  const handleRemove = (index: number): void => {\n    setLinks((draft) => {\n      draft.splice(index, 1);\n    });\n    if (expandedIndex === index) {\n      setExpandedIndex(null);\n    } else if (expandedIndex !== null && expandedIndex > index) {\n      setExpandedIndex(expandedIndex - 1);\n    }\n  };\n\n  const handleMoveUp = (index: number): void => {\n    if (index === 0) return;\n    setLinks((draft) => {\n      const temp = draft[index - 1];\n      if (temp && draft[index]) {\n        draft[index - 1] = draft[index]!;\n        draft[index] = temp;\n      }\n    });\n    if (expandedIndex === index) {\n      setExpandedIndex(index - 1);\n    } else if (expandedIndex === index - 1) {\n      setExpandedIndex(index);\n    }\n  };\n\n  const handleMoveDown = (index: number): void => {\n    if (index >= links.length - 1) return;\n    setLinks((draft) => {\n      const temp = draft[index + 1];\n      if (temp && draft[index]) {\n        draft[index + 1] = draft[index]!;\n        draft[index] = temp;\n      }\n    });\n    if (expandedIndex === index) {\n      setExpandedIndex(index + 1);\n    } else if (expandedIndex === index + 1) {\n      setExpandedIndex(index);\n    }\n  };\n\n  const handleUpdateLink = (index: number, link: Link): void => {\n    setLinks((draft) => {\n      draft[index] = link;\n    });\n  };\n\n  const isValid = links.every((link) => link.url.trim().length > 0);\n\n  return (\n    <>\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          padding: (theme) => theme.spacing(1, 2),\n          borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n        }}\n      >\n        <Typography variant=\"h2\">Edit Dashboard Links</Typography>\n        <Stack direction=\"row\" spacing={1} marginLeft=\"auto\">\n          <Button disabled={!isValid} variant=\"contained\" onClick={() => onChange(links)}>\n            Apply\n          </Button>\n          <Button color=\"secondary\" variant=\"outlined\" onClick={handleCancel}>\n            Cancel\n          </Button>\n        </Stack>\n      </Box>\n      <Box padding={2} sx={{ overflowY: 'scroll' }}>\n        <Stack spacing={2}>\n          <TableContainer>\n            <Table size=\"small\" sx={{ tableLayout: 'fixed', width: '100%' }} aria-label=\"table of dashboard links\">\n              <TableHead>\n                <TableRow>\n                  <TableCell>Name</TableCell>\n                  <TableCell>URL</TableCell>\n                  <TableCell width={80}>New Tab</TableCell>\n                  <TableCell align=\"right\" width={180}>\n                    Actions\n                  </TableCell>\n                </TableRow>\n              </TableHead>\n              <TableBody>\n                {links.map((link, index) => (\n                  <LinkTableRow\n                    key={index}\n                    link={link}\n                    index={index}\n                    isFirst={index === 0}\n                    isLast={index === links.length - 1}\n                    isExpanded={expandedIndex === index}\n                    onToggleExpand={() => setExpandedIndex(expandedIndex === index ? null : index)}\n                    onUpdate={(updatedLink) => handleUpdateLink(index, updatedLink)}\n                    onRemove={() => handleRemove(index)}\n                    onMoveUp={() => handleMoveUp(index)}\n                    onMoveDown={() => handleMoveDown(index)}\n                  />\n                ))}\n              </TableBody>\n            </Table>\n          </TableContainer>\n          {links.length === 0 && (\n            <Typography variant=\"body1\" color=\"text.secondary\" fontStyle=\"italic\" textAlign=\"center\" py={4}>\n              No links defined. Click &apos;Add Link&apos; to create one.\n            </Typography>\n          )}\n          <Button variant=\"contained\" startIcon={<AddIcon />} onClick={handleAdd} sx={{ alignSelf: 'flex-start' }}>\n            Add Link\n          </Button>\n        </Stack>\n      </Box>\n    </>\n  );\n}\n\ninterface LinkTableRowProps {\n  link: Link;\n  index: number;\n  isFirst: boolean;\n  isLast: boolean;\n  isExpanded: boolean;\n  onToggleExpand: () => void;\n  onUpdate: (link: Link) => void;\n  onRemove: () => void;\n  onMoveUp: () => void;\n  onMoveDown: () => void;\n}\n\nfunction LinkTableRow({\n  link,\n  index,\n  isFirst,\n  isLast,\n  isExpanded,\n  onToggleExpand,\n  onUpdate,\n  onRemove,\n  onMoveUp,\n  onMoveDown,\n}: LinkTableRowProps): ReactElement {\n  const displayName = link.name?.trim() || `Link ${index + 1}`;\n  const hasError = link.url.trim().length === 0;\n\n  return (\n    <>\n      <TableRow>\n        <TableCell component=\"th\" scope=\"row\" sx={{ fontWeight: 'bold', overflow: 'hidden', textOverflow: 'ellipsis' }}>\n          {displayName}\n        </TableCell>\n        <TableCell\n          sx={{\n            overflow: 'hidden',\n            textOverflow: 'ellipsis',\n            whiteSpace: 'nowrap',\n            color: hasError ? 'error.main' : undefined,\n          }}\n        >\n          <InfoTooltip description={link.url} enterDelay={100}>\n            {link.url || '(no URL)'}\n          </InfoTooltip>\n        </TableCell>\n        <TableCell>{link.targetBlank ? 'Yes' : 'No'}</TableCell>\n        <TableCell align=\"right\" sx={{ whiteSpace: 'nowrap' }}>\n          <IconButton onClick={onMoveUp} disabled={isFirst} aria-label=\"Move link up\">\n            <ArrowUp />\n          </IconButton>\n          <IconButton onClick={onMoveDown} disabled={isLast} aria-label=\"Move link down\">\n            <ArrowDown />\n          </IconButton>\n          <IconButton onClick={onToggleExpand} aria-label={isExpanded ? 'Collapse link editor' : 'Edit link'}>\n            {isExpanded ? <ChevronUp /> : <PencilIcon />}\n          </IconButton>\n          <IconButton onClick={onRemove} aria-label=\"Remove link\">\n            <TrashIcon />\n          </IconButton>\n        </TableCell>\n      </TableRow>\n      <TableRow>\n        <TableCell colSpan={4} sx={{ paddingBottom: 0, paddingTop: 0, border: isExpanded ? undefined : 'none' }}>\n          <Collapse in={isExpanded} timeout=\"auto\" unmountOnExit>\n            <Box sx={{ margin: 2 }}>\n              <LinkEditorForm\n                mode=\"modalEmbedded\"\n                url={{\n                  value: link.url,\n                  label: 'URL',\n                  error: { hasError: hasError, helperText: hasError ? 'URL is required' : undefined },\n                  placeholder: 'https://example.com/dashboard?var=$variable',\n                  onChange: (url) => onUpdate({ ...link, url }),\n                }}\n                name={{\n                  value: link.name ?? '',\n                  label: 'Display Name',\n                  onChange: (name) => onUpdate({ ...link, name }),\n                }}\n                tooltip={{\n                  value: link.tooltip ?? '',\n                  label: 'Tooltip',\n                  onChange: (tooltip) => onUpdate({ ...link, tooltip }),\n                }}\n                renderVariables={{\n                  value: link.renderVariables ?? true,\n                  label: 'Replace variables in URL',\n                  onChange: (renderVariables) => onUpdate({ ...link, renderVariables }),\n                }}\n                newTabOpen={{\n                  value: link.targetBlank ?? true,\n                  label: 'Open in new tab',\n                  onChange: (targetBlank) => onUpdate({ ...link, targetBlank }),\n                }}\n              />\n            </Box>\n          </Collapse>\n        </TableCell>\n      </TableRow>\n    </>\n  );\n}\n"],"names":["useState","Button","Stack","Box","Typography","IconButton","Table","TableBody","TableCell","TableContainer","TableHead","TableRow","Collapse","AddIcon","TrashIcon","ArrowUp","ArrowDown","PencilIcon","ChevronUp","useImmer","InfoTooltip","LinkEditorForm","useDiscardChangesConfirmationDialog","DEFAULT_LINK","url","name","tooltip","renderVariables","targetBlank","DashboardLinksEditor","links","initialLinks","onChange","onCancel","setLinks","expandedIndex","setExpandedIndex","openDiscardChangesConfirmationDialog","closeDiscardChangesConfirmationDialog","handleCancel","JSON","stringify","onDiscardChanges","handleAdd","draft","push","length","handleRemove","index","splice","handleMoveUp","temp","handleMoveDown","handleUpdateLink","link","isValid","every","trim","sx","display","alignItems","padding","theme","spacing","borderBottom","palette","divider","variant","direction","marginLeft","disabled","onClick","color","overflowY","size","tableLayout","width","aria-label","align","map","LinkTableRow","isFirst","isLast","isExpanded","onToggleExpand","onUpdate","updatedLink","onRemove","onMoveUp","onMoveDown","fontStyle","textAlign","py","startIcon","alignSelf","displayName","hasError","component","scope","fontWeight","overflow","textOverflow","whiteSpace","undefined","description","enterDelay","colSpan","paddingBottom","paddingTop","border","in","timeout","unmountOnExit","margin","mode","value","label","error","helperText","placeholder","newTabOpen"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/DashboardLinks/DashboardLinksEditor.tsx"],"sourcesContent":["// Copyright The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { useState, ReactElement } from 'react';\nimport {\n  Button,\n  Stack,\n  Box,\n  Typography,\n  IconButton,\n  Table,\n  TableBody,\n  TableCell,\n  TableContainer,\n  TableHead,\n  TableRow,\n  Collapse,\n} from '@mui/material';\nimport AddIcon from 'mdi-material-ui/Plus';\nimport TrashIcon from 'mdi-material-ui/TrashCan';\nimport ArrowUp from 'mdi-material-ui/ArrowUp';\nimport ArrowDown from 'mdi-material-ui/ArrowDown';\nimport PencilIcon from 'mdi-material-ui/Pencil';\nimport ChevronUp from 'mdi-material-ui/ChevronUp';\nimport { Link } from '@perses-dev/spec';\nimport { useImmer } from 'use-immer';\nimport { InfoTooltip, LinkEditorForm } from '@perses-dev/components';\nimport { useDiscardChangesConfirmationDialog } from '../../context';\n\nexport interface DashboardLinksEditorProps {\n  links: Link[];\n  onChange: (links: Link[]) => void;\n  onCancel: () => void;\n}\n\nconst DEFAULT_LINK: Link = {\n  url: '',\n  name: '',\n  tooltip: '',\n  renderVariables: true,\n  targetBlank: true,\n};\n\nexport function DashboardLinksEditor({\n  links: initialLinks,\n  onChange,\n  onCancel,\n}: DashboardLinksEditorProps): ReactElement {\n  const [links, setLinks] = useImmer(initialLinks);\n  const [expandedIndex, setExpandedIndex] = useState<number | null>(null);\n\n  const { openDiscardChangesConfirmationDialog, closeDiscardChangesConfirmationDialog } =\n    useDiscardChangesConfirmationDialog();\n\n  const handleCancel = (): void => {\n    if (JSON.stringify(initialLinks) !== JSON.stringify(links)) {\n      openDiscardChangesConfirmationDialog({\n        onDiscardChanges: () => {\n          closeDiscardChangesConfirmationDialog();\n          onCancel();\n        },\n        onCancel: closeDiscardChangesConfirmationDialog,\n      });\n    } else {\n      onCancel();\n    }\n  };\n\n  const handleAdd = (): void => {\n    setLinks((draft) => {\n      draft.push({ ...DEFAULT_LINK });\n    });\n    setExpandedIndex(links.length);\n  };\n\n  const handleRemove = (index: number): void => {\n    setLinks((draft) => {\n      draft.splice(index, 1);\n    });\n    if (expandedIndex === index) {\n      setExpandedIndex(null);\n    } else if (expandedIndex !== null && expandedIndex > index) {\n      setExpandedIndex(expandedIndex - 1);\n    }\n  };\n\n  const handleMoveUp = (index: number): void => {\n    if (index === 0) return;\n    setLinks((draft) => {\n      const temp = draft[index - 1];\n      if (temp && draft[index]) {\n        draft[index - 1] = draft[index]!;\n        draft[index] = temp;\n      }\n    });\n    if (expandedIndex === index) {\n      setExpandedIndex(index - 1);\n    } else if (expandedIndex === index - 1) {\n      setExpandedIndex(index);\n    }\n  };\n\n  const handleMoveDown = (index: number): void => {\n    if (index >= links.length - 1) return;\n    setLinks((draft) => {\n      const temp = draft[index + 1];\n      if (temp && draft[index]) {\n        draft[index + 1] = draft[index]!;\n        draft[index] = temp;\n      }\n    });\n    if (expandedIndex === index) {\n      setExpandedIndex(index + 1);\n    } else if (expandedIndex === index + 1) {\n      setExpandedIndex(index);\n    }\n  };\n\n  const handleUpdateLink = (index: number, link: Link): void => {\n    setLinks((draft) => {\n      draft[index] = link;\n    });\n  };\n\n  const isValid = links.every((link) => link.url.trim().length > 0);\n\n  return (\n    <>\n      <Box\n        sx={{\n          display: 'flex',\n          alignItems: 'center',\n          padding: (theme) => theme.spacing(1, 2),\n          borderBottom: (theme) => `1px solid ${theme.palette.divider}`,\n        }}\n      >\n        <Typography variant=\"h2\">Edit Dashboard Links</Typography>\n        <Stack direction=\"row\" spacing={1} marginLeft=\"auto\">\n          <Button disabled={!isValid} variant=\"contained\" onClick={() => onChange(links)}>\n            Apply\n          </Button>\n          <Button color=\"secondary\" variant=\"outlined\" onClick={handleCancel}>\n            Cancel\n          </Button>\n        </Stack>\n      </Box>\n      <Box padding={2} sx={{ overflowY: 'scroll' }}>\n        <Stack spacing={2}>\n          <TableContainer>\n            <Table size=\"small\" sx={{ tableLayout: 'fixed', width: '100%' }} aria-label=\"table of dashboard links\">\n              <TableHead>\n                <TableRow>\n                  <TableCell>Name</TableCell>\n                  <TableCell>URL</TableCell>\n                  <TableCell width={80}>New Tab</TableCell>\n                  <TableCell align=\"right\" width={180}>\n                    Actions\n                  </TableCell>\n                </TableRow>\n              </TableHead>\n              <TableBody>\n                {links.map((link, index) => (\n                  <LinkTableRow\n                    key={index}\n                    link={link}\n                    index={index}\n                    isFirst={index === 0}\n                    isLast={index === links.length - 1}\n                    isExpanded={expandedIndex === index}\n                    onToggleExpand={() => setExpandedIndex(expandedIndex === index ? null : index)}\n                    onUpdate={(updatedLink) => handleUpdateLink(index, updatedLink)}\n                    onRemove={() => handleRemove(index)}\n                    onMoveUp={() => handleMoveUp(index)}\n                    onMoveDown={() => handleMoveDown(index)}\n                  />\n                ))}\n              </TableBody>\n            </Table>\n          </TableContainer>\n          {links.length === 0 && (\n            <Typography variant=\"body1\" color=\"text.secondary\" fontStyle=\"italic\" textAlign=\"center\" py={4}>\n              No links defined. Click &apos;Add Link&apos; to create one.\n            </Typography>\n          )}\n          <Button variant=\"contained\" startIcon={<AddIcon />} onClick={handleAdd} sx={{ alignSelf: 'flex-start' }}>\n            Add Link\n          </Button>\n        </Stack>\n      </Box>\n    </>\n  );\n}\n\ninterface LinkTableRowProps {\n  link: Link;\n  index: number;\n  isFirst: boolean;\n  isLast: boolean;\n  isExpanded: boolean;\n  onToggleExpand: () => void;\n  onUpdate: (link: Link) => void;\n  onRemove: () => void;\n  onMoveUp: () => void;\n  onMoveDown: () => void;\n}\n\nfunction LinkTableRow({\n  link,\n  index,\n  isFirst,\n  isLast,\n  isExpanded,\n  onToggleExpand,\n  onUpdate,\n  onRemove,\n  onMoveUp,\n  onMoveDown,\n}: LinkTableRowProps): ReactElement {\n  const displayName = link.name?.trim() || `Link ${index + 1}`;\n  const hasError = link.url.trim().length === 0;\n\n  return (\n    <>\n      <TableRow>\n        <TableCell component=\"th\" scope=\"row\" sx={{ fontWeight: 'bold', overflow: 'hidden', textOverflow: 'ellipsis' }}>\n          {displayName}\n        </TableCell>\n        <TableCell\n          sx={{\n            overflow: 'hidden',\n            textOverflow: 'ellipsis',\n            whiteSpace: 'nowrap',\n            color: hasError ? 'error.main' : undefined,\n          }}\n        >\n          <InfoTooltip description={link.url} enterDelay={100}>\n            {link.url || '(no URL)'}\n          </InfoTooltip>\n        </TableCell>\n        <TableCell>{link.targetBlank ? 'Yes' : 'No'}</TableCell>\n        <TableCell align=\"right\" sx={{ whiteSpace: 'nowrap' }}>\n          <IconButton onClick={onMoveUp} disabled={isFirst} aria-label=\"Move link up\">\n            <ArrowUp />\n          </IconButton>\n          <IconButton onClick={onMoveDown} disabled={isLast} aria-label=\"Move link down\">\n            <ArrowDown />\n          </IconButton>\n          <IconButton onClick={onToggleExpand} aria-label={isExpanded ? 'Collapse link editor' : 'Edit link'}>\n            {isExpanded ? <ChevronUp /> : <PencilIcon />}\n          </IconButton>\n          <IconButton onClick={onRemove} aria-label=\"Remove link\">\n            <TrashIcon />\n          </IconButton>\n        </TableCell>\n      </TableRow>\n      <TableRow>\n        <TableCell colSpan={4} sx={{ paddingBottom: 0, paddingTop: 0, border: isExpanded ? undefined : 'none' }}>\n          <Collapse in={isExpanded} timeout=\"auto\" unmountOnExit>\n            <Box sx={{ margin: 2 }}>\n              <LinkEditorForm\n                mode=\"modalEmbedded\"\n                url={{\n                  value: link.url,\n                  label: 'URL',\n                  error: { hasError: hasError, helperText: hasError ? 'URL is required' : undefined },\n                  placeholder: 'https://example.com/dashboard?var=$variable',\n                  onChange: (url) => onUpdate({ ...link, url }),\n                }}\n                name={{\n                  value: link.name ?? '',\n                  label: 'Display Name',\n                  onChange: (name) => onUpdate({ ...link, name }),\n                }}\n                tooltip={{\n                  value: link.tooltip ?? '',\n                  label: 'Tooltip',\n                  onChange: (tooltip) => onUpdate({ ...link, tooltip }),\n                }}\n                renderVariables={{\n                  value: link.renderVariables ?? true,\n                  label: 'Replace variables in URL',\n                  onChange: (renderVariables) => onUpdate({ ...link, renderVariables }),\n                }}\n                newTabOpen={{\n                  value: link.targetBlank ?? true,\n                  label: 'Open in new tab',\n                  onChange: (targetBlank) => onUpdate({ ...link, targetBlank }),\n                }}\n              />\n            </Box>\n          </Collapse>\n        </TableCell>\n      </TableRow>\n    </>\n  );\n}\n"],"names":["useState","Button","Stack","Box","Typography","IconButton","Table","TableBody","TableCell","TableContainer","TableHead","TableRow","Collapse","AddIcon","TrashIcon","ArrowUp","ArrowDown","PencilIcon","ChevronUp","useImmer","InfoTooltip","LinkEditorForm","useDiscardChangesConfirmationDialog","DEFAULT_LINK","url","name","tooltip","renderVariables","targetBlank","DashboardLinksEditor","links","initialLinks","onChange","onCancel","setLinks","expandedIndex","setExpandedIndex","openDiscardChangesConfirmationDialog","closeDiscardChangesConfirmationDialog","handleCancel","JSON","stringify","onDiscardChanges","handleAdd","draft","push","length","handleRemove","index","splice","handleMoveUp","temp","handleMoveDown","handleUpdateLink","link","isValid","every","trim","sx","display","alignItems","padding","theme","spacing","borderBottom","palette","divider","variant","direction","marginLeft","disabled","onClick","color","overflowY","size","tableLayout","width","aria-label","align","map","LinkTableRow","isFirst","isLast","isExpanded","onToggleExpand","onUpdate","updatedLink","onRemove","onMoveUp","onMoveDown","fontStyle","textAlign","py","startIcon","alignSelf","displayName","hasError","component","scope","fontWeight","overflow","textOverflow","whiteSpace","undefined","description","enterDelay","colSpan","paddingBottom","paddingTop","border","in","timeout","unmountOnExit","margin","mode","value","label","error","helperText","placeholder","newTabOpen"],"mappings":";AAAA,+BAA+B;AAC/B,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC,SAASA,QAAQ,QAAsB,QAAQ;AAC/C,SACEC,MAAM,EACNC,KAAK,EACLC,GAAG,EACHC,UAAU,EACVC,UAAU,EACVC,KAAK,EACLC,SAAS,EACTC,SAAS,EACTC,cAAc,EACdC,SAAS,EACTC,QAAQ,EACRC,QAAQ,QACH,gBAAgB;AACvB,OAAOC,aAAa,uBAAuB;AAC3C,OAAOC,eAAe,2BAA2B;AACjD,OAAOC,aAAa,0BAA0B;AAC9C,OAAOC,eAAe,4BAA4B;AAClD,OAAOC,gBAAgB,yBAAyB;AAChD,OAAOC,eAAe,4BAA4B;AAElD,SAASC,QAAQ,QAAQ,YAAY;AACrC,SAASC,WAAW,EAAEC,cAAc,QAAQ,yBAAyB;AACrE,SAASC,mCAAmC,QAAQ,gBAAgB;AAQpE,MAAMC,eAAqB;IACzBC,KAAK;IACLC,MAAM;IACNC,SAAS;IACTC,iBAAiB;IACjBC,aAAa;AACf;AAEA,OAAO,SAASC,qBAAqB,EACnCC,OAAOC,YAAY,EACnBC,QAAQ,EACRC,QAAQ,EACkB;IAC1B,MAAM,CAACH,OAAOI,SAAS,GAAGf,SAASY;IACnC,MAAM,CAACI,eAAeC,iBAAiB,GAAGpC,SAAwB;IAElE,MAAM,EAAEqC,oCAAoC,EAAEC,qCAAqC,EAAE,GACnFhB;IAEF,MAAMiB,eAAe;QACnB,IAAIC,KAAKC,SAAS,CAACV,kBAAkBS,KAAKC,SAAS,CAACX,QAAQ;YAC1DO,qCAAqC;gBACnCK,kBAAkB;oBAChBJ;oBACAL;gBACF;gBACAA,UAAUK;YACZ;QACF,OAAO;YACLL;QACF;IACF;IAEA,MAAMU,YAAY;QAChBT,SAAS,CAACU;YACRA,MAAMC,IAAI,CAAC;gBAAE,GAAGtB,YAAY;YAAC;QAC/B;QACAa,iBAAiBN,MAAMgB,MAAM;IAC/B;IAEA,MAAMC,eAAe,CAACC;QACpBd,SAAS,CAACU;YACRA,MAAMK,MAAM,CAACD,OAAO;QACtB;QACA,IAAIb,kBAAkBa,OAAO;YAC3BZ,iBAAiB;QACnB,OAAO,IAAID,kBAAkB,QAAQA,gBAAgBa,OAAO;YAC1DZ,iBAAiBD,gBAAgB;QACnC;IACF;IAEA,MAAMe,eAAe,CAACF;QACpB,IAAIA,UAAU,GAAG;QACjBd,SAAS,CAACU;YACR,MAAMO,OAAOP,KAAK,CAACI,QAAQ,EAAE;YAC7B,IAAIG,QAAQP,KAAK,CAACI,MAAM,EAAE;gBACxBJ,KAAK,CAACI,QAAQ,EAAE,GAAGJ,KAAK,CAACI,MAAM;gBAC/BJ,KAAK,CAACI,MAAM,GAAGG;YACjB;QACF;QACA,IAAIhB,kBAAkBa,OAAO;YAC3BZ,iBAAiBY,QAAQ;QAC3B,OAAO,IAAIb,kBAAkBa,QAAQ,GAAG;YACtCZ,iBAAiBY;QACnB;IACF;IAEA,MAAMI,iBAAiB,CAACJ;QACtB,IAAIA,SAASlB,MAAMgB,MAAM,GAAG,GAAG;QAC/BZ,SAAS,CAACU;YACR,MAAMO,OAAOP,KAAK,CAACI,QAAQ,EAAE;YAC7B,IAAIG,QAAQP,KAAK,CAACI,MAAM,EAAE;gBACxBJ,KAAK,CAACI,QAAQ,EAAE,GAAGJ,KAAK,CAACI,MAAM;gBAC/BJ,KAAK,CAACI,MAAM,GAAGG;YACjB;QACF;QACA,IAAIhB,kBAAkBa,OAAO;YAC3BZ,iBAAiBY,QAAQ;QAC3B,OAAO,IAAIb,kBAAkBa,QAAQ,GAAG;YACtCZ,iBAAiBY;QACnB;IACF;IAEA,MAAMK,mBAAmB,CAACL,OAAeM;QACvCpB,SAAS,CAACU;YACRA,KAAK,CAACI,MAAM,GAAGM;QACjB;IACF;IAEA,MAAMC,UAAUzB,MAAM0B,KAAK,CAAC,CAACF,OAASA,KAAK9B,GAAG,CAACiC,IAAI,GAAGX,MAAM,GAAG;IAE/D,qBACE;;0BACE,MAAC3C;gBACCuD,IAAI;oBACFC,SAAS;oBACTC,YAAY;oBACZC,SAAS,CAACC,QAAUA,MAAMC,OAAO,CAAC,GAAG;oBACrCC,cAAc,CAACF,QAAU,CAAC,UAAU,EAAEA,MAAMG,OAAO,CAACC,OAAO,EAAE;gBAC/D;;kCAEA,KAAC9D;wBAAW+D,SAAQ;kCAAK;;kCACzB,MAACjE;wBAAMkE,WAAU;wBAAML,SAAS;wBAAGM,YAAW;;0CAC5C,KAACpE;gCAAOqE,UAAU,CAACf;gCAASY,SAAQ;gCAAYI,SAAS,IAAMvC,SAASF;0CAAQ;;0CAGhF,KAAC7B;gCAAOuE,OAAM;gCAAYL,SAAQ;gCAAWI,SAAShC;0CAAc;;;;;;0BAKxE,KAACpC;gBAAI0D,SAAS;gBAAGH,IAAI;oBAAEe,WAAW;gBAAS;0BACzC,cAAA,MAACvE;oBAAM6D,SAAS;;sCACd,KAACtD;sCACC,cAAA,MAACH;gCAAMoE,MAAK;gCAAQhB,IAAI;oCAAEiB,aAAa;oCAASC,OAAO;gCAAO;gCAAGC,cAAW;;kDAC1E,KAACnE;kDACC,cAAA,MAACC;;8DACC,KAACH;8DAAU;;8DACX,KAACA;8DAAU;;8DACX,KAACA;oDAAUoE,OAAO;8DAAI;;8DACtB,KAACpE;oDAAUsE,OAAM;oDAAQF,OAAO;8DAAK;;;;;kDAKzC,KAACrE;kDACEuB,MAAMiD,GAAG,CAAC,CAACzB,MAAMN,sBAChB,KAACgC;gDAEC1B,MAAMA;gDACNN,OAAOA;gDACPiC,SAASjC,UAAU;gDACnBkC,QAAQlC,UAAUlB,MAAMgB,MAAM,GAAG;gDACjCqC,YAAYhD,kBAAkBa;gDAC9BoC,gBAAgB,IAAMhD,iBAAiBD,kBAAkBa,QAAQ,OAAOA;gDACxEqC,UAAU,CAACC,cAAgBjC,iBAAiBL,OAAOsC;gDACnDC,UAAU,IAAMxC,aAAaC;gDAC7BwC,UAAU,IAAMtC,aAAaF;gDAC7ByC,YAAY,IAAMrC,eAAeJ;+CAV5BA;;;;;wBAgBdlB,MAAMgB,MAAM,KAAK,mBAChB,KAAC1C;4BAAW+D,SAAQ;4BAAQK,OAAM;4BAAiBkB,WAAU;4BAASC,WAAU;4BAASC,IAAI;sCAAG;;sCAIlG,KAAC3F;4BAAOkE,SAAQ;4BAAY0B,yBAAW,KAAChF;4BAAY0D,SAAS5B;4BAAWe,IAAI;gCAAEoC,WAAW;4BAAa;sCAAG;;;;;;;AAOnH;AAeA,SAASd,aAAa,EACpB1B,IAAI,EACJN,KAAK,EACLiC,OAAO,EACPC,MAAM,EACNC,UAAU,EACVC,cAAc,EACdC,QAAQ,EACRE,QAAQ,EACRC,QAAQ,EACRC,UAAU,EACQ;IAClB,MAAMM,cAAczC,KAAK7B,IAAI,EAAEgC,UAAU,CAAC,KAAK,EAAET,QAAQ,GAAG;IAC5D,MAAMgD,WAAW1C,KAAK9B,GAAG,CAACiC,IAAI,GAAGX,MAAM,KAAK;IAE5C,qBACE;;0BACE,MAACnC;;kCACC,KAACH;wBAAUyF,WAAU;wBAAKC,OAAM;wBAAMxC,IAAI;4BAAEyC,YAAY;4BAAQC,UAAU;4BAAUC,cAAc;wBAAW;kCAC1GN;;kCAEH,KAACvF;wBACCkD,IAAI;4BACF0C,UAAU;4BACVC,cAAc;4BACdC,YAAY;4BACZ9B,OAAOwB,WAAW,eAAeO;wBACnC;kCAEA,cAAA,KAACnF;4BAAYoF,aAAalD,KAAK9B,GAAG;4BAAEiF,YAAY;sCAC7CnD,KAAK9B,GAAG,IAAI;;;kCAGjB,KAAChB;kCAAW8C,KAAK1B,WAAW,GAAG,QAAQ;;kCACvC,MAACpB;wBAAUsE,OAAM;wBAAQpB,IAAI;4BAAE4C,YAAY;wBAAS;;0CAClD,KAACjG;gCAAWkE,SAASiB;gCAAUlB,UAAUW;gCAASJ,cAAW;0CAC3D,cAAA,KAAC9D;;0CAEH,KAACV;gCAAWkE,SAASkB;gCAAYnB,UAAUY;gCAAQL,cAAW;0CAC5D,cAAA,KAAC7D;;0CAEH,KAACX;gCAAWkE,SAASa;gCAAgBP,cAAYM,aAAa,yBAAyB;0CACpFA,2BAAa,KAACjE,+BAAe,KAACD;;0CAEjC,KAACZ;gCAAWkE,SAASgB;gCAAUV,cAAW;0CACxC,cAAA,KAAC/D;;;;;;0BAIP,KAACH;0BACC,cAAA,KAACH;oBAAUkG,SAAS;oBAAGhD,IAAI;wBAAEiD,eAAe;wBAAGC,YAAY;wBAAGC,QAAQ1B,aAAaoB,YAAY;oBAAO;8BACpG,cAAA,KAAC3F;wBAASkG,IAAI3B;wBAAY4B,SAAQ;wBAAOC,aAAa;kCACpD,cAAA,KAAC7G;4BAAIuD,IAAI;gCAAEuD,QAAQ;4BAAE;sCACnB,cAAA,KAAC5F;gCACC6F,MAAK;gCACL1F,KAAK;oCACH2F,OAAO7D,KAAK9B,GAAG;oCACf4F,OAAO;oCACPC,OAAO;wCAAErB,UAAUA;wCAAUsB,YAAYtB,WAAW,oBAAoBO;oCAAU;oCAClFgB,aAAa;oCACbvF,UAAU,CAACR,MAAQ6D,SAAS;4CAAE,GAAG/B,IAAI;4CAAE9B;wCAAI;gCAC7C;gCACAC,MAAM;oCACJ0F,OAAO7D,KAAK7B,IAAI,IAAI;oCACpB2F,OAAO;oCACPpF,UAAU,CAACP,OAAS4D,SAAS;4CAAE,GAAG/B,IAAI;4CAAE7B;wCAAK;gCAC/C;gCACAC,SAAS;oCACPyF,OAAO7D,KAAK5B,OAAO,IAAI;oCACvB0F,OAAO;oCACPpF,UAAU,CAACN,UAAY2D,SAAS;4CAAE,GAAG/B,IAAI;4CAAE5B;wCAAQ;gCACrD;gCACAC,iBAAiB;oCACfwF,OAAO7D,KAAK3B,eAAe,IAAI;oCAC/ByF,OAAO;oCACPpF,UAAU,CAACL,kBAAoB0D,SAAS;4CAAE,GAAG/B,IAAI;4CAAE3B;wCAAgB;gCACrE;gCACA6F,YAAY;oCACVL,OAAO7D,KAAK1B,WAAW,IAAI;oCAC3BwF,OAAO;oCACPpF,UAAU,CAACJ,cAAgByD,SAAS;4CAAE,GAAG/B,IAAI;4CAAE1B;wCAAY;gCAC7D;;;;;;;;AAQhB"}

package/dist/components/DashboardLinks/EditDashboardLinksButton.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 // Copyright The Perses Authors
 // Licensed under the Apache License, Version 2.0 (the "License");
 // you may not use this file except in compliance with the License.
@@ -10,7 +11,6 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { useState } from 'react';
 import { Button } from '@mui/material';
 import PencilIcon from 'mdi-material-ui/PencilOutline';