@grafana/plugin-ui 0.16.0 → 0.17.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":[],"mappings":"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"}
+{"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          aria-label=\"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":["getStyles"],"mappings":"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"}

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

@@ -1,10 +1,10 @@
 import React from 'react';
 import { css } from '@emotion/css';
 import { useTheme2, Button } from '@grafana/ui';
-import { DataLinkBuiltInVars, VariableOrigin } from '@grafana/data';
+import { VariableOrigin, DataLinkBuiltInVars } from '@grafana/data';
 import { DataLink } from './DataLink.js';
 
-const getStyles = (theme) => ({
+const getStyles$o = (theme) => ({
   infoText: css`
     padding-bottom: ${theme.v1.spacing.md};
     color: ${theme.v1.colors.textWeak};
@@ -16,7 +16,7 @@ const getStyles = (theme) => ({
 const DataLinks = (props) => {
   const { value, onChange } = props;
   const theme = useTheme2();
-  const styles = getStyles(theme);
+  const styles = getStyles$o(theme);
   return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("h3", { className: "page-heading" }, "Data links"), /* @__PURE__ */ React.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.createElement("div", { className: "gf-form-group" }, value && value.map((field, index) => {
     return /* @__PURE__ */ React.createElement(
       DataLink,

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":[],"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,uBAAA,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,sCACG,IAAG,EAAA,EAAA,SAAA,EAAU,kBAAe,YAAU,CAAA,kBAEtC,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,MAAA,CAAO,YAAU,+FAEjC,CAAA,kBAEC,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,SAAU,EAAA,eAAA,EAAA,EACZ,SACC,KAAM,CAAA,GAAA,CAAI,CAAC,KAAA,EAAO,KAAU,KAAA;AAC1B,IACE,uBAAA,KAAA,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,kBAAA,KAAA,CAAA,aAAA,CAAC,KACC,EAAA,IAAA,kBAAA,KAAA,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 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":["getStyles"],"mappings":";;;;;;AAOA,MAAMA,WAAA,GAAY,CAAC,KAAA,MAA0B;AAAA,EAC3C,QAAA,EAAU,GAAA;AAAA,oBAAA,EACU,KAAA,CAAM,EAAA,CAAG,OAAA,CAAQ,EAAE,CAAA;AAAA,WAAA,EAC5B,KAAA,CAAM,EAAA,CAAG,MAAA,CAAO,QAAQ,CAAA;AAAA,EAAA,CAAA;AAAA,EAEnC,QAAA,EAAU,GAAA;AAAA,mBAAA,EACS,KAAA,CAAM,EAAA,CAAG,OAAA,CAAQ,EAAE,CAAA;AAAA,EAAA;AAExC,CAAA,CAAA;AAMO,MAAM,SAAA,GAAY,CAAC,KAAA,KAAiB;AACzC,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAS,GAAI,KAAA;AAC5B,EAAA,MAAM,QAAQ,SAAA,EAAU;AACxB,EAAA,MAAM,MAAA,GAASA,YAAU,KAAK,CAAA;AAE9B,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,sCACG,IAAA,EAAA,EAAG,SAAA,EAAU,kBAAe,YAAU,CAAA,kBAEvC,KAAA,CAAA,aAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,YAAU,+FAEjC,CAAA,kBAEA,KAAA,CAAA,aAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,eAAA,EAAA,EACZ,SACC,KAAA,CAAM,GAAA,CAAI,CAAC,KAAA,EAAO,KAAA,KAAU;AAC1B,IAAA,uBACE,KAAA,CAAA,aAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,WAAW,MAAA,CAAO,QAAA;AAAA,QAClB,GAAA,EAAK,KAAA;AAAA,QACL,KAAA,EAAO,KAAA;AAAA,QACP,QAAA,EAAU,CAAC,QAAA,KAAa;AACtB,UAAA,MAAM,YAAA,GAAe,CAAC,GAAG,KAAK,CAAA;AAC9B,UAAA,YAAA,CAAa,MAAA,CAAO,KAAA,EAAO,CAAA,EAAG,QAAQ,CAAA;AACtC,UAAA,QAAA,CAAS,YAAY,CAAA;AAAA,QACvB,CAAA;AAAA,QACA,UAAU,MAAM;AACd,UAAA,MAAM,YAAA,GAAe,CAAC,GAAG,KAAK,CAAA;AAC9B,UAAA,YAAA,CAAa,MAAA,CAAO,OAAO,CAAC,CAAA;AAC5B,UAAA,QAAA,CAAS,YAAY,CAAA;AAAA,QACvB,CAAA;AAAA,QACA,WAAA,EAAa;AAAA,UACX;AAAA,YACE,OAAO,mBAAA,CAAoB,QAAA;AAAA,YAC3B,KAAA,EAAO,WAAA;AAAA,YACP,aAAA,EAAe,wBAAA;AAAA,YACf,QAAQ,cAAA,CAAe;AAAA;AACzB;AACF;AAAA,KACF;AAAA,EAEJ,CAAC,CAAA,kBACH,KAAA,CAAA,aAAA,CAAC,KAAA,EAAA,IAAA,kBACC,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,OAAA,EAAS,WAAA;AAAA,MACT,SAAA,EAAW,GAAA;AAAA;AAAA,YAAA,CAAA;AAAA,MAGX,IAAA,EAAK,MAAA;AAAA,MACL,OAAA,EAAS,CAAC,KAAA,KAAU;AAClB,QAAA,KAAA,CAAM,cAAA,EAAe;AACrB,QAAA,MAAM,YAAA,GAAe,CAAC,GAAI,KAAA,IAAS,EAAC,EAAI,EAAE,KAAA,EAAO,EAAA,EAAI,OAAO,EAAA,EAAI,YAAA,EAAc,EAAA,EAAI,GAAA,EAAK,IAAI,CAAA;AAC3F,QAAA,QAAA,CAAS,YAAY,CAAA;AAAA,MACvB;AAAA,KAAA;AAAA,IACD;AAAA,GAGH,CACF,CACF,CAAA;AAEJ;;;;"}

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

@@ -1,23 +1,23 @@
 import React, { PureComponent } from 'react';
-import { Select, HorizontalGroup } from '@grafana/ui';
+import { Select, Stack } from '@grafana/ui';
 import '@grafana/data';
 import { selectors } from '@grafana/e2e-selectors';
 import { isUnsignedPluginSignature, PluginSignatureBadge } from '../Plugins/PluginSignatureBadge.js';
 import { getDataSourceSrv } from '@grafana/runtime';
 
-var __defProp = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __defProp$5 = Object.defineProperty;
+var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField$5 = (obj, key, value) => __defNormalProp$5(obj, typeof key !== "symbol" ? key + "" : key, value);
 class DataSourcePicker extends PureComponent {
   constructor(props) {
     super(props);
-    __publicField(this, "dataSourceSrv", getDataSourceSrv());
-    __publicField(this, "state", {});
-    __publicField(this, "onChange", (item) => {
+    __publicField$5(this, "dataSourceSrv", getDataSourceSrv());
+    __publicField$5(this, "state", {});
+    __publicField$5(this, "onChange", (item) => {
       const dsSettings = this.dataSourceSrv.getInstanceSettings(item.value);
       if (dsSettings) {
         this.props.onChange(dsSettings);
-        this.setState({ error: undefined });
+        this.setState({ error: void 0 });
       }
     });
   }
@@ -85,7 +85,7 @@ class DataSourcePicker extends PureComponent {
         invalid: !!error,
         getOptionLabel: (o) => {
           if (o.meta && isUnsignedPluginSignature(o.meta.signature) && o !== value) {
-            return /* @__PURE__ */ React.createElement(HorizontalGroup, { align: "center", justify: "space-between" }, /* @__PURE__ */ React.createElement("span", null, o.label), " ", /* @__PURE__ */ React.createElement(PluginSignatureBadge, { status: o.meta.signature }));
+            return /* @__PURE__ */ React.createElement(Stack, { alignItems: "center", justifyContent: "space-between" }, /* @__PURE__ */ React.createElement("span", null, o.label), " ", /* @__PURE__ */ React.createElement(PluginSignatureBadge, { status: o.meta.signature }));
           }
           return o.label || "";
         }
@@ -93,7 +93,7 @@ class DataSourcePicker extends PureComponent {
     ));
   }
 }
-__publicField(DataSourcePicker, "defaultProps", {
+__publicField$5(DataSourcePicker, "defaultProps", {
   autoFocus: false,
   openMenuOnFocus: false,
   placeholder: "Select datasource"

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

@@ -1 +1 @@
-{"version":3,"file":"DataSourcePicker.js","sources":["../../../../src/components/DataSourcePicker/DataSourcePicker.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\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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"}
+{"version":3,"file":"DataSourcePicker.js","sources":["../../../../src/components/DataSourcePicker/DataSourcePicker.tsx"],"sourcesContent":["import React, { PureComponent } from 'react';\nimport { Stack, 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                <Stack alignItems=\"center\" justifyContent=\"space-between\">\n                  <span>{o.label}</span> <PluginSignatureBadge status={o.meta.signature} />\n                </Stack>\n              );\n            }\n            return o.label || '';\n          }}\n        />\n      </div>\n    );\n  }\n}\n"],"names":["__publicField"],"mappings":"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"}

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":[],"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,KAAA,CAAA,aAAA,CAAC,uBAAoB,UAAY,EAAA,IAAA,EAAM,oBAAoB,KAAO,EAAA,OAAA,EAAS,2BACxE,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,WAAW,MAAO,CAAA,KAAA,EAAO,eAAY,aACxC,EAAA,kBAAA,KAAA,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,uBAAA,KAAA,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,kBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAK,aAAc,EAAA,CAAA;AAAA,MACpC,SAAW,kBAAA,KAAA,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 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":[],"mappings":";;;;;AAYO,MAAM,UAAA,GAAa,IAAA,CAAsB,CAAC,KAAA,KAAU;AACzD,EAAA,MAAM,QAAQ,SAAA,EAAU;AACxB,EAAA,MAAM,MAAA,GAAS,UAAU,KAAK,CAAA;AAC9B,EAAA,MAAM,EAAE,MAAA,EAAQ,OAAA,EAAQ,GAAI,KAAA;AAE5B,EAAA,IAAI,CAAC,MAAA,EAAQ;AACX,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACE,KAAA,CAAA,aAAA,CAAC,uBAAoB,UAAA,EAAY,IAAA,EAAM,oBAAoB,KAAA,EAAO,OAAA,EAAS,2BACzE,KAAA,CAAA,aAAA,CAAC,KAAA,EAAA,EAAI,WAAW,MAAA,CAAO,KAAA,EAAO,eAAY,aAAA,EAAA,kBACxC,KAAA,CAAA,aAAA,CAAC,QAAM,GAAG,KAAA,EAAO,CACnB,CACF,CAAA;AAEJ,CAAC;AAED,UAAA,CAAW,WAAA,GAAc,YAAA;AAEzB,MAAM,OAAO,IAAA,CAAsB,CAAC,EAAE,KAAA,EAAO,UAAS,KAAM;AAC1D,EAAA,MAAM,QAAQ,SAAA,EAAU;AACxB,EAAA,MAAM,MAAA,GAAS,cAAc,KAAK,CAAA;AAElC,EAAA,uBACE,KAAA,CAAA,aAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,WAAW,MAAA,CAAO,IAAA;AAAA,MAClB,eAAe,MAAA,CAAO,KAAA;AAAA,MACtB,KAAA,EAAO,KAAA,oBAAS,IAAI,IAAA,EAAK;AAAA,MACzB,SAAA,kBAAW,KAAA,CAAA,aAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAK,aAAA,EAAc,CAAA;AAAA,MACpC,SAAA,kBAAW,KAAA,CAAA,aAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAK,YAAA,EAAa,CAAA;AAAA,MACnC,QAAA,EAAU,CAAC,EAAA,KAAY;AACrB,QAAA,IAAI,CAAC,KAAA,CAAM,OAAA,CAAQ,EAAE,CAAA,EAAG;AACtB,UAAA,QAAA,CAAS,EAAE,CAAA;AAAA,QACb;AAAA,MACF,CAAA;AAAA,MACA,MAAA,EAAO;AAAA;AAAA,GACT;AAEJ,CAAC,CAAA;AAED,IAAA,CAAK,WAAA,GAAc,MAAA;;;;"}

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

@@ -1,7 +1,7 @@
 import '@grafana/data';
 import { css } from '@emotion/css';
 
-const getStyles = (theme) => {
+const getStyles$r = (theme) => {
   const containerBorder = theme.isDark ? theme.v1.palette.dark9 : theme.v1.palette.gray5;
   return {
     container: css`
@@ -149,5 +149,5 @@ const getBodyStyles = (theme) => {
   };
 };
 
-export { getBodyStyles, getStyles };
+export { getBodyStyles, getStyles$r as getStyles };
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/DatePicker/styles.ts"],"sourcesContent":["import { type GrafanaTheme2 } from '@grafana/data';\nimport { css } from '@emotion/css';\n\nexport const getStyles = (theme: GrafanaTheme2) => {\n  const containerBorder = theme.isDark ? theme.v1.palette.dark9 : theme.v1.palette.gray5;\n\n  return {\n    container: css`\n      top: -1px;\n      position: absolute;\n      right: 544px;\n      box-shadow: 0px 0px 20px ${theme.v1.colors.dropdownShadow};\n      background-color: ${theme.v1.colors.bodyBg};\n      z-index: -1;\n      border: 1px solid ${containerBorder};\n      border-radius: 2px 0 0 2px;\n\n      &:after {\n        display: block;\n        background-color: ${theme.v1.colors.bodyBg};\n        width: 19px;\n        height: 100%;\n        content: '';\n        position: absolute;\n        top: 0;\n        right: -19px;\n        border-left: 1px solid ${theme.v1.colors.border1};\n      }\n    `,\n    modal: css`\n      z-index: ${theme.v1.zIndex.modal};\n    `,\n    content: css`\n      margin: 0 auto;\n      width: 268px;\n    `,\n    backdrop: css`\n      position: fixed;\n      top: 0;\n      right: 0;\n      bottom: 0;\n      left: 0;\n      background: #202226;\n      opacity: 0.7;\n      z-index: ${theme.v1.zIndex.modalBackdrop};\n      text-align: center;\n    `,\n  };\n};\n\nexport const getBodyStyles = (theme: GrafanaTheme2) => {\n  const containerBorder = theme.isDark ? theme.v1.palette.dark9 : theme.v1.palette.gray5;\n\n  return {\n    title: css`\n      color: ${theme.colors.text};\n      background-color: ${theme.v1.colors.bodyBg};\n      font-size: ${theme.v1.typography.size.md};\n      border: 1px solid transparent;\n\n      &:hover {\n        position: relative;\n      }\n    `,\n    body: css`\n      z-index: ${theme.zIndex.modal};\n      position: fixed;\n      background-color: ${theme.v1.colors.bodyBg};\n      width: 268px;\n\n      box-shadow: 0px 0px 20px ${theme.v1.colors.dropdownShadow};\n      border: 1px solid ${containerBorder};\n      border-radius: 2px 0 0 2px;\n\n      .react-calendar__navigation__label,\n      .react-calendar__navigation__arrow,\n      .react-calendar__navigation {\n        padding-top: 4px;\n        background-color: inherit;\n        color: ${theme.colors.text};\n        border: 0;\n        font-weight: ${theme.v1.typography.weight.semibold};\n      }\n\n      .react-calendar__month-view__weekdays {\n        background-color: inherit;\n        text-align: center;\n        color: ${theme.v1.palette.blue77};\n\n        abbr {\n          border: 0;\n          text-decoration: none;\n          cursor: default;\n          display: block;\n          padding: 4px 0 4px 0;\n        }\n      }\n\n      .react-calendar__month-view__days {\n        background-color: inherit;\n      }\n\n      .react-calendar__tile,\n      .react-calendar__tile--now {\n        margin-bottom: 4px;\n        background-color: inherit;\n        height: 26px;\n      }\n\n      .react-calendar__navigation__label,\n      .react-calendar__navigation > button:focus,\n      .time-picker-calendar-tile:focus {\n        outline: 0;\n      }\n\n      .react-calendar__tile--active,\n      .react-calendar__tile--active:hover {\n        color: ${theme.v1.palette.white};\n        font-weight: ${theme.v1.typography.weight.semibold};\n        background: ${theme.v1.palette.blue95};\n        box-shadow: none;\n        border: 0px;\n      }\n\n      .react-calendar__tile--rangeEnd,\n      .react-calendar__tile--rangeStart {\n        padding: 0;\n        border: 0px;\n        color: ${theme.v1.palette.white};\n        font-weight: ${theme.v1.typography.weight.semibold};\n        background: ${theme.v1.palette.blue95};\n\n        abbr {\n          background-color: ${theme.v1.palette.blue77};\n          border-radius: 100px;\n          display: block;\n          padding-top: 2px;\n          height: 26px;\n        }\n      }\n\n      .react-calendar__tile--rangeStart {\n        border-top-left-radius: 20px;\n        border-bottom-left-radius: 20px;\n      }\n\n      .react-calendar__tile--rangeEnd {\n        border-top-right-radius: 20px;\n        border-bottom-right-radius: 20px;\n      }\n    `,\n  };\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/DatePicker/styles.ts"],"sourcesContent":["import { type GrafanaTheme2 } from '@grafana/data';\nimport { css } from '@emotion/css';\n\nexport const getStyles = (theme: GrafanaTheme2) => {\n  const containerBorder = theme.isDark ? theme.v1.palette.dark9 : theme.v1.palette.gray5;\n\n  return {\n    container: css`\n      top: -1px;\n      position: absolute;\n      right: 544px;\n      box-shadow: 0px 0px 20px ${theme.v1.colors.dropdownShadow};\n      background-color: ${theme.v1.colors.bodyBg};\n      z-index: -1;\n      border: 1px solid ${containerBorder};\n      border-radius: 2px 0 0 2px;\n\n      &:after {\n        display: block;\n        background-color: ${theme.v1.colors.bodyBg};\n        width: 19px;\n        height: 100%;\n        content: '';\n        position: absolute;\n        top: 0;\n        right: -19px;\n        border-left: 1px solid ${theme.v1.colors.border1};\n      }\n    `,\n    modal: css`\n      z-index: ${theme.v1.zIndex.modal};\n    `,\n    content: css`\n      margin: 0 auto;\n      width: 268px;\n    `,\n    backdrop: css`\n      position: fixed;\n      top: 0;\n      right: 0;\n      bottom: 0;\n      left: 0;\n      background: #202226;\n      opacity: 0.7;\n      z-index: ${theme.v1.zIndex.modalBackdrop};\n      text-align: center;\n    `,\n  };\n};\n\nexport const getBodyStyles = (theme: GrafanaTheme2) => {\n  const containerBorder = theme.isDark ? theme.v1.palette.dark9 : theme.v1.palette.gray5;\n\n  return {\n    title: css`\n      color: ${theme.colors.text};\n      background-color: ${theme.v1.colors.bodyBg};\n      font-size: ${theme.v1.typography.size.md};\n      border: 1px solid transparent;\n\n      &:hover {\n        position: relative;\n      }\n    `,\n    body: css`\n      z-index: ${theme.zIndex.modal};\n      position: fixed;\n      background-color: ${theme.v1.colors.bodyBg};\n      width: 268px;\n\n      box-shadow: 0px 0px 20px ${theme.v1.colors.dropdownShadow};\n      border: 1px solid ${containerBorder};\n      border-radius: 2px 0 0 2px;\n\n      .react-calendar__navigation__label,\n      .react-calendar__navigation__arrow,\n      .react-calendar__navigation {\n        padding-top: 4px;\n        background-color: inherit;\n        color: ${theme.colors.text};\n        border: 0;\n        font-weight: ${theme.v1.typography.weight.semibold};\n      }\n\n      .react-calendar__month-view__weekdays {\n        background-color: inherit;\n        text-align: center;\n        color: ${theme.v1.palette.blue77};\n\n        abbr {\n          border: 0;\n          text-decoration: none;\n          cursor: default;\n          display: block;\n          padding: 4px 0 4px 0;\n        }\n      }\n\n      .react-calendar__month-view__days {\n        background-color: inherit;\n      }\n\n      .react-calendar__tile,\n      .react-calendar__tile--now {\n        margin-bottom: 4px;\n        background-color: inherit;\n        height: 26px;\n      }\n\n      .react-calendar__navigation__label,\n      .react-calendar__navigation > button:focus,\n      .time-picker-calendar-tile:focus {\n        outline: 0;\n      }\n\n      .react-calendar__tile--active,\n      .react-calendar__tile--active:hover {\n        color: ${theme.v1.palette.white};\n        font-weight: ${theme.v1.typography.weight.semibold};\n        background: ${theme.v1.palette.blue95};\n        box-shadow: none;\n        border: 0px;\n      }\n\n      .react-calendar__tile--rangeEnd,\n      .react-calendar__tile--rangeStart {\n        padding: 0;\n        border: 0px;\n        color: ${theme.v1.palette.white};\n        font-weight: ${theme.v1.typography.weight.semibold};\n        background: ${theme.v1.palette.blue95};\n\n        abbr {\n          background-color: ${theme.v1.palette.blue77};\n          border-radius: 100px;\n          display: block;\n          padding-top: 2px;\n          height: 26px;\n        }\n      }\n\n      .react-calendar__tile--rangeStart {\n        border-top-left-radius: 20px;\n        border-bottom-left-radius: 20px;\n      }\n\n      .react-calendar__tile--rangeEnd {\n        border-top-right-radius: 20px;\n        border-bottom-right-radius: 20px;\n      }\n    `,\n  };\n};\n"],"names":["getStyles"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"file":"DatePickerWithInput.js","sources":["../../../../src/components/DatePickerWithInput/DatePickerWithInput.tsx"],"sourcesContent":["import React, { type ComponentProps, useState } from 'react';\nimport { Input } from '@grafana/ui';\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":";;;;;;AAMa,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,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,kBAAA,KAAA,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,qBAEL,KAAA,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 React, { type ComponentProps, useState } from 'react';\nimport { Input } from '@grafana/ui';\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":";;;;;;AAMO,MAAM,UAAA,GAAa,CAAC,IAAA,KAAe,IAAA,CAAK,aAAY,CAAE,KAAA,CAAM,GAAG,CAAA,CAAE,CAAC;AAOlE,MAAM,mBAAA,GAAsB,CAAC,KAAA,KAAoC;AACtE,EAAA,MAAM,EAAE,KAAA,EAAO,QAAA,EAAU,SAAA,EAAW,GAAG,MAAK,GAAI,KAAA;AAChD,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,KAAK,CAAA;AACtC,EAAA,MAAM,SAAS,SAAA,EAAU;AAEzB,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,MAAA;AAAA,MACL,WAAA,EAAY,MAAA;AAAA,MACZ,KAAA,EAAO,UAAA,CAAW,KAAA,oBAAS,IAAI,MAAM,CAAA;AAAA,MACrC,OAAA,EAAS,MAAM,OAAA,CAAQ,IAAI,CAAA;AAAA,MAC3B,UAAU,MAAM;AAAA,MAAC,CAAA;AAAA,MACjB,SAAA,EAAW,EAAA,CAAG,MAAA,CAAO,KAAA,EAAO,SAAS,CAAA;AAAA,MACpC,GAAG;AAAA;AAAA,qBAEN,KAAA,CAAA,aAAA,CAAC,UAAA,EAAA,EAAW,MAAA,EAAQ,IAAA,EAAM,OAAc,QAAA,EAAU,CAAC,EAAA,KAAY,QAAA,CAAS,EAAE,CAAA,EAAG,OAAA,EAAS,MAAM,OAAA,CAAQ,KAAK,GAAG,CAC9G,CAAA;AAEJ;;;;"}

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

@@ -1,6 +1,6 @@
 import { css } from '@emotion/css';
 
-function getStyles() {
+function getStyles$q() {
   return {
     input: css({
       /* hides the native Calendar picker icon given when using type=date */
@@ -12,5 +12,5 @@ function getStyles() {
   };
 }
 
-export { getStyles };
+export { getStyles$q as getStyles };
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/DatePickerWithInput/styles.ts"],"sourcesContent":["import { css } from '@emotion/css';\n\nexport function getStyles() {\n  return {\n    input: css({\n      /* hides the native Calendar picker icon given when using type=date */\n      \"input[type='date']::-webkit-inner-spin-button, input[type='date']::-webkit-calendar-picker-indicator\": {\n        display: 'none',\n        WebkitAppearance: 'none',\n      },\n    }),\n  };\n}\n"],"names":[],"mappings":";;AAEO,SAAS,SAAY,GAAA;AAC1B,EAAO,OAAA;AAAA,IACL,OAAO,GAAI,CAAA;AAAA;AAAA,MAET,sGAAwG,EAAA;AAAA,QACtG,OAAS,EAAA,MAAA;AAAA,QACT,gBAAkB,EAAA;AAAA;AACpB,KACD;AAAA,GACH;AACF;;;;"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/DatePickerWithInput/styles.ts"],"sourcesContent":["import { css } from '@emotion/css';\n\nexport function getStyles() {\n  return {\n    input: css({\n      /* hides the native Calendar picker icon given when using type=date */\n      \"input[type='date']::-webkit-inner-spin-button, input[type='date']::-webkit-calendar-picker-indicator\": {\n        display: 'none',\n        WebkitAppearance: 'none',\n      },\n    }),\n  };\n}\n"],"names":["getStyles"],"mappings":";;AAEO,SAASA,WAAA,GAAY;AAC1B,EAAA,OAAO;AAAA,IACL,OAAO,GAAA,CAAI;AAAA;AAAA,MAET,sGAAA,EAAwG;AAAA,QACtG,OAAA,EAAS,MAAA;AAAA,QACT,gBAAA,EAAkB;AAAA;AACpB,KACD;AAAA,GACH;AACF;;;;"}

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, 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,KAAA,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 React, { 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":";;;;AAUO,MAAM,aAAA,GAAgB,CAAC,KAAA,KAA8B;AAC1D,EAAA,MAAM,EAAE,KAAA,EAAO,UAAA,EAAY,KAAA,EAAO,GAAG,MAAK,GAAI,KAAA;AAC9C,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAS,KAAK,CAAA;AAExC,EAAA,MAAM,cAAA,GAAiB,WAAA,CAAY,KAAA,EAAO,KAAK,CAAA;AAI/C,EAAA,SAAA,CAAU,MAAM,UAAA,CAAW,cAAc,CAAA,EAAG,CAAC,cAAc,CAAC,CAAA;AAC5D,EAAA,SAAA,CAAU,MAAM,QAAA,CAAS,KAAK,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAExC,EAAA,uBAAO,KAAA,CAAA,aAAA,CAAC,KAAA,EAAA,EAAM,QAAA,EAAU,CAAC,EAAA,KAAO,QAAA,CAAS,EAAA,CAAG,aAAA,CAAc,KAAK,CAAA,EAAG,KAAA,EAAO,KAAA,EAAQ,GAAG,IAAA,EAAM,CAAA;AAC5F;;;;"}

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":[],"mappings":";;;;AAQO,MAAM,uBAAuB,CAAC,EAAE,MAAQ,EAAA,GAAG,YAAwB,KAAA;AACxE,EAAM,MAAA,OAAA,GAAU,yBAAyB,MAAM,CAAA;AAC/C,EACE,uBAAA,KAAA,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 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":[],"mappings":";;;;AAQO,MAAM,uBAAuB,CAAC,EAAE,MAAA,EAAQ,GAAG,YAAW,KAAa;AACxE,EAAA,MAAM,OAAA,GAAU,yBAAyB,MAAM,CAAA;AAC/C,EAAA,uBACE,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,MAAM,OAAA,CAAQ,IAAA;AAAA,MACd,OAAO,OAAA,CAAQ,KAAA;AAAA,MACf,MAAM,OAAA,CAAQ,IAAA;AAAA,MACd,SAAS,OAAA,CAAQ,OAAA;AAAA,MAChB,GAAG;AAAA;AAAA,GACN;AAEJ;AAEO,SAAS,0BAA0B,SAAA,EAAmC;AAC3E,EAAA,OAAO,SAAA,IAAa,SAAA,KAAc,qBAAA,CAAsB,KAAA,IAAS,cAAc,qBAAA,CAAsB,QAAA;AACvG;AAeA,SAAS,yBAAyB,SAAA,EAA+C;AAC/E,EAAA,IAAI,CAAC,SAAA,EAAW;AACd,IAAA,SAAA,GAAY,qBAAA,CAAsB,OAAA;AAAA,EACpC;AAEA,EAAA,QAAQ,SAAA;AAAW,IACjB,KAAK,qBAAA,CAAsB,QAAA;AACzB,MAAA,OAAO,EAAE,MAAM,MAAA,EAAQ,IAAA,EAAM,QAAQ,KAAA,EAAO,MAAA,EAAQ,SAAS,0CAAA,EAA2C;AAAA,IAC1G,KAAK,qBAAA,CAAsB,KAAA;AACzB,MAAA,OAAO,EAAE,MAAM,QAAA,EAAU,IAAA,EAAM,QAAQ,KAAA,EAAO,OAAA,EAAS,SAAS,4BAAA,EAA6B;AAAA,IAC/F,KAAK,qBAAA,CAAsB,OAAA;AACzB,MAAA,OAAO;AAAA,QACL,IAAA,EAAM,mBAAA;AAAA,QACN,IAAA,EAAM,sBAAA;AAAA,QACN,KAAA,EAAO,KAAA;AAAA,QACP,OAAA,EAAS;AAAA,OACX;AAAA,IACF,KAAK,qBAAA,CAAsB,QAAA;AACzB,MAAA,OAAO;AAAA,QACL,IAAA,EAAM,oBAAA;AAAA,QACN,IAAA,EAAM,sBAAA;AAAA,QACN,KAAA,EAAO,KAAA;AAAA,QACP,OAAA,EAAS;AAAA,OACX;AAAA,IACF,KAAK,qBAAA,CAAsB,OAAA;AACzB,MAAA,OAAO;AAAA,QACL,IAAA,EAAM,mBAAA;AAAA,QACN,IAAA,EAAM,sBAAA;AAAA,QACN,KAAA,EAAO,KAAA;AAAA,QACP,OAAA,EAAS;AAAA,OACX;AAAA;AAGJ,EAAA,OAAO,EAAE,MAAM,UAAA,EAAY,IAAA,EAAM,wBAAwB,KAAA,EAAO,KAAA,EAAO,SAAS,0BAAA,EAA2B;AAC7G;AAEA,oBAAA,CAAqB,WAAA,GAAc,sBAAA;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"AccessoryButton.js","sources":["../../../../src/components/QueryEditor/AccessoryButton.tsx"],"sourcesContent":["import React from 'react';\nimport { css, cx } from '@emotion/css';\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,KAAA,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 React from 'react';\nimport { css, cx } from '@emotion/css';\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,SAAA,EAAW,GAAG,OAAM,KAA4B;AAChF,EAAA,MAAM,MAAA,GAAS,WAAW,eAAe,CAAA;AAEzC,EAAA,uBAAO,KAAA,CAAA,aAAA,CAAC,UAAQ,GAAG,KAAA,EAAO,WAAW,EAAA,CAAG,SAAA,EAAW,MAAA,CAAO,MAAM,CAAA,EAAG,CAAA;AACrE;AAEA,MAAM,eAAA,GAAkB,CAAC,KAAA,MAA0B;AAAA,EACjD,QAAQ,GAAA,CAAI;AAAA,IACV,WAAA,EAAa,KAAA,CAAM,OAAA,CAAQ,CAAA,GAAI,CAAC,CAAA;AAAA,IAChC,YAAA,EAAc,KAAA,CAAM,OAAA,CAAQ,CAAA,GAAI,CAAC;AAAA,GAClC;AACH,CAAA,CAAA;;;;"}

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

@@ -29,7 +29,7 @@ const CatalogSelector = ({ db, inputId, value, onChange }) => {
     loadCatalogs();
   }, [db, loadCatalogs]);
   const handleChange = (selectable) => {
-    onChange((selectable == null ? undefined : selectable.value) || null);
+    onChange((selectable == null ? void 0 : selectable.value) || null);
   };
   const selectedValue = catalogs.find((catalog) => catalog.value === value) || null;
   return /* @__PURE__ */ React.createElement(

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

@@ -1 +1 @@
-{"version":3,"file":"CatalogSelector.js","sources":["../../../../src/components/QueryEditor/CatalogSelector.tsx"],"sourcesContent":["import React, { 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      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,KAAA,CAAA,aAAA;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,gBAAkB,EAAA;AAAA;AAAA,GACpB;AAEJ;;;;"}
+{"version":3,"file":"CatalogSelector.js","sources":["../../../../src/components/QueryEditor/CatalogSelector.tsx"],"sourcesContent":["import React, { 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      menuShouldPortal={true}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;AAYO,MAAM,kBAAkB,CAAC,EAAE,IAAI,OAAA,EAAS,KAAA,EAAO,UAAS,KAA4B;AACzF,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAI,QAAA,CAAyC,EAAE,CAAA;AAC3E,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAAS,KAAK,CAAA;AAEhD,EAAA,MAAM,YAAA,GAAe,YAAY,YAAY;AAC3C,IAAA,IAAI,CAAC,GAAG,QAAA,EAAU;AAChB,MAAA;AAAA,IACF;AAEA,IAAA,YAAA,CAAa,IAAI,CAAA;AACjB,IAAA,IAAI;AACF,MAAA,MAAM,WAAA,GAAc,MAAM,EAAA,CAAG,QAAA,EAAS;AACtC,MAAA,MAAM,cAAA,GAAiB,WAAA,CAAY,GAAA,CAAI,CAAC,OAAA,MAAa;AAAA,QACnD,KAAA,EAAO,OAAA;AAAA,QACP,KAAA,EAAO;AAAA,OACT,CAAE,CAAA;AACF,MAAA,WAAA,CAAY,cAAc,CAAA;AAAA,IAC5B,SAAS,KAAA,EAAO;AACd,MAAA,OAAA,CAAQ,KAAA,CAAM,2BAA2B,KAAK,CAAA;AAC9C,MAAA,WAAA,CAAY,EAAE,CAAA;AAAA,IAChB,CAAA,SAAE;AACA,MAAA,YAAA,CAAa,KAAK,CAAA;AAAA,IACpB;AAAA,EACF,CAAA,EAAG,CAAC,EAAE,CAAC,CAAA;AAEP,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,YAAA,EAAa;AAAA,EACf,CAAA,EAAG,CAAC,EAAA,EAAI,YAAY,CAAC,CAAA;AAErB,EAAA,MAAM,YAAA,GAAe,CAAC,UAAA,KAAwC;AAC5D,IAAA,QAAA,CAAA,CAAS,UAAA,IAAA,IAAA,GAAA,MAAA,GAAA,UAAA,CAAY,UAAS,IAAI,CAAA;AAAA,EACpC,CAAA;AAEA,EAAA,MAAM,aAAA,GAAgB,SAAS,IAAA,CAAK,CAAC,YAAY,OAAA,CAAQ,KAAA,KAAU,KAAK,CAAA,IAAK,IAAA;AAE7E,EAAA,uBACE,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,OAAA,EAAS,QAAA;AAAA,MACT,KAAA,EAAO,aAAA;AAAA,MACP,QAAA,EAAU,YAAA;AAAA,MACV,SAAA;AAAA,MACA,WAAA,EAAY,gBAAA;AAAA,MACZ,WAAA,EAAW,IAAA;AAAA,MACX,gBAAA,EAAgB,IAAA;AAAA,MAChB,gBAAA,EAAkB;AAAA;AAAA,GACpB;AAEJ;;;;"}

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

@@ -6,13 +6,14 @@ function ConfirmModal({ isOpen, onCancel, onDiscard, onCopy }) {
   useEffect(() => {
     var _a;
     if (isOpen) {
-      (_a = buttonRef.current) == null ? undefined : _a.focus();
+      (_a = buttonRef.current) == null ? void 0 : _a.focus();
     }
   }, [isOpen]);
   return /* @__PURE__ */ React.createElement(
     Modal,
     {
       title: /* @__PURE__ */ React.createElement("div", { className: "modal-header-title" }, /* @__PURE__ */ React.createElement(Icon, { name: "exclamation-triangle", size: "lg" }), /* @__PURE__ */ React.createElement("span", { className: "p-l-1" }, "Warning")),
+      ariaLabel: "Warning",
       onDismiss: onCancel,
       isOpen
     },

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":[],"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,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,uBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,SAAU,EAAA,oBAAA,EAAA,sCACZ,IAAK,EAAA,EAAA,IAAA,EAAK,sBAAuB,EAAA,IAAA,EAAK,MAAK,CAC5C,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAK,SAAU,EAAA,OAAA,EAAA,EAAQ,SAAO,CACjC,CAAA;AAAA,MAEF,SAAW,EAAA,QAAA;AAAA,MACX;AAAA,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA,CAAC,WAAE,+HAGH,CAAA;AAAA,oBACA,KAAA,CAAA,aAAA,CAAC,WAAE,iDAA+C,CAAA;AAAA,oBACjD,KAAA,CAAA,aAAA,CAAA,KAAA,CAAM,SAAN,EAAA,IAAA,sCACE,MAAO,EAAA,EAAA,IAAA,EAAK,QAAS,EAAA,OAAA,EAAQ,aAAY,OAAS,EAAA,QAAA,EAAU,IAAK,EAAA,SAAA,EAAA,EAAU,QAE5E,CACA,kBAAA,KAAA,CAAA,aAAA,CAAC,MAAO,EAAA,EAAA,OAAA,EAAQ,eAAc,IAAK,EAAA,QAAA,EAAS,OAAS,EAAA,SAAA,EAAW,KAAK,SAAW,EAAA,EAAA,yBAEhF,CACA,kBAAA,KAAA,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 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      ariaLabel=\"Warning\"\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,QAAA,EAAU,SAAA,EAAW,QAAO,EAAsB;AACvF,EAAA,MAAM,SAAA,GAAY,OAA0B,IAAI,CAAA;AAGhD,EAAA,SAAA,CAAU,MAAM;AAdlB,IAAA,IAAA,EAAA;AAgBI,IAAA,IAAI,MAAA,EAAQ;AACV,MAAA,CAAA,EAAA,GAAA,SAAA,CAAU,YAAV,IAAA,GAAA,MAAA,GAAA,EAAA,CAAmB,KAAA,EAAA;AAAA,IACrB;AAAA,EACF,CAAA,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EAAA,uBACE,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,uBACE,KAAA,CAAA,aAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,oBAAA,EAAA,sCACZ,IAAA,EAAA,EAAK,IAAA,EAAK,sBAAA,EAAuB,IAAA,EAAK,MAAK,CAAA,kBAC5C,KAAA,CAAA,aAAA,CAAC,UAAK,SAAA,EAAU,OAAA,EAAA,EAAQ,SAAO,CACjC,CAAA;AAAA,MAEF,SAAA,EAAU,SAAA;AAAA,MACV,SAAA,EAAW,QAAA;AAAA,MACX;AAAA,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA,CAAC,WAAE,+HAGH,CAAA;AAAA,oBACA,KAAA,CAAA,aAAA,CAAC,WAAE,iDAA+C,CAAA;AAAA,oBAClD,KAAA,CAAA,aAAA,CAAC,KAAA,CAAM,SAAA,EAAN,IAAA,sCACE,MAAA,EAAA,EAAO,IAAA,EAAK,QAAA,EAAS,OAAA,EAAQ,aAAY,OAAA,EAAS,QAAA,EAAU,IAAA,EAAK,SAAA,EAAA,EAAU,QAE5E,CAAA,kBACA,KAAA,CAAA,aAAA,CAAC,MAAA,EAAA,EAAO,OAAA,EAAQ,eAAc,IAAA,EAAK,QAAA,EAAS,OAAA,EAAS,SAAA,EAAW,KAAK,SAAA,EAAA,EAAW,yBAEhF,CAAA,kBACA,KAAA,CAAA,aAAA,CAAC,UAAO,OAAA,EAAQ,SAAA,EAAU,OAAA,EAAS,MAAA,EAAA,EAAQ,sBAE3C,CACF;AAAA,GACF;AAEJ;;;;"}

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

@@ -34,7 +34,7 @@ const DatasetSelector = ({
         onChange(state.value[0]);
       }
     } else {
-      if (state.value && state.value.find((v) => v.value === value) === undefined) {
+      if (state.value && state.value.find((v) => v.value === value) === void 0) {
         if (state.value.length > 0) {
           onChange(state.value[0]);
         }

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

@@ -1 +1 @@
-{"version":3,"file":"DatasetSelector.js","sources":["../../../../src/components/QueryEditor/DatasetSelector.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { useAsync } from 'react-use';\n\nimport { type SelectableValue } from '@grafana/data';\nimport { Select } from '@grafana/ui';\n\nimport { type DB, type ResourceSelectorProps, toOption } from './types';\n\ninterface DatasetSelectorProps extends ResourceSelectorProps {\n  db: DB;\n  dataset?: string;\n  catalog?: string; // When provided, fetch schemas instead of datasets\n  value: string | null;\n  applyDefault?: boolean;\n  disabled?: boolean;\n  onChange: (v: SelectableValue) => void;\n  inputId?: string;\n  enableCatalogs?: boolean;\n  'data-testid'?: string;\n}\n\nexport const DatasetSelector = ({\n  db,\n  dataset,\n  catalog,\n  value,\n  onChange,\n  disabled,\n  className,\n  applyDefault,\n  inputId,\n  enableCatalogs,\n  'data-testid': dataTestId,\n}: DatasetSelectorProps) => {\n  const state = useAsync(async () => {\n    // If a default dataset is provided, use it\n    if (dataset) {\n      onChange(toOption(dataset));\n      return [toOption(dataset)];\n    }\n\n    // Fetch datasets - when catalog is provided, db.datasets(catalog) returns schemas for that catalog\n    const datasets = await db.datasets(catalog);\n    return datasets.map(toOption);\n  }, [catalog]);\n\n  useEffect(() => {\n    if (!applyDefault) {\n      return;\n    }\n    // Set default dataset when values are fetched\n    if (!value) {\n      if (state.value && state.value[0]) {\n        onChange(state.value[0]);\n      }\n    } else {\n      if (state.value && state.value.find((v) => v.value === value) === undefined) {\n        // if value is set and newly fetched values does not contain selected value\n        if (state.value.length > 0) {\n          onChange(state.value[0]);\n        }\n      }\n    }\n  }, [state.value, value, applyDefault, onChange]);\n\n  return (\n    <Select\n      inputId={inputId}\n      className={className}\n      aria-label=\"Dataset selector\"\n      value={value}\n      options={state.value}\n      onChange={onChange}\n      disabled={disabled}\n      isLoading={state.loading}\n      menuShouldPortal={true}\n      data-testid={dataTestId}\n      placeholder={enableCatalogs ? 'Select schema' : 'Select dataset'}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;AAqBO,MAAM,kBAAkB,CAAC;AAAA,EAC9B,EAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAe,EAAA;AACjB,CAA4B,KAAA;AAC1B,EAAM,MAAA,KAAA,GAAQ,SAAS,YAAY;AAEjC,IAAA,IAAI,OAAS,EAAA;AACX,MAAS,QAAA,CAAA,QAAA,CAAS,OAAO,CAAC,CAAA;AAC1B,MAAO,OAAA,CAAC,QAAS,CAAA,OAAO,CAAC,CAAA;AAAA;AAI3B,IAAA,MAAM,QAAW,GAAA,MAAM,EAAG,CAAA,QAAA,CAAS,OAAO,CAAA;AAC1C,IAAO,OAAA,QAAA,CAAS,IAAI,QAAQ,CAAA;AAAA,GAC9B,EAAG,CAAC,OAAO,CAAC,CAAA;AAEZ,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,YAAc,EAAA;AACjB,MAAA;AAAA;AAGF,IAAA,IAAI,CAAC,KAAO,EAAA;AACV,MAAA,IAAI,KAAM,CAAA,KAAA,IAAS,KAAM,CAAA,KAAA,CAAM,CAAC,CAAG,EAAA;AACjC,QAAS,QAAA,CAAA,KAAA,CAAM,KAAM,CAAA,CAAC,CAAC,CAAA;AAAA;AACzB,KACK,MAAA;AACL,MAAI,IAAA,KAAA,CAAM,KAAS,IAAA,KAAA,CAAM,KAAM,CAAA,IAAA,CAAK,CAAC,CAAA,KAAM,CAAE,CAAA,KAAA,KAAU,KAAK,CAAA,KAAM,SAAW,EAAA;AAE3E,QAAI,IAAA,KAAA,CAAM,KAAM,CAAA,MAAA,GAAS,CAAG,EAAA;AAC1B,UAAS,QAAA,CAAA,KAAA,CAAM,KAAM,CAAA,CAAC,CAAC,CAAA;AAAA;AACzB;AACF;AACF,KACC,CAAC,KAAA,CAAM,OAAO,KAAO,EAAA,YAAA,EAAc,QAAQ,CAAC,CAAA;AAE/C,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,SAAA;AAAA,MACA,YAAW,EAAA,kBAAA;AAAA,MACX,KAAA;AAAA,MACA,SAAS,KAAM,CAAA,KAAA;AAAA,MACf,QAAA;AAAA,MACA,QAAA;AAAA,MACA,WAAW,KAAM,CAAA,OAAA;AAAA,MACjB,gBAAkB,EAAA,IAAA;AAAA,MAClB,aAAa,EAAA,UAAA;AAAA,MACb,WAAA,EAAa,iBAAiB,eAAkB,GAAA;AAAA;AAAA,GAClD;AAEJ;;;;"}
+{"version":3,"file":"DatasetSelector.js","sources":["../../../../src/components/QueryEditor/DatasetSelector.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\nimport { useAsync } from 'react-use';\n\nimport { type SelectableValue } from '@grafana/data';\nimport { Select } from '@grafana/ui';\n\nimport { type DB, type ResourceSelectorProps, toOption } from './types';\n\ninterface DatasetSelectorProps extends ResourceSelectorProps {\n  db: DB;\n  dataset?: string;\n  catalog?: string; // When provided, fetch schemas instead of datasets\n  value: string | null;\n  applyDefault?: boolean;\n  disabled?: boolean;\n  onChange: (v: SelectableValue) => void;\n  inputId?: string;\n  enableCatalogs?: boolean;\n  'data-testid'?: string;\n}\n\nexport const DatasetSelector = ({\n  db,\n  dataset,\n  catalog,\n  value,\n  onChange,\n  disabled,\n  className,\n  applyDefault,\n  inputId,\n  enableCatalogs,\n  'data-testid': dataTestId,\n}: DatasetSelectorProps) => {\n  const state = useAsync(async () => {\n    // If a default dataset is provided, use it\n    if (dataset) {\n      onChange(toOption(dataset));\n      return [toOption(dataset)];\n    }\n\n    // Fetch datasets - when catalog is provided, db.datasets(catalog) returns schemas for that catalog\n    const datasets = await db.datasets(catalog);\n    return datasets.map(toOption);\n  }, [catalog]);\n\n  useEffect(() => {\n    if (!applyDefault) {\n      return;\n    }\n    // Set default dataset when values are fetched\n    if (!value) {\n      if (state.value && state.value[0]) {\n        onChange(state.value[0]);\n      }\n    } else {\n      if (state.value && state.value.find((v) => v.value === value) === undefined) {\n        // if value is set and newly fetched values does not contain selected value\n        if (state.value.length > 0) {\n          onChange(state.value[0]);\n        }\n      }\n    }\n  }, [state.value, value, applyDefault, onChange]);\n\n  return (\n    <Select\n      inputId={inputId}\n      className={className}\n      aria-label=\"Dataset selector\"\n      value={value}\n      options={state.value}\n      onChange={onChange}\n      disabled={disabled}\n      isLoading={state.loading}\n      menuShouldPortal={true}\n      data-testid={dataTestId}\n      placeholder={enableCatalogs ? 'Select schema' : 'Select dataset'}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;AAqBO,MAAM,kBAAkB,CAAC;AAAA,EAC9B,EAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,YAAA;AAAA,EACA,OAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA,EAAe;AACjB,CAAA,KAA4B;AAC1B,EAAA,MAAM,KAAA,GAAQ,SAAS,YAAY;AAEjC,IAAA,IAAI,OAAA,EAAS;AACX,MAAA,QAAA,CAAS,QAAA,CAAS,OAAO,CAAC,CAAA;AAC1B,MAAA,OAAO,CAAC,QAAA,CAAS,OAAO,CAAC,CAAA;AAAA,IAC3B;AAGA,IAAA,MAAM,QAAA,GAAW,MAAM,EAAA,CAAG,QAAA,CAAS,OAAO,CAAA;AAC1C,IAAA,OAAO,QAAA,CAAS,IAAI,QAAQ,CAAA;AAAA,EAC9B,CAAA,EAAG,CAAC,OAAO,CAAC,CAAA;AAEZ,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,YAAA,EAAc;AACjB,MAAA;AAAA,IACF;AAEA,IAAA,IAAI,CAAC,KAAA,EAAO;AACV,MAAA,IAAI,KAAA,CAAM,KAAA,IAAS,KAAA,CAAM,KAAA,CAAM,CAAC,CAAA,EAAG;AACjC,QAAA,QAAA,CAAS,KAAA,CAAM,KAAA,CAAM,CAAC,CAAC,CAAA;AAAA,MACzB;AAAA,IACF,CAAA,MAAO;AACL,MAAA,IAAI,KAAA,CAAM,KAAA,IAAS,KAAA,CAAM,KAAA,CAAM,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,KAAA,KAAU,KAAK,CAAA,KAAM,MAAA,EAAW;AAE3E,QAAA,IAAI,KAAA,CAAM,KAAA,CAAM,MAAA,GAAS,CAAA,EAAG;AAC1B,UAAA,QAAA,CAAS,KAAA,CAAM,KAAA,CAAM,CAAC,CAAC,CAAA;AAAA,QACzB;AAAA,MACF;AAAA,IACF;AAAA,EACF,GAAG,CAAC,KAAA,CAAM,OAAO,KAAA,EAAO,YAAA,EAAc,QAAQ,CAAC,CAAA;AAE/C,EAAA,uBACE,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,OAAA;AAAA,MACA,SAAA;AAAA,MACA,YAAA,EAAW,kBAAA;AAAA,MACX,KAAA;AAAA,MACA,SAAS,KAAA,CAAM,KAAA;AAAA,MACf,QAAA;AAAA,MACA,QAAA;AAAA,MACA,WAAW,KAAA,CAAM,OAAA;AAAA,MACjB,gBAAA,EAAkB,IAAA;AAAA,MAClB,aAAA,EAAa,UAAA;AAAA,MACb,WAAA,EAAa,iBAAiB,eAAA,GAAkB;AAAA;AAAA,GAClD;AAEJ;;;;"}

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

@@ -3,15 +3,15 @@ import { css } from '@emotion/css';
 import '@grafana/data';
 import { useStyles2, ReactUtils, Tooltip, Icon, Space, Field } from '@grafana/ui';
 
-const EditorField = (props) => {
+const EditorField$1 = (props) => {
   var _a;
   const { label, optional, tooltip, tooltipInteractive, children, width, ...fieldProps } = props;
-  const styles = useStyles2(getStyles, width);
-  const childInputId = (fieldProps == null ? undefined : fieldProps.htmlFor) || ((_a = ReactUtils) == null ? undefined : _a.getChildId(children));
+  const styles = useStyles2(getStyles$l, width);
+  const childInputId = (fieldProps == null ? void 0 : fieldProps.htmlFor) || ((_a = ReactUtils) == null ? void 0 : _a.getChildId(children));
   const labelEl = /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("label", { className: styles.label, htmlFor: childInputId }, label, optional && /* @__PURE__ */ React.createElement("span", { className: styles.optional }, " - optional"), tooltip && /* @__PURE__ */ React.createElement(Tooltip, { placement: "top", content: tooltip, theme: "info", interactive: tooltipInteractive }, /* @__PURE__ */ React.createElement(Icon, { tabIndex: 0, name: "info-circle", size: "sm", className: styles.icon }))), /* @__PURE__ */ React.createElement(Space, { v: 0.5 }));
   return /* @__PURE__ */ React.createElement("div", { className: styles.root }, /* @__PURE__ */ React.createElement(Field, { className: styles.field, label: labelEl, ...fieldProps }, children));
 };
-const getStyles = (theme, width) => {
+const getStyles$l = (theme, width) => {
   return {
     root: css({
       minWidth: theme.spacing(width != null ? width : 0)
@@ -38,5 +38,5 @@ const getStyles = (theme, width) => {
   };
 };
 
-export { EditorField };
+export { EditorField$1 as EditorField };
 //# sourceMappingURL=EditorField.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"EditorField.js","sources":["../../../../src/components/QueryEditor/EditorField.tsx"],"sourcesContent":["import React, { type ComponentProps } from 'react';\nimport { css } from '@emotion/css';\nimport { type GrafanaTheme2 } from '@grafana/data';\nimport { Field, Icon, type PopoverContent, ReactUtils, Space, Tooltip, useStyles2 } from '@grafana/ui';\n\ninterface EditorFieldProps extends ComponentProps<typeof Field> {\n  label: string;\n  children: React.ReactElement;\n  width?: number | string;\n  optional?: boolean;\n  tooltip?: PopoverContent;\n  tooltipInteractive?: boolean;\n}\nexport const EditorField = (props: EditorFieldProps) => {\n  const { label, optional, tooltip, tooltipInteractive, children, width, ...fieldProps } = props;\n\n  const styles = useStyles2(getStyles, width);\n\n  // Null check for backward compatibility\n  const childInputId = fieldProps?.htmlFor || ReactUtils?.getChildId(children);\n\n  const labelEl = (\n    <>\n      <label className={styles.label} htmlFor={childInputId}>\n        {label}\n        {optional && <span className={styles.optional}> - optional</span>}\n        {tooltip && (\n          <Tooltip placement=\"top\" content={tooltip} theme=\"info\" interactive={tooltipInteractive}>\n            <Icon tabIndex={0} name=\"info-circle\" size=\"sm\" className={styles.icon} />\n          </Tooltip>\n        )}\n      </label>\n      <Space v={0.5} />\n    </>\n  );\n\n  return (\n    <div className={styles.root}>\n      <Field className={styles.field} label={labelEl} {...fieldProps}>\n        {children}\n      </Field>\n    </div>\n  );\n};\n\nconst getStyles = (theme: GrafanaTheme2, width?: number | string) => {\n  return {\n    root: css({\n      minWidth: theme.spacing(width ?? 0),\n    }),\n    label: css({\n      fontSize: 12,\n      fontWeight: theme.typography.fontWeightMedium,\n    }),\n    optional: css({\n      fontStyle: 'italic',\n      color: theme.colors.text.secondary,\n    }),\n    field: css({\n      marginBottom: 0, // GrafanaUI/Field has a bottom margin which we must remove\n    }),\n    icon: css({\n      color: theme.colors.text.secondary,\n      marginLeft: theme.spacing(1),\n      ':hover': {\n        color: theme.colors.text.primary,\n      },\n    }),\n  };\n};\n"],"names":[],"mappings":";;;;;AAaa,MAAA,WAAA,GAAc,CAAC,KAA4B,KAAA;AAbxD,EAAA,IAAA,EAAA;AAcE,EAAM,MAAA,EAAE,OAAO,QAAU,EAAA,OAAA,EAAS,oBAAoB,QAAU,EAAA,KAAA,EAAO,GAAG,UAAA,EAAe,GAAA,KAAA;AAEzF,EAAM,MAAA,MAAA,GAAS,UAAW,CAAA,SAAA,EAAW,KAAK,CAAA;AAG1C,EAAA,MAAM,YAAe,GAAA,CAAA,UAAA,IAAA,IAAA,GAAA,SAAA,GAAA,UAAA,CAAY,OAAW,MAAA,CAAA,EAAA,GAAA,UAAA,KAAA,IAAA,GAAA,SAAA,GAAA,EAAA,CAAY,UAAW,CAAA,QAAA,CAAA,CAAA;AAEnE,EAAM,MAAA,OAAA,6EAED,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAM,WAAW,MAAO,CAAA,KAAA,EAAO,SAAS,YACtC,EAAA,EAAA,KAAA,EACA,4BAAa,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAK,WAAW,MAAO,CAAA,QAAA,EAAA,EAAU,aAAW,CACzD,EAAA,OAAA,oBACE,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAQ,SAAU,EAAA,KAAA,EAAM,SAAS,OAAS,EAAA,KAAA,EAAM,QAAO,WAAa,EAAA,kBAAA,EAAA,sCAClE,IAAK,EAAA,EAAA,QAAA,EAAU,CAAG,EAAA,IAAA,EAAK,aAAc,EAAA,IAAA,EAAK,MAAK,SAAW,EAAA,MAAA,CAAO,MAAM,CAC1E,CAEJ,mBACC,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAM,CAAG,EAAA,GAAA,EAAK,CACjB,CAAA;AAGF,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,MAAA,CAAO,wBACpB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAM,SAAW,EAAA,MAAA,CAAO,OAAO,KAAO,EAAA,OAAA,EAAU,GAAG,UAAA,EAAA,EACjD,QACH,CACF,CAAA;AAEJ;AAEA,MAAM,SAAA,GAAY,CAAC,KAAA,EAAsB,KAA4B,KAAA;AACnE,EAAO,OAAA;AAAA,IACL,MAAM,GAAI,CAAA;AAAA,MACR,QAAU,EAAA,KAAA,CAAM,OAAQ,CAAA,KAAA,IAAA,IAAA,GAAA,KAAA,GAAS,CAAC;AAAA,KACnC,CAAA;AAAA,IACD,OAAO,GAAI,CAAA;AAAA,MACT,QAAU,EAAA,EAAA;AAAA,MACV,UAAA,EAAY,MAAM,UAAW,CAAA;AAAA,KAC9B,CAAA;AAAA,IACD,UAAU,GAAI,CAAA;AAAA,MACZ,SAAW,EAAA,QAAA;AAAA,MACX,KAAA,EAAO,KAAM,CAAA,MAAA,CAAO,IAAK,CAAA;AAAA,KAC1B,CAAA;AAAA,IACD,OAAO,GAAI,CAAA;AAAA,MACT,YAAc,EAAA;AAAA;AAAA,KACf,CAAA;AAAA,IACD,MAAM,GAAI,CAAA;AAAA,MACR,KAAA,EAAO,KAAM,CAAA,MAAA,CAAO,IAAK,CAAA,SAAA;AAAA,MACzB,UAAA,EAAY,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,MAC3B,QAAU,EAAA;AAAA,QACR,KAAA,EAAO,KAAM,CAAA,MAAA,CAAO,IAAK,CAAA;AAAA;AAC3B,KACD;AAAA,GACH;AACF,CAAA;;;;"}
+{"version":3,"file":"EditorField.js","sources":["../../../../src/components/QueryEditor/EditorField.tsx"],"sourcesContent":["import React, { type ComponentProps } from 'react';\nimport { css } from '@emotion/css';\nimport { type GrafanaTheme2 } from '@grafana/data';\nimport { Field, Icon, type PopoverContent, ReactUtils, Space, Tooltip, useStyles2 } from '@grafana/ui';\n\ninterface EditorFieldProps extends ComponentProps<typeof Field> {\n  label: string;\n  children: React.ReactElement;\n  width?: number | string;\n  optional?: boolean;\n  tooltip?: PopoverContent;\n  tooltipInteractive?: boolean;\n}\nexport const EditorField = (props: EditorFieldProps) => {\n  const { label, optional, tooltip, tooltipInteractive, children, width, ...fieldProps } = props;\n\n  const styles = useStyles2(getStyles, width);\n\n  // Null check for backward compatibility\n  const childInputId = fieldProps?.htmlFor || ReactUtils?.getChildId(children);\n\n  const labelEl = (\n    <>\n      <label className={styles.label} htmlFor={childInputId}>\n        {label}\n        {optional && <span className={styles.optional}> - optional</span>}\n        {tooltip && (\n          <Tooltip placement=\"top\" content={tooltip} theme=\"info\" interactive={tooltipInteractive}>\n            <Icon tabIndex={0} name=\"info-circle\" size=\"sm\" className={styles.icon} />\n          </Tooltip>\n        )}\n      </label>\n      <Space v={0.5} />\n    </>\n  );\n\n  return (\n    <div className={styles.root}>\n      <Field className={styles.field} label={labelEl} {...fieldProps}>\n        {children}\n      </Field>\n    </div>\n  );\n};\n\nconst getStyles = (theme: GrafanaTheme2, width?: number | string) => {\n  return {\n    root: css({\n      minWidth: theme.spacing(width ?? 0),\n    }),\n    label: css({\n      fontSize: 12,\n      fontWeight: theme.typography.fontWeightMedium,\n    }),\n    optional: css({\n      fontStyle: 'italic',\n      color: theme.colors.text.secondary,\n    }),\n    field: css({\n      marginBottom: 0, // GrafanaUI/Field has a bottom margin which we must remove\n    }),\n    icon: css({\n      color: theme.colors.text.secondary,\n      marginLeft: theme.spacing(1),\n      ':hover': {\n        color: theme.colors.text.primary,\n      },\n    }),\n  };\n};\n"],"names":["EditorField","getStyles"],"mappings":";;;;;AAaO,MAAMA,aAAA,GAAc,CAAC,KAAA,KAA4B;AAbxD,EAAA,IAAA,EAAA;AAcE,EAAA,MAAM,EAAE,OAAO,QAAA,EAAU,OAAA,EAAS,oBAAoB,QAAA,EAAU,KAAA,EAAO,GAAG,UAAA,EAAW,GAAI,KAAA;AAEzF,EAAA,MAAM,MAAA,GAAS,UAAA,CAAWC,WAAA,EAAW,KAAK,CAAA;AAG1C,EAAA,MAAM,YAAA,GAAA,CAAe,UAAA,IAAA,IAAA,GAAA,MAAA,GAAA,UAAA,CAAY,OAAA,MAAA,CAAW,EAAA,GAAA,UAAA,KAAA,IAAA,GAAA,MAAA,GAAA,EAAA,CAAY,UAAA,CAAW,QAAA,CAAA,CAAA;AAEnE,EAAA,MAAM,OAAA,6EAEF,KAAA,CAAA,aAAA,CAAC,OAAA,EAAA,EAAM,WAAW,MAAA,CAAO,KAAA,EAAO,SAAS,YAAA,EAAA,EACtC,KAAA,EACA,4BAAY,KAAA,CAAA,aAAA,CAAC,MAAA,EAAA,EAAK,WAAW,MAAA,CAAO,QAAA,EAAA,EAAU,aAAW,CAAA,EACzD,OAAA,oBACC,KAAA,CAAA,aAAA,CAAC,OAAA,EAAA,EAAQ,SAAA,EAAU,KAAA,EAAM,SAAS,OAAA,EAAS,KAAA,EAAM,QAAO,WAAA,EAAa,kBAAA,EAAA,sCAClE,IAAA,EAAA,EAAK,QAAA,EAAU,CAAA,EAAG,IAAA,EAAK,aAAA,EAAc,IAAA,EAAK,MAAK,SAAA,EAAW,MAAA,CAAO,MAAM,CAC1E,CAEJ,mBACA,KAAA,CAAA,aAAA,CAAC,KAAA,EAAA,EAAM,CAAA,EAAG,GAAA,EAAK,CACjB,CAAA;AAGF,EAAA,uBACE,KAAA,CAAA,aAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,wBACrB,KAAA,CAAA,aAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAW,MAAA,CAAO,OAAO,KAAA,EAAO,OAAA,EAAU,GAAG,UAAA,EAAA,EACjD,QACH,CACF,CAAA;AAEJ;AAEA,MAAMA,WAAA,GAAY,CAAC,KAAA,EAAsB,KAAA,KAA4B;AACnE,EAAA,OAAO;AAAA,IACL,MAAM,GAAA,CAAI;AAAA,MACR,QAAA,EAAU,KAAA,CAAM,OAAA,CAAQ,KAAA,IAAA,IAAA,GAAA,KAAA,GAAS,CAAC;AAAA,KACnC,CAAA;AAAA,IACD,OAAO,GAAA,CAAI;AAAA,MACT,QAAA,EAAU,EAAA;AAAA,MACV,UAAA,EAAY,MAAM,UAAA,CAAW;AAAA,KAC9B,CAAA;AAAA,IACD,UAAU,GAAA,CAAI;AAAA,MACZ,SAAA,EAAW,QAAA;AAAA,MACX,KAAA,EAAO,KAAA,CAAM,MAAA,CAAO,IAAA,CAAK;AAAA,KAC1B,CAAA;AAAA,IACD,OAAO,GAAA,CAAI;AAAA,MACT,YAAA,EAAc;AAAA;AAAA,KACf,CAAA;AAAA,IACD,MAAM,GAAA,CAAI;AAAA,MACR,KAAA,EAAO,KAAA,CAAM,MAAA,CAAO,IAAA,CAAK,SAAA;AAAA,MACzB,UAAA,EAAY,KAAA,CAAM,OAAA,CAAQ,CAAC,CAAA;AAAA,MAC3B,QAAA,EAAU;AAAA,QACR,KAAA,EAAO,KAAA,CAAM,MAAA,CAAO,IAAA,CAAK;AAAA;AAC3B,KACD;AAAA,GACH;AACF,CAAA;;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"EditorFieldGroup.js","sources":["../../../../src/components/QueryEditor/EditorFieldGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { EditorStack } from './EditorStack';\n\ninterface EditorFieldGroupProps {\n  children?: React.ReactNode;\n}\n\nexport const EditorFieldGroup = ({ children }: EditorFieldGroupProps) => {\n  return <EditorStack gap={1}>{children}</EditorStack>;\n};\n"],"names":[],"mappings":";;;AAOO,MAAM,gBAAmB,GAAA,CAAC,EAAE,QAAA,EAAsC,KAAA;AACvE,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,WAAA,EAAA,EAAY,GAAK,EAAA,CAAA,EAAA,EAAI,QAAS,CAAA;AACxC;;;;"}
+{"version":3,"file":"EditorFieldGroup.js","sources":["../../../../src/components/QueryEditor/EditorFieldGroup.tsx"],"sourcesContent":["import React from 'react';\nimport { EditorStack } from './EditorStack';\n\ninterface EditorFieldGroupProps {\n  children?: React.ReactNode;\n}\n\nexport const EditorFieldGroup = ({ children }: EditorFieldGroupProps) => {\n  return <EditorStack gap={1}>{children}</EditorStack>;\n};\n"],"names":[],"mappings":";;;AAOO,MAAM,gBAAA,GAAmB,CAAC,EAAE,QAAA,EAAS,KAA6B;AACvE,EAAA,uBAAO,KAAA,CAAA,aAAA,CAAC,WAAA,EAAA,EAAY,GAAA,EAAK,CAAA,EAAA,EAAI,QAAS,CAAA;AACxC;;;;"}

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

@@ -4,10 +4,10 @@ import '@grafana/data';
 import { useStyles2 } from '@grafana/ui';
 
 const EditorHeader = ({ children }) => {
-  const styles = useStyles2(getStyles);
+  const styles = useStyles2(getStyles$m);
   return /* @__PURE__ */ React.createElement("div", { className: styles.root }, children);
 };
-const getStyles = (theme) => ({
+const getStyles$m = (theme) => ({
   root: css({
     display: "flex",
     flexWrap: "wrap",

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

@@ -1 +1 @@
-{"version":3,"file":"EditorHeader.js","sources":["../../../../src/components/QueryEditor/EditorHeader.tsx"],"sourcesContent":["import React from 'react';\nimport { css } from '@emotion/css';\nimport { type GrafanaTheme2 } from '@grafana/data';\nimport { useStyles2 } from '@grafana/ui';\n\ninterface EditorHeaderProps {\n  children?: React.ReactNode;\n}\n\nexport const EditorHeader = ({ children }: EditorHeaderProps) => {\n  const styles = useStyles2(getStyles);\n\n  return <div className={styles.root}>{children}</div>;\n};\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  root: css({\n    display: 'flex',\n    flexWrap: 'wrap',\n    alignItems: 'center',\n    gap: theme.spacing(3),\n    minHeight: theme.spacing(4),\n  }),\n});\n"],"names":[],"mappings":";;;;;AASO,MAAM,YAAe,GAAA,CAAC,EAAE,QAAA,EAAkC,KAAA;AAC/D,EAAM,MAAA,MAAA,GAAS,WAAW,SAAS,CAAA;AAEnC,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,MAAA,CAAO,QAAO,QAAS,CAAA;AAChD;AAEA,MAAM,SAAA,GAAY,CAAC,KAA0B,MAAA;AAAA,EAC3C,MAAM,GAAI,CAAA;AAAA,IACR,OAAS,EAAA,MAAA;AAAA,IACT,QAAU,EAAA,MAAA;AAAA,IACV,UAAY,EAAA,QAAA;AAAA,IACZ,GAAA,EAAK,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,IACpB,SAAA,EAAW,KAAM,CAAA,OAAA,CAAQ,CAAC;AAAA,GAC3B;AACH,CAAA,CAAA;;;;"}
+{"version":3,"file":"EditorHeader.js","sources":["../../../../src/components/QueryEditor/EditorHeader.tsx"],"sourcesContent":["import React from 'react';\nimport { css } from '@emotion/css';\nimport { type GrafanaTheme2 } from '@grafana/data';\nimport { useStyles2 } from '@grafana/ui';\n\ninterface EditorHeaderProps {\n  children?: React.ReactNode;\n}\n\nexport const EditorHeader = ({ children }: EditorHeaderProps) => {\n  const styles = useStyles2(getStyles);\n\n  return <div className={styles.root}>{children}</div>;\n};\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n  root: css({\n    display: 'flex',\n    flexWrap: 'wrap',\n    alignItems: 'center',\n    gap: theme.spacing(3),\n    minHeight: theme.spacing(4),\n  }),\n});\n"],"names":["getStyles"],"mappings":";;;;;AASO,MAAM,YAAA,GAAe,CAAC,EAAE,QAAA,EAAS,KAAyB;AAC/D,EAAA,MAAM,MAAA,GAAS,WAAWA,WAAS,CAAA;AAEnC,EAAA,uBAAO,KAAA,CAAA,aAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,MAAA,CAAO,QAAO,QAAS,CAAA;AAChD;AAEA,MAAMA,WAAA,GAAY,CAAC,KAAA,MAA0B;AAAA,EAC3C,MAAM,GAAA,CAAI;AAAA,IACR,OAAA,EAAS,MAAA;AAAA,IACT,QAAA,EAAU,MAAA;AAAA,IACV,UAAA,EAAY,QAAA;AAAA,IACZ,GAAA,EAAK,KAAA,CAAM,OAAA,CAAQ,CAAC,CAAA;AAAA,IACpB,SAAA,EAAW,KAAA,CAAM,OAAA,CAAQ,CAAC;AAAA,GAC3B;AACH,CAAA,CAAA;;;;"}