solid-js 1.5.0-beta.4 → 1.5.0-beta.7

package/dist/dev.cjs

@@ -264,7 +264,7 @@ function createResource(pSource, pFetcher, pOptions) {
       resolved = ("initialValue" in options),
       dynamic = typeof source === "function" && createMemo(source);
   const contexts = new Set(),
-        [value, setValue] = options.store ? options.store(options.initialValue) : createSignal(options.initialValue),
+        [value, setValue] = (options.storage || createSignal)(options.initialValue),
         [track, trigger] = createSignal(undefined, {
     equals: false
   }),
@@ -272,7 +272,7 @@ function createResource(pSource, pFetcher, pOptions) {
   if (sharedConfig.context) {
     id = `${sharedConfig.context.id}${sharedConfig.context.count++}`;
     let v;
-    if (options.useInitialValue) initP = options.initialValue;else if (sharedConfig.load && (v = sharedConfig.load(id))) initP = v[0];
+    if (options.ssrLoadFrom === "initial") initP = options.initialValue;else if (sharedConfig.load && (v = sharedConfig.load(id))) initP = v[0];
   }
   function loadEnd(p, v, success, key) {
     if (pr === p) {
@@ -352,9 +352,6 @@ function createResource(pSource, pFetcher, pOptions) {
     return p.then(v => loadEnd(p, v, true, lookup), e => loadEnd(p, e, false));
   }
   Object.defineProperties(read, {
-    value: {
-      get: () => value()
-    },
     state: {
       get: () => state()
     },

package/dist/dev.js

@@ -260,7 +260,7 @@ function createResource(pSource, pFetcher, pOptions) {
       resolved = ("initialValue" in options),
       dynamic = typeof source === "function" && createMemo(source);
   const contexts = new Set(),
-        [value, setValue] = options.store ? options.store(options.initialValue) : createSignal(options.initialValue),
+        [value, setValue] = (options.storage || createSignal)(options.initialValue),
         [track, trigger] = createSignal(undefined, {
     equals: false
   }),
@@ -268,7 +268,7 @@ function createResource(pSource, pFetcher, pOptions) {
   if (sharedConfig.context) {
     id = `${sharedConfig.context.id}${sharedConfig.context.count++}`;
     let v;
-    if (options.useInitialValue) initP = options.initialValue;else if (sharedConfig.load && (v = sharedConfig.load(id))) initP = v[0];
+    if (options.ssrLoadFrom === "initial") initP = options.initialValue;else if (sharedConfig.load && (v = sharedConfig.load(id))) initP = v[0];
   }
   function loadEnd(p, v, success, key) {
     if (pr === p) {
@@ -348,9 +348,6 @@ function createResource(pSource, pFetcher, pOptions) {
     return p.then(v => loadEnd(p, v, true, lookup), e => loadEnd(p, e, false));
   }
   Object.defineProperties(read, {
-    value: {
-      get: () => value()
-    },
     state: {
       get: () => state()
     },

package/dist/server.cjs

@@ -396,10 +396,10 @@ function createResource(source, fetcher, options = {}) {
   const contexts = new Set();
   const id = sharedConfig.context.id + sharedConfig.context.count++;
   let resource = {};
-  let value = options.initialValue;
+  let value = options.storage ? options.storage(options.initialValue)[0]() : options.initialValue;
   let p;
   let error;
-  if (sharedConfig.context.async && !options.useInitialValue) {
+  if (sharedConfig.context.async && options.ssrLoadFrom !== "initial") {
     resource = sharedConfig.context.resources[id] || (sharedConfig.context.resources[id] = {});
     if (resource.ref) {
       if (!resource.data && !resource.ref[0].loading && !resource.ref[0].error) resource.ref[1].refetch();
@@ -409,7 +409,7 @@ function createResource(source, fetcher, options = {}) {
   const read = () => {
     if (error) throw error;
     if (resourceContext && p) resourceContext.push(p);
-    const resolved = !options.useInitialValue && sharedConfig.context.async && "data" in sharedConfig.context.resources[id];
+    const resolved = options.ssrLoadFrom !== "initial" && sharedConfig.context.async && "data" in sharedConfig.context.resources[id];
     if (!resolved && read.loading) {
       const ctx = useContext(SuspenseContext);
       if (ctx) {
@@ -422,12 +422,9 @@ function createResource(source, fetcher, options = {}) {
   read.loading = false;
   read.error = undefined;
   read.state = "initialValue" in options ? "resolved" : "unresolved";
-  Object.defineProperties(read, {
-    value: {
-      get: () => read()
-    },
-    latest: {
-      get: () => read()
+  Object.defineProperty(read, "latest", {
+    get() {
+      return read();
     }
   });
   function load() {
@@ -475,7 +472,7 @@ function createResource(source, fetcher, options = {}) {
     p = null;
     return ctx.resources[id].data;
   }
-  if (!options.useInitialValue) load();
+  if (options.ssrLoadFrom !== "initial") load();
   return resource.ref = [read, {
     refetch: load,
     mutate: v => value = v

package/dist/server.js

@@ -392,10 +392,10 @@ function createResource(source, fetcher, options = {}) {
   const contexts = new Set();
   const id = sharedConfig.context.id + sharedConfig.context.count++;
   let resource = {};
-  let value = options.initialValue;
+  let value = options.storage ? options.storage(options.initialValue)[0]() : options.initialValue;
   let p;
   let error;
-  if (sharedConfig.context.async && !options.useInitialValue) {
+  if (sharedConfig.context.async && options.ssrLoadFrom !== "initial") {
     resource = sharedConfig.context.resources[id] || (sharedConfig.context.resources[id] = {});
     if (resource.ref) {
       if (!resource.data && !resource.ref[0].loading && !resource.ref[0].error) resource.ref[1].refetch();
@@ -405,7 +405,7 @@ function createResource(source, fetcher, options = {}) {
   const read = () => {
     if (error) throw error;
     if (resourceContext && p) resourceContext.push(p);
-    const resolved = !options.useInitialValue && sharedConfig.context.async && "data" in sharedConfig.context.resources[id];
+    const resolved = options.ssrLoadFrom !== "initial" && sharedConfig.context.async && "data" in sharedConfig.context.resources[id];
     if (!resolved && read.loading) {
       const ctx = useContext(SuspenseContext);
       if (ctx) {
@@ -418,12 +418,9 @@ function createResource(source, fetcher, options = {}) {
   read.loading = false;
   read.error = undefined;
   read.state = "initialValue" in options ? "resolved" : "unresolved";
-  Object.defineProperties(read, {
-    value: {
-      get: () => read()
-    },
-    latest: {
-      get: () => read()
+  Object.defineProperty(read, "latest", {
+    get() {
+      return read();
     }
   });
   function load() {
@@ -471,7 +468,7 @@ function createResource(source, fetcher, options = {}) {
     p = null;
     return ctx.resources[id].data;
   }
-  if (!options.useInitialValue) load();
+  if (options.ssrLoadFrom !== "initial") load();
   return resource.ref = [read, {
     refetch: load,
     mutate: v => value = v

package/dist/solid.cjs

@@ -256,7 +256,7 @@ function createResource(pSource, pFetcher, pOptions) {
       resolved = ("initialValue" in options),
       dynamic = typeof source === "function" && createMemo(source);
   const contexts = new Set(),
-        [value, setValue] = options.store ? options.store(options.initialValue) : createSignal(options.initialValue),
+        [value, setValue] = (options.storage || createSignal)(options.initialValue),
         [track, trigger] = createSignal(undefined, {
     equals: false
   }),
@@ -264,7 +264,7 @@ function createResource(pSource, pFetcher, pOptions) {
   if (sharedConfig.context) {
     id = `${sharedConfig.context.id}${sharedConfig.context.count++}`;
     let v;
-    if (options.useInitialValue) initP = options.initialValue;else if (sharedConfig.load && (v = sharedConfig.load(id))) initP = v[0];
+    if (options.ssrLoadFrom === "initial") initP = options.initialValue;else if (sharedConfig.load && (v = sharedConfig.load(id))) initP = v[0];
   }
   function loadEnd(p, v, success, key) {
     if (pr === p) {
@@ -344,9 +344,6 @@ function createResource(pSource, pFetcher, pOptions) {
     return p.then(v => loadEnd(p, v, true, lookup), e => loadEnd(p, e, false));
   }
   Object.defineProperties(read, {
-    value: {
-      get: () => value()
-    },
     state: {
       get: () => state()
     },

package/dist/solid.js

@@ -252,7 +252,7 @@ function createResource(pSource, pFetcher, pOptions) {
       resolved = ("initialValue" in options),
       dynamic = typeof source === "function" && createMemo(source);
   const contexts = new Set(),
-        [value, setValue] = options.store ? options.store(options.initialValue) : createSignal(options.initialValue),
+        [value, setValue] = (options.storage || createSignal)(options.initialValue),
         [track, trigger] = createSignal(undefined, {
     equals: false
   }),
@@ -260,7 +260,7 @@ function createResource(pSource, pFetcher, pOptions) {
   if (sharedConfig.context) {
     id = `${sharedConfig.context.id}${sharedConfig.context.count++}`;
     let v;
-    if (options.useInitialValue) initP = options.initialValue;else if (sharedConfig.load && (v = sharedConfig.load(id))) initP = v[0];
+    if (options.ssrLoadFrom === "initial") initP = options.initialValue;else if (sharedConfig.load && (v = sharedConfig.load(id))) initP = v[0];
   }
   function loadEnd(p, v, success, key) {
     if (pr === p) {
@@ -340,9 +340,6 @@ function createResource(pSource, pFetcher, pOptions) {
     return p.then(v => loadEnd(p, v, true, lookup), e => loadEnd(p, e, false));
   }
   Object.defineProperties(read, {
-    value: {
-      get: () => value()
-    },
     state: {
       get: () => state()
     },

package/jsx-runtime.d.ts

@@ -1 +1 @@
-export * from "./types/jsx"
+export * from "./types/jsx";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "solid-js",
   "description": "A declarative JavaScript library for building user interfaces.",
-  "version": "1.5.0-beta.4",
+  "version": "1.5.0-beta.7",
   "author": "Ryan Carniato",
   "license": "MIT",
   "homepage": "https://solidjs.com",
@@ -73,6 +73,10 @@
       "require": "./dist/solid.cjs"
     },
     "./dist/*": "./dist/*",
+    "./jsx-runtime": {
+      "types": "./types/jsx.d.ts",
+      "default": "./dist/solid.js"
+    },
     "./store": {
       "browser": {
         "development": {
@@ -193,6 +197,9 @@
     "compiler",
     "performance"
   ],
+  "dependencies": {
+    "csstype": "^3.1.0"
+  },
   "scripts": {
     "build": "npm-run-all -nl build:*",
     "build:clean": "rimraf dist/ coverage/ store/dist/ web/dist/ h/dist/ h/jsx-runtime/dist html/dist/",

package/types/index.d.ts

@@ -1,5 +1,5 @@
 export { createRoot, createSignal, createEffect, createRenderEffect, createComputed, createReaction, createDeferred, createSelector, createMemo, createResource, onMount, onCleanup, onError, untrack, batch, on, enableScheduling, enableExternalSource, startTransition, useTransition, createContext, useContext, children, getListener, getOwner, runWithOwner, equalFn, $DEVCOMP, $PROXY, $TRACK } from "./reactive/signal.js";
-export type { Accessor, Setter, Signal, Resource, ResourceOptions, ResourceReturn, ResourceFetcher, ResourceFetcherInfo, ChildrenReturn, Context, ReturnTypes, Owner, InitializedResource, InitializedResourceOptions, InitializedResourceReturn } from "./reactive/signal.js";
+export type { Accessor, Setter, Signal, Resource, ResourceActions, ResourceSource, ResourceOptions, ResourceReturn, ResourceFetcher, ResourceFetcherInfo, ChildrenReturn, Context, ReturnTypes, Owner, InitializedResource, InitializedResourceOptions, InitializedResourceReturn } from "./reactive/signal.js";
 export * from "./reactive/observable.js";
 export * from "./reactive/scheduler.js";
 export * from "./reactive/array.js";

package/types/jsx.d.ts

@@ -1,4 +1,4 @@
-import * as csstype from 'csstype';
+import * as csstype from 'csstype/index.js';
 
 /**
  * Based on JSX types for Surplus and Inferno and adapted for `dom-expressions`.

package/types/reactive/signal.d.ts

@@ -197,7 +197,6 @@ export interface MemoOptions<T> extends EffectOptions {
 export declare function createMemo<Next extends Prev, Prev = Next>(fn: EffectFunction<undefined | NoInfer<Prev>, Next>): Accessor<Next>;
 export declare function createMemo<Next extends Prev, Init = Next, Prev = Next>(fn: EffectFunction<Init | Prev, Next>, value: Init, options?: MemoOptions<Next>): Accessor<Next>;
 interface Unresolved {
-    value: undefined;
     state: "unresolved";
     loading: false;
     error: undefined;
@@ -205,7 +204,6 @@ interface Unresolved {
     (): undefined;
 }
 interface Pending {
-    value: undefined;
     state: "pending";
     loading: true;
     error: undefined;
@@ -213,7 +211,6 @@ interface Pending {
     (): undefined;
 }
 interface Ready<T> {
-    value: T;
     state: "ready";
     loading: false;
     error: undefined;
@@ -221,7 +218,6 @@ interface Ready<T> {
     (): T;
 }
 interface Refreshing<T> {
-    value: T;
     state: "refreshing";
     loading: true;
     error: undefined;
@@ -229,7 +225,6 @@ interface Refreshing<T> {
     (): T;
 }
 interface Errored {
-    value: never;
     state: "errored";
     loading: false;
     error: any;
@@ -252,8 +247,8 @@ export declare type ResourceOptions<T, S = unknown> = {
     initialValue?: T;
     name?: string;
     deferStream?: boolean;
-    useInitialValue?: boolean;
-    store?: (init: T | undefined) => [Accessor<T | undefined>, Setter<T | undefined>];
+    ssrLoadFrom?: "initial" | "server";
+    storage?: (init: T | undefined) => [Accessor<T | undefined>, Setter<T | undefined>];
     onHydrated?: (k: S | undefined, info: {
         value: T | undefined;
     }) => void;

package/types/server/reactive.d.ts

@@ -4,6 +4,7 @@ export declare const $DEVCOMP: unique symbol;
 export declare const DEV: {};
 export declare type Accessor<T> = () => T;
 export declare type Setter<T> = undefined extends T ? <U extends T>(value?: (U extends Function ? never : U) | ((prev?: T) => U)) => U : <U extends T>(value: (U extends Function ? never : U) | ((prev: T) => U)) => U;
+export declare type Signal<T> = [get: Accessor<T>, set: Setter<T>];
 export declare const BRANCH: unique symbol;
 export declare function castError(err: any): string | Error;
 export declare let Owner: Owner | null;

package/types/server/rendering.d.ts

@@ -1,4 +1,4 @@
-import { Setter } from "./reactive.js";
+import { Setter, Signal } from "./reactive.js";
 import type { JSX } from "../jsx.js";
 export declare type Component<P = {}> = (props: P) => JSX.Element;
 export declare type VoidProps<P = {}> = P & {
@@ -72,7 +72,6 @@ export declare function ErrorBoundary(props: {
 };
 export interface Resource<T> {
     (): T | undefined;
-    value: T | undefined;
     state: "unresolved" | "pending" | "ready" | "refreshing" | "errored";
     loading: boolean;
     error: any;
@@ -101,13 +100,15 @@ export declare type ResourceOptions<T> = undefined extends T ? {
     initialValue?: T;
     name?: string;
     deferStream?: boolean;
-    useInitialValue?: boolean;
+    ssrLoadFrom?: "initial" | "server";
+    storage?: () => Signal<T | undefined>;
     onHydrated?: <S, T>(k: S, info: ResourceFetcherInfo<T>) => void;
 } : {
     initialValue: T;
     name?: string;
     deferStream?: boolean;
-    useInitialValue?: boolean;
+    ssrLoadFrom?: "initial" | "server";
+    storage?: (v?: T) => Signal<T | undefined>;
     onHydrated?: <S, T>(k: S, info: ResourceFetcherInfo<T>) => void;
 };
 export declare function createResource<T, S = true>(fetcher: ResourceFetcher<S, T>, options?: ResourceOptions<undefined>): ResourceReturn<T | undefined>;

package/web/dist/server.cjs

@@ -266,7 +266,8 @@ function toRefParam(index) {
 const REPLACE_SCRIPT = `function $df(e,t,d,l){d=document.getElementById(e),(l=document.getElementById("pl-"+e))&&l.replaceWith(...d.childNodes),d.remove(),_$HY.set(e,t)}`;
 function renderToString(code, options = {}) {
   let scripts = "";
-  solidJs.sharedConfig.context = {
+  let context;
+  solidJs.sharedConfig.context = context = {
     id: options.renderId || "",
     count: 0,
     suspense: {},
@@ -277,7 +278,9 @@ function renderToString(code, options = {}) {
       scripts += `_$HY.set("${id}", ${stringify(p)});`;
     }
   };
-  let html = injectAssets(solidJs.sharedConfig.context.assets, resolveSSRNode(escape(code())));
+  let html = resolveSSRNode(escape(code()));
+  solidJs.sharedConfig.context = undefined;
+  html = injectAssets(context.assets, html);
   if (scripts.length) html = injectScripts(html, scripts, options.nonce);
   return html;
 }
@@ -397,6 +400,7 @@ function renderToStream(code, options = {}) {
   };
   let html = resolveSSRNode(escape(code()));
   function doShell() {
+    solidJs.sharedConfig.context = undefined;
     html = injectAssets(context.assets, html);
     for (const key in context.resources) {
       if (!("data" in context.resources[key] || context.resources[key].ref[0].error)) pushTask(`_$HY.init("${key}")`);
@@ -634,7 +638,7 @@ function injectAssets(assets, html) {
   if (!assets || !assets.length) return html;
   let out = "";
   for (let i = 0, len = assets.length; i < len; i++) out += assets[i]();
-  return html.replace(`<head>`, `<head>` + out);
+  return html.replace(`</head>`, out + `</head>`);
 }
 function injectScripts(html, scripts, nonce) {
   const tag = `<script${nonce ? ` nonce="${nonce}"` : ""}>${scripts}</script>`;
@@ -725,7 +729,7 @@ function pipeToWritable(code, writable, options = {}) {
 }
 function ssrSpread(props, isSVG, skipChildren) {
   let result = "";
-  if (props == null) return results;
+  if (props == null) return result;
   if (typeof props === "function") props = props();
   const keys = Object.keys(props);
   let classResolved;

package/web/dist/server.js

@@ -263,7 +263,8 @@ function toRefParam(index) {
 const REPLACE_SCRIPT = `function $df(e,t,d,l){d=document.getElementById(e),(l=document.getElementById("pl-"+e))&&l.replaceWith(...d.childNodes),d.remove(),_$HY.set(e,t)}`;
 function renderToString(code, options = {}) {
   let scripts = "";
-  sharedConfig.context = {
+  let context;
+  sharedConfig.context = context = {
     id: options.renderId || "",
     count: 0,
     suspense: {},
@@ -274,7 +275,9 @@ function renderToString(code, options = {}) {
       scripts += `_$HY.set("${id}", ${stringify(p)});`;
     }
   };
-  let html = injectAssets(sharedConfig.context.assets, resolveSSRNode(escape(code())));
+  let html = resolveSSRNode(escape(code()));
+  sharedConfig.context = undefined;
+  html = injectAssets(context.assets, html);
   if (scripts.length) html = injectScripts(html, scripts, options.nonce);
   return html;
 }
@@ -394,6 +397,7 @@ function renderToStream(code, options = {}) {
   };
   let html = resolveSSRNode(escape(code()));
   function doShell() {
+    sharedConfig.context = undefined;
     html = injectAssets(context.assets, html);
     for (const key in context.resources) {
       if (!("data" in context.resources[key] || context.resources[key].ref[0].error)) pushTask(`_$HY.init("${key}")`);
@@ -631,7 +635,7 @@ function injectAssets(assets, html) {
   if (!assets || !assets.length) return html;
   let out = "";
   for (let i = 0, len = assets.length; i < len; i++) out += assets[i]();
-  return html.replace(`<head>`, `<head>` + out);
+  return html.replace(`</head>`, out + `</head>`);
 }
 function injectScripts(html, scripts, nonce) {
   const tag = `<script${nonce ? ` nonce="${nonce}"` : ""}>${scripts}</script>`;
@@ -722,7 +726,7 @@ function pipeToWritable(code, writable, options = {}) {
 }
 function ssrSpread(props, isSVG, skipChildren) {
   let result = "";
-  if (props == null) return results;
+  if (props == null) return result;
   if (typeof props === "function") props = props();
   const keys = Object.keys(props);
   let classResolved;

package/web/types/client.d.ts

@@ -62,7 +62,7 @@ export function getHydrationKey(): string;
 export function getNextElement(template?: HTMLTemplateElement): Element;
 export function getNextMatch(start: Node, elementName: string): Element;
 export function getNextMarker(start: Node): [Node, Array<Node>];
-export function useAsset(fn: () => string): void;
+export function useAssets(fn: () => string): void;
 export function getAssets(): string;
 export function Assets(props: { children?: JSX.Element }): JSX.Element;
 export function HydrationScript(): JSX.Element;

package/web/types/server.d.ts

@@ -37,7 +37,7 @@ export function ssrAttribute(key: string, value: any, isBoolean: boolean): strin
 export function ssrHydrationKey(): string;
 export function resolveSSRNode(node: any): string;
 export function escape(html: string): string;
-export function useAsset(fn: () => string): void;
+export function useAssets(fn: () => string): void;
 export function getAssets(): string;
 export function getHydrationKey(): string;
 export function effect<T>(fn: (prev?: T) => T, init?: T): void;