react-stickerpipe - npm Package Compare versions

Comparing version 1.8.2 to 2.0.0

dist/components/icons/icon-add.js

@@ -11,2 +11,6 @@ 'use strict';
 
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -17,4 +21,2 @@
 
-  var fill = color || '#757575';
-
   return _react2.default.createElement(
@@ -28,3 +30,3 @@ 'svg',
         'g',
-        { id: 'face', fill: fill },
+        { id: 'face', fill: color },
         _react2.default.createElement('path', { d: 'M9,14.2619119 C11.33,14.2619119 13.31,12.8019119 14.11,10.7619119 L3.89,10.7619119 C4.69,12.8019119 6.67,14.2619119 9,14.2619119 Z', id: 'Path' }),
@@ -38,3 +40,3 @@ _react2.default.createElement('path', { d: 'M5.39,7.76191185 C6.22,7.76191185 6.89,7.09191185 6.89,6.26191185 C6.89,5.43191185 6.22,4.76191185 5.39,4.76191185 C4.56,4.76191185 3.89,5.43191185 3.89,6.26191185 C3.89,7.09191185 4.56,7.76191185 5.39,7.76191185 Z', id: 'Path' }),
         { id: 'add', transform: 'translate(12.000000, 12.000000)' },
-        _react2.default.createElement('circle', { id: 'oval', fill: fill, cx: '4', cy: '4', r: '4' }),
+        _react2.default.createElement('circle', { id: 'oval', fill: color, cx: '4', cy: '4', r: '4' }),
         _react2.default.createElement('polygon', { id: 'plus', fill: '#FFFFFF', points: '5.75 4.25 4.25 4.25 4.25 5.75 3.75 5.75 3.75 4.25 2.25 4.25 2.25 3.75 3.75 3.75 3.75 2.25 4.25 2.25 4.25 3.75 5.75 3.75' })
@@ -47,6 +49,10 @@ )
 IconAdd.propTypes = {
-  color: _react2.default.PropTypes.string
+  color: _propTypes2.default.string
 };
 
+IconAdd.defaultProps = {
+  color: '#C4C4C4'
+};
+
 exports.default = IconAdd;
 module.exports = exports['default'];

dist/components/icons/icon-close.js

@@ -11,2 +11,6 @@ 'use strict';
 
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -17,6 +21,5 @@
 
