From 780141dd8f919bdc28c5ecc12ce142cad1ee310f Mon Sep 17 00:00:00 2001 From: "motero@insideone.com.ar" Date: Tue, 26 Mar 2019 07:23:54 -0300 Subject: [PATCH 1/4] propTypes + react version --- package.json | 8 +++---- src/components/CallToAction/index.js | 17 +++++++------- src/components/DoubleContentBrick/index.js | 21 +++++++++-------- src/components/EmailSqueezeBrick/index.js | 5 ++-- src/components/EnumerationBrick/index.js | 22 +++++++++--------- src/components/FeatureItem/index.js | 13 +++++------ src/components/FooterBrick/index.js | 3 ++- src/components/GalleryBrick/index.js | 27 ++++++++-------------- src/components/GenericBrick/index.js | 21 +++++++++-------- src/components/LandingCanvas/index.js | 9 +------- src/components/NavigationBrick/index.js | 6 +++-- src/components/PlaceHolder/index.js | 7 +++--- src/components/StrongMessageBrick/index.js | 5 ++-- src/components/ThemePropagator/index.js | 5 ++-- src/components/TripleContentBrick/index.js | 21 +++++++++-------- src/conventions/index.js | 22 +++++++++--------- 16 files changed, 104 insertions(+), 108 deletions(-) diff --git a/package.json b/package.json index fb48683..54022b2 100644 --- a/package.json +++ b/package.json @@ -26,11 +26,11 @@ }, "homepage": "https://github.com/line64/landricks-components#readme", "dependencies": { - "color": "^0.11.3", - "react": "^15.3.0", - "react-dom": "^15.3.0", + "prop-types": "^15.7.2", + "react": "^16.8.5", + "react-dom": "^16.8.5", "react-fontawesome": "^1.1.0", - "react-helmet": "^3.1.0" + "react-helmet": "^5.2.0" }, "devDependencies": { "@kadira/react-storybook-addon-info": "^3.3.0", diff --git a/src/components/CallToAction/index.js b/src/components/CallToAction/index.js index 8da9cb8..ed35ac9 100644 --- a/src/components/CallToAction/index.js +++ b/src/components/CallToAction/index.js @@ -1,5 +1,6 @@ import React, { Component } from 'react'; -import FontAwesome from 'react-fontawesome'; +// import FontAwesome from 'react-fontawesome'; +import PropTypes from 'prop-types'; import styles from './styles'; class CallToAction extends Component { @@ -27,8 +28,8 @@ class CallToAction extends Component { if (!props.icon) { return null; } - - return (); + return null; + // return (); } @@ -75,11 +76,11 @@ class CallToAction extends Component { } CallToAction.propTypes = { - href: React.PropTypes.string, - target: React.PropTypes.string, - icon: React.PropTypes.string, - label: React.PropTypes.string, - onClick: React.PropTypes.func + href: PropTypes.string, + target: PropTypes.string, + icon: PropTypes.string, + label: PropTypes.string, + onClick: PropTypes.func }; export default CallToAction; diff --git a/src/components/DoubleContentBrick/index.js b/src/components/DoubleContentBrick/index.js index f51e3db..9377a51 100644 --- a/src/components/DoubleContentBrick/index.js +++ b/src/components/DoubleContentBrick/index.js @@ -1,6 +1,7 @@ import React, { Component } from 'react'; import styles from './styles'; import { ThemePropagator, GenericBrick } from '../../'; +import PropTypes from 'prop-types'; import { LandricksPropTypes } from '../../conventions'; class DoubleContentBrick extends Component { @@ -56,17 +57,17 @@ class DoubleContentBrick extends Component { } DoubleContentBrick.propTypes = { - hasHeader: React.PropTypes.bool, - title: React.PropTypes.string, - subtitle: React.PropTypes.string, + hasHeader: PropTypes.bool, + title: PropTypes.string, + subtitle: PropTypes.string, theme: LandricksPropTypes.brickTheme, - wrapperStyle: React.PropTypes.object, - contentStyle: React.PropTypes.object, - headerStyle: React.PropTypes.object, - titleStyle: React.PropTypes.object, - subtitleStyle: React.PropTypes.object, - renderHeader: React.PropTypes.func, - children: React.PropTypes.arrayOf(React.PropTypes.element) + wrapperStyle: PropTypes.object, + contentStyle: PropTypes.object, + headerStyle: PropTypes.object, + titleStyle: PropTypes.object, + subtitleStyle: PropTypes.object, + renderHeader: PropTypes.func, + children: PropTypes.arrayOf(PropTypes.element) }; export default DoubleContentBrick; diff --git a/src/components/EmailSqueezeBrick/index.js b/src/components/EmailSqueezeBrick/index.js index 2e7dd8c..3452aee 100644 --- a/src/components/EmailSqueezeBrick/index.js +++ b/src/components/EmailSqueezeBrick/index.js @@ -1,5 +1,6 @@ import React from 'react'; import styles from './styles'; +import PropTypes from 'prop-types'; let inputValue = null; @@ -43,8 +44,8 @@ const EmailSqueezeBrick = (props) => { } EmailSqueezeBrick.propTypes = { - buttonLabel: React.PropTypes.string, - placeholder: React.PropTypes.string + buttonLabel: PropTypes.string, + placeholder: PropTypes.string }; export default EmailSqueezeBrick; diff --git a/src/components/EnumerationBrick/index.js b/src/components/EnumerationBrick/index.js index 018a120..d5f864f 100644 --- a/src/components/EnumerationBrick/index.js +++ b/src/components/EnumerationBrick/index.js @@ -1,8 +1,8 @@ import React from 'react'; import styles from './styles'; -import FontAwesome from 'react-fontawesome'; import { GenericBrick } from '../../'; import { LandricksPropTypes } from '../../conventions'; +import PropTypes from 'prop-types'; const EnumerationBrick = (props) => { @@ -17,17 +17,17 @@ const EnumerationBrick = (props) => { } EnumerationBrick.propTypes = { - hasHeader: React.PropTypes.bool, - title: React.PropTypes.string, - subtitle: React.PropTypes.string, + hasHeader: PropTypes.bool, + title: PropTypes.string, + subtitle: PropTypes.string, theme: LandricksPropTypes.brickTheme, - wrapperStyle: React.PropTypes.object, - contentStyle: React.PropTypes.object, - headerStyle: React.PropTypes.object, - titleStyle: React.PropTypes.object, - subtitleStyle: React.PropTypes.object, - renderHeader: React.PropTypes.func, - children: React.PropTypes.arrayOf(React.PropTypes.element) + wrapperStyle: PropTypes.object, + contentStyle: PropTypes.object, + headerStyle: PropTypes.object, + titleStyle: PropTypes.object, + subtitleStyle: PropTypes.object, + renderHeader: PropTypes.func, + children: PropTypes.arrayOf(PropTypes.element) }; export default EnumerationBrick; diff --git a/src/components/FeatureItem/index.js b/src/components/FeatureItem/index.js index c7cf1af..7f3438d 100644 --- a/src/components/FeatureItem/index.js +++ b/src/components/FeatureItem/index.js @@ -1,6 +1,6 @@ import React, { Component } from 'react'; -import FontAwesome from 'react-fontawesome'; import styles from './styles'; +import PropTypes from 'prop-types'; class FeatureItem extends Component { @@ -28,7 +28,7 @@ class FeatureItem extends Component { return null; } - return (); + // return (); } @@ -45,7 +45,6 @@ class FeatureItem extends Component { return (
- { icon ? : null } { image ? : null }
{ title }

{ description }

@@ -57,10 +56,10 @@ class FeatureItem extends Component { } FeatureItem.propTypes = { - icon: React.PropTypes.string, - image: React.PropTypes.string, - title: React.PropTypes.string, - description: React.PropTypes.string + icon: PropTypes.string, + image: PropTypes.string, + title: PropTypes.string, + description: PropTypes.string }; export default FeatureItem; diff --git a/src/components/FooterBrick/index.js b/src/components/FooterBrick/index.js index c4366a3..abfb651 100644 --- a/src/components/FooterBrick/index.js +++ b/src/components/FooterBrick/index.js @@ -1,6 +1,7 @@ import React, { Component } from 'react'; import { ThemePropagator, GenericBrick, TripleContentBrick } from '../../'; import { LandricksPropTypes } from '../../conventions'; +import PropTypes from 'prop-types'; class FooterBrick extends Component { @@ -22,7 +23,7 @@ class FooterBrick extends Component { FooterBrick.propTypes = { theme: LandricksPropTypes.brickTheme, - children: React.PropTypes.arrayOf(React.PropTypes.element) + children: PropTypes.arrayOf(PropTypes.element) }; export default FooterBrick; diff --git a/src/components/GalleryBrick/index.js b/src/components/GalleryBrick/index.js index 6fcb95e..c759f8d 100644 --- a/src/components/GalleryBrick/index.js +++ b/src/components/GalleryBrick/index.js @@ -1,6 +1,7 @@ import React, { Component } from 'react'; -import FontAwesome from 'react-fontawesome'; +// import FontAwesome from 'react-fontawesome'; import { GenericBrick } from '../../'; +import PropTypes from 'prop-types'; import styles from './styles'; class GalleryBrick extends Component { @@ -35,10 +36,8 @@ class GalleryBrick extends Component { let styleCustom = {}; if(this.state.currentPage === 1) styleCustom = { opacity : '0', pointerEvents : 'none' } return ( - this.setState({ currentPage : this.state.currentPage - 1 }) } > - + this.setState({ currentPage : this.state.currentPage - 1 }) } > + {'<'} ) } @@ -50,7 +49,7 @@ class GalleryBrick extends Component { this.setState({ currentPage : this.state.currentPage + 1 }) } > - + {'>'} ) } @@ -62,13 +61,7 @@ class GalleryBrick extends Component { if(this.calculatePages() < 2) return null; return count.map((item) =>{ - return ( - this.setState({ currentPage : item + 1 }) } - name={ (currentPage === item + 1) ? 'circle' : 'circle-o' } - /> - ) + return null }); } @@ -96,10 +89,10 @@ class GalleryBrick extends Component { GalleryBrick.propTypes = { - title : React.PropTypes.string, - subtitle : React.PropTypes.string, - items: React.PropTypes.array, - itemsPerPage : React.PropTypes.number + title : PropTypes.string, + subtitle : PropTypes.string, + items: PropTypes.array, + itemsPerPage : PropTypes.number }; export default GalleryBrick; diff --git a/src/components/GenericBrick/index.js b/src/components/GenericBrick/index.js index 17e189b..753fb22 100644 --- a/src/components/GenericBrick/index.js +++ b/src/components/GenericBrick/index.js @@ -1,6 +1,7 @@ import React, { Component } from 'react'; import { ThemePropagator } from '../../'; import { LandricksPropTypes } from '../../conventions'; +import PropTypes from 'prop-types'; import styles from './styles'; @@ -57,17 +58,17 @@ class GenericBrick extends Component { } GenericBrick.propTypes = { - hasHeader: React.PropTypes.bool, - title: React.PropTypes.string, - subtitle: React.PropTypes.string, + hasHeader: PropTypes.bool, + title: PropTypes.string, + subtitle: PropTypes.string, theme: LandricksPropTypes.brickTheme, - wrapperStyle: React.PropTypes.object, - contentStyle: React.PropTypes.object, - headerStyle: React.PropTypes.object, - titleStyle: React.PropTypes.object, - subtitleStyle: React.PropTypes.object, - renderContent: React.PropTypes.func, - renderHeader: React.PropTypes.func + wrapperStyle: PropTypes.object, + contentStyle: PropTypes.object, + headerStyle: PropTypes.object, + titleStyle: PropTypes.object, + subtitleStyle: PropTypes.object, + renderContent: PropTypes.func, + renderHeader: PropTypes.func } GenericBrick.defaultProps = { diff --git a/src/components/LandingCanvas/index.js b/src/components/LandingCanvas/index.js index 2765504..6df04cb 100644 --- a/src/components/LandingCanvas/index.js +++ b/src/components/LandingCanvas/index.js @@ -1,5 +1,4 @@ import React from 'react'; -import Helmet from 'react-helmet'; function calculateViewportFromWindow() { if (typeof window !== 'undefined') { @@ -24,13 +23,7 @@ function renderAugmentedChildren(props) { const LandingCanvas = (props) => { return (
- - { renderAugmentedChildren(props) } + { props.children }
); } diff --git a/src/components/NavigationBrick/index.js b/src/components/NavigationBrick/index.js index 0a1c3bb..3fa9c9d 100644 --- a/src/components/NavigationBrick/index.js +++ b/src/components/NavigationBrick/index.js @@ -1,5 +1,5 @@ import React, { Component } from 'react'; -import Fontawesome from 'react-fontawesome'; +// import Fontawesome from 'react-fontawesome'; import styler from './styler'; @@ -63,7 +63,9 @@ export default class NavigationBrick extends Component { return(