├── docs ├── favicon.ico ├── push-manifest.json ├── assets │ ├── favicon.ico │ ├── shoppinglist48.png │ ├── shoppinglist96.png │ └── shoppinglist_splash.png ├── style.ce993.css ├── manifest.json ├── style.ce993.css.map ├── index.html ├── sw.js ├── polyfills.dfb61.js └── polyfills.dfb61.js.map ├── src ├── assets │ ├── favicon.ico │ ├── shoppinglist48.png │ ├── shoppinglist96.png │ └── shoppinglist_splash.png ├── App.css ├── manifest.json ├── index.js ├── components │ ├── ShoppingList.js │ └── ShoppingLists.js └── App.js ├── doc └── source │ └── images │ ├── create_db.png │ ├── architecture.png │ └── enable_cors.png ├── test └── test.js ├── .travis.yml ├── repository.yaml ├── preact.config.js ├── manifest.yml ├── .eslintrc.json ├── karma.conf.js ├── .gitignore ├── .cfignore ├── package.json ├── CONTRIBUTING.md ├── index.html ├── MAINTAINERS.md ├── LICENSE └── README.md /docs/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ibm-watson-data-lab/shopping-list-preact-pouchdb/HEAD/docs/favicon.ico -------------------------------------------------------------------------------- /docs/push-manifest.json: -------------------------------------------------------------------------------- 1 | {"/":{"style.ce993.css":{"type":"style","weight":1},"bundle.0f2cc.js":{"type":"script","weight":1}}} -------------------------------------------------------------------------------- /src/assets/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ibm-watson-data-lab/shopping-list-preact-pouchdb/HEAD/src/assets/favicon.ico -------------------------------------------------------------------------------- /docs/assets/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ibm-watson-data-lab/shopping-list-preact-pouchdb/HEAD/docs/assets/favicon.ico -------------------------------------------------------------------------------- /src/assets/shoppinglist48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ibm-watson-data-lab/shopping-list-preact-pouchdb/HEAD/src/assets/shoppinglist48.png -------------------------------------------------------------------------------- /src/assets/shoppinglist96.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ibm-watson-data-lab/shopping-list-preact-pouchdb/HEAD/src/assets/shoppinglist96.png -------------------------------------------------------------------------------- /doc/source/images/create_db.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ibm-watson-data-lab/shopping-list-preact-pouchdb/HEAD/doc/source/images/create_db.png -------------------------------------------------------------------------------- /docs/assets/shoppinglist48.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ibm-watson-data-lab/shopping-list-preact-pouchdb/HEAD/docs/assets/shoppinglist48.png -------------------------------------------------------------------------------- /docs/assets/shoppinglist96.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ibm-watson-data-lab/shopping-list-preact-pouchdb/HEAD/docs/assets/shoppinglist96.png -------------------------------------------------------------------------------- /doc/source/images/architecture.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ibm-watson-data-lab/shopping-list-preact-pouchdb/HEAD/doc/source/images/architecture.png -------------------------------------------------------------------------------- /doc/source/images/enable_cors.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ibm-watson-data-lab/shopping-list-preact-pouchdb/HEAD/doc/source/images/enable_cors.png -------------------------------------------------------------------------------- /src/assets/shoppinglist_splash.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ibm-watson-data-lab/shopping-list-preact-pouchdb/HEAD/src/assets/shoppinglist_splash.png -------------------------------------------------------------------------------- /docs/assets/shoppinglist_splash.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/ibm-watson-data-lab/shopping-list-preact-pouchdb/HEAD/docs/assets/shoppinglist_splash.png -------------------------------------------------------------------------------- /test/test.js: -------------------------------------------------------------------------------- 1 | /* global describe, it, assert */ 2 | 3 | // TODO: add real tests 4 | describe('test', function () { 5 | it('should return 1', function () { 6 | assert.equal(1, 1) 7 | }) 8 | }) -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: 3 | - '8' 4 | - '7' 5 | - '6' 6 | dist: trusty 7 | sudo: required 8 | addons: 9 | chrome: stable 10 | cache: 11 | directories: 12 | - node_modules 13 | script: npm test 14 | -------------------------------------------------------------------------------- /repository.yaml: -------------------------------------------------------------------------------- 1 | id: https://github.com/ibm-watson-data-lab/shopping-list-preact-pouchdb 2 | runtimes: 3 | - Cloud Foundry 4 | services: 5 | - Cloudant NoSQL DB 6 | event_id: web 7 | event_organizer: dev-journeys 8 | language: nodejs 9 | -------------------------------------------------------------------------------- /preact.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | 3 | export default config => { 4 | config.resolve.mainFields = ["browser", "module", "main"]; 5 | config.node.process = 'mock'; 6 | config.target = 'web'; 7 | config.output.publicPath = './'; 8 | }; 9 | -------------------------------------------------------------------------------- /manifest.yml: -------------------------------------------------------------------------------- 1 | declared-services: 2 | slpp-cloudantNoSQLDB: 3 | label: cloudantNoSQLDB 4 | plan: Lite 5 | applications: 6 | - name: shopping-list-preact-pouchdb 7 | buildpack: sdk-for-nodejs 8 | memory: 2048M 9 | instances: 1 10 | disk_quota: 1024M 11 | services: 12 | - slpp-cloudantNoSQLDB 13 | env: 14 | OPTIMIZE_MEMORY: true 15 | -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "browser": true, 4 | "node": true 5 | }, 6 | "parser": "babel-eslint", 7 | "rules": { 8 | "indent": ["error", 2], 9 | "quotes": [2, "single"], 10 | "strict": [2, "never"], 11 | "react/jsx-uses-react": 2, 12 | "react/jsx-uses-vars": 2 13 | }, 14 | "plugins": [ 15 | "react" 16 | ] 17 | } -------------------------------------------------------------------------------- /docs/style.ce993.css: -------------------------------------------------------------------------------- 1 | .nav-wrapper{background-color:#52647a}input[type=checkbox]:checked+label:before{border-right-color:#c83873;border-bottom-color:#c83873}.checkeditem{text-decoration:line-through;color:#9e9e9e}.shoppinglist,.shoppinglistitem{background-color:#fff}.itemactionbutton{color:#273a4e;padding:0 .75rem!important}.btn-large:hover,.itemactionbutton:hover{background-color:#ff9fd2} 2 | /*# sourceMappingURL=style.ce993.css.map*/ -------------------------------------------------------------------------------- /karma.conf.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Configuration for the Karma Test Runner 3 | * 4 | * @param {Object} config 5 | */ 6 | module.exports = function (config) { 7 | config.set({ 8 | frameworks: ['mocha', 'chai'], 9 | files: ['test/**/*.js'], 10 | reporters: ['progress'], 11 | port: 9876, // karma web server port 12 | colors: true, 13 | logLevel: config.LOG_INFO, 14 | browsers: ['ChromeHeadless'], 15 | autoWatch: false, 16 | // singleRun: false, // Karma captures browsers, runs the tests and exits 17 | concurrency: Infinity 18 | }) 19 | } 20 | -------------------------------------------------------------------------------- /src/App.css: -------------------------------------------------------------------------------- 1 | .nav-wrapper { 2 | background-color: #52647a; 3 | } 4 | /* .btn-floating, input[type="checkbox"] { 5 | background-color: #ff6ca1; 6 | } */ 7 | input[type="checkbox"]:checked+label:before { 8 | border-right-color: #c83873; 9 | border-bottom-color: #c83873; 10 | } 11 | .checkeditem { 12 | text-decoration: line-through; 13 | color: #9e9e9e; 14 | } 15 | .shoppinglist, .shoppinglistitem {background-color: white;} 16 | .itemactionbutton { 17 | color: #273a4e; 18 | padding: 0 0.75rem !important; 19 | } 20 | .btn-large:hover, .itemactionbutton:hover { 21 | background-color: #ff9fd2; 22 | } -------------------------------------------------------------------------------- /docs/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "IBMPreactShop", 3 | "name": "IBM Preact Shopping List PWA", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "192x192", 8 | "type": "image/png" 9 | }, 10 | { 11 | "src": "shoppinglist96.png", 12 | "sizes": "96x96", 13 | "type": "image/png" 14 | }, 15 | { 16 | "src": "shoppinglist48.png", 17 | "sizes": "48x48", 18 | "type": "image/png" 19 | }, 20 | { 21 | "src": "shoppinglist_splash.png", 22 | "sizes": "512x512", 23 | "type": "image/png" 24 | } 25 | ], 26 | "start_url": "./index.html", 27 | "display": "standalone", 28 | "theme_color": "#283b4f", 29 | "background_color": "#ffffff" 30 | } -------------------------------------------------------------------------------- /src/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "IBMPreactShop", 3 | "name": "IBM Preact Shopping List PWA", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "192x192", 8 | "type": "image/png" 9 | }, 10 | { 11 | "src": "shoppinglist96.png", 12 | "sizes": "96x96", 13 | "type": "image/png" 14 | }, 15 | { 16 | "src": "shoppinglist48.png", 17 | "sizes": "48x48", 18 | "type": "image/png" 19 | }, 20 | { 21 | "src": "shoppinglist_splash.png", 22 | "sizes": "512x512", 23 | "type": "image/png" 24 | } 25 | ], 26 | "start_url": "./index.html", 27 | "display": "standalone", 28 | "theme_color": "#283b4f", 29 | "background_color": "#ffffff" 30 | } -------------------------------------------------------------------------------- /docs/style.ce993.css.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["webpack:///webpack:///App.css"],"names":[],"mappings":"AAAA,aACI,wBAA0B,CAK9B,0CACI,2BACA,2BAA6B,CAEjC,aACI,6BACA,aAAe,CAEnB,gCAAkC,qBAAwB,CAC1D,kBACI,cACA,0BAA8B,CAElC,yCACI,wBAA0B","file":"style.ce993.css","sourcesContent":[".nav-wrapper {\n background-color: #52647a;\n}\n/* .btn-floating, input[type=\"checkbox\"] {\n background-color: #ff6ca1;\n} */\ninput[type=\"checkbox\"]:checked+label:before {\n border-right-color: #c83873;\n border-bottom-color: #c83873;\n}\n.checkeditem {\n text-decoration: line-through;\n color: #9e9e9e;\n}\n.shoppinglist, .shoppinglistitem {background-color: white;}\n.itemactionbutton {\n color: #273a4e;\n padding: 0 0.75rem !important;\n}\n.btn-large:hover, .itemactionbutton:hover {\n background-color: #ff9fd2;\n}\n\n\n// WEBPACK FOOTER //\n// webpack:///App.css"],"sourceRoot":""} -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | build 2 | .vscode 3 | 4 | # Logs 5 | logs 6 | *.log 7 | npm-debug.log* 8 | yarn-debug.log* 9 | yarn-error.log* 10 | 11 | # Runtime data 12 | pids 13 | *.pid 14 | *.seed 15 | *.pid.lock 16 | 17 | # Directory for instrumented libs generated by jscoverage/JSCover 18 | lib-cov 19 | 20 | # Coverage directory used by tools like istanbul 21 | coverage 22 | 23 | # nyc test coverage 24 | .nyc_output 25 | 26 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 27 | .grunt 28 | 29 | # Bower dependency directory (https://bower.io/) 30 | bower_components 31 | 32 | # node-waf configuration 33 | .lock-wscript 34 | 35 | # Compiled binary addons (http://nodejs.org/api/addons.html) 36 | build/Release 37 | 38 | # Dependency directories 39 | node_modules/ 40 | jspm_packages/ 41 | 42 | # Typescript v1 declaration files 43 | typings/ 44 | 45 | # Optional npm cache directory 46 | .npm 47 | 48 | # Optional eslint cache 49 | .eslintcache 50 | 51 | # Optional REPL history 52 | .node_repl_history 53 | 54 | # Output of 'npm pack' 55 | *.tgz 56 | 57 | # Yarn Integrity file 58 | .yarn-integrity 59 | 60 | # dotenv environment variables file 61 | .env 62 | -------------------------------------------------------------------------------- /.cfignore: -------------------------------------------------------------------------------- 1 | docs 2 | build 3 | .vscode 4 | 5 | # Logs 6 | logs 7 | *.log 8 | npm-debug.log* 9 | yarn-debug.log* 10 | yarn-error.log* 11 | 12 | # Runtime data 13 | pids 14 | *.pid 15 | *.seed 16 | *.pid.lock 17 | 18 | # Directory for instrumented libs generated by jscoverage/JSCover 19 | lib-cov 20 | 21 | # Coverage directory used by tools like istanbul 22 | coverage 23 | 24 | # nyc test coverage 25 | .nyc_output 26 | 27 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 28 | .grunt 29 | 30 | # Bower dependency directory (https://bower.io/) 31 | bower_components 32 | 33 | # node-waf configuration 34 | .lock-wscript 35 | 36 | # Compiled binary addons (http://nodejs.org/api/addons.html) 37 | build/Release 38 | 39 | # Dependency directories 40 | node_modules/ 41 | jspm_packages/ 42 | 43 | # Typescript v1 declaration files 44 | typings/ 45 | 46 | # Optional npm cache directory 47 | .npm 48 | 49 | # Optional eslint cache 50 | .eslintcache 51 | 52 | # Optional REPL history 53 | .node_repl_history 54 | 55 | # Output of 'npm pack' 56 | *.tgz 57 | 58 | # Yarn Integrity file 59 | .yarn-integrity 60 | 61 | # dotenv environment variables file 62 | .env 63 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | // load preact components 2 | import { h, render, Component } from 'preact'; 3 | 4 | // load our shopping list factories 5 | import { ShoppingListFactory, ShoppingListRepositoryPouchDB } from 'ibm-shopping-list-model'; 6 | 7 | // load PouchDB libraries 8 | import PouchDB from 'pouchdb'; 9 | import PouchDBFind from 'pouchdb-find'; 10 | import './App.css'; 11 | 12 | // add the pouchdb-find plugin for free-text search 13 | PouchDB.plugin(PouchDBFind); 14 | 15 | // create local PouchDB database (if it doesn't already exist) 16 | const localDB = new PouchDB('shopping_list_react'); 17 | 18 | // start up the factories 19 | const shoppingListFactory = new ShoppingListFactory(); 20 | const shoppingListRepository = new ShoppingListRepositoryPouchDB(localDB); 21 | 22 | // load our App class 23 | import App from './App'; 24 | 25 | // create database indexes 26 | shoppingListRepository.ensureIndexes().then(() => { 27 | 28 | // tehn render our app 29 | render(, document.body); 34 | }).catch(err => { 35 | console.log('ERROR in ensureIndexes'); 36 | console.log(err); 37 | }); 38 | -------------------------------------------------------------------------------- /docs/index.html: -------------------------------------------------------------------------------- 1 | Preact PouchDB ShoppingList PWA
-------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "shopping-list-preact-pouchdb", 3 | "version": "0.1.0", 4 | "private": true, 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "if-env NODE_ENV=production && npm run serve || npm run dev", 8 | "build": "preact build --no-prerender --template=./index.html --dest=./docs --clean", 9 | "test": "eslint src && karma start --single-run --browsers ChromeHeadless karma.conf.js", 10 | "serve": "preact build --no-prerender --template=./index.html --dest=./docs --clean && metrics-tracker-client track && superstatic docs --gzip --host 0.0.0.0 --port 8080", 11 | "dev": "preact watch --template=./index.html --config=./preact.config.js" 12 | }, 13 | "babel": { 14 | "plugins": [ 15 | [ 16 | "transform-react-jsx", 17 | { 18 | "pragma": "h" 19 | } 20 | ] 21 | ] 22 | }, 23 | "keywords": [], 24 | "author": "rrsingh@us.ibm.com", 25 | "license": "Apache 2.0", 26 | "eslintConfig": { 27 | "extends": "eslint-config-synacor" 28 | }, 29 | "devDependencies": { 30 | "eslint": "^4.19.1", 31 | "eslint-config-synacor": "^1.1.2", 32 | "extract-text-webpack-plugin": "^2.1.2", 33 | "if-env": "^1.0.4", 34 | "postcss": "^6.0.11", 35 | "preact-cli": "^2.2.1", 36 | "tunnel-agent": "^0.6.0" 37 | }, 38 | "dependencies": { 39 | "ibm-shopping-list-model": "^0.2.6", 40 | "immutable": "^3.8.2", 41 | "lodash": "^4.17.10", 42 | "materialize-css": "^0.100.2", 43 | "pouchdb": "^7.0.0", 44 | "pouchdb-find": "^6.4.3", 45 | "preact": "^8.2.9", 46 | "prop-types": "^15.6.2" 47 | } 48 | } 49 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | ## Contributing In General 2 | 3 | Our project welcomes external contributions! If you have an itch, please 4 | feel free to scratch it. 5 | 6 | To contribute code or documentation, you can submit a pull request. A 7 | good way to familiarize yourself with the codebase and contribution process is 8 | to look for and tackle low-hanging fruit in the issue tracker. Before embarking on 9 | a more ambitious contribution, please raise an issue for discussion. 10 | 11 | **We appreciate your effort, and want to avoid a situation where a contribution 12 | requires extensive rework (by you or by us), sits in the queue for a long time, 13 | or cannot be accepted at all!** 14 | 15 | ### Proposing new features 16 | 17 | If you would like to implement a new feature, please raise an issue before sending a pull 18 | request so the feature can be discussed. This is to avoid you spending your 19 | valuable time working on a feature that the project developers are not willing 20 | or able to accept into the code base. 21 | 22 | ### Fixing bugs 23 | 24 | If you would like to fix a bug, please raise an issue before sending a pull 25 | request so it can be discussed. If the fix is trivial or non controversial then 26 | this is not usually necessary. 27 | 28 | ### Merge approval 29 | 30 | Two project maintainers will need to review and approve your pull request before it 31 | is merged. They may request changes or ask questions so keep an eye on your pull 32 | request while review is in progress. Maintainers will expect that: 33 | 34 | - tests pass, and new features have accompanying tests (see the project `README` for more information about running tests) 35 | - documentation has been updated where appropriate 36 | - any coding standards have been followed (see the project `README` for more information about coding standards) 37 | 38 | Some or all of these checks may be automated so look out for immediate feedback from the 39 | CI system on your pull request. 40 | 41 | For more details, see the [MAINTAINERS](MAINTAINERS.md) page. 42 | 43 | ## Developer Setup 44 | 45 | Follow the "Run locally" steps in the `README` and you will have a local git repo 46 | and test environment, or use "Deploy to IBM Cloud" and you can use the IBM Cloud DevOps environment. -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | Preact PouchDB ShoppingList PWA 21 | <% if (htmlWebpackPlugin.options.manifest.theme_color) { %> 22 | 23 | <% } %> 24 | <% for (var chunk of webpack.chunks) { %> 25 | <% if (chunk.names.length === 1 && chunk.names[0] === 'polyfills') continue; %> 26 | <% for (var file of chunk.files) { %> 27 | <% if (htmlWebpackPlugin.options.preload && file.match(/\.(js|css)$/)) { %> 28 | 29 | <% } else if (file.match(/manifest\.json$/)) { %> 30 | 31 | <% } %> 32 | <% } %> 33 | <% } %> 34 | 35 | 36 | 39 |
40 | 50 | <%= htmlWebpackPlugin.options.ssr({ 51 | url: '/' 52 | }) %> 53 | 54 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /MAINTAINERS.md: -------------------------------------------------------------------------------- 1 | # Maintainers Guide 2 | 3 | This guide is intended for maintainers - anybody with commit access to one or 4 | more Code Pattern repositories. 5 | 6 | ## Methodology 7 | 8 | This repository does not have a traditional release management cycle, but 9 | should instead be maintained as as a useful, working, and polished reference at 10 | all times. While all work can therefore be focused on the master branch, the 11 | quality of this branch should never be compromised. 12 | 13 | The remainder of this document details how to merge pull requests to the 14 | repositories. 15 | 16 | ## Merge approval 17 | 18 | The project maintainers use LGTM (Looks Good To Me) in comments on the pull 19 | request to indicate acceptance prior to merging. A change requires LGTMs from 20 | two project maintainers. If the code is written by a maintainer, the change 21 | only requires one additional LGTM. 22 | 23 | ## Reviewing Pull Requests 24 | 25 | We recommend reviewing pull requests directly within GitHub. This allows a 26 | public commentary on changes, providing transparency for all users. When 27 | providing feedback be civil, courteous, and kind. Disagreement is fine, so long 28 | as the discourse is carried out politely. If we see a record of uncivil or 29 | abusive comments, we will revoke your commit privileges and invite you to leave 30 | the project. 31 | 32 | During your review, consider the following points: 33 | 34 | ### Does the change have positive impact? 35 | 36 | Some proposed changes may not represent a positive impact to the project. Ask 37 | whether or not the change will make understanding the code easier, or if it 38 | could simply be a personal preference on the part of the author (see 39 | [bikeshedding](https://en.wiktionary.org/wiki/bikeshedding)). 40 | 41 | Pull requests that do not have a clear positive impact should be closed without 42 | merging. 43 | 44 | ### Do the changes make sense? 45 | 46 | If you do not understand what the changes are or what they accomplish, ask the 47 | author for clarification. Ask the author to add comments and/or clarify test 48 | case names to make the intentions clear. 49 | 50 | At times, such clarification will reveal that the author may not be using the 51 | code correctly, or is unaware of features that accommodate their needs. If you 52 | feel this is the case, work up a code sample that would address the pull 53 | request for them, and feel free to close the pull request once they confirm. 54 | 55 | ### Does the change introduce a new feature? 56 | 57 | For any given pull request, ask yourself "is this a new feature?" If so, does 58 | the pull request (or associated issue) contain narrative indicating the need 59 | for the feature? If not, ask them to provide that information. 60 | 61 | Are new unit tests in place that test all new behaviors introduced? If not, do 62 | not merge the feature until they are! Is documentation in place for the new 63 | feature? (See the documentation guidelines). If not do not merge the feature 64 | until it is! Is the feature necessary for general use cases? Try and keep the 65 | scope of any given component narrow. If a proposed feature does not fit that 66 | scope, recommend to the user that they maintain the feature on their own, and 67 | close the request. You may also recommend that they see if the feature gains 68 | traction among other users, and suggest they re-submit when they can show such 69 | support. 70 | -------------------------------------------------------------------------------- /docs/sw.js: -------------------------------------------------------------------------------- 1 | "use strict";function setOfCachedUrls(e){return e.keys().then(function(e){return e.map(function(e){return e.url})}).then(function(e){return new Set(e)})}var precacheConfig=[["./assets/favicon.ico","825635e2e08cd0ded3ac2d7c9aa82d90"],["./assets/shoppinglist48.png","eb61205efe0b1651db2c012f6d961930"],["./assets/shoppinglist96.png","17a3fd39dfd2944e7189c35dc9fb07b5"],["./assets/shoppinglist_splash.png","1b53142fc3096eae9bf7ce0a6e4a507a"],["./bundle.0f2cc.js","d3900eaede4f8ff01d702cc36dd841ef"],["./favicon.ico","825635e2e08cd0ded3ac2d7c9aa82d90"],["./index.html","621461ef7ae71583223a283e98863b02"],["./manifest.json","7a3103437b5140ba5690012f46a15612"],["./style.ce993.css","e36599554d1285209e120d5c88a0ee02"]],cacheName="sw-precache-v3-sw-precache-webpack-plugin-"+(self.registration?self.registration.scope:""),ignoreUrlParametersMatching=[/^utm_/],addDirectoryIndex=function(e,t){var n=new URL(e);return"/"===n.pathname.slice(-1)&&(n.pathname+=t),n.toString()},cleanResponse=function(e){return e.redirected?("body"in e?Promise.resolve(e.body):e.blob()).then(function(t){return new Response(t,{headers:e.headers,status:e.status,statusText:e.statusText})}):Promise.resolve(e)},createCacheKey=function(e,t,n,r){var a=new URL(e);return r&&a.pathname.match(r)||(a.search+=(a.search?"&":"")+encodeURIComponent(t)+"="+encodeURIComponent(n)),a.toString()},isPathWhitelisted=function(e,t){if(0===e.length)return!0;var n=new URL(t).pathname;return e.some(function(e){return n.match(e)})},stripIgnoredUrlParameters=function(e,t){var n=new URL(e);return n.hash="",n.search=n.search.slice(1).split("&").map(function(e){return e.split("=")}).filter(function(e){return t.every(function(t){return!t.test(e[0])})}).map(function(e){return e.join("=")}).join("&"),n.toString()},hashParamName="_sw-precache",urlsToCacheKeys=new Map(precacheConfig.map(function(e){var t=e[0],n=e[1],r=new URL(t,self.location),a=createCacheKey(r,hashParamName,n,!1);return[r.toString(),a]}));self.addEventListener("install",function(e){e.waitUntil(caches.open(cacheName).then(function(e){return setOfCachedUrls(e).then(function(t){return Promise.all(Array.from(urlsToCacheKeys.values()).map(function(n){if(!t.has(n)){var r=new Request(n,{credentials:"same-origin"});return fetch(r).then(function(t){if(!t.ok)throw new Error("Request for "+n+" returned a response with status "+t.status);return cleanResponse(t).then(function(t){return e.put(n,t)})})}}))})}).then(function(){return self.skipWaiting()}))}),self.addEventListener("activate",function(e){var t=new Set(urlsToCacheKeys.values());e.waitUntil(caches.open(cacheName).then(function(e){return e.keys().then(function(n){return Promise.all(n.map(function(n){if(!t.has(n.url))return e.delete(n)}))})}).then(function(){return self.clients.claim()}))}),self.addEventListener("fetch",function(e){if("GET"===e.request.method){var t,n=stripIgnoredUrlParameters(e.request.url,ignoreUrlParametersMatching);(t=urlsToCacheKeys.has(n))||(n=addDirectoryIndex(n,"index.html"),t=urlsToCacheKeys.has(n));!t&&"navigate"===e.request.mode&&isPathWhitelisted(["^(?!\\/__).*"],e.request.url)&&(n=new URL("index.html",self.location).toString(),t=urlsToCacheKeys.has(n)),t&&e.respondWith(caches.open(cacheName).then(function(e){return e.match(urlsToCacheKeys.get(n)).then(function(e){if(e)return e;throw Error("The cached response that was expected is missing.")})}).catch(function(t){return console.warn('Couldn\'t serve response for "%s" from cache: %O',e.request.url,t),fetch(e.request)}))}}); -------------------------------------------------------------------------------- /src/components/ShoppingList.js: -------------------------------------------------------------------------------- 1 | // load Preact components 2 | import { h, Component } from 'preact'; 3 | 4 | // renders a shopping list 5 | class ShoppingList extends Component { 6 | 7 | /* all state actions are for handling the renaming dialog */ 8 | state = { 9 | editingName: false, 10 | activeItemId: '', 11 | oldName: '', 12 | newName: '' 13 | }; 14 | 15 | // reset focus 16 | componentDidUpdate() { 17 | if (this.state.editingName === true) { 18 | this.nameInput.focus(); 19 | } 20 | } 21 | 22 | // record that editing is starting 23 | handleEditingStart = (itemid, itemtitle) => { 24 | this.setState({ editingName: true, activeItemId: itemid, oldName: itemtitle }); 25 | }; 26 | 27 | // record that editing is done 28 | handleEditingDone = () => { 29 | this.setState({ editingName: false }); 30 | }; 31 | 32 | // UI handler for submission of editing form 33 | handleEditingSubmit = (e) => { 34 | this.props.renameItemFunc(this.state.activeItemId, this.state.newName); 35 | this.handleEditingDone(); 36 | }; 37 | 38 | // UI handler for editing the name 39 | updateName = (e) => { 40 | this.setState({ newName: e.target.value }); 41 | } 42 | 43 | // JSX - edit name markup 44 | renderEditNameUI = () => ( 45 |
46 |
47 |
48 |
51 | { this.nameInput = inp; }} 53 | value={this.state.oldName} 54 | onChange={this.updateName} 55 | style={{ height: 'unset', 'margin-bottom': '8px' }} 56 | /> 57 |
58 |
59 |
60 |
61 | 62 | close 63 | 64 |
65 |
66 | ) 67 | 68 | // JSX - render the component 69 | render() { 70 | let items = []; 71 | for (let item of this.props.shoppingListItems) { 72 | items.push( 73 |
74 |
75 |
76 | this.props.toggleItemCheckFunc(item._id)} 78 | defaultChecked={item.checked} 79 | /> 80 | 81 |
82 | 83 | {this.state.editingName && this.state.activeItemId === item._id ? 84 | this.renderEditNameUI() : 85 |
{item.title}
} 86 | 87 |
88 | this.handleEditingStart(item._id, item.title)}> 89 | mode_edit 90 | 91 | this.props.deleteFunc(item._id)}> 92 | delete_forever 93 | 94 |
95 |
96 | 97 |
98 |
); 99 | } 100 | 101 | return ( 102 |
103 |
{items}
104 |
105 | ); 106 | } 107 | } 108 | 109 | export default ShoppingList; -------------------------------------------------------------------------------- /docs/polyfills.dfb61.js: -------------------------------------------------------------------------------- 1 | !function(e){function t(o){if(n[o])return n[o].exports;var r=n[o]={i:o,l:!1,exports:{}};return e[o].call(r.exports,r,r.exports,t),r.l=!0,r.exports}var n={};t.m=e,t.c=n,t.i=function(e){return e},t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="./",t(t.s=1)}({1:function(e,t,n){e.exports=n("m+Gh")},BtxX:function(e){!function(t){function n(){}function o(e,t){return function(){e.apply(t,arguments)}}function r(e){if("object"!=typeof this)throw new TypeError("Promises must be constructed via new");if("function"!=typeof e)throw new TypeError("not a function");this._state=0,this._handled=!1,this._value=void 0,this._deferreds=[],a(e,this)}function i(e,t){for(;3===e._state;)e=e._value;if(0===e._state)return void e._deferreds.push(t);e._handled=!0,r._immediateFn(function(){var n=1===e._state?t.onFulfilled:t.onRejected;if(null===n)return void(1===e._state?u:c)(t.promise,e._value);var o;try{o=n(e._value)}catch(e){return void c(t.promise,e)}u(t.promise,o)})}function u(e,t){try{if(t===e)throw new TypeError("A promise cannot be resolved with itself.");if(t&&("object"==typeof t||"function"==typeof t)){var n=t.then;if(t instanceof r)return e._state=3,e._value=t,void s(e);if("function"==typeof n)return void a(o(n,t),e)}e._state=1,e._value=t,s(e)}catch(t){c(e,t)}}function c(e,t){e._state=2,e._value=t,s(e)}function s(e){2===e._state&&0===e._deferreds.length&&r._immediateFn(function(){e._handled||r._unhandledRejectionFn(e._value)});for(var t=0,n=e._deferreds.length;t { 23 | this.setState({ editingName: true, activeListId: listid, oldName: listtitle }); 24 | }; 25 | 26 | // record that editing is done 27 | handleEditingDone = () => { 28 | this.setState({ editingName: false }); 29 | }; 30 | 31 | // UI handler for form submission 32 | handleEditingSubmit = (e) => { 33 | this.props.renameListFunc(this.state.activeListId, this.state.newName); 34 | this.handleEditingDone(); 35 | }; 36 | 37 | // UI handler for name update 38 | updateName = (e) => { 39 | this.setState({ newName: e.target.value }); 40 | } 41 | 42 | // JSX - edit name markup 43 | renderEditNameUI = () => ( 44 |
45 |
46 |
47 |
50 | { this.nameInput = inp; }} 52 | value={this.state.oldName} 53 | onChange={this.updateName} 54 | style={{ height: 'unset', 'font-size': '18pt', 'margin-bottom': '8px' }} 55 | /> 56 |
57 |
58 |
59 |
60 | 63 | close 64 | 65 |
66 |
67 | ) 68 | 69 | // JSX - list of items markup 70 | render() { 71 | let listItems = []; 72 | for (let list of this.props.shoppingLists) { 73 | listItems.push( 74 |
75 |
76 | {this.state.editingName && this.state.activeListId === list._id ? 77 | this.renderEditNameUI() : 78 | 100 | } 101 |
102 |
103 |
104 | this.props.checkAllFunc(list._id)} 106 | defaultChecked={false} 107 | /> 108 | 109 |
110 |
111 | {(this.props.checkedCounts.get(list._id) || 0) + ' of ' + (this.props.totalCounts.get(list._id) || 0) + ' items checked'} 112 |
113 |
114 |
115 | ); 116 | } 117 | return ( 118 |
119 |
{listItems}
120 |
121 | ); 122 | } 123 | } 124 | 125 | export default ShoppingLists; -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | Apache License 2 | Version 2.0, January 2004 3 | http://www.apache.org/licenses/ 4 | 5 | TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION 6 | 7 | 1. Definitions. 8 | 9 | "License" shall mean the terms and conditions for use, reproduction, 10 | and distribution as defined by Sections 1 through 9 of this document. 11 | 12 | "Licensor" shall mean the copyright owner or entity authorized by 13 | the copyright owner that is granting the License. 14 | 15 | "Legal Entity" shall mean the union of the acting entity and all 16 | other entities that control, are controlled by, or are under common 17 | control with that entity. For the purposes of this definition, 18 | "control" means (i) the power, direct or indirect, to cause the 19 | direction or management of such entity, whether by contract or 20 | otherwise, or (ii) ownership of fifty percent (50%) or more of the 21 | outstanding shares, or (iii) beneficial ownership of such entity. 22 | 23 | "You" (or "Your") shall mean an individual or Legal Entity 24 | exercising permissions granted by this License. 25 | 26 | "Source" form shall mean the preferred form for making modifications, 27 | including but not limited to software source code, documentation 28 | source, and configuration files. 29 | 30 | "Object" form shall mean any form resulting from mechanical 31 | transformation or translation of a Source form, including but 32 | not limited to compiled object code, generated documentation, 33 | and conversions to other media types. 34 | 35 | "Work" shall mean the work of authorship, whether in Source or 36 | Object form, made available under the License, as indicated by a 37 | copyright notice that is included in or attached to the work 38 | (an example is provided in the Appendix below). 39 | 40 | "Derivative Works" shall mean any work, whether in Source or Object 41 | form, that is based on (or derived from) the Work and for which the 42 | editorial revisions, annotations, elaborations, or other modifications 43 | represent, as a whole, an original work of authorship. For the purposes 44 | of this License, Derivative Works shall not include works that remain 45 | separable from, or merely link (or bind by name) to the interfaces of, 46 | the Work and Derivative Works thereof. 47 | 48 | "Contribution" shall mean any work of authorship, including 49 | the original version of the Work and any modifications or additions 50 | to that Work or Derivative Works thereof, that is intentionally 51 | submitted to Licensor for inclusion in the Work by the copyright owner 52 | or by an individual or Legal Entity authorized to submit on behalf of 53 | the copyright owner. For the purposes of this definition, "submitted" 54 | means any form of electronic, verbal, or written communication sent 55 | to the Licensor or its representatives, including but not limited to 56 | communication on electronic mailing lists, source code control systems, 57 | and issue tracking systems that are managed by, or on behalf of, the 58 | Licensor for the purpose of discussing and improving the Work, but 59 | excluding communication that is conspicuously marked or otherwise 60 | designated in writing by the copyright owner as "Not a Contribution." 61 | 62 | "Contributor" shall mean Licensor and any individual or Legal Entity 63 | on behalf of whom a Contribution has been received by Licensor and 64 | subsequently incorporated within the Work. 65 | 66 | 2. Grant of Copyright License. Subject to the terms and conditions of 67 | this License, each Contributor hereby grants to You a perpetual, 68 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 69 | copyright license to reproduce, prepare Derivative Works of, 70 | publicly display, publicly perform, sublicense, and distribute the 71 | Work and such Derivative Works in Source or Object form. 72 | 73 | 3. Grant of Patent License. Subject to the terms and conditions of 74 | this License, each Contributor hereby grants to You a perpetual, 75 | worldwide, non-exclusive, no-charge, royalty-free, irrevocable 76 | (except as stated in this section) patent license to make, have made, 77 | use, offer to sell, sell, import, and otherwise transfer the Work, 78 | where such license applies only to those patent claims licensable 79 | by such Contributor that are necessarily infringed by their 80 | Contribution(s) alone or by combination of their Contribution(s) 81 | with the Work to which such Contribution(s) was submitted. If You 82 | institute patent litigation against any entity (including a 83 | cross-claim or counterclaim in a lawsuit) alleging that the Work 84 | or a Contribution incorporated within the Work constitutes direct 85 | or contributory patent infringement, then any patent licenses 86 | granted to You under this License for that Work shall terminate 87 | as of the date such litigation is filed. 88 | 89 | 4. Redistribution. You may reproduce and distribute copies of the 90 | Work or Derivative Works thereof in any medium, with or without 91 | modifications, and in Source or Object form, provided that You 92 | meet the following conditions: 93 | 94 | (a) You must give any other recipients of the Work or 95 | Derivative Works a copy of this License; and 96 | 97 | (b) You must cause any modified files to carry prominent notices 98 | stating that You changed the files; and 99 | 100 | (c) You must retain, in the Source form of any Derivative Works 101 | that You distribute, all copyright, patent, trademark, and 102 | attribution notices from the Source form of the Work, 103 | excluding those notices that do not pertain to any part of 104 | the Derivative Works; and 105 | 106 | (d) If the Work includes a "NOTICE" text file as part of its 107 | distribution, then any Derivative Works that You distribute must 108 | include a readable copy of the attribution notices contained 109 | within such NOTICE file, excluding those notices that do not 110 | pertain to any part of the Derivative Works, in at least one 111 | of the following places: within a NOTICE text file distributed 112 | as part of the Derivative Works; within the Source form or 113 | documentation, if provided along with the Derivative Works; or, 114 | within a display generated by the Derivative Works, if and 115 | wherever such third-party notices normally appear. The contents 116 | of the NOTICE file are for informational purposes only and 117 | do not modify the License. You may add Your own attribution 118 | notices within Derivative Works that You distribute, alongside 119 | or as an addendum to the NOTICE text from the Work, provided 120 | that such additional attribution notices cannot be construed 121 | as modifying the License. 122 | 123 | You may add Your own copyright statement to Your modifications and 124 | may provide additional or different license terms and conditions 125 | for use, reproduction, or distribution of Your modifications, or 126 | for any such Derivative Works as a whole, provided Your use, 127 | reproduction, and distribution of the Work otherwise complies with 128 | the conditions stated in this License. 129 | 130 | 5. Submission of Contributions. Unless You explicitly state otherwise, 131 | any Contribution intentionally submitted for inclusion in the Work 132 | by You to the Licensor shall be under the terms and conditions of 133 | this License, without any additional terms or conditions. 134 | Notwithstanding the above, nothing herein shall supersede or modify 135 | the terms of any separate license agreement you may have executed 136 | with Licensor regarding such Contributions. 137 | 138 | 6. Trademarks. This License does not grant permission to use the trade 139 | names, trademarks, service marks, or product names of the Licensor, 140 | except as required for reasonable and customary use in describing the 141 | origin of the Work and reproducing the content of the NOTICE file. 142 | 143 | 7. Disclaimer of Warranty. Unless required by applicable law or 144 | agreed to in writing, Licensor provides the Work (and each 145 | Contributor provides its Contributions) on an "AS IS" BASIS, 146 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or 147 | implied, including, without limitation, any warranties or conditions 148 | of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A 149 | PARTICULAR PURPOSE. You are solely responsible for determining the 150 | appropriateness of using or redistributing the Work and assume any 151 | risks associated with Your exercise of permissions under this License. 152 | 153 | 8. Limitation of Liability. In no event and under no legal theory, 154 | whether in tort (including negligence), contract, or otherwise, 155 | unless required by applicable law (such as deliberate and grossly 156 | negligent acts) or agreed to in writing, shall any Contributor be 157 | liable to You for damages, including any direct, indirect, special, 158 | incidental, or consequential damages of any character arising as a 159 | result of this License or out of the use or inability to use the 160 | Work (including but not limited to damages for loss of goodwill, 161 | work stoppage, computer failure or malfunction, or any and all 162 | other commercial damages or losses), even if such Contributor 163 | has been advised of the possibility of such damages. 164 | 165 | 9. Accepting Warranty or Additional Liability. While redistributing 166 | the Work or Derivative Works thereof, You may choose to offer, 167 | and charge a fee for, acceptance of support, warranty, indemnity, 168 | or other liability obligations and/or rights consistent with this 169 | License. However, in accepting such obligations, You may act only 170 | on Your own behalf and on Your sole responsibility, not on behalf 171 | of any other Contributor, and only if You agree to indemnify, 172 | defend, and hold each Contributor harmless for any liability 173 | incurred by, or claims asserted against, such Contributor by reason 174 | of your accepting any such warranty or additional liability. 175 | 176 | END OF TERMS AND CONDITIONS 177 | 178 | APPENDIX: How to apply the Apache License to your work. 179 | 180 | To apply the Apache License to your work, attach the following 181 | boilerplate notice, with the fields enclosed by brackets "{}" 182 | replaced with your own identifying information. (Don't include 183 | the brackets!) The text should be enclosed in the appropriate 184 | comment syntax for the file format. We also recommend that a 185 | file or class name and description of purpose be included on the 186 | same "printed page" as the copyright notice for easier 187 | identification within third-party archives. 188 | 189 | Copyright {yyyy} {name of copyright owner} 190 | 191 | Licensed under the Apache License, Version 2.0 (the "License"); 192 | you may not use this file except in compliance with the License. 193 | You may obtain a copy of the License at 194 | 195 | http://www.apache.org/licenses/LICENSE-2.0 196 | 197 | Unless required by applicable law or agreed to in writing, software 198 | distributed under the License is distributed on an "AS IS" BASIS, 199 | WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 200 | See the License for the specific language governing permissions and 201 | limitations under the License. 202 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | [![Build Status](https://travis-ci.org/ibm-watson-data-lab/shopping-list-preact-pouchdb.svg?branch=master)](https://travis-ci.org/ibm-watson-data-lab/shopping-list-preact-pouchdb.svg?branch=master) 7 | ![IBM Cloud Deployments](https://metrics-tracker.mybluemix.net/stats/0838e9f6e62b2afd767bdee96acb0f08/badge.svg) 8 | 9 | # Create an Offline First Shopping List with Preact and PouchDB 10 | 11 | This code pattern is a reference implementation of an Offline First shopping list app, built as a Progressive Web App using [Preact](https://preactjs.com/) and [PouchDB](https://pouchdb.com/). [This app is part of a series of Offline First demo apps, each built using a different stack](https://github.com/ibm-watson-data-lab/shopping-list). 12 | 13 | When the reader has completed this Code Pattern and explored the code in this GitHub repository, they will understand how to: 14 | * create a shopping list web application that stores its data in a local PouchDB database. 15 | * turn the web application into a Progressive Web App that works with or without an internet connection. 16 | * make the app sync to and from a remote Cloudant database. 17 | 18 | ![architecture](doc/source/images/architecture.png) 19 | 20 | ## Flow 21 | 1. Browser loads Progressive Web App's resources from the web server. 22 | 2. User interacts with the web app to add shopping lists and list items. 23 | 3. Data is stored locally in PouchDB. 24 | 4. PouchDB syncs its data with a remote IBM Cloudant database. 25 | 26 | ## Included components 27 | * [Cloudant NoSQL DB](https://console.ng.bluemix.net/catalog/services/cloudant-nosql-db): A fully-managed data layer designed for modern web and mobile applications that leverages a flexible JSON schema. Based on the open source Apache CouchDB, IBM Cloudant provides additional full text and geospatial capabilities. 28 | 29 | ## Featured technologies 30 | * [PouchDB](https://pouchdb.com/) - an in-browser database that can replicate to and from a remote Apache CouchDB or IBM Cloudant database. 31 | * [Preact](https://preactjs.com/) - a progressive JavaScript framework. 32 | * [Apache CouchDB](http://couchdb.apache.org/) - modern, document database hosted on your server or in the cloud. 33 | 34 | ## Key concepts 35 | 36 | This shopping list app is a small single page web application consisting of an HTML file, a couple of CSS files, and a single JavaScript file, the Preact framework, and the PouchDB library. The web page will allow multiple shopping lists to be created (e.g., Groceries, Clothes) each with a number of shopping list items associated with them (e.g., Bread, Water). 37 | 38 | So what sets this app apart? Its Offline First architecture. The Offline First approach plans for the most constrained network environment first, enabling a great user experience even while the device is offline or has only an intermittent connection, and providing progressive enhancement as network conditions improve. This design also makes the app incredibly performant (fast!) on the best of networks. 39 | 40 | PouchDB, CouchDB, and Service Worker are the primary tools that turn our simple shopping list app into a high performance, offline-capable Progressive Web App. 41 | 42 | **Data stays safe on your device, even while it's offline.** 43 | Persistance of shopping lists and item data entered by the user is achieved using the in-browser database PouchDB. This will allow your data to survive between sessions and when disconnected from the network. (Whether you remember that you need juice while you're on your trusty home Wi-Fi or in the middle of the wilderness, you can still add it your list.) 44 | 45 | **Data syncs between devices when a connection is available.** 46 | When a connection is available, the data is synced from the local device to a CouchDB database in the cloud, and can thus be shared across multiple devices or users. (Need to share your grocery list with your roommate or access it on both your phone and your laptop? No problem!) 47 | 48 | 49 | **The app loads quickly, even while offline.** 50 | To keep the app itself functional while offline, a Service Worker is used to cache page resources (the most important HTML, CSS, and JavaScript files) when the web application is first visited. Each device must have a connection for this first visit, after which the app will be fully functional even while offline or in shoddy network conditions. (No more error messages or frustratingly slow page loads.) 51 | 52 | 53 | **The app can be installed on a mobile device.** 54 | In combination with the Service Worker used for caching, a manifest file containing metadata allows the app to become a Progressive Web App, an enhanced website that can be installed on a mobile device and can then be used with or without an internet connection. (It's secretly still a website, but you can access it through one of those handy dandy little app icons on your homescreen!) 55 | 56 | Explore the code in this GitHub repository to see how the Offline First design is applied. 57 | 58 | # Tutorial 59 | 60 | Refer to the tutorial for step-by-step instructions on how to build your own Offline First shopping list Progressive Web App with Preact and PouchDB. 61 | 62 | # Live demo 63 | To see this app in action without installing anything, simply visit https://ibm-watson-data-lab.github.io/shopping-list-preact-pouchdb/ in a web browser or on your mobile device. 64 | 65 | # Steps 66 | 67 | Want to check out the end product on your own machine? Follow these steps to deploy your own instance of the shopping list app. 68 | 69 | This app can be deployed to IBM Cloud. You can also run this app on your local machine for development purposes using either a local Apache CouchDB instance or an IBM Cloudant service instance from the IBM Cloud Catalog. 70 | 71 | * [Deploy to IBM Cloud](#deploy-to-bluemix) **OR** [Run locally](#run-locally) 72 | * [Database and replication setup](#database-and-replication-setup) 73 | 74 | ## Deploy to IBM Cloud 75 | 76 | [![Deploy to IBM Cloud](https://metrics-tracker.mybluemix.net/stats/5c5df69e10058d49cdc1f4d2fc63ce31/button.svg)](https://bluemix.net/deploy?repository=https://github.com/ibm-watson-data-lab/shopping-list-polymer-pouchdb) 77 | 78 | 1. Press the above ``Deploy to IBM Cloud`` button and then click on ``Deploy``. 79 | 80 | 1. In Toolchains, click on Delivery Pipeline to watch while the app is deployed. Once deployed, the app can be viewed by clicking `View app`. 81 | 82 | 1. To see the app and services created and configured for this code pattern, use the IBM Cloud dashboard. The app is named [app-name] with a unique suffix. The following services are created and easily identified by the [chosen prefix] prefix: 83 | * prefix-Service1 84 | * prefix-Service2 85 | 86 | ## Run locally 87 | > NOTE: These steps are only needed when running locally instead of using the ``Deploy to IBM Cloud`` button. 88 | 89 | 90 | 91 | 1. [Clone the repo](#1-clone-the-repo) 92 | 1. [Install the prerequisites](#2-install-the-prerequisites) 93 | 1. [Run the server](#3-run-the-server) 94 | 1. [Create a Cloudant or CouchDB service](#4-create-a-cloudant-or-couchdb-service) 95 | 96 | ### 1. Clone the repo 97 | 98 | Clone the `shopping-list-preact-pouchdb` repo locally. In a terminal, run: 99 | 100 | 101 | 102 | ``` 103 | $ git clone https://github.com/ibm-watson-data-lab/shopping-list-preact-pouchdb.git 104 | ``` 105 | 106 | ### 2. Install the prerequisites 107 | 108 | First, install [Preact CLI](https://github.com/developit/preact-cli) using [npm](https://www.npmjs.com/) (we assume you have pre-installed [Node.js](https://nodejs.org/)): 109 | 110 | 111 | $ npm i -g preact-cli 112 | 113 | Second, install the dependent packages: 114 | 115 | $ npm install 116 | 117 | ### 3. Run the server 118 | 119 | This command serves the app at `http://127.0.0.1:8080` and provides basic URL routing for the app: 120 | 121 | $ npm start 122 | 123 | ### 4. Create a Cloudant or CouchDB service 124 | 125 | PouchDB can synchronize with CouchDB and compatible servers. To run and test locally, you can install CouchDB. Alternatively, you can use a hosted Cloudant NoSQL DB service for your remote DB. 126 | 127 | #### Installing Apache CouchDB 128 | 129 | [Install CouchDB 2.1](http://docs.couchdb.org/en/2.1.0/install/index.html). Instructions are available for installing CouchDB 2.1 on Unix-like systems, on Windows, on Mac OS X, on FreeBSD, and via other methods. 130 | 131 | Configure CouchDB for a [single-node setup](http://docs.couchdb.org/en/2.1.0/install/setup.html#single-node-setup), as opposed to a cluster setup. Once you have finished setting up CouchDB, you should be able to access CouchDB at `http://127.0.0.1:5984/`. Ensure that CouchDB is running and take note of your admin username and password. 132 | 133 | #### Creating a Cloudant NoSQL DB service 134 | 135 | To provision a managed Cloudant NoSQL DB 136 | 137 | * Log in to [IBM Cloud](https://console.ng.bluemix.net/). 138 | > Sign up for an account, if you do not already have one. 139 | * [Provision a Cloudant NoSQL DB _Lite_ plan instance](https://console.bluemix.net/catalog/services/cloudant-nosql-db), which is free. 140 | > If desired, you can also re-use an existing Cloudant NoSQL DB service instance. (Open the [**Data & Analytics** resources dashboard](https://console.bluemix.net/dashboard/data) to see a list of pre-provisioned instances that you have access to.) 141 | * Open the **Service credentials** tab. 142 | * Add new credentials for this service instance if no credentials have been defined yet. 143 | * View the credentials and note the value of the **url** property, which has the following format: `https://username:password@username-bluemix.cloudant.com`. 144 | 145 | Tip: Select the **Manage** tab and click **Launch** to open the Cloudant dashboard and manage the service instance. 146 | 147 | ## Database and replication setup 148 | 1. [Create the remote database](#1-create-the-remote-database) 149 | 1. [Enable CORS](#2-enable-cors) 150 | 1. [Set the replication target](#3-set-the-replication-target) 151 | 152 | ### 1. Create the remote database 153 | 154 | * Use the Cloudant or CouchDB dashboard to create a database. 155 | 156 | * Select the Databases tab on the left and then use the `Create Database` button to create the "shopping-list" database. 157 | The Shopping List app can be used locally before the database exists, but cannot sync 158 | until the remote database is completed. 159 | 160 | 161 | ![create Cloudant database](doc/source/images/create_db.png) 162 | 163 | ### 2. Enable CORS 164 | 165 | * Open the Cloudant or CouchDB dashboard to enable Cross-Origin Resource Sharing (CORS). 166 | 167 | * Select the Account Settings (or config) tab and open the **CORS** tab. 168 | 169 | * Enable CORS and restrict the domain as needed for security. 170 | 171 | 172 | ![Enable CORS](doc/source/images/enable_cors.png) 173 | 174 | ### 3. Set the replication target 175 | 176 | Run the Shopping List app and use the *Settings* form to enter your database URL. 177 | If you use the IBM Cloud Cloudant URL taken from the service credentials as described above, the URL includes user name and password. 178 | 179 | Add `/shopping-list` to the URL to connect to the database that you created. 180 | 181 | 182 | ![](doc/source/images/replicator.png) 183 | 184 | 185 | # Using the app 186 | 187 | The app allows you to create a shopping list by clicking on the plus sign. Click on the list to see its items. Then, you can add items to the list by clicking the plus sign. There is a checkbox to allow you to mark the items complete as you buy load up your cart. 188 | 189 | When you have not configured your Replication Target or when you are offline, the lists will not sync. One good way to test this is to run two browsers. You can use Chrome and Firefox and have different lists in each. 190 | 191 | When you go online and have the database and CORS enabled and the Replication Target is set, the shopping lists will sync. You will then be able to use both lists from either browser. 192 | 193 | 194 | ![](doc/source/images/shopping_lists.png) 195 | 196 | ## Running the tests 197 | 198 | 199 | This project does not, at present, have any automated tests. If you'd like to contribute some then please raise and issue and submit a pull-request - we'd be very happy to add them! Any pull-request you contribute will run through our continuous integration process which will check your code style. 200 | 201 | ## Deploying to GitHub Pages 202 | 203 | # Privacy Notice 204 | 205 | This web application includes code to track deployments to [IBM Cloud](https://www.ibm.com/cloud/) runtimes and services. Refer to https://github.com/IBM/metrics-collector-service#privacy-notice. 206 | 207 | ## Disabling Deployment Tracking 208 | 209 | To disable tracking, simply remove `&& metrics-tracker-client track` from the `serve` script within the `package.json` file in the top level directory. Optionally, you can also run `npm uninstall metrics-tracker-client` to remove the metrics tracker client dependency. 210 | 211 | 212 | 213 | # Links 214 | * [More Shopping List Sample Apps](https://github.com/ibm-watson-data-lab/shopping-list) 215 | 216 | * [Offline First](http://offlinefirst.org/) 217 | * [Progressive Web Apps](https://developers.google.com/web/progressive-web-apps/) 218 | * [Service Workers](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers) 219 | * [Web App Manifest](https://w3c.github.io/manifest/) 220 | * [PouchDB](https://pouchdb.com/) 221 | * [Apache CouchDB](https://couchdb.apache.org/) 222 | * [IBM Cloudant](https://www.ibm.com/cloud/cloudant) 223 | * [Materialize CSS](http://materializecss.com/getting-started.html) 224 | * [JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript) 225 | 226 | 240 | 241 | 242 | 243 | 244 | # License 245 | [Apache 2.0](LICENSE) 246 | -------------------------------------------------------------------------------- /src/App.js: -------------------------------------------------------------------------------- 1 | import { h, Component } from 'preact'; 2 | import { List } from 'immutable'; 3 | import ShoppingList from './components/ShoppingList'; 4 | import ShoppingLists from './components/ShoppingLists'; 5 | 6 | const NOLISTMSG = 'Click the + sign above to create a shopping list.'; 7 | const NOITEMSMSG = 'Click the + sign above to create a shopping list item.'; 8 | 9 | class App extends Component { 10 | constructor(props) { 11 | super(props); 12 | this.state = { 13 | shoppingList: null, 14 | shoppingLists: [], 15 | totalShoppingListItemCount: List(), //Immutable.js List with list ids as keys 16 | checkedTotalShoppingListItemCount: List(), //Immutable.js List with list ids as keys 17 | shoppingListItems: null, 18 | adding: false, 19 | view: 'lists', 20 | newName: '' 21 | } 22 | } 23 | 24 | componentDidMount = () => { 25 | this.getShoppingLists(); 26 | this.props.localDB.sync(this.props.remoteDB, { live: true, retry: true }) 27 | .on('change', change => { 28 | // console.log('something changed!'); 29 | }) 30 | // .on('paused', info => console.log('replication paused.')) 31 | // .on('active', info => console.log('replication resumed.')) 32 | .on('error', err => console.log('uh oh! an error occured.')); 33 | } 34 | 35 | // sets the app's state depending on what it finds in the shopping list database 36 | getShoppingLists = () => { 37 | let checkedCount = new List(); 38 | let totalCount = new List(); 39 | let lists = null; 40 | 41 | // load list of shopping lists 42 | this.props.shoppingListRepository.find().then(foundLists => { 43 | lists = foundLists; 44 | return foundLists; 45 | }).then(foundLists => this.props.shoppingListRepository.findItemsCountByList()).then(countsList => { 46 | totalCount = countsList; 47 | 48 | // calculate number of items by list 49 | return this.props.shoppingListRepository.findItemsCountByList({ 50 | selector: { 51 | type: 'item', 52 | checked: true 53 | }, 54 | fields: ['list'] 55 | }); 56 | }).then(checkedList => { 57 | checkedCount = checkedList; 58 | 59 | // update the Preact app's state 60 | this.setState({ 61 | view: 'lists', 62 | shoppingLists: lists, 63 | shoppingList: null, 64 | shoppingListItems: null, 65 | checkedTotalShoppingListItemCount: checkedCount, 66 | totalShoppingListItemCount: totalCount 67 | }); 68 | }).catch( err => { 69 | console.log('ERROR in getShoppingLists'); 70 | console.log(err); 71 | }); 72 | } 73 | 74 | openShoppingList = (listid) => { 75 | this.props.shoppingListRepository.get(listid).then( list => { 76 | return list; 77 | }).then(list => { 78 | this.getShoppingListItems(listid).then(items => { 79 | this.setState({ 80 | view: 'items', 81 | shoppingList: list, 82 | shoppingListItems: items 83 | }); 84 | }); 85 | }).catch(err => { 86 | }); 87 | } 88 | 89 | getShoppingListItems = (listid) => { 90 | return this.props.shoppingListRepository.findItems({ 91 | selector: { 92 | type: 'item', 93 | list: listid 94 | } 95 | }); 96 | } 97 | 98 | // re-load the shopping list items 99 | refreshShoppingListItems = (listid) => { 100 | this.props.shoppingListRepository.findItems({ 101 | selector: { 102 | type: 'item', 103 | list: listid 104 | } 105 | }).then(items => { 106 | this.setState({ 107 | view: 'items', 108 | shoppingListItems: items 109 | }); 110 | }); 111 | } 112 | 113 | // load a single shopping list by its id 114 | openShoppingList = (listid) => { 115 | this.props.shoppingListRepository.get(listid).then(list => list).then(list => { 116 | this.getShoppingListItems(listid).then(items => { 117 | this.setState({ 118 | view: 'items', 119 | shoppingList: list, 120 | shoppingListItems: items 121 | }); 122 | }); 123 | }); 124 | } 125 | 126 | // load a shopping list item, update its name and write it back to the database 127 | renameShoppingListItem = (itemid, newname) => { 128 | console.log('IN renameShoppingListItem with id='+itemid+', name='+newname); 129 | this.props.shoppingListRepository.getItem(itemid).then(item => { 130 | item = item.set('title', newname); 131 | return this.props.shoppingListRepository.putItem(item); 132 | }).then(this.refreshShoppingListItems(this.state.shoppingList._id)); 133 | } 134 | 135 | // delete a shopping list item i.e. load it and write it back as a deletion 136 | deleteShoppingListItem = (itemid) => { 137 | this.props.shoppingListRepository.getItem(itemid).then(item => this.props.shoppingListRepository.deleteItem(item)).then(this.refreshShoppingListItems(this.state.shoppingList._id)); 138 | } 139 | 140 | // mark a shopping list item as "checked" (done) 141 | toggleItemCheck = (itemid) => { 142 | this.props.shoppingListRepository.getItem(itemid).then(item => { 143 | item = item.set('checked', !item.checked); 144 | return this.props.shoppingListRepository.putItem(item); 145 | }).then(this.refreshShoppingListItems(this.state.shoppingList._id)); 146 | } 147 | 148 | // mark all of a shopping list items as checked 149 | checkAllListItems = (listid) => { 150 | let listcheck = true; 151 | 152 | // load the items 153 | this.getShoppingListItems(listid).then(items => { 154 | let newitems = []; 155 | items.forEach(item => { 156 | if (!item.checked) { 157 | newitems.push(item.mergeDeep({ checked: true })); 158 | } 159 | }, this); 160 | // if all items were already checked let's uncheck them all 161 | if (newitems.length === 0) { 162 | listcheck = false; 163 | items.forEach(item => { 164 | newitems.push(item.mergeDeep({ checked: false })); 165 | }, this); 166 | } 167 | 168 | // write back in a single bulk request 169 | let listOfShoppingListItems = this.props.shoppingListFactory.newListOfShoppingListItems(newitems); 170 | return this.props.shoppingListRepository.putItemsBulk(listOfShoppingListItems); 171 | }).then(newitemsresponse => { 172 | return this.props.shoppingListRepository.get(listid); 173 | }).then(shoppingList => { 174 | shoppingList = shoppingList.set('checked', listcheck); 175 | return this.props.shoppingListRepository.put(shoppingList); 176 | }).then(shoppingList => { 177 | // reload the shopping lists 178 | this.getShoppingLists(); 179 | }); 180 | } 181 | 182 | // delete a shopping list 183 | deleteShoppingList = (listid) => { 184 | this.props.shoppingListRepository.get(listid).then(shoppingList => { 185 | shoppingList = shoppingList.set('_deleted', true); 186 | return this.props.shoppingListRepository.put(shoppingList); 187 | }).then(result => { 188 | this.getShoppingLists(); 189 | }); 190 | } 191 | 192 | // rename a shopping list 193 | renameShoppingList = (listid, newname) => { 194 | console.log('HERE IN renameShoppingList with id='+listid+', title='+newname); 195 | this.props.shoppingListRepository.get(listid).then(shoppingList => { 196 | shoppingList = shoppingList.set('title', newname); 197 | return this.props.shoppingListRepository.put(shoppingList); 198 | }).then(this.getShoppingLists); 199 | } 200 | 201 | // creates a new shopping list or a new shopping list item, depending 202 | // on the state of the app 203 | createNewShoppingListOrItem = (e) => { 204 | e.preventDefault(); 205 | this.setState({adding: false}); 206 | 207 | if (this.state.view === 'lists') { 208 | let shoppingList = this.props.shoppingListFactory.newShoppingList({ 209 | title: this.state.newName 210 | }); 211 | this.props.shoppingListRepository.put(shoppingList).then(this.getShoppingLists); 212 | 213 | } else if (this.state.view === 'items') { 214 | let item = this.props.shoppingListFactory.newShoppingListItem({ 215 | title: this.state.newName 216 | }, this.state.shoppingList); 217 | this.props.shoppingListRepository.putItem(item).then(item => { 218 | this.getShoppingListItems(this.state.shoppingList._id).then(items => { 219 | this.setState({ 220 | view: 'items', 221 | shoppingListItems: items 222 | }); 223 | }); 224 | }); 225 | } 226 | } 227 | 228 | // handles UI event when a name is changed 229 | updateName = (e) => { 230 | this.setState({ newName: e.target.value }); 231 | } 232 | 233 | // handles UI event where user clicks the + button 234 | displayAddingUI = () => { 235 | this.setState({ adding: true }); 236 | } 237 | 238 | renderNewNameUI = () => { 239 | return ( 240 |
241 |
242 | 248 |
249 |
250 | ); 251 | } 252 | 253 | // sets the app into "about" mode 254 | displayAbout = () => { 255 | this.setState({ view: 'about' }); 256 | } 257 | 258 | // sets the app into "settings" mode 259 | displaySettings = () => { 260 | this.setState({ view: 'settings' }); 261 | } 262 | 263 | // utility function to save a local PouchDB document 264 | saveLocalDoc = (doc) => { 265 | const db = this.props.localDB; 266 | return db.get(doc._id).then((data) => { 267 | doc._rev = data._rev; 268 | return db.put(doc); 269 | }).catch((e) => { 270 | return db.put(doc); 271 | }); 272 | } 273 | 274 | // handles UI event when the sync URL is changed 275 | updateURL = (e) => { 276 | this.setState({ url: e.target.value }); 277 | var obj = { 278 | '_id': localConfig, 279 | 'syncURL': e.target.value 280 | }; 281 | this.saveLocalDoc(obj).then(console.log); 282 | } 283 | 284 | // starts a sync operation between the local PouchDB database and the remote 285 | // Cloudant/CouchDB/PouchDB databases 286 | startSync = (e) => { 287 | // if we have a sync URL 288 | if (this.state.url) { 289 | // initialise PouchDB 290 | this.state.remoteDB = new PouchDB(this.state.url) 291 | 292 | // start a live, continuous sync between our local DB and the remote DB 293 | this.props.localDB.sync(this.state.remoteDB, { live: true, retry: true }) 294 | .on('change', change => { 295 | // console.log("something changed!"); 296 | }) 297 | .on('error', err => { }); 298 | } 299 | } 300 | 301 | // application constructor 302 | constructor(props) { 303 | super(props); 304 | 305 | // initialise state 306 | this.state = { 307 | shoppingList: null, 308 | shoppingLists: [], 309 | totalShoppingListItemCount: new List(), //Immutable.js List with list ids as keys 310 | checkedTotalShoppingListItemCount: new List(), //Immutable.js List with list ids as keys 311 | shoppingListItems: null, 312 | adding: false, 313 | view: 'lists', 314 | newName: '' 315 | }; 316 | } 317 | 318 | // called when the application is loaded and ready to run 319 | componentDidMount = () => { 320 | 321 | // load the shopping lists 322 | this.getShoppingLists(); 323 | 324 | // load the local config - start sync if we have previously saved 325 | // a remote DB's URL 326 | this.props.localDB.get(localConfig).then((doc) => { 327 | console.log('local doc', doc) 328 | this.setState({url: doc.syncURL || ''}) 329 | this.startSync() 330 | }) 331 | } 332 | 333 | // JSX - markup for the about panel 334 | renderAbout = () => ( 335 |
336 |
337 |
About this app
338 |

