@lystech/sections 0.1.0 → 0.3.0

package/dist/index.d.ts

@@ -1,108 +1,18 @@
-import { JSX } from 'react';
-import { ReactNode } from 'react';
-
-export declare type BlocDeclare = {
-    blockType: string;
-    label: string;
-    description?: string;
-    fields: ChampDeclare[];
-    pages?: string[] | null;
-    maxPerPage?: number | null;
-};
-
-export declare type ChampDeclare = {
-    key: string;
-    label: string;
-    type: TypeDeChamp;
-    required?: boolean;
-    help?: string;
-    options?: string[];
-    /** Sous-champs d'une `list`. */
-    of?: ChampDeclare[];
-    /**
-     * Champ TRADUIT. La valeur stockée devient { fr: …, en: … } et le paquet
-     * rend celle de la langue courante.
-     *
-     * Le serveur ne connaît pas cette clé — il stocke la déclaration telle
-     * quelle. C'est voulu : ajouter une langue ne doit pas demander une
-     * migration côté plateforme.
-     */
-    localized?: boolean;
-};
-
-declare type Contexte = {
-    /** Sous-domaine de l'organisation dans Lystech. */
-    site: string;
-    /** Langue courante — décide quelle version d'un champ traduit est rendue. */
-    langue: string;
-    sections: SectionPubliee[];
-    etat: Etat;
-    recharger: () => void;
-};
-
-declare type Etat = "chargement" | "pret" | "erreur";
-
-export declare type ResultatSection<T> = {
-    /** Le contenu à afficher : publié si présent, défaut sinon. */
-    contenu: T;
-    /** Vrai quand le contenu vient du serveur, faux quand c'est le défaut. */
-    publie: boolean;
-    /** L'identifiant de la section — nécessaire à l'édition. */
-    UID: string | null;
-    chargement: boolean;
-};
-
-/** Une section telle qu'elle revient du serveur. */
-export declare type SectionPubliee = {
-    UID: string;
-    page: string;
-    blockType: string;
-    position: number;
-    data: Record<string, unknown> | null;
-};
-
-export declare function SectionsProvider({ site, page, langue, apiBaseUrl, children, }: {
-    /** Sous-domaine de l'organisation (ex. « armoise »). */
-    site: string;
-    /** La page dont on veut les sections (ex. « accueil »). */
-    page: string;
-    langue?: string;
-    apiBaseUrl?: string;
-    children: ReactNode;
-}): JSX.Element;
-
-export declare type TypeDeChamp = "text" | "richText" | "image" | "number" | "boolean" | "url" | "date" | "choice" | "list";
-
-/**
- * Le contenu d'un type de bloc sur la page courante.
- *
- * Le cas visé est celui d'un site DÉJÀ DESSINÉ : un bloc par type et par page,
- * dont on veut rendre les mots et les images modifiables — pas un constructeur
- * de pages. Pour des blocs répétables, voir `useSectionList`.
- */
-export declare function useSection<T extends object>(blockType: string, options: {
-    defaut: T;
-}): ResultatSection<T>;
-
-/** Plusieurs blocs du même type, dans l'ordre choisi par le client. */
-export declare function useSectionList<T extends object>(blockType: string, options?: {
-    defaut?: T[];
-}): {
-    items: Array<T & {
-        __uid: string;
-    }>;
-    publie: boolean;
-    chargement: boolean;
-};
-
-/**
- * Le contexte, ou `null` HORS d'un fournisseur.
- *
- * On ne lève pas : un composant branché sur les sections doit rester
- * utilisable dans une page qui n'en a pas (une maquette, un test, une page
- * d'erreur). Il affichera son repli, ce qui est exactement le bon
- * comportement.
- */
-export declare function useSectionsContext(): Contexte | null;
-
-export { }
+/**
+ * @lystech/sections — le contenu d'un site, modifiable par son propriétaire.
+ *
+ * CE QUI EST EXPORTÉ ICI EST CE QU'UN VISITEUR TÉLÉCHARGE : la lecture, et
+ * rien d'autre. L'interface d'édition vivra dans un point d'entrée séparé,
+ * chargé à la demande. Un visiteur ne doit pas payer le poids d'un éditeur
+ * qu'il ne verra jamais.
+ *
+ * Le paquet ne dépend PAS de @lystech/core : une clinique qui veut modifier
+ * trois textes n'a aucune raison de charger un magasin, un panier et PayPal.
+ */
+export { SectionsProvider, useSectionsContext } from './SectionsProvider';
+export { SignatureLystech } from './SignatureLystech';
+export { adaptateurI18next, appliquerAuxTextes } from './sourceTexte';
+export type { Dictionnaire, SourceTexte } from './sourceTexte';
+export { useSection, useSectionList } from './useSection';
+export type { BlocDeclare, ChampDeclare, SectionPubliee, TypeDeChamp, } from './types';
+export type { AncrageEdition, ResultatSection } from './useSection';

