@grafana/plugin-ui 0.17.10 → 0.18.0

package/dist/cjs/index.d.cts

@@ -1,9 +1,9 @@
-import React, { ComponentProps, PureComponent, ReactElement, ReactNode, Component, ErrorInfo, FunctionComponent, HTMLProps } from 'react';
+import React, { ComponentProps, ReactElement, ReactNode, Component, ErrorInfo, PureComponent, FunctionComponent, HTMLProps } from 'react';
 import { Input, Segment as Segment$1, monacoTypes, Monaco, ButtonProps, Field, PopoverContent, Switch, SelectCommonProps, InlineLabel } from '@grafana/ui';
-import { DataSourceInstanceSettings, SelectableValue, DataSourceJsonData, VariableSuggestion, TimeRange, DataFrame, MetricFindValue, ThemeSpacingTokens, ScopedVars, VariableModel, DataFrameView, QueryEditorProps as QueryEditorProps$1, DataSourceSettings, RegistryItem, DataSourceApi, Registry, DataQuery as DataQuery$1, PanelData, DataQueryRequest, DataQueryResponse, LoadingState } from '@grafana/data';
-import { DataSourceSrv, DataSourceWithBackend, TemplateSrv } from '@grafana/runtime';
+import { DataSourceInstanceSettings, DataSourceJsonData, VariableSuggestion, SelectableValue, TimeRange, DataFrame, MetricFindValue, ThemeSpacingTokens, ScopedVars, VariableModel, DataFrameView, QueryEditorProps as QueryEditorProps$1, DataSourceSettings, RegistryItem, DataSourceApi, Registry, DataQuery as DataQuery$1, PanelData, DataQueryRequest, DataQueryResponse, LoadingState } from '@grafana/data';
 import { JsonTree } from '@react-awesome-query-builder/ui';
 import { DataQuery } from '@grafana/schema';
+import { DataSourceWithBackend, TemplateSrv } from '@grafana/runtime';
 import { SqlLanguage } from 'sql-formatter';
 import { Grammar } from 'prismjs';
 import { Observable } from 'rxjs';
