@grafana/ui/dist/cjs/components/MatchersUI/FieldsByFrameRefIdMatcher.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 Select = require('../Select/Select.cjs');

"use strict";
const recoverRefIdMissing = (newRefIds, oldRefIds, previousValue) => {
  if (!previousValue) {
    return;
  }
  let changedTo = newRefIds.find((refId) => {
    return !oldRefIds.some((refId2) => {
      return refId === refId2;
    });
  });
  if (changedTo) {
    return changedTo;
  }
  return;
};
function RefIDPicker({ value, data, onChange, placeholder, id }) {
  const listOfRefIds = React.useMemo(() => getListOfQueryRefIds(data), [data]);
  const [priorSelectionState, updatePriorSelectionState] = React.useState({
    refIds: [],
    value: void 0
  });
  const currentValue = React.useMemo(() => {
    var _a;
    return (_a = listOfRefIds.find((refId) => refId.value === value)) != null ? _a : recoverRefIdMissing(listOfRefIds, priorSelectionState.refIds, priorSelectionState.value);
  }, [value, listOfRefIds, priorSelectionState]);
  const onFilterChange = React.useCallback(
    (v) => {
      onChange(v == null ? void 0 : v.value);
    },
    [onChange]
  );
  if (listOfRefIds !== priorSelectionState.refIds || (currentValue == null ? void 0 : currentValue.value) !== priorSelectionState.value) {
    updatePriorSelectionState({
      refIds: listOfRefIds,
      value: currentValue == null ? void 0 : currentValue.value
    });
  }
  return /* @__PURE__ */ jsxRuntime.jsx(
    Select.Select,
    {
      inputId: id,
      options: listOfRefIds,
      onChange: onFilterChange,
      isClearable: true,
      placeholder: placeholder != null ? placeholder : "Select query refId",
      value: currentValue
    }
  );
}
const recoverMultiRefIdMissing = (newRefIds, oldRefIds, previousValue) => {
  if (!previousValue || !previousValue.length) {
    return;
  }
  const changedTo = newRefIds.filter((newRefId) => {
    return oldRefIds.some((oldRefId) => {
      return newRefId === oldRefId;
    });
  });
  if (changedTo.length) {
    return changedTo;
  }
  return;
};
function RefIDMultiPicker({ value, data: data$1, onChange, placeholder, id }) {
  var _a;
  const listOfRefIds = React.useMemo(() => getListOfQueryRefIds(data$1), [data$1]);
  const [priorSelectionState, updatePriorSelectionState] = React.useState({
    refIds: [],
    value: void 0
  });
  const currentValue = React.useMemo(() => {
    var _a2;
    let extractedRefIds = /* @__PURE__ */ new Set();
    if (value) {
      if (value.startsWith("/^")) {
        try {
          extractedRefIds = new Set(regexpToStrings(value));
        } catch (e) {
          extractedRefIds.add(value);
        }
      } else if (value.includes("|")) {
        extractedRefIds = new Set(value.split("|"));
      } else {
        extractedRefIds.add(value);
      }
    }
    const matchedRefIds = listOfRefIds.filter((refId) => extractedRefIds.has(refId.value || ""));
    if (matchedRefIds.length) {
      return matchedRefIds;
    }
    const newRefIds = [...extractedRefIds].map(data.toOption);
    const recoveredRefIDs = (_a2 = recoverMultiRefIdMissing(newRefIds, priorSelectionState.refIds, priorSelectionState.value)) != null ? _a2 : [];
    return recoveredRefIDs.length > 0 ? recoveredRefIDs : newRefIds.length > 0 ? newRefIds : void 0;
  }, [value, listOfRefIds, priorSelectionState]);
  const onFilterChange = React.useCallback(
    (v) => {
      onChange(v.map((v2) => v2.value));
    },
    [onChange]
  );
  if (listOfRefIds !== priorSelectionState.refIds || (currentValue == null ? void 0 : currentValue.length) !== ((_a = priorSelectionState.value) == null ? void 0 : _a.length)) {
    updatePriorSelectionState({
      refIds: listOfRefIds,
      value: currentValue
    });
  }
  return /* @__PURE__ */ jsxRuntime.jsx(
    Select.MultiSelect,
    {
      inputId: id,
      options: listOfRefIds,
      onChange: onFilterChange,
      isClearable: true,
      placeholder: placeholder != null ? placeholder : "Select query refId",
      value: currentValue
    }
  );
}
function getListOfQueryRefIds(data) {
  var _a, _b;
  const queries = /* @__PURE__ */ new Map();
  for (const frame of data) {
    const refId = (_a = frame.refId) != null ? _a : "";
    const frames = (_b = queries.get(refId)) != null ? _b : [];
    if (frames.length === 0) {
      queries.set(refId, frames);
    }
    frames.push(frame);
  }
  const values = [];
  for (const [refId, frames] of queries.entries()) {
    values.push({
      value: refId,
      label: refId ? i18n.t("grafana-ui.matchers-ui.get-list-of-query-ref-ids.label", "Query: {{refId}}", { refId }) : i18n.t("grafana-ui.matchers-ui.get-list-of-query-ref-ids.label-missing-ref-id", "Query: (missing refId)"),
      description: getFramesDescription(frames)
    });
  }
  return values;
}
function getFramesDescription(frames) {
  return i18n.t(
    "grafana-ui.matchers-ui.get-list-of-query-ref-ids.description",
    "Frames ({{framesCount}}): {{framesNames}}",
    {
      framesCount: frames.length,
      framesNames: `${frames.slice(0, Math.min(3, frames.length)).map((x) => data.getFrameDisplayName(x)).join(", ")} ${frames.length > 3 ? "..." : ""}`
    }
  );
}
const getFieldsByFrameRefIdItem = () => ({
  id: data.FieldMatcherID.byFrameRefID,
  component: (props) => {
    return /* @__PURE__ */ jsxRuntime.jsx(RefIDPicker, { id: props.id, value: props.options, data: props.data, onChange: props.onChange });
  },
  matcher: data.fieldMatchers.get(data.FieldMatcherID.byFrameRefID),
  name: i18n.t("grafana-ui.matchers-ui.name-fields-by-query", "Fields returned by query"),
  description: i18n.t(
    "grafana-ui.matchers-ui.description-fields-by-query",
    "Set properties for fields from a specific query"
  ),
  optionsToLabel: (options) => options
});
function escapeRegExp(string) {
  return string.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
}
const regexpToStrings = (regexp) => {
  return regexp.slice(5, -3).split(/(?<!\\)\|/g).map((string) => string.replace(/\\(.)/g, "$1"));
};
const stringsToRegexp = (strings) => {
  return `/^(?:${strings.map((string) => escapeRegExp(string)).join("|")})$/`;
};

exports.RefIDMultiPicker = RefIDMultiPicker;
exports.RefIDPicker = RefIDPicker;
exports.getFieldsByFrameRefIdItem = getFieldsByFrameRefIdItem;
exports.regexpToStrings = regexpToStrings;
exports.stringsToRegexp = stringsToRegexp;
//# sourceMappingURL=FieldsByFrameRefIdMatcher.cjs.map