@lystech/sections 0.6.0 → 0.9.0

package/dist/morceaux/ApercuMobile-CSoo4dpM.js

@@ -0,0 +1,63 @@
+import { jsxs as a, jsx as i } from "react/jsx-runtime";
+import { useRef as p, useState as E, useEffect as s } from "react";
+import { F as m, E as u } from "./constantes-BAdpe1ss.js";
+const v = 390;
+function A({
+  brouillons: r,
+  surFermer: c
+}) {
+  const o = p(null), [f, d] = E(0), [l, g] = E(() => Math.min(844, window.innerHeight - 140)), y = (() => {
+    const e = new URL(window.location.href);
+    return e.hash = "", e.searchParams.set(m, "1"), e.toString();
+  })(), w = p(r);
+  return w.current = r, s(() => {
+    const e = (t) => {
+      const n = o.current?.contentWindow;
+      !n || t.source !== n || t.origin !== window.location.origin || t.data?.lystech === "apercu-pret" && n.postMessage({ lystech: "apercu", blocs: w.current }, window.location.origin);
+    };
+    return window.addEventListener("message", e), () => window.removeEventListener("message", e);
+  }, []), s(() => {
+    o.current?.contentWindow?.postMessage({ lystech: "apercu", blocs: r }, window.location.origin);
+  }, [r]), s(() => {
+    const e = (n) => {
+      const h = o.current?.contentWindow;
+      try {
+        h?.dispatchEvent(new h.CustomEvent(u, { detail: n.detail }));
+      } catch {
+        d((L) => L + 1);
+      }
+    }, t = () => g(Math.min(844, window.innerHeight - 140));
+    return window.addEventListener(u, e), window.addEventListener("resize", t), () => {
+      window.removeEventListener(u, e), window.removeEventListener("resize", t);
+    };
+  }, []), s(() => {
+    const e = (t) => {
+      t.key === "Escape" && c();
+    };
+    return window.addEventListener("keydown", e), () => window.removeEventListener("keydown", e);
+  }, [c]), /* @__PURE__ */ a("div", { className: "apercu", role: "dialog", "aria-label": "Aperçu sur téléphone", children: [
+    /* @__PURE__ */ a("div", { className: "apercu__barre", children: [
+      /* @__PURE__ */ a("span", { children: [
+        "Aperçu téléphone · ",
+        v,
+        " px — ce que voient vos visiteurs"
+      ] }),
+      /* @__PURE__ */ i("button", { type: "button", className: "bouton bouton--discret", onClick: () => d((e) => e + 1), children: "Recharger" }),
+      /* @__PURE__ */ i("button", { type: "button", className: "bouton bouton--principal", onClick: c, autoFocus: !0, children: "Retour au bureau" })
+    ] }),
+    /* @__PURE__ */ i("div", { className: "apercu__tel", style: { height: l + 24 }, children: /* @__PURE__ */ i(
+      "iframe",
+      {
+        ref: o,
+        name: m,
+        title: "La page, sur un téléphone",
+        src: y,
+        style: { width: v, height: l }
+      },
+      f
+    ) })
+  ] });
+}
+export {
+  A as default
+};

package/dist/morceaux/BoutonEditionCorps-B57eJtJn.js

