@grafana/aws-sdk 0.4.2 → 0.6.0

package/dist/index.js

@@ -7,13 +7,13 @@ var ui = require('@grafana/ui');
 var data = require('@grafana/data');
 var runtime = require('@grafana/runtime');
 var css = require('@emotion/css');
-var experimental = require('@grafana/experimental');
+var pluginUi = require('@grafana/plugin-ui');
 var lodash = require('lodash');
 var asyncQueryData = require('@grafana/async-query-data');
 
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 const standardRegions = [
   "af-south-1",
@@ -90,25 +90,6 @@ const assumeRoleInstructionsStyle = css.css({
   maxWidth: "715px"
 });
 
-var __defProp$7 = Object.defineProperty;
-var __defProps$6 = Object.defineProperties;
-var __getOwnPropDescs$6 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
-var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
-var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$7 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$7.call(b, prop))
-      __defNormalProp$7(a, prop, b[prop]);
-  if (__getOwnPropSymbols$7)
-    for (var prop of __getOwnPropSymbols$7(b)) {
-      if (__propIsEnum$7.call(b, prop))
-        __defNormalProp$7(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$6 = (a, b) => __defProps$6(a, __getOwnPropDescs$6(b));
 const DEFAULT_LABEL_WIDTH = 28;
 const DS_TYPES_THAT_SUPPORT_TEMP_CREDS = ["cloudwatch", "grafana-athena-datasource"];
 const toOption = (value) => ({ value, label: value });
@@ -133,11 +114,13 @@ const ConnectionConfig = (props) => {
   const currentProvider = awsAuthProviderOptions.find((p) => p.value === options.jsonData.authType);
   React.useEffect(() => {
     if (!currentProvider && awsAllowedAuthProviders.length) {
-      onOptionsChange(__spreadProps$6(__spreadValues$7({}, options), {
-        jsonData: __spreadProps$6(__spreadValues$7({}, options.jsonData), {
+      onOptionsChange({
+        ...options,
+        jsonData: {
+          ...options.jsonData,
           authType: awsAllowedAuthProviders[0]
-        })
-      }));
+        }
+      });
     }
   }, [currentProvider, options, onOptionsChange, awsAllowedAuthProviders]);
   React.useEffect(() => {
@@ -146,14 +129,14 @@ const ConnectionConfig = (props) => {
     }
     loadRegions().then((regions2) => setRegions(regions2.map(toOption)));
   }, [loadRegions]);
-  return /* @__PURE__ */ React__default["default"].createElement("div", { "data-testid": "connection-config" }, /* @__PURE__ */ React__default["default"].createElement(experimental.ConfigSection, { title: skipHeader ? "" : "Connection Details", "data-testid": "connection-config" }, /* @__PURE__ */ React__default["default"].createElement(experimental.ConfigSubSection, { title: "Authentication" }, /* @__PURE__ */ React__default["default"].createElement(
+  return /* @__PURE__ */ React__default.default.createElement("div", { "data-testid": "connection-config" }, /* @__PURE__ */ React__default.default.createElement(pluginUi.ConfigSection, { title: skipHeader ? "" : "Connection Details", "data-testid": "connection-config" }, /* @__PURE__ */ React__default.default.createElement(pluginUi.ConfigSubSection, { title: "Authentication" }, /* @__PURE__ */ React__default.default.createElement(
     ui.Field,
     {
       label: "Authentication Provider",
       description: "Specify which AWS credentials chain to use.",
       htmlFor: "authProvider"
     },
-    /* @__PURE__ */ React__default["default"].createElement(
+    /* @__PURE__ */ React__default.default.createElement(
       ui.Select,
       {
         "aria-label": "Authentication Provider",
@@ -167,14 +150,14 @@ const ConnectionConfig = (props) => {
         menuShouldPortal: true
       }
     )
-  ), options.jsonData.authType === "credentials" && /* @__PURE__ */ React__default["default"].createElement(
+  ), options.jsonData.authType === "credentials" && /* @__PURE__ */ React__default.default.createElement(
     ui.Field,
     {
       label: "Credentials Profile Name",
       description: "Credentials profile name, as specified in ~/.aws/credentials, leave blank for default.",
       htmlFor: "credentialsProfileName"
     },
-    /* @__PURE__ */ React__default["default"].createElement(
+    /* @__PURE__ */ React__default.default.createElement(
       ui.Input,
       {
         id: "credentialsProfileName",
@@ -183,7 +166,7 @@ const ConnectionConfig = (props) => {
         onChange: data.onUpdateDatasourceJsonDataOption(props, "profile")
       }
     )
-  ), options.jsonData.authType === "keys" && /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, /* @__PURE__ */ React__default["default"].createElement(ui.Field, { label: "Access Key ID", htmlFor: "accessKeyId" }, ((_b = props.options.secureJsonFields) == null ? void 0 : _b.accessKey) ? /* @__PURE__ */ React__default["default"].createElement(ui.ButtonGroup, null, /* @__PURE__ */ React__default["default"].createElement(ui.Input, { disabled: true, placeholder: "Configured", id: "accessKeyId" }), /* @__PURE__ */ React__default["default"].createElement(
+  ), options.jsonData.authType === "keys" && /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement(ui.Field, { label: "Access Key ID", htmlFor: "accessKeyId" }, ((_b = props.options.secureJsonFields) == null ? void 0 : _b.accessKey) ? /* @__PURE__ */ React__default.default.createElement(ui.ButtonGroup, null, /* @__PURE__ */ React__default.default.createElement(ui.Input, { disabled: true, placeholder: "Configured", id: "accessKeyId" }), /* @__PURE__ */ React__default.default.createElement(
     ui.ToolbarButton,
     {
       icon: "edit",
@@ -191,14 +174,14 @@ const ConnectionConfig = (props) => {
       type: "button",
       onClick: data.onUpdateDatasourceResetOption(props, "accessKey")
     }
-  )) : /* @__PURE__ */ React__default["default"].createElement(
+  )) : /* @__PURE__ */ React__default.default.createElement(
     ui.Input,
     {
       id: "accessKeyId",
       value: (_d = (_c = options.secureJsonData) == null ? void 0 : _c.accessKey) != null ? _d : "",
       onChange: data.onUpdateDatasourceSecureJsonDataOption(props, "accessKey")
     }
-  )), /* @__PURE__ */ React__default["default"].createElement(ui.Field, { label: "Secret Access Key", htmlFor: "secretKey" }, ((_e = props.options.secureJsonFields) == null ? void 0 : _e.secretKey) ? /* @__PURE__ */ React__default["default"].createElement(ui.ButtonGroup, null, /* @__PURE__ */ React__default["default"].createElement(ui.Input, { disabled: true, placeholder: "Configured" }), /* @__PURE__ */ React__default["default"].createElement(
+  )), /* @__PURE__ */ React__default.default.createElement(ui.Field, { label: "Secret Access Key", htmlFor: "secretKey" }, ((_e = props.options.secureJsonFields) == null ? void 0 : _e.secretKey) ? /* @__PURE__ */ React__default.default.createElement(ui.ButtonGroup, null, /* @__PURE__ */ React__default.default.createElement(ui.Input, { disabled: true, placeholder: "Configured" }), /* @__PURE__ */ React__default.default.createElement(
     ui.ToolbarButton,
     {
       id: "secretKey",
@@ -207,14 +190,14 @@ const ConnectionConfig = (props) => {
       tooltip: "Edit Secret Access Key",
       onClick: data.onUpdateDatasourceResetOption(props, "secretKey")
     }
-  )) : /* @__PURE__ */ React__default["default"].createElement(
+  )) : /* @__PURE__ */ React__default.default.createElement(
     ui.Input,
     {
       id: "secretKey",
       value: (_g = (_f = options.secureJsonData) == null ? void 0 : _f.secretKey) != null ? _g : "",
       onChange: data.onUpdateDatasourceSecureJsonDataOption(props, "secretKey")
     }
-  )))), /* @__PURE__ */ React__default["default"].createElement(experimental.ConfigSubSection, { title: "Assume Role" }, options.jsonData.authType === AwsAuthType.GrafanaAssumeRole && /* @__PURE__ */ React__default["default"].createElement("div", { className: assumeRoleInstructionsStyle }, /* @__PURE__ */ React__default["default"].createElement(
+  )))), /* @__PURE__ */ React__default.default.createElement(pluginUi.ConfigSubSection, { title: "Assume Role" }, options.jsonData.authType === AwsAuthType.GrafanaAssumeRole && /* @__PURE__ */ React__default.default.createElement("div", { className: assumeRoleInstructionsStyle }, /* @__PURE__ */ React__default.default.createElement(
     ui.Collapse,
     {
       label: "How to create an IAM role for grafana to assume:",
@@ -222,7 +205,7 @@ const ConnectionConfig = (props) => {
       isOpen: isARNInstructionsOpen,
       onToggle: () => setIsARNInstructionsOpen(!isARNInstructionsOpen)
     },
-    /* @__PURE__ */ React__default["default"].createElement("ol", null, /* @__PURE__ */ React__default["default"].createElement("li", null, /* @__PURE__ */ React__default["default"].createElement("p", null, "1. Create a new IAM role in the AWS console, and select ", /* @__PURE__ */ React__default["default"].createElement("code", null, "Another AWS account"), " as the", " ", /* @__PURE__ */ React__default["default"].createElement("code", null, "Trusted entity"), ".")), /* @__PURE__ */ React__default["default"].createElement("li", null, /* @__PURE__ */ React__default["default"].createElement("p", null, "2. Enter the account ID of the Grafana account that has permission to assume this role:", /* @__PURE__ */ React__default["default"].createElement("code", null, " 008923505280 "), " and check the ", /* @__PURE__ */ React__default["default"].createElement("code", null, "Require external ID"), " box.")), /* @__PURE__ */ React__default["default"].createElement("li", null, /* @__PURE__ */ React__default["default"].createElement("p", null, "3. Enter the following external ID:", " ", /* @__PURE__ */ React__default["default"].createElement("code", null, props.externalId || "External Id is currently unavailable"), " and click", " ", /* @__PURE__ */ React__default["default"].createElement("code", null, "Next"), ".")), /* @__PURE__ */ React__default["default"].createElement("li", null, /* @__PURE__ */ React__default["default"].createElement("p", null, "4. Add any required permissions you would like Grafana to be able to access on your behalf. For more details on our permissions please", " ", /* @__PURE__ */ React__default["default"].createElement(
+    /* @__PURE__ */ React__default.default.createElement("ol", null, /* @__PURE__ */ React__default.default.createElement("li", null, /* @__PURE__ */ React__default.default.createElement("p", null, "1. Create a new IAM role in the AWS console, and select ", /* @__PURE__ */ React__default.default.createElement("code", null, "Another AWS account"), " as the", " ", /* @__PURE__ */ React__default.default.createElement("code", null, "Trusted entity"), ".")), /* @__PURE__ */ React__default.default.createElement("li", null, /* @__PURE__ */ React__default.default.createElement("p", null, "2. Enter the account ID of the Grafana account that has permission to assume this role:", /* @__PURE__ */ React__default.default.createElement("code", null, " 008923505280 "), " and check the ", /* @__PURE__ */ React__default.default.createElement("code", null, "Require external ID"), " box.")), /* @__PURE__ */ React__default.default.createElement("li", null, /* @__PURE__ */ React__default.default.createElement("p", null, "3. Enter the following external ID:", " ", /* @__PURE__ */ React__default.default.createElement("code", null, props.externalId || "External Id is currently unavailable"), " and click", " ", /* @__PURE__ */ React__default.default.createElement("code", null, "Next"), ".")), /* @__PURE__ */ React__default.default.createElement("li", null, /* @__PURE__ */ React__default.default.createElement("p", null, "4. Add any required permissions you would like Grafana to be able to access on your behalf. For more details on our permissions please", " ", /* @__PURE__ */ React__default.default.createElement(
       "a",
       {
         href: "https://grafana.com/docs/grafana/latest/datasources/aws-cloudwatch/",
@@ -230,15 +213,15 @@ const ConnectionConfig = (props) => {
         rel: "noreferrer"
       },
       "read through our documentation"
-    ), ".")), /* @__PURE__ */ React__default["default"].createElement("li", null, /* @__PURE__ */ React__default["default"].createElement("p", null, "5. Give the role a name and description, and click ", /* @__PURE__ */ React__default["default"].createElement("code", null, "Create role"), ".")), /* @__PURE__ */ React__default["default"].createElement("li", null, /* @__PURE__ */ React__default["default"].createElement("p", null, "6. Copy the ARN of the role you just created and paste it into the ", /* @__PURE__ */ React__default["default"].createElement("code", null, "Assume Role ARN"), " ", "field below.")))
-  )), awsAssumeRoleEnabled && /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, /* @__PURE__ */ React__default["default"].createElement(
+    ), ".")), /* @__PURE__ */ React__default.default.createElement("li", null, /* @__PURE__ */ React__default.default.createElement("p", null, "5. Give the role a name and description, and click ", /* @__PURE__ */ React__default.default.createElement("code", null, "Create role"), ".")), /* @__PURE__ */ React__default.default.createElement("li", null, /* @__PURE__ */ React__default.default.createElement("p", null, "6. Copy the ARN of the role you just created and paste it into the ", /* @__PURE__ */ React__default.default.createElement("code", null, "Assume Role ARN"), " ", "field below.")))
+  )), awsAssumeRoleEnabled && /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement(
     ui.Field,
     {
       htmlFor: "assumeRoleArn",
       label: "Assume Role ARN",
       description: "Optional. Specifying the ARN of a role will ensure that the\n                     selected authentication provider is used to assume the role rather than the\n                     credentials directly."
     },
-    /* @__PURE__ */ React__default["default"].createElement(
+    /* @__PURE__ */ React__default.default.createElement(
       ui.Input,
       {
         id: "assumeRoleArn",
@@ -247,14 +230,14 @@ const ConnectionConfig = (props) => {
         onChange: data.onUpdateDatasourceJsonDataOption(props, "assumeRoleArn")
       }
     )
-  ), options.jsonData.authType !== AwsAuthType.GrafanaAssumeRole && /* @__PURE__ */ React__default["default"].createElement(
+  ), options.jsonData.authType !== AwsAuthType.GrafanaAssumeRole && /* @__PURE__ */ React__default.default.createElement(
     ui.Field,
     {
       htmlFor: "externalId",
       label: "External ID",
       description: "If you are assuming a role in another account, that has been created with an external ID, specify the external ID here."
     },
-    /* @__PURE__ */ React__default["default"].createElement(
+    /* @__PURE__ */ React__default.default.createElement(
       ui.Input,
       {
         id: "externalId",
@@ -263,14 +246,14 @@ const ConnectionConfig = (props) => {
         onChange: data.onUpdateDatasourceJsonDataOption(props, "externalId")
       }
     )
-  ))), /* @__PURE__ */ React__default["default"].createElement(experimental.ConfigSubSection, { title: "Additional Settings" }, !skipEndpoint && options.jsonData.authType !== AwsAuthType.GrafanaAssumeRole && /* @__PURE__ */ React__default["default"].createElement(
+  ))), /* @__PURE__ */ React__default.default.createElement(pluginUi.ConfigSubSection, { title: "Additional Settings" }, !skipEndpoint && options.jsonData.authType !== AwsAuthType.GrafanaAssumeRole && /* @__PURE__ */ React__default.default.createElement(
     ui.Field,
     {
       label: "Endpoint",
       description: "Optionally, specify a custom endpoint for the service",
       htmlFor: "endpoint"
     },
-    /* @__PURE__ */ React__default["default"].createElement(
+    /* @__PURE__ */ React__default.default.createElement(
       ui.Input,
       {
         id: "endpoint",
@@ -279,14 +262,14 @@ const ConnectionConfig = (props) => {
         onChange: data.onUpdateDatasourceJsonDataOption(props, "endpoint")
       }
     )
-  ), /* @__PURE__ */ React__default["default"].createElement(
+  ), /* @__PURE__ */ React__default.default.createElement(
     ui.Field,
     {
       label: "Default Region",
       description: "Specify the region, such as for US West (Oregon) use ` us-west-2 ` as the region.",
       htmlFor: "defaultRegion"
     },
-    /* @__PURE__ */ React__default["default"].createElement(
+    /* @__PURE__ */ React__default.default.createElement(
       ui.Select,
       {
         inputId: "defaultRegion",
@@ -347,9 +330,9 @@ function isVersionGtOrEq(a, b) {
 function Divider() {
   const theme = ui.useTheme2();
   if (isVersionGtOrEq(runtime.config.buildInfo.version, "10.1.0")) {
-    return /* @__PURE__ */ React__default["default"].createElement(ui.Divider, null);
+    return /* @__PURE__ */ React__default.default.createElement(ui.Divider, null);
   }
-  return /* @__PURE__ */ React__default["default"].createElement(
+  return /* @__PURE__ */ React__default.default.createElement(
     "div",
     {
       style: { borderTop: `1px solid ${theme.colors.border.weak}`, margin: theme.spacing(2, 0), width: "100%" }
@@ -357,40 +340,23 @@ function Divider() {
   );
 }
 
-var __defProp$6 = Object.defineProperty;
-var __defProps$5 = Object.defineProperties;
-var __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
-var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
-var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$6 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$6.call(b, prop))
-      __defNormalProp$6(a, prop, b[prop]);
-  if (__getOwnPropSymbols$6)
-    for (var prop of __getOwnPropSymbols$6(b)) {
-      if (__propIsEnum$6.call(b, prop))
-        __defNormalProp$6(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$5 = (a, b) => __defProps$5(a, __getOwnPropDescs$5(b));
 const SIGV4ConnectionConfig = (props) => {
   var _a, _b, _c, _d;
   const { onOptionsChange, options } = props;
   const connectionConfigProps = {
     onOptionsChange: (awsDataSourceSettings) => {
       var _a2, _b2, _c2, _d2;
-      const dataSourceSettings = __spreadProps$5(__spreadValues$6({}, options), {
-        jsonData: __spreadProps$5(__spreadValues$6({}, options.jsonData), {
+      const dataSourceSettings = {
+        ...options,
+        jsonData: {
+          ...options.jsonData,
           sigV4AuthType: awsDataSourceSettings.jsonData.authType,
           sigV4Profile: awsDataSourceSettings.jsonData.profile,
           sigV4AssumeRoleArn: awsDataSourceSettings.jsonData.assumeRoleArn,
           sigV4ExternalId: awsDataSourceSettings.jsonData.externalId,
           sigV4Region: awsDataSourceSettings.jsonData.defaultRegion,
           sigV4Endpoint: awsDataSourceSettings.jsonData.endpoint
-        }),
+        },
         secureJsonFields: {
           sigV4AccessKey: (_a2 = awsDataSourceSettings.secureJsonFields) == null ? void 0 : _a2.accessKey,
           sigV4SecretKey: (_b2 = awsDataSourceSettings.secureJsonFields) == null ? void 0 : _b2.secretKey
@@ -399,18 +365,20 @@ const SIGV4ConnectionConfig = (props) => {
           sigV4AccessKey: (_c2 = awsDataSourceSettings.secureJsonData) == null ? void 0 : _c2.accessKey,
           sigV4SecretKey: (_d2 = awsDataSourceSettings.secureJsonData) == null ? void 0 : _d2.secretKey
         }
-      });
+      };
       onOptionsChange(dataSourceSettings);
     },
-    options: __spreadProps$5(__spreadValues$6({}, options), {
-      jsonData: __spreadProps$5(__spreadValues$6({}, options.jsonData), {
+    options: {
+      ...options,
+      jsonData: {
+        ...options.jsonData,
         authType: options.jsonData.sigV4AuthType,
         profile: options.jsonData.sigV4Profile,
         assumeRoleArn: options.jsonData.sigV4AssumeRoleArn,
         externalId: options.jsonData.sigV4ExternalId,
         defaultRegion: options.jsonData.sigV4Region,
         endpoint: options.jsonData.sigV4Endpoint
-      }),
+      },
       secureJsonFields: {
         accessKey: (_a = options.secureJsonFields) == null ? void 0 : _a.sigV4AccessKey,
         secretKey: (_b = options.secureJsonFields) == null ? void 0 : _b.sigV4SecretKey
@@ -419,33 +387,14 @@ const SIGV4ConnectionConfig = (props) => {
         accessKey: (_c = options.secureJsonData) == null ? void 0 : _c.sigV4AccessKey,
         secretKey: (_d = options.secureJsonData) == null ? void 0 : _d.sigV4SecretKey
       }
-    }),
+    },
     inExperimentalAuthComponent: props.inExperimentalAuthComponent
   };
-  return /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, /* @__PURE__ */ React__default["default"].createElement("div", { className: "gf-form" }, /* @__PURE__ */ React__default["default"].createElement("h6", null, "SigV4 Auth Details")), /* @__PURE__ */ React__default["default"].createElement(ConnectionConfig, __spreadProps$5(__spreadValues$6({}, connectionConfigProps), { skipHeader: true, skipEndpoint: true })));
+  return /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement("div", { className: "gf-form" }, /* @__PURE__ */ React__default.default.createElement("h6", null, "SigV4 Auth Details")), /* @__PURE__ */ React__default.default.createElement(ConnectionConfig, { ...connectionConfigProps, skipHeader: true, skipEndpoint: true }));
 };
 
 const defaultKey = "__default";
 
-var __defProp$5 = Object.defineProperty;
-var __defProps$4 = Object.defineProperties;
-var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
-var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
-var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$5 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$5.call(b, prop))
-      __defNormalProp$5(a, prop, b[prop]);
-  if (__getOwnPropSymbols$5)
-    for (var prop of __getOwnPropSymbols$5(b)) {
-      if (__propIsEnum$5.call(b, prop))
-        __defNormalProp$5(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
 function ResourceSelector(props) {
   const propsDependencies = props.dependencies;
   const propsOnChange = props.onChange;
@@ -526,9 +475,10 @@ function ResourceSelector(props) {
       setIsLoading(false);
     }
   };
-  return /* @__PURE__ */ React__default["default"].createElement(
+  return /* @__PURE__ */ React__default.default.createElement(
     ui.Select,
-    __spreadProps$4(__spreadValues$5({}, props), {
+    {
+      ...props,
       id: props.id,
       inputId: props.id,
       "aria-label": props.label,
@@ -538,26 +488,10 @@ function ResourceSelector(props) {
       className: props.className || "min-width-6",
       onOpenMenu: () => props.fetch && onClick(),
       menuShouldPortal: true
-    })
+    }
   );
 }
 
-var __defProp$4 = Object.defineProperty;
-var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
-var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
-var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$4 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$4.call(b, prop))
-      __defNormalProp$4(a, prop, b[prop]);
-  if (__getOwnPropSymbols$4)
-    for (var prop of __getOwnPropSymbols$4(b)) {
-      if (__propIsEnum$4.call(b, prop))
-        __defNormalProp$4(a, prop, b[prop]);
-    }
-  return a;
-};
 function ConfigSelect(props) {
   var _a, _b, _c;
   const { jsonData } = props.options;
@@ -576,9 +510,9 @@ function ConfigSelect(props) {
     (_b = props.options.secureJsonData) == null ? void 0 : _b.accessKey,
     (_c = props.options.secureJsonData) == null ? void 0 : _c.secretKey
   ].concat(props.dependencies);
-  return /* @__PURE__ */ React__default["default"].createElement(
+  return /* @__PURE__ */ React__default.default.createElement(
     ResourceSelector,
-    __spreadValues$4({
+    {
       id: props.id,
       label: props.label,
       "data-testid": props["data-testid"],
@@ -603,19 +537,20 @@ function ConfigSelect(props) {
       menuPlacement: props.menuPlacement,
       menuPosition: props.menuPosition,
       noOptionsMessage: props.noOptionsMessage,
+      placeholder: props.placeholder,
+      width: props.width,
       onBlur: props.onBlur,
       onCreateOption: props.onCreateOption,
       onInputChange: props.onInputChange,
-      placeholder: props.placeholder,
-      width: props.width,
-      isOptionDisabled: props.isOptionDisabled
-    }, commonProps)
+      isOptionDisabled: props.isOptionDisabled,
+      ...commonProps
+    }
   );
 }
 
 function InlineInput(props) {
   var _a;
-  return /* @__PURE__ */ React__default["default"].createElement(
+  return /* @__PURE__ */ React__default.default.createElement(
     ui.InlineField,
     {
       label: props.label,
@@ -624,7 +559,7 @@ function InlineInput(props) {
       hidden: props.hidden,
       disabled: props.disabled
     },
-    /* @__PURE__ */ React__default["default"].createElement(
+    /* @__PURE__ */ React__default.default.createElement(
       ui.Input,
       {
         "data-testid": props["data-testid"],
@@ -638,32 +573,14 @@ function InlineInput(props) {
   );
 }
 
-var __defProp$3 = Object.defineProperty;
-var __defProps$3 = Object.defineProperties;
-var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
-var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
-var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$3 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$3.call(b, prop))
-      __defNormalProp$3(a, prop, b[prop]);
-  if (__getOwnPropSymbols$3)
-    for (var prop of __getOwnPropSymbols$3(b)) {
-      if (__propIsEnum$3.call(b, prop))
-        __defNormalProp$3(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
 function QueryCodeEditor(props) {
   const { getSuggestions, query } = props;
   const { rawSQL } = lodash.defaults(props.query, { rawSQL: "" });
   const onRawSqlChange = (rawSQL2) => {
-    const query2 = __spreadProps$3(__spreadValues$3({}, props.query), {
+    const query2 = {
+      ...props.query,
       rawSQL: rawSQL2
-    });
+    };
     props.onChange(query2);
     props.onRunQuery();
   };
@@ -671,17 +588,18 @@ function QueryCodeEditor(props) {
   React.useEffect(() => {
     suggestionsRef.current = getSuggestions(query);
   }, [getSuggestions, query]);
-  return /* @__PURE__ */ React__default["default"].createElement(
+  return /* @__PURE__ */ React__default.default.createElement(
     ui.CodeEditor,
-    __spreadValues$3({
+    {
       language: props.language,
       value: rawSQL,
       onBlur: onRawSqlChange,
       showMiniMap: false,
       showLineNumbers: true,
       getSuggestions: () => suggestionsRef.current,
-      height: "240px"
-    }, props.editorProps)
+      height: "240px",
+      ...props.editorProps
+    }
   );
 }
 
@@ -695,7 +613,7 @@ function QueryEditorHeader({
   data: data$1,
   cancel
 }) {
-  return /* @__PURE__ */ React__default["default"].createElement(experimental.EditorHeader, null, extraHeaderElementLeft, /* @__PURE__ */ React__default["default"].createElement(experimental.FlexItem, { grow: 1 }), showAsyncQueryButtons ? /* @__PURE__ */ React__default["default"].createElement(
+  return /* @__PURE__ */ React__default.default.createElement(pluginUi.EditorHeader, null, extraHeaderElementLeft, /* @__PURE__ */ React__default.default.createElement(pluginUi.FlexItem, { grow: 1 }), showAsyncQueryButtons ? /* @__PURE__ */ React__default.default.createElement(
     asyncQueryData.RunQueryButtons,
     {
       onRunQuery,
@@ -706,7 +624,7 @@ function QueryEditorHeader({
       },
       state: data$1 == null ? void 0 : data$1.state
     }
-  ) : /* @__PURE__ */ React__default["default"].createElement(
+  ) : /* @__PURE__ */ React__default.default.createElement(
     ui.Button,
     {
       variant: enableRunButton ? "primary" : "secondary",
@@ -719,35 +637,17 @@ function QueryEditorHeader({
   ), extraHeaderElementRight);
 }
 
-var __defProp$2 = Object.defineProperty;
-var __defProps$2 = Object.defineProperties;
-var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
-var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
-var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$2 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$2.call(b, prop))
-      __defNormalProp$2(a, prop, b[prop]);
-  if (__getOwnPropSymbols$2)
-    for (var prop of __getOwnPropSymbols$2(b)) {
-      if (__propIsEnum$2.call(b, prop))
-        __defNormalProp$2(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
 function FormatSelect(props) {
   var _a;
   const onChangeFormat = (e) => {
     var _a2;
-    props.onChange(__spreadProps$2(__spreadValues$2({}, props.query), {
+    props.onChange({
+      ...props.query,
       format: e.value || 0
-    }));
+    });
     (_a2 = props.onRunQuery) == null ? void 0 : _a2.call(props);
   };
-  return /* @__PURE__ */ React__default["default"].createElement(
+  return /* @__PURE__ */ React__default.default.createElement(
     ui.Select,
     {
       "aria-label": "Format data frames as",
@@ -760,25 +660,6 @@ function FormatSelect(props) {
   );
 }
 
-var __defProp$1 = Object.defineProperty;
-var __defProps$1 = Object.defineProperties;
-var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
-var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
-var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$1.call(b, prop))
-      __defNormalProp$1(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1)
-    for (var prop of __getOwnPropSymbols$1(b)) {
-      if (__propIsEnum$1.call(b, prop))
-        __defNormalProp$1(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
 var FillValueOptions = /* @__PURE__ */ ((FillValueOptions2) => {
   FillValueOptions2[FillValueOptions2["Previous"] = 0] = "Previous";
   FillValueOptions2[FillValueOptions2["Null"] = 1] = "Null";
@@ -801,7 +682,7 @@ const SelectableFillValueOptions = [
 ];
 function FillValueSelect(props) {
   var _a, _b, _c;
-  return /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, /* @__PURE__ */ React__default["default"].createElement(experimental.EditorField, { label: "Fill with", tooltip: "value to fill missing points", htmlFor: "fillWith" }, /* @__PURE__ */ React__default["default"].createElement(
+  return /* @__PURE__ */ React__default.default.createElement(React__default.default.Fragment, null, /* @__PURE__ */ React__default.default.createElement(pluginUi.EditorField, { label: "Fill with", tooltip: "value to fill missing points", htmlFor: "fillWith" }, /* @__PURE__ */ React__default.default.createElement(
     ui.Select,
     {
       id: "fillWith",
@@ -811,26 +692,29 @@ function FillValueSelect(props) {
       value: (_b = (_a = props.query.fillMode) == null ? void 0 : _a.mode) != null ? _b : 0 /* Previous */,
       onChange: ({ value }) => {
         var _a2;
-        props.onChange(__spreadProps$1(__spreadValues$1({}, props.query), {
-          fillMode: __spreadProps$1(__spreadValues$1({}, props.query.fillMode), { mode: value })
-        }));
+        props.onChange({
+          ...props.query,
+          // Keep the fillMode.value in case FillValueOptions.Value mode is selected back
+          fillMode: { ...props.query.fillMode, mode: value }
+        });
         (_a2 = props.onRunQuery) == null ? void 0 : _a2.call(props);
       },
       menuShouldPortal: true
     }
-  )), ((_c = props.query.fillMode) == null ? void 0 : _c.mode) === 2 /* Value */ && /* @__PURE__ */ React__default["default"].createElement(experimental.EditorField, { label: "Value", htmlFor: "valueToFill", width: 6 }, /* @__PURE__ */ React__default["default"].createElement(
+  )), ((_c = props.query.fillMode) == null ? void 0 : _c.mode) === 2 /* Value */ && /* @__PURE__ */ React__default.default.createElement(pluginUi.EditorField, { label: "Value", htmlFor: "valueToFill", width: 6 }, /* @__PURE__ */ React__default.default.createElement(
     ui.Input,
     {
       id: "valueToFill",
       "aria-label": "Value",
       type: "number",
       value: props.query.fillMode.value,
-      onChange: ({ currentTarget }) => props.onChange(__spreadProps$1(__spreadValues$1({}, props.query), {
+      onChange: ({ currentTarget }) => props.onChange({
+        ...props.query,
         fillMode: {
           mode: 2 /* Value */,
           value: currentTarget.valueAsNumber
         }
-      })),
+      }),
       onBlur: () => {
         var _a2;
         return (_a2 = props.onRunQuery) == null ? void 0 : _a2.call(props);
@@ -839,33 +723,15 @@ function FillValueSelect(props) {
   )));
 }
 
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 function filterSQLQuery(query) {
   return !!query.rawSQL;
 }
 function applySQLTemplateVariables(query, scopedVars, getTemplateSrv) {
   const templateSrv = getTemplateSrv();
-  return __spreadProps(__spreadValues({}, query), {
+  return {
+    ...query,
     rawSQL: templateSrv.replace(query.rawSQL, scopedVars, interpolateVariable)
-  });
+  };
 }
 function interpolateVariable(value) {
   if (typeof value === "string" || typeof value === "number") {