├── .babelrc
├── .editorconfig
├── .eslintignore
├── .eslintrc
├── .gitignore
├── .travis.yml
├── LICENSE
├── README.md
├── config
    └── jest
    │   └── polyfills.js
├── examples
    ├── todos-react-blips
    │   ├── .gitignore
    │   ├── README.md
    │   ├── config
    │   │   ├── env.js
    │   │   ├── jest
    │   │   │   ├── cssTransform.js
    │   │   │   └── fileTransform.js
    │   │   ├── paths.js
    │   │   ├── polyfills.js
    │   │   ├── webpack.config.dev.js
    │   │   ├── webpack.config.prod.js
    │   │   └── webpackDevServer.config.js
    │   ├── package-lock.json
    │   ├── package.json
    │   ├── public
    │   │   ├── favicon.ico
    │   │   ├── index.html
    │   │   └── manifest.json
    │   ├── scripts
    │   │   ├── build.js
    │   │   ├── start.js
    │   │   └── test.js
    │   └── src
    │   │   ├── components
    │   │       ├── FakeTodosButton
    │   │       │   └── FakeTodosButton.js
    │   │       ├── Todo
    │   │       │   └── Todo.js
    │   │       ├── TodoList
    │   │       │   └── TodoList.js
    │   │       └── index.js
    │   │   ├── containers
    │   │       ├── App
    │   │       │   ├── App.js
    │   │       │   └── operations.js
    │   │       └── index.js
    │   │   ├── index.css
    │   │   ├── index.js
    │   │   ├── registerServiceWorker.js
    │   │   └── schema
    │   │       ├── resolvers.js
    │   │       └── types.js
    └── todos-vanillajs
    │   ├── .babelrc
    │   ├── .eslintrc
    │   ├── .gitignore
    │   ├── LICENSE
    │   ├── README.md
    │   ├── package-lock.json
    │   ├── package.json
    │   ├── polyfills.js
    │   ├── src
    │       ├── favicon.ico
    │       ├── index.css
    │       ├── index.html
    │       ├── index.js
    │       ├── operations.js
    │       ├── renderer.js
    │       └── schema
    │       │   ├── resolvers.js
    │       │   └── types.js
    │   ├── webpack.common.js
    │   ├── webpack.dev.js
    │   └── webpack.prod.js
├── logo
    ├── blips-logo-dark-text.png
    ├── blips-logo-dark-text.svg
    ├── blips-logo-light-text.png
    ├── blips-logo-light-text.svg
    ├── blips-logo.png
    ├── blips-logo.svg
    └── favicon.ico
├── package-lock.json
├── package.json
├── rollup.config.js
└── src
    ├── BlipsClient.js
    ├── __mocks__
        ├── initialState.js
        ├── operations.js
        ├── resolvers.js
        └── typeDefs.js
    ├── __tests__
        └── BlipsClient.js
    ├── index.js
    └── utils
        ├── __tests__
            ├── extendContext.js
            ├── getDocument.js
            ├── getOperationASTs.js
            ├── getOperationName.js
            ├── isEmpty.js
            ├── isFragmentDefinition.js
            ├── isNil.js
            ├── isType.js
            ├── mergeDataList.js
            ├── mergeErrorList.js
            ├── mergeResponseList.js
            ├── promiseBatch.js
            ├── rules.js
            ├── toObservable.js
            ├── typeOf.js
            ├── validateWithoutSchema.js
            └── when.js
        ├── extendContext.js
        ├── getDocument.js
        ├── getOperationASTs.js
        ├── getOperationName.js
        ├── index.js
        ├── isEmpty.js
        ├── isFragmentDefinition.js
        ├── isNil.js
        ├── isOperationDefinition.js
        ├── isType.js
        ├── mergeDataList.js
        ├── mergeErrorList.js
        ├── mergeResponseList.js
        ├── promiseBatch.js
        ├── rules.js
        ├── toObservable.js
        ├── typeOf.js
        ├── validateWithoutSchema.js
        └── when.js


/.babelrc:
--------------------------------------------------------------------------------
 1 | {
 2 |   "plugins": [
 3 |     ["transform-class-properties", { "loose": true }],
 4 |     "transform-object-rest-spread"
 5 |   ],
 6 |   "presets": [["es2015", { "loose": true, "modules": false }], "stage-0"],
 7 |   "env": {
 8 |     "es": {
 9 |       "ignore": ["**/__tests__/**", "**/__mocks__/**"]
10 |     },
11 |     "cjs": {
12 |       "plugins": [["transform-es2015-modules-commonjs", { "loose": true }]],
13 |       "ignore": ["**/__tests__/**", "**/__mocks__/**"]
14 |     },
15 |     "rollup": {
16 |       "plugins": ["external-helpers"],
17 |       "ignore": ["**/__tests__/**", "**/__mocks__/**"]
18 |     },
19 |     "test": {
20 |       "plugins": [["transform-es2015-modules-commonjs", { "loose": true }]]
21 |     }
22 |   }
23 | }
24 | 


--------------------------------------------------------------------------------
/.editorconfig:
--------------------------------------------------------------------------------
1 | root = true
2 | 
3 | [*]
4 | indent_style = space
5 | indent_size = 2
6 | 


--------------------------------------------------------------------------------
/.eslintignore:
--------------------------------------------------------------------------------
1 | lib
2 | es
3 | dist
4 | 


--------------------------------------------------------------------------------
/.eslintrc:
--------------------------------------------------------------------------------
 1 | {
 2 |   "parser": "babel-eslint",
 3 |   "extends": ["standard"],
 4 |   "rules": {
 5 |     "comma-dangle": ["warn", "always"],
 6 |     "array-bracket-spacing": ["warn", "always"],
 7 |     "object-curly-spacing": ["warn", "always"],
 8 |     "no-sequences": ["off"],
 9 |     "no-console": ["warn"],
10 |     "standard/object-curly-even-spacing": ["off"]
11 |   },
12 |   "parserOptions": {
13 |     "ecmaVersion": 6,
14 |     "sourceType": "module",
15 |     "ecmaFeatures": {
16 |       "classes": true,
17 |       "experimentalObjectRestSpread": true
18 |     },
19 |   },
20 |   "env": {
21 |     "jest": true
22 |   }
23 | }
24 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
 1 | .DS_Store
 2 | 
 3 | # Logs
 4 | logs
 5 | *.log
 6 | npm-debug.log*
 7 | yarn-debug.log*
 8 | yarn-error.log*
 9 | 
10 | # Runtime data
11 | pids
12 | *.pid
13 | *.seed
14 | *.pid.lock
15 | 
16 | # Directory for instrumented libs generated by jscoverage/JSCover
17 | lib-cov
18 | 
19 | # Coverage directory used by tools like istanbul
20 | coverage
21 | 
22 | # nyc test coverage
23 | .nyc_output
24 | 
25 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
26 | .grunt
27 | 
28 | # Bower dependency directory (https://bower.io/)
29 | bower_components
30 | 
31 | # node-waf configuration
32 | .lock-wscript
33 | 
34 | # Dist
35 | dist
36 | es
37 | lib
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 | 


--------------------------------------------------------------------------------
/.travis.yml:
--------------------------------------------------------------------------------
 1 | language: node_js
 2 | node_js:
 3 |   - "8.9.0"
 4 | 
 5 | deploy:
 6 |   provider: npm
 7 |   email: achimvionut@gmail.com
 8 |   api_key: $NPM_TOKEN
 9 |   skip_cleanup: true
10 |   on:
11 |     tags: true
12 | 


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2017 Ionut Achim
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/config/jest/polyfills.js:
--------------------------------------------------------------------------------
1 | // babel-polyfill
2 | require('babel-polyfill')
3 | 
4 | // fetch() polyfill for making API calls.
5 | require('whatwg-fetch')
6 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/.gitignore:
--------------------------------------------------------------------------------
 1 | # See https://help.github.com/ignore-files/ for more about ignoring files.
 2 | 
 3 | # dependencies
 4 | /node_modules
 5 | 
 6 | # testing
 7 | /coverage
 8 | 
 9 | # production
