import { useMemo, createElement, Fragment } from "react";
import { Component, useEntity, useEnvironment, QueryLanguage, Field } from "@contember/binding";
import { FieldFallbackView } from "./FieldFallbackView.js";
const CoalesceFieldView = Component((props) => {
  const entity = useEntity();
  const environment = useEnvironment();
  const desugaredFields = useMemo(() => props.fields.map((it) => QueryLanguage.desugarRelativeSingleField(it, environment)), [environment, ...props.fields]);
  let value = null;
  for (const field of desugaredFields) {
    value = entity.getRelativeSingleField(field).value;
    if (value !== null) {
      break;
    }
  }
  if (value === null) {
    return /* @__PURE__ */ createElement(FieldFallbackView, {
      fallback: props.fallback,
      fallbackStyle: props.fallbackStyle
    });
  }
  if (props.format) {
    return /* @__PURE__ */ createElement(Fragment, null, props.format(value));
  }
  return /* @__PURE__ */ createElement(Fragment, null, value);
}, (props) => {
  return /* @__PURE__ */ createElement(Fragment, null, props.fields.map((it, i) => /* @__PURE__ */ createElement(Field, {
    key: i,
    field: it
  })));
});
export { CoalesceFieldView };
//# sourceMappingURL=CoalesceFieldView.js.map
