@domql/state 2.3.122 → 2.3.123

package/createState.js

@@ -12,16 +12,17 @@ export const createState = function (element, parent, opts) {
 
   const objectizeState = checkForTypes(element)
   if (objectizeState === false) return parent.state || {}
-  else element.state = objectizeState
+  else element.state = deepClone(objectizeState, IGNORE_STATE_PARAMS)
 
   const whatInitReturns = triggerEventOn('stateInit', element)
   if (whatInitReturns === false) return element.state
 
   if (checkIfInherits(element)) {
-    element.state = createInheritedState(element, parent) || {}
+    const inheritedState = createInheritedState(element, parent)
+    element.state = inheritedState || {}
   }
 
-  const dependentState = applyDependentState(element, state)
+  const dependentState = applyDependentState(element, element.state)
   if (dependentState) element.state = dependentState
 
   // NOTE: Only true when 'onlyResolveExtends' option is set to true

package/dist/cjs/createState.js

@@ -33,14 +33,15 @@ const createState = function(element, parent, opts) {
   if (objectizeState === false)
     return parent.state || {};
   else
-    element.state = objectizeState;
+    element.state = (0, import_utils.deepClone)(objectizeState, import_ignore.IGNORE_STATE_PARAMS);
   const whatInitReturns = (0, import_event.triggerEventOn)("stateInit", element);
   if (whatInitReturns === false)
     return element.state;
   if ((0, import_inherit.checkIfInherits)(element)) {
-    element.state = (0, import_inherit.createInheritedState)(element, parent) || {};
+    const inheritedState = (0, import_inherit.createInheritedState)(element, parent);
+    element.state = inheritedState || {};
   }
-  const dependentState = applyDependentState(element, state);
+  const dependentState = applyDependentState(element, element.state);
   if (dependentState)
     element.state = dependentState;
   if (skip)
@@ -49,8 +50,8 @@ const createState = function(element, parent, opts) {
   (0, import_event.triggerEventOn)("stateCreated", element);
   return element.state;
 };
-const applyDependentState = (element, state2) => {
-  const { __ref: ref } = state2;
+const applyDependentState = (element, state) => {
+  const { __ref: ref } = state;
   if (!ref)
     return;
   const dependentState = (0, import_utils.deepClone)(ref, import_ignore.IGNORE_STATE_PARAMS);
@@ -59,42 +60,42 @@ const applyDependentState = (element, state2) => {
   return dependentState;
 };
 const checkForTypes = (element) => {
-  const { state: state2, __ref: ref } = element;
-  if ((0, import_utils.isFunction)(state2)) {
-    ref.__state = state2;
-    return (0, import_utils.exec)(state2, element);
+  const { state, __ref: ref } = element;
+  if ((0, import_utils.isFunction)(state)) {
+    ref.__state = state;
+    return (0, import_utils.exec)(state, element);
   }
-  if ((0, import_utils.is)(state2)("string", "number")) {
-    ref.__state = state2;
+  if ((0, import_utils.is)(state)("string", "number")) {
+    ref.__state = state;
     return {};
   }
-  if (state2 === true) {
+  if (state === true) {
     ref.__state = element.key;
     return {};
   }
-  if (state2) {
+  if (state) {
     ref.__hasRootState = true;
-    return state2;
+    return state;
   }
   return false;
 };
 const applyMethods = (element) => {
-  const state2 = element.state;
+  const state = element.state;
   const ref = element.__ref;
-  state2.clean = import_methods.clean;
-  state2.parse = import_methods.parse;
-  state2.destroy = import_methods.destroy;
-  state2.update = import_updateState.updateState;
-  state2.rootUpdate = import_methods.rootUpdate;
-  state2.create = createState;
-  state2.add = import_methods.add;
-  state2.toggle = import_methods.toggle;
-  state2.remove = import_methods.remove;
-  state2.apply = import_methods.apply;
-  state2.parent = element.parent.state;
-  state2.__element = element;
-  state2.__children = {};
-  state2.__root = ref.__root ? ref.__root.state : state2;
-  if (state2.parent)
-    state2.parent.__children[element.key] = state2;
+  state.clean = import_methods.clean;
+  state.parse = import_methods.parse;
+  state.destroy = import_methods.destroy;
+  state.update = import_updateState.updateState;
+  state.rootUpdate = import_methods.rootUpdate;
+  state.create = createState;
+  state.add = import_methods.add;
+  state.toggle = import_methods.toggle;
+  state.remove = import_methods.remove;
+  state.apply = import_methods.apply;
+  state.parent = element.parent.state;
+  state.__element = element;
+  state.__children = {};
+  state.__root = ref.__root ? ref.__root.state : state;
+  if (state.parent)
+    state.parent.__children[element.key] = state;
 };

package/dist/cjs/inherit.js

@@ -19,6 +19,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var inherit_exports = {};
 __export(inherit_exports, {
   checkIfInherits: () => checkIfInherits,
+  createChangesByKey: () => createChangesByKey,
   createInheritedState: () => createInheritedState,
   findInheritedState: () => findInheritedState,
   getChildStateInKey: () => getChildStateInKey,
@@ -27,7 +28,10 @@ __export(inherit_exports, {
 });
 module.exports = __toCommonJS(inherit_exports);
 var import_utils = require("@domql/utils");
+var import_ignore = require("./ignore");
 const getParentStateInKey = (stateKey2, parentState) => {
+  if (!stateKey2.includes("../"))
+    return;
   const arr = stateKey2.split("../");
   const arrLength = arr.length - 1;
   for (let i = 0; i < arrLength; i++) {
@@ -37,7 +41,7 @@ const getParentStateInKey = (stateKey2, parentState) => {
   }
   return parentState;
 };
-const getChildStateInKey = (stateKey2, parentState) => {
+const getChildStateInKey = (stateKey2, parentState, options) => {
   const arr = stateKey2.split("/");
   const arrLength = arr.length - 1;
   for (let i = 0; i < arrLength; i++) {
@@ -50,29 +54,32 @@ const getChildStateInKey = (stateKey2, parentState) => {
     } else
       return;
   }
+  if (options.returnParent)
+    return parentState;
   return parentState[stateKey2];
 };
-const findInheritedState = (element, parent) => {
+const findInheritedState = (element, parent, options = {}) => {
   const ref = element.__ref;
   let stateKey2 = ref.__state;
-  if (!stateKey2 || (0, import_utils.isNot)(stateKey2)("number", "string"))
-    return element.state;
+  if (!checkIfInherits(element))
+    return;
   let parentState = parent.state;
-  if (stateKey2.includes("../")) {
-    parentState = getParentStateInKey(stateKey2, parent.state);
+  const findGrandParentState = getParentStateInKey(stateKey2, parent.state);
+  if (findGrandParentState) {
+    parentState = findGrandParentState;
     stateKey2 = stateKey2.replaceAll("../", "");
   }
   if (!parentState)
     return;
-  return getChildStateInKey(stateKey2, parentState);
+  return getChildStateInKey(stateKey2, parentState, options);
 };
 const createInheritedState = (element, parent) => {
   const ref = element.__ref;
   const inheritedState = findInheritedState(element, parent);
   if (!inheritedState)
-    return;
+    return element.state;
   if ((0, import_utils.is)(inheritedState)("object", "array")) {
-    return (0, import_utils.deepClone)(inheritedState);
+    return (0, import_utils.deepClone)(inheritedState, import_ignore.IGNORE_STATE_PARAMS);
   } else if ((0, import_utils.is)(inheritedState)("string", "number")) {
     ref.__stateType = "string";
     return { value: inheritedState };
@@ -92,3 +99,16 @@ const isState = function(state) {
   const keys = Object.keys(state);
   return (0, import_utils.arrayContainsOtherArray)(keys, ["update", "parse", "clean", "create", "parent", "rootUpdate"]);
 };
+const createChangesByKey = (path, value) => {
+  if (!path) {
+    return value || {};
+  }
+  const keys = path.split("/");
+  let obj = {};
+  let ref = obj;
+  keys.forEach((key, index) => {
+    ref[key] = index === keys.length - 1 ? value || {} : {};
+    ref = ref[key];
+  });
+  return obj;
+};

package/dist/cjs/methods.js

@@ -84,13 +84,15 @@ const add = function(value, options = {}) {
   const state = this;
   if ((0, import_utils.isArray)(state)) {
     state.push(value);
-    state.update(state.parse(), { skipOverwrite: true, ...options });
+    state.update(state.parse(), { replace: true, ...options });
+  } else if ((0, import_utils.isObject)(state)) {
+    const key = Object.keys(state).length;
+    state.update({ [key]: value }, options);
   }
 };
 const toggle = function(key, options = {}) {
   const state = this;
-  state[key] = !state[key];
-  state.update({ [key]: !state[key] }, { skipOverwrite: true, ...options });
+  state.update({ [key]: !state[key] }, options);
 };
 const remove = function(key, options = {}) {
   const state = this;
@@ -98,12 +100,12 @@ const remove = function(key, options = {}) {
     (0, import_utils.removeFromArray)(state, key);
   if ((0, import_utils.isObject)(state))
     (0, import_utils.removeFromObject)(state, key);
-  return state.update(state.parse(), { skipOverwrite: true, ...options });
+  return state.update(state.parse(), { replace: true, ...options });
 };
 const apply = function(func, options = {}) {
   const state = this;
   if ((0, import_utils.isFunction)(func)) {
     func(state);
-    return state.update(state, { skipOverwrite: true, ...options });
+    return state.update(state, { replace: true, ...options });
   }
 };

package/dist/cjs/updateState.js

@@ -26,7 +26,10 @@ var import_event = require("@domql/event");
 var import_ignore = require("./ignore");
 var import_utils = require("@domql/utils");
 var import_inherit = require("./inherit");
-const updateState = function(obj, options = {}) {
+const STATE_UPDATE_OPTIONS = {
+  preventHoistElementUpdate: true
+};
+const updateState = function(obj, options = STATE_UPDATE_OPTIONS) {
   const state = this;
   const element = state.__element;
   if (!state.__element)
@@ -63,19 +66,22 @@ const hoistStateUpdate = (state, obj, options) => {
   if (!stateKey)
     return;
   const asksForInherit = (0, import_inherit.checkIfInherits)(element);
-  const inheritedState = (0, import_inherit.findInheritedState)(element, parent);
+  const inheritedState = (0, import_inherit.findInheritedState)(element, parent, { returnParent: true });
   const shouldPropagateState = asksForInherit && inheritedState && !options.stopStatePropagation;
   if (!shouldPropagateState)
     return;
-  console.log(inheritedState);
   const isStringState = ref.__stateType === "string";
   const value = isStringState ? state.value : state.parse();
   const passedValue = isStringState ? state.value : obj;
-  inheritedState[stateKey] = value;
-  inheritedState.update({ [stateKey]: passedValue }, {
-    skipOverwrite: true,
+  const findGrandParentState = (0, import_inherit.getParentStateInKey)(stateKey, parent.state);
+  const changesValue = (0, import_inherit.createChangesByKey)(stateKey, passedValue);
+  const targetParent = findGrandParentState || parent.state;
+  if (options.replace)
+    targetParent[stateKey] = value;
+  targetParent.update(changesValue, {
+    ...options,
     preventUpdate: options.preventHoistElementUpdate,
-    ...options
+    skipOverwrite: options.replace
   });
 };
 const updateDependentState = (state, obj, options) => {

package/inherit.js

@@ -1,8 +1,10 @@
 'use strict'
 
 import { arrayContainsOtherArray, deepClone, is, isNot, isObjectLike } from '@domql/utils'
+import { IGNORE_STATE_PARAMS } from './ignore'
 
 export const getParentStateInKey = (stateKey, parentState) => {
+  if (!stateKey.includes('../')) return
   const arr = stateKey.split('../')
   const arrLength = arr.length - 1
   for (let i = 0; i < arrLength; i++) {
@@ -12,7 +14,7 @@ export const getParentStateInKey = (stateKey, parentState) => {
   return parentState
 }
 
-export const getChildStateInKey = (stateKey, parentState) => {
+export const getChildStateInKey = (stateKey, parentState, options) => {
   const arr = stateKey.split('/')
   const arrLength = arr.length - 1
   for (let i = 0; i < arrLength; i++) {
@@ -24,30 +26,33 @@ export const getChildStateInKey = (stateKey, parentState) => {
       parentState = childInParent
     } else return
   }
+  if (options.returnParent) return parentState
   return parentState[stateKey]
 }
 
-export const findInheritedState = (element, parent) => {
+export const findInheritedState = (element, parent, options = {}) => {
   const ref = element.__ref
   let stateKey = ref.__state
-  if (!stateKey || isNot(stateKey)('number', 'string')) return element.state
+  if (!checkIfInherits(element)) return
 
   let parentState = parent.state
-  if (stateKey.includes('../')) {
-    parentState = getParentStateInKey(stateKey, parent.state)
+  const findGrandParentState = getParentStateInKey(stateKey, parent.state)
+  if (findGrandParentState) {
+    parentState = findGrandParentState
     stateKey = stateKey.replaceAll('../', '')
   }
+
   if (!parentState) return
-  return getChildStateInKey(stateKey, parentState)
+  return getChildStateInKey(stateKey, parentState, options)
 }
 
 export const createInheritedState = (element, parent) => {
   const ref = element.__ref
   const inheritedState = findInheritedState(element, parent)
-  if (!inheritedState) return
+  if (!inheritedState) return element.state
 
   if (is(inheritedState)('object', 'array')) {
-    return deepClone(inheritedState)
+    return deepClone(inheritedState, IGNORE_STATE_PARAMS)
   } else if (is(inheritedState)('string', 'number')) {
     ref.__stateType = 'string'
     return { value: inheritedState }
@@ -68,3 +73,17 @@ export const isState = function (state) {
   const keys = Object.keys(state)
   return arrayContainsOtherArray(keys, ['update', 'parse', 'clean', 'create', 'parent', 'rootUpdate'])
 }
+
+export const createChangesByKey = (path, value) => {
+  if (!path) {
+    return value || {};
+  }
+  const keys = path.split('/');
+  let obj = {};
+  let ref = obj;
+  keys.forEach((key, index) => {
+    ref[key] = index === keys.length - 1 ? value || {} : {};
+    ref = ref[key];
+  });
+  return obj;
+}

package/methods.js

@@ -64,27 +64,30 @@ export const add = function (value, options = {}) {
   const state = this
   if (isArray(state)) {
     state.push(value)
-    state.update(state.parse(), { skipOverwrite: true, ...options })
+    state.update(state.parse(), { replace: true, ...options })
+  }
+  else if (isObject(state)) {
+    const key = Object.keys(state).length
+    state.update({ [key]: value }, options)
   }
 }
 
 export const toggle = function (key, options = {}) {
   const state = this
-  state[key] = !state[key]
-  state.update({ [key]: !state[key] }, { skipOverwrite: true, ...options })
+  state.update({ [key]: !state[key] }, options)
 }
 
 export const remove = function (key, options = {}) {
   const state = this
   if (isArray(state)) removeFromArray(state, key)
   if (isObject(state)) removeFromObject(state, key)
-  return state.update(state.parse(), { skipOverwrite: true, ...options })
+  return state.update(state.parse(), { replace: true, ...options })
 }
 
 export const apply = function (func, options = {}) {
   const state = this
   if (isFunction(func)) {
     func(state)
-    return state.update(state, { skipOverwrite: true, ...options })
+    return state.update(state, { replace: true, ...options })
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@domql/state",
-  "version": "2.3.122",
+  "version": "2.3.123",
   "license": "MIT",
   "type": "module",
   "module": "dist/esm/index.js",
@@ -26,5 +26,5 @@
     "@domql/report": "latest",
     "@domql/utils": "latest"
   },
-  "gitHead": "e599b1dc425a72bd3ec989b909f47bb51bf4dbac"
+  "gitHead": "feb0d24eb5924f0f9ebea660a93afffc7d6a2059"
 }

package/updateState.js

@@ -4,9 +4,13 @@ import { report } from '@domql/report'
 import { triggerEventOn } from '@domql/event'
 import { IGNORE_STATE_PARAMS } from './ignore'
 import { deepMerge, overwriteDeep, overwriteShallow } from '@domql/utils'
-import { checkIfInherits, findInheritedState } from './inherit'
+import { checkIfInherits, createChangesByKey, findInheritedState, getParentStateInKey } from './inherit'
 
-export const updateState = function (obj, options = {}) {
+const STATE_UPDATE_OPTIONS = {
+  preventHoistElementUpdate: true
+}
+
+export const updateState = function (obj, options = STATE_UPDATE_OPTIONS) {
   const state = this
   const element = state.__element
 
@@ -53,20 +57,22 @@ const hoistStateUpdate = (state, obj, options) => {
   if (!stateKey) return
 
   const asksForInherit = checkIfInherits(element)
-  const inheritedState = findInheritedState(element, parent)
+  const inheritedState = findInheritedState(element, parent, { returnParent: true })
   const shouldPropagateState = asksForInherit && inheritedState && !options.stopStatePropagation
   if (!shouldPropagateState) return
-  console.log(inheritedState)
 
   const isStringState = (ref.__stateType === 'string')
   const value = isStringState ? state.value : state.parse()
   const passedValue = isStringState ? state.value : obj
 
-  inheritedState[stateKey] = value
-  inheritedState.update({ [stateKey]: passedValue }, {
-    skipOverwrite: true,
+  const findGrandParentState = getParentStateInKey(stateKey, parent.state)
+  const changesValue = createChangesByKey(stateKey, passedValue)
+  const targetParent = findGrandParentState || parent.state
+  if (options.replace) targetParent[stateKey] = value
+  targetParent.update(changesValue, {
+    ...options,
     preventUpdate: options.preventHoistElementUpdate,
-    ...options
+    skipOverwrite: options.replace
   })
 }