@perses-dev/loki-plugin 0.5.1 → 0.6.0-beta.0

package/lib/variables/MatcherEditor.js

@@ -0,0 +1,71 @@
+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.
+// 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 { Stack, TextField, Button, IconButton } from '@mui/material';
+import { produce } from 'immer';
+import TrashIcon from 'mdi-material-ui/TrashCan';
+export function MatcherEditor({ matchers, onChange, isReadonly }) {
+    return /*#__PURE__*/ _jsxs(Stack, {
+        spacing: 1,
+        mb: 2,
+        children: [
+            matchers.map((matcher, index)=>/*#__PURE__*/ _jsxs(Stack, {
+                    direction: "row",
+                    alignItems: "center",
+                    children: [
+                        /*#__PURE__*/ _jsx(TextField, {
+                            fullWidth: true,
+                            label: "Stream Selector",
+                            value: matcher,
+                            slotProps: {
+                                input: {
+                                    readOnly: isReadonly
+                                }
+                            },
+                            onChange: (e)=>{
+                                const newMatchers = produce(matchers, (draft)=>{
+                                    draft[index] = e.target.value;
+                                });
+                                onChange(newMatchers);
+                            }
+                        }),
+                        /*#__PURE__*/ _jsx(IconButton, {
+                            onClick: ()=>{
+                                const newMatchers = produce(matchers, (draft)=>{
+                                    draft.splice(index, 1);
+                                });
+                                onChange(newMatchers);
+                            },
+                            disabled: isReadonly,
+                            children: /*#__PURE__*/ _jsx(TrashIcon, {})
+                        })
+                    ]
+                }, index)),
+            /*#__PURE__*/ _jsx(Button, {
+                fullWidth: false,
+                color: "secondary",
+                variant: "outlined",
+                onClick: ()=>{
+                    const newMatchers = produce(matchers, (draft)=>{
+                        draft.push('');
+                    });
+                    onChange(newMatchers);
+                },
+                disabled: isReadonly,
+                children: "Add Stream Selector"
+            })
+        ]
+    });
+}
+
+//# sourceMappingURL=MatcherEditor.js.map