10 | /build
11 | 
12 | # misc
13 | .DS_Store
14 | .env.local
15 | .env.development.local
16 | .env.test.local
17 | .env.production.local
18 | 
19 | npm-debug.log*
20 | yarn-debug.log*
21 | yarn-error.log*
22 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/README.md:
--------------------------------------------------------------------------------
 1 | # Todos app with **React** and **react-blips**
 2 | 
 3 | This project was bootstrapped with [Create React App](https://github.com/facebookincubator/create-react-app).
 4 | 
 5 | ## Available Scripts
 6 | 
 7 | In the project directory, you can run:
 8 | 
 9 | ### `npm start`
10 | 
11 | Runs the app in the development mode.<br>
12 | Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
13 | 
14 | The page will reload if you make edits.<br>
15 | You will also see any lint errors in the console.
16 | 
17 | ### `npm run build`
18 | 
19 | Builds the app for production to the `dist` folder.<br>
20 | 
21 | The build is minified and the filenames include the hashes.<br>
22 | Your app is ready to be deployed!
23 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/config/env.js:
--------------------------------------------------------------------------------
 1 | 'use strict';
 2 | 
 3 | const fs = require('fs');
 4 | const path = require('path');
 5 | const paths = require('./paths');
 6 | 
 7 | // Make sure that including paths.js after env.js will read .env variables.
 8 | delete require.cache[require.resolve('./paths')];
 9 | 
10 | const NODE_ENV = process.env.NODE_ENV;
11 | if (!NODE_ENV) {
12 |   throw new Error(
13 |     'The NODE_ENV environment variable is required but was not specified.'
14 |   );
15 | }
16 | 
17 | // https://github.com/bkeepers/dotenv#what-other-env-files-can-i-use
18 | var dotenvFiles = [
19 |   `${paths.dotenv}.${NODE_ENV}.local`,
20 |   `${paths.dotenv}.${NODE_ENV}`,
21 |   // Don't include `.env.local` for `test` environment
22 |   // since normally you expect tests to produce the same
23 |   // results for everyone
24 |   NODE_ENV !== 'test' && `${paths.dotenv}.local`,
25 |   paths.dotenv,
26 | ].filter(Boolean);
27 | 
28 | // Load environment variables from .env* files. Suppress warnings using silent
29 | // if this file is missing. dotenv will never modify any environment variables
30 | // that have already been set.
31 | // https://github.com/motdotla/dotenv
32 | dotenvFiles.forEach(dotenvFile => {
33 |   if (fs.existsSync(dotenvFile)) {
34 |     require('dotenv').config({
35 |       path: dotenvFile,
36 |     });
37 |   }
38 | });
39 | 
40 | // We support resolving modules according to `NODE_PATH`.
41 | // This lets you use absolute paths in imports inside large monorepos:
42 | // https://github.com/facebookincubator/create-react-app/issues/253.
43 | // It works similar to `NODE_PATH` in Node itself:
44 | // https://nodejs.org/api/modules.html#modules_loading_from_the_global_folders
45 | // Note that unlike in Node, only *relative* paths from `NODE_PATH` are honored.
46 | // Otherwise, we risk importing Node.js core modules into an app instead of Webpack shims.
47 | // https://github.com/facebookincubator/create-react-app/issues/1023#issuecomment-265344421
48 | // We also resolve them to make sure all tools using them work consistently.
49 | const appDirectory = fs.realpathSync(process.cwd());
50 | process.env.NODE_PATH = (process.env.NODE_PATH || '')
51 |   .split(path.delimiter)
52 |   .filter(folder => folder && !path.isAbsolute(folder))
53 |   .map(folder => path.resolve(appDirectory, folder))
54 |   .join(path.delimiter);
55 | 
56 | // Grab NODE_ENV and REACT_APP_* environment variables and prepare them to be
57 | // injected into the application via DefinePlugin in Webpack configuration.
58 | const REACT_APP = /^REACT_APP_/i;
59 | 
60 | function getClientEnvironment(publicUrl) {
61 |   const raw = Object.keys(process.env)
62 |     .filter(key => REACT_APP.test(key))
63 |     .reduce(
64 |       (env, key) => {
65 |         env[key] = process.env[key];
66 |         return env;
67 |       },
68 |       {
69 |         // Useful for determining whether we’re running in production mode.
70 |         // Most importantly, it switches React into the correct mode.
71 |         NODE_ENV: process.env.NODE_ENV || 'development',
72 |         // Useful for resolving the correct path to static assets in `public`.
73 |         // For example, <img src={process.env.PUBLIC_URL + '/img/logo.png'} />.
74 |         // This should only be used as an escape hatch. Normally you would put
75 |         // images into the `src` and `import` them in code to get their paths.
76 |         PUBLIC_URL: publicUrl,
77 |       }
78 |     );
79 |   // Stringify all values so we can feed into Webpack DefinePlugin
80 |   const stringified = {
81 |     'process.env': Object.keys(raw).reduce((env, key) => {
82 |       env[key] = JSON.stringify(raw[key]);
83 |       return env;
84 |     }, {}),
85 |   };
86 | 
87 |   return { raw, stringified };
88 | }
89 | 
90 | module.exports = getClientEnvironment;
91 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/config/jest/cssTransform.js:
--------------------------------------------------------------------------------
 1 | 'use strict';
 2 | 
 3 | // This is a custom Jest transformer turning style imports into empty objects.
 4 | // http://facebook.github.io/jest/docs/tutorial-webpack.html
 5 | 
 6 | module.exports = {
 7 |   process() {
 8 |     return 'module.exports = {};';
 9 |   },
10 |   getCacheKey() {
11 |     // The output is always the same.
12 |     return 'cssTransform';
13 |   },
14 | };
15 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/config/jest/fileTransform.js:
--------------------------------------------------------------------------------
 1 | 'use strict';
 2 | 
 3 | const path = require('path');
 4 | 
 5 | // This is a custom Jest transformer turning file imports into filenames.
 6 | // http://facebook.github.io/jest/docs/tutorial-webpack.html
 7 | 
 8 | module.exports = {
 9 |   process(src, filename) {
10 |     return `module.exports = ${JSON.stringify(path.basename(filename))};`;
11 |   },
12 | };
13 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/config/paths.js:
--------------------------------------------------------------------------------
 1 | 'use strict';
 2 | 
 3 | const path = require('path');
 4 | const fs = require('fs');
 5 | const url = require('url');
 6 | 
 7 | // Make sure any symlinks in the project folder are resolved:
 8 | // https://github.com/facebookincubator/create-react-app/issues/637
 9 | const appDirectory = fs.realpathSync(process.cwd());
10 | const resolveApp = relativePath => path.resolve(appDirectory, relativePath);
11 | 
12 | const envPublicUrl = process.env.PUBLIC_URL;
13 | 
14 | function ensureSlash(path, needsSlash) {
15 |   const hasSlash = path.endsWith('/');
16 |   if (hasSlash && !needsSlash) {
17 |     return path.substr(path, path.length - 1);
18 |   } else if (!hasSlash && needsSlash) {
19 |     return `${path}/`;
20 |   } else {
21 |     return path;
22 |   }
23 | }
24 | 
25 | const getPublicUrl = appPackageJson =>
26 |   envPublicUrl || require(appPackageJson).homepage;
27 | 
28 | // We use `PUBLIC_URL` environment variable or "homepage" field to infer
29 | // "public path" at which the app is served.
30 | // Webpack needs to know it to put the right <script> hrefs into HTML even in
31 | // single-page apps that may serve index.html for nested URLs like /todos/42.
32 | // We can't use a relative path in HTML because we don't want to load something
33 | // like /todos/42/static/js/bundle.7289d.js. We have to know the root.
34 | function getServedPath(appPackageJson) {
35 |   const publicUrl = getPublicUrl(appPackageJson);
36 |   const servedUrl =
37 |     envPublicUrl || (publicUrl ? url.parse(publicUrl).pathname : '/');
38 |   return ensureSlash(servedUrl, true);
39 | }
40 | 
41 | // config after eject: we're in ./config/
42 | module.exports = {
43 |   dotenv: resolveApp('.env'),
44 |   appBuild: resolveApp('build'),
45 |   appPublic: resolveApp('public'),
46 |   appHtml: resolveApp('public/index.html'),
47 |   appIndexJs: resolveApp('src/index.js'),
48 |   appPackageJson: resolveApp('package.json'),
49 |   appSrc: resolveApp('src'),
50 |   yarnLockFile: resolveApp('yarn.lock'),
51 |   testsSetup: resolveApp('src/setupTests.js'),
52 |   appNodeModules: resolveApp('node_modules'),
53 |   publicUrl: getPublicUrl(resolveApp('package.json')),
54 |   servedPath: getServedPath(resolveApp('package.json')),
55 | };
56 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/config/polyfills.js:
--------------------------------------------------------------------------------
 1 | 
 2 | 
 3 | if (typeof Promise === 'undefined') {
 4 |   // Rejection tracking prevents a common issue where React gets into an
 5 |   // inconsistent state due to an error, but it gets swallowed by a Promise,
 6 |   // and the user has no idea what causes React's erratic future behavior.
 7 |   require('promise/lib/rejection-tracking').enable()
 8 |   window.Promise = require('promise/lib/es6-extensions.js')
 9 | }
10 | 
11 | // fetch() polyfill for making API calls.
12 | require('whatwg-fetch')
13 | 
14 | // Object.assign() is commonly used with React.
15 | // It will use the native implementation if it's present and isn't buggy.
16 | Object.assign = require('object-assign')
17 | 
18 | // In tests, polyfill requestAnimationFrame since jsdom doesn't provide it yet.
19 | // We don't polyfill it in the browser--this is user's responsibility.
20 | if (process.env.NODE_ENV === 'test') {
21 |   require('raf').polyfill(global)
22 | }
23 | 
24 | require('babel-polyfill')
25 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/config/webpack.config.dev.js:
--------------------------------------------------------------------------------
  1 | 'use strict';
  2 | 
  3 | const autoprefixer = require('autoprefixer');
  4 | const path = require('path');
  5 | const webpack = require('webpack');
  6 | const HtmlWebpackPlugin = require('html-webpack-plugin');
  7 | const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
  8 | const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
  9 | const WatchMissingNodeModulesPlugin = require('react-dev-utils/WatchMissingNodeModulesPlugin');
 10 | const eslintFormatter = require('react-dev-utils/eslintFormatter');
 11 | const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
 12 | const getClientEnvironment = require('./env');
 13 | const paths = require('./paths');
 14 | 
 15 | // Webpack uses `publicPath` to determine where the app is being served from.
 16 | // In development, we always serve from the root. This makes config easier.
 17 | const publicPath = '/';
 18 | // `publicUrl` is just like `publicPath`, but we will provide it to our app
 19 | // as %PUBLIC_URL% in `index.html` and `process.env.PUBLIC_URL` in JavaScript.
 20 | // Omit trailing slash as %PUBLIC_PATH%/xyz looks better than %PUBLIC_PATH%xyz.
 21 | const publicUrl = '';
 22 | // Get environment variables to inject into our app.
 23 | const env = getClientEnvironment(publicUrl);
 24 | 
 25 | // This is the development configuration.
 26 | // It is focused on developer experience and fast rebuilds.
 27 | // The production configuration is different and lives in a separate file.
 28 | module.exports = {
 29 |   // You may want 'eval' instead if you prefer to see the compiled output in DevTools.
 30 |   // See the discussion in https://github.com/facebookincubator/create-react-app/issues/343.
 31 |   devtool: 'cheap-module-source-map',
 32 |   // These are the "entry points" to our application.
 33 |   // This means they will be the "root" imports that are included in JS bundle.
 34 |   // The first two entry points enable "hot" CSS and auto-refreshes for JS.
 35 |   entry: [
 36 |     // We ship a few polyfills by default:
 37 |     require.resolve('./polyfills'),
 38 |     // Include an alternative client for WebpackDevServer. A client's job is to
 39 |     // connect to WebpackDevServer by a socket and get notified about changes.
 40 |     // When you save a file, the client will either apply hot updates (in case
 41 |     // of CSS changes), or refresh the page (in case of JS changes). When you
 42 |     // make a syntax error, this client will display a syntax error overlay.
 43 |     // Note: instead of the default WebpackDevServer client, we use a custom one
 44 |     // to bring better experience for Create React App users. You can replace
 45 |     // the line below with these two lines if you prefer the stock client:
 46 |     // require.resolve('webpack-dev-server/client') + '?/',
 47 |     // require.resolve('webpack/hot/dev-server'),
 48 |     require.resolve('react-dev-utils/webpackHotDevClient'),
 49 |     // Finally, this is your app's code:
 50 |     paths.appIndexJs,
 51 |     // We include the app code last so that if there is a runtime error during
 52 |     // initialization, it doesn't blow up the WebpackDevServer client, and
 53 |     // changing JS code would still trigger a refresh.
 54 |   ],
 55 |   output: {
 56 |     // Add /* filename */ comments to generated require()s in the output.
 57 |     pathinfo: true,
 58 |     // This does not produce a real file. It's just the virtual path that is
 59 |     // served by WebpackDevServer in development. This is the JS bundle
 60 |     // containing code from all our entry points, and the Webpack runtime.
 61 |     filename: 'static/js/bundle.js',
 62 |     // There are also additional JS chunk files if you use code splitting.
 63 |     chunkFilename: 'static/js/[name].chunk.js',
 64 |     // This is the URL that app is served from. We use "/" in development.
 65 |     publicPath: publicPath,
 66 |     // Point sourcemap entries to original disk location (format as URL on Windows)
 67 |     devtoolModuleFilenameTemplate: info =>
 68 |       path.resolve(info.absoluteResourcePath).replace(/\\/g, '/'),
 69 |   },
 70 |   resolve: {
 71 |     // This allows you to set a fallback for where Webpack should look for modules.
 72 |     // We placed these paths second because we want `node_modules` to "win"
 73 |     // if there are any conflicts. This matches Node resolution mechanism.
 74 |     // https://github.com/facebookincubator/create-react-app/issues/253
 75 |     modules: ['node_modules', paths.appNodeModules].concat(
 76 |       // It is guaranteed to exist because we tweak it in `env.js`
 77 |       process.env.NODE_PATH.split(path.delimiter).filter(Boolean)
 78 |     ),
 79 |     // These are the reasonable defaults supported by the Node ecosystem.
 80 |     // We also include JSX as a common component filename extension to support
 81 |     // some tools, although we do not recommend using it, see:
 82 |     // https://github.com/facebookincubator/create-react-app/issues/290
 83 |     // `web` extension prefixes have been added for better support
 84 |     // for React Native Web.
 85 |     extensions: ['.web.js', '.mjs', '.js', '.json', '.web.jsx', '.jsx'],
 86 |     alias: {
 87 |       
 88 |       // Support React Native Web
 89 |       // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
 90 |       'react-native': 'react-native-web',
 91 |     },
 92 |     plugins: [
 93 |       // Prevents users from importing files from outside of src/ (or node_modules/).
 94 |       // This often causes confusion because we only process files within src/ with babel.
 95 |       // To fix this, we prevent you from importing files out of src/ -- if you'd like to,
 96 |       // please link the files into your node_modules/ and let module-resolution kick in.
 97 |       // Make sure your source files are compiled, as they will not be processed in any way.
 98 |       new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
 99 |     ],
100 |   },
101 |   module: {
102 |     strictExportPresence: true,
103 |     rules: [
104 |       // TODO: Disable require.ensure as it's not a standard language feature.
105 |       // We are waiting for https://github.com/facebookincubator/create-react-app/issues/2176.
106 |       // { parser: { requireEnsure: false } },
107 | 
108 |       // First, run the linter.
109 |       // It's important to do this before Babel processes the JS.
110 |       {
111 |         test: /\.(js|jsx|mjs)$/,
112 |         enforce: 'pre',
113 |         use: [
114 |           {
115 |             options: {
116 |               formatter: eslintFormatter,
117 |               eslintPath: require.resolve('eslint'),
118 |               
119 |             },
120 |             loader: require.resolve('eslint-loader'),
121 |           },
122 |         ],
123 |         include: paths.appSrc,
124 |       },
125 |       {
126 |         // "oneOf" will traverse all following loaders until one will
127 |         // match the requirements. When no loader matches it will fall
128 |         // back to the "file" loader at the end of the loader list.
129 |         oneOf: [
130 |           // "url" loader works like "file" loader except that it embeds assets
131 |           // smaller than specified limit in bytes as data URLs to avoid requests.
132 |           // A missing `test` is equivalent to a match.
133 |           {
134 |             test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/],
135 |             loader: require.resolve('url-loader'),
136 |             options: {
137 |               limit: 10000,
138 |               name: 'static/media/[name].[hash:8].[ext]',
139 |             },
140 |           },
141 |           // Process JS with Babel.
142 |           {
143 |             test: /\.(js|jsx|mjs)$/,
144 |             include: paths.appSrc,
145 |             loader: require.resolve('babel-loader'),
146 |             options: {
147 |               
148 |               // This is a feature of `babel-loader` for webpack (not Babel itself).
149 |               // It enables caching results in ./node_modules/.cache/babel-loader/
150 |               // directory for faster rebuilds.
151 |               cacheDirectory: true,
152 |             },
153 |           },
154 |           // "postcss" loader applies autoprefixer to our CSS.
155 |           // "css" loader resolves paths in CSS and adds assets as dependencies.
156 |           // "style" loader turns CSS into JS modules that inject <style> tags.
157 |           // In production, we use a plugin to extract that CSS to a file, but
158 |           // in development "style" loader enables hot editing of CSS.
159 |           {
160 |             test: /\.css$/,
161 |             use: [
162 |               require.resolve('style-loader'),
163 |               {
164 |                 loader: require.resolve('css-loader'),
165 |                 options: {
166 |                   importLoaders: 1,
167 |                 },
168 |               },
169 |               {
170 |                 loader: require.resolve('postcss-loader'),
171 |                 options: {
172 |                   // Necessary for external CSS imports to work
173 |                   // https://github.com/facebookincubator/create-react-app/issues/2677
174 |                   ident: 'postcss',
175 |                   plugins: () => [
176 |                     require('postcss-flexbugs-fixes'),
177 |                     autoprefixer({
178 |                       browsers: [
179 |                         '>1%',
180 |                         'last 4 versions',
181 |                         'Firefox ESR',
182 |                         'not ie < 9', // React doesn't support IE8 anyway
183 |                       ],
184 |                       flexbox: 'no-2009',
185 |                     }),
186 |                   ],
187 |                 },
188 |               },
189 |             ],
190 |           },
191 |           // "file" loader makes sure those assets get served by WebpackDevServer.
192 |           // When you `import` an asset, you get its (virtual) filename.
193 |           // In production, they would get copied to the `build` folder.
194 |           // This loader doesn't use a "test" so it will catch all modules
195 |           // that fall through the other loaders.
196 |           {
197 |             // Exclude `js` files to keep "css" loader working as it injects
198 |             // it's runtime that would otherwise processed through "file" loader.
199 |             // Also exclude `html` and `json` extensions so they get processed
200 |             // by webpacks internal loaders.
201 |             exclude: [/\.js$/, /\.html$/, /\.json$/],
202 |             loader: require.resolve('file-loader'),
203 |             options: {
204 |               name: 'static/media/[name].[hash:8].[ext]',
205 |             },
206 |           },
207 |         ],
208 |       },
209 |       // ** STOP ** Are you adding a new loader?
210 |       // Make sure to add the new loader(s) before the "file" loader.
211 |     ],
212 |   },
213 |   plugins: [
214 |     // Makes some environment variables available in index.html.
215 |     // The public URL is available as %PUBLIC_URL% in index.html, e.g.:
216 |     // <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
217 |     // In development, this will be an empty string.
218 |     new InterpolateHtmlPlugin(env.raw),
219 |     // Generates an `index.html` file with the <script> injected.
220 |     new HtmlWebpackPlugin({
221 |       inject: true,
222 |       template: paths.appHtml,
223 |     }),
224 |     // Add module names to factory functions so they appear in browser profiler.
225 |     new webpack.NamedModulesPlugin(),
226 |     // Makes some environment variables available to the JS code, for example:
227 |     // if (process.env.NODE_ENV === 'development') { ... }. See `./env.js`.
228 |     new webpack.DefinePlugin(env.stringified),
229 |     // This is necessary to emit hot updates (currently CSS only):
230 |     new webpack.HotModuleReplacementPlugin(),
231 |     // Watcher doesn't work well if you mistype casing in a path so we use
232 |     // a plugin that prints an error when you attempt to do this.
233 |     // See https://github.com/facebookincubator/create-react-app/issues/240
234 |     new CaseSensitivePathsPlugin(),
235 |     // If you require a missing module and then `npm install` it, you still have
236 |     // to restart the development server for Webpack to discover it. This plugin
237 |     // makes the discovery automatic so you don't have to restart.
238 |     // See https://github.com/facebookincubator/create-react-app/issues/186
239 |     new WatchMissingNodeModulesPlugin(paths.appNodeModules),
240 |     // Moment.js is an extremely popular library that bundles large locale files
241 |     // by default due to how Webpack interprets its code. This is a practical
242 |     // solution that requires the user to opt into importing specific locales.
243 |     // https://github.com/jmblog/how-to-optimize-momentjs-with-webpack
244 |     // You can remove this if you don't use Moment.js:
245 |     new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
246 |   ],
247 |   // Some libraries import Node modules but don't use them in the browser.
248 |   // Tell Webpack to provide empty mocks for them so importing them works.
249 |   node: {
250 |     dgram: 'empty',
251 |     fs: 'empty',
252 |     net: 'empty',
253 |     tls: 'empty',
254 |     child_process: 'empty',
255 |   },
256 |   // Turn off performance hints during development because we don't do any
257 |   // splitting or minification in interest of speed. These warnings become
258 |   // cumbersome.
259 |   performance: {
260 |     hints: false,
261 |   },
262 | };
263 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/config/webpack.config.prod.js:
--------------------------------------------------------------------------------
  1 | 'use strict';
  2 | 
  3 | const autoprefixer = require('autoprefixer');
  4 | const path = require('path');
  5 | const webpack = require('webpack');
  6 | const HtmlWebpackPlugin = require('html-webpack-plugin');
  7 | const ExtractTextPlugin = require('extract-text-webpack-plugin');
  8 | const ManifestPlugin = require('webpack-manifest-plugin');
  9 | const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin');
 10 | const SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin');
 11 | const eslintFormatter = require('react-dev-utils/eslintFormatter');
 12 | const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');
 13 | const paths = require('./paths');
 14 | const getClientEnvironment = require('./env');
 15 | 
 16 | // Webpack uses `publicPath` to determine where the app is being served from.
 17 | // It requires a trailing slash, or the file assets will get an incorrect path.
 18 | const publicPath = paths.servedPath;
 19 | // Some apps do not use client-side routing with pushState.
 20 | // For these, "homepage" can be set to "." to enable relative asset paths.
 21 | const shouldUseRelativeAssetPaths = publicPath === './';
 22 | // Source maps are resource heavy and can cause out of memory issue for large source files.
 23 | const shouldUseSourceMap = process.env.GENERATE_SOURCEMAP !== 'false';
 24 | // `publicUrl` is just like `publicPath`, but we will provide it to our app
 25 | // as %PUBLIC_URL% in `index.html` and `process.env.PUBLIC_URL` in JavaScript.
 26 | // Omit trailing slash as %PUBLIC_URL%/xyz looks better than %PUBLIC_URL%xyz.
 27 | const publicUrl = publicPath.slice(0, -1);
 28 | // Get environment variables to inject into our app.
 29 | const env = getClientEnvironment(publicUrl);
 30 | 
 31 | // Assert this just to be safe.
 32 | // Development builds of React are slow and not intended for production.
 33 | if (env.stringified['process.env'].NODE_ENV !== '"production"') {
 34 |   throw new Error('Production builds must have NODE_ENV=production.');
 35 | }
 36 | 
 37 | // Note: defined here because it will be used more than once.
 38 | const cssFilename = 'static/css/[name].[contenthash:8].css';
 39 | 
 40 | // ExtractTextPlugin expects the build output to be flat.
 41 | // (See https://github.com/webpack-contrib/extract-text-webpack-plugin/issues/27)
 42 | // However, our output is structured with css, js and media folders.
 43 | // To have this structure working with relative paths, we have to use custom options.
 44 | const extractTextPluginOptions = shouldUseRelativeAssetPaths
 45 |   ? // Making sure that the publicPath goes back to to build folder.
 46 |     { publicPath: Array(cssFilename.split('/').length).join('../') }
 47 |   : {};
 48 | 
 49 | // This is the production configuration.
 50 | // It compiles slowly and is focused on producing a fast and minimal bundle.
 51 | // The development configuration is different and lives in a separate file.
 52 | module.exports = {
 53 |   // Don't attempt to continue if there are any errors.
 54 |   bail: true,
 55 |   // We generate sourcemaps in production. This is slow but gives good results.
 56 |   // You can exclude the *.map files from the build during deployment.
 57 |   devtool: shouldUseSourceMap ? 'source-map' : false,
 58 |   // In production, we only want to load the polyfills and the app code.
 59 |   entry: [require.resolve('./polyfills'), paths.appIndexJs],
 60 |   output: {
 61 |     // The build folder.
 62 |     path: paths.appBuild,
 63 |     // Generated JS file names (with nested folders).
 64 |     // There will be one main bundle, and one file per asynchronous chunk.
 65 |     // We don't currently advertise code splitting but Webpack supports it.
 66 |     filename: 'static/js/[name].[chunkhash:8].js',
 67 |     chunkFilename: 'static/js/[name].[chunkhash:8].chunk.js',
 68 |     // We inferred the "public path" (such as / or /my-project) from homepage.
 69 |     publicPath: publicPath,
 70 |     // Point sourcemap entries to original disk location (format as URL on Windows)
 71 |     devtoolModuleFilenameTemplate: info =>
 72 |       path
 73 |         .relative(paths.appSrc, info.absoluteResourcePath)
 74 |         .replace(/\\/g, '/'),
 75 |   },
 76 |   resolve: {
 77 |     // This allows you to set a fallback for where Webpack should look for modules.
 78 |     // We placed these paths second because we want `node_modules` to "win"
 79 |     // if there are any conflicts. This matches Node resolution mechanism.
 80 |     // https://github.com/facebookincubator/create-react-app/issues/253
 81 |     modules: ['node_modules', paths.appNodeModules].concat(
 82 |       // It is guaranteed to exist because we tweak it in `env.js`
 83 |       process.env.NODE_PATH.split(path.delimiter).filter(Boolean)
 84 |     ),
 85 |     // These are the reasonable defaults supported by the Node ecosystem.
 86 |     // We also include JSX as a common component filename extension to support
 87 |     // some tools, although we do not recommend using it, see:
 88 |     // https://github.com/facebookincubator/create-react-app/issues/290
 89 |     // `web` extension prefixes have been added for better support
 90 |     // for React Native Web.
 91 |     extensions: ['.web.js', '.mjs', '.js', '.json', '.web.jsx', '.jsx'],
 92 |     alias: {
 93 |       
 94 |       // Support React Native Web
 95 |       // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/
 96 |       'react-native': 'react-native-web',
 97 |     },
 98 |     plugins: [
 99 |       // Prevents users from importing files from outside of src/ (or node_modules/).
100 |       // This often causes confusion because we only process files within src/ with babel.
101 |       // To fix this, we prevent you from importing files out of src/ -- if you'd like to,
102 |       // please link the files into your node_modules/ and let module-resolution kick in.
103 |       // Make sure your source files are compiled, as they will not be processed in any way.
104 |       new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),
105 |     ],
106 |   },
107 |   module: {
108 |     strictExportPresence: true,
109 |     rules: [
110 |       // TODO: Disable require.ensure as it's not a standard language feature.
111 |       // We are waiting for https://github.com/facebookincubator/create-react-app/issues/2176.
112 |       // { parser: { requireEnsure: false } },
113 | 
114 |       // First, run the linter.
115 |       // It's important to do this before Babel processes the JS.
116 |       {
117 |         test: /\.(js|jsx|mjs)$/,
118 |         enforce: 'pre',
119 |         use: [
120 |           {
121 |             options: {
122 |               formatter: eslintFormatter,
123 |               eslintPath: require.resolve('eslint'),
124 |               
125 |             },
126 |             loader: require.resolve('eslint-loader'),
127 |           },
128 |         ],
129 |         include: paths.appSrc,
130 |       },
131 |       {
132 |         // "oneOf" will traverse all following loaders until one will
133 |         // match the requirements. When no loader matches it will fall
134 |         // back to the "file" loader at the end of the loader list.
135 |         oneOf: [
136 |           // "url" loader works just like "file" loader but it also embeds
137 |           // assets smaller than specified size as data URLs to avoid requests.
138 |           {
139 |             test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/],
140 |             loader: require.resolve('url-loader'),
141 |             options: {
142 |               limit: 10000,
143 |               name: 'static/media/[name].[hash:8].[ext]',
144 |             },
145 |           },
146 |           // Process JS with Babel.
147 |           {
148 |             test: /\.(js|jsx|mjs)$/,
149 |             include: paths.appSrc,
150 |             loader: require.resolve('babel-loader'),
151 |             options: {
152 |               
153 |               compact: true,
154 |             },
155 |           },
156 |           // The notation here is somewhat confusing.
157 |           // "postcss" loader applies autoprefixer to our CSS.
158 |           // "css" loader resolves paths in CSS and adds assets as dependencies.
159 |           // "style" loader normally turns CSS into JS modules injecting <style>,
160 |           // but unlike in development configuration, we do something different.
161 |           // `ExtractTextPlugin` first applies the "postcss" and "css" loaders
162 |           // (second argument), then grabs the result CSS and puts it into a
163 |           // separate file in our build process. This way we actually ship
164 |           // a single CSS file in production instead of JS code injecting <style>
165 |           // tags. If you use code splitting, however, any async bundles will still
166 |           // use the "style" loader inside the async code so CSS from them won't be
167 |           // in the main CSS file.
168 |           {
169 |             test: /\.css$/,
170 |             loader: ExtractTextPlugin.extract(
171 |               Object.assign(
172 |                 {
173 |                   fallback: {
174 |                     loader: require.resolve('style-loader'),
175 |                     options: {
176 |                       hmr: false,
177 |                     },
178 |                   },
179 |                   use: [
180 |                     {
181 |                       loader: require.resolve('css-loader'),
182 |                       options: {
183 |                         importLoaders: 1,
184 |                         minimize: true,
185 |                         sourceMap: shouldUseSourceMap,
186 |                       },
187 |                     },
188 |                     {
189 |                       loader: require.resolve('postcss-loader'),
190 |                       options: {
191 |                         // Necessary for external CSS imports to work
192 |                         // https://github.com/facebookincubator/create-react-app/issues/2677
193 |                         ident: 'postcss',
194 |                         plugins: () => [
195 |                           require('postcss-flexbugs-fixes'),
196 |                           autoprefixer({
197 |                             browsers: [
198 |                               '>1%',
199 |                               'last 4 versions',
200 |                               'Firefox ESR',
201 |                               'not ie < 9', // React doesn't support IE8 anyway
202 |                             ],
203 |                             flexbox: 'no-2009',
204 |                           }),
205 |                         ],
206 |                       },
207 |                     },
208 |                   ],
209 |                 },
210 |                 extractTextPluginOptions
211 |               )
212 |             ),
213 |             // Note: this won't work without `new ExtractTextPlugin()` in `plugins`.
214 |           },
215 |           // "file" loader makes sure assets end up in the `build` folder.
216 |           // When you `import` an asset, you get its filename.
217 |           // This loader doesn't use a "test" so it will catch all modules
218 |           // that fall through the other loaders.
219 |           {
220 |             loader: require.resolve('file-loader'),
221 |             // Exclude `js` files to keep "css" loader working as it injects
222 |             // it's runtime that would otherwise processed through "file" loader.
223 |             // Also exclude `html` and `json` extensions so they get processed
224 |             // by webpacks internal loaders.
225 |             exclude: [/\.js$/, /\.html$/, /\.json$/],
226 |             options: {
227 |               name: 'static/media/[name].[hash:8].[ext]',
228 |             },
229 |           },
230 |           // ** STOP ** Are you adding a new loader?
231 |           // Make sure to add the new loader(s) before the "file" loader.
232 |         ],
233 |       },
234 |     ],
235 |   },
236 |   plugins: [
237 |     // Makes some environment variables available in index.html.
238 |     // The public URL is available as %PUBLIC_URL% in index.html, e.g.:
239 |     // <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
240 |     // In production, it will be an empty string unless you specify "homepage"
241 |     // in `package.json`, in which case it will be the pathname of that URL.
242 |     new InterpolateHtmlPlugin(env.raw),
243 |     // Generates an `index.html` file with the <script> injected.
244 |     new HtmlWebpackPlugin({
245 |       inject: true,
246 |       template: paths.appHtml,
247 |       minify: {
248 |         removeComments: true,
249 |         collapseWhitespace: true,
250 |         removeRedundantAttributes: true,
251 |         useShortDoctype: true,
252 |         removeEmptyAttributes: true,
253 |         removeStyleLinkTypeAttributes: true,
254 |         keepClosingSlash: true,
255 |         minifyJS: true,
256 |         minifyCSS: true,
257 |         minifyURLs: true,
258 |       },
259 |     }),
260 |     // Makes some environment variables available to the JS code, for example:
261 |     // if (process.env.NODE_ENV === 'production') { ... }. See `./env.js`.
262 |     // It is absolutely essential that NODE_ENV was set to production here.
263 |     // Otherwise React will be compiled in the very slow development mode.
264 |     new webpack.DefinePlugin(env.stringified),
265 |     // Minify the code.
266 |     new webpack.optimize.UglifyJsPlugin({
267 |       compress: {
268 |         warnings: false,
269 |         // Disabled because of an issue with Uglify breaking seemingly valid code:
270 |         // https://github.com/facebookincubator/create-react-app/issues/2376
271 |         // Pending further investigation:
272 |         // https://github.com/mishoo/UglifyJS2/issues/2011
273 |         comparisons: false,
274 |       },
275 |       mangle: {
276 |         safari10: true,
277 |       },        
278 |       output: {
279 |         comments: false,
280 |         // Turned on because emoji and regex is not minified properly using default
281 |         // https://github.com/facebookincubator/create-react-app/issues/2488
282 |         ascii_only: true,
283 |       },
284 |       sourceMap: shouldUseSourceMap,
285 |     }),
286 |     // Note: this won't work without ExtractTextPlugin.extract(..) in `loaders`.
287 |     new ExtractTextPlugin({
288 |       filename: cssFilename,
289 |     }),
290 |     // Generate a manifest file which contains a mapping of all asset filenames
291 |     // to their corresponding output file so that tools can pick it up without
292 |     // having to parse `index.html`.
293 |     new ManifestPlugin({
294 |       fileName: 'asset-manifest.json',
295 |     }),
296 |     // Generate a service worker script that will precache, and keep up to date,
297 |     // the HTML & assets that are part of the Webpack build.
298 |     new SWPrecacheWebpackPlugin({
299 |       // By default, a cache-busting query parameter is appended to requests
300 |       // used to populate the caches, to ensure the responses are fresh.
301 |       // If a URL is already hashed by Webpack, then there is no concern
302 |       // about it being stale, and the cache-busting can be skipped.
303 |       dontCacheBustUrlsMatching: /\.\w{8}\./,
304 |       filename: 'service-worker.js',
305 |       logger(message) {
306 |         if (message.indexOf('Total precache size is') === 0) {
307 |           // This message occurs for every build and is a bit too noisy.
308 |           return;
309 |         }
310 |         if (message.indexOf('Skipping static resource') === 0) {
311 |           // This message obscures real errors so we ignore it.
312 |           // https://github.com/facebookincubator/create-react-app/issues/2612
313 |           return;
314 |         }
315 |         console.log(message);
316 |       },
317 |       minify: true,
318 |       // For unknown URLs, fallback to the index page
319 |       navigateFallback: publicUrl + '/index.html',
320 |       // Ignores URLs starting from /__ (useful for Firebase):
321 |       // https://github.com/facebookincubator/create-react-app/issues/2237#issuecomment-302693219
322 |       navigateFallbackWhitelist: [/^(?!\/__).*/],
323 |       // Don't precache sourcemaps (they're large) and build asset manifest:
324 |       staticFileGlobsIgnorePatterns: [/\.map$/, /asset-manifest\.json$/],
325 |     }),
326 |     // Moment.js is an extremely popular library that bundles large locale files
327 |     // by default due to how Webpack interprets its code. This is a practical
328 |     // solution that requires the user to opt into importing specific locales.
329 |     // https://github.com/jmblog/how-to-optimize-momentjs-with-webpack
330 |     // You can remove this if you don't use Moment.js:
331 |     new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
332 |   ],
333 |   // Some libraries import Node modules but don't use them in the browser.
334 |   // Tell Webpack to provide empty mocks for them so importing them works.
335 |   node: {
336 |     dgram: 'empty',
337 |     fs: 'empty',
338 |     net: 'empty',
339 |     tls: 'empty',
340 |     child_process: 'empty',
341 |   },
342 | };
343 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/config/webpackDevServer.config.js:
--------------------------------------------------------------------------------
  1 | 'use strict';
  2 | 
  3 | const errorOverlayMiddleware = require('react-dev-utils/errorOverlayMiddleware');
  4 | const noopServiceWorkerMiddleware = require('react-dev-utils/noopServiceWorkerMiddleware');
  5 | const path = require('path');
  6 | const config = require('./webpack.config.dev');
  7 | const paths = require('./paths');
  8 | 
  9 | const protocol = process.env.HTTPS === 'true' ? 'https' : 'http';
 10 | const host = process.env.HOST || '0.0.0.0';
 11 | 
 12 | module.exports = function(proxy, allowedHost) {
 13 |   return {
 14 |     // WebpackDevServer 2.4.3 introduced a security fix that prevents remote
 15 |     // websites from potentially accessing local content through DNS rebinding:
 16 |     // https://github.com/webpack/webpack-dev-server/issues/887
 17 |     // https://medium.com/webpack/webpack-dev-server-middleware-security-issues-1489d950874a
 18 |     // However, it made several existing use cases such as development in cloud
 19 |     // environment or subdomains in development significantly more complicated:
 20 |     // https://github.com/facebookincubator/create-react-app/issues/2271
 21 |     // https://github.com/facebookincubator/create-react-app/issues/2233
 22 |     // While we're investigating better solutions, for now we will take a
 23 |     // compromise. Since our WDS configuration only serves files in the `public`
 24 |     // folder we won't consider accessing them a vulnerability. However, if you
 25 |     // use the `proxy` feature, it gets more dangerous because it can expose
 26 |     // remote code execution vulnerabilities in backends like Django and Rails.
 27 |     // So we will disable the host check normally, but enable it if you have
 28 |     // specified the `proxy` setting. Finally, we let you override it if you
 29 |     // really know what you're doing with a special environment variable.
 30 |     disableHostCheck:
 31 |       !proxy || process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true',
 32 |     // Enable gzip compression of generated files.
 33 |     compress: true,
 34 |     // Silence WebpackDevServer's own logs since they're generally not useful.
 35 |     // It will still show compile warnings and errors with this setting.
 36 |     clientLogLevel: 'none',
 37 |     // By default WebpackDevServer serves physical files from current directory
 38 |     // in addition to all the virtual build products that it serves from memory.
 39 |     // This is confusing because those files won’t automatically be available in
 40 |     // production build folder unless we copy them. However, copying the whole
 41 |     // project directory is dangerous because we may expose sensitive files.
 42 |     // Instead, we establish a convention that only files in `public` directory
 43 |     // get served. Our build script will copy `public` into the `build` folder.
 44 |     // In `index.html`, you can get URL of `public` folder with %PUBLIC_URL%:
 45 |     // <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
 46 |     // In JavaScript code, you can access it with `process.env.PUBLIC_URL`.
 47 |     // Note that we only recommend to use `public` folder as an escape hatch
 48 |     // for files like `favicon.ico`, `manifest.json`, and libraries that are
 49 |     // for some reason broken when imported through Webpack. If you just want to
 50 |     // use an image, put it in `src` and `import` it from JavaScript instead.
 51 |     contentBase: paths.appPublic,
 52 |     // By default files from `contentBase` will not trigger a page reload.
 53 |     watchContentBase: true,
 54 |     // Enable hot reloading server. It will provide /sockjs-node/ endpoint
 55 |     // for the WebpackDevServer client so it can learn when the files were
 56 |     // updated. The WebpackDevServer client is included as an entry point
 57 |     // in the Webpack development configuration. Note that only changes
 58 |     // to CSS are currently hot reloaded. JS changes will refresh the browser.
 59 |     hot: true,
 60 |     // It is important to tell WebpackDevServer to use the same "root" path
 61 |     // as we specified in the config. In development, we always serve from /.
 62 |     publicPath: config.output.publicPath,
 63 |     // WebpackDevServer is noisy by default so we emit custom message instead
 64 |     // by listening to the compiler events with `compiler.plugin` calls above.
 65 |     quiet: true,
 66 |     // Reportedly, this avoids CPU overload on some systems.
 67 |     // https://github.com/facebookincubator/create-react-app/issues/293
 68 |     // src/node_modules is not ignored to support absolute imports
 69 |     // https://github.com/facebookincubator/create-react-app/issues/1065
 70 |     watchOptions: {
 71 |       ignored: new RegExp(
 72 |         `^(?!${path
 73 |           .normalize(paths.appSrc + '/')
 74 |           .replace(/[\\]+/g, '\\\\')}).+[\\\\/]node_modules[\\\\/]`,
 75 |         'g'
 76 |       ),
 77 |     },
 78 |     // Enable HTTPS if the HTTPS environment variable is set to 'true'
 79 |     https: protocol === 'https',
 80 |     host: host,
 81 |     overlay: false,
 82 |     historyApiFallback: {
 83 |       // Paths with dots should still use the history fallback.
 84 |       // See https://github.com/facebookincubator/create-react-app/issues/387.
 85 |       disableDotRule: true,
 86 |     },
 87 |     public: allowedHost,
 88 |     proxy,
 89 |     before(app) {
 90 |       // This lets us open files from the runtime error overlay.
 91 |       app.use(errorOverlayMiddleware());
 92 |       // This service worker file is effectively a 'no-op' that will reset any
 93 |       // previous service worker registered for the same host:port combination.
 94 |       // We do this in development to avoid hitting the production cache if
 95 |       // it used the same host and port.
 96 |       // https://github.com/facebookincubator/create-react-app/issues/2272#issuecomment-302832432
 97 |       app.use(noopServiceWorkerMiddleware());
 98 |     },
 99 |   };
100 | };
101 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "todos-react-blips",
 3 |   "version": "0.1.0",
 4 |   "private": true,
 5 |   "dependencies": {
 6 |     "autoprefixer": "7.1.6",
 7 |     "babel-core": "6.26.0",
 8 |     "babel-eslint": "7.2.3",
 9 |     "babel-jest": "20.0.3",
10 |     "babel-loader": "7.1.2",
11 |     "babel-polyfill": "^6.26.0",
12 |     "babel-preset-react-app": "^3.1.0",
13 |     "babel-runtime": "6.26.0",
14 |     "blips": "1.0.0",
15 |     "case-sensitive-paths-webpack-plugin": "2.1.1",
16 |     "chalk": "1.1.3",
17 |     "css-loader": "0.28.7",
18 |     "dotenv": "4.0.0",
19 |     "eslint": "4.10.0",
20 |     "eslint-config-react-app": "^2.0.1",
21 |     "eslint-loader": "1.9.0",
22 |     "eslint-plugin-flowtype": "2.39.1",
23 |     "eslint-plugin-import": "2.8.0",
24 |     "eslint-plugin-jsx-a11y": "5.1.1",
25 |     "eslint-plugin-react": "7.4.0",
26 |     "extract-text-webpack-plugin": "3.0.2",
27 |     "file-loader": "1.1.5",
28 |     "fs-extra": "3.0.1",
29 |     "graphql": "^0.11.7",
30 |     "html-webpack-plugin": "2.29.0",
31 |     "jest": "20.0.4",
32 |     "object-assign": "4.1.1",
33 |     "postcss-flexbugs-fixes": "3.2.0",
34 |     "postcss-loader": "2.0.8",
35 |     "promise": "8.0.1",
36 |     "raf": "3.4.0",
37 |     "react": "^16.1.0",
38 |     "react-blips": "0.14.0",
39 |     "react-dev-utils": "^4.2.1",
40 |     "react-dom": "^16.1.0",
41 |     "style-loader": "0.19.0",
42 |     "sw-precache-webpack-plugin": "0.11.4",
43 |     "url-loader": "0.6.2",
44 |     "uuid": "^3.1.0",
45 |     "webpack": "3.8.1",
46 |     "webpack-dev-server": "2.9.4",
47 |     "webpack-manifest-plugin": "1.3.2",
48 |     "whatwg-fetch": "2.0.3"
49 |   },
50 |   "scripts": {
51 |     "start": "node scripts/start.js",
52 |     "build": "node scripts/build.js",
53 |     "test": "node scripts/test.js --env=jsdom"
54 |   },
55 |   "jest": {
56 |     "collectCoverageFrom": [
57 |       "src/**/*.{js,jsx,mjs}"
58 |     ],
59 |     "setupFiles": [
60 |       "<rootDir>/config/polyfills.js"
61 |     ],
62 |     "testMatch": [
63 |       "<rootDir>/src/**/__tests__/**/*.{js,jsx,mjs}",
64 |       "<rootDir>/src/**/?(*.)(spec|test).{js,jsx,mjs}"
65 |     ],
66 |     "testEnvironment": "node",
67 |     "testURL": "http://localhost",
68 |     "transform": {
69 |       "^.+\\.(js|jsx|mjs)$": "<rootDir>/node_modules/babel-jest",
70 |       "^.+\\.css$": "<rootDir>/config/jest/cssTransform.js",
71 |       "^(?!.*\\.(js|jsx|mjs|css|json)$)": "<rootDir>/config/jest/fileTransform.js"
72 |     },
73 |     "transformIgnorePatterns": [
74 |       "[/\\\\]node_modules[/\\\\].+\\.(js|jsx|mjs)$"
75 |     ],
76 |     "moduleNameMapper": {
77 |       "^react-native$": "react-native-web"
78 |     },
79 |     "moduleFileExtensions": [
80 |       "web.js",
81 |       "mjs",
82 |       "js",
83 |       "json",
84 |       "web.jsx",
85 |       "jsx",
86 |       "node"
87 |     ]
88 |   },
89 |   "babel": {
90 |     "presets": [
91 |       "react-app"
92 |     ]
93 |   },
94 |   "eslintConfig": {
95 |     "extends": "react-app"
96 |   }
97 | }
98 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/monojack/blips/a6414b9464899d5e7a7ac38c32c647daee1e6e16/examples/todos-react-blips/public/favicon.ico


--------------------------------------------------------------------------------
/examples/todos-react-blips/public/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="utf-8">
 5 |     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 6 |     <meta name="theme-color" content="#000000">
 7 |     <!--
 8 |       manifest.json provides metadata used when your web app is added to the
 9 |       homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