339 | Shopping List is a series of Offline First demo apps, each built using a different stack. These demo apps cover Progressive Web Apps, hybrid mobile apps, native mobile apps, and desktop apps. 340 | This particular demo app is a Progressive Web App built using Preact and PouchDB. 341 |

342 | Get the source code. 343 |
344 |
345 | ) 346 | 347 | // JSX - markup for the settings panel 348 | renderSettings = () => ( 349 |
350 |
351 |
Setings
352 |

353 | You can sync your shopping lists to a remote Apache CouchDB, IBM Cloudant or PouchDB server. Supply the URL, including 354 | credentials and database name and hit "Start Sync". 355 |

356 |
357 | 358 |
359 | 360 |
361 |
362 | ) 363 | 364 | // JSX - markup for the new shopping list/item panel 365 | renderNewNameUI = () => ( 366 |
367 |
368 | 375 | {/* */} 376 |
377 |
378 | ) 379 | 380 | // render the shopping list component 381 | renderShoppingLists = () => { 382 | if (this.state.shoppingLists.length < 1) 383 | return (
{NOLISTMSG}
); 384 | return ( 385 | 394 | ); 395 | } 396 | 397 | // render the shopping list item component 398 | renderShoppingListItems = () => { 399 | if (this.state.shoppingListItems.size < 1) 400 | return (
{NOITEMSMSG}
); 401 | return ( 402 | 408 | ); 409 | } 410 | 411 | // JSX - back button 412 | renderBackButton = () => { 413 | if (this.state.view === 'items') 414 | return ( 415 | 416 | keyboard_backspace 417 | ); 418 | return ; 419 | } 420 | 421 | // JSX - main app markup 422 | render() { 423 | let screenname = 'Shopping Lists'; 424 | if (this.state.view === 'items') screenname = this.state.shoppingList.title; 425 | return ( 426 |
427 | 441 |
442 | {this.state.adding ? this.renderNewNameUI() : } 443 | {this.state.view === 'lists' ? this.renderShoppingLists() : this.renderShoppingListItems()} 444 |
445 |
446 | ); 447 | } 448 | } 449 | 450 | export default App; -------------------------------------------------------------------------------- /docs/polyfills.dfb61.js.map: -------------------------------------------------------------------------------- 1 | {"version":3,"sources":["webpack:///polyfills.dfb61.js","webpack:///webpack/bootstrap dfa50c2665940f3a5e1c?ced5","webpack:///../~/promise-polyfill/promise.js","webpack:///../~/unfetch/dist/unfetch.es.js","webpack:///../~/isomorphic-unfetch/browser.js","webpack:///../~/webpack/buildin/global.js?62a6","webpack:///../~/preact-cli/lib/lib/webpack/polyfills.js"],"names":["modules","__webpack_require__","moduleId","installedModules","exports","module","i","l","call","m","c","value","d","name","getter","o","Object","defineProperty","configurable","enumerable","get","n","__esModule","object","property","prototype","hasOwnProperty","p","s","1","BtxX","root","noop","bind","fn","thisArg","apply","arguments","Promise","this","TypeError","_state","_handled","_value","undefined","_deferreds","doResolve","handle","self","deferred","push","_immediateFn","cb","onFulfilled","onRejected","resolve","reject","promise","ret","e","newValue","then","finale","length","_unhandledRejectionFn","len","Handler","done","reason","ex","setTimeoutFunc","setTimeout","prom","constructor","all","arr","args","Array","slice","res","val","remaining","race","values","setImmediate","err","console","warn","_setImmediateFn","_setUnhandledRejectionFn","QAmr","__webpack_exports__","fetch","url","options","response","header","keys","headers","request","getAllResponseHeaders","replace","key","toLowerCase","ok","status","statusText","responseURL","clone","text","responseText","json","JSON","parse","blob","Blob","entries","has","XMLHttpRequest","open","method","setRequestHeader","withCredentials","credentials","onload","onerror","send","body","VS7n","window","default","h6ac","g","Function","eval","m+Gh","global"],"mappings":"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","file":"polyfills.dfb61.js","sourcesContent":["/******/ (function(modules) { // webpackBootstrap\n/******/ \t// The module cache\n/******/ \tvar installedModules = {};\n/******/\n/******/ \t// The require function\n/******/ \tfunction __webpack_require__(moduleId) {\n/******/\n/******/ \t\t// Check if module is in cache\n/******/ \t\tif(installedModules[moduleId]) {\n/******/ \t\t\treturn installedModules[moduleId].exports;\n/******/ \t\t}\n/******/ \t\t// Create a new module (and put it into the cache)\n/******/ \t\tvar module = installedModules[moduleId] = {\n/******/ \t\t\ti: moduleId,\n/******/ \t\t\tl: false,\n/******/ \t\t\texports: {}\n/******/ \t\t};\n/******/\n/******/ \t\t// Execute the module function\n/******/ \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n/******/\n/******/ \t\t// Flag the module as loaded\n/******/ \t\tmodule.l = true;\n/******/\n/******/ \t\t// Return the exports of the module\n/******/ \t\treturn module.exports;\n/******/ \t}\n/******/\n/******/\n/******/ \t// expose the modules object (__webpack_modules__)\n/******/ \t__webpack_require__.m = modules;\n/******/\n/******/ \t// expose the module cache\n/******/ \t__webpack_require__.c = installedModules;\n/******/\n/******/ \t// identity function for calling harmony imports with the correct context\n/******/ \t__webpack_require__.i = function(value) { return value; };\n/******/\n/******/ \t// define getter function for harmony exports\n/******/ \t__webpack_require__.d = function(exports, name, getter) {\n/******/ \t\tif(!__webpack_require__.o(exports, name)) {\n/******/ \t\t\tObject.defineProperty(exports, name, {\n/******/ \t\t\t\tconfigurable: false,\n/******/ \t\t\t\tenumerable: true,\n/******/ \t\t\t\tget: getter\n/******/ \t\t\t});\n/******/ \t\t}\n/******/ \t};\n/******/\n/******/ \t// getDefaultExport function for compatibility with non-harmony modules\n/******/ \t__webpack_require__.n = function(module) {\n/******/ \t\tvar getter = module && module.__esModule ?\n/******/ \t\t\tfunction getDefault() { return module['default']; } :\n/******/ \t\t\tfunction getModuleExports() { return module; };\n/******/ \t\t__webpack_require__.d(getter, 'a', getter);\n/******/ \t\treturn getter;\n/******/ \t};\n/******/\n/******/ \t// Object.prototype.hasOwnProperty.call\n/******/ \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n/******/\n/******/ \t// __webpack_public_path__\n/******/ \t__webpack_require__.p = \"./\";\n/******/\n/******/ \t// Load entry module and return exports\n/******/ \treturn __webpack_require__(__webpack_require__.s = 1);\n/******/ })\n/************************************************************************/\n/******/ ({\n\n/***/ 1:\n/***/ (function(module, exports, __webpack_require__) {\n\nmodule.exports = __webpack_require__(\"m+Gh\");\n\n\n/***/ }),\n\n/***/ \"BtxX\":\n/***/ (function(module, exports) {\n\n(function (root) {\n\n // Store setTimeout reference so promise-polyfill will be unaffected by\n // other code modifying setTimeout (like sinon.useFakeTimers())\n var setTimeoutFunc = setTimeout;\n\n function noop() {}\n\n // Polyfill for Function.prototype.bind\n function bind(fn, thisArg) {\n return function () {\n fn.apply(thisArg, arguments);\n };\n }\n\n function Promise(fn) {\n if (typeof this !== 'object') throw new TypeError('Promises must be constructed via new');\n if (typeof fn !== 'function') throw new TypeError('not a function');\n this._state = 0;\n this._handled = false;\n this._value = undefined;\n this._deferreds = [];\n\n doResolve(fn, this);\n }\n\n function handle(self, deferred) {\n while (self._state === 3) {\n self = self._value;\n }\n if (self._state === 0) {\n self._deferreds.push(deferred);\n return;\n }\n self._handled = true;\n Promise._immediateFn(function () {\n var cb = self._state === 1 ? deferred.onFulfilled : deferred.onRejected;\n if (cb === null) {\n (self._state === 1 ? resolve : reject)(deferred.promise, self._value);\n return;\n }\n var ret;\n try {\n ret = cb(self._value);\n } catch (e) {\n reject(deferred.promise, e);\n return;\n }\n resolve(deferred.promise, ret);\n });\n }\n\n function resolve(self, newValue) {\n try {\n // Promise Resolution Procedure: https://github.com/promises-aplus/promises-spec#the-promise-resolution-procedure\n if (newValue === self) throw new TypeError('A promise cannot be resolved with itself.');\n if (newValue && (typeof newValue === 'object' || typeof newValue === 'function')) {\n var then = newValue.then;\n if (newValue instanceof Promise) {\n self._state = 3;\n self._value = newValue;\n finale(self);\n return;\n } else if (typeof then === 'function') {\n doResolve(bind(then, newValue), self);\n return;\n }\n }\n self._state = 1;\n self._value = newValue;\n finale(self);\n } catch (e) {\n reject(self, e);\n }\n }\n\n function reject(self, newValue) {\n self._state = 2;\n self._value = newValue;\n finale(self);\n }\n\n function finale(self) {\n if (self._state === 2 && self._deferreds.length === 0) {\n Promise._immediateFn(function () {\n if (!self._handled) {\n Promise._unhandledRejectionFn(self._value);\n }\n });\n }\n\n for (var i = 0, len = self._deferreds.length; i < len; i++) {\n handle(self, self._deferreds[i]);\n }\n self._deferreds = null;\n }\n\n function Handler(onFulfilled, onRejected, promise) {\n this.onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : null;\n this.onRejected = typeof onRejected === 'function' ? onRejected : null;\n this.promise = promise;\n }\n\n /**\n * Take a potentially misbehaving resolver function and make sure\n * onFulfilled and onRejected are only called once.\n *\n * Makes no guarantees about asynchrony.\n */\n function doResolve(fn, self) {\n var done = false;\n try {\n fn(function (value) {\n if (done) return;\n done = true;\n resolve(self, value);\n }, function (reason) {\n if (done) return;\n done = true;\n reject(self, reason);\n });\n } catch (ex) {\n if (done) return;\n done = true;\n reject(self, ex);\n }\n }\n\n Promise.prototype['catch'] = function (onRejected) {\n return this.then(null, onRejected);\n };\n\n Promise.prototype.then = function (onFulfilled, onRejected) {\n var prom = new this.constructor(noop);\n\n handle(this, new Handler(onFulfilled, onRejected, prom));\n return prom;\n };\n\n Promise.all = function (arr) {\n var args = Array.prototype.slice.call(arr);\n\n return new Promise(function (resolve, reject) {\n if (args.length === 0) return resolve([]);\n var remaining = args.length;\n\n function res(i, val) {\n try {\n if (val && (typeof val === 'object' || typeof val === 'function')) {\n var then = val.then;\n if (typeof then === 'function') {\n then.call(val, function (val) {\n res(i, val);\n }, reject);\n return;\n }\n }\n args[i] = val;\n if (--remaining === 0) {\n resolve(args);\n }\n } catch (ex) {\n reject(ex);\n }\n }\n\n for (var i = 0; i < args.length; i++) {\n res(i, args[i]);\n }\n });\n };\n\n Promise.resolve = function (value) {\n if (value && typeof value === 'object' && value.constructor === Promise) {\n return value;\n }\n\n return new Promise(function (resolve) {\n resolve(value);\n });\n };\n\n Promise.reject = function (value) {\n return new Promise(function (resolve, reject) {\n reject(value);\n });\n };\n\n Promise.race = function (values) {\n return new Promise(function (resolve, reject) {\n for (var i = 0, len = values.length; i < len; i++) {\n values[i].then(resolve, reject);\n }\n });\n };\n\n // Use polyfill for setImmediate for performance gains\n Promise._immediateFn = typeof setImmediate === 'function' && function (fn) {\n setImmediate(fn);\n } || function (fn) {\n setTimeoutFunc(fn, 0);\n };\n\n Promise._unhandledRejectionFn = function _unhandledRejectionFn(err) {\n if (typeof console !== 'undefined' && console) {\n console.warn('Possible Unhandled Promise Rejection:', err); // eslint-disable-line no-console\n }\n };\n\n /**\n * Set the immediate function to execute callbacks\n * @param fn {function} Function to execute\n * @deprecated\n */\n Promise._setImmediateFn = function _setImmediateFn(fn) {\n Promise._immediateFn = fn;\n };\n\n /**\n * Change the function to execute on unhandled rejection\n * @param {function} fn Function to execute on unhandled rejection\n * @deprecated\n */\n Promise._setUnhandledRejectionFn = function _setUnhandledRejectionFn(fn) {\n Promise._unhandledRejectionFn = fn;\n };\n\n if (typeof module !== 'undefined' && module.exports) {\n module.exports = Promise;\n } else if (!root.Promise) {\n root.Promise = Promise;\n }\n})(this);\n\n/***/ }),\n\n/***/ \"QAmr\":\n/***/ (function(module, __webpack_exports__, __webpack_require__) {\n\n\"use strict\";\nObject.defineProperty(__webpack_exports__, \"__esModule\", { value: true });\nvar index = typeof fetch == 'function' ? fetch.bind() : function (url, options) {\n\toptions = options || {};\n\treturn new Promise(function (resolve, reject) {\n\t\tvar request = new XMLHttpRequest();\n\n\t\trequest.open(options.method || 'get', url);\n\n\t\tfor (var i in options.headers) {\n\t\t\trequest.setRequestHeader(i, options.headers[i]);\n\t\t}\n\n\t\trequest.withCredentials = options.credentials == 'include';\n\n\t\trequest.onload = function () {\n\t\t\tresolve(response());\n\t\t};\n\n\t\trequest.onerror = reject;\n\n\t\trequest.send(options.body);\n\n\t\tfunction response() {\n\t\t\tvar _keys = [],\n\t\t\t all = [],\n\t\t\t headers = {},\n\t\t\t header;\n\n\t\t\trequest.getAllResponseHeaders().replace(/^(.*?):\\s*([\\s\\S]*?)$/gm, function (m, key, value) {\n\t\t\t\t_keys.push(key = key.toLowerCase());\n\t\t\t\tall.push([key, value]);\n\t\t\t\theader = headers[key];\n\t\t\t\theaders[key] = header ? header + \",\" + value : value;\n\t\t\t});\n\n\t\t\treturn {\n\t\t\t\tok: (request.status / 200 | 0) == 1, // 200-299\n\t\t\t\tstatus: request.status,\n\t\t\t\tstatusText: request.statusText,\n\t\t\t\turl: request.responseURL,\n\t\t\t\tclone: response,\n\t\t\t\ttext: function text() {\n\t\t\t\t\treturn Promise.resolve(request.responseText);\n\t\t\t\t},\n\t\t\t\tjson: function json() {\n\t\t\t\t\treturn Promise.resolve(request.responseText).then(JSON.parse);\n\t\t\t\t},\n\t\t\t\tblob: function blob() {\n\t\t\t\t\treturn Promise.resolve(new Blob([request.response]));\n\t\t\t\t},\n\t\t\t\theaders: {\n\t\t\t\t\tkeys: function keys() {\n\t\t\t\t\t\treturn _keys;\n\t\t\t\t\t},\n\t\t\t\t\tentries: function entries() {\n\t\t\t\t\t\treturn all;\n\t\t\t\t\t},\n\t\t\t\t\tget: function get(n) {\n\t\t\t\t\t\treturn headers[n.toLowerCase()];\n\t\t\t\t\t},\n\t\t\t\t\thas: function has(n) {\n\t\t\t\t\t\treturn n.toLowerCase() in headers;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t});\n};\n\n/* harmony default export */ __webpack_exports__[\"default\"] = (index);\n//# sourceMappingURL=unfetch.es.js.map\n\n/***/ }),\n\n/***/ \"VS7n\":\n/***/ (function(module, exports, __webpack_require__) {\n\nmodule.exports = window.fetch || (window.fetch = __webpack_require__(\"QAmr\").default || __webpack_require__(\"QAmr\"));\n\n/***/ }),\n\n/***/ \"h6ac\":\n/***/ (function(module, exports) {\n\nvar g;\n\n// This works in non-strict mode\ng = function () {\n\treturn this;\n}();\n\ntry {\n\t// This works if eval is allowed (see CSP)\n\tg = g || Function(\"return this\")() || (1, eval)(\"this\");\n} catch (e) {\n\t// This works if the window reference is available\n\tif (typeof window === \"object\") g = window;\n}\n\n// g can still be undefined, but nothing to do about it...\n// We return undefined, instead of nothing here, so it's\n// easier to handle this case. if(!global) { ...}\n\nmodule.exports = g;\n\n/***/ }),\n\n/***/ \"m+Gh\":\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n/* WEBPACK VAR INJECTION */(function(global) {\n\nif (!global.Promise) global.Promise = __webpack_require__(\"BtxX\");\nif (!global.fetch) global.fetch = __webpack_require__(\"VS7n\");\n/* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(\"h6ac\")))\n\n/***/ })\n\n/******/ });\n\n\n// WEBPACK FOOTER //\n// polyfills.dfb61.js"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// identity function for calling harmony imports with the correct context\n \t__webpack_require__.i = function(value) { return value; };\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"./\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 1);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap dfa50c2665940f3a5e1c","(function (root) {\n\n // Store setTimeout reference so promise-polyfill will be unaffected by\n // other code modifying setTimeout (like sinon.useFakeTimers())\n var setTimeoutFunc = setTimeout;\n\n function noop() {}\n \n // Polyfill for Function.prototype.bind\n function bind(fn, thisArg) {\n return function () {\n fn.apply(thisArg, arguments);\n };\n }\n\n function Promise(fn) {\n if (typeof this !== 'object') throw new TypeError('Promises must be constructed via new');\n if (typeof fn !== 'function') throw new TypeError('not a function');\n this._state = 0;\n this._handled = false;\n this._value = undefined;\n this._deferreds = [];\n\n doResolve(fn, this);\n }\n\n function handle(self, deferred) {\n while (self._state === 3) {\n self = self._value;\n }\n if (self._state === 0) {\n self._deferreds.push(deferred);\n return;\n }\n self._handled = true;\n Promise._immediateFn(function () {\n var cb = self._state === 1 ? deferred.onFulfilled : deferred.onRejected;\n if (cb === null) {\n (self._state === 1 ? resolve : reject)(deferred.promise, self._value);\n return;\n }\n var ret;\n try {\n ret = cb(self._value);\n } catch (e) {\n reject(deferred.promise, e);\n return;\n }\n resolve(deferred.promise, ret);\n });\n }\n\n function resolve(self, newValue) {\n try {\n // Promise Resolution Procedure: https://github.com/promises-aplus/promises-spec#the-promise-resolution-procedure\n if (newValue === self) throw new TypeError('A promise cannot be resolved with itself.');\n if (newValue && (typeof newValue === 'object' || typeof newValue === 'function')) {\n var then = newValue.then;\n if (newValue instanceof Promise) {\n self._state = 3;\n self._value = newValue;\n finale(self);\n return;\n } else if (typeof then === 'function') {\n doResolve(bind(then, newValue), self);\n return;\n }\n }\n self._state = 1;\n self._value = newValue;\n finale(self);\n } catch (e) {\n reject(self, e);\n }\n }\n\n function reject(self, newValue) {\n self._state = 2;\n self._value = newValue;\n finale(self);\n }\n\n function finale(self) {\n if (self._state === 2 && self._deferreds.length === 0) {\n Promise._immediateFn(function() {\n if (!self._handled) {\n Promise._unhandledRejectionFn(self._value);\n }\n });\n }\n\n for (var i = 0, len = self._deferreds.length; i < len; i++) {\n handle(self, self._deferreds[i]);\n }\n self._deferreds = null;\n }\n\n function Handler(onFulfilled, onRejected, promise) {\n this.onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : null;\n this.onRejected = typeof onRejected === 'function' ? onRejected : null;\n this.promise = promise;\n }\n\n /**\n * Take a potentially misbehaving resolver function and make sure\n * onFulfilled and onRejected are only called once.\n *\n * Makes no guarantees about asynchrony.\n */\n function doResolve(fn, self) {\n var done = false;\n try {\n fn(function (value) {\n if (done) return;\n done = true;\n resolve(self, value);\n }, function (reason) {\n if (done) return;\n done = true;\n reject(self, reason);\n });\n } catch (ex) {\n if (done) return;\n done = true;\n reject(self, ex);\n }\n }\n\n Promise.prototype['catch'] = function (onRejected) {\n return this.then(null, onRejected);\n };\n\n Promise.prototype.then = function (onFulfilled, onRejected) {\n var prom = new (this.constructor)(noop);\n\n handle(this, new Handler(onFulfilled, onRejected, prom));\n return prom;\n };\n\n Promise.all = function (arr) {\n var args = Array.prototype.slice.call(arr);\n\n return new Promise(function (resolve, reject) {\n if (args.length === 0) return resolve([]);\n var remaining = args.length;\n\n function res(i, val) {\n try {\n if (val && (typeof val === 'object' || typeof val === 'function')) {\n var then = val.then;\n if (typeof then === 'function') {\n then.call(val, function (val) {\n res(i, val);\n }, reject);\n return;\n }\n }\n args[i] = val;\n if (--remaining === 0) {\n resolve(args);\n }\n } catch (ex) {\n reject(ex);\n }\n }\n\n for (var i = 0; i < args.length; i++) {\n res(i, args[i]);\n }\n });\n };\n\n Promise.resolve = function (value) {\n if (value && typeof value === 'object' && value.constructor === Promise) {\n return value;\n }\n\n return new Promise(function (resolve) {\n resolve(value);\n });\n };\n\n Promise.reject = function (value) {\n return new Promise(function (resolve, reject) {\n reject(value);\n });\n };\n\n Promise.race = function (values) {\n return new Promise(function (resolve, reject) {\n for (var i = 0, len = values.length; i < len; i++) {\n values[i].then(resolve, reject);\n }\n });\n };\n\n // Use polyfill for setImmediate for performance gains\n Promise._immediateFn = (typeof setImmediate === 'function' && function (fn) { setImmediate(fn); }) ||\n function (fn) {\n setTimeoutFunc(fn, 0);\n };\n\n Promise._unhandledRejectionFn = function _unhandledRejectionFn(err) {\n if (typeof console !== 'undefined' && console) {\n console.warn('Possible Unhandled Promise Rejection:', err); // eslint-disable-line no-console\n }\n };\n\n /**\n * Set the immediate function to execute callbacks\n * @param fn {function} Function to execute\n * @deprecated\n */\n Promise._setImmediateFn = function _setImmediateFn(fn) {\n Promise._immediateFn = fn;\n };\n\n /**\n * Change the function to execute on unhandled rejection\n * @param {function} fn Function to execute on unhandled rejection\n * @deprecated\n */\n Promise._setUnhandledRejectionFn = function _setUnhandledRejectionFn(fn) {\n Promise._unhandledRejectionFn = fn;\n };\n \n if (typeof module !== 'undefined' && module.exports) {\n module.exports = Promise;\n } else if (!root.Promise) {\n root.Promise = Promise;\n }\n\n})(this);\n\n\n\n// WEBPACK FOOTER //\n// ../~/promise-polyfill/promise.js","var index = typeof fetch=='function' ? fetch.bind() : function(url, options) {\n\toptions = options || {};\n\treturn new Promise( function (resolve, reject) {\n\t\tvar request = new XMLHttpRequest();\n\n\t\trequest.open(options.method || 'get', url);\n\n\t\tfor (var i in options.headers) {\n\t\t\trequest.setRequestHeader(i, options.headers[i]);\n\t\t}\n\n\t\trequest.withCredentials = options.credentials=='include';\n\n\t\trequest.onload = function () {\n\t\t\tresolve(response());\n\t\t};\n\n\t\trequest.onerror = reject;\n\n\t\trequest.send(options.body);\n\n\t\tfunction response() {\n\t\t\tvar keys = [],\n\t\t\t\tall = [],\n\t\t\t\theaders = {},\n\t\t\t\theader;\n\n\t\t\trequest.getAllResponseHeaders().replace(/^(.*?):\\s*([\\s\\S]*?)$/gm, function (m, key, value) {\n\t\t\t\tkeys.push(key = key.toLowerCase());\n\t\t\t\tall.push([key, value]);\n\t\t\t\theader = headers[key];\n\t\t\t\theaders[key] = header ? (header + \",\" + value) : value;\n\t\t\t});\n\n\t\t\treturn {\n\t\t\t\tok: (request.status/200|0) == 1,\t\t// 200-299\n\t\t\t\tstatus: request.status,\n\t\t\t\tstatusText: request.statusText,\n\t\t\t\turl: request.responseURL,\n\t\t\t\tclone: response,\n\t\t\t\ttext: function () { return Promise.resolve(request.responseText); },\n\t\t\t\tjson: function () { return Promise.resolve(request.responseText).then(JSON.parse); },\n\t\t\t\tblob: function () { return Promise.resolve(new Blob([request.response])); },\n\t\t\t\theaders: {\n\t\t\t\t\tkeys: function () { return keys; },\n\t\t\t\t\tentries: function () { return all; },\n\t\t\t\t\tget: function (n) { return headers[n.toLowerCase()]; },\n\t\t\t\t\thas: function (n) { return n.toLowerCase() in headers; }\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t});\n};\n\nexport default index;\n//# sourceMappingURL=unfetch.es.js.map\n\n\n\n// WEBPACK FOOTER //\n// ../~/unfetch/dist/unfetch.es.js","module.exports = window.fetch || (window.fetch = require('unfetch').default || require('unfetch'));\n\n\n\n// WEBPACK FOOTER //\n// ../~/isomorphic-unfetch/browser.js","var g;\r\n\r\n// This works in non-strict mode\r\ng = (function() {\r\n\treturn this;\r\n})();\r\n\r\ntry {\r\n\t// This works if eval is allowed (see CSP)\r\n\tg = g || Function(\"return this\")() || (1,eval)(\"this\");\r\n} catch(e) {\r\n\t// This works if the window reference is available\r\n\tif(typeof window === \"object\")\r\n\t\tg = window;\r\n}\r\n\r\n// g can still be undefined, but nothing to do about it...\r\n// We return undefined, instead of nothing here, so it's\r\n// easier to handle this case. if(!global) { ...}\r\n\r\nmodule.exports = g;\r\n\n\n\n// WEBPACK FOOTER //\n// ../~/webpack/buildin/global.js","'use strict';\n\nif (!global.Promise) global.Promise = require('promise-polyfill');\nif (!global.fetch) global.fetch = require('isomorphic-unfetch');\n\n\n// WEBPACK FOOTER //\n// ../~/preact-cli/lib/lib/webpack/polyfills.js"],"sourceRoot":""} --------------------------------------------------------------------------------