@grafana/ui/dist/esm/components/MatchersUI/FieldNameMatcherEditor.mjs

Grafana Components Library

import { jsx } from 'react/jsx-runtime';
import { memo, useCallback } from 'react';
import { FieldMatcherID, fieldMatchers } from '@grafana/data';
import { t } from '@grafana/i18n';
import { Combobox } from '../Combobox/Combobox.mjs';
import { useFieldDisplayNames, useMatcherSelectOptions, frameHasName } from './utils.mjs';

"use strict";
const FieldNameMatcherEditor = memo((props) => {
  const { data, options, onChange: onChangeFromProps, id, scope = "series" } = props;
  const names = useFieldDisplayNames(data);
  const selectOptions = useMatcherSelectOptions(names, options, { scope });
  const onChange = useCallback(
    (selection) => {
      if (!frameHasName(selection.value, names)) {
        return;
      }
      const scope2 = names.scopes.get(selection.value);
      return onChangeFromProps(selection.value, scope2);
    },
    [names, onChangeFromProps]
  );
  const selectedOption = selectOptions.find((v) => v.value === options);
  return /* @__PURE__ */ jsx(
    Combobox,
    {
      value: selectedOption,
      options: selectOptions,
      onChange,
      placeholder: t("grafana-ui.select.placeholder", "Choose"),
      id
    }
  );
});
FieldNameMatcherEditor.displayName = "FieldNameMatcherEditor";
const getFieldNameMatcherItem = () => ({
  id: FieldMatcherID.byName,
  component: FieldNameMatcherEditor,
  matcher: fieldMatchers.get(FieldMatcherID.byName),
  name: t("grafana-ui.matchers-ui.name-fields-with-name", "Fields with name"),
  description: t("grafana-ui.matchers-ui.description-fields-with-name", "Set properties for a specific field"),
  optionsToLabel: (options) => options
});

export { FieldNameMatcherEditor, getFieldNameMatcherItem };
//# sourceMappingURL=FieldNameMatcherEditor.mjs.map