simplyview 2.0.1 → 2.0.3

package/dist/simply.everything.js

@@ -639,8 +639,8 @@ properties for a given parent, keep seperate index for this?
         handleEvents: function() {
             global.addEventListener('popstate', function() {
                 if (route.match(getPath(document.location.pathname + document.location.hash)) === false) {
-					route.match(getPath(document.location.pathname));
-				}
+                    route.match(getPath(document.location.pathname));
+                }
             });
             global.document.addEventListener('click', linkHandler);
         },
@@ -665,22 +665,24 @@ properties for a given parent, keep seperate index for this?
 
             var matches;
             if (!path) {
-				if (route.match(document.location.pathname+document.location.hash)) {
-					return true;
-				} else {
-					return route.match(document.location.pathname);
-				}
+                if (route.match(document.location.pathname+document.location.hash)) {
+                    return true;
+                } else {
+                    return route.match(document.location.pathname);
+                }
             }
             path = getPath(path);
             for ( var i=0; i<routeInfo.length; i++) {
-                if (path && path[path.length-1]!='/') {
-                    matches = routeInfo[i].match.exec(path+'/');
-                    if (matches) {
-                        path+='/';
-                        history.replaceState({}, '', getUrl(path));
+                matches = routeInfo[i].match.exec(path);
+                if (!matches || !matches.length) {
+                    if (path && path[path.length-1]!='/') {
+                        matches = routeInfo[i].match.exec(path+'/');
+                        if (matches) {
+                            path+='/';
+                            history.replaceState({}, '', getUrl(path));
+                        }
                     }
                 }
-                matches = routeInfo[i].match.exec(path);
                 if (matches && matches.length) {
                     var params = {};
                     routeInfo[i].params.forEach(function(key, i) {
@@ -697,9 +699,9 @@ properties for a given parent, keep seperate index for this?
                     args.result = routeInfo[i].action.call(route, params);
                     runListeners('finish', args);
                     return args.result;
-				}
+                }
             }
-			return false;
+            return false;
         },
         goto: function(path) {
             history.pushState({},'',getUrl(path));
@@ -734,7 +736,7 @@ properties for a given parent, keep seperate index for this?
             listeners[action][route] = listeners[action][route].filter(function(listener) {
                 return listener != callback;
             });
-		},
+        },
         init: function(params) {
             if (params.root) {
                 options.root = params.root;
@@ -1098,6 +1100,68 @@ properties for a given parent, keep seperate index for this?
     }
  
 })(this);