package/lib/variables/MatcherEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/variables/MatcherEditor.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 { Stack, TextField, Button, IconButton } from '@mui/material';\nimport { produce } from 'immer';\nimport TrashIcon from 'mdi-material-ui/TrashCan';\nimport { ReactElement } from 'react';\n\ntype MatcherEditorProps = {\n  matchers: string[];\n  onChange: (matchers: string[]) => void;\n  isReadonly?: boolean;\n};\n\nexport function MatcherEditor({ matchers, onChange, isReadonly }: MatcherEditorProps): ReactElement {\n  return (\n    <Stack spacing={1} mb={2}>\n      {matchers.map((matcher, index) => (\n        <Stack key={index} direction=\"row\" alignItems=\"center\">\n          <TextField\n            fullWidth\n            label=\"Stream Selector\"\n            value={matcher}\n            slotProps={{\n              input: {\n                readOnly: isReadonly,\n              },\n            }}\n            onChange={(e) => {\n              const newMatchers = produce(matchers, (draft) => {\n                draft[index] = e.target.value;\n              });\n              onChange(newMatchers);\n            }}\n          />\n          <IconButton\n            onClick={() => {\n              const newMatchers = produce(matchers, (draft) => {\n                draft.splice(index, 1);\n              });\n              onChange(newMatchers);\n            }}\n            disabled={isReadonly}\n          >\n            <TrashIcon />\n          </IconButton>\n        </Stack>\n      ))}\n      <Button\n        fullWidth={false}\n        color=\"secondary\"\n        variant=\"outlined\"\n        onClick={() => {\n          const newMatchers = produce(matchers, (draft) => {\n            draft.push('');\n          });\n          onChange(newMatchers);\n        }}\n        disabled={isReadonly}\n      >\n        Add Stream Selector\n      </Button>\n    </Stack>\n  );\n}\n"],"names":["Stack","TextField","Button","IconButton","produce","TrashIcon","MatcherEditor","matchers","onChange","isReadonly","spacing","mb","map","matcher","index","direction","alignItems","fullWidth","label","value","slotProps","input","readOnly","e","newMatchers","draft","target","onClick","splice","disabled","color","variant","push"],"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,KAAK,EAAEC,SAAS,EAAEC,MAAM,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,OAAO,QAAQ,QAAQ;AAChC,OAAOC,eAAe,2BAA2B;AASjD,OAAO,SAASC,cAAc,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,UAAU,EAAsB;IAClF,qBACE,MAACT;QAAMU,SAAS;QAAGC,IAAI;;YACpBJ,SAASK,GAAG,CAAC,CAACC,SAASC,sBACtB,MAACd;oBAAkBe,WAAU;oBAAMC,YAAW;;sCAC5C,KAACf;4BACCgB,SAAS;4BACTC,OAAM;4BACNC,OAAON;4BACPO,WAAW;gCACTC,OAAO;oCACLC,UAAUb;gCACZ;4BACF;4BACAD,UAAU,CAACe;gCACT,MAAMC,cAAcpB,QAAQG,UAAU,CAACkB;oCACrCA,KAAK,CAACX,MAAM,GAAGS,EAAEG,MAAM,CAACP,KAAK;gCAC/B;gCACAX,SAASgB;4BACX;;sCAEF,KAACrB;4BACCwB,SAAS;gCACP,MAAMH,cAAcpB,QAAQG,UAAU,CAACkB;oCACrCA,MAAMG,MAAM,CAACd,OAAO;gCACtB;gCACAN,SAASgB;4BACX;4BACAK,UAAUpB;sCAEV,cAAA,KAACJ;;;mBA1BOS;0BA8Bd,KAACZ;gBACCe,WAAW;gBACXa,OAAM;gBACNC,SAAQ;gBACRJ,SAAS;oBACP,MAAMH,cAAcpB,QAAQG,UAAU,CAACkB;wBACrCA,MAAMO,IAAI,CAAC;oBACb;oBACAxB,SAASgB;gBACX;gBACAK,UAAUpB;0BACX;;;;AAKP"}

package/lib/variables/index.d.ts

@@ -0,0 +1,7 @@
+export * from './loki-variables';
+export * from './LokiLabelNamesVariable';
+export * from './LokiLabelValuesVariable';
+export * from './LokiLogQLVariable';
+export * from './MatcherEditor';
+export * from './types';
+//# sourceMappingURL=index.d.ts.map

package/lib/variables/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/variables/index.ts"],"names":[],"mappings":"AAaA,cAAc,kBAAkB,CAAC;AACjC,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC"}

package/lib/variables/index.js

@@ -0,0 +1,20 @@
+// 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.
+export * from './loki-variables';
+export * from './LokiLabelNamesVariable';
+export * from './LokiLabelValuesVariable';
+export * from './LokiLogQLVariable';
+export * from './MatcherEditor';
+export * from './types';
+
+//# sourceMappingURL=index.js.map

package/lib/variables/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/variables/index.ts"],"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\nexport * from './loki-variables';\nexport * from './LokiLabelNamesVariable';\nexport * from './LokiLabelValuesVariable';\nexport * from './LokiLogQLVariable';\nexport * from './MatcherEditor';\nexport * from './types';\n"],"names":[],"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,cAAc,mBAAmB;AACjC,cAAc,2BAA2B;AACzC,cAAc,4BAA4B;AAC1C,cAAc,sBAAsB;AACpC,cAAc,kBAAkB;AAChC,cAAc,UAAU"}

package/lib/variables/loki-variables.d.ts

@@ -0,0 +1,13 @@
+import { OptionsEditorProps, VariableOption } from '@perses-dev/plugin-system';
+import { ReactElement } from 'react';
+import { LokiStreamResult } from '../model';
+import { LokiLabelNamesVariableOptions, LokiLabelValuesVariableOptions, LokiLogQLVariableOptions } from './types';
+export declare function LokiLabelValuesVariableEditor(props: OptionsEditorProps<LokiLabelValuesVariableOptions>): ReactElement;
+export declare function LokiLabelNamesVariableEditor(props: OptionsEditorProps<LokiLabelNamesVariableOptions>): ReactElement;
+export declare function LokiLogQLVariableEditor(props: OptionsEditorProps<LokiLogQLVariableOptions>): ReactElement;
+export declare function capturingMetric(results: Array<{
+    metric: Record<string, string>;
+}>, labelName: string): string[];
+export declare function capturingStreams(results: LokiStreamResult[], labelName: string): string[];
+export declare const stringArrayToVariableOptions: (values?: string[]) => VariableOption[];
+//# sourceMappingURL=loki-variables.d.ts.map

package/lib/variables/loki-variables.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loki-variables.d.ts","sourceRoot":"","sources":["../../../src/variables/loki-variables.tsx"],"names":[],"mappings":"AAcA,OAAO,EAIL,kBAAkB,EAGlB,cAAc,EACf,MAAM,2BAA2B,CAAC;AAEnC,OAAO,EAAE,YAAY,EAAwC,MAAM,OAAO,CAAC;AAE3E,OAAO,EAOL,gBAAgB,EACjB,MAAM,UAAU,CAAC;AAElB,OAAO,EACL,6BAA6B,EAC7B,8BAA8B,EAC9B,wBAAwB,EAEzB,MAAM,SAAS,CAAC;AAyBjB,wBAAgB,6BAA6B,CAAC,KAAK,EAAE,kBAAkB,CAAC,8BAA8B,CAAC,GAAG,YAAY,CA8DrH;AAED,wBAAgB,4BAA4B,CAAC,KAAK,EAAE,kBAAkB,CAAC,6BAA6B,CAAC,GAAG,YAAY,CAwCnH;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,kBAAkB,CAAC,wBAAwB,CAAC,GAAG,YAAY,CAsEzG;AAED,wBAAgB,eAAe,CAAC,OAAO,EAAE,KAAK,CAAC;IAAE,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;CAAE,CAAC,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,EAAE,CAS/G;AAED,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,gBAAgB,EAAE,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,EAAE,CASzF;AAED,eAAO,MAAM,4BAA4B,GAAI,SAAS,MAAM,EAAE,KAAG,cAAc,EAM9E,CAAC"}

package/lib/variables/loki-variables.js

@@ -0,0 +1,211 @@
+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.
+// 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 { FormControl, Stack, TextField } from '@mui/material';
+import { DatasourceSelect, isVariableDatasource, useDatasourceClient, useDatasourceSelectValueToSelector } from '@perses-dev/plugin-system';
+import { produce } from 'immer';
+import { useCallback } from 'react';
+import { LogQLEditor } from '../components';
+import { DEFAULT_LOKI, isDefaultLokiSelector, isLokiDatasourceSelector, LOKI_DATASOURCE_KIND } from '../model';
+import { MatcherEditor } from './MatcherEditor';
+const EMPTY_MATCHERS = [];
+function useLokiDatasourceChangeHandler(value, onChange) {
+    return useCallback((next)=>{
+        if (isVariableDatasource(next) || isLokiDatasourceSelector(next)) {
+            // If they're using the default, just omit the datasource prop
+            onChange(produce(value, (draft)=>{
+                draft.datasource = !isVariableDatasource(next) && isDefaultLokiSelector(next) ? undefined : next;
+            }));
+            return;
+        }
+        throw new Error('Got unexpected non-Loki datasource selector');
+    }, [
+        onChange,
+        value
+    ]);
+}
+export function LokiLabelValuesVariableEditor(props) {
+    const { onChange, value, value: { datasource } } = props;
+    const selectedDatasource = datasource ?? DEFAULT_LOKI;
+    const handleDatasourceChange = useLokiDatasourceChangeHandler(value, onChange);
+    const handleLabelChange = useCallback((e)=>{
+        onChange(produce(value, (draft)=>{
+            draft.labelName = e.target.value;
+        }));
+    }, [
+        onChange,
+        value
+    ]);
+    const handleMatchEditorsChange = useCallback((matchers)=>{
+        onChange(produce(value, (draft)=>{
+            draft.matchers = matchers;
+        }));
+    }, [
+        onChange,
+        value
+    ]);
+    return /*#__PURE__*/ _jsxs(Stack, {
+        spacing: 2,
+        children: [
+            /*#__PURE__*/ _jsx(FormControl, {
+                margin: "dense",
+                children: /*#__PURE__*/ _jsx(DatasourceSelect, {
+                    datasourcePluginKind: LOKI_DATASOURCE_KIND,
+                    value: selectedDatasource,
+                    onChange: handleDatasourceChange,
+                    disabled: props.isReadonly,
+                    labelId: "loki-datasource-label",
+                    label: "Loki Datasource"
+                })
+            }),
+            /*#__PURE__*/ _jsx(TextField, {
+                label: "Label Name",
+                required: true,
+                value: props.value.labelName,
+                onChange: handleLabelChange,
+                slotProps: {
+                    input: {
+                        readOnly: props.isReadonly
+                    }
+                }
+            }),
+            /*#__PURE__*/ _jsx(MatcherEditor, {
+                matchers: props.value.matchers ?? EMPTY_MATCHERS,
+                onChange: handleMatchEditorsChange,
+                isReadonly: props.isReadonly
+            })
+        ]
+    });
+}
+export function LokiLabelNamesVariableEditor(props) {
+    const { onChange, value, value: { datasource } } = props;
+    const selectedDatasource = datasource ?? DEFAULT_LOKI;
+    const handleDatasourceChange = useLokiDatasourceChangeHandler(value, onChange);
+    const handleMatchEditorChange = useCallback((matchers)=>{
+        onChange(produce(value, (draft)=>{
+            draft.matchers = matchers;
+        }));
+    }, [
+        onChange,
+        value
+    ]);
+    return /*#__PURE__*/ _jsxs(Stack, {
+        spacing: 2,
+        children: [
+            /*#__PURE__*/ _jsx(FormControl, {
+                margin: "dense",
+                children: /*#__PURE__*/ _jsx(DatasourceSelect, {
+                    datasourcePluginKind: LOKI_DATASOURCE_KIND,
+                    value: selectedDatasource,
+                    onChange: handleDatasourceChange,
+                    disabled: props.isReadonly,
+                    labelId: "loki-datasource-label",
+                    label: "Loki Datasource"
+                })
+            }),
+            /*#__PURE__*/ _jsx(MatcherEditor, {
+                matchers: props.value.matchers ?? EMPTY_MATCHERS,
+                isReadonly: props.isReadonly,
+                onChange: handleMatchEditorChange
+            })
+        ]
+    });
+}
+export function LokiLogQLVariableEditor(props) {
+    const { onChange, value, value: { datasource } } = props;
+    const datasourceSelectValue = datasource ?? DEFAULT_LOKI;
+    const selectedDatasource = useDatasourceSelectValueToSelector(datasourceSelectValue, LOKI_DATASOURCE_KIND);
+    const { data: client } = useDatasourceClient(selectedDatasource);
+    const handleDatasourceChange = useLokiDatasourceChangeHandler(value, onChange);
+    const handleOnBlurLogQLChange = useCallback((e)=>{
+        onChange(produce(value, (draft)=>{
+            draft.expr = e.target.textContent ?? '';
+        }));
+    }, [
+        onChange,
+        value
+    ]);
+    const handleLabelNameChange = useCallback((e)=>{
+        onChange(produce(value, (draft)=>{
+            draft.labelName = e.target.value;
+        }));
+    }, [
+        onChange,
+        value
+    ]);
+    return /*#__PURE__*/ _jsxs(Stack, {
+        spacing: 2,
+        children: [
+            /*#__PURE__*/ _jsx(FormControl, {
+                margin: "dense",
+                children: /*#__PURE__*/ _jsx(DatasourceSelect, {
+                    datasourcePluginKind: LOKI_DATASOURCE_KIND,
+                    value: datasourceSelectValue,
+                    onChange: handleDatasourceChange,
+                    labelId: "loki-datasource-label",
+                    label: "Loki Datasource",
+                    disabled: props.isReadonly
+                })
+            }),
+            /*#__PURE__*/ _jsx(LogQLEditor, {
+                completionConfig: client ? {
+                    client
+                } : undefined,
+                value: value.expr,
+                onBlur: handleOnBlurLogQLChange,
+                readOnly: props.isReadonly,
+                width: "100%"
+            }),
+            /*#__PURE__*/ _jsx(TextField, {
+                label: "Label Name",
+                required: true,
+                value: props.value.labelName,
+                slotProps: {
+                    input: {
+                        readOnly: props.isReadonly
+                    }
+                },
+                onChange: handleLabelNameChange
+            })
+        ]
+    });
+}
+export function capturingMetric(results, labelName) {
+    const captured = new Set();
+    for (const sample of results){
+        const value = sample.metric[labelName];
+        if (value !== undefined) {
+            captured.add(value);
+        }
+    }
+    return Array.from(captured);
+}
+export function capturingStreams(results, labelName) {
+    const captured = new Set();
+    for (const sample of results){
+        const value = sample.stream[labelName];
+        if (value !== undefined) {
+            captured.add(value);
+        }
+    }
+    return Array.from(captured);
+}
+export const stringArrayToVariableOptions = (values)=>{
+    if (!values) return [];
+    return values.map((value)=>({
+            value,
+            label: value
+        }));
+};
+
+//# sourceMappingURL=loki-variables.js.map

package/lib/variables/loki-variables.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/variables/loki-variables.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 { FormControl, Stack, TextField } from '@mui/material';\nimport {\n  DatasourceSelect,\n  DatasourceSelectProps,\n  isVariableDatasource,\n  OptionsEditorProps,\n  useDatasourceClient,\n  useDatasourceSelectValueToSelector,\n  VariableOption,\n} from '@perses-dev/plugin-system';\nimport { produce } from 'immer';\nimport { ReactElement, useCallback, ChangeEvent, FocusEvent } from 'react';\nimport { LogQLEditor } from '../components';\nimport {\n  DEFAULT_LOKI,\n  isDefaultLokiSelector,\n  isLokiDatasourceSelector,\n  LOKI_DATASOURCE_KIND,\n  LokiDatasourceSelector,\n  LokiClient,\n  LokiStreamResult,\n} from '../model';\nimport { MatcherEditor } from './MatcherEditor';\nimport {\n  LokiLabelNamesVariableOptions,\n  LokiLabelValuesVariableOptions,\n  LokiLogQLVariableOptions,\n  LokiVariableOptionsBase,\n} from './types';\n\nconst EMPTY_MATCHERS: string[] = [];\n\nfunction useLokiDatasourceChangeHandler<T extends LokiVariableOptionsBase>(\n  value: T,\n  onChange: (value: T) => void\n): DatasourceSelectProps['onChange'] {\n  return useCallback(\n    (next) => {\n      if (isVariableDatasource(next) || isLokiDatasourceSelector(next)) {\n        // If they're using the default, just omit the datasource prop\n        onChange(\n          produce(value, (draft) => {\n            draft.datasource = !isVariableDatasource(next) && isDefaultLokiSelector(next) ? undefined : next;\n          })\n        );\n        return;\n      }\n      throw new Error('Got unexpected non-Loki datasource selector');\n    },\n    [onChange, value]\n  );\n}\n\nexport function LokiLabelValuesVariableEditor(props: OptionsEditorProps<LokiLabelValuesVariableOptions>): ReactElement {\n  const {\n    onChange,\n    value,\n    value: { datasource },\n  } = props;\n  const selectedDatasource = datasource ?? DEFAULT_LOKI;\n\n  const handleDatasourceChange = useLokiDatasourceChangeHandler(value, onChange);\n\n  const handleLabelChange = useCallback(\n    (e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      onChange(\n        produce(value, (draft) => {\n          draft.labelName = e.target.value;\n        })\n      );\n    },\n    [onChange, value]\n  );\n\n  const handleMatchEditorsChange = useCallback(\n    (matchers: string[]) => {\n      onChange(\n        produce(value, (draft) => {\n          draft.matchers = matchers;\n        })\n      );\n    },\n    [onChange, value]\n  );\n\n  return (\n    <Stack spacing={2}>\n      <FormControl margin=\"dense\">\n        <DatasourceSelect\n          datasourcePluginKind={LOKI_DATASOURCE_KIND}\n          value={selectedDatasource}\n          onChange={handleDatasourceChange}\n          disabled={props.isReadonly}\n          labelId=\"loki-datasource-label\"\n          label=\"Loki Datasource\"\n        />\n      </FormControl>\n      <TextField\n        label=\"Label Name\"\n        required\n        value={props.value.labelName}\n        onChange={handleLabelChange}\n        slotProps={{\n          input: {\n            readOnly: props.isReadonly,\n          },\n        }}\n      />\n      <MatcherEditor\n        matchers={props.value.matchers ?? EMPTY_MATCHERS}\n        onChange={handleMatchEditorsChange}\n        isReadonly={props.isReadonly}\n      />\n    </Stack>\n  );\n}\n\nexport function LokiLabelNamesVariableEditor(props: OptionsEditorProps<LokiLabelNamesVariableOptions>): ReactElement {\n  const {\n    onChange,\n    value,\n    value: { datasource },\n  } = props;\n\n  const selectedDatasource = datasource ?? DEFAULT_LOKI;\n  const handleDatasourceChange = useLokiDatasourceChangeHandler(value, onChange);\n\n  const handleMatchEditorChange = useCallback(\n    (matchers: string[]) => {\n      onChange(\n        produce(value, (draft) => {\n          draft.matchers = matchers;\n        })\n      );\n    },\n    [onChange, value]\n  );\n\n  return (\n    <Stack spacing={2}>\n      <FormControl margin=\"dense\">\n        <DatasourceSelect\n          datasourcePluginKind={LOKI_DATASOURCE_KIND}\n          value={selectedDatasource}\n          onChange={handleDatasourceChange}\n          disabled={props.isReadonly}\n          labelId=\"loki-datasource-label\"\n          label=\"Loki Datasource\"\n        />\n      </FormControl>\n      <MatcherEditor\n        matchers={props.value.matchers ?? EMPTY_MATCHERS}\n        isReadonly={props.isReadonly}\n        onChange={handleMatchEditorChange}\n      />\n    </Stack>\n  );\n}\n\nexport function LokiLogQLVariableEditor(props: OptionsEditorProps<LokiLogQLVariableOptions>): ReactElement {\n  const {\n    onChange,\n    value,\n    value: { datasource },\n  } = props;\n  const datasourceSelectValue = datasource ?? DEFAULT_LOKI;\n  const selectedDatasource = useDatasourceSelectValueToSelector(\n    datasourceSelectValue,\n    LOKI_DATASOURCE_KIND\n  ) as LokiDatasourceSelector;\n\n  const { data: client } = useDatasourceClient<LokiClient>(selectedDatasource);\n\n  const handleDatasourceChange = useLokiDatasourceChangeHandler(value, onChange);\n\n  const handleOnBlurLogQLChange = useCallback(\n    (e: FocusEvent<HTMLDivElement>) => {\n      onChange(\n        produce(value, (draft) => {\n          draft.expr = e.target.textContent ?? '';\n        })\n      );\n    },\n    [onChange, value]\n  );\n\n  const handleLabelNameChange = useCallback(\n    (e: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n      onChange(\n        produce(value, (draft) => {\n          draft.labelName = e.target.value;\n        })\n      );\n    },\n    [onChange, value]\n  );\n\n  return (\n    <Stack spacing={2}>\n      <FormControl margin=\"dense\">\n        <DatasourceSelect\n          datasourcePluginKind={LOKI_DATASOURCE_KIND}\n          value={datasourceSelectValue}\n          onChange={handleDatasourceChange}\n          labelId=\"loki-datasource-label\"\n          label=\"Loki Datasource\"\n          disabled={props.isReadonly}\n        />\n      </FormControl>\n      <LogQLEditor\n        completionConfig={client ? { client } : undefined}\n        value={value.expr}\n        onBlur={handleOnBlurLogQLChange}\n        readOnly={props.isReadonly}\n        width=\"100%\"\n      />\n      <TextField\n        label=\"Label Name\"\n        required\n        value={props.value.labelName}\n        slotProps={{\n          input: {\n            readOnly: props.isReadonly,\n          },\n        }}\n        onChange={handleLabelNameChange}\n      />\n    </Stack>\n  );\n}\n\nexport function capturingMetric(results: Array<{ metric: Record<string, string> }>, labelName: string): string[] {\n  const captured = new Set<string>();\n  for (const sample of results) {\n    const value = sample.metric[labelName];\n    if (value !== undefined) {\n      captured.add(value);\n    }\n  }\n  return Array.from(captured);\n}\n\nexport function capturingStreams(results: LokiStreamResult[], labelName: string): string[] {\n  const captured = new Set<string>();\n  for (const sample of results) {\n    const value = sample.stream[labelName];\n    if (value !== undefined) {\n      captured.add(value);\n    }\n  }\n  return Array.from(captured);\n}\n\nexport const stringArrayToVariableOptions = (values?: string[]): VariableOption[] => {\n  if (!values) return [];\n  return values.map((value) => ({\n    value,\n    label: value,\n  }));\n};\n"],"names":["FormControl","Stack","TextField","DatasourceSelect","isVariableDatasource","useDatasourceClient","useDatasourceSelectValueToSelector","produce","useCallback","LogQLEditor","DEFAULT_LOKI","isDefaultLokiSelector","isLokiDatasourceSelector","LOKI_DATASOURCE_KIND","MatcherEditor","EMPTY_MATCHERS","useLokiDatasourceChangeHandler","value","onChange","next","draft","datasource","undefined","Error","LokiLabelValuesVariableEditor","props","selectedDatasource","handleDatasourceChange","handleLabelChange","e","labelName","target","handleMatchEditorsChange","matchers","spacing","margin","datasourcePluginKind","disabled","isReadonly","labelId","label","required","slotProps","input","readOnly","LokiLabelNamesVariableEditor","handleMatchEditorChange","LokiLogQLVariableEditor","datasourceSelectValue","data","client","handleOnBlurLogQLChange","expr","textContent","handleLabelNameChange","completionConfig","onBlur","width","capturingMetric","results","captured","Set","sample","metric","add","Array","from","capturingStreams","stream","stringArrayToVariableOptions","values","map"],"mappings":"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"}

package/lib/variables/types.d.ts

@@ -0,0 +1,17 @@
+import { DatasourceSelectValue } from '@perses-dev/plugin-system';
+import { LokiDatasourceSelector } from '../model/loki-selectors';
+export interface LokiVariableOptionsBase {
+    datasource?: DatasourceSelectValue<LokiDatasourceSelector>;
+}
+export type LokiLabelNamesVariableOptions = LokiVariableOptionsBase & {
+    matchers?: string[];
+};
+export type LokiLabelValuesVariableOptions = LokiVariableOptionsBase & {
+    labelName: string;
+    matchers?: string[];
+};
+export type LokiLogQLVariableOptions = LokiVariableOptionsBase & {
+    expr: string;
+    labelName: string;
+};
+//# sourceMappingURL=types.d.ts.map

package/lib/variables/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/variables/types.ts"],"names":[],"mappings":"AAaA,OAAO,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAClE,OAAO,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AAEjE,MAAM,WAAW,uBAAuB;IACtC,UAAU,CAAC,EAAE,qBAAqB,CAAC,sBAAsB,CAAC,CAAC;CAC5D;AAED,MAAM,MAAM,6BAA6B,GAAG,uBAAuB,GAAG;IACpE,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG,uBAAuB,GAAG;IACrE,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,uBAAuB,GAAG;IAC/D,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC"}

package/lib/variables/types.js

@@ -0,0 +1,15 @@
+// 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.
+export { };
+
+//# sourceMappingURL=types.js.map

package/lib/variables/types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/variables/types.ts"],"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 { DatasourceSelectValue } from '@perses-dev/plugin-system';\nimport { LokiDatasourceSelector } from '../model/loki-selectors';\n\nexport interface LokiVariableOptionsBase {\n  datasource?: DatasourceSelectValue<LokiDatasourceSelector>;\n}\n\nexport type LokiLabelNamesVariableOptions = LokiVariableOptionsBase & {\n  matchers?: string[];\n};\n\nexport type LokiLabelValuesVariableOptions = LokiVariableOptionsBase & {\n  labelName: string;\n  matchers?: string[];\n};\n\nexport type LokiLogQLVariableOptions = LokiVariableOptionsBase & {\n  expr: string;\n  labelName: string;\n};\n"],"names":[],"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;AAkBjC,WAGE"}