10 |     -->
11 |     <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
12 |     <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
13 |     <!--
14 |       Notice the use of %PUBLIC_URL% in the tags above.
15 |       It will be replaced with the URL of the `public` folder during the build.
16 |       Only files inside the `public` folder can be referenced from the HTML.
17 | 
18 |       Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
19 |       work correctly both with client-side routing and a non-root public URL.
20 |       Learn how to configure a non-root public URL by running `npm run build`.
21 |     -->
22 |     <title>React App</title>
23 |   </head>
24 |   <body>
25 |     <noscript>
26 |       You need to enable JavaScript to run this app.
27 |     </noscript>
28 |     <div id="root"></div>
29 |     <!--
30 |       This HTML file is a template.
31 |       If you open it directly in the browser, you will see an empty page.
32 | 
33 |       You can add webfonts, meta tags, or analytics to this file.
34 |       The build step will place the bundled scripts into the <body> tag.
35 | 
36 |       To begin the development, run `npm start` or `yarn start`.
37 |       To create a production bundle, use `npm run build` or `yarn build`.
38 |     -->
39 |   </body>
40 | </html>
41 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/public/manifest.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "short_name": "React App",
 3 |   "name": "Create React App Sample",
 4 |   "icons": [
 5 |     {
 6 |       "src": "favicon.ico",
 7 |       "sizes": "64x64 32x32 24x24 16x16",
 8 |       "type": "image/x-icon"
 9 |     }
10 |   ],
11 |   "start_url": "./index.html",
12 |   "display": "standalone",
13 |   "theme_color": "#000000",
14 |   "background_color": "#ffffff"
15 | }
16 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/scripts/build.js:
--------------------------------------------------------------------------------
  1 | 'use strict';
  2 | 
  3 | // Do this as the first thing so that any code reading it knows the right env.
  4 | process.env.BABEL_ENV = 'production';
  5 | process.env.NODE_ENV = 'production';
  6 | 
  7 | // Makes the script crash on unhandled rejections instead of silently
  8 | // ignoring them. In the future, promise rejections that are not handled will
  9 | // terminate the Node.js process with a non-zero exit code.
 10 | process.on('unhandledRejection', err => {
 11 |   throw err;
 12 | });
 13 | 
 14 | // Ensure environment variables are read.
 15 | require('../config/env');
 16 | 
 17 | const path = require('path');
 18 | const chalk = require('chalk');
 19 | const fs = require('fs-extra');
 20 | const webpack = require('webpack');
 21 | const config = require('../config/webpack.config.prod');
 22 | const paths = require('../config/paths');
 23 | const checkRequiredFiles = require('react-dev-utils/checkRequiredFiles');
 24 | const formatWebpackMessages = require('react-dev-utils/formatWebpackMessages');
 25 | const printHostingInstructions = require('react-dev-utils/printHostingInstructions');
 26 | const FileSizeReporter = require('react-dev-utils/FileSizeReporter');
 27 | const printBuildError = require('react-dev-utils/printBuildError');
 28 | 
 29 | const measureFileSizesBeforeBuild =
 30 |   FileSizeReporter.measureFileSizesBeforeBuild;
 31 | const printFileSizesAfterBuild = FileSizeReporter.printFileSizesAfterBuild;
 32 | const useYarn = fs.existsSync(paths.yarnLockFile);
 33 | 
 34 | // These sizes are pretty large. We'll warn for bundles exceeding them.
 35 | const WARN_AFTER_BUNDLE_GZIP_SIZE = 512 * 1024;
 36 | const WARN_AFTER_CHUNK_GZIP_SIZE = 1024 * 1024;
 37 | 
 38 | // Warn and crash if required files are missing
 39 | if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
 40 |   process.exit(1);
 41 | }
 42 | 
 43 | // First, read the current file sizes in build directory.
 44 | // This lets us display how much they changed later.
 45 | measureFileSizesBeforeBuild(paths.appBuild)
 46 |   .then(previousFileSizes => {
 47 |     // Remove all content but keep the directory so that
 48 |     // if you're in it, you don't end up in Trash
 49 |     fs.emptyDirSync(paths.appBuild);
 50 |     // Merge with the public folder
 51 |     copyPublicFolder();
 52 |     // Start the webpack build
 53 |     return build(previousFileSizes);
 54 |   })
 55 |   .then(
 56 |     ({ stats, previousFileSizes, warnings }) => {
 57 |       if (warnings.length) {
 58 |         console.log(chalk.yellow('Compiled with warnings.\n'));
 59 |         console.log(warnings.join('\n\n'));
 60 |         console.log(
 61 |           '\nSearch for the ' +
 62 |             chalk.underline(chalk.yellow('keywords')) +
 63 |             ' to learn more about each warning.'
 64 |         );
 65 |         console.log(
 66 |           'To ignore, add ' +
 67 |             chalk.cyan('// eslint-disable-next-line') +
 68 |             ' to the line before.\n'
 69 |         );
 70 |       } else {
 71 |         console.log(chalk.green('Compiled successfully.\n'));
 72 |       }
 73 | 
 74 |       console.log('File sizes after gzip:\n');
 75 |       printFileSizesAfterBuild(
 76 |         stats,
 77 |         previousFileSizes,
 78 |         paths.appBuild,
 79 |         WARN_AFTER_BUNDLE_GZIP_SIZE,
 80 |         WARN_AFTER_CHUNK_GZIP_SIZE
 81 |       );
 82 |       console.log();
 83 | 
 84 |       const appPackage = require(paths.appPackageJson);
 85 |       const publicUrl = paths.publicUrl;
 86 |       const publicPath = config.output.publicPath;
 87 |       const buildFolder = path.relative(process.cwd(), paths.appBuild);
 88 |       printHostingInstructions(
 89 |         appPackage,
 90 |         publicUrl,
 91 |         publicPath,
 92 |         buildFolder,
 93 |         useYarn
 94 |       );
 95 |     },
 96 |     err => {
 97 |       console.log(chalk.red('Failed to compile.\n'));
 98 |       printBuildError(err);
 99 |       process.exit(1);
100 |     }
101 |   );
102 | 
103 | // Create the production build and print the deployment instructions.
104 | function build(previousFileSizes) {
105 |   console.log('Creating an optimized production build...');
106 | 
107 |   let compiler = webpack(config);
108 |   return new Promise((resolve, reject) => {
109 |     compiler.run((err, stats) => {
110 |       if (err) {
111 |         return reject(err);
112 |       }
113 |       const messages = formatWebpackMessages(stats.toJson({}, true));
114 |       if (messages.errors.length) {
115 |         // Only keep the first error. Others are often indicative
116 |         // of the same problem, but confuse the reader with noise.
117 |         if (messages.errors.length > 1) {
118 |           messages.errors.length = 1;
119 |         }
120 |         return reject(new Error(messages.errors.join('\n\n')));
121 |       }
122 |       if (
123 |         process.env.CI &&
124 |         (typeof process.env.CI !== 'string' ||
125 |           process.env.CI.toLowerCase() !== 'false') &&
126 |         messages.warnings.length
127 |       ) {
128 |         console.log(
129 |           chalk.yellow(
130 |             '\nTreating warnings as errors because process.env.CI = true.\n' +
131 |               'Most CI servers set it automatically.\n'
132 |           )
133 |         );
134 |         return reject(new Error(messages.warnings.join('\n\n')));
135 |       }
136 |       return resolve({
137 |         stats,
138 |         previousFileSizes,
139 |         warnings: messages.warnings,
140 |       });
141 |     });
142 |   });
143 | }
144 | 
145 | function copyPublicFolder() {
146 |   fs.copySync(paths.appPublic, paths.appBuild, {
147 |     dereference: true,
148 |     filter: file => file !== paths.appHtml,
149 |   });
150 | }
151 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/scripts/start.js:
--------------------------------------------------------------------------------
 1 | 'use strict';
 2 | 
 3 | // Do this as the first thing so that any code reading it knows the right env.
 4 | process.env.BABEL_ENV = 'development';
 5 | process.env.NODE_ENV = 'development';
 6 | 
 7 | // Makes the script crash on unhandled rejections instead of silently
 8 | // ignoring them. In the future, promise rejections that are not handled will
 9 | // terminate the Node.js process with a non-zero exit code.
10 | process.on('unhandledRejection', err => {
11 |   throw err;
12 | });
13 | 
14 | // Ensure environment variables are read.
15 | require('../config/env');
16 | 
17 | const fs = require('fs');
18 | const chalk = require('chalk');
19 | const webpack = require('webpack');
20 | const WebpackDevServer = require('webpack-dev-server');
21 | const clearConsole = require('react-dev-utils/clearConsole');
22 | const checkRequiredFiles = require('react-dev-utils/checkRequiredFiles');
23 | const {
24 |   choosePort,
25 |   createCompiler,
26 |   prepareProxy,
27 |   prepareUrls,
28 | } = require('react-dev-utils/WebpackDevServerUtils');
29 | const openBrowser = require('react-dev-utils/openBrowser');
30 | const paths = require('../config/paths');
31 | const config = require('../config/webpack.config.dev');
32 | const createDevServerConfig = require('../config/webpackDevServer.config');
33 | 
34 | const useYarn = fs.existsSync(paths.yarnLockFile);
35 | const isInteractive = process.stdout.isTTY;
36 | 
37 | // Warn and crash if required files are missing
38 | if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
39 |   process.exit(1);
40 | }
41 | 
42 | // Tools like Cloud9 rely on this.
43 | const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 3000;
44 | const HOST = process.env.HOST || '0.0.0.0';
45 | 
46 | // We attempt to use the default port but if it is busy, we offer the user to
47 | // run on a different port. `detect()` Promise resolves to the next free port.
48 | choosePort(HOST, DEFAULT_PORT)
49 |   .then(port => {
50 |     if (port == null) {
51 |       // We have not found a port.
52 |       return;
53 |     }
54 |     const protocol = process.env.HTTPS === 'true' ? 'https' : 'http';
55 |     const appName = require(paths.appPackageJson).name;
56 |     const urls = prepareUrls(protocol, HOST, port);
57 |     // Create a webpack compiler that is configured with custom messages.
58 |     const compiler = createCompiler(webpack, config, appName, urls, useYarn);
59 |     // Load proxy config
60 |     const proxySetting = require(paths.appPackageJson).proxy;
61 |     const proxyConfig = prepareProxy(proxySetting, paths.appPublic);
62 |     // Serve webpack assets generated by the compiler over a web sever.
63 |     const serverConfig = createDevServerConfig(
64 |       proxyConfig,
65 |       urls.lanUrlForConfig
66 |     );
67 |     const devServer = new WebpackDevServer(compiler, serverConfig);
68 |     // Launch WebpackDevServer.
69 |     devServer.listen(port, HOST, err => {
70 |       if (err) {
71 |         return console.log(err);
72 |       }
73 |       if (isInteractive) {
74 |         clearConsole();
75 |       }
76 |       console.log(chalk.cyan('Starting the development server...\n'));
77 |       openBrowser(urls.localUrlForBrowser);
78 |     });
79 | 
80 |     ['SIGINT', 'SIGTERM'].forEach(function(sig) {
81 |       process.on(sig, function() {
82 |         devServer.close();
83 |         process.exit();
84 |       });
85 |     });
86 |   })
87 |   .catch(err => {
88 |     if (err && err.message) {
89 |       console.log(err.message);
90 |     }
91 |     process.exit(1);
92 |   });
93 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/scripts/test.js:
--------------------------------------------------------------------------------
 1 | 'use strict';
 2 | 
 3 | // Do this as the first thing so that any code reading it knows the right env.
 4 | process.env.BABEL_ENV = 'test';
 5 | process.env.NODE_ENV = 'test';
 6 | process.env.PUBLIC_URL = '';
 7 | 
 8 | // Makes the script crash on unhandled rejections instead of silently
 9 | // ignoring them. In the future, promise rejections that are not handled will
10 | // terminate the Node.js process with a non-zero exit code.
11 | process.on('unhandledRejection', err => {
12 |   throw err;
13 | });
14 | 
15 | // Ensure environment variables are read.
16 | require('../config/env');
17 | 
18 | const jest = require('jest');
19 | const argv = process.argv.slice(2);
20 | 
21 | // Watch unless on CI or in coverage mode
22 | if (!process.env.CI && argv.indexOf('--coverage') < 0) {
23 |   argv.push('--watch');
24 | }
25 | 
26 | 
27 | jest.run(argv);
28 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/src/components/FakeTodosButton/FakeTodosButton.js:
--------------------------------------------------------------------------------
 1 | import React from 'react'
 2 | 
 3 | const FakeTodosButton = ({ onClick }) => {
 4 |   return (
 5 |     <button
 6 |       type="button"
 7 |       name="button"
 8 |       className="action-button shadow animate blue"
 9 |       onClick={onClick}
10 |     >
11 |       <span>
12 |         Add fake todos from <b>GraphQL API</b>
13 |       </span>
14 |       <small>
15 |         <i>(fake.graphql.guru)</i>
16 |       </small>
17 |     </button>
18 |   )
19 | }
20 | 
21 | export default FakeTodosButton
22 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/src/components/Todo/Todo.js:
--------------------------------------------------------------------------------
 1 | import React from 'react'
 2 | import { object, func } from 'prop-types'
 3 | 
 4 | const Todo = ({ todo, onToggle, onRemove }) => (
 5 |   <li
 6 |     key={todo.id}
 7 |     className={todo.completed ? 'completed' : ''}
 8 |     onClick={e => onToggle(e, todo.id, !todo.completed)}
 9 |   >
10 |     <div className="view">
11 |       <input
12 |         className="toggle"
13 |         type="checkbox"
14 |         onChange={e => {
15 |           e.preventDefault()
16 |           onToggle(e, todo.id, !todo.completed)
17 |         }}
18 |         checked={todo.completed}
19 |       />
20 |       <label>{todo.label}</label>
21 |       <button
22 |         className="destroy"
23 |         onClick={e => {
24 |           e.stopPropagation()
25 |           onRemove(e, todo.id)
26 |         }}
27 |       />
28 |     </div>
29 |   </li>
30 | )
31 | 
32 | Todo.propTypes = {
33 |   todo: object.isRequired,
34 |   onToggle: func,
35 |   onRemove: func,
36 | }
37 | 
38 | Todo.defaultProps = {
39 |   onToggle: () => {},
40 |   onRemove: () => {},
41 | }
42 | 
43 | export default Todo
44 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/src/components/TodoList/TodoList.js:
--------------------------------------------------------------------------------
 1 | import React from 'react'
 2 | import { array } from 'prop-types'
 3 | 
 4 | import { Todo } from '../'
 5 | 
 6 | const TodoList = ({ todos, onClick, onRemove, onToggle }) => {
 7 |   return (
 8 |     <ul className="todo-list">
 9 |       {todos.map(todo => <Todo {...{ todo, onToggle, onRemove, onClick }} key={todo.id} />)}
10 |     </ul>
11 |   )
12 | }
13 | 
14 | TodoList.propTypes = {
15 |   todos: array.isRequired,
16 | }
17 | 
18 | TodoList.defaultProps = {
19 |   onClick: () => {},
20 |   onRemove: () => {},
21 |   onToggle: () => {},
22 | }
23 | 
24 | export default TodoList
25 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/src/components/index.js:
--------------------------------------------------------------------------------
1 | export { default as TodoList } from './TodoList/TodoList'
2 | export { default as Todo } from './Todo/Todo'
3 | export { default as FakeTodosButton } from './FakeTodosButton/FakeTodosButton'
4 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/src/containers/App/App.js:
--------------------------------------------------------------------------------
 1 | import React, { Component } from 'react'
 2 | import { withOperations, graphql, compose } from 'react-blips'
 3 | 
 4 | import { TodoList, FakeTodosButton } from '../../components'
 5 | 
 6 | import { fakeTodosQuery, mergedOperationsWithFragment } from './operations'
 7 | 
 8 | class App extends Component {
 9 |   state = {
10 |     value: '',
11 |   }
12 | 
13 |   handleChange = ({ target: { value } }) => {
14 |     this.setState({
15 |       value,
16 |     })
17 |   }
18 | 
19 |   createTodo = async e => {
20 |     const { mutations: { createTodoMutation } } = this.props
21 |     await createTodoMutation({
22 |       variables: { label: e.target.value },
23 |     })
24 | 
25 |     this.setState({
26 |       value: '',
27 |     })
28 |   }
29 | 
30 |   onTodoToggle = (e, id, completed) => {
31 |     const { mutations: { updateTodoMutation } } = this.props
32 |     updateTodoMutation({ variables: { id, completed } })
33 |   }
34 | 
35 |   onTodoRemove = (e, id) => {
36 |     const { mutations: { deleteTodoMutation } } = this.props
37 |     deleteTodoMutation({ variables: { id } })
38 |   }
39 | 
40 |   onButtonClick = async () => {
41 |     const {
42 |       queries: { FakeListQuery },
43 |       mutations: { createTodoMutation },
44 |     } = this.props
45 |     const { data: { fakeTodos = [] } = {} } = await FakeListQuery()
46 | 
47 |     for (const todo of fakeTodos) {
48 |       createTodoMutation({ variables: todo })
49 |     }
50 |   }
51 | 
52 |   render() {
53 |     const { data: { loading, errors, allTodos = [] } } = this.props
54 |     if (errors) console.log(errors)
55 | 
56 |     const todosRemaining = allTodos.filter(todo => !todo.completed)
57 |     return [
58 |       <section className="todoapp" key={'app-section'}>
59 |         <header className="header">
60 |           <h1>Todos</h1>
61 |           <input
62 |             className="new-todo"
63 |             placeholder="What needs to be done?"
64 |             autoFocus
65 |             value={this.state.value}
66 |             onKeyUp={e => e.keyCode === 13 && this.createTodo(e)}
67 |             onChange={this.handleChange}
68 |           />
69 |         </header>
70 |         <main className="main">
71 |           {!loading && (
72 |             <TodoList
73 |               {...{ todos: allTodos }}
74 |               onToggle={this.onTodoToggle}
75 |               onRemove={this.onTodoRemove}
76 |             />
77 |           )}
78 |         </main>
79 |         <footer className="footer">
80 |           <span className="todo-count">
81 |             <strong>{todosRemaining.length || 'no'}</strong>
82 |             {todosRemaining.length === 1 ? ' item' : ' items'} left
83 |           </span>
84 |         </footer>
85 |       </section>,
86 |       <FakeTodosButton key={'app-button'} onClick={this.onButtonClick} />,
87 |     ]
88 |   }
89 | }
90 | 
91 | export default compose(
92 |   withOperations(fakeTodosQuery, {
93 |     options: {
94 |       variables: { length: 3 },
95 |     },
96 |   }),
97 |   graphql(mergedOperationsWithFragment)
98 | )(App)
99 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/src/containers/App/operations.js:
--------------------------------------------------------------------------------
 1 | export const fakeTodosQuery = `
 2 |   query FakeListQuery($length: Int) @fetch {
 3 |     fakeTodos: FakeList(length: $length) {
 4 |       id
 5 |       label: title
 6 |       completed: boolean
 7 |     }
 8 |   }
 9 | `
10 | 
11 | export const allTodosQuery = `
12 |   query allTodosQuery {
13 |     allTodos {
14 |       id
15 |       label
16 |       completed
17 |     }
18 |   }
19 | `
20 | 
21 | export const allTodosSubscription = `
22 |   subscription allTodosSubscription {
23 |     allTodos {
24 |       id
25 |       label
26 |       completed
27 |     }
28 |   }
29 | `
30 | 
31 | export const createTodoMutation = `
32 |   mutation createTodoMutation($label: String!, $completed: Boolean) {
33 |     createTodo(label: $label, completed: $completed) {
34 |       id
35 |       label
36 |       completed
37 |     }
38 |   }
39 | `
40 | 
41 | export const updateTodoMutation = `
42 |   mutation updateTodoMutation($id: String!, $label: String, $completed: Boolean) {
43 |     updateTodo(id: $id, label: $label, completed: $completed) {
44 |       id
45 |       label
46 |       completed
47 |     }
48 |   }
49 | `
50 | 
51 | export const deleteTodoMutation = `
52 |   mutation deleteTodoMutation($id: String!) {
53 |     deleteTodo(id: $id) {
54 |       id
55 |       label
56 |       completed
57 |     }
58 |   }
59 | `
60 | export const todosMutations =
61 |   createTodoMutation + updateTodoMutation + deleteTodoMutation
62 | 
63 | export const mergedOperationsWithFragment = `
64 |   fragment TodoFields on Todo {
65 |     id
66 |     label
67 |     completed
68 |   }
69 | 
70 |   subscription allTodosSubscription {
71 |     allTodos {
72 |       ...TodoFields
73 |     }
74 |   }
75 |   mutation createTodoMutation($label: String!, $completed: Boolean) {
76 |     createTodo(label: $label, completed: $completed) {
77 |       ...TodoFields
78 |     }
79 |   }
80 |   mutation updateTodoMutation($id: String!, $label: String, $completed: Boolean) {
81 |     updateTodo(id: $id, label: $label, completed: $completed) {
82 |       ...TodoFields
83 |     }
84 |   }
85 |   mutation deleteTodoMutation($id: String!) {
86 |     deleteTodo(id: $id) {
87 |       ...TodoFields
88 |     }
89 |   }
90 | `
91 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/src/containers/index.js:
--------------------------------------------------------------------------------
1 | export { default as App } from './App/App'
2 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/src/index.css:
--------------------------------------------------------------------------------
  1 | button {
  2 |   margin: 0;
  3 |   padding: 0;
  4 |   border: 0;
  5 |   background: none;
  6 |   font-size: 100%;
  7 |   vertical-align: baseline;
  8 |   font-family: inherit;
  9 |   font-weight: inherit;
 10 |   color: inherit;
 11 |   -webkit-appearance: none;
 12 |   appearance: none;
 13 |   -webkit-font-smoothing: antialiased;
 14 |   -moz-osx-font-smoothing: grayscale;
 15 | }
 16 | 
 17 | body {
 18 |   font: 14px 'Helvetica Neue', Helvetica, Arial, sans-serif;
 19 |   line-height: 1.4em;
 20 |   background: #f5f5f5;
 21 |   color: #4d4d4d;
 22 |   min-width: 230px;
 23 |   max-width: 550px;
 24 |   margin: 0 auto;
 25 |   padding: 0;
 26 |   -webkit-font-smoothing: antialiased;
 27 |   -moz-osx-font-smoothing: grayscale;
 28 |   font-weight: 300;
 29 | }
 30 | 
 31 | :focus {
 32 |   outline: 0;
 33 | }
 34 | 
 35 | .hidden {
 36 |   display: none;
 37 | }
 38 | 
 39 | .todoapp {
 40 |   background: #fff;
 41 |   margin: 130px 0 40px 0;
 42 |   position: relative;
 43 |   box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 25px 50px 0 rgba(0, 0, 0, 0.1);
 44 | }
 45 | 
 46 | .todoapp input::-webkit-input-placeholder {
 47 |   font-style: italic;
 48 |   font-weight: 300;
 49 |   color: #e6e6e6;
 50 | }
 51 | 
 52 | .todoapp input::-moz-placeholder {
 53 |   font-style: italic;
 54 |   font-weight: 300;
 55 |   color: #e6e6e6;
 56 | }
 57 | 
 58 | .todoapp input::input-placeholder {
 59 |   font-style: italic;
 60 |   font-weight: 300;
 61 |   color: #e6e6e6;
 62 | }
 63 | 
 64 | .todoapp h1 {
 65 |   position: absolute;
 66 |   top: -155px;
 67 |   width: 100%;
 68 |   font-size: 100px;
 69 |   font-weight: 100;
 70 |   text-align: center;
 71 |   color: rgba(175, 47, 47, 0.15);
 72 |   -webkit-text-rendering: optimizeLegibility;
 73 |   -moz-text-rendering: optimizeLegibility;
 74 |   text-rendering: optimizeLegibility;
 75 | }
 76 | 
 77 | .new-todo,
 78 | .edit {
 79 |   position: relative;
 80 |   margin: 0;
 81 |   width: 100%;
 82 |   font-size: 24px;
 83 |   font-family: inherit;
 84 |   font-weight: inherit;
 85 |   line-height: 1.4em;
 86 |   border: 0;
 87 |   color: inherit;
 88 |   padding: 6px;
 89 |   border: 1px solid #999;
 90 |   box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
 91 |   box-sizing: border-box;
 92 |   -webkit-font-smoothing: antialiased;
 93 |   -moz-osx-font-smoothing: grayscale;
 94 | }
 95 | 
 96 | .new-todo {
 97 |   padding: 16px 16px 16px 60px;
 98 |   border: none;
 99 |   background: rgba(0, 0, 0, 0.003);
100 |   box-shadow: inset 0 -2px 1px rgba(0, 0, 0, 0.03);
101 | }
102 | 
103 | .main {
104 |   position: relative;
105 |   z-index: 2;
106 |   border-top: 1px solid #e6e6e6;
107 | }
108 | 
109 | .todo-list {
110 |   margin: 0;
111 |   padding: 0;
112 |   list-style: none;
113 | }
114 | 
115 | .todo-list li {
116 |   position: relative;
117 |   font-size: 24px;
118 |   border-bottom: 1px solid #ededed;
119 | }
120 | 
121 | .todo-list li:last-child {
122 |   border-bottom: none;
123 | }
124 | 
125 | .todo-list li.editing {
126 |   border-bottom: none;
127 |   padding: 0;
128 | }
129 | 
130 | .todo-list li.editing .edit {
131 |   display: block;
132 |   width: 506px;
133 |   padding: 12px 16px;
134 |   margin: 0 0 0 43px;
135 | }
136 | 
137 | .todo-list li.editing .view {
138 |   display: none;
139 | }
140 | 
141 | .todo-list li .toggle {
142 |   text-align: center;
143 |   width: 40px;
144 |   /* auto, since non-WebKit browsers doesn't support input styling */
145 |   height: auto;
146 |   position: absolute;
147 |   top: 0;
148 |   bottom: 0;
149 |   margin: auto 0;
150 |   border: none; /* Mobile Safari */
151 |   -webkit-appearance: none;
152 |   appearance: none;
153 | }
154 | 
155 | .todo-list li .toggle:after {
156 |   content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="-10 -18 100 135"><circle cx="50" cy="50" r="50" fill="none" stroke="#ededed" stroke-width="3"/></svg>');
157 | }
158 | 
159 | .todo-list li .toggle:checked:after {
160 |   content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="-10 -18 100 135"><circle cx="50" cy="50" r="50" fill="none" stroke="#bddad5" stroke-width="3"/><path fill="#5dc2af" d="M72 25L42 71 27 56l-4 4 20 20 34-52z"/></svg>');
161 | }
162 | 
163 | .todo-list li label {
164 |   word-break: break-all;
165 |   padding: 15px 60px 15px 15px;
166 |   margin-left: 45px;
167 |   display: block;
168 |   line-height: 1.2;
169 |   transition: color 0.4s;
170 | }
171 | 
172 | .todo-list li.completed label {
173 |   color: #d9d9d9;
174 |   text-decoration: line-through;
175 | }
176 | 
177 | .todo-list li .destroy {
178 |   display: none;
179 |   position: absolute;
180 |   top: 0;
181 |   right: 10px;
182 |   bottom: 0;
183 |   width: 40px;
184 |   height: 40px;
185 |   margin: auto 0;
186 |   font-size: 30px;
187 |   color: #cc9a9a;
188 |   margin-bottom: 11px;
189 |   transition: color 0.2s ease-out;
190 | }
191 | 
192 | .todo-list li .destroy:hover {
193 |   color: #af5b5e;
194 | }
195 | 
196 | .todo-list li .destroy:after {
197 |   content: '×';
198 | }
199 | 
200 | .todo-list li:hover .destroy {
201 |   display: block;
202 | }
203 | 
204 | .todo-list li .edit {
205 |   display: none;
206 | }
207 | 
208 | .todo-list li.editing:last-child {
209 |   margin-bottom: -1px;
210 | }
211 | 
212 | .footer {
213 |   color: #777;
214 |   padding: 10px 15px;
215 |   height: 20px;
216 |   text-align: center;
217 |   border-top: 1px solid #e6e6e6;
218 | }
219 | 
220 | .footer:before {
221 |   content: '';
222 |   position: absolute;
223 |   right: 0;
224 |   bottom: 0;
225 |   left: 0;
226 |   height: 50px;
227 |   overflow: hidden;
228 |   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 8px 0 -3px #f6f6f6,
229 |     0 9px 1px -3px rgba(0, 0, 0, 0.2), 0 16px 0 -6px #f6f6f6,
230 |     0 17px 2px -6px rgba(0, 0, 0, 0.2);
231 | }
232 | 
233 | .todo-count {
234 |   float: left;
235 |   text-align: left;
236 | }
237 | 
238 | .todo-count strong {
239 |   font-weight: 300;
240 | }
241 | 
242 | .animate {
243 |   transition: all 0.1s;
244 |   -webkit-transition: all 0.1s;
245 | }
246 | 
247 | .action-button {
248 |   position: relative;
249 |   width: 100%;
250 |   padding: 10px 40px;
251 |   margin: 0px 10px 10px 0px;
252 |   float: left;
253 |   border-radius: 10px;
254 |   font-family: 'Pacifico', cursive;
255 |   font-size: 25px;
256 |   background-color: rgba(175, 47, 47, 0.8);
257 |   border-bottom: 5px solid rgba(175, 47, 47, 1);
258 |   text-shadow: 0px -2px rgba(175, 47, 47, 1);
259 |   text-decoration: none;
260 |   color: #fff;
261 | }
262 | .action-button:active {
263 |   transform: translate(0px, 5px);
264 |   -webkit-transform: translate(0px, 5px);
265 |   border-bottom: 1px solid;
266 | }
267 | 
268 | /*
269 | 	Hack to remove background from Mobile Safari.
270 | 	Can't use it globally since it destroys checkboxes in Firefox
271 | */
272 | @media screen and (-webkit-min-device-pixel-ratio: 0) {
273 |   .todo-list li .toggle {
274 |     background: none;
275 |   }
276 | 
277 |   .todo-list li .toggle {
278 |     height: 40px;
279 |   }
280 | }
281 | 
282 | @media (max-width: 430px) {
283 |   .footer {
284 |     height: 50px;
285 |   }
286 | }
287 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/src/index.js:
--------------------------------------------------------------------------------
 1 | import React from 'react'
 2 | import ReactDOM from 'react-dom'
 3 | import { BlipsClient } from 'blips'
 4 | import { Provider } from 'react-blips'
 5 | 
 6 | import './index.css'
 7 | import { App } from './containers'
 8 | import registerServiceWorker from './registerServiceWorker'
 9 | 
10 | import typeDefs from './schema/types'
11 | import resolvers from './schema/resolvers'
12 | 
13 | // initial state
14 | const initialState = {
15 |   todos: {
16 |     '3c4a086e-2151-4b54-acb2-13044ea553c1': {
17 |       _id: '3c4a086e-2151-4b54-acb2-13044ea553c1',
18 |       label: 'Buy milk',
19 |       completed: false,
20 |     },
21 |     '4ecca858-67f8-491e-94cc-48b262061819': {
22 |       _id: '4ecca858-67f8-491e-94cc-48b262061819',
23 |       label: 'Learn Blips',
24 |       completed: true,
25 |     },
26 |   },
27 | }
28 | 
29 | // create the client instance
30 | const client = new BlipsClient({ typeDefs, resolvers }, initialState, {
31 |   fetch: {
32 |     uri: 'http://159.203.96.223/graphql',
33 |   },
34 | })
35 | 
36 | ReactDOM.render(
37 |   <Provider {...{ client }}>
38 |     <App />
39 |   </Provider>,
40 |   document.getElementById('root')
41 | )
42 | registerServiceWorker()
43 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/src/registerServiceWorker.js:
--------------------------------------------------------------------------------
  1 | // In production, we register a service worker to serve assets from local cache.
  2 | 
  3 | // This lets the app load faster on subsequent visits in production, and gives
  4 | // it offline capabilities. However, it also means that developers (and users)
  5 | // will only see deployed updates on the "N+1" visit to a page, since previously
  6 | // cached resources are updated in the background.
  7 | 
  8 | // To learn more about the benefits of this model, read https://goo.gl/KwvDNy.
  9 | // This link also includes instructions on opting out of this behavior.
 10 | 
 11 | const isLocalhost = Boolean(
 12 |   window.location.hostname === 'localhost' ||
 13 |     // [::1] is the IPv6 localhost address.
 14 |     window.location.hostname === '[::1]' ||
 15 |     // 127.0.0.1/8 is considered localhost for IPv4.
 16 |     window.location.hostname.match(
 17 |       /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
 18 |     )
 19 | );
 20 | 
 21 | export default function register() {
 22 |   if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
 23 |     // The URL constructor is available in all browsers that support SW.
 24 |     const publicUrl = new URL(process.env.PUBLIC_URL, window.location);
 25 |     if (publicUrl.origin !== window.location.origin) {
 26 |       // Our service worker won't work if PUBLIC_URL is on a different origin
 27 |       // from what our page is served on. This might happen if a CDN is used to
 28 |       // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374
 29 |       return;
 30 |     }
 31 | 
 32 |     window.addEventListener('load', () => {
 33 |       const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
 34 | 
 35 |       if (isLocalhost) {
 36 |         // This is running on localhost. Lets check if a service worker still exists or not.
 37 |         checkValidServiceWorker(swUrl);
 38 |       } else {
 39 |         // Is not local host. Just register service worker
 40 |         registerValidSW(swUrl);
 41 |       }
 42 |     });
 43 |   }
 44 | }
 45 | 
 46 | function registerValidSW(swUrl) {
 47 |   navigator.serviceWorker
 48 |     .register(swUrl)
 49 |     .then(registration => {
 50 |       registration.onupdatefound = () => {
 51 |         const installingWorker = registration.installing;
 52 |         installingWorker.onstatechange = () => {
 53 |           if (installingWorker.state === 'installed') {
 54 |             if (navigator.serviceWorker.controller) {
 55 |               // At this point, the old content will have been purged and
 56 |               // the fresh content will have been added to the cache.
 57 |               // It's the perfect time to display a "New content is
 58 |               // available; please refresh." message in your web app.
 59 |               console.log('New content is available; please refresh.');
 60 |             } else {
 61 |               // At this point, everything has been precached.
 62 |               // It's the perfect time to display a
 63 |               // "Content is cached for offline use." message.
 64 |               console.log('Content is cached for offline use.');
 65 |             }
 66 |           }
 67 |         };
 68 |       };
 69 |     })
 70 |     .catch(error => {
 71 |       console.error('Error during service worker registration:', error);
 72 |     });
 73 | }
 74 | 
 75 | function checkValidServiceWorker(swUrl) {
 76 |   // Check if the service worker can be found. If it can't reload the page.
 77 |   fetch(swUrl)
 78 |     .then(response => {
 79 |       // Ensure service worker exists, and that we really are getting a JS file.
 80 |       if (
 81 |         response.status === 404 ||
 82 |         response.headers.get('content-type').indexOf('javascript') === -1
 83 |       ) {
 84 |         // No service worker found. Probably a different app. Reload the page.
 85 |         navigator.serviceWorker.ready.then(registration => {
 86 |           registration.unregister().then(() => {
 87 |             window.location.reload();
 88 |           });
 89 |         });
 90 |       } else {
 91 |         // Service worker found. Proceed as normal.
 92 |         registerValidSW(swUrl);
 93 |       }
 94 |     })
 95 |     .catch(() => {
 96 |       console.log(
 97 |         'No internet connection found. App is running in offline mode.'
 98 |       );
 99 |     });
100 | }
101 | 
102 | export function unregister() {
103 |   if ('serviceWorker' in navigator) {
104 |     navigator.serviceWorker.ready.then(registration => {
105 |       registration.unregister();
106 |     });
107 |   }
108 | }
109 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/src/schema/resolvers.js:
--------------------------------------------------------------------------------
 1 | import uuid from 'uuid'
 2 | 
 3 | // If you need to set-up subscriptions, you will have to return a function.
 4 | // It's first argument is an object containing the `PubSub` instance of the store and the `withFilter` helper.
 5 | // See https://github.com/apollographql/graphql-subscriptions - to learn more about `PubSub` and `withFilter`
 6 | //
 7 | // If you don't want subscriptions, you don't need to access to `pubsub` or `withFilter`
 8 | // so you can export just an object
 9 | 
