@perses-dev/plugin-system 0.37.2 → 0.39.0

package/dist/cjs/runtime/DataQueriesProvider/model.js

@@ -14,3 +14,60 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    transformQueryResults: ()=>transformQueryResults,
+    useQueryType: ()=>useQueryType
+});
+const _react = require("react");
+const _pluginRegistry = require("../plugin-registry");
+function transformQueryResults(results, definitions) {
+    return results.map(({ data , isFetching , isLoading , refetch , error  }, i)=>{
+        return {
+            definition: definitions[i],
+            data,
+            isFetching,
+            isLoading,
+            refetch,
+            error
+        };
+    });
+}
+function useQueryType() {
+    const { data: timeSeriesQueryPlugins , isLoading  } = (0, _pluginRegistry.useListPluginMetadata)('TimeSeriesQuery');
+    const queryTypeMap = (0, _react.useMemo)(()=>{
+        const map = {
+            TimeSeriesQuery: []
+        };
+        if (timeSeriesQueryPlugins) {
+            timeSeriesQueryPlugins.forEach((plugin)=>{
+                var ref;
+                (ref = map['TimeSeriesQuery']) === null || ref === void 0 ? void 0 : ref.push(plugin.kind);
+            });
+        }
+        return map;
+    }, [
+        timeSeriesQueryPlugins
+    ]);
+    const getQueryType = (0, _react.useCallback)((pluginKind)=>{
+        if (isLoading) {
+            return undefined;
+        }
+        for(const queryType in queryTypeMap){
+            var ref;
+            if ((ref = queryTypeMap[queryType]) === null || ref === void 0 ? void 0 : ref.includes(pluginKind)) {
+                return queryType;
+            }
+        }
+        throw new Error(`Unable to determine the query type: ${pluginKind}`);
+    }, [
+        queryTypeMap,
+        isLoading
+    ]);
+    return getQueryType;
+}

package/dist/cjs/runtime/template-variables.js

@@ -21,12 +21,74 @@ function _export(target, all) {
     });
 }
 _export(exports, {
+    VariableStoreStateMap: ()=>VariableStoreStateMap,
     TemplateVariableContext: ()=>TemplateVariableContext,
     useTemplateVariableValues: ()=>useTemplateVariableValues,
     useReplaceVariablesInString: ()=>useReplaceVariablesInString
 });
 const _react = require("react");
+const _immer = require("immer");
 const _utils = require("../utils");
+let _immerable = _immer.immerable;
+class VariableStoreStateMap {
+    /**
+   * Get variable state by key.
+   * @param key
+   */ get(key) {
+        return this._sourceStatesOrEmpty(key.source)[key.name];
+    }
+    /**
+   * Set variable state by key.
+   * @param key
+   * @param value
+   */ set(key, value) {
+        const sourceName = this._sourceName(key.source);
+        if (!this._state[sourceName]) {
+            this._state[sourceName] = {};
+        }
+        this._sourceStatesOrEmpty(key.source)[key.name] = value;
+        return value;
+    }
+    /**
+   * Check presence of variable state by key.
+   * @param key
+   */ has(key) {
+        return this._sourceStatesOrEmpty(key.source)[key.name] !== undefined;
+    }
+    /**
+   * Delete variable state by key.
+   * @param key
+   */ delete(key) {
+        var ref;
+        const result = this.has(key);
+        const sourceName = this._sourceName(key.source);
+        const sourceStates = this._state[sourceName];
+        // Delete var from source state
+        if (sourceStates) {
+            delete sourceStates[key.name];
+        }
+        // Delete source state from state if empty
+        if (((ref = Object.keys(sourceStates !== null && sourceStates !== void 0 ? sourceStates : {})) === null || ref === void 0 ? void 0 : ref.length) === 0) {
+            delete this._state[sourceName];
+        }
+        return result;
+    }
+    _sourceName(source) {
+        return source !== null && source !== void 0 ? source : this.DEFAULT_LOCAL_SOURCE_NAME;
+    }
+    _sourceStatesOrEmpty(source) {
+        var ref;
+        return (ref = this._state[this._sourceName(source)]) !== null && ref !== void 0 ? ref : {};
+    }
+    constructor(){
+        /**
+   * "Immerable" is mandatory to be able to use this class in an immer context.
+   * Ref: https://docs.pmnd.rs/zustand/integrations/immer-middleware#gotchas
+   */ this[_immerable] = true;
+        this.DEFAULT_LOCAL_SOURCE_NAME = '';
+        this._state = {};
+    }
+}
 const TemplateVariableContext = (0, _react.createContext)(undefined);
 function useTemplateVariableContext() {
     const ctx = (0, _react.useContext)(TemplateVariableContext);

package/dist/cjs/test/index.js

@@ -15,6 +15,7 @@ Object.defineProperty(exports, "__esModule", {
     value: true
 });
 _exportStar(require("./render"), exports);
+_exportStar(require("./mock-data"), exports);
 function _exportStar(from, to) {
     Object.keys(from).forEach(function(k) {
         if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {

package/dist/cjs/test/mock-data.js

@@ -0,0 +1,55 @@
+// Copyright 2023 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "MOCK_TIME_SERIES_DATA", {
+    enumerable: true,
+    get: ()=>MOCK_TIME_SERIES_DATA
+});
+const MOCK_TIME_SERIES_DATA = {
+    timeRange: {
+        start: new Date(1666625490000),
+        end: new Date(1666625535000)
+    },
+    stepMs: 24379,
+    series: [
+        {
+            name: 'device="/dev/vda1", env="demo", fstype="ext4", instance="demo.do.prometheus.io:9100", job="node", mountpoint="/"',
+            values: [
+                [
+                    1666479357903,
+                    0.27700745551584494
+                ],
+                [
+                    1666479382282,
+                    0.27701284657366565
+                ]
+            ]
+        },
+        {
+            name: 'device="/dev/vda15", env="demo", fstype="vfat", instance="demo.do.prometheus.io:9100", job="node", mountpoint="/boot/efi"',
+            values: [
+                [
+                    1666479357903,
+                    0.08486496097624885
+                ],
+                [
+                    1666479382282,
+                    0.08486496097624885
+                ]
+            ]
+        }
+    ]
+};

package/dist/components/OptionsEditorRadios/OptionsEditorRadios.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+export declare type OptionsEditorRadio = {
+    label: string;
+    /**
+     * Content rendered when the tab is active.
+     */
+    content: React.ReactNode;
+};
+export declare type OptionsEditorRadiosProps = {
+    tabs: OptionsEditorRadio[];
+    defaultTab: number;
+    onModeChange: (value: number) => void;
+    isReadonly?: boolean;
+};
+export declare const OptionsEditorRadios: (props: OptionsEditorRadiosProps) => JSX.Element;
+//# sourceMappingURL=OptionsEditorRadios.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"OptionsEditorRadios.d.ts","sourceRoot":"","sources":["../../../src/components/OptionsEditorRadios/OptionsEditorRadios.tsx"],"names":[],"mappings":";AAiBA,oBAAY,kBAAkB,GAAG;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,CAAC;AAEF,oBAAY,wBAAwB,GAAG;IACrC,IAAI,EAAE,kBAAkB,EAAE,CAAC;IAC3B,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,mBAAmB,UAAW,wBAAwB,gBAuClE,CAAC"}

package/dist/components/OptionsEditorRadios/OptionsEditorRadios.js

@@ -0,0 +1,68 @@
+// Copyright 2023 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { FormControl, FormControlLabel, Radio, RadioGroup, Box, Typography } from '@mui/material';
+import { useState } from 'react';
+import { OptionsEditorTabPanel } from '../OptionsEditorTabPanel';
+export const OptionsEditorRadios = (props)=>{
+    const { tabs , defaultTab , onModeChange , isReadonly  } = props;
+    const [activeTab, setActiveTab] = useState(defaultTab);
+    const handleChange = (_, value)=>{
+        const v = parseInt(value);
+        setActiveTab(v);
+        onModeChange(v);
+    };
+    return /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            /*#__PURE__*/ _jsx(Box, {
+                sx: {
+                    borderBottom: 1,
+                    borderColor: (theme)=>theme.palette.divider
+                },
+                children: /*#__PURE__*/ _jsxs(FormControl, {
+                    children: [
+                        /*#__PURE__*/ _jsx(Typography, {
+                            variant: "overline",
+                            component: "h4",
+                            children: "Mode:"
+                        }),
+                        /*#__PURE__*/ _jsx(RadioGroup, {
+                            row: true,
+                            defaultValue: defaultTab,
+                            value: activeTab,
+                            onChange: handleChange,
+                            "aria-labelledby": "Configuration radio",
+                            children: tabs.map(({ label  }, i)=>{
+                                return /*#__PURE__*/ _jsx(FormControlLabel, {
+                                    disabled: isReadonly,
+                                    value: i,
+                                    control: /*#__PURE__*/ _jsx(Radio, {}),
+                                    label: label
+                                }, label);
+                            })
+                        })
+                    ]
+                })
+            }),
+            tabs.map(({ label , content  }, i)=>{
+                return /*#__PURE__*/ _jsx(OptionsEditorTabPanel, {
+                    value: activeTab,
+                    index: i,
+                    children: content
+                }, label);
+            })
+        ]
+    });
+};
+
+//# sourceMappingURL=OptionsEditorRadios.js.map

