@solid-primitives/rootless
Advanced tools
+13
-16
@@ -1,4 +0,3 @@ | ||
| import { Owner, Accessor } from 'solid-js'; | ||
| import { AnyFunction } from '@solid-primitives/utils'; | ||
| import { Owner, Accessor } from "solid-js"; | ||
| import { AnyFunction } from "@solid-primitives/utils"; | ||
| /** | ||
@@ -19,5 +18,5 @@ * Creates a reactive **sub root**, that will be automatically disposed when it's owner does. | ||
| */ | ||
| declare function createSubRoot<T>(fn: (dispose: VoidFunction) => T, ...owners: (typeof Owner)[]): T; | ||
| export declare function createSubRoot<T>(fn: (dispose: VoidFunction) => T, ...owners: (typeof Owner)[]): T; | ||
| /** @deprecated Renamed to `createSubRoot` */ | ||
| declare const createBranch: typeof createSubRoot; | ||
| export declare const createBranch: typeof createSubRoot; | ||
| /** | ||
@@ -36,3 +35,3 @@ * A wrapper for creating callbacks with `runWithOwner`. | ||
| */ | ||
| declare const createCallback: <T extends AnyFunction>(callback: T, owner?: Owner | null) => T; | ||
| export declare const createCallback: <T extends AnyFunction>(callback: T, owner?: Owner | null) => T; | ||
| /** | ||
@@ -53,3 +52,3 @@ * Executes {@link fn} in a {@link createSubRoot} *(auto-disposing root)*, and returns a dispose function, to dispose computations used inside before automatic cleanup. | ||
| */ | ||
| declare function createDisposable(fn: (dispose: VoidFunction) => void, ...owners: (Owner | null)[]): VoidFunction; | ||
| export declare function createDisposable(fn: (dispose: VoidFunction) => void, ...owners: (Owner | null)[]): VoidFunction; | ||
| /** | ||
@@ -74,5 +73,5 @@ * 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. | ||
| */ | ||
| declare function createSingletonRoot<T>(factory: (dispose: VoidFunction) => T, detachedOwner?: Owner | null): () => T; | ||
| export declare function createSingletonRoot<T>(factory: (dispose: VoidFunction) => T, detachedOwner?: Owner | null): () => T; | ||
| /** @deprecated Renamed to `createSingletonRoot` */ | ||
| declare const createSharedRoot: typeof createSingletonRoot; | ||
| export declare const createSharedRoot: typeof createSingletonRoot; | ||
| /** | ||
@@ -91,7 +90,7 @@ * @warning Experimental API - there might be a better way so solve singletons with SSR and hydration. | ||
| */ | ||
| declare function createHydratableSingletonRoot<T>(factory: (dispose: VoidFunction) => T): () => T; | ||
| export declare function createHydratableSingletonRoot<T>(factory: (dispose: VoidFunction) => T): () => T; | ||
| /** | ||
| * Options for {@link createRootPool}. | ||
| */ | ||
| type RootPoolOptions = { | ||
| export type RootPoolOptions = { | ||
| /** | ||
@@ -110,3 +109,3 @@ * Size of the root pool. Defaults to `100`. | ||
| */ | ||
| type RootPoolFactory<TArg, TResult> = (arg: Accessor<TArg>, active: Accessor<boolean>, dispose: VoidFunction) => TResult; | ||
| export type RootPoolFactory<TArg, TResult> = (arg: Accessor<TArg>, active: Accessor<boolean>, dispose: VoidFunction) => TResult; | ||
| /** | ||
@@ -116,3 +115,3 @@ * A function returned by {@link createRootPool}. | ||
| */ | ||
| type RootPoolFunction<TArg, TResult> = (..._: void extends TArg ? [arg?: TArg] : [arg: TArg]) => TResult; | ||
| export type RootPoolFunction<TArg, TResult> = (..._: void extends TArg ? [arg?: TArg] : [arg: TArg]) => TResult; | ||
| /** | ||
@@ -149,4 +148,2 @@ * Creates a pool of roots, that can be reused. Useful for creating components that are mounted and unmounted frequently. | ||
| */ | ||
| declare function createRootPool<TArg, TResult>(factory: RootPoolFactory<TArg, TResult>, options?: RootPoolOptions): RootPoolFunction<TArg, TResult>; | ||
| export { RootPoolFactory, RootPoolFunction, RootPoolOptions, createBranch, createCallback, createDisposable, createHydratableSingletonRoot, createRootPool, createSharedRoot, createSingletonRoot, createSubRoot }; | ||
| export declare function createRootPool<TArg, TResult>(factory: RootPoolFactory<TArg, TResult>, options?: RootPoolOptions): RootPoolFunction<TArg, TResult>; |
+184
-112
@@ -1,119 +0,191 @@ | ||
| import { getOwner, createRoot, runWithOwner, onCleanup, sharedConfig, createSignal, batch } from 'solid-js'; | ||
| import { isServer } from 'solid-js/web'; | ||
| import { asArray, access, trueFn, noop, createMicrotask } from '@solid-primitives/utils'; | ||
| // src/index.ts | ||
| function createSubRoot(fn, ...owners) { | ||
| if (owners.length === 0) | ||
| owners = [getOwner()]; | ||
| return createRoot((dispose) => { | ||
| asArray(access(owners)).forEach( | ||
| (owner) => owner && runWithOwner(owner, onCleanup.bind(void 0, dispose)) | ||
| ); | ||
| return fn(dispose); | ||
| }, owners[0]); | ||
| import { createRoot, getOwner, onCleanup, runWithOwner, sharedConfig, createSignal, batch, } from "solid-js"; | ||
| import { isServer } from "solid-js/web"; | ||
| import { asArray, access, noop, createMicrotask, trueFn, } from "@solid-primitives/utils"; | ||
| /** | ||
| * Creates a reactive **sub root**, that will be automatically disposed when it's owner does. | ||
| * | ||
| * @param fn a function in which the reactive state is scoped | ||
| * @param owners reactive root dependency list – cleanup of any of them will trigger sub-root disposal. (Defaults to `getOwner()`) | ||
| * @returns return values of {@link fn} | ||
| * | ||
| * @example | ||
| * const owner = getOwner() | ||
| * const [dispose, memo] = createSubRoot(dispose => { | ||
| * const memo = createMemo(() => {...}) | ||
| * onCleanup(() => {...}) // <- will cleanup when branch/owner disposes | ||
| * return [dispose, memo] | ||
| * }, owner, owner2); | ||
| */ | ||
| export function createSubRoot(fn, ...owners) { | ||
| if (owners.length === 0) | ||
| owners = [getOwner()]; | ||
| return createRoot(dispose => { | ||
| asArray(access(owners)).forEach(owner => owner && runWithOwner(owner, onCleanup.bind(void 0, dispose))); | ||
| return fn(dispose); | ||
| }, owners[0]); | ||
| } | ||
| var createBranch = createSubRoot; | ||
| var createCallback = (callback, owner = getOwner()) => owner ? (...args) => runWithOwner(owner, () => callback(...args)) : callback; | ||
| function createDisposable(fn, ...owners) { | ||
| return createSubRoot( | ||
| (dispose) => { | ||
| fn(dispose); | ||
| return dispose; | ||
| }, | ||
| ...owners | ||
| ); | ||
| /** @deprecated Renamed to `createSubRoot` */ | ||
| export const createBranch = createSubRoot; | ||
| /** | ||
| * A wrapper for creating callbacks with `runWithOwner`. | ||
| * It gives you the option to use reactive primitives after root setup and outside of effects. | ||
| * | ||
| * @param callback function that will be ran with owner once called | ||
| * @param owner a root that will trigger the cleanup (Defaults to `getOwner()`) | ||
| * @returns the {@link callback} function | ||
| * | ||
| * @example | ||
| * const handleClick = createCallback(() => { | ||
| * createEffect(() => {}) | ||
| * }) | ||
| */ | ||
| export const createCallback = (callback, owner = getOwner()) => (owner ? ((...args) => runWithOwner(owner, () => callback(...args))) : callback); | ||
| /** | ||
| * Executes {@link fn} in a {@link createSubRoot} *(auto-disposing root)*, and returns a dispose function, to dispose computations used inside before automatic cleanup. | ||
| * | ||
| * @param fn a function in which the reactive state is scoped | ||
| * @returns root dispose function | ||
| * | ||
| * @example | ||
| * ```ts | ||
| * const dispose = createDisposable(dispose => { | ||
| * createEffect(() => {...}) | ||
| * }); | ||
| * // dispose later (if not, will dispose automatically) | ||
| * dispose() | ||
| * ``` | ||
| */ | ||
| export function createDisposable(fn, ...owners) { | ||
| return createSubRoot(dispose => { | ||
| fn(dispose); | ||
| return dispose; | ||
| }, ...owners); | ||
| } | ||
| function createSingletonRoot(factory, detachedOwner = getOwner()) { | ||
| let listeners = 0, value, disposeRoot; | ||
| return () => { | ||
| listeners++; | ||
| onCleanup(() => { | ||
| listeners--; | ||
| queueMicrotask(() => { | ||
| if (!listeners && disposeRoot) { | ||
| disposeRoot(); | ||
| disposeRoot = value = void 0; | ||
| /** | ||
| * 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/solidjs-community/solid-primitives/tree/main/packages/rootless#createSingletonRoot | ||
| * @example | ||
| * const useState = createSingletonRoot(() => { | ||
| * return createMemo(() => {...}) | ||
| * }); | ||
| * | ||
| * // later in a component: | ||
| * const state = useState(); | ||
| * state() | ||
| * | ||
| * // in another component | ||
| * // previously created primitive would get reused | ||
| * const state = useState(); | ||
| * ... | ||
| */ | ||
| export function createSingletonRoot(factory, detachedOwner = getOwner()) { | ||
| let listeners = 0, value, disposeRoot; | ||
| return () => { | ||
| listeners++; | ||
| onCleanup(() => { | ||
| listeners--; | ||
| queueMicrotask(() => { | ||
| if (!listeners && disposeRoot) { | ||
| disposeRoot(); | ||
| disposeRoot = value = undefined; | ||
| } | ||
| }); | ||
| }); | ||
| if (!disposeRoot) { | ||
| createRoot(dispose => (value = factory((disposeRoot = dispose))), detachedOwner); | ||
| } | ||
| }); | ||
| }); | ||
| if (!disposeRoot) { | ||
| createRoot((dispose) => value = factory(disposeRoot = dispose), detachedOwner); | ||
| } | ||
| return value; | ||
| }; | ||
| return value; | ||
| }; | ||
| } | ||
| var createSharedRoot = createSingletonRoot; | ||
| function createHydratableSingletonRoot(factory) { | ||
| const owner = getOwner(); | ||
| const singleton = createSingletonRoot(factory, owner); | ||
| return () => isServer || sharedConfig.context ? createRoot(factory, owner) : singleton(); | ||
| /** @deprecated Renamed to `createSingletonRoot` */ | ||
| export const createSharedRoot = 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 | ||
| * ``` | ||
| */ | ||
| export function createHydratableSingletonRoot(factory) { | ||
| const owner = getOwner(); | ||
| const singleton = createSingletonRoot(factory, owner); | ||
| return () => (isServer || sharedConfig.context ? createRoot(factory, owner) : singleton()); | ||
| } | ||
| function createRootPool(factory, options = {}) { | ||
| if (isServer) { | ||
| const owner2 = getOwner(); | ||
| return (args) => createRoot((dispose) => factory(() => args, trueFn, dispose), owner2); | ||
| } | ||
| let length = 0; | ||
| const { limit = 100 } = options, pool = new Array(limit), owner = getOwner(), mapRoot = factory.length > 1 ? (dispose, [args, set]) => { | ||
| const [active, setA] = createSignal(true); | ||
| const root = { | ||
| dispose, | ||
| set, | ||
| setA, | ||
| active, | ||
| v: factory(args, active, () => disposeRoot(root)) | ||
| export function createRootPool(factory, options = {}) { | ||
| // don't cache roots on the server | ||
| if (isServer) { | ||
| const owner = getOwner(); | ||
| return args => createRoot(dispose => factory(() => args, trueFn, dispose), owner); | ||
| } | ||
| let length = 0; | ||
| const { limit = 100 } = options, pool = new Array(limit), owner = getOwner(), mapRoot = factory.length > 1 | ||
| ? (dispose, [args, set]) => { | ||
| const [active, setA] = createSignal(true); | ||
| const root = { | ||
| dispose, | ||
| set, | ||
| setA, | ||
| active, | ||
| v: factory(args, active, () => disposeRoot(root)), | ||
| }; | ||
| return root; | ||
| } | ||
| : (dispose, [args, set]) => ({ | ||
| dispose, | ||
| set, | ||
| setA: trueFn, | ||
| active: trueFn, | ||
| v: factory(args, trueFn, noop), | ||
| }), limitPool = createMicrotask(() => { | ||
| if (length > limit) { | ||
| for (let i = limit; i < length; i++) { | ||
| pool[i].dispose(); | ||
| pool[i] = undefined; | ||
| } | ||
| length = limit; | ||
| } | ||
| }), cleanupRoot = (root) => { | ||
| if (root.dispose !== noop) { | ||
| pool[length++] = root; | ||
| root.setA(false); | ||
| limitPool(); | ||
| } | ||
| }, disposeRoot = (root) => { | ||
| root.dispose(); | ||
| root.dispose = noop; | ||
| if (root.active()) | ||
| root.setA(false); | ||
| else { | ||
| pool[pool.indexOf(root)] = pool[--length]; | ||
| pool[length] = undefined; | ||
| } | ||
| }; | ||
| return root; | ||
| } : (dispose, [args, set]) => ({ | ||
| dispose, | ||
| set, | ||
| setA: trueFn, | ||
| active: trueFn, | ||
| v: factory(args, trueFn, noop) | ||
| }), limitPool = createMicrotask(() => { | ||
| if (length > limit) { | ||
| for (let i = limit; i < length; i++) { | ||
| pool[i].dispose(); | ||
| pool[i] = void 0; | ||
| } | ||
| length = limit; | ||
| } | ||
| }), cleanupRoot = (root) => { | ||
| if (root.dispose !== noop) { | ||
| pool[length++] = root; | ||
| root.setA(false); | ||
| limitPool(); | ||
| } | ||
| }, disposeRoot = (root) => { | ||
| root.dispose(); | ||
| root.dispose = noop; | ||
| if (root.active()) | ||
| root.setA(false); | ||
| else { | ||
| pool[pool.indexOf(root)] = pool[--length]; | ||
| pool[length] = void 0; | ||
| } | ||
| }; | ||
| onCleanup(() => { | ||
| for (let i = 0; i < length; i++) | ||
| pool[i].dispose(); | ||
| length = 0; | ||
| }); | ||
| return (arg) => { | ||
| let root; | ||
| if (length) { | ||
| root = pool[--length]; | ||
| pool[length] = void 0; | ||
| batch(() => { | ||
| root.set(() => arg); | ||
| root.setA(true); | ||
| }); | ||
| } else | ||
| root = createRoot((dispose) => mapRoot(dispose, createSignal(arg)), owner); | ||
| onCleanup(() => cleanupRoot(root)); | ||
| return root.v; | ||
| }; | ||
| onCleanup(() => { | ||
| for (let i = 0; i < length; i++) | ||
| pool[i].dispose(); | ||
| length = 0; | ||
| }); | ||
| return arg => { | ||
| let root; | ||
| if (length) { | ||
| root = pool[--length]; | ||
| pool[length] = undefined; | ||
| batch(() => { | ||
| root.set(() => arg); | ||
| root.setA(true); | ||
| }); | ||
| } | ||
| else | ||
| root = createRoot(dispose => mapRoot(dispose, createSignal(arg)), owner); | ||
| onCleanup(() => cleanupRoot(root)); | ||
| return root.v; | ||
| }; | ||
| } | ||
| export { createBranch, createCallback, createDisposable, createHydratableSingletonRoot, createRootPool, createSharedRoot, createSingletonRoot, createSubRoot }; |
+3
-7
| { | ||
| "name": "@solid-primitives/rootless", | ||
| "version": "1.4.5", | ||
| "version": "1.5.0", | ||
| "description": "A collection of helpers that aim to simplify using reactive primitives outside of reactive roots, and managing disposal of reactive roots.", | ||
@@ -30,3 +30,2 @@ "author": "Damian Tarnawski @thetarnav <gthetarnav@gmail.com>", | ||
| "type": "module", | ||
| "main": "./dist/index.cjs", | ||
| "module": "./dist/index.js", | ||
@@ -36,9 +35,6 @@ "types": "./dist/index.d.ts", | ||
| "exports": { | ||
| "@solid-primitives/source": "./src/index.ts", | ||
| "import": { | ||
| "types": "./dist/index.d.ts", | ||
| "default": "./dist/index.js" | ||
| }, | ||
| "require": { | ||
| "types": "./dist/index.d.cts", | ||
| "default": "./dist/index.cjs" | ||
| } | ||
@@ -55,3 +51,3 @@ }, | ||
| "dependencies": { | ||
| "@solid-primitives/utils": "^6.2.3" | ||
| "@solid-primitives/utils": "^6.3.0" | ||
| }, | ||
@@ -58,0 +54,0 @@ "peerDependencies": { |
+6
-7
@@ -7,3 +7,2 @@ <p> | ||
| [](https://turborepo.org/) | ||
| [](https://bundlephobia.com/package/@solid-primitives/rootless) | ||
@@ -15,7 +14,7 @@ [](https://www.npmjs.com/package/@solid-primitives/rootless) | ||
| - [`createSubRoot`](#createSubRoot) - Creates a reactive **sub root**, that will be automatically disposed when it's owner does. | ||
| - [`createCallback`](#createCallback) - A wrapper for creating callbacks with `runWithOwner`. | ||
| - [`createDisposable`](#createDisposable) - For disposing computations early – before the root cleanup. | ||
| - [`createSingletonRoot`](#createSingletonRoot) - Share "global primitives" across multiple reactive scopes. | ||
| - [`createRootPool`](#createRootPool) - Creates a pool of reactive roots, that can be reused. | ||
| - [`createSubRoot`](#createsubroot) - Creates a reactive **sub root**, that will be automatically disposed when it's owner does. | ||
| - [`createCallback`](#createcallback) - A wrapper for creating callbacks with `runWithOwner`. | ||
| - [`createDisposable`](#createdisposable) - For disposing computations early – before the root cleanup. | ||
| - [`createSingletonRoot`](#createsingletonroot) - Share "global primitives" across multiple reactive scopes. | ||
| - [`createRootPool`](#createrootpool) - Creates a pool of reactive roots, that can be reused. | ||
@@ -103,3 +102,3 @@ ## Installation | ||
| Executes provided function in a [`createSubRoot`](#createSubRoot) _(auto-disposing root)_, and returns a dispose function, to dispose computations used inside before automatic cleanup. | ||
| Executes provided function in a [`createSubRoot`](#createsubroot) _(auto-disposing root)_, and returns a dispose function, to dispose computations used inside before automatic cleanup. | ||
@@ -106,0 +105,0 @@ ```ts |
-125
| 'use strict'; | ||
| var solidJs = require('solid-js'); | ||
| var web = require('solid-js/web'); | ||
| var utils = require('@solid-primitives/utils'); | ||
| // src/index.ts | ||
| function createSubRoot(fn, ...owners) { | ||
| if (owners.length === 0) | ||
| owners = [solidJs.getOwner()]; | ||
| return solidJs.createRoot((dispose) => { | ||
| utils.asArray(utils.access(owners)).forEach( | ||
| (owner) => owner && solidJs.runWithOwner(owner, solidJs.onCleanup.bind(void 0, dispose)) | ||
| ); | ||
| return fn(dispose); | ||
| }, owners[0]); | ||
| } | ||
| exports.createBranch = createSubRoot; | ||
| exports.createCallback = (callback, owner = solidJs.getOwner()) => owner ? (...args) => solidJs.runWithOwner(owner, () => callback(...args)) : callback; | ||
| function createDisposable(fn, ...owners) { | ||
| return createSubRoot( | ||
| (dispose) => { | ||
| fn(dispose); | ||
| return dispose; | ||
| }, | ||
| ...owners | ||
| ); | ||
| } | ||
| function createSingletonRoot(factory, detachedOwner = solidJs.getOwner()) { | ||
| let listeners = 0, value, disposeRoot; | ||
| return () => { | ||
| listeners++; | ||
| solidJs.onCleanup(() => { | ||
| listeners--; | ||
| queueMicrotask(() => { | ||
| if (!listeners && disposeRoot) { | ||
| disposeRoot(); | ||
| disposeRoot = value = void 0; | ||
| } | ||
| }); | ||
| }); | ||
| if (!disposeRoot) { | ||
| solidJs.createRoot((dispose) => value = factory(disposeRoot = dispose), detachedOwner); | ||
| } | ||
| return value; | ||
| }; | ||
| } | ||
| exports.createSharedRoot = createSingletonRoot; | ||
| function createHydratableSingletonRoot(factory) { | ||
| const owner = solidJs.getOwner(); | ||
| const singleton = createSingletonRoot(factory, owner); | ||
| return () => web.isServer || solidJs.sharedConfig.context ? solidJs.createRoot(factory, owner) : singleton(); | ||
| } | ||
| function createRootPool(factory, options = {}) { | ||
| if (web.isServer) { | ||
| const owner2 = solidJs.getOwner(); | ||
| return (args) => solidJs.createRoot((dispose) => factory(() => args, utils.trueFn, dispose), owner2); | ||
| } | ||
| let length = 0; | ||
| const { limit = 100 } = options, pool = new Array(limit), owner = solidJs.getOwner(), mapRoot = factory.length > 1 ? (dispose, [args, set]) => { | ||
| const [active, setA] = solidJs.createSignal(true); | ||
| const root = { | ||
| dispose, | ||
| set, | ||
| setA, | ||
| active, | ||
| v: factory(args, active, () => disposeRoot(root)) | ||
| }; | ||
| return root; | ||
| } : (dispose, [args, set]) => ({ | ||
| dispose, | ||
| set, | ||
| setA: utils.trueFn, | ||
| active: utils.trueFn, | ||
| v: factory(args, utils.trueFn, utils.noop) | ||
| }), limitPool = utils.createMicrotask(() => { | ||
| if (length > limit) { | ||
| for (let i = limit; i < length; i++) { | ||
| pool[i].dispose(); | ||
| pool[i] = void 0; | ||
| } | ||
| length = limit; | ||
| } | ||
| }), cleanupRoot = (root) => { | ||
| if (root.dispose !== utils.noop) { | ||
| pool[length++] = root; | ||
| root.setA(false); | ||
| limitPool(); | ||
| } | ||
| }, disposeRoot = (root) => { | ||
| root.dispose(); | ||
| root.dispose = utils.noop; | ||
| if (root.active()) | ||
| root.setA(false); | ||
| else { | ||
| pool[pool.indexOf(root)] = pool[--length]; | ||
| pool[length] = void 0; | ||
| } | ||
| }; | ||
| solidJs.onCleanup(() => { | ||
| for (let i = 0; i < length; i++) | ||
| pool[i].dispose(); | ||
| length = 0; | ||
| }); | ||
| return (arg) => { | ||
| let root; | ||
| if (length) { | ||
| root = pool[--length]; | ||
| pool[length] = void 0; | ||
| solidJs.batch(() => { | ||
| root.set(() => arg); | ||
| root.setA(true); | ||
| }); | ||
| } else | ||
| root = solidJs.createRoot((dispose) => mapRoot(dispose, solidJs.createSignal(arg)), owner); | ||
| solidJs.onCleanup(() => cleanupRoot(root)); | ||
| return root.v; | ||
| }; | ||
| } | ||
| exports.createDisposable = createDisposable; | ||
| exports.createHydratableSingletonRoot = createHydratableSingletonRoot; | ||
| exports.createRootPool = createRootPool; | ||
| exports.createSingletonRoot = createSingletonRoot; | ||
| exports.createSubRoot = createSubRoot; |
-125
| 'use strict'; | ||
| var solidJs = require('solid-js'); | ||
| var web = require('solid-js/web'); | ||
| var utils = require('@solid-primitives/utils'); | ||
| // src/index.ts | ||
| function createSubRoot(fn, ...owners) { | ||
| if (owners.length === 0) | ||
| owners = [solidJs.getOwner()]; | ||
| return solidJs.createRoot((dispose) => { | ||
| utils.asArray(utils.access(owners)).forEach( | ||
| (owner) => owner && solidJs.runWithOwner(owner, solidJs.onCleanup.bind(void 0, dispose)) | ||
| ); | ||
| return fn(dispose); | ||
| }, owners[0]); | ||
| } | ||
| exports.createBranch = createSubRoot; | ||
| exports.createCallback = (callback, owner = solidJs.getOwner()) => owner ? (...args) => solidJs.runWithOwner(owner, () => callback(...args)) : callback; | ||
| function createDisposable(fn, ...owners) { | ||
| return createSubRoot( | ||
| (dispose) => { | ||
| fn(dispose); | ||
| return dispose; | ||
| }, | ||
| ...owners | ||
| ); | ||
| } | ||
| function createSingletonRoot(factory, detachedOwner = solidJs.getOwner()) { | ||
| let listeners = 0, value, disposeRoot; | ||
| return () => { | ||
| listeners++; | ||
| solidJs.onCleanup(() => { | ||
| listeners--; | ||
| queueMicrotask(() => { | ||
| if (!listeners && disposeRoot) { | ||
| disposeRoot(); | ||
| disposeRoot = value = void 0; | ||
| } | ||
| }); | ||
| }); | ||
| if (!disposeRoot) { | ||
| solidJs.createRoot((dispose) => value = factory(disposeRoot = dispose), detachedOwner); | ||
| } | ||
| return value; | ||
| }; | ||
| } | ||
| exports.createSharedRoot = createSingletonRoot; | ||
| function createHydratableSingletonRoot(factory) { | ||
| const owner = solidJs.getOwner(); | ||
| const singleton = createSingletonRoot(factory, owner); | ||
| return () => web.isServer || solidJs.sharedConfig.context ? solidJs.createRoot(factory, owner) : singleton(); | ||
| } | ||
| function createRootPool(factory, options = {}) { | ||
| if (web.isServer) { | ||
| const owner2 = solidJs.getOwner(); | ||
| return (args) => solidJs.createRoot((dispose) => factory(() => args, utils.trueFn, dispose), owner2); | ||
| } | ||
| let length = 0; | ||
| const { limit = 100 } = options, pool = new Array(limit), owner = solidJs.getOwner(), mapRoot = factory.length > 1 ? (dispose, [args, set]) => { | ||
| const [active, setA] = solidJs.createSignal(true); | ||
| const root = { | ||
| dispose, | ||
| set, | ||
| setA, | ||
| active, | ||
| v: factory(args, active, () => disposeRoot(root)) | ||
| }; | ||
| return root; | ||
| } : (dispose, [args, set]) => ({ | ||
| dispose, | ||
| set, | ||
| setA: utils.trueFn, | ||
| active: utils.trueFn, | ||
| v: factory(args, utils.trueFn, utils.noop) | ||
| }), limitPool = utils.createMicrotask(() => { | ||
| if (length > limit) { | ||
| for (let i = limit; i < length; i++) { | ||
| pool[i].dispose(); | ||
| pool[i] = void 0; | ||
| } | ||
| length = limit; | ||
| } | ||
| }), cleanupRoot = (root) => { | ||
| if (root.dispose !== utils.noop) { | ||
| pool[length++] = root; | ||
| root.setA(false); | ||
| limitPool(); | ||
| } | ||
| }, disposeRoot = (root) => { | ||
| root.dispose(); | ||
| root.dispose = utils.noop; | ||
| if (root.active()) | ||
| root.setA(false); | ||
| else { | ||
| pool[pool.indexOf(root)] = pool[--length]; | ||
| pool[length] = void 0; | ||
| } | ||
| }; | ||
| solidJs.onCleanup(() => { | ||
| for (let i = 0; i < length; i++) | ||
| pool[i].dispose(); | ||
| length = 0; | ||
| }); | ||
| return (arg) => { | ||
| let root; | ||
| if (length) { | ||
| root = pool[--length]; | ||
| pool[length] = void 0; | ||
| solidJs.batch(() => { | ||
| root.set(() => arg); | ||
| root.setA(true); | ||
| }); | ||
| } else | ||
| root = solidJs.createRoot((dispose) => mapRoot(dispose, solidJs.createSignal(arg)), owner); | ||
| solidJs.onCleanup(() => cleanupRoot(root)); | ||
| return root.v; | ||
| }; | ||
| } | ||
| exports.createDisposable = createDisposable; | ||
| exports.createHydratableSingletonRoot = createHydratableSingletonRoot; | ||
| exports.createRootPool = createRootPool; | ||
| exports.createSingletonRoot = createSingletonRoot; | ||
| exports.createSubRoot = createSubRoot; |
-144
| import { Owner, Accessor } from 'solid-js'; | ||
| import { AnyFunction } from '@solid-primitives/utils'; | ||
| /** | ||
| * Creates a reactive **sub root**, that will be automatically disposed when it's owner does. | ||
| * | ||
| * @param fn a function in which the reactive state is scoped | ||
| * @param owners reactive root dependency list – cleanup of any of them will trigger sub-root disposal. (Defaults to `getOwner()`) | ||
| * @returns return values of {@link fn} | ||
| * | ||
| * @example | ||
| * const owner = getOwner() | ||
| * const [dispose, memo] = createSubRoot(dispose => { | ||
| * const memo = createMemo(() => {...}) | ||
| * onCleanup(() => {...}) // <- will cleanup when branch/owner disposes | ||
| * return [dispose, memo] | ||
| * }, owner, owner2); | ||
| */ | ||
| declare function createSubRoot<T>(fn: (dispose: VoidFunction) => T, ...owners: (typeof Owner)[]): T; | ||
| /** @deprecated Renamed to `createSubRoot` */ | ||
| declare const createBranch: typeof createSubRoot; | ||
| /** | ||
| * A wrapper for creating callbacks with `runWithOwner`. | ||
| * It gives you the option to use reactive primitives after root setup and outside of effects. | ||
| * | ||
| * @param callback function that will be ran with owner once called | ||
| * @param owner a root that will trigger the cleanup (Defaults to `getOwner()`) | ||
| * @returns the {@link callback} function | ||
| * | ||
| * @example | ||
| * const handleClick = createCallback(() => { | ||
| * createEffect(() => {}) | ||
| * }) | ||
| */ | ||
| declare const createCallback: <T extends AnyFunction>(callback: T, owner?: Owner | null) => T; | ||
| /** | ||
| * Executes {@link fn} in a {@link createSubRoot} *(auto-disposing root)*, and returns a dispose function, to dispose computations used inside before automatic cleanup. | ||
| * | ||
| * @param fn a function in which the reactive state is scoped | ||
| * @returns root dispose function | ||
| * | ||
| * @example | ||
| * ```ts | ||
| * const dispose = createDisposable(dispose => { | ||
| * createEffect(() => {...}) | ||
| * }); | ||
| * // dispose later (if not, will dispose automatically) | ||
| * dispose() | ||
| * ``` | ||
| */ | ||
| declare function createDisposable(fn: (dispose: VoidFunction) => void, ...owners: (Owner | null)[]): VoidFunction; | ||
| /** | ||
| * 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/solidjs-community/solid-primitives/tree/main/packages/rootless#createSingletonRoot | ||
| * @example | ||
| * const useState = createSingletonRoot(() => { | ||
| * return createMemo(() => {...}) | ||
| * }); | ||
| * | ||
| * // later in a component: | ||
| * const state = useState(); | ||
| * state() | ||
| * | ||
| * // in another component | ||
| * // previously created primitive would get reused | ||
| * const state = useState(); | ||
| * ... | ||
| */ | ||
| 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; | ||
| /** | ||
| * Options for {@link createRootPool}. | ||
| */ | ||
| type RootPoolOptions = { | ||
| /** | ||
| * Size of the root pool. Defaults to `100`. | ||
| */ | ||
| limit?: number; | ||
| }; | ||
| /** | ||
| * Callback function for {@link createRootPool}. Called when a new root is created. | ||
| * @param arg An accessor that returns the argument passed to {@link RootPoolFunction}. | ||
| * @param active An accessor that returns the active state of the root. | ||
| * When `false`, root is not being used and is waiting in the pool to be reused. | ||
| * @param dispose A function that disposes the root and prevents it from being reused. | ||
| * @returns The result of {@link RootPoolFunction}. | ||
| */ | ||
| type RootPoolFactory<TArg, TResult> = (arg: Accessor<TArg>, active: Accessor<boolean>, dispose: VoidFunction) => TResult; | ||
| /** | ||
| * A function returned by {@link createRootPool}. | ||
| * @param arg The argument passed to {@link RootPoolFactory}. | ||
| */ | ||
| type RootPoolFunction<TArg, TResult> = (..._: void extends TArg ? [arg?: TArg] : [arg: TArg]) => TResult; | ||
| /** | ||
| * Creates a pool of roots, that can be reused. Useful for creating components that are mounted and unmounted frequently. | ||
| * When the root is created, it will call the {@link factory} function with a {@link RootPoolFactory} callback. | ||
| * Roots are created by calling the returned function, after cleanup they won't be disposed but instead put back into the pool to be reused. | ||
| * Next time the function is called, it will reuse the root from the pool and update it with the new {@link arg}. | ||
| * | ||
| * @param factory A function that will be called when a new root is created. See {@link RootPoolFactory}. | ||
| * @param options Options for the root pool. See {@link RootPoolOptions}. | ||
| * @returns A function that creates and reuses roots. See {@link RootPoolFunction}. | ||
| * | ||
| * @see https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createRootPool | ||
| * | ||
| * @example | ||
| * ```tsx | ||
| * const useCounter = createRootPool((arg, active, dispose) => { | ||
| * const [count, setCount] = createSignal(arg()) | ||
| * | ||
| * createEffect(() => { | ||
| * if (!active()) return | ||
| * // so some side effect | ||
| * console.log("count", count()) | ||
| * }) | ||
| * | ||
| * return <button onClick={() => setCount(count() + 1)}>Count: {count()}</button> | ||
| * }) | ||
| * | ||
| * return <Show when={frequentlyChangedCondidion()}> | ||
| * {useCounter(1)} | ||
| * </Show> | ||
| * ``` | ||
| */ | ||
| declare function createRootPool<TArg, TResult>(factory: RootPoolFactory<TArg, TResult>, options?: RootPoolOptions): RootPoolFunction<TArg, TResult>; | ||
| export { RootPoolFactory, RootPoolFunction, RootPoolOptions, createBranch, createCallback, createDisposable, createHydratableSingletonRoot, createRootPool, createSharedRoot, createSingletonRoot, createSubRoot }; |
Major refactor
Supply chain riskPackage has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
24057
-31.03%5
-37.5%332
-34%222
-0.45%1
Infinity%