import { computed as M, resolveComponent as c, openBlock as o, createElementBlock as n, createElementVNode as t, Fragment as J, renderList as K, unref as e, createBlock as m, normalizeStyle as N, toDisplayString as _, createCommentVNode as r, createVNode as V } from "vue";
import { useUser as O, useGun as Q, useMd as R, useColor as j, usePost as W, usePosts as X } from "./composables-5f691338.js";
const Y = { class: "rounded-lg max-w-65ch flex flex-col mx-auto items-stretch justify-center w-full overscroll-contain bg-light-200 dark-bg-dark-500" }, Z = { class: "flex flex-wrap" }, ee = /* @__PURE__ */ t("div", { class: "p-0" }, "#", -1), te = [
  ee
], se = { class: "ml-1 break-all font-bold" }, oe = /* @__PURE__ */ t("div", { class: "flex-1" }, null, -1), le = /* @__PURE__ */ t("div", { class: "i-la-angle-left" }, null, -1), ne = [
  le
], ie = /* @__PURE__ */ t("div", { class: "i-la-times" }, null, -1), re = [
  ie
], ae = {
  class: "flex-1 flex flex-col items-stretch",
  style: { flex: "10 1 300px" }
}, ce = {
  key: 0,
  class: "z-1 max-w-100vw"
}, de = ["src"], ue = { class: "flex flex-wrap items-start w-full justify-start" }, me = { class: "w-full flex flex-col items-stretch" }, he = { class: "p-2" }, _e = ["src"], fe = {
  key: 1,
  class: "text-2xl font-bold m-2"
}, pe = {
  key: 3,
  class: "m-2"
}, xe = /* @__PURE__ */ t("div", { class: "flex-auto" }, null, -1), ke = { class: "flex flex-wrap p-4 bg-dark-50 bg-opacity-25 dark-bg-dark-400 w-full items-center gap-1 text-sm" }, ve = {
  key: 0,
  class: "i-la-file-download"
}, ye = {
  key: 1,
  class: "i-la-redo-alt animate-spin"
}, be = ["innerHTML"], $e = {
  __name: "PostPage",
  props: {
    tag: { type: String, default: "" },
    hash: { type: String, default: "" }
  },
  emits: ["close", "browse", "user"],
  setup(d) {
    const u = d;
    O(), Q();
    const q = R();
    M(() => j("light").hex(u.hash));
    const f = M(() => j("deep").hex(u.hash)), { post: s, download: D, downloading: E } = W({ hash: u.hash }), { posts: ge, backlinks: H } = X(u.hash);
    return (a, l) => {
      var p, x, k, v, y, b, g, w, C, $, z, B, P, S;
      const T = c("post-line"), U = c("embed-youtube"), F = c("ui-link"), G = c("qr-share"), A = c("post-action-update"), I = c("post-list");
      return o(), n("div", Y, [
        t("div", Z, [
          (o(!0), n(J, null, K(e(H), (i, h) => (o(), m(T, {
            key: h,
            style: { flex: "1 1 220px" },
            hash: h,
            tag: d.tag,
            authors: i,
            back: !0,
            onUser: l[0] || (l[0] = (L) => a.$emit("user", L)),
            onClick: (L) => a.$emit("browse", h)
          }, null, 8, ["hash", "tag", "authors", "onClick"]))), 128))
        ]),
        t("div", {
          class: "z-30 flex flex-wrap items-center w-full px-4 py-2 sticky top-0 shadow-xl filter grayscale-70 hover-grayscale-0 transition duration-400ms",
          style: N({ backgroundColor: e(f) })
        }, [
          t("div", {
            class: "hover-underline text-md cursor-pointer font-bold flex",
            onClick: l[1] || (l[1] = (i) => a.$emit("close"))
          }, te),
          t("div", se, _((p = e(s)) == null ? void 0 : p.title), 1),
          oe,
          t("button", {
            class: "p-2",
            onClick: l[2] || (l[2] = (i) => a.$router.back())
          }, ne),
          t("button", {
            class: "p-2",
            onClick: l[3] || (l[3] = (i) => a.$emit("close"))
          }, re)
        ], 4),
        t("div", ae, [
          (x = e(s)) != null && x.cover || (k = e(s)) != null && k.youtube || (v = e(s)) != null && v.text ? (o(), n("div", ce, [
            t("img", {
              class: "sticky top-0",
              src: e(s).cover
            }, null, 8, de),
            (y = e(s)) != null && y.youtube ? (o(), m(U, {
              key: 0,
              class: "mb-6 shadow-xl flex-1",
              video: (b = e(s)) == null ? void 0 : b.youtube
            }, null, 8, ["video"])) : r("", !0)
          ])) : r("", !0),
          t("div", ue, [
            t("div", me, [
              t("div", he, [
                e(s).icon ? (o(), n("img", {
                  key: 0,
                  class: "w-20 h-20 rounded-full m-2",
                  style: N([{ flex: "0 1 40px" }, { borderColor: e(f) }]),
                  src: e(s).icon
                }, null, 12, _e)) : r("", !0),
                (g = e(s)) != null && g.title ? (o(), n("div", fe, _((w = e(s)) == null ? void 0 : w.title), 1)) : r("", !0),
                (C = e(s)) != null && C.link ? (o(), m(F, {
                  key: 2,
                  url: ($ = e(s)) == null ? void 0 : $.link
                }, null, 8, ["url"])) : r("", !0),
                (z = e(s)) != null && z.statement ? (o(), n("div", pe, _((B = e(s)) == null ? void 0 : B.statement), 1)) : r("", !0)
              ]),
              xe,
              t("div", ke, [
                V(G),
                V(A, { hash: d.hash }, null, 8, ["hash"]),
                t("button", {
                  class: "button flex items-center",
                  onClick: l[4] || (l[4] = (i) => e(D)())
                }, [
                  e(E) ? (o(), n("div", ye)) : (o(), n("div", ve))
                ])
              ])
            ])
          ]),
          (P = e(s)) != null && P.text ? (o(), n("div", {
            key: 1,
            class: "text-md markdown-body bg-light-200 rounded-2xl m-1 px-4 py-4 leading-relaxed max-w-55ch z-10 overflow-scroll max-h-50vh",
            innerHTML: e(q).render((S = e(s)) == null ? void 0 : S.text)
          }, null, 8, be)) : r("", !0),
          (o(), m(I, {
            key: d.tag,
            tag: d.hash,
            header: !1,
            onBrowse: l[5] || (l[5] = (i) => a.$emit("browse", i))
          }, null, 8, ["tag"]))
        ])
      ]);
    };
  }
};
export {
  $e as default
};
//# sourceMappingURL=PostPage-84f09cfb.js.map
