This project is part of the @thi.ng/umbrella monorepo.
Reducers for patch-based, immutable-by-default array & object editing. This is a support package for @thi.ng/transducers.
The patchArray
and patchObj
reducers can be used in any
reducer/transducer scenario and are useful for any form of declarative
state update. By default all edits are performed non-destructively, but
pushArray
also supports in place editing (mutation).
ALPHA - bleeding edge / work-in-progress
yarn add @thi.ng/transducers-patch
// ES module
<script type="module" src="https://unpkg.com/@thi.ng/transducers-patch?module" crossorigin></script>
// UMD
<script src="https://unpkg.com/@thi.ng/transducers-patch/lib/index.umd.js" crossorigin></script>
Package sizes (gzipped, pre-treeshake): ESM: 561 bytes / CJS: 607 bytes / UMD: 715 bytes
TODO
import { Patch, patchArray, patchObj } from "@thi.ng/transducers-patch";
import { reduce, reductions } from "@thi.ng/transducers";
// flat array editing
patchArray(
// pass false to perform in-place edits (else immutable updates)
false,
// orig array to edit
[1, 2, 3],
// edits
[
// set idx #0 to 42
[Patch.SET, 0, 42],
// update idx #1 (here: times 10)
[Patch.UPDATE, 1, (x, n) => x * n, 10],
// insert values @ idx #2
[Patch.INSERT, 2, [10, 11]],
// delete (remove) idx #3
[Patch.DELETE, 3]
]
);
// [ 42, 20, 10, 3 ]
// flat (immutable by default) array editing
reduce(
// reductions() used here to obtain step-wise edit results
reductions(patchArray<number>()),
// original array (wrapped here only for `reductions`)
[[1, 2, 3]],
[
[Patch.INSERT, 0, [10, 11]],
[Patch.UPDATE, 1, (x, n) => x * n, 10],
[Patch.DELETE, 3],
[Patch.SET, 2, 200]
]
);
// [
// [1, 2, 3],
// [10, 11, 1, 2, 3],
// [10, 110, 1, 2, 3],
// [10, 110, 1, 3],
// [10, 110, 200, 3]
// ]
// nested (always immutable) object editing
// (uses @thi.ng/paths for edits)
reduce(
reductions(patchObj()),
[{ x: 23 }],
[
[Patch.SET, ["a", "b"], 1],
[Patch.UPDATE, ["a", "b"], (x, n) => x + n, 10],
[Patch.DELETE, ["x"]]
]
),
// [
// { x: 23 },
// { x: 23, a: { b: 1 } },
// { x: 23, a: { b: 11 } },
// { a: { b: 11 } }
// ]
.This example uses constructs from the @thi.ng/rstream package.
import { stream, trace } from "@thi.ng/rstream";
const initialState: any = { x: 23 };
// create transformed stream mapping patch commands to states
// since `patchArray` is only a reducer, we need to wrap it w/ the `scan` transducer
// see: https://github.com/thi-ng/umbrella/blob/develop/packages/transducers/src/xform/scan.ts
export const state = stream<PatchObjOp>().transform(
scan(patchObj(), initialState)
);
// add debug subscription
state.subscribe(trace("state: "));
state.next([Patch.SET, "a.b", 1]);
// state: { x: 23, a: { b: 1 } }
state.next([Patch.UPDATE, ["a", "b"], (x, n)=> x + n, 10]);
// state: { x: 23, a: { b: 11 } }
state.next([Patch.DELETE, "x"]);
// state: { a: { b: 11 } }
Karsten Schmidt
© 2020 Karsten Schmidt // Apache Software License 2.0