@oscarpalmer/abydon 0.9.0 → 0.11.0

package/dist/fragment.mjs

@@ -2,10 +2,14 @@
 import {html as html2} from "@oscarpalmer/toretto/html";
 import {parse} from "./html";
 import {mapNodes} from "./node";
+import {removeNodes} from "./helpers/dom";
 
 class Fragment {
   $fragment = true;
   data;
+  get identifier() {
+    return this.data.identifier;
+  }
   constructor(strings, expressions) {
     this.data = {
       expressions,
@@ -26,20 +30,25 @@ class Fragment {
       this.data.items.splice(0, this.data.items.length, ...templated.map((node2) => ({
         nodes: [node2]
       })));
-      mapNodes(this.data, this.data.items.flatMap((item) => item.fragment?.get() ?? item.nodes));
+      mapNodes(this.data, this.data.items.flatMap((item) => item.fragments?.flatMap((fragment) => fragment.get()) ?? item.nodes));
     }
     return [
-      ...this.data.items.flatMap((item) => item.fragment?.get() ?? item.nodes)
+      ...this.data.items.flatMap((item) => item.fragments?.flatMap((fragment) => fragment.get()) ?? item.nodes)
     ];
   }
+  identify(identifier) {
+    this.data.identifier = identifier;
+    return this;
+  }
   remove() {
     const { length } = this.data.items;
     for (let index = 0;index < length; index += 1) {
-      const item = this.data.items[index];
-      item.fragment?.remove();
-      for (const node2 of item.nodes) {
-        node2.remove();
+      const { fragments, nodes } = this.data.items[index];
+      const { length: length2 } = fragments ?? [];
+      for (let index2 = 0;index2 < length2; index2 += 1) {
+        fragments?.[index2]?.remove();
       }
+      removeNodes(nodes);
     }
     this.data.items.splice(0, length);
   }

package/dist/helpers/dom.mjs

@@ -1,6 +1,7 @@
 // src/helpers/dom.ts
 import {getString} from "@oscarpalmer/atoms/string";
-import {isFragment, isProperNode} from "./index";
+import {isFragment, isProperElement, isProperNode} from "./index";
+import {removeEvents} from "../node/event";
 function createNodes(value) {
   if (isFragment(value)) {
     return value.get();
@@ -10,18 +11,34 @@ function createNodes(value) {
   }
   return [new Text(getString(value))];
 }
+function removeNodes(nodes) {
+  sanitiseNodes(nodes);
+  const { length } = nodes;
+  for (let index = 0;index < length; index += 1) {
+    nodes[index].remove();
+  }
+}
 function replaceNodes(from, to) {
+  from[0]?.replaceWith(...to);
   const { length } = from;
+  for (let index = 1;index < length; index += 1) {
+    from[index].remove();
+  }
+}
+function sanitiseNodes(nodes) {
+  const { length } = nodes;
   for (let index = 0;index < length; index += 1) {
-    const node = from[index];
-    if (index === 0) {
-      node.replaceWith(...to);
-    } else {
-      node.remove();
+    const node = nodes[index];
+    if (isProperElement(node)) {
+      removeEvents(node);
+    }
+    if (node.hasChildNodes()) {
+      sanitiseNodes([...node.childNodes]);
     }
   }
 }
 export {
   replaceNodes,
+  removeNodes,
   createNodes
 };

package/dist/helpers/index.mjs

@@ -1,4 +1,13 @@
 // src/helpers/index.ts
+function compareArrays(first, second) {
+  const firstIsLarger = first.length > second.length;
+  const from = firstIsLarger ? first : second;
+  const to = firstIsLarger ? second : first;
+  if (!from.filter((key) => to.includes(key)).every((key, index) => to[index] === key)) {
+    return "dissimilar";
+  }
+  return firstIsLarger ? "removed" : "added";
+}
 function isFragment(value) {
   return typeof value === "object" && value != null && "$fragment" in value && value.$fragment === true;
 }
@@ -11,5 +20,6 @@ function isProperNode(value) {
 export {
   isProperNode,
   isProperElement,
-  isFragment
+  isFragment,
+  compareArrays
 };