@domql/element 2.5.111 → 2.5.113

package/create.js

@@ -24,7 +24,7 @@ import {
   isNode,
   isUndefined,
   generateKey,
-  deepClone
+  deepCloneWithExtend
 } from '@domql/utils'
 
 import OPTIONS from './cache/options'
@@ -60,7 +60,7 @@ const create = (element, parent, key, options = OPTIONS.create || {}, attachOpti
   const ref = addRef(element, parent, key)
 
   // assign initial props
-  ref.__initialProps = deepClone(element.props, [])
+  ref.__initialProps = deepCloneWithExtend(element.props, [])
 
   // assign context
   applyContext(element, parent, options)

package/dist/cjs/create.js

@@ -57,7 +57,7 @@ const create = (element, parent, key, options = import_options.default.create ||
   parent = redefineParent(element, parent, key);
   key = createKey(element, parent, key);
   const ref = addRef(element, parent, key);
-  ref.__initialProps = (0, import_utils.deepClone)(element.props, []);
+  ref.__initialProps = (0, import_utils.deepCloneWithExtend)(element.props, []);
   applyContext(element, parent, options);
   (0, import_component.applyComponentFromContext)(element, parent, options);
   if (!ref.__skipCreate) {

package/dist/cjs/methods/index.js

@@ -141,6 +141,8 @@ const remove = function() {
     element.log();
   }
   delete element.parent[element.key];
+  if (element.parent.__ref)
+    element.parent.__ref.__children = (0, import_utils.removeValueFromArray)(element.parent.__ref.__children, element.key);
 };
 const get = function(param) {
   const element = this;

package/dist/cjs/mixins/content.js

@@ -43,22 +43,26 @@ const updateContent = function(params, options) {
   if (element.content.update)
     element.content.update(params, options);
 };
-const removeContent = function(el) {
+const removeContent = function(el, opts = {}) {
   const element = el || this;
   const { __ref } = element;
-  if (element.content) {
-    if (element.content.node && element.node) {
-      if (element.content.tag === "fragment")
+  const contentElementKey = opts.contentElementKey || "content";
+  if (element[contentElementKey]) {
+    if (element[contentElementKey].node && element.node) {
+      if (element[contentElementKey].tag === "fragment")
         element.node.innerHTML = "";
-      else
-        element.node.removeChild(element.content.node);
+      else {
+        const contentNode = element[contentElementKey].node;
+        if (contentNode.parentNode === element.node)
+          element.node.removeChild(element[contentElementKey].node);
+      }
     }
     const { __cached } = __ref;
-    if (__cached && __cached.content) {
-      if (__cached.content.tag === "fragment")
-        __cached.content.parent.node.innerHTML = "";
-      else if (__cached.content && (0, import_utils.isFunction)(__cached.content.remove))
-        __cached.content.remove();
+    if (__cached && __cached[contentElementKey]) {
+      if (__cached[contentElementKey].tag === "fragment")
+        __cached[contentElementKey].parent.node.innerHTML = "";
+      else if (__cached[contentElementKey] && (0, import_utils.isFunction)(__cached[contentElementKey].remove))
+        __cached[contentElementKey].remove();
     }
     delete element.content;
   }

package/dist/cjs/props/create.js

@@ -52,7 +52,7 @@ const syncProps = (props, element) => {
     const execProps = (0, import_utils.exec)(v, element);
     element.props = (0, import_utils.deepMerge)(
       mergedProps,
-      (0, import_utils.deepClone)(execProps, import_ignore.IGNORE_PROPS_PARAMS),
+      (0, import_utils.deepCloneWithExtend)(execProps, import_ignore.IGNORE_PROPS_PARAMS),
       import_ignore.IGNORE_PROPS_PARAMS
     );
   });

package/dist/cjs/update.js

@@ -213,11 +213,11 @@ const checkIfOnUpdate = (element, parent, options) => {
       };
       delete element.__ref;
       delete element.parent;
-      const created = (0, import_create.default)(element, parent, element.key, import_options.default.create, attachOptions);
+      const createdElement = (0, import_create.default)(element, parent, element.key, import_options.default.create, attachOptions);
       if (options.preventUpdate !== true && element.on && (0, import_utils.isFunction)(element.on.update)) {
-        (0, import_event.applyEvent)(element.on.update, created, created.state);
+        (0, import_event.applyEvent)(element.on.update, createdElement, createdElement.state);
       }
-      return created;
+      return createdElement;
     }
   } else if (element.node && !ifPassed) {
     element.node.remove();

package/dist/cjs/utils/object.js

@@ -126,10 +126,10 @@ const mergeIfExisted = (a, b) => {
   return a || b;
 };
 const mergeArray = (arr, exclude = ["parent", "node", "__element", "state", "context", "__ref"]) => {
-  return arr.reduce((a, c) => deepMerge(a, deepClone(c, exclude)), {});
+  return arr.reduce((a, c) => deepMerge(a, (0, import_utils.deepCloneWithExtend)(c, exclude)), {});
 };
 const mergeAndCloneIfArray = (obj) => {
-  return (0, import_utils.isArray)(obj) ? mergeArray(obj) : deepClone(obj);
+  return (0, import_utils.isArray)(obj) ? mergeArray(obj) : (0, import_utils.deepCloneWithExtend)(obj);
 };
 const flattenRecursive = (param, prop, stack = []) => {
   const objectized = mergeAndCloneIfArray(param);

package/methods/index.js

@@ -1,6 +1,6 @@
 'use strict'
 
-import { isDefined, isObject, isFunction, isObjectLike, isProduction } from '@domql/utils'
+import { isDefined, isObject, isFunction, isObjectLike, isProduction, removeValueFromArray } from '@domql/utils'
 import { TREE } from '../tree'
 import { parseFilters, registry } from '../mixins'
 
@@ -107,6 +107,7 @@ export const remove = function () {
     element.log()
   }
   delete element.parent[element.key]
+  if (element.parent.__ref) element.parent.__ref.__children = removeValueFromArray(element.parent.__ref.__children, element.key)
 }
 
 export const get = function (param) {

package/mixins/content.js

@@ -10,20 +10,24 @@ export const updateContent = function (params, options) {
   if (element.content.update) element.content.update(params, options)
 }
 
-export const removeContent = function (el) {
+export const removeContent = function (el, opts = {}) {
   const element = el || this
   const { __ref } = element
-
-  if (element.content) {
-    if (element.content.node && element.node) {
-      if (element.content.tag === 'fragment') element.node.innerHTML = ''
-      else element.node.removeChild(element.content.node)
+  const contentElementKey = opts.contentElementKey || 'content'
+
+  if (element[contentElementKey]) {
+    if (element[contentElementKey].node && element.node) {
+      if (element[contentElementKey].tag === 'fragment') element.node.innerHTML = ''
+      else {
+        const contentNode = element[contentElementKey].node
+        if (contentNode.parentNode === element.node) element.node.removeChild(element[contentElementKey].node)
+      }
     }
 
     const { __cached } = __ref
-    if (__cached && __cached.content) {
-      if (__cached.content.tag === 'fragment') __cached.content.parent.node.innerHTML = ''
-      else if (__cached.content && isFunction(__cached.content.remove)) __cached.content.remove()
+    if (__cached && __cached[contentElementKey]) {
+      if (__cached[contentElementKey].tag === 'fragment') __cached[contentElementKey].parent.node.innerHTML = ''
+      else if (__cached[contentElementKey] && isFunction(__cached[contentElementKey].remove)) __cached[contentElementKey].remove()
     }
 
     delete element.content

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domql/element",
-  "version": "2.5.111",
+  "version": "2.5.113",
   "license": "MIT",
   "type": "module",
   "module": "index.js",
@@ -31,7 +31,7 @@
     "@domql/state": "latest",
     "@domql/utils": "latest"
   },
-  "gitHead": "ec0f20662c99a27fa314328fc20e4c2ac2650cde",
+  "gitHead": "8436abbfa2752c4659982516ff9ad1db80862e42",
   "devDependencies": {
     "@babel/core": "^7.12.0"
   }

package/props/create.js

@@ -1,6 +1,6 @@
 'use strict'
 
-import { exec, isArray, isObject, deepClone, deepMerge } from '@domql/utils'
+import { exec, isArray, isObject, deepCloneWithExtend, deepMerge } from '@domql/utils'
 import { IGNORE_PROPS_PARAMS } from './ignore'
 
 import { inheritParentProps } from './inherit'
@@ -36,7 +36,7 @@ export const syncProps = (props, element) => {
     // it was causing infinite loop at early days
     element.props = deepMerge(
       mergedProps,
-      deepClone(execProps, IGNORE_PROPS_PARAMS),
+      deepCloneWithExtend(execProps, IGNORE_PROPS_PARAMS),
       IGNORE_PROPS_PARAMS
     )
   })

package/update.js

@@ -223,12 +223,12 @@ const checkIfOnUpdate = (element, parent, options) => {
 
       delete element.__ref
       delete element.parent
-      const created = create(element, parent, element.key, OPTIONS.create, attachOptions)
+      const createdElement = create(element, parent, element.key, OPTIONS.create, attachOptions)
       // check preventUpdate for an array (Line: 87)
       if (options.preventUpdate !== true && element.on && isFunction(element.on.update)) {
-        applyEvent(element.on.update, created, created.state)
+        applyEvent(element.on.update, createdElement, createdElement.state)
       }
-      return created
+      return createdElement
     }
   } else if (element.node && !ifPassed) {
     element.node.remove()

package/utils/object.js

@@ -1,6 +1,6 @@
 'use strict'
 
-import { isArray, isObject, isObjectLike, joinArrays } from '@domql/utils'
+import { isArray, isObject, isObjectLike, joinArrays, deepCloneWithExtend } from '@domql/utils'
 import { IGNORE_STATE_PARAMS } from '@domql/state'
 import { IGNORE_PROPS_PARAMS } from '../props'
 import { METHODS } from '../methods'
@@ -115,14 +115,14 @@ export const mergeIfExisted = (a, b) => {
  * Merges array extends
  */
 export const mergeArray = (arr, exclude = ['parent', 'node', '__element', 'state', 'context', '__ref']) => {
-  return arr.reduce((a, c) => deepMerge(a, deepClone(c, exclude)), {})
+  return arr.reduce((a, c) => deepMerge(a, deepCloneWithExtend(c, exclude)), {})
 }
 
 /**
  * Merges array extends
  */
 export const mergeAndCloneIfArray = obj => {
-  return isArray(obj) ? mergeArray(obj) : deepClone(obj)
+  return isArray(obj) ? mergeArray(obj) : deepCloneWithExtend(obj)
 }
 
 /**