package/dist/index.js

@@ -1,107 +1,284 @@
-import { jsx as j } from "react/jsx-runtime";
-import { createContext as x, useState as l, useRef as C, useEffect as S, useMemo as m, useContext as E } from "react";
-const b = x(null), _ = "https://api.lystech.ca/api";
-function D({
-  site: e,
-  page: r,
-  langue: t = "fr",
-  apiBaseUrl: o = _,
-  children: n
+import { jsx as S, jsxs as L, Fragment as F } from "react/jsx-runtime";
+import { useState as h, useRef as P, useEffect as x, useCallback as O, useMemo as _, useContext as M, createContext as N } from "react";
+import { appliquerAuxTextes as T } from "./morceaux/sourceTexte-BMPMpNg9.js";
+import { adaptateurI18next as rt } from "./morceaux/sourceTexte-BMPMpNg9.js";
+const d = "lystech-edit", k = N(null), q = "https://api.lystech.ca/api";
+function H() {
+  if (typeof window > "u") return null;
+  const t = (n) => {
+    try {
+      window.sessionStorage.setItem(d, n);
+    } catch {
+    }
+    return n;
+  };
+  try {
+    const n = window.location.hash.replace(/^#/, "");
+    if (n.includes(d + "=")) {
+      const c = new URLSearchParams(n), o = c.get(d);
+      if (o) {
+        c.delete(d);
+        const i = c.toString();
+        return window.history.replaceState(
+          {},
+          "",
+          window.location.pathname + window.location.search + (i ? "#" + i : "")
+        ), t(o);
+      }
+    }
+    const e = new URL(window.location.href), r = e.searchParams.get(d);
+    return r ? (e.searchParams.delete(d), window.history.replaceState({}, "", e.toString()), t(r)) : window.sessionStorage.getItem(d);
+  } catch {
+    return null;
+  }
+}
+function X({
+  site: t,
+  page: n,
+  langue: e = "fr",
+  apiBaseUrl: r = q,
+  sectionsInitiales: c,
+  sourceTexte: o,
+  pagesPartagees: i,
+  children: m
 }) {
-  const [c, a] = l([]), [d, f] = l("chargement"), [A, g] = l(0), h = C(null);
-  S(() => {
-    if (!e || !r) return;
-    h.current?.abort();
-    const u = new AbortController();
-    return h.current = u, f("chargement"), fetch(
-      `${o}/site-sections/public/${encodeURIComponent(e)}/${encodeURIComponent(r)}`,
-      { signal: u.signal }
-    ).then((s) => s.ok ? s.json() : Promise.reject(new Error(String(s.status)))).then((s) => {
-      u.signal.aborted || (a(Array.isArray(s) ? s : []), f("pret"));
+  const [u, g] = h(
+    c ?? []
+  ), [w, p] = h(
+    c?.length ? "pret" : "chargement"
+  ), [y, A] = h(0), [R, J] = h({}), [U, $] = h(!1), D = P(null);
+  x(() => {
+    if (!t || !n) return;
+    D.current?.abort();
+    const a = new AbortController();
+    D.current = a, p("chargement");
+    const f = r + "/site-sections/public/" + encodeURIComponent(t) + "/" + encodeURIComponent([n, ...i ?? []].join(","));
+    return fetch(f, { signal: a.signal }).then(
+      (s) => s.ok ? s.json() : Promise.reject(new Error(String(s.status)))
+    ).then((s) => {
+      a.signal.aborted || (g(Array.isArray(s) ? s : []), p("pret"));
     }).catch((s) => {
-      u.signal.aborted || s?.name === "AbortError" || f("erreur");
-    }), () => u.abort();
-  }, [e, r, o, A]);
-  const p = m(
+      a.signal.aborted || s?.name === "AbortError" || p("erreur");
+    }), () => a.abort();
+  }, [t, n, r, y, (i ?? []).join(",")]);
+  const E = O(() => A((a) => a + 1), []);
+  x(() => {
+    !o || !u.length || T(u, o);
+  }, [u, o]);
+  const j = O(
+    (a, f) => J((s) => ({ ...s, [a]: f })),
+    []
+  ), l = P({
+    site: t,
+    page: n,
+    langue: e,
+    poserApercu: () => {
+    },
+    recharger: () => {
+    }
+  });
+  l.current.site = t, l.current.page = n, l.current.langue = e, l.current.poserApercu = j, l.current.sourceTexte = o, l.current.recharger = E, x(() => {
+    l.current.surChangementDePage?.(n);
+  }, [n]), x(() => {
+    const a = H();
+    if (!a) return;
+    let f = !0, s;
+    return import("@lystech/sections/editeur").then((b) => {
+      f && ($(!0), s = b.monterEditeur({
+        jeton: a,
+        site: t,
+        apiBaseUrl: r,
+        pont: l.current
+      }));
+    }).catch((b) => {
+      console.error("[lystech] éditeur indisponible:", b?.message ?? b);
+    }), () => {
+      f = !1, s?.();
+    };
+  }, [t, r]);
+  const z = _(
     () => ({
-      site: e,
-      langue: t,
-      sections: c,
-      etat: d,
-      recharger: () => g((u) => u + 1)
+      site: t,
+      page: n,
+      langue: e,
+      apiBaseUrl: r,
+      sections: u,
+      etat: w,
+      recharger: E,
+      apercu: R,
+      poserApercu: j,
+      modeEdition: U
     }),
-    [e, t, c, d]
+    [
+      t,
+      n,
+      e,
+      r,
+      u,
+      w,
+      E,
+      R,
+      j,
+      U
+    ]
   );
-  return /* @__PURE__ */ j(b.Provider, { value: p, children: n });
+  return /* @__PURE__ */ S(k.Provider, { value: z, children: m });
 }
-function y() {
-  return E(b);
+function I() {
+  return M(k);
 }
-function I(e) {
-  return !!e && typeof e == "object" && !Array.isArray(e) && Object.keys(e).every((r) => /^[a-z]{2}(-[A-Za-z]{2})?$/.test(r));
+const W = "https://api.lystech.ca/api", v = "lystech-edit";
+function Y({
+  site: t,
+  apiBaseUrl: n,
+  className: e,
+  mention: r = "Réalisé avec Lystech",
+  connexion: c = "Connexion"
+}) {
+  const o = I(), i = t ?? o?.site ?? "", m = n ?? o?.apiBaseUrl ?? W, [u, g] = h(!1);
+  if (!i) return null;
+  const w = async () => {
+    if (!u) {
+      g(!0);
+      try {
+        (await import("@lystech/sections/editeur")).monterConnexion({
+          site: i,
+          apiBaseUrl: m,
+          surJeton: (A) => {
+            try {
+              window.sessionStorage.setItem(v, A);
+            } catch {
+              window.location.hash = v + "=" + encodeURIComponent(A);
+            }
+            window.location.reload();
+          }
+        });
+      } catch (y) {
+        console.error("[lystech] connexion indisponible:", y?.message ?? y);
+      } finally {
+        g(!1);
+      }
+    }
+  }, p = {
+    color: "inherit",
+    font: "inherit",
+    background: "none",
+    border: 0,
+    padding: 0,
+    cursor: "pointer",
+    textDecoration: "underline",
+    textUnderlineOffset: "0.2em"
+  };
+  return /* @__PURE__ */ L(
+    "div",
+    {
+      className: e,
+      style: {
+        display: "flex",
+        flexWrap: "wrap",
+        alignItems: "center",
+        gap: "0.5em",
+        fontSize: "0.85em",
+        opacity: 0.7,
+        lineHeight: 1.5
+      },
+      children: [
+        /* @__PURE__ */ S(
+          "a",
+          {
+            href: "https://lystech.ca",
+            target: "_blank",
+            rel: "noreferrer",
+            style: { color: "inherit" },
+            children: r
+          }
+        ),
+        !o?.modeEdition && /* @__PURE__ */ L(F, { children: [
+          /* @__PURE__ */ S("span", { "aria-hidden": "true", children: "·" }),
+          /* @__PURE__ */ S("button", { type: "button", style: p, onClick: w, children: u ? "…" : c })
+        ] })
+      ]
+    }
+  );
 }
-function i(e, r) {
-  if (Array.isArray(e)) return e.map((t) => i(t, r));
-  if (I(e)) {
-    const t = e, o = r.slice(0, 2);
-    return t[r] ?? t[o] ?? Object.values(t).find((c) => c != null) ?? "";
-  }
-  if (e && typeof e == "object") {
-    const t = {};
-    for (const [o, n] of Object.entries(e))
-      t[o] = i(n, r);
-    return t;
-  }
-  return e;
+function Z(t) {
+  return !!t && typeof t == "object" && !Array.isArray(t) && Object.keys(t).every((n) => /^[a-z]{2}(-[A-Za-z]{2})?$/.test(n));
 }
-function U(e, r) {
-  if (!r || typeof r != "object" || Array.isArray(r))
+function C(t, n) {
+  if (Array.isArray(t)) return t.map((e) => C(e, n));
+  if (Z(t)) {
+    const e = t, r = n.slice(0, 2);
+    return e[n] ?? e[r] ?? Object.values(e).find((o) => o != null) ?? "";
+  }
+  if (t && typeof t == "object") {
+    const e = {};
+    for (const [r, c] of Object.entries(t))
+      e[r] = C(c, n);
     return e;
-  const t = { ...e };
-  for (const [o, n] of Object.entries(r))
-    n != null && (t[o] = n);
+  }
   return t;
 }
-function O(e, r) {
-  const t = y();
-  return m(() => {
-    const o = t?.sections.find(
-      (a) => a.blockType === e
-    ), n = o?.data ?? null, c = n ? i(n, t?.langue ?? "fr") : null;
+function G(t, n) {
+  if (!n || typeof n != "object" || Array.isArray(n))
+    return t;
+  const e = { ...t };
+  for (const [r, c] of Object.entries(n))
+    c != null && (e[r] = c);
+  return e;
+}
+function B(t, n) {
+  const e = I(), r = e?.apercu?.[t];
+  return _(() => {
+    const c = e?.sections.find(
+      (m) => m.blockType === t
+    ), o = r ?? c?.data ?? null, i = o ? C(o, e?.langue ?? "fr") : null;
     return {
-      contenu: U(r.defaut, c),
-      publie: !!n,
-      UID: o?.UID ?? null,
-      chargement: t?.etat === "chargement"
+      contenu: G(n.defaut, i),
+      publie: !!c?.data,
+      UID: c?.UID ?? null,
+      chargement: e?.etat === "chargement",
+      ancrage: { "data-lystech-section": t }
     };
-  }, [t?.sections, t?.langue, t?.etat, e, r.defaut]);
+  }, [
+    e?.sections,
+    e?.langue,
+    e?.etat,
+    r,
+    t,
+    n.defaut
+  ]);
 }
-function P(e, r) {
-  const t = y();
-  return m(() => {
-    const o = (t?.sections ?? []).filter(
-      (n) => n.blockType === e
+function tt(t, n) {
+  const e = I();
+  return _(() => {
+    const r = { "data-lystech-section": t }, c = (e?.sections ?? []).filter(
+      (o) => o.blockType === t
     );
-    return o.length === 0 ? {
-      items: (r?.defaut ?? []).map((n, c) => ({
-        ...n,
-        __uid: `defaut-${c}`
+    return c.length === 0 ? {
+      items: (n?.defaut ?? []).map((o, i) => ({
+        ...o,
+        __uid: `defaut-${i}`
       })),
       publie: !1,
-      chargement: t?.etat === "chargement"
+      chargement: e?.etat === "chargement",
+      ancrage: r
     } : {
-      items: o.map((n) => ({
-        ...i(n.data ?? {}, t?.langue ?? "fr"),
-        __uid: n.UID
+      items: c.map((o) => ({
+        ...C(o.data ?? {}, e?.langue ?? "fr"),
+        __uid: o.UID
       })),
       publie: !0,
-      chargement: t?.etat === "chargement"
+      chargement: e?.etat === "chargement",
+      ancrage: r
     };
-  }, [t?.sections, t?.langue, t?.etat, e, r?.defaut]);
+  }, [e?.sections, e?.langue, e?.etat, t, n?.defaut]);
 }
 export {
-  D as SectionsProvider,
-  O as useSection,
-  P as useSectionList,
-  y as useSectionsContext
+  X as SectionsProvider,
+  Y as SignatureLystech,
+  rt as adaptateurI18next,
+  T as appliquerAuxTextes,
+  B as useSection,
+  tt as useSectionList,
+  I as useSectionsContext
 };

package/dist/morceaux/sourceTexte-BMPMpNg9.js

@@ -0,0 +1,71 @@
+function y(t, o) {
+  const e = t.split("."), r = {};
+  let n = r;
+  for (let s = 0; s < e.length - 1; s++) {
+    const c = e[s];
+    n[c] = {}, n = n[c];
+  }
+  return n[e[e.length - 1]] = o, r;
+}
+function l(t, o = "", e = {}) {
+  if (!t || typeof t != "object") return e;
+  for (const [r, n] of Object.entries(t)) {
+    const s = o ? o + "." + r : r;
+    typeof n == "string" ? e[s] = n : n && typeof n == "object" && !Array.isArray(n) && l(n, s, e);
+  }
+  return e;
+}
+function h(t) {
+  return {
+    langues: () => {
+      const o = t?.options?.supportedLngs, e = Array.isArray(o) ? o.filter((r) => r !== "cimode") : [];
+      return e.length ? e : [t?.language ?? "fr"];
+    },
+    langueCourante: () => String(t?.language ?? "fr").slice(0, 2),
+    dictionnaire: (o) => {
+      const e = Array.isArray(t?.options?.ns) ? t.options.ns : [t?.options?.defaultNS ?? "translation"], r = {};
+      for (const n of e) {
+        const s = t?.getResourceBundle?.(o, n);
+        s && (r[n] = l(s));
+      }
+      return r;
+    },
+    poser: (o, e, r, n) => {
+      t?.addResourceBundle?.(
+        o,
+        e,
+        y(r, n),
+        !0,
+        !0
+      );
+    }
+  };
+}
+const d = /^i18n:([^:]+):(.*)$/;
+function A(t, o) {
+  if (typeof t == "string") return t;
+  if (!t || typeof t != "object" || Array.isArray(t)) return null;
+  const e = t, r = o.slice(0, 2), n = e[o] ?? e[r];
+  return typeof n == "string" ? n : null;
+}
+function j(t, o) {
+  const e = o.langues();
+  let r = 0;
+  for (const n of t ?? []) {
+    const s = d.exec(n.blockType ?? "");
+    if (!s || !n.data) continue;
+    const c = s[1], u = s[2];
+    for (const [a, p] of Object.entries(n.data)) {
+      const g = u ? u + "." + a : a;
+      for (const f of e) {
+        const i = A(p, f);
+        i === null || i === "" || (o.poser(f, c, g, i), r++);
+      }
+    }
+  }
+  return r;
+}
+export {
+  h as adaptateurI18next,
+  j as appliquerAuxTextes
+};

package/dist/sourceTexte.d.ts

@@ -0,0 +1,34 @@
+/** Un dictionnaire aplati : espace de noms → chemin pointé → texte. */
+export type Dictionnaire = Record<string, Record<string, string>>;
+export type SourceTexte = {
+    /** Les langues que le site sait rendre. */
+    langues: () => string[];
+    /** Celle qu'il affiche en ce moment. */
+    langueCourante: () => string;
+    /** Tout ce que le site sait dire, dans une langue. */
+    dictionnaire: (langue: string) => Dictionnaire;
+    /** Remplacer un texte. Le site doit se redessiner ensuite. */
+    poser: (langue: string, espace: string, chemin: string, valeur: string) => void;
+};
+/**
+ * Branche une instance i18next.
+ *
+ * `bindI18nStore: "added"` doit être actif dans la configuration du site,
+ * sinon React ne se redessine pas quand on remplace un texte — la
+ * modification serait enregistrée mais invisible, ce qui est la pire des
+ * deux issues : la personne réécrit, republie, et finit par croire que rien
+ * ne fonctionne.
+ */
+export declare function adaptateurI18next(i18n: any): SourceTexte;
+/**
+ * Applique des sections publiées à la source de textes du site.
+ *
+ * Utilisée à deux moments, et c'est ce qui rend le référencement juste :
+ * pendant le PRÉ-RENDU, pour que le HTML livré porte le bon texte et les
+ * bonnes balises ; puis dans le NAVIGATEUR, pour rattraper ce qui aurait été
+ * publié depuis la dernière reconstruction.
+ */
+export declare function appliquerAuxTextes(sections: Array<{
+    blockType: string;
+    data: Record<string, unknown> | null;
+}>, source: SourceTexte): number;

package/dist/types.d.ts

@@ -0,0 +1,41 @@
+export type TypeDeChamp = "text" | "richText" | "image" | "number" | "boolean" | "url" | "date" | "choice" | "list";
+export type ChampDeclare = {
+    key: string;
+    label: string;
+    type: TypeDeChamp;
+    required?: boolean;
+    help?: string;
+    options?: string[];
+    /** Sous-champs d'une `list`. */
+    of?: ChampDeclare[];
+    /**
+     * Champ TRADUIT. La valeur stockée devient { fr: …, en: … } et le paquet
+     * rend celle de la langue courante.
+     *
+     * Le serveur ne connaît pas cette clé — il stocke la déclaration telle
+     * quelle. C'est voulu : ajouter une langue ne doit pas demander une
+     * migration côté plateforme.
+     */
+    localized?: boolean;
+};
+export type BlocDeclare = {
+    blockType: string;
+    label: string;
+    description?: string;
+    fields: ChampDeclare[];
+    pages?: string[] | null;
+    maxPerPage?: number | null;
+};
+/** Une section telle qu'elle revient du serveur. */
+export type SectionPubliee = {
+    UID: string;
+    page: string;
+    blockType: string;
+    position: number;
+    data: Record<string, unknown> | null;
+};
+export type ValeurTraduite = {
+    [langue: string]: unknown;
+};
+/** Un champ traduit est un objet de langues ; on le reconnaît sans schéma. */
+export declare function estTraduite(v: unknown): v is ValeurTraduite;