+(function(global) {
+    'use strict';
+
+    function keyboard(app, config) {
+        var keys = config;
+
+        if (!app) {
+            app = {};
+        }
+        if (!app.container) {
+            app.container = document.body;
+        }
+        app.container.addEventListener('keydown', (e) => {
+            if (e.isComposing || e.keyCode === 229) {
+                return;
+            }
+            if (e.defaultPrevented) {
+                return;
+            }
+            if (!e.target) {
+                return;
+            }
+
+            let selectedKeyboard = 'default';
+            if (e.target.closest('[data-simply-keyboard]')) {
+                selectedKeyboard = e.target.closest('[data-simply-keyboard]').dataset.simplyKeyboard;
+            }
+            let key = '';
+            if (e.ctrlKey && e.keyCode!=17) {
+                key+='Control+';
+            }
+            if (e.metaKey && e.keyCode!=224) {
+                key+='Meta+';
+            }
+            if (e.altKey && e.keyCode!=18) {
+                key+='Alt+';
+            }
+            if (e.shiftKey && e.keyCode!=16) {
+                key+='Shift+';
+            }
+            key+=e.key;
+
+            if (keys[selectedKeyboard] && keys[selectedKeyboard][key]) {
+                let keyboard = keys[selectedKeyboard]
+                keyboard.app = app;
+                keyboard[key].call(keyboard,e);
+            }
+        });
+
+        return keys;
+    }
+
+
+    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
+        module.exports = keyboard;
+    } else {
+        if (!global.simply) {
+            global.simply = {};
+        }
+        global.simply.keyboard = keyboard;
+    }
+})(this);
 (function(global) {
 	'use strict';
 
@@ -1730,7 +1794,7 @@ properties for a given parent, keep seperate index for this?
     'use strict';
 
     var api = {
-		/**
+        /**
          * Returns a Proxy object that translates property access to a URL in the api
          * and method calls to a fetch on that URL.
          * @param options: a list of options for fetch(), 
@@ -1852,27 +1916,27 @@ properties for a given parent, keep seperate index for this?
          */
         getResult: function(response, options) {
             if (response.ok) {
-				switch(options.responseFormat) {
-					case 'text':
-						return response.text();
-					break;
-					case 'formData':
-						return response.formData();
-					break;
-					case 'blob':
-						return response.blob();
-					break;
-					case 'arrayBuffer':
-						return response.arrayBuffer();
-					break;
-					case 'unbuffered':
-						return response.body;
-					break;
-					case 'json':
-					default:
-		                return response.json();
-					break;
-				}
+                switch(options.responseFormat) {
+                    case 'text':
+                        return response.text();
+                    break;
+                    case 'formData':
+                        return response.formData();
+                    break;
+                    case 'blob':
+                        return response.blob();
+                    break;
+                    case 'arrayBuffer':
+                        return response.arrayBuffer();
+                    break;
+                    case 'unbuffered':
+                        return response.body;
+                    break;
+                    case 'json':
+                    default:
+                        return response.json();
+                    break;
+                }
             } else {
                 throw {
                     status: response.status,
@@ -1880,23 +1944,22 @@ properties for a given parent, keep seperate index for this?
                     response: response
                 }
             }
-		},
-
-		logError: function(error, options) {
+        },
+        logError: function(error, options) {
             console.error(error.status, error.message);
-		}
+        }
     }
 
     var defaultOptions = {
-		path: '',
-		responseFormat: 'json',
-		paramsFormat: 'search',
-		verbs: ['get','post'],
-		handlers: {
-			fetch:  api.fetch,
-			result: api.getResult,
-			error:  api.logError
-		}
+        path: '',
+        responseFormat: 'json',
+        paramsFormat: 'search',
+        verbs: ['get','post'],
+        handlers: {
+            fetch:  api.fetch,
+            result: api.getResult,
+            error:  api.logError
+        }
     };
 
     function cd(path, name) {
@@ -1907,20 +1970,20 @@ properties for a given parent, keep seperate index for this?
         return path+encodeURIComponent(name);
     }
 
-	function fetchChain(prop, params) {
-		var options = this;
-		return this.handlers.fetch
-			.call(this, prop, params, options)
-			.then(function(res) {
-				return options.handlers.result.call(options, res, options);
-			})
-			.catch(function(error) {
-				return options.handlers.error.call(options, error, options);
-			});
-	}
+    function fetchChain(prop, params) {
+        var options = this;
+        return this.handlers.fetch
+            .call(this, prop, params, options)
+            .then(function(res) {
+                return options.handlers.result.call(options, res, options);
+            })
+            .catch(function(error) {
+                return options.handlers.error.call(options, error, options);
+            });
+    }
 
     function getApiHandler(options) {
-		options.handlers = Object.assign({}, defaultOptions.handlers, options.handlers);
+        options.handlers = Object.assign({}, defaultOptions.handlers, options.handlers);
         options = Object.assign({}, defaultOptions, options);
 
         return {
@@ -1986,7 +2049,8 @@ properties for a given parent, keep seperate index for this?
                     simply.route.match(global.location.pathname+global.location.hash);
                 });
             }
