bigpipe-util 0.2.13 → 0.2.14

package/dist/core/onAfterLoad.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = onAfterLoad;
+var _EventListener = _interopRequireDefault(require("fbjs/lib/EventListener"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function onAfterLoad(callback) {
+  if (document.readyState === 'complete') {
+    setTimeout(callback, 0);
+  } else {
+    const event = _EventListener.default.capture(window, 'load', () => {
+      event.remove();
+      callback();
+    });
+  }
+}

package/{src → dist}/core/replaceTransportMarkers.js

@@ -1,27 +1,32 @@
-import $ from './$';
-
-export default function replaceTransportMarkers(markerValue, markers, key) {
-  const marker = typeof key !== "undefined" ? markers[key] : markers;
-
-  if (Array.isArray(marker)) {
-    for (let i = 0; i < marker.length; i++) {
-      replaceTransportMarkers(markerValue, marker, i);
-    }
-  } else {
-    if (marker && typeof marker == "object") {
-      if (marker.__m) {
-        markers[key] = window.require(marker.__m);
-      } else if (marker.__e) {
-        markers[key] = $(marker.__e);
-      } else if (marker.__map) {
-        markers[key] = new Map(marker.__map);
-      } else if (marker.__set) {
-        markers[key] = new Set(marker.__set);
-      } else {
-        for (const value in marker) {
-          replaceTransportMarkers(markerValue, marker, value);
-        }
-      }
-    }
-  }
-}
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = replaceTransportMarkers;
+var _$ = _interopRequireDefault(require("./$"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function replaceTransportMarkers(markerValue, markers, key) {
+  const marker = typeof key !== 'undefined' ? markers[key] : markers;
+  if (Array.isArray(marker)) {
+    for (let i = 0; i < marker.length; i++) {
+      replaceTransportMarkers(markerValue, marker, i);
+    }
+  } else {
+    if (marker && typeof marker == 'object') {
+      if (marker.__m) {
+        markers[key] = window.require(marker.__m);
+      } else if (marker.__e) {
+        markers[key] = (0, _$.default)(marker.__e);
+      } else if (marker.__map) {
+        markers[key] = new Map(marker.__map);
+      } else if (marker.__set) {
+        markers[key] = new Set(marker.__set);
+      } else {
+        for (const value in marker) {
+          replaceTransportMarkers(markerValue, marker, value);
+        }
+      }
+    }
+  }
+}

package/{src → dist}/core/waitForLoad.js

@@ -1,57 +1,46 @@
-import onAfterLoad from "./onAfterLoad";
-
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = waitForLoad;
+var _onAfterLoad = _interopRequireDefault(require("./onAfterLoad"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 let loadingCounter = 0;
 let originalCursor = '';
-
-export default function waitForLoad(elementOnClicked, event, callback = () => {
-}) {
+function waitForLoad(elementOnClicked, event, callback = () => {}) {
   const boundCallback = callback.bind(elementOnClicked, event);
   const body = document.body;
-
   if (document.readyState === 'complete') {
     return boundCallback();
   }
-
   const type = (event || window.event).type;
   loadingCounter++;
-
   if (loadingCounter === 1) {
     originalCursor = body.style.cursor;
     body.style.cursor = 'progress';
   }
-
   switch (type) {
     case 'load':
     case 'focus':
-      onAfterLoad(boundCallback);
+      (0, _onAfterLoad.default)(boundCallback);
       return;
-
     case 'click':
       elementOnClicked.style.cursor = 'progress';
-
-      onAfterLoad(() => {
+      (0, _onAfterLoad.default)(() => {
         loadingCounter--;
-
         if (loadingCounter === 0) {
           body.style.cursor = originalCursor;
         }
-
         elementOnClicked.style.cursor = '';
-
         const result = boundCallback();
         const href = elementOnClicked.getAttribute('href');
-
-        if (
-          elementOnClicked.tagName.toLowerCase() === 'a' &&
-          result !== false &&
-          href
-        ) {
+        if (elementOnClicked.tagName.toLowerCase() === 'a' && result !== false && href) {
           window.location.href = href;
         } else {
           elementOnClicked.click();
         }
       });
   }
-
   return false;
-}
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "bigpipe-util",
   "description": "This library currently implements small part of Facebook BigPipe so far, but the advantage is to efficiently insert/replace content and work with the DOM. It is also possible to easily call JavaScript modules from PHP.",
-  "version": "0.2.13",
+  "version": "0.2.14",
   "keywords": [
     "bigpipe",
     "xhr",
@@ -16,10 +16,29 @@
     "type": "git",
     "url": "git://github.com/richardDobron/bigpipe-util.git"
   },
-  "bugs:": "https://github.com/richardDobron/bigpipe-util/issues",
+  "bugs": {
+    "url": "https://github.com/richardDobron/bigpipe-util/issues"
+  },
   "license": "MIT",
+  "files": [
+    "dist"
+  ],
   "dependencies": {
     "fbjs": "^3.0.4",
     "modal-vanilla": "^0.9.0"
+  },
+  "scripts": {
+    "build": "babel src --out-dir dist",
+    "lint": "eslint src",
+    "format": "prettier --write \"src/**/*.js\"",
+    "format:check": "prettier --check \"src/**/*.js\""
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.24.0",
+    "@babel/core": "^7.24.0",
+    "@babel/preset-env": "^7.24.0",
+    "eslint": "^8.57.0",
+    "eslint-config-prettier": "^10.1.0",
+    "prettier": "^3.9.0"
   }
 }

package/.editorconfig

@@ -1,9 +0,0 @@
-root = true
-
-[*]
-charset = utf-8
-end_of_line = lf
-indent_size = 2
-indent_style = space
-insert_final_newline = true
-trim_trailing_whitespace = true

package/CHANGELOG.md

@@ -1,109 +0,0 @@
-# Changelog
-
-All notable changes to `bigpipe-util` will be documented in this file.
-
-Updates should follow the [Keep a CHANGELOG](http://keepachangelog.com/) principles.
-
-## v0.2.13 - 2026-04-05
-### Fixed
-- submitter and \_\_DEV\_\_ checks
-
-## v0.2.12 - 2026-01-12
-### Added
-- Added `Pagelet.js`, `BigPipe.js`
-
-## v0.2.11 - 2025-12-27
-### Added
-- Added `incrementRequests` method to AsyncRequest.js
-- Added submitter to form data in onSubmit handler
-
-## v0.2.10 - 2025-05-15
-
-### Added
-- Added `onAfterLoad.js`, `waitForLoad.js`
-- Added `timeout` to open dialog with a delay in method `showFromModel`
-
-## v0.2.8 - 2025-05-02
-
-### Added
-- Added `timeout` to open dialog with a delay in method `showFromModel`
-
-## v0.2.7 - 2025-03-22
-
-### Added
-- Added `timeout` to open dialog with a delay in method `render`
-
-## v0.2.6 - 2025-01-16
-
-### Added
-- Added `limit` parameter to `Dialog.js` for limiting the number of closed dialogs
-
-## v0.2.5 - 2023-03-07
-
-### Added
-- Added `Arbiter.js` event system
-- Added methods `byClass`, `byAttribute`, `find` to `Parent.js`
-
-### Fixed
-- Fixed controller calling
-
-## v0.2.4 - 2023-02-03
-
-### Fixed
-- Fixed controller calling
-
-## v0.2.3 - 2023-02-04
-
-### Added
-- Added setFinallyHandler for AsyncRequest
-
-## v0.2.2 - 2022-08-03
-
-### Fixed
-- Calls for modules without constructor
-- Dialog opening when using instant closing
-
-## v0.2.1 - 2022-06-02
-
-### Added
-- Prevent links from being double-clicked
-- Support for keyboard (close by escape)
-
-### Fixed
-- Closing dialogs with [esc] in the correct order
-
-## v0.2.0 - 2022-05-17
-
-### Added
-- Shield to prevent "JSON Hijacking"
-- Invalid node checking for AsyncDOM
-
-### Fixed
-- Backdrop for 2+ opened dialogs
-
-## v0.1.4 - 2022-05-06
-
-### Added
-- Async requests counter
-- Support for extra arguments in dialog controller
-
-### Fixed
-- Arguments for non-method require calls
-
-## v0.1.3 - 2022-04-27
-
-### Added
-- Method to close only current dialog
-
-### Fixed
-- Dialog z-index
-
-## v0.1.2 - 2022-04-14
-
-### Added
-- Dialogs support.
-
-## v0.1.1 - 2022-03-27
-
-### Added
-- Part of BigPipe implementation for Webpack.

package/bigpipe.svg

@@ -1,13 +0,0 @@
-<svg width="254.23999568394254" height="64.8" viewBox="0 0 254.23999568394254 64.8" xmlns="http://www.w3.org/2000/svg">
-    <g transform="matrix(3.0856473041983374,0,0,3.0856473041983374,-6.171373325690784,-6.1698442238608315)" fill="#478be6">
-        <g xmlns="http://www.w3.org/2000/svg">
-            <path d="M2.2427,8.9287a.5.5,0,0,1,0-.8574l10-6a.4971.4971,0,0,1,.5146,0l10,6a.5.5,0,0,1,0,.8574l-10,6a.5.5,0,0,1-.5146,0Zm20,3.1426L12.5,17.917,2.7573,12.0713a.5.5,0,0,0-.5146.8574l10,6a.5.5,0,0,0,.5146,0l10-6a.5.5,0,0,0-.5146-.8574Zm0,4L12.5,21.917,2.7573,16.0713a.5.5,0,0,0-.5146.8574l10,6a.5.5,0,0,0,.5146,0l10-6a.5.5,0,0,0-.5146-.8574Z"></path>
-        </g>
-    </g>
-    <g transform="matrix(2.500000066227385,0,0,2.500000066227385,81.99999920527138,0.49999675485814166)" fill="#478be6">
-        <path d="M8.92 12.24 c1.48 0.4 2.88 1.72 2.88 3.66 c0 2.54 -1.6 4.1 -5.08 4.1 l-5.52 0 l0 -14 l5.22 0 c2.9 0 4.36 1.64 4.36 3.52 c0 1.48 -0.96 2.32 -1.86 2.72 z M6.14 8.56 l-2.02 0 l0 2.82 l2.02 0 c1.24 0 1.74 -0.58 1.74 -1.42 c0 -0.9 -0.58 -1.4 -1.74 -1.4 z M6.56 17.44 c1.6 0 2.32 -0.66 2.32 -1.9 c0 -1.06 -0.72 -1.8 -2.44 -1.8 l-2.32 0 l0 3.7 l2.44 0 z M16.62 6 l0 14 l-2.92 0 l0 -14 l2.92 0 z M32.2 12.559999999999999 c0.62 4.7 -2.44 7.64 -6.22 7.64 c-3.98 0 -7.26 -2.94 -7.26 -7.2 s3.36 -7.2 7.26 -7.2 c1.86 0 3.5 0.6 4.7 1.66 l-1.76 1.98 c-0.74 -0.52 -1.74 -0.9 -2.76 -0.9 c-2.54 0 -4.4 1.86 -4.4 4.46 s1.8 4.46 4.22 4.46 c1.84 0 3.12 -0.66 3.52 -2.42 l-3.3 0 l0 -2.48 l6 0 z"></path>
-    </g>
-    <g transform="matrix(2.5714285714285716,0,0,2.5714285714285716,166.91428559167045,-0.4285714285714306)" fill="#478be6">
-        <path d="M5.46 6 c3.14 0 4.8 1.94 4.8 4.3 c0 2.42 -1.66 4.34 -4.8 4.34 l-3.68 0 l0 5.36 l-0.58 0 l0 -14 l4.26 0 z M5.54 14.04 c2.52 0 4.14 -1.46 4.14 -3.74 c0 -2.32 -1.62 -3.72 -4.14 -3.72 l-3.76 0 l0 7.46 l3.76 0 z M12.74 6 l0 14 l-0.58 0 l0 -14 l0.58 0 z M19.400000000000002 6 c3.14 0 4.8 1.94 4.8 4.3 c0 2.42 -1.66 4.34 -4.8 4.34 l-3.68 0 l0 5.36 l-0.58 0 l0 -14 l4.26 0 z M19.48 14.04 c2.52 0 4.14 -1.46 4.14 -3.74 c0 -2.32 -1.62 -3.72 -4.14 -3.72 l-3.76 0 l0 7.46 l3.76 0 z M26.680000000000003 19.42 l7.28 0 l0 0.58 l-7.68 0 l-0.18 0 l0 -14 l0.58 0 l7.1 0 l0 0.58 l-7.1 0 l0 6.1 l5.66 0 l0 0.58 l-5.66 0 l0 6.16 z"></path>
-    </g>
-</svg>

package/src/Pagelet.js

@@ -1,131 +0,0 @@
-import BigPipe, { RESOURCE_PHASE } from "./BigPipe";
-import ServerJS from "./ServerJS";
-import AsyncDOM from "./async/AsyncDOM";
-
-const serverJS = new ServerJS();
-const asyncDOM = new AsyncDOM();
-const bigPipe = new BigPipe();
-
-export const PAGELET_PHASE = Object.freeze({
-  ARRIVE_START: 0,
-  LOADING_CSS: 1,
-  DISPLAY_START: 2,
-  DISPLAY_END: 3,
-  ARRIVE_END: 4
-});
-
-function areAllResourcesLoaded(resources) {
-  if (resources.size === 0) {
-    return true;
-  }
-  return Array.from(resources.values()).every(
-    resource => resource.phase === RESOURCE_PHASE.LOADED
-  );
-}
-
-export default class Pagelet {
-  cssResources = new Map();
-
-  jsResources = new Map();
-
-  id = "";
-
-  phase = PAGELET_PHASE.ARRIVE_START;
-
-  constructor(pageletData) {
-    this.bigPipe = bigPipe;
-    this.id = pageletData.id;
-    this.phase = PAGELET_PHASE.ARRIVE_START;
-    this.domops = pageletData.domops;
-    this.jsmods = pageletData.jsmods;
-    this.css = pageletData.css;
-    this.js = pageletData.js;
-    this.cssResources = new Map();
-    this.jsResources = new Map();
-  }
-
-  isComplete() {
-    return this.phase === PAGELET_PHASE.ARRIVE_END;
-  }
-
-  setPhase(phase) {
-    this.phase = phase;
-  }
-
-  start() {
-    if (this.phase !== PAGELET_PHASE.ARRIVE_START) {
-      return;
-    }
-
-    if (this.css.length > 0) {
-      this.css.forEach((cssFile) => {
-        const cssResource = this.bigPipe.pageletResourceFactory(cssFile, 'css');
-        this.attachCssResource(cssResource);
-      });
-    }
-
-    if (this.js.length > 0) {
-      this.js.forEach((jsFile) => {
-        const jsResource = this.bigPipe.pageletResourceFactory(jsFile, 'js');
-        this.attachJsResource(jsResource);
-      });
-    }
-
-    if (this.cssResources.size > 0) {
-      this.setPhase(PAGELET_PHASE.LOADING_CSS);
-      this.cssResources.forEach((resource) => {
-        resource.startLoading();
-      });
-    } else {
-      this.setContent();
-      this.onJsFinished();
-    }
-  }
-
-  attachCssResource(resource) {
-    resource.attachToPagelet(() => this.onCssFinished(resource));
-    this.cssResources.set(resource.file, resource);
-  }
-
-  attachJsResource(resource) {
-    resource.attachToPagelet(() => this.onJsFinished());
-    this.jsResources.set(resource.file, resource);
-  }
-
-  onJsFinished() {
-    if (this.isComplete()) {
-      return;
-    }
-
-    if (!areAllResourcesLoaded(this.jsResources)) {
-      return;
-    }
-
-    this.processJsMods();
-
-    this.setPhase(PAGELET_PHASE.ARRIVE_END);
-  }
-
-  processJsMods() {
-    serverJS.handle(this.jsmods);
-  }
-
-  onCssFinished() {
-    if (!areAllResourcesLoaded(this.cssResources)) {
-      return;
-    }
-
-    this.setContent();
-  }
-
-  setContent() {
-    this.setPhase(PAGELET_PHASE.DISPLAY_START);
-
-    if (this.domops) {
-      asyncDOM.invoke(this.domops);
-    }
-
-    this.setPhase(PAGELET_PHASE.DISPLAY_END);
-    this.bigPipe.pageletDisplayed(this);
-  }
-}

package/src/Primer.js

@@ -1,160 +0,0 @@
-import AsyncRequest from "./async/AsyncRequest";
-import {byTag} from "./core/Parent";
-
-export default function Primer() {
-  const rootElement = document.documentElement;
-
-  const RELATIONSHIP_REGEX = /async(?:-post)?|dialog/;
-
-  rootElement.onclick = function (event) {
-    event = event || window.event;
-    const elementOnClicked = event.target || event.srcElement;
-
-    const linkNodeOnClicked = byTag(elementOnClicked, "A");
-
-    if (!linkNodeOnClicked) {
-      return;
-    }
-
-    const ajaxHref = linkNodeOnClicked.getAttribute("ajaxify")
-    const realHref = linkNodeOnClicked.href
-    let relationship = linkNodeOnClicked.rel && linkNodeOnClicked.rel.match(RELATIONSHIP_REGEX);
-    relationship = relationship && relationship[0];
-
-    if (ajaxHref && realHref && !/#$/.test(realHref)) {
-      const isMiddleMouseButton = event.which && event.which === 2;
-      const hasModifierKey = event.altKey || event.ctrlKey || event.metaKey || event.shiftKey;
-
-      if (isMiddleMouseButton || hasModifierKey) {
-        return;
-      }
-    }
-
-    if (linkNodeOnClicked.classList.contains('async-saving')) {
-      event.preventDefault();
-      return;
-    }
-
-    switch (relationship) {
-      case "async":
-      case "async-post":
-        event.preventDefault();
-
-        (new AsyncRequest(ajaxHref))
-          .setRelative(linkNodeOnClicked)
-          .setInitialHandler(() => {
-            linkNodeOnClicked.classList.add("async-saving");
-          })
-          .setHandler(() => {
-            linkNodeOnClicked.classList.remove("async-saving");
-          })
-          .setErrorHandler(() => {
-            linkNodeOnClicked.classList.remove("async-saving");
-          })
-          .setMethod(relationship === "async-post" ? "POST" : "GET")
-          .send();
-        break;
-      case "dialog":
-        event.preventDefault();
-
-        (new AsyncRequest(linkNodeOnClicked.getAttribute("ajaxify")))
-          .setRelative(linkNodeOnClicked)
-          .setInitialHandler(() => {
-            linkNodeOnClicked.classList.add("async-saving");
-          })
-          .setHandler(() => {
-            linkNodeOnClicked.classList.remove("async-saving");
-          })
-          .setErrorHandler(() => {
-            linkNodeOnClicked.classList.remove("async-saving");
-          })
-          .setMethod("POST")
-          .send();
-        break;
-    }
-  };
-
-  rootElement.onsubmit = function (event) {
-    event = event || window.event;
-    const eventTarget = event.target || event.srcElement;
-
-    if (eventTarget &&
-      eventTarget.nodeName === "FORM" &&
-      eventTarget.getAttribute("rel") === "async") {
-      event.preventDefault();
-
-      const formData = new FormData(eventTarget);
-      const submitter = event.submitter || eventTarget.querySelector("button[type='submit']");
-      const activeControls = eventTarget.querySelectorAll("input:not([readonly]),select:not([readonly]),textarea:not([readonly])");
-
-      if (submitter && submitter.name) {
-        formData.append(submitter.name, submitter.value);
-      }
-
-      (new AsyncRequest(eventTarget.getAttribute("ajaxify") || eventTarget.getAttribute("action")))
-        .setMethod(eventTarget.method || "POST")
-        .setRelative(eventTarget)
-        .setData(formData)
-        .setInitialHandler(function () {
-          eventTarget.classList.add("async-saving");
-
-          if (!eventTarget.classList.contains("disable-prevent-form")) {
-            activeControls.forEach(function (control) {
-              control.setAttribute("readonly", "readonly");
-            });
-
-            if (submitter) {
-              submitter.disabled = true;
-            }
-          }
-
-          if (eventTarget) {
-            const loader = eventTarget.querySelector(".form-loader");
-
-            if (loader) {
-              loader.classList.add("loading");
-            }
-          }
-        })
-        .setHandler(function () {
-          eventTarget.classList.remove("async-saving");
-
-          activeControls.forEach(function (control) {
-            control.removeAttribute("readonly");
-          });
-
-          if (submitter) {
-            submitter.disabled = false;
-          }
-
-          if (eventTarget) {
-            const loader = eventTarget.querySelector(".small-loader");
-
-            if (loader) {
-              loader.classList.remove("loading");
-            }
-          }
-        })
-        .setErrorHandler(function () {
-          eventTarget.classList.remove("async-saving");
-
-          activeControls.forEach(function (control) {
-            control.removeAttribute("readonly");
-          });
-
-          if (submitter) {
-            submitter.disabled = false;
-          }
-
-          if (eventTarget) {
-            const loader = eventTarget.querySelector(".small-loader");
-
-            if (loader) {
-              loader.classList.remove("loading");
-            }
-          }
-        })
-        .send();
-    }
-  };
-}

package/src/async/AsyncDOM.js

@@ -1,55 +0,0 @@
-import DOM from "../core/DOM";
-
-export default class AsyncDOM {
-  invoke(domOps, element) {
-    for (let i = 0; i < domOps.length; ++i) {
-      let [type, selector, enableTarget, content] = domOps[i];
-
-      let node = enableTarget && element || null;
-
-      if (selector) {
-        node = (node || document.documentElement).querySelector(selector);
-      }
-
-      if (!node) {
-        if (typeof __DEV__ !== "undefined" && __DEV__) {
-          console.error(`Selector '${selector}' does not match anything!`)
-        }
-        continue;
-      }
-
-      switch (type) {
-        case "eval":
-          (new Function(content)).apply(node);
-          break;
-        case "hide":
-          node.style.display = "none";
-          break;
-        case "show":
-          node.style.display = "";
-          break;
-        case "setContent":
-          DOM.setContent(node, content.__html);
-          break;
-        case "appendContent":
-          DOM.appendContent(node, content.__html);
-          break;
-        case "prependContent":
-          DOM.prependContent(node, content.__html);
-          break;
-        case "insertAfter":
-          DOM.insertAfter(node, content.__html);
-          break;
-        case "insertBefore":
-          DOM.insertBefore(node, content.__html);
-          break;
-        case "remove":
-          DOM.remove(node);
-          break;
-        case "replace":
-          DOM.replace(node, content.__html);
-          break;
-      }
-    }
-  }
-};

package/src/async/AsyncResponse.js

@@ -1,21 +0,0 @@
-import AsyncDOM from "./AsyncDOM";
-import ServerJS from "../ServerJS";
-
-const _AsyncDOM = new AsyncDOM;
-const _ServerJS = new ServerJS;
-
-export default class AsyncResponse {
-  handle(response, element) {
-    const {domops, jsmods} = response;
-
-    if (typeof response === 'object') {
-      if (domops) {
-        _AsyncDOM.invoke(domops, element);
-      }
-
-      if (jsmods) {
-        _ServerJS.handle(jsmods);
-      }
-    }
-  }
-};