@solidjs/web 2.0.0-experimental.14 → 2.0.0-experimental.16

package/dist/web.cjs

@@ -19,6 +19,9 @@ const DOMElements = /*#__PURE__*/new Set(["html", "base", "head", "link", "meta"
 "webview",
 "isindex", "listing", "multicol", "nextid", "noindex", "search"]);
 
+const effect = (fn, effectFn, initial) => solidJs.createRenderEffect(fn, effectFn, initial, {
+  transparent: true
+});
 const memo = fn => solidJs.createMemo(() => fn());
 
 function reconcileArrays(parentNode, a, b) {
@@ -94,12 +97,13 @@ function render(code, element, init, options = {}) {
 }
 function template(html, isImportNode, isSVG, isMathML) {
   let node;
-  const create = () => {
+  const create = bypassGuard => {
     const t = isMathML ? document.createElementNS("http://www.w3.org/1998/Math/MathML", "template") : document.createElement("template");
     t.innerHTML = html;
     return isSVG ? t.content.firstChild.firstChild : isMathML ? t.firstChild : t.content.firstChild;
   };
-  return isImportNode ? () => solidJs.untrack(() => document.importNode(node || (node = create()), true)) : () => (node || (node = create())).cloneNode(true);
+  const fn = isImportNode ? bypassGuard => solidJs.untrack(() => document.importNode(node || (node = create()), true)) : bypassGuard => (node || (node = create())).cloneNode(true);
+  return fn;
 }
 function delegateEvents(eventNames, document = window.document) {
   const e = document[$$EVENTS] || (document[$$EVENTS] = new Set());
@@ -172,7 +176,7 @@ function addEventListener(node, name, handler, delegate) {
 }
 function style(node, value, prev) {
   if (!value) {
-    prev ? setAttribute(node, "style") : value;
+    if (prev) setAttribute(node, "style");
     return;
   }
   const nodeStyle = node.style;
@@ -194,13 +198,16 @@ function setStyleProperty(node, name, value) {
 function spread(node, props = {}, isSVG, skipChildren) {
   const prevProps = {};
   if (!skipChildren) {
-    solidJs.createRenderEffect(() => normalize(props.children, prevProps.children), value => {
+    effect(() => normalize(props.children, prevProps.children), value => {
       insertExpression(node, value, prevProps.children);
       prevProps.children = value;
     });
   }
-  solidJs.createRenderEffect(() => typeof props.ref === "function" && use(props.ref, node), () => {});
-  solidJs.createRenderEffect(() => {
+  effect(() => {
+    const r = props.ref;
+    (typeof r === "function" || Array.isArray(r)) && ref(() => r, node);
+  }, () => {});
+  effect(() => {
     const newProps = {};
     for (const prop in props) {
       if (prop === "children" || prop === "ref") continue;
@@ -220,17 +227,28 @@ function dynamicProperty(props, key) {
   });
   return props;
 }
-function use(fn, element, arg) {
-  solidJs.untrack(() => fn(element, arg));
+function applyRef(r, element) {
+  Array.isArray(r) ? r.flat(Infinity).forEach(f => f && f(element)) : r(element);
+}
+function ref(fn, element) {
+  const resolved = solidJs.untrack(fn);
+  solidJs.runWithOwner(null, () => applyRef(resolved, element));
 }
 function insert(parent, accessor, marker, initial) {
   const multi = marker !== undefined;
   if (multi && !initial) initial = [];
+  if (isHydrating(parent) && Array.isArray(initial)) {
+    let j = 0;
+    for (let i = 0; i < initial.length; i++) {
+      if (initial[i].nodeType === 8 && initial[i].nodeValue === "!$") initial[i].remove();else initial[j++] = initial[i];
+    }
+    initial.length = j;
+  }
   if (typeof accessor !== "function") {
     accessor = normalize(accessor, initial, multi, true);
     if (typeof accessor !== "function") return insertExpression(parent, accessor, initial, marker);
   }
-  solidJs.createRenderEffect(prev => normalize(accessor, prev, multi), (value, current) => insertExpression(parent, value, current, marker), initial);
+  effect(prev => normalize(accessor, prev, multi), (value, current) => insertExpression(parent, value, current, marker), initial);
 }
 function assign(node, props, isSVG, skipChildren, prevProps = {}, skipRef = false) {
   props || (props = {});
@@ -252,11 +270,29 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}, skipRef = fals
 function hydrate$1(code, element, options = {}) {
   if (globalThis._$HY.done) return render(code, element, [...element.childNodes], options);
   options.renderId ||= "";
+  if (!globalThis._$HY.modules) globalThis._$HY.modules = {};
+  if (!globalThis._$HY.loading) globalThis._$HY.loading = {};
   solidJs.sharedConfig.completed = globalThis._$HY.completed;
   solidJs.sharedConfig.events = globalThis._$HY.events;
   solidJs.sharedConfig.load = id => globalThis._$HY.r[id];
   solidJs.sharedConfig.has = id => id in globalThis._$HY.r;
   solidJs.sharedConfig.gather = root => gatherHydratable(element, root);
+  solidJs.sharedConfig.cleanupFragment = id => {
+    const tpl = document.getElementById("pl-" + id);
+    if (tpl) {
+      let node = tpl.nextSibling;
+      while (node) {
+        const next = node.nextSibling;
+        if (node.nodeType === 8 && node.nodeValue === "pl-" + id) {
+          node.remove();
+          break;
+        }
+        node.remove();
+        node = next;
+      }
+      tpl.remove();
+    }
+  };
   solidJs.sharedConfig.registry = new Map();
   solidJs.sharedConfig.hydrating = true;
   try {
@@ -271,7 +307,10 @@ function getNextElement(template) {
     key,
     hydrating = isHydrating();
   if (!hydrating || !(node = solidJs.sharedConfig.registry.get(key = getHydrationKey()))) {
-    return template();
+    if (!template) {
+      throw new Error(`Hydration Mismatch. Unable to find DOM nodes for hydration key: ${key}`);
+    }
+    return template(true);
   }
   if (solidJs.sharedConfig.completed) solidJs.sharedConfig.completed.add(node);
   solidJs.sharedConfig.registry.delete(key);
@@ -300,6 +339,14 @@ function getNextMarker(start) {
   }
   return [end, current];
 }
+function getFirstChild(node, expectedTag) {
+  const child = node.firstChild;
+  return child;
+}
+function getNextSibling(node, expectedTag) {
+  const sibling = node.nextSibling;
+  return sibling;
+}
 function runHydrationEvents() {
   if (solidJs.sharedConfig.events && !solidJs.sharedConfig.events.queued) {
     queueMicrotask(() => {
@@ -324,7 +371,7 @@ function runHydrationEvents() {
   }
 }
 function isHydrating(node) {
-  return solidJs.sharedConfig.hydrating && !solidJs.sharedConfig.done && (!node || node.isConnected);
+  return solidJs.sharedConfig.hydrating && (!node || node.isConnected);
 }
 function toggleClassKey(node, key, value) {
   const classNames = key.trim().split(/\s+/);
@@ -350,7 +397,7 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
   if (prop === "class") return className(node, value, isSVG, prev), value;
   if (value === prev) return prev;
   if (prop === "ref") {
-    if (!skipRef) value(node);
+    if (!skipRef && value) ref(() => value, node);
   } else if (prop.slice(0, 3) === "on:") {
     const e = prop.slice(3);
     prev && node.removeEventListener(e, prev, typeof prev !== "function" && prev);
@@ -406,7 +453,6 @@ function eventHandler(e) {
       return node || document;
     }
   });
-  if (solidJs.sharedConfig.registry && !solidJs.sharedConfig.done) solidJs.sharedConfig.done = _$HY.done = true;
   if (e.composedPath) {
     const path = e.composedPath();
     retarget(path[0]);
@@ -630,10 +676,6 @@ Object.defineProperty(exports, "createComponent", {
   enumerable: true,
   get: function () { return solidJs.createComponent; }
 });
-Object.defineProperty(exports, "effect", {
-  enumerable: true,
-  get: function () { return solidJs.createRenderEffect; }
-});
 Object.defineProperty(exports, "getOwner", {
   enumerable: true,
   get: function () { return solidJs.getOwner; }
@@ -660,25 +702,30 @@ exports.RequestContext = RequestContext;
 exports.SVGElements = SVGElements;
 exports.SVGNamespace = SVGNamespace;
 exports.addEventListener = addEventListener;
+exports.applyRef = applyRef;
 exports.assign = assign;
 exports.className = className;
 exports.clearDelegatedEvents = clearDelegatedEvents;
 exports.createDynamic = createDynamic;
 exports.delegateEvents = delegateEvents;
 exports.dynamicProperty = dynamicProperty;
+exports.effect = effect;
 exports.escape = escape;
 exports.generateHydrationScript = voidFn;
 exports.getAssets = voidFn;
+exports.getFirstChild = getFirstChild;
 exports.getHydrationKey = getHydrationKey;
 exports.getNextElement = getNextElement;
 exports.getNextMarker = getNextMarker;
 exports.getNextMatch = getNextMatch;
+exports.getNextSibling = getNextSibling;
 exports.getRequestEvent = voidFn;
 exports.hydrate = hydrate;
 exports.insert = insert;
 exports.isDev = isDev;
 exports.isServer = isServer;
 exports.memo = memo;
+exports.ref = ref;
 exports.render = render;
 exports.renderToStream = renderToStream;
 exports.renderToString = renderToString;
@@ -698,5 +745,4 @@ exports.ssrHydrationKey = ssrHydrationKey;
 exports.ssrStyle = ssrStyle;
 exports.style = style;
 exports.template = template;
-exports.use = use;
 exports.useAssets = voidFn;

package/dist/web.js

@@ -1,5 +1,5 @@
-import { createMemo, createRoot, flatten, untrack, createRenderEffect, sharedConfig, enableHydration, omit } from 'solid-js';
-export { Errored, For, Loading, Match, Show, Switch, createComponent, createRenderEffect as effect, getOwner, merge as mergeProps, untrack } from 'solid-js';
+import { createRenderEffect, createMemo, sharedConfig, untrack, runWithOwner, createRoot, flatten, omit, enableHydration } from 'solid-js';
+export { Errored, For, Loading, Match, Show, Switch, createComponent, getOwner, merge as mergeProps, untrack } from 'solid-js';
 
 const Properties = /*#__PURE__*/new Set([
 "value", "checked", "selected", "muted"]);
@@ -18,6 +18,9 @@ const DOMElements = /*#__PURE__*/new Set(["html", "base", "head", "link", "meta"
 "webview",
 "isindex", "listing", "multicol", "nextid", "noindex", "search"]);
 
+const effect = (fn, effectFn, initial) => createRenderEffect(fn, effectFn, initial, {
+  transparent: true
+});
 const memo = fn => createMemo(() => fn());
 
 function reconcileArrays(parentNode, a, b) {
@@ -93,12 +96,13 @@ function render(code, element, init, options = {}) {
 }
 function template(html, isImportNode, isSVG, isMathML) {
   let node;
-  const create = () => {
+  const create = bypassGuard => {
     const t = isMathML ? document.createElementNS("http://www.w3.org/1998/Math/MathML", "template") : document.createElement("template");
     t.innerHTML = html;
     return isSVG ? t.content.firstChild.firstChild : isMathML ? t.firstChild : t.content.firstChild;
   };
-  return isImportNode ? () => untrack(() => document.importNode(node || (node = create()), true)) : () => (node || (node = create())).cloneNode(true);
+  const fn = isImportNode ? bypassGuard => untrack(() => document.importNode(node || (node = create()), true)) : bypassGuard => (node || (node = create())).cloneNode(true);
+  return fn;
 }
 function delegateEvents(eventNames, document = window.document) {
   const e = document[$$EVENTS] || (document[$$EVENTS] = new Set());
@@ -171,7 +175,7 @@ function addEventListener(node, name, handler, delegate) {
 }
 function style(node, value, prev) {
   if (!value) {
-    prev ? setAttribute(node, "style") : value;
+    if (prev) setAttribute(node, "style");
     return;
   }
   const nodeStyle = node.style;
@@ -193,13 +197,16 @@ function setStyleProperty(node, name, value) {
 function spread(node, props = {}, isSVG, skipChildren) {
   const prevProps = {};
   if (!skipChildren) {
-    createRenderEffect(() => normalize(props.children, prevProps.children), value => {
+    effect(() => normalize(props.children, prevProps.children), value => {
       insertExpression(node, value, prevProps.children);
       prevProps.children = value;
     });
   }
-  createRenderEffect(() => typeof props.ref === "function" && use(props.ref, node), () => {});
-  createRenderEffect(() => {
+  effect(() => {
+    const r = props.ref;
+    (typeof r === "function" || Array.isArray(r)) && ref(() => r, node);
+  }, () => {});
+  effect(() => {
     const newProps = {};
     for (const prop in props) {
       if (prop === "children" || prop === "ref") continue;
@@ -219,17 +226,28 @@ function dynamicProperty(props, key) {
   });
   return props;
 }
-function use(fn, element, arg) {
-  untrack(() => fn(element, arg));
+function applyRef(r, element) {
+  Array.isArray(r) ? r.flat(Infinity).forEach(f => f && f(element)) : r(element);
+}
+function ref(fn, element) {
+  const resolved = untrack(fn);
+  runWithOwner(null, () => applyRef(resolved, element));
 }
 function insert(parent, accessor, marker, initial) {
   const multi = marker !== undefined;
   if (multi && !initial) initial = [];
+  if (isHydrating(parent) && Array.isArray(initial)) {
+    let j = 0;
+    for (let i = 0; i < initial.length; i++) {
+      if (initial[i].nodeType === 8 && initial[i].nodeValue === "!$") initial[i].remove();else initial[j++] = initial[i];
+    }
+    initial.length = j;
+  }
   if (typeof accessor !== "function") {
     accessor = normalize(accessor, initial, multi, true);
     if (typeof accessor !== "function") return insertExpression(parent, accessor, initial, marker);
   }
-  createRenderEffect(prev => normalize(accessor, prev, multi), (value, current) => insertExpression(parent, value, current, marker), initial);
+  effect(prev => normalize(accessor, prev, multi), (value, current) => insertExpression(parent, value, current, marker), initial);
 }
 function assign(node, props, isSVG, skipChildren, prevProps = {}, skipRef = false) {
   props || (props = {});
@@ -251,11 +269,29 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}, skipRef = fals
 function hydrate$1(code, element, options = {}) {
   if (globalThis._$HY.done) return render(code, element, [...element.childNodes], options);
   options.renderId ||= "";
+  if (!globalThis._$HY.modules) globalThis._$HY.modules = {};
+  if (!globalThis._$HY.loading) globalThis._$HY.loading = {};
   sharedConfig.completed = globalThis._$HY.completed;
   sharedConfig.events = globalThis._$HY.events;
   sharedConfig.load = id => globalThis._$HY.r[id];
   sharedConfig.has = id => id in globalThis._$HY.r;
   sharedConfig.gather = root => gatherHydratable(element, root);
+  sharedConfig.cleanupFragment = id => {
+    const tpl = document.getElementById("pl-" + id);
+    if (tpl) {
+      let node = tpl.nextSibling;
+      while (node) {
+        const next = node.nextSibling;
+        if (node.nodeType === 8 && node.nodeValue === "pl-" + id) {
+          node.remove();
+          break;
+        }
+        node.remove();
+        node = next;
+      }
+      tpl.remove();
+    }
+  };
   sharedConfig.registry = new Map();
   sharedConfig.hydrating = true;
   try {
@@ -270,7 +306,10 @@ function getNextElement(template) {
     key,
     hydrating = isHydrating();
   if (!hydrating || !(node = sharedConfig.registry.get(key = getHydrationKey()))) {
-    return template();
+    if (!template) {
+      throw new Error(`Hydration Mismatch. Unable to find DOM nodes for hydration key: ${key}`);
+    }
+    return template(true);
   }
   if (sharedConfig.completed) sharedConfig.completed.add(node);
   sharedConfig.registry.delete(key);
@@ -299,6 +338,14 @@ function getNextMarker(start) {
   }
   return [end, current];
 }
+function getFirstChild(node, expectedTag) {
+  const child = node.firstChild;
+  return child;
+}
+function getNextSibling(node, expectedTag) {
+  const sibling = node.nextSibling;
+  return sibling;
+}
 function runHydrationEvents() {
   if (sharedConfig.events && !sharedConfig.events.queued) {
     queueMicrotask(() => {
@@ -323,7 +370,7 @@ function runHydrationEvents() {
   }
 }
 function isHydrating(node) {
-  return sharedConfig.hydrating && !sharedConfig.done && (!node || node.isConnected);
+  return sharedConfig.hydrating && (!node || node.isConnected);
 }
 function toggleClassKey(node, key, value) {
   const classNames = key.trim().split(/\s+/);
@@ -349,7 +396,7 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
   if (prop === "class") return className(node, value, isSVG, prev), value;
   if (value === prev) return prev;
   if (prop === "ref") {
-    if (!skipRef) value(node);
+    if (!skipRef && value) ref(() => value, node);
   } else if (prop.slice(0, 3) === "on:") {
     const e = prop.slice(3);
     prev && node.removeEventListener(e, prev, typeof prev !== "function" && prev);
@@ -405,7 +452,6 @@ function eventHandler(e) {
       return node || document;
     }
   });
-  if (sharedConfig.registry && !sharedConfig.done) sharedConfig.done = _$HY.done = true;
   if (e.composedPath) {
     const path = e.composedPath();
     retarget(path[0]);
@@ -601,4 +647,4 @@ function Dynamic(props) {
   return createDynamic(() => props.component, others);
 }
 
-export { voidFn as Assets, ChildProperties, DOMElements, DelegatedEvents, Dynamic, Hydration, voidFn as HydrationScript, NoHydration, Portal, Properties, RequestContext, SVGElements, SVGNamespace, addEventListener, assign, className, clearDelegatedEvents, createDynamic, delegateEvents, dynamicProperty, escape, voidFn as generateHydrationScript, voidFn as getAssets, getHydrationKey, getNextElement, getNextMarker, getNextMatch, voidFn as getRequestEvent, hydrate, insert, isDev, isServer, memo, render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, setProperty, setStyleProperty, spread, ssr, ssrAttribute, ssrClassList, ssrElement, ssrHydrationKey, ssrStyle, style, template, use, voidFn as useAssets };
+export { voidFn as Assets, ChildProperties, DOMElements, DelegatedEvents, Dynamic, Hydration, voidFn as HydrationScript, NoHydration, Portal, Properties, RequestContext, SVGElements, SVGNamespace, addEventListener, applyRef, assign, className, clearDelegatedEvents, createDynamic, delegateEvents, dynamicProperty, effect, escape, voidFn as generateHydrationScript, voidFn as getAssets, getFirstChild, getHydrationKey, getNextElement, getNextMarker, getNextMatch, getNextSibling, voidFn as getRequestEvent, hydrate, insert, isDev, isServer, memo, ref, render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, setProperty, setStyleProperty, spread, ssr, ssrAttribute, ssrClassList, ssrElement, ssrHydrationKey, ssrStyle, style, template, voidFn as useAssets };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@solidjs/web",
   "description": "Solid's web runtime for the browser and the server",
-  "version": "2.0.0-experimental.14",
+  "version": "2.0.0-experimental.16",
   "author": "Ryan Carniato",
   "license": "MIT",
   "homepage": "https://solidjs.com",
@@ -75,10 +75,10 @@
     "seroval-plugins": "^1.1.0"
   },
   "peerDependencies": {
-    "solid-js": "^2.0.0-experimental.14"
+    "solid-js": "^2.0.0-experimental.16"
   },
   "devDependencies": {
-    "solid-js": "2.0.0-experimental.14"
+    "solid-js": "2.0.0-experimental.16"
   },
   "scripts": {
     "build": "npm-run-all -nl build:*",
@@ -90,7 +90,8 @@
     "types:web": "tsc --project ./tsconfig.build.json",
     "types:copy-web": "ncp ../../node_modules/dom-expressions/src/client.d.ts ./types/client.d.ts && ncp ../../node_modules/dom-expressions/src/server.d.ts ./types/server.d.ts",
     "types:web-storage": "tsc --project ./storage/tsconfig.build.json",
-    "test": "vitest run",
+    "test": "vitest run && vitest run --config vite.config.server.mjs && vitest run --config vite.config.hydrate.mjs",
+    "test:server": "vitest run --config vite.config.server.mjs",
     "coverage": "vitest run --coverage",
     "test-types": "tsc --project tsconfig.test.json"
   }

package/storage/types/src/client.d.ts

@@ -0,0 +1 @@
+export * from "dom-expressions/src/client.js";

package/storage/types/src/index.d.ts

@@ -0,0 +1,45 @@
+import { hydrate as hydrateCore } from "./client.js";
+import { JSX, ComponentProps, ValidComponent } from "solid-js";
+export * from "./client.js";
+export { For, Show, Switch, Match, Errored, Loading, merge as mergeProps } from "solid-js";
+export * from "./server-mock.js";
+export declare const isServer: boolean;
+export declare const isDev: boolean;
+export declare const hydrate: typeof hydrateCore;
+/**
+ * Renders components somewhere else in the DOM
+ *
+ * Useful for inserting modals and tooltips outside of an cropping layout. If no mount point is given, the portal is inserted in document.body; it is wrapped in a `<div>` unless the target is document.head or `isSVG` is true. setting `useShadow` to true places the element in a shadow root to isolate styles.
+ *
+ * @description https://docs.solidjs.com/reference/components/portal
+ */
+export declare function Portal<T extends boolean = false, S extends boolean = false>(props: {
+    mount?: Element;
+    children: JSX.Element;
+}): Text;
+export type DynamicProps<T extends ValidComponent, P = ComponentProps<T>> = {
+    [K in keyof P]: P[K];
+} & {
+    component: T | undefined;
+};
+/**
+ * Renders an arbitrary component or element with the given props
+ *
+ * This is a lower level version of the `Dynamic` component, useful for
+ * performance optimizations in libraries. Do not use this unless you know
+ * what you are doing.
+ * ```typescript
+ * const element = () => multiline() ? 'textarea' : 'input';
+ * createDynamic(element, { value: value() });
+ * ```
+ * @description https://docs.solidjs.com/reference/components/dynamic
+ */
+export declare function createDynamic<T extends ValidComponent>(component: () => T | undefined, props: ComponentProps<T>): JSX.Element;
+/**
+ * Renders an arbitrary custom or native component and passes the other props
+ * ```typescript
+ * <Dynamic component={multiline() ? 'textarea' : 'input'} value={value()} />
+ * ```
+ * @description https://docs.solidjs.com/reference/components/dynamic
+ */
+export declare function Dynamic<T extends ValidComponent>(props: DynamicProps<T>): JSX.Element;

package/storage/types/src/server-mock.d.ts

@@ -0,0 +1,72 @@
+export declare function renderToString<T>(fn: () => T, options?: {
+    nonce?: string;
+    renderId?: string;
+    noScripts?: boolean;
+    plugins?: any[];
+    manifest?: Record<string, {
+        file: string;
+        css?: string[];
+        isEntry?: boolean;
+        isDynamicEntry?: boolean;
+        imports?: string[];
+    }>;
+    onError?: (err: any) => void;
+}): string;
+export declare function renderToStringAsync<T>(fn: () => T, options?: {
+    timeoutMs?: number;
+    nonce?: string;
+    renderId?: string;
+    noScripts?: boolean;
+    plugins?: any[];
+    manifest?: Record<string, {
+        file: string;
+        css?: string[];
+        isEntry?: boolean;
+        isDynamicEntry?: boolean;
+        imports?: string[];
+    }>;
+    onError?: (err: any) => void;
+}): Promise<string>;
+export declare function renderToStream<T>(fn: () => T, options?: {
+    nonce?: string;
+    renderId?: string;
+    noScripts?: boolean;
+    plugins?: any[];
+    manifest?: Record<string, {
+        file: string;
+        css?: string[];
+        isEntry?: boolean;
+        isDynamicEntry?: boolean;
+        imports?: string[];
+    }>;
+    onCompleteShell?: (info: {
+        write: (v: string) => void;
+    }) => void;
+    onCompleteAll?: (info: {
+        write: (v: string) => void;
+    }) => void;
+    onError?: (err: any) => void;
+}): {
+    then: (fn: (html: string) => void) => void;
+    pipe: (writable: {
+        write: (v: string) => void;
+        end: () => void;
+    }) => void;
+    pipeTo: (writable: WritableStream) => Promise<void>;
+};
+export declare function ssr(template: string[] | string, ...nodes: any[]): {
+    t: string;
+};
+export declare function ssrElement(name: string, props: any, children: any, needsId: boolean): {
+    t: string;
+};
+export declare function ssrClassList(value: {
+    [k: string]: boolean;
+}): string;
+export declare function ssrStyle(value: {
+    [k: string]: string;
+}): string;
+export declare function ssrAttribute(key: string, value: boolean): string;
+export declare function ssrHydrationKey(): string;
+export declare function resolveSSRNode(node: any): string;
+export declare function escape(html: string): string;

package/storage/types/storage/src/index.d.ts

@@ -0,0 +1,2 @@
+import type { RequestEvent } from "@solidjs/web";
+export declare function provideRequestEvent<T extends RequestEvent, U>(init: T, cb: () => U): U;

package/types/client.d.ts

@@ -7,8 +7,13 @@ export const SVGElements: Set<string>;
 export const SVGNamespace: Record<string, string>;
 
 type MountableElement = Element | Document | ShadowRoot | DocumentFragment | Node;
-export function render(code: () => JSX.Element, element: MountableElement): () => void;
-export function template(html: string, isCE?: boolean, isSVG?: boolean): () => Element;
+export function render(
+  code: () => JSX.Element,
+  element: MountableElement,
+  init?: JSX.Element,
+  options?: { owner?: unknown }
+): () => void;
+export function template(html: string, isImportNode?: boolean, isSVG?: boolean, isMathML?: boolean): () => Element;
 export function effect<T>(fn: (prev?: T) => T, effect: (value: T, prev?: T) => void, init?: T): void;
 export function memo<T>(fn: () => T, equal: boolean): () => T;
 export function untrack<T>(fn: () => T): T;
@@ -27,7 +32,14 @@ export function spread<T>(
   isSVG?: Boolean,
   skipChildren?: Boolean
 ): void;
-export function assign(node: Element, props: any, isSVG?: Boolean, skipChildren?: Boolean): void;
+export function assign(
+  node: Element,
+  props: any,
+  isSVG?: Boolean,
+  skipChildren?: Boolean,
+  prevProps?: any,
+  skipRef?: Boolean
+): void;
 export function setAttribute(node: Element, name: string, value: string): void;
 export function setAttributeNS(node: Element, namespace: string, name: string, value: string): void;
 type ClassList =
@@ -35,6 +47,7 @@ type ClassList =
   | Array<string | number | boolean | null | undefined | Record<string, boolean>>;
 export function className(node: Element, value: string | ClassList, isSvg?: boolean, prev?: string | ClassList): void;
 export function setProperty(node: Element, name: string, value: any): void;
+export function setStyleProperty(node: Element, name: string, value: any): void;
 export function addEventListener(
   node: Element,
   name: string,
@@ -49,25 +62,28 @@ export function style(
 export function getOwner(): unknown;
 export function mergeProps(...sources: unknown[]): unknown;
 export function dynamicProperty(props: unknown, key: string): unknown;
+export function applyRef(r: ((element: Element) => void) | ((element: Element) => void)[], element: Element): void;
+export function ref(fn: () => ((element: Element) => void) | ((element: Element) => void)[], element: Element): void;
 
 export function hydrate(
   fn: () => JSX.Element,
   node: MountableElement,
   options?: { renderId?: string; owner?: unknown }
 ): () => void;
-export function getHydrationKey(): string;
-export function getNextElement(template?: HTMLTemplateElement): Element;
+export function getHydrationKey(): string | undefined;
+export function getNextElement(template?: () => Element): Element;
 export function getNextMatch(start: Node, elementName: string): Element;
 export function getNextMarker(start: Node): [Node, Array<Node>];
 export function useAssets(fn: () => JSX.Element): void;
 export function getAssets(): string;
-export function HydrationScript(): JSX.Element;
-export function generateHydrationScript(): string;
+export function HydrationScript(props?: { nonce?: string; eventNames?: string[] }): JSX.Element;
+export function generateHydrationScript(options?: { nonce?: string; eventNames?: string[] }): string;
 export function Assets(props: { children?: JSX.Element }): JSX.Element;
 export function Hydration(props: { children?: JSX.Element }): JSX.Element;
 export function NoHydration(props: { children?: JSX.Element }): JSX.Element;
 export interface RequestEvent {
   request: Request;
+  locals: Record<string | number | symbol, any>;
 }
 export declare const RequestContext: unique symbol;
 export function getRequestEvent(): RequestEvent | undefined;

package/types/core.d.ts

@@ -1,2 +1,3 @@
-export { getOwner, createComponent, createRoot as root, createRenderEffect as effect, sharedConfig, untrack, merge as mergeProps, flatten, ssrHandleError, ssrRunInScope } from "solid-js";
+export { getOwner, runWithOwner, createComponent, createRoot as root, sharedConfig, untrack, merge as mergeProps, flatten, ssrHandleError, ssrRunInScope } from "solid-js";
+export declare const effect: (fn: any, effectFn: any, initial: any) => void;
 export declare const memo: (fn: any) => import("solid-js").Accessor<any>;