solid-js 1.4.2 → 1.4.5

package/store/dist/server.js

@@ -1,6 +1,6 @@
 const $RAW = Symbol("state-raw");
 function isWrappable(obj) {
-  return obj != null && typeof obj === "object" && (obj.__proto__ === Object.prototype || Array.isArray(obj));
+  return obj != null && typeof obj === "object" && (Object.getPrototypeOf(obj) === Object.prototype || Array.isArray(obj));
 }
 function unwrap(item) {
   return item;
@@ -18,6 +18,19 @@ function mergeStoreNode(state, value, force) {
     setProperty(state, key, value[key], force);
   }
 }
+function updateArray(current, next) {
+  if (typeof next === "function") next = next(current);
+  if (Array.isArray(next)) {
+    if (current === next) return;
+    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);
+  } else mergeStoreNode(current, next);
+}
 function updatePath(current, path, traversed = []) {
   let part,
       next = current;
@@ -63,8 +76,9 @@ function updatePath(current, path, traversed = []) {
   } else setProperty(current, part, value);
 }
 function createStore(state) {
+  const isArray = Array.isArray(state);
   function setStore(...args) {
-    updatePath(state, args);
+    isArray && args.length === 1 ? updateArray(state, args[0]) : updatePath(state, args);
   }
   return [state, setStore];
 }

package/store/dist/store.cjs

@@ -28,7 +28,8 @@ function wrap$1(value, name) {
   return p;
 }
 function isWrappable(obj) {
-  return obj != null && typeof obj === "object" && (obj[solidJs.$PROXY] || !obj.__proto__ || obj.__proto__ === Object.prototype || Array.isArray(obj));
+  let proto;
+  return obj != null && typeof obj === "object" && (obj[solidJs.$PROXY] || !(proto = Object.getPrototypeOf(obj)) || proto === Object.prototype || Array.isArray(obj));
 }
 function unwrap(item, set = new Set()) {
   let result, unwrapped, v, prop;
@@ -138,14 +139,16 @@ function mergeStoreNode(state, value) {
 function updateArray(current, next) {
   if (typeof next === "function") next = next(current);
   next = unwrap(next);
-  if (current === next) return;
-  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);
+  if (Array.isArray(next)) {
+    if (current === next) return;
+    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);
+  } else mergeStoreNode(current, next);
 }
 function updatePath(current, path, traversed = []) {
   let part,
@@ -192,7 +195,7 @@ function updatePath(current, path, traversed = []) {
     mergeStoreNode(prev, value);
   } else setProperty(current, part, value);
 }
