https://github.com/jameslmilner/tracked-json
JavaScript library for frictionless undo/redo for JSON objects
https://github.com/jameslmilner/tracked-json
history json redo undo versions
Last synced: 2 months ago
JSON representation
JavaScript library for frictionless undo/redo for JSON objects
- Host: GitHub
- URL: https://github.com/jameslmilner/tracked-json
- Owner: JamesLMilner
- License: mit
- Created: 2022-07-01T16:50:15.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-07-08T13:43:20.000Z (over 3 years ago)
- Last Synced: 2025-04-03T03:39:04.205Z (6 months ago)
- Topics: history, json, redo, undo, versions
- Language: TypeScript
- Homepage: https://JamesLMilner.github.io/tracked-json
- Size: 1.01 MB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.txt
Awesome Lists containing this project
README
# TrackedJSON
TrackedJSON is a JavaScript library which provides frictionless undo/redo for JSON objects.
TrackedJSON tries to maintain a relatively minimal API - the core of the library is the `.data` property which represents the JSON object you want to keep track of. You can update it just like a regular JavaScript object, with the only requirement being that properties have to be valid JSON types.
## Install
```shell
npm install tracked-json
```
## Basic Usage
You can use it like so:
```javascript
const tracked = new TrackedJSON();
// tracked.data is an empty object at this point
tracked.data.value = 1;
tracked.data.value = 2;
tracked.data.value = 3;
tracked.undo();
tracked.undo();
// tracked.data.value === 1
tracked.redo();
tracked.redo();
// tracked.data.value === 3
```
## Docs
[See the docs here](https://jameslmilner.github.io/tracked-json/)
Common questions answered on usage:
### How many undo/redo operations are there for my data object?
You can get the size of the undo stack using `undoSize` like so:
```javascript
const tracked = new TrackedJSON({ initialState: { value: 0 } });
tracked.data.value = 1;
tracked.data.value = 2;
console.log(tracked.undoSize); // 2
tracked.undo();
tracked.undo();
console.log(tracked.redoSize); // 2
```
### How do I instantiate with a given state?
You can instantiate an object with a starting state like so:
```javascript
const tracked = new TrackedJSON({ initialState: { value: 0 } });
console.log(tracked.data.value); // 0
```
### Can I replace the whole data object with a new one?
If you want to replace the whole data object, this is possible and will be tracked as normal, like so:
```javascript
const tracked = new TrackedJSON();
tracked.data.value = 0;
tracked.data = { value: 1 };
tracked.undo();
console.log(tracked.data.value); // 0
```
### Do I need to guard against non JSON?
Properties and nested properties of the data object must be valid JSON. Attempting to set non valid JSON properties and will throw an error like so:
```javascript
const tracked = new TrackedJSON();
tracked.data.value = {}; // does not throw error
tracked.data.value = 1; // does not throw error
tracked.data.value = []; // does not throw error
tracked.data.value = "string"; // does not throw error
tracked.data.value = true; // does not throw error
tracked.data.value = new Map(); // throws error
```
# License
MIT