10 | // Read http://graphql.org/learn/execution/#root-fields-resolvers
11 | // if you have no idea about what resolvers are
12 | 
13 | export default ({ pubsub, withFilter }) => ({
14 |   Todo: {
15 |     // transform _id to id
16 |     id: ({ id, _id }, args, context) => _id || id,
17 |   },
18 |   Query: {
19 |     allTodos: (_, args, { store }) => Object.values(store.get('todos')),
20 |   },
21 |   Mutation: {
22 |     createTodo: (_, { label, completed = false }, { store }) => {
23 |       const id = uuid()
24 |       const modified = store.post(
25 |         'todos',
26 |         {
27 |           _id: id,
28 |           label,
29 |           completed,
30 |         },
31 |         id
32 |       )
33 |       pubsub.publish('TODO_CREATED')
34 |       return modified
35 |     },
36 |     updateTodo: (_, { id, label, completed }, { store }) => {
37 |       const modified = store.patch(
38 |         'todos',
39 |         {
40 |           label,
41 |           completed,
42 |         },
43 |         id
44 |       )
45 |       pubsub.publish('TODO_UPDATED', { id })
46 |       return modified
47 |     },
48 |     deleteTodo: (_, { id }, { store }) => {
49 |       const modified = store.delete('todos', id)
50 |       pubsub.publish('TODO_DELETED')
51 |       return modified
52 |     },
53 |   },
54 |   Subscription: {
55 |     allTodos: {
56 |       resolve: (_, args, { store }) => Object.values(store.get('todos')),
57 |       subscribe: () =>
58 |         pubsub.asyncIterator(['TODO_UPDATED', 'TODO_CREATED', 'TODO_DELETED']),
59 |     },
60 |   },
61 | })
62 | 


--------------------------------------------------------------------------------
/examples/todos-react-blips/src/schema/types.js:
--------------------------------------------------------------------------------
 1 | // See http://graphql.org/learn/schema/ to learn more about schemas and types
 2 | 
 3 | export default `
 4 |   type Todo {
 5 |     id: String!
 6 |     label: String!
 7 |     completed: Boolean
 8 |   }
 9 | 
10 |   type Query {
11 |     allTodos: [Todo!]!
12 |   }
13 | 
14 |   type Mutation {
15 |     createTodo(label: String!, completed: Boolean): Todo!
16 |     updateTodo(id: String!, label: String, completed: Boolean): Todo!
17 |     deleteTodo(id: String!): Todo!
18 |   }
19 | 
20 |   type Subscription {
21 |     allTodos: [Todo!]!
22 |   }
23 | `
24 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/.babelrc:
--------------------------------------------------------------------------------
1 | {
2 |   "presets": ["env", "stage-3"],
3 |   "plugins": ["transform-class-properties"]
4 | }
5 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/.eslintrc:
--------------------------------------------------------------------------------
 1 | {
 2 |   "extends": [
 3 |     "standard"
 4 |   ],
 5 |   "plugins": [
 6 |     "standard",
 7 |     "promise",
 8 |   ],
 9 |   "rules": {
10 |     "comma-dangle": [
11 |       "warn",
12 |       "always"
13 |     ],
14 |     "array-bracket-spacing": [
15 |       "warn",
16 |       "always"
17 |     ],
18 |     "object-curly-spacing": [
19 |       "warn",
20 |       "always"
21 |     ],
22 |     "no-sequences": [
23 |       "off"
24 |     ],
25 |     "no-console": [
26 |       "warn"
27 |     ],
28 |     "import/first": [
29 |       "off"
30 |     ],
31 |     "standard/object-curly-even-spacing": [
32 |       "off"
33 |     ]
34 |   }
35 | }
36 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/.gitignore:
--------------------------------------------------------------------------------
 1 | # See https://help.github.com/ignore-files/ for more about ignoring files.
 2 | 
 3 | # dependencies
 4 | /node_modules
 5 | 
 6 | # testing
 7 | /coverage
 8 | 
 9 | # production