-            this.container = options.container  || document.body;
+            this.container = options.container || document.body;
+            this.keyboard  = simply.keyboard ? simply.keyboard(this, options.keyboard || {}) : false;
             this.actions   = simply.action ? simply.action(this, options.actions) : false;
             this.commands  = simply.command ? simply.command(this, options.commands) : false;
             this.resize    = simply.resize ? simply.resize(this, options.resize) : false;

package/docs/simply.keyboard.md

@@ -0,0 +1,60 @@
+# simply.keyboard
+
+simply.keyboard is a simple library to add keyboard support to your application:
+
+```javascript
+let myKeys = {
+  default: {
+    ArrowDown: (e) => {
+      // handle arrow down
+    }
+  }
+}
+simply.keyboard(myApp, myKeys);
+```
+
+But generally you won't use this directly, but through simply.app:
+
+```javascript
+var myApp = simply.app({
+  keyboard: {
+    default: {
+      ArrowDown: (e) => {
+
+      }
+    }
+  }
+});
+```
+
+You can add multiple keyboard definitions:
+
+```javascript
+var counterApp = simply.app({
+  keyboard: {
+    default: {
+      ArrowDown: (e) => {
+
+      }
+    },
+    alternate: {
+      ArrowDown: (e) => {
+
+      }
+    }
+  }
+});
+```
+
+The default keyboard is 'default', but you can switch the keyboard by setting this attribute:
+
+```html
+<div data-simply-keyboard="alternate">
+  <input type="text" name="example">
+</div>
+```
+
+Whenever a keyboard `keydown` is fired, simply.keyboard will look for the closest parent with a `data-simply-keyboard` attribute. If found, it will use that keyboard definition. If not found, it will use `default`.
+
+The `keydown` event is only handled if the activeElement (the element that has focus) is inside the application container. See `simply.app` for more on that.
+

package/examples/counter.html

@@ -16,6 +16,7 @@
 	<div>Counter is now: <span data-simply-field="counter"></span></div>
 </div>
 
+<script src="//cdn.simplyedit.io/1/simply-edit.js"></script>
 <script src="../dist/simply.everything.js"></script>
 <script>
 	var counterApp = simply.app({

package/js/simply.api.js

@@ -2,7 +2,7 @@
     'use strict';
 
     var api = {
-		/**
+        /**
          * Returns a Proxy object that translates property access to a URL in the api
          * and method calls to a fetch on that URL.
          * @param options: a list of options for fetch(), 
@@ -124,27 +124,27 @@
          */
         getResult: function(response, options) {
             if (response.ok) {
-				switch(options.responseFormat) {
-					case 'text':
-						return response.text();
-					break;
-					case 'formData':
-						return response.formData();
-					break;
-					case 'blob':
-						return response.blob();
-					break;
-					case 'arrayBuffer':
-						return response.arrayBuffer();
-					break;
-					case 'unbuffered':
-						return response.body;
-					break;
-					case 'json':
-					default:
-		                return response.json();
-					break;
-				}
+                switch(options.responseFormat) {
+                    case 'text':
+                        return response.text();
+                    break;
+                    case 'formData':
+                        return response.formData();
+                    break;
+                    case 'blob':
+                        return response.blob();
+                    break;
+                    case 'arrayBuffer':
+                        return response.arrayBuffer();
+                    break;
+                    case 'unbuffered':
+                        return response.body;
+                    break;
+                    case 'json':
+                    default:
+                        return response.json();
+                    break;
+                }
             } else {
                 throw {
                     status: response.status,
@@ -152,23 +152,22 @@
                     response: response
                 }
             }
-		},
-
-		logError: function(error, options) {
+        },
+        logError: function(error, options) {
             console.error(error.status, error.message);
-		}
+        }
     }
 
     var defaultOptions = {
-		path: '',
-		responseFormat: 'json',
-		paramsFormat: 'search',
-		verbs: ['get','post'],
-		handlers: {
-			fetch:  api.fetch,
-			result: api.getResult,
-			error:  api.logError
-		}
+        path: '',
+        responseFormat: 'json',
+        paramsFormat: 'search',
+        verbs: ['get','post'],
+        handlers: {
+            fetch:  api.fetch,
+            result: api.getResult,
+            error:  api.logError
+        }
     };
 
     function cd(path, name) {
@@ -179,20 +178,20 @@
         return path+encodeURIComponent(name);
     }
 
-	function fetchChain(prop, params) {
-		var options = this;
-		return this.handlers.fetch
-			.call(this, prop, params, options)
-			.then(function(res) {
-				return options.handlers.result.call(options, res, options);
-			})
-			.catch(function(error) {
-				return options.handlers.error.call(options, error, options);
-			});
-	}
+    function fetchChain(prop, params) {
+        var options = this;
+        return this.handlers.fetch
+            .call(this, prop, params, options)
+            .then(function(res) {
+                return options.handlers.result.call(options, res, options);
+            })
+            .catch(function(error) {
+                return options.handlers.error.call(options, error, options);
+            });
+    }
 
     function getApiHandler(options) {
-		options.handlers = Object.assign({}, defaultOptions.handlers, options.handlers);
+        options.handlers = Object.assign({}, defaultOptions.handlers, options.handlers);
         options = Object.assign({}, defaultOptions, options);
 
         return {

package/js/simply.app.js

@@ -29,7 +29,8 @@
                     simply.route.match(global.location.pathname+global.location.hash);
                 });
             }
