@perses-dev/plugin-system 0.0.0-snapshot-panel-extra-content-3-17f9c42 → 0.0.0-snapshot-scatterplot-fix-imports-95e1b59

package/dist/cjs/components/LegendOptionsEditor/LegendOptionsEditor.js

@@ -16,9 +16,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "LegendOptionsEditor", {
     enumerable: true,
-    get: ()=>LegendOptionsEditor
+    get: function() {
+        return LegendOptionsEditor;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
+const _jsxruntime = require("react/jsx-runtime");
 const _material = require("@mui/material");
 const _core = require("@perses-dev/core");
 const _components = require("@perses-dev/components");
@@ -47,7 +49,7 @@ const VALUE_OPTIONS = Object.entries(_model.LEGEND_VALUE_CONFIG).map(([id, confi
         ...config
     };
 });
-function LegendOptionsEditor({ value , onChange  }) {
+function LegendOptionsEditor({ value, onChange }) {
     const handleLegendShowChange = (_, checked)=>{
         // legend is hidden when legend obj is undefined
         const legendValue = checked === true ? {
@@ -102,24 +104,24 @@ function LegendOptionsEditor({ value , onChange  }) {
         }
         return result;
     }, []);
-    return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
-            !isValidLegend && /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components.ErrorAlert, {
+            !isValidLegend && /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.ErrorAlert, {
                 error: {
                     name: 'invalid-legend',
                     message: 'Invalid legend spec'
                 }
             }),
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components.OptionsEditorControl, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorControl, {
                 label: "Show",
-                control: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Switch, {
+                control: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Switch, {
                     checked: value !== undefined,
                     onChange: handleLegendShowChange
                 })
             }),
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components.OptionsEditorControl, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorControl, {
                 label: "Position",
-                control: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components.SettingsAutocomplete, {
+                control: /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.SettingsAutocomplete, {
                     value: {
                         ...legendPositionConfig,
                         id: currentPosition
@@ -130,9 +132,9 @@ function LegendOptionsEditor({ value , onChange  }) {
                     disableClearable: true
                 })
             }),
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components.OptionsEditorControl, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorControl, {
                 label: "Mode",
-                control: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components.SettingsAutocomplete, {
+                control: /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.SettingsAutocomplete, {
                     value: {
                         ...legendModeConfig,
                         id: currentMode
@@ -143,9 +145,9 @@ function LegendOptionsEditor({ value , onChange  }) {
                     disableClearable: true
                 })
             }),
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components.OptionsEditorControl, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorControl, {
                 label: "Size",
-                control: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components.SettingsAutocomplete, {
+                control: /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.SettingsAutocomplete, {
                     value: {
                         ...legendSizeConfig,
                         id: currentSize
@@ -154,23 +156,23 @@ function LegendOptionsEditor({ value , onChange  }) {
                     onChange: handleLegendSizeChange,
                     // TODO: enable sizes for list mode when we normalize the layout of
                     // lists to more closely match tables.
-                    disabled: value === undefined || currentMode !== 'Table',
+                    disabled: value === undefined || currentMode !== 'table',
                     disableClearable: true
                 })
             }),
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components.OptionsEditorControl, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.OptionsEditorControl, {
                 label: "Values",
                 control: // For some reason, the inferred option type doesn't always seem to work
                 // quite right when `multiple` is true. Explicitly setting the generics
                 // to work around this.
-                /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components.SettingsAutocomplete, {
+                /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.SettingsAutocomplete, {
                     multiple: true,
                     disableCloseOnSelect: true,
                     disableClearable: true,
                     value: legendValuesConfig,
                     options: VALUE_OPTIONS,
                     onChange: handleLegendValueChange,
-                    disabled: value === undefined || currentMode !== 'Table',
+                    disabled: value === undefined || currentMode !== 'table',
                     limitTags: 1,
                     ChipProps: {
                         size: 'small'

package/dist/cjs/components/LegendOptionsEditor/index.js

@@ -14,15 +14,17 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-_exportStar(require("./LegendOptionsEditor"), exports);
-function _exportStar(from, to) {
+_export_star(require("./LegendOptionsEditor"), exports);
+function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {
-        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {
-            enumerable: true,
-            get: function() {
-                return from[k];
-            }
-        });
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
     });
     return from;
 }

package/dist/cjs/components/OptionsEditorRadios/OptionsEditorRadios.js

@@ -16,54 +16,49 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "OptionsEditorRadios", {
     enumerable: true,
-    get: ()=>OptionsEditorRadios
+    get: function() {
+        return OptionsEditorRadios;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
+const _jsxruntime = require("react/jsx-runtime");
 const _material = require("@mui/material");
 const _react = require("react");
-const _optionsEditorTabPanel = require("../OptionsEditorTabPanel");
+const _OptionsEditorTabPanel = require("../OptionsEditorTabPanel");
 const OptionsEditorRadios = (props)=>{
-    const { tabs , defaultTab , onModeChange , isReadonly  } = props;
+    const { tabs, defaultTab, onModeChange, isReadonly } = props;
     const [activeTab, setActiveTab] = (0, _react.useState)(defaultTab);
     const handleChange = (_, value)=>{
         const v = parseInt(value);
         setActiveTab(v);
         onModeChange(v);
     };
-    return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Box, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Box, {
                 sx: {
                     borderBottom: 1,
                     borderColor: (theme)=>theme.palette.divider
                 },
-                children: /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_material.FormControl, {
-                    children: [
-                        /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Typography, {
-                            variant: "overline",
-                            component: "h4",
-                            children: "Mode:"
-                        }),
-                        /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.RadioGroup, {
-                            row: true,
-                            defaultValue: defaultTab,
-                            value: activeTab,
-                            onChange: handleChange,
-                            "aria-labelledby": "Configuration radio",
-                            children: tabs.map(({ label  }, i)=>{
-                                return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.FormControlLabel, {
-                                    disabled: isReadonly,
-                                    value: i,
-                                    control: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Radio, {}),
-                                    label: label
-                                }, label);
-                            })
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.FormControl, {
+                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.RadioGroup, {
+                        row: true,
+                        defaultValue: defaultTab,
+                        value: activeTab,
+                        onChange: handleChange,
+                        "aria-labelledby": "Configuration radio",
+                        children: tabs.map(({ label }, i)=>{
+                            return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.FormControlLabel, {
+                                disabled: isReadonly,
+                                value: i,
+                                control: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Radio, {}),
+                                label: label
+                            }, label);
                         })
-                    ]
+                    })
                 })
             }),
-            tabs.map(({ label , content  }, i)=>{
-                return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_optionsEditorTabPanel.OptionsEditorTabPanel, {
+            tabs.map(({ label, content }, i)=>{
+                return /*#__PURE__*/ (0, _jsxruntime.jsx)(_OptionsEditorTabPanel.OptionsEditorTabPanel, {
                     value: activeTab,
                     index: i,
                     children: content

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

@@ -14,15 +14,17 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-_exportStar(require("./OptionsEditorRadios"), exports);
-function _exportStar(from, to) {
+_export_star(require("./OptionsEditorRadios"), exports);
+function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {
-        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {
-            enumerable: true,
-            get: function() {
-                return from[k];
-            }
-        });
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
     });
     return from;
 }

package/dist/cjs/components/OptionsEditorTabPanel/OptionsEditorTabPanel.js

@@ -16,20 +16,22 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "OptionsEditorTabPanel", {
     enumerable: true,
-    get: ()=>OptionsEditorTabPanel
+    get: function() {
+        return OptionsEditorTabPanel;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
+const _jsxruntime = require("react/jsx-runtime");
 const _material = require("@mui/material");
 function OptionsEditorTabPanel(props) {
-    const { children , value , index , ...other } = props;
+    const { children, value, index, ...other } = props;
     const isActive = value === index;
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)("div", {
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)("div", {
         role: "tabpanel",
         hidden: !isActive,
         id: `options-editor-tabpanel-${index}`,
         "aria-labelledby": `options-editor-tab-${index}`,
         ...other,
-        children: isActive && /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Box, {
+        children: isActive && /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Box, {
             mt: 2,
             children: children
         })

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

@@ -14,15 +14,17 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-_exportStar(require("./OptionsEditorTabPanel"), exports);
-function _exportStar(from, to) {
+_export_star(require("./OptionsEditorTabPanel"), exports);
+function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {
-        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {
-            enumerable: true,
-            get: function() {
-                return from[k];
-            }
-        });
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
     });
     return from;
 }

package/dist/cjs/components/OptionsEditorTabs/OptionsEditorTabs.js

@@ -16,30 +16,32 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "OptionsEditorTabs", {
     enumerable: true,
-    get: ()=>OptionsEditorTabs
+    get: function() {
+        return OptionsEditorTabs;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
+const _jsxruntime = require("react/jsx-runtime");
 const _material = require("@mui/material");
 const _react = require("react");
-const _optionsEditorTabPanel = require("../OptionsEditorTabPanel");
-const OptionsEditorTabs = ({ tabs  })=>{
+const _OptionsEditorTabPanel = require("../OptionsEditorTabPanel");
+const OptionsEditorTabs = ({ tabs })=>{
     const [activeTab, setActiveTab] = (0, _react.useState)(0);
     const handleChange = (_, newValue)=>{
         setActiveTab(newValue);
     };
-    return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
         children: [
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Box, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Box, {
                 sx: {
                     borderBottom: 1,
                     borderColor: (theme)=>theme.palette.divider
                 },
-                children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Tabs, {
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Tabs, {
                     value: activeTab,
                     onChange: handleChange,
                     "aria-label": "Panel configuration tabs",
-                    children: tabs.map(({ label  }, i)=>{
-                        return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.Tab, {
+                    children: tabs.map(({ label }, i)=>{
+                        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_material.Tab, {
                             label: label,
                             id: `options-editor-tab-${i}`,
                             "aria-controls": `options-editor-tabpanel-${i}`
@@ -47,8 +49,8 @@ const OptionsEditorTabs = ({ tabs  })=>{
                     })
                 })
             }),
-            tabs.map(({ label , content  }, i)=>{
-                return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_optionsEditorTabPanel.OptionsEditorTabPanel, {
+            tabs.map(({ label, content }, i)=>{
+                return /*#__PURE__*/ (0, _jsxruntime.jsx)(_OptionsEditorTabPanel.OptionsEditorTabPanel, {
                     value: activeTab,
                     index: i,
                     children: content

package/dist/cjs/components/OptionsEditorTabs/index.js

@@ -14,15 +14,17 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-_exportStar(require("./OptionsEditorTabs"), exports);
-function _exportStar(from, to) {
+_export_star(require("./OptionsEditorTabs"), exports);
+function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {
-        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {
-            enumerable: true,
-            get: function() {
-                return from[k];
-            }
-        });
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
     });
     return from;
 }

package/dist/cjs/components/PanelSpecEditor/PanelSpecEditor.js

@@ -16,19 +16,22 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "PanelSpecEditor", {
     enumerable: true,
-    get: ()=>PanelSpecEditor
+    get: function() {
+        return PanelSpecEditor;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
+const _jsxruntime = require("react/jsx-runtime");
 const _components = require("@perses-dev/components");
 const _runtime = require("../../runtime");
-const _optionsEditorTabs = require("../OptionsEditorTabs");
-const _timeSeriesQueryEditor = require("../TimeSeriesQueryEditor");
+const _OptionsEditorTabs = require("../OptionsEditorTabs");
+const _TimeSeriesQueryEditor = require("../TimeSeriesQueryEditor");
+const _TraceQueryEditor = require("../TraceQueryEditor");
 function PanelSpecEditor(props) {
-    const { panelDefinition , onJSONChange , onQueriesChange , onPluginSpecChange  } = props;
-    const { kind  } = panelDefinition.spec.plugin;
-    const { data: plugin , isLoading , error  } = (0, _runtime.usePlugin)('Panel', kind);
+    const { panelDefinition, onJSONChange, onQueriesChange, onPluginSpecChange } = props;
+    const { kind } = panelDefinition.spec.plugin;
+    const { data: plugin, isLoading, error } = (0, _runtime.usePlugin)('Panel', kind);
     if (error) {
-        return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components.ErrorAlert, {
+        return /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.ErrorAlert, {
             error: error
         });
     }
@@ -39,23 +42,60 @@ function PanelSpecEditor(props) {
     if (plugin === undefined) {
         throw new Error(`Missing implementation for panel plugin with kind '${kind}'`);
     }
-    const { panelOptionsEditorComponents , hideQueryEditor  } = plugin;
+    const getQueryType = ()=>{
+        var _panelDefinition_spec, _queriesList_;
+        const queriesList = panelDefinition === null || panelDefinition === void 0 ? void 0 : (_panelDefinition_spec = panelDefinition.spec) === null || _panelDefinition_spec === void 0 ? void 0 : _panelDefinition_spec.queries;
+        if (queriesList === undefined) {
+            return '';
+        }
+        const queryType = (_queriesList_ = queriesList[0]) === null || _queriesList_ === void 0 ? void 0 : _queriesList_.kind;
+        return queryType;
+    };
+    // Get the corresponding queryEditor depending on the queryType
+    const getQueryEditorComponent = ()=>{
+        const queryType = getQueryType();
+        // default case handles cause where there is no queryType yet (e.g. UI > 'editing' mode > 'Add Panel')
+        switch(queryType){
+            case 'TimeSeriesQuery':
+                var _panelDefinition_spec_queries;
+                return /*#__PURE__*/ (0, _jsxruntime.jsx)(_TimeSeriesQueryEditor.TimeSeriesQueryEditor, {
+                    queries: (_panelDefinition_spec_queries = panelDefinition.spec.queries) !== null && _panelDefinition_spec_queries !== void 0 ? _panelDefinition_spec_queries : [],
+                    onChange: onQueriesChange
+                });
+            case 'TraceQuery':
+                var _panelDefinition_spec_queries1;
+                return /*#__PURE__*/ (0, _jsxruntime.jsx)(_TraceQueryEditor.TraceQueryEditor, {
+                    queries: (_panelDefinition_spec_queries1 = panelDefinition.spec.queries) !== null && _panelDefinition_spec_queries1 !== void 0 ? _panelDefinition_spec_queries1 : [],
+                    onChange: onQueriesChange
+                });
+            default:
+                // ScatterChart only handles trace queries for now
+                if (kind === 'ScatterChart') {
+                    var _panelDefinition_spec_queries2;
+                    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_TraceQueryEditor.TraceQueryEditor, {
+                        queries: (_panelDefinition_spec_queries2 = panelDefinition.spec.queries) !== null && _panelDefinition_spec_queries2 !== void 0 ? _panelDefinition_spec_queries2 : [],
+                        onChange: onQueriesChange
+                    });
+                }
+                var _panelDefinition_spec_queries3;
+                return /*#__PURE__*/ (0, _jsxruntime.jsx)(_TimeSeriesQueryEditor.TimeSeriesQueryEditor, {
+                    queries: (_panelDefinition_spec_queries3 = panelDefinition.spec.queries) !== null && _panelDefinition_spec_queries3 !== void 0 ? _panelDefinition_spec_queries3 : [],
+                    onChange: onQueriesChange
+                });
+        }
+    };
+    const { panelOptionsEditorComponents, hideQueryEditor } = plugin;
     let tabs = [];
     if (!hideQueryEditor) {
-        var _queries;
-        // Since we only support TimeSeriesQuery for now, we will always show a TimeSeriesQueryEditor
         tabs.push({
             label: 'Query',
-            content: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_timeSeriesQueryEditor.TimeSeriesQueryEditor, {
-                queries: (_queries = panelDefinition.spec.queries) !== null && _queries !== void 0 ? _queries : [],
-                onChange: onQueriesChange
-            })
+            content: getQueryEditorComponent()
         });
     }
     if (panelOptionsEditorComponents !== undefined) {
-        tabs = tabs.concat(panelOptionsEditorComponents.map(({ label , content: OptionsEditorComponent  })=>({
+        tabs = tabs.concat(panelOptionsEditorComponents.map(({ label, content: OptionsEditorComponent })=>({
                 label,
-                content: /*#__PURE__*/ (0, _jsxRuntime.jsx)(OptionsEditorComponent, {
+                content: /*#__PURE__*/ (0, _jsxruntime.jsx)(OptionsEditorComponent, {
                     value: panelDefinition.spec.plugin.spec,
                     onChange: onPluginSpecChange
                 })
@@ -64,12 +104,13 @@ function PanelSpecEditor(props) {
     // always show json editor by default
     tabs.push({
         label: 'JSON',
-        content: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_components.JSONEditor, {
+        content: /*#__PURE__*/ (0, _jsxruntime.jsx)(_components.JSONEditor, {
+            maxHeight: "80vh",
             value: panelDefinition,
             onChange: onJSONChange
         })
     });
-    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_optionsEditorTabs.OptionsEditorTabs, {
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_OptionsEditorTabs.OptionsEditorTabs, {
         tabs: tabs
     }, tabs.length);
 }

package/dist/cjs/components/PanelSpecEditor/index.js

@@ -14,15 +14,17 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-_exportStar(require("./PanelSpecEditor"), exports);
-function _exportStar(from, to) {
+_export_star(require("./PanelSpecEditor"), exports);
+function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {
-        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {
-            enumerable: true,
-            get: function() {
-                return from[k];
-            }
-        });
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
     });
     return from;
 }

package/dist/cjs/components/PluginEditor/PluginEditor.js

@@ -16,48 +16,41 @@ Object.defineProperty(exports, "__esModule", {
 });
 Object.defineProperty(exports, "PluginEditor", {
     enumerable: true,
-    get: ()=>PluginEditor
+    get: function() {
+        return PluginEditor;
+    }
 });
-const _jsxRuntime = require("react/jsx-runtime");
+const _jsxruntime = require("react/jsx-runtime");
 const _material = require("@mui/material");
-const _pluginKindSelect = require("../PluginKindSelect");
-const _pluginSpecEditor = require("../PluginSpecEditor");
-const _pluginEditorApi = require("./plugin-editor-api");
+const _PluginKindSelect = require("../PluginKindSelect");
+const _PluginSpecEditor = require("../PluginSpecEditor");
+const _plugineditorapi = require("./plugin-editor-api");
 function PluginEditor(props) {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    const { value , pluginType , pluginKindLabel , onChange: _ , isReadonly , ...others } = props;
-    const { pendingKind , isLoading , error , onKindChange , onSpecChange  } = (0, _pluginEditorApi.usePluginEditor)(props);
-    var ref;
-    return /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_material.Box, {
+    const { value, pluginType, pluginKindLabel, onChange: _, isReadonly, ...others } = props;
+    const { pendingKind, isLoading, error, onKindChange, onSpecChange } = (0, _plugineditorapi.usePluginEditor)(props);
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_material.Box, {
         ...others,
         children: [
-            /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_material.FormControl, {
-                margin: "dense",
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_PluginKindSelect.PluginKindSelect, {
                 fullWidth: false,
-                disabled: isLoading,
-                error: error !== null,
                 sx: {
-                    mb: 1
+                    mb: 1,
+                    minWidth: 120
+                },
+                margin: "dense",
+                label: pluginKindLabel,
+                pluginType: pluginType,
+                disabled: isLoading,
+                value: pendingKind !== '' ? pendingKind : value.kind,
+                InputProps: {
+                    readOnly: isReadonly
                 },
-                children: [
-                    /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.InputLabel, {
-                        id: "plugin-kind-label",
-                        children: pluginKindLabel
-                    }),
-                    /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pluginKindSelect.PluginKindSelect, {
-                        labelId: "plugin-kind-label",
-                        label: pluginKindLabel,
-                        pluginType: pluginType,
-                        value: pendingKind !== '' ? pendingKind : value.kind,
-                        readOnly: isReadonly,
-                        onChange: onKindChange
-                    }),
-                    /*#__PURE__*/ (0, _jsxRuntime.jsx)(_material.FormHelperText, {
-                        children: (ref = error === null || error === void 0 ? void 0 : error.message) !== null && ref !== void 0 ? ref : ''
-                    })
-                ]
+                error: !!error,
+                helperText: error === null || error === void 0 ? void 0 : error.message,
+                onChange: onKindChange
             }),
-            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_pluginSpecEditor.PluginSpecEditor, {
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_PluginSpecEditor.PluginSpecEditor, {
                 pluginType: pluginType,
                 pluginKind: value.kind,
                 value: value.spec,

package/dist/cjs/components/PluginEditor/index.js

@@ -14,16 +14,18 @@
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
-_exportStar(require("./PluginEditor"), exports);
-_exportStar(require("./plugin-editor-api"), exports);
-function _exportStar(from, to) {
+_export_star(require("./PluginEditor"), exports);
+_export_star(require("./plugin-editor-api"), exports);
+function _export_star(from, to) {
     Object.keys(from).forEach(function(k) {
-        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) Object.defineProperty(to, k, {
-            enumerable: true,
-            get: function() {
-                return from[k];
-            }
-        });
+        if (k !== "default" && !Object.prototype.hasOwnProperty.call(to, k)) {
+            Object.defineProperty(to, k, {
+                enumerable: true,
+                get: function() {
+                    return from[k];
+                }
+            });
+        }
     });
     return from;
 }