@preprio/toolkit 0.5.0-rc.2 → 0.5.0-rc.4

package/dist/chunk-S3VT4UWM.js

@@ -0,0 +1,75 @@
+// src/core/utils.ts
+var trustedParentOrigin = null;
+function setTrustedParentOrigin(origin) {
+  trustedParentOrigin = origin;
+}
+function getTrustedParentOrigin() {
+  return trustedParentOrigin;
+}
+function sendPreprEvent(event, data, options) {
+  if (typeof window !== "undefined") {
+    const message = {
+      name: "prepr_preview_bar",
+      event,
+      ...data
+    };
+    window.dispatchEvent(
+      new CustomEvent("prepr_preview_bar", { detail: message })
+    );
+    if (window.parent && window.parent !== window) {
+      if (trustedParentOrigin) {
+        window.parent.postMessage(message, trustedParentOrigin);
+      } else if (options?.allowUntrustedTarget) {
+        window.parent.postMessage(message, "*");
+      }
+    }
+  }
+}
+var DebugLogger = class {
+  constructor(options) {
+    this.options = {
+      prefix: "[Prepr]",
+      ...options
+    };
+  }
+  // A local `enabled` wins; otherwise defer to the global logger so scoped
+  // loggers created before initDebugLogger() still pick up the setting.
+  isEnabled() {
+    if (this.options.enabled !== void 0) {
+      return this.options.enabled;
+    }
+    return globalDebugLogger?.options?.enabled ?? false;
+  }
+  log(message, ...args) {
+    if (!this.isEnabled()) return;
+    const prefix = this.options.prefix;
+    console.log(`${prefix} ${message}`, ...args);
+  }
+  warn(message, ...args) {
+    if (!this.isEnabled()) return;
+    const prefix = this.options.prefix;
+    console.warn(`${prefix} ${message}`, ...args);
+  }
+  error(message, ...args) {
+    if (!this.isEnabled()) return;
+    const prefix = this.options.prefix;
+    console.error(`${prefix} ${message}`, ...args);
+  }
+};
+var globalDebugLogger = null;
+function initDebugLogger(enabled = false) {
+  globalDebugLogger = new DebugLogger({ enabled });
+}
+function createScopedLogger(scopeName) {
+  return new DebugLogger({
+    prefix: `[Prepr][${scopeName}]`
+  });
+}
+
+export {
+  setTrustedParentOrigin,
+  getTrustedParentOrigin,
+  sendPreprEvent,
+  initDebugLogger,
+  createScopedLogger
+};

package/dist/chunk-TG6N3C22.js

