@oscarpalmer/abydon 0.8.0 → 0.9.0

package/dist/fragment.mjs

@@ -1,15 +1,16 @@
 // src/fragment.ts
-import {createTemplate, getNodes} from "./helpers/dom";
+import {html as html2} from "@oscarpalmer/toretto/html";
 import {parse} from "./html";
 import {mapNodes} from "./node";
 
 class Fragment {
+  $fragment = true;
   data;
   constructor(strings, expressions) {
     this.data = {
       expressions,
       strings,
-      nodes: [],
+      items: [],
       values: []
     };
   }
@@ -17,21 +18,30 @@ class Fragment {
     element.append(...this.get());
   }
   get() {
-    if (this.data.nodes.length === 0) {
+    if (this.data.items.length === 0) {
       const parsed = parse(this.data);
-      const templated = createTemplate(parsed);
-      this.data.nodes.splice(0, this.data.nodes.length, ...getNodes(templated));
-      mapNodes(this.data, this.data.nodes);
+      const templated = html2(parsed, {
+        sanitiseBooleanAttributes: false
+      });
+      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));
     }
-    return [...this.data.nodes];
+    return [
+      ...this.data.items.flatMap((item) => item.fragment?.get() ?? item.nodes)
+    ];
   }
   remove() {
-    const { length } = this.data.nodes;
+    const { length } = this.data.items;
     for (let index = 0;index < length; index += 1) {
-      const node2 = this.data.nodes[index];
-      node2.parentNode?.removeChild(node2);
+      const item = this.data.items[index];
+      item.fragment?.remove();
+      for (const node2 of item.nodes) {
+        node2.remove();
+      }
     }
-    this.data.nodes.splice(0, length);
+    this.data.items.splice(0, length);
   }
 }
 export {

package/dist/helpers/dom.mjs

@@ -1,31 +1,14 @@
 // src/helpers/dom.ts
 import {getString} from "@oscarpalmer/atoms/string";
-import {isFragment, isFragmentNode} from "./index";
+import {isFragment, isProperNode} from "./index";
 function createNodes(value) {
-  if (isFragmentNode(value)) {
-    return [value];
-  }
   if (isFragment(value)) {
     return value.get();
   }
-  return [new Text(getString(value))];
-}
-function createTemplate(html) {
-  const template = document.createElement("template");
-  template.innerHTML = html;
-  const cloned = template.content.cloneNode(true);
-  const scripts = [
-    ...cloned instanceof Element ? cloned.querySelectorAll("script") : []
-  ];
-  const { length } = scripts;
-  for (let index = 0;index < length; index += 1) {
-    scripts[index].remove();
+  if (isProperNode(value)) {
+    return [value];
   }
-  cloned.normalize();
-  return cloned;
-}
-function getNodes(node) {
-  return /^documentfragment$/i.test(node.constructor.name) ? [...node.childNodes] : [node];
+  return [new Text(getString(value))];
 }
 function replaceNodes(from, to) {
   const { length } = from;
@@ -40,7 +23,5 @@ function replaceNodes(from, to) {
 }
 export {
   replaceNodes,
-  getNodes,
-  createTemplate,
   createNodes
 };

package/dist/helpers/index.mjs

@@ -2,14 +2,14 @@
 function isFragment(value) {
   return typeof value === "object" && value != null && "$fragment" in value && value.$fragment === true;
 }
-function isFragmentElement(value) {
+function isProperElement(value) {
   return value instanceof HTMLElement || value instanceof SVGElement;
 }
-function isFragmentNode(value) {
-  return value instanceof Comment || value instanceof Element || value instanceof Text;
+function isProperNode(value) {
+  return value instanceof CharacterData || value instanceof Element;
 }
 export {
-  isFragmentNode,
-  isFragmentElement,
+  isProperNode,
+  isProperElement,
   isFragment
 };