10 | /build
11 | /dist
12 | 
13 | # misc
14 | .DS_Store
15 | .env.local
16 | .env.development.local
17 | .env.test.local
18 | .env.production.local
19 | 
20 | npm-debug.log*
21 | yarn-debug.log*
22 | yarn-error.log*
23 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/LICENSE:
--------------------------------------------------------------------------------
 1 | MIT License
 2 | 
 3 | Copyright (c) 2017 Ionut Achim
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/README.md:
--------------------------------------------------------------------------------
 1 | # Todos app with vanilla JS
 2 | 
 3 | This project template was built with [webpack-babel-starter](https://github.com/monojack/webpack-babel-starter). It includes support for ES6/ES7/ES8 syntax, stage-3 and several unofficial / not-yet-final forms of Javascript syntax such as Class Properties.
 4 | 
 5 | ## Available Scripts
 6 | 
 7 | In the project directory, you can run:
 8 | 
 9 | ### `npm start`
10 | 
11 | Runs the app in the development mode.<br>
12 | Open [http://localhost:8080](http://localhost:8080) to view it in the browser.
13 | 
14 | The page will reload if you make edits.<br>
15 | You will also see any lint errors in the console.
16 | 
17 | ### `npm run build`
18 | 
19 | Builds the app for production to the `dist` folder.<br>
20 | 
21 | The build is minified and the filenames include the hashes.<br>
22 | Your app is ready to be deployed!
23 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "webpack-babel-starter",
 3 |   "version": "1.1.0",
 4 |   "description": "Webpack and Babel app boilerplate",
 5 |   "repository": {
 6 |     "type": "git",
 7 |     "url": "git+https://github.com/monojack/webpack-babel-starter"
 8 |   },
 9 |   "keywords": [
10 |     "webpack",
11 |     "babel",
12 |     "es6",
13 |     "es7",
14 |     "es8",
15 |     "starter"
16 |   ],
17 |   "main": "src/index.js",
18 |   "scripts": {
19 |     "start": "webpack-dev-server --open --config webpack.dev.js",
20 |     "build": "webpack --config webpack.prod.js"
21 |   },
22 |   "author": "Ionut Achim <achimvionut@gmail.com>",
23 |   "license": "MIT",
24 |   "bugs": {
25 |     "url": "https://github.com/monojack/webpack-babel-starter/issues"
26 |   },
27 |   "devDependencies": {
28 |     "babel-core": "^6.26.0",
29 |     "babel-loader": "^7.1.2",
30 |     "babel-plugin-transform-class-properties": "^6.24.1",
31 |     "babel-preset-env": "^1.6.1",
32 |     "babel-preset-stage-3": "^6.24.1",
33 |     "clean-webpack-plugin": "^0.1.17",
34 |     "copy-webpack-plugin": "4.2.0",
35 |     "css-loader": "^0.28.7",
36 |     "eslint": "^4.10.0",
37 |     "eslint-config-standard": "^10.2.1",
38 |     "eslint-plugin-import": "^2.8.0",
39 |     "eslint-plugin-node": "^5.2.1",
40 |     "eslint-plugin-promise": "^3.6.0",
41 |     "eslint-plugin-standard": "^3.0.1",
42 |     "file-loader": "^1.1.5",
43 |     "html-webpack-plugin": "^2.30.1",
44 |     "style-loader": "^0.19.0",
45 |     "uglifyjs-webpack-plugin": "^1.0.1",
46 |     "url-loader": "^0.6.2",
47 |     "webpack": "^3.8.1",
48 |     "webpack-dev-server": "^2.9.4",
49 |     "webpack-manifest-plugin": "^1.3.2",
50 |     "webpack-merge": "^4.1.1"
51 |   },
52 |   "dependencies": {
53 |     "babel-polyfill": "^6.26.0",
54 |     "blips": "1.0.0",
55 |     "graphql": "^0.11.7",
56 |     "object-assign": "^4.1.1",
57 |     "promise": "^8.0.1",
58 |     "uuid": "^3.1.0",
59 |     "whatwg-fetch": "^2.0.3"
60 |   }
61 | }
62 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/polyfills.js:
--------------------------------------------------------------------------------
 1 | /* eslint-disable global-require */
 2 | 
 3 | // babel-polyfill
 4 | require('babel-polyfill')
 5 | 
 6 | // promise polyfill
 7 | if (typeof Promise === 'undefined') {
 8 |   require('promise/lib/rejection-tracking').enable()
 9 |   window.Promise = require('promise/lib/es6-extensions.js')
10 | }
11 | 
12 | // fetch() polyfill for making API calls.
13 | require('whatwg-fetch')
14 | 
15 | // Object.assign() polyfill
16 | Object.assign = require('object-assign')
17 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/src/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/monojack/blips/a6414b9464899d5e7a7ac38c32c647daee1e6e16/examples/todos-vanillajs/src/favicon.ico


--------------------------------------------------------------------------------
/examples/todos-vanillajs/src/index.css:
--------------------------------------------------------------------------------
  1 | button {
  2 |   margin: 0;
  3 |   padding: 0;
  4 |   border: 0;
  5 |   background: none;
  6 |   font-size: 100%;
  7 |   vertical-align: baseline;
  8 |   font-family: inherit;
  9 |   font-weight: inherit;
 10 |   color: inherit;
 11 |   -webkit-appearance: none;
 12 |   appearance: none;
 13 |   -webkit-font-smoothing: antialiased;
 14 |   -moz-osx-font-smoothing: grayscale;
 15 | }
 16 | 
 17 | body {
 18 |   font: 14px 'Helvetica Neue', Helvetica, Arial, sans-serif;
 19 |   line-height: 1.4em;
 20 |   background: #f5f5f5;
 21 |   color: #4d4d4d;
 22 |   min-width: 230px;
 23 |   max-width: 550px;
 24 |   margin: 0 auto;
 25 |   padding: 0;
 26 |   -webkit-font-smoothing: antialiased;
 27 |   -moz-osx-font-smoothing: grayscale;
 28 |   font-weight: 300;
 29 | }
 30 | 
 31 | :focus {
 32 |   outline: 0;
 33 | }
 34 | 
 35 | .hidden {
 36 |   display: none;
 37 | }
 38 | 
 39 | .todoapp {
 40 |   background: #fff;
 41 |   margin: 130px 0 40px 0;
 42 |   position: relative;
 43 |   box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 25px 50px 0 rgba(0, 0, 0, 0.1);
 44 | }
 45 | 
 46 | .todoapp input::-webkit-input-placeholder {
 47 |   font-style: italic;
 48 |   font-weight: 300;
 49 |   color: #e6e6e6;
 50 | }
 51 | 
 52 | .todoapp input::-moz-placeholder {
 53 |   font-style: italic;
 54 |   font-weight: 300;
 55 |   color: #e6e6e6;
 56 | }
 57 | 
 58 | .todoapp input::input-placeholder {
 59 |   font-style: italic;
 60 |   font-weight: 300;
 61 |   color: #e6e6e6;
 62 | }
 63 | 
 64 | .todoapp h1 {
 65 |   position: absolute;
 66 |   top: -155px;
 67 |   width: 100%;
 68 |   font-size: 100px;
 69 |   font-weight: 100;
 70 |   text-align: center;
 71 |   color: rgba(175, 47, 47, 0.15);
 72 |   -webkit-text-rendering: optimizeLegibility;
 73 |   -moz-text-rendering: optimizeLegibility;
 74 |   text-rendering: optimizeLegibility;
 75 | }
 76 | 
 77 | .new-todo,
 78 | .edit {
 79 |   position: relative;
 80 |   margin: 0;
 81 |   width: 100%;
 82 |   font-size: 24px;
 83 |   font-family: inherit;
 84 |   font-weight: inherit;
 85 |   line-height: 1.4em;
 86 |   border: 0;
 87 |   color: inherit;
 88 |   padding: 6px;
 89 |   border: 1px solid #999;
 90 |   box-shadow: inset 0 -1px 5px 0 rgba(0, 0, 0, 0.2);
 91 |   box-sizing: border-box;
 92 |   -webkit-font-smoothing: antialiased;
 93 |   -moz-osx-font-smoothing: grayscale;
 94 | }
 95 | 
 96 | .new-todo {
 97 |   padding: 16px 16px 16px 60px;
 98 |   border: none;
 99 |   background: rgba(0, 0, 0, 0.003);
100 |   box-shadow: inset 0 -2px 1px rgba(0, 0, 0, 0.03);
101 | }
102 | 
103 | .main {
104 |   position: relative;
105 |   z-index: 2;
106 |   border-top: 1px solid #e6e6e6;
107 | }
108 | 
109 | .todo-list {
110 |   margin: 0;
111 |   padding: 0;
112 |   list-style: none;
113 | }
114 | 
115 | .todo-list li {
116 |   position: relative;
117 |   font-size: 24px;
118 |   border-bottom: 1px solid #ededed;
119 | }
120 | 
121 | .todo-list li:last-child {
122 |   border-bottom: none;
123 | }
124 | 
125 | .todo-list li.editing {
126 |   border-bottom: none;
127 |   padding: 0;
128 | }
129 | 
130 | .todo-list li.editing .edit {
131 |   display: block;
132 |   width: 506px;
133 |   padding: 12px 16px;
134 |   margin: 0 0 0 43px;
135 | }
136 | 
137 | .todo-list li.editing .view {
138 |   display: none;
139 | }
140 | 
141 | .todo-list li .toggle {
142 |   text-align: center;
143 |   width: 40px;
144 |   /* auto, since non-WebKit browsers doesn't support input styling */
145 |   height: auto;
146 |   position: absolute;
147 |   top: 0;
148 |   bottom: 0;
149 |   margin: auto 0;
150 |   border: none; /* Mobile Safari */
151 |   -webkit-appearance: none;
152 |   appearance: none;
153 | }
154 | 
155 | .todo-list li .toggle:after {
156 |   content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="-10 -18 100 135"><circle cx="50" cy="50" r="50" fill="none" stroke="#ededed" stroke-width="3"/></svg>');
157 | }
158 | 
159 | .todo-list li .toggle:checked:after {
160 |   content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="-10 -18 100 135"><circle cx="50" cy="50" r="50" fill="none" stroke="#bddad5" stroke-width="3"/><path fill="#5dc2af" d="M72 25L42 71 27 56l-4 4 20 20 34-52z"/></svg>');
161 | }
162 | 
163 | .todo-list li label {
164 |   word-break: break-all;
165 |   padding: 15px 60px 15px 15px;
166 |   margin-left: 45px;
167 |   display: block;
168 |   line-height: 1.2;
169 |   transition: color 0.4s;
170 | }
171 | 
172 | .todo-list li.completed label {
173 |   color: #d9d9d9;
174 |   text-decoration: line-through;
175 | }
176 | 
177 | .todo-list li .destroy {
178 |   display: none;
179 |   position: absolute;
180 |   top: 0;
181 |   right: 10px;
182 |   bottom: 0;
183 |   width: 40px;
184 |   height: 40px;
185 |   margin: auto 0;
186 |   font-size: 30px;
187 |   color: #cc9a9a;
188 |   margin-bottom: 11px;
189 |   transition: color 0.2s ease-out;
190 | }
191 | 
192 | .todo-list li .destroy:hover {
193 |   color: #af5b5e;
194 | }
195 | 
196 | .todo-list li .destroy:after {
197 |   content: '×';
198 | }
199 | 
200 | .todo-list li:hover .destroy {
201 |   display: block;
202 | }
203 | 
204 | .todo-list li .edit {
205 |   display: none;
206 | }
207 | 
208 | .todo-list li.editing:last-child {
209 |   margin-bottom: -1px;
210 | }
211 | 
212 | .footer {
213 |   color: #777;
214 |   padding: 10px 15px;
215 |   height: 20px;
216 |   text-align: center;
217 |   border-top: 1px solid #e6e6e6;
218 | }
219 | 
220 | .footer:before {
221 |   content: '';
222 |   position: absolute;
223 |   right: 0;
224 |   bottom: 0;
225 |   left: 0;
226 |   height: 50px;
227 |   overflow: hidden;
228 |   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 8px 0 -3px #f6f6f6,
229 |     0 9px 1px -3px rgba(0, 0, 0, 0.2), 0 16px 0 -6px #f6f6f6,
230 |     0 17px 2px -6px rgba(0, 0, 0, 0.2);
231 | }
232 | 
233 | .todo-count {
234 |   float: left;
235 |   text-align: left;
236 | }
237 | 
238 | .todo-count strong {
239 |   font-weight: 300;
240 | }
241 | 
242 | .animate {
243 |   transition: all 0.1s;
244 |   -webkit-transition: all 0.1s;
245 | }
246 | 
247 | .action-button {
248 |   position: relative;
249 |   width: 100%;
250 |   padding: 10px 40px;
251 |   margin: 0px 10px 10px 0px;
252 |   float: left;
253 |   border-radius: 10px;
254 |   font-family: 'Pacifico', cursive;
255 |   font-size: 25px;
256 |   background-color: rgba(175, 47, 47, 0.8);
257 |   border-bottom: 5px solid rgba(175, 47, 47, 1);
258 |   text-shadow: 0px -2px rgba(175, 47, 47, 1);
259 |   text-decoration: none;
260 |   color: #fff;
261 | }
262 | .action-button:active {
263 |   transform: translate(0px, 5px);
264 |   -webkit-transform: translate(0px, 5px);
265 |   border-bottom: 1px solid;
266 | }
267 | 
268 | /*
269 | 	Hack to remove background from Mobile Safari.
270 | 	Can't use it globally since it destroys checkboxes in Firefox
271 | */
272 | @media screen and (-webkit-min-device-pixel-ratio: 0) {
273 |   .todo-list li .toggle {
274 |     background: none;
275 |   }
276 | 
277 |   .todo-list li .toggle {
278 |     height: 40px;
279 |   }
280 | }
281 | 
282 | @media (max-width: 430px) {
283 |   .footer {
284 |     height: 50px;
285 |   }
286 | }
287 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/src/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html>
 3 |   <head>
 4 |     <meta charset="utf-8">
 5 |     <title>Blips Todo App Example</title>
 6 |     <link rel="shortcut icon" href="/favicon.ico">
 7 |     <link rel="stylesheet" href="index.css">
 8 |   </head>
 9 |   <body>
10 |     <div id="root">
11 |       <section class="todoapp">
12 |         <header class="header">
13 |           <h1>Todos</h1>
14 |           <input class="new-todo" placeholder="What needs to be done?" autofocus="" />
15 |         </header>
16 |         <main class="main"></main>
17 |         <footer class="footer">
18 |           <span class="todo-count"></span>
19 |         </footer>
20 |       </section>
21 |       <button type="button" name="button" class="action-button shadow animate blue">
22 |         <span>
23 |           Add fake todos from <b>GraphQL API</b>
24 |         </span>
25 |         <small>
26 |           <i>(fake.graphql.guru)</i>
27 |         </small>
28 |       </button>
29 |     </div>
30 |   </body>
31 | </html>
32 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/src/index.js:
--------------------------------------------------------------------------------
  1 | import { BlipsClient, } from 'blips'
  2 | 
  3 | import typeDefs from './schema/types'
  4 | import resolvers from './schema/resolvers'
  5 | import {
  6 |   allTodosQuery,
  7 |   allTodosSubscription,
  8 |   createTodoMutation,
  9 |   updateTodoMutation,
 10 |   deleteTodoMutation,
 11 | } from './operations'
 12 | import { renderTodos, renderTodoCount, } from './renderer'
 13 | 
 14 | // initial data
 15 | const initialState = {
 16 |   todos: {
 17 |     '3c4a086e-2151-4b54-acb2-13044ea553c1': {
 18 |       _id: '3c4a086e-2151-4b54-acb2-13044ea553c1',
 19 |       label: 'Buy milk',
 20 |       completed: false,
 21 |     },
 22 |     '4ecca858-67f8-491e-94cc-48b262061819': {
 23 |       _id: '4ecca858-67f8-491e-94cc-48b262061819',
 24 |       label: 'Learn Blips',
 25 |       completed: true,
 26 |     },
 27 |   },
 28 | }
 29 | 
 30 | // create the client
 31 | const client = new BlipsClient({ typeDefs, resolvers, }, initialState, {
 32 |   fetch: {
 33 |     uri: 'http://159.203.96.223/graphql',
 34 |   },
 35 | })
 36 | 
 37 | // renders the list of todos and the todo count
 38 | const render = todos => {
 39 |   renderTodos(todos, document.querySelector('.main'))
 40 |   renderTodoCount(todos, document.querySelector('.todo-count'))
 41 | }
 42 | 
 43 | const addFakeTodoFromList = async list => {
 44 |   if (list.length) {
 45 |     await client.mutate(createTodoMutation, { variables: { ...list.shift(), }, })
 46 |     addFakeTodoFromList(list)
 47 |   }
 48 | }
 49 | 
 50 | // init function:
 51 | // gets the initial list of todos to render and then it subscribes to all todos
 52 | const init = async () => {
 53 |   // get initial allTodos
 54 |   const { data: { allTodos: todos, }, } = await client.query(allTodosQuery)
 55 |   render(todos)
 56 | 
 57 |   // subscribe to allTodos
 58 |   const observable = await client.subscribe(allTodosSubscription)
 59 |   observable.subscribe(({ data: { allTodos, }, }) => {
 60 |     render(allTodos)
 61 |   })
 62 | }
 63 | 
 64 | // creating new todos:
 65 | // use client.mutate with the `createTodoMutation` to add a new todo
 66 | document.querySelector('.new-todo').addEventListener('keyup', async e => {
 67 |   // if key !== Enter
 68 |   if (e.keyCode !== 13) return
 69 | 
 70 |   // reset the input value after the mutation
 71 |   await client.mutate(createTodoMutation, {
 72 |     variables: { label: e.target.value, },
 73 |   })
 74 |   e.target.value = ''
 75 | })
 76 | 
 77 | // list click handlers using event delegation
 78 | 
 79 | // toggle handler
 80 | const handleToggle = async e => {
 81 |   // prevent default behaviour because the checkox should be un/checked programatically
 82 |   e.preventDefault()
 83 |   const { target: { dataset: { id, }, checked, }, } = e
 84 | 
 85 |   // use client.mutate with `updateTodoMutation` to update the completion state of the todo.
 86 |   // `updateTodoMutation` should patch the todo, so we don't need to send the entire payload
 87 |   id &&
 88 |     client.mutate(updateTodoMutation, { variables: { id, completed: checked, }, })
 89 | }
 90 | 
 91 | // remove handler
 92 | const handleRemove = e => {
 93 |   const { target: { dataset: { id, }, }, } = e
 94 | 
 95 |   // use client.mutate with `deleteTodoMutation` to remove a todo
 96 |   id && client.mutate(deleteTodoMutation, { variables: { id, }, })
 97 | }
 98 | 
 99 | // use this to trigger different handlers based on the target element tagName:
100 | // clicking on `input` and `label` will toggle the completion state of the todo.
101 | // clicking on `button` will remove the todo.
102 | const clickHandlerMap = {
103 |   INPUT: handleToggle,
104 |   BUTTON: handleRemove,
105 | }
106 | 
107 | // list-wrapper click handler
108 | const handleListClick = e => {
109 |   // get the correct handler for the clicked element
110 |   const fn = clickHandlerMap[e.target.tagName]
111 |   // call it
112 |   fn && fn(e)
113 | }
114 | 
115 | // set click event listener on the list-wrapper
116 | document.querySelector('.main').addEventListener('click', handleListClick)
117 | 
118 | // make API call to a graphql-server
119 | const query = `
120 |   query fakeListQuery($count: Int!) {
121 |     FakeList(length: $count) {
122 |       label: sentence
123 |       completed: boolean
124 |       id
125 |     }
126 |   }
127 | `
128 | 
129 | const variables = {
130 |   count: 3,
131 | }
132 | 
133 | const addFakeTodos = async () => {
134 |   const { data: { FakeList: list, }, } = await client.fetch(query, {
135 |     variables,
136 |   })
137 |   addFakeTodoFromList(list)
138 | }
139 | 
140 | document.querySelector('button').addEventListener('click', addFakeTodos)
141 | 
142 | // init!
143 | init()
144 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/src/operations.js:
--------------------------------------------------------------------------------
 1 | export const allTodosQuery = `
 2 |   query allTodosQuery {
 3 |     allTodos {
 4 |       id
 5 |       label
 6 |       completed
 7 |     }
 8 |   }
 9 | `
10 | 
11 | export const allTodosSubscription = `
12 |   subscription allTodosSubscription {
13 |     allTodos {
14 |       id
15 |       label
16 |       completed
17 |     }
18 |   }
19 | `
20 | 
21 | export const createTodoMutation = `
22 |   mutation createTodoMutation($label: String!, $completed: Boolean) {
23 |     createTodo(label: $label, completed: $completed) {
24 |       id
25 |       label
26 |       completed
27 |     }
28 |   }
29 | `
30 | 
31 | export const updateTodoMutation = `
32 |   mutation updateTodoMutation($id: String!, $label: String, $completed: Boolean) {
33 |     updateTodo(id: $id, label: $label, completed: $completed) {
34 |       id
35 |       label
36 |       completed
37 |     }
38 |   }
39 | `
40 | 
41 | export const deleteTodoMutation = `
42 |   mutation deleteTodoMutation($id: String!) {
43 |     deleteTodo(id: $id) {
44 |       id
45 |       label
46 |       completed
47 |     }
48 |   }
49 | `
50 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/src/renderer.js:
--------------------------------------------------------------------------------
 1 | // This module handles creating and adding elements to the DOM.
 2 | // It doesn't teach you how to use Blips, it just creates and renders the todo list.
 3 | 
 4 | export const renderTodos = (todos, container) => {
 5 |   const ul = document.createElement('UL')
 6 |   ul.className = 'todo-list'
 7 | 
 8 |   for (const todo of todos) {
 9 |     ul.appendChild(createLi(todo))
10 |   }
11 | 
12 |   container.innerHTML = ''
13 |   container.appendChild(ul)
14 | }
15 | 
16 | export const renderTodoCount = (todos, container) => {
17 |   const remainingTodos = todos.filter(({ completed, }) => !completed)
18 |   const remainingTodosCount = remainingTodos.length
19 |   const isSingular = remainingTodosCount === 1
20 | 
21 |   container.innerHTML = `<strong>${remainingTodosCount}</strong> ${
22 |     isSingular ? 'item' : 'items'
23 |   } left`
24 | }
25 | 
26 | const createLi = todo => {
27 |   const li = document.createElement('LI')
28 |   li.dataset.key = todo.id
29 |   li.className = todo.completed ? 'completed' : ''
30 | 
31 |   const view = document.createElement('DIV')
32 |   view.className = 'view'
33 | 
34 |   const input = document.createElement('INPUT')
35 |   input.id = `input-${todo.id}`
36 |   input.type = 'checkbox'
37 |   input.className = 'toggle'
38 | 
39 |   const label = document.createElement('LABEL')
40 |   label.htmlFor = input.id
41 | 
42 |   const button = document.createElement('BUTTON')
43 |   button.className = 'destroy'
44 | 
45 |   input.checked = todo.completed
46 |   input.dataset.id = todo.id
47 | 
48 |   label.textContent = todo.label
49 | 
50 |   button.dataset.id = todo.id
51 | 
52 |   view.appendChild(input)
53 |   view.appendChild(label)
54 |   view.appendChild(button)
55 | 
56 |   li.appendChild(view)
57 | 
58 |   return li
59 | }
60 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/src/schema/resolvers.js:
--------------------------------------------------------------------------------
 1 | import uuid from 'uuid'
 2 | 
 3 | // If you need to set-up subscriptions, you will have to return a function.
 4 | // It's first argument is an object containing the `PubSub` instance of the store and the `withFilter` helper.
 5 | // See https://github.com/apollographql/graphql-subscriptions - to learn more about `PubSub` and `withFilter`
 6 | //
 7 | // If you don't want subscriptions, you don't need to access to `pubsub` or `withFilter`
 8 | // so you can export just an object
 9 | 
10 | // Read http://graphql.org/learn/execution/#root-fields-resolvers
11 | // if you have no idea about what resolvers are
12 | 
13 | export default ({ pubsub, withFilter, }) => ({
14 |   Todo: {
15 |     // transform _id to id
16 |     id: ({ id, _id, }, args, context) => _id || id,
17 |   },
18 |   Query: {
19 |     allTodos: (_, args, { store, }) => {
20 |       return Object.values(store.get('todos'))
21 |     },
22 |   },
23 |   Mutation: {
24 |     createTodo: (_, { label, completed = false, }, { store, }) => {
25 |       const id = uuid()
26 |       const modified = store.post(
27 |         'todos',
28 |         {
29 |           _id: id,
30 |           label,
31 |           completed,
32 |         },
33 |         id
34 |       )
35 |       pubsub.publish('TODO_CREATED')
36 |       return modified
37 |     },
38 |     updateTodo: (_, { id, label, completed, }, { store, }) => {
39 |       const modified = store.patch(
40 |         'todos',
41 |         {
42 |           label,
43 |           completed,
44 |         },
45 |         id
46 |       )
47 |       pubsub.publish('TODO_UPDATED', { id, })
48 |       return modified
49 |     },
50 |     deleteTodo: (_, { id, }, { store, }) => {
51 |       const modified = store.delete('todos', id)
52 |       pubsub.publish('TODO_DELETED')
53 |       return modified
54 |     },
55 |   },
56 |   Subscription: {
57 |     allTodos: {
58 |       resolve: (_, args, { store, }) => Object.values(store.get('todos')),
59 |       subscribe: () =>
60 |         pubsub.asyncIterator([ 'TODO_UPDATED', 'TODO_CREATED', 'TODO_DELETED', ]),
61 |     },
62 |   },
63 | })
64 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/src/schema/types.js:
--------------------------------------------------------------------------------
 1 | // See http://graphql.org/learn/schema/ to learn more about schemas and types
 2 | 
 3 | export default `
 4 |   type Todo {
 5 |     id: String!
 6 |     label: String!
 7 |     completed: Boolean
 8 |   }
 9 | 
10 |   type Query {
11 |     allTodos: [Todo]!
12 |   }
13 | 
14 |   type Mutation {
15 |     createTodo(label: String!, completed: Boolean): Todo!
16 |     updateTodo(id: String!, label: String, completed: Boolean): Todo!
17 |     deleteTodo(id: String!): Todo!
18 |   }
19 | 
20 |   type Subscription {
21 |     allTodos: [Todo]!
22 |   }
23 | `
24 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/webpack.common.js:
--------------------------------------------------------------------------------
 1 | const path = require('path')
 2 | const HtmlWebpackPlugin = require('html-webpack-plugin')
 3 | const CleanWebpackPlugin = require('clean-webpack-plugin')
 4 | const CopyWebpackPlugin = require('copy-webpack-plugin')
 5 | 
 6 | module.exports = {
 7 |   entry: [
 8 |     // polyfills
 9 |     require.resolve('./polyfills'),
10 |     // app entry
11 |     './src/index.js',
12 |   ],
13 |   output: {
14 |     path: path.resolve(__dirname, 'dist'),
15 |     filename: 'bundle.[hash:8].js',
16 |   },
17 |   module: {
18 |     rules: [
19 |       {
20 |         exclude: [
21 |           /\.html$/,
22 |           /\.(js|jsx)(\?.*)?$/,
23 |           /\.(css|sass|scss|less)(\?.*)?$/,
24 |           /\.json$/,
25 |           /\.bmp$/,
26 |           /\.gif$/,
27 |           /\.jpe?g$/,
28 |           /\.png$/,
29 |         ],
30 |         use: [
31 |           {
32 |             loader: require.resolve('file-loader'),
33 |             options: {
34 |               name: '[name].[hash:8].[ext]',
35 |             },
36 |           },
37 |         ],
38 |       },
39 |       {
40 |         test: /\.css$/,
41 |         use: [ { loader: 'style-loader', }, { loader: 'css-loader', }, ],
42 |       },
43 |       {
44 |         test: /\.(js|jsx)$/,
45 |         use: 'babel-loader',
46 |       },
47 |       {
48 |         test: [ /\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/, ],
49 |         use: [
50 |           {
51 |             loader: require.resolve('url-loader'),
52 |             options: {
53 |               limit: 10000,
54 |               name: '[name].[hash:8].[ext]',
55 |             },
56 |           },
57 |         ],
58 |       },
59 |     ],
60 |   },
61 |   plugins: [
62 |     new CleanWebpackPlugin([ 'dist', ]),
63 |     new HtmlWebpackPlugin({ template: './src/index.html', }),
64 |     new CopyWebpackPlugin([
65 |       { from: 'src/favicon.ico', },
66 |       { from: 'src/index.css', },
67 |     ]),
68 |   ],
69 |   node: {
70 |     dgram: 'empty',
71 |     fs: 'empty',
72 |     net: 'empty',
73 |     tls: 'empty',
74 |   },
75 | }
76 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/webpack.dev.js:
--------------------------------------------------------------------------------
 1 | const merge = require('webpack-merge')
 2 | const common = require('./webpack.common.js')
 3 | 
 4 | module.exports = merge(common, {
 5 |   devtool: 'inline-source-map',
 6 |   devServer: {
 7 |     contentBase: './dist',
 8 |   },
 9 | })
10 | 


--------------------------------------------------------------------------------
/examples/todos-vanillajs/webpack.prod.js:
--------------------------------------------------------------------------------
1 | const merge = require('webpack-merge')
2 | const UglifyJSPlugin = require('uglifyjs-webpack-plugin')
3 | const common = require('./webpack.common.js')
4 | 
5 | module.exports = merge(common, {
6 |   plugins: [ new UglifyJSPlugin(), ],
7 | })
8 | 


--------------------------------------------------------------------------------
/logo/blips-logo-dark-text.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/monojack/blips/a6414b9464899d5e7a7ac38c32c647daee1e6e16/logo/blips-logo-dark-text.png


--------------------------------------------------------------------------------
/logo/blips-logo-dark-text.svg:
--------------------------------------------------------------------------------
  1 | <?xml version="1.0" encoding="UTF-8" standalone="no"?>
  2 | <svg
  3 |    xmlns:dc="http://purl.org/dc/elements/1.1/"
  4 |    xmlns:cc="http://creativecommons.org/ns#"
  5 |    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
  6 |    xmlns:svg="http://www.w3.org/2000/svg"
  7 |    xmlns="http://www.w3.org/2000/svg"
  8 |    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
  9 |    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
 10 |    viewBox="0 0 225 92.80764"
 11 |    version="1.1"
 12 |    id="svg4559"
 13 |    sodipodi:docname="blips-logo.svg"
 14 |    width="225"
 15 |    height="92.80764"
 16 |    inkscape:version="0.92.1 r15371"
 17 |    inkscape:export-filename="/home/iachim/Documents/blips-logo.svg.png"
 18 |    inkscape:export-xdpi="96"
 19 |    inkscape:export-ydpi="96">
 20 |   <metadata
 21 |      id="metadata4565">
 22 |     <rdf:RDF>
 23 |       <cc:Work
 24 |          rdf:about="">
 25 |         <dc:format>image/svg+xml</dc:format>
 26 |         <dc:type
 27 |            rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
 28 |         <dc:title />
 29 |       </cc:Work>
 30 |     </rdf:RDF>
 31 |   </metadata>
 32 |   <defs
 33 |      id="defs4563" />
 34 |   <sodipodi:namedview
 35 |      pagecolor="#ffffff"
 36 |      bordercolor="#666666"
 37 |      borderopacity="1"
 38 |      objecttolerance="10"
 39 |      gridtolerance="10"
 40 |      guidetolerance="10"
 41 |      inkscape:pageopacity="0"
 42 |      inkscape:pageshadow="2"
 43 |      inkscape:window-width="1920"
 44 |      inkscape:window-height="1025"
 45 |      id="namedview4561"
 46 |      showgrid="false"
 47 |      inkscape:snap-bbox="true"
 48 |      inkscape:snap-global="false"
 49 |      inkscape:zoom="4.085"
 50 |      inkscape:cx="122.00721"
 51 |      inkscape:cy="44.732752"
 52 |      inkscape:window-x="0"
 53 |      inkscape:window-y="27"
 54 |      inkscape:window-maximized="1"
 55 |      inkscape:current-layer="g4526" />
 56 |   <g
 57 |      id="g5277"
 58 |      style="fill:#e82463;fill-opacity:1"
 59 |      transform="matrix(0.95631802,0,0,0.95631802,-65.129181,-330.74463)">
 60 |     <g
 61 |        id="g6015"
 62 |        transform="rotate(10.877975,116.62752,394.37556)">
 63 |       <g
 64 |          id="g4526">
 65 |         <g
 66 |            transform="matrix(0.13894173,0.13159341,-0.13159341,0.13894173,115.11453,340.30915)"
 67 |            id="g5249"
 68 |            style="fill:#e82463;fill-opacity:1">
 69 |           <path
 70 |              style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;vector-effect:none;fill:#e82463;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:8;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
 71 |              d="m 85.857422,112.81055 c -39.827992,0 -72.201172,32.37318 -72.201172,72.20117 0,39.828 32.373181,72.20117 72.201172,72.20117 39.827998,0 72.201168,-32.37318 72.201168,-72.20117 0,-5.53097 -0.68136,-10.89557 -1.86328,-16.07227 l -7.7832,1.78711 c 1.04305,4.59874 1.64453,9.36697 1.64453,14.28516 0,35.50447 -28.69475,64.20117 -64.199218,64.20117 -35.504471,0 -64.201173,-28.6967 -64.201172,-64.20117 0,-35.50447 28.6967,-64.20117 64.201172,-64.20117 4.265146,0 8.429102,0.42363 12.458984,1.21484 l -1.085937,5.49219 -1.867188,9.44726 c -3.076161,-0.60959 -6.252888,-0.93554 -9.505859,-0.93554 -27.004932,0 -48.982422,21.97749 -48.982422,48.98242 0,27.00494 21.977489,48.98242 48.982422,48.98242 27.004938,0 48.982418,-21.97749 48.982418,-48.98242 0,-3.74573 -0.51012,-7.35819 -1.31054,-10.86524 l -7.76953,1.78516 c 0.66136,2.9285 1.08007,5.94785 1.08007,9.08008 0,22.68141 -18.301,40.98242 -40.982418,40.98242 -22.681411,0 -40.984375,-18.30101 -40.984375,-40.98242 2e-6,-22.68141 18.302964,-40.98242 40.984375,-40.98242 2.724164,0 5.38243,0.27039 7.955078,0.77539 l -2.208984,11.18554 c -1.859964,-0.36971 -3.780037,-0.5664 -5.746094,-0.5664 -16.294217,0 -29.589842,13.29367 -29.589844,29.58789 -10e-7,16.29422 13.295627,29.58984 29.589844,29.58984 16.294218,0 29.587888,-13.29562 29.587888,-29.58984 0,-2.25046 -0.30511,-4.42239 -0.78515,-6.53125 l -7.76954,1.78515 c 0.34101,1.53023 0.55469,3.10938 0.55469,4.7461 0,11.9707 -9.617189,21.58984 -21.587888,21.58984 -11.9707,0 -21.589843,-9.61914 -21.589844,-21.58984 3e-6,-11.9707 9.619144,-21.58988 21.589844,-21.58984 1.437482,0 2.838741,0.14276 4.195312,0.4082 l -2.30664,11.67578 c 0.232116,0.0463 0.46239,0.10121 0.689453,0.16406 0.256742,0.0711 0.506702,0.1584 0.755859,0.25 a 9.6982744,9.6982744 0 0 0 -0.755859,-0.25 9.6982744,9.6982744 0 0 0 -0.689453,-0.16406 c -0.559724,-0.11305 -1.12834,-0.17645 -1.699219,-0.18945 -0.646765,-0.0131 -1.293215,0.0386 -1.929687,0.15429 -5.269406,0.96103 -8.761973,6.01187 -7.800782,11.28125 0.961031,5.2694 6.011874,8.76197 11.28125,7.80078 5.269406,-0.96103 8.761972,-6.01187 7.800782,-11.28125 -0.02521,-0.11638 -0.05256,-0.23228 -0.08203,-0.34765 -0.397328,-1.80864 -1.304149,-3.46572 -2.613281,-4.77539 -0.03428,-0.0315 -0.06879,-0.0627 -0.103516,-0.0937 a 9.6982744,9.6982744 0 0 0 -0.652343,-0.57227 c 0.224574,0.18179 0.443797,0.37 0.652343,0.57227 l 8.199219,-8.62891 5.47851,-5.76562 7.87696,-8.28907 5.47265,-5.75781 6.69141,-7.04297 3.82812,-4.02734 5.47266,-5.75977 c -9.73947,-9.28428 -22.04731,-15.88996 -35.753904,-18.59765 -4.532834,-0.89545 -9.21454,-1.375 -14.007812,-1.375 z m 4.4375,63.59179 c 0.07737,0.04 0.15029,0.0869 0.226562,0.12891 a 9.6982744,9.6982744 0 0 0 -0.226562,-0.12891 z m 1.08789,0.66407 c 0.124887,0.0869 0.250234,0.17274 0.371094,0.26562 a 9.6982744,9.6982744 0 0 0 -0.371094,-0.26562 z"
 72 |              transform="matrix(2.5238967,0.46034834,-0.46034834,2.5238967,68.42394,-306.67733)"
 73 |              id="path5906"
 74 |              inkscape:connector-curvature="0" />
 75 |         </g>
 76 |         <ellipse
 77 |            transform="rotate(-10.336883)"
 78 |            style="opacity:1;vector-effect:none;fill:#e82463;fill-opacity:1;stroke:none;stroke-width:4.65101433;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
 79 |            id="path4977"
 80 |            cx="36.205364"
 81 |            cy="388.21545"
 82 |            rx="5.7613835"
 83 |            ry="5.761384" />
 84 |         <circle
 85 |            transform="rotate(-10.336883)"
 86 |            style="opacity:1;vector-effect:none;fill:#e82463;fill-opacity:1;stroke:none;stroke-width:4.65101433;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
 87 |            id="path4977-2"
 88 |            cx="34.341152"
 89 |            cy="416.96411"
 90 |            r="5.7613835" />
 91 |         <circle
 92 |            transform="rotate(-10.336883)"
 93 |            style="opacity:1;vector-effect:none;fill:#e82463;fill-opacity:1;stroke:none;stroke-width:4.65101433;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
 94 |            id="path4977-7"
 95 |            cx="53.245792"
 96 |            cy="428.9166"
 97 |            r="5.7613835" />
 98 |       </g>
 99 |     </g>
100 |     <g
101 |        aria-label="Blips"
102 |        style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:53.64361572px;line-height:1.25;font-family:'Noto Sans CJK TC';-inkscape-font-specification:'Noto Sans CJK TC Bold';letter-spacing:0px;word-spacing:0px;fill:#333333;fill-opacity:1;stroke:none;stroke-width:1.34109032"
103 |        id="text5993"
104 |        transform="matrix(1.0370945,0,0,1.0370945,-10.074227,-11.540707)">
105 |       <path
106 |          d="m 165.69961,414.04425 h 14.16191 c 8.74391,0 15.39572,-3.70141 15.39572,-11.69431 0,-5.36436 -3.16497,-8.3684 -7.45646,-9.38763 v -0.26822 c 3.37955,-1.18016 5.418,-4.93521 5.418,-8.58298 0,-7.40282 -6.22266,-9.76314 -14.37649,-9.76314 h -13.14268 z m 7.93925,-23.54955 v -10.085 h 4.72064 c 4.77428,0 7.1346,1.39474 7.1346,4.88157 0,3.16498 -2.19939,5.20343 -7.24189,5.20343 z m 0,17.43418 V 396.3955 h 5.5253 c 5.47164,0 8.3684,1.60931 8.3684,5.47165 0,4.13056 -2.9504,6.06173 -8.3684,6.06173 z"
107 |          style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:'Noto Sans CJK TC';-inkscape-font-specification:'Noto Sans CJK TC Bold';fill:#333333;fill-opacity:1;stroke-width:1.34109032"
108 |          id="path5999"
109 |          inkscape:connector-curvature="0" />
110 |       <path
111 |          d="m 209.02437,414.79526 c 1.82388,0 3.16497,-0.32186 4.07691,-0.69737 l -0.96558,-5.84715 c -0.53644,0.10729 -0.75101,0.10729 -1.07287,0.10729 -0.75101,0 -1.60931,-0.59008 -1.60931,-2.36032 v -34.76106 h -7.83197 v 34.38555 c 0,5.57894 1.93117,9.17306 7.40282,9.17306 z"
112 |          style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:'Noto Sans CJK TC';-inkscape-font-specification:'Noto Sans CJK TC Bold';fill:#333333;fill-opacity:1;stroke-width:1.34109032"
113 |          id="path6001"
114 |          inkscape:connector-curvature="0" />
115 |       <path
116 |          d="m 218.48995,414.04425 h 7.83197 v -30.04042 h -7.83197 z m 3.96963,-34.86835 c 2.68218,0 4.66699,-1.82388 4.66699,-4.29149 0,-2.57489 -1.98481,-4.29149 -4.66699,-4.29149 -2.73583,0 -4.72064,1.7166 -4.72064,4.29149 0,2.46761 1.98481,4.29149 4.72064,4.29149 z"
117 |          style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:'Noto Sans CJK TC';-inkscape-font-specification:'Noto Sans CJK TC Bold';fill:#333333;fill-opacity:1;stroke-width:1.34109032"
118 |          id="path6003"
119 |          inkscape:connector-curvature="0" />
120 |       <path
121 |          d="m 234.83449,425.57763 h 7.83197 v -9.11942 l -0.21457,-4.93521 c 2.30667,2.0921 4.82792,3.27226 7.45646,3.27226 6.59817,0 12.76718,-5.95444 12.76718,-16.25401 0,-9.22671 -4.39878,-15.28843 -11.80159,-15.28843 -3.21862,0 -6.32995,1.71659 -8.8512,3.86234 h -0.21458 l -0.53643,-3.11133 h -6.43724 z m 13.30362,-17.27325 c -1.60931,0 -3.54048,-0.59008 -5.47165,-2.25303 v -13.19633 c 2.0921,-2.0921 3.91599,-3.11133 5.95444,-3.11133 4.13056,0 5.95445,3.16498 5.95445,8.90484 0,6.54452 -2.78947,9.65585 -6.43724,9.65585 z"
122 |          style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:'Noto Sans CJK TC';-inkscape-font-specification:'Noto Sans CJK TC Bold';fill:#333333;fill-opacity:1;stroke-width:1.34109032"
123 |          id="path6005"
124 |          inkscape:connector-curvature="0" />
125 |       <path
126 |          d="m 277.67814,414.79526 c 7.83197,0 11.96253,-4.23784 11.96253,-9.49492 0,-5.57893 -4.39878,-7.56375 -8.36841,-9.06577 -3.16497,-1.18016 -6.11537,-1.98481 -6.11537,-4.1842 0,-1.7166 1.28745,-2.89676 3.96963,-2.89676 2.25303,0 4.34513,1.07288 6.49087,2.5749 l 3.54048,-4.77429 c -2.52125,-1.87752 -5.84715,-3.7014 -10.24593,-3.7014 -6.75909,0 -11.15787,3.80869 -11.15787,9.2267 0,4.98885 4.39878,7.29553 8.20747,8.74391 3.16498,1.2338 6.27631,2.25303 6.27631,4.50606 0,1.87753 -1.34109,3.16497 -4.34514,3.16497 -2.78946,0 -5.36436,-1.18016 -8.04654,-3.27226 l -3.59412,4.93522 c 2.9504,2.4676 7.40282,4.23784 11.42609,4.23784 z"
127 |          style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:'Noto Sans CJK TC';-inkscape-font-specification:'Noto Sans CJK TC Bold';fill:#333333;fill-opacity:1;stroke-width:1.34109032"
128 |          id="path6007"
129 |          inkscape:connector-curvature="0" />
130 |     </g>
131 |   </g>
132 | </svg>
133 | 


--------------------------------------------------------------------------------
/logo/blips-logo-light-text.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/monojack/blips/a6414b9464899d5e7a7ac38c32c647daee1e6e16/logo/blips-logo-light-text.png


--------------------------------------------------------------------------------
/logo/blips-logo-light-text.svg:
--------------------------------------------------------------------------------
  1 | <?xml version="1.0" encoding="UTF-8" standalone="no"?>
  2 | <svg
  3 |    xmlns:dc="http://purl.org/dc/elements/1.1/"
  4 |    xmlns:cc="http://creativecommons.org/ns#"
  5 |    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
  6 |    xmlns:svg="http://www.w3.org/2000/svg"
  7 |    xmlns="http://www.w3.org/2000/svg"
  8 |    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
  9 |    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
 10 |    viewBox="0 0 225 92.80764"
 11 |    version="1.1"
 12 |    id="svg4559"
 13 |    sodipodi:docname="blips-logo-white.svg"
 14 |    width="225"
 15 |    height="92.80764"
 16 |    inkscape:version="0.92.1 r15371"
 17 |    inkscape:export-filename="/home/iachim/Documents/blips-logo.svg.png"
 18 |    inkscape:export-xdpi="96"
 19 |    inkscape:export-ydpi="96">
 20 |   <metadata
 21 |      id="metadata4565">
 22 |     <rdf:RDF>
 23 |       <cc:Work
 24 |          rdf:about="">
 25 |         <dc:format>image/svg+xml</dc:format>
 26 |         <dc:type
 27 |            rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
 28 |         <dc:title></dc:title>
 29 |       </cc:Work>
 30 |     </rdf:RDF>
 31 |   </metadata>
 32 |   <defs
 33 |      id="defs4563" />
 34 |   <sodipodi:namedview
 35 |      pagecolor="#ffffff"
 36 |      bordercolor="#666666"
 37 |      borderopacity="1"
 38 |      objecttolerance="10"
 39 |      gridtolerance="10"
 40 |      guidetolerance="10"
 41 |      inkscape:pageopacity="0"
 42 |      inkscape:pageshadow="2"
 43 |      inkscape:window-width="1920"
 44 |      inkscape:window-height="1025"
 45 |      id="namedview4561"
 46 |      showgrid="false"
 47 |      inkscape:snap-bbox="true"
 48 |      inkscape:snap-global="false"
 49 |      inkscape:zoom="4.085"
 50 |      inkscape:cx="122.00721"
 51 |      inkscape:cy="44.732752"
 52 |      inkscape:window-x="0"
 53 |      inkscape:window-y="27"
 54 |      inkscape:window-maximized="1"
 55 |      inkscape:current-layer="g5277" />
 56 |   <g
 57 |      id="g5277"
 58 |      style="fill:#e82463;fill-opacity:1"
 59 |      transform="matrix(0.95631802,0,0,0.95631802,-65.129181,-330.74463)">
 60 |     <g
 61 |        id="g6015"
 62 |        transform="rotate(10.877975,116.62752,394.37556)">
 63 |       <g
 64 |          id="g4526">
 65 |         <g
 66 |            transform="matrix(0.13894173,0.13159341,-0.13159341,0.13894173,115.11453,340.30915)"
 67 |            id="g5249"
 68 |            style="fill:#e82463;fill-opacity:1">
 69 |           <path
 70 |              style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;vector-effect:none;fill:#e82463;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:8;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
 71 |              d="m 85.857422,112.81055 c -39.827992,0 -72.201172,32.37318 -72.201172,72.20117 0,39.828 32.373181,72.20117 72.201172,72.20117 39.827998,0 72.201168,-32.37318 72.201168,-72.20117 0,-5.53097 -0.68136,-10.89557 -1.86328,-16.07227 l -7.7832,1.78711 c 1.04305,4.59874 1.64453,9.36697 1.64453,14.28516 0,35.50447 -28.69475,64.20117 -64.199218,64.20117 -35.504471,0 -64.201173,-28.6967 -64.201172,-64.20117 0,-35.50447 28.6967,-64.20117 64.201172,-64.20117 4.265146,0 8.429102,0.42363 12.458984,1.21484 l -1.085937,5.49219 -1.867188,9.44726 c -3.076161,-0.60959 -6.252888,-0.93554 -9.505859,-0.93554 -27.004932,0 -48.982422,21.97749 -48.982422,48.98242 0,27.00494 21.977489,48.98242 48.982422,48.98242 27.004938,0 48.982418,-21.97749 48.982418,-48.98242 0,-3.74573 -0.51012,-7.35819 -1.31054,-10.86524 l -7.76953,1.78516 c 0.66136,2.9285 1.08007,5.94785 1.08007,9.08008 0,22.68141 -18.301,40.98242 -40.982418,40.98242 -22.681411,0 -40.984375,-18.30101 -40.984375,-40.98242 2e-6,-22.68141 18.302964,-40.98242 40.984375,-40.98242 2.724164,0 5.38243,0.27039 7.955078,0.77539 l -2.208984,11.18554 c -1.859964,-0.36971 -3.780037,-0.5664 -5.746094,-0.5664 -16.294217,0 -29.589842,13.29367 -29.589844,29.58789 -10e-7,16.29422 13.295627,29.58984 29.589844,29.58984 16.294218,0 29.587888,-13.29562 29.587888,-29.58984 0,-2.25046 -0.30511,-4.42239 -0.78515,-6.53125 l -7.76954,1.78515 c 0.34101,1.53023 0.55469,3.10938 0.55469,4.7461 0,11.9707 -9.617189,21.58984 -21.587888,21.58984 -11.9707,0 -21.589843,-9.61914 -21.589844,-21.58984 3e-6,-11.9707 9.619144,-21.58988 21.589844,-21.58984 1.437482,0 2.838741,0.14276 4.195312,0.4082 l -2.30664,11.67578 c 0.232116,0.0463 0.46239,0.10121 0.689453,0.16406 0.256742,0.0711 0.506702,0.1584 0.755859,0.25 a 9.6982744,9.6982744 0 0 0 -0.755859,-0.25 9.6982744,9.6982744 0 0 0 -0.689453,-0.16406 c -0.559724,-0.11305 -1.12834,-0.17645 -1.699219,-0.18945 -0.646765,-0.0131 -1.293215,0.0386 -1.929687,0.15429 -5.269406,0.96103 -8.761973,6.01187 -7.800782,11.28125 0.961031,5.2694 6.011874,8.76197 11.28125,7.80078 5.269406,-0.96103 8.761972,-6.01187 7.800782,-11.28125 -0.02521,-0.11638 -0.05256,-0.23228 -0.08203,-0.34765 -0.397328,-1.80864 -1.304149,-3.46572 -2.613281,-4.77539 -0.03428,-0.0315 -0.06879,-0.0627 -0.103516,-0.0937 a 9.6982744,9.6982744 0 0 0 -0.652343,-0.57227 c 0.224574,0.18179 0.443797,0.37 0.652343,0.57227 l 8.199219,-8.62891 5.47851,-5.76562 7.87696,-8.28907 5.47265,-5.75781 6.69141,-7.04297 3.82812,-4.02734 5.47266,-5.75977 c -9.73947,-9.28428 -22.04731,-15.88996 -35.753904,-18.59765 -4.532834,-0.89545 -9.21454,-1.375 -14.007812,-1.375 z m 4.4375,63.59179 c 0.07737,0.04 0.15029,0.0869 0.226562,0.12891 a 9.6982744,9.6982744 0 0 0 -0.226562,-0.12891 z m 1.08789,0.66407 c 0.124887,0.0869 0.250234,0.17274 0.371094,0.26562 a 9.6982744,9.6982744 0 0 0 -0.371094,-0.26562 z"
 72 |              transform="matrix(2.5238967,0.46034834,-0.46034834,2.5238967,68.42394,-306.67733)"
 73 |              id="path5906"
 74 |              inkscape:connector-curvature="0" />
 75 |         </g>
 76 |         <ellipse
 77 |            transform="rotate(-10.336883)"
 78 |            style="opacity:1;vector-effect:none;fill:#e82463;fill-opacity:1;stroke:none;stroke-width:4.65101433;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
 79 |            id="path4977"
 80 |            cx="36.205364"
 81 |            cy="388.21545"
 82 |            rx="5.7613835"
 83 |            ry="5.761384" />
 84 |         <circle
 85 |            transform="rotate(-10.336883)"
 86 |            style="opacity:1;vector-effect:none;fill:#e82463;fill-opacity:1;stroke:none;stroke-width:4.65101433;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
 87 |            id="path4977-2"
 88 |            cx="34.341152"
 89 |            cy="416.96411"
 90 |            r="5.7613835" />
 91 |         <circle
 92 |            transform="rotate(-10.336883)"
 93 |            style="opacity:1;vector-effect:none;fill:#e82463;fill-opacity:1;stroke:none;stroke-width:4.65101433;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
 94 |            id="path4977-7"
 95 |            cx="53.245792"
 96 |            cy="428.9166"
 97 |            r="5.7613835" />
 98 |       </g>
 99 |     </g>
100 |     <g
101 |        aria-label="Blips"
102 |        style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-size:53.64361572px;line-height:1.25;font-family:'Noto Sans CJK TC';-inkscape-font-specification:'Noto Sans CJK TC Bold';letter-spacing:0px;word-spacing:0px;fill:#ffffff;fill-opacity:1;stroke:none;stroke-width:1.34109032"
103 |        id="text5993"
104 |        transform="matrix(1.0370945,0,0,1.0370945,-10.074227,-11.540707)">
105 |       <path
106 |          d="m 165.69961,414.04425 h 14.16191 c 8.74391,0 15.39572,-3.70141 15.39572,-11.69431 0,-5.36436 -3.16497,-8.3684 -7.45646,-9.38763 v -0.26822 c 3.37955,-1.18016 5.418,-4.93521 5.418,-8.58298 0,-7.40282 -6.22266,-9.76314 -14.37649,-9.76314 h -13.14268 z m 7.93925,-23.54955 v -10.085 h 4.72064 c 4.77428,0 7.1346,1.39474 7.1346,4.88157 0,3.16498 -2.19939,5.20343 -7.24189,5.20343 z m 0,17.43418 V 396.3955 h 5.5253 c 5.47164,0 8.3684,1.60931 8.3684,5.47165 0,4.13056 -2.9504,6.06173 -8.3684,6.06173 z"
107 |          style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:'Noto Sans CJK TC';-inkscape-font-specification:'Noto Sans CJK TC Bold';fill:#ffffff;fill-opacity:1;stroke-width:1.34109032"
108 |          id="path5999"
109 |          inkscape:connector-curvature="0" />
110 |       <path
111 |          d="m 209.02437,414.79526 c 1.82388,0 3.16497,-0.32186 4.07691,-0.69737 l -0.96558,-5.84715 c -0.53644,0.10729 -0.75101,0.10729 -1.07287,0.10729 -0.75101,0 -1.60931,-0.59008 -1.60931,-2.36032 v -34.76106 h -7.83197 v 34.38555 c 0,5.57894 1.93117,9.17306 7.40282,9.17306 z"
112 |          style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:'Noto Sans CJK TC';-inkscape-font-specification:'Noto Sans CJK TC Bold';fill:#ffffff;fill-opacity:1;stroke-width:1.34109032"
113 |          id="path6001"
114 |          inkscape:connector-curvature="0" />
115 |       <path
116 |          d="m 218.48995,414.04425 h 7.83197 v -30.04042 h -7.83197 z m 3.96963,-34.86835 c 2.68218,0 4.66699,-1.82388 4.66699,-4.29149 0,-2.57489 -1.98481,-4.29149 -4.66699,-4.29149 -2.73583,0 -4.72064,1.7166 -4.72064,4.29149 0,2.46761 1.98481,4.29149 4.72064,4.29149 z"
117 |          style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:'Noto Sans CJK TC';-inkscape-font-specification:'Noto Sans CJK TC Bold';fill:#ffffff;fill-opacity:1;stroke-width:1.34109032"
118 |          id="path6003"
119 |          inkscape:connector-curvature="0" />
120 |       <path
121 |          d="m 234.83449,425.57763 h 7.83197 v -9.11942 l -0.21457,-4.93521 c 2.30667,2.0921 4.82792,3.27226 7.45646,3.27226 6.59817,0 12.76718,-5.95444 12.76718,-16.25401 0,-9.22671 -4.39878,-15.28843 -11.80159,-15.28843 -3.21862,0 -6.32995,1.71659 -8.8512,3.86234 h -0.21458 l -0.53643,-3.11133 h -6.43724 z m 13.30362,-17.27325 c -1.60931,0 -3.54048,-0.59008 -5.47165,-2.25303 v -13.19633 c 2.0921,-2.0921 3.91599,-3.11133 5.95444,-3.11133 4.13056,0 5.95445,3.16498 5.95445,8.90484 0,6.54452 -2.78947,9.65585 -6.43724,9.65585 z"
122 |          style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:'Noto Sans CJK TC';-inkscape-font-specification:'Noto Sans CJK TC Bold';fill:#ffffff;fill-opacity:1;stroke-width:1.34109032"
123 |          id="path6005"
124 |          inkscape:connector-curvature="0" />
125 |       <path
126 |          d="m 277.67814,414.79526 c 7.83197,0 11.96253,-4.23784 11.96253,-9.49492 0,-5.57893 -4.39878,-7.56375 -8.36841,-9.06577 -3.16497,-1.18016 -6.11537,-1.98481 -6.11537,-4.1842 0,-1.7166 1.28745,-2.89676 3.96963,-2.89676 2.25303,0 4.34513,1.07288 6.49087,2.5749 l 3.54048,-4.77429 c -2.52125,-1.87752 -5.84715,-3.7014 -10.24593,-3.7014 -6.75909,0 -11.15787,3.80869 -11.15787,9.2267 0,4.98885 4.39878,7.29553 8.20747,8.74391 3.16498,1.2338 6.27631,2.25303 6.27631,4.50606 0,1.87753 -1.34109,3.16497 -4.34514,3.16497 -2.78946,0 -5.36436,-1.18016 -8.04654,-3.27226 l -3.59412,4.93522 c 2.9504,2.4676 7.40282,4.23784 11.42609,4.23784 z"
127 |          style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:'Noto Sans CJK TC';-inkscape-font-specification:'Noto Sans CJK TC Bold';fill:#ffffff;fill-opacity:1;stroke-width:1.34109032"
128 |          id="path6007"
129 |          inkscape:connector-curvature="0" />
130 |     </g>
131 |   </g>
132 | </svg>
133 | 


--------------------------------------------------------------------------------
/logo/blips-logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/monojack/blips/a6414b9464899d5e7a7ac38c32c647daee1e6e16/logo/blips-logo.png


--------------------------------------------------------------------------------
/logo/blips-logo.svg:
--------------------------------------------------------------------------------
  1 | <?xml version="1.0" encoding="UTF-8" standalone="no"?>
  2 | <svg
  3 |    xmlns:dc="http://purl.org/dc/elements/1.1/"
  4 |    xmlns:cc="http://creativecommons.org/ns#"
  5 |    xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
  6 |    xmlns:svg="http://www.w3.org/2000/svg"
  7 |    xmlns="http://www.w3.org/2000/svg"
  8 |    xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
  9 |    xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
 10 |    viewBox="0 0 115 115"
 11 |    version="1.1"
 12 |    id="svg4559"
 13 |    sodipodi:docname="blips-icon.svg"
 14 |    width="115"
 15 |    height="115"
 16 |    inkscape:version="0.92.1 r15371"
 17 |    inkscape:export-filename="/home/iachim/Code/@mono/blips/logo/blips-icon-white.png"
 18 |    inkscape:export-xdpi="96"
 19 |    inkscape:export-ydpi="96">
 20 |   <metadata
 21 |      id="metadata4565">
 22 |     <rdf:RDF>
 23 |       <cc:Work
 24 |          rdf:about="">
 25 |         <dc:format>image/svg+xml</dc:format>
 26 |         <dc:type
 27 |            rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
 28 |         <dc:title></dc:title>
 29 |       </cc:Work>
 30 |     </rdf:RDF>
 31 |   </metadata>
 32 |   <defs
 33 |      id="defs4563" />
 34 |   <sodipodi:namedview
 35 |      pagecolor="#ffffff"
 36 |      bordercolor="#666666"
 37 |      borderopacity="1"
 38 |      objecttolerance="10"
 39 |      gridtolerance="10"
 40 |      guidetolerance="10"
 41 |      inkscape:pageopacity="0"
 42 |      inkscape:pageshadow="2"
 43 |      inkscape:window-width="1920"
 44 |      inkscape:window-height="1025"
 45 |      id="namedview4561"
 46 |      showgrid="false"
 47 |      inkscape:snap-bbox="true"
 48 |      inkscape:snap-global="false"
 49 |      inkscape:zoom="4.085"
 50 |      inkscape:cx="102.42337"
 51 |      inkscape:cy="64.316596"
 52 |      inkscape:window-x="0"
 53 |      inkscape:window-y="27"
 54 |      inkscape:window-maximized="1"
 55 |      inkscape:current-layer="svg4559" />
 56 |   <g
 57 |      id="g5277"
 58 |      style="fill:#e82463;fill-opacity:1"
 59 |      transform="matrix(1.4107264,0,0,1.4105002,-106.98711,-498.76855)">
 60 |     <g
 61 |        id="g6015"
 62 |        transform="rotate(10.877975,116.62752,394.37556)">
 63 |       <g
 64 |          id="g4526">
 65 |         <g
 66 |            transform="matrix(0.13894173,0.13159341,-0.13159341,0.13894173,115.11453,340.30915)"
 67 |            id="g5249"
 68 |            style="fill:#e82463;fill-opacity:1">
 69 |           <path
 70 |              style="color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;opacity:1;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;vector-effect:none;fill:#e82463;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:8;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate"
 71 |              d="m 85.857422,112.81055 c -39.827992,0 -72.201172,32.37318 -72.201172,72.20117 0,39.828 32.373181,72.20117 72.201172,72.20117 39.827998,0 72.201168,-32.37318 72.201168,-72.20117 0,-5.53097 -0.68136,-10.89557 -1.86328,-16.07227 l -7.7832,1.78711 c 1.04305,4.59874 1.64453,9.36697 1.64453,14.28516 0,35.50447 -28.69475,64.20117 -64.199218,64.20117 -35.504471,0 -64.201173,-28.6967 -64.201172,-64.20117 0,-35.50447 28.6967,-64.20117 64.201172,-64.20117 4.265146,0 8.429102,0.42363 12.458984,1.21484 l -1.085937,5.49219 -1.867188,9.44726 c -3.076161,-0.60959 -6.252888,-0.93554 -9.505859,-0.93554 -27.004932,0 -48.982422,21.97749 -48.982422,48.98242 0,27.00494 21.977489,48.98242 48.982422,48.98242 27.004938,0 48.982418,-21.97749 48.982418,-48.98242 0,-3.74573 -0.51012,-7.35819 -1.31054,-10.86524 l -7.76953,1.78516 c 0.66136,2.9285 1.08007,5.94785 1.08007,9.08008 0,22.68141 -18.301,40.98242 -40.982418,40.98242 -22.681411,0 -40.984375,-18.30101 -40.984375,-40.98242 2e-6,-22.68141 18.302964,-40.98242 40.984375,-40.98242 2.724164,0 5.38243,0.27039 7.955078,0.77539 l -2.208984,11.18554 c -1.859964,-0.36971 -3.780037,-0.5664 -5.746094,-0.5664 -16.294217,0 -29.589842,13.29367 -29.589844,29.58789 -10e-7,16.29422 13.295627,29.58984 29.589844,29.58984 16.294218,0 29.587888,-13.29562 29.587888,-29.58984 0,-2.25046 -0.30511,-4.42239 -0.78515,-6.53125 l -7.76954,1.78515 c 0.34101,1.53023 0.55469,3.10938 0.55469,4.7461 0,11.9707 -9.617189,21.58984 -21.587888,21.58984 -11.9707,0 -21.589843,-9.61914 -21.589844,-21.58984 3e-6,-11.9707 9.619144,-21.58988 21.589844,-21.58984 1.437482,0 2.838741,0.14276 4.195312,0.4082 l -2.30664,11.67578 c 0.232116,0.0463 0.46239,0.10121 0.689453,0.16406 0.256742,0.0711 0.506702,0.1584 0.755859,0.25 a 9.6982744,9.6982744 0 0 0 -0.755859,-0.25 9.6982744,9.6982744 0 0 0 -0.689453,-0.16406 c -0.559724,-0.11305 -1.12834,-0.17645 -1.699219,-0.18945 -0.646765,-0.0131 -1.293215,0.0386 -1.929687,0.15429 -5.269406,0.96103 -8.761973,6.01187 -7.800782,11.28125 0.961031,5.2694 6.011874,8.76197 11.28125,7.80078 5.269406,-0.96103 8.761972,-6.01187 7.800782,-11.28125 -0.02521,-0.11638 -0.05256,-0.23228 -0.08203,-0.34765 -0.397328,-1.80864 -1.304149,-3.46572 -2.613281,-4.77539 -0.03428,-0.0315 -0.06879,-0.0627 -0.103516,-0.0937 a 9.6982744,9.6982744 0 0 0 -0.652343,-0.57227 c 0.224574,0.18179 0.443797,0.37 0.652343,0.57227 l 8.199219,-8.62891 5.47851,-5.76562 7.87696,-8.28907 5.47265,-5.75781 6.69141,-7.04297 3.82812,-4.02734 5.47266,-5.75977 c -9.73947,-9.28428 -22.04731,-15.88996 -35.753904,-18.59765 -4.532834,-0.89545 -9.21454,-1.375 -14.007812,-1.375 z m 4.4375,63.59179 c 0.07737,0.04 0.15029,0.0869 0.226562,0.12891 a 9.6982744,9.6982744 0 0 0 -0.226562,-0.12891 z m 1.08789,0.66407 c 0.124887,0.0869 0.250234,0.17274 0.371094,0.26562 a 9.6982744,9.6982744 0 0 0 -0.371094,-0.26562 z"
 72 |              transform="matrix(2.5238967,0.46034834,-0.46034834,2.5238967,68.42394,-306.67733)"
 73 |              id="path5906"
 74 |              inkscape:connector-curvature="0" />
 75 |         </g>
 76 |         <ellipse
 77 |            transform="rotate(-10.336883)"
 78 |            style="opacity:1;vector-effect:none;fill:#e82463;fill-opacity:1;stroke:none;stroke-width:4.65101433;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
 79 |            id="path4977"
 80 |            cx="36.205364"
 81 |            cy="388.21545"
 82 |            rx="5.7613835"
 83 |            ry="5.761384" />
 84 |         <circle
 85 |            transform="rotate(-10.336883)"
 86 |            style="opacity:1;vector-effect:none;fill:#e82463;fill-opacity:1;stroke:none;stroke-width:4.65101433;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
 87 |            id="path4977-2"
 88 |            cx="34.341152"
 89 |            cy="416.96411"
 90 |            r="5.7613835" />
 91 |         <circle
 92 |            transform="rotate(-10.336883)"
 93 |            style="opacity:1;vector-effect:none;fill:#e82463;fill-opacity:1;stroke:none;stroke-width:4.65101433;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
 94 |            id="path4977-7"
 95 |            cx="53.245792"
 96 |            cy="428.9166"
 97 |            r="5.7613835" />
 98 |       </g>
 99 |     </g>
100 |   </g>
101 | </svg>
102 | 


--------------------------------------------------------------------------------
/logo/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/monojack/blips/a6414b9464899d5e7a7ac38c32c647daee1e6e16/logo/favicon.ico


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "name": "blips",
  3 |   "version": "1.0.0",
  4 |   "description": "State management for the GraphQL heads",
  5 |   "repository": {
  6 |     "type": "git",
  7 |     "url": "git+https://github.com/monojack/blips.git"
  8 |   },
  9 |   "keywords": [
 10 |     "javascript",
 11 |     "blips",
 12 |     "graphql",
 13 |     "local",
 14 |     "store",
 15 |     "state",
 16 |     "immutable"
 17 |   ],
 18 |   "author": "Ionut Achim <achimvionut@gmail.com>",
 19 |   "main": "./lib/index.js",
 20 |   "module": "es/index.js",
 21 |   "jsnext:main": "es/index.js",
 22 |   "dependencies": {
 23 |     "apollo-fetch": "0.7.0",
 24 |     "graphql-subscriptions": "0.5.5",
 25 |     "graphql-tools": "2.12.0",
 26 |     "loose-envify": "1.3.1",
 27 |     "state-clerk": "1.3.0",
 28 |     "zen-observable": "0.6.0"
 29 |   },
 30 |   "devDependencies": {
 31 |     "babel-cli": "6.26.0",
 32 |     "babel-eslint": "8.0.3",
 33 |     "babel-jest": "21.2.0",
 34 |     "babel-plugin-external-helpers": "6.22.0",
 35 |     "babel-plugin-transform-async-generator-functions": "6.24.1",
 36 |     "babel-plugin-transform-class-properties": "6.24.1",
 37 |     "babel-plugin-transform-es2015-modules-commonjs": "6.26.0",
 38 |     "babel-plugin-transform-object-rest-spread": "6.26.0",
 39 |     "babel-preset-env": "1.6.1",
 40 |     "babel-preset-es2015": "6.24.1",
 41 |     "babel-preset-stage-0": "6.24.1",
 42 |     "cross-env": "5.1.1",
 43 |     "eslint": "4.13.1",
 44 |     "eslint-config-standard": "11.0.0-beta.0",
 45 |     "eslint-plugin-import": "2.8.0",
 46 |     "eslint-plugin-node": "5.2.1",
 47 |     "eslint-plugin-promise": "3.6.0",
 48 |     "eslint-plugin-standard": "3.0.1",
 49 |     "graphql": "0.11.7",
 50 |     "jest": "21.2.1",
 51 |     "rimraf": "2.6.2",
 52 |     "rollup": "0.52.1",
 53 |     "rollup-analyzer-plugin": "1.1.1",
 54 |     "rollup-plugin-babel": "3.0.2",
 55 |     "rollup-plugin-commonjs": "8.2.6",
 56 |     "rollup-plugin-node-builtins": "2.1.2",
 57 |     "rollup-plugin-node-resolve": "3.0.0",
 58 |     "rollup-plugin-replace": "2.0.0",
 59 |     "rollup-plugin-uglify": "2.0.1"
 60 |   },
 61 |   "license": "MIT",
 62 |   "bugs": {
 63 |     "url": "https://github.com/monojack/blips/issues"
 64 |   },
 65 |   "homepage": "http://blipsjs.org",
 66 |   "peerDependencies": {
 67 |     "graphql": "^0.11.7"
 68 |   },
 69 |   "scripts": {
 70 |     "build:cjs": "cross-env BABEL_ENV=cjs babel src --out-dir lib",
 71 |     "build:es": "cross-env BABEL_ENV=es babel src --out-dir es",
 72 |     "build:umd": "cross-env BABEL_ENV=rollup NODE_ENV=development rollup -c -o dist/blips.js",
 73 |     "build:umd:min": "cross-env BABEL_ENV=rollup NODE_ENV=production rollup -c -o dist/blips.min.js",
 74 |     "build": "npm run build:cjs && npm run build:es && npm run build:umd && npm run build:umd:min",
 75 |     "prepare": "npm run clean && npm run build",
 76 |     "lint": "eslint src",
 77 |     "clean": "rimraf lib dist es",
 78 |     "dev": "npm run build:es -- -w",
 79 |     "test": "cross-env BABEL_ENV=test jest",
 80 |     "test:watch": "cross-env BABEL_ENV=test jest --watch"
 81 |   },
 82 |   "jest": {
 83 |     "setupFiles": [
 84 |       "<rootDir>/config/jest/polyfills.js"
 85 |     ],
 86 |     "testMatch": [
 87 |       "<rootDir>/src/**/__tests__/**/*.js?(x)"
 88 |     ],
 89 |     "collectCoverageFrom": [
 90 |       "src/**/*.js?(x)",
 91 |       "!src/**/index.js?(x)",
 92 |       "!src/**/__tests__/**/*.mocks.js?(x)"
 93 |     ]
 94 |   },
 95 |   "npmName": "blips",
 96 |   "browserify": {
 97 |     "transform": [
 98 |       "loose-envify"
 99 |     ]
100 |   },
101 |   "files": [
102 |     "dist",
103 |     "lib",
104 |     "es",
105 |     "src"
106 |   ]
107 | }
108 | 


