Welcome to mirror list, hosted at ThFree Co, Russian Federation.

github.com/gohugoio/hugo-mod-jslibs-dist.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
path: root/alpinejs/packages/morph/dist/module.cjs.js
diff options
context:
space:
mode:
Diffstat (limited to 'alpinejs/packages/morph/dist/module.cjs.js')
-rw-r--r--alpinejs/packages/morph/dist/module.cjs.js254
1 files changed, 182 insertions, 72 deletions
diff --git a/alpinejs/packages/morph/dist/module.cjs.js b/alpinejs/packages/morph/dist/module.cjs.js
index d3b7faa..260bf1f 100644
--- a/alpinejs/packages/morph/dist/module.cjs.js
+++ b/alpinejs/packages/morph/dist/module.cjs.js
@@ -4,6 +4,13 @@ var __export = (target, all) => {
for (var name in all)
__defProp(target, name, {get: all[name], enumerable: true});
};
+var __publicField = (obj, key2, value) => {
+ if (typeof key2 !== "symbol")
+ key2 += "";
+ if (key2 in obj)
+ return __defProp(obj, key2, {enumerable: true, configurable: true, writable: true, value});
+ return obj[key2] = value;
+};
// packages/morph/builds/module.js
__markAsModule(exports);
@@ -13,11 +20,36 @@ __export(exports, {
});
// packages/morph/src/morph.js
-function morph(dom, toHtml, options) {
+var resolveStep = () => {
+};
+var logger = () => {
+};
+var fromEl;
+var toEl;
+function breakpoint(message) {
+ if (!debug)
+ return;
+ logger((message || "").replace("\n", "\\n"), fromEl, toEl);
+ return new Promise((resolve) => resolveStep = () => resolve());
+}
+async function morph(from, toHtml, options) {
assignOptions(options);
- patch(dom, createElement(toHtml));
- return dom;
+ fromEl = from;
+ toEl = createElement(toHtml);
+ if (window.Alpine && !from._x_dataStack) {
+ toEl._x_dataStack = window.Alpine.closestDataStack(from);
+ toEl._x_dataStack && window.Alpine.clone(from, toEl);
+ }
+ await breakpoint();
+ await patch(from, toEl);
+ fromEl = void 0;
+ toEl = void 0;
+ return from;
}
+morph.step = () => resolveStep();
+morph.log = (theLogger) => {
+ logger = theLogger;
+};
var key;
var lookahead;
var updating;
@@ -26,91 +58,100 @@ var removing;
var removed;
var adding;
var added;
+var debug;
var noop = () => {
};
function assignOptions(options = {}) {
let defaultGetKey = (el) => el.getAttribute("key");
- key = options.key || defaultGetKey;
- lookahead = options.lookahead || false;
updating = options.updating || noop;
updated = options.updated || noop;
removing = options.removing || noop;
removed = options.removed || noop;
adding = options.adding || noop;
added = options.added || noop;
+ key = options.key || defaultGetKey;
+ lookahead = options.lookahead || false;
+ debug = options.debug || false;
}
function createElement(html) {
return document.createRange().createContextualFragment(html).firstElementChild;
}
-function patch(dom, to) {
- if (dom.isEqualNode(to))
- return;
- if (differentElementNamesTypesOrKeys(dom, to)) {
- return patchElement(dom, to);
+async function patch(from, to) {
+ if (differentElementNamesTypesOrKeys(from, to)) {
+ let result = patchElement(from, to);
+ await breakpoint("Swap elements");
+ return result;
}
let updateChildrenOnly = false;
- if (shouldSkip(updating, dom, to, () => updateChildrenOnly = true))
+ if (shouldSkip(updating, from, to, () => updateChildrenOnly = true))
return;
+ window.Alpine && initializeAlpineOnTo(from, to, () => updateChildrenOnly = true);
if (textOrComment(to)) {
- patchNodeValue(dom, to);
- updated(dom, to);
+ await patchNodeValue(from, to);
+ updated(from, to);
return;
}
if (!updateChildrenOnly) {
- patchAttributes(dom, to);
+ await patchAttributes(from, to);
}
- updated(dom, to);
- patchChildren(dom, to);
+ updated(from, to);
+ await patchChildren(from, to);
}
-function differentElementNamesTypesOrKeys(dom, to) {
- return dom.nodeType != to.nodeType || dom.nodeName != to.nodeName || getKey(dom) != getKey(to);
+function differentElementNamesTypesOrKeys(from, to) {
+ return from.nodeType != to.nodeType || from.nodeName != to.nodeName || getKey(from) != getKey(to);
}
function textOrComment(el) {
return el.nodeType === 3 || el.nodeType === 8;
}
-function patchElement(dom, to) {
- if (shouldSkip(removing, dom))
+function patchElement(from, to) {
+ if (shouldSkip(removing, from))
return;
let toCloned = to.cloneNode(true);
if (shouldSkip(adding, toCloned))
return;
- dom.parentNode.replaceChild(toCloned, dom);
- removed(dom);
+ dom(from).replace(toCloned);
+ removed(from);
added(toCloned);
}
-function patchNodeValue(dom, to) {
+async function patchNodeValue(from, to) {
let value = to.nodeValue;
- if (dom.nodeValue !== value)
- dom.nodeValue = value;
+ if (from.nodeValue !== value) {
+ from.nodeValue = value;
+ await breakpoint("Change text node to: " + value);
+ }
}
-function patchAttributes(dom, to) {
- if (dom._x_isShown && !to._x_isShown) {
+async function patchAttributes(from, to) {
+ if (from._x_isShown && !to._x_isShown) {
return;
}
- if (!dom._x_isShown && to._x_isShown) {
+ if (!from._x_isShown && to._x_isShown) {
return;
}
- let domAttributes = Array.from(dom.attributes);
+ let domAttributes = Array.from(from.attributes);
let toAttributes = Array.from(to.attributes);
for (let i = domAttributes.length - 1; i >= 0; i--) {
let name = domAttributes[i].name;
- if (!to.hasAttribute(name))
- dom.removeAttribute(name);
+ if (!to.hasAttribute(name)) {
+ from.removeAttribute(name);
+ await breakpoint("Remove attribute");
+ }
}
for (let i = toAttributes.length - 1; i >= 0; i--) {
let name = toAttributes[i].name;
let value = toAttributes[i].value;
- if (dom.getAttribute(name) !== value)
- dom.setAttribute(name, value);
+ if (from.getAttribute(name) !== value) {
+ from.setAttribute(name, value);
+ await breakpoint(`Set [${name}] attribute to: "${value}"`);
+ }
}
}
-function patchChildren(dom, to) {
- let domChildren = dom.childNodes;
+async function patchChildren(from, to) {
+ let domChildren = from.childNodes;
let toChildren = to.childNodes;
let toKeyToNodeMap = keyToMap(toChildren);
let domKeyDomNodeMap = keyToMap(domChildren);
- let currentTo = to.firstChild;
- let currentFrom = dom.firstChild;
+ let currentTo = dom(to).nodes().first();
+ let currentFrom = dom(from).nodes().first();
let domKeyHoldovers = {};
while (currentTo) {
let toKey = getKey(currentTo);
@@ -118,19 +159,27 @@ function patchChildren(dom, to) {
if (!currentFrom) {
if (toKey && domKeyHoldovers[toKey]) {
let holdover = domKeyHoldovers[toKey];
- dom.appendChild(holdover);
+ dom(from).append(holdover);
currentFrom = holdover;
+ await breakpoint("Add element (from key)");
} else {
- addNodeTo(currentTo, dom);
- currentTo = currentTo.nextSibling;
+ let added2 = addNodeTo(currentTo, from) || {};
+ await breakpoint("Add element: " + added2.outerHTML || added2.nodeValue);
+ currentTo = dom(currentTo).nodes().next();
continue;
}
}
if (lookahead) {
- let nextToElementSibling = currentTo.nextElementSibling;
- if (nextToElementSibling && currentFrom.isEqualNode(nextToElementSibling)) {
- currentFrom = addNodeBefore(currentTo, currentFrom);
- domKey = getKey(currentFrom);
+ let nextToElementSibling = dom(currentTo).next();
+ let found = false;
+ while (!found && nextToElementSibling) {
+ if (currentFrom.isEqualNode(nextToElementSibling)) {
+ found = true;
+ currentFrom = addNodeBefore(currentTo, currentFrom);
+ domKey = getKey(currentFrom);
+ await breakpoint("Move element (lookahead)");
+ }
+ nextToElementSibling = dom(nextToElementSibling).next();
}
}
if (toKey !== domKey) {
@@ -138,43 +187,49 @@ function patchChildren(dom, to) {
domKeyHoldovers[domKey] = currentFrom;
currentFrom = addNodeBefore(currentTo, currentFrom);
domKeyHoldovers[domKey].remove();
- currentFrom = currentFrom.nextSibling;
- currentTo = currentTo.nextSibling;
+ currentFrom = dom(currentFrom).nodes().next();
+ currentTo = dom(currentTo).nodes().next();
+ await breakpoint('No "to" key');
continue;
}
if (toKey && !domKey) {
if (domKeyDomNodeMap[toKey]) {
- currentFrom.parentElement.replaceChild(domKeyDomNodeMap[toKey], currentFrom);
- currentFrom = domKeyDomNodeMap[toKey];
+ currentFrom = dom(currentFrom).replace(domKeyDomNodeMap[toKey]);
+ await breakpoint('No "from" key');
}
}
if (toKey && domKey) {
domKeyHoldovers[domKey] = currentFrom;
let domKeyNode = domKeyDomNodeMap[toKey];
if (domKeyNode) {
- currentFrom.parentElement.replaceChild(domKeyNode, currentFrom);
- currentFrom = domKeyNode;
+ currentFrom = dom(currentFrom).replace(domKeyNode);
+ await breakpoint('Move "from" key');
} else {
domKeyHoldovers[domKey] = currentFrom;
currentFrom = addNodeBefore(currentTo, currentFrom);
domKeyHoldovers[domKey].remove();
- currentFrom = currentFrom.nextSibling;
- currentTo = currentTo.nextSibling;
+ currentFrom = dom(currentFrom).next();
+ currentTo = dom(currentTo).next();
+ await breakpoint("I dont even know what this does");
continue;
}
}
}
- patch(currentFrom, currentTo);
- currentTo = currentTo && currentTo.nextSibling;
- currentFrom = currentFrom && currentFrom.nextSibling;
+ await patch(currentFrom, currentTo);
+ currentTo = currentTo && dom(currentTo).nodes().next();
+ currentFrom = currentFrom && dom(currentFrom).nodes().next();
}
+ let removals = [];
while (currentFrom) {
- if (!shouldSkip(removing, currentFrom)) {
- let domForRemoval = currentFrom;
- dom.removeChild(domForRemoval);
- removed(domForRemoval);
- }
- currentFrom = currentFrom.nextSibling;
+ if (!shouldSkip(removing, currentFrom))
+ removals.push(currentFrom);
+ currentFrom = dom(currentFrom).nodes().next();
+ }
+ while (removals.length) {
+ let domForRemoval = removals.pop();
+ domForRemoval.remove();
+ await breakpoint("remove el");
+ removed(domForRemoval);
}
}
function getKey(el) {
@@ -198,31 +253,86 @@ function shouldSkip(hook, ...args) {
function addNodeTo(node, parent) {
if (!shouldSkip(adding, node)) {
let clone = node.cloneNode(true);
- parent.appendChild(clone);
+ dom(parent).append(clone);
added(clone);
+ return clone;
}
+ return null;
}
function addNodeBefore(node, beforeMe) {
if (!shouldSkip(adding, node)) {
let clone = node.cloneNode(true);
- beforeMe.parentElement.insertBefore(clone, beforeMe);
+ dom(beforeMe).before(clone);
added(clone);
return clone;
}
return beforeMe;
}
+function initializeAlpineOnTo(from, to, childrenOnly) {
+ if (from.nodeType !== 1)
+ return;
+ if (from._x_dataStack) {
+ window.Alpine.clone(from, to);
+ }
+}
+function dom(el) {
+ return new DomManager(el);
+}
+var DomManager = class {
+ constructor(el) {
+ __publicField(this, "el");
+ __publicField(this, "traversals", {
+ first: "firstElementChild",
+ next: "nextElementSibling",
+ parent: "parentElement"
+ });
+ this.el = el;
+ }
+ nodes() {
+ this.traversals = {
+ first: "firstChild",
+ next: "nextSibling",
+ parent: "parentNode"
+ };
+ return this;
+ }
+ first() {
+ return this.teleportTo(this.el[this.traversals["first"]]);
+ }
+ next() {
+ return this.teleportTo(this.teleportBack(this.el[this.traversals["next"]]));
+ }
+ before(insertee) {
+ this.el[this.traversals["parent"]].insertBefore(insertee, this.el);
+ return insertee;
+ }
+ replace(replacement) {
+ this.el[this.traversals["parent"]].replaceChild(replacement, this.el);
+ return replacement;
+ }
+ append(appendee) {
+ this.el.appendChild(appendee);
+ return appendee;
+ }
+ teleportTo(el) {
+ if (!el)
+ return el;
+ if (el._x_teleport)
+ return el._x_teleport;
+ return el;
+ }
+ teleportBack(el) {
+ if (!el)
+ return el;
+ if (el._x_teleportBack)
+ return el._x_teleportBack;
+ return el;
+ }
+};
// packages/morph/src/index.js
function src_default(Alpine) {
- Alpine.directive("morph", (el, {expression}, {effect, evaluateLater}) => {
- let evaluate = evaluateLater(expression);
- effect(() => {
- evaluate((value) => {
- let child = el.firstElementChild || el.firstChild || el.appendChild(document.createTextNode(""));
- morph(child, value);
- });
- });
- });
+ Alpine.morph = morph;
}
// packages/morph/builds/module.js
generated by cgit v1.2.3 (git 2.25.1) at 2024-06-01 15:39:02 +0300