import { h as e } from "./chunk.BlbRoQQ3.js";
import { _ as t } from "./use-page-data.Cb2SuuwJ.js";
import "./chunk-LSPN22SI.D75E3zS-.js";
import { c as n } from "./twind.BiM9xcCd.js";
import { b as r } from "./jsx-runtime.DF4K5VCp.js";
import "./chroma-js.Dcir27CH.js";
import "./color-system.Dp99zR0T.js";
import "./react.BZZIbN3T.js";
import "./schema-resolver.p7B_pu36.js";
import { b as i } from "./use-brick-style.DDPl-_C1.js";
import "./use-brick-manifest.Iv9SG-7-.js";
import { b as a } from "./BrickRoot.DbISziyH.js";
var o = /* @__PURE__ */ e(r());
function s({ brick: e, editable: r }) {
	let { props: s } = e, c = i(e), { image: l,...u } = c, { src: d, alt: f } = s.image ?? {}, p = d?.includes("{{");
	return /* @__PURE__ */ (0, o.jsxs)(a, {
		brick: e,
		editable: r,
		manifest: t,
		as: "picture",
		className: n("group/image flex items-center justify-center", Object.values(u)),
		children: [
			!p && typeof d == "string" && d !== "" && /* @__PURE__ */ (0, o.jsx)("img", {
				src: d,
				alt: f,
				className: n("max-h-full w-full h-full rounded-[inherit] select-none pointer-events-none", l)
			}),
			r && !d && /* @__PURE__ */ (0, o.jsx)("div", {
				className: n("rounded-[inherit] transition-opacity duration-300 group-hover/image:opacity-100 flex w-full h-full p-10 items-center justify-center font-semibold"),
				children: /* @__PURE__ */ (0, o.jsx)("div", {
					className: "text-ellipsis text-nowrap flex-nowrap text-center",
					children: "No image set"
				})
			}),
			r && p && /* @__PURE__ */ (0, o.jsx)("div", {
				className: n("rounded-[inherit] transition-opacity duration-300 flex items-center  w-full h-full justify-center font-medium p-10"),
				children: /* @__PURE__ */ (0, o.jsx)("div", {
					className: "text-ellipsis text-nowrap flex-nowrap text-center",
					children: "Dynamic Image"
				})
			})
		]
	});
}
export { s as default };

//# sourceMappingURL=image.BCaIOcBr.js.map