--------------------------------------------------------------------------------
/rollup.config.js:
--------------------------------------------------------------------------------
 1 | import resolve from 'rollup-plugin-node-resolve'
 2 | import commonjs from 'rollup-plugin-commonjs'
 3 | import babel from 'rollup-plugin-babel'
 4 | import replace from 'rollup-plugin-replace'
 5 | import uglify from 'rollup-plugin-uglify'
 6 | import analyze from 'rollup-analyzer-plugin'
 7 | import builtins from 'rollup-plugin-node-builtins'
 8 | 
 9 | const opts = { limit: 5, filter: [], root: __dirname, }
10 | 
11 | const env = process.env.NODE_ENV
12 | 
13 | const config = {
14 |   input: 'src/index.js',
15 |   external: [ 'graphql', ],
16 |   globals: {
17 |     graphql: 'GraphQL',
18 |   },
19 |   output: {
20 |     format: 'umd',
21 |   },
22 |   name: 'blips',
23 |   sourcemap: true,
24 |   plugins: [
25 |     resolve({
26 |       browser: true,
27 |       jsnext: true,
28 |     }),
29 |     builtins(),
30 |     babel({
31 |       exclude: '**/node_modules/**',
32 |     }),
33 |     replace({
34 |       'process.env.NODE_ENV': JSON.stringify(env),
35 |     }),
36 |     commonjs(),
37 |     analyze(opts),
38 |   ],
39 |   exports: 'named',
40 |   onwarn,
41 | }
42 | 
43 | if (env === 'production') {
44 |   config.plugins.push(
45 |     uglify({
46 |       compress: {
47 |         pure_getters: true,
48 |         unsafe: true,
49 |         unsafe_comps: true,
50 |         warnings: false,
51 |       },
52 |     })
53 |   )
54 | }
55 | 
56 | function onwarn (message) {
57 |   const suppressed = [ 'THIS_IS_UNDEFINED', ]
58 | 
59 |   if (!suppressed.find(code => message.code === code)) {
60 |     // eslint-disable-next-line
61 |     return console.warn(message.message)
62 |   }
63 | }
64 | 
65 | export default config
66 | 


--------------------------------------------------------------------------------
/src/BlipsClient.js:
--------------------------------------------------------------------------------
  1 | import { GraphQLError, execute, subscribe, validate, } from 'graphql'
  2 | import { makeExecutableSchema, } from 'graphql-tools/dist/schemaGenerator'
  3 | import { PubSub, withFilter, } from 'graphql-subscriptions'
  4 | import { createApolloFetch, } from 'apollo-fetch'
  5 | import Clerk from 'state-clerk'
  6 | 
  7 | import {
  8 |   when,
  9 |   isEmpty,
 10 |   isType,
 11 |   toObservable,
 12 |   extendContext,
 13 |   getDocument,
 14 |   promiseBatch,
 15 |   validateWithoutSchema,
 16 | } from './utils'
 17 | 
 18 | export const CLIENTGRAPHQL_DEPRECATION_WARNING = ` The "graphql" method is deprecated and will be removed in the 1.0 release. Use the "fetch" method instead.`
 19 | export const CREATESTORE_DEPRECATION_WARNING = `The "createStore" method is deprecated and will be removed in the 1.0 release. Use "new BlipsClient(...)" instead`
 20 | export const FETCH_NOT_CONFIGURED_ERROR = `You are trying to use "BlipsClient.fetch" without it being configured.`
 21 | export const NO_SUBSCRIPTION_ERROR = `No subscription operation defined in query`
 22 | export const LONE_SUBSCRIPTION_OPERATION_ERROR = `Only one subscription operation is allowed per query`
 23 | export const incorrectMiddlewareOrAfterwareType = (
 24 |   name = 'middleware/afterware'
 25 | ) => `The fetch ${name} must be a function or an array of functions`
 26 | 
 27 | const loggedWarnings = {}
 28 | 
 29 | export function BlipsClient (
 30 |   { typeDefs, resolvers, } = {},
 31 |   initialState,
 32 |   { variables = {}, context = {}, fetch = {}, } = {}
 33 | ) {
 34 |   const _pubsub = new PubSub()
 35 | 
 36 |   let _state
 37 |   let _schema
 38 |   let _resolvers
 39 |   let _clerk
 40 |   let _context
 41 |   let _variables
 42 |   let _apolloFetch
 43 | 
 44 |   function _validateDocument (sourceOrDocument) {
 45 |     let document = sourceOrDocument
 46 |     try {
 47 |       document = getDocument(sourceOrDocument)
 48 |     } catch (syntaxError) {
 49 |       return { document, errors: [ syntaxError, ], }
 50 |     }
 51 | 
 52 |     let errors = _schema
 53 |       ? validate(_schema, document)
 54 |       : validateWithoutSchema(document)
 55 | 
 56 |     return { document, ...(!isEmpty(errors) && { errors, }), }
 57 |   }
 58 | 
 59 |   function _runner (fn) {
 60 |     return function (
 61 |       document,
 62 |       { variables = {}, context = {}, } = {},
 63 |       operationName,
 64 |       resolveFn
 65 |     ) {
 66 |       return (0, fn)(
 67 |         _schema,
 68 |         document,
 69 |         {},
 70 |         extendContext(_context, context),
 71 |         { ..._variables, ...variables, },
 72 |         operationName,
 73 |         resolveFn
 74 |       )
 75 |     }
 76 |   }
 77 | 
 78 |   function _setUpMiddlewareOrAfterware (listOrFn, name) {
 79 |     if (!listOrFn) return
 80 | 
 81 |     if (isType('function', listOrFn)) {
 82 |       _apolloFetch.use(listOrFn)
 83 |     } else if (isType('array', listOrFn)) {
 84 |       for (const middleware of listOrFn) {
 85 |         _apolloFetch.use(middleware)
 86 |       }
 87 |     } else {
 88 |       throw new TypeError(incorrectMiddlewareOrAfterwareType(name))
 89 |     }
 90 |   }
 91 | 
 92 |   const _executor = _runner(execute)
 93 |   const _subscriber = _runner(subscribe)
 94 | 
 95 |   function _execute (operationType) {
 96 |     return (sourceOrDocument, options, operationName, resolveFn) => {
 97 |       const { document, errors, } = _validateDocument(sourceOrDocument)
 98 |       if (errors) return Promise.resolve({ errors, })
 99 | 
100 |       // If an operationName is provided, go ahead and execute that
101 |       if (operationName) {
102 |         return _executor(document, options, operationName, resolveFn)
103 |       }
104 | 
105 |       const executableOperations = document.definitions.filter(
106 |         definition => definition.operation === operationType
107 |       )
108 | 
109 |       // If there's just one operation definition of the correct type execute it
110 |       if (executableOperations.length === 1) {
111 |         return _executor(document, options, operationName, resolveFn)
112 |       }
113 | 
114 |       // otherwise:
115 |       return promiseBatch(
116 |         executableOperations.map(operation => {
117 |           return _executor(document, options, operation.name.value, resolveFn)
118 |         })
119 |       )
120 |     }
121 |   }
122 | 
123 |   ;(function constructor () {
124 |     // store the initial state
125 |     _state = { ...initialState, } || {}
126 | 
127 |     // create and store the clerk instance
128 |     _clerk = new Clerk(_state)
129 | 
130 |     // compute and store the resolvers
131 |     _resolvers = when(
132 |       typeof resolvers === 'function',
133 |       resolvers({ pubsub: _pubsub, withFilter, }),
134 |       resolvers
135 |     )
136 | 
137 |     _schema = makeExecutableSchema({
138 |       typeDefs,
139 |       resolvers: _resolvers,
140 |     })
141 | 
142 |     // store the default variables
143 |     _variables = variables
144 | 
145 |     // compute and store the default context
146 |     _context = extendContext(
147 |       {
148 |         // add store to the context.
149 |         // it will not be replaced by any `store` props passed through the default options
150 |         store: {
151 |           ..._clerk,
152 |         },
153 |       },
154 |       context
155 |     )
156 | 
157 |     // create apolloFetch
158 |     if (fetch.uri) {
159 |       _apolloFetch = createApolloFetch({ uri: fetch.uri, })
160 | 
161 |       // set up middleware and afterware
162 |       _setUpMiddlewareOrAfterware(fetch.middleware, 'middleware')
163 |       _setUpMiddlewareOrAfterware(fetch.afterware, 'afterware')
164 |     }
165 |   })()
166 | 
167 |   return {
168 |     /**
169 |      * returns the state object
170 |      * @return {Object}
171 |      */
172 |     get state () {
173 |       return _state
174 |     },
175 | 
176 |     /**
177 |      * returns the schema
178 |      * @return {GraphQLSchema}
179 |      */
180 |     get schema () {
181 |       return _schema
182 |     },
183 | 
184 |     query: _execute('query'),
185 | 
186 |     mutate: _execute('mutation'),
187 | 
188 |     subscribe: async (sourceOrDocument, options, operationName, resolveFn) => {
189 |       const { document, errors, } = _validateDocument(sourceOrDocument)
190 |       if (errors) return Promise.resolve({ errors, })
191 | 
192 |       const operations = document.definitions.filter(
193 |         definition => definition.operation === 'subscription'
194 |       )
195 | 
196 |       if (operations.length < 1) {
197 |         return Promise.resolve({
198 |           errors: [ new GraphQLError(NO_SUBSCRIPTION_ERROR), ],
199 |         })
200 |       } else if (operations.length > 1) {
201 |         return Promise.resolve({
202 |           errors: [ new GraphQLError(LONE_SUBSCRIPTION_OPERATION_ERROR), ],
203 |         })
204 |       }
205 | 
206 |       const iterator = await _subscriber(
207 |         document,
208 |         options,
209 |         operationName,
210 |         resolveFn
211 |       )
212 |       return toObservable(iterator)
213 |     },
214 | 
215 |     fetch: (query, { variables = {}, } = {}, operationName) => {
216 |       if (!_apolloFetch || !isType('function', _apolloFetch)) {
217 |         throw new Error(FETCH_NOT_CONFIGURED_ERROR)
218 |       }
219 | 
220 |       return _apolloFetch({ query, variables, operationName, })
221 |     },
222 | 
223 |     graphql: (query, { variables = {}, } = {}, operationName) => {
224 |       if (!loggedWarnings[CLIENTGRAPHQL_DEPRECATION_WARNING]) {
225 |         // eslint-disable-next-line
226 |         console.warn(CLIENTGRAPHQL_DEPRECATION_WARNING)
227 |         loggedWarnings[CLIENTGRAPHQL_DEPRECATION_WARNING] = true
228 |       }
229 |       if (!_apolloFetch || !isType('function', _apolloFetch)) {
230 |         throw new Error(FETCH_NOT_CONFIGURED_ERROR)
231 |       }
232 | 
233 |       return _apolloFetch({ query, variables, operationName, })
234 |     },
235 |   }
236 | }
237 | 
238 | export function createStore (...args) {
239 |   if (!loggedWarnings[CREATESTORE_DEPRECATION_WARNING]) {
240 |     // eslint-disable-next-line
241 |     console.warn(CREATESTORE_DEPRECATION_WARNING)
242 |     loggedWarnings[CREATESTORE_DEPRECATION_WARNING] = true
243 |   }
244 |   return new BlipsClient(...args)
245 | }
246 | 