@@ -0,0 +1,246 @@
+import {
+  isAllowedEditorOrigin
+} from "./chunk-URXSDJOU.js";
+import {
+  indexSnapshot,
+  isLiveFieldChange,
+  parseEditTarget,
+  parseListEntries,
+  patchSnapshot,
+  syncListSnapshot
+} from "./chunk-74KY5EAM.js";
+import {
+  createScopedLogger,
+  getTrustedParentOrigin,
+  sendPreprEvent
+} from "./chunk-S3VT4UWM.js";
+
+// src/core/live-preview/bridge-events.ts
+var debug = createScopedLogger("live-preview:bridge");
+function createLiveBridge(store, options = {}) {
+  let parentOrigin = null;
+  const onMessage = (evt) => {
+    const data = evt?.data;
+    if (data?.event === "prepr:initVE" && !parentOrigin) {
+      if (isAllowedEditorOrigin(evt.origin, options.allowedEditorOrigins?.())) {
+        parentOrigin = evt.origin;
+      } else {
+        debug.warn("ignored live preview handshake from origin", evt.origin);
+      }
+      return;
+    }
+    const trusted = parentOrigin ?? getTrustedParentOrigin();
+    if (!trusted || evt.origin !== trusted) return;
+    if (data?.event === "prepr:fieldChange") {
+      if (typeof data.itemId === "string" && typeof data.field === "string" && data.field && isLiveFieldChange(data.field, data.value)) {
+        const edit = parseEditTarget(data.edit);
+        if (edit) store.pushPatch(data.itemId, data.field, data.value, edit);
+        else store.pushPatch(data.itemId, data.field, data.value);
+      } else {
+        debug.log("dropped malformed fieldChange", data);
+      }
+      return;
+    }
+    if (data?.event === "prepr:listChange") {
+      const list = parseListEntries(data.entries);
+      if (typeof data.itemId === "string" && typeof data.field === "string" && data.field && list) {
+        store.pushList(data.itemId, data.field, list);
+      } else {
+        debug.log("dropped malformed listChange", data);
+      }
+      return;
+    }
+    if (data?.event === "prepr:itemChanged") {
+      if (typeof data.itemId === "string") {
+        store.invalidate(data.itemId);
+      } else {
+        debug.log("dropped malformed itemChanged", data);
+      }
+    }
+  };
+  return {
+    start() {
+      window.addEventListener("message", onMessage);
+      sendPreprEvent(
+        "live_ready",
+        options.strictMode?.() ? { strictMode: true } : void 0,
+        { allowUntrustedTarget: true }
+      );
+    },
+    stop() {
+      window.removeEventListener("message", onMessage);
+    }
+  };
+}
+
+// src/core/live-preview/live-store.ts
+var debug2 = createScopedLogger("live-preview");
+var INVALIDATE_DEBOUNCE_MS = 150;
+var MAX_LOG_ENTRIES = 500;
+function withPatch(log, patch) {
+  let previous = -1;
+  for (let i = log.length - 1; i >= 0; i--) {
+    const p = log[i];
+    if (p.type === patch.type && p.itemId === patch.itemId && p.field === patch.field) {
+      previous = i;
+      break;
+    }
+  }
+  if (previous === -1) return [...log, patch];
+  const since = log.slice(previous + 1);
+  const listPrefix = `${patch.field}.`;
+  const dependsOnPosition = since.some(
+    (p) => p.type === "list" || patch.type === "list" && p.itemId === patch.itemId && p.field.startsWith(listPrefix)
+  );
+  if (dependsOnPosition) return [...log, patch];
+  return [...log.slice(0, previous), ...since, patch];
+}
+function createLiveStore(options = {}) {
+  const accepts = (patch) => options.accept ? options.accept(patch) : true;
+  const entries = /* @__PURE__ */ new Set();
+  const invalidateListeners = /* @__PURE__ */ new Set();
+  const pendingInvalidates = /* @__PURE__ */ new Map();
+  let defaultFetcher = null;
+  let log = [];
+  const logListeners = /* @__PURE__ */ new Set();
+  function record(patch) {
+    log = withPatch(log, patch).slice(-MAX_LOG_ENTRIES);
+    logListeners.forEach((fn) => fn(log));
+  }
+  function notify(entry) {
+    entry.listeners.forEach((fn) => fn());
+  }
+  async function refetch(entry) {
+    const fetcher = entry.opts.fetcher ?? defaultFetcher;
+    if (!fetcher || entry.opts.query == null) return;
+    const token = ++entry.fetchToken;
+    try {
+      const result = await fetcher(entry.opts.query, entry.opts.variables);
+      if (token !== entry.fetchToken || !entries.has(entry)) return;
+      entry.snapshot = result;
+      entry.index = indexSnapshot(result);
+      notify(entry);
+    } catch (error) {
+      debug2.log("refetch failed, keeping previous snapshot", error);
+    }
+  }
+  function runInvalidate(itemId) {
+    pendingInvalidates.delete(itemId);
+    invalidateListeners.forEach((fn) => fn(itemId));
+    for (const entry of entries) {
+      if (entry.index.has(itemId)) void refetch(entry);
+    }
+  }
+  return {
+    register(data, opts = {}) {
+      const entry = {
+        snapshot: data,
+        index: indexSnapshot(data),
+        opts,
+        listeners: /* @__PURE__ */ new Set(),
+        fetchToken: 0
+      };
+      for (const patch of log) {
+        if (patch.type === "field") {
+          entry.snapshot = patchSnapshot(
+            entry.snapshot,
+            entry.index,
+            patch.itemId,
+            patch.field,
+            patch.value
+          );
+        } else {
+          const next = syncListSnapshot(
+            entry.snapshot,
+            entry.index,
+            patch.itemId,
+            patch.field,
+            patch.entries
+          );
+          if (next !== entry.snapshot) {
+            entry.snapshot = next;
+            entry.index = indexSnapshot(next);
+          }
+        }
+      }
+      entries.add(entry);
+      return {
+        getSnapshot: () => entry.snapshot,
+        subscribe(fn) {
+          entry.listeners.add(fn);
+          return () => entry.listeners.delete(fn);
+        },
+        unregister() {
+          entry.listeners.clear();
+          entries.delete(entry);
+        }
+      };
+    },
+    pushPatch(itemId, field, value, edit) {
+      const patch = edit ? { type: "field", itemId, field, value, edit } : { type: "field", itemId, field, value };
+      if (!accepts(patch)) return;
+      record(patch);
+      for (const entry of entries) {
+        const next = patchSnapshot(
+          entry.snapshot,
+          entry.index,
+          itemId,
+          field,
+          value
+        );
+        if (next !== entry.snapshot) {
+          entry.snapshot = next;
+          notify(entry);
+        }
+      }
+    },
+    pushList(itemId, field, list) {
+      const patch = { type: "list", itemId, field, entries: list };
+      if (!accepts(patch)) return;
+      record(patch);
+      for (const entry of entries) {
+        const next = syncListSnapshot(
+          entry.snapshot,
+          entry.index,
+          itemId,
+          field,
+          list
+        );
+        if (next !== entry.snapshot) {
+          entry.snapshot = next;
+          entry.index = indexSnapshot(next);
+          notify(entry);
+        }
+      }
+    },
+    invalidate(itemId) {
+      if (log.length) {
+        log = [];
+        logListeners.forEach((fn) => fn(log));
+      }
+      const pending = pendingInvalidates.get(itemId);
+      if (pending) clearTimeout(pending);
+      pendingInvalidates.set(
+        itemId,
+        setTimeout(() => runInvalidate(itemId), INVALIDATE_DEBOUNCE_MS)
+      );
+    },
+    setFetcher(fetcher) {
+      defaultFetcher = fetcher;
+    },
+    onInvalidate(fn) {
+      invalidateListeners.add(fn);
+      return () => invalidateListeners.delete(fn);
+    },
+    getLog: () => log,
+    onLogChange(fn) {
+      logListeners.add(fn);
+      return () => logListeners.delete(fn);
+    }
+  };
+}
+
+export {
+  createLiveBridge,
+  createLiveStore
+};