@@ -46,8 +46,16 @@ interface DatePickerWithInputProps extends Omit<ComponentProps<typeof Input>, 'r
 declare const DatePickerWithInput: (props: DatePickerWithInputProps) => React.JSX.Element;
 
 interface Props$s {
-    onChange: (ds: DataSourceInstanceSettings) => void;
-    current: string | null;
+    /**
+     * Receives the selected data source's list item (`uid`, `type`, `name`, `meta`). Call
+     * `getDataSourceInstanceSettings(ds.uid)` from `@grafana/plugin-compat` if you need the full settings.
+     */
+    onChange: (ds: Pick<DataSourceInstanceSettings, 'uid' | 'type' | 'name' | 'meta'>) => void;
+    /**
+     * Reference to the selected data source, resolved the way Grafana does: uid, name, template variable or
+     * built-in. `null`/`undefined` resolves to the default data source.
+     */
+    current?: string | null;
     hideTextValue?: boolean;
     onBlur?: () => void;
     autoFocus?: boolean;
@@ -62,20 +70,7 @@ interface Props$s {
     pluginId?: string;
     noDefault?: boolean;
 }
-interface State$1 {
-    error?: string;
-}
-declare class DataSourcePicker extends PureComponent<Props$s, State$1> {
-    dataSourceSrv: DataSourceSrv;
-    static defaultProps: Partial<Props$s>;
-    state: State$1;
-    constructor(props: Props$s);
-    componentDidMount(): void;
-    onChange: (item: SelectableValue<string>) => void;
-    private getCurrentValue;
-    getDataSourceOptions(): Array<SelectableValue<string>>;
-    render(): React.JSX.Element;
-}
+declare function DataSourcePicker({ onChange, current: currentProp, hideTextValue, onBlur, autoFocus, openMenuOnFocus, placeholder, noDefault, }: Props$s): React.JSX.Element;
 
 type DataLinkConfig = {
     field: string;
@@ -1522,8 +1517,6 @@ declare function useHealthChecks(): {
     retry: (uid: string) => void;
 };
 
-declare function resolvePluginName(pluginType: string): string;
-
 type UseDatasourceSchemaResult = {
     schema: DatasourceConfigSchema | null;
     loading: boolean;
@@ -2019,5 +2012,5 @@ interface RequestLoopOptions<TQuery extends DataQuery$1 = DataQuery$1> {
  */
 declare function getRequestLooper<T extends DataQuery$1 = DataQuery$1>(req: DataQueryRequest<T>, options: RequestLoopOptions<T>): Observable<DataQueryResponse>;
 
-export { AUTH_GROUP_IDS, AccessoryButton, AdvancedHttpSettings, Auth, AuthMethod, BINARY_OPERATIONS_KEY, CatalogSelector, CompletionItemInsertTextRule, CompletionItemKind, CompletionItemPriority, ConfigDescriptionLink, ConfigSection, ConfigSubSection, ConnectionSettings, CustomHeadersSettings, DataLink, DataLinks, DataSourceDescription, DataSourcePicker, DatasetSelector, DatasourceConfigWizard, DatasourceErrorBoundary, DatasourceWithAsyncBackend, DatePicker, DatePickerWithInput, DebounceInput, EditorField, EditorFieldGroup, EditorHeader, EditorList, EditorMode, EditorRow, EditorRows, EditorStack, EditorSwitch, FlexItem, GroupByRow, InlineSelect, InputGroup, LabelFilters, LinkedToken, MacroType, OperationExplainedBox, OperationList, OperationListExplained, OperationsEditorRow, OperatorType, QUERY_FORMAT_OPTIONS, QueryBuilderHints, QueryEditorMode, QueryEditorModeToggle, QueryEditorRow, QueryFormat, QueryHeaderSwitch, QueryModellerBase, QueryOptionGroup, ROOT_CONFIG_FIELDS, RawQuery, RunQueryButton, RunQueryButtons, SQLEditor, SQLEditorMode, SQLEditorTestUtils, SecureSocksProxyToggle, Segment, Space, SqlDatasource, SqlQueryEditor, StatementPosition, SuggestionKind, TLSSettings, TableSelector, TokenType, buildCelContext, buildCloneDatasourcePayload, buildCreateDatasourcePayload, buildUpdateDatasourcePayload, clearExpressionCache, computeVirtualFieldValues, convertLegacyAuthProps, datasourceToProvisioningYaml, evaluateCelDirect, evaluateCelExpression, evaluateComputedRead, evaluateDependsOn, extractFieldRefs, fetchConfigSchema, formKey, formatDate, formatYamlDiff, generateLLMHint, generateProvisioningTemplate, generateTroubleshootingFields, getConfigSchema, getRequestLooper, getStandardSQLCompletionProvider, getWatchedValue, language as grafanaStandardSQLLanguage, conf as grafanaStandardSQLLanguageConf, isAuthGroupId, isValidCelExpression, parseDependsOn, resolveActiveOverride, resolveGroups, resolvePluginName, resolveRequiredFieldsGroup, toOption, useDatasourceSchema, useHealthChecks };
-export type { Aggregate, AllowedValuesValidationRule, Props$c as AuthProps, BaseFieldRef, BaseValidationRule, ColumnDefinition, ComputedMapping, ConfigField, ConfigGroup, CustomMeta, CustomValidationRule, DB, DataLinkConfig, DatasourceConfigSchema, DatasourceConfigWizardProps, DatasourceHealth, DatePickerProps, DatePickerWithInputProps, DebounceInputProps, DirectMapping, Expression, FieldEffect, FieldItemSchema, FieldKind, FieldOption, FieldOverride, FieldPack, FieldPackID, FieldPatch, FieldRelationship, FieldUI, FieldValidationRule, FormState, HealthState, IndexedPairMapping, Instruction, ItemCountValidationRule, LanguageCompletionProvider, LanguageDefinition, LengthValidationRule, MappingField, MetaDefinition, NameValue, PatternValidationRule, PositionContext, Props$s as Props, QueryBuilderLabelFilter, QueryBuilderOperation, QueryBuilderOperationDefinition, QueryBuilderOperationParamDef, QueryBuilderOperationParamEditorProps, QueryBuilderOperationParamValue, QueryEditorProps, QueryRowFilter, QueryStats, QueryWithDefaults, RAQBFieldTypes, RangeValidationRule, RelationshipType, RequestLoopOptions, ResolvedGroup, ResourceSelectorProps, ResponseParser, Role, RunQueryButtonsProps, RunningQueryInfo, SQLConnectionLimits, SQLExpression, SQLFilters, SQLMonarchLanguage, SQLOptions, SQLQuery, SQLSelectableValue, SchemaDefinition, SecureFieldState, SegmentProps, SqlQueryForInterpolation, SqlQueryModel, State$1 as State, StatementPlacementProvider, StorageMapping, SuggestionKindProvider, Props$f as TLSSettingsProps, TableDefinition, TableFieldSchema, TableIdentifier, TableSchema, TargetLocation, TestQueryModel, UIComponent, UIWidth, ValidationResults, ValueType, VisualQuery, VisualQueryBinary, VisualQueryModeller };
+export { AUTH_GROUP_IDS, AccessoryButton, AdvancedHttpSettings, Auth, AuthMethod, BINARY_OPERATIONS_KEY, CatalogSelector, CompletionItemInsertTextRule, CompletionItemKind, CompletionItemPriority, ConfigDescriptionLink, ConfigSection, ConfigSubSection, ConnectionSettings, CustomHeadersSettings, DataLink, DataLinks, DataSourceDescription, DataSourcePicker, DatasetSelector, DatasourceConfigWizard, DatasourceErrorBoundary, DatasourceWithAsyncBackend, DatePicker, DatePickerWithInput, DebounceInput, EditorField, EditorFieldGroup, EditorHeader, EditorList, EditorMode, EditorRow, EditorRows, EditorStack, EditorSwitch, FlexItem, GroupByRow, InlineSelect, InputGroup, LabelFilters, LinkedToken, MacroType, OperationExplainedBox, OperationList, OperationListExplained, OperationsEditorRow, OperatorType, QUERY_FORMAT_OPTIONS, QueryBuilderHints, QueryEditorMode, QueryEditorModeToggle, QueryEditorRow, QueryFormat, QueryHeaderSwitch, QueryModellerBase, QueryOptionGroup, ROOT_CONFIG_FIELDS, RawQuery, RunQueryButton, RunQueryButtons, SQLEditor, SQLEditorMode, SQLEditorTestUtils, SecureSocksProxyToggle, Segment, Space, SqlDatasource, SqlQueryEditor, StatementPosition, SuggestionKind, TLSSettings, TableSelector, TokenType, buildCelContext, buildCloneDatasourcePayload, buildCreateDatasourcePayload, buildUpdateDatasourcePayload, clearExpressionCache, computeVirtualFieldValues, convertLegacyAuthProps, datasourceToProvisioningYaml, evaluateCelDirect, evaluateCelExpression, evaluateComputedRead, evaluateDependsOn, extractFieldRefs, fetchConfigSchema, formKey, formatDate, formatYamlDiff, generateLLMHint, generateProvisioningTemplate, generateTroubleshootingFields, getConfigSchema, getRequestLooper, getStandardSQLCompletionProvider, getWatchedValue, language as grafanaStandardSQLLanguage, conf as grafanaStandardSQLLanguageConf, isAuthGroupId, isValidCelExpression, parseDependsOn, resolveActiveOverride, resolveGroups, resolveRequiredFieldsGroup, toOption, useDatasourceSchema, useHealthChecks };
+export type { Aggregate, AllowedValuesValidationRule, Props$c as AuthProps, BaseFieldRef, BaseValidationRule, ColumnDefinition, ComputedMapping, ConfigField, ConfigGroup, CustomMeta, CustomValidationRule, DB, DataLinkConfig, DatasourceConfigSchema, DatasourceConfigWizardProps, DatasourceHealth, DatePickerProps, DatePickerWithInputProps, DebounceInputProps, DirectMapping, Expression, FieldEffect, FieldItemSchema, FieldKind, FieldOption, FieldOverride, FieldPack, FieldPackID, FieldPatch, FieldRelationship, FieldUI, FieldValidationRule, FormState, HealthState, IndexedPairMapping, Instruction, ItemCountValidationRule, LanguageCompletionProvider, LanguageDefinition, LengthValidationRule, MappingField, MetaDefinition, NameValue, PatternValidationRule, PositionContext, Props$s as Props, QueryBuilderLabelFilter, QueryBuilderOperation, QueryBuilderOperationDefinition, QueryBuilderOperationParamDef, QueryBuilderOperationParamEditorProps, QueryBuilderOperationParamValue, QueryEditorProps, QueryRowFilter, QueryStats, QueryWithDefaults, RAQBFieldTypes, RangeValidationRule, RelationshipType, RequestLoopOptions, ResolvedGroup, ResourceSelectorProps, ResponseParser, Role, RunQueryButtonsProps, RunningQueryInfo, SQLConnectionLimits, SQLExpression, SQLFilters, SQLMonarchLanguage, SQLOptions, SQLQuery, SQLSelectableValue, SchemaDefinition, SecureFieldState, SegmentProps, SqlQueryForInterpolation, SqlQueryModel, StatementPlacementProvider, StorageMapping, SuggestionKindProvider, Props$f as TLSSettingsProps, TableDefinition, TableFieldSchema, TableIdentifier, TableSchema, TargetLocation, TestQueryModel, UIComponent, UIWidth, ValidationResults, ValueType, VisualQuery, VisualQueryBinary, VisualQueryModeller };

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

@@ -1,103 +1,104 @@
-import React, { PureComponent } from 'react';
+import React from 'react';
 import { Select, Stack } from '@grafana/ui';
 import '@grafana/data';
 import { selectors } from '@grafana/e2e-selectors';
+import { useDataSourceInstanceList, useDataSourceInstanceListItem } from '@grafana/plugin-compat/datasources';
 import { isUnsignedPluginSignature, PluginSignatureBadge } from '../Plugins/PluginSignatureBadge.js';
-import { getDataSourceSrv } from '@grafana/runtime';
 
-var __defProp$6 = Object.defineProperty;
-var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$6 = (obj, key, value) => __defNormalProp$6(obj, typeof key !== "symbol" ? key + "" : key, value);
-class DataSourcePicker extends PureComponent {
-  constructor(props) {
-    super(props);
-    __publicField$6(this, "dataSourceSrv", getDataSourceSrv());
-    __publicField$6(this, "state", {});
-    __publicField$6(this, "onChange", (item) => {
-      const dsSettings = this.dataSourceSrv.getInstanceSettings(item.value);
-      if (dsSettings) {
-        this.props.onChange(dsSettings);
-        this.setState({ error: void 0 });
-      }
-    });
-  }
-  componentDidMount() {
-    const { current } = this.props;
-    const dsSettings = this.dataSourceSrv.getInstanceSettings(current);
-    if (!dsSettings) {
-      this.setState({ error: "Could not find data source " + current });
+function DataSourcePicker({
+  onChange,
+  current: currentProp,
+  hideTextValue,
+  onBlur,
+  autoFocus = false,
+  openMenuOnFocus = false,
+  placeholder = "Select datasource",
+  noDefault
+}) {
+  const current = currentProp != null ? currentProp : null;
+  const showNoDatasources = !current && !!noDefault;
+  const { items, isLoading: isListLoading, error: listError } = useDataSourceInstanceList();
+  const currentResult = useDataSourceInstanceListItem(current);
+  const selected = currentResult.item;
+  const isCurrentLoading = !showNoDatasources && currentResult.isLoading;
+  const isLoading = isListLoading || isCurrentLoading;
+  const notFound = !selected && !isCurrentLoading && !showNoDatasources;
+  const handleChange = (option) => {
+    const item = items.find((ds) => ds.uid === option.value);
+    if (item) {
+      onChange(item);
     }
-  }
-  getCurrentValue() {
-    const { current, hideTextValue, noDefault } = this.props;
-    if (!current && noDefault) {
-      return {
-        label: "No datasources found"
-      };
-    }
-    const ds = this.dataSourceSrv.getInstanceSettings(current);
-    if (ds) {
-      return {
-        label: ds.name.substr(0, 37),
-        value: ds.name,
-        imgUrl: ds.meta.info.logos.small,
-        hideText: hideTextValue,
-        meta: ds.meta
-      };
+  };
+  const options = items.map((ds) => ({
+    value: ds.uid,
+    label: ds.name,
+    imgUrl: ds.meta.info.logos.small,
+    meta: ds.meta
+  }));
+  const value = getCurrentValue({ current, selected, notFound, showNoDatasources, hideTextValue });
+  const invalid = !!listError || notFound;
+  return /* @__PURE__ */ React.createElement("div", { "aria-label": selectors.components.DataSourcePicker.container }, /* @__PURE__ */ React.createElement(
+    Select,
+    {
+      className: "ds-picker select-container",
+      isMulti: false,
+      isClearable: false,
+      backspaceRemovesValue: false,
+      onChange: handleChange,
+      options,
+      isLoading,
+      autoFocus,
+      onBlur,
+      openMenuOnFocus,
+      maxMenuHeight: 500,
+      placeholder,
+      noOptionsMessage: listError ? "Could not load data sources" : "No datasources found",
+      value,
+      invalid,
+      "aria-invalid": invalid,
+      getOptionLabel: (o) => {
+        if (o.meta && isUnsignedPluginSignature(o.meta.signature) && o !== value) {
+          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 || "";
+      }
     }
+  ));
+}
+function getCurrentValue({
+  current,
+  selected,
+  notFound,
+  showNoDatasources,
+  hideTextValue
+}) {
+  if (showNoDatasources) {
     return {
-      label: (current != null ? current : "no name") + " - not found",
-      value: (current != null ? current : "no name") + " - not found",
-      imgUrl: "",
-      hideText: hideTextValue
+      label: "No datasources found"
     };
   }
-  getDataSourceOptions() {
-    const options = this.dataSourceSrv.getList().map((ds) => ({
-      value: ds.uid,
-      label: ds.name,
-      imgUrl: ds.meta.info.logos.small,
-      meta: ds.meta
-    }));
-    return options;
+  if (selected) {
+    return toOption$1(selected, hideTextValue);
   }
-  render() {
-    const { autoFocus, onBlur, openMenuOnFocus, placeholder } = this.props;
-    const { error } = this.state;
-    const options = this.getDataSourceOptions();
-    const value = this.getCurrentValue();
-    return /* @__PURE__ */ React.createElement("div", { "aria-label": selectors.components.DataSourcePicker.container }, /* @__PURE__ */ React.createElement(
-      Select,
-      {
-        className: "ds-picker select-container",
-        isMulti: false,
-        isClearable: false,
-        backspaceRemovesValue: false,
-        onChange: this.onChange,
-        options,
-        autoFocus,
-        onBlur,
-        openMenuOnFocus,
-        maxMenuHeight: 500,
-        placeholder,
-        noOptionsMessage: "No datasources found",
-        value,
-        invalid: !!error,
-        getOptionLabel: (o) => {
-          if (o.meta && isUnsignedPluginSignature(o.meta.signature) && o !== value) {
-            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 || "";
-        }
-      }
-    ));
+  if (!notFound) {
+    return void 0;
   }
+  return {
+    label: (current != null ? current : "no name") + " - not found",
+    value: (current != null ? current : "no name") + " - not found",
+    imgUrl: "",
+    hideText: hideTextValue
+  };
+}
+function toOption$1(ds, hideTextValue) {
+  return {
+    label: ds.name.substr(0, 37),
+    value: ds.name,
+    imgUrl: ds.meta.info.logos.small,
+    hideText: hideTextValue,
+    meta: ds.meta
+  };
 }
-__publicField$6(DataSourcePicker, "defaultProps", {
-  autoFocus: false,
-  openMenuOnFocus: false,
-  placeholder: "Select datasource"
-});
 
 export { DataSourcePicker };
 //# sourceMappingURL=DataSourcePicker.js.map

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 { 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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"}
+{"version":3,"file":"DataSourcePicker.js","sources":["../../../../src/components/DataSourcePicker/DataSourcePicker.tsx"],"sourcesContent":["import React from 'react';\nimport { Stack, Select } from '@grafana/ui';\nimport { type DataSourceInstanceSettings, type SelectableValue } from '@grafana/data';\nimport { selectors } from '@grafana/e2e-selectors';\nimport { useDataSourceInstanceList, useDataSourceInstanceListItem } from '@grafana/plugin-compat/datasources';\nimport { isUnsignedPluginSignature, PluginSignatureBadge } from '../Plugins/PluginSignatureBadge';\n\nexport interface Props {\n  // Mirrors `DataSourceInstanceListItem` instead of importing it: `@grafana/data` only exports it from 13.3,\n  // so with our `^13.0.0` peer range consumers on 13.0–13.2 would get `any`. Callbacks typed with the real\n  // `DataSourceInstanceListItem` (13.3+) still fit because the shapes are identical.\n  /**\n   * Receives the selected data source's list item (`uid`, `type`, `name`, `meta`). Call\n   * `getDataSourceInstanceSettings(ds.uid)` from `@grafana/plugin-compat` if you need the full settings.\n   */\n  onChange: (ds: Pick<DataSourceInstanceSettings, 'uid' | 'type' | 'name' | 'meta'>) => void;\n  /**\n   * Reference to the selected data source, resolved the way Grafana does: uid, name, template variable or\n   * built-in. `null`/`undefined` resolves to the default data source.\n   */\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\ntype DataSourceListItem = Parameters<Props['onChange']>[0];\n\nexport function DataSourcePicker({\n  onChange,\n  current: currentProp,\n  hideTextValue,\n  onBlur,\n  autoFocus = false,\n  openMenuOnFocus = false,\n  placeholder = 'Select datasource',\n  noDefault,\n}: Props) {\n  const current = currentProp ?? null;\n  const showNoDatasources = !current && !!noDefault;\n  const { items, isLoading: isListLoading, error: listError } = useDataSourceInstanceList();\n  const currentResult = useDataSourceInstanceListItem(current);\n  const selected: DataSourceListItem | undefined = currentResult.item;\n  const isCurrentLoading = !showNoDatasources && currentResult.isLoading;\n  const isLoading = isListLoading || isCurrentLoading;\n  const notFound = !selected && !isCurrentLoading && !showNoDatasources;\n\n  const handleChange = (option: SelectableValue<string>) => {\n    const item = items.find((ds) => ds.uid === option.value);\n    if (item) {\n      onChange(item);\n    }\n  };\n\n  const options: Array<SelectableValue<string>> = items.map((ds) => ({\n    value: ds.uid,\n    label: ds.name,\n    imgUrl: ds.meta.info.logos.small,\n    meta: ds.meta,\n  }));\n\n  const value = getCurrentValue({ current, selected, notFound, showNoDatasources, hideTextValue });\n  const invalid = !!listError || notFound;\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={handleChange}\n        options={options}\n        isLoading={isLoading}\n        autoFocus={autoFocus}\n        onBlur={onBlur}\n        openMenuOnFocus={openMenuOnFocus}\n        maxMenuHeight={500}\n        placeholder={placeholder}\n        noOptionsMessage={listError ? 'Could not load data sources' : 'No datasources found'}\n        value={value}\n        invalid={invalid}\n        aria-invalid={invalid}\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\nfunction getCurrentValue({\n  current,\n  selected,\n  notFound,\n  showNoDatasources,\n  hideTextValue,\n}: {\n  current: string | null;\n  selected?: DataSourceListItem;\n  notFound: boolean;\n  showNoDatasources: boolean;\n  hideTextValue?: boolean;\n}): SelectableValue<string> | undefined {\n  if (showNoDatasources) {\n    return {\n      label: 'No datasources found',\n    };\n  }\n\n  if (selected) {\n    return toOption(selected, hideTextValue);\n  }\n\n  if (!notFound) {\n    return undefined;\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\nfunction toOption(ds: DataSourceListItem, hideTextValue?: boolean): SelectableValue<string> {\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"],"names":["toOption"],"mappings":"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"}

package/dist/esm/index.d.ts

@@ -1,9 +1,9 @@
-import React, { ComponentProps, PureComponent, ReactElement, ReactNode, Component, ErrorInfo, FunctionComponent, HTMLProps } from 'react';
+import React, { ComponentProps, ReactElement, ReactNode, Component, ErrorInfo, PureComponent, FunctionComponent, HTMLProps } from 'react';
 import { Input, Segment as Segment$1, monacoTypes, Monaco, ButtonProps, Field, PopoverContent, Switch, SelectCommonProps, InlineLabel } from '@grafana/ui';
-import { DataSourceInstanceSettings, SelectableValue, DataSourceJsonData, VariableSuggestion, TimeRange, DataFrame, MetricFindValue, ThemeSpacingTokens, ScopedVars, VariableModel, DataFrameView, QueryEditorProps as QueryEditorProps$1, DataSourceSettings, RegistryItem, DataSourceApi, Registry, DataQuery as DataQuery$1, PanelData, DataQueryRequest, DataQueryResponse, LoadingState } from '@grafana/data';
-import { DataSourceSrv, DataSourceWithBackend, TemplateSrv } from '@grafana/runtime';
+import { DataSourceInstanceSettings, DataSourceJsonData, VariableSuggestion, SelectableValue, TimeRange, DataFrame, MetricFindValue, ThemeSpacingTokens, ScopedVars, VariableModel, DataFrameView, QueryEditorProps as QueryEditorProps$1, DataSourceSettings, RegistryItem, DataSourceApi, Registry, DataQuery as DataQuery$1, PanelData, DataQueryRequest, DataQueryResponse, LoadingState } from '@grafana/data';
 import { JsonTree } from '@react-awesome-query-builder/ui';
 import { DataQuery } from '@grafana/schema';
+import { DataSourceWithBackend, TemplateSrv } from '@grafana/runtime';
 import { SqlLanguage } from 'sql-formatter';
 import { Grammar } from 'prismjs';
 import { Observable } from 'rxjs';
@@ -46,8 +46,16 @@ interface DatePickerWithInputProps extends Omit<ComponentProps<typeof Input>, 'r
 declare const DatePickerWithInput: (props: DatePickerWithInputProps) => React.JSX.Element;
 
 interface Props$s {
-    onChange: (ds: DataSourceInstanceSettings) => void;
-    current: string | null;
+    /**
+     * Receives the selected data source's list item (`uid`, `type`, `name`, `meta`). Call
+     * `getDataSourceInstanceSettings(ds.uid)` from `@grafana/plugin-compat` if you need the full settings.
+     */
+    onChange: (ds: Pick<DataSourceInstanceSettings, 'uid' | 'type' | 'name' | 'meta'>) => void;
+    /**
+     * Reference to the selected data source, resolved the way Grafana does: uid, name, template variable or
+     * built-in. `null`/`undefined` resolves to the default data source.
+     */
+    current?: string | null;
     hideTextValue?: boolean;
     onBlur?: () => void;
     autoFocus?: boolean;
@@ -62,20 +70,7 @@ interface Props$s {
     pluginId?: string;
     noDefault?: boolean;
 }
-interface State$1 {
-    error?: string;
-}
-declare class DataSourcePicker extends PureComponent<Props$s, State$1> {
-    dataSourceSrv: DataSourceSrv;
-    static defaultProps: Partial<Props$s>;
-    state: State$1;
-    constructor(props: Props$s);
-    componentDidMount(): void;
-    onChange: (item: SelectableValue<string>) => void;
-    private getCurrentValue;
-    getDataSourceOptions(): Array<SelectableValue<string>>;
-    render(): React.JSX.Element;
-}
+declare function DataSourcePicker({ onChange, current: currentProp, hideTextValue, onBlur, autoFocus, openMenuOnFocus, placeholder, noDefault, }: Props$s): React.JSX.Element;
 
 type DataLinkConfig = {
     field: string;
@@ -1522,8 +1517,6 @@ declare function useHealthChecks(): {
     retry: (uid: string) => void;
 };
 
-declare function resolvePluginName(pluginType: string): string;
-
 type UseDatasourceSchemaResult = {
     schema: DatasourceConfigSchema | null;
     loading: boolean;
@@ -2019,5 +2012,5 @@ interface RequestLoopOptions<TQuery extends DataQuery$1 = DataQuery$1> {
  */
 declare function getRequestLooper<T extends DataQuery$1 = DataQuery$1>(req: DataQueryRequest<T>, options: RequestLoopOptions<T>): Observable<DataQueryResponse>;
 
-export { AUTH_GROUP_IDS, AccessoryButton, AdvancedHttpSettings, Auth, AuthMethod, BINARY_OPERATIONS_KEY, CatalogSelector, CompletionItemInsertTextRule, CompletionItemKind, CompletionItemPriority, ConfigDescriptionLink, ConfigSection, ConfigSubSection, ConnectionSettings, CustomHeadersSettings, DataLink, DataLinks, DataSourceDescription, DataSourcePicker, DatasetSelector, DatasourceConfigWizard, DatasourceErrorBoundary, DatasourceWithAsyncBackend, DatePicker, DatePickerWithInput, DebounceInput, EditorField, EditorFieldGroup, EditorHeader, EditorList, EditorMode, EditorRow, EditorRows, EditorStack, EditorSwitch, FlexItem, GroupByRow, InlineSelect, InputGroup, LabelFilters, LinkedToken, MacroType, OperationExplainedBox, OperationList, OperationListExplained, OperationsEditorRow, OperatorType, QUERY_FORMAT_OPTIONS, QueryBuilderHints, QueryEditorMode, QueryEditorModeToggle, QueryEditorRow, QueryFormat, QueryHeaderSwitch, QueryModellerBase, QueryOptionGroup, ROOT_CONFIG_FIELDS, RawQuery, RunQueryButton, RunQueryButtons, SQLEditor, SQLEditorMode, SQLEditorTestUtils, SecureSocksProxyToggle, Segment, Space, SqlDatasource, SqlQueryEditor, StatementPosition, SuggestionKind, TLSSettings, TableSelector, TokenType, buildCelContext, buildCloneDatasourcePayload, buildCreateDatasourcePayload, buildUpdateDatasourcePayload, clearExpressionCache, computeVirtualFieldValues, convertLegacyAuthProps, datasourceToProvisioningYaml, evaluateCelDirect, evaluateCelExpression, evaluateComputedRead, evaluateDependsOn, extractFieldRefs, fetchConfigSchema, formKey, formatDate, formatYamlDiff, generateLLMHint, generateProvisioningTemplate, generateTroubleshootingFields, getConfigSchema, getRequestLooper, getStandardSQLCompletionProvider, getWatchedValue, language as grafanaStandardSQLLanguage, conf as grafanaStandardSQLLanguageConf, isAuthGroupId, isValidCelExpression, parseDependsOn, resolveActiveOverride, resolveGroups, resolvePluginName, resolveRequiredFieldsGroup, toOption, useDatasourceSchema, useHealthChecks };
-export type { Aggregate, AllowedValuesValidationRule, Props$c as AuthProps, BaseFieldRef, BaseValidationRule, ColumnDefinition, ComputedMapping, ConfigField, ConfigGroup, CustomMeta, CustomValidationRule, DB, DataLinkConfig, DatasourceConfigSchema, DatasourceConfigWizardProps, DatasourceHealth, DatePickerProps, DatePickerWithInputProps, DebounceInputProps, DirectMapping, Expression, FieldEffect, FieldItemSchema, FieldKind, FieldOption, FieldOverride, FieldPack, FieldPackID, FieldPatch, FieldRelationship, FieldUI, FieldValidationRule, FormState, HealthState, IndexedPairMapping, Instruction, ItemCountValidationRule, LanguageCompletionProvider, LanguageDefinition, LengthValidationRule, MappingField, MetaDefinition, NameValue, PatternValidationRule, PositionContext, Props$s as Props, QueryBuilderLabelFilter, QueryBuilderOperation, QueryBuilderOperationDefinition, QueryBuilderOperationParamDef, QueryBuilderOperationParamEditorProps, QueryBuilderOperationParamValue, QueryEditorProps, QueryRowFilter, QueryStats, QueryWithDefaults, RAQBFieldTypes, RangeValidationRule, RelationshipType, RequestLoopOptions, ResolvedGroup, ResourceSelectorProps, ResponseParser, Role, RunQueryButtonsProps, RunningQueryInfo, SQLConnectionLimits, SQLExpression, SQLFilters, SQLMonarchLanguage, SQLOptions, SQLQuery, SQLSelectableValue, SchemaDefinition, SecureFieldState, SegmentProps, SqlQueryForInterpolation, SqlQueryModel, State$1 as State, StatementPlacementProvider, StorageMapping, SuggestionKindProvider, Props$f as TLSSettingsProps, TableDefinition, TableFieldSchema, TableIdentifier, TableSchema, TargetLocation, TestQueryModel, UIComponent, UIWidth, ValidationResults, ValueType, VisualQuery, VisualQueryBinary, VisualQueryModeller };
+export { AUTH_GROUP_IDS, AccessoryButton, AdvancedHttpSettings, Auth, AuthMethod, BINARY_OPERATIONS_KEY, CatalogSelector, CompletionItemInsertTextRule, CompletionItemKind, CompletionItemPriority, ConfigDescriptionLink, ConfigSection, ConfigSubSection, ConnectionSettings, CustomHeadersSettings, DataLink, DataLinks, DataSourceDescription, DataSourcePicker, DatasetSelector, DatasourceConfigWizard, DatasourceErrorBoundary, DatasourceWithAsyncBackend, DatePicker, DatePickerWithInput, DebounceInput, EditorField, EditorFieldGroup, EditorHeader, EditorList, EditorMode, EditorRow, EditorRows, EditorStack, EditorSwitch, FlexItem, GroupByRow, InlineSelect, InputGroup, LabelFilters, LinkedToken, MacroType, OperationExplainedBox, OperationList, OperationListExplained, OperationsEditorRow, OperatorType, QUERY_FORMAT_OPTIONS, QueryBuilderHints, QueryEditorMode, QueryEditorModeToggle, QueryEditorRow, QueryFormat, QueryHeaderSwitch, QueryModellerBase, QueryOptionGroup, ROOT_CONFIG_FIELDS, RawQuery, RunQueryButton, RunQueryButtons, SQLEditor, SQLEditorMode, SQLEditorTestUtils, SecureSocksProxyToggle, Segment, Space, SqlDatasource, SqlQueryEditor, StatementPosition, SuggestionKind, TLSSettings, TableSelector, TokenType, buildCelContext, buildCloneDatasourcePayload, buildCreateDatasourcePayload, buildUpdateDatasourcePayload, clearExpressionCache, computeVirtualFieldValues, convertLegacyAuthProps, datasourceToProvisioningYaml, evaluateCelDirect, evaluateCelExpression, evaluateComputedRead, evaluateDependsOn, extractFieldRefs, fetchConfigSchema, formKey, formatDate, formatYamlDiff, generateLLMHint, generateProvisioningTemplate, generateTroubleshootingFields, getConfigSchema, getRequestLooper, getStandardSQLCompletionProvider, getWatchedValue, language as grafanaStandardSQLLanguage, conf as grafanaStandardSQLLanguageConf, isAuthGroupId, isValidCelExpression, parseDependsOn, resolveActiveOverride, resolveGroups, resolveRequiredFieldsGroup, toOption, useDatasourceSchema, useHealthChecks };
+export type { Aggregate, AllowedValuesValidationRule, Props$c as AuthProps, BaseFieldRef, BaseValidationRule, ColumnDefinition, ComputedMapping, ConfigField, ConfigGroup, CustomMeta, CustomValidationRule, DB, DataLinkConfig, DatasourceConfigSchema, DatasourceConfigWizardProps, DatasourceHealth, DatePickerProps, DatePickerWithInputProps, DebounceInputProps, DirectMapping, Expression, FieldEffect, FieldItemSchema, FieldKind, FieldOption, FieldOverride, FieldPack, FieldPackID, FieldPatch, FieldRelationship, FieldUI, FieldValidationRule, FormState, HealthState, IndexedPairMapping, Instruction, ItemCountValidationRule, LanguageCompletionProvider, LanguageDefinition, LengthValidationRule, MappingField, MetaDefinition, NameValue, PatternValidationRule, PositionContext, Props$s as Props, QueryBuilderLabelFilter, QueryBuilderOperation, QueryBuilderOperationDefinition, QueryBuilderOperationParamDef, QueryBuilderOperationParamEditorProps, QueryBuilderOperationParamValue, QueryEditorProps, QueryRowFilter, QueryStats, QueryWithDefaults, RAQBFieldTypes, RangeValidationRule, RelationshipType, RequestLoopOptions, ResolvedGroup, ResourceSelectorProps, ResponseParser, Role, RunQueryButtonsProps, RunningQueryInfo, SQLConnectionLimits, SQLExpression, SQLFilters, SQLMonarchLanguage, SQLOptions, SQLQuery, SQLSelectableValue, SchemaDefinition, SecureFieldState, SegmentProps, SqlQueryForInterpolation, SqlQueryModel, StatementPlacementProvider, StorageMapping, SuggestionKindProvider, Props$f as TLSSettingsProps, TableDefinition, TableFieldSchema, TableIdentifier, TableSchema, TargetLocation, TestQueryModel, UIComponent, UIWidth, ValidationResults, ValueType, VisualQuery, VisualQueryBinary, VisualQueryModeller };

package/dist/esm/index.js

@@ -40,7 +40,6 @@ export { AdvancedHttpSettings } from './components/ConfigEditor/AdvancedSettings
 export { DatasourceConfigWizard } from './components/ConfigEditor/DatasourceConfigWizard/DatasourceConfigWizard.js';
 export { DatasourceErrorBoundary } from './components/ConfigEditor/DatasourceConfigWizard/DatasourceErrorBoundary.js';
 export { useHealthChecks } from './components/ConfigEditor/DatasourceConfigWizard/hooks/useHealthChecks.js';
-export { resolvePluginName } from './components/ConfigEditor/DatasourceConfigWizard/resolvePluginName.js';
 export { fetchConfigSchema, useDatasourceSchema } from './components/ConfigEditor/DatasourceConfigWizard/hooks/useDatasourceSchema.js';
 export { buildCelContext, clearExpressionCache, evaluateCelDirect, evaluateCelExpression, extractFieldRefs, isValidCelExpression } from './components/ConfigEditor/DatasourceConfigWizard/cel.js';
 export { AUTH_GROUP_IDS, computeVirtualFieldValues, evaluateComputedRead, evaluateDependsOn, formKey, getWatchedValue, isAuthGroupId, parseDependsOn, resolveActiveOverride, resolveGroups, resolveRequiredFieldsGroup } from './components/ConfigEditor/DatasourceConfigWizard/config.js';

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@grafana/plugin-ui",
-  "version": "0.17.10",
+  "version": "0.18.0",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@github.com/grafana/plugin-ui.git"
@@ -74,6 +74,7 @@
   },
   "dependencies": {
     "@emotion/css": "11.13.5",
+    "@grafana/plugin-compat": "0.11.0",
     "@hello-pangea/dnd": "17.0.0",
     "@marcbachmann/cel-js": "7.6.1",
     "@react-awesome-query-builder/ui": "6.6.15",
@@ -136,7 +137,7 @@
     "fast-glob": "3.3.3",
     "jest": "29.7.0",
     "jest-environment-jsdom": "29.7.0",
-    "jest-fetch-mock": "3.2.0",
+    "jest-fetch-mock": "4.2.0",
     "lefthook": "2.1.10",
     "mockdate": "3.0.5",
     "monaco-editor": "0.34.1",

package/dist/esm/components/ConfigEditor/DatasourceConfigWizard/resolvePluginName.js

@@ -1,30 +0,0 @@
-import { getDataSourceSrv } from '@grafana/runtime';
-
-let pluginNameCache = null;
-function buildPluginNameCache() {
-  var _a;
-  if (pluginNameCache) {
-    return pluginNameCache;
-  }
-  const map = /* @__PURE__ */ new Map();
-  try {
-    const list = getDataSourceSrv().getList();
-    for (const ds of list) {
-      if (((_a = ds.meta) == null ? void 0 : _a.name) && ds.type && !map.has(ds.type)) {
-        map.set(ds.type, ds.meta.name);
-      }
-    }
-  } catch (ex) {
-    console.error(ex);
-  }
-  pluginNameCache = map;
-  return map;
-}
-function resolvePluginName(pluginType) {
-  var _a;
-  const cache = buildPluginNameCache();
-  return (_a = cache.get(pluginType)) != null ? _a : pluginType;
-}
-
-export { resolvePluginName };
-//# sourceMappingURL=resolvePluginName.js.map

package/dist/esm/components/ConfigEditor/DatasourceConfigWizard/resolvePluginName.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"resolvePluginName.js","sources":["../../../../../src/components/ConfigEditor/DatasourceConfigWizard/resolvePluginName.ts"],"sourcesContent":["import { getDataSourceSrv } from '@grafana/runtime';\n\nlet pluginNameCache: Map<string, string> | null = null;\n\nfunction buildPluginNameCache(): Map<string, string> {\n  if (pluginNameCache) {\n    return pluginNameCache;\n  }\n  const map = new Map<string, string>();\n  try {\n    const list = getDataSourceSrv().getList();\n    for (const ds of list) {\n      if (ds.meta?.name && ds.type && !map.has(ds.type)) {\n        map.set(ds.type, ds.meta.name);\n      }\n    }\n  } catch (ex) {\n    console.error(ex);\n  }\n  pluginNameCache = map;\n  return map;\n}\n\nexport function resolvePluginName(pluginType: string): string {\n  const cache = buildPluginNameCache();\n  return cache.get(pluginType) ?? pluginType;\n}\n"],"names":[],"mappings":";;AAEA,IAAI,eAAA,GAA8C,IAAA;AAElD,SAAS,oBAAA,GAA4C;AAJrD,EAAA,IAAA,EAAA;AAKE,EAAA,IAAI,eAAA,EAAiB;AACnB,IAAA,OAAO,eAAA;AAAA,EACT;AACA,EAAA,MAAM,GAAA,uBAAU,GAAA,EAAoB;AACpC,EAAA,IAAI;AACF,IAAA,MAAM,IAAA,GAAO,gBAAA,EAAiB,CAAE,OAAA,EAAQ;AACxC,IAAA,KAAA,MAAW,MAAM,IAAA,EAAM;AACrB,MAAA,IAAA,CAAA,CAAI,EAAA,GAAA,EAAA,CAAG,IAAA,KAAH,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAS,IAAA,KAAQ,EAAA,CAAG,IAAA,IAAQ,CAAC,GAAA,CAAI,GAAA,CAAI,EAAA,CAAG,IAAI,CAAA,EAAG;AACjD,QAAA,GAAA,CAAI,GAAA,CAAI,EAAA,CAAG,IAAA,EAAM,EAAA,CAAG,KAAK,IAAI,CAAA;AAAA,MAC/B;AAAA,IACF;AAAA,EACF,SAAS,EAAA,EAAI;AACX,IAAA,OAAA,CAAQ,MAAM,EAAE,CAAA;AAAA,EAClB;AACA,EAAA,eAAA,GAAkB,GAAA;AAClB,EAAA,OAAO,GAAA;AACT;AAEO,SAAS,kBAAkB,UAAA,EAA4B;AAvB9D,EAAA,IAAA,EAAA;AAwBE,EAAA,MAAM,QAAQ,oBAAA,EAAqB;AACnC,EAAA,OAAA,CAAO,EAAA,GAAA,KAAA,CAAM,GAAA,CAAI,UAAU,CAAA,KAApB,IAAA,GAAA,EAAA,GAAyB,UAAA;AAClC;;;;"}