--------------------------------------------------------------------------------
/src/__mocks__/initialState.js:
--------------------------------------------------------------------------------
 1 | export default {
 2 |   todos: {
 3 |     '3c4a086e-2151-4b54-acb2-13044ea553c1': {
 4 |       _id: '3c4a086e-2151-4b54-acb2-13044ea553c1',
 5 |       label: 'Buy milk',
 6 |       completed: false,
 7 |     },
 8 |     '4ecca858-67f8-491e-94cc-48b262061819': {
 9 |       _id: '4ecca858-67f8-491e-94cc-48b262061819',
10 |       label: 'Learn Blips',
11 |       completed: true,
12 |     },
13 |   },
14 | }
15 | 


--------------------------------------------------------------------------------
/src/__mocks__/operations.js:
--------------------------------------------------------------------------------
  1 | export const allTodosQuery = `
  2 |   query allTodosQuery {
  3 |     allTodos {
  4 |       id
  5 |       label
  6 |       completed
  7 |     }
  8 |   }
  9 | `
 10 | 
 11 | export const allTodosSubscription = `
 12 |   subscription allTodosSubscription {
 13 |     allTodos {
 14 |       id
 15 |       label
 16 |       completed
 17 |     }
 18 |   }
 19 | `
 20 | 
 21 | export const anotherTodosSubscription = `
 22 |   subscription anotherTodosSubscription {
 23 |     allTodos {
 24 |       id
 25 |       label
 26 |       completed
 27 |     }
 28 |   }
 29 | `
 30 | 
 31 | export const createTodoMutation = `
 32 |   mutation createTodoMutation($label: String!, $completed: Boolean) {
 33 |     createTodo(label: $label, completed: $completed) {
 34 |       id
 35 |       label
 36 |       completed
 37 |     }
 38 |   }
 39 | `
 40 | 
 41 | export const updateTodoMutation = `
 42 |   mutation updateTodoMutation($id: String!, $label: String, $completed: Boolean) {
 43 |     updateTodo(id: $id, label: $label, completed: $completed) {
 44 |       id
 45 |       label
 46 |       completed
 47 |     }
 48 |   }
 49 | `
 50 | 
 51 | export const deleteTodoMutation = `
 52 |   mutation deleteTodoMutation($id: String!) {
 53 |     deleteTodo(id: $id) {
 54 |       id
 55 |       label
 56 |       completed
 57 |     }
 58 |   }
 59 | `
 60 | 
 61 | // Utils tests
 62 | 
 63 | export const fragmentsAndOperations = `
 64 |   fragment TodoFields on Todo {
 65 |     id
 66 |     label
 67 |     completed
 68 |   }
 69 |   query allTodosQuery {
 70 |     allTodos {
 71 |       ...TodoFields
 72 |     }
 73 |   }
 74 |   mutation createTodoMutation($label: String!) {
 75 |     createTodo {
 76 |       ...TodoFields
 77 |     }
 78 |   }
 79 |   fragment UserFields on User {
 80 |     id
 81 |     firstName
 82 |     lastName
 83 |   }
 84 |   subscription allUsersSubscription {
 85 |     allUsers {
 86 |       ...UserFields
 87 |     }
 88 |   }
 89 | `
 90 | 
 91 | export const singleFieldSubscriptionsError = `
 92 |   subscription {
 93 |     allUsers {
 94 |       id
 95 |     }
 96 |     allTodos {
 97 |       id
 98 |     }
 99 |   }
100 |   subscription {
101 |     allUsers {
102 |       id
103 |     }
104 |   }
105 |   subscription allSubscriptions {
106 |     allUsers {
107 |       id
108 |     }
109 |     allTodos {
110 |       id
111 |     }
112 |   }
113 |   query allTodosSubscription {
114 |     allTodos {
115 |       id
116 |       label
117 |     }
118 |   }
119 | `
120 | 
121 | export const loneAnonymousOperationError = `
122 |   {
123 |     allTodos {
124 |       id
125 |     }
126 |   }
127 |   {
128 |     allUsers {
129 |       id
130 |     }
131 |   }
132 | `
133 | 
134 | export const uniqueFragmentNamesError = `
135 |   mutation createTodoMutation($label: String!) {
136 |     createTodo(label: $label) {
137 |       id
138 |       label
139 |       completed
140 |     }
141 |   }
142 |   fragment Fields on Todo {
143 |     id
144 |     label
145 |   }
146 |   query allTodosQuery {
147 |     allTodos {
148 |       ...Fields
149 |     }
150 |   }
151 |   fragment Fields on User {
152 |     id
153 |     firstName
154 |   }
155 |   query allUsersQuery {
156 |     allUsers {
157 |       ...Fields
158 |     }
159 |   }
160 | `
161 | 


--------------------------------------------------------------------------------
/src/__mocks__/resolvers.js:
--------------------------------------------------------------------------------
 1 | import uuid from 'uuid'
 2 | 
 3 | // If you need to set-up subscriptions, you will have to return a function.
 4 | // It's first argument is an object containing the `PubSub` instance of the store and the `withFilter` helper.
 5 | // See https://github.com/apollographql/graphql-subscriptions - to learn more about `PubSub` and `withFilter`
 6 | //
 7 | // If you don't want subscriptions, you don't need to access to `pubsub` or `withFilter`
 8 | // so you can export just an object
 9 | 
10 | // Read http://graphql.org/learn/execution/#root-fields-resolvers
11 | // if you have no idea about what resolvers are
12 | 
13 | export default ({ pubsub, withFilter, }) => ({
14 |   Todo: {
15 |     // transform _id to id
16 |     id: ({ id, _id, }, args, context) => _id || id,
17 |   },
18 |   Query: {
19 |     allTodos: (_, args, { store, }) => Object.values(store.get('todos')),
20 |   },
21 |   Mutation: {
22 |     createTodo: (_, { label, completed = false, }, { store, }) => {
23 |       const id = uuid()
24 |       const modified = store.post(
25 |         'todos',
26 |         {
27 |           _id: id,
28 |           label,
29 |           completed,
30 |         },
31 |         id
32 |       )
33 |       pubsub.publish('TODO_CREATED')
34 |       return modified
35 |     },
36 |     updateTodo: (_, { id, label, completed, }, { store, }) => {
37 |       const modified = store.patch(
38 |         'todos',
39 |         {
40 |           label,
41 |           completed,
42 |         },
43 |         id
44 |       )
45 |       pubsub.publish('TODO_UPDATED', { id, })
46 |       return modified
47 |     },
48 |     deleteTodo: (_, { id, }, { store, }) => {
49 |       const modified = store.delete('todos', id)
50 |       pubsub.publish('TODO_DELETED')
51 |       return modified
52 |     },
53 |   },
54 |   Subscription: {
55 |     allTodos: {
56 |       resolve: (_, args, { store, }) => Object.values(store.get('todos')),
57 |       subscribe: () =>
58 |         pubsub.asyncIterator([ 'TODO_UPDATED', 'TODO_CREATED', 'TODO_DELETED', ]),
59 |     },
60 |   },
61 | })
62 | 


--------------------------------------------------------------------------------
/src/__mocks__/typeDefs.js:
--------------------------------------------------------------------------------
 1 | export default `
 2 |   type Todo {
 3 |     id: String!
 4 |     label: String!
 5 |     completed: Boolean
 6 |   }
 7 | 
 8 |   type Query {
 9 |     allTodos: [Todo]!
10 |   }
11 | 
12 |   type Mutation {
13 |     createTodo(label: String!, completed: Boolean): Todo!
14 |     updateTodo(id: String!, label: String, completed: Boolean): Todo!
15 |     deleteTodo(id: String!): Todo!
16 |   }
17 | 
18 |   type Subscription {
19 |     allTodos: [Todo]!
20 |   }
21 | `
22 | 


--------------------------------------------------------------------------------
/src/__tests__/BlipsClient.js:
--------------------------------------------------------------------------------
  1 | import { GraphQLSchema, } from 'graphql'
  2 | import {
  3 |   BlipsClient,
  4 |   createStore,
  5 |   NO_SUBSCRIPTION_ERROR,
  6 |   LONE_SUBSCRIPTION_OPERATION_ERROR,
  7 |   FETCH_NOT_CONFIGURED_ERROR,
  8 |   CREATESTORE_DEPRECATION_WARNING,
  9 | } from '../BlipsClient'
 10 | 
 11 | import typeDefs from '../__mocks__/typeDefs'
 12 | import resolvers from '../__mocks__/resolvers'
 13 | import initialState from '../__mocks__/initialState'
 14 | import * as operations from '../__mocks__/operations'
 15 | 
 16 | function fetchNotConfiguredFn (client) {
 17 |   return () => {
 18 |     return client.fetch(`
 19 |       query fakeListQuery {
 20 |         FakeList(length: 3) {
 21 |           label: sentence
 22 |           completed: boolean
 23 |           id
 24 |         }
 25 |       }
 26 |     `)
 27 |   }
 28 | }
 29 | 
 30 | describe('BlipsClient and createBlipsClient', () => {
 31 |   const storeObject = expect.objectContaining({
 32 |     query: expect.any(Function),
 33 |     mutate: expect.any(Function),
 34 |     subscribe: expect.any(Function),
 35 |     fetch: expect.any(Function),
 36 |     state: expect.any(Object),
 37 |     schema: expect.any(GraphQLSchema),
 38 |   })
 39 |   let client
 40 |   const warnMock = jest.fn()
 41 | 
 42 |   beforeEach(() => {
 43 |     client = new BlipsClient({ typeDefs, resolvers, }, initialState, {
 44 |       fetch: {
 45 |         uri: 'http://159.203.96.223/graphql',
 46 |       },
 47 |     })
 48 |   })
 49 | 
 50 |   afterEach(() => {
 51 |     client = null
 52 |   })
 53 | 
 54 |   test('"BlipsClient" and "createStore" return client objects', () => {
 55 |     // eslint-disable-next-line
 56 |     console && (console.warn = warnMock)
 57 | 
 58 |     const store = createStore({ typeDefs, resolvers, }, initialState, {
 59 |       fetch: {
 60 |         uri: 'http://159.203.96.223/graphql',
 61 |       },
 62 |     })
 63 |     expect(store).toEqual(storeObject)
 64 |     expect(client).toEqual(storeObject)
 65 |     expect(Object.keys(client)).toHaveLength(7)
 66 |     expect(Object.keys(client).sort()).toMatchObject([
 67 |       'fetch',
 68 |       'graphql',
 69 |       'mutate',
 70 |       'query',
 71 |       'schema',
 72 |       'state',
 73 |       'subscribe',
 74 |     ])
 75 |   })
 76 | 
 77 |   test('The "createStore" methds logs a deprecation warning', () => {
 78 |     expect(warnMock).toHaveBeenCalledTimes(1)
 79 |     expect(warnMock).toHaveBeenCalledWith(CREATESTORE_DEPRECATION_WARNING)
 80 |   })
 81 | 
 82 |   test('"client.state" getter returns the state object', () => {
 83 |     expect(client.state).toEqual(initialState)
 84 |   })
 85 | 
 86 |   test('"client.schema" getter returns the schema', () => {
 87 |     expect(client.schema).toBeInstanceOf(GraphQLSchema)
 88 |   })
 89 | 
 90 |   test('The client methods return a promises', async () => {
 91 |     expect.assertions(4)
 92 |     expect(client.query(operations.allTodosQuery)).toEqual(expect.any(Promise))
 93 | 
 94 |     expect(client.mutate(operations.createTodoMutation)).toEqual(
 95 |       expect.any(Promise)
 96 |     )
 97 | 
 98 |     expect(client.subscribe(operations.allTodosSubscription)).toEqual(
 99 |       expect.any(Promise)
100 |     )
101 | 
102 |     const promise = client.fetch(`
103 |       query fakeListQuery {
104 |         FakeList(length: 3) {
105 |           label: sentence
106 |           completed: boolean
107 |           id
108 |         }
109 |       }
110 |     `)
111 | 
112 |     promise.catch(() => {})
113 |     expect(promise).toEqual(expect.any(Promise))
114 |   })
115 | 
116 |   test('client.fetch throws an error if fetch is not configured', () => {
117 |     const _client = new BlipsClient({ typeDefs, resolvers, })
118 | 
119 |     expect(fetchNotConfiguredFn(_client)).toThrow(FETCH_NOT_CONFIGURED_ERROR)
120 |   })
121 | 
122 |   test('Only one subscription operation is allowed per query', async () => {
123 |     const response = await client.subscribe(
124 |       operations.allTodosSubscription + operations.anotherTodosSubscription
125 |     )
126 | 
127 |     expect(response).toEqual({
128 |       errors: [ { message: LONE_SUBSCRIPTION_OPERATION_ERROR, }, ],
129 |     })
130 |   })
131 | 
132 |   test('Throws an error if `client.subscribe` is called without a subscription operation', async () => {
133 |     expect.assertions(1)
134 |     const response = await client.subscribe(operations.createTodoMutation)
135 | 
136 |     expect(response).toEqual({
137 |       errors: [ { message: NO_SUBSCRIPTION_ERROR, }, ],
138 |     })
139 |   })
140 | })
141 | 


--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | export { BlipsClient, createStore, } from './BlipsClient'
2 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/extendContext.js:
--------------------------------------------------------------------------------
  1 | /* eslint-disable no-console */
  2 | import {
  3 |   extendContext,
  4 |   buildPropExistsWarning,
  5 |   STORE_EXTEND_WARNING,
  6 | } from '../extendContext'
  7 | 
  8 | /**
  9 |  * Merges two context objects
 10 |  * @param  {Object} defaultContext Object to be extended
 11 |  * @param  {Object} context        Object to be merged with the defaultContext
 12 |  * @return {Object}                Extended context
 13 |  */
 14 | 
 15 | const defaultContext = {
 16 |   store: {
 17 |     a: {},
 18 |     b: {},
 19 |   },
 20 | }
 21 | 
 22 | describe('extendContext', () => {
 23 |   test('It returns the defaultContext if no context object provided', () => {
 24 |     expect(extendContext(defaultContext)).toEqual(defaultContext)
 25 |     expect(extendContext(defaultContext, null)).toEqual(defaultContext)
 26 |   })
 27 | 
 28 |   test('It returns the defaultContext if the context is not an object', () => {
 29 |     expect(extendContext(defaultContext, 'foo')).toEqual(defaultContext)
 30 |     expect(extendContext(defaultContext, 1)).toEqual(defaultContext)
 31 |     expect(extendContext(defaultContext, false)).toEqual(defaultContext)
 32 |   })
 33 | 
 34 |   test('It returns the defaultContext if the context is an array', () => {
 35 |     expect(extendContext(defaultContext, [])).toEqual(defaultContext)
 36 |     expect(extendContext(defaultContext, [ 1, 2, ])).toEqual(defaultContext)
 37 |   })
 38 | 
 39 |   test('It returns the defaultContext if the context is a Map', () => {
 40 |     const context = new Map([ [ 'c', {}, ], [ 'd', {}, ], ])
 41 |     expect(extendContext(defaultContext, context)).toEqual(defaultContext)
 42 |   })
 43 | 
 44 |   test('It returns the defaultContext if trying to extend only the `store` prop and logs a warning', () => {
 45 |     const context = { store: {}, }
 46 |     const warnMock = jest.fn()
 47 |     console.warn = warnMock
 48 | 
 49 |     expect(extendContext(defaultContext, context)).toEqual(defaultContext)
 50 |     expect(warnMock).toHaveBeenCalledTimes(1)
 51 |     expect(warnMock).toHaveBeenCalledWith(STORE_EXTEND_WARNING)
 52 |   })
 53 | 
 54 |   test('It extends the defaultContext but logs a warning if trying to replace an existing prop, other than `store`', () => {
 55 |     const defaultC = {
 56 |       ...defaultContext,
 57 |       user: {
 58 |         firstName: 'John',
 59 |       },
 60 |     }
 61 | 
 62 |     const expected = {
 63 |       ...defaultC,
 64 |       user: {
 65 |         firstName: 'Marc',
 66 |       },
 67 |     }
 68 | 
 69 |     const context = { user: { firstName: 'Marc', }, }
 70 |     const warnMock = jest.fn()
 71 |     console.warn = warnMock
 72 | 
 73 |     expect(extendContext(defaultC, context)).toEqual(expected)
 74 |     expect(warnMock).toHaveBeenCalledTimes(1)
 75 |     expect(warnMock).toHaveBeenCalledWith(buildPropExistsWarning('user'))
 76 |   })
 77 | 
 78 |   test('It extends the defaultContext correctly', () => {
 79 |     const context = {
 80 |       user: {
 81 |         lastName: 'Doe',
 82 |       },
 83 |       foo: 'foo',
 84 |       bar: {},
 85 |     }
 86 | 
 87 |     const expected = {
 88 |       store: {
 89 |         a: {},
 90 |         b: {},
 91 |       },
 92 |       user: {
 93 |         lastName: 'Doe',
 94 |       },
 95 |       foo: 'foo',
 96 |       bar: {},
 97 |     }
 98 |     expect(extendContext(defaultContext, context)).toEqual(expected)
 99 |   })
100 | })
101 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/getDocument.js:
--------------------------------------------------------------------------------
 1 | import { getDocument, } from '../getDocument'
 2 | import { Kind, } from 'graphql'
 3 | 
 4 | const query = `
 5 |   query allTodosQuery {
 6 |     allTodos {
 7 |       id
 8 |       label
 9 |       completed
10 |     }
11 |   }
12 | `
13 | 
14 | const documentAST = {
15 |   definitions: [],
16 |   kind: 'Document',
17 |   loc: { start: 0, end: 87, },
18 | }
19 | 
20 | const foo = {
21 |   bar: 1,
22 |   baz: 2,
23 | }
24 | 
25 | describe('getDocument', () => {
26 |   test('It returns the parsed source if it`s a string', () => {
27 |     expect(getDocument(query)).toEqual(
28 |       expect.objectContaining({
29 |         kind: Kind.DOCUMENT,
30 |       })
31 |     )
32 |   })
33 | 
34 |   test('It returns the same object if one provided', () => {
35 |     expect(getDocument(documentAST)).toEqual(documentAST)
36 |     expect(getDocument(foo)).toEqual(foo)
37 |   })
38 | })
39 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/getOperationASTs.js:
--------------------------------------------------------------------------------
 1 | import { parse, } from 'graphql'
 2 | import { getOperationASTs, } from '../getOperationASTs'
 3 | import { fragmentsAndOperations as query, } from '../../__mocks__/operations'
 4 | 
 5 | describe('getOperationASTs', () => {
 6 |   test('It returns a list containg only the operation definitions', () => {
 7 |     const doc = parse(query)
 8 |     let expected = doc.definitions.slice(1)
 9 |     expected = [ ...expected.slice(0, 2), ...expected.slice(3), ]
10 | 
11 |     expect(getOperationASTs(doc)).toEqual(expected)
12 |   })
13 | })
14 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/getOperationName.js:
--------------------------------------------------------------------------------
 1 | import { parse, } from 'graphql'
 2 | import { getOperationName, } from '../getOperationName'
 3 | import { fragmentsAndOperations as query, } from '../../__mocks__/operations'
 4 | 
 5 | describe('getOperationName', () => {
 6 |   test('It returns a list containg only the operation definitions', () => {
 7 |     const { definitions, } = parse(query)
 8 | 
 9 |     expect(getOperationName(definitions[1])).toBe('allTodosQuery')
10 |     expect(getOperationName(definitions[2])).toBe('createTodoMutation')
11 |     expect(getOperationName(definitions[4])).toBe('allUsersSubscription')
12 |   })
13 | })
14 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/isEmpty.js:
--------------------------------------------------------------------------------
 1 | import { isEmpty, } from '../isEmpty'
 2 | 
 3 | describe('isEmpty', () => {
 4 |   test('It returns true for empty array, object, map, set or strings', () => {
 5 |     expect(isEmpty([])).toBeTruthy()
 6 |     expect(isEmpty('')).toBeTruthy()
 7 |     expect(isEmpty({})).toBeTruthy()
 8 |     expect(isEmpty(new Map())).toBeTruthy()
 9 |     expect(isEmpty(new Set())).toBeTruthy()
10 |   })
11 | 
12 |   test('It returns false for anything other than empty array, object, map, set or strings', () => {
13 |     const map = new Map([ [ 'foo', 1, ], ])
14 |     const set = new Set([ [ 'foo', 1, ], ])
15 |     expect(isEmpty({ foo: 1, })).toBeFalsy()
16 |     expect(isEmpty([ 1, 2, ])).toBeFalsy()
17 |     expect(isEmpty('foo')).toBeFalsy()
18 |     expect(isEmpty('     ')).toBeFalsy()
19 |     expect(isEmpty(null)).toBeFalsy()
20 |     expect(isEmpty()).toBeFalsy()
21 |     expect(isEmpty(0)).toBeFalsy()
22 |     expect(isEmpty(false)).toBeFalsy()
23 |     expect(isEmpty(map)).toBeFalsy()
24 |     expect(isEmpty(set)).toBeFalsy()
25 |     expect(isEmpty(Symbol('foo'))).toBeFalsy()
26 |     expect(isEmpty(Symbol(''))).toBeFalsy()
27 |   })
28 | 
29 |   test('It returns false for Errors', () => {
30 |     const err = new Error('Error message')
31 |     expect(Object.values(err).length).toBe(0)
32 |     expect(isEmpty(new Error('Error message'))).toBeFalsy()
33 |   })
34 | })
35 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/isFragmentDefinition.js:
--------------------------------------------------------------------------------
 1 | import { parse, } from 'graphql'
 2 | import { isFragmentDefinition, } from '../isFragmentDefinition'
 3 | import { fragmentsAndOperations as query, } from '../../__mocks__/operations'
 4 | 
 5 | describe('isFragmentDefinition', () => {
 6 |   test('It returns a list containg only the operation definitions', () => {
 7 |     const { definitions, } = parse(query)
 8 | 
 9 |     expect(isFragmentDefinition(definitions[0])).toBeTruthy()
10 |     expect(isFragmentDefinition(definitions[1])).toBeFalsy()
11 |     expect(isFragmentDefinition(definitions[2])).toBeFalsy()
12 |     expect(isFragmentDefinition(definitions[3])).toBeTruthy()
13 |     expect(isFragmentDefinition(definitions[4])).toBeFalsy()
14 |   })
15 | })
16 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/isNil.js:
--------------------------------------------------------------------------------
 1 | import { isNil, } from '../isNil'
 2 | 
 3 | describe('isNil', () => {
 4 |   test('It returns true for null or undefined', () => {
 5 |     expect(isNil(null)).toBeTruthy()
 6 |     expect(isNil()).toBeTruthy()
 7 |   })
 8 | 
 9 |   test('It returns false for anything other than null or undefined', () => {
10 |     expect(isNil(true)).toBeFalsy()
11 |     expect(isNil(false)).toBeFalsy()
12 |     expect(isNil(1)).toBeFalsy()
13 |     expect(isNil(0)).toBeFalsy()
14 |     expect(isNil('')).toBeFalsy()
15 |     expect(isNil('   ')).toBeFalsy()
16 |     expect(isNil({})).toBeFalsy()
17 |     expect(isNil([])).toBeFalsy()
18 |     expect(isNil(Symbol('foo'))).toBeFalsy()
19 |     expect(isNil(new Map())).toBeFalsy()
20 |     expect(isNil(new Set())).toBeFalsy()
21 |   })
22 | })
23 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/isType.js:
--------------------------------------------------------------------------------
 1 | import { isType, } from '../isType'
 2 | 
 3 | describe('isType', () => {
 4 |   test('performs correctly :)', () => {
 5 |     expect(isType('number', 1)).toBeTruthy()
 6 |     expect(isType('string', 'foo')).toBeTruthy()
 7 |     expect(isType('object', {})).toBeTruthy()
 8 |     expect(isType('array', [])).toBeTruthy()
 9 |     expect(isType('function', () => {})).toBeTruthy()
10 |     expect(isType('error', new Error())).toBeTruthy()
11 |     expect(isType('set', new Set())).toBeTruthy()
12 |     expect(isType('map', new Map())).toBeTruthy()
13 |     expect(isType('symbol', Symbol('foo'))).toBeTruthy()
14 |     expect(isType('undefined')).toBeTruthy()
15 |     expect(isType('null', null)).toBeTruthy()
16 |     expect(isType('boolean', false)).toBeTruthy()
17 |     expect(isType('promise', Promise.resolve('foo'))).toBeTruthy()
18 | 
19 |     expect(isType('number', '1')).toBeFalsy()
20 |     expect(isType('object', [])).toBeFalsy()
21 |     expect(isType('object', new Error())).toBeFalsy()
22 |     expect(isType('object', new Set())).toBeFalsy()
23 |     expect(isType('object', new Map())).toBeFalsy()
24 |     expect(isType('string', false)).toBeFalsy()
25 |   })
26 | 
27 |   test('It ignores case', () => {
28 |     expect(isType('Number', 1)).toBeTruthy()
29 |     expect(isType('StRiNg', 'foo')).toBeTruthy()
30 |     expect(isType('OBJECT', {})).toBeTruthy()
31 |     expect(isType('Array', [])).toBeTruthy()
32 |     expect(isType('Function', () => {})).toBeTruthy()
33 |     expect(isType('Error', new Error())).toBeTruthy()
34 |     expect(isType('Set', new Set())).toBeTruthy()
35 |     expect(isType('Map', new Map())).toBeTruthy()
36 |     expect(isType('Symbol', Symbol('foo'))).toBeTruthy()
37 |     expect(isType('Undefined')).toBeTruthy()
38 |     expect(isType('Null', null)).toBeTruthy()
39 |     expect(isType('Boolean', false)).toBeTruthy()
40 |     expect(isType('Promise', Promise.resolve('foo'))).toBeTruthy()
41 |   })
42 | })
43 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/mergeDataList.js:
--------------------------------------------------------------------------------
 1 | import { mergeDataList, } from '../mergeDataList'
 2 | 
 3 | const resetList = () => [
 4 |   {
 5 |     allTodos: [],
 6 |   },
 7 |   {
 8 |     allUsers: [],
 9 |   },
10 | ]
11 | 
12 | let list = resetList()
13 | 
14 | describe('mergeDataList', () => {
15 |   test('It merges a list of `data` objects into a single object', () => {
16 |     expect(mergeDataList(list)).toEqual({ allTodos: [], allUsers: [], })
17 |   })
18 | 
19 |   test('It replaces any existing props', () => {
20 |     list.push({ allTodos: [ 1, 2, ], })
21 |     expect(mergeDataList(list)).toEqual({ allTodos: [ 1, 2, ], allUsers: [], })
22 | 
23 |     list.push({ allUsers: 'John', })
24 |     expect(mergeDataList(list)).toEqual({ allTodos: [ 1, 2, ], allUsers: 'John', })
25 |   })
26 | 
27 |   test('It handles null values correctly', () => {
28 |     list = resetList()
29 | 
30 |     list.push(null)
31 |     expect(list).toContain(null)
32 |     expect(mergeDataList(list)).toEqual({ allTodos: [], allUsers: [], })
33 |   })
34 | 
35 |   test('It handles sparse lists', () => {
36 |     // eslint-disable-next-line
37 |     list = [{ allTodos: [] }, , { allUsers: [] }]
38 |     list.push({ allComments: [], })
39 | 
40 |     expect(list[1]).toBeUndefined()
41 |     expect(mergeDataList(list)).toEqual({
42 |       allTodos: [],
43 |       allUsers: [],
44 |       allComments: [],
45 |     })
46 |   })
47 | 
48 |   test('It merges only objects', () => {
49 |     // eslint-disable-next-line
50 |     list = [
51 |       { allComments: [], },
52 |       'Foo',
53 |       { allTodos: [], },
54 |       [ 1, 2, ],,
55 |       null,
56 |       1,
57 |       false,
58 |     ]
59 |     expect(mergeDataList(list)).toEqual({ allComments: [], allTodos: [], })
60 |   })
61 | 
62 |   test('It returns nothing if the merged object is empty', () => {
63 |     expect(mergeDataList([ null, {}, ])).toBeUndefined()
64 |     expect(mergeDataList([ {}, ])).toBeUndefined()
65 |     expect(mergeDataList([])).toBeUndefined()
66 |   })
67 | })
68 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/mergeErrorList.js:
--------------------------------------------------------------------------------
 1 | import { GraphQLError, } from 'graphql'
 2 | 
 3 | import { mergeErrorList, } from '../mergeErrorList'
 4 | 
 5 | const resetList = () => [
 6 |   new GraphQLError('Error 1'),
 7 |   new GraphQLError('Error 2'),
 8 |   new GraphQLError('No "users" collection found', null, null, null, [
 9 |     'allUsers',
10 |   ]),
11 | ]
12 | 
13 | const resetExpected = () => ({
14 |   GraphQLError: [ { message: 'Error 1', }, { message: 'Error 2', }, ],
15 |   allUsers: [ { message: 'No "users" collection found', path: [ 'allUsers', ], }, ],
16 | })
17 | 
18 | let list = resetList()
19 | let expected = resetExpected()
20 | 
21 | describe('mergeErrorList', () => {
22 |   test('It merges errors of the same type', () => {
23 |     expect(mergeErrorList(list)).toEqual(expected)
24 |   })
25 | 
26 |   test('It handles null entries correctly', () => {
27 |     list.push(null)
28 | 
29 |     expect(list).toContain(null)
30 |     expect(mergeErrorList(list)).toEqual(expected)
31 |   })
32 | 
33 |   test('It handles sparse lists correctly', () => {
34 |     list = resetList()
35 |     // eslint-disable-next-line
36 |     const sparseList = list.concat([, , ,])
37 | 
38 |     expect(sparseList.length).toEqual(6)
39 |     expect(mergeErrorList(list)).toEqual(expected)
40 |   })
41 | 
42 |   test('It merges anything that is not an object under the `Errors` prop', () => {
43 |     list = resetList()
44 |     const newList = list.concat([ [ 1, 2, ], null, 1, false, 'Error message', ])
45 | 
46 |     expect(mergeErrorList(newList)).toEqual({
47 |       ...expected,
48 |       Errors: [ [ 1, 2, ], 1, false, 'Error message', ],
49 |     })
50 |   })
51 | 
52 |   test('It returns nothing if the merged object is empty', () => {
53 |     expect(mergeErrorList([ null, ])).toBeUndefined()
54 |     expect(mergeErrorList([ null, {}, ])).toBeUndefined()
55 |   })
56 | })
57 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/mergeResponseList.js:
--------------------------------------------------------------------------------
 1 | import { GraphQLError, } from 'graphql'
 2 | import { mergeResponseList, } from '../mergeResponseList'
 3 | 
 4 | const list = [
 5 |   {
 6 |     data: {
 7 |       allTodos: [],
 8 |     },
 9 |     errors: [ { message: 'Foo', path: [ 'allUsers', ], }, ],
10 |   },
11 |   {
12 |     data: {
13 |       allTodos: [ 1, 2, ],
14 |       allComments: {},
15 |     },
16 |     errors: [
17 |       new GraphQLError('GraphQL error'),
18 |       { message: 'Bar', path: [ 'allUsers', ], },
19 |     ],
20 |   },
21 |   {
22 |     foo: 'bar', // not included
23 |     data: {
24 |       allFoos: [],
25 |     },
26 |   },
27 |   {
28 |     data: null, // not included
29 |     errors: [], // not included
30 |   },
31 |   {
32 |     data: {}, // not included
33 |     errors: null, // not included
34 |   },
35 | ]
36 | 
37 | const expected = {
38 |   data: { allTodos: [ 1, 2, ], allComments: {}, allFoos: [], },
39 |   errors: {
40 |     allUsers: [
41 |       { message: 'Foo', path: [ 'allUsers', ], },
42 |       { message: 'Bar', path: [ 'allUsers', ], },
43 |     ],
44 |     GraphQLError: [ { message: 'GraphQL error', }, ],
45 |   },
46 | }
47 | 
48 | describe('mergeResponseList', () => {
49 |   test('It correctly merges multiple (graphql) response objects', () => {
50 |     expect(mergeResponseList(list)).toEqual(expected)
51 |   })
52 | 
53 |   test('It returns doesn`t return empty props', () => {
54 |     expect(
55 |       mergeResponseList([
56 |         { errors: [ { message: 'Foo', path: [ 'allUsers', ], }, ], },
57 |         {},
58 |       ])
59 |     ).toEqual({
60 |       errors: { allUsers: [ { message: 'Foo', path: [ 'allUsers', ], }, ], },
61 |     })
62 | 
63 |     expect(
64 |       mergeResponseList([
65 |         { data: { allUsers: [], }, },
66 |         { data: { allComments: [], }, },
67 |         { data: {}, },
68 |         { errors: [], },
69 |       ])
70 |     ).toEqual({ data: { allUsers: [], allComments: [], }, })
71 |   })
72 | })
73 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/promiseBatch.js:
--------------------------------------------------------------------------------
 1 | import { GraphQLError, } from 'graphql'
 2 | import { promiseBatch, } from '../promiseBatch'
 3 | 
 4 | const resetList = () => [
 5 |   Promise.resolve({ data: { allUsers: [], }, }),
 6 |   Promise.resolve({ data: { allTodos: [], }, }),
 7 | ]
 8 | 
 9 | let list = resetList()
