Skip to content

Latest commit

 

History

History

transducers-patch

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

transducers-patch

npm version npm downloads Twitter Follow

This project is part of the @thi.ng/umbrella monorepo.

About

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).

Status

ALPHA - bleeding edge / work-in-progress

Installation

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

Dependencies

API

Generated API docs

TODO

Basic usage

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 } }
// ]

Stream-based processing

.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 } }

Authors

Karsten Schmidt

License

© 2020 Karsten Schmidt // Apache Software License 2.0