@grafana/plugin-ui 0.10.9 → 0.11.0

package/dist/esm/components/DataLinks/DataLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataLink.js","sources":["../../../../src/components/DataLinks/DataLink.tsx"],"sourcesContent":["import React, { type Dispatch, type SetStateAction, useEffect, useState } from 'react';\nimport { css } from '@emotion/css';\nimport { type VariableSuggestion, type DataSourceInstanceSettings, type DataSourceJsonData } from '@grafana/data';\nimport { Button, LegacyForms, DataLinkInput, stylesFactory } from '@grafana/ui';\nconst { FormField, Switch } = LegacyForms;\nimport { type DataLinkConfig } from './types';\nimport { usePrevious } from 'react-use';\nimport { DataSourcePicker } from '../DataSourcePicker/DataSourcePicker';\n\nconst getStyles = stylesFactory(() => ({\n  firstRow: css`\n    display: flex;\n  `,\n  nameField: css`\n    flex: 2;\n  `,\n  regexField: css`\n    flex: 3;\n  `,\n  row: css`\n    display: flex;\n    align-items: baseline;\n  `,\n}));\n\ntype Props = {\n  value: DataLinkConfig;\n  datasources?: Array<DataSourceInstanceSettings<DataSourceJsonData>>;\n  onChange: (value: DataLinkConfig) => void;\n  onDelete: () => void;\n  suggestions: VariableSuggestion[];\n  className?: string;\n};\nexport const DataLink = (props: Props) => {\n  const { value, onChange, onDelete, suggestions, className } = props;\n  const styles = getStyles();\n  const [showInternalLink, setShowInternalLink] = useInternalLink(value.datasourceUid);\n\n  const handleChange = (field: keyof typeof value) => (event: React.ChangeEvent<HTMLInputElement>) => {\n    onChange({\n      ...value,\n      [field]: event.currentTarget.value,\n    });\n  };\n\n  return (\n    <div className={className}>\n      <div className={styles.firstRow + ' gf-form'}>\n        <FormField\n          className={styles.nameField}\n          labelWidth={6}\n          // A bit of a hack to prevent using default value for the width from FormField\n          inputWidth={null}\n          label=\"Field\"\n          type=\"text\"\n          value={value.field}\n          tooltip={'Can be exact field name or a regex pattern that will match on the field name.'}\n          onChange={handleChange('field')}\n        />\n        <Button\n          variant={'destructive'}\n          title=\"Remove field\"\n          icon=\"times\"\n          onClick={(event) => {\n            event.preventDefault();\n            onDelete();\n          }}\n        />\n      </div>\n      <div className=\"gf-form\">\n        <FormField\n          className={styles.nameField}\n          inputWidth={null}\n          label=\"Label\"\n          type=\"text\"\n          value={value.label}\n          onChange={handleChange('label')}\n          tooltip={'Use to provide a meaningful label to the data matched in the regex'}\n        />\n        <FormField\n          className={styles.regexField}\n          inputWidth={null}\n          label=\"Regex\"\n          type=\"text\"\n          value={value.matcherRegex}\n          onChange={handleChange('matcherRegex')}\n          tooltip={\n            'Use to parse and capture some part of the log message. You can use the captured groups in the template.'\n          }\n        />\n      </div>\n      <div className=\"gf-form\">\n        <FormField\n          label={showInternalLink ? 'Query' : 'URL'}\n          labelWidth={6}\n          inputEl={\n            <DataLinkInput\n              placeholder={showInternalLink ? '${__value.raw}' : 'http://example.com/${__value.raw}'}\n              value={value.url || ''}\n              onChange={(newValue) =>\n                onChange({\n                  ...value,\n                  url: newValue,\n                })\n              }\n              suggestions={suggestions}\n            />\n          }\n          className={css`\n            width: 100%;\n          `}\n        />\n      </div>\n\n      <div className={styles.row}>\n        <Switch\n          labelClass={'width-6'}\n          label=\"Internal link\"\n          checked={showInternalLink}\n          onChange={() => {\n            if (showInternalLink) {\n              onChange({\n                ...value,\n                datasourceUid: undefined,\n              });\n            }\n            setShowInternalLink(!showInternalLink);\n          }}\n        />\n        {showInternalLink && (\n          <DataSourcePicker\n            // Uid and value should be always set in the db and so in the items.\n            onChange={(ds) => {\n              onChange({\n                ...value,\n                datasourceUid: ds.uid,\n              });\n            }}\n            current={value.datasourceUid}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n\nfunction useInternalLink(datasourceUid?: string): [boolean, Dispatch<SetStateAction<boolean>>] {\n  const [showInternalLink, setShowInternalLink] = useState<boolean>(!!datasourceUid);\n  const previousUid = usePrevious(datasourceUid);\n\n  // Force internal link visibility change if uid changed outside of this component.\n  useEffect(() => {\n    if (!previousUid && datasourceUid && !showInternalLink) {\n      setShowInternalLink(true);\n    }\n    if (previousUid && !datasourceUid && showInternalLink) {\n      setShowInternalLink(false);\n    }\n  }, [previousUid, datasourceUid, showInternalLink]);\n\n  return [showInternalLink, setShowInternalLink];\n}\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"DataLink.js","sources":["../../../../src/components/DataLinks/DataLink.tsx"],"sourcesContent":["import { type Dispatch, type SetStateAction, useEffect, useState } from 'react';\nimport { css } from '@emotion/css';\nimport { type VariableSuggestion, type DataSourceInstanceSettings, type DataSourceJsonData } from '@grafana/data';\nimport { Button, LegacyForms, DataLinkInput, stylesFactory } from '@grafana/ui';\nconst { FormField, Switch } = LegacyForms;\nimport { type DataLinkConfig } from './types';\nimport { usePrevious } from 'react-use';\nimport { DataSourcePicker } from '../DataSourcePicker/DataSourcePicker';\n\nconst getStyles = stylesFactory(() => ({\n  firstRow: css`\n    display: flex;\n  `,\n  nameField: css`\n    flex: 2;\n  `,\n  regexField: css`\n    flex: 3;\n  `,\n  row: css`\n    display: flex;\n    align-items: baseline;\n  `,\n}));\n\ntype Props = {\n  value: DataLinkConfig;\n  datasources?: Array<DataSourceInstanceSettings<DataSourceJsonData>>;\n  onChange: (value: DataLinkConfig) => void;\n  onDelete: () => void;\n  suggestions: VariableSuggestion[];\n  className?: string;\n};\nexport const DataLink = (props: Props) => {\n  const { value, onChange, onDelete, suggestions, className } = props;\n  const styles = getStyles();\n  const [showInternalLink, setShowInternalLink] = useInternalLink(value.datasourceUid);\n\n  const handleChange = (field: keyof typeof value) => (event: React.ChangeEvent<HTMLInputElement>) => {\n    onChange({\n      ...value,\n      [field]: event.currentTarget.value,\n    });\n  };\n\n  return (\n    <div className={className}>\n      <div className={styles.firstRow + ' gf-form'}>\n        <FormField\n          className={styles.nameField}\n          labelWidth={6}\n          // A bit of a hack to prevent using default value for the width from FormField\n          inputWidth={null}\n          label=\"Field\"\n          type=\"text\"\n          value={value.field}\n          tooltip={'Can be exact field name or a regex pattern that will match on the field name.'}\n          onChange={handleChange('field')}\n        />\n        <Button\n          variant={'destructive'}\n          title=\"Remove field\"\n          icon=\"times\"\n          onClick={(event) => {\n            event.preventDefault();\n            onDelete();\n          }}\n        />\n      </div>\n      <div className=\"gf-form\">\n        <FormField\n          className={styles.nameField}\n          inputWidth={null}\n          label=\"Label\"\n          type=\"text\"\n          value={value.label}\n          onChange={handleChange('label')}\n          tooltip={'Use to provide a meaningful label to the data matched in the regex'}\n        />\n        <FormField\n          className={styles.regexField}\n          inputWidth={null}\n          label=\"Regex\"\n          type=\"text\"\n          value={value.matcherRegex}\n          onChange={handleChange('matcherRegex')}\n          tooltip={\n            'Use to parse and capture some part of the log message. You can use the captured groups in the template.'\n          }\n        />\n      </div>\n      <div className=\"gf-form\">\n        <FormField\n          label={showInternalLink ? 'Query' : 'URL'}\n          labelWidth={6}\n          inputEl={\n            <DataLinkInput\n              placeholder={showInternalLink ? '${__value.raw}' : 'http://example.com/${__value.raw}'}\n              value={value.url || ''}\n              onChange={(newValue) =>\n                onChange({\n                  ...value,\n                  url: newValue,\n                })\n              }\n              suggestions={suggestions}\n            />\n          }\n          className={css`\n            width: 100%;\n          `}\n        />\n      </div>\n\n      <div className={styles.row}>\n        <Switch\n          labelClass={'width-6'}\n          label=\"Internal link\"\n          checked={showInternalLink}\n          onChange={() => {\n            if (showInternalLink) {\n              onChange({\n                ...value,\n                datasourceUid: undefined,\n              });\n            }\n            setShowInternalLink(!showInternalLink);\n          }}\n        />\n        {showInternalLink && (\n          <DataSourcePicker\n            // Uid and value should be always set in the db and so in the items.\n            onChange={(ds) => {\n              onChange({\n                ...value,\n                datasourceUid: ds.uid,\n              });\n            }}\n            current={value.datasourceUid}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n\nfunction useInternalLink(datasourceUid?: string): [boolean, Dispatch<SetStateAction<boolean>>] {\n  const [showInternalLink, setShowInternalLink] = useState<boolean>(!!datasourceUid);\n  const previousUid = usePrevious(datasourceUid);\n\n  // Force internal link visibility change if uid changed outside of this component.\n  useEffect(() => {\n    if (!previousUid && datasourceUid && !showInternalLink) {\n      setShowInternalLink(true);\n    }\n    if (previousUid && !datasourceUid && showInternalLink) {\n      setShowInternalLink(false);\n    }\n  }, [previousUid, datasourceUid, showInternalLink]);\n\n  return [showInternalLink, setShowInternalLink];\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/components/DataLinks/DataLinks.js

@@ -1,4 +1,4 @@
-import React__default from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { css } from '@emotion/css';
 import { useTheme2, Button } from '@grafana/ui';
 import { DataLinkBuiltInVars, VariableOrigin } from '@grafana/data';
@@ -17,49 +17,56 @@ const DataLinks = (props) => {
   const { value, onChange } = props;
   const theme = useTheme2();
   const styles = getStyles(theme);
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("h3", { className: "page-heading" }, "Data links"), /* @__PURE__ */ React__default.createElement("div", { className: styles.infoText }, "Add links to existing fields. Links will be shown in log row details next to the field value."), /* @__PURE__ */ React__default.createElement("div", { className: "gf-form-group" }, value && value.map((field, index) => {
-    return /* @__PURE__ */ React__default.createElement(
-      DataLink,
-      {
-        className: styles.dataLink,
-        key: index,
-        value: field,
-        onChange: (newField) => {
-          const newDataLinks = [...value];
-          newDataLinks.splice(index, 1, newField);
-          onChange(newDataLinks);
-        },
-        onDelete: () => {
-          const newDataLinks = [...value];
-          newDataLinks.splice(index, 1);
-          onChange(newDataLinks);
-        },
-        suggestions: [
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx("h3", { className: "page-heading", children: "Data links" }),
+    /* @__PURE__ */ jsx("div", { className: styles.infoText, children: "Add links to existing fields. Links will be shown in log row details next to the field value." }),
+    /* @__PURE__ */ jsxs("div", { className: "gf-form-group", children: [
+      value && value.map((field, index) => {
+        return /* @__PURE__ */ jsx(
+          DataLink,
           {
-            value: DataLinkBuiltInVars.valueRaw,
-            label: "Raw value",
-            documentation: "Raw value of the field",
-            origin: VariableOrigin.Value
-          }
-        ]
-      }
-    );
-  }), /* @__PURE__ */ React__default.createElement("div", null, /* @__PURE__ */ React__default.createElement(
-    Button,
-    {
-      variant: "secondary",
-      className: css`
+            className: styles.dataLink,
+            value: field,
+            onChange: (newField) => {
+              const newDataLinks = [...value];
+              newDataLinks.splice(index, 1, newField);
+              onChange(newDataLinks);
+            },
+            onDelete: () => {
+              const newDataLinks = [...value];
+              newDataLinks.splice(index, 1);
+              onChange(newDataLinks);
+            },
+            suggestions: [
+              {
+                value: DataLinkBuiltInVars.valueRaw,
+                label: "Raw value",
+                documentation: "Raw value of the field",
+                origin: VariableOrigin.Value
+              }
+            ]
+          },
+          index
+        );
+      }),
+      /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "secondary",
+          className: css`
               margin-right: 10px;
             `,
-      icon: "plus",
-      onClick: (event) => {
-        event.preventDefault();
-        const newDataLinks = [...value || [], { field: "", label: "", matcherRegex: "", url: "" }];
-        onChange(newDataLinks);
-      }
-    },
-    "Add"
-  ))));
+          icon: "plus",
+          onClick: (event) => {
+            event.preventDefault();
+            const newDataLinks = [...value || [], { field: "", label: "", matcherRegex: "", url: "" }];
+            onChange(newDataLinks);
+          },
+          children: "Add"
+        }
+      ) })
+    ] })
+  ] });
 };
 
 export { DataLinks };

package/dist/esm/components/DataLinks/DataLinks.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataLinks.js","sources":["../../../../src/components/DataLinks/DataLinks.tsx"],"sourcesContent":["import React from 'react';\nimport { css } from '@emotion/css';\nimport { Button, useTheme2 } from '@grafana/ui';\nimport { type GrafanaTheme2, VariableOrigin, DataLinkBuiltInVars } from '@grafana/data';\nimport { type DataLinkConfig } from './types';\nimport { DataLink } from './DataLink';\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  infoText: css`\n    padding-bottom: ${theme.v1.spacing.md};\n    color: ${theme.v1.colors.textWeak};\n  `,\n  dataLink: css`\n    margin-bottom: ${theme.v1.spacing.sm};\n  `,\n});\n\ntype Props = {\n  value?: DataLinkConfig[];\n  onChange: (value: DataLinkConfig[]) => void;\n};\nexport const DataLinks = (props: Props) => {\n  const { value, onChange } = props;\n  const theme = useTheme2();\n  const styles = getStyles(theme);\n\n  return (\n    <>\n      <h3 className=\"page-heading\">Data links</h3>\n\n      <div className={styles.infoText}>\n        Add links to existing fields. Links will be shown in log row details next to the field value.\n      </div>\n\n      <div className=\"gf-form-group\">\n        {value &&\n          value.map((field, index) => {\n            return (\n              <DataLink\n                className={styles.dataLink}\n                key={index}\n                value={field}\n                onChange={(newField) => {\n                  const newDataLinks = [...value];\n                  newDataLinks.splice(index, 1, newField);\n                  onChange(newDataLinks);\n                }}\n                onDelete={() => {\n                  const newDataLinks = [...value];\n                  newDataLinks.splice(index, 1);\n                  onChange(newDataLinks);\n                }}\n                suggestions={[\n                  {\n                    value: DataLinkBuiltInVars.valueRaw,\n                    label: 'Raw value',\n                    documentation: 'Raw value of the field',\n                    origin: VariableOrigin.Value,\n                  },\n                ]}\n              />\n            );\n          })}\n        <div>\n          <Button\n            variant={'secondary'}\n            className={css`\n              margin-right: 10px;\n            `}\n            icon=\"plus\"\n            onClick={(event) => {\n              event.preventDefault();\n              const newDataLinks = [...(value || []), { field: '', label: '', matcherRegex: '', url: '' }];\n              onChange(newDataLinks);\n            }}\n          >\n            Add\n          </Button>\n        </div>\n      </div>\n    </>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;AAOA,MAAM,SAAA,GAAY,CAAC,KAA0B,MAAA;AAAA,EAC3C,QAAU,EAAA,GAAA;AAAA,oBACU,EAAA,KAAA,CAAM,EAAG,CAAA,OAAA,CAAQ,EAAE,CAAA;AAAA,WAC5B,EAAA,KAAA,CAAM,EAAG,CAAA,MAAA,CAAO,QAAQ,CAAA;AAAA,EAAA,CAAA;AAAA,EAEnC,QAAU,EAAA,GAAA;AAAA,mBACS,EAAA,KAAA,CAAM,EAAG,CAAA,OAAA,CAAQ,EAAE,CAAA;AAAA,EAAA;AAExC,CAAA,CAAA;AAMa,MAAA,SAAA,GAAY,CAAC,KAAiB,KAAA;AACzC,EAAM,MAAA,EAAE,KAAO,EAAA,QAAA,EAAa,GAAA,KAAA;AAC5B,EAAA,MAAM,QAAQ,SAAU,EAAA;AACxB,EAAM,MAAA,MAAA,GAAS,UAAU,KAAK,CAAA;AAE9B,EACE,uBAAAA,cAAA,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA,+CACG,IAAG,EAAA,EAAA,SAAA,EAAU,kBAAe,YAAU,CAAA,kBAEtCA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,MAAA,CAAO,YAAU,+FAEjC,CAAA,kBAECA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,SAAU,EAAA,eAAA,EAAA,EACZ,SACC,KAAM,CAAA,GAAA,CAAI,CAAC,KAAA,EAAO,KAAU,KAAA;AAC1B,IACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,WAAW,MAAO,CAAA,QAAA;AAAA,QAClB,GAAK,EAAA,KAAA;AAAA,QACL,KAAO,EAAA,KAAA;AAAA,QACP,QAAA,EAAU,CAAC,QAAa,KAAA;AACtB,UAAM,MAAA,YAAA,GAAe,CAAC,GAAG,KAAK,CAAA;AAC9B,UAAa,YAAA,CAAA,MAAA,CAAO,KAAO,EAAA,CAAA,EAAG,QAAQ,CAAA;AACtC,UAAA,QAAA,CAAS,YAAY,CAAA;AAAA,SACvB;AAAA,QACA,UAAU,MAAM;AACd,UAAM,MAAA,YAAA,GAAe,CAAC,GAAG,KAAK,CAAA;AAC9B,UAAa,YAAA,CAAA,MAAA,CAAO,OAAO,CAAC,CAAA;AAC5B,UAAA,QAAA,CAAS,YAAY,CAAA;AAAA,SACvB;AAAA,QACA,WAAa,EAAA;AAAA,UACX;AAAA,YACE,OAAO,mBAAoB,CAAA,QAAA;AAAA,YAC3B,KAAO,EAAA,WAAA;AAAA,YACP,aAAe,EAAA,wBAAA;AAAA,YACf,QAAQ,cAAe,CAAA;AAAA;AACzB;AACF;AAAA,KACF;AAAA,GAEH,CACH,kBAAAA,cAAA,CAAA,aAAA,CAAC,KACC,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,OAAS,EAAA,WAAA;AAAA,MACT,SAAW,EAAA,GAAA;AAAA;AAAA,YAAA,CAAA;AAAA,MAGX,IAAK,EAAA,MAAA;AAAA,MACL,OAAA,EAAS,CAAC,KAAU,KAAA;AAClB,QAAA,KAAA,CAAM,cAAe,EAAA;AACrB,QAAA,MAAM,YAAe,GAAA,CAAC,GAAI,KAAA,IAAS,EAAK,EAAA,EAAE,KAAO,EAAA,EAAA,EAAI,OAAO,EAAI,EAAA,YAAA,EAAc,EAAI,EAAA,GAAA,EAAK,IAAI,CAAA;AAC3F,QAAA,QAAA,CAAS,YAAY,CAAA;AAAA;AACvB,KAAA;AAAA,IACD;AAAA,GAGH,CACF,CACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"DataLinks.js","sources":["../../../../src/components/DataLinks/DataLinks.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport { Button, useTheme2 } from '@grafana/ui';\nimport { type GrafanaTheme2, VariableOrigin, DataLinkBuiltInVars } from '@grafana/data';\nimport { type DataLinkConfig } from './types';\nimport { DataLink } from './DataLink';\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  infoText: css`\n    padding-bottom: ${theme.v1.spacing.md};\n    color: ${theme.v1.colors.textWeak};\n  `,\n  dataLink: css`\n    margin-bottom: ${theme.v1.spacing.sm};\n  `,\n});\n\ntype Props = {\n  value?: DataLinkConfig[];\n  onChange: (value: DataLinkConfig[]) => void;\n};\nexport const DataLinks = (props: Props) => {\n  const { value, onChange } = props;\n  const theme = useTheme2();\n  const styles = getStyles(theme);\n\n  return (\n    <>\n      <h3 className=\"page-heading\">Data links</h3>\n\n      <div className={styles.infoText}>\n        Add links to existing fields. Links will be shown in log row details next to the field value.\n      </div>\n\n      <div className=\"gf-form-group\">\n        {value &&\n          value.map((field, index) => {\n            return (\n              <DataLink\n                className={styles.dataLink}\n                key={index}\n                value={field}\n                onChange={(newField) => {\n                  const newDataLinks = [...value];\n                  newDataLinks.splice(index, 1, newField);\n                  onChange(newDataLinks);\n                }}\n                onDelete={() => {\n                  const newDataLinks = [...value];\n                  newDataLinks.splice(index, 1);\n                  onChange(newDataLinks);\n                }}\n                suggestions={[\n                  {\n                    value: DataLinkBuiltInVars.valueRaw,\n                    label: 'Raw value',\n                    documentation: 'Raw value of the field',\n                    origin: VariableOrigin.Value,\n                  },\n                ]}\n              />\n            );\n          })}\n        <div>\n          <Button\n            variant={'secondary'}\n            className={css`\n              margin-right: 10px;\n            `}\n            icon=\"plus\"\n            onClick={(event) => {\n              event.preventDefault();\n              const newDataLinks = [...(value || []), { field: '', label: '', matcherRegex: '', url: '' }];\n              onChange(newDataLinks);\n            }}\n          >\n            Add\n          </Button>\n        </div>\n      </div>\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAMA,MAAM,SAAA,GAAY,CAAC,KAA0B,MAAA;AAAA,EAC3C,QAAU,EAAA,GAAA;AAAA,oBACU,EAAA,KAAA,CAAM,EAAG,CAAA,OAAA,CAAQ,EAAE,CAAA;AAAA,WAC5B,EAAA,KAAA,CAAM,EAAG,CAAA,MAAA,CAAO,QAAQ,CAAA;AAAA,EAAA,CAAA;AAAA,EAEnC,QAAU,EAAA,GAAA;AAAA,mBACS,EAAA,KAAA,CAAM,EAAG,CAAA,OAAA,CAAQ,EAAE,CAAA;AAAA,EAAA;AAExC,CAAA,CAAA;AAMa,MAAA,SAAA,GAAY,CAAC,KAAiB,KAAA;AACzC,EAAM,MAAA,EAAE,KAAO,EAAA,QAAA,EAAa,GAAA,KAAA;AAC5B,EAAA,MAAM,QAAQ,SAAU,EAAA;AACxB,EAAM,MAAA,MAAA,GAAS,UAAU,KAAK,CAAA;AAE9B,EAAA,uBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAC,GAAA,CAAA,IAAA,EAAA,EAAG,SAAU,EAAA,cAAA,EAAe,QAAU,EAAA,YAAA,EAAA,CAAA;AAAA,oBAEtC,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,MAAA,CAAO,UAAU,QAEjC,EAAA,+FAAA,EAAA,CAAA;AAAA,oBAEA,IAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,eACZ,EAAA,QAAA,EAAA;AAAA,MAAA,KAAA,IACC,KAAM,CAAA,GAAA,CAAI,CAAC,KAAA,EAAO,KAAU,KAAA;AAC1B,QACE,uBAAA,GAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,WAAW,MAAO,CAAA,QAAA;AAAA,YAElB,KAAO,EAAA,KAAA;AAAA,YACP,QAAA,EAAU,CAAC,QAAa,KAAA;AACtB,cAAM,MAAA,YAAA,GAAe,CAAC,GAAG,KAAK,CAAA;AAC9B,cAAa,YAAA,CAAA,MAAA,CAAO,KAAO,EAAA,CAAA,EAAG,QAAQ,CAAA;AACtC,cAAA,QAAA,CAAS,YAAY,CAAA;AAAA,aACvB;AAAA,YACA,UAAU,MAAM;AACd,cAAM,MAAA,YAAA,GAAe,CAAC,GAAG,KAAK,CAAA;AAC9B,cAAa,YAAA,CAAA,MAAA,CAAO,OAAO,CAAC,CAAA;AAC5B,cAAA,QAAA,CAAS,YAAY,CAAA;AAAA,aACvB;AAAA,YACA,WAAa,EAAA;AAAA,cACX;AAAA,gBACE,OAAO,mBAAoB,CAAA,QAAA;AAAA,gBAC3B,KAAO,EAAA,WAAA;AAAA,gBACP,aAAe,EAAA,wBAAA;AAAA,gBACf,QAAQ,cAAe,CAAA;AAAA;AACzB;AACF,WAAA;AAAA,UAnBK;AAAA,SAoBP;AAAA,OAEH,CAAA;AAAA,0BACF,KACC,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,OAAS,EAAA,WAAA;AAAA,UACT,SAAW,EAAA,GAAA;AAAA;AAAA,YAAA,CAAA;AAAA,UAGX,IAAK,EAAA,MAAA;AAAA,UACL,OAAA,EAAS,CAAC,KAAU,KAAA;AAClB,YAAA,KAAA,CAAM,cAAe,EAAA;AACrB,YAAA,MAAM,YAAe,GAAA,CAAC,GAAI,KAAA,IAAS,EAAK,EAAA,EAAE,KAAO,EAAA,EAAA,EAAI,OAAO,EAAI,EAAA,YAAA,EAAc,EAAI,EAAA,GAAA,EAAK,IAAI,CAAA;AAC3F,YAAA,QAAA,CAAS,YAAY,CAAA;AAAA,WACvB;AAAA,UACD,QAAA,EAAA;AAAA;AAAA,OAGH,EAAA;AAAA,KACF,EAAA;AAAA,GACF,EAAA,CAAA;AAEJ;;;;"}

package/dist/esm/components/DataSourcePicker/DataSourcePicker.js

@@ -1,4 +1,5 @@
-import React__default, { PureComponent } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { PureComponent } from 'react';
 import { Select, HorizontalGroup } from '@grafana/ui';
 import '@grafana/data';
 import { selectors } from '@grafana/e2e-selectors';
@@ -66,7 +67,7 @@ class DataSourcePicker extends PureComponent {
     const { error } = this.state;
     const options = this.getDataSourceOptions();
     const value = this.getCurrentValue();
-    return /* @__PURE__ */ React__default.createElement("div", { "aria-label": selectors.components.DataSourcePicker.container }, /* @__PURE__ */ React__default.createElement(
+    return /* @__PURE__ */ jsx("div", { "aria-label": selectors.components.DataSourcePicker.container, children: /* @__PURE__ */ jsx(
       Select,
       {
         className: "ds-picker select-container",
@@ -85,12 +86,16 @@ class DataSourcePicker extends PureComponent {
         invalid: !!error,
         getOptionLabel: (o) => {
           if (o.meta && isUnsignedPluginSignature(o.meta.signature) && o !== value) {
-            return /* @__PURE__ */ React__default.createElement(HorizontalGroup, { align: "center", justify: "space-between" }, /* @__PURE__ */ React__default.createElement("span", null, o.label), " ", /* @__PURE__ */ React__default.createElement(PluginSignatureBadge, { status: o.meta.signature }));
+            return /* @__PURE__ */ jsxs(HorizontalGroup, { align: "center", justify: "space-between", children: [
+              /* @__PURE__ */ jsx("span", { children: o.label }),
+              " ",
+              /* @__PURE__ */ jsx(PluginSignatureBadge, { status: o.meta.signature })
+            ] });
           }
           return o.label || "";
         }
       }
-    ));
+    ) });
   }
 }
 __publicField(DataSourcePicker, "defaultProps", {

package/dist/esm/components/DataSourcePicker/DataSourcePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataSourcePicker.js","sources":["../../../../src/components/DataSourcePicker/DataSourcePicker.tsx"],"sourcesContent":["// Libraries\nimport React, { PureComponent } from 'react';\n\n// Components\nimport { HorizontalGroup, Select } from '@grafana/ui';\nimport { type DataSourceInstanceSettings, type SelectableValue } from '@grafana/data';\nimport { selectors } from '@grafana/e2e-selectors';\nimport { isUnsignedPluginSignature, PluginSignatureBadge } from '../Plugins/PluginSignatureBadge';\nimport { getDataSourceSrv, type DataSourceSrv } from '@grafana/runtime';\n\nexport interface Props {\n  onChange: (ds: DataSourceInstanceSettings) => void;\n  current: string | null;\n  hideTextValue?: boolean;\n  onBlur?: () => void;\n  autoFocus?: boolean;\n  openMenuOnFocus?: boolean;\n  placeholder?: string;\n  tracing?: boolean;\n  mixed?: boolean;\n  dashboard?: boolean;\n  metrics?: boolean;\n  annotations?: boolean;\n  variables?: boolean;\n  pluginId?: string;\n  noDefault?: boolean;\n}\n\nexport interface State {\n  error?: string;\n}\n\nexport class DataSourcePicker extends PureComponent<Props, State> {\n  dataSourceSrv: DataSourceSrv = getDataSourceSrv();\n\n  static defaultProps: Partial<Props> = {\n    autoFocus: false,\n    openMenuOnFocus: false,\n    placeholder: 'Select datasource',\n  };\n\n  state: State = {};\n\n  constructor(props: Props) {\n    super(props);\n  }\n\n  componentDidMount() {\n    const { current } = this.props;\n    const dsSettings = this.dataSourceSrv.getInstanceSettings(current!);\n    if (!dsSettings) {\n      this.setState({ error: 'Could not find data source ' + current });\n    }\n  }\n\n  onChange = (item: SelectableValue<string>) => {\n    const dsSettings = this.dataSourceSrv.getInstanceSettings(item.value!);\n\n    if (dsSettings) {\n      this.props.onChange(dsSettings);\n      this.setState({ error: undefined });\n    }\n  };\n\n  private getCurrentValue(): SelectableValue<string> {\n    const { current, hideTextValue, noDefault } = this.props;\n\n    if (!current && noDefault) {\n      return {\n        label: 'No datasources found',\n      };\n    }\n\n    const ds = this.dataSourceSrv.getInstanceSettings(current!);\n\n    if (ds) {\n      return {\n        label: ds.name.substr(0, 37),\n        value: ds.name,\n        imgUrl: ds.meta.info.logos.small,\n        hideText: hideTextValue,\n        meta: ds.meta,\n      };\n    }\n\n    return {\n      label: (current ?? 'no name') + ' - not found',\n      value: (current ?? 'no name') + ' - not found',\n      imgUrl: '',\n      hideText: hideTextValue,\n    };\n  }\n\n  getDataSourceOptions(): Array<SelectableValue<string>> {\n    const options: Array<SelectableValue<string>> = this.dataSourceSrv.getList().map((ds) => ({\n      value: ds.uid,\n      label: ds.name,\n      imgUrl: ds.meta.info.logos.small,\n      meta: ds.meta,\n    }));\n\n    return options;\n  }\n\n  render() {\n    const { autoFocus, onBlur, openMenuOnFocus, placeholder } = this.props;\n    const { error } = this.state;\n    const options = this.getDataSourceOptions();\n    const value = this.getCurrentValue();\n\n    return (\n      <div aria-label={selectors.components.DataSourcePicker.container}>\n        <Select\n          className=\"ds-picker select-container\"\n          isMulti={false}\n          isClearable={false}\n          backspaceRemovesValue={false}\n          onChange={this.onChange}\n          options={options}\n          autoFocus={autoFocus}\n          onBlur={onBlur}\n          openMenuOnFocus={openMenuOnFocus}\n          maxMenuHeight={500}\n          placeholder={placeholder}\n          noOptionsMessage=\"No datasources found\"\n          value={value}\n          invalid={!!error}\n          getOptionLabel={(o) => {\n            if (o.meta && isUnsignedPluginSignature(o.meta.signature) && o !== value) {\n              return (\n                <HorizontalGroup align=\"center\" justify=\"space-between\">\n                  <span>{o.label}</span> <PluginSignatureBadge status={o.meta.signature} />\n                </HorizontalGroup>\n              );\n            }\n            return o.label || '';\n          }}\n        />\n      </div>\n    );\n  }\n}\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"DataSourcePicker.js","sources":["../../../../src/components/DataSourcePicker/DataSourcePicker.tsx"],"sourcesContent":["// Libraries\nimport { PureComponent } from 'react';\n\n// Components\nimport { HorizontalGroup, Select } from '@grafana/ui';\nimport { type DataSourceInstanceSettings, type SelectableValue } from '@grafana/data';\nimport { selectors } from '@grafana/e2e-selectors';\nimport { isUnsignedPluginSignature, PluginSignatureBadge } from '../Plugins/PluginSignatureBadge';\nimport { getDataSourceSrv, type DataSourceSrv } from '@grafana/runtime';\n\nexport interface Props {\n  onChange: (ds: DataSourceInstanceSettings) => void;\n  current: string | null;\n  hideTextValue?: boolean;\n  onBlur?: () => void;\n  autoFocus?: boolean;\n  openMenuOnFocus?: boolean;\n  placeholder?: string;\n  tracing?: boolean;\n  mixed?: boolean;\n  dashboard?: boolean;\n  metrics?: boolean;\n  annotations?: boolean;\n  variables?: boolean;\n  pluginId?: string;\n  noDefault?: boolean;\n}\n\nexport interface State {\n  error?: string;\n}\n\nexport class DataSourcePicker extends PureComponent<Props, State> {\n  dataSourceSrv: DataSourceSrv = getDataSourceSrv();\n\n  static defaultProps: Partial<Props> = {\n    autoFocus: false,\n    openMenuOnFocus: false,\n    placeholder: 'Select datasource',\n  };\n\n  state: State = {};\n\n  constructor(props: Props) {\n    super(props);\n  }\n\n  componentDidMount() {\n    const { current } = this.props;\n    const dsSettings = this.dataSourceSrv.getInstanceSettings(current!);\n    if (!dsSettings) {\n      this.setState({ error: 'Could not find data source ' + current });\n    }\n  }\n\n  onChange = (item: SelectableValue<string>) => {\n    const dsSettings = this.dataSourceSrv.getInstanceSettings(item.value!);\n\n    if (dsSettings) {\n      this.props.onChange(dsSettings);\n      this.setState({ error: undefined });\n    }\n  };\n\n  private getCurrentValue(): SelectableValue<string> {\n    const { current, hideTextValue, noDefault } = this.props;\n\n    if (!current && noDefault) {\n      return {\n        label: 'No datasources found',\n      };\n    }\n\n    const ds = this.dataSourceSrv.getInstanceSettings(current!);\n\n    if (ds) {\n      return {\n        label: ds.name.substr(0, 37),\n        value: ds.name,\n        imgUrl: ds.meta.info.logos.small,\n        hideText: hideTextValue,\n        meta: ds.meta,\n      };\n    }\n\n    return {\n      label: (current ?? 'no name') + ' - not found',\n      value: (current ?? 'no name') + ' - not found',\n      imgUrl: '',\n      hideText: hideTextValue,\n    };\n  }\n\n  getDataSourceOptions(): Array<SelectableValue<string>> {\n    const options: Array<SelectableValue<string>> = this.dataSourceSrv.getList().map((ds) => ({\n      value: ds.uid,\n      label: ds.name,\n      imgUrl: ds.meta.info.logos.small,\n      meta: ds.meta,\n    }));\n\n    return options;\n  }\n\n  render() {\n    const { autoFocus, onBlur, openMenuOnFocus, placeholder } = this.props;\n    const { error } = this.state;\n    const options = this.getDataSourceOptions();\n    const value = this.getCurrentValue();\n\n    return (\n      <div aria-label={selectors.components.DataSourcePicker.container}>\n        <Select\n          className=\"ds-picker select-container\"\n          isMulti={false}\n          isClearable={false}\n          backspaceRemovesValue={false}\n          onChange={this.onChange}\n          options={options}\n          autoFocus={autoFocus}\n          onBlur={onBlur}\n          openMenuOnFocus={openMenuOnFocus}\n          maxMenuHeight={500}\n          placeholder={placeholder}\n          noOptionsMessage=\"No datasources found\"\n          value={value}\n          invalid={!!error}\n          getOptionLabel={(o) => {\n            if (o.meta && isUnsignedPluginSignature(o.meta.signature) && o !== value) {\n              return (\n                <HorizontalGroup align=\"center\" justify=\"space-between\">\n                  <span>{o.label}</span> <PluginSignatureBadge status={o.meta.signature} />\n                </HorizontalGroup>\n              );\n            }\n            return o.label || '';\n          }}\n        />\n      </div>\n    );\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/components/DatePicker/DatePicker.js

@@ -1,4 +1,5 @@
-import React__default, { memo } from 'react';
+import { jsx } from 'react/jsx-runtime';
+import { memo } from 'react';
 import Calendar from 'react-calendar';
 import { useTheme2, ClickOutsideWrapper, Icon } from '@grafana/ui';
 import { getStyles, getBodyStyles } from './styles.js';
@@ -10,20 +11,20 @@ const DatePicker = memo((props) => {
   if (!isOpen) {
     return null;
   }
-  return /* @__PURE__ */ React__default.createElement(ClickOutsideWrapper, { useCapture: true, includeButtonPress: false, onClick: onClose }, /* @__PURE__ */ React__default.createElement("div", { className: styles.modal, "data-testid": "date-picker" }, /* @__PURE__ */ React__default.createElement(Body, { ...props })));
+  return /* @__PURE__ */ jsx(ClickOutsideWrapper, { useCapture: true, includeButtonPress: false, onClick: onClose, children: /* @__PURE__ */ jsx("div", { className: styles.modal, "data-testid": "date-picker", children: /* @__PURE__ */ jsx(Body, { ...props }) }) });
 });
 DatePicker.displayName = "DatePicker";
 const Body = memo(({ value, onChange }) => {
   const theme = useTheme2();
   const styles = getBodyStyles(theme);
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     Calendar,
     {
       className: styles.body,
       tileClassName: styles.title,
       value: value || /* @__PURE__ */ new Date(),
-      nextLabel: /* @__PURE__ */ React__default.createElement(Icon, { name: "angle-right" }),
-      prevLabel: /* @__PURE__ */ React__default.createElement(Icon, { name: "angle-left" }),
+      nextLabel: /* @__PURE__ */ jsx(Icon, { name: "angle-right" }),
+      prevLabel: /* @__PURE__ */ jsx(Icon, { name: "angle-left" }),
       onChange: (ev) => {
         if (!Array.isArray(ev)) {
           onChange(ev);

package/dist/esm/components/DatePicker/DatePicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePicker.js","sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import React, { memo } from 'react';\nimport Calendar from 'react-calendar';\nimport { useTheme2, ClickOutsideWrapper, Icon } from '@grafana/ui';\nimport { getStyles, getBodyStyles } from './styles';\n\nexport interface DatePickerProps {\n  isOpen?: boolean;\n  onClose: () => void;\n  onChange: (value: Date) => void;\n  value?: Date;\n}\n\nexport const DatePicker = memo<DatePickerProps>((props) => {\n  const theme = useTheme2();\n  const styles = getStyles(theme);\n  const { isOpen, onClose } = props;\n\n  if (!isOpen) {\n    return null;\n  }\n\n  return (\n    <ClickOutsideWrapper useCapture={true} includeButtonPress={false} onClick={onClose}>\n      <div className={styles.modal} data-testid=\"date-picker\">\n        <Body {...props} />\n      </div>\n    </ClickOutsideWrapper>\n  );\n});\n\nDatePicker.displayName = 'DatePicker';\n\nconst Body = memo<DatePickerProps>(({ value, onChange }) => {\n  const theme = useTheme2();\n  const styles = getBodyStyles(theme);\n\n  return (\n    <Calendar\n      className={styles.body}\n      tileClassName={styles.title}\n      value={value || new Date()}\n      nextLabel={<Icon name=\"angle-right\" />}\n      prevLabel={<Icon name=\"angle-left\" />}\n      onChange={(ev: any) => {\n        if (!Array.isArray(ev)) {\n          onChange(ev);\n        }\n      }}\n      locale=\"en\"\n    />\n  );\n});\n\nBody.displayName = 'Body';\n"],"names":["React"],"mappings":";;;;;AAYa,MAAA,UAAA,GAAa,IAAsB,CAAA,CAAC,KAAU,KAAA;AACzD,EAAA,MAAM,QAAQ,SAAU,EAAA;AACxB,EAAM,MAAA,MAAA,GAAS,UAAU,KAAK,CAAA;AAC9B,EAAM,MAAA,EAAE,MAAQ,EAAA,OAAA,EAAY,GAAA,KAAA;AAE5B,EAAA,IAAI,CAAC,MAAQ,EAAA;AACX,IAAO,OAAA,IAAA;AAAA;AAGT,EACE,uBAAAA,cAAA,CAAA,aAAA,CAAC,uBAAoB,UAAY,EAAA,IAAA,EAAM,oBAAoB,KAAO,EAAA,OAAA,EAAS,2BACxEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,WAAW,MAAO,CAAA,KAAA,EAAO,eAAY,aACxC,EAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,QAAM,GAAG,KAAA,EAAO,CACnB,CACF,CAAA;AAEJ,CAAC;AAED,UAAA,CAAW,WAAc,GAAA,YAAA;AAEzB,MAAM,OAAO,IAAsB,CAAA,CAAC,EAAE,KAAA,EAAO,UAAe,KAAA;AAC1D,EAAA,MAAM,QAAQ,SAAU,EAAA;AACxB,EAAM,MAAA,MAAA,GAAS,cAAc,KAAK,CAAA;AAElC,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,WAAW,MAAO,CAAA,IAAA;AAAA,MAClB,eAAe,MAAO,CAAA,KAAA;AAAA,MACtB,KAAA,EAAO,KAAS,oBAAA,IAAI,IAAK,EAAA;AAAA,MACzB,SAAW,kBAAAA,cAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAK,aAAc,EAAA,CAAA;AAAA,MACpC,SAAW,kBAAAA,cAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAK,YAAa,EAAA,CAAA;AAAA,MACnC,QAAA,EAAU,CAAC,EAAY,KAAA;AACrB,QAAA,IAAI,CAAC,KAAA,CAAM,OAAQ,CAAA,EAAE,CAAG,EAAA;AACtB,UAAA,QAAA,CAAS,EAAE,CAAA;AAAA;AACb,OACF;AAAA,MACA,MAAO,EAAA;AAAA;AAAA,GACT;AAEJ,CAAC,CAAA;AAED,IAAA,CAAK,WAAc,GAAA,MAAA;;;;"}
+{"version":3,"file":"DatePicker.js","sources":["../../../../src/components/DatePicker/DatePicker.tsx"],"sourcesContent":["import { memo } from 'react';\nimport Calendar from 'react-calendar';\nimport { useTheme2, ClickOutsideWrapper, Icon } from '@grafana/ui';\nimport { getStyles, getBodyStyles } from './styles';\n\nexport interface DatePickerProps {\n  isOpen?: boolean;\n  onClose: () => void;\n  onChange: (value: Date) => void;\n  value?: Date;\n}\n\nexport const DatePicker = memo<DatePickerProps>((props) => {\n  const theme = useTheme2();\n  const styles = getStyles(theme);\n  const { isOpen, onClose } = props;\n\n  if (!isOpen) {\n    return null;\n  }\n\n  return (\n    <ClickOutsideWrapper useCapture={true} includeButtonPress={false} onClick={onClose}>\n      <div className={styles.modal} data-testid=\"date-picker\">\n        <Body {...props} />\n      </div>\n    </ClickOutsideWrapper>\n  );\n});\n\nDatePicker.displayName = 'DatePicker';\n\nconst Body = memo<DatePickerProps>(({ value, onChange }) => {\n  const theme = useTheme2();\n  const styles = getBodyStyles(theme);\n\n  return (\n    <Calendar\n      className={styles.body}\n      tileClassName={styles.title}\n      value={value || new Date()}\n      nextLabel={<Icon name=\"angle-right\" />}\n      prevLabel={<Icon name=\"angle-left\" />}\n      onChange={(ev: any) => {\n        if (!Array.isArray(ev)) {\n          onChange(ev);\n        }\n      }}\n      locale=\"en\"\n    />\n  );\n});\n\nBody.displayName = 'Body';\n"],"names":[],"mappings":";;;;;;AAYa,MAAA,UAAA,GAAa,IAAsB,CAAA,CAAC,KAAU,KAAA;AACzD,EAAA,MAAM,QAAQ,SAAU,EAAA;AACxB,EAAM,MAAA,MAAA,GAAS,UAAU,KAAK,CAAA;AAC9B,EAAM,MAAA,EAAE,MAAQ,EAAA,OAAA,EAAY,GAAA,KAAA;AAE5B,EAAA,IAAI,CAAC,MAAQ,EAAA;AACX,IAAO,OAAA,IAAA;AAAA;AAGT,EACE,uBAAA,GAAA,CAAC,uBAAoB,UAAY,EAAA,IAAA,EAAM,oBAAoB,KAAO,EAAA,OAAA,EAAS,SACzE,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA,EAAI,WAAW,MAAO,CAAA,KAAA,EAAO,eAAY,aACxC,EAAA,QAAA,kBAAA,GAAA,CAAC,QAAM,GAAG,KAAA,EAAO,GACnB,CACF,EAAA,CAAA;AAEJ,CAAC;AAED,UAAA,CAAW,WAAc,GAAA,YAAA;AAEzB,MAAM,OAAO,IAAsB,CAAA,CAAC,EAAE,KAAA,EAAO,UAAe,KAAA;AAC1D,EAAA,MAAM,QAAQ,SAAU,EAAA;AACxB,EAAM,MAAA,MAAA,GAAS,cAAc,KAAK,CAAA;AAElC,EACE,uBAAA,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,WAAW,MAAO,CAAA,IAAA;AAAA,MAClB,eAAe,MAAO,CAAA,KAAA;AAAA,MACtB,KAAA,EAAO,KAAS,oBAAA,IAAI,IAAK,EAAA;AAAA,MACzB,SAAW,kBAAA,GAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAK,aAAc,EAAA,CAAA;AAAA,MACpC,SAAW,kBAAA,GAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAK,YAAa,EAAA,CAAA;AAAA,MACnC,QAAA,EAAU,CAAC,EAAY,KAAA;AACrB,QAAA,IAAI,CAAC,KAAA,CAAM,OAAQ,CAAA,EAAE,CAAG,EAAA;AACtB,UAAA,QAAA,CAAS,EAAE,CAAA;AAAA;AACb,OACF;AAAA,MACA,MAAO,EAAA;AAAA;AAAA,GACT;AAEJ,CAAC,CAAA;AAED,IAAA,CAAK,WAAc,GAAA,MAAA;;;;"}

package/dist/esm/components/DatePickerWithInput/DatePickerWithInput.js

@@ -1,5 +1,6 @@
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import { Input } from '@grafana/ui';
-import React__default from 'react';
+import { useState } from 'react';
 import { DatePicker } from '../DatePicker/DatePicker.js';
 import { getStyles } from './styles.js';
 import { cx } from '@emotion/css';
@@ -7,21 +8,24 @@ import { cx } from '@emotion/css';
 const formatDate = (date) => date.toISOString().split("T")[0];
 const DatePickerWithInput = (props) => {
   const { value, onChange, className, ...rest } = props;
-  const [open, setOpen] = React__default.useState(false);
+  const [open, setOpen] = useState(false);
   const styles = getStyles();
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
-    Input,
-    {
-      type: "date",
-      placeholder: "Date",
-      value: formatDate(value || /* @__PURE__ */ new Date()),
-      onClick: () => setOpen(true),
-      onChange: () => {
-      },
-      className: cx(styles.input, className),
-      ...rest
-    }
-  ), /* @__PURE__ */ React__default.createElement(DatePicker, { isOpen: open, value, onChange: (ev) => onChange(ev), onClose: () => setOpen(false) }));
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        type: "date",
+        placeholder: "Date",
+        value: formatDate(value || /* @__PURE__ */ new Date()),
+        onClick: () => setOpen(true),
+        onChange: () => {
+        },
+        className: cx(styles.input, className),
+        ...rest
+      }
+    ),
+    /* @__PURE__ */ jsx(DatePicker, { isOpen: open, value, onChange: (ev) => onChange(ev), onClose: () => setOpen(false) })
+  ] });
 };
 
 export { DatePickerWithInput, formatDate };

package/dist/esm/components/DatePickerWithInput/DatePickerWithInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DatePickerWithInput.js","sources":["../../../../src/components/DatePickerWithInput/DatePickerWithInput.tsx"],"sourcesContent":["import { Input } from '@grafana/ui';\n\nimport React, { type ComponentProps } from 'react';\nimport { DatePicker } from '../DatePicker/DatePicker';\nimport { getStyles } from './styles';\nimport { cx } from '@emotion/css';\n\nexport const formatDate = (date: Date) => date.toISOString().split('T')[0];\n\nexport interface DatePickerWithInputProps extends Omit<ComponentProps<typeof Input>, 'ref' | 'value' | 'onChange'> {\n  value?: Date;\n  onChange: (value: Date) => void;\n}\n\nexport const DatePickerWithInput = (props: DatePickerWithInputProps) => {\n  const { value, onChange, className, ...rest } = props;\n  const [open, setOpen] = React.useState(false);\n  const styles = getStyles();\n\n  return (\n    <>\n      <Input\n        type=\"date\"\n        placeholder=\"Date\"\n        value={formatDate(value || new Date())}\n        onClick={() => setOpen(true)}\n        onChange={() => {}}\n        className={cx(styles.input, className)}\n        {...rest}\n      />\n      <DatePicker isOpen={open} value={value} onChange={(ev: any) => onChange(ev)} onClose={() => setOpen(false)} />\n    </>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;AAOa,MAAA,UAAA,GAAa,CAAC,IAAe,KAAA,IAAA,CAAK,aAAc,CAAA,KAAA,CAAM,GAAG,CAAA,CAAE,CAAC;AAO5D,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;AACtE,EAAA,MAAM,EAAE,KAAO,EAAA,QAAA,EAAU,SAAW,EAAA,GAAG,MAAS,GAAA,KAAA;AAChD,EAAA,MAAM,CAAC,IAAM,EAAA,OAAO,CAAI,GAAAA,cAAA,CAAM,SAAS,KAAK,CAAA;AAC5C,EAAA,MAAM,SAAS,SAAU,EAAA;AAEzB,EAAA,uBAEIA,cAAA,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,IAAK,EAAA,MAAA;AAAA,MACL,WAAY,EAAA,MAAA;AAAA,MACZ,KAAO,EAAA,UAAA,CAAW,KAAS,oBAAA,IAAI,MAAM,CAAA;AAAA,MACrC,OAAA,EAAS,MAAM,OAAA,CAAQ,IAAI,CAAA;AAAA,MAC3B,UAAU,MAAM;AAAA,OAAC;AAAA,MACjB,SAAW,EAAA,EAAA,CAAG,MAAO,CAAA,KAAA,EAAO,SAAS,CAAA;AAAA,MACpC,GAAG;AAAA;AAAA,qBAELA,cAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,MAAQ,EAAA,IAAA,EAAM,OAAc,QAAU,EAAA,CAAC,EAAY,KAAA,QAAA,CAAS,EAAE,CAAG,EAAA,OAAA,EAAS,MAAM,OAAQ,CAAA,KAAK,GAAG,CAC9G,CAAA;AAEJ;;;;"}
+{"version":3,"file":"DatePickerWithInput.js","sources":["../../../../src/components/DatePickerWithInput/DatePickerWithInput.tsx"],"sourcesContent":["import { Input } from '@grafana/ui';\n\nimport { type ComponentProps, useState } from 'react';\nimport { DatePicker } from '../DatePicker/DatePicker';\nimport { getStyles } from './styles';\nimport { cx } from '@emotion/css';\n\nexport const formatDate = (date: Date) => date.toISOString().split('T')[0];\n\nexport interface DatePickerWithInputProps extends Omit<ComponentProps<typeof Input>, 'ref' | 'value' | 'onChange'> {\n  value?: Date;\n  onChange: (value: Date) => void;\n}\n\nexport const DatePickerWithInput = (props: DatePickerWithInputProps) => {\n  const { value, onChange, className, ...rest } = props;\n  const [open, setOpen] = useState(false);\n  const styles = getStyles();\n\n  return (\n    <>\n      <Input\n        type=\"date\"\n        placeholder=\"Date\"\n        value={formatDate(value || new Date())}\n        onClick={() => setOpen(true)}\n        onChange={() => {}}\n        className={cx(styles.input, className)}\n        {...rest}\n      />\n      <DatePicker isOpen={open} value={value} onChange={(ev: any) => onChange(ev)} onClose={() => setOpen(false)} />\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AAOa,MAAA,UAAA,GAAa,CAAC,IAAe,KAAA,IAAA,CAAK,aAAc,CAAA,KAAA,CAAM,GAAG,CAAA,CAAE,CAAC;AAO5D,MAAA,mBAAA,GAAsB,CAAC,KAAoC,KAAA;AACtE,EAAA,MAAM,EAAE,KAAO,EAAA,QAAA,EAAU,SAAW,EAAA,GAAG,MAAS,GAAA,KAAA;AAChD,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,KAAK,CAAA;AACtC,EAAA,MAAM,SAAS,SAAU,EAAA;AAEzB,EAAA,uBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,IAAK,EAAA,MAAA;AAAA,QACL,WAAY,EAAA,MAAA;AAAA,QACZ,KAAO,EAAA,UAAA,CAAW,KAAS,oBAAA,IAAI,MAAM,CAAA;AAAA,QACrC,OAAA,EAAS,MAAM,OAAA,CAAQ,IAAI,CAAA;AAAA,QAC3B,UAAU,MAAM;AAAA,SAAC;AAAA,QACjB,SAAW,EAAA,EAAA,CAAG,MAAO,CAAA,KAAA,EAAO,SAAS,CAAA;AAAA,QACpC,GAAG;AAAA;AAAA,KACN;AAAA,oBACC,GAAA,CAAA,UAAA,EAAA,EAAW,MAAQ,EAAA,IAAA,EAAM,OAAc,QAAU,EAAA,CAAC,EAAY,KAAA,QAAA,CAAS,EAAE,CAAG,EAAA,OAAA,EAAS,MAAM,OAAA,CAAQ,KAAK,CAAG,EAAA;AAAA,GAC9G,EAAA,CAAA;AAEJ;;;;"}

package/dist/esm/components/DebounceInput/DebounceInput.js

@@ -1,14 +1,15 @@
-import React__default from 'react';
+import { jsx } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
 import { Input } from '@grafana/ui';
 import { useDebounce } from '../../hooks/useDebounce.js';
 
 const DebounceInput = (props) => {
   const { delay, onDebounce, value, ...rest } = props;
-  const [input, setInput] = React__default.useState(value);
+  const [input, setInput] = useState(value);
   const debouncedInput = useDebounce(input, delay);
-  React__default.useEffect(() => onDebounce(debouncedInput), [debouncedInput]);
-  React__default.useEffect(() => setInput(value), [value]);
-  return /* @__PURE__ */ React__default.createElement(Input, { onChange: (ev) => setInput(ev.currentTarget.value), value: input, ...rest });
+  useEffect(() => onDebounce(debouncedInput), [debouncedInput]);
+  useEffect(() => setInput(value), [value]);
+  return /* @__PURE__ */ jsx(Input, { onChange: (ev) => setInput(ev.currentTarget.value), value: input, ...rest });
 };
 
 export { DebounceInput };

package/dist/esm/components/DebounceInput/DebounceInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"DebounceInput.js","sources":["../../../../src/components/DebounceInput/DebounceInput.tsx"],"sourcesContent":["import React, { type ComponentProps } from 'react';\nimport { Input } from '@grafana/ui';\nimport { useDebounce } from '../../hooks/useDebounce';\n\nexport interface DebounceInputProps extends Omit<ComponentProps<typeof Input>, 'ref'> {\n  value: string;\n  onDebounce: (debouncedInput?: string) => void;\n  delay?: number;\n}\n\nexport const DebounceInput = (props: DebounceInputProps) => {\n  const { delay, onDebounce, value, ...rest } = props;\n  const [input, setInput] = React.useState(value);\n\n  const debouncedInput = useDebounce(input, delay);\n\n  // TODO: We should fix this\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  React.useEffect(() => onDebounce(debouncedInput), [debouncedInput]);\n  React.useEffect(() => setInput(value), [value]);\n\n  return <Input onChange={(ev) => setInput(ev.currentTarget.value)} value={input} {...rest} />;\n};\n"],"names":["React"],"mappings":";;;;AAUa,MAAA,aAAA,GAAgB,CAAC,KAA8B,KAAA;AAC1D,EAAA,MAAM,EAAE,KAAO,EAAA,UAAA,EAAY,KAAO,EAAA,GAAG,MAAS,GAAA,KAAA;AAC9C,EAAA,MAAM,CAAC,KAAO,EAAA,QAAQ,CAAI,GAAAA,cAAA,CAAM,SAAS,KAAK,CAAA;AAE9C,EAAM,MAAA,cAAA,GAAiB,WAAY,CAAA,KAAA,EAAO,KAAK,CAAA;AAI/C,EAAAA,cAAA,CAAM,UAAU,MAAM,UAAA,CAAW,cAAc,CAAG,EAAA,CAAC,cAAc,CAAC,CAAA;AAClE,EAAAA,cAAA,CAAM,UAAU,MAAM,QAAA,CAAS,KAAK,CAAG,EAAA,CAAC,KAAK,CAAC,CAAA;AAE9C,EAAA,uBAAQA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAM,QAAU,EAAA,CAAC,EAAO,KAAA,QAAA,CAAS,EAAG,CAAA,aAAA,CAAc,KAAK,CAAA,EAAG,KAAO,EAAA,KAAA,EAAQ,GAAG,IAAM,EAAA,CAAA;AAC5F;;;;"}
+{"version":3,"file":"DebounceInput.js","sources":["../../../../src/components/DebounceInput/DebounceInput.tsx"],"sourcesContent":["import { type ComponentProps, useState, useEffect } from 'react';\nimport { Input } from '@grafana/ui';\nimport { useDebounce } from '../../hooks/useDebounce';\n\nexport interface DebounceInputProps extends Omit<ComponentProps<typeof Input>, 'ref'> {\n  value: string;\n  onDebounce: (debouncedInput?: string) => void;\n  delay?: number;\n}\n\nexport const DebounceInput = (props: DebounceInputProps) => {\n  const { delay, onDebounce, value, ...rest } = props;\n  const [input, setInput] = useState(value);\n\n  const debouncedInput = useDebounce(input, delay);\n\n  // TODO: We should fix this\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  useEffect(() => onDebounce(debouncedInput), [debouncedInput]);\n  useEffect(() => setInput(value), [value]);\n\n  return <Input onChange={(ev) => setInput(ev.currentTarget.value)} value={input} {...rest} />;\n};\n"],"names":[],"mappings":";;;;;AAUa,MAAA,aAAA,GAAgB,CAAC,KAA8B,KAAA;AAC1D,EAAA,MAAM,EAAE,KAAO,EAAA,UAAA,EAAY,KAAO,EAAA,GAAG,MAAS,GAAA,KAAA;AAC9C,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAS,KAAK,CAAA;AAExC,EAAM,MAAA,cAAA,GAAiB,WAAY,CAAA,KAAA,EAAO,KAAK,CAAA;AAI/C,EAAA,SAAA,CAAU,MAAM,UAAW,CAAA,cAAc,CAAG,EAAA,CAAC,cAAc,CAAC,CAAA;AAC5D,EAAA,SAAA,CAAU,MAAM,QAAS,CAAA,KAAK,CAAG,EAAA,CAAC,KAAK,CAAC,CAAA;AAExC,EAAA,uBAAQ,GAAA,CAAA,KAAA,EAAA,EAAM,QAAU,EAAA,CAAC,EAAO,KAAA,QAAA,CAAS,EAAG,CAAA,aAAA,CAAc,KAAK,CAAA,EAAG,KAAO,EAAA,KAAA,EAAQ,GAAG,IAAM,EAAA,CAAA;AAC5F;;;;"}

package/dist/esm/components/Plugins/PluginSignatureBadge.js

@@ -1,10 +1,11 @@
-import React__default from 'react';
+import { jsx } from 'react/jsx-runtime';
+import 'react';
 import { Badge } from '@grafana/ui';
 import { PluginSignatureStatus } from '@grafana/data';
 
 const PluginSignatureBadge = ({ status, ...otherProps }) => {
   const display = getSignatureDisplayModel(status);
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsx(
     Badge,
     {
       text: display.text,

package/dist/esm/components/Plugins/PluginSignatureBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"PluginSignatureBadge.js","sources":["../../../../src/components/Plugins/PluginSignatureBadge.tsx"],"sourcesContent":["import React, { type HTMLAttributes } from 'react';\nimport { Badge, type BadgeProps } from '@grafana/ui';\nimport { PluginErrorCode, PluginSignatureStatus } from '@grafana/data';\n\ninterface Props extends HTMLAttributes<HTMLDivElement> {\n  status?: PluginSignatureStatus;\n}\n\nexport const PluginSignatureBadge = ({ status, ...otherProps }: Props) => {\n  const display = getSignatureDisplayModel(status);\n  return (\n    <Badge\n      text={display.text}\n      color={display.color as any}\n      icon={display.icon}\n      tooltip={display.tooltip}\n      {...otherProps}\n    />\n  );\n};\n\nexport function isUnsignedPluginSignature(signature?: PluginSignatureStatus) {\n  return signature && signature !== PluginSignatureStatus.valid && signature !== PluginSignatureStatus.internal;\n}\n\nexport function mapPluginErrorCodeToSignatureStatus(code: PluginErrorCode) {\n  switch (code) {\n    case PluginErrorCode.invalidSignature:\n      return PluginSignatureStatus.invalid;\n    case PluginErrorCode.missingSignature:\n      return PluginSignatureStatus.missing;\n    case PluginErrorCode.modifiedSignature:\n      return PluginSignatureStatus.modified;\n    default:\n      return PluginSignatureStatus.missing;\n  }\n}\n\nfunction getSignatureDisplayModel(signature?: PluginSignatureStatus): BadgeProps {\n  if (!signature) {\n    signature = PluginSignatureStatus.invalid;\n  }\n\n  switch (signature) {\n    case PluginSignatureStatus.internal:\n      return { text: 'Core', icon: 'cube', color: 'blue', tooltip: 'Core plugin that is bundled with Grafana' };\n    case PluginSignatureStatus.valid:\n      return { text: 'Signed', icon: 'lock', color: 'green', tooltip: 'Signed and verified plugin' };\n    case PluginSignatureStatus.invalid:\n      return {\n        text: 'Invalid signature',\n        icon: 'exclamation-triangle',\n        color: 'red',\n        tooltip: 'Invalid plugin signature',\n      };\n    case PluginSignatureStatus.modified:\n      return {\n        text: 'Modified signature',\n        icon: 'exclamation-triangle',\n        color: 'red',\n        tooltip: 'Valid signature but content has been modified',\n      };\n    case PluginSignatureStatus.missing:\n      return {\n        text: 'Missing signature',\n        icon: 'exclamation-triangle',\n        color: 'red',\n        tooltip: 'Missing plugin signature',\n      };\n  }\n\n  return { text: 'Unsigned', icon: 'exclamation-triangle', color: 'red', tooltip: 'Unsigned external plugin' };\n}\n\nPluginSignatureBadge.displayName = 'PluginSignatureBadge';\n"],"names":["React"],"mappings":";;;;AAQO,MAAM,uBAAuB,CAAC,EAAE,MAAQ,EAAA,GAAG,YAAwB,KAAA;AACxE,EAAM,MAAA,OAAA,GAAU,yBAAyB,MAAM,CAAA;AAC/C,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,MAAM,OAAQ,CAAA,IAAA;AAAA,MACd,OAAO,OAAQ,CAAA,KAAA;AAAA,MACf,MAAM,OAAQ,CAAA,IAAA;AAAA,MACd,SAAS,OAAQ,CAAA,OAAA;AAAA,MAChB,GAAG;AAAA;AAAA,GACN;AAEJ;AAEO,SAAS,0BAA0B,SAAmC,EAAA;AAC3E,EAAA,OAAO,SAAa,IAAA,SAAA,KAAc,qBAAsB,CAAA,KAAA,IAAS,cAAc,qBAAsB,CAAA,QAAA;AACvG;AAeA,SAAS,yBAAyB,SAA+C,EAAA;AAC/E,EAAA,IAAI,CAAC,SAAW,EAAA;AACd,IAAA,SAAA,GAAY,qBAAsB,CAAA,OAAA;AAAA;AAGpC,EAAA,QAAQ,SAAW;AAAA,IACjB,KAAK,qBAAsB,CAAA,QAAA;AACzB,MAAO,OAAA,EAAE,MAAM,MAAQ,EAAA,IAAA,EAAM,QAAQ,KAAO,EAAA,MAAA,EAAQ,SAAS,0CAA2C,EAAA;AAAA,IAC1G,KAAK,qBAAsB,CAAA,KAAA;AACzB,MAAO,OAAA,EAAE,MAAM,QAAU,EAAA,IAAA,EAAM,QAAQ,KAAO,EAAA,OAAA,EAAS,SAAS,4BAA6B,EAAA;AAAA,IAC/F,KAAK,qBAAsB,CAAA,OAAA;AACzB,MAAO,OAAA;AAAA,QACL,IAAM,EAAA,mBAAA;AAAA,QACN,IAAM,EAAA,sBAAA;AAAA,QACN,KAAO,EAAA,KAAA;AAAA,QACP,OAAS,EAAA;AAAA,OACX;AAAA,IACF,KAAK,qBAAsB,CAAA,QAAA;AACzB,MAAO,OAAA;AAAA,QACL,IAAM,EAAA,oBAAA;AAAA,QACN,IAAM,EAAA,sBAAA;AAAA,QACN,KAAO,EAAA,KAAA;AAAA,QACP,OAAS,EAAA;AAAA,OACX;AAAA,IACF,KAAK,qBAAsB,CAAA,OAAA;AACzB,MAAO,OAAA;AAAA,QACL,IAAM,EAAA,mBAAA;AAAA,QACN,IAAM,EAAA,sBAAA;AAAA,QACN,KAAO,EAAA,KAAA;AAAA,QACP,OAAS,EAAA;AAAA,OACX;AAAA;AAGJ,EAAO,OAAA,EAAE,MAAM,UAAY,EAAA,IAAA,EAAM,wBAAwB,KAAO,EAAA,KAAA,EAAO,SAAS,0BAA2B,EAAA;AAC7G;AAEA,oBAAA,CAAqB,WAAc,GAAA,sBAAA;;;;"}
+{"version":3,"file":"PluginSignatureBadge.js","sources":["../../../../src/components/Plugins/PluginSignatureBadge.tsx"],"sourcesContent":["import { type HTMLAttributes } from 'react';\nimport { Badge, type BadgeProps } from '@grafana/ui';\nimport { PluginErrorCode, PluginSignatureStatus } from '@grafana/data';\n\ninterface Props extends HTMLAttributes<HTMLDivElement> {\n  status?: PluginSignatureStatus;\n}\n\nexport const PluginSignatureBadge = ({ status, ...otherProps }: Props) => {\n  const display = getSignatureDisplayModel(status);\n  return (\n    <Badge\n      text={display.text}\n      color={display.color as any}\n      icon={display.icon}\n      tooltip={display.tooltip}\n      {...otherProps}\n    />\n  );\n};\n\nexport function isUnsignedPluginSignature(signature?: PluginSignatureStatus) {\n  return signature && signature !== PluginSignatureStatus.valid && signature !== PluginSignatureStatus.internal;\n}\n\nexport function mapPluginErrorCodeToSignatureStatus(code: PluginErrorCode) {\n  switch (code) {\n    case PluginErrorCode.invalidSignature:\n      return PluginSignatureStatus.invalid;\n    case PluginErrorCode.missingSignature:\n      return PluginSignatureStatus.missing;\n    case PluginErrorCode.modifiedSignature:\n      return PluginSignatureStatus.modified;\n    default:\n      return PluginSignatureStatus.missing;\n  }\n}\n\nfunction getSignatureDisplayModel(signature?: PluginSignatureStatus): BadgeProps {\n  if (!signature) {\n    signature = PluginSignatureStatus.invalid;\n  }\n\n  switch (signature) {\n    case PluginSignatureStatus.internal:\n      return { text: 'Core', icon: 'cube', color: 'blue', tooltip: 'Core plugin that is bundled with Grafana' };\n    case PluginSignatureStatus.valid:\n      return { text: 'Signed', icon: 'lock', color: 'green', tooltip: 'Signed and verified plugin' };\n    case PluginSignatureStatus.invalid:\n      return {\n        text: 'Invalid signature',\n        icon: 'exclamation-triangle',\n        color: 'red',\n        tooltip: 'Invalid plugin signature',\n      };\n    case PluginSignatureStatus.modified:\n      return {\n        text: 'Modified signature',\n        icon: 'exclamation-triangle',\n        color: 'red',\n        tooltip: 'Valid signature but content has been modified',\n      };\n    case PluginSignatureStatus.missing:\n      return {\n        text: 'Missing signature',\n        icon: 'exclamation-triangle',\n        color: 'red',\n        tooltip: 'Missing plugin signature',\n      };\n  }\n\n  return { text: 'Unsigned', icon: 'exclamation-triangle', color: 'red', tooltip: 'Unsigned external plugin' };\n}\n\nPluginSignatureBadge.displayName = 'PluginSignatureBadge';\n"],"names":[],"mappings":";;;;;AAQO,MAAM,uBAAuB,CAAC,EAAE,MAAQ,EAAA,GAAG,YAAwB,KAAA;AACxE,EAAM,MAAA,OAAA,GAAU,yBAAyB,MAAM,CAAA;AAC/C,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,MAAM,OAAQ,CAAA,IAAA;AAAA,MACd,OAAO,OAAQ,CAAA,KAAA;AAAA,MACf,MAAM,OAAQ,CAAA,IAAA;AAAA,MACd,SAAS,OAAQ,CAAA,OAAA;AAAA,MAChB,GAAG;AAAA;AAAA,GACN;AAEJ;AAEO,SAAS,0BAA0B,SAAmC,EAAA;AAC3E,EAAA,OAAO,SAAa,IAAA,SAAA,KAAc,qBAAsB,CAAA,KAAA,IAAS,cAAc,qBAAsB,CAAA,QAAA;AACvG;AAeA,SAAS,yBAAyB,SAA+C,EAAA;AAC/E,EAAA,IAAI,CAAC,SAAW,EAAA;AACd,IAAA,SAAA,GAAY,qBAAsB,CAAA,OAAA;AAAA;AAGpC,EAAA,QAAQ,SAAW;AAAA,IACjB,KAAK,qBAAsB,CAAA,QAAA;AACzB,MAAO,OAAA,EAAE,MAAM,MAAQ,EAAA,IAAA,EAAM,QAAQ,KAAO,EAAA,MAAA,EAAQ,SAAS,0CAA2C,EAAA;AAAA,IAC1G,KAAK,qBAAsB,CAAA,KAAA;AACzB,MAAO,OAAA,EAAE,MAAM,QAAU,EAAA,IAAA,EAAM,QAAQ,KAAO,EAAA,OAAA,EAAS,SAAS,4BAA6B,EAAA;AAAA,IAC/F,KAAK,qBAAsB,CAAA,OAAA;AACzB,MAAO,OAAA;AAAA,QACL,IAAM,EAAA,mBAAA;AAAA,QACN,IAAM,EAAA,sBAAA;AAAA,QACN,KAAO,EAAA,KAAA;AAAA,QACP,OAAS,EAAA;AAAA,OACX;AAAA,IACF,KAAK,qBAAsB,CAAA,QAAA;AACzB,MAAO,OAAA;AAAA,QACL,IAAM,EAAA,oBAAA;AAAA,QACN,IAAM,EAAA,sBAAA;AAAA,QACN,KAAO,EAAA,KAAA;AAAA,QACP,OAAS,EAAA;AAAA,OACX;AAAA,IACF,KAAK,qBAAsB,CAAA,OAAA;AACzB,MAAO,OAAA;AAAA,QACL,IAAM,EAAA,mBAAA;AAAA,QACN,IAAM,EAAA,sBAAA;AAAA,QACN,KAAO,EAAA,KAAA;AAAA,QACP,OAAS,EAAA;AAAA,OACX;AAAA;AAGJ,EAAO,OAAA,EAAE,MAAM,UAAY,EAAA,IAAA,EAAM,wBAAwB,KAAO,EAAA,KAAA,EAAO,SAAS,0BAA2B,EAAA;AAC7G;AAEA,oBAAA,CAAqB,WAAc,GAAA,sBAAA;;;;"}

package/dist/esm/components/QueryEditor/AccessoryButton.js

@@ -1,11 +1,11 @@
+import { jsx } from 'react/jsx-runtime';
 import { cx, css } from '@emotion/css';
-import React__default from 'react';
 import '@grafana/data';
 import { useStyles2, Button } from '@grafana/ui';
 
 const AccessoryButton = ({ className, ...props }) => {
   const styles = useStyles2(getButtonStyles);
-  return /* @__PURE__ */ React__default.createElement(Button, { ...props, className: cx(className, styles.button) });
+  return /* @__PURE__ */ jsx(Button, { ...props, className: cx(className, styles.button) });
 };
 const getButtonStyles = (theme) => ({
   button: css({

package/dist/esm/components/QueryEditor/AccessoryButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccessoryButton.js","sources":["../../../../src/components/QueryEditor/AccessoryButton.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport React from 'react';\n\nimport { type GrafanaTheme2 } from '@grafana/data';\nimport { Button, type ButtonProps, useStyles2 } from '@grafana/ui';\n\ntype AccessoryButtonProps = ButtonProps & {};\n\nexport const AccessoryButton = ({ className, ...props }: AccessoryButtonProps) => {\n  const styles = useStyles2(getButtonStyles);\n\n  return <Button {...props} className={cx(className, styles.button)} />;\n};\n\nconst getButtonStyles = (theme: GrafanaTheme2) => ({\n  button: css({\n    paddingLeft: theme.spacing(3 / 2),\n    paddingRight: theme.spacing(3 / 2),\n  }),\n});\n"],"names":["React"],"mappings":";;;;;AAQO,MAAM,kBAAkB,CAAC,EAAE,SAAW,EAAA,GAAG,OAAkC,KAAA;AAChF,EAAM,MAAA,MAAA,GAAS,WAAW,eAAe,CAAA;AAEzC,EAAO,uBAAAA,cAAA,CAAA,aAAA,CAAC,UAAQ,GAAG,KAAA,EAAO,WAAW,EAAG,CAAA,SAAA,EAAW,MAAO,CAAA,MAAM,CAAG,EAAA,CAAA;AACrE;AAEA,MAAM,eAAA,GAAkB,CAAC,KAA0B,MAAA;AAAA,EACjD,QAAQ,GAAI,CAAA;AAAA,IACV,WAAa,EAAA,KAAA,CAAM,OAAQ,CAAA,CAAA,GAAI,CAAC,CAAA;AAAA,IAChC,YAAc,EAAA,KAAA,CAAM,OAAQ,CAAA,CAAA,GAAI,CAAC;AAAA,GAClC;AACH,CAAA,CAAA;;;;"}
+{"version":3,"file":"AccessoryButton.js","sources":["../../../../src/components/QueryEditor/AccessoryButton.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\n\nimport { type GrafanaTheme2 } from '@grafana/data';\nimport { Button, type ButtonProps, useStyles2 } from '@grafana/ui';\n\ntype AccessoryButtonProps = ButtonProps & {};\n\nexport const AccessoryButton = ({ className, ...props }: AccessoryButtonProps) => {\n  const styles = useStyles2(getButtonStyles);\n\n  return <Button {...props} className={cx(className, styles.button)} />;\n};\n\nconst getButtonStyles = (theme: GrafanaTheme2) => ({\n  button: css({\n    paddingLeft: theme.spacing(3 / 2),\n    paddingRight: theme.spacing(3 / 2),\n  }),\n});\n"],"names":[],"mappings":";;;;;AAOO,MAAM,kBAAkB,CAAC,EAAE,SAAW,EAAA,GAAG,OAAkC,KAAA;AAChF,EAAM,MAAA,MAAA,GAAS,WAAW,eAAe,CAAA;AAEzC,EAAO,uBAAA,GAAA,CAAC,UAAQ,GAAG,KAAA,EAAO,WAAW,EAAG,CAAA,SAAA,EAAW,MAAO,CAAA,MAAM,CAAG,EAAA,CAAA;AACrE;AAEA,MAAM,eAAA,GAAkB,CAAC,KAA0B,MAAA;AAAA,EACjD,QAAQ,GAAI,CAAA;AAAA,IACV,WAAa,EAAA,KAAA,CAAM,OAAQ,CAAA,CAAA,GAAI,CAAC,CAAA;AAAA,IAChC,YAAc,EAAA,KAAA,CAAM,OAAQ,CAAA,CAAA,GAAI,CAAC;AAAA,GAClC;AACH,CAAA,CAAA;;;;"}

package/dist/esm/components/QueryEditor/CatalogSelector.js

@@ -0,0 +1,54 @@
+import { jsx } from 'react/jsx-runtime';
+import { useState, useCallback, useEffect } from 'react';
+import { Select } from '@grafana/ui';
+import '@grafana/data';
+import './types.js';
+
+const CatalogSelector = ({ db, inputId, value, onChange }) => {
+  const [catalogs, setCatalogs] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const loadCatalogs = useCallback(async () => {
+    if (!db.catalogs) {
+      return;
+    }
+    setIsLoading(true);
+    try {
+      const catalogList = await db.catalogs();
+      const catalogOptions = catalogList.map((catalog) => ({
+        label: catalog,
+        value: catalog
+      }));
+      setCatalogs(catalogOptions);
+    } catch (error) {
+      console.error("Error loading catalogs:", error);
+      setCatalogs([]);
+    } finally {
+      setIsLoading(false);
+    }
+  }, [db]);
+  useEffect(() => {
+    loadCatalogs();
+  }, [db, loadCatalogs]);
+  const handleChange = (selectable) => {
+    onChange((selectable == null ? undefined : selectable.value) || null);
+  };
+  const selectedValue = catalogs.find((catalog) => catalog.value === value) || null;
+  return /* @__PURE__ */ jsx(
+    Select,
+    {
+      inputId,
+      options: catalogs,
+      value: selectedValue,
+      onChange: handleChange,
+      isLoading,
+      placeholder: "Select catalog",
+      isClearable: true,
+      allowCustomValue: true,
+      disabled: isLoading,
+      menuShouldPortal: true
+    }
+  );
+};
+
+export { CatalogSelector };
+//# sourceMappingURL=CatalogSelector.js.map

package/dist/esm/components/QueryEditor/CatalogSelector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CatalogSelector.js","sources":["../../../../src/components/QueryEditor/CatalogSelector.tsx"],"sourcesContent":["import { useState, useEffect, useCallback } from 'react';\nimport { Select } from '@grafana/ui';\nimport { type SelectableValue } from '@grafana/data';\nimport { type DB } from './types';\n\nexport interface CatalogSelectorProps {\n  db: DB;\n  inputId?: string;\n  value: string | null;\n  onChange: (catalog: string | null) => void;\n}\n\nexport const CatalogSelector = ({ db, inputId, value, onChange }: CatalogSelectorProps) => {\n  const [catalogs, setCatalogs] = useState<Array<SelectableValue<string>>>([]);\n  const [isLoading, setIsLoading] = useState(false);\n\n  const loadCatalogs = useCallback(async () => {\n    if (!db.catalogs) {\n      return;\n    }\n\n    setIsLoading(true);\n    try {\n      const catalogList = await db.catalogs();\n      const catalogOptions = catalogList.map((catalog) => ({\n        label: catalog,\n        value: catalog,\n      }));\n      setCatalogs(catalogOptions);\n    } catch (error) {\n      console.error('Error loading catalogs:', error);\n      setCatalogs([]);\n    } finally {\n      setIsLoading(false);\n    }\n  }, [db]);\n\n  useEffect(() => {\n    loadCatalogs();\n  }, [db, loadCatalogs]);\n\n  const handleChange = (selectable: SelectableValue<string>) => {\n    onChange(selectable?.value || null);\n  };\n\n  const selectedValue = catalogs.find((catalog) => catalog.value === value) || null;\n\n  return (\n    <Select\n      inputId={inputId}\n      options={catalogs}\n      value={selectedValue}\n      onChange={handleChange}\n      isLoading={isLoading}\n      placeholder=\"Select catalog\"\n      isClearable\n      allowCustomValue\n      disabled={isLoading}\n      menuShouldPortal={true}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;AAYO,MAAM,kBAAkB,CAAC,EAAE,IAAI,OAAS,EAAA,KAAA,EAAO,UAAqC,KAAA;AACzF,EAAA,MAAM,CAAC,QAAU,EAAA,WAAW,CAAI,GAAA,QAAA,CAAyC,EAAE,CAAA;AAC3E,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAAS,KAAK,CAAA;AAEhD,EAAM,MAAA,YAAA,GAAe,YAAY,YAAY;AAC3C,IAAI,IAAA,CAAC,GAAG,QAAU,EAAA;AAChB,MAAA;AAAA;AAGF,IAAA,YAAA,CAAa,IAAI,CAAA;AACjB,IAAI,IAAA;AACF,MAAM,MAAA,WAAA,GAAc,MAAM,EAAA,CAAG,QAAS,EAAA;AACtC,MAAA,MAAM,cAAiB,GAAA,WAAA,CAAY,GAAI,CAAA,CAAC,OAAa,MAAA;AAAA,QACnD,KAAO,EAAA,OAAA;AAAA,QACP,KAAO,EAAA;AAAA,OACP,CAAA,CAAA;AACF,MAAA,WAAA,CAAY,cAAc,CAAA;AAAA,aACnB,KAAO,EAAA;AACd,MAAQ,OAAA,CAAA,KAAA,CAAM,2BAA2B,KAAK,CAAA;AAC9C,MAAA,WAAA,CAAY,EAAE,CAAA;AAAA,KACd,SAAA;AACA,MAAA,YAAA,CAAa,KAAK,CAAA;AAAA;AACpB,GACF,EAAG,CAAC,EAAE,CAAC,CAAA;AAEP,EAAA,SAAA,CAAU,MAAM;AACd,IAAa,YAAA,EAAA;AAAA,GACZ,EAAA,CAAC,EAAI,EAAA,YAAY,CAAC,CAAA;AAErB,EAAM,MAAA,YAAA,GAAe,CAAC,UAAwC,KAAA;AAC5D,IAAS,QAAA,CAAA,CAAA,UAAA,IAAA,IAAA,GAAA,SAAA,GAAA,UAAA,CAAY,UAAS,IAAI,CAAA;AAAA,GACpC;AAEA,EAAM,MAAA,aAAA,GAAgB,SAAS,IAAK,CAAA,CAAC,YAAY,OAAQ,CAAA,KAAA,KAAU,KAAK,CAAK,IAAA,IAAA;AAE7E,EACE,uBAAA,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,OAAS,EAAA,QAAA;AAAA,MACT,KAAO,EAAA,aAAA;AAAA,MACP,QAAU,EAAA,YAAA;AAAA,MACV,SAAA;AAAA,MACA,WAAY,EAAA,gBAAA;AAAA,MACZ,WAAW,EAAA,IAAA;AAAA,MACX,gBAAgB,EAAA,IAAA;AAAA,MAChB,QAAU,EAAA,SAAA;AAAA,MACV,gBAAkB,EAAA;AAAA;AAAA,GACpB;AAEJ;;;;"}

package/dist/esm/components/QueryEditor/ConfirmModal.js

@@ -1,4 +1,5 @@
-import React__default, { useRef, useEffect } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useRef, useEffect } from 'react';
 import { Modal, Icon, Button } from '@grafana/ui';
 
 function ConfirmModal({ isOpen, onCancel, onDiscard, onCopy }) {
@@ -9,16 +10,25 @@ function ConfirmModal({ isOpen, onCancel, onDiscard, onCopy }) {
       (_a = buttonRef.current) == null ? undefined : _a.focus();
     }
   }, [isOpen]);
-  return /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ jsxs(
     Modal,
     {
-      title: /* @__PURE__ */ React__default.createElement("div", { className: "modal-header-title" }, /* @__PURE__ */ React__default.createElement(Icon, { name: "exclamation-triangle", size: "lg" }), /* @__PURE__ */ React__default.createElement("span", { className: "p-l-1" }, "Warning")),
+      title: /* @__PURE__ */ jsxs("div", { className: "modal-header-title", children: [
+        /* @__PURE__ */ jsx(Icon, { name: "exclamation-triangle", size: "lg" }),
+        /* @__PURE__ */ jsx("span", { className: "p-l-1", children: "Warning" })
+      ] }),
       onDismiss: onCancel,
-      isOpen
-    },
-    /* @__PURE__ */ React__default.createElement("p", null, "Builder mode does not display changes made in code. The query builder will display the last changes you made in builder mode."),
-    /* @__PURE__ */ React__default.createElement("p", null, "Do you want to copy your code to the clipboard?"),
-    /* @__PURE__ */ React__default.createElement(Modal.ButtonRow, null, /* @__PURE__ */ React__default.createElement(Button, { type: "button", variant: "secondary", onClick: onCancel, fill: "outline" }, "Cancel"), /* @__PURE__ */ React__default.createElement(Button, { variant: "destructive", type: "button", onClick: onDiscard, ref: buttonRef }, "Discard code and switch"), /* @__PURE__ */ React__default.createElement(Button, { variant: "primary", onClick: onCopy }, "Copy code and switch"))
+      isOpen,
+      children: [
+        /* @__PURE__ */ jsx("p", { children: "Builder mode does not display changes made in code. The query builder will display the last changes you made in builder mode." }),
+        /* @__PURE__ */ jsx("p", { children: "Do you want to copy your code to the clipboard?" }),
+        /* @__PURE__ */ jsxs(Modal.ButtonRow, { children: [
+          /* @__PURE__ */ jsx(Button, { type: "button", variant: "secondary", onClick: onCancel, fill: "outline", children: "Cancel" }),
+          /* @__PURE__ */ jsx(Button, { variant: "destructive", type: "button", onClick: onDiscard, ref: buttonRef, children: "Discard code and switch" }),
+          /* @__PURE__ */ jsx(Button, { variant: "primary", onClick: onCopy, children: "Copy code and switch" })
+        ] })
+      ]
+    }
   );
 }
 

package/dist/esm/components/QueryEditor/ConfirmModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"ConfirmModal.js","sources":["../../../../src/components/QueryEditor/ConfirmModal.tsx"],"sourcesContent":["import React, { useRef, useEffect } from 'react';\n\nimport { Button, Icon, Modal } from '@grafana/ui';\n\ntype ConfirmModalProps = {\n  isOpen: boolean;\n  onCancel?: () => void;\n  onDiscard?: () => void;\n  onCopy?: () => void;\n};\nexport function ConfirmModal({ isOpen, onCancel, onDiscard, onCopy }: ConfirmModalProps) {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n\n  // Moved from grafana/ui\n  useEffect(() => {\n    // for some reason autoFocus property did no work on this button, but this does\n    if (isOpen) {\n      buttonRef.current?.focus();\n    }\n  }, [isOpen]);\n\n  return (\n    <Modal\n      title={\n        <div className=\"modal-header-title\">\n          <Icon name=\"exclamation-triangle\" size=\"lg\" />\n          <span className=\"p-l-1\">Warning</span>\n        </div>\n      }\n      onDismiss={onCancel}\n      isOpen={isOpen}\n    >\n      <p>\n        Builder mode does not display changes made in code. The query builder will display the last changes you made in\n        builder mode.\n      </p>\n      <p>Do you want to copy your code to the clipboard?</p>\n      <Modal.ButtonRow>\n        <Button type=\"button\" variant=\"secondary\" onClick={onCancel} fill=\"outline\">\n          Cancel\n        </Button>\n        <Button variant=\"destructive\" type=\"button\" onClick={onDiscard} ref={buttonRef}>\n          Discard code and switch\n        </Button>\n        <Button variant=\"primary\" onClick={onCopy}>\n          Copy code and switch\n        </Button>\n      </Modal.ButtonRow>\n    </Modal>\n  );\n}\n"],"names":["React"],"mappings":";;;AAUO,SAAS,aAAa,EAAE,MAAA,EAAQ,QAAU,EAAA,SAAA,EAAW,QAA6B,EAAA;AACvF,EAAM,MAAA,SAAA,GAAY,OAA0B,IAAI,CAAA;AAGhD,EAAA,SAAA,CAAU,MAAM;AAdlB,IAAA,IAAA,EAAA;AAgBI,IAAA,IAAI,MAAQ,EAAA;AACV,MAAA,CAAA,EAAA,GAAA,SAAA,CAAU,YAAV,IAAmB,GAAA,SAAA,GAAA,EAAA,CAAA,KAAA,EAAA;AAAA;AACrB,GACF,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EACE,uBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,uBACGA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,SAAU,EAAA,oBAAA,EAAA,+CACZ,IAAK,EAAA,EAAA,IAAA,EAAK,sBAAuB,EAAA,IAAA,EAAK,MAAK,CAC5C,kBAAAA,cAAA,CAAA,aAAA,CAAC,UAAK,SAAU,EAAA,OAAA,EAAA,EAAQ,SAAO,CACjC,CAAA;AAAA,MAEF,SAAW,EAAA,QAAA;AAAA,MACX;AAAA,KAAA;AAAA,oBAEAA,cAAA,CAAA,aAAA,CAAC,WAAE,+HAGH,CAAA;AAAA,oBACAA,cAAA,CAAA,aAAA,CAAC,WAAE,iDAA+C,CAAA;AAAA,oBACjDA,cAAA,CAAA,aAAA,CAAA,KAAA,CAAM,SAAN,EAAA,IAAA,+CACE,MAAO,EAAA,EAAA,IAAA,EAAK,QAAS,EAAA,OAAA,EAAQ,aAAY,OAAS,EAAA,QAAA,EAAU,IAAK,EAAA,SAAA,EAAA,EAAU,QAE5E,CACA,kBAAAA,cAAA,CAAA,aAAA,CAAC,MAAO,EAAA,EAAA,OAAA,EAAQ,eAAc,IAAK,EAAA,QAAA,EAAS,OAAS,EAAA,SAAA,EAAW,KAAK,SAAW,EAAA,EAAA,yBAEhF,CACA,kBAAAA,cAAA,CAAA,aAAA,CAAC,UAAO,OAAQ,EAAA,SAAA,EAAU,OAAS,EAAA,MAAA,EAAA,EAAQ,sBAE3C,CACF;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"ConfirmModal.js","sources":["../../../../src/components/QueryEditor/ConfirmModal.tsx"],"sourcesContent":["import { useRef, useEffect } from 'react';\n\nimport { Button, Icon, Modal } from '@grafana/ui';\n\ntype ConfirmModalProps = {\n  isOpen: boolean;\n  onCancel?: () => void;\n  onDiscard?: () => void;\n  onCopy?: () => void;\n};\nexport function ConfirmModal({ isOpen, onCancel, onDiscard, onCopy }: ConfirmModalProps) {\n  const buttonRef = useRef<HTMLButtonElement>(null);\n\n  // Moved from grafana/ui\n  useEffect(() => {\n    // for some reason autoFocus property did no work on this button, but this does\n    if (isOpen) {\n      buttonRef.current?.focus();\n    }\n  }, [isOpen]);\n\n  return (\n    <Modal\n      title={\n        <div className=\"modal-header-title\">\n          <Icon name=\"exclamation-triangle\" size=\"lg\" />\n          <span className=\"p-l-1\">Warning</span>\n        </div>\n      }\n      onDismiss={onCancel}\n      isOpen={isOpen}\n    >\n      <p>\n        Builder mode does not display changes made in code. The query builder will display the last changes you made in\n        builder mode.\n      </p>\n      <p>Do you want to copy your code to the clipboard?</p>\n      <Modal.ButtonRow>\n        <Button type=\"button\" variant=\"secondary\" onClick={onCancel} fill=\"outline\">\n          Cancel\n        </Button>\n        <Button variant=\"destructive\" type=\"button\" onClick={onDiscard} ref={buttonRef}>\n          Discard code and switch\n        </Button>\n        <Button variant=\"primary\" onClick={onCopy}>\n          Copy code and switch\n        </Button>\n      </Modal.ButtonRow>\n    </Modal>\n  );\n}\n"],"names":[],"mappings":";;;;AAUO,SAAS,aAAa,EAAE,MAAA,EAAQ,QAAU,EAAA,SAAA,EAAW,QAA6B,EAAA;AACvF,EAAM,MAAA,SAAA,GAAY,OAA0B,IAAI,CAAA;AAGhD,EAAA,SAAA,CAAU,MAAM;AAdlB,IAAA,IAAA,EAAA;AAgBI,IAAA,IAAI,MAAQ,EAAA;AACV,MAAA,CAAA,EAAA,GAAA,SAAA,CAAU,YAAV,IAAmB,GAAA,SAAA,GAAA,EAAA,CAAA,KAAA,EAAA;AAAA;AACrB,GACF,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EACE,uBAAA,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KACE,kBAAA,IAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAU,oBACb,EAAA,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAK,sBAAuB,EAAA,IAAA,EAAK,IAAK,EAAA,CAAA;AAAA,wBAC3C,GAAA,CAAA,MAAA,EAAA,EAAK,SAAU,EAAA,OAAA,EAAQ,QAAO,EAAA,SAAA,EAAA;AAAA,OACjC,EAAA,CAAA;AAAA,MAEF,SAAW,EAAA,QAAA;AAAA,MACX,MAAA;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,OAAE,QAGH,EAAA,+HAAA,EAAA,CAAA;AAAA,wBACA,GAAA,CAAC,OAAE,QAA+C,EAAA,iDAAA,EAAA,CAAA;AAAA,wBAClD,IAAA,CAAC,KAAM,CAAA,SAAA,EAAN,EACC,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,MAAA,EAAA,EAAO,MAAK,QAAS,EAAA,OAAA,EAAQ,aAAY,OAAS,EAAA,QAAA,EAAU,IAAK,EAAA,SAAA,EAAU,QAE5E,EAAA,QAAA,EAAA,CAAA;AAAA,0BACA,GAAA,CAAC,MAAO,EAAA,EAAA,OAAA,EAAQ,aAAc,EAAA,IAAA,EAAK,UAAS,OAAS,EAAA,SAAA,EAAW,GAAK,EAAA,SAAA,EAAW,QAEhF,EAAA,yBAAA,EAAA,CAAA;AAAA,8BACC,MAAO,EAAA,EAAA,OAAA,EAAQ,SAAU,EAAA,OAAA,EAAS,QAAQ,QAE3C,EAAA,sBAAA,EAAA;AAAA,SACF,EAAA;AAAA;AAAA;AAAA,GACF;AAEJ;;;;"}