package/dist/components/OptionsEditorRadios/OptionsEditorRadios.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/OptionsEditorRadios/OptionsEditorRadios.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { FormControl, FormControlLabel, Radio, RadioGroup, RadioGroupProps, Box, Typography } from '@mui/material';\nimport { useState } from 'react';\nimport { OptionsEditorTabPanel } from '../OptionsEditorTabPanel';\n\nexport type OptionsEditorRadio = {\n  label: string;\n  /**\n   * Content rendered when the tab is active.\n   */\n  content: React.ReactNode;\n};\n\nexport type OptionsEditorRadiosProps = {\n  tabs: OptionsEditorRadio[];\n  defaultTab: number;\n  onModeChange: (value: number) => void;\n  isReadonly?: boolean;\n};\n\nexport const OptionsEditorRadios = (props: OptionsEditorRadiosProps) => {\n  const { tabs, defaultTab, onModeChange, isReadonly } = props;\n  const [activeTab, setActiveTab] = useState(defaultTab);\n\n  const handleChange: RadioGroupProps['onChange'] = (_, value) => {\n    const v = parseInt(value);\n    setActiveTab(v);\n    onModeChange(v);\n  };\n\n  return (\n    <>\n      <Box sx={{ borderBottom: 1, borderColor: (theme) => theme.palette.divider }}>\n        <FormControl>\n          <Typography variant=\"overline\" component=\"h4\">\n            Mode:\n          </Typography>\n          <RadioGroup\n            row\n            defaultValue={defaultTab}\n            value={activeTab}\n            onChange={handleChange}\n            aria-labelledby=\"Configuration radio\"\n          >\n            {tabs.map(({ label }, i) => {\n              return <FormControlLabel disabled={isReadonly} key={label} value={i} control={<Radio />} label={label} />;\n            })}\n          </RadioGroup>\n        </FormControl>\n      </Box>\n      {tabs.map(({ label, content }, i) => {\n        return (\n          <OptionsEditorTabPanel key={label} value={activeTab} index={i}>\n            {content}\n          </OptionsEditorTabPanel>\n        );\n      })}\n    </>\n  );\n};\n"],"names":["FormControl","FormControlLabel","Radio","RadioGroup","Box","Typography","useState","OptionsEditorTabPanel","OptionsEditorRadios","props","tabs","defaultTab","onModeChange","isReadonly","activeTab","setActiveTab","handleChange","_","value","v","parseInt","sx","borderBottom","borderColor","theme","palette","divider","variant","component","row","defaultValue","onChange","aria-labelledby","map","label","i","disabled","control","content","index"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,WAAW,EAAEC,gBAAgB,EAAEC,KAAK,EAAEC,UAAU,EAAmBC,GAAG,EAAEC,UAAU,QAAQ,eAAe,CAAC;AACnH,SAASC,QAAQ,QAAQ,OAAO,CAAC;AACjC,SAASC,qBAAqB,QAAQ,0BAA0B,CAAC;AAiBjE,OAAO,MAAMC,mBAAmB,GAAG,CAACC,KAA+B,GAAK;IACtE,MAAM,EAAEC,IAAI,CAAA,EAAEC,UAAU,CAAA,EAAEC,YAAY,CAAA,EAAEC,UAAU,CAAA,EAAE,GAAGJ,KAAK,AAAC;IAC7D,MAAM,CAACK,SAAS,EAAEC,YAAY,CAAC,GAAGT,QAAQ,CAACK,UAAU,CAAC,AAAC;IAEvD,MAAMK,YAAY,GAAgC,CAACC,CAAC,EAAEC,KAAK,GAAK;QAC9D,MAAMC,CAAC,GAAGC,QAAQ,CAACF,KAAK,CAAC,AAAC;QAC1BH,YAAY,CAACI,CAAC,CAAC,CAAC;QAChBP,YAAY,CAACO,CAAC,CAAC,CAAC;IAClB,CAAC,AAAC;IAEF,qBACE;;0BACE,KAACf,GAAG;gBAACiB,EAAE,EAAE;oBAAEC,YAAY,EAAE,CAAC;oBAAEC,WAAW,EAAE,CAACC,KAAK,GAAKA,KAAK,CAACC,OAAO,CAACC,OAAO;iBAAE;0BACzE,cAAA,MAAC1B,WAAW;;sCACV,KAACK,UAAU;4BAACsB,OAAO,EAAC,UAAU;4BAACC,SAAS,EAAC,IAAI;sCAAC,OAE9C;0BAAa;sCACb,KAACzB,UAAU;4BACT0B,GAAG;4BACHC,YAAY,EAAEnB,UAAU;4BACxBO,KAAK,EAAEJ,SAAS;4BAChBiB,QAAQ,EAAEf,YAAY;4BACtBgB,iBAAe,EAAC,qBAAqB;sCAEpCtB,IAAI,CAACuB,GAAG,CAAC,CAAC,EAAEC,KAAK,CAAA,EAAE,EAAEC,CAAC,GAAK;gCAC1B,qBAAO,KAAClC,gBAAgB;oCAACmC,QAAQ,EAAEvB,UAAU;oCAAcK,KAAK,EAAEiB,CAAC;oCAAEE,OAAO,gBAAE,KAACnC,KAAK,KAAG;oCAAEgC,KAAK,EAAEA,KAAK;mCAAjDA,KAAK,CAAgD,CAAC;4BAC5G,CAAC,CAAC;0BACS;;kBACD;cACV;YACLxB,IAAI,CAACuB,GAAG,CAAC,CAAC,EAAEC,KAAK,CAAA,EAAEI,OAAO,CAAA,EAAE,EAAEH,CAAC,GAAK;gBACnC,qBACE,KAAC5B,qBAAqB;oBAAaW,KAAK,EAAEJ,SAAS;oBAAEyB,KAAK,EAAEJ,CAAC;8BAC1DG,OAAO;mBADkBJ,KAAK,CAET,CACxB;YACJ,CAAC,CAAC;;MACD,CACH;AACJ,CAAC,CAAC"}

package/dist/components/OptionsEditorRadios/index.d.ts

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

package/dist/components/OptionsEditorRadios/index.d.ts.map

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

package/dist/components/OptionsEditorRadios/index.js

@@ -0,0 +1,15 @@
+// Copyright 2023 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+export * from './OptionsEditorRadios';
+
+//# sourceMappingURL=index.js.map

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

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

package/dist/components/OptionsEditorTabPanel/OptionsEditorTabPanel.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+interface OptionsEditorTabPanelProps {
+    children: React.ReactNode;
+    index: number;
+    value: number;
+}
+export declare function OptionsEditorTabPanel(props: OptionsEditorTabPanelProps): JSX.Element;
+export {};
+//# sourceMappingURL=OptionsEditorTabPanel.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"OptionsEditorTabPanel.d.ts","sourceRoot":"","sources":["../../../src/components/OptionsEditorTabPanel/OptionsEditorTabPanel.tsx"],"names":[],"mappings":";AAeA,UAAU,0BAA0B;IAClC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,0BAA0B,eAgBtE"}

package/dist/components/{OptionsEditorTabs/TabPanel.js → OptionsEditorTabPanel/OptionsEditorTabPanel.js}

@@ -12,7 +12,7 @@
 // limitations under the License.
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Box } from '@mui/material';
-export function TabPanel(props) {
+export function OptionsEditorTabPanel(props) {
     const { children , value , index , ...other } = props;
     const isActive = value === index;
     return /*#__PURE__*/ _jsx("div", {
@@ -28,4 +28,4 @@ export function TabPanel(props) {
     });
 }
 
-//# sourceMappingURL=TabPanel.js.map
+//# sourceMappingURL=OptionsEditorTabPanel.js.map

package/dist/components/OptionsEditorTabPanel/OptionsEditorTabPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/OptionsEditorTabPanel/OptionsEditorTabPanel.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box } from '@mui/material';\n\ninterface OptionsEditorTabPanelProps {\n  children: React.ReactNode;\n  index: number;\n  value: number;\n}\n\nexport function OptionsEditorTabPanel(props: OptionsEditorTabPanelProps) {\n  const { children, value, index, ...other } = props;\n\n  const isActive = value === index;\n\n  return (\n    <div\n      role=\"tabpanel\"\n      hidden={!isActive}\n      id={`options-editor-tabpanel-${index}`}\n      aria-labelledby={`options-editor-tab-${index}`}\n      {...other}\n    >\n      {isActive && <Box mt={2}>{children}</Box>}\n    </div>\n  );\n}\n"],"names":["Box","OptionsEditorTabPanel","props","children","value","index","other","isActive","div","role","hidden","id","aria-labelledby","mt"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,GAAG,QAAQ,eAAe,CAAC;AAQpC,OAAO,SAASC,qBAAqB,CAACC,KAAiC,EAAE;IACvE,MAAM,EAAEC,QAAQ,CAAA,EAAEC,KAAK,CAAA,EAAEC,KAAK,CAAA,EAAE,GAAGC,KAAK,EAAE,GAAGJ,KAAK,AAAC;IAEnD,MAAMK,QAAQ,GAAGH,KAAK,KAAKC,KAAK,AAAC;IAEjC,qBACE,KAACG,KAAG;QACFC,IAAI,EAAC,UAAU;QACfC,MAAM,EAAE,CAACH,QAAQ;QACjBI,EAAE,EAAE,CAAC,wBAAwB,EAAEN,KAAK,CAAC,CAAC;QACtCO,iBAAe,EAAE,CAAC,mBAAmB,EAAEP,KAAK,CAAC,CAAC;QAC7C,GAAGC,KAAK;kBAERC,QAAQ,kBAAI,KAACP,GAAG;YAACa,EAAE,EAAE,CAAC;sBAAGV,QAAQ;UAAO;MACrC,CACN;AACJ,CAAC"}

package/dist/components/OptionsEditorTabPanel/index.d.ts

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

package/dist/components/OptionsEditorTabPanel/index.d.ts.map

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

package/dist/components/OptionsEditorTabPanel/index.js

@@ -0,0 +1,15 @@
+// Copyright 2023 The Perses Authors
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+// http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+export * from './OptionsEditorTabPanel';
+
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/OptionsEditorTabPanel/index.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nexport * from './OptionsEditorTabPanel';\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,yBAAyB,CAAC"}

package/dist/components/OptionsEditorTabs/OptionsEditorTabs.js

@@ -13,7 +13,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Tab, Tabs, Box } from '@mui/material';
 import { useState } from 'react';
-import { TabPanel } from './TabPanel';
+import { OptionsEditorTabPanel } from '../OptionsEditorTabPanel';
 export const OptionsEditorTabs = ({ tabs  })=>{
     const [activeTab, setActiveTab] = useState(0);
     const handleChange = (_, newValue)=>{
@@ -40,7 +40,7 @@ export const OptionsEditorTabs = ({ tabs  })=>{
                 })
             }),
             tabs.map(({ label , content  }, i)=>{
-                return /*#__PURE__*/ _jsx(TabPanel, {
+                return /*#__PURE__*/ _jsx(OptionsEditorTabPanel, {
                     value: activeTab,
                     index: i,
                     children: content

package/dist/components/OptionsEditorTabs/OptionsEditorTabs.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/OptionsEditorTabs/OptionsEditorTabs.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Tab, Tabs, TabsProps, Box } from '@mui/material';\nimport { useState } from 'react';\nimport { TabPanel } from './TabPanel';\n\nexport type OptionsEditorTab = {\n  label: string;\n  /**\n   * Content rendered when the tab is active.\n   */\n  content: React.ReactNode;\n};\n\nexport type OptionsEditorTabsProps = {\n  tabs: OptionsEditorTab[];\n};\n\nexport const OptionsEditorTabs = ({ tabs }: OptionsEditorTabsProps) => {\n  const [activeTab, setActiveTab] = useState(0);\n\n  const handleChange: TabsProps['onChange'] = (_, newValue) => {\n    setActiveTab(newValue);\n  };\n\n  return (\n    <>\n      <Box sx={{ borderBottom: 1, borderColor: (theme) => theme.palette.divider }}>\n        <Tabs value={activeTab} onChange={handleChange} aria-label=\"Panel configuration tabs\">\n          {tabs.map(({ label }, i) => {\n            return (\n              <Tab\n                key={label}\n                label={label}\n                id={`options-editor-tab-${i}`}\n                aria-controls={`options-editor-tabpanel-${i}`}\n              />\n            );\n          })}\n        </Tabs>\n      </Box>\n      {tabs.map(({ label, content }, i) => {\n        return (\n          <TabPanel key={label} value={activeTab} index={i}>\n            {content}\n          </TabPanel>\n        );\n      })}\n    </>\n  );\n};\n"],"names":["Tab","Tabs","Box","useState","TabPanel","OptionsEditorTabs","tabs","activeTab","setActiveTab","handleChange","_","newValue","sx","borderBottom","borderColor","theme","palette","divider","value","onChange","aria-label","map","label","i","id","aria-controls","content","index"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,GAAG,EAAEC,IAAI,EAAaC,GAAG,QAAQ,eAAe,CAAC;AAC1D,SAASC,QAAQ,QAAQ,OAAO,CAAC;AACjC,SAASC,QAAQ,QAAQ,YAAY,CAAC;AActC,OAAO,MAAMC,iBAAiB,GAAG,CAAC,EAAEC,IAAI,CAAA,EAA0B,GAAK;IACrE,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGL,QAAQ,CAAC,CAAC,CAAC,AAAC;IAE9C,MAAMM,YAAY,GAA0B,CAACC,CAAC,EAAEC,QAAQ,GAAK;QAC3DH,YAAY,CAACG,QAAQ,CAAC,CAAC;IACzB,CAAC,AAAC;IAEF,qBACE;;0BACE,KAACT,GAAG;gBAACU,EAAE,EAAE;oBAAEC,YAAY,EAAE,CAAC;oBAAEC,WAAW,EAAE,CAACC,KAAK,GAAKA,KAAK,CAACC,OAAO,CAACC,OAAO;iBAAE;0BACzE,cAAA,KAAChB,IAAI;oBAACiB,KAAK,EAAEX,SAAS;oBAAEY,QAAQ,EAAEV,YAAY;oBAAEW,YAAU,EAAC,0BAA0B;8BAClFd,IAAI,CAACe,GAAG,CAAC,CAAC,EAAEC,KAAK,CAAA,EAAE,EAAEC,CAAC,GAAK;wBAC1B,qBACE,KAACvB,GAAG;4BAEFsB,KAAK,EAAEA,KAAK;4BACZE,EAAE,EAAE,CAAC,mBAAmB,EAAED,CAAC,CAAC,CAAC;4BAC7BE,eAAa,EAAE,CAAC,wBAAwB,EAAEF,CAAC,CAAC,CAAC;2BAHxCD,KAAK,CAIV,CACF;oBACJ,CAAC,CAAC;kBACG;cACH;YACLhB,IAAI,CAACe,GAAG,CAAC,CAAC,EAAEC,KAAK,CAAA,EAAEI,OAAO,CAAA,EAAE,EAAEH,CAAC,GAAK;gBACnC,qBACE,KAACnB,QAAQ;oBAAac,KAAK,EAAEX,SAAS;oBAAEoB,KAAK,EAAEJ,CAAC;8BAC7CG,OAAO;mBADKJ,KAAK,CAET,CACX;YACJ,CAAC,CAAC;;MACD,CACH;AACJ,CAAC,CAAC"}
+{"version":3,"sources":["../../../src/components/OptionsEditorTabs/OptionsEditorTabs.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Tab, Tabs, TabsProps, Box } from '@mui/material';\nimport { useState } from 'react';\nimport { OptionsEditorTabPanel } from '../OptionsEditorTabPanel';\n\nexport type OptionsEditorTab = {\n  label: string;\n  /**\n   * Content rendered when the tab is active.\n   */\n  content: React.ReactNode;\n};\n\nexport type OptionsEditorTabsProps = {\n  tabs: OptionsEditorTab[];\n};\n\nexport const OptionsEditorTabs = ({ tabs }: OptionsEditorTabsProps) => {\n  const [activeTab, setActiveTab] = useState(0);\n\n  const handleChange: TabsProps['onChange'] = (_, newValue) => {\n    setActiveTab(newValue);\n  };\n\n  return (\n    <>\n      <Box sx={{ borderBottom: 1, borderColor: (theme) => theme.palette.divider }}>\n        <Tabs value={activeTab} onChange={handleChange} aria-label=\"Panel configuration tabs\">\n          {tabs.map(({ label }, i) => {\n            return (\n              <Tab\n                key={label}\n                label={label}\n                id={`options-editor-tab-${i}`}\n                aria-controls={`options-editor-tabpanel-${i}`}\n              />\n            );\n          })}\n        </Tabs>\n      </Box>\n      {tabs.map(({ label, content }, i) => {\n        return (\n          <OptionsEditorTabPanel key={label} value={activeTab} index={i}>\n            {content}\n          </OptionsEditorTabPanel>\n        );\n      })}\n    </>\n  );\n};\n"],"names":["Tab","Tabs","Box","useState","OptionsEditorTabPanel","OptionsEditorTabs","tabs","activeTab","setActiveTab","handleChange","_","newValue","sx","borderBottom","borderColor","theme","palette","divider","value","onChange","aria-label","map","label","i","id","aria-controls","content","index"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,GAAG,EAAEC,IAAI,EAAaC,GAAG,QAAQ,eAAe,CAAC;AAC1D,SAASC,QAAQ,QAAQ,OAAO,CAAC;AACjC,SAASC,qBAAqB,QAAQ,0BAA0B,CAAC;AAcjE,OAAO,MAAMC,iBAAiB,GAAG,CAAC,EAAEC,IAAI,CAAA,EAA0B,GAAK;IACrE,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGL,QAAQ,CAAC,CAAC,CAAC,AAAC;IAE9C,MAAMM,YAAY,GAA0B,CAACC,CAAC,EAAEC,QAAQ,GAAK;QAC3DH,YAAY,CAACG,QAAQ,CAAC,CAAC;IACzB,CAAC,AAAC;IAEF,qBACE;;0BACE,KAACT,GAAG;gBAACU,EAAE,EAAE;oBAAEC,YAAY,EAAE,CAAC;oBAAEC,WAAW,EAAE,CAACC,KAAK,GAAKA,KAAK,CAACC,OAAO,CAACC,OAAO;iBAAE;0BACzE,cAAA,KAAChB,IAAI;oBAACiB,KAAK,EAAEX,SAAS;oBAAEY,QAAQ,EAAEV,YAAY;oBAAEW,YAAU,EAAC,0BAA0B;8BAClFd,IAAI,CAACe,GAAG,CAAC,CAAC,EAAEC,KAAK,CAAA,EAAE,EAAEC,CAAC,GAAK;wBAC1B,qBACE,KAACvB,GAAG;4BAEFsB,KAAK,EAAEA,KAAK;4BACZE,EAAE,EAAE,CAAC,mBAAmB,EAAED,CAAC,CAAC,CAAC;4BAC7BE,eAAa,EAAE,CAAC,wBAAwB,EAAEF,CAAC,CAAC,CAAC;2BAHxCD,KAAK,CAIV,CACF;oBACJ,CAAC,CAAC;kBACG;cACH;YACLhB,IAAI,CAACe,GAAG,CAAC,CAAC,EAAEC,KAAK,CAAA,EAAEI,OAAO,CAAA,EAAE,EAAEH,CAAC,GAAK;gBACnC,qBACE,KAACnB,qBAAqB;oBAAac,KAAK,EAAEX,SAAS;oBAAEoB,KAAK,EAAEJ,CAAC;8BAC1DG,OAAO;mBADkBJ,KAAK,CAET,CACxB;YACJ,CAAC,CAAC;;MACD,CACH;AACJ,CAAC,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"PluginEditor.d.ts","sourceRoot":"","sources":["../../../src/components/PluginEditor/PluginEditor.tsx"],"names":[],"mappings":";AAgBA,OAAO,EAAE,iBAAiB,EAAmB,MAAM,qBAAqB,CAAC;AAEzE;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,eAqBpD"}
+{"version":3,"file":"PluginEditor.d.ts","sourceRoot":"","sources":["../../../src/components/PluginEditor/PluginEditor.tsx"],"names":[],"mappings":";AAgBA,OAAO,EAAE,iBAAiB,EAAmB,MAAM,qBAAqB,CAAC;AAEzE;;;;;;;GAOG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,eA4BpD"}

package/dist/components/PluginEditor/PluginEditor.js

@@ -24,7 +24,7 @@ import { usePluginEditor } from './plugin-editor-api';
  * `usePluginEditor` hook that powers this component.
  */ export function PluginEditor(props) {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const { value , pluginType , pluginKindLabel , onChange: _ , ...others } = props;
+    const { value , pluginType , pluginKindLabel , onChange: _ , isReadonly , ...others } = props;
     const { pendingKind , isLoading , error , onKindChange , onSpecChange  } = usePluginEditor(props);
     var ref;
     return /*#__PURE__*/ _jsxs(Box, {
@@ -48,6 +48,7 @@ import { usePluginEditor } from './plugin-editor-api';
                         label: pluginKindLabel,
                         pluginType: pluginType,
                         value: pendingKind !== '' ? pendingKind : value.kind,
+                        readOnly: isReadonly,
                         onChange: onKindChange
                     }),
                     /*#__PURE__*/ _jsx(FormHelperText, {
@@ -59,7 +60,8 @@ import { usePluginEditor } from './plugin-editor-api';
                 pluginType: pluginType,
                 pluginKind: value.kind,
                 value: value.spec,
-                onChange: onSpecChange
+                onChange: onSpecChange,
+                isReadonly: isReadonly
             })
         ]
     });

package/dist/components/PluginEditor/PluginEditor.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PluginEditor/PluginEditor.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, FormControl, FormHelperText, InputLabel } from '@mui/material';\nimport { PluginKindSelect } from '../PluginKindSelect';\nimport { PluginSpecEditor } from '../PluginSpecEditor';\nimport { PluginEditorProps, usePluginEditor } from './plugin-editor-api';\n\n/**\n * A combination `PluginKindSelect` and `PluginSpecEditor` component. This is meant for editing the `plugin` property\n * that's common in our JSON specs where a user selects a plugin `kind` and then edits the `spec` via that plugin's\n * editor component. It takes care of transitioning from one plugin kind to another \"all at once\" so that when the\n * plugin's kind changes, the spec is also changed at the same time so those options editor components don't see a\n * previous plugin's spec state. If you just want this behavior, but in a different UI layout from this, try the\n * `usePluginEditor` hook that powers this component.\n */\nexport function PluginEditor(props: PluginEditorProps) {\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  const { value, pluginType, pluginKindLabel, onChange: _, ...others } = props;\n  const { pendingKind, isLoading, error, onKindChange, onSpecChange } = usePluginEditor(props);\n  return (\n    <Box {...others}>\n      <FormControl margin=\"dense\" fullWidth={false} disabled={isLoading} error={error !== null} sx={{ mb: 1 }}>\n        {/* TODO: How to ensure ids are unique? */}\n        <InputLabel id=\"plugin-kind-label\">{pluginKindLabel}</InputLabel>\n        <PluginKindSelect\n          labelId=\"plugin-kind-label\"\n          label={pluginKindLabel}\n          pluginType={pluginType}\n          value={pendingKind !== '' ? pendingKind : value.kind}\n          onChange={onKindChange}\n        />\n        <FormHelperText>{error?.message ?? ''}</FormHelperText>\n      </FormControl>\n      <PluginSpecEditor pluginType={pluginType} pluginKind={value.kind} value={value.spec} onChange={onSpecChange} />\n    </Box>\n  );\n}\n"],"names":["Box","FormControl","FormHelperText","InputLabel","PluginKindSelect","PluginSpecEditor","usePluginEditor","PluginEditor","props","value","pluginType","pluginKindLabel","onChange","_","others","pendingKind","isLoading","error","onKindChange","onSpecChange","margin","fullWidth","disabled","sx","mb","id","labelId","label","kind","message","pluginKind","spec"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,GAAG,EAAEC,WAAW,EAAEC,cAAc,EAAEC,UAAU,QAAQ,eAAe,CAAC;AAC7E,SAASC,gBAAgB,QAAQ,qBAAqB,CAAC;AACvD,SAASC,gBAAgB,QAAQ,qBAAqB,CAAC;AACvD,SAA4BC,eAAe,QAAQ,qBAAqB,CAAC;AAEzE;;;;;;;CAOC,GACD,OAAO,SAASC,YAAY,CAACC,KAAwB,EAAE;IACrD,6DAA6D;IAC7D,MAAM,EAAEC,KAAK,CAAA,EAAEC,UAAU,CAAA,EAAEC,eAAe,CAAA,EAAEC,QAAQ,EAAEC,CAAC,CAAA,EAAE,GAAGC,MAAM,EAAE,GAAGN,KAAK,AAAC;IAC7E,MAAM,EAAEO,WAAW,CAAA,EAAEC,SAAS,CAAA,EAAEC,KAAK,CAAA,EAAEC,YAAY,CAAA,EAAEC,YAAY,CAAA,EAAE,GAAGb,eAAe,CAACE,KAAK,CAAC,AAAC;QAatES,GAAc;IAZrC,qBACE,MAACjB,GAAG;QAAE,GAAGc,MAAM;;0BACb,MAACb,WAAW;gBAACmB,MAAM,EAAC,OAAO;gBAACC,SAAS,EAAE,KAAK;gBAAEC,QAAQ,EAAEN,SAAS;gBAAEC,KAAK,EAAEA,KAAK,KAAK,IAAI;gBAAEM,EAAE,EAAE;oBAAEC,EAAE,EAAE,CAAC;iBAAE;;kCAErG,KAACrB,UAAU;wBAACsB,EAAE,EAAC,mBAAmB;kCAAEd,eAAe;sBAAc;kCACjE,KAACP,gBAAgB;wBACfsB,OAAO,EAAC,mBAAmB;wBAC3BC,KAAK,EAAEhB,eAAe;wBACtBD,UAAU,EAAEA,UAAU;wBACtBD,KAAK,EAAEM,WAAW,KAAK,EAAE,GAAGA,WAAW,GAAGN,KAAK,CAACmB,IAAI;wBACpDhB,QAAQ,EAAEM,YAAY;sBACtB;kCACF,KAAChB,cAAc;kCAAEe,CAAAA,GAAc,GAAdA,KAAK,aAALA,KAAK,WAAS,GAAdA,KAAAA,CAAc,GAAdA,KAAK,CAAEY,OAAO,cAAdZ,GAAc,cAAdA,GAAc,GAAI,EAAE;sBAAkB;;cAC3C;0BACd,KAACZ,gBAAgB;gBAACK,UAAU,EAAEA,UAAU;gBAAEoB,UAAU,EAAErB,KAAK,CAACmB,IAAI;gBAAEnB,KAAK,EAAEA,KAAK,CAACsB,IAAI;gBAAEnB,QAAQ,EAAEO,YAAY;cAAI;;MAC3G,CACN;AACJ,CAAC"}
+{"version":3,"sources":["../../../src/components/PluginEditor/PluginEditor.tsx"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { Box, FormControl, FormHelperText, InputLabel } from '@mui/material';\nimport { PluginKindSelect } from '../PluginKindSelect';\nimport { PluginSpecEditor } from '../PluginSpecEditor';\nimport { PluginEditorProps, usePluginEditor } from './plugin-editor-api';\n\n/**\n * A combination `PluginKindSelect` and `PluginSpecEditor` component. This is meant for editing the `plugin` property\n * that's common in our JSON specs where a user selects a plugin `kind` and then edits the `spec` via that plugin's\n * editor component. It takes care of transitioning from one plugin kind to another \"all at once\" so that when the\n * plugin's kind changes, the spec is also changed at the same time so those options editor components don't see a\n * previous plugin's spec state. If you just want this behavior, but in a different UI layout from this, try the\n * `usePluginEditor` hook that powers this component.\n */\nexport function PluginEditor(props: PluginEditorProps) {\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  const { value, pluginType, pluginKindLabel, onChange: _, isReadonly, ...others } = props;\n  const { pendingKind, isLoading, error, onKindChange, onSpecChange } = usePluginEditor(props);\n  return (\n    <Box {...others}>\n      <FormControl margin=\"dense\" fullWidth={false} disabled={isLoading} error={error !== null} sx={{ mb: 1 }}>\n        {/* TODO: How to ensure ids are unique? */}\n        <InputLabel id=\"plugin-kind-label\">{pluginKindLabel}</InputLabel>\n        <PluginKindSelect\n          labelId=\"plugin-kind-label\"\n          label={pluginKindLabel}\n          pluginType={pluginType}\n          value={pendingKind !== '' ? pendingKind : value.kind}\n          readOnly={isReadonly}\n          onChange={onKindChange}\n        />\n        <FormHelperText>{error?.message ?? ''}</FormHelperText>\n      </FormControl>\n      <PluginSpecEditor\n        pluginType={pluginType}\n        pluginKind={value.kind}\n        value={value.spec}\n        onChange={onSpecChange}\n        isReadonly={isReadonly}\n      />\n    </Box>\n  );\n}\n"],"names":["Box","FormControl","FormHelperText","InputLabel","PluginKindSelect","PluginSpecEditor","usePluginEditor","PluginEditor","props","value","pluginType","pluginKindLabel","onChange","_","isReadonly","others","pendingKind","isLoading","error","onKindChange","onSpecChange","margin","fullWidth","disabled","sx","mb","id","labelId","label","kind","readOnly","message","pluginKind","spec"],"mappings":"AAAA,oCAAoC;AACpC,kEAAkE;AAClE,mEAAmE;AACnE,0CAA0C;AAC1C,EAAE;AACF,6CAA6C;AAC7C,EAAE;AACF,sEAAsE;AACtE,oEAAoE;AACpE,2EAA2E;AAC3E,sEAAsE;AACtE,iCAAiC;AAEjC;AAAA,SAASA,GAAG,EAAEC,WAAW,EAAEC,cAAc,EAAEC,UAAU,QAAQ,eAAe,CAAC;AAC7E,SAASC,gBAAgB,QAAQ,qBAAqB,CAAC;AACvD,SAASC,gBAAgB,QAAQ,qBAAqB,CAAC;AACvD,SAA4BC,eAAe,QAAQ,qBAAqB,CAAC;AAEzE;;;;;;;CAOC,GACD,OAAO,SAASC,YAAY,CAACC,KAAwB,EAAE;IACrD,6DAA6D;IAC7D,MAAM,EAAEC,KAAK,CAAA,EAAEC,UAAU,CAAA,EAAEC,eAAe,CAAA,EAAEC,QAAQ,EAAEC,CAAC,CAAA,EAAEC,UAAU,CAAA,EAAE,GAAGC,MAAM,EAAE,GAAGP,KAAK,AAAC;IACzF,MAAM,EAAEQ,WAAW,CAAA,EAAEC,SAAS,CAAA,EAAEC,KAAK,CAAA,EAAEC,YAAY,CAAA,EAAEC,YAAY,CAAA,EAAE,GAAGd,eAAe,CAACE,KAAK,CAAC,AAAC;QActEU,GAAc;IAbrC,qBACE,MAAClB,GAAG;QAAE,GAAGe,MAAM;;0BACb,MAACd,WAAW;gBAACoB,MAAM,EAAC,OAAO;gBAACC,SAAS,EAAE,KAAK;gBAAEC,QAAQ,EAAEN,SAAS;gBAAEC,KAAK,EAAEA,KAAK,KAAK,IAAI;gBAAEM,EAAE,EAAE;oBAAEC,EAAE,EAAE,CAAC;iBAAE;;kCAErG,KAACtB,UAAU;wBAACuB,EAAE,EAAC,mBAAmB;kCAAEf,eAAe;sBAAc;kCACjE,KAACP,gBAAgB;wBACfuB,OAAO,EAAC,mBAAmB;wBAC3BC,KAAK,EAAEjB,eAAe;wBACtBD,UAAU,EAAEA,UAAU;wBACtBD,KAAK,EAAEO,WAAW,KAAK,EAAE,GAAGA,WAAW,GAAGP,KAAK,CAACoB,IAAI;wBACpDC,QAAQ,EAAEhB,UAAU;wBACpBF,QAAQ,EAAEO,YAAY;sBACtB;kCACF,KAACjB,cAAc;kCAAEgB,CAAAA,GAAc,GAAdA,KAAK,aAALA,KAAK,WAAS,GAAdA,KAAAA,CAAc,GAAdA,KAAK,CAAEa,OAAO,cAAdb,GAAc,cAAdA,GAAc,GAAI,EAAE;sBAAkB;;cAC3C;0BACd,KAACb,gBAAgB;gBACfK,UAAU,EAAEA,UAAU;gBACtBsB,UAAU,EAAEvB,KAAK,CAACoB,IAAI;gBACtBpB,KAAK,EAAEA,KAAK,CAACwB,IAAI;gBACjBrB,QAAQ,EAAEQ,YAAY;gBACtBN,UAAU,EAAEA,UAAU;cACtB;;MACE,CACN;AACJ,CAAC"}

package/dist/components/PluginEditor/plugin-editor-api.d.ts

@@ -7,6 +7,7 @@ export interface PluginEditorProps extends Omit<BoxProps, OmittedMuiProps> {
     pluginType: PluginType;
     pluginKindLabel: string;
     value: Definition<UnknownSpec>;
+    isReadonly?: boolean;
     onChange: (next: Definition<UnknownSpec>) => void;
 }
 /**

package/dist/components/PluginEditor/plugin-editor-api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"plugin-editor-api.d.ts","sourceRoot":"","sources":["../../../src/components/PluginEditor/plugin-editor-api.ts"],"names":[],"mappings":";AAaA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,WAAW,EAAY,MAAM,kBAAkB,CAAC;AAGrE,OAAO,EAAe,UAAU,EAAE,MAAM,aAAa,CAAC;AAOtD,aAAK,eAAe,GAAG,UAAU,GAAG,OAAO,GAAG,UAAU,CAAC;AAEzD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,QAAQ,EAAE,eAAe,CAAC;IACxE,UAAU,EAAE,UAAU,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,CAAC;IAC/B,QAAQ,EAAE,CAAC,IAAI,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;CACnD;AAKD;;GAEG;AACH,oBAAY,oBAAoB,GAAG,IAAI,CAAC,iBAAiB,EAAE,YAAY,GAAG,OAAO,GAAG,UAAU,CAAC,GAAG;IAChG,uBAAuB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CACvD,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB;;;;;;;EAqG1D"}
+{"version":3,"file":"plugin-editor-api.d.ts","sourceRoot":"","sources":["../../../src/components/PluginEditor/plugin-editor-api.ts"],"names":[],"mappings":";AAaA,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,WAAW,EAAY,MAAM,kBAAkB,CAAC;AAGrE,OAAO,EAAe,UAAU,EAAE,MAAM,aAAa,CAAC;AAOtD,aAAK,eAAe,GAAG,UAAU,GAAG,OAAO,GAAG,UAAU,CAAC;AAEzD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,QAAQ,EAAE,eAAe,CAAC;IACxE,UAAU,EAAE,UAAU,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,KAAK,EAAE,UAAU,CAAC,WAAW,CAAC,CAAC;IAC/B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,EAAE,CAAC,IAAI,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;CACnD;AAKD;;GAEG;AACH,oBAAY,oBAAoB,GAAG,IAAI,CAAC,iBAAiB,EAAE,YAAY,GAAG,OAAO,GAAG,UAAU,CAAC,GAAG;IAChG,uBAAuB,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;CACvD,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB;;;;;;;EAqG1D"}

package/dist/components/PluginEditor/plugin-editor-api.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/PluginEditor/plugin-editor-api.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { BoxProps } from '@mui/material';\nimport { Definition, UnknownSpec, useEvent } from '@perses-dev/core';\nimport { useState, useRef, useEffect } from 'react';\nimport { produce } from 'immer';\nimport { PanelPlugin, PluginType } from '../../model';\nimport { PluginKindSelectProps } from '../PluginKindSelect/PluginKindSelect';\nimport { PluginSpecEditorProps } from '../PluginSpecEditor/PluginSpecEditor';\nimport { usePlugin, usePluginRegistry } from '../../runtime';\n\n// Props on MUI Box that we don't want people to pass because we're either redefining them or providing them in\n// this component\ntype OmittedMuiProps = 'children' | 'value' | 'onChange';\n\nexport interface PluginEditorProps extends Omit<BoxProps, OmittedMuiProps> {\n  pluginType: PluginType;\n  pluginKindLabel: string;\n  value: Definition<UnknownSpec>;\n  onChange: (next: Definition<UnknownSpec>) => void;\n}\n\ntype PreviousSpecState = Record<string, Record<string, UnknownSpec>>;\ntype HideQueryEditorState = Record<string, boolean>;\n\n/**\n * Props needed by the usePluginEditor hook.\n */\nexport type UsePluginEditorProps = Pick<PluginEditorProps, 'pluginType' | 'value' | 'onChange'> & {\n  onHideQueryEditorChange?: (isHidden: boolean) => void;\n};\n\n/**\n * Returns the state/handlers that power the `PluginEditor` component. Useful for custom components that want to provide\n * a different UI, but want the same behavior of changing `kind` and `spec` together on plugin kind changes. Also\n * remembers previous `spec` values that it's seen, allowing and restores those values if a user switches the plugin\n * kind back.\n */\nexport function usePluginEditor(props: UsePluginEditorProps) {\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  const { pluginType, value, onHideQueryEditorChange = () => {} } = props; // setting onHideQueryEditorChange to empty function here because useEvent requires a function\n\n  // Keep a stable reference so we don't run the effect below when we don't need to\n  const onChange = useEvent(props.onChange);\n  const onHideQuery = useEvent(onHideQueryEditorChange);\n\n  // The previous spec state for PluginType and kind and a helper function for remembering current values\n  const prevSpecState = useRef<PreviousSpecState>({\n    [pluginType]: { [value.kind]: value.spec },\n  });\n  const rememberCurrentSpecState = useEvent(() => {\n    let byPluginType = prevSpecState.current[pluginType];\n    if (byPluginType === undefined) {\n      byPluginType = {};\n      prevSpecState.current[pluginType] = byPluginType;\n    }\n    byPluginType[value.kind] = value.spec;\n  });\n\n  // The previous hide query state for each panel kind\n  const hideQueryState = useRef<HideQueryEditorState>({\n    [value.kind]: false,\n  });\n\n  const { defaultPluginKinds } = usePluginRegistry();\n  const defaultPluginKind = defaultPluginKinds?.[pluginType];\n  const initPendingKind = !value.kind && defaultPluginKind ? defaultPluginKind : '';\n\n  // When kind changes and we haven't loaded that plugin before, we will need to enter a \"pending\" state so that we\n  // can generate proper initial spec values that match the new plugin kind\n  const [pendingKind, setPendingKind] = useState(initPendingKind);\n  const { data: plugin, isFetching, error } = usePlugin(pluginType, pendingKind);\n\n  useEffect(() => {\n    // Nothing to do if no new plugin kind is pending\n    if (pendingKind === '') return;\n\n    // Can't get spec value until we have a plugin\n    if (plugin === undefined) return;\n\n    // Fire an onChange to change to the pending kind with initial values from the plugin\n    rememberCurrentSpecState();\n    onChange({\n      kind: pendingKind,\n      spec: plugin.createInitialOptions(),\n    });\n\n    if (pluginType === 'Panel') {\n      const panelPlugin = plugin as PanelPlugin;\n      hideQueryState.current[pendingKind] = !!panelPlugin.hideQueryEditor;\n      if (!!panelPlugin.hideQueryEditor !== hideQueryState.current[value.kind]) {\n        onHideQuery(!!panelPlugin.hideQueryEditor);\n      }\n    }\n\n    setPendingKind('');\n  }, [pendingKind, plugin, rememberCurrentSpecState, onChange, onHideQuery, hideQueryState, pluginType, value.kind]);\n\n  /**\n   * When the user tries to change the plugin kind, make sure we have the correct spec for that plugin kind before we\n   * make the switch.\n   */\n  const onKindChange: PluginKindSelectProps['onChange'] = (e) => {\n    const nextKind = e.target.value;\n\n    // If we already have state for this plugin type/kind from a previous selection, just use it\n    const previousState = prevSpecState.current[pluginType]?.[nextKind];\n    if (previousState !== undefined) {\n      rememberCurrentSpecState();\n      onChange({\n        kind: nextKind,\n        spec: previousState,\n      });\n    } else {\n      // Otherwise, kick off the async loading process\n      setPendingKind(nextKind);\n    }\n\n    if (\n      pluginType === 'Panel' &&\n      hideQueryState.current[nextKind] !== undefined &&\n      hideQueryState.current[value.kind] !== hideQueryState.current[nextKind]\n    ) {\n      onHideQuery(!!hideQueryState.current[nextKind]);\n    }\n  };\n\n  /**\n   * Spec changes are independent and always just set the spec state.\n   */\n  const onSpecChange: PluginSpecEditorProps['onChange'] = (next) => {\n    onChange(\n      produce(value, (draft) => {\n        draft.spec = next;\n      })\n    );\n  };\n\n  return { pendingKind, isLoading: isFetching, error, onKindChange, onSpecChange, rememberCurrentSpecState };\n}\n"],"names":["useEvent","useState","useRef","useEffect","produce","usePlugin","usePluginRegistry","usePluginEditor","props","pluginType","value","onHideQueryEditorChange","onChange","onHideQuery","prevSpecState","kind","spec","rememberCurrentSpecState","byPluginType","current","undefined","hideQueryState","defaultPluginKinds","defaultPluginKind","initPendingKind","pendingKind","setPendingKind","data","plugin","isFetching","error","createInitialOptions","panelPlugin","hideQueryEditor","onKindChange","e","nextKind","target","previousState","onSpecChange","next","draft","isLoading"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/PluginEditor/plugin-editor-api.ts"],"sourcesContent":["// Copyright 2023 The Perses Authors\n// Licensed under the Apache License, Version 2.0 (the \"License\");\n// you may not use this file except in compliance with the License.\n// You may obtain a copy of the License at\n//\n// http://www.apache.org/licenses/LICENSE-2.0\n//\n// Unless required by applicable law or agreed to in writing, software\n// distributed under the License is distributed on an \"AS IS\" BASIS,\n// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n// See the License for the specific language governing permissions and\n// limitations under the License.\n\nimport { BoxProps } from '@mui/material';\nimport { Definition, UnknownSpec, useEvent } from '@perses-dev/core';\nimport { useState, useRef, useEffect } from 'react';\nimport { produce } from 'immer';\nimport { PanelPlugin, PluginType } from '../../model';\nimport { PluginKindSelectProps } from '../PluginKindSelect/PluginKindSelect';\nimport { PluginSpecEditorProps } from '../PluginSpecEditor/PluginSpecEditor';\nimport { usePlugin, usePluginRegistry } from '../../runtime';\n\n// Props on MUI Box that we don't want people to pass because we're either redefining them or providing them in\n// this component\ntype OmittedMuiProps = 'children' | 'value' | 'onChange';\n\nexport interface PluginEditorProps extends Omit<BoxProps, OmittedMuiProps> {\n  pluginType: PluginType;\n  pluginKindLabel: string;\n  value: Definition<UnknownSpec>;\n  isReadonly?: boolean;\n  onChange: (next: Definition<UnknownSpec>) => void;\n}\n\ntype PreviousSpecState = Record<string, Record<string, UnknownSpec>>;\ntype HideQueryEditorState = Record<string, boolean>;\n\n/**\n * Props needed by the usePluginEditor hook.\n */\nexport type UsePluginEditorProps = Pick<PluginEditorProps, 'pluginType' | 'value' | 'onChange'> & {\n  onHideQueryEditorChange?: (isHidden: boolean) => void;\n};\n\n/**\n * Returns the state/handlers that power the `PluginEditor` component. Useful for custom components that want to provide\n * a different UI, but want the same behavior of changing `kind` and `spec` together on plugin kind changes. Also\n * remembers previous `spec` values that it's seen, allowing and restores those values if a user switches the plugin\n * kind back.\n */\nexport function usePluginEditor(props: UsePluginEditorProps) {\n  // eslint-disable-next-line @typescript-eslint/no-empty-function\n  const { pluginType, value, onHideQueryEditorChange = () => {} } = props; // setting onHideQueryEditorChange to empty function here because useEvent requires a function\n\n  // Keep a stable reference so we don't run the effect below when we don't need to\n  const onChange = useEvent(props.onChange);\n  const onHideQuery = useEvent(onHideQueryEditorChange);\n\n  // The previous spec state for PluginType and kind and a helper function for remembering current values\n  const prevSpecState = useRef<PreviousSpecState>({\n    [pluginType]: { [value.kind]: value.spec },\n  });\n  const rememberCurrentSpecState = useEvent(() => {\n    let byPluginType = prevSpecState.current[pluginType];\n    if (byPluginType === undefined) {\n      byPluginType = {};\n      prevSpecState.current[pluginType] = byPluginType;\n    }\n    byPluginType[value.kind] = value.spec;\n  });\n\n  // The previous hide query state for each panel kind\n  const hideQueryState = useRef<HideQueryEditorState>({\n    [value.kind]: false,\n  });\n\n  const { defaultPluginKinds } = usePluginRegistry();\n  const defaultPluginKind = defaultPluginKinds?.[pluginType];\n  const initPendingKind = !value.kind && defaultPluginKind ? defaultPluginKind : '';\n\n  // When kind changes and we haven't loaded that plugin before, we will need to enter a \"pending\" state so that we\n  // can generate proper initial spec values that match the new plugin kind\n  const [pendingKind, setPendingKind] = useState(initPendingKind);\n  const { data: plugin, isFetching, error } = usePlugin(pluginType, pendingKind);\n\n  useEffect(() => {\n    // Nothing to do if no new plugin kind is pending\n    if (pendingKind === '') return;\n\n    // Can't get spec value until we have a plugin\n    if (plugin === undefined) return;\n\n    // Fire an onChange to change to the pending kind with initial values from the plugin\n    rememberCurrentSpecState();\n    onChange({\n      kind: pendingKind,\n      spec: plugin.createInitialOptions(),\n    });\n\n    if (pluginType === 'Panel') {\n      const panelPlugin = plugin as PanelPlugin;\n      hideQueryState.current[pendingKind] = !!panelPlugin.hideQueryEditor;\n      if (!!panelPlugin.hideQueryEditor !== hideQueryState.current[value.kind]) {\n        onHideQuery(!!panelPlugin.hideQueryEditor);\n      }\n    }\n\n    setPendingKind('');\n  }, [pendingKind, plugin, rememberCurrentSpecState, onChange, onHideQuery, hideQueryState, pluginType, value.kind]);\n\n  /**\n   * When the user tries to change the plugin kind, make sure we have the correct spec for that plugin kind before we\n   * make the switch.\n   */\n  const onKindChange: PluginKindSelectProps['onChange'] = (e) => {\n    const nextKind = e.target.value;\n\n    // If we already have state for this plugin type/kind from a previous selection, just use it\n    const previousState = prevSpecState.current[pluginType]?.[nextKind];\n    if (previousState !== undefined) {\n      rememberCurrentSpecState();\n      onChange({\n        kind: nextKind,\n        spec: previousState,\n      });\n    } else {\n      // Otherwise, kick off the async loading process\n      setPendingKind(nextKind);\n    }\n\n    if (\n      pluginType === 'Panel' &&\n      hideQueryState.current[nextKind] !== undefined &&\n      hideQueryState.current[value.kind] !== hideQueryState.current[nextKind]\n    ) {\n      onHideQuery(!!hideQueryState.current[nextKind]);\n    }\n  };\n\n  /**\n   * Spec changes are independent and always just set the spec state.\n   */\n  const onSpecChange: PluginSpecEditorProps['onChange'] = (next) => {\n    onChange(\n      produce(value, (draft) => {\n        draft.spec = next;\n      })\n    );\n  };\n\n  return { pendingKind, isLoading: isFetching, error, onKindChange, onSpecChange, rememberCurrentSpecState };\n}\n"],"names":["useEvent","useState","useRef","useEffect","produce","usePlugin","usePluginRegistry","usePluginEditor","props","pluginType","value","onHideQueryEditorChange","onChange","onHideQuery","prevSpecState","kind","spec","rememberCurrentSpecState","byPluginType","current","undefined","hideQueryState","defaultPluginKinds","defaultPluginKind","initPendingKind","pendingKind","setPendingKind","data","plugin","isFetching","error","createInitialOptions","panelPlugin","hideQueryEditor","onKindChange","e","nextKind","target","previousState","onSpecChange","next","draft","isLoading"],"mappings":"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"}

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

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { VariableDefinition } from '@perses-dev/core';
+export declare type Action = 'create' | 'read' | 'update';
+interface VariableEditFormProps {
+    initialVariableDefinition: VariableDefinition;
+    onChange: (def: VariableDefinition) => void;
+    onCancel: () => void;
+    action?: Action;
+}
+export declare function VariableEditForm(props: VariableEditFormProps): JSX.Element;
+export {};
+//# sourceMappingURL=VariableEditorForm.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"VariableEditorForm.d.ts","sourceRoot":"","sources":["../../../../src/components/Variables/VariableEditorForm/VariableEditorForm.tsx"],"names":[],"mappings":";AAgCA,OAAO,EAAE,kBAAkB,EAA0B,MAAM,kBAAkB,CAAC;AA6B9E,oBAAY,MAAM,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,CAAC;AAElD,UAAU,qBAAqB;IAC7B,yBAAyB,EAAE,kBAAkB,CAAC;IAC9C,QAAQ,EAAE,CAAC,GAAG,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC5C,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,eAoT5D"}