-function createStore(store, options) {
+function createStore(...[store, options]) {
   const unwrappedStore = unwrap(store || {});
   const isArray = Array.isArray(unwrappedStore);
   const wrappedStore = wrap$1(unwrappedStore);
@@ -269,11 +272,15 @@ function modifyMutable(state, modifier) {
   solidJs.batch(() => modifier(unwrap(state)));
 }
 
+const $ROOT = Symbol("store-root");
 function applyState(target, parent, property, merge, key) {
   const previous = parent[property];
   if (target === previous) return;
   if (!isWrappable(target) || !isWrappable(previous) || key && target[key] !== previous[key]) {
-    target !== previous && setProperty(parent, property, target);
+    if (target !== previous) {
+      if (property === $ROOT) return target;
+      setProperty(parent, property, target);
+    }
     return;
   }
   if (Array.isArray(target)) {
@@ -345,17 +352,19 @@ function reconcile(value, options = {}) {
         v = unwrap(value);
   return state => {
     if (!isWrappable(state) || !isWrappable(v)) return v;
-    solidJs.batch(() => applyState(v, {
-      state
-    }, "state", merge, key));
-    return state;
+    const res = applyState(v, {
+      [$ROOT]: state
+    }, $ROOT, merge, key);
+    return res === undefined ? state : res;
   };
 }
+const producers = new WeakMap();
 const setterTraps = {
   get(target, property) {
     if (property === $RAW) return target;
     const value = target[property];
-    return isWrappable(value) ? new Proxy(value, setterTraps) : value;
+    let proxy;
+    return isWrappable(value) ? producers.get(value) || (producers.set(value, proxy = new Proxy(value, setterTraps)), proxy) : value;
   },
   set(target, property, value) {
     setProperty(target, property, unwrap(value));
@@ -368,7 +377,13 @@ const setterTraps = {
 };
 function produce(fn) {
   return state => {
-    if (isWrappable(state)) fn(new Proxy(state, setterTraps));
+    if (isWrappable(state)) {
+      let proxy;
+      if (!(proxy = producers.get(state))) {
+        producers.set(state, proxy = new Proxy(state, setterTraps));
+      }
+      fn(proxy);
+    }
     return state;
   };
 }

package/store/dist/store.js

@@ -24,7 +24,8 @@ function wrap$1(value, name) {
   return p;
 }
 function isWrappable(obj) {
-  return obj != null && typeof obj === "object" && (obj[$PROXY] || !obj.__proto__ || obj.__proto__ === Object.prototype || Array.isArray(obj));
+  let proto;
+  return obj != null && typeof obj === "object" && (obj[$PROXY] || !(proto = Object.getPrototypeOf(obj)) || proto === Object.prototype || Array.isArray(obj));
 }
 function unwrap(item, set = new Set()) {
   let result, unwrapped, v, prop;
@@ -134,14 +135,16 @@ function mergeStoreNode(state, value) {
 function updateArray(current, next) {
   if (typeof next === "function") next = next(current);
   next = unwrap(next);
-  if (current === next) return;
-  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);
+  if (Array.isArray(next)) {
+    if (current === next) return;
+    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);
+  } else mergeStoreNode(current, next);
 }
 function updatePath(current, path, traversed = []) {
   let part,
@@ -188,7 +191,7 @@ function updatePath(current, path, traversed = []) {
     mergeStoreNode(prev, value);
   } else setProperty(current, part, value);
 }
-function createStore(store, options) {
+function createStore(...[store, options]) {
   const unwrappedStore = unwrap(store || {});
   const isArray = Array.isArray(unwrappedStore);
   const wrappedStore = wrap$1(unwrappedStore);
@@ -265,11 +268,15 @@ function modifyMutable(state, modifier) {
   batch(() => modifier(unwrap(state)));
 }
 
+const $ROOT = Symbol("store-root");
 function applyState(target, parent, property, merge, key) {
   const previous = parent[property];
   if (target === previous) return;
   if (!isWrappable(target) || !isWrappable(previous) || key && target[key] !== previous[key]) {
-    target !== previous && setProperty(parent, property, target);
+    if (target !== previous) {
+      if (property === $ROOT) return target;
+      setProperty(parent, property, target);
+    }
     return;
   }
   if (Array.isArray(target)) {
@@ -341,17 +348,19 @@ function reconcile(value, options = {}) {
         v = unwrap(value);
   return state => {
     if (!isWrappable(state) || !isWrappable(v)) return v;
-    batch(() => applyState(v, {
-      state
-    }, "state", merge, key));
-    return state;
+    const res = applyState(v, {
+      [$ROOT]: state
+    }, $ROOT, merge, key);
+    return res === undefined ? state : res;
   };
 }
+const producers = new WeakMap();
 const setterTraps = {
   get(target, property) {
     if (property === $RAW) return target;
     const value = target[property];
-    return isWrappable(value) ? new Proxy(value, setterTraps) : value;
+    let proxy;
+    return isWrappable(value) ? producers.get(value) || (producers.set(value, proxy = new Proxy(value, setterTraps)), proxy) : value;
   },
   set(target, property, value) {
     setProperty(target, property, unwrap(value));
@@ -364,7 +373,13 @@ const setterTraps = {
 };
 function produce(fn) {
   return state => {
-    if (isWrappable(state)) fn(new Proxy(state, setterTraps));
+    if (isWrappable(state)) {
+      let proxy;
+      if (!(proxy = producers.get(state))) {
+        producers.set(state, proxy = new Proxy(state, setterTraps));
+      }
+      fn(proxy);
+    }
     return state;
   };
 }

package/store/types/modifiers.d.ts

@@ -1,7 +1,6 @@
-import { DeepMutable } from "./store";
 export declare type ReconcileOptions = {
     key?: string | null;
     merge?: boolean;
 };
 export declare function reconcile<T extends U, U>(value: T, options?: ReconcileOptions): (state: U) => T;
-export declare function produce<T>(fn: (state: DeepMutable<T>) => void): (state: T) => T;
+export declare function produce<T>(fn: (state: T) => void): (state: T) => T;

package/store/types/server.d.ts

@@ -1,7 +1,7 @@
-import type { DeepMutable, SetStoreFunction, Store } from "store";
+import type { SetStoreFunction, Store } from "store";
 export declare const $RAW: unique symbol;
 export declare function isWrappable(obj: any): boolean;
-export declare function unwrap<T>(item: any): T;
+export declare function unwrap<T>(item: T): T;
 export declare function setProperty(state: any, property: PropertyKey, value: any, force?: boolean): void;
 export declare function updatePath(current: any, path: any[], traversed?: PropertyKey[]): void;
 export declare function createStore<T>(state: T | Store<T>): [Store<T>, SetStoreFunction<T>];
@@ -11,5 +11,5 @@ declare type ReconcileOptions = {
     merge?: boolean;
 };
 export declare function reconcile<T extends U, U>(value: T, options?: ReconcileOptions): (state: U) => T;
-export declare function produce<T>(fn: (state: DeepMutable<T>) => void): (state: T) => T;
+export declare function produce<T>(fn: (state: T) => void): (state: T) => T;
 export {};

package/store/types/store.d.ts

@@ -5,9 +5,9 @@ export declare namespace SolidStore {
     }
 }
 export declare type NotWrappable = string | number | bigint | symbol | boolean | Function | null | undefined | SolidStore.Unwrappable[keyof SolidStore.Unwrappable];
-export declare type Store<T> = DeepReadonly<T>;
-export declare function isWrappable(obj: any): any;
-export declare function unwrap<T extends StoreNode>(item: any, set?: Set<unknown>): T;
+export declare type Store<T> = T;
+export declare function isWrappable<T>(obj: T | NotWrappable): obj is T;
+export declare function unwrap<T>(item: T, set?: Set<unknown>): T;
 export declare function getDataNodes(target: StoreNode): any;
 export declare function getDataNode(nodes: Record<string, any>, property: string | symbol, value: any): any;
 export declare function proxyDescriptor(target: StoreNode, property: PropertyKey): PropertyDescriptor | undefined;
@@ -15,20 +15,27 @@ export declare function trackSelf(target: StoreNode): void;
 export declare function ownKeys(target: StoreNode): (string | symbol)[];
 export declare function setProperty(state: StoreNode, property: PropertyKey, value: any): void;
 export declare function updatePath(current: StoreNode, path: any[], traversed?: PropertyKey[]): void;
+/** @deprecated */
 export declare type DeepReadonly<T> = 0 extends 1 & T ? T : T extends NotWrappable ? T : {
     readonly [K in keyof T]: DeepReadonly<T[K]>;
 };
+/** @deprecated */
 export declare type DeepMutable<T> = 0 extends 1 & T ? T : T extends NotWrappable ? T : {
     -readonly [K in keyof T]: DeepMutable<T[K]>;
 };
+export declare type CustomPartial<T> = T extends readonly unknown[] ? "0" extends keyof T ? {
+    [K in Extract<keyof T, `${number}`>]?: T[K];
+} : {
+    [x: number]: T[number];
+} : Partial<T>;
 export declare type StorePathRange = {
     from?: number;
     to?: number;
     by?: number;
 };
-export declare type ArrayFilterFn<T> = (item: DeepReadonly<T>, index: number) => boolean;
-export declare type StoreSetter<T, U extends PropertyKey[] = []> = ((prevState: DeepReadonly<T>, traversed: U) => T | Partial<T> | DeepReadonly<T> | Partial<DeepReadonly<T>> | void) | T | Partial<T> | DeepReadonly<T> | Partial<DeepReadonly<T>>;
-export declare type Part<T, K extends KeyOf<T> = KeyOf<T>> = [K] extends [never] ? never : K | readonly K[] | ([T] extends [readonly unknown[]] ? ArrayFilterFn<T[number]> | StorePathRange : never);
+export declare type ArrayFilterFn<T> = (item: T, index: number) => boolean;
+export declare type StoreSetter<T, U extends PropertyKey[] = []> = ((prevState: T, traversed: U) => T | CustomPartial<T>) | T | CustomPartial<T>;
+export declare type Part<T, K extends KeyOf<T> = KeyOf<T>> = K | ([K] extends [never] ? never : readonly K[]) | ([T] extends [readonly unknown[]] ? ArrayFilterFn<T[number]> | StorePathRange : never);
 declare type W<T> = Exclude<T, NotWrappable>;
 declare type KeyOf<T> = number extends keyof T ? 0 extends 1 & T ? keyof T : [T] extends [readonly unknown[]] ? number : [T] extends [never] ? never : keyof T : keyof T;
 declare type Rest<T, U extends PropertyKey[]> = [StoreSetter<T, U>] | (0 extends 1 & T ? [...Part<any>[], StoreSetter<any, PropertyKey[]>] : DistributeRest<W<T>, KeyOf<W<T>>, U>);
@@ -48,7 +55,9 @@ export interface SetStoreFunction<T> {
  *
  * @description https://www.solidjs.com/docs/latest/api#createstore
  */
-export declare function createStore<T extends StoreNode>(store: T | Store<T>, options?: {
+export declare function createStore<T extends {}>(...[store, options]: {} extends T ? [store?: T | Store<T>, options?: {
     name?: string;
-}): [get: Store<T>, set: SetStoreFunction<T>];
+}] : [store: object & (T | Store<T>), options?: {
+    name?: string;
+}]): [get: Store<T>, set: SetStoreFunction<T>];
 export {};

package/types/reactive/signal.d.ts

@@ -11,6 +11,7 @@ export declare let Transition: TransitionState | null;
 declare let ExternalSourceFactory: ExternalSourceFactory | null;
 declare global {
     var _$afterUpdate: () => void;
+    var _$afterCreateRoot: (root: Owner) => void;
 }
 export interface SignalState<T> {
     value?: T;
@@ -200,13 +201,12 @@ export declare function createMemo<Next extends Prev, Init = Next, Prev = Next>(
 export interface Resource<T> extends Accessor<T> {
     loading: boolean;
     error: any;
-    latest: T | undefined;
+    latest: T;
 }
 export declare type ResourceActions<T> = {
     mutate: Setter<T>;
     refetch: (info?: unknown) => T | Promise<T> | undefined | null;
 };
-export declare type ResourceReturn<T> = [Resource<T>, ResourceActions<T>];
 export declare type ResourceSource<S> = S | false | null | undefined | (() => S | false | null | undefined);
 export declare type ResourceFetcher<S, T> = (k: S, info: ResourceFetcherInfo<T>) => T | Promise<T>;
 export declare type ResourceFetcherInfo<T> = {
@@ -224,6 +224,10 @@ export declare type ResourceOptions<T> = undefined extends T ? {
     deferStream?: boolean;
     onHydrated?: <S, T>(k: S, info: ResourceFetcherInfo<T>) => void;
 };
+export declare type ResourceReturn<T, O extends ResourceOptions<T | undefined> | undefined, K = T> = [
+    Resource<O extends undefined | null ? T | undefined : NonNullable<O>["initialValue"] extends undefined ? T | undefined : T>,
+    ResourceActions<K>
+];
 /**
  * Creates a resource that wraps a repeated promise in a reactive pattern:
  * ```typescript
@@ -249,10 +253,10 @@ export declare type ResourceOptions<T> = undefined extends T ? {
  *
  * @description https://www.solidjs.com/docs/latest/api#createresource
  */
-export declare function createResource<T, S = true>(fetcher: ResourceFetcher<S, T>, options?: ResourceOptions<undefined>): ResourceReturn<T | undefined>;
-export declare function createResource<T, S = true>(fetcher: ResourceFetcher<S, T>, options: ResourceOptions<T>): ResourceReturn<T>;
-export declare function createResource<T, S>(source: ResourceSource<S>, fetcher: ResourceFetcher<S, T>, options?: ResourceOptions<undefined>): ResourceReturn<T | undefined>;
-export declare function createResource<T, S>(source: ResourceSource<S>, fetcher: ResourceFetcher<S, T>, options: ResourceOptions<T>): ResourceReturn<T>;
+export declare function createResource<T, S = true>(fetcher: ResourceFetcher<S, T>, options?: ResourceOptions<undefined>): ResourceReturn<T | undefined, typeof options>;
+export declare function createResource<T, S = true>(fetcher: ResourceFetcher<S, T>, options: ResourceOptions<T>): ResourceReturn<T, typeof options>;
+export declare function createResource<T, S>(source: ResourceSource<S>, fetcher: ResourceFetcher<S, T>, options?: ResourceOptions<undefined>): ResourceReturn<T | undefined, typeof options>;
+export declare function createResource<T, S>(source: ResourceSource<S>, fetcher: ResourceFetcher<S, T>, options: ResourceOptions<T>): ResourceReturn<T, typeof options>;
 export interface DeferredOptions<T> {
     equals?: false | ((prev: T, next: T) => boolean);
     name?: string;

package/types/render/hydration.d.ts

@@ -7,7 +7,7 @@ declare type SharedConfig = {
     resources?: {
         [key: string]: any;
     };
-    load?: (id: string) => Promise<any> | undefined;
+    load?: (id: string) => Promise<any> | any | undefined;
     gather?: (key: string) => void;
     registry?: Map<string, Element>;
     done?: boolean;

package/web/dist/dev.cjs

@@ -5,8 +5,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var solidJs = require('solid-js');
 
 const booleans = ["allowfullscreen", "async", "autofocus", "autoplay", "checked", "controls", "default", "disabled", "formnovalidate", "hidden", "indeterminate", "ismap", "loop", "multiple", "muted", "nomodule", "novalidate", "open", "playsinline", "readonly", "required", "reversed", "seamless", "selected"];
-const Properties = new Set(["className", "value", "readOnly", "formNoValidate", "isMap", "noModule", "playsInline", ...booleans]);
-const ChildProperties = new Set(["innerHTML", "textContent", "innerText", "children"]);
+const Properties = /*#__PURE__*/new Set(["className", "value", "readOnly", "formNoValidate", "isMap", "noModule", "playsInline", ...booleans]);
+const ChildProperties = /*#__PURE__*/new Set(["innerHTML", "textContent", "innerText", "children"]);
 const Aliases = {
   className: "class",
   htmlFor: "for"
@@ -19,8 +19,8 @@ const PropAliases = {
   playsinline: "playsInline",
   readonly: "readOnly"
 };
-const DelegatedEvents = new Set(["beforeinput", "click", "dblclick", "contextmenu", "focusin", "focusout", "input", "keydown", "keyup", "mousedown", "mousemove", "mouseout", "mouseover", "mouseup", "pointerdown", "pointermove", "pointerout", "pointerover", "pointerup", "touchend", "touchmove", "touchstart"]);
-const SVGElements = new Set([
+const DelegatedEvents = /*#__PURE__*/new Set(["beforeinput", "click", "dblclick", "contextmenu", "focusin", "focusout", "input", "keydown", "keyup", "mousedown", "mousemove", "mouseout", "mouseover", "mouseup", "pointerdown", "pointermove", "pointerout", "pointerover", "pointerup", "touchend", "touchmove", "touchstart"]);
+const SVGElements = /*#__PURE__*/new Set([
 "altGlyph", "altGlyphDef", "altGlyphItem", "animate", "animateColor", "animateMotion", "animateTransform", "circle", "clipPath", "color-profile", "cursor", "defs", "desc", "ellipse", "feBlend", "feColorMatrix", "feComponentTransfer", "feComposite", "feConvolveMatrix", "feDiffuseLighting", "feDisplacementMap", "feDistantLight", "feFlood", "feFuncA", "feFuncB", "feFuncG", "feFuncR", "feGaussianBlur", "feImage", "feMerge", "feMergeNode", "feMorphology", "feOffset", "fePointLight", "feSpecularLighting", "feSpotLight", "feTile", "feTurbulence", "filter", "font", "font-face", "font-face-format", "font-face-name", "font-face-src", "font-face-uri", "foreignObject", "g", "glyph", "glyphRef", "hkern", "image", "line", "linearGradient", "marker", "mask", "metadata", "missing-glyph", "mpath", "path", "pattern", "polygon", "polyline", "radialGradient", "rect",
 "set", "stop",
 "svg", "switch", "symbol", "text", "textPath",
@@ -29,7 +29,7 @@ const SVGNamespace = {
   xlink: "http://www.w3.org/1999/xlink",
   xml: "http://www.w3.org/XML/1998/namespace"
 };
-const DOMElements = new Set(["html", "base", "head", "link", "meta", "style", "title", "body", "address", "article", "aside", "footer", "header", "main", "nav", "section", "body", "blockquote", "dd", "div", "dl", "dt", "figcaption", "figure", "hr", "li", "ol", "p", "pre", "ul", "a", "abbr", "b", "bdi", "bdo", "br", "cite", "code", "data", "dfn", "em", "i", "kbd", "mark", "q", "rp", "rt", "ruby", "s", "samp", "small", "span", "strong", "sub", "sup", "time", "u", "var", "wbr", "area", "audio", "img", "map", "track", "video", "embed", "iframe", "object", "param", "picture", "portal", "source", "svg", "math", "canvas", "noscript", "script", "del", "ins", "caption", "col", "colgroup", "table", "tbody", "td", "tfoot", "th", "thead", "tr", "button", "datalist", "fieldset", "form", "input", "label", "legend", "meter", "optgroup", "option", "output", "progress", "select", "textarea", "details", "dialog", "menu", "summary", "details", "slot", "template", "acronym", "applet", "basefont", "bgsound", "big", "blink", "center", "content", "dir", "font", "frame", "frameset", "hgroup", "image", "keygen", "marquee", "menuitem", "nobr", "noembed", "noframes", "plaintext", "rb", "rtc", "shadow", "spacer", "strike", "tt", "xmp", "a", "abbr", "acronym", "address", "applet", "area", "article", "aside", "audio", "b", "base", "basefont", "bdi", "bdo", "bgsound", "big", "blink", "blockquote", "body", "br", "button", "canvas", "caption", "center", "cite", "code", "col", "colgroup", "content", "data", "datalist", "dd", "del", "details", "dfn", "dialog", "dir", "div", "dl", "dt", "em", "embed", "fieldset", "figcaption", "figure", "font", "footer", "form", "frame", "frameset", "head", "header", "hgroup", "hr", "html", "i", "iframe", "image", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "link", "main", "map", "mark", "marquee", "menu", "menuitem", "meta", "meter", "nav", "nobr", "noembed", "noframes", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "picture", "plaintext", "portal", "pre", "progress", "q", "rb", "rp", "rt", "rtc", "ruby", "s", "samp", "script", "section", "select", "shadow", "slot", "small", "source", "spacer", "span", "strike", "strong", "style", "sub", "summary", "sup", "table", "tbody", "td", "template", "textarea", "tfoot", "th", "thead", "time", "title", "tr", "track", "tt", "u", "ul", "var", "video", "wbr", "xmp", "input"]);
+const DOMElements = /*#__PURE__*/new Set(["html", "base", "head", "link", "meta", "style", "title", "body", "address", "article", "aside", "footer", "header", "main", "nav", "section", "body", "blockquote", "dd", "div", "dl", "dt", "figcaption", "figure", "hr", "li", "ol", "p", "pre", "ul", "a", "abbr", "b", "bdi", "bdo", "br", "cite", "code", "data", "dfn", "em", "i", "kbd", "mark", "q", "rp", "rt", "ruby", "s", "samp", "small", "span", "strong", "sub", "sup", "time", "u", "var", "wbr", "area", "audio", "img", "map", "track", "video", "embed", "iframe", "object", "param", "picture", "portal", "source", "svg", "math", "canvas", "noscript", "script", "del", "ins", "caption", "col", "colgroup", "table", "tbody", "td", "tfoot", "th", "thead", "tr", "button", "datalist", "fieldset", "form", "input", "label", "legend", "meter", "optgroup", "option", "output", "progress", "select", "textarea", "details", "dialog", "menu", "summary", "details", "slot", "template", "acronym", "applet", "basefont", "bgsound", "big", "blink", "center", "content", "dir", "font", "frame", "frameset", "hgroup", "image", "keygen", "marquee", "menuitem", "nobr", "noembed", "noframes", "plaintext", "rb", "rtc", "shadow", "spacer", "strike", "tt", "xmp", "a", "abbr", "acronym", "address", "applet", "area", "article", "aside", "audio", "b", "base", "basefont", "bdi", "bdo", "bgsound", "big", "blink", "blockquote", "body", "br", "button", "canvas", "caption", "center", "cite", "code", "col", "colgroup", "content", "data", "datalist", "dd", "del", "details", "dfn", "dialog", "dir", "div", "dl", "dt", "em", "embed", "fieldset", "figcaption", "figure", "font", "footer", "form", "frame", "frameset", "head", "header", "hgroup", "hr", "html", "i", "iframe", "image", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "link", "main", "map", "mark", "marquee", "menu", "menuitem", "meta", "meter", "nav", "nobr", "noembed", "noframes", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "picture", "plaintext", "portal", "pre", "progress", "q", "rb", "rp", "rt", "rtc", "ruby", "s", "samp", "script", "section", "select", "shadow", "slot", "small", "source", "spacer", "span", "strike", "strong", "style", "sub", "summary", "sup", "table", "tbody", "td", "template", "textarea", "tfoot", "th", "thead", "time", "title", "tr", "track", "tt", "u", "ul", "var", "video", "wbr", "xmp", "input"]);
 
 function memo(fn, equals) {
   return solidJs.createMemo(fn, undefined, !equals ? {
@@ -146,7 +146,8 @@ function addEventListener(node, name, handler, delegate) {
       node[`$$${name}Data`] = handler[1];
     } else node[`$$${name}`] = handler;
   } else if (Array.isArray(handler)) {
-    node.addEventListener(name, e => handler[0](handler[1], e));
+    const handlerFn = handler[0];
+    node.addEventListener(name, handler[0] = e => handlerFn.call(node, handler[1], e));
   } else node.addEventListener(name, handler);
 }
 function classList(node, value, prev = {}) {
@@ -310,14 +311,24 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
       value(node);
     }
   } else if (prop.slice(0, 3) === "on:") {
-    node.addEventListener(prop.slice(3), value);
+    const e = prop.slice(3);
+    prev && node.removeEventListener(e, prev);
+    value && node.addEventListener(e, value);
   } else if (prop.slice(0, 10) === "oncapture:") {
-    node.addEventListener(prop.slice(10), value, true);
+    const e = prop.slice(10);
+    prev && node.removeEventListener(e, prev, true);
+    value && node.addEventListener(e, value, true);
   } else if (prop.slice(0, 2) === "on") {
     const name = prop.slice(2).toLowerCase();
     const delegate = DelegatedEvents.has(name);
-    addEventListener(node, name, value, delegate);
-    delegate && delegateEvents([name]);
+    if (!delegate && prev) {
+      const h = Array.isArray(prev) ? prev[0] : prev;
+      node.removeEventListener(name, h);
+    }
+    if (delegate || value) {
+      addEventListener(node, name, value, delegate);
+      delegate && delegateEvents([name]);
+    }
   } else if ((isChildProp = ChildProperties.has(prop)) || !isSVG && (PropAliases[prop] || (isProp = Properties.has(prop))) || (isCE = node.nodeName.includes("-"))) {
     if (prop === "class" || prop === "className") className(node, value);else if (isCE && !isProp && !isChildProp) node[toPropertyName(prop)] = value;else node[PropAliases[prop] || prop] = value;
   } else {
@@ -349,7 +360,7 @@ function eventHandler(e) {
     const handler = node[key];
     if (handler && !node.disabled) {
       const data = node[`${key}Data`];
-      data !== undefined ? handler(data, e) : handler(e);
+      data !== undefined ? handler.call(node, data, e) : handler.call(node, e);
       if (e.cancelBubble) return;
     }
     node = node.host && node.host !== node && node.host instanceof Node ? node.host : node.parentNode;
@@ -397,7 +408,8 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
     return () => current;
   } else if (Array.isArray(value)) {
     const array = [];
-    if (normalizeIncomingArray(array, value, unwrapArray)) {
+    const currentArray = current && Array.isArray(current);
+    if (normalizeIncomingArray(array, value, current, unwrapArray)) {
       solidJs.createRenderEffect(() => current = insertExpression(parent, array, current, marker, true));
       return () => current;
     }
@@ -409,7 +421,7 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
     if (array.length === 0) {
       current = cleanChildren(parent, current, marker);
       if (multi) return current;
-    } else if (Array.isArray(current)) {
+    } else if (currentArray) {
       if (current.length === 0) {
         appendNodes(parent, array, marker);
       } else reconcileArrays(parent, current, array);
@@ -430,26 +442,30 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
   } else console.warn(`Unrecognized value. Skipped inserting`, value);
   return current;
 }
-function normalizeIncomingArray(normalized, array, unwrap) {
+function normalizeIncomingArray(normalized, array, current, unwrap) {
   let dynamic = false;
   for (let i = 0, len = array.length; i < len; i++) {
     let item = array[i],
+        prev = current && current[i],
         t;
     if (item instanceof Node) {
       normalized.push(item);
     } else if (item == null || item === true || item === false) ; else if (Array.isArray(item)) {
-      dynamic = normalizeIncomingArray(normalized, item) || dynamic;
-    } else if ((t = typeof item) === "string") {
-      normalized.push(document.createTextNode(item));
-    } else if (t === "function") {
+      dynamic = normalizeIncomingArray(normalized, item, prev) || dynamic;
+    } else if ((t = typeof item) === "function") {
       if (unwrap) {
         while (typeof item === "function") item = item();
-        dynamic = normalizeIncomingArray(normalized, Array.isArray(item) ? item : [item]) || dynamic;
+        dynamic = normalizeIncomingArray(normalized, Array.isArray(item) ? item : [item], prev) || dynamic;
       } else {
         normalized.push(item);
         dynamic = true;
       }
-    } else normalized.push(document.createTextNode(item.toString()));
+    } else {
+      const value = t === "string" ? item : item.string();
+      if (prev && prev.nodeType === 3 && prev.data === value) {
+        normalized.push(prev);
+      } else normalized.push(document.createTextNode(value));
+    }
   }
   return dynamic;
 }
@@ -508,7 +524,7 @@ function resolveSSRNode(node) {}
 function ssrClassList(value) {}
 function ssrStyle(value) {}
 function ssrSpread(accessor) {}
-function ssrBoolean(key, value) {}
+function ssrAttribute(key, value) {}
 function ssrHydrationKey() {}
 function escape(html) {}
 function generateHydrationScript() {}
@@ -561,8 +577,9 @@ function Portal(props) {
 }
 function Dynamic(props) {
   const [p, others] = solidJs.splitProps(props, ["component"]);
+  const cached = solidJs.createMemo(() => p.component);
   return solidJs.createMemo(() => {
-    const component = p.component;
+    const component = cached();
     switch (typeof component) {
       case "function":
         Object.assign(component, {
@@ -667,7 +684,7 @@ exports.setAttribute = setAttribute;
 exports.setAttributeNS = setAttributeNS;
 exports.spread = spread;
 exports.ssr = ssr;
-exports.ssrBoolean = ssrBoolean;
+exports.ssrAttribute = ssrAttribute;
 exports.ssrClassList = ssrClassList;
 exports.ssrHydrationKey = ssrHydrationKey;
 exports.ssrSpread = ssrSpread;