-  var fill = color || '#757575';
   return _react2.default.createElement(
     'svg',
-    { fill: fill, height: '24', viewBox: '0 0 24 24', width: '24' },
+    { fill: color, height: '24', viewBox: '0 0 24 24', width: '24' },
     _react2.default.createElement('path', { d: 'M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z' }),
@@ -28,6 +31,10 @@ _react2.default.createElement('path', { d: 'M0 0h24v24H0z', fill: 'none' })
 IconClose.propTypes = {
-  color: _react2.default.PropTypes.string
+  color: _propTypes2.default.string
 };
 
+IconClose.defaultProps = {
+  color: '#C4C4C4'
+};
+
 exports.default = IconClose;
 module.exports = exports['default'];

dist/components/icons/icon-purchase.js

@@ -1,2 +0,2 @@
-'use strict';
+"use strict";
 
@@ -7,3 +7,3 @@ Object.defineProperty(exports, "__esModule", {
 
-var _react = require('react');
+var _react = require("react");
 
@@ -17,11 +17,9 @@ var _react2 = _interopRequireDefault(_react);
 
-  var fill = color || '#757575';
-
   return _react2.default.createElement(
-    'svg',
-    { width: '24px', height: '24px', viewBox: '0 0 24 24' },
+    "svg",
+    { width: "24px", height: "24px", viewBox: "0 0 24 24" },
     _react2.default.createElement(
-      'g',
-      { id: 'icon-purchase', transform: 'translate(5.000000, 5.000000)', fill: fill },
-      _react2.default.createElement('polygon', { id: 'Shape', points: '14 8 8 8 8 14 6 14 6 8 0 8 0 6 6 6 6 0 8 0 8 6 14 6' })
+      "g",
+      { id: "icon-purchase", transform: "translate(5.000000, 5.000000)", fill: color },
+      _react2.default.createElement("polygon", { id: "Shape", points: "14 8 8 8 8 14 6 14 6 8 0 8 0 6 6 6 6 0 8 0 8 6 14 6" })
     )
@@ -35,3 +33,7 @@ );
 
+IconPurchase.defaultProps = {
+  color: '#C4C4C4'
+};
+
 exports.default = IconPurchase;
-module.exports = exports['default'];
+module.exports = exports["default"];

dist/components/my-sticker-packs.js

@@ -11,2 +11,6 @@ 'use strict';
 
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
 var _sticker = require('./sticker');
@@ -47,5 +51,5 @@
           { className: 'stickers', style: style.stickers },
-          stickerPacks.length > 0 ? stickerPacks.map(function (stickerPack, index) {
+          stickerPacks.length > 0 ? stickerPacks.map(function (stickerPack) {
             return _react2.default.createElement(_sticker2.default, {
-              key: 'my-sticker-packs-' + stickerPack.pack_name + '-' + index,
+              key: 'my-sticker-packs-' + stickerPack.pack_name,
               src: stickerPack.main_icon.mdpi,
@@ -73,9 +77,9 @@ onClick: function onClick() {
 MyStickerPacks.propTypes = {
-  stickerPacks: _react.PropTypes.arrayOf(_react.PropTypes.shape({
-    pack_name: _react.PropTypes.string.isRequired,
-    main_icon: _react.PropTypes.shape({
-      mdpi: _react.PropTypes.string.isRequired,
-      hdpi: _react.PropTypes.string.isRequired,
-      xhdpi: _react.PropTypes.string.isRequired,
-      xxhdpi: _react.PropTypes.string.isRequired
+  stickerPacks: _propTypes2.default.arrayOf(_propTypes2.default.shape({
+    pack_name: _propTypes2.default.string.isRequired,
+    main_icon: _propTypes2.default.shape({
+      mdpi: _propTypes2.default.string.isRequired,
+      hdpi: _propTypes2.default.string.isRequired,
+      xhdpi: _propTypes2.default.string.isRequired,
+      xxhdpi: _propTypes2.default.string.isRequired
     }).isRequired
@@ -86,5 +90,5 @@ })).isRequired,
   shop: _react2.default.PropTypes.bool.isRequired,
-  colors: _react.PropTypes.shape({
-    primary: _react.PropTypes.string.isRequired
-  })
+  colors: _propTypes2.default.shape({
+    primary: _propTypes2.default.string.isRequired
+  }).isRequired
 };
@@ -91,0 +95,0 @@

dist/components/sticker-pack-preview.js

@@ -13,2 +13,6 @@ 'use strict';
 
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
 var _parseResponse = require('../parse-response');
@@ -32,4 +36,5 @@
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /* eslint no-console: ["error", { allow: ["error"] }] */
 
+
 var StickerPackPreview = function (_Component) {
@@ -60,3 +65,3 @@ _inherits(StickerPackPreview, _Component);
         if (err) {
-          console.log(err);
+          console.error(err);
 
@@ -96,2 +101,11 @@ return false;
 
+      var style = {
+        header: {
+          backgroundColor: colors.primary
+        },
+        heading: {
+          color: colors.secondary
+        }
+      };
+
       return _react2.default.createElement(
@@ -102,6 +116,6 @@ 'section',
           'div',
-          { className: 'preview-header', style: { backgroundColor: colors.primary } },
+          { className: 'preview-header', style: style.header },
           _react2.default.createElement(
             'h1',
-            { style: { color: colors.secondary } },
+            { style: style.heading },
             preview.title
@@ -137,25 +151,25 @@ ),
 StickerPackPreview.propTypes = {
-  preview: _react.PropTypes.shape({
-    title: _react.PropTypes.string.isRequired,
-    pack_name: _react.PropTypes.string.isRequired,
-    preview: _react.PropTypes.shape({
-      mdpi: _react.PropTypes.string.isRequired,
-      hdpi: _react.PropTypes.string.isRequired
+  preview: _propTypes2.default.shape({
+    title: _propTypes2.default.string.isRequired,
+    pack_name: _propTypes2.default.string.isRequired,
+    preview: _propTypes2.default.shape({
+      mdpi: _propTypes2.default.string.isRequired,
+      hdpi: _propTypes2.default.string.isRequired
     })
-  }),
-  colors: _react.PropTypes.shape({
-    primary: _react.PropTypes.string.isRequired,
-    secondary: _react.PropTypes.string.isRequired
-  }),
-  onPurchase: _react.PropTypes.func.isRequired,
-  closePreview: _react.PropTypes.func.isRequired
+  }).isRequired,
+  colors: _propTypes2.default.shape({
+    primary: _propTypes2.default.string.isRequired,
+    secondary: _propTypes2.default.string.isRequired
+  }).isRequired,
+  onPurchase: _propTypes2.default.func.isRequired,
+  closePreview: _propTypes2.default.func.isRequired
 };
 StickerPackPreview.contextTypes = {
-  client: _react.PropTypes.shape({
-    getMyPacks: _react.PropTypes.func.isRequired,
-    purchasePack: _react.PropTypes.func.isRequired
+  client: _propTypes2.default.shape({
+    getMyPacks: _propTypes2.default.func.isRequired,
+    purchasePack: _propTypes2.default.func.isRequired
   }).isRequired,
-  storage: _react.PropTypes.shape({
-    storePack: _react.PropTypes.func.isRequired,
-    getPack: _react.PropTypes.func.isRequired
+  storage: _propTypes2.default.shape({
+    storePack: _propTypes2.default.func.isRequired,
+    getPack: _propTypes2.default.func.isRequired
   }).isRequired
@@ -162,0 +176,0 @@ };

dist/components/sticker-pack.js

@@ -11,2 +11,6 @@ 'use strict';
 
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
 var _sticker = require('./sticker');
@@ -47,15 +51,15 @@
 StickerPack.propTypes = {
-  pack: _react.PropTypes.shape({
-    title: _react.PropTypes.string.isRequired,
-    stickers: _react.PropTypes.arrayOf(_react.PropTypes.shape({
-      content_id: _react.PropTypes.number.isRequired,
-      image: _react.PropTypes.shape({
-        mdpi: _react.PropTypes.string.isRequired,
-        hdpi: _react.PropTypes.string.isRequired,
-        xhdpi: _react.PropTypes.string.isRequired,
-        xxhdpi: _react.PropTypes.string.isRequired
+  pack: _propTypes2.default.shape({
+    title: _propTypes2.default.string.isRequired,
+    stickers: _propTypes2.default.arrayOf(_propTypes2.default.shape({
+      content_id: _propTypes2.default.number.isRequired,
+      image: _propTypes2.default.shape({
+        mdpi: _propTypes2.default.string.isRequired,
+        hdpi: _propTypes2.default.string.isRequired,
+        xhdpi: _propTypes2.default.string.isRequired,
+        xxhdpi: _propTypes2.default.string.isRequired
       }).isRequired
     }).isRequired).isRequired
   }).isRequired,
-  sendSticker: _react.PropTypes.func.isRequired
+  sendSticker: _propTypes2.default.func.isRequired
 };
@@ -62,0 +66,0 @@

dist/components/sticker-shop.js

@@ -13,2 +13,6 @@ 'use strict';
 
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
 var _sticker = require('./sticker');
@@ -32,4 +36,5 @@
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /* eslint no-console: ["error", { allow: ["error"] }] */
 
+
 var StickerShop = function (_Component) {
@@ -64,3 +69,3 @@ _inherits(StickerShop, _Component);
         if (err) {
-          console.log(err);
+          console.error(err);
 
@@ -104,3 +109,3 @@ return false;
         if (err) {
-          console.log(err);
+          console.error(err);
 
@@ -172,12 +177,12 @@ return false;
 StickerShop.propTypes = {
-  getMyPacks: _react.PropTypes.func.isRequired,
-  colors: _react.PropTypes.shape({
-    primary: _react.PropTypes.string.isRequired,
-    secondary: _react.PropTypes.string.isRequired
-  })
+  getMyPacks: _propTypes2.default.func.isRequired,
+  colors: _propTypes2.default.shape({
+    primary: _propTypes2.default.string.isRequired,
+    secondary: _propTypes2.default.string.isRequired
+  }).isRequired
 };
 StickerShop.contextTypes = {
-  client: _react.PropTypes.shape({
-    getMyPacks: _react.PropTypes.func.isRequired,
-    purchasePack: _react.PropTypes.func.isRequired
+  client: _propTypes2.default.shape({
+    getMyPacks: _propTypes2.default.func.isRequired,
+    purchasePack: _propTypes2.default.func.isRequired
   }).isRequired
@@ -184,0 +189,0 @@ };

dist/components/sticker.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -7,6 +7,10 @@ Object.defineProperty(exports, "__esModule", {
 
-var _react = require("react");
+var _react = require('react');
 
 var _react2 = _interopRequireDefault(_react);
 
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -18,7 +22,7 @@
 
-  return _react2.default.createElement("img", {
-    className: "sticker",
+  return _react2.default.createElement('img', {
+    className: 'sticker',
     onClick: onClick,
     src: src,
-    role: "presentation"
+    alt: 'sticker'
   });
@@ -28,7 +32,7 @@ }
 Sticker.propTypes = {
-  src: _react2.default.PropTypes.string.isRequired,
-  onClick: _react2.default.PropTypes.func
+  src: _propTypes2.default.string.isRequired,
+  onClick: _propTypes2.default.func.isRequired
 };
 
 exports.default = Sticker;
-module.exports = exports["default"];
+module.exports = exports['default'];

dist/default-colors.js

@@ -7,4 +7,4 @@ 'use strict';
 var defaultColors = {
-  primary: 'rgb(99,137,168)',
-  secondary: 'rgb(255,255,255)'
+  primary: '#1BA6C4',
+  secondary: '#FEFEFE'
 };
@@ -11,0 +11,0 @@

dist/index.js

@@ -13,2 +13,6 @@ 'use strict';
 
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
 var _client = require('./client');
@@ -48,4 +52,5 @@
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /* eslint no-console: ["error", { allow: ["error"] }] */
 
+
 var StickerMenu = function (_Component) {
@@ -65,13 +70,3 @@ _inherits(StickerMenu, _Component);
 
-    var client = void 0;
-
-    if (props && props.client) {
-      client = props.client;
-    }
-
-    if (props && !props.client && props.apiKey) {
-      client = new _client2.default(props.apiKey, props.userId, 'https://api.stickerpipe.com/api/v2');
-    }
-
-    _this.client = client;
+    _this.client = new _client2.default(props.apiKey, props.userId, 'https://api.stickerpipe.com/api/v2');
     _this.storage = new _storage2.default(props.userId);
@@ -119,3 +114,3 @@
         if (err) {
-          console.log(err);
+          console.error(err);
 
@@ -164,3 +159,3 @@ return false;
         if (err) {
-          console.log(err);
+          console.error(err);
 
@@ -231,31 +226,23 @@ return false;
 StickerMenu.propTypes = {
-  apiKey: function apiKey(props, propName) {
-    if (!props.client && !props[propName]) {
-      return new Error('Prop ' + propName + ' is required when prop client is not specified!');
-    }
-
-    return null;
-  },
-  userId: _react.PropTypes.string.isRequired,
-  sendSticker: _react.PropTypes.func.isRequired,
-  client: _react.PropTypes.shape({
-    getMyPacks: _react.PropTypes.func.isRequired,
-    getShop: _react.PropTypes.func.isRequired,
-    getPackPreview: _react.PropTypes.func.isRequired,
-    purchasePack: _react.PropTypes.func.isRequired
-  }),
+  apiKey: _propTypes2.default.string.isRequired,
+  userId: _propTypes2.default.string.isRequired,
+  sendSticker: _propTypes2.default.func.isRequired,
   toggleButton: _react2.default.PropTypes.element,
-  colors: _react.PropTypes.shape({
-    primary: _react.PropTypes.string.isRequired,
-    secondary: _react.PropTypes.string.isRequired
+  colors: _propTypes2.default.shape({
+    primary: _propTypes2.default.string,
+    secondary: _propTypes2.default.string
   })
 };
+StickerMenu.defaultProps = {
+  colors: _defaultColors2.default,
+  toggleButton: null
+};
 StickerMenu.childContextTypes = {
-  client: _react.PropTypes.shape({
-    getMyPacks: _react.PropTypes.func.isRequired,
-    purchasePack: _react.PropTypes.func.isRequired
+  client: _propTypes2.default.shape({
+    getMyPacks: _propTypes2.default.func.isRequired,
+    purchasePack: _propTypes2.default.func.isRequired
   }).isRequired,
-  storage: _react.PropTypes.shape({
-    storePack: _react.PropTypes.func.isRequired,
-    getPack: _react.PropTypes.func.isRequired
+  storage: _propTypes2.default.shape({
+    storePack: _propTypes2.default.func.isRequired,
+    getPack: _propTypes2.default.func.isRequired
   }).isRequired
@@ -262,0 +249,0 @@ };

dist/parse-response.js

@@ -6,2 +6,3 @@ 'use strict';
 });
+/* eslint no-console: ["error", { allow: ["error"] }] */
 function parseResponse(response) {
@@ -19,3 +20,3 @@ var text = void 0;
   if (!text) {
-    console.warn('Did not supply any matching response format. Response is:', text);
+    console.error('Did not supply any matching response format. Response is:', text);
     return null;
@@ -31,3 +32,3 @@ }
   } catch (err) {
-    console.warn('Error while parsing JSON', err);
+    console.error('Error while parsing JSON', err);
   }
@@ -34,0 +35,0 @@

dist/storage.js

@@ -11,2 +11,3 @@ 'use strict';
 
+/* eslint no-console: ["error", { allow: ["error"] }] */
 var Storage = function () {
@@ -71,3 +72,3 @@ function Storage(userId) {
       } catch (err) {
-        console.warn('Error while saving to localStorage.', err);
+        console.error('Error while saving to localStorage.', err);
       }
@@ -83,3 +84,3 @@ }
       } catch (err) {
-        console.warn('Error while retrieving item from localStorage.', err);
+        console.error('Error while retrieving item from localStorage.', err);
       }
@@ -86,0 +87,0 @@

package.json

 {
   "name": "react-stickerpipe",
-  "version": "1.8.2",
+  "version": "2.0.0",
   "description": "React Component for StickerPipe API",
@@ -57,7 +57,7 @@ "main": "dist/index.js",
     "chai": "^3.5.0",
-    "eslint": "^3.10.2",
-    "eslint-config-airbnb": "^13.0.0",
+    "eslint": "^3.19.0",
+    "eslint-config-airbnb": "^14.1.0",
     "eslint-plugin-import": "^2.2.0",
-    "eslint-plugin-jsx-a11y": "^2.2.3",
-    "eslint-plugin-react": "^6.7.1",
+    "eslint-plugin-jsx-a11y": "^4.0.0",
+    "eslint-plugin-react": "^6.10.3",
     "mocha": "^3.2.0",
@@ -80,4 +80,5 @@ "sinon": "^1.17.6"
   "peerDependencies": {
+    "prop-types": "^15.4.1",
     "react": "^15.4.1"
   }
 }

README.md

@@ -32,18 +32,2 @@ # React StickerPipe
 
-You can also pass your own API client as `client` to `<StickerMenu />`. The client must contain the following methods:
-
-```javascript
-// Get the purchased packs for the current user
-getMyPacks() {}
-
-// Get the sticker shop
-getShop() {}
-
-// Preview a sticker pack
-getPackPreview() {}
-
-// Purchase a sticker pack
-purchasePack() {}
-```
-
 ## Installation
@@ -50,0 +34,0 @@

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

40662

increased by1.46%

Lines of code

878

increased by2.09%

Worsened metrics

Dependency count

3

increased by50%

Number of lines in readme file

104

decreased by-13.33%

No dependency changes