-            this.container = options.container  || document.body;
+            this.container = options.container || document.body;
+            this.keyboard  = simply.keyboard ? simply.keyboard(this, options.keyboard || {}) : false;
             this.actions   = simply.action ? simply.action(this, options.actions) : false;
             this.commands  = simply.command ? simply.command(this, options.commands) : false;
             this.resize    = simply.resize ? simply.resize(this, options.resize) : false;

package/js/simply.keyboard.js

@@ -0,0 +1,62 @@
+(function(global) {
+    'use strict';
+
+    function keyboard(app, config) {
+        var keys = config;
+
+        if (!app) {
+            app = {};
+        }
+        if (!app.container) {
+            app.container = document.body;
+        }
+        app.container.addEventListener('keydown', (e) => {
+            if (e.isComposing || e.keyCode === 229) {
+                return;
+            }
+            if (e.defaultPrevented) {
+                return;
+            }
+            if (!e.target) {
+                return;
+            }
+
+            let selectedKeyboard = 'default';
+            if (e.target.closest('[data-simply-keyboard]')) {
+                selectedKeyboard = e.target.closest('[data-simply-keyboard]').dataset.simplyKeyboard;
+            }
+            let key = '';
+            if (e.ctrlKey && e.keyCode!=17) {
+                key+='Control+';
+            }
+            if (e.metaKey && e.keyCode!=224) {
+                key+='Meta+';
+            }
+            if (e.altKey && e.keyCode!=18) {
+                key+='Alt+';
+            }
+            if (e.shiftKey && e.keyCode!=16) {
+                key+='Shift+';
+            }
+            key+=e.key;
+
+            if (keys[selectedKeyboard] && keys[selectedKeyboard][key]) {
+                let keyboard = keys[selectedKeyboard]
+                keyboard.app = app;
+                keyboard[key].call(keyboard,e);
+            }
+        });
+
+        return keys;
+    }
+
+
+    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
+        module.exports = keyboard;
+    } else {
+        if (!global.simply) {
+            global.simply = {};
+        }
+        global.simply.keyboard = keyboard;
+    }
+})(this);

package/js/simply.route.js

@@ -118,8 +118,8 @@
         handleEvents: function() {
             global.addEventListener('popstate', function() {
                 if (route.match(getPath(document.location.pathname + document.location.hash)) === false) {
-					route.match(getPath(document.location.pathname));
-				}
+                    route.match(getPath(document.location.pathname));
+                }
             });
             global.document.addEventListener('click', linkHandler);
         },
