[
  {
    "path": ".babelrc",
    "content": "{\n  \"presets\": [\n    [\"env\", { \"modules\": false }]\n  ],\n  \"env\": {\n    \"test\": {\n      \"presets\": [\n        [\"env\", { \"targets\": { \"node\": \"current\" }}]\n      ]\n    }\n  }\n}\n"
  },
  {
    "path": ".gitignore",
    "content": "node_modules\n.idea\n"
  },
  {
    "path": "LICENSE",
    "content": "MIT License\n\nCopyright (c) 2019 Anthony Gore\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n"
  },
  {
    "path": "README.md",
    "content": "# vuex-undo-redo\n\nA Vue.js plugin that allows you to undo or redo a mutation.\n\n> The building of this plugin is documented in the article *[Create A Vuex Undo/Redo For VueJS](https://vuejsdevelopers.com/2017/11/13/vue-js-vuex-undo-redo/)*\n\n## Live demos\n\n[![Edit Vuex Undo/Redo](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/vjo3xlpyny)\n\nThere's also a demo in [this Codepen](https://codepen.io/anthonygore/pen/NwGmqJ). The source code for the demo is [here](https://github.com/anthonygore/vuex-undo-redo-example).\n\n## Installation\n\n```js\nnpm i --save-dev vuex-undo-redo\n```\n\n### Browser\n\n```html\n<script type=\"text/javascript\" src=\"node_modules/vuex-undo-redo/dist/vuex-undo-redo.min.js\"></script>\n```\n\n### Module\n\n```js\nimport VuexUndoRedo from 'vuex-undo-redo';\n```\n\n## Usage\n\nSince it's a plugin, use it like:\n\n```js\nVue.use(VuexUndoRedo);\n```\n\nYou must, of course, have the Vuex plugin installed as well, and it must be installed before this plugin. You must also create a Vuex store which must implement a mutation `emptyState` which should revert the store back to the initial state e.g.:\n\n```js\nnew Vuex.Store({\n  state: {\n    myVal: null\n  },\n  mutations: {\n    emptyState() {\n      this.replaceState({ myval: null });       \n    }\n  }\n});\n```\n\n### Ignoring mutations\n\nOccasionally, you may want to perform mutations without including them in the undo history (say you are working on an image editor and the user toggles grid visibility - you probably do not want this in undo history). The plugin has an `ignoredMutations` setting to leave these mutations out of the history:\n\n```js\nVue.use(VuexUndoRedo, { ignoreMutations: [ 'toggleGrid' ]});\n```\n\nIt's worth noting that this only means the mutations will not be recorded in the undo history. You must still manually manage your state object in the `emptyState` mutation:\n\n```js\nemptyState(state) {\n  this.replaceState({ myval: null, showGrid: state.showGrid });       \n}\n```\n\n## API\n\n### Options\n\n`ignoredMutations` an array of mutations that the plugin will ignore\n\n### Computed properties\n\n`canUndo` a boolean which tells you if the state is undo-able\n\n`canRedo` a boolean which tells you if the state is redo-able\n\n### Methods\n\n`undo` undoes the last mutation\n\n`redo` redoes the last mutation\n"
  },
  {
    "path": "package.json",
    "content": "{\n  \"name\": \"vuex-undo-redo\",\n  \"version\": \"1.1.4\",\n  \"description\": \"A Vue.js plugin to undo/redo mutations\",\n  \"main\": \"src/plugin.js\",\n  \"scripts\": {\n    \"build\": \"rimraf ./dist && webpack --config ./webpack.config.js\",\n    \"test\": \"jest\"\n  },\n  \"author\": \"Anthony Gore\",\n  \"license\": \"MIT\",\n  \"repository\": {\n    \"type\": \"git\",\n    \"url\": \"git+https://github.com/anthonygore/vuex-undo-redo\"\n  },\n  \"devDependencies\": {\n    \"@vue/test-utils\": \"^1.0.0-beta.25\",\n    \"babel-core\": \"^6.10.4\",\n    \"babel-jest\": \"^23.6.0\",\n    \"babel-loader\": \"^7.1.2\",\n    \"babel-plugin-transform-runtime\": \"^6.9.0\",\n    \"babel-preset-env\": \"^1.6.1\",\n    \"babel-runtime\": \"^6.9.2\",\n    \"jest\": \"^23.6.0\",\n    \"rimraf\": \"^2.6.1\",\n    \"vue\": \"^2.5.17\",\n    \"vue-jest\": \"^3.0.0\",\n    \"vue-template-compiler\": \"^2.5.17\",\n    \"vuex\": \"^3.0.1\",\n    \"webpack\": \"^3.8.1\",\n    \"webpack-merge\": \"^4.1.0\"\n  },\n  \"jest\": {\n    \"moduleFileExtensions\": [\n      \"js\",\n      \"json\",\n      \"vue\"\n    ],\n    \"transform\": {\n      \".*\\\\.(vue)$\": \"vue-jest\",\n      \"^.+\\\\.js$\": \"<rootDir>/node_modules/babel-jest\"\n    }\n  },\n  \"dependencies\": {}\n}\n"
  },
  {
    "path": "src/__tests__/plugin.spec.js",
    "content": "import { createLocalVue, shallowMount } from '@vue/test-utils';\nimport Vuex from \"vuex\";\nimport plugin from '../plugin';\n\ndescribe('plugin', () => {\n  it('should throw error if installed before new Vuex.Store is called', () => {\n    const localVue = createLocalVue();\n    expect(() => {\n      localVue.use(plugin);\n    }).toThrow();\n  });\n  it('should not throw error if installed after new Vuex.Store is called', () => {\n    const localVue = createLocalVue();\n    expect(() => {\n      localVue.use(Vuex);\n      new Vuex.Store({});\n      localVue.use(plugin);\n    }).not.toThrow();\n  });\n  it('should undo/redo data property', done => {\n    const localVue = createLocalVue();\n    localVue.use(Vuex);\n    const storeConfig = {\n      state: {\n        myVal: 0\n      },\n      mutations: {\n        inc(state) {\n          state.myVal++;\n        },\n        emptyState() {\n          this.replaceState({ myVal: 0 });\n        }\n      }\n    };\n    let store = new Vuex.Store(storeConfig);\n    localVue.use(plugin);\n    let component = {\n      template: \"<div></div>\",\n      methods: {\n        inc() {\n          this.$store.commit(\"inc\");\n        }\n      },\n      created() {\n        expect(this.$store.state.myVal).toBe(0);\n        this.inc();\n        expect(this.$store.state.myVal).toBe(1);\n        this.undo();\n        expect(this.$store.state.myVal).toBe(0);\n        this.redo();\n        expect(this.$store.state.myVal).toBe(1);\n        done();\n      }\n    };\n    shallowMount(component, {\n      localVue,\n      store\n    });\n  });\n});\n"
  },
  {
    "path": "src/plugin.js",
    "content": "const EMPTY_STATE = 'emptyState';\n\nmodule.exports = {\n  install(Vue, options = {}) {\n    if (!Vue._installedPlugins.find(plugin => plugin.Store)) {\n      throw new Error(\"VuexUndoRedo plugin must be installed after the Vuex plugin.\")\n    }\n    Vue.mixin({\n      data() {\n        return {\n          done: [],\n          undone: [],\n          newMutation: true,\n          ignoreMutations: options.ignoreMutations|| []\n        };\n      },\n      created() {\n        if (this.$store) {\n          this.$store.subscribe(mutation => {\n            if (mutation.type !== EMPTY_STATE && this.ignoreMutations.indexOf(mutation.type) === -1) {\n              this.done.push(mutation);\n            }\n            if (this.newMutation) {\n              this.undone = [];\n            }\n          });\n        }\n      },\n      computed: {\n        canRedo() {\n          return this.undone.length;\n        },\n        canUndo() {\n          return this.done.length;\n        }\n      },\n      methods: {\n        redo() {\n          let commit = this.undone.pop();\n          this.newMutation = false;\n          switch (typeof commit.payload) {\n            case 'object':\n              this.$store.commit(`${commit.type}`, Object.assign({}, commit.payload));\n              break;\n            default:\n              this.$store.commit(`${commit.type}`, commit.payload);\n          }\n          this.newMutation = true;\n        },\n        undo() {\n          this.undone.push(this.done.pop());\n          this.newMutation = false;\n          this.$store.commit(EMPTY_STATE);\n          this.done.forEach(mutation => {\n            switch (typeof mutation.payload) {\n              case 'object':\n                this.$store.commit(`${mutation.type}`, Object.assign({}, mutation.payload));\n                break;\n              default:\n                this.$store.commit(`${mutation.type}`, mutation.payload);\n            }\n            this.done.pop();\n          });\n          this.newMutation = true;\n        }\n      }\n    });\n  },\n}\n"
  },
  {
    "path": "webpack.config.js",
    "content": "const webpack = require('webpack');\nconst merge = require('webpack-merge');\nconst path = require('path');\n\nmodule.exports =  {\n  entry: path.resolve(__dirname + '/src/plugin.js'),\n  output: {\n    path: path.resolve(__dirname + '/dist/'),\n    filename: 'vuex-undo-redo.min.js',\n    libraryTarget: 'window',\n    library: 'VuexUndoRedo',\n  },\n  module: {\n    loaders: [\n      {\n        test: /\\.js$/,\n        loader: 'babel-loader',\n        include: __dirname,\n        exclude: /node_modules/,\n        options: {\n          presets: [\"babel-preset-env\"],\n          plugins: [\"transform-runtime\"],\n        }\n      }\n    ]\n  },\n  plugins: [\n    new webpack.optimize.UglifyJsPlugin( {\n      minimize : true,\n      sourceMap : false,\n      mangle: true,\n      compress: {\n        warnings: false\n      }\n    } )\n  ]\n};\n"
  }
]