@@ -0,0 +1,112 @@
+import { jsxs as m, Fragment as S, jsx as n } from "react/jsx-runtime";
+import { useState as d, useEffect as g } from "react";
+import { C as b } from "./constantes-BAdpe1ss.js";
+import { useSectionsContext as C } from "../index.js";
+const v = "lystech-peut-editer", I = `
+.lystech-crayon-edition {
+  position: fixed; z-index: 2147482000;
+  bottom: calc(16px + env(safe-area-inset-bottom, 0px));
+  width: 56px; height: 56px; border-radius: 50%; border: 0; padding: 0;
+  display: grid; place-items: center; cursor: pointer;
+  background: #16181d; color: #fff;
+  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35);
+  -webkit-tap-highlight-color: transparent;
+}
+.lystech-crayon-edition--gauche { left: calc(16px + env(safe-area-inset-left, 0px)); }
+.lystech-crayon-edition--droite { right: calc(16px + env(safe-area-inset-right, 0px)); }
+.lystech-crayon-edition:hover { background: #3ba58d; color: #06120e; }
+.lystech-crayon-edition:focus-visible { outline: 3px solid #3ba58d; outline-offset: 3px; }
+.lystech-crayon-edition[aria-busy="true"] { opacity: .7; cursor: progress; }
+.lystech-crayon-edition svg { width: 22px; height: 22px; }
+.lystech-crayon-edition__bulle {
+  position: fixed; z-index: 2147482000; max-width: min(280px, calc(100vw - 32px));
+  bottom: calc(80px + env(safe-area-inset-bottom, 0px));
+  padding: 8px 12px; border-radius: 10px; background: #16181d; color: #fff;
+  font: 500 13px/1.4 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+}
+@media print { .lystech-crayon-edition, .lystech-crayon-edition__bulle { display: none; } }
+`;
+function L({
+  connecte: a,
+  peutEditer: s,
+  coin: u = "gauche",
+  libelle: p = "Modifier le site"
+}) {
+  const e = C(), [w, r] = d(s ?? null), [h, f] = d(!1), [y, c] = d(null), l = !!e && a && !e.modeEdition && !e.modeApercu && !!e.site;
+  if (g(() => {
+    if (s !== void 0) {
+      r(s);
+      return;
+    }
+    if (!l || !e) return;
+    const o = v + ":" + e.site;
+    try {
+      const t = window.sessionStorage.getItem(o);
+      if (t === "1" || t === "0") {
+        r(t === "1");
+        return;
+      }
+    } catch {
+    }
+    let i = !0;
+    return e.appelSession("/site-sections/session-edition/acces/" + encodeURIComponent(e.site)).then((t) => t.ok ? t.json() : null).then((t) => {
+      if (!i || !t) return;
+      const x = t.peutEditer === !0;
+      if (r(x), t.connecte)
+        try {
+          window.sessionStorage.setItem(o, x ? "1" : "0");
+        } catch {
+        }
+    }).catch(() => {
+    }), () => {
+      i = !1;
+    };
+  }, [l, s, e?.site]), g(() => {
+    if (!(a || !e?.site))
+      try {
+        window.sessionStorage.removeItem(v + ":" + e.site);
+      } catch {
+      }
+  }, [a, e?.site]), !l || !w || !e) return null;
+  const k = async () => {
+    if (!h) {
+      f(!0), c(null);
+      try {
+        const o = await e.appelSession("/site-sections/session-edition/jeton/" + encodeURIComponent(e.site), { method: "POST" }), i = await o.json().catch(() => null);
+        if (!o.ok || !i?.token) {
+          c(i?.error ?? "Impossible d'ouvrir l'édition. Réessayez."), o.status === 403 && r(!1);
+          return;
+        }
+        e.entrerEnEdition(i.token);
+      } catch {
+        c("Pas de connexion au serveur. Vérifiez Internet et réessayez.");
+      } finally {
+        f(!1);
+      }
+    }
+  };
+  return /* @__PURE__ */ m(S, { children: [
+    /* @__PURE__ */ n("style", { children: I }),
+    /* @__PURE__ */ n(
+      "button",
+      {
+        type: "button",
+        className: `lystech-crayon-edition lystech-crayon-edition--${u} ${b}`,
+        onClick: () => {
+          k();
+        },
+        "aria-label": p,
+        title: p,
+        "aria-busy": h,
+        children: /* @__PURE__ */ m("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+          /* @__PURE__ */ n("path", { d: "M12 20h9" }),
+          /* @__PURE__ */ n("path", { d: "M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z" })
+        ] })
+      }
+    ),
+    y && /* @__PURE__ */ n("p", { role: "alert", className: `lystech-crayon-edition__bulle ${b}`, style: u === "gauche" ? { left: 16 } : { right: 16 }, children: y })
+  ] });
+}
+export {
+  L as default
+};