import { ref as i, onMounted as a, openBlock as r, createElementBlock as f, createElementVNode as e, toDisplayString as s, unref as o } from "vue";
import { useObjectUrl as d, prettyBytes as m } from "./composables-5f691338.js";
const u = { class: "p-2 border-1 gap-4 flex flex-col" }, _ = { class: "flex flex-wrap gap-4" }, p = { class: "font-bold" }, b = { class: "text-sm" }, h = { class: "font-mono" }, x = ["src"], B = {
  __name: "FileCard",
  props: {
    file: {
      type: Object,
      default: null
    }
  },
  setup(t) {
    const c = t, l = i();
    a(async () => {
      l.value = await c.file.blob();
    });
    const n = d(l);
    return (g, v) => (r(), f("div", u, [
      e("div", _, [
        e("div", p, s(t.file.name), 1),
        e("div", b, s(t.file.type), 1),
        e("div", h, s(o(m)(t.file.length)), 1)
      ]),
      e("img", {
        class: "w-full",
        src: o(n)
      }, null, 8, x)
    ]));
  }
};
export {
  B as default
};
//# sourceMappingURL=FileCard-83678d20.js.map
