import { computed as y, ref as d, watch as p, createElementBlock as c, openBlock as m, createCommentVNode as C, createElementVNode as o, createVNode as b, unref as n, normalizeClass as h, renderSlot as k, withCtx as g } from "vue";
import { UiLayer as $ } from "./components.js";
import { usePictureUpload as w } from "./composables-BAZQlC3e.js";
import { _export_sfc as N } from "./_plugin-vue_export-helper-DueaC3du.js";
const P = { class: "flex flex-wrap" }, S = ["id"], V = ["for"], z = { class: "button fixed text-2xl opacity-40 hover-opacity-100 m-4" }, B = { class: "button fixed text-2xl opacity-40 hover-opacity-100 mt-4 ml-18" }, E = ["src"], F = {
  __name: "FormPicture",
  props: {
    field: { type: String, default: "cover" },
    options: {
      type: Object,
      default: () => ({
        picSize: 800,
        preserveRatio: !0
      })
    }
  },
  emits: ["update"],
  setup(v, { emit: f }) {
    const i = v, x = f, r = y(() => `${i.field}_upload`), s = d(!1), l = d(), { state: _, handleChange: u } = w(i.options);
    return p(() => _.output, (e) => {
      e != null && e.content && (s.value = !0, l.value = e.content);
    }), p(l, (e) => {
      x("update", e);
    }), (e, t) => (m(), c("div", P, [
      l.value ? C("", !0) : (m(), c("input", {
        key: 0,
        class: "hidden",
        id: r.value,
        type: "file",
        accept: "image/*",
        onChange: t[0] || (t[0] = (...a) => n(u) && n(u)(...a))
      }, null, 40, S)),
      o("label", {
        class: h(["m-1 button cursor-pointer", { active: l.value }]),
        for: r.value,
        onClick: t[1] || (t[1] = (a) => s.value = !0)
      }, [
        k(e.$slots, "default", {}, () => [
          t[5] || (t[5] = o("div", { class: "i-la-image" }, null, -1))
        ], !0)
      ], 10, V),
      b(n($), {
        class: "max-h-60vh mt-20",
        open: s.value,
        onClose: t[4] || (t[4] = (a) => s.value = !1)
      }, {
        default: g(() => [
          o("button", z, [
            o("div", {
              class: "i-la-check",
              onClick: t[2] || (t[2] = (a) => s.value = !1)
            })
          ]),
          o("button", B, [
            o("div", {
              class: "i-la-trash-alt",
              onClick: t[3] || (t[3] = (a) => {
                l.value = "", s.value = !1;
              })
            })
          ]),
          o("img", { src: l.value }, null, 8, E)
        ]),
        _: 1
      }, 8, ["open"])
    ]));
  }
}, O = /* @__PURE__ */ N(F, [["__scopeId", "data-v-8b3f873f"]]);
export {
  O as default
};
//# sourceMappingURL=FormPicture-qR_P3rUR.js.map
