@grafana/ui/dist/cjs/components/MatchersUI/FieldNamesMatcherEditor.cjs

Grafana Components Library

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var jsxRuntime = require('react/jsx-runtime');
var React = require('react');
var data = require('@grafana/data');
var i18n = require('@grafana/i18n');
var Input = require('../Input/Input.cjs');
var Select = require('../Select/Select.cjs');
var utils = require('./utils.cjs');

"use strict";
const FieldNamesMatcherEditor = React.memo((props) => {
  var _a;
  const { id, data, options, onChange: onChangeFromProps, scope } = props;
  const { readOnly, prefix } = options;
  const names = utils.useFieldDisplayNames(data, void 0, scope);
  const selectOptions = utils.useMatcherSelectOptions(names, void 0, { scope });
  const onChange = React.useCallback(
    (selections) => {
      if (!Array.isArray(selections)) {
        return;
      }
      return onChangeFromProps({
        ...options,
        names: selections.reduce((all, current) => {
          if (!utils.frameHasName(current.value, names)) {
            return all;
          }
          all.push(current.value);
          return all;
        }, [])
      });
    },
    [names, onChangeFromProps, options]
  );
  if (readOnly) {
    const displayNames = ((_a = options.names) != null ? _a : []).join(", ");
    return /* @__PURE__ */ jsxRuntime.jsx(Input.Input, { id, value: displayNames, readOnly: true, disabled: true, prefix });
  }
  return /* @__PURE__ */ jsxRuntime.jsx(Select.MultiSelect, { inputId: id, value: options.names, options: selectOptions, onChange });
});
FieldNamesMatcherEditor.displayName = "FieldNameMatcherEditor";
const getFieldNamesMatcherItem = () => ({
  id: data.FieldMatcherID.byNames,
  component: FieldNamesMatcherEditor,
  matcher: data.fieldMatchers.get(data.FieldMatcherID.byNames),
  name: i18n.t("grafana-ui.matchers-ui.name-fields-with-name", "Fields with name"),
  description: i18n.t("grafana-ui.matchers-ui.description-fields-with-name", "Set properties for a specific field"),
  optionsToLabel: (options) => {
    var _a;
    return ((_a = options.names) != null ? _a : []).join(", ");
  },
  excludeFromPicker: true
});

exports.FieldNamesMatcherEditor = FieldNamesMatcherEditor;
exports.getFieldNamesMatcherItem = getFieldNamesMatcherItem;
//# sourceMappingURL=FieldNamesMatcherEditor.cjs.map