chayns-api 3.0.0 → 3.1.0-beta.0

package/dist/esm/host/iframe/HostIframe.js

@@ -1,10 +1,10 @@
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 import React, { useEffect, useRef } from 'react';
 import * as comlink from 'comlink';
-import postIframeForm from '../../util/postIframeForm';
+import postIframeForm from '../../utils/postIframeForm';
 import useUpdateData from './utils/useUpdateData';
-import { replaceStagingUrl } from "../../util/url";
-import { initTransferNestedFunctions } from '../../util/transferNestedFunctions';
+import { replaceStagingUrl } from "../../utils/url";
+import { initTransferNestedFunctions } from '../../utils/transferNestedFunctions';
 const HostIframe = ({
   iFrameProps,
   src,
@@ -24,13 +24,17 @@ const HostIframe = ({
   customData,
   preventStagingReplacement,
   dialog,
-  styleSettings
+  styleSettings,
+  historyLayer,
+  isHistoryDisabled
 }) => {
   const eventTarget = useRef();
   const ref = useRef();
   const currentDataRef = useRef();
   const customFunctionsRef = useRef();
   customFunctionsRef.current = customFunctions;
+  const historyLayerRef = useRef(undefined);
+  historyLayerRef.current = historyLayer;
   if (!eventTarget.current) {
     eventTarget.current = global.document ? document.createElement('div') : undefined;
   }
@@ -42,6 +46,7 @@ const HostIframe = ({
   const initialData = {
     site,
     isAdminModeActive,
+    isHistoryDisabled,
     pages,
     currentPage,
     device,
@@ -87,7 +92,66 @@ const HostIframe = ({
           addDataListener: cb => {
             if (eventTarget.current) eventTarget.current.addEventListener('data_update', e => e.detail && cb(e.detail));
           },
-          getInitialData: () => currentDataRef.current
+          getInitialData: () => currentDataRef.current,
+          history: historyLayerRef.current ? {
+            getInitialState: () => {
+              const l = historyLayerRef.current;
+              if (!l) return null;
+              return {
+                id: l.id,
+                depth: l.depth,
+                segments: l.getRoute(),
+                params: l.getParams(),
+                hash: l.getHash(),
+                state: l.getState(),
+                activeChildId: l.getActiveChildId(),
+                segmentCount: l.getSegmentCount()
+              };
+            },
+            setRoute: (route, opts) => {
+              var _historyLayerRef$curr;
+              return (_historyLayerRef$curr = historyLayerRef.current) === null || _historyLayerRef$curr === void 0 ? void 0 : _historyLayerRef$curr.setRoute(route, opts);
+            },
+            setParams: (params, opts) => {
+              var _historyLayerRef$curr2;
+              return (_historyLayerRef$curr2 = historyLayerRef.current) === null || _historyLayerRef$curr2 === void 0 ? void 0 : _historyLayerRef$curr2.setParams(params, opts);
+            },
+            setHash: (hash, opts) => {
+              var _historyLayerRef$curr3;
+              return (_historyLayerRef$curr3 = historyLayerRef.current) === null || _historyLayerRef$curr3 === void 0 ? void 0 : _historyLayerRef$curr3.setHash(hash, opts);
+            },
+            setState: (state, opts) => {
+              var _historyLayerRef$curr4;
+              return (_historyLayerRef$curr4 = historyLayerRef.current) === null || _historyLayerRef$curr4 === void 0 ? void 0 : _historyLayerRef$curr4.setState(state, opts);
+            },
+            navigate: opts => {
+              var _historyLayerRef$curr5;
+              return (_historyLayerRef$curr5 = historyLayerRef.current) === null || _historyLayerRef$curr5 === void 0 ? void 0 : _historyLayerRef$curr5.navigate(opts);
+            },
+            setActiveChild: (id, init) => {
+              var _historyLayerRef$curr6;
+              return (_historyLayerRef$curr6 = historyLayerRef.current) === null || _historyLayerRef$curr6 === void 0 ? void 0 : _historyLayerRef$curr6.setActiveChild(id, init);
+            },
+            setSegmentCount: n => {
+              var _historyLayerRef$curr7;
+              return (_historyLayerRef$curr7 = historyLayerRef.current) === null || _historyLayerRef$curr7 === void 0 ? void 0 : _historyLayerRef$curr7.setSegmentCount(n);
+            },
+            addChangeListener: callback => {
+              var _historyLayerRef$curr8, _historyLayerRef$curr9;
+              const unsub = (_historyLayerRef$curr8 = (_historyLayerRef$curr9 = historyLayerRef.current) === null || _historyLayerRef$curr9 === void 0 ? void 0 : _historyLayerRef$curr9.addEventListener('change', callback)) !== null && _historyLayerRef$curr8 !== void 0 ? _historyLayerRef$curr8 : () => {};
+              return comlink.proxy(unsub);
+            },
+            addPopstateListener: callback => {
+              var _historyLayerRef$curr0, _historyLayerRef$curr1;
+              const unsub = (_historyLayerRef$curr0 = (_historyLayerRef$curr1 = historyLayerRef.current) === null || _historyLayerRef$curr1 === void 0 ? void 0 : _historyLayerRef$curr1.addEventListener('popstate', callback)) !== null && _historyLayerRef$curr0 !== void 0 ? _historyLayerRef$curr0 : () => {};
+              return comlink.proxy(unsub);
+            },
+            addBlock: (callback, opts) => {
+              var _historyLayerRef$curr10, _historyLayerRef$curr11;
+              const unsub = (_historyLayerRef$curr10 = (_historyLayerRef$curr11 = historyLayerRef.current) === null || _historyLayerRef$curr11 === void 0 ? void 0 : _historyLayerRef$curr11.addBlock(callback, opts)) !== null && _historyLayerRef$curr10 !== void 0 ? _historyLayerRef$curr10 : () => {};
+              return comlink.proxy(unsub);
+            }
+          } : undefined
         }
       };
       comlink.expose(obj, comlink.windowEndpoint(ref.current.contentWindow));
@@ -98,6 +162,7 @@ const HostIframe = ({
     }
     return undefined;
   }, []);
+  useUpdateData(eventTarget.current, 'isHistoryDisabled', isHistoryDisabled);
   useUpdateData(eventTarget.current, 'isAdminModeActive', isAdminModeActive);
   useUpdateData(eventTarget.current, 'user', user);
   useUpdateData(eventTarget.current, 'site', site);

package/dist/esm/host/module/ModuleHost.js

@@ -1,8 +1,8 @@
 import { c as _c } from "react-compiler-runtime";
 import React, { useContext, useMemo } from 'react';
-import { ModuleContext } from '../../constants/moduleContext';
+import { ModuleContext } from '../../contexts/moduleContext';
 import loadComponent from './utils/loadComponent';
-import { replaceStagingUrl } from "../../util/url";
+import { replaceStagingUrl } from "../../utils/url";
 const System = ({
   system,
   fallback,
@@ -24,7 +24,7 @@ const System = ({
   }, React.createElement(Component, props));
 };
 const ModuleHost = t0 => {
-  const $ = _c(34);
+  const $ = _c(36);
   const {
     system,
     children: t1,
@@ -42,14 +42,17 @@ const ModuleHost = t0 => {
     dialog,
     environment,
     preventStagingReplacement,
-    styleSettings
+    styleSettings,
+    historyLayer,
+    isHistoryDisabled
   } = t0;
   const children = t1 === undefined ? null : t1;
   let result;
-  if ($[0] !== currentPage || $[1] !== customData || $[2] !== device || $[3] !== dialog || $[4] !== environment || $[5] !== isAdminModeActive || $[6] !== language || $[7] !== pages || $[8] !== parameters || $[9] !== site || $[10] !== styleSettings || $[11] !== user) {
+  if ($[0] !== currentPage || $[1] !== customData || $[2] !== device || $[3] !== dialog || $[4] !== environment || $[5] !== isAdminModeActive || $[6] !== isHistoryDisabled || $[7] !== language || $[8] !== pages || $[9] !== parameters || $[10] !== site || $[11] !== styleSettings || $[12] !== user) {
     result = {
       site,
       isAdminModeActive,
+      isHistoryDisabled,
       pages,
       currentPage,
       device,
@@ -71,49 +74,50 @@ const ModuleHost = t0 => {
     $[3] = dialog;
     $[4] = environment;
     $[5] = isAdminModeActive;
-    $[6] = language;
-    $[7] = pages;
-    $[8] = parameters;
-    $[9] = site;
-    $[10] = styleSettings;
-    $[11] = user;
-    $[12] = result;
+    $[6] = isHistoryDisabled;
+    $[7] = language;
+    $[8] = pages;
+    $[9] = parameters;
+    $[10] = site;
+    $[11] = styleSettings;
+    $[12] = user;
+    $[13] = result;
   } else {
-    result = $[12];
+    result = $[13];
   }
   const data = result;
   let t2;
-  if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
+  if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
     t2 = React.createElement("div", {
       className: "module-css"
     });
-    $[13] = t2;
+    $[14] = t2;
   } else {
-    t2 = $[13];
+    t2 = $[14];
   }
   const t3 = system.scope;
   let t4;
-  if ($[14] !== environment.buildEnvironment || $[15] !== preventStagingReplacement || $[16] !== system.url) {
+  if ($[15] !== environment.buildEnvironment || $[16] !== preventStagingReplacement || $[17] !== system.url) {
     t4 = replaceStagingUrl(preventStagingReplacement, system.url, environment.buildEnvironment);
-    $[14] = environment.buildEnvironment;
-    $[15] = preventStagingReplacement;
-    $[16] = system.url;
-    $[17] = t4;
+    $[15] = environment.buildEnvironment;
+    $[16] = preventStagingReplacement;
+    $[17] = system.url;
+    $[18] = t4;
   } else {
-    t4 = $[17];
+    t4 = $[18];
   }
   let t5;
-  if ($[18] !== environment.buildEnvironment || $[19] !== preventStagingReplacement || $[20] !== system.serverUrl) {
+  if ($[19] !== environment.buildEnvironment || $[20] !== preventStagingReplacement || $[21] !== system.serverUrl) {
     t5 = replaceStagingUrl(preventStagingReplacement, system.serverUrl, environment.buildEnvironment);
-    $[18] = environment.buildEnvironment;
-    $[19] = preventStagingReplacement;
-    $[20] = system.serverUrl;
-    $[21] = t5;
+    $[19] = environment.buildEnvironment;
+    $[20] = preventStagingReplacement;
+    $[21] = system.serverUrl;
+    $[22] = t5;
   } else {
-    t5 = $[21];
+    t5 = $[22];
   }
   let t6;
-  if ($[22] !== system.module || $[23] !== system.preventSingleton || $[24] !== system.scope || $[25] !== t4 || $[26] !== t5) {
+  if ($[23] !== system.module || $[24] !== system.preventSingleton || $[25] !== system.scope || $[26] !== t4 || $[27] !== t5) {
     t6 = {
       scope: t3,
       url: t4,
@@ -121,33 +125,35 @@ const ModuleHost = t0 => {
       module: system.module,
       preventSingleton: system.preventSingleton
     };
-    $[22] = system.module;
-    $[23] = system.preventSingleton;
-    $[24] = system.scope;
-    $[25] = t4;
-    $[26] = t5;
-    $[27] = t6;
+    $[23] = system.module;
+    $[24] = system.preventSingleton;
+    $[25] = system.scope;
+    $[26] = t4;
+    $[27] = t5;
+    $[28] = t6;
   } else {
-    t6 = $[27];
+    t6 = $[28];
   }
   let t7;
-  if ($[28] !== children || $[29] !== customFunctions || $[30] !== data || $[31] !== functions || $[32] !== t6) {
+  if ($[29] !== children || $[30] !== customFunctions || $[31] !== data || $[32] !== functions || $[33] !== historyLayer || $[34] !== t6) {
     t7 = React.createElement(React.Fragment, null, t2, React.createElement(System, {
       system: t6,
       data: data,
       functions: functions,
       customFunctions: customFunctions,
       fallback: children,
+      historyLayer: historyLayer,
       isModule: true
     }));
-    $[28] = children;
-    $[29] = customFunctions;
-    $[30] = data;
-    $[31] = functions;
-    $[32] = t6;
-    $[33] = t7;
+    $[29] = children;
+    $[30] = customFunctions;
+    $[31] = data;
+    $[32] = functions;
+    $[33] = historyLayer;
+    $[34] = t6;
+    $[35] = t7;
   } else {
-    t7 = $[33];
+    t7 = $[35];
   }
   return t7;
 };

package/dist/esm/index.js

@@ -1,22 +1,31 @@
 export { default as ChaynsProvider } from './components/ChaynsProvider';
-export { default as getDeviceInfo, getScreenSize, getClientDeviceInfo } from './util/deviceHelper';
+export { default as getDeviceInfo, getScreenSize, getClientDeviceInfo } from './utils/deviceHelper';
 export { default as ChaynsHost } from './host/ChaynsHost';
 export { withCompatMode } from './components/withCompatMode';
 export * from './calls';
 export * from './hooks';
 export * from './components/WaitUntil';
 export * from './types/IChaynsReact';
-export * from './util/is';
+export * from './types/history';
+export * from './utils/is';
 export * from './constants';
 export { default as withHydrationBoundary } from './components/withHydrationBoundary';
 export { default as StaticChaynsApi } from './wrapper/StaticChaynsApi';
 export { default as loadComponent, loadModule } from './host/module/utils/loadComponent';
 export { default as DialogHandler } from './handler/DialogHandler';
+export * from './handler/history';
+export { initRootChaynsHistoryLayer, getOrInitRootChaynsHistoryLayer } from './utils/history/rootLayer';
+export { NavigationQueue } from './utils/history/NavigationQueue';
+export { BlockRegistry } from './utils/history/BlockRegistry';
+export { projectToUrl, parseFromUrl } from './utils/history/url';
+export { projectToState, applyStateToTree, diffIncomingState, hasChaynsHistoryState } from './utils/history/stateProjector';
+export { getChaynsHistoryActiveChain, findChaynsHistoryLayerById, isInChaynsHistoryActiveChain } from './utils/history/layerTree';
 import * as _dialog from './calls/dialogs/index';
 export { _dialog as dialog };
 export * from './plugins';
-export * from './util/initModuleFederationSharing';
-export * from './util/bindChaynsApi';
-export * from './util/appStorage';
-export * from './util/collectCssChunks';
+export * from './utils/initModuleFederationSharing';
+export * from './utils/bindChaynsApi';
+export * from './utils/appStorage';
+export * from './utils/collectCssChunks';
+export * from './contexts';
 export { getChaynsApi } from './components/moduleWrapper';

package/dist/esm/types/history.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/umd.index.js

@@ -1,7 +1,7 @@
-export { default as getDeviceInfo, getScreenSize, getClientDeviceInfo } from './util/deviceHelper';
+export { default as getDeviceInfo, getScreenSize, getClientDeviceInfo } from './utils/deviceHelper';
 export * from './calls';
 export * from './types/IChaynsReact';
-export * from './util/is';
+export * from './utils/is';
 export { default as StaticChaynsApi } from './wrapper/StaticChaynsApi';
 export { default as DialogHandler } from './handler/DialogHandler';
 import * as _dialog from './calls/dialogs/index';

package/dist/esm/utils/EventBus.js

@@ -0,0 +1,31 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+export class EventBus {
+  constructor() {
+    _defineProperty(this, "listeners", new Map());
+  }
+  on(type, handler) {
+    let set = this.listeners.get(type);
+    if (!set) {
+      set = new Set();
+      this.listeners.set(type, set);
+    }
+    set.add(handler);
+    return () => set.delete(handler);
+  }
+  emit(type, event) {
+    const set = this.listeners.get(type);
+    if (!set) return;
+    for (const fn of [...set]) {
+      try {
+        fn(event);
+      } catch (err) {
+        console.error('[chaynsHistory] listener threw', err);
+      }
+    }
+  }
+  clear() {
+    this.listeners.clear();
+  }
+}

package/dist/esm/{util → utils}/appStorage.js

@@ -1,4 +1,4 @@
-import { addApiListener } from '../helper/apiListenerHelper';
+import { addApiListener } from './apiListener';
 import { AppName } from '../types/IChaynsReact';
 export function isAppStorageAvailable() {
   var _this$values$device$a, _this$values$device$a2;

package/dist/esm/utils/equality.js

@@ -0,0 +1,12 @@
+export function shallowEqualArr(a, b) {
+  if (a.length !== b.length) return false;
+  for (let i = 0; i < a.length; i++) if (a[i] !== b[i]) return false;
+  return true;
+}
+export function shallowEqualObj(a, b) {
+  const ak = Object.keys(a);
+  const bk = Object.keys(b);
+  if (ak.length !== bk.length) return false;
+  for (const k of ak) if (a[k] !== b[k]) return false;
+  return true;
+}

package/dist/esm/utils/history/BlockRegistry.js

@@ -0,0 +1,108 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+const BLOCK_TIMEOUT_MS = 30000;
+let _nextId = 1;
+export class BlockRegistry {
+  constructor() {
+    _defineProperty(this, "layerBlocks", new Map());
+    _defineProperty(this, "beforeUnloadCount", 0);
+    _defineProperty(this, "beforeUnloadHandler", e => {
+      e.preventDefault();
+      e.returnValue = '';
+    });
+  }
+  add(layer, callback, opts = {}) {
+    var _opts$scope, _opts$isBeforeUnload;
+    const entry = {
+      id: String(_nextId++),
+      callback,
+      opts: {
+        scope: (_opts$scope = opts.scope) !== null && _opts$scope !== void 0 ? _opts$scope : 'local',
+        isBeforeUnload: (_opts$isBeforeUnload = opts.isBeforeUnload) !== null && _opts$isBeforeUnload !== void 0 ? _opts$isBeforeUnload : false
+      }
+    };
+    let set = this.layerBlocks.get(layer.id);
+    if (!set) {
+      set = new Set();
+      this.layerBlocks.set(layer.id, set);
+    }
+    set.add(entry);
+    if (entry.opts.isBeforeUnload) {
+      this.incrementBeforeUnload();
+    }
+    return () => this.remove(layer.id, entry);
+  }
+  remove(layerId, entry) {
+    const set = this.layerBlocks.get(layerId);
+    if (!set) return;
+    set.delete(entry);
+    if (set.size === 0) this.layerBlocks.delete(layerId);
+    if (entry.opts.isBeforeUnload) {
+      this.decrementBeforeUnload();
+    }
+  }
+  removeAllForLayer(layerId) {
+    const set = this.layerBlocks.get(layerId);
+    if (!set) return;
+    for (const entry of set) {
+      if (entry.opts.isBeforeUnload) this.decrementBeforeUnload();
+    }
+    this.layerBlocks.delete(layerId);
+  }
+  collectApplicableBlocks(targetLayer) {
+    const result = [];
+    const localSet = this.layerBlocks.get(targetLayer.id);
+    if (localSet) {
+      for (const entry of localSet) {
+        result.push(entry);
+      }
+    }
+    this.collectGlobalFromActiveDescendants(targetLayer, result);
+    return result;
+  }
+  collectGlobalFromActiveDescendants(layer, out) {
+    const activeChildId = layer.getActiveChildId();
+    if (!activeChildId) return;
+    const child = layer.getChildLayer(activeChildId);
+    if (!child) return;
+    const childSet = this.layerBlocks.get(child.id);
+    if (childSet) {
+      for (const entry of childSet) {
+        if (entry.opts.scope === 'global') {
+          out.push(entry);
+        }
+      }
+    }
+    this.collectGlobalFromActiveDescendants(child, out);
+  }
+  async checkBlocks(targetLayer) {
+    const blocks = this.collectApplicableBlocks(targetLayer);
+    if (blocks.length === 0) return true;
+    const results = await Promise.all(blocks.map(b => this.runBlock(b)));
+    return results.every(Boolean);
+  }
+  async runBlock(entry) {
+    try {
+      const result = await Promise.race([entry.callback(), new Promise(resolve => setTimeout(() => {
+        resolve(false);
+      }, BLOCK_TIMEOUT_MS))]);
+      return result;
+    } catch (err) {
+      return false;
+    }
+  }
+  incrementBeforeUnload() {
+    this.beforeUnloadCount++;
+    if (this.beforeUnloadCount === 1 && typeof window !== 'undefined') {
+      window.addEventListener('beforeunload', this.beforeUnloadHandler);
+    }
+  }
+  decrementBeforeUnload() {
+    if (this.beforeUnloadCount === 0) return;
+    this.beforeUnloadCount--;
+    if (this.beforeUnloadCount === 0 && typeof window !== 'undefined') {
+      window.removeEventListener('beforeunload', this.beforeUnloadHandler);
+    }
+  }
+}