@solid-primitives/rootless
Advanced tools
Comparing version 1.2.6 to 1.3.0
@@ -53,8 +53,8 @@ import { Owner } from 'solid-js'; | ||
/** | ||
* Creates a reactive root that is shared across every instance it was used in. Shared root gets created when the returned function gets first called, and disposed when last reactive context listening to it gets disposed. Only to be recreated again when a new listener appears. | ||
* Creates a reactive root that is shared across every instance it was used in. Singleton root gets created when the returned function gets first called, and disposed when last reactive context listening to it gets disposed. Only to be recreated again when a new listener appears. | ||
* @param factory function where you initialize your reactive primitives | ||
* @returns function, registering reactive owner as one of the listeners, returns the value {@link factory} returned. | ||
* @see https://github.com/davedbase/solid-primitives/tree/main/packages/rootless#createSharedRoot | ||
* @see https://github.com/davedbase/solid-primitives/tree/main/packages/rootless#createSingletonRoot | ||
* @example | ||
* const useState = createSharedScope(() => { | ||
* const useState = createSingletonRoot(() => { | ||
* return createMemo(() => {...}) | ||
@@ -72,4 +72,20 @@ * }); | ||
*/ | ||
declare function createSharedRoot<T>(factory: (dispose: VoidFunction) => T): () => T; | ||
declare function createSingletonRoot<T>(factory: (dispose: VoidFunction) => T, detachedOwner?: Owner | null): () => T; | ||
/** @deprecated Renamed to `createSingletonRoot` */ | ||
declare const createSharedRoot: typeof createSingletonRoot; | ||
/** | ||
* @warning Experimental API - there might be a better way so solve singletons with SSR and hydration. | ||
* | ||
* A hydratable version of {@link createSingletonRoot}. | ||
* It will create a singleton root, unless it's running in SSR or during hydration. | ||
* Then it will deopt to a calling the {@link factory} function with a regular root. | ||
* @param factory function where you initialize your reactive primitives | ||
* @returns | ||
* ```ts | ||
* // function that returns the value returned by factory | ||
* () => T | ||
* ``` | ||
*/ | ||
declare function createHydratableSingletonRoot<T>(factory: (dispose: VoidFunction) => T): () => T; | ||
export { createBranch, createCallback, createDisposable, createSharedRoot, createSubRoot }; | ||
export { createBranch, createCallback, createDisposable, createHydratableSingletonRoot, createSharedRoot, createSingletonRoot, createSubRoot }; |
@@ -1,2 +0,2 @@ | ||
import { getOwner, createRoot, runWithOwner, onCleanup } from 'solid-js'; | ||
import { getOwner, createRoot, runWithOwner, onCleanup, sharedConfig } from 'solid-js'; | ||
import { asArray, access } from '@solid-primitives/utils'; | ||
@@ -23,28 +23,28 @@ | ||
} | ||
function createSharedRoot(factory) { | ||
let listeners = 0; | ||
let value; | ||
let dispose; | ||
function createSingletonRoot(factory, detachedOwner = getOwner()) { | ||
let listeners = 0, value, disposeRoot; | ||
return () => { | ||
if (!dispose) { | ||
createRoot((_dispose) => { | ||
value = factory(_dispose); | ||
dispose = _dispose; | ||
}); | ||
} | ||
listeners++; | ||
getOwner() && onCleanup(() => { | ||
onCleanup(() => { | ||
listeners--; | ||
queueMicrotask(() => { | ||
if (listeners || !dispose) | ||
return; | ||
dispose(); | ||
dispose = void 0; | ||
value = void 0; | ||
if (!listeners && disposeRoot) { | ||
disposeRoot(); | ||
disposeRoot = value = void 0; | ||
} | ||
}); | ||
}); | ||
if (!disposeRoot) { | ||
createRoot((dispose) => value = factory(disposeRoot = dispose), detachedOwner); | ||
} | ||
return value; | ||
}; | ||
} | ||
var createSharedRoot = createSingletonRoot; | ||
function createHydratableSingletonRoot(factory) { | ||
const owner = getOwner(); | ||
const singleton = createSingletonRoot(factory, owner); | ||
return () => sharedConfig.context ? createRoot(factory, owner) : singleton(); | ||
} | ||
export { createBranch, createCallback, createDisposable, createSharedRoot, createSubRoot }; | ||
export { createBranch, createCallback, createDisposable, createHydratableSingletonRoot, createSharedRoot, createSingletonRoot, createSubRoot }; |
{ | ||
"name": "@solid-primitives/rootless", | ||
"version": "1.2.6", | ||
"version": "1.3.0", | ||
"description": "A collection of helpers that aim to simplify using reactive primitives outside of reactive roots, and managing disposal of reactive roots.", | ||
@@ -29,7 +29,38 @@ "author": "Damian Tarnawski @thetarnav <gthetarnav@gmail.com>", | ||
"type": "module", | ||
"main": "./dist/index.cjs", | ||
"module": "./dist/index.js", | ||
"main": "./dist/server.cjs", | ||
"module": "./dist/server.js", | ||
"types": "./dist/index.d.ts", | ||
"browser": {}, | ||
"browser": { | ||
"./dist/server.js": "./dist/index.js", | ||
"./dist/server.cjs": "./dist/index.cjs" | ||
}, | ||
"exports": { | ||
"worker": { | ||
"import": { | ||
"types": "./dist/index.d.ts", | ||
"default": "./dist/server.js" | ||
}, | ||
"require": "./dist/server.cjs" | ||
}, | ||
"browser": { | ||
"import": { | ||
"types": "./dist/index.d.ts", | ||
"default": "./dist/index.js" | ||
}, | ||
"require": "./dist/index.cjs" | ||
}, | ||
"deno": { | ||
"import": { | ||
"types": "./dist/index.d.ts", | ||
"default": "./dist/server.js" | ||
}, | ||
"require": "./dist/server.cjs" | ||
}, | ||
"node": { | ||
"import": { | ||
"types": "./dist/index.d.ts", | ||
"default": "./dist/server.js" | ||
}, | ||
"require": "./dist/server.cjs" | ||
}, | ||
"import": { | ||
@@ -47,3 +78,3 @@ "types": "./dist/index.d.ts", | ||
"dependencies": { | ||
"@solid-primitives/utils": "^5.4.0" | ||
"@solid-primitives/utils": "^5.5.0" | ||
}, | ||
@@ -55,3 +86,3 @@ "peerDependencies": { | ||
"scripts": { | ||
"build": "jiti ../../scripts/build.ts", | ||
"build": "jiti ../../scripts/build.ts --ssr", | ||
"test": "vitest -c ../../configs/vitest.config.ts", | ||
@@ -58,0 +89,0 @@ "test:ssr": "pnpm run test --mode ssr" |
@@ -17,3 +17,3 @@ <p> | ||
- [`createDisposable`](#createDisposable) - For disposing computations early – before the root cleanup. | ||
- [`createSharedRoot`](#createSharedRoot) - Share "global primitives" across multiple reactive scopes. | ||
- [`createSingletonRoot`](#createSingletonRoot) - Share "global primitives" across multiple reactive scopes. | ||
@@ -25,2 +25,4 @@ ## Installation | ||
# or | ||
pnpm add @solid-primitives/rootless | ||
# or | ||
yarn add @solid-primitives/rootless | ||
@@ -120,6 +122,4 @@ ``` | ||
## `createSharedRoot` | ||
## `createSingletonRoot` | ||
###### Added in `@1.1.0` | ||
Creates a reactive root that is shared across every instance it was used in. Shared root gets created when the returned function gets first called, and disposed when last reactive context listening to it gets disposed. Only to be recreated again when a new listener appears. | ||
@@ -131,3 +131,3 @@ | ||
`createSharedRoot` primitive takes a single argument: | ||
`createSingletonRoot` primitive takes a single argument: | ||
@@ -139,5 +139,5 @@ - `factory` - a function where can you initialize some reactive primitives, returned value will be shared across instances. | ||
```ts | ||
import { createSharedRoot } from "@solid-primitives/rootless"; | ||
import { createSingletonRoot } from "@solid-primitives/rootless"; | ||
const useState = createSharedRoot(() => { | ||
const useState = createSingletonRoot(() => { | ||
return createMemo(() => {...}) | ||
@@ -159,8 +159,17 @@ }); | ||
```ts | ||
function createSharedRoot<T>(factory: (dispose: Fn) => T): () => T; | ||
function createSingletonRoot<T>(factory: (dispose: Fn) => T): () => T; | ||
``` | ||
### `createHydratableSingletonRoot` | ||
A experimental version of `createSingletonRoot` that will deopt of creating a singleton root if used in SSR or during hydration. | ||
The reason for this is that `createSingletonRoot` will create a root that will be shared across all instances of the primitive, and this could mean state leaking between different requests. | ||
And during hydration, if you were to update the shared state before the hydration is finished, it could cause a mismatch between the server and client. | ||
The API is experimental, and likely to change or be merged into `createSingletonRoot` in the future. | ||
### Demo | ||
Usage of combining `createSharedRoot` with `createMousePosition`: https://codesandbox.io/s/shared-root-demo-fjl1l9?file=/index.tsx | ||
Usage of combining `createSingletonRoot` with `createMousePosition`: https://codesandbox.io/s/shared-root-demo-fjl1l9?file=/index.tsx | ||
@@ -167,0 +176,0 @@ ## Changelog |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
20105
8
283
173