package/dist/chunk-URXSDJOU.js

@@ -0,0 +1,356 @@
+import {
+  createScopedLogger,
+  sendPreprEvent,
+  setTrustedParentOrigin
+} from "./chunk-S3VT4UWM.js";
+
+// src/core/locales/de.json
+var de_default = {
+  common: {
+    viewingAs: "Ansicht als:",
+    user: "Benutzer",
+    off: "Aus",
+    on: "An",
+    reset: "Zur\xFCcksetzen",
+    toolbar: "Symbolleiste"
+  },
+  adaptiveContent: {
+    adaptiveContent: "Adaptive Inhalte",
+    enablePreview: "Vorschaumodus",
+    segment: "Segment",
+    ABVariant: "A/B-Variante",
+    chooseSegment: "Segment w\xE4hlen",
+    searchSegments: "Segmente suchen",
+    none: "Keine Segmente",
+    allOtherUsers: "Alle anderen Benutzer",
+    offDescription: "Die Website als echter Benutzer ansehen (Cookies verwenden)",
+    onDescription: "Mit der Symbolleiste Segmente und A/B-Varianten simulieren"
+  },
+  editingTools: {
+    editingTools: "Bearbeitungswerkzeuge",
+    editMode: "Bearbeitungsmodus",
+    ariaCloseEditMode: "Bearbeitungsmodus schlie\xDFen"
+  },
+  visualEditor: {
+    edit: "Bearbeiten",
+    otherItem: "anderes Element",
+    linkedItem: "verkn\xFCpftes Element"
+  }
+};
+
+// src/core/locales/en.json
+var en_default = {
+  common: {
+    viewingAs: "Viewing as:",
+    user: "User",
+    off: "Off",
+    on: "On",
+    reset: "Reset",
+    toolbar: "Toolbar"
+  },
+  adaptiveContent: {
+    adaptiveContent: "Adaptive content",
+    enablePreview: "Preview mode",
+    segment: "Segment",
+    ABVariant: "A/B variant",
+    chooseSegment: "Choose segment",
+    searchSegments: "Search segments",
+    none: "No segments",
+    allOtherUsers: "All other users",
+    offDescription: "View the site as a real user (use cookies)",
+    onDescription: "Use the toolbar to simulate segments and A/B variants"
+  },
+  editingTools: {
+    editingTools: "Editing tools",
+    editMode: "Edit mode",
+    ariaCloseEditMode: "Close edit mode"
+  },
+  visualEditor: {
+    edit: "Edit",
+    otherItem: "other item",
+    linkedItem: "linked item"
+  }
+};
+
+// src/core/locales/fr.json
+var fr_default = {
+  common: {
+    viewingAs: "Affichage en tant que :",
+    user: "Utilisateur",
+    off: "D\xE9sactiv\xE9",
+    on: "Activ\xE9",
+    reset: "R\xE9initialiser",
+    toolbar: "Barre d'outils"
+  },
+  adaptiveContent: {
+    adaptiveContent: "Contenu adaptatif",
+    enablePreview: "Mode aper\xE7u",
+    segment: "Segment",
+    ABVariant: "Variante A/B",
+    chooseSegment: "Choisir un segment",
+    searchSegments: "Rechercher des segments",
+    none: "Aucun segment",
+    allOtherUsers: "Tous les autres utilisateurs",
+    offDescription: "Voir le site comme un vrai utilisateur (utiliser les cookies)",
+    onDescription: "Utilisez la barre d'outils pour simuler des segments et des variantes A/B"
+  },
+  editingTools: {
+    editingTools: "Outils d'\xE9dition",
+    editMode: "Mode \xE9dition",
+    ariaCloseEditMode: "Fermer le mode \xE9dition"
+  },
+  visualEditor: {
+    edit: "Modifier",
+    otherItem: "autre \xE9l\xE9ment",
+    linkedItem: "\xE9l\xE9ment li\xE9"
+  }
+};
+
+// src/core/locales/nl.json
+var nl_default = {
+  common: {
+    viewingAs: "Bekijken als:",
+    user: "Gebruiker",
+    off: "Uit",
+    on: "Aan",
+    reset: "Resetten",
+    toolbar: "Toolbar"
+  },
+  adaptiveContent: {
+    adaptiveContent: "Adaptieve inhoud",
+    enablePreview: "Preview modus",
+    segment: "Segment",
+    ABVariant: "A/B-variant",
+    chooseSegment: "Kies segment",
+    searchSegments: "Zoek segmenten",
+    none: "Geen segmenten",
+    allOtherUsers: "Alle andere gebruikers",
+    offDescription: "Bekijk de site als een echte gebruiker (gebruik cookies)",
+    onDescription: "Gebruik de werkbalk om segmenten en A/B-varianten te simuleren"
+  },
+  editingTools: {
+    editingTools: "Editing Tools",
+    editMode: "Edit mode",
+    ariaCloseEditMode: "Edit mode sluiten"
+  },
+  visualEditor: {
+    edit: "Bewerken",
+    otherItem: "ander item",
+    linkedItem: "gekoppeld item"
+  }
+};
+
+// src/core/i18n.ts
+var dictionaries = {
+  en: en_default,
+  nl: nl_default,
+  fr: fr_default,
+  de: de_default
+};
+var LOCALES = Object.keys(dictionaries);
+function isLocale(value) {
+  return typeof value === "string" && value in dictionaries;
+}
+function getDict(locale) {
+  return isLocale(locale) ? dictionaries[locale] : dictionaries.en;
+}
+function getFromPath(obj, path) {
+  return path.split(".").reduce(
+    (acc, key) => acc && typeof acc === "object" ? acc[key] : void 0,
+    obj
+  );
+}
+function format(message, vars) {
+  if (!vars) return message;
+  return Object.keys(vars).reduce(
+    (acc, k) => acc.replace(new RegExp(`\\{${k}\\}`, "g"), String(vars[k])),
+    message
+  );
+}
+function t(key, locale, vars) {
+  const dict = getDict(locale);
+  const msg = getFromPath(dict, key);
+  if (typeof msg === "string") return format(msg, vars);
+  return key;
+}
+
+// src/core/iframe-bridge.ts
+var debug = createScopedLogger("iframe-bridge");
+var MAX_REFERENCES = 500;
+var MAX_HREF_LENGTH = 8192;
+var MAX_ASSETS = 500;
+var MAX_ASSET_KEY_LENGTH = 2048;
+var MAX_ASSET_FIELD_LENGTH = 512;
+function parseIds(value) {
+  if (!Array.isArray(value)) return void 0;
+  return value.slice(0, MAX_REFERENCES).filter((id) => typeof id === "string" && id.length > 0);
+}
+function parseReferences(value) {
+  if (!Array.isArray(value)) return void 0;
+  const list = [];
+  for (const entry of value.slice(0, MAX_REFERENCES)) {
+    const id = entry?.id;
+    const field = entry?.field;
+    if (typeof id === "string" && id && typeof field === "string" && field) {
+      list.push({ id, field });
+    }
+  }
+  return list;
+}
+function boundedString(value, max) {
+  return typeof value === "string" && value && value.length <= max ? value : void 0;
+}
+function parseAssets(value) {
+  if (!Array.isArray(value)) return void 0;
+  const list = [];
+  for (const entry of value.slice(0, MAX_ASSETS)) {
+    if (!entry || typeof entry !== "object") continue;
+    const raw = entry;
+    const key = boundedString(raw.key, MAX_ASSET_KEY_LENGTH);
+    const field = boundedString(raw.field, MAX_ASSET_FIELD_LENGTH);
+    if (!key || !field) continue;
+    const entryId = boundedString(raw.entryId, MAX_ASSET_FIELD_LENGTH);
+    list.push(entryId ? { key, field, entryId } : { key, field });
+  }
+  return list;
+}
+var EDITOR_BASE_DOMAIN = "prepr.io";
+function isAllowedEditorOrigin(origin, allowed) {
+  if (allowed) {
+    if (allowed.includes("*")) return origin !== "null";
+    return allowed.includes(origin);
+  }
+  let url;
+  try {
+    url = new URL(origin);
+  } catch {
+    return false;
+  }
+  if (url.protocol !== "https:" || url.port !== "") return false;
+  const suffix = `.${EDITOR_BASE_DOMAIN}`;
+  if (!url.hostname.endsWith(suffix)) return false;
+  const label = url.hostname.slice(0, -suffix.length);
+  return label.length > 0 && !label.includes(".");
+}
+function createIframeBridge(store, options = {}) {
+  const allowedOrigins = options.allowedEditorOrigins;
+  const onScrollToField = options.onScrollToField;
+  const onHandshake = options.onHandshake;
+  const onReferences = options.onReferences;
+  const onAssets = options.onAssets;
+  const onAllowNavigation = options.onAllowNavigation;
+  let parentOrigin = null;
+  const onKeyDown = (event) => {
+    const key = event.key.toLowerCase();
+    const blocked = (event.ctrlKey || event.metaKey) && ["s", "p", "l"].includes(key);
+    if (blocked) event.preventDefault();
+  };
+  const onMessage = (evt) => {
+    const data = evt?.data;
+    if (data?.event === "prepr:initVE" && !parentOrigin) {
+      if (!isAllowedEditorOrigin(evt.origin, allowedOrigins)) {
+        debug.warn("ignored editor handshake from origin", evt.origin);
+        return;
+      }
+      parentOrigin = evt.origin;
+      setTrustedParentOrigin(parentOrigin);
+      if (data.scrollPosition != null) {
+        const top = data.scrollPosition;
+        setTimeout(() => window.scrollTo(0, top), 1);
+      }
+      store?.set({ previewMode: true, editMode: data.editMode ?? true });
+      const itemId = typeof data.itemId === "string" && data.itemId ? data.itemId : void 0;
+      const referencedIds = parseReferences(data.referencedIds);
+      const componentIds = parseIds(data.componentIds);
+      const uiLocale = isLocale(data.uiLocale) ? data.uiLocale : void 0;
+      const navigationGuard = data.navigationGuard === true;
+      const assets = parseAssets(data.assets);
+      try {
+        onHandshake?.({
+          ...itemId && { itemId },
+          ...referencedIds && { referencedIds },
+          ...componentIds && { componentIds },
+          ...uiLocale && { uiLocale },
+          ...navigationGuard && { navigationGuard },
+          ...assets && { assets }
+        });
+      } catch (error) {
+        debug.warn("handshake handler failed", error);
+      }
+    }
+    if (!parentOrigin || evt.origin !== parentOrigin) return;
+    if (data?.event === "prepr:references") {
+      const assets = parseAssets(data.assets);
+      if (assets) {
+        try {
+          onAssets?.(assets);
+        } catch (error) {
+          debug.warn("assets handler failed", error);
+        }
+      }
+      const referencedIds = parseReferences(data.referencedIds);
+      if (!referencedIds) return;
+      try {
+        onReferences?.(referencedIds, parseIds(data.componentIds));
+      } catch (error) {
+        debug.warn("references handler failed", error);
+      }
+    }
+    if (data?.event === "prepr:getScrollPosition") {
+      const currentScrollY = window.scrollY || document.documentElement.scrollTop;
+      sendPreprEvent("getScrollPosition", { value: currentScrollY });
+    }
+    if (data?.event === "prepr:scrollToField") {
+      if (typeof data.field !== "string" || !data.field) return;
+      if (data.id !== void 0 && typeof data.id !== "string") return;
+      const block = typeof data.block === "number" && Number.isInteger(data.block) ? data.block : void 0;
+      const entryId = typeof data.entryId === "string" && data.entryId ? data.entryId : void 0;
+      const fieldById = typeof data.fieldById === "string" && data.fieldById ? data.fieldById : void 0;
+      try {
+        onScrollToField?.({
+          field: data.field,
+          id: data.id,
+          block,
+          entryId,
+          fieldById
+        });
+      } catch (error) {
+        debug.warn("scrollToField handler failed", error);
+      }
+    }
+    if (data?.event === "prepr:allowNavigation") {
+      const href = data.href;
+      if (typeof href !== "string" || !href || href.length > MAX_HREF_LENGTH) {
+        return;
+      }
+      try {
+        onAllowNavigation?.(href);
+      } catch (error) {
+        debug.warn("allowNavigation handler failed", error);
+      }
+    }
+  };
+  return {
+    start() {
+      const features = store?.get().features;
+      sendPreprEvent("loaded", features ? { features } : void 0, {
+        allowUntrustedTarget: true
+      });
+      window.addEventListener("keydown", onKeyDown);
+      window.addEventListener("message", onMessage);
+    },
+    stop() {
+      window.removeEventListener("keydown", onKeyDown);
+      window.removeEventListener("message", onMessage);
+      parentOrigin = null;
+      setTrustedParentOrigin(null);
+    }
+  };
+}
+
+export {
+  isLocale,
+  t,
+  isAllowedEditorOrigin,
+  createIframeBridge
+};