mande - npm Package Compare versions

Comparing version 0.0.4 to 0.0.5

CHANGELOG.md

@@ -0,1 +1,7 @@
+## [0.0.5](https://github.com/posva/mande/compare/v0.0.4...v0.0.5) (2020-05-18)
+
+### Features
+
+- allow omitting the url in post, put, patch ([bbcdad4](https://github.com/posva/mande/commit/bbcdad4b6d99725e7ee5fe81dfcda85389950841))
+
 ## [0.0.4](https://github.com/posva/mande/compare/v0.0.3...v0.0.4) (2020-05-17)
@@ -2,0 +8,0 @@

dist/mande.common.js

@@ -37,3 +37,13 @@ /*!
     let options = Object.assign({ responseAs: 'json', headers: {} }, globalOptions);
-    function _fetch(method, url, data, localOptions = {}) {
+    function _fetch(method, urlOrData, dataOrOptions, localOptions = {}) {
+        let url;
+        let data;
+        if (typeof urlOrData === 'object') {
+            url = '';
+            data = urlOrData;
+        }
+        else {
+            url = urlOrData;
+            data = dataOrOptions;
+        }
         let mergedOptions = Object.assign(Object.assign(Object.assign({}, options), { method }), localOptions);
@@ -40,0 +50,0 @@ let query = Object.assign(Object.assign({}, options.query), localOptions.query);

dist/mande.esm.js

@@ -33,3 +33,13 @@ /*!
     let options = Object.assign({ responseAs: 'json', headers: {} }, globalOptions);
-    function _fetch(method, url, data, localOptions = {}) {
+    function _fetch(method, urlOrData, dataOrOptions, localOptions = {}) {
+        let url;
+        let data;
+        if (typeof urlOrData === 'object') {
+            url = '';
+            data = urlOrData;
+        }
+        else {
+            url = urlOrData;
+            data = dataOrOptions;
+        }
         let mergedOptions = Object.assign(Object.assign(Object.assign({}, options), { method }), localOptions);
@@ -36,0 +46,0 @@ let query = Object.assign(Object.assign({}, options.query), localOptions.query);

dist/mande.esm.min.js

@@ -6,2 +6,2 @@ /*!
   */
-let e=/\/+$/,n=/^\/+/;function t(t,s={}){let r=Object.assign({responseAs:"json",headers:{}},s);function o(s,o,a,i={}){let c=Object.assign(Object.assign(Object.assign({},r),{method:s}),i),u=Object.assign(Object.assign({},r.query),i.query),{responseAs:l}=c;return c.headers=Object.assign(Object.assign(Object.assign({},r.headers),{Accept:"application/json","Content-Type":"application/json"}),i.headers),o=function(t,s){return t.replace(e,"")+"/"+s.replace(n,"")}(t,"number"==typeof o?""+o:o||""),o+=function(e){let n=Object.keys(e).map(n=>[n,e[n]].map(encodeURIComponent).join("=")).join("&");return n?"?"+n:""}(u),a&&(c.body=JSON.stringify(a)),fetch(o,c).then(e=>{if(e.status>=200&&e.status<300)return"response"===l?e:204==e.status?null:e[l]();let n=new Error(e.statusText);throw n.response=e,n})}return{options:r,post:o.bind(null,"POST"),put:o.bind(null,"PUT"),patch:o.bind(null,"PATCH"),get:(e,n)=>o("GET",e,null,n),delete:(e,n)=>o("DELETE",e,null,n)}}export{t as mande};
+let e=/\/+$/,t=/^\/+/;function n(n,s={}){let o=Object.assign({responseAs:"json",headers:{}},s);function r(s,r,a,i={}){let c,l;"object"==typeof r?(c="",l=r):(c=r,l=a);let u=Object.assign(Object.assign(Object.assign({},o),{method:s}),i),p=Object.assign(Object.assign({},o.query),i.query),{responseAs:b}=u;return u.headers=Object.assign(Object.assign(Object.assign({},o.headers),{Accept:"application/json","Content-Type":"application/json"}),i.headers),c=function(n,s){return n.replace(e,"")+"/"+s.replace(t,"")}(n,"number"==typeof c?""+c:c||""),c+=function(e){let t=Object.keys(e).map(t=>[t,e[t]].map(encodeURIComponent).join("=")).join("&");return t?"?"+t:""}(p),l&&(u.body=JSON.stringify(l)),fetch(c,u).then(e=>{if(e.status>=200&&e.status<300)return"response"===b?e:204==e.status?null:e[b]();let t=new Error(e.statusText);throw t.response=e,t})}return{options:o,post:r.bind(null,"POST"),put:r.bind(null,"PUT"),patch:r.bind(null,"PATCH"),get:(e,t)=>r("GET",e,null,t),delete:(e,t)=>r("DELETE",e,null,t)}}export{n as mande};

dist/mande.js

@@ -36,3 +36,13 @@ /*!
       let options = Object.assign({ responseAs: 'json', headers: {} }, globalOptions);
-      function _fetch(method, url, data, localOptions = {}) {
+      function _fetch(method, urlOrData, dataOrOptions, localOptions = {}) {
+          let url;
+          let data;
+          if (typeof urlOrData === 'object') {
+              url = '';
+              data = urlOrData;
+          }
+          else {
+              url = urlOrData;
+              data = dataOrOptions;
+          }
           let mergedOptions = Object.assign(Object.assign(Object.assign({}, options), { method }), localOptions);
@@ -39,0 +49,0 @@ let query = Object.assign(Object.assign({}, options.query), localOptions.query);

dist/mande.min.js

@@ -6,2 +6,2 @@ /*!
   */
-var Mande=function(e){"use strict";let n=/\/+$/,t=/^\/+/;return e.mande=function(e,s={}){let r=Object.assign({responseAs:"json",headers:{}},s);function a(s,a,i,o={}){let u=Object.assign(Object.assign(Object.assign({},r),{method:s}),o),c=Object.assign(Object.assign({},r.query),o.query),{responseAs:l}=u;return u.headers=Object.assign(Object.assign(Object.assign({},r.headers),{Accept:"application/json","Content-Type":"application/json"}),o.headers),a=function(e,s){return e.replace(n,"")+"/"+s.replace(t,"")}(e,"number"==typeof a?""+a:a||""),a+=function(e){let n=Object.keys(e).map(n=>[n,e[n]].map(encodeURIComponent).join("=")).join("&");return n?"?"+n:""}(c),i&&(u.body=JSON.stringify(i)),fetch(a,u).then(e=>{if(e.status>=200&&e.status<300)return"response"===l?e:204==e.status?null:e[l]();let n=new Error(e.statusText);throw n.response=e,n})}return{options:r,post:a.bind(null,"POST"),put:a.bind(null,"PUT"),patch:a.bind(null,"PATCH"),get:(e,n)=>a("GET",e,null,n),delete:(e,n)=>a("DELETE",e,null,n)}},e}({});
+var Mande=function(e){"use strict";let t=/\/+$/,n=/^\/+/;return e.mande=function(e,s={}){let r=Object.assign({responseAs:"json",headers:{}},s);function o(s,o,a,i={}){let c,u;"object"==typeof o?(c="",u=o):(c=o,u=a);let l=Object.assign(Object.assign(Object.assign({},r),{method:s}),i),p=Object.assign(Object.assign({},r.query),i.query),{responseAs:b}=l;return l.headers=Object.assign(Object.assign(Object.assign({},r.headers),{Accept:"application/json","Content-Type":"application/json"}),i.headers),c=function(e,s){return e.replace(t,"")+"/"+s.replace(n,"")}(e,"number"==typeof c?""+c:c||""),c+=function(e){let t=Object.keys(e).map(t=>[t,e[t]].map(encodeURIComponent).join("=")).join("&");return t?"?"+t:""}(p),u&&(l.body=JSON.stringify(u)),fetch(c,l).then(e=>{if(e.status>=200&&e.status<300)return"response"===b?e:204==e.status?null:e[b]();let t=new Error(e.statusText);throw t.response=e,t})}return{options:r,post:o.bind(null,"POST"),put:o.bind(null,"PUT"),patch:o.bind(null,"PATCH"),get:(e,t)=>o("GET",e,null,t),delete:(e,t)=>o("DELETE",e,null,t)}},e}({});

package.json

 {
   "name": "mande",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "description": "Some awesome description",
@@ -25,6 +25,6 @@ "main": "dist/mande.common.js",
     "test": "yarn run test:unit && yarn run build",
+    "size": "size-limit",
     "build": "rollup -c rollup.config.js",
     "build:dts": "api-extractor run --local --verbose",
-    "docs": "api-documenter markdown -i temp -o docs",
-    "prepublishOnly": "yarn run build"
+    "docs": "api-documenter markdown -i temp -o docs"
   },
@@ -36,3 +36,20 @@ "files": [
   ],
-  "keywords": [],
+  "keywords": [
+    "fetch",
+    "browser",
+    "client",
+    "request",
+    "api",
+    "get",
+    "ajax",
+    "fetchival",
+    "axios",
+    "alternative"
+  ],
+  "size-limit": [
+    {
+      "path": "size-check/index.js",
+      "limit": "0.6KB"
+    }
+  ],
   "license": "MIT",
@@ -44,2 +61,3 @@ "devDependencies": {
     "@rollup/plugin-replace": "^2.2.1",
+    "@size-limit/preset-small-lib": "^4.5.0",
     "@types/jest": "^25.2.2",
@@ -59,2 +77,3 @@ "codecov": "^3.6.1",
     "rollup-plugin-typescript2": "^0.27.1",
+    "size-limit": "^4.5.0",
     "ts-jest": "^26.0.0",
@@ -61,0 +80,0 @@ "typescript": "^3.6.3"

README.md

@@ -7,2 +7,44 @@ # mande [![Build Status](https://badgen.net/circleci/github/posva/mande/master)](https://circleci.com/gh/posva/mande) [![npm package](https://badgen.net/npm/v/mande)](https://www.npmjs.com/package/mande) [![coverage](https://badgen.net/codecov/c/github/posva/mande/master)](https://codecov.io/github/posva/mande) [![thanks](https://badgen.net/badge/thanks/♥/pink)](https://github.com/posva/thanks)
 
+_mande_ has better defaults to communicate with APIs using `fetch`, so instead of writing:
+
+```js
+// creating a new user
+fetch('/api/users', {
+  method: 'POST',
+  headers: {
+    Accept: 'application/json',
+    'Content-Type': 'application/json',
+  },
+  body: JSON.stringify({
+    name: 'Dio',
+    password: 'irejectmyhumanityjojo',
+  }),
+})
+  .then((response) => {
+    if (response.status >= 200 && response.status < 300) {
+      return response.json()
+    }
+    // reject if the response is not 2xx
+    throw new Error(response.statusText)
+  })
+  .then((user) => {
+    // ...
+  })
+```
+
+You can write:
+
+```js
+const users = mande('/api/users')
+
+users
+  .post({
+    name: 'Dio',
+    password: 'irejectmyhumanityjojo',
+  })
+  .then((user) => {
+    // ...
+  })
+```
+
 ## Installation
@@ -17,3 +59,6 @@
 
+Creating a small layer to communicate to your API:
+
 ```js
+// api/users
 import { mande } from 'mande'
@@ -23,4 +68,38 @@
 
-users.get('2').then(user => {
-  // do something with user
+export function getUserById(id) {
+  return users.get(id)
+}
+
+export function createUser(userData) {
+  return users.post(userData)
+}
+```
+
+Adding _Authorization_ tokens:
+
+```js
+// api/users
+import { mande } from 'mande'
+
+const todos = mande('/api/todos', globalOptions)
+
+export function setToken(token) {
+  // todos.options will be used for all requests
+  todos.options.headers.Authorization = 'Bearer ' + token
+}
+
+export function clearToken() {
+  delete todos.options.headers.Authorization
+}
+
+export function createTodo(todoData) {
+  return todo.post(todoData)
+}
+```
+
+```js
+// In a different file, setting the token whenever the login status changes. This depends on your frontend code, for instance, some libraries like Firebase provide this kind of callback but you could use a watcher on Vue.
+onAuthChange((user) => {
+  if (user) setToken(user.token)
+  else clearToken()
 })
@@ -35,4 +114,4 @@ ```
 
-- [fetchival](https://github.com/typicode/fetchival)
-- [axios](https://github.com/axios/axios)
+- [fetchival](https://github.com/typicode/fetchival): part of the code was borrowed from it and the api is very similar
+- [axios](https://github.com/axios/axios):
 
@@ -39,0 +118,0 @@ ## License

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

21581

increased by44.6%

Number of package files

10

increased by11.11%

Lines of code

379

increased by64.07%

Number of lines in readme file

117

increased by207.89%

Worsened metrics

Dev dependency count

22

increased by10%

No dependency changes