@plasmicapp/react-web 0.2.155 → 0.2.157

package/dist/all.d.ts

@@ -36,7 +36,17 @@ declare type HTMLElementRefOf<T extends keyof JSX.IntrinsicElements> = Exclude<R
 
 declare function dlv(object: object, key: string | Array<string | number>, defaultValue?: any): any;
 
-declare type InitFunc<T> = ($props: Record<string, any>, $state: $State, $ctx: Record<string, any>, indexes?: number[]) => T;
+declare type InitFuncEnv = {
+    $props: Record<string, any>;
+    $state: Record<string, any>;
+    $queries?: Record<string, any>;
+    $ctx?: Record<string, any>;
+};
+declare type DollarStateEnv = Omit<InitFuncEnv, "$state">;
+declare type NoUndefinedField<T> = {
+    [P in keyof T]-?: T[P];
+};
+declare type InitFunc<T> = (env: NoUndefinedField<InitFuncEnv>) => T;
 declare type ObjectPath = (string | number)[];
 interface $StateSpec<T> {
     path: string;
@@ -74,7 +84,7 @@ declare function getStateSpecInPlasmicProxy(obj: any, path: ObjectPath): {
  */
 declare function set(obj: any, keys: any, val: any): void;
 
-declare function useDollarState(specs: $StateSpec<any>[], props: Record<string, any>, $ctx?: Record<string, any>, opts?: {
+declare function useDollarState(specs: $StateSpec<any>[], env: DollarStateEnv, opts?: {
     inCanvas: boolean;
 }): $State;
 

package/dist/react-web.cjs.development.js

@@ -2355,6 +2355,15 @@ var StateSpecNode = /*#__PURE__*/function () {
       path: path
     };
   };
+  _proto.deleteStateCell = function deleteStateCell(prefixPath) {
+    var _this = this;
+    [].concat(Object.keys(this._state)).forEach(function (key) {
+      var path = JSON.parse(key);
+      if (shallowEqual(prefixPath, path.slice(0, prefixPath.length))) {
+        delete _this._state[key];
+      }
+    });
+  };
   _proto.setInitialValue = function setInitialValue(path, value) {
     var key = JSON.stringify(path);
     this._state[key].initialValue = value;
@@ -2613,7 +2622,7 @@ function initializeStateValue($$state, initialSpecNode, initialStatePath, proxyR
         });
         var spec = node.getSpec();
         if (spec.valueProp) {
-          return $$state.props[spec.valueProp];
+          return $$state.env.$props[spec.valueProp];
         } else if (!node.hasState(path) && spec.initFunc) {
           node.createStateCell(path);
           return initializeStateValue($$state, node, path, proxyRoot);
@@ -2629,19 +2638,23 @@ function initializeStateValue($$state, initialSpecNode, initialStatePath, proxyR
     var node = _ref.node,
       path = _ref.path;
     node.addListener(path, function () {
-      var newValue = initialSpecNode.getSpec().initFunc($$state.props, $state, $$state.ctx);
+      var newValue = initialSpecNode.getSpec().initFunc(_extends({
+        $state: $state
+      }, $$state.env));
       set(proxyRoot, initialStatePath, newValue);
     });
   });
-  var initialValue = initialSpecNode.getInitFunc(initialSpecNode.getState(initialStatePath))($$state.props, $state, $$state.ctx);
+  var initialValue = initialSpecNode.getInitFunc(initialSpecNode.getState(initialStatePath))(_extends({
+    $state: $state
+  }, $$state.env));
   initialSpecNode.setInitialValue(initialStatePath, clone(initialValue));
   var initialSpec = initialSpecNode.getSpec();
   var value = initialSpec.isImmutable ? mkUntrackedValue(initialValue) : clone(initialValue);
   set(proxyRoot, initialStatePath, value);
   //immediately fire onChange
   if (initialSpec.onChangeProp) {
-    var _$$state$props$initia, _$$state$props;
-    (_$$state$props$initia = (_$$state$props = $$state.props)[initialSpec.onChangeProp]) == null ? void 0 : _$$state$props$initia.call(_$$state$props, initialValue);
+    var _$$state$env$$props$i, _$$state$env$$props;
+    (_$$state$env$$props$i = (_$$state$env$$props = $$state.env.$props)[initialSpec.onChangeProp]) == null ? void 0 : _$$state$env$$props$i.call(_$$state$env$$props, initialValue);
   }
   return initialValue;
 }
@@ -2659,11 +2672,18 @@ function create$StateProxy($$state, leafHandlers) {
         }
         delete _get($$state.stateValues, currPath)[property];
         if (spec.onChangeProp) {
-          var _$$state$props$spec$o, _$$state$props2;
+          var _$$state$env$$props$s, _$$state$env$$props2;
           //we are always in a leaf, since we only have two cases:
           // 1 - delete properties outside the state tree
           // 2 - delete indices in repeated implicit states, but these can't be exposed, so they don't have onChangeProp
-          (_$$state$props$spec$o = (_$$state$props2 = $$state.props)[spec.onChangeProp]) == null ? void 0 : _$$state$props$spec$o.call(_$$state$props2, _get(proxyRoot, currPath.slice(spec.pathObj.length)));
+          (_$$state$env$$props$s = (_$$state$env$$props2 = $$state.env.$props)[spec.onChangeProp]) == null ? void 0 : _$$state$env$$props$s.call(_$$state$env$$props2, _get(proxyRoot, currPath.slice(spec.pathObj.length)));
+        }
+        var nextPath = getNextPath(property);
+        var nextNode = currNode.makeTransition(property);
+        if (nextNode) {
+          getStateCells(nextNode).forEach(function (node) {
+            node.deleteStateCell(nextPath);
+          });
         }
         return Reflect.deleteProperty(target, property);
       },
@@ -2720,12 +2740,19 @@ function create$StateProxy($$state, leafHandlers) {
         } else {
           Reflect.set(target, property, value, receiver);
         }
-        nextNode.getAllSpecs().forEach(function (spec) {
+        if (currNode.isLeaf()) {
           if (spec.onChangeProp) {
-            var _$$state$props$spec$o2, _$$state$props3;
-            (_$$state$props$spec$o2 = (_$$state$props3 = $$state.props)[spec.onChangeProp]) == null ? void 0 : _$$state$props$spec$o2.call(_$$state$props3, value);
+            var _$$state$env$$props$s2, _$$state$env$$props3;
+            (_$$state$env$$props$s2 = (_$$state$env$$props3 = $$state.env.$props)[spec.onChangeProp]) == null ? void 0 : _$$state$env$$props$s2.call(_$$state$env$$props3, target);
           }
-        });
+        } else {
+          nextNode.getAllSpecs().forEach(function (spec) {
+            if (spec.onChangeProp) {
+              var _$$state$env$$props$s3, _$$state$env$$props4;
+              (_$$state$env$$props$s3 = (_$$state$env$$props4 = $$state.env.$props)[spec.onChangeProp]) == null ? void 0 : _$$state$env$$props$s3.call(_$$state$env$$props4, value);
+            }
+          });
+        }
         var newValue = (isOutside || currNode.isLeaf()) && currNode.getSpec().isImmutable ? mkUntrackedValue(value) : value;
         set($$state.stateValues, nextPath, newValue);
         return true;
@@ -2753,22 +2780,27 @@ function create$StateProxy($$state, leafHandlers) {
 var mkUntrackedValue = function mkUntrackedValue(o) {
   return o != null && typeof o === "object" ? valtio.ref(o) : o;
 };
-function useDollarState(specs, props, $ctx, opts) {
+var envFieldsAreNonNill = function envFieldsAreNonNill(env) {
+  var _env$$ctx, _env$$queries;
+  return {
+    $props: env.$props,
+    $ctx: (_env$$ctx = env.$ctx) != null ? _env$$ctx : {},
+    $queries: (_env$$queries = env.$queries) != null ? _env$$queries : {}
+  };
+};
+function useDollarState(specs, env, opts) {
   var $$state = React__default.useRef(function () {
     var rootSpecTree = buildTree(specs);
     return {
       rootSpecTree: rootSpecTree,
       specTreeLeaves: getStateCells(rootSpecTree),
       stateValues: valtio.proxy({}),
-      props: {},
-      ctx: {},
+      env: envFieldsAreNonNill(env),
       specs: [],
       registrationsQueue: valtio.proxy([])
     };
   }()).current;
-  $$state.props = props;
-  $$state.ctx = $ctx != null ? $ctx : {};
-  $$state.specs = specs;
+  $$state.env = envFieldsAreNonNill(env), $$state.specs = specs;
   var create$State = function create$State() {
     var $state = Object.assign(create$StateProxy($$state, function (node, path) {
       if (!node.hasState(path)) {
@@ -2784,7 +2816,7 @@ function useDollarState(specs, props, $ctx, opts) {
         get: function get(target, property, receiver) {
           var spec = node.getSpec();
           if (spec.valueProp) {
-            return $$state.props[spec.valueProp];
+            return $$state.env.$props[spec.valueProp];
           } else {
             return Reflect.get(target, property, receiver);
           }
@@ -2798,7 +2830,9 @@ function useDollarState(specs, props, $ctx, opts) {
         if (!node.hasState(realPath)) {
           node.createStateCell(realPath);
         }
-        if (!deepEqual(node.getState(realPath).initialValue, f($$state.props, $state, $$state.ctx))) {
+        if (!deepEqual(node.getState(realPath).initialValue, f(_extends({
+          $state: $state
+        }, $$state.env)))) {
           $$state.registrationsQueue.push(mkUntrackedValue({
             node: node,
             path: realPath,
@@ -2835,7 +2869,7 @@ function useDollarState(specs, props, $ctx, opts) {
         return;
       }
       node.createStateCell(spec.pathObj);
-      var init = spec.valueProp ? $$state.props[spec.valueProp] : spec.initFunc ? initializeStateValue($$state, node, spec.pathObj, $state) : spec.initVal;
+      var init = spec.valueProp ? $$state.env.$props[spec.valueProp] : spec.initFunc ? initializeStateValue($$state, node, spec.pathObj, $state) : spec.initVal;
       set($state, spec.pathObj, init);
     });
   }
@@ -2854,7 +2888,9 @@ function useDollarState(specs, props, $ctx, opts) {
       stateCell = _ref3.stateCell;
     var initFunc = node.getInitFunc(stateCell);
     if (initFunc) {
-      var newInit = initFunc(props, $state, $ctx != null ? $ctx : {});
+      var newInit = initFunc(_extends({
+        $state: $state
+      }, envFieldsAreNonNill(env)));
       if (!deepEqual(newInit, stateCell.initialValue)) {
         resetSpecs.push({
           stateCell: stateCell,
@@ -2867,8 +2903,8 @@ function useDollarState(specs, props, $ctx, opts) {
     var newInit = initializeStateValue($$state, node, stateCell.path, $state);
     var spec = node.getSpec();
     if (spec.onChangeProp) {
-      var _$$state$props$spec$o3, _$$state$props4;
-      (_$$state$props$spec$o3 = (_$$state$props4 = $$state.props)[spec.onChangeProp]) == null ? void 0 : _$$state$props$spec$o3.call(_$$state$props4, newInit);
+      var _$$state$env$$props$s4, _$$state$env$$props5;
+      (_$$state$env$$props$s4 = (_$$state$env$$props5 = $$state.env.$props)[spec.onChangeProp]) == null ? void 0 : _$$state$env$$props$s4.call(_$$state$env$$props5, newInit);
     }
   };
   useIsomorphicLayoutEffect$1(function () {
@@ -2877,7 +2913,7 @@ function useDollarState(specs, props, $ctx, opts) {
         node = _ref4.node;
       reInitializeState(node, stateCell);
     });
-  }, [props, resetSpecs]);
+  }, [env.$props, resetSpecs]);
   useIsomorphicLayoutEffect$1(function () {
     while ($$state.registrationsQueue.length) {
       var _$$state$registration = $$state.registrationsQueue.shift(),