Skip to content
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 9 additions & 3 deletions packages/destructure/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,13 @@ Primitive for destructuring reactive objects _– like props or stores –_ or s
```bash
npm install @solid-primitives/destructure
# or
pnpm add @solid-primitives/destructure
# or
yarn add @solid-primitives/destructure
```

> Requires **Solid 2.0** (`solid-js ^2.0.0-beta.10`). For Solid 1.x use v0.2.x.

## `destructure`

Spreads an reactive object _(store or props)_ or a reactive object signal into a tuple/map of signals for each object key.
Expand All @@ -30,11 +34,13 @@ import { destructure } from "@solid-primitives/destructure";

#### How to use it

`destructure` is an reactive primitive, hence needs to be used under an reactive root. Pass an reactive object or a signal as it's first argument, and configure it's behavior via options:
`destructure` is a reactive primitive, hence needs to be used under a reactive root. Pass a reactive object or a signal as its first argument, and configure its behavior via options:

- `memo` - wraps accessors in `createMemo`, making each property update independently. _(enabled by default for signal source)_
- `lazy` - property accessors are created on key read. enable if you want to only a subset of source properties, or use properties initially missing
- `deep` - destructure nested objects
- `lazy` - property accessors are created on key read. enable if you want only a subset of source properties, or to use properties initially missing
- `deep` - destructure nested objects recursively
- `name` - debug name passed to internal `createMemo` calls _(dev mode only)_
- `equals` - custom equality function passed to internal `createMemo` calls

```ts
// spread tuples
Expand Down
6 changes: 3 additions & 3 deletions packages/destructure/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@solid-primitives/destructure",
"version": "0.2.3",
"version": "0.3.0",
"description": "Primitives for destructuring reactive objects – like props or stores – or signals of them into a separate accessors updated individually.",
"author": "Damian Tarnawski @thetarnav <gthetarnav@gmail.com>",
"license": "MIT",
Expand Down Expand Up @@ -53,10 +53,10 @@
"@solid-primitives/utils": "workspace:^"
},
"peerDependencies": {
"solid-js": "^1.6.12"
"solid-js": "^2.0.0-beta.10"
},
"typesVersions": {},
"devDependencies": {
"solid-js": "^1.9.7"
"solid-js": "2.0.0-beta.10"
}
}
10 changes: 6 additions & 4 deletions packages/destructure/src/index.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { createMemo, type Accessor, runWithOwner, getOwner, type MemoOptions } from "solid-js";
import { createMemo, type Accessor, runWithOwner, getOwner } from "solid-js";
import {
access,
type MaybeAccessor,
Expand All @@ -9,7 +9,9 @@ import {

type ReactiveSource = [] | any[] | AnyObject;

export type DestructureOptions<T extends ReactiveSource> = MemoOptions<Values<T>> & {
export type DestructureOptions<T extends ReactiveSource> = {
name?: string;
equals?: false | ((prev: Values<T>, next: Values<T>) => boolean);
memo?: boolean;
lazy?: boolean;
deep?: boolean;
Expand Down Expand Up @@ -102,7 +104,7 @@ export function destructure<T extends ReactiveSource, O extends DestructureOptio
const calc = getter(key);
if (config.deep && isReactiveObject(obj[key]))
return runWithOwner(owner, () => destructure(calc, { ...config, memo }));
return memo ? runWithOwner(owner, () => createMemo(calc, undefined, options)) : calc;
return memo ? runWithOwner(owner, () => createMemo(calc, options as any)) : calc;
});
}

Expand All @@ -112,7 +114,7 @@ export function destructure<T extends ReactiveSource, O extends DestructureOptio
const calc = getter(key);
if (config.deep && isReactiveObject(value))
result[key] = destructure(calc, { ...config, memo });
else result[key] = memo ? createMemo(calc, undefined, options) : calc;
else result[key] = memo ? createMemo(calc, options as any) : calc;
}
return result;
}
Loading