detto

[![npm version](https://badge.fury.io/js/detto.svg)](https://badge.fury.io/js/detto) [![CI](https://github.com/iendeavor/detto/workflows/CI/badge.svg)](https://github.com/iendeavor/detto/actions) [![Coverage Status](https://coveralls.io/repos/github/iende

Usage no npm install needed!

<script type="module">
  import detto from 'https://cdn.skypack.dev/detto';
</script>

README

detto

npm version CI Coverage Status gzip visitors

Demo

Track old values for object

Track old values for array

Feature

You can save anything in detto object even the values is changed or moved (by array manipulation functions).

Array Manipulations (push, pop, shift, unshift, splice, reverse) is Fully Supported.

Zero Dependencies, Native Javascript only.

Installation

$ yarn add detto
<script src="https://unpkg.com/detto"></script>

Usage

import { proxy } from 'Detto'

const object = {
  deep: {
    nested: 123,
  },
}

const detto = {}

// watch data changing
const callback = (changedDetto, path) => console.log(path)

const proxiedObject = proxy({ object, detto, callback })
// > []
// > ['deep']
// > ['deep', 'nested']
console.log(JSON.stringify(detto))
// > {"deep":{"nested":{}}}

proxiedObject.deep.nested = { key: 123 }
// > ['deep', 'nested']
// > ['deep', 'nested', 'key']
console.log(JSON.stringify(detto))
// > {"deep":{"nested":{"key":{}}}}

proxiedObject.deep.nested = {}
// > ['deep', 'nested']
console.log(JSON.stringify(detto))
// > {"deep":{"nested":{}}}

delete proxiedObject.deep
// > []
console.log(JSON.stringify(detto))
// > {}

Contributing

Please read CONTRIBUTING.md for details on our code of conduct, and the process for submitting pull requests to us.

Versioning

We use SemVer for versioning. For the versions available, see the tags on this repository.

License

This project is licensed under the MIT License - see the LICENSE file for details