@medyll/idae-be 0.80.0 → 0.81.0

package/dist/modules/dom.d.ts

@@ -17,6 +17,11 @@ declare enum domMethods {
 }
 type Content = string | HTMLElement | Be;
 export interface DomHandlerHandle {
+    insert?: {
+        content: string | HTMLElement | Be;
+        mode: 'afterbegin' | 'afterend' | 'beforebegin' | 'beforeend';
+        callback?: (element: HandlerCallbackProps) => void;
+    };
     update?: {
         content: Content;
         callback?: (element: HandlerCallbackProps) => void;
@@ -80,8 +85,8 @@ export declare class DomHandler implements DomHandlerInterface, CommonHandler<Do
     update(content: string, callback?: HandlerCallBackFn): Be;
     append(content: Content, callback?: HandlerCallBackFn): Be;
     prepend(content: Content, callback?: HandlerCallBackFn): Be;
-    insert(mode: 'afterbegin' | 'afterend' | 'beforebegin' | 'beforeend', element: HTMLElement | Be, callback?: HandlerCallBackFn): Be;
-    afterBegin(content: HTMLElement, callback?: HandlerCallBackFn): Be;
+    insert(mode: 'afterbegin' | 'afterend' | 'beforebegin' | 'beforeend', element: HTMLElement | Be | string, callback?: HandlerCallBackFn): Be;
+    afterBegin(content: Content, callback?: HandlerCallBackFn): Be;
     afterEnd(content: Content, callback?: HandlerCallBackFn): Be;
     beforeBegin(content: Content, callback?: HandlerCallBackFn): Be;
     beforeEnd(content: Content, callback?: HandlerCallBackFn): Be;
@@ -91,6 +96,8 @@ export declare class DomHandler implements DomHandlerInterface, CommonHandler<Do
     normalize(callback?: HandlerCallBackFn): Be;
     wrap(tag?: string, callback?: HandlerCallBackFn): Be;
     private adjacentElement;
+    private normalizeContent;
+    private insertContent;
     valueOf(): string | null;
 }
 export {};

package/dist/modules/dom.js

@@ -79,15 +79,13 @@ export class DomHandler {
     append(content, callback) {
         const ret = [];
         this.beElement.eachNode((el) => {
-            if (content instanceof Be) {
-                content.eachNode((child) => {
-                    ret.push(child);
-                    el.appendChild(child);
-                });
+            const normalizedContent = this.normalizeContent(content);
+            if (normalizedContent instanceof DocumentFragment) {
+                el.appendChild(normalizedContent);
             }
             else {
-                ret.push(content);
-                el.appendChild(content);
+                ret.push(normalizedContent);
+                el.appendChild(normalizedContent);
             }
         });
         callback?.({
@@ -100,15 +98,13 @@ export class DomHandler {
     prepend(content, callback) {
         const ret = [];
         this.beElement.eachNode((el) => {
-            if (content instanceof Be) {
-                content.eachNode((child) => {
-                    ret.push(child);
-                    el.insertBefore(child, el.firstChild);
-                });
+            const normalizedContent = this.normalizeContent(content);
+            if (normalizedContent instanceof DocumentFragment) {
+                el.insertBefore(normalizedContent, el.firstChild);
             }
             else {
-                ret.push(content);
-                el.insertBefore(content, el.firstChild);
+                ret.push(normalizedContent);
+                el.insertBefore(normalizedContent, el.firstChild);
             }
         });
         callback?.({
@@ -128,6 +124,8 @@ export class DomHandler {
                 return this.beforeBegin(element, callback);
             case 'beforeend':
                 return this.beforeEnd(element, callback);
+            default:
+                throw new Error(`Invalid mode: ${mode}`);
         }
     }
     afterBegin(content, callback) {
@@ -142,29 +140,51 @@ export class DomHandler {
         return this.beElement;
     }
     afterEnd(content, callback) {
-        this.append(content, callback);
+        this.beElement.eachNode((el) => {
+            // Insérer après l'élément cible
+            el.parentNode?.insertBefore(this.normalizeContent(content), el.nextSibling);
+            callback?.({
+                fragment: content,
+                be: be(el),
+                root: this.beElement
+            });
+        });
         return this.beElement;
     }
     beforeBegin(content, callback) {
-        this.prepend(content, callback);
+        this.beElement.eachNode((el) => {
+            // Insérer avant l'élément cible
+            el.parentNode?.insertBefore(this.normalizeContent(content), el);
+            callback?.({
+                fragment: content,
+                be: be(el),
+                root: this.beElement
+            });
+        });
         return this.beElement;
     }
     beforeEnd(content, callback) {
-        this.append(content, callback);
+        this.beElement.eachNode((el) => {
+            // Insérer à la fin de l'élément cible
+            el.appendChild(this.normalizeContent(content));
+            callback?.({
+                fragment: content,
+                be: be(el),
+                root: this.beElement
+            });
+        });
         return this.beElement;
     }
     replace(content, callback) {
         const ret = [];
         this.beElement.eachNode((el) => {
-            if (content instanceof Be) {
-                content.eachNode((child) => {
-                    ret.push(child);
-                    el.replaceWith(child);
-                });
+            const normalizedContent = this.normalizeContent(content);
+            if (normalizedContent instanceof DocumentFragment) {
+                el.replaceWith(...normalizedContent.childNodes);
             }
             else {
-                ret.push(content);
-                el.replaceWith(content);
+                ret.push(normalizedContent);
+                el.replaceWith(normalizedContent);
             }
         });
         callback?.({
@@ -223,8 +243,74 @@ export class DomHandler {
         return this.beElement;
     }
     adjacentElement(element, content, mode) {
-        element.insertAdjacentElement(mode, content);
-        return this.beElement;
+        const normalizedContent = this.normalizeContent(content);
+        if (typeof content === 'string') {
+            // Si le contenu est une chaîne HTML, utilisez insertAdjacentHTML
+            element.insertAdjacentHTML(mode, content);
+        }
+        else if (normalizedContent instanceof HTMLElement) {
+            // Si le contenu est un élément DOM, utilisez insertAdjacentElement
+            if (mode === 'afterend') {
+                element.parentNode?.insertBefore(normalizedContent, element.nextSibling);
+            }
+            else if (mode === 'beforebegin') {
+                element.parentNode?.insertBefore(normalizedContent, element);
+            }
+            else {
+                element.insertAdjacentElement(mode, normalizedContent);
+            }
+        }
+        else if (normalizedContent instanceof DocumentFragment) {
+            // Si le contenu est un fragment, insérez chaque nœud
+            Array.from(normalizedContent.childNodes).forEach((node) => {
+                if (mode === 'afterbegin' || mode === 'beforeend') {
+                    element.appendChild(node);
+                }
+                else if (mode === 'afterend') {
+                    element.parentNode?.insertBefore(node, element.nextSibling);
+                }
+                else if (mode === 'beforebegin') {
+                    element.parentNode?.insertBefore(node, element);
+                }
+            });
+        }
+    }
+    normalizeContent(content) {
+        if (typeof content === 'string') {
+            // Si le contenu est une chaîne HTML, créez un fragment DOM
+            const template = document.createElement('template');
+            template.innerHTML = content.trim();
+            return template.content;
+        }
+        else if (content instanceof Be) {
+            // Si le contenu est une instance de Be, utilisez son premier nœud
+            if (Array.isArray(content.node)) {
+                const fragment = document.createDocumentFragment();
+                content.node.forEach((node) => {
+                    if (node instanceof HTMLElement) {
+                        fragment.appendChild(node);
+                    }
+                });
+                return fragment;
+            }
+            else if (content.node instanceof HTMLElement) {
+                return content.node;
+            }
+            throw new Error('Invalid Be instance: no valid node found.');
+        }
+        else {
+            // Sinon, le contenu est déjà un HTMLElement
+            return content;
+        }
+    }
+    insertContent(el, content, mode) {
+        const normalizedContent = this.normalizeContent(content);
+        if (mode === 'afterEnd') {
+            el.parentNode?.insertBefore(normalizedContent, el.nextSibling);
+        }
+        else if (mode === 'beforeEnd') {
+            el.appendChild(normalizedContent);
+        }
     }
     valueOf() {
         if (this.beElement.isWhat !== 'element')

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@medyll/idae-be",
 	"scope": "@medyll",
-	"version": "0.80.0",
+	"version": "0.81.0",
 	"description": "A powerful DOM manipulation library with a callback-based approach for precise element targeting. Provides consistent chaining, comprehensive DOM traversal, event handling, style management, and more. Written in TypeScript for modern browsers.",
 	"scripts": {
 		"dev": "vite dev",