solid-js 1.3.15 → 1.4.0-beta.0

package/dist/solid.js

@@ -127,6 +127,7 @@ function nextHydrateContext() {
 
 const equalFn = (a, b) => a === b;
 const $PROXY = Symbol("solid-proxy");
+const $TRACK = Symbol("solid-track");
 const $DEVCOMP = Symbol("solid-dev-component");
 const signalOptions = {
   equals: equalFn
@@ -201,7 +202,7 @@ function createEffect(fn, value, options) {
         s = SuspenseContext && lookup(Owner, SuspenseContext.id);
   if (s) c.suspense = s;
   c.user = true;
-  Effects ? Effects.push(c) : queueMicrotask(() => updateComputation(c));
+  Effects ? Effects.push(c) : updateComputation(c);
 }
 function createReaction(onInvalidate, options) {
   let fn;
@@ -242,13 +243,8 @@ function createResource(source, fetcher, options) {
     source = true;
   }
   options || (options = {});
-  if (options.globalRefetch !== false) {
-    Resources || (Resources = new Set());
-    Resources.add(load);
-    Owner && onCleanup(() => Resources.delete(load));
-  }
   const contexts = new Set(),
-        [s, set] = createSignal(options.initialValue),
+        [value, setValue] = createSignal(options.initialValue),
         [track, trigger] = createSignal(undefined, {
     equals: false
   }),
@@ -260,7 +256,7 @@ function createResource(source, fetcher, options) {
       id = null,
       loadedUnderTransition = false,
       scheduled = false,
-      dynamic = typeof source === "function";
+      dynamic = typeof source === "function" && createMemo(source);
   if (sharedConfig.context) {
     id = `${sharedConfig.context.id}${sharedConfig.context.count++}`;
     if (sharedConfig.load) initP = sharedConfig.load(id);
@@ -290,7 +286,7 @@ function createResource(source, fetcher, options) {
   }
   function completeLoad(v) {
     batch(() => {
-      set(() => v);
+      setValue(() => v);
       setLoading(false);
       for (const c of contexts.keys()) c.decrement();
       contexts.clear();
@@ -298,7 +294,7 @@ function createResource(source, fetcher, options) {
   }
   function read() {
     const c = SuspenseContext && lookup(Owner, SuspenseContext.id),
-          v = s();
+          v = value();
     if (err) throw err;
     if (Listener && !Listener.user && c) {
       createComputed(() => {
@@ -317,15 +313,15 @@ function createResource(source, fetcher, options) {
     if (refetching && scheduled) return;
     scheduled = false;
     setError(err = undefined);
-    const lookup = dynamic ? source() : source;
+    const lookup = dynamic ? dynamic() : source;
     loadedUnderTransition = Transition && Transition.running;
     if (lookup == null || lookup === false) {
-      loadEnd(pr, untrack(s));
+      loadEnd(pr, untrack(value));
       return;
     }
     if (Transition && pr) Transition.promises.delete(pr);
     const p = initP || untrack(() => fetcher(lookup, {
-      value: s(),
+      value: value(),
       refetching
     }));
     if (typeof p !== "object" || !("then" in p)) {
@@ -351,18 +347,20 @@ function createResource(source, fetcher, options) {
       get() {
         return error();
       }
+    },
+    latest: {
+      get() {
+        if (err) throw err;
+        return value();
+      }
     }
   });
   if (dynamic) createComputed(() => load(false));else load(false);
   return [read, {
     refetch: load,
-    mutate: set
+    mutate: setValue
   }];
 }
-let Resources;
-function refetchResources(info) {
-  return Resources && Promise.all([...Resources].map(fn => fn(info)));
-}
 function createDeferred(source, options) {
   let t,
       timeout = options ? options.timeoutMs : undefined;
@@ -381,7 +379,7 @@ function createSelector(source, fn = equalFn, options) {
   const subs = new Map();
   const node = createComputation(p => {
     const v = source();
-    for (const key of subs.keys()) if (fn(key, v) !== (p !== undefined && fn(key, p))) {
+    for (const key of subs.keys()) if (fn(key, v) !== fn(key, p)) {
       const l = subs.get(key);
       for (const c of l.values()) {
         c.state = STALE;
@@ -736,11 +734,14 @@ function runUpdates(fn, init) {
   if (Effects) wait = true;else Effects = [];
   ExecCount++;
   try {
-    return fn();
+    const res = fn();
+    completeUpdates(wait);
+    return res;
   } catch (err) {
     handleError(err);
   } finally {
-    completeUpdates(wait);
+    Updates = null;
+    if (!wait) Effects = null;
   }
 }
 function completeUpdates(wait) {
@@ -981,6 +982,7 @@ function mapArray(list, mapFn, options = {}) {
     let newItems = list() || [],
         i,
         j;
+    newItems[$TRACK];
     return untrack(() => {
       let newLen = newItems.length,
           newIndices,
@@ -1082,6 +1084,7 @@ function indexArray(list, mapFn, options = {}) {
   onCleanup(() => dispose(disposers));
   return () => {
     const newItems = list() || [];
+    newItems[$TRACK];
     return untrack(() => {
       if (newItems.length === 0) {
         if (len !== 0) {
@@ -1245,9 +1248,7 @@ function lazy(fn) {
       });
       comp = s;
     } else if (!comp) {
-      const [s] = createResource(() => (p || (p = fn())).then(mod => mod.default), {
-        globalRefetch: false
-      });
+      const [s] = createResource(() => (p || (p = fn())).then(mod => mod.default));
       comp = s;
     } else {
       const c = comp();
@@ -1499,4 +1500,4 @@ function Suspense(props) {
 
 let DEV;
 
-export { $DEVCOMP, $PROXY, DEV, ErrorBoundary, For, Index, Match, Show, Suspense, SuspenseList, Switch, batch, cancelCallback, children, createComponent, createComputed, createContext, createDeferred, createEffect, createMemo, createReaction, createRenderEffect, createResource, createRoot, createSelector, createSignal, createUniqueId, enableExternalSource, enableHydration, enableScheduling, equalFn, from, getListener, getOwner, indexArray, lazy, mapArray, mergeProps, observable, on, onCleanup, onError, onMount, refetchResources, requestCallback, resetErrorBoundaries, runWithOwner, sharedConfig, splitProps, startTransition, untrack, useContext, useTransition };
+export { $DEVCOMP, $PROXY, $TRACK, DEV, ErrorBoundary, For, Index, Match, Show, Suspense, SuspenseList, Switch, batch, cancelCallback, children, createComponent, createComputed, createContext, createDeferred, createEffect, createMemo, createReaction, createRenderEffect, createResource, createRoot, createSelector, createSignal, createUniqueId, enableExternalSource, enableHydration, enableScheduling, equalFn, from, getListener, getOwner, indexArray, lazy, mapArray, mergeProps, observable, on, onCleanup, onError, onMount, requestCallback, resetErrorBoundaries, runWithOwner, sharedConfig, splitProps, startTransition, untrack, useContext, useTransition };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "solid-js",
   "description": "A declarative JavaScript library for building user interfaces.",
-  "version": "1.3.15",
+  "version": "1.4.0-beta.0",
   "author": "Ryan Carniato",
   "license": "MIT",
   "homepage": "https://solidjs.com",
@@ -144,5 +144,5 @@
     "compiler",
     "performance"
   ],
-  "gitHead": "0a6fc7bbeebf14f1a9297358801acf365dfbb716"
+  "gitHead": "c47bee46d775574c4eebd94ea207f4e679f08d60"
 }

package/store/dist/dev.cjs

@@ -71,11 +71,14 @@ function proxyDescriptor(target, property) {
   desc.get = () => target[solidJs.$PROXY][property];
   return desc;
 }
-function ownKeys(target) {
+function trackSelf(target) {
   if (solidJs.getListener()) {
     const nodes = getDataNodes(target);
     (nodes._ || (nodes._ = createDataNode()))();
   }
+}
+function ownKeys(target) {
+  trackSelf(target);
   return Reflect.ownKeys(target);
 }
 function createDataNode() {
@@ -92,18 +95,12 @@ const proxyTraps$1 = {
     if (property === solidJs.$PROXY) return receiver;
     const value = target[property];
     if (property === $NODE || property === "__proto__") return value;
-    const wrappable = isWrappable(value);
+    if (property === solidJs.$TRACK) return trackSelf(target);
     if (solidJs.getListener() && (typeof value !== "function" || target.hasOwnProperty(property))) {
-      let nodes, node;
-      if (wrappable && (nodes = getDataNodes(value))) {
-        node = nodes._ || (nodes._ = createDataNode());
-        node();
-      }
-      nodes = getDataNodes(target);
-      node = nodes[property] || (nodes[property] = createDataNode());
-      node();
+      const nodes = getDataNodes(target);
+      (nodes[property] || (nodes[property] = createDataNode()))();
     }
-    return wrappable ? wrap$1(value, target[$NAME] && `${target[$NAME]}:${property.toString()}`) : value;
+    return isWrappable(value) ? wrap$1(value, target[$NAME] && `${target[$NAME]}:${property.toString()}`) : value;
   },
   set() {
     console.warn("Cannot mutate a Store directly");
@@ -120,16 +117,14 @@ function setProperty(state, property, value) {
   if (state[property] === value) return;
   const array = Array.isArray(state);
   const len = state.length;
-  const isUndefined = value === undefined;
-  const notify = array || isUndefined === property in state;
-  if (isUndefined) {
+  if (value === undefined) {
     delete state[property];
   } else state[property] = value;
   let nodes = getDataNodes(state),
       node;
   (node = nodes[property]) && node.$();
   if (array && state.length !== len) (node = nodes.length) && node.$();
-  notify && (node = nodes._) && node.$();
+  (node = nodes._) && node.$();
 }
 function mergeStoreNode(state, value) {
   const keys = Object.keys(value);
@@ -138,6 +133,15 @@ function mergeStoreNode(state, value) {
     setProperty(state, key, value[key]);
   }
 }
+function updateArray(current, next) {
+  let i = 0,
+      len = next.length;
+  for (; i < len; i++) {
+    const value = next[i];
+    if (current[i] !== value) setProperty(current, i, value);
+  }
+  setProperty(current, "length", len);
+}
 function updatePath(current, path, traversed = []) {
   let part,
       prev = current;
@@ -185,6 +189,7 @@ function updatePath(current, path, traversed = []) {
 }
 function createStore(store, options) {
   const unwrappedStore = unwrap(store || {});
+  const isArray = Array.isArray(unwrappedStore);
   if (typeof unwrappedStore !== "object" && typeof unwrappedStore !== "function") throw new Error(`Unexpected type ${typeof unwrappedStore} received when initializing 'createStore'. Expected an object.`);
   const wrappedStore = wrap$1(unwrappedStore, (options && options.name || solidJs.DEV.hashValue(unwrappedStore)));
   {
@@ -194,7 +199,9 @@ function createStore(store, options) {
     });
   }
   function setStore(...args) {
-    solidJs.batch(() => updatePath(unwrappedStore, args));
+    solidJs.batch(() => {
+      isArray && args.length === 1 ? updateArray(unwrappedStore, unwrap(args[0])) : updatePath(unwrappedStore, args);
+    });
   }
   return [wrappedStore, setStore];
 }
@@ -205,18 +212,14 @@ const proxyTraps = {
     if (property === solidJs.$PROXY) return receiver;
     const value = target[property];
     if (property === $NODE || property === "__proto__") return value;
-    const wrappable = isWrappable(value);
+    if (property === solidJs.$TRACK) return trackSelf(target);
     if (solidJs.getListener() && (typeof value !== "function" || target.hasOwnProperty(property))) {
-      let nodes, node;
-      if (wrappable && (nodes = getDataNodes(value))) {
-        node = nodes._ || (nodes._ = createDataNode());
-        node();
-      }
-      nodes = getDataNodes(target);
-      node = nodes[property] || (nodes[property] = createDataNode());
-      node();
+      const nodes = getDataNodes(target);
+      (nodes[property] || (nodes[property] = createDataNode()))();
+    } else if (value != null && value === Array.prototype[property]) {
+      return (...args) => solidJs.batch(() => Array.prototype[property].apply(target, args));
     }
-    return wrappable ? wrap(value, target[$NAME] && `${target[$NAME]}:${property.toString()}`) : value;
+    return isWrappable(value) ? wrap(value, target[$NAME] && `${target[$NAME]}:${property.toString()}`) : value;
   },
   set(target, property, value) {
     setProperty(target, property, unwrap(value));
@@ -348,9 +351,9 @@ function reconcile(value, options = {}) {
         v = unwrap(value);
   return state => {
     if (!isWrappable(state) || !isWrappable(v)) return v;
-    applyState(v, {
+    solidJs.batch(() => applyState(v, {
       state
-    }, "state", merge, key);
+    }, "state", merge, key));
     return state;
   };
 }

package/store/dist/dev.js

@@ -1,4 +1,4 @@
-import { $PROXY, DEV, getListener, batch, createSignal } from 'solid-js';
+import { $PROXY, DEV, $TRACK, getListener, batch, createSignal } from 'solid-js';
 
 const $RAW = Symbol("store-raw"),
       $NODE = Symbol("store-node"),
@@ -67,11 +67,14 @@ function proxyDescriptor(target, property) {
   desc.get = () => target[$PROXY][property];
   return desc;
 }
-function ownKeys(target) {
+function trackSelf(target) {
   if (getListener()) {
     const nodes = getDataNodes(target);
     (nodes._ || (nodes._ = createDataNode()))();
   }
+}
+function ownKeys(target) {
+  trackSelf(target);
   return Reflect.ownKeys(target);
 }
 function createDataNode() {
@@ -88,18 +91,12 @@ const proxyTraps$1 = {
     if (property === $PROXY) return receiver;
     const value = target[property];
     if (property === $NODE || property === "__proto__") return value;
-    const wrappable = isWrappable(value);
+    if (property === $TRACK) return trackSelf(target);
     if (getListener() && (typeof value !== "function" || target.hasOwnProperty(property))) {
-      let nodes, node;
-      if (wrappable && (nodes = getDataNodes(value))) {
-        node = nodes._ || (nodes._ = createDataNode());
-        node();
-      }
-      nodes = getDataNodes(target);
-      node = nodes[property] || (nodes[property] = createDataNode());
-      node();
+      const nodes = getDataNodes(target);
+      (nodes[property] || (nodes[property] = createDataNode()))();
     }
-    return wrappable ? wrap$1(value, target[$NAME] && `${target[$NAME]}:${property.toString()}`) : value;
+    return isWrappable(value) ? wrap$1(value, target[$NAME] && `${target[$NAME]}:${property.toString()}`) : value;
   },
   set() {
     console.warn("Cannot mutate a Store directly");
@@ -116,16 +113,14 @@ function setProperty(state, property, value) {
   if (state[property] === value) return;
   const array = Array.isArray(state);
   const len = state.length;
-  const isUndefined = value === undefined;
-  const notify = array || isUndefined === property in state;
-  if (isUndefined) {
+  if (value === undefined) {
     delete state[property];
   } else state[property] = value;
   let nodes = getDataNodes(state),
       node;
   (node = nodes[property]) && node.$();
   if (array && state.length !== len) (node = nodes.length) && node.$();
-  notify && (node = nodes._) && node.$();
+  (node = nodes._) && node.$();
 }
 function mergeStoreNode(state, value) {
   const keys = Object.keys(value);
@@ -134,6 +129,15 @@ function mergeStoreNode(state, value) {
     setProperty(state, key, value[key]);
   }
 }
+function updateArray(current, next) {
+  let i = 0,
+      len = next.length;
+  for (; i < len; i++) {
+    const value = next[i];
+    if (current[i] !== value) setProperty(current, i, value);
+  }
+  setProperty(current, "length", len);
+}
 function updatePath(current, path, traversed = []) {
   let part,
       prev = current;
@@ -181,6 +185,7 @@ function updatePath(current, path, traversed = []) {
 }
 function createStore(store, options) {
   const unwrappedStore = unwrap(store || {});
+  const isArray = Array.isArray(unwrappedStore);
   if (typeof unwrappedStore !== "object" && typeof unwrappedStore !== "function") throw new Error(`Unexpected type ${typeof unwrappedStore} received when initializing 'createStore'. Expected an object.`);
   const wrappedStore = wrap$1(unwrappedStore, (options && options.name || DEV.hashValue(unwrappedStore)));
   {
@@ -190,7 +195,9 @@ function createStore(store, options) {
     });
   }
   function setStore(...args) {
-    batch(() => updatePath(unwrappedStore, args));
+    batch(() => {
+      isArray && args.length === 1 ? updateArray(unwrappedStore, unwrap(args[0])) : updatePath(unwrappedStore, args);
+    });
   }
   return [wrappedStore, setStore];
 }
@@ -201,18 +208,14 @@ const proxyTraps = {
     if (property === $PROXY) return receiver;
     const value = target[property];
     if (property === $NODE || property === "__proto__") return value;
-    const wrappable = isWrappable(value);
+    if (property === $TRACK) return trackSelf(target);
     if (getListener() && (typeof value !== "function" || target.hasOwnProperty(property))) {
-      let nodes, node;
-      if (wrappable && (nodes = getDataNodes(value))) {
-        node = nodes._ || (nodes._ = createDataNode());
-        node();
-      }
-      nodes = getDataNodes(target);
-      node = nodes[property] || (nodes[property] = createDataNode());
-      node();
+      const nodes = getDataNodes(target);
+      (nodes[property] || (nodes[property] = createDataNode()))();
+    } else if (value != null && value === Array.prototype[property]) {
+      return (...args) => batch(() => Array.prototype[property].apply(target, args));
     }
-    return wrappable ? wrap(value, target[$NAME] && `${target[$NAME]}:${property.toString()}`) : value;
+    return isWrappable(value) ? wrap(value, target[$NAME] && `${target[$NAME]}:${property.toString()}`) : value;
   },
   set(target, property, value) {
     setProperty(target, property, unwrap(value));
@@ -344,9 +347,9 @@ function reconcile(value, options = {}) {
         v = unwrap(value);
   return state => {
     if (!isWrappable(state) || !isWrappable(v)) return v;
-    applyState(v, {
+    batch(() => applyState(v, {
       state
-    }, "state", merge, key);
+    }, "state", merge, key));
     return state;
   };
 }

package/store/dist/store.cjs

@@ -68,11 +68,14 @@ function proxyDescriptor(target, property) {
   desc.get = () => target[solidJs.$PROXY][property];
   return desc;
 }
-function ownKeys(target) {
+function trackSelf(target) {
   if (solidJs.getListener()) {
     const nodes = getDataNodes(target);
     (nodes._ || (nodes._ = createDataNode()))();
   }
+}
+function ownKeys(target) {
+  trackSelf(target);
   return Reflect.ownKeys(target);
 }
 function createDataNode() {
@@ -89,18 +92,12 @@ const proxyTraps$1 = {
     if (property === solidJs.$PROXY) return receiver;
     const value = target[property];
     if (property === $NODE || property === "__proto__") return value;
-    const wrappable = isWrappable(value);
+    if (property === solidJs.$TRACK) return trackSelf(target);
     if (solidJs.getListener() && (typeof value !== "function" || target.hasOwnProperty(property))) {
-      let nodes, node;
-      if (wrappable && (nodes = getDataNodes(value))) {
-        node = nodes._ || (nodes._ = createDataNode());
-        node();
-      }
-      nodes = getDataNodes(target);
-      node = nodes[property] || (nodes[property] = createDataNode());
-      node();
+      const nodes = getDataNodes(target);
+      (nodes[property] || (nodes[property] = createDataNode()))();
     }
-    return wrappable ? wrap$1(value) : value;
+    return isWrappable(value) ? wrap$1(value) : value;
   },
   set() {
     return true;
@@ -115,16 +112,14 @@ function setProperty(state, property, value) {
   if (state[property] === value) return;
   const array = Array.isArray(state);
   const len = state.length;
-  const isUndefined = value === undefined;
-  const notify = array || isUndefined === property in state;
-  if (isUndefined) {
+  if (value === undefined) {
     delete state[property];
   } else state[property] = value;
   let nodes = getDataNodes(state),
       node;
   (node = nodes[property]) && node.$();
   if (array && state.length !== len) (node = nodes.length) && node.$();
-  notify && (node = nodes._) && node.$();
+  (node = nodes._) && node.$();
 }
 function mergeStoreNode(state, value) {
   const keys = Object.keys(value);
@@ -133,6 +128,15 @@ function mergeStoreNode(state, value) {
     setProperty(state, key, value[key]);
   }
 }
+function updateArray(current, next) {
+  let i = 0,
+      len = next.length;
+  for (; i < len; i++) {
+    const value = next[i];
+    if (current[i] !== value) setProperty(current, i, value);
+  }
+  setProperty(current, "length", len);
+}
 function updatePath(current, path, traversed = []) {
   let part,
       prev = current;
@@ -180,9 +184,12 @@ function updatePath(current, path, traversed = []) {
 }
 function createStore(store, options) {
   const unwrappedStore = unwrap(store || {});
+  const isArray = Array.isArray(unwrappedStore);
   const wrappedStore = wrap$1(unwrappedStore);
   function setStore(...args) {
-    solidJs.batch(() => updatePath(unwrappedStore, args));
+    solidJs.batch(() => {
+      isArray && args.length === 1 ? updateArray(unwrappedStore, unwrap(args[0])) : updatePath(unwrappedStore, args);
+    });
   }
   return [wrappedStore, setStore];
 }
@@ -193,18 +200,14 @@ const proxyTraps = {
     if (property === solidJs.$PROXY) return receiver;
     const value = target[property];
     if (property === $NODE || property === "__proto__") return value;
-    const wrappable = isWrappable(value);
+    if (property === solidJs.$TRACK) return trackSelf(target);
     if (solidJs.getListener() && (typeof value !== "function" || target.hasOwnProperty(property))) {
-      let nodes, node;
-      if (wrappable && (nodes = getDataNodes(value))) {
-        node = nodes._ || (nodes._ = createDataNode());
-        node();
-      }
-      nodes = getDataNodes(target);
-      node = nodes[property] || (nodes[property] = createDataNode());
-      node();
+      const nodes = getDataNodes(target);
+      (nodes[property] || (nodes[property] = createDataNode()))();
+    } else if (value != null && value === Array.prototype[property]) {
+      return (...args) => solidJs.batch(() => Array.prototype[property].apply(target, args));
     }
-    return wrappable ? wrap(value) : value;
+    return isWrappable(value) ? wrap(value) : value;
   },
   set(target, property, value) {
     setProperty(target, property, unwrap(value));
@@ -326,9 +329,9 @@ function reconcile(value, options = {}) {
         v = unwrap(value);
   return state => {
     if (!isWrappable(state) || !isWrappable(v)) return v;
-    applyState(v, {
+    solidJs.batch(() => applyState(v, {
       state
-    }, "state", merge, key);
+    }, "state", merge, key));
     return state;
   };
 }