import { Component, useField, SugaredField } from "@contember/binding";
import { FieldFallbackView } from "./FieldFallbackView.js";
import { jsxDEV, Fragment } from "react/jsx-dev-runtime";
var _jsxFileName = "/__w/interface/interface/packages/admin/src/components/bindingFacade/fieldViews/ImageFieldView.tsx";
const ImageFieldView = Component(({
  srcField,
  altField,
  titleField,
  formatUrl,
  fallback,
  fallbackStyle,
  ...imgProps
}) => {
  const srcAccessor = useField(srcField);
  const altAccessor = useField(altField);
  const titleAccessor = useField(titleField);
  if (srcAccessor.value === null) {
    return /* @__PURE__ */ jsxDEV(FieldFallbackView, {
      fallback,
      fallbackStyle
    }, void 0, false, {
      fileName: _jsxFileName,
      lineNumber: 29,
      columnNumber: 11
    }, void 0);
  }
  return /* @__PURE__ */ jsxDEV("img", {
    src: formatUrl ? formatUrl(srcAccessor.value) : srcAccessor.value,
    alt: altAccessor?.value || void 0,
    title: titleAccessor?.value || void 0,
    ...imgProps
  }, void 0, false, {
    fileName: _jsxFileName,
    lineNumber: 33,
    columnNumber: 4
  }, void 0);
}, ({
  altField,
  srcField,
  titleField,
  fallback,
  fallbackStyle
}) => /* @__PURE__ */ jsxDEV(Fragment, {
  children: [/* @__PURE__ */ jsxDEV(SugaredField, {
    field: srcField
  }, void 0, false, {
    fileName: _jsxFileName,
    lineNumber: 43,
    columnNumber: 4
  }, void 0), altField && /* @__PURE__ */ jsxDEV(SugaredField, {
    field: altField
  }, void 0, false, {
    fileName: _jsxFileName,
    lineNumber: 44,
    columnNumber: 17
  }, void 0), titleField && /* @__PURE__ */ jsxDEV(SugaredField, {
    field: titleField
  }, void 0, false, {
    fileName: _jsxFileName,
    lineNumber: 45,
    columnNumber: 19
  }, void 0), /* @__PURE__ */ jsxDEV(FieldFallbackView, {
    fallback,
    fallbackStyle
  }, void 0, false, {
    fileName: _jsxFileName,
    lineNumber: 46,
    columnNumber: 4
  }, void 0)]
}, void 0, true), "ImageFieldView");
export {
  ImageFieldView
};
//# sourceMappingURL=ImageFieldView.js.map