@@ -144,22 +144,24 @@
 
             var matches;
             if (!path) {
-				if (route.match(document.location.pathname+document.location.hash)) {
-					return true;
-				} else {
-					return route.match(document.location.pathname);
-				}
+                if (route.match(document.location.pathname+document.location.hash)) {
+                    return true;
+                } else {
+                    return route.match(document.location.pathname);
+                }
             }
             path = getPath(path);
             for ( var i=0; i<routeInfo.length; i++) {
-                if (path && path[path.length-1]!='/') {
-                    matches = routeInfo[i].match.exec(path+'/');
-                    if (matches) {
-                        path+='/';
-                        history.replaceState({}, '', getUrl(path));
+                matches = routeInfo[i].match.exec(path);
+                if (!matches || !matches.length) {
+                    if (path && path[path.length-1]!='/') {
+                        matches = routeInfo[i].match.exec(path+'/');
+                        if (matches) {
+                            path+='/';
+                            history.replaceState({}, '', getUrl(path));
+                        }
                     }
                 }
-                matches = routeInfo[i].match.exec(path);
                 if (matches && matches.length) {
                     var params = {};
                     routeInfo[i].params.forEach(function(key, i) {
@@ -176,9 +178,9 @@
                     args.result = routeInfo[i].action.call(route, params);
                     runListeners('finish', args);
                     return args.result;
-				}
+                }
             }
-			return false;
+            return false;
         },
         goto: function(path) {
             history.pushState({},'',getUrl(path));
@@ -213,7 +215,7 @@
             listeners[action][route] = listeners[action][route].filter(function(listener) {
                 return listener != callback;
             });
-		},
+        },
         init: function(params) {
             if (params.root) {
                 options.root = params.root;

package/make

@@ -7,6 +7,7 @@ cat js/simply.observe.js \
     js/simply.activate.js \
     js/simply.collect.js \
     js/simply.command.js \
+    js/simply.keyboard.js \
     js/simply.action.js \
     js/simply.resize.js \
     js/simply.include.js \

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "simplyview",
-  "version": "2.0.1",
+  "version": "2.0.3",
   "description": "Library to rapidly build UI components, using declarative tools",
   "main": "dist/simply.everything.js",
   "directories": {

package/examples/githubv4.html

@@ -1,107 +0,0 @@
-<!doctype html>
-<meta charset="utf-8">
-<pre id="output"></pre>
-<script src="../dist/simply.everything.js"></script>
-<script src="../js/simply.api.js"></script>
-<h1>Github repo browser</h1>
-<form data-simply-command="showRepo">
-	<label>Owner
-		<input type="text" name="owner">
-	</label>
-	<label>Repository
-		<input type="text" name="repo">
-	</label>
-	<label>Application token
-		<input type="text" name="token">
-	</label>
-	<button type="submit">OK</button>
-</form>
-<main>
-	<h2 data-simply-field="repo.name"></h2>
-	<div data-simply-field="repo.description"></div>
-	<ul data-simply-list="repo.files.entries">
-		<template>
-			<li><span data-simply-field="name"></span></li>
-		</template>
-	</ul>
-</main>
-<script>
-	simply.bind = false;
-	document.addEventListener('simply-content-loaded', function() {
-	 	editor.pageData.repo = {
-			name: "foo",
-			files: {
-				entries: [
-					{
-						name: 'barf'
-					}
-				]
-			}
-		};
-		return;
-	});
-
-
-    var githubURL = 'https://api.github.com/graphql';
-    var githubToken = 'af948d67c63a2f9f940e0b0be7a2d5ff3446327f';
-    var github = {
-        repository: simply.api.graphqlQuery(
-        	githubURL, 
-        	`query($owner:String!, $repo:String!) {
-			 	repository(name:$repo, owner:$owner) {
-			 		id
-			 		name
-			 		description
-			 		files: object(expression: "master:") {
-			 			... on Tree {
-			 				entries {
-			 					oid
-			 					name
-			 					type
-			 				}
-			 			}
-
-			 		}
-			 	}   
-			}`, 
-			{
-			    headers: { Authorization: 'bearer '+githubToken },
-			    responseResult: 'data.repository',
-			    responseErrors: 'errors'
-			}
-		)
-    };
-/*	
-    github.repository({
-        login: 'poef',
-        repo: 'arc-web'
-    }).then(function(data) {
-        document.getElementById('output').innerText = JSON.stringify(data,
-        null, 4);
-    });
-
-    async function foo() {
-	    var foo = await github.repository({ login: 'poef', repo: 'arc-web'});
-	    console.log(foo);
-	};
-	foo();
-*/
-	var githubBrowser = simply.app({
-		commands: {
-			'showRepo': function(form, values) {
-				if (values.token) {
-					githubToken = values.token;
-				}
-				github.repository({
-					owner: values.owner,
-					repo: values.repo
-				})
-				.then(function(data) {
-					githubBrowser.view.repo = data.data.repository;
-				});
-			}
-		}
-	})
-
-</script>
-<script src="//cdn.simplyedit.io/1/simply-edit.js"></script>

package/examples/graphql.html

@@ -1,51 +0,0 @@
-<!doctype html>
-<ul data-simply-list="vakleergebieden">
-<template>
-  <li><span data-simply-field="title"></span></li>
-</template>
-</ul>
-<script src="//cdn.simplyedit.io/1/simply-edit.js" data-storage="none"></script>
-<script src="../dist/simply.everything.js"></script>
-<script>
-    var baseURL = '//localhost:3000/';
-    
-    var app = simply.app({
-        routes: {
-            '/:*': function() {
-                api.Vakleergebied().then(result => {
-                    app.view.vakleergebieden = result.data.allVakleergebied;
-                });
-            }
-        },
-        view: {
-            vakleergebieden: []
-        }
-    });
-    
-    var api = simply.api.proxy({
-        baseURL: baseURL
-    });
-
-    api.Vakleergebied = simply.api.graphqlQuery(baseURL,
-	'Vakleergebied',
-`fragment NiveauShort on Niveau {
-    id
-    title
-    prefix
-}
-query Vakleergebied($page:Int,$perPage:Int) {
-  allVakleergebied(page:$page,perPage:$perPage,sortField:"title") {
-    id
-    prefix
-    title
-    prefix
-    Niveau {
-      ...NiveauShort
-    }
-  }
-  _allVakleergebiedMeta {
-    count
-  }
-}`);
-
-</script>

package/examples/graphql.html~

@@ -1,35 +0,0 @@
-<!doctype html>
-<script src="//cdn.simplyedit.io/1/simply-edit.js" data-storage="none"></script>
-<script src="../dist/simply.everything.js"></script>
-<script>
-        var baseURL = '//localhost:3000/';
-        
-	var api = simply.api.proxy({
-		baseURL: baseURL
-	});
-
-	api.Vakleergebied = simply.api.graphqlQuery(baseURL,
-	'Vakleergebied',
-`fragment NiveauShort on Niveau {
-    id
-    title
-    prefix
-}
-query Vakleergebied($page:Int,$perPage:Int) {
-  allVakleergebied(page:$page,perPage:$perPage,sortField:"title") {
-    id
-    prefix
-    title
-    prefix
-    Niveau {
-      ...NiveauShort
-    }
-  }
-  _allVakleergebiedMeta {
-    count
-  }
-}`);
-
-	api.Vakleergebied()
-	.then(result => console.log(result));
-</script>

package/js/simply.api.js~

@@ -1,225 +0,0 @@
-(function(global) {
-    'use strict';
-
-    var api = {
-		/**
-         * Returns a Proxy object that translates property access to a URL in the api
-         * and method calls to a fetch on that URL.
-         * @param options: a list of options for fetch(), 
-		 * see the 'init' parameter at https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/fetch#parameters 
-         * additionally:
-         * - baseURL: (required) the endpoint of the API
-         * - path: the current path in the API, is appended to the baseURL
-         * - verbs: list of http verbs to allow as methods, default ['get','post']
-         * - handlers.fetch: alternative fetch method
-         * - handlers.result: alternative getResult method
-         * - handlers.error: alternative error method
-         * - user (and password): if set, a basic authentication header will be added
-         * - paramsFormat: either 'formData', 'json' or 'search'. Default is search.
-         * - responseFormat: test, formData, blob, json, arrayBuffer or unbuffered. Default is json.
-         * @return Proxy
-         */
-        proxy: function(options) {
-            var cache = () => {};
-            cache.$options = Object.assign({}, options);
-            return new Proxy( cache, getApiHandler(cache.$options) );
-        },
-
-        /**
-         * Fetches the options.baseURL using the fetch api and returns a promise
-         * Extra options in addition to those of global.fetch():
-         * - user (and password): if set, a basic authentication header will be added
-         * - paramsFormat: either 'formData', 'json' or 'search'
-         * By default params, if set, will be added to the baseURL as searchParams
-         * @param method one of the http verbs, e.g. get, post, etc.
-         * @param options the options for fetch(), with some additions
-         * @param params the parameters to send with the request, as javascript/json data
-         * @return Promise
-         */
-        fetch: function(method, params, options) {
-            if (!options.url) {
-                if (!options.baseURL) {
-                    throw new Error('No url or baseURL in options object');
-                }
-                while (options.baseURL[options.baseURL.length-1]=='/') {
-                    options.baseURL = options.baseURL.substr(0, options.baseURL.length-1);
-                }
-                var url = new URL(options.baseURL+options.path);
-            } else {
-                var url = options.url;
-            }
-            var fetchOptions = Object.assign({}, options);
-            if (!fetchOptions.headers) {
-                fetchOptions.headers = {};
-            }
-            if (params) {
-                if (method=='GET') {
-                    var paramsFormat = 'search';
-                } else {
-                    var paramsFormat = options.paramsFormat;
-                }
-                switch(paramsFormat) {
-                    case 'formData':
-                        var formData = new FormData();
-                        for (const name in params) {
-                            formData.append(name, params[name]);
-                        }
-                        if (!fetchOptions.headers['Content-Type']) {
-                            fetchOptions.headers['Content-Type'] = 'application/x-www-form-urlencoded';
-                        }
-                        break;
-                    case 'json':
-                        var formData = JSON.stringify(params);
-                        if (!fetchOptions.headers['Content-Type']) {
-                            fetchOptions.headers['Content-Type'] = 'application/json';
-                        }
-                        break;
-                    case 'search':
-                        var searchParams = url.searchParams; //new URLSearchParams(url.search.slice(1));
-                        for (const name in params) {
-                            searchParams.set(name, params[name]);
-                        }
-                        url.search = searchParams.toString();
-                        break;
-                    default:
-                        throw Error('Unknown options.paramsFormat '+options.paramsFormat+'. Select one of formData, json or search.');
-                        break;
-                }
-            }
-            if (formData) {
-                fetchOptions.body = formData
-            }
-            if (options.user) {
-                fetchOptions.headers['Authorization'] = 'Basic '+btoa(options.user+':'+options.password);
-            }
-            fetchOptions.method = method.toUpperCase();
-            var fetchURL = url.toString()
-            return fetch(fetchURL, fetchOptions);
-        },
-        graphqlQuery: function(url, operationName, query, options) {
-            options = Object.assign({ paramsFormat: 'json', url: url, responseFormat: 'json' }, options)
-            return function(params) {
-                return simply.api.fetch(
-                    'POST', 
-                    {
-                        operationName: operationName,
-                        query: query,
-                        variables: params || {}
-                    },
-                    options 
-                ).then(function(response) {
-                    return simply.api.getResult(response, options);
-                });
-            }  
-        },
-        /**
-         * Handles the response and returns a Promise with the response data as specified
-         * @param response Response
-         * @param options
-         * - responseFormat: one of 'text', 'formData', 'blob', 'arrayBuffer', 'unbuffered' or 'json'.
-         * The default is json.
-         */
-		getResult: function(response, options) {
-            if (response.ok) {
-				switch(options.responseFormat) {
-					case 'text':
-						return response.text();
-					break;
-					case 'formData':
-						return response.formData();
-					break;
-					case 'blob':
-						return response.blob();
-					break;
-					case 'arrayBuffer':
-						return response.arrayBuffer();
-					break;
-					case 'unbuffered':
-						return response.body;
-					break;
-					case 'json':
-					default:
-		                return response.json();
-					break;
-				}
-            } else {
-                throw {
-                    status: response.status,
-                    message: response.statusText,
-                    response: response
-                }
-            }
-		},
-		logError: function(error, options) {
-            console.error(error.status, error.message);
-		}
-    }
-
-    var defaultOptions = {
-		path: '',
-		responseFormat: 'json',
-		paramsFormat: 'search',
-		verbs: ['get','post'],
-		handlers: {
-			fetch:  api.fetch,
-			result: api.getResult,
-			error:  api.logError
-		}
-    };
-
-    function cd(path, name) {
-        name = name.replace(/\//g,'');
-        if (!path.length || path[path.length-1]!=='/') {
-            path+='/';
-        }
-        return path+encodeURIComponent(name);
-    }
-
-	function fetchChain(prop, params) {
-		var options = this;
-		return this.handlers.fetch
-			.call(this, prop, params, options)
-			.then(function(res) {
-				return options.handlers.result.call(options, res, options);
-			})
-			.catch(function(error) {
-				return options.handlers.error.call(options, error, options);
-			});
-	}
-
-    function getApiHandler(options) {
-		options.handlers = Object.assign({}, defaultOptions.handlers, options.handlers);
-        options = Object.assign({}, defaultOptions, options);
-
-        return {
-            get: function(cache, prop) {
-                if (!cache[prop]) {
-                    if (options.verbs.indexOf(prop)!=-1) { 
-                        cache[prop] = function(params) {
-                            return fetchChain.call(options, prop, params);
-                        }
-                    } else {
-                        cache[prop] = api.proxy(Object.assign({}, options, {
-                            path: cd(options.path, prop)
-                        }));
-                    }
-                }
-                return cache[prop];
-            },
-            apply: function(cache, thisArg, params) {
-                return fetchChain.call(options, 'get', params[0] ? params[0] : null)
-            }
-        }
-    }
-
-
-    if (typeof module !== 'undefined' && typeof module.exports !== 'undefined') {
-        module.exports = api;
-    } else {
-        if (!global.simply) {
-            global.simply = {};
-        }
-        global.simply.api = api;
-    }
-
-})(this);

package/package.json~

@@ -1,31 +0,0 @@
-{
-  "name": "simplyview",
-  "version": "2.0.0",
-  "description": "Library to rapidly build UI components, using declarative tools",
-  "main": "dist/simply.everything.js",
-  "directories": {
-    "example": "examples"
-  },
-  "scripts": {
-    "test": "jest"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/simplyedit/simplyview.git"
-  },
-  "keywords": [
-    "UI",
-    "components",
-    "declarative",
-    "reactive"
-  ],
-  "author": "auke@muze.nl",
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/simplyedit/simplyview/issues"
-  },
-  "homepage": "https://github.com/simplyedit/simplyview#readme",
-  "devDependencies": {
-    "jest": "^24.9.0"
-  }
-}