10 | 
11 | describe('promiseBatch', () => {
12 |   test('Given a list of promises, it returns an object with merged `data` and `errors` props', async () => {
13 |     expect.assertions(1)
14 |     const data = await promiseBatch(list)
15 | 
16 |     expect(data).toEqual({ data: { allUsers: [], allTodos: [], }, })
17 |   })
18 | 
19 |   test('If one of the promises rejects, the error is found under the `errors` prop', async () => {
20 |     expect.assertions(1)
21 |     list.push(Promise.reject(new GraphQLError('GraphQL error')))
22 |     list.push(
23 |       Promise.reject(
24 |         new GraphQLError('allComments error', null, null, null, [ 'allComments', ])
25 |       )
26 |     )
27 |     list.push(Promise.reject(new Error('Generic error')))
28 | 
29 |     const data = await promiseBatch(list)
30 | 
31 |     expect(data).toEqual({
32 |       data: { allUsers: [], allTodos: [], },
33 |       errors: {
34 |         GraphQLError: [ { message: 'GraphQL error', }, ],
35 |         Errors: [ expect.objectContaining({ message: 'Generic error', }), ],
36 |         allComments: [ { message: 'allComments error', path: [ 'allComments', ], }, ],
37 |       },
38 |     })
39 |   })
40 | 
41 |   test('If one of the promises resolves with anything other than an object, it will not be present in the returned object', async () => {
42 |     expect.assertions(1)
43 |     list = resetList()
44 | 
45 |     list.push(Promise.resolve('Foo'))
46 |     list.push(Promise.resolve(null))
47 |     list.push(Promise.resolve(1))
48 |     list.push(Promise.resolve(false))
49 |     list.push(Promise.resolve([ 1, ]))
50 | 
51 |     const data = await promiseBatch(list)
52 | 
53 |     expect(data).toEqual({
54 |       data: { allUsers: [], allTodos: [], },
55 |     })
56 |   })
57 | })
58 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/rules.js:
--------------------------------------------------------------------------------
 1 | import { parse, GraphQLError, } from 'graphql'
 2 | import * as rules from '../rules'
 3 | import { getOperationName, } from '../getOperationName'
 4 | import {
 5 |   singleFieldSubscriptionsError,
 6 |   loneAnonymousOperationError,
 7 |   uniqueFragmentNamesError,
 8 | } from '../../__mocks__/operations'
 9 | 
10 | describe('Error messages', () => {
11 |   test('duplicateFragmentNameMessage returns correct error message', () => {
12 |     expect(rules.duplicateFragmentNameMessage('foo')).toBe(
13 |       'There can be only one fragment named "foo".'
14 |     )
15 |   })
16 | 
17 |   test('singleFieldOnlyMessage returns correct error message', () => {
18 |     expect(rules.singleFieldOnlyMessage()).toEqual(
19 |       'Anonymous Subscription must select only one top level field.'
20 |     )
21 |     expect(rules.singleFieldOnlyMessage('allTodosSubscription')).toEqual(
22 |       'Subscription "allTodosSubscription" must select only one top level field.'
23 |     )
24 |   })
25 | })
26 | 
27 | describe('singleFieldSubscriptions', () => {
28 |   test('It returns a GraphQLError if subscription has multiple top level fields', () => {
29 |     const { definitions, } = parse(singleFieldSubscriptionsError)
30 | 
31 |     expect(rules.singleFieldSubscriptions(definitions[0])).toEqual(
32 |       new GraphQLError(rules.singleFieldOnlyMessage())
33 |     )
34 |     expect(rules.singleFieldSubscriptions(definitions[1])).toBeUndefined()
35 | 
36 |     expect(rules.singleFieldSubscriptions(definitions[2])).toEqual(
37 |       new GraphQLError(
38 |         rules.singleFieldOnlyMessage(getOperationName(definitions[2]))
39 |       )
40 |     )
41 |     expect(rules.singleFieldSubscriptions(definitions[3])).toBeUndefined()
42 |   })
43 | })
44 | 
45 | describe('loneAnonymousOperation', () => {
46 |   test('It returns a GraphQLError if query has multiple anonymous operations', () => {
47 |     const { definitions, } = parse(loneAnonymousOperationError)
48 |     const operationsCount = definitions.length
49 | 
50 |     expect(
51 |       rules.loneAnonymousOperation(definitions[0], operationsCount)
52 |     ).toEqual(new GraphQLError(rules.anonOperationNotAloneMessage()))
53 | 
54 |     expect(
55 |       rules.loneAnonymousOperation(definitions[0], definitions.pop())
56 |     ).toBeUndefined()
57 |   })
58 | 
59 |   describe('uniqueFragmentNames', () => {
60 |     test('It returns a GraphQLError if query has fragment definitions with the same name', () => {
61 |       const { definitions, } = parse(uniqueFragmentNamesError)
62 |       const knownFragmentNames = {}
63 | 
64 |       expect(
65 |         rules.uniqueFragmentNames(definitions[0], knownFragmentNames)
66 |       ).toBeUndefined()
67 | 
68 |       expect(
69 |         rules.uniqueFragmentNames(definitions[1], knownFragmentNames)
70 |       ).toBeUndefined()
71 | 
72 |       expect(
73 |         rules.uniqueFragmentNames(definitions[3], knownFragmentNames)
74 |       ).toEqual(
75 |         new GraphQLError(
76 |           rules.duplicateFragmentNameMessage(getOperationName(definitions[3]))
77 |         )
78 |       )
79 |     })
80 |   })
81 | })
82 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/toObservable.js:
--------------------------------------------------------------------------------
 1 | import { toObservable, } from '../toObservable'
 2 | import { PubSub, } from 'graphql-subscriptions'
 3 | 
 4 | describe('toObservable', () => {
 5 |   const newTick = () =>
 6 |     new Promise(resolve => {
 7 |       pubsub.publish('TICK', 'foo')
 8 |       process.nextTick(resolve)
 9 |     })
10 | 
11 |   let pubsub
12 |   let asyncIterator
13 | 
14 |   beforeEach(() => {
15 |     pubsub = new PubSub()
16 |     asyncIterator = pubsub.asyncIterator('TICK')
17 |   })
18 | 
19 |   afterEach(() => {
20 |     asyncIterator.return()
21 |   })
22 | 
23 |   test('It returns an observable', () => {
24 |     const obs = toObservable()
25 |     expect(obs.constructor.name).toBe('Observable')
26 |   })
27 | 
28 |   test('When creating an observable from an async iterator, it emits with every yield', async () => {
29 |     expect.assertions(2)
30 | 
31 |     const callback = jest.fn()
32 |     const obs = toObservable(asyncIterator)
33 |     obs.subscribe(callback)
34 | 
35 |     await newTick()
36 |     expect(callback).toHaveBeenCalledTimes(1)
37 |     expect(callback).toHaveBeenCalledWith('foo')
38 |   })
39 | 
40 |   test('It will remove the listener on .unsubscribe()', async () => {
41 |     expect.assertions(3)
42 | 
43 |     const callback = jest.fn()
44 |     const obs = toObservable(asyncIterator)
45 |     const sub = obs.subscribe(callback)
46 | 
47 |     await newTick()
48 |     expect(callback).toHaveBeenCalledTimes(1)
49 | 
50 |     sub.unsubscribe()
51 |     await newTick()
52 | 
53 |     expect(await asyncIterator.next()).toEqual({ value: undefined, done: true, })
54 |     expect(callback).toHaveBeenCalledTimes(1)
55 |   })
56 | })
57 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/typeOf.js:
--------------------------------------------------------------------------------
 1 | import { typeOf, } from '../typeOf'
 2 | 
 3 | describe('typeOf', () => {
 4 |   test('It returns the correct type', () => {
 5 |     expect(typeOf(null)).toEqual('Null')
 6 |     expect(typeOf()).toEqual('Undefined')
 7 |     expect(typeOf({})).toEqual('Object')
 8 |     expect(typeOf([])).toEqual('Array')
 9 |     expect(typeOf(false)).toEqual('Boolean')
10 |     expect(typeOf(Symbol('foo'))).toEqual('Symbol')
11 |     expect(typeOf(new Map())).toEqual('Map')
12 |     expect(typeOf({})).toEqual('Object')
13 |     expect(typeOf(1)).toEqual('Number')
14 |     expect(typeOf('foo')).toEqual('String')
15 |     expect(typeOf(new Error('message'))).toEqual('Error')
16 |   })
17 | })
18 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/validateWithoutSchema.js:
--------------------------------------------------------------------------------
 1 | import { parse, GraphQLError, } from 'graphql'
 2 | import * as rules from '../rules'
 3 | import { getOperationName, } from '../getOperationName'
 4 | import { validateWithoutSchema, } from '../validateWithoutSchema'
 5 | import {
 6 |   fragmentsAndOperations,
 7 |   singleFieldSubscriptionsError,
 8 |   uniqueFragmentNamesError,
 9 | } from '../../__mocks__/operations'
10 | 
11 | describe('validateWithoutSchema', () => {
12 |   test('It returns no errors if ast is valid', () => {
13 |     const doc = parse(fragmentsAndOperations)
14 |     expect(validateWithoutSchema(doc)).toEqual([])
15 |   })
16 | 
17 |   test('It returns a list of all the errors encountered while parsing the provided document', () => {
18 |     const doc = parse(singleFieldSubscriptionsError + uniqueFragmentNamesError)
19 |     expect(validateWithoutSchema(doc)).toEqual([
20 |       new GraphQLError(rules.anonOperationNotAloneMessage()),
21 |       new GraphQLError(rules.anonOperationNotAloneMessage()),
22 |       new GraphQLError(
23 |         rules.singleFieldOnlyMessage(getOperationName(doc.definitions[2]))
24 |       ),
25 |       new GraphQLError(
26 |         rules.duplicateFragmentNameMessage(getOperationName(doc.definitions[7]))
27 |       ),
28 |     ])
29 |   })
30 | })
31 | 


--------------------------------------------------------------------------------
/src/utils/__tests__/when.js:
--------------------------------------------------------------------------------
 1 | import { when, } from '../when'
 2 | import { isNil, } from '../isNil'
 3 | 
 4 | const addNumber = y => x => x + y
 5 | const concatString = y => x => `${x}${y}`
 6 | const isNotNil = x => !isNil(x)
 7 | 
 8 | describe('when', () => {
 9 |   test('It returns the data argument if the condition is falsy', () => {
10 |     expect(when(0, addNumber(2), 3)).toEqual(3)
11 |     expect(when(false, concatString('bar'), 'foo')).toEqual('foo')
12 |   })
13 | 
14 |   test('It applies the transformation to the data and returns it if the condition is truthy', () => {
15 |     expect(when(1, addNumber(2), 3)).toEqual(5)
16 |     expect(when(true, concatString('bar'), 'foo')).toEqual('foobar')
17 |   })
18 | 
19 |   test('If the predicate is a function, it calls it with the data argument to resolve as the condition', () => {
20 |     expect(when(x => typeof x === 'number', addNumber(2), '3')).toEqual('3')
21 |     expect(when(x => typeof x === 'number', addNumber(2), 3)).toEqual(5)
22 |     expect(when(isNotNil, concatString('bar'), 'foo')).toEqual('foobar')
23 |     expect(when(isNotNil, concatString('bar'), null)).toBeNull()
24 |   })
25 | 
26 |   test('If the transformation is not a function and the predicate/condition is true, it returns it instead', () => {
27 |     expect(when(isNotNil, 'foobar', 'foo')).toEqual('foobar')
28 |     expect(when(isNil, 'foobar', 'foo')).toEqual('foo')
29 |   })
30 | })
31 | 


--------------------------------------------------------------------------------
/src/utils/extendContext.js:
--------------------------------------------------------------------------------
 1 | export const STORE_EXTEND_WARNING = `You cannot extend the context with an object containing a "store" prop. It will be omitted and the other props will be added`
 2 | export const buildPropExistsWarning = propName =>
 3 |   `The "${
 4 |     propName
 5 |   }" property already exists in the context object. Make sure you haven't replaced anything important`
 6 | 
 7 | export function extendContext (defaultContext, context) {
 8 |   if (
 9 |     !context || // nil or falsy
10 |     typeof context !== 'object' || // not an object
11 |     context.hasOwnProperty('length') || // array
12 |     context.hasOwnProperty('size') // map
13 |   ) {
14 |     return defaultContext
15 |   }
16 | 
17 |   const { store, ...ctx } = context
18 | 
19 |   if (store) {
20 |     // eslint-disable-next-line
21 |     console.warn(STORE_EXTEND_WARNING)
22 |   }
23 | 
24 |   for (const propName of Object.keys(ctx)) {
25 |     if (defaultContext.hasOwnProperty(propName)) {
26 |       // eslint-disable-next-line
27 |       console.warn(buildPropExistsWarning(propName))
28 |     }
29 |   }
30 | 
31 |   return { ...defaultContext, ...ctx, }
32 | }
33 | 


--------------------------------------------------------------------------------
/src/utils/getDocument.js:
--------------------------------------------------------------------------------
1 | import { parse, } from 'graphql'
2 | 
3 | export function getDocument (sourceOrDocument) {
4 |   return typeof sourceOrDocument === 'string'
5 |     ? parse(sourceOrDocument)
6 |     : sourceOrDocument
7 | }
8 | 


--------------------------------------------------------------------------------
/src/utils/getOperationASTs.js:
--------------------------------------------------------------------------------
1 | import { isOperationDefinition, } from './isOperationDefinition'
2 | 
3 | export function getOperationASTs ({ definitions, }) {
4 |   return definitions.filter(isOperationDefinition)
5 | }
6 | 


--------------------------------------------------------------------------------
/src/utils/getOperationName.js:
--------------------------------------------------------------------------------
1 | export function getOperationName ({ name: { value, }, } = {}) {
2 |   return value
3 | }
4 | 


--------------------------------------------------------------------------------
/src/utils/index.js:
--------------------------------------------------------------------------------
1 | export { when, } from './when'
2 | export { isEmpty, } from './isEmpty'
3 | export { isType, } from './isType'
4 | export { toObservable, } from './toObservable'
5 | export { extendContext, } from './extendContext'
6 | export { getDocument, } from './getDocument'
7 | export { promiseBatch, } from './promiseBatch'
8 | export { validateWithoutSchema, } from './validateWithoutSchema'
9 | 


--------------------------------------------------------------------------------
/src/utils/isEmpty.js:
--------------------------------------------------------------------------------
 1 | import { isType, } from './isType'
 2 | 
 3 | export function isEmpty (value) {
 4 |   if (typeof value === 'string') return !value
 5 |   if (isType('object', value)) return !Object.values(value).length
 6 |   if (isType('array', value)) return !value.length
 7 |   if (isType('Map', value)) return !value.size
 8 |   if (isType('Set', value)) return !value.size
 9 |   return false
10 | }
11 | 


--------------------------------------------------------------------------------
/src/utils/isFragmentDefinition.js:
--------------------------------------------------------------------------------
1 | import { Kind, } from 'graphql'
2 | 
3 | export function isFragmentDefinition (definition) {
4 |   return Boolean(definition.kind === Kind.FRAGMENT_DEFINITION)
5 | }
6 | 


--------------------------------------------------------------------------------
/src/utils/isNil.js:
--------------------------------------------------------------------------------
1 | export function isNil (value) {
2 |   return value == null
3 | }
4 | 


--------------------------------------------------------------------------------
/src/utils/isOperationDefinition.js:
--------------------------------------------------------------------------------
1 | import { Kind, } from 'graphql'
2 | 
3 | export function isOperationDefinition (definition) {
4 |   return Boolean(definition.kind === Kind.OPERATION_DEFINITION)
5 | }
6 | 


--------------------------------------------------------------------------------
/src/utils/isType.js:
--------------------------------------------------------------------------------
1 | import { typeOf, } from './typeOf'
2 | 
3 | export function isType (type, value) {
4 |   if (value === null) return type.toLowerCase() === 'null'
5 |   if (typeof value === 'undefined') return type.toLowerCase() === 'undefined'
6 | 
7 |   return type.toLowerCase() === typeOf(value).toLowerCase()
8 | }
9 | 


--------------------------------------------------------------------------------
/src/utils/mergeDataList.js:
--------------------------------------------------------------------------------
 1 | import { isEmpty, } from './isEmpty'
 2 | import { isNil, } from './isNil'
 3 | import { isType, } from './isType'
 4 | import { when, } from './when'
 5 | 
 6 | export function mergeDataList (list) {
 7 |   const merged = list.reduce((obj, data) => {
 8 |     return isType('object', data) && !isNil(data)
 9 |       ? {
10 |         ...obj,
11 |         ...data,
12 |       }
13 |       : obj
14 |   }, {})
15 | 
16 |   return when(isEmpty, () => {}, merged)
17 | }
18 | 


--------------------------------------------------------------------------------
/src/utils/mergeErrorList.js:
--------------------------------------------------------------------------------
 1 | import { isEmpty, } from './isEmpty'
 2 | import { isNil, } from './isNil'
 3 | import { isType, } from './isType'
 4 | import { when, } from './when'
 5 | 
 6 | export function mergeErrorList (errors) {
 7 |   const merged = errors.reduce((obj, err) => {
 8 |     if (isNil(err) || isEmpty(err)) return obj
 9 |     const operationName = err.path
10 |       ? err.path[0]
11 |       : isType('object', err) ? err.constructor.name : 'Errors'
12 |     return {
13 |       ...obj,
14 |       [operationName]: [ ...(obj[operationName] || []), err, ],
15 |     }
16 |   }, {})
17 | 
18 |   return when(isEmpty, () => {}, merged)
19 | }
20 | 


--------------------------------------------------------------------------------
/src/utils/mergeResponseList.js:
--------------------------------------------------------------------------------
 1 | import { mergeErrorList, } from './mergeErrorList'
 2 | import { mergeDataList, } from './mergeDataList'
 3 | 
 4 | export function mergeResponseList (list) {
 5 |   let errorList = []
 6 |   let dataList = []
 7 | 
 8 |   for (const item of list) {
 9 |     const { data, errors, } = item || {}
10 |     errors && (errorList = [ ...errorList, ...errors, ])
11 |     data && (dataList = [ ...dataList, data, ])
12 |   }
13 | 
14 |   const mergedData = mergeDataList(dataList)
15 |   const mergedErrors = mergeErrorList(errorList)
16 | 
17 |   const response = {
18 |     ...(mergedData ? { data: mergedData, } : {}),
19 |     ...(mergedErrors ? { errors: mergedErrors, } : {}),
20 |   }
21 | 
22 |   return response
23 | }
24 | 


--------------------------------------------------------------------------------
/src/utils/promiseBatch.js:
--------------------------------------------------------------------------------
 1 | import { mergeResponseList, } from './mergeResponseList'
 2 | 
 3 | export function promiseBatch (promises) {
 4 |   return new Promise(resolve => {
 5 |     const mockedPromises = []
 6 |     for (const promise of promises) {
 7 |       mockedPromises.push(
 8 |         new Promise(resolve => {
 9 |           promise.then(res => resolve(res), err => resolve({ errors: [ err, ], }))
10 |         })
11 |       )
12 |     }
13 |     Promise.all(mockedPromises).then(res => {
14 |       resolve(mergeResponseList(res))
15 |     })
16 |   })
17 | }
18 | 


--------------------------------------------------------------------------------
/src/utils/rules.js:
--------------------------------------------------------------------------------
 1 | import { GraphQLError, } from 'graphql'
 2 | 
 3 | import { isFragmentDefinition, } from './isFragmentDefinition'
 4 | import { getOperationName, } from './getOperationName'
 5 | 
 6 | export function singleFieldOnlyMessage (name) {
 7 |   return (
 8 |     (name ? 'Subscription "' + name + '" ' : 'Anonymous Subscription ') +
 9 |     'must select only one top level field.'
10 |   )
11 | }
12 | 
13 | export function anonOperationNotAloneMessage () {
14 |   return 'This anonymous operation must be the only defined operation.'
15 | }
16 | 
17 | export function duplicateFragmentNameMessage (fragName) {
18 |   return 'There can be only one fragment named "' + fragName + '".'
19 | }
20 | 
21 | /**
22 |  * Subscriptions must only include one field.
23 |  *
24 |  * A GraphQL subscription is valid only if it contains a single root field.
25 |  */
26 | export function singleFieldSubscriptions (node) {
27 |   if (node.operation === 'subscription') {
28 |     if (node.selectionSet.selections.length !== 1) {
29 |       return new GraphQLError(
30 |         singleFieldOnlyMessage(node.name && node.name.value),
31 |         node.selectionSet.selections.slice(1)
32 |       )
33 |     }
34 |   }
35 | }
36 | 
37 | /**
38 |  * Lone anonymous operation
39 |  *
40 |  * A GraphQL document is only valid if when it contains an anonymous operation
41 |  * (the query short-hand) that it contains only that one operation definition.
42 |  */
43 | /**
44 |  * Copyright (c) 2015-present, Facebook, Inc.
45 |  *
46 |  * This source code is licensed under the MIT license found in the
47 |  * LICENSE file in the root directory of this source tree.
48 |  *
49 |  *
50 |  */
51 | 
52 | export function loneAnonymousOperation (node, operationCount) {
53 |   if (!node.name && operationCount > 1) {
54 |     return new GraphQLError(anonOperationNotAloneMessage(), [ node, ])
55 |   }
56 | }
57 | 
58 | /**
59 |  * Unique fragment names
60 |  *
61 |  * A GraphQL document is only valid if all defined fragments have unique names.
62 |  */
63 | export function uniqueFragmentNames (node, knownFragmentNames) {
64 |   if (!isFragmentDefinition(node)) return
65 | 
66 |   const fragmentName = getOperationName(node)
67 | 
68 |   if (knownFragmentNames[fragmentName]) {
69 |     return new GraphQLError(duplicateFragmentNameMessage(fragmentName), [
70 |       knownFragmentNames[fragmentName],
71 |       node.name,
72 |     ])
73 |   } else {
74 |     knownFragmentNames[fragmentName] = node.name
75 |   }
76 | }
77 | 


--------------------------------------------------------------------------------
/src/utils/toObservable.js:
--------------------------------------------------------------------------------
 1 | import Observable from 'zen-observable'
 2 | 
 3 | export function toObservable (iterator) {
 4 |   return new Observable(observer => {
 5 |     ;(async () => {
 6 |       try {
 7 |         for await (const tick of iterator) {
 8 |           observer.next(tick)
 9 |         }
10 |       } catch (e) {
11 |         iterator.return()
12 |         observer.error(e)
13 |       }
14 |     })()
15 |     return () => {
16 |       observer.complete()
17 |       iterator.return()
18 |     }
19 |   })
20 | }
21 | 


--------------------------------------------------------------------------------
/src/utils/typeOf.js:
--------------------------------------------------------------------------------
1 | export function typeOf (value) {
2 |   return Object.prototype.toString.call(value).slice(8, -1)
3 | }
4 | 


--------------------------------------------------------------------------------
/src/utils/validateWithoutSchema.js:
--------------------------------------------------------------------------------
 1 | import { getOperationASTs, } from './getOperationASTs'
 2 | 
 3 | import {
 4 |   loneAnonymousOperation,
 5 |   uniqueFragmentNames,
 6 |   singleFieldSubscriptions,
 7 | } from './rules'
 8 | 
 9 | export function validateWithoutSchema (document) {
10 |   const operationCount = getOperationASTs(document).length
11 |   const knownFragmentNames = Object.create(null)
12 | 
13 |   let errors = []
14 | 
15 |   for (const node of document.definitions) {
16 |     const err =
17 |       loneAnonymousOperation(node, operationCount) ||
18 |       uniqueFragmentNames(node, knownFragmentNames) ||
19 |       singleFieldSubscriptions(node)
20 | 
21 |     err && errors.push(err)
22 |   }
23 | 
24 |   return errors
25 | }
26 | 


--------------------------------------------------------------------------------
/src/utils/when.js:
--------------------------------------------------------------------------------
 1 | export function when (condition, transform, data) {
 2 |   let bool = Boolean(condition)
 3 | 
 4 |   if (typeof condition === 'function') {
 5 |     bool = Boolean(condition(data))
 6 |   }
 7 | 
 8 |   return bool
 9 |     ? typeof transform === 'function' ? transform(data) : transform
10 |     : data
11 | }
12 | 


--------------------------------------------------------------------------------