@perses-dev/dashboards 0.0.0-snapshot-time-range-height-80d08fc

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

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

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

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

package/dist/components/Variables/VariableEditorForm/index.d.ts

@@ -0,0 +1,2 @@
+export * from './VariableEditorForm';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Variables/VariableEditorForm/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/Variables/VariableEditorForm/index.ts"],"names":[],"mappings":"AAaA,cAAc,sBAAsB,CAAC"}

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

@@ -0,0 +1,15 @@
+// Copyright 2022 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.
+export * from './VariableEditorForm';
+
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/Variables/VariableEditorForm/index.ts"],"sourcesContent":["// Copyright 2022 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 './VariableEditorForm';\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,CAAC"}

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

@@ -0,0 +1,22 @@
+import { VariableDefinition } from '@perses-dev/core';
+export declare function getInitialState(initialVariableDefinition: VariableDefinition): {
+    name: string;
+    title: string | undefined;
+    kind: "TextVariable" | "ListVariable";
+    description: string;
+    listVariableFields: {
+        allowMultiple: boolean;
+        allowAll: boolean;
+        capturing_regexp: string | undefined;
+        plugin: {
+            kind: string;
+            spec: {};
+        };
+    };
+    textVariableFields: {
+        value: string;
+    };
+};
+export declare type VariableEditorState = ReturnType<typeof getInitialState>;
+export declare function getVariableDefinitionFromState(state: VariableEditorState): VariableDefinition;
+//# sourceMappingURL=variable-editor-form-model.d.ts.map

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

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

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

@@ -0,0 +1,77 @@
+// Copyright 2022 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.
+export function getInitialState(initialVariableDefinition) {
+    var ref;
+    var _value;
+    const textVariableFields = {
+        value: (_value = initialVariableDefinition.spec.value) !== null && _value !== void 0 ? _value : ''
+    };
+    const listVariableFields = {
+        allowMultiple: false,
+        allowAll: false,
+        capturing_regexp: undefined,
+        plugin: {
+            kind: '',
+            spec: {}
+        }
+    };
+    if (initialVariableDefinition.kind === 'ListVariable') {
+        var _allow_all_value;
+        listVariableFields.allowMultiple = (_allow_all_value = initialVariableDefinition.spec.allow_all_value) !== null && _allow_all_value !== void 0 ? _allow_all_value : false;
+        var _allow_all_value1;
+        listVariableFields.allowAll = (_allow_all_value1 = initialVariableDefinition.spec.allow_all_value) !== null && _allow_all_value1 !== void 0 ? _allow_all_value1 : false;
+        listVariableFields.capturing_regexp = initialVariableDefinition.spec.capturing_regexp;
+        listVariableFields.plugin = initialVariableDefinition.spec.plugin;
+    }
+    return {
+        name: initialVariableDefinition.spec.name,
+        title: (ref = initialVariableDefinition.spec.display) === null || ref === void 0 ? void 0 : ref.name,
+        kind: initialVariableDefinition.kind,
+        description: '',
+        listVariableFields,
+        textVariableFields
+    };
+}
+export function getVariableDefinitionFromState(state) {
+    const { name , title , kind  } = state;
+    const commonSpec = {
+        name,
+        display: {
+            name: title
+        }
+    };
+    if (kind === 'TextVariable') {
+        return {
+            kind,
+            spec: {
+                ...commonSpec,
+                ...state.textVariableFields
+            }
+        };
+    }
+    if (kind === 'ListVariable') {
+        return {
+            kind,
+            spec: {
+                ...commonSpec,
+                allow_multiple: state.listVariableFields.allowMultiple,
+                allow_all_value: state.listVariableFields.allowAll,
+                capturing_regexp: state.listVariableFields.capturing_regexp,
+                plugin: state.listVariableFields.plugin
+            }
+        };
+    }
+    throw new Error(`Unknown variable kind: ${kind}`);
+}
+
+//# sourceMappingURL=variable-editor-form-model.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/Variables/VariableEditorForm/variable-editor-form-model.ts"],"sourcesContent":["// Copyright 2022 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { VariableDefinition, TextVariableDefinition, Display } from '@perses-dev/core';\n\nexport function getInitialState(initialVariableDefinition: VariableDefinition) {\n  const textVariableFields = {\n    value: (initialVariableDefinition as TextVariableDefinition).spec.value ?? '',\n  };\n\n  const listVariableFields = {\n    allowMultiple: false,\n    allowAll: false,\n    capturing_regexp: undefined as string | undefined,\n    plugin: {\n      kind: '',\n      spec: {},\n    },\n  };\n  if (initialVariableDefinition.kind === 'ListVariable') {\n    listVariableFields.allowMultiple = initialVariableDefinition.spec.allow_all_value ?? false;\n    listVariableFields.allowAll = initialVariableDefinition.spec.allow_all_value ?? false;\n    listVariableFields.capturing_regexp = initialVariableDefinition.spec.capturing_regexp;\n    listVariableFields.plugin = initialVariableDefinition.spec.plugin;\n  }\n\n  return {\n    name: initialVariableDefinition.spec.name,\n    title: initialVariableDefinition.spec.display?.name,\n    kind: initialVariableDefinition.kind,\n    description: '',\n    listVariableFields,\n    textVariableFields,\n  };\n}\n\nexport type VariableEditorState = ReturnType<typeof getInitialState>;\n\nexport function getVariableDefinitionFromState(state: VariableEditorState): VariableDefinition {\n  const { name, title, kind } = state;\n\n  const commonSpec = {\n    name,\n    display: {\n      name: title,\n    } as Display,\n  };\n\n  if (kind === 'TextVariable') {\n    return {\n      kind,\n      spec: {\n        ...commonSpec,\n        ...state.textVariableFields,\n      },\n    };\n  }\n\n  if (kind === 'ListVariable') {\n    return {\n      kind,\n      spec: {\n        ...commonSpec,\n        allow_multiple: state.listVariableFields.allowMultiple,\n        allow_all_value: state.listVariableFields.allowAll,\n        capturing_regexp: state.listVariableFields.capturing_regexp,\n        plugin: state.listVariableFields.plugin,\n      },\n    };\n  }\n  throw new Error(`Unknown variable kind: ${kind}`);\n}\n"],"names":["getInitialState","initialVariableDefinition","textVariableFields","value","spec","listVariableFields","allowMultiple","allowAll","capturing_regexp","undefined","plugin","kind","allow_all_value","name","title","display","description","getVariableDefinitionFromState","state","commonSpec","allow_multiple","Error"],"mappings":"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"}

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { SxProps, Theme } from '@mui/material';
+interface TemplateVariableListProps {
+    initialVariableIsSticky?: boolean;
+    sx?: SxProps<Theme>;
+}
+export declare function TemplateVariableList(props: TemplateVariableListProps): JSX.Element;
+export {};
+//# sourceMappingURL=VariableList.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"VariableList.d.ts","sourceRoot":"","sources":["../../../src/components/Variables/VariableList.tsx"],"names":[],"mappings":";AAcA,OAAO,EAA4D,OAAO,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AASzG,UAAU,yBAAyB;IACjC,uBAAuB,CAAC,EAAE,OAAO,CAAC;IAClC,EAAE,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;CACrB;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,eAuDpE"}