From d00ce29900c9ac28d139a3d0e0a2c9cdb58a072c Mon Sep 17 00:00:00 2001 From: codypearce Date: Thu, 23 Jul 2020 07:26:23 -0700 Subject: [PATCH] v0.2.10 --- dist/Components/Backdrop/BackLayer/BackLayer.js | 2 +- dist/Components/Backdrop/Backdrop.js | 2 +- dist/Components/Backdrop/FrontLayer/FrontLayer.js | 2 +- dist/Components/Backdrop/FrontLayerScrim/FrontLayerScrim.js | 2 +- dist/Components/Backdrop/HeaderButton/HeaderButton.js | 2 +- dist/Components/Badge/Badge.js | 2 +- dist/Components/Banner/Banner.js | 2 +- .../BottomNavigationItem/BottomNavigationItem.js | 2 +- dist/Components/Button/ContainedButton/ContainedButton.js | 2 +- dist/Components/DataTable/DataTableCell/DataTableCell.js | 2 +- dist/Components/Drawer/Drawer.js | 2 +- dist/Components/Fab/Fab.js | 2 +- dist/Components/Fab/FabSpeedDial/FabSpeedDial.js | 2 +- dist/Components/List/ListExpand/ListExpand.js | 2 +- dist/Components/Menu/Menu.js | 2 +- dist/Components/Menu/ModalMenu/index.native.js | 2 +- dist/Components/Menu/ModalMenu/index.web.js | 2 +- dist/Components/Modal/Modal.android.js | 2 +- dist/Components/Modal/Modal.ios.js | 2 +- dist/Components/Modal/Modal.web.js | 2 +- dist/Components/Paper/Paper.js | 2 +- dist/Components/Progress/ProgressBar/ProgressBar.js | 2 +- dist/Components/Progress/ProgressCircle/ProgressCircle.js | 2 +- .../Progress/ProgressCircle/ProgressCircleDeterminate.js | 2 +- dist/Components/RadioButton/RadioButton.js | 2 +- dist/Components/Ripple/Ripple.js | 2 +- dist/Components/SheetBottom/SheetBottom.native.js | 2 +- dist/Components/SheetBottom/SheetBottom.web.js | 2 +- dist/Components/SheetSide/SheetSide.android.js | 2 +- dist/Components/SheetSide/SheetSide.ios.js | 2 +- dist/Components/SheetSide/SheetSide.web.js | 2 +- dist/Components/Snackbar/Snackbar.js | 2 +- dist/Components/SwipeNav/SwipeNav.js | 2 +- dist/Components/Switch/Switch.js | 2 +- dist/Components/Tabs/Tabs.js | 2 +- dist/Components/Tabs/Underline/Underline.js | 2 +- dist/Components/TextField/TextFieldLabel/TextFieldLabel.js | 2 +- .../TextField/TextFieldUnderline/TextFieldUnderline.js | 2 +- dist/Utils/Hoverable/Hoverable.stories.js | 2 +- docs/src/components/Drawer/DrawerHeader.js | 2 +- package.json | 2 +- 41 files changed, 41 insertions(+), 41 deletions(-) diff --git a/dist/Components/Backdrop/BackLayer/BackLayer.js b/dist/Components/Backdrop/BackLayer/BackLayer.js index 59359be1..0d880bfb 100644 --- a/dist/Components/Backdrop/BackLayer/BackLayer.js +++ b/dist/Components/Backdrop/BackLayer/BackLayer.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _BackLayer=_interopRequireDefault(require("./BackLayer.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Backdrop/BackLayer/BackLayer.js";var BackLayer=function(_Component){(0,_inherits2.default)(BackLayer,_Component);function BackLayer(props){var _this;(0,_classCallCheck2.default)(this,BackLayer);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(BackLayer).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"renderBackLayerConcealed",function(){var _this$props=_this.props,backLayerConcealed=_this$props.backLayerConcealed,backRevealed=_this$props.backRevealed,animate=_this$props.animate;if(!backLayerConcealed||backRevealed){return null;}var md=backRevealed?0:1;var opacity=animate.interpolate({inputRange:[0,0.6,1],outputRange:[1,md,0]});return _react.default.createElement(_reactNative.Animated.View,{style:[_BackLayer.default.backLayer,{opacity:opacity}],useNativeDriver:false,__source:{fileName:_jsxFileName,lineNumber:32}},backLayerConcealed);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"renderBackLayerRevealed",function(){var _this$props2=_this.props,backLayerRevealed=_this$props2.backLayerRevealed,backRevealed=_this$props2.backRevealed,animate=_this$props2.animate;if(!backLayerRevealed||!backRevealed){return null;}var md=backRevealed?1:0;var opacity=animate.interpolate({inputRange:[0,0.6,1],outputRange:[0,md,1]});return _react.default.createElement(_reactNative.Animated.View,{style:[_BackLayer.default.backLayer,{opacity:opacity}],useNativeDriver:false,__source:{fileName:_jsxFileName,lineNumber:52}},_this.renderBackElements());});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"renderBackElements",function(){var _this$props3=_this.props,backLayerRevealed=_this$props3.backLayerRevealed,internalAnimate=_this$props3.internalAnimate;var opacity=internalAnimate.interpolate({inputRange:[0,0.5,1],outputRange:[1,0,1]});return _react.default.createElement(_reactNative.Animated.View,{style:{flex:1,opacity:opacity},useNativeDriver:false,__source:{fileName:_jsxFileName,lineNumber:69}},backLayerRevealed);});return _this;}(0,_createClass2.default)(BackLayer,[{key:"render",value:function render(){return _react.default.createElement(_react.Fragment,{__source:{fileName:_jsxFileName,lineNumber:77}},this.renderBackLayerConcealed(),this.renderBackLayerRevealed());}}]);return BackLayer;}(_react.Component);(0,_defineProperty2.default)(BackLayer,"propTypes",{backLayerConcealed:_propTypes.default.node,backLayerRevealed:_propTypes.default.node,backRevealed:_propTypes.default.bool,animate:_propTypes.default.object,internalAnimate:_propTypes.default.object});var _default=(0,_withTheme.default)(BackLayer);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _BackLayer=_interopRequireDefault(require("./BackLayer.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Backdrop/BackLayer/BackLayer.js";var BackLayer=function(_Component){(0,_inherits2.default)(BackLayer,_Component);function BackLayer(props){var _this;(0,_classCallCheck2.default)(this,BackLayer);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(BackLayer).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"renderBackLayerConcealed",function(){var _this$props=_this.props,backLayerConcealed=_this$props.backLayerConcealed,backRevealed=_this$props.backRevealed,animate=_this$props.animate;if(!backLayerConcealed||backRevealed){return null;}var md=backRevealed?0:1;var opacity=animate.interpolate({inputRange:[0,0.6,1],outputRange:[1,md,0]});return _react.default.createElement(_reactNative.Animated.View,{style:[_BackLayer.default.backLayer,{opacity:opacity}],useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:32}},backLayerConcealed);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"renderBackLayerRevealed",function(){var _this$props2=_this.props,backLayerRevealed=_this$props2.backLayerRevealed,backRevealed=_this$props2.backRevealed,animate=_this$props2.animate;if(!backLayerRevealed||!backRevealed){return null;}var md=backRevealed?1:0;var opacity=animate.interpolate({inputRange:[0,0.6,1],outputRange:[0,md,1]});return _react.default.createElement(_reactNative.Animated.View,{style:[_BackLayer.default.backLayer,{opacity:opacity}],useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:52}},_this.renderBackElements());});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"renderBackElements",function(){var _this$props3=_this.props,backLayerRevealed=_this$props3.backLayerRevealed,internalAnimate=_this$props3.internalAnimate;var opacity=internalAnimate.interpolate({inputRange:[0,0.5,1],outputRange:[1,0,1]});return _react.default.createElement(_reactNative.Animated.View,{style:{flex:1,opacity:opacity},useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:69}},backLayerRevealed);});return _this;}(0,_createClass2.default)(BackLayer,[{key:"render",value:function render(){return _react.default.createElement(_react.Fragment,{__source:{fileName:_jsxFileName,lineNumber:77}},this.renderBackLayerConcealed(),this.renderBackLayerRevealed());}}]);return BackLayer;}(_react.Component);(0,_defineProperty2.default)(BackLayer,"propTypes",{backLayerConcealed:_propTypes.default.node,backLayerRevealed:_propTypes.default.node,backRevealed:_propTypes.default.bool,animate:_propTypes.default.object,internalAnimate:_propTypes.default.object});var _default=(0,_withTheme.default)(BackLayer);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Backdrop/Backdrop.js b/dist/Components/Backdrop/Backdrop.js index d803373d..3ffd3a65 100644 --- a/dist/Components/Backdrop/Backdrop.js +++ b/dist/Components/Backdrop/Backdrop.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Backdrop=_interopRequireDefault(require("./Backdrop.styles"));var _HeaderButton=_interopRequireDefault(require("./HeaderButton/HeaderButton"));var _FrontLayer=_interopRequireDefault(require("./FrontLayer/FrontLayer"));var _BackLayer=_interopRequireDefault(require("./BackLayer/BackLayer"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Backdrop/Backdrop.js";var Backdrop=function(_PureComponent){(0,_inherits2.default)(Backdrop,_PureComponent);function Backdrop(props){var _this;(0,_classCallCheck2.default)(this,Backdrop);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Backdrop).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animate",new _reactNative.Animated.Value(0));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"internalAnimate",new _reactNative.Animated.Value(0));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"internalOffsetAnimate",new _reactNative.Animated.Value(0));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"isInternalAnimate",false);var window=_reactNative.Dimensions.get('window');_this.state={window:window,backConcealed:true,backRevealed:false,iconName:'menu'};return _this;}(0,_createClass2.default)(Backdrop,[{key:"toggleLayout",value:function toggleLayout(){var _this2=this;var backConcealed=this.state.backConcealed;if(backConcealed){this.setState({backRevealed:true,iconName:'close'});}else{this.setState({backConcealed:true,iconName:'menu'});}this.isInternalAnimate=false;_reactNative.Animated.timing(this.animate,{toValue:backConcealed?1:0,duration:196,easing:_reactNative.Easing.ease}).start(function(){if(backConcealed){_this2.setState({backConcealed:false});}else{_this2.setState({backRevealed:false});}});}},{key:"render",value:function render(){var _this3=this;var _this$props=this.props,backLayerStyle=_this$props.backLayerStyle,headerButtonStyle=_this$props.headerButtonStyle,frontLayerStyle=_this$props.frontLayerStyle,children=_this$props.children,initialOffset=_this$props.initialOffset,offset=_this$props.offset,backLayerRevealed=_this$props.backLayerRevealed,backLayerConcealed=_this$props.backLayerConcealed,theme=_this$props.theme,subheader=_this$props.subheader,testID=_this$props.testID;var _this$state=this.state,backConcealed=_this$state.backConcealed,backRevealed=_this$state.backRevealed,window=_this$state.window,iconName=_this$state.iconName;return _react.default.createElement(_reactNative.SafeAreaView,{style:[_Backdrop.default.backLayerContainer,{backgroundColor:theme.primary.main},backLayerStyle],testID:testID,__source:{fileName:_jsxFileName,lineNumber:90}},_react.default.createElement(_BackLayer.default,{backLayerConcealed:backLayerConcealed,animate:this.animate,internalAnimate:this.internalAnimate,backConcealed:backConcealed,backLayerRevealed:backLayerRevealed,backRevealed:backRevealed,__source:{fileName:_jsxFileName,lineNumber:97}}),_react.default.createElement(_FrontLayer.default,{toggleLayout:function toggleLayout(){return _this3.toggleLayout();},animate:this.animate,frontLayerStyle:frontLayerStyle,initialOffset:initialOffset,window:window,offset:offset,backRevealed:backRevealed,backLayerRevealed:backLayerRevealed,internalOffsetAnimate:this.internalOffsetAnimate,isInternalAnimate:this.isInternalAnimate,subheader:subheader,__source:{fileName:_jsxFileName,lineNumber:105}},children),_react.default.createElement(_HeaderButton.default,{backConcealed:backConcealed,headerButtonStyle:headerButtonStyle,toggleLayout:function toggleLayout(){return _this3.toggleLayout();},iconName:iconName,__source:{fileName:_jsxFileName,lineNumber:119}}));}}]);return Backdrop;}(_react.PureComponent);(0,_defineProperty2.default)(Backdrop,"propTypes",{backLayerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),frontLayerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),headerButtonStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),backLayerConcealed:_propTypes.default.node,offset:_propTypes.default.number,initialOffset:_propTypes.default.number,children:_propTypes.default.node,backLayerRevealed:_propTypes.default.node,theme:_propTypes.default.object,subheader:_propTypes.default.string,testID:_propTypes.default.string});(0,_defineProperty2.default)(Backdrop,"defaultProps",{initialOffset:56,buttonRippleColor:'rgba(255,255,255,0.3)'});var _default=(0,_withTheme.default)(Backdrop);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Backdrop=_interopRequireDefault(require("./Backdrop.styles"));var _HeaderButton=_interopRequireDefault(require("./HeaderButton/HeaderButton"));var _FrontLayer=_interopRequireDefault(require("./FrontLayer/FrontLayer"));var _BackLayer=_interopRequireDefault(require("./BackLayer/BackLayer"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Backdrop/Backdrop.js";var Backdrop=function(_PureComponent){(0,_inherits2.default)(Backdrop,_PureComponent);function Backdrop(props){var _this;(0,_classCallCheck2.default)(this,Backdrop);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Backdrop).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animate",new _reactNative.Animated.Value(0));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"internalAnimate",new _reactNative.Animated.Value(0));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"internalOffsetAnimate",new _reactNative.Animated.Value(0));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"isInternalAnimate",false);var window=_reactNative.Dimensions.get('window');_this.state={window:window,backConcealed:true,backRevealed:false,iconName:'menu'};return _this;}(0,_createClass2.default)(Backdrop,[{key:"toggleLayout",value:function toggleLayout(){var _this2=this;var backConcealed=this.state.backConcealed;if(backConcealed){this.setState({backRevealed:true,iconName:'close'});}else{this.setState({backConcealed:true,iconName:'menu'});}this.isInternalAnimate=false;_reactNative.Animated.timing(this.animate,{toValue:backConcealed?1:0,duration:196,easing:_reactNative.Easing.ease,useNativeDriver:true}).start(function(){if(backConcealed){_this2.setState({backConcealed:false});}else{_this2.setState({backRevealed:false});}});}},{key:"render",value:function render(){var _this3=this;var _this$props=this.props,backLayerStyle=_this$props.backLayerStyle,headerButtonStyle=_this$props.headerButtonStyle,frontLayerStyle=_this$props.frontLayerStyle,children=_this$props.children,initialOffset=_this$props.initialOffset,offset=_this$props.offset,backLayerRevealed=_this$props.backLayerRevealed,backLayerConcealed=_this$props.backLayerConcealed,theme=_this$props.theme,subheader=_this$props.subheader,testID=_this$props.testID;var _this$state=this.state,backConcealed=_this$state.backConcealed,backRevealed=_this$state.backRevealed,window=_this$state.window,iconName=_this$state.iconName;return _react.default.createElement(_reactNative.SafeAreaView,{style:[_Backdrop.default.backLayerContainer,{backgroundColor:theme.primary.main},backLayerStyle],testID:testID,__source:{fileName:_jsxFileName,lineNumber:91}},_react.default.createElement(_BackLayer.default,{backLayerConcealed:backLayerConcealed,animate:this.animate,internalAnimate:this.internalAnimate,backConcealed:backConcealed,backLayerRevealed:backLayerRevealed,backRevealed:backRevealed,__source:{fileName:_jsxFileName,lineNumber:98}}),_react.default.createElement(_FrontLayer.default,{toggleLayout:function toggleLayout(){return _this3.toggleLayout();},animate:this.animate,frontLayerStyle:frontLayerStyle,initialOffset:initialOffset,window:window,offset:offset,backRevealed:backRevealed,backLayerRevealed:backLayerRevealed,internalOffsetAnimate:this.internalOffsetAnimate,isInternalAnimate:this.isInternalAnimate,subheader:subheader,__source:{fileName:_jsxFileName,lineNumber:106}},children),_react.default.createElement(_HeaderButton.default,{backConcealed:backConcealed,headerButtonStyle:headerButtonStyle,toggleLayout:function toggleLayout(){return _this3.toggleLayout();},iconName:iconName,__source:{fileName:_jsxFileName,lineNumber:120}}));}}]);return Backdrop;}(_react.PureComponent);(0,_defineProperty2.default)(Backdrop,"propTypes",{backLayerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),frontLayerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),headerButtonStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),backLayerConcealed:_propTypes.default.node,offset:_propTypes.default.number,initialOffset:_propTypes.default.number,children:_propTypes.default.node,backLayerRevealed:_propTypes.default.node,theme:_propTypes.default.object,subheader:_propTypes.default.string,testID:_propTypes.default.string});(0,_defineProperty2.default)(Backdrop,"defaultProps",{initialOffset:56,buttonRippleColor:'rgba(255,255,255,0.3)'});var _default=(0,_withTheme.default)(Backdrop);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Backdrop/FrontLayer/FrontLayer.js b/dist/Components/Backdrop/FrontLayer/FrontLayer.js index 49eecd00..46459b4d 100644 --- a/dist/Components/Backdrop/FrontLayer/FrontLayer.js +++ b/dist/Components/Backdrop/FrontLayer/FrontLayer.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _FrontLayer=_interopRequireDefault(require("./FrontLayer.styles"));var _FrontLayerScrim=_interopRequireDefault(require("../FrontLayerScrim/FrontLayerScrim"));var _=require("../../..");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Backdrop/FrontLayer/FrontLayer.js";var IOS=_reactNative.Platform.OS==='ios';var FrontLayer=function(_PureComponent){(0,_inherits2.default)(FrontLayer,_PureComponent);function FrontLayer(props){var _this;(0,_classCallCheck2.default)(this,FrontLayer);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(FrontLayer).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"getFrontLayerTranslateY",function(){var _this$props=_this.props,animate=_this$props.animate,initialOffset=_this$props.initialOffset;var offset=_this.getOffset();return animate.interpolate({inputRange:[0,1],outputRange:[initialOffset,offset]});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"getOffset",function(){var ignoreElement=arguments.length>0&&arguments[0]!==undefined?arguments[0]:false;var _this$props2=_this.props,backLayerRevealed=_this$props2.backLayerRevealed,offset=_this$props2.offset,window=_this$props2.window;if(!ignoreElement&&backLayerRevealed&&offset){return offset;}if(offset)return offset;var y=_this.getY();return window.height-y;});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"getY",function(){var initialOffset=_this.props.initialOffset;var y=IOS?20:24;return y+initialOffset;});return _this;}(0,_createClass2.default)(FrontLayer,[{key:"render",value:function render(){var _this$props3=this.props,children=_this$props3.children,_toggleLayout=_this$props3.toggleLayout,animate=_this$props3.animate,frontLayerStyle=_this$props3.frontLayerStyle,backRevealed=_this$props3.backRevealed,subheader=_this$props3.subheader;var translateY=this.getFrontLayerTranslateY();return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:[_FrontLayer.default.frontLayerContainer,frontLayerStyle,{transform:[{translateY:translateY}]}],__source:{fileName:_jsxFileName,lineNumber:74}},_react.default.createElement(_.Subtitle,{text:subheader,style:_FrontLayer.default.subheader,__source:{fileName:_jsxFileName,lineNumber:81}}),children,_react.default.createElement(_FrontLayerScrim.default,{toggleLayout:function toggleLayout(){return _toggleLayout();},animate:animate,backRevealed:backRevealed,__source:{fileName:_jsxFileName,lineNumber:83}}));}}]);return FrontLayer;}(_react.PureComponent);(0,_defineProperty2.default)(FrontLayer,"propTypes",{offset:_propTypes.default.number,initialOffset:_propTypes.default.number,children:_propTypes.default.node,backLayerRevealed:_propTypes.default.object,frontLayerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,toggleLayout:_propTypes.default.func,animate:_propTypes.default.object,backRevealed:_propTypes.default.bool,isInternalAnimate:_propTypes.default.bool,internalOffsetAnimate:_propTypes.default.object,window:_propTypes.default.object,subheader:_propTypes.default.string});var _default=(0,_withTheme.default)(FrontLayer);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _FrontLayer=_interopRequireDefault(require("./FrontLayer.styles"));var _FrontLayerScrim=_interopRequireDefault(require("../FrontLayerScrim/FrontLayerScrim"));var _=require("../../..");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Backdrop/FrontLayer/FrontLayer.js";var IOS=_reactNative.Platform.OS==='ios';var FrontLayer=function(_PureComponent){(0,_inherits2.default)(FrontLayer,_PureComponent);function FrontLayer(props){var _this;(0,_classCallCheck2.default)(this,FrontLayer);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(FrontLayer).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"getFrontLayerTranslateY",function(){var _this$props=_this.props,animate=_this$props.animate,initialOffset=_this$props.initialOffset;var offset=_this.getOffset();return animate.interpolate({inputRange:[0,1],outputRange:[initialOffset,offset]});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"getOffset",function(){var ignoreElement=arguments.length>0&&arguments[0]!==undefined?arguments[0]:false;var _this$props2=_this.props,backLayerRevealed=_this$props2.backLayerRevealed,offset=_this$props2.offset,window=_this$props2.window;if(!ignoreElement&&backLayerRevealed&&offset){return offset;}if(offset)return offset;var y=_this.getY();return window.height-y;});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"getY",function(){var initialOffset=_this.props.initialOffset;var y=IOS?20:24;return y+initialOffset;});return _this;}(0,_createClass2.default)(FrontLayer,[{key:"render",value:function render(){var _this$props3=this.props,children=_this$props3.children,_toggleLayout=_this$props3.toggleLayout,animate=_this$props3.animate,frontLayerStyle=_this$props3.frontLayerStyle,backRevealed=_this$props3.backRevealed,subheader=_this$props3.subheader;var translateY=this.getFrontLayerTranslateY();return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_FrontLayer.default.frontLayerContainer,frontLayerStyle,{transform:[{translateY:translateY}]}],__source:{fileName:_jsxFileName,lineNumber:74}},_react.default.createElement(_.Subtitle,{text:subheader,style:_FrontLayer.default.subheader,__source:{fileName:_jsxFileName,lineNumber:81}}),children,_react.default.createElement(_FrontLayerScrim.default,{toggleLayout:function toggleLayout(){return _toggleLayout();},animate:animate,backRevealed:backRevealed,__source:{fileName:_jsxFileName,lineNumber:83}}));}}]);return FrontLayer;}(_react.PureComponent);(0,_defineProperty2.default)(FrontLayer,"propTypes",{offset:_propTypes.default.number,initialOffset:_propTypes.default.number,children:_propTypes.default.node,backLayerRevealed:_propTypes.default.object,frontLayerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,toggleLayout:_propTypes.default.func,animate:_propTypes.default.object,backRevealed:_propTypes.default.bool,isInternalAnimate:_propTypes.default.bool,internalOffsetAnimate:_propTypes.default.object,window:_propTypes.default.object,subheader:_propTypes.default.string});var _default=(0,_withTheme.default)(FrontLayer);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Backdrop/FrontLayerScrim/FrontLayerScrim.js b/dist/Components/Backdrop/FrontLayerScrim/FrontLayerScrim.js index 8f8abd4a..bc7eb850 100644 --- a/dist/Components/Backdrop/FrontLayerScrim/FrontLayerScrim.js +++ b/dist/Components/Backdrop/FrontLayerScrim/FrontLayerScrim.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _=require("../../../");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _FrontLayerScrim=_interopRequireDefault(require("./FrontLayerScrim.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Backdrop/FrontLayerScrim/FrontLayerScrim.js";var FrontLayerScrim=function(_Component){(0,_inherits2.default)(FrontLayerScrim,_Component);function FrontLayerScrim(props){(0,_classCallCheck2.default)(this,FrontLayerScrim);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(FrontLayerScrim).call(this,props));}(0,_createClass2.default)(FrontLayerScrim,[{key:"render",value:function render(){var _this$props=this.props,backRevealed=_this$props.backRevealed,toggleLayout=_this$props.toggleLayout,animate=_this$props.animate;if(!backRevealed)return null;return _react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:function onPress(){return toggleLayout();},__source:{fileName:_jsxFileName,lineNumber:24}},_react.default.createElement(_reactNative.Animated.View,{style:[_FrontLayerScrim.default.scrimLayer,{opacity:animate}],useNativeDriver:false,__source:{fileName:_jsxFileName,lineNumber:25}},_react.default.createElement(_.Icon,{name:"expand-less",size:24,color:"rgba(0,0,0,0.56)",style:_FrontLayerScrim.default.scrimLayerIcon,__source:{fileName:_jsxFileName,lineNumber:28}})));}}]);return FrontLayerScrim;}(_react.Component);(0,_defineProperty2.default)(FrontLayerScrim,"propTypes",{backRevealed:_propTypes.default.bool,toggleLayout:_propTypes.default.func,animate:_propTypes.default.object});var _default=(0,_withTheme.default)(FrontLayerScrim);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _=require("../../../");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _FrontLayerScrim=_interopRequireDefault(require("./FrontLayerScrim.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Backdrop/FrontLayerScrim/FrontLayerScrim.js";var FrontLayerScrim=function(_Component){(0,_inherits2.default)(FrontLayerScrim,_Component);function FrontLayerScrim(props){(0,_classCallCheck2.default)(this,FrontLayerScrim);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(FrontLayerScrim).call(this,props));}(0,_createClass2.default)(FrontLayerScrim,[{key:"render",value:function render(){var _this$props=this.props,backRevealed=_this$props.backRevealed,toggleLayout=_this$props.toggleLayout,animate=_this$props.animate;if(!backRevealed)return null;return _react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:function onPress(){return toggleLayout();},__source:{fileName:_jsxFileName,lineNumber:24}},_react.default.createElement(_reactNative.Animated.View,{style:[_FrontLayerScrim.default.scrimLayer,{opacity:animate}],useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:25}},_react.default.createElement(_.Icon,{name:"expand-less",size:24,color:"rgba(0,0,0,0.56)",style:_FrontLayerScrim.default.scrimLayerIcon,__source:{fileName:_jsxFileName,lineNumber:28}})));}}]);return FrontLayerScrim;}(_react.Component);(0,_defineProperty2.default)(FrontLayerScrim,"propTypes",{backRevealed:_propTypes.default.bool,toggleLayout:_propTypes.default.func,animate:_propTypes.default.object});var _default=(0,_withTheme.default)(FrontLayerScrim);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Backdrop/HeaderButton/HeaderButton.js b/dist/Components/Backdrop/HeaderButton/HeaderButton.js index 26a8f6af..c0488567 100644 --- a/dist/Components/Backdrop/HeaderButton/HeaderButton.js +++ b/dist/Components/Backdrop/HeaderButton/HeaderButton.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _=require("../../../");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _HeaderButton=_interopRequireDefault(require("./HeaderButton.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Backdrop/HeaderButton/HeaderButton.js";var HeaderButton=function(_Component){(0,_inherits2.default)(HeaderButton,_Component);function HeaderButton(props){var _this;(0,_classCallCheck2.default)(this,HeaderButton);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(HeaderButton).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"spinValue",new _reactNative.Animated.Value(0));return _this;}(0,_createClass2.default)(HeaderButton,[{key:"_handleSpin",value:function _handleSpin(){var _this2=this;var _this$props=this.props,backConcealed=_this$props.backConcealed,toggleLayout=_this$props.toggleLayout;toggleLayout();_reactNative.Animated.timing(this.spinValue,{toValue:0.5,duration:94,easing:_reactNative.Easing.linear}).start(function(){_reactNative.Animated.timing(_this2.spinValue,{toValue:backConcealed?1:0,duration:94,easing:_reactNative.Easing.linear}).start();});}},{key:"render",value:function render(){var _this3=this;var _this$props2=this.props,headerButtonStyle=_this$props2.headerButtonStyle,iconName=_this$props2.iconName;var spin=this.spinValue.interpolate({inputRange:[0,1],outputRange:['180deg','0deg']});var style=[_HeaderButton.default.container,headerButtonStyle,{transform:[{rotate:spin}]}];return _react.default.createElement(_reactNative.Animated.View,{style:style,useNativeDriver:false,__source:{fileName:_jsxFileName,lineNumber:51}},_react.default.createElement(_.Ripple,{rippleContainerBorderRadius:100,onPress:function onPress(){return _this3._handleSpin();},style:_HeaderButton.default.ripple,__source:{fileName:_jsxFileName,lineNumber:52}},_react.default.createElement(_.Icon,{name:iconName,size:24,color:"white",style:_HeaderButton.default.icon,__source:{fileName:_jsxFileName,lineNumber:56}})));}}]);return HeaderButton;}(_react.Component);(0,_defineProperty2.default)(HeaderButton,"propTypes",{headerButtonStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),toggleLayout:_propTypes.default.func,backConcealed:_propTypes.default.bool,iconName:_propTypes.default.string});var _default=(0,_withTheme.default)(HeaderButton);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _=require("../../../");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _HeaderButton=_interopRequireDefault(require("./HeaderButton.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Backdrop/HeaderButton/HeaderButton.js";var HeaderButton=function(_Component){(0,_inherits2.default)(HeaderButton,_Component);function HeaderButton(props){var _this;(0,_classCallCheck2.default)(this,HeaderButton);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(HeaderButton).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"spinValue",new _reactNative.Animated.Value(0));return _this;}(0,_createClass2.default)(HeaderButton,[{key:"_handleSpin",value:function _handleSpin(){var _this2=this;var _this$props=this.props,backConcealed=_this$props.backConcealed,toggleLayout=_this$props.toggleLayout;toggleLayout();_reactNative.Animated.timing(this.spinValue,{toValue:0.5,duration:94,easing:_reactNative.Easing.linear,useNativeDriver:true}).start(function(){_reactNative.Animated.timing(_this2.spinValue,{toValue:backConcealed?1:0,duration:94,easing:_reactNative.Easing.linear,useNativeDriver:true}).start();});}},{key:"render",value:function render(){var _this3=this;var _this$props2=this.props,headerButtonStyle=_this$props2.headerButtonStyle,iconName=_this$props2.iconName;var spin=this.spinValue.interpolate({inputRange:[0,1],outputRange:['180deg','0deg']});var style=[_HeaderButton.default.container,headerButtonStyle,{transform:[{rotate:spin}]}];return _react.default.createElement(_reactNative.Animated.View,{style:style,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:53}},_react.default.createElement(_.Ripple,{rippleContainerBorderRadius:100,onPress:function onPress(){return _this3._handleSpin();},style:_HeaderButton.default.ripple,__source:{fileName:_jsxFileName,lineNumber:54}},_react.default.createElement(_.Icon,{name:iconName,size:24,color:"white",style:_HeaderButton.default.icon,__source:{fileName:_jsxFileName,lineNumber:58}})));}}]);return HeaderButton;}(_react.Component);(0,_defineProperty2.default)(HeaderButton,"propTypes",{headerButtonStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),toggleLayout:_propTypes.default.func,backConcealed:_propTypes.default.bool,iconName:_propTypes.default.string});var _default=(0,_withTheme.default)(HeaderButton);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Badge/Badge.js b/dist/Components/Badge/Badge.js index 1bedcdae..927bc215 100644 --- a/dist/Components/Badge/Badge.js +++ b/dist/Components/Badge/Badge.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Ripple=_interopRequireDefault(require("../Ripple/Ripple"));var _Badge=_interopRequireDefault(require("./Badge.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Badge/Badge.js";var Badge=function(_Component){(0,_inherits2.default)(Badge,_Component);function Badge(props){var _this;(0,_classCallCheck2.default)(this,Badge);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Badge).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{childrenWidth:0,childrenHeight:0,scale:new _reactNative.Animated.Value(0)});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onChildrenLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({childrenWidth:width,childrenHeight:height});});return _this;}(0,_createClass2.default)(Badge,[{key:"componentDidMount",value:function componentDidMount(){var visible=this.props.visible;if(visible){this._animateBadge();}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){this._animateBadge();}}},{key:"getFontSize",value:function getFontSize(content,maxed){var size=this.props.size;var scaleFactor=0.5;if(content&&String(content).length>3&&!maxed){scaleFactor=0.3;}return size*scaleFactor;}},{key:"getBadgeWidth",value:function getBadgeWidth(content){var size=this.props.size;var isLong=String(content).length>3;var scaleFactor=isLong?1.75:1.5;return scaleFactor*size;}},{key:"_animateBadge",value:function _animateBadge(){var visible=this.props.visible;var scale=this.state.scale;var scaleValue=visible?1:0;_reactNative.Animated.spring(scale,{toValue:scaleValue,speed:7}).start();}},{key:"_renderBadge",value:function _renderBadge(){var _this$props=this.props,size=_this$props.size,textColor=_this$props.textColor,color=_this$props.color,style=_this$props.style,theme=_this$props.theme,children=_this$props.children,content=_this$props.content,position=_this$props.position,right=_this$props.right,left=_this$props.left,top=_this$props.top,_this$props$maxValue=_this$props.maxValue,maxValue=_this$props$maxValue===void 0?0:_this$props$maxValue,rest=(0,_objectWithoutProperties2.default)(_this$props,["size","textColor","color","style","theme","children","content","position","right","left","top","maxValue"]);var positionStyle={right:children?0:'auto'};if(position==='left'){positionStyle={left:children?0:'auto'};}if(right)positionStyle.right=right;if(left)positionStyle.left=left;var maxedContent=parseInt(content,10);var maxed=!isNaN(maxedContent)&&maxValue&&maxedContent>maxValue;maxedContent=maxed?maxValue+"+":content;return _react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:false,style:[{height:size,width:maxed?this.getBadgeWidth(maxedContent):size,borderRadius:size,backgroundColor:color?color:theme.primary.main,alignItems:'center',justifyContent:'center',position:children?'absolute':'relative',top:top?top:0,transform:[{scale:this.state.scale}]},positionStyle,style],numberOfLines:1},rest,{__source:{fileName:_jsxFileName,lineNumber:136}}),_react.default.createElement(_reactNative.Text,{style:[_Badge.default.content,{fontSize:this.getFontSize(maxedContent,maxed),color:textColor?textColor:'white'}],__source:{fileName:_jsxFileName,lineNumber:156}},maxedContent));}},{key:"render",value:function render(){var _this$props2=this.props,children=_this$props2.children,containerStyle=_this$props2.containerStyle,onPress=_this$props2.onPress,testID=_this$props2.testID;var _this$state=this.state,childrenHeight=_this$state.childrenHeight,childrenWidth=_this$state.childrenWidth;return _react.default.createElement(_reactNative.View,{style:[{position:'relative',alignSelf:'flex-start',alignItems:'flex-start',height:children?childrenHeight:'auto',width:children?childrenWidth:'auto',maxHeight:children?childrenHeight:'auto',maxWidth:children?childrenWidth:'auto',minHeight:children?childrenHeight:'auto',minWidth:children?childrenWidth:'auto'},containerStyle],testID:testID,__source:{fileName:_jsxFileName,lineNumber:175}},_react.default.createElement(_reactNative.View,{onLayout:this.onChildrenLayout,__source:{fileName:_jsxFileName,lineNumber:191}},children),onPress?_react.default.createElement(_Ripple.default,{onPress:true,__source:{fileName:_jsxFileName,lineNumber:193}},this._renderBadge()):this._renderBadge());}}]);return Badge;}(_react.Component);(0,_defineProperty2.default)(Badge,"propTypes",{color:_propTypes.default.string,textColor:_propTypes.default.string,content:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.number]),maxValue:_propTypes.default.number,children:_propTypes.default.node,size:_propTypes.default.number,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),position:_propTypes.default.string,onPress:_propTypes.default.func,theme:_propTypes.default.object,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),right:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),left:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),top:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),visible:_propTypes.default.bool,testID:_propTypes.default.string});(0,_defineProperty2.default)(Badge,"defaultProps",{position:'right',size:16,right:0,left:'auto',visible:true});var _default=(0,_withTheme.default)(Badge);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Ripple=_interopRequireDefault(require("../Ripple/Ripple"));var _Badge=_interopRequireDefault(require("./Badge.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Badge/Badge.js";var Badge=function(_Component){(0,_inherits2.default)(Badge,_Component);function Badge(props){var _this;(0,_classCallCheck2.default)(this,Badge);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Badge).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{childrenWidth:0,childrenHeight:0,scale:new _reactNative.Animated.Value(0)});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onChildrenLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({childrenWidth:width,childrenHeight:height});});return _this;}(0,_createClass2.default)(Badge,[{key:"componentDidMount",value:function componentDidMount(){var visible=this.props.visible;if(visible){this._animateBadge();}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){this._animateBadge();}}},{key:"getFontSize",value:function getFontSize(content,maxed){var size=this.props.size;var scaleFactor=0.5;if(content&&String(content).length>3&&!maxed){scaleFactor=0.3;}return size*scaleFactor;}},{key:"getBadgeWidth",value:function getBadgeWidth(content){var size=this.props.size;var isLong=String(content).length>3;var scaleFactor=isLong?1.75:1.5;return scaleFactor*size;}},{key:"_animateBadge",value:function _animateBadge(){var visible=this.props.visible;var scale=this.state.scale;var scaleValue=visible?1:0;_reactNative.Animated.spring(scale,{toValue:scaleValue,speed:7,useNativeDriver:true}).start();}},{key:"_renderBadge",value:function _renderBadge(){var _this$props=this.props,size=_this$props.size,textColor=_this$props.textColor,color=_this$props.color,style=_this$props.style,theme=_this$props.theme,children=_this$props.children,content=_this$props.content,position=_this$props.position,right=_this$props.right,left=_this$props.left,top=_this$props.top,_this$props$maxValue=_this$props.maxValue,maxValue=_this$props$maxValue===void 0?0:_this$props$maxValue,rest=(0,_objectWithoutProperties2.default)(_this$props,["size","textColor","color","style","theme","children","content","position","right","left","top","maxValue"]);var positionStyle={right:children?0:'auto'};if(position==='left'){positionStyle={left:children?0:'auto'};}if(right)positionStyle.right=right;if(left)positionStyle.left=left;var maxedContent=parseInt(content,10);var maxed=!isNaN(maxedContent)&&maxValue&&maxedContent>maxValue;maxedContent=maxed?maxValue+"+":content;return _react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true,style:[{height:size,width:maxed?this.getBadgeWidth(maxedContent):size,borderRadius:size,backgroundColor:color?color:theme.primary.main,alignItems:'center',justifyContent:'center',position:children?'absolute':'relative',top:top?top:0,transform:[{scale:this.state.scale}]},positionStyle,style],numberOfLines:1},rest,{__source:{fileName:_jsxFileName,lineNumber:137}}),_react.default.createElement(_reactNative.Text,{style:[_Badge.default.content,{fontSize:this.getFontSize(maxedContent,maxed),color:textColor?textColor:'white'}],__source:{fileName:_jsxFileName,lineNumber:157}},maxedContent));}},{key:"render",value:function render(){var _this$props2=this.props,children=_this$props2.children,containerStyle=_this$props2.containerStyle,onPress=_this$props2.onPress,testID=_this$props2.testID;var _this$state=this.state,childrenHeight=_this$state.childrenHeight,childrenWidth=_this$state.childrenWidth;return _react.default.createElement(_reactNative.View,{style:[{position:'relative',alignSelf:'flex-start',alignItems:'flex-start',height:children?childrenHeight:'auto',width:children?childrenWidth:'auto',maxHeight:children?childrenHeight:'auto',maxWidth:children?childrenWidth:'auto',minHeight:children?childrenHeight:'auto',minWidth:children?childrenWidth:'auto'},containerStyle],testID:testID,__source:{fileName:_jsxFileName,lineNumber:176}},_react.default.createElement(_reactNative.View,{onLayout:this.onChildrenLayout,__source:{fileName:_jsxFileName,lineNumber:192}},children),onPress?_react.default.createElement(_Ripple.default,{onPress:true,__source:{fileName:_jsxFileName,lineNumber:194}},this._renderBadge()):this._renderBadge());}}]);return Badge;}(_react.Component);(0,_defineProperty2.default)(Badge,"propTypes",{color:_propTypes.default.string,textColor:_propTypes.default.string,content:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.number]),maxValue:_propTypes.default.number,children:_propTypes.default.node,size:_propTypes.default.number,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),position:_propTypes.default.string,onPress:_propTypes.default.func,theme:_propTypes.default.object,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),right:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),left:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),top:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),visible:_propTypes.default.bool,testID:_propTypes.default.string});(0,_defineProperty2.default)(Badge,"defaultProps",{position:'right',size:16,right:0,left:'auto',visible:true});var _default=(0,_withTheme.default)(Badge);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Banner/Banner.js b/dist/Components/Banner/Banner.js index 00583279..b08b5f4a 100644 --- a/dist/Components/Banner/Banner.js +++ b/dist/Components/Banner/Banner.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _shadow=_interopRequireDefault(require("../../Utils/Shadow/shadow.js"));var _Button=_interopRequireDefault(require("../Button/Button"));var _=require("../../");var _Banner=_interopRequireDefault(require("./Banner.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Banner/Banner.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i1024,width:width});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onLayout",function(event){_this.setState({maxHeight:event.nativeEvent.layout.height},function(){if(_this.props.visible)_this.animateBanner(true);});});return _this;}(0,_createClass2.default)(Banner,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){var visible=this.props.visible;var shouldHide=this.state.shouldHide;if(!prevProps.visible&&visible){this.setState({shouldHide:false});this.animateBanner(true);}else if(prevProps.visible&&!visible||!prevState.shouldHide&&shouldHide){this.animateBanner(false);}}},{key:"componentDidMount",value:function componentDidMount(){if(this.props.visible){this.animateBanner(true);}this._handleLayout();_reactNative.Dimensions.addEventListener('change',this._handleLayout);}},{key:"componentWillUnmount",value:function componentWillUnmount(){_reactNative.Dimensions.removeEventListener('change',this._handleLayout);}},{key:"animateBanner",value:function animateBanner(show){var maxHeight=this.state.maxHeight;var newHeight=show?maxHeight:0;_reactNative.Animated.parallel([_reactNative.Animated.spring(this.state.height,{toValue:newHeight})]).start();}},{key:"_renderActionItems",value:function _renderActionItems(){var _this2=this;var actionItems=this.props.actionItems;if(!actionItems)return null;var platformStyles=this.getPlatformStyles();return _react.default.createElement(_reactNative.View,{style:[_Banner.default.buttons,platformStyles.actions],__source:{fileName:_jsxFileName,lineNumber:87}},actionItems.map(function(item){if(item.name&&item.name.length>0){return _react.default.createElement(_Button.default,{key:item.name,text:item.name,compact:true,type:"text",onPress:function onPress(){item.onPress&&item.onPress();_this2.setState({shouldHide:true});},style:[_Banner.default.button],__source:{fileName:_jsxFileName,lineNumber:91}});}else{return null;}}));}},{key:"_renderContent",value:function _renderContent(){var _this$props=this.props,media=_this$props.media,message=_this$props.message;var platformStyles=this.getPlatformStyles();return _react.default.createElement(_reactNative.View,{style:[_Banner.default.content,platformStyles.content],__source:{fileName:_jsxFileName,lineNumber:116}},media?_react.default.createElement(_reactNative.View,{style:platformStyles.image,__source:{fileName:_jsxFileName,lineNumber:117}},media):null,_react.default.createElement(_.BodyText,{type:2,style:{lineHeight:20,maxWidth:460,flexShrink:1},__source:{fileName:_jsxFileName,lineNumber:118}},message));}},{key:"_renderBody",value:function _renderBody(){var getPlatformStyles=this.getPlatformStyles();return _react.default.createElement(_reactNative.View,{style:[_Banner.default.body,getPlatformStyles.body],__source:{fileName:_jsxFileName,lineNumber:134}},this._renderContent(),this._renderActionItems());}},{key:"getPlatformStyles",value:function getPlatformStyles(){var _this$props2=this.props,mobileLayout=_this$props2.mobileLayout,media=_this$props2.media,singleLine=_this$props2.singleLine;var _this$state=this.state,isWideScreen=_this$state.isWideScreen,width=_this$state.width;var isWeb=_reactNative.Platform.OS=='web';var styles={body:{alignItems:singleLine?'center':'flex-start',justifyContent:singleLine?'space-between':'space-between',marginTop:singleLine?8:24,marginLeft:16,flexDirection:singleLine?'row':'column'},content:{marginBottom:8,marginRight:width<400?8:0},actions:{justifyContent:singleLine?'center':'flex-end',alignItems:singleLine?'center':'flex-end',alignSelf:singleLine?'center':'flex-end',marginRight:8},image:{marginRight:16}};if(isWeb&&isWideScreen&&!mobileLayout){styles={body:{alignItems:singleLine?'center':'flex-start',justifyContent:singleLine?'space-between':'space-between',marginTop:singleLine?8:16,marginLeft:media?16:24,flexDirection:'row'},content:{marginBottom:singleLine?8:16},actions:{justifyContent:singleLine?'center':'flex-end',alignItems:singleLine?'center':'flex-end',alignSelf:singleLine?'center':'flex-end'},image:{marginRight:24}};}return styles;}},{key:"render",value:function render(){var _this$props3=this.props,style=_this$props3.style,position=_this$props3.position,visible=_this$props3.visible,testID=_this$props3.testID;var shouldHide=this.state.shouldHide;var appliedShadow=visible&&!shouldHide?1:0;return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:[_Banner.default.container,_objectSpread({position:position?position:'relative',height:this.state.height},(0,_shadow.default)(appliedShadow)),style],testID:testID,__source:{fileName:_jsxFileName,lineNumber:211}},_react.default.createElement(_reactNative.View,{onLayout:this._onLayout,__source:{fileName:_jsxFileName,lineNumber:223}},this._renderBody()));}}]);return Banner;}(_react.Component);(0,_defineProperty2.default)(Banner,"propTypes",{mobileLayout:_propTypes.default.bool,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),actionItems:_propTypes.default.array,singleLine:_propTypes.default.bool,media:_propTypes.default.node,visible:_propTypes.default.bool,message:_propTypes.default.string,position:_propTypes.default.string,testID:_propTypes.default.string});var _default=(0,_withTheme.default)(Banner);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _shadow=_interopRequireDefault(require("../../Utils/Shadow/shadow.js"));var _Button=_interopRequireDefault(require("../Button/Button"));var _=require("../../");var _Banner=_interopRequireDefault(require("./Banner.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Banner/Banner.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i1024,width:width});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onLayout",function(event){_this.setState({maxHeight:event.nativeEvent.layout.height},function(){if(_this.props.visible)_this.animateBanner(true);});});return _this;}(0,_createClass2.default)(Banner,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps,prevState){var visible=this.props.visible;var shouldHide=this.state.shouldHide;if(!prevProps.visible&&visible){this.setState({shouldHide:false});this.animateBanner(true);}else if(prevProps.visible&&!visible||!prevState.shouldHide&&shouldHide){this.animateBanner(false);}}},{key:"componentDidMount",value:function componentDidMount(){if(this.props.visible){this.animateBanner(true);}this._handleLayout();_reactNative.Dimensions.addEventListener('change',this._handleLayout);}},{key:"componentWillUnmount",value:function componentWillUnmount(){_reactNative.Dimensions.removeEventListener('change',this._handleLayout);}},{key:"animateBanner",value:function animateBanner(show){var maxHeight=this.state.maxHeight;var newHeight=show?maxHeight:0;_reactNative.Animated.parallel([_reactNative.Animated.spring(this.state.height,{toValue:newHeight})]).start();}},{key:"_renderActionItems",value:function _renderActionItems(){var _this2=this;var actionItems=this.props.actionItems;if(!actionItems)return null;var platformStyles=this.getPlatformStyles();return _react.default.createElement(_reactNative.View,{style:[_Banner.default.buttons,platformStyles.actions],__source:{fileName:_jsxFileName,lineNumber:87}},actionItems.map(function(item){if(item.name&&item.name.length>0){return _react.default.createElement(_Button.default,{key:item.name,text:item.name,compact:true,type:"text",onPress:function onPress(){item.onPress&&item.onPress();_this2.setState({shouldHide:true});},style:[_Banner.default.button],__source:{fileName:_jsxFileName,lineNumber:91}});}else{return null;}}));}},{key:"_renderContent",value:function _renderContent(){var _this$props=this.props,media=_this$props.media,message=_this$props.message;var platformStyles=this.getPlatformStyles();return _react.default.createElement(_reactNative.View,{style:[_Banner.default.content,platformStyles.content],__source:{fileName:_jsxFileName,lineNumber:116}},media?_react.default.createElement(_reactNative.View,{style:platformStyles.image,__source:{fileName:_jsxFileName,lineNumber:117}},media):null,_react.default.createElement(_.BodyText,{type:2,style:{lineHeight:20,maxWidth:460,flexShrink:1},__source:{fileName:_jsxFileName,lineNumber:118}},message));}},{key:"_renderBody",value:function _renderBody(){var getPlatformStyles=this.getPlatformStyles();return _react.default.createElement(_reactNative.View,{style:[_Banner.default.body,getPlatformStyles.body],__source:{fileName:_jsxFileName,lineNumber:134}},this._renderContent(),this._renderActionItems());}},{key:"getPlatformStyles",value:function getPlatformStyles(){var _this$props2=this.props,mobileLayout=_this$props2.mobileLayout,media=_this$props2.media,singleLine=_this$props2.singleLine;var _this$state=this.state,isWideScreen=_this$state.isWideScreen,width=_this$state.width;var isWeb=_reactNative.Platform.OS=='web';var styles={body:{alignItems:singleLine?'center':'flex-start',justifyContent:singleLine?'space-between':'space-between',marginTop:singleLine?8:24,marginLeft:16,flexDirection:singleLine?'row':'column'},content:{marginBottom:8,marginRight:width<400?8:0},actions:{justifyContent:singleLine?'center':'flex-end',alignItems:singleLine?'center':'flex-end',alignSelf:singleLine?'center':'flex-end',marginRight:8},image:{marginRight:16}};if(isWeb&&isWideScreen&&!mobileLayout){styles={body:{alignItems:singleLine?'center':'flex-start',justifyContent:singleLine?'space-between':'space-between',marginTop:singleLine?8:16,marginLeft:media?16:24,flexDirection:'row'},content:{marginBottom:singleLine?8:16},actions:{justifyContent:singleLine?'center':'flex-end',alignItems:singleLine?'center':'flex-end',alignSelf:singleLine?'center':'flex-end'},image:{marginRight:24}};}return styles;}},{key:"render",value:function render(){var _this$props3=this.props,style=_this$props3.style,position=_this$props3.position,visible=_this$props3.visible,testID=_this$props3.testID;var shouldHide=this.state.shouldHide;var appliedShadow=visible&&!shouldHide?1:0;return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_Banner.default.container,_objectSpread({position:position?position:'relative',height:this.state.height},(0,_shadow.default)(appliedShadow)),style],testID:testID,__source:{fileName:_jsxFileName,lineNumber:211}},_react.default.createElement(_reactNative.View,{onLayout:this._onLayout,__source:{fileName:_jsxFileName,lineNumber:223}},this._renderBody()));}}]);return Banner;}(_react.Component);(0,_defineProperty2.default)(Banner,"propTypes",{mobileLayout:_propTypes.default.bool,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),actionItems:_propTypes.default.array,singleLine:_propTypes.default.bool,media:_propTypes.default.node,visible:_propTypes.default.bool,message:_propTypes.default.string,position:_propTypes.default.string,testID:_propTypes.default.string});var _default=(0,_withTheme.default)(Banner);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/BottomNavigation/BottomNavigationItem/BottomNavigationItem.js b/dist/Components/BottomNavigation/BottomNavigationItem/BottomNavigationItem.js index ead30248..35ca0812 100644 --- a/dist/Components/BottomNavigation/BottomNavigationItem/BottomNavigationItem.js +++ b/dist/Components/BottomNavigation/BottomNavigationItem/BottomNavigationItem.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _Icon=_interopRequireDefault(require("../../Icon/Icon"));var _Ripple=_interopRequireDefault(require("../../Ripple/Ripple"));var _Badge=_interopRequireDefault(require("../../Badge/Badge"));var _BottomNavigation=require("../BottomNavigation");var _BottomNavigationItem=_interopRequireDefault(require("./BottomNavigationItem.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/BottomNavigation/BottomNavigationItem/BottomNavigationItem.js";var BottomNavigationItem=function(_Component){(0,_inherits2.default)(BottomNavigationItem,_Component);function BottomNavigationItem(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,BottomNavigationItem);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(BottomNavigationItem)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{scaleText:new _reactNative.Animated.Value(0)});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onChange",function(){var _this$props=_this.props,handleChange=_this$props.handleChange,onPress=_this$props.onPress,value=_this$props.value;if(handleChange)handleChange(value);if(onPress)onPress();});return _this;}(0,_createClass2.default)(BottomNavigationItem,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,showOneItem=_this$props2.showOneItem,showLabel=_this$props2.showLabel,active=_this$props2.active;if(showOneItem||active||showLabel){this._animateActive(true);}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){if(!prevProps.active&&this.props.active){this._animateActive(true);}else if(prevProps.active&&!this.props.active){this._animateActive(false);}}},{key:"_animateActive",value:function _animateActive(show){var scaleText=this.state.scaleText;var scale=show?12:0;if(this.props.showLabel||this.props.showOneItem){scale=show?12:10;}_reactNative.Animated.parallel([_reactNative.Animated.timing(scaleText,{toValue:scale,duration:150})]).start();}},{key:"_renderText",value:function _renderText(containerColor){var _this$props3=this.props,isLandscape=_this$props3.isLandscape,horizontal=_this$props3.horizontal,showOneItem=_this$props3.showOneItem,showLabel=_this$props3.showLabel,active=_this$props3.active,icon=_this$props3.icon;var isHorizontal=isLandscape&&horizontal;var showOneItemsWithoutDefault=!showOneItem;var showActiveLabel=showOneItem&&active;var color='white';if(containerColor=='white'||containerColor=='#fff')color='#DADADA';var label=this.props.label;var activeLabel=label;if(!showOneItemsWithoutDefault&&!showActiveLabel){activeLabel='';}return _react.default.createElement(_reactNative.Animated.Text,{useNativeDriver:false,style:{color:color,fontSize:this.state.scaleText,marginLeft:isHorizontal&&showLabel&&icon?12:0},__source:{fileName:_jsxFileName,lineNumber:96}},activeLabel);}},{key:"_handleIconColor",value:function _handleIconColor(containerColor){if(containerColor=='white'||containerColor=='#fff'){return'#DADADA';}else{return'white';}}},{key:"_renderWrapper",value:function _renderWrapper(context){var _this$props4=this.props,active=_this$props4.active,children=_this$props4.children,style=_this$props4.style,testID=_this$props4.testID,rippleProps=_this$props4.rippleProps,isLandscape=_this$props4.isLandscape,maxWidth=_this$props4.maxWidth,horizontal=_this$props4.horizontal,showOneItem=_this$props4.showOneItem;var actualMaxWidth=Math.min(maxWidth,192);var opacity=showOneItem?1:0.6;return _react.default.createElement(_Ripple.default,(0,_extends2.default)({style:[_BottomNavigationItem.default.bottomNavigationItem,{opacity:active?1:opacity},isLandscape&&!horizontal&&[_BottomNavigationItem.default.bottomNavigationItemLandscape,{maxWidth:actualMaxWidth}],isLandscape&&horizontal&&{flexDirection:'row',paddingHorizontal:12},style],onPress:this.onChange,testID:testID},rippleProps,{__source:{fileName:_jsxFileName,lineNumber:140}}),children?children:this._renderContent(context));}},{key:"_renderContent",value:function _renderContent(context){var _this$props5=this.props,label=_this$props5.label,badgeProps=_this$props5.badgeProps,icon=_this$props5.icon;var iconImplemented=this._renderIcon(context);if(badgeProps){iconImplemented=_react.default.createElement(_Badge.default,(0,_extends2.default)({containerStyle:{alignItems:'center',justifyContent:'center',alignSelf:'center',display:'flex'},style:[{right:badgeProps.right?badgeProps.right:-4,top:badgeProps.top?badgeProps.top:-4}]},badgeProps,{__source:{fileName:_jsxFileName,lineNumber:170}}),this._renderIcon(context));}return _react.default.createElement(_react.Fragment,{__source:{fileName:_jsxFileName,lineNumber:189}},icon?iconImplemented:null,label?this._renderText(context.backgroundColor):null);}},{key:"_renderIcon",value:function _renderIcon(context){var icon=this.props.icon;return _react.default.createElement(_Icon.default,{name:icon,size:24,color:this._handleIconColor(context.backgroundColor),__source:{fileName:_jsxFileName,lineNumber:199}});}},{key:"render",value:function render(){var _this2=this;return _react.default.createElement(_BottomNavigation.BottomNavContext.Consumer,{__source:{fileName:_jsxFileName,lineNumber:209}},function(context){return _this2._renderWrapper(context);});}}]);return BottomNavigationItem;}(_react.Component);(0,_defineProperty2.default)(BottomNavigationItem,"propTypes",{children:_propTypes.default.node,active:_propTypes.default.bool,icon:_propTypes.default.string,label:_propTypes.default.string,showOneItem:_propTypes.default.bool,onPress:_propTypes.default.func,handleChange:_propTypes.default.func,value:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),showLabel:_propTypes.default.bool,style:_propTypes.default.oneOfType([_propTypes.default.array,_propTypes.default.object]),badgeProps:_propTypes.default.object,rippleProps:_propTypes.default.object,testID:_propTypes.default.string,isLandscape:_propTypes.default.bool,onItemLayout:_propTypes.default.func,maxWidth:_propTypes.default.number,horizontal:_propTypes.default.bool});(0,_defineProperty2.default)(BottomNavigationItem,"defaultProps",{showLabel:true});var _default=(0,_withTheme.default)(BottomNavigationItem);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _Icon=_interopRequireDefault(require("../../Icon/Icon"));var _Ripple=_interopRequireDefault(require("../../Ripple/Ripple"));var _Badge=_interopRequireDefault(require("../../Badge/Badge"));var _BottomNavigation=require("../BottomNavigation");var _BottomNavigationItem=_interopRequireDefault(require("./BottomNavigationItem.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/BottomNavigation/BottomNavigationItem/BottomNavigationItem.js";var BottomNavigationItem=function(_Component){(0,_inherits2.default)(BottomNavigationItem,_Component);function BottomNavigationItem(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,BottomNavigationItem);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(BottomNavigationItem)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{scaleText:new _reactNative.Animated.Value(0)});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onChange",function(){var _this$props=_this.props,handleChange=_this$props.handleChange,onPress=_this$props.onPress,value=_this$props.value;if(handleChange)handleChange(value);if(onPress)onPress();});return _this;}(0,_createClass2.default)(BottomNavigationItem,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,showOneItem=_this$props2.showOneItem,showLabel=_this$props2.showLabel,active=_this$props2.active;if(showOneItem||active||showLabel){this._animateActive(true);}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){if(!prevProps.active&&this.props.active){this._animateActive(true);}else if(prevProps.active&&!this.props.active){this._animateActive(false);}}},{key:"_animateActive",value:function _animateActive(show){var scaleText=this.state.scaleText;var scale=show?12:0;if(this.props.showLabel||this.props.showOneItem){scale=show?12:10;}_reactNative.Animated.parallel([_reactNative.Animated.timing(scaleText,{toValue:scale,duration:150})]).start();}},{key:"_renderText",value:function _renderText(containerColor){var _this$props3=this.props,isLandscape=_this$props3.isLandscape,horizontal=_this$props3.horizontal,showOneItem=_this$props3.showOneItem,showLabel=_this$props3.showLabel,active=_this$props3.active,icon=_this$props3.icon;var isHorizontal=isLandscape&&horizontal;var showOneItemsWithoutDefault=!showOneItem;var showActiveLabel=showOneItem&&active;var color='white';if(containerColor=='white'||containerColor=='#fff')color='#DADADA';var label=this.props.label;var activeLabel=label;if(!showOneItemsWithoutDefault&&!showActiveLabel){activeLabel='';}return _react.default.createElement(_reactNative.Animated.Text,{style:{color:color,fontSize:this.state.scaleText,marginLeft:isHorizontal&&showLabel&&icon?12:0},__source:{fileName:_jsxFileName,lineNumber:96}},activeLabel);}},{key:"_handleIconColor",value:function _handleIconColor(containerColor){if(containerColor=='white'||containerColor=='#fff'){return'#DADADA';}else{return'white';}}},{key:"_renderWrapper",value:function _renderWrapper(context){var _this$props4=this.props,active=_this$props4.active,children=_this$props4.children,style=_this$props4.style,testID=_this$props4.testID,rippleProps=_this$props4.rippleProps,isLandscape=_this$props4.isLandscape,maxWidth=_this$props4.maxWidth,horizontal=_this$props4.horizontal,showOneItem=_this$props4.showOneItem;var actualMaxWidth=Math.min(maxWidth,192);var opacity=showOneItem?1:0.6;return _react.default.createElement(_Ripple.default,(0,_extends2.default)({style:[_BottomNavigationItem.default.bottomNavigationItem,{opacity:active?1:opacity},isLandscape&&!horizontal&&[_BottomNavigationItem.default.bottomNavigationItemLandscape,{maxWidth:actualMaxWidth}],isLandscape&&horizontal&&{flexDirection:'row',paddingHorizontal:12},style],onPress:this.onChange,testID:testID},rippleProps,{__source:{fileName:_jsxFileName,lineNumber:139}}),children?children:this._renderContent(context));}},{key:"_renderContent",value:function _renderContent(context){var _this$props5=this.props,label=_this$props5.label,badgeProps=_this$props5.badgeProps,icon=_this$props5.icon;var iconImplemented=this._renderIcon(context);if(badgeProps){iconImplemented=_react.default.createElement(_Badge.default,(0,_extends2.default)({containerStyle:{alignItems:'center',justifyContent:'center',alignSelf:'center',display:'flex'},style:[{right:badgeProps.right?badgeProps.right:-4,top:badgeProps.top?badgeProps.top:-4}]},badgeProps,{__source:{fileName:_jsxFileName,lineNumber:169}}),this._renderIcon(context));}return _react.default.createElement(_react.Fragment,{__source:{fileName:_jsxFileName,lineNumber:188}},icon?iconImplemented:null,label?this._renderText(context.backgroundColor):null);}},{key:"_renderIcon",value:function _renderIcon(context){var icon=this.props.icon;return _react.default.createElement(_Icon.default,{name:icon,size:24,color:this._handleIconColor(context.backgroundColor),__source:{fileName:_jsxFileName,lineNumber:198}});}},{key:"render",value:function render(){var _this2=this;return _react.default.createElement(_BottomNavigation.BottomNavContext.Consumer,{__source:{fileName:_jsxFileName,lineNumber:208}},function(context){return _this2._renderWrapper(context);});}}]);return BottomNavigationItem;}(_react.Component);(0,_defineProperty2.default)(BottomNavigationItem,"propTypes",{children:_propTypes.default.node,active:_propTypes.default.bool,icon:_propTypes.default.string,label:_propTypes.default.string,showOneItem:_propTypes.default.bool,onPress:_propTypes.default.func,handleChange:_propTypes.default.func,value:_propTypes.default.oneOfType([_propTypes.default.number,_propTypes.default.string]),showLabel:_propTypes.default.bool,style:_propTypes.default.oneOfType([_propTypes.default.array,_propTypes.default.object]),badgeProps:_propTypes.default.object,rippleProps:_propTypes.default.object,testID:_propTypes.default.string,isLandscape:_propTypes.default.bool,onItemLayout:_propTypes.default.func,maxWidth:_propTypes.default.number,horizontal:_propTypes.default.bool});(0,_defineProperty2.default)(BottomNavigationItem,"defaultProps",{showLabel:true});var _default=(0,_withTheme.default)(BottomNavigationItem);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Button/ContainedButton/ContainedButton.js b/dist/Components/Button/ContainedButton/ContainedButton.js index 15886acc..e203ab09 100644 --- a/dist/Components/Button/ContainedButton/ContainedButton.js +++ b/dist/Components/Button/ContainedButton/ContainedButton.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _ButtonBase=_interopRequireDefault(require("../ButtonBase/ButtonBase"));var _=require("../../../");var _color=_interopRequireDefault(require("color"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Button/ContainedButton/ContainedButton.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0){if(buttonPositionX>modalMenuWidth/2){menuContainerStyle.right=modalMenuWidth-buttonPositionX-buttonWidth;}else{menuContainerStyle.left=buttonPositionX-10;}}if(tooltip){menuContainerStyle.top=buttonPositionY-initialHeight-12;menuContainerStyle.left=buttonPositionX-8+buttonWidth/2-initialWidth/2;if(tooltipPosition=='bottom'){menuContainerStyle.top=buttonPositionY+initialHeight+(_reactNative.Platform.OS=='web'?4:-4);}else if(tooltipPosition=='right'){menuContainerStyle.top=buttonPositionY-(_reactNative.Platform.OS=='web'?4:8);menuContainerStyle.left=buttonPositionX-8+buttonWidth;}else if(tooltipPosition=='left'){menuContainerStyle.top=buttonPositionY-(_reactNative.Platform.OS=='web'?4:8);menuContainerStyle.left=buttonPositionX-12-initialWidth;}}if(Number.isNaN(menuContainerStyle.top)||Number.isNaN(menuContainerStyle.left)){menuContainerStyle.top=0;menuContainerStyle.left=0;}return _react.default.createElement(_reactNative.View,{testID:testID,__source:{fileName:_jsxFileName,lineNumber:219}},_react.default.createElement(_reactNative.View,{onLayout:this.onButtonLayout,ref:function ref(_ref){_this3.marker=_ref;},style:{alignSelf:'flex-start',width:fullWidth?'100%':'auto'},__source:{fileName:_jsxFileName,lineNumber:220}},button),_react.default.createElement(_ModalMenu.default,{onLayout:this.onModalMenuLayout,animationType:'none',visible:visible,onBackdropPress:onBackdropPress,noBackDrop:noBackDrop,transparent:true,__source:{fileName:_jsxFileName,lineNumber:231}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:[_Menu.default.menuContainer,menuContainerStyle,modalMenuStyle],__source:{fileName:_jsxFileName,lineNumber:238}},_react.default.createElement(_reactNative.View,{style:[_Menu.default.menu,{width:sameWidth?buttonWidth:'auto'},menuStyle],onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:241}},_react.default.createElement(_reactNative.ScrollView,{contentContainerStyle:[{paddingVertical:8},contentContainerStyle],__source:{fileName:_jsxFileName,lineNumber:248}},children)))));}}]);return Menu;}(_react.Component);(0,_defineProperty2.default)(Menu,"propTypes",{button:_propTypes.default.node,children:_propTypes.default.node,onHidden:_propTypes.default.func,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,menuStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),sameWidth:_propTypes.default.bool,onBackdropPress:_propTypes.default.func,modalMenuStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),contentContainerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),noBackDrop:_propTypes.default.bool,tooltip:_propTypes.default.bool,tooltipPosition:_propTypes.default.string,testID:_propTypes.default.string,fullWidth:_propTypes.default.bool});var _default=(0,_withTheme.default)(Menu);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Menu=_interopRequireDefault(require("./Menu.styles"));var _ModalMenu=_interopRequireDefault(require("./ModalMenu"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Menu/Menu.js";var Menu=function(_Component){(0,_inherits2.default)(Menu,_Component);function Menu(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Menu);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Menu)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{menuHeight:new _reactNative.Animated.Value(0),menuWidth:new _reactNative.Animated.Value(0),opacity:new _reactNative.Animated.Value(0),modalMenuWidth:0,easing:_reactNative.Easing.bezier(0.4,0,0.2,1),animationDuration:300,expanded:false});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onModalMenuLayout",function(e){var width=e.nativeEvent.layout.width;_this.setState({modalMenuWidth:width});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onButtonLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;var locationX,locationY;if(_reactNative.Platform.OS==='web'){locationX=e.nativeEvent.target.getBoundingClientRect().x;locationY=e.nativeEvent.target.getBoundingClientRect().y;_this.setState({buttonWidth:width,buttonHeight:height,buttonPositionX:locationX,buttonPositionY:locationY});}else{_this.marker.measure(function(x,y,width,height,pageX,pageY){locationX=pageX;locationY=pageY;_this.setState({buttonWidth:width,buttonHeight:height,buttonPositionX:locationX,buttonPositionY:locationY});});}});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _e$nativeEvent$layout2=e.nativeEvent.layout,width=_e$nativeEvent$layout2.width,height=_e$nativeEvent$layout2.height;_this.setState({initialWidth:width,initialHeight:height});});return _this;}(0,_createClass2.default)(Menu,[{key:"componentDidMount",value:function componentDidMount(){var visible=this.props.visible;if(visible){this.toggle();}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!==prevProps.visible){this.toggle();}}},{key:"toggle",value:function toggle(){var _this2=this;var _this$state=this.state,initialHeight=_this$state.initialHeight,initialWidth=_this$state.initialWidth,easing=_this$state.easing,animationDuration=_this$state.animationDuration,buttonWidth=_this$state.buttonWidth;if(!initialHeight||!initialWidth){setTimeout(function(){return _this2.toggle();},100);return;}var sameWidth=this.props.sameWidth;var widthType=sameWidth?buttonWidth:initialWidth;var opacity=1;var height=initialHeight+24;var width=widthType+24;if(!this.props.visible){opacity=0;height=0;width=0;}_reactNative.Animated.parallel([_reactNative.Animated.timing(this.state.menuHeight,{toValue:height,duration:animationDuration,easing:easing,useNativeDriver:true}),_reactNative.Animated.timing(this.state.menuWidth,{toValue:width,duration:animationDuration,easing:easing,useNativeDriver:true}),_reactNative.Animated.timing(this.state.opacity,{toValue:opacity,duration:animationDuration,easing:easing,useNativeDriver:true})]).start();}},{key:"render",value:function render(){var _this3=this;var _this$state2=this.state,menuHeight=_this$state2.menuHeight,menuWidth=_this$state2.menuWidth,opacity=_this$state2.opacity,buttonWidth=_this$state2.buttonWidth,buttonPositionY=_this$state2.buttonPositionY,buttonPositionX=_this$state2.buttonPositionX,modalMenuWidth=_this$state2.modalMenuWidth,initialWidth=_this$state2.initialWidth,initialHeight=_this$state2.initialHeight;var _this$props=this.props,button=_this$props.button,children=_this$props.children,menuStyle=_this$props.menuStyle,modalMenuStyle=_this$props.modalMenuStyle,sameWidth=_this$props.sameWidth,visible=_this$props.visible,onBackdropPress=_this$props.onBackdropPress,contentContainerStyle=_this$props.contentContainerStyle,tooltip=_this$props.tooltip,tooltipPosition=_this$props.tooltipPosition,noBackDrop=_this$props.noBackDrop,testID=_this$props.testID,fullWidth=_this$props.fullWidth;var menuContainerStyle={height:menuHeight,width:menuWidth,opacity:opacity,top:buttonPositionY?buttonPositionY-14:0};if(modalMenuWidth>0){if(buttonPositionX>modalMenuWidth/2){menuContainerStyle.right=modalMenuWidth-buttonPositionX-buttonWidth;}else{menuContainerStyle.left=buttonPositionX-10;}}if(tooltip){menuContainerStyle.top=buttonPositionY-initialHeight-12;menuContainerStyle.left=buttonPositionX-8+buttonWidth/2-initialWidth/2;if(tooltipPosition=='bottom'){menuContainerStyle.top=buttonPositionY+initialHeight+(_reactNative.Platform.OS=='web'?4:-4);}else if(tooltipPosition=='right'){menuContainerStyle.top=buttonPositionY-(_reactNative.Platform.OS=='web'?4:8);menuContainerStyle.left=buttonPositionX-8+buttonWidth;}else if(tooltipPosition=='left'){menuContainerStyle.top=buttonPositionY-(_reactNative.Platform.OS=='web'?4:8);menuContainerStyle.left=buttonPositionX-12-initialWidth;}}if(Number.isNaN(menuContainerStyle.top)||Number.isNaN(menuContainerStyle.left)){menuContainerStyle.top=0;menuContainerStyle.left=0;}return _react.default.createElement(_reactNative.View,{testID:testID,__source:{fileName:_jsxFileName,lineNumber:222}},_react.default.createElement(_reactNative.View,{onLayout:this.onButtonLayout,ref:function ref(_ref){_this3.marker=_ref;},style:{alignSelf:'flex-start',width:fullWidth?'100%':'auto'},__source:{fileName:_jsxFileName,lineNumber:223}},button),_react.default.createElement(_ModalMenu.default,{onLayout:this.onModalMenuLayout,animationType:'none',visible:visible,onBackdropPress:onBackdropPress,noBackDrop:noBackDrop,transparent:true,__source:{fileName:_jsxFileName,lineNumber:234}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_Menu.default.menuContainer,menuContainerStyle,modalMenuStyle],__source:{fileName:_jsxFileName,lineNumber:241}},_react.default.createElement(_reactNative.View,{style:[_Menu.default.menu,{width:sameWidth?buttonWidth:'auto'},menuStyle],onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:244}},_react.default.createElement(_reactNative.ScrollView,{contentContainerStyle:[{paddingVertical:8},contentContainerStyle],__source:{fileName:_jsxFileName,lineNumber:251}},children)))));}}]);return Menu;}(_react.Component);(0,_defineProperty2.default)(Menu,"propTypes",{button:_propTypes.default.node,children:_propTypes.default.node,onHidden:_propTypes.default.func,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,menuStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),sameWidth:_propTypes.default.bool,onBackdropPress:_propTypes.default.func,modalMenuStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),contentContainerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),noBackDrop:_propTypes.default.bool,tooltip:_propTypes.default.bool,tooltipPosition:_propTypes.default.string,testID:_propTypes.default.string,fullWidth:_propTypes.default.bool});var _default=(0,_withTheme.default)(Menu);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Menu/ModalMenu/index.native.js b/dist/Components/Menu/ModalMenu/index.native.js index b7020649..1fd68fe1 100644 --- a/dist/Components/Menu/ModalMenu/index.native.js +++ b/dist/Components/Menu/ModalMenu/index.native.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _ModalMenuNative=_interopRequireDefault(require("./ModalMenu.native.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Menu/ModalMenu/index.native.js";var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);function Modal(){(0,_classCallCheck2.default)(this,Modal);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Modal).apply(this,arguments));}(0,_createClass2.default)(Modal,[{key:"render",value:function render(){var _this$props=this.props,onRequestClose=_this$props.onRequestClose,onShow=_this$props.onShow,onBackdropPress=_this$props.onBackdropPress,containerStyle=_this$props.containerStyle,children=_this$props.children,NativeModalProps=_this$props.NativeModalProps,visible=_this$props.visible;var deviceWidth=_reactNative.Dimensions.get('window').width;var deviceHeight=_reactNative.Dimensions.get('window').height;return _react.default.createElement(_reactNative.Modal,(0,_extends2.default)({animationType:'none',transparent:true,visible:visible,onRequestClose:onRequestClose,onShow:onShow},NativeModalProps,{__source:{fileName:_jsxFileName,lineNumber:45}}),_react.default.createElement(_reactNative.View,{style:[_ModalMenuNative.default.container,containerStyle],__source:{fileName:_jsxFileName,lineNumber:52}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:53}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:{width:deviceWidth,height:deviceHeight,position:'absolute',padding:24},__source:{fileName:_jsxFileName,lineNumber:54}})),children));}}]);return Modal;}(_react.Component);(0,_defineProperty2.default)(Modal,"propTypes",{buttons:_propTypes.default.element,visible:_propTypes.default.bool,onRequestClose:_propTypes.default.func,onShow:_propTypes.default.func,onBackdropPress:_propTypes.default.func,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),NativeModalProps:_propTypes.default.object,children:_propTypes.default.node});(0,_defineProperty2.default)(Modal,"defaultProps",{visible:false});var _default=(0,_withTheme.default)(Modal);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _ModalMenuNative=_interopRequireDefault(require("./ModalMenu.native.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Menu/ModalMenu/index.native.js";var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);function Modal(){(0,_classCallCheck2.default)(this,Modal);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Modal).apply(this,arguments));}(0,_createClass2.default)(Modal,[{key:"render",value:function render(){var _this$props=this.props,onRequestClose=_this$props.onRequestClose,onShow=_this$props.onShow,onBackdropPress=_this$props.onBackdropPress,containerStyle=_this$props.containerStyle,children=_this$props.children,NativeModalProps=_this$props.NativeModalProps,visible=_this$props.visible;var deviceWidth=_reactNative.Dimensions.get('window').width;var deviceHeight=_reactNative.Dimensions.get('window').height;return _react.default.createElement(_reactNative.Modal,(0,_extends2.default)({animationType:'none',transparent:true,visible:visible,onRequestClose:onRequestClose,onShow:onShow},NativeModalProps,{__source:{fileName:_jsxFileName,lineNumber:45}}),_react.default.createElement(_reactNative.View,{style:[_ModalMenuNative.default.container,containerStyle],__source:{fileName:_jsxFileName,lineNumber:52}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:53}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{width:deviceWidth,height:deviceHeight,position:'absolute',padding:24},__source:{fileName:_jsxFileName,lineNumber:54}})),children));}}]);return Modal;}(_react.Component);(0,_defineProperty2.default)(Modal,"propTypes",{buttons:_propTypes.default.element,visible:_propTypes.default.bool,onRequestClose:_propTypes.default.func,onShow:_propTypes.default.func,onBackdropPress:_propTypes.default.func,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),NativeModalProps:_propTypes.default.object,children:_propTypes.default.node});(0,_defineProperty2.default)(Modal,"defaultProps",{visible:false});var _default=(0,_withTheme.default)(Modal);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Menu/ModalMenu/index.web.js b/dist/Components/Menu/ModalMenu/index.web.js index 0109fc09..37a11bd1 100644 --- a/dist/Components/Menu/ModalMenu/index.web.js +++ b/dist/Components/Menu/ModalMenu/index.web.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _Portal=_interopRequireDefault(require("./Portal"));var ariaAppHider=_interopRequireWildcard(require("./ariaAppHider"));var _utils=require("./utils");var _ModalMenu=_interopRequireDefault(require("./ModalMenu.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Menu/ModalMenu/index.web.js";var ariaHiddenInstances=0;var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);(0,_createClass2.default)(Modal,null,[{key:"setAppElement",value:function setAppElement(element){ariaAppHider.setElement(element);}}]);function Modal(props){var _this;(0,_classCallCheck2.default)(this,Modal);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Modal).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animateFadeIn",function(callback){if(_this.state.animationFade){_this.state.animationFade.stop();}var animationFade=_reactNative.Animated.timing(_this.state.opacityFade,{toValue:1,duration:300});_this.setState({animationFade:animationFade},function(){requestAnimationFrame(function(){_this.setState({styleFade:{display:'flex'}},function(){return _this.state.animationFade.start(callback);});});});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animateFadeOut",function(callback){if(_this.state.animationFade){_this.state.animationFade.stop();}var animationFade=_reactNative.Animated.timing(_this.state.opacityFade,{toValue:0,duration:300});_this.setState({animationFade:animationFade},function(){requestAnimationFrame(function(){_this.state.animationFade.start(function(){_this.setState({styleFade:{display:'none'}},callback);});});});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animateSlideIn",function(callback){if(_this.state.animationSlide){_this.state.animationSlide.stop();}var animationSlide=_reactNative.Animated.timing(_this.state.slideTranslation,{toValue:1,easing:_reactNative.Easing.out(_reactNative.Easing.poly(4)),duration:300});_this.setState({animationSlide:animationSlide},function(){requestAnimationFrame(function(){_this.setState({styleFade:{display:'flex'}},function(){return _this.state.animationSlide.start(callback);});});});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animateSlideOut",function(callback){if(_this.state.animationSlide){_this.state.animationSlide.stop();}var animationSlide=_reactNative.Animated.timing(_this.state.slideTranslation,{toValue:0,easing:_reactNative.Easing.in(_reactNative.Easing.poly(4)),duration:300});_this.setState({animationSlide:animationSlide},function(){requestAnimationFrame(function(){_this.state.animationSlide.start(function(){_this.setState({styleFade:{display:'none'}},callback);});});});});_this.state={animationSlide:null,animationFade:null,styleFade:{display:props.visible?'flex':'none'},opacityFade:new _reactNative.Animated.Value(0),slideTranslation:new _reactNative.Animated.Value(0)};return _this;}(0,_createClass2.default)(Modal,[{key:"componentDidMount",value:function componentDidMount(){if(this.props.visible)this.handleShow();}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){if(prevProps.visible&&!this.props.visible)this.handleShow();if(!prevProps.visible&&this.props.visible)this.handleClose();}},{key:"handleShow",value:function handleShow(){var _this$props=this.props,animationType=_this$props.animationType,onShow=_this$props.onShow,ariaHideApp=_this$props.ariaHideApp,appElement=_this$props.appElement;if(ariaHideApp){ariaHiddenInstances+=1;ariaAppHider.hide(appElement);}if(animationType==='slide'){this.animateSlideIn(onShow);}else if(animationType==='fade'){this.animateFadeIn(onShow);}else{onShow();}}},{key:"handleClose",value:function handleClose(){var _this$props2=this.props,animationType=_this$props2.animationType,onDismiss=_this$props2.onDismiss,ariaHideApp=_this$props2.ariaHideApp,appElement=_this$props2.appElement;if(animationType==='slide'){this.animateSlideOut(onDismiss);}else if(animationType==='fade'){this.animateFadeOut(onDismiss);}else{onDismiss();}if(ariaHideApp&&ariaHiddenInstances>0){ariaHiddenInstances-=1;if(ariaHiddenInstances===0){ariaAppHider.show(appElement);}}}},{key:"getAnimationStyle",value:function getAnimationStyle(){var _this$props3=this.props,visible=_this$props3.visible,animationType=_this$props3.animationType;var styleFade=this.state.styleFade;if(animationType==='slide'){return[{transform:[{translateY:this.state.slideTranslation.interpolate({inputRange:[0,1],outputRange:[_reactNative.Dimensions.get('window').height,0],extrapolate:'clamp'})}]},styleFade];}if(animationType==='fade'){return[{opacity:this.state.opacityFade},styleFade];}return[_ModalMenu.default[visible?'visible':'hidden']];}},{key:"render",value:function render(){var _this$props4=this.props,containerStyle=_this$props4.containerStyle,onBackdropPress=_this$props4.onBackdropPress,children=_this$props4.children,visible=_this$props4.visible,onLayout=_this$props4.onLayout,noBackDrop=_this$props4.noBackDrop;return _react.default.createElement(_Portal.default,{visible:visible,__source:{fileName:_jsxFileName,lineNumber:261}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,onLayout:onLayout,"aria-modal":"true",style:[_ModalMenu.default.container,{height:'100%',width:'100%',zIndex:visible?10:-10},containerStyle],__source:{fileName:_jsxFileName,lineNumber:262}},noBackDrop?null:_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:276}},_react.default.createElement(_reactNative.View,{style:{height:visible?'100%':0,width:visible?'100%':0,position:'fixed',top:0,zIndex:visible?10:-10},__source:{fileName:_jsxFileName,lineNumber:277}})),children));}}]);return Modal;}(_react.Component);exports.default=Modal;(0,_defineProperty2.default)(Modal,"propTypes",{animationType:_propTypes.default.oneOf(['none','slide','fade']),transparent:_propTypes.default.bool,visible:_propTypes.default.bool,onRequestClose:_reactNative.Platform.isTV||_reactNative.Platform.OS==='android'?_propTypes.default.func.isRequired:_propTypes.default.func,onShow:_propTypes.default.func,onDismiss:_propTypes.default.func,children:_propTypes.default.node.isRequired,ariaHideApp:_propTypes.default.bool,appElement:_propTypes.default.instanceOf(_utils.SafeHTMLElement),containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),onBackdropPress:_propTypes.default.func,onLayout:_propTypes.default.func,noBackDrop:_propTypes.default.bool});(0,_defineProperty2.default)(Modal,"defaultProps",{animationType:'none',transparent:false,visible:true,onShow:function onShow(){},onRequestClose:function onRequestClose(){},onDismiss:function onDismiss(){},ariaHideApp:true,appElement:null}); \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _Portal=_interopRequireDefault(require("./Portal"));var ariaAppHider=_interopRequireWildcard(require("./ariaAppHider"));var _utils=require("./utils");var _ModalMenu=_interopRequireDefault(require("./ModalMenu.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Menu/ModalMenu/index.web.js";var ariaHiddenInstances=0;var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);(0,_createClass2.default)(Modal,null,[{key:"setAppElement",value:function setAppElement(element){ariaAppHider.setElement(element);}}]);function Modal(props){var _this;(0,_classCallCheck2.default)(this,Modal);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Modal).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animateFadeIn",function(callback){if(_this.state.animationFade){_this.state.animationFade.stop();}var animationFade=_reactNative.Animated.timing(_this.state.opacityFade,{toValue:1,duration:300,useNativeDriver:true});_this.setState({animationFade:animationFade},function(){requestAnimationFrame(function(){_this.setState({styleFade:{display:'flex'}},function(){return _this.state.animationFade.start(callback);});});});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animateFadeOut",function(callback){if(_this.state.animationFade){_this.state.animationFade.stop();}var animationFade=_reactNative.Animated.timing(_this.state.opacityFade,{toValue:0,duration:300,useNativeDriver:true});_this.setState({animationFade:animationFade},function(){requestAnimationFrame(function(){_this.state.animationFade.start(function(){_this.setState({styleFade:{display:'none'}},callback);});});});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animateSlideIn",function(callback){if(_this.state.animationSlide){_this.state.animationSlide.stop();}var animationSlide=_reactNative.Animated.timing(_this.state.slideTranslation,{toValue:1,easing:_reactNative.Easing.out(_reactNative.Easing.poly(4)),duration:300,useNativeDriver:true});_this.setState({animationSlide:animationSlide},function(){requestAnimationFrame(function(){_this.setState({styleFade:{display:'flex'}},function(){return _this.state.animationSlide.start(callback);});});});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animateSlideOut",function(callback){if(_this.state.animationSlide){_this.state.animationSlide.stop();}var animationSlide=_reactNative.Animated.timing(_this.state.slideTranslation,{toValue:0,easing:_reactNative.Easing.in(_reactNative.Easing.poly(4)),duration:300,useNativeDriver:true});_this.setState({animationSlide:animationSlide},function(){requestAnimationFrame(function(){_this.state.animationSlide.start(function(){_this.setState({styleFade:{display:'none'}},callback);});});});});_this.state={animationSlide:null,animationFade:null,styleFade:{display:props.visible?'flex':'none'},opacityFade:new _reactNative.Animated.Value(0),slideTranslation:new _reactNative.Animated.Value(0)};return _this;}(0,_createClass2.default)(Modal,[{key:"componentDidMount",value:function componentDidMount(){if(this.props.visible)this.handleShow();}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){if(prevProps.visible&&!this.props.visible)this.handleShow();if(!prevProps.visible&&this.props.visible)this.handleClose();}},{key:"handleShow",value:function handleShow(){var _this$props=this.props,animationType=_this$props.animationType,onShow=_this$props.onShow,ariaHideApp=_this$props.ariaHideApp,appElement=_this$props.appElement;if(ariaHideApp){ariaHiddenInstances+=1;ariaAppHider.hide(appElement);}if(animationType==='slide'){this.animateSlideIn(onShow);}else if(animationType==='fade'){this.animateFadeIn(onShow);}else{onShow();}}},{key:"handleClose",value:function handleClose(){var _this$props2=this.props,animationType=_this$props2.animationType,onDismiss=_this$props2.onDismiss,ariaHideApp=_this$props2.ariaHideApp,appElement=_this$props2.appElement;if(animationType==='slide'){this.animateSlideOut(onDismiss);}else if(animationType==='fade'){this.animateFadeOut(onDismiss);}else{onDismiss();}if(ariaHideApp&&ariaHiddenInstances>0){ariaHiddenInstances-=1;if(ariaHiddenInstances===0){ariaAppHider.show(appElement);}}}},{key:"getAnimationStyle",value:function getAnimationStyle(){var _this$props3=this.props,visible=_this$props3.visible,animationType=_this$props3.animationType;var styleFade=this.state.styleFade;if(animationType==='slide'){return[{transform:[{translateY:this.state.slideTranslation.interpolate({inputRange:[0,1],outputRange:[_reactNative.Dimensions.get('window').height,0],extrapolate:'clamp'})}]},styleFade];}if(animationType==='fade'){return[{opacity:this.state.opacityFade},styleFade];}return[_ModalMenu.default[visible?'visible':'hidden']];}},{key:"render",value:function render(){var _this$props4=this.props,containerStyle=_this$props4.containerStyle,onBackdropPress=_this$props4.onBackdropPress,children=_this$props4.children,visible=_this$props4.visible,onLayout=_this$props4.onLayout,noBackDrop=_this$props4.noBackDrop;return _react.default.createElement(_Portal.default,{visible:visible,__source:{fileName:_jsxFileName,lineNumber:265}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,onLayout:onLayout,"aria-modal":"true",style:[_ModalMenu.default.container,{height:'100%',width:'100%',zIndex:visible?10:-10},containerStyle],__source:{fileName:_jsxFileName,lineNumber:266}},noBackDrop?null:_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:280}},_react.default.createElement(_reactNative.View,{style:{height:visible?'100%':0,width:visible?'100%':0,position:'fixed',top:0,zIndex:visible?10:-10},__source:{fileName:_jsxFileName,lineNumber:281}})),children));}}]);return Modal;}(_react.Component);exports.default=Modal;(0,_defineProperty2.default)(Modal,"propTypes",{animationType:_propTypes.default.oneOf(['none','slide','fade']),transparent:_propTypes.default.bool,visible:_propTypes.default.bool,onRequestClose:_reactNative.Platform.isTV||_reactNative.Platform.OS==='android'?_propTypes.default.func.isRequired:_propTypes.default.func,onShow:_propTypes.default.func,onDismiss:_propTypes.default.func,children:_propTypes.default.node.isRequired,ariaHideApp:_propTypes.default.bool,appElement:_propTypes.default.instanceOf(_utils.SafeHTMLElement),containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),onBackdropPress:_propTypes.default.func,onLayout:_propTypes.default.func,noBackDrop:_propTypes.default.bool});(0,_defineProperty2.default)(Modal,"defaultProps",{animationType:'none',transparent:false,visible:true,onShow:function onShow(){},onRequestClose:function onRequestClose(){},onDismiss:function onDismiss(){},ariaHideApp:true,appElement:null}); \ No newline at end of file diff --git a/dist/Components/Modal/Modal.android.js b/dist/Components/Modal/Modal.android.js index e6dd3681..24cca37b 100644 --- a/dist/Components/Modal/Modal.android.js +++ b/dist/Components/Modal/Modal.android.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Modal=_interopRequireDefault(require("./Modal.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Modal/Modal.android.js";var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);function Modal(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Modal);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Modal)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{opacityAnimation:new _reactNative.Animated.Value(0),scaleAnimation:new _reactNative.Animated.Value(0.5),animationDuration:200,show:false});return _this;}(0,_createClass2.default)(Modal,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!==prevProps.visible){this.toggle();}}},{key:"toggle",value:function toggle(){var _this2=this;var _this$state=this.state,opacityAnimation=_this$state.opacityAnimation,scaleAnimation=_this$state.scaleAnimation,animationDuration=_this$state.animationDuration,show=_this$state.show;var visible=this.props.visible;var opacity=0;var scale=0;if(visible){opacity=1;scale=1;this.setState({show:!show},function(){_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration+50}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:animationDuration})]).start();});}else{_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:400})]).start(function(){_this2.setState({show:!show});});}}},{key:"render",value:function render(){var _this$props=this.props,onRequestClose=_this$props.onRequestClose,onShow=_this$props.onShow,onTouchOutside=_this$props.onTouchOutside,containerStyle=_this$props.containerStyle,children=_this$props.children,NativeModalProps=_this$props.NativeModalProps;var _this$state2=this.state,opacityAnimation=_this$state2.opacityAnimation,scaleAnimation=_this$state2.scaleAnimation,show=_this$state2.show;var deviceWidth=_reactNative.Dimensions.get('window').width;var deviceHeight=_reactNative.Dimensions.get('window').height;return _react.default.createElement(_reactNative.Modal,(0,_extends2.default)({animationType:'none',transparent:true,visible:show,onRequestClose:onRequestClose,onShow:onShow},NativeModalProps,{__source:{fileName:_jsxFileName,lineNumber:109}}),_react.default.createElement(_reactNative.View,{style:[_Modal.default.container,containerStyle],__source:{fileName:_jsxFileName,lineNumber:116}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onTouchOutside,__source:{fileName:_jsxFileName,lineNumber:117}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:{width:deviceWidth,height:deviceHeight,position:'absolute',backgroundColor:'rgba(0,0,0,.5)',padding:24,opacity:opacityAnimation},__source:{fileName:_jsxFileName,lineNumber:118}})),_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:{opacity:opacityAnimation,transform:[{scale:scaleAnimation}]},__source:{fileName:_jsxFileName,lineNumber:130}},children)));}}]);return Modal;}(_react.Component);(0,_defineProperty2.default)(Modal,"propTypes",{buttons:_propTypes.default.element,visible:_propTypes.default.bool,onRequestClose:_propTypes.default.func,onShow:_propTypes.default.func,onTouchOutside:_propTypes.default.func,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),NativeModalProps:_propTypes.default.object,children:_propTypes.default.node});(0,_defineProperty2.default)(Modal,"defaultProps",{visible:false});var _default=(0,_withTheme.default)(Modal);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Modal=_interopRequireDefault(require("./Modal.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Modal/Modal.android.js";var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);function Modal(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Modal);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Modal)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{opacityAnimation:new _reactNative.Animated.Value(0),scaleAnimation:new _reactNative.Animated.Value(0.5),animationDuration:200,show:false});return _this;}(0,_createClass2.default)(Modal,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!==prevProps.visible){this.toggle();}}},{key:"toggle",value:function toggle(){var _this2=this;var _this$state=this.state,opacityAnimation=_this$state.opacityAnimation,scaleAnimation=_this$state.scaleAnimation,animationDuration=_this$state.animationDuration,show=_this$state.show;var visible=this.props.visible;var opacity=0;var scale=0;if(visible){opacity=1;scale=1;this.setState({show:!show},function(){_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration+50,useNativeDriver:true}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:animationDuration,useNativeDriver:true})]).start();});}else{_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration,useNativeDriver:true}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:400,useNativeDriver:true})]).start(function(){_this2.setState({show:!show});});}}},{key:"render",value:function render(){var _this$props=this.props,onRequestClose=_this$props.onRequestClose,onShow=_this$props.onShow,onTouchOutside=_this$props.onTouchOutside,containerStyle=_this$props.containerStyle,children=_this$props.children,NativeModalProps=_this$props.NativeModalProps;var _this$state2=this.state,opacityAnimation=_this$state2.opacityAnimation,scaleAnimation=_this$state2.scaleAnimation,show=_this$state2.show;var deviceWidth=_reactNative.Dimensions.get('window').width;var deviceHeight=_reactNative.Dimensions.get('window').height;return _react.default.createElement(_reactNative.Modal,(0,_extends2.default)({animationType:'none',transparent:true,visible:show,onRequestClose:onRequestClose,onShow:onShow},NativeModalProps,{__source:{fileName:_jsxFileName,lineNumber:113}}),_react.default.createElement(_reactNative.View,{style:[_Modal.default.container,containerStyle],__source:{fileName:_jsxFileName,lineNumber:120}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onTouchOutside,__source:{fileName:_jsxFileName,lineNumber:121}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{width:deviceWidth,height:deviceHeight,position:'absolute',backgroundColor:'rgba(0,0,0,.5)',padding:24,opacity:opacityAnimation},__source:{fileName:_jsxFileName,lineNumber:122}})),_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{opacity:opacityAnimation,transform:[{scale:scaleAnimation}]},__source:{fileName:_jsxFileName,lineNumber:134}},children)));}}]);return Modal;}(_react.Component);(0,_defineProperty2.default)(Modal,"propTypes",{buttons:_propTypes.default.element,visible:_propTypes.default.bool,onRequestClose:_propTypes.default.func,onShow:_propTypes.default.func,onTouchOutside:_propTypes.default.func,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),NativeModalProps:_propTypes.default.object,children:_propTypes.default.node});(0,_defineProperty2.default)(Modal,"defaultProps",{visible:false});var _default=(0,_withTheme.default)(Modal);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Modal/Modal.ios.js b/dist/Components/Modal/Modal.ios.js index 937436e2..5dce194a 100644 --- a/dist/Components/Modal/Modal.ios.js +++ b/dist/Components/Modal/Modal.ios.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Modal=_interopRequireDefault(require("./Modal.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Modal/Modal.ios.js";var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);function Modal(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Modal);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Modal)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{opacityAnimation:new _reactNative.Animated.Value(0),scaleAnimation:new _reactNative.Animated.Value(0.5),animationDuration:200,show:false});return _this;}(0,_createClass2.default)(Modal,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!==prevProps.visible){this.toggle();}}},{key:"toggle",value:function toggle(){var _this2=this;var _this$state=this.state,opacityAnimation=_this$state.opacityAnimation,scaleAnimation=_this$state.scaleAnimation,animationDuration=_this$state.animationDuration,show=_this$state.show;var visible=this.props.visible;var opacity=0;var scale=0;if(visible){opacity=1;scale=1;this.setState({show:!show},function(){_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration+50}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:animationDuration})]).start();});}else{_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:400})]).start(function(){_this2.setState({show:!show});});}}},{key:"render",value:function render(){var _this$props=this.props,onRequestClose=_this$props.onRequestClose,onShow=_this$props.onShow,onTouchOutside=_this$props.onTouchOutside,containerStyle=_this$props.containerStyle,children=_this$props.children,NativeModalProps=_this$props.NativeModalProps;var _this$state2=this.state,opacityAnimation=_this$state2.opacityAnimation,scaleAnimation=_this$state2.scaleAnimation,show=_this$state2.show;var deviceWidth=_reactNative.Dimensions.get('window').width;var deviceHeight=_reactNative.Dimensions.get('window').height;return _react.default.createElement(_reactNative.Modal,(0,_extends2.default)({animationType:'none',transparent:true,visible:show,onRequestClose:onRequestClose,onShow:onShow},NativeModalProps,{__source:{fileName:_jsxFileName,lineNumber:109}}),_react.default.createElement(_reactNative.View,{style:[_Modal.default.container,containerStyle],__source:{fileName:_jsxFileName,lineNumber:116}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onTouchOutside,__source:{fileName:_jsxFileName,lineNumber:117}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:{width:deviceWidth,height:deviceHeight,position:'absolute',backgroundColor:'rgba(0,0,0,.5)',padding:24,opacity:opacityAnimation},__source:{fileName:_jsxFileName,lineNumber:118}})),_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:{opacity:opacityAnimation,transform:[{scale:scaleAnimation}]},__source:{fileName:_jsxFileName,lineNumber:130}},children)));}}]);return Modal;}(_react.Component);(0,_defineProperty2.default)(Modal,"propTypes",{buttons:_propTypes.default.element,visible:_propTypes.default.bool,onRequestClose:_propTypes.default.func,onShow:_propTypes.default.func,onTouchOutside:_propTypes.default.func,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),NativeModalProps:_propTypes.default.object,children:_propTypes.default.node});(0,_defineProperty2.default)(Modal,"defaultProps",{visible:false});var _default=(0,_withTheme.default)(Modal);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Modal=_interopRequireDefault(require("./Modal.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Modal/Modal.ios.js";var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);function Modal(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Modal);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Modal)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{opacityAnimation:new _reactNative.Animated.Value(0),scaleAnimation:new _reactNative.Animated.Value(0.5),animationDuration:200,show:false});return _this;}(0,_createClass2.default)(Modal,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!==prevProps.visible){this.toggle();}}},{key:"toggle",value:function toggle(){var _this2=this;var _this$state=this.state,opacityAnimation=_this$state.opacityAnimation,scaleAnimation=_this$state.scaleAnimation,animationDuration=_this$state.animationDuration,show=_this$state.show;var visible=this.props.visible;var opacity=0;var scale=0;if(visible){opacity=1;scale=1;this.setState({show:!show},function(){_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration+50,useNativeDriver:true}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:animationDuration,useNativeDriver:true})]).start();});}else{_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration,useNativeDriver:true}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:400,useNativeDriver:true})]).start(function(){_this2.setState({show:!show});});}}},{key:"render",value:function render(){var _this$props=this.props,onRequestClose=_this$props.onRequestClose,onShow=_this$props.onShow,onTouchOutside=_this$props.onTouchOutside,containerStyle=_this$props.containerStyle,children=_this$props.children,NativeModalProps=_this$props.NativeModalProps;var _this$state2=this.state,opacityAnimation=_this$state2.opacityAnimation,scaleAnimation=_this$state2.scaleAnimation,show=_this$state2.show;var deviceWidth=_reactNative.Dimensions.get('window').width;var deviceHeight=_reactNative.Dimensions.get('window').height;return _react.default.createElement(_reactNative.Modal,(0,_extends2.default)({animationType:'none',transparent:true,visible:show,onRequestClose:onRequestClose,onShow:onShow},NativeModalProps,{__source:{fileName:_jsxFileName,lineNumber:113}}),_react.default.createElement(_reactNative.View,{style:[_Modal.default.container,containerStyle],__source:{fileName:_jsxFileName,lineNumber:120}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onTouchOutside,__source:{fileName:_jsxFileName,lineNumber:121}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{width:deviceWidth,height:deviceHeight,position:'absolute',backgroundColor:'rgba(0,0,0,.5)',padding:24,opacity:opacityAnimation},__source:{fileName:_jsxFileName,lineNumber:122}})),_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{opacity:opacityAnimation,transform:[{scale:scaleAnimation}]},__source:{fileName:_jsxFileName,lineNumber:134}},children)));}}]);return Modal;}(_react.Component);(0,_defineProperty2.default)(Modal,"propTypes",{buttons:_propTypes.default.element,visible:_propTypes.default.bool,onRequestClose:_propTypes.default.func,onShow:_propTypes.default.func,onTouchOutside:_propTypes.default.func,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),NativeModalProps:_propTypes.default.object,children:_propTypes.default.node});(0,_defineProperty2.default)(Modal,"defaultProps",{visible:false});var _default=(0,_withTheme.default)(Modal);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Modal/Modal.web.js b/dist/Components/Modal/Modal.web.js index 1c14a09f..607edef8 100644 --- a/dist/Components/Modal/Modal.web.js +++ b/dist/Components/Modal/Modal.web.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _modalEnhancedReactNativeWeb=_interopRequireDefault(require("modal-enhanced-react-native-web"));var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Modal=_interopRequireDefault(require("./Modal.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Modal/Modal.web.js";var ImplementedModal=_reactNative.Platform.OS=='web'?_modalEnhancedReactNativeWeb.default:_reactNative.Modal;var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);function Modal(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Modal);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Modal)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{opacityAnimation:new _reactNative.Animated.Value(0),scaleAnimation:new _reactNative.Animated.Value(0.5),animationDuration:200,show:false});return _this;}(0,_createClass2.default)(Modal,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!==prevProps.visible){this.toggle();}}},{key:"toggle",value:function toggle(){var _this2=this;var _this$state=this.state,opacityAnimation=_this$state.opacityAnimation,scaleAnimation=_this$state.scaleAnimation,animationDuration=_this$state.animationDuration,show=_this$state.show;var visible=this.props.visible;var opacity=0;var scale=0;if(visible){opacity=1;scale=1;this.setState({show:!show},function(){_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration+50}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:animationDuration})]).start();});}else{_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:400})]).start(function(){_this2.setState({show:!show});});}}},{key:"render",value:function render(){var _this$props=this.props,onRequestClose=_this$props.onRequestClose,onShow=_this$props.onShow,onTouchOutside=_this$props.onTouchOutside,containerStyle=_this$props.containerStyle,children=_this$props.children,NativeModalProps=_this$props.NativeModalProps;var _this$state2=this.state,opacityAnimation=_this$state2.opacityAnimation,scaleAnimation=_this$state2.scaleAnimation,show=_this$state2.show;var deviceWidth=_reactNative.Dimensions.get('window').width;var deviceHeight=_reactNative.Dimensions.get('window').height;return _react.default.createElement(ImplementedModal,(0,_extends2.default)({animationType:'none',transparent:true,visible:show,onRequestClose:onRequestClose,onShow:onShow},NativeModalProps,{__source:{fileName:_jsxFileName,lineNumber:112}}),_react.default.createElement(_reactNative.View,{style:[_Modal.default.container,containerStyle],__source:{fileName:_jsxFileName,lineNumber:119}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onTouchOutside,__source:{fileName:_jsxFileName,lineNumber:120}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:{width:deviceWidth,height:deviceHeight,position:'absolute',backgroundColor:'rgba(0,0,0,.5)',padding:24,opacity:opacityAnimation},__source:{fileName:_jsxFileName,lineNumber:121}})),_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:{opacity:opacityAnimation,transform:[{scale:scaleAnimation}]},__source:{fileName:_jsxFileName,lineNumber:133}},children)));}}]);return Modal;}(_react.Component);(0,_defineProperty2.default)(Modal,"propTypes",{buttons:_propTypes.default.element,visible:_propTypes.default.bool,onRequestClose:_propTypes.default.func,onShow:_propTypes.default.func,onTouchOutside:_propTypes.default.func,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),NativeModalProps:_propTypes.default.object,children:_propTypes.default.node});(0,_defineProperty2.default)(Modal,"defaultProps",{visible:false});var _default=(0,_withTheme.default)(Modal);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _modalEnhancedReactNativeWeb=_interopRequireDefault(require("modal-enhanced-react-native-web"));var _propTypes=_interopRequireDefault(require("prop-types"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Modal=_interopRequireDefault(require("./Modal.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Modal/Modal.web.js";var ImplementedModal=_reactNative.Platform.OS=='web'?_modalEnhancedReactNativeWeb.default:_reactNative.Modal;var Modal=function(_Component){(0,_inherits2.default)(Modal,_Component);function Modal(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Modal);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Modal)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{opacityAnimation:new _reactNative.Animated.Value(0),scaleAnimation:new _reactNative.Animated.Value(0.5),animationDuration:200,show:false});return _this;}(0,_createClass2.default)(Modal,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!==prevProps.visible){this.toggle();}}},{key:"toggle",value:function toggle(){var _this2=this;var _this$state=this.state,opacityAnimation=_this$state.opacityAnimation,scaleAnimation=_this$state.scaleAnimation,animationDuration=_this$state.animationDuration,show=_this$state.show;var visible=this.props.visible;var opacity=0;var scale=0;if(visible){opacity=1;scale=1;this.setState({show:!show},function(){_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration+50,useNativeDriver:true}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:animationDuration,useNativeDriver:true})]).start();});}else{_reactNative.Animated.parallel([_reactNative.Animated.timing(opacityAnimation,{toValue:opacity,duration:animationDuration,useNativeDriver:true}),_reactNative.Animated.timing(scaleAnimation,{toValue:scale,duration:400,useNativeDriver:true})]).start(function(){_this2.setState({show:!show});});}}},{key:"render",value:function render(){var _this$props=this.props,onRequestClose=_this$props.onRequestClose,onShow=_this$props.onShow,onTouchOutside=_this$props.onTouchOutside,containerStyle=_this$props.containerStyle,children=_this$props.children,NativeModalProps=_this$props.NativeModalProps;var _this$state2=this.state,opacityAnimation=_this$state2.opacityAnimation,scaleAnimation=_this$state2.scaleAnimation,show=_this$state2.show;var deviceWidth=_reactNative.Dimensions.get('window').width;var deviceHeight=_reactNative.Dimensions.get('window').height;return _react.default.createElement(ImplementedModal,(0,_extends2.default)({animationType:'none',transparent:true,visible:show,onRequestClose:onRequestClose,onShow:onShow},NativeModalProps,{__source:{fileName:_jsxFileName,lineNumber:116}}),_react.default.createElement(_reactNative.View,{style:[_Modal.default.container,containerStyle],__source:{fileName:_jsxFileName,lineNumber:123}},_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onTouchOutside,__source:{fileName:_jsxFileName,lineNumber:124}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{width:deviceWidth,height:deviceHeight,position:'absolute',backgroundColor:'rgba(0,0,0,.5)',padding:24,opacity:opacityAnimation},__source:{fileName:_jsxFileName,lineNumber:125}})),_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{opacity:opacityAnimation,transform:[{scale:scaleAnimation}]},__source:{fileName:_jsxFileName,lineNumber:137}},children)));}}]);return Modal;}(_react.Component);(0,_defineProperty2.default)(Modal,"propTypes",{buttons:_propTypes.default.element,visible:_propTypes.default.bool,onRequestClose:_propTypes.default.func,onShow:_propTypes.default.func,onTouchOutside:_propTypes.default.func,containerStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),NativeModalProps:_propTypes.default.object,children:_propTypes.default.node});(0,_defineProperty2.default)(Modal,"defaultProps",{visible:false});var _default=(0,_withTheme.default)(Modal);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Paper/Paper.js b/dist/Components/Paper/Paper.js index 6d9dcf73..e6230b69 100644 --- a/dist/Components/Paper/Paper.js +++ b/dist/Components/Paper/Paper.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _index=require("../../index");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Paper/Paper.js";var Paper=function(_Component){(0,_inherits2.default)(Paper,_Component);function Paper(){(0,_classCallCheck2.default)(this,Paper);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Paper).apply(this,arguments));}(0,_createClass2.default)(Paper,[{key:"render",value:function render(){var _this$props=this.props,style=_this$props.style,theme=_this$props.theme,children=_this$props.children,userShadow=_this$props.shadow,radius=_this$props.radius,testID=_this$props.testID,props=(0,_objectWithoutProperties2.default)(_this$props,["style","theme","children","shadow","radius","testID"]);var shadows=(0,_index.shadow)(4);if(userShadow>-1&&userShadow<25){shadows=(0,_index.shadow)(userShadow);}var borderRadius=radius?radius:2;return _react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:false,style:[theme.paper,shadows,{borderRadius:borderRadius},style],testID:testID},props,{__source:{fileName:_jsxFileName,lineNumber:35}}),children);}}]);return Paper;}(_react.Component);(0,_defineProperty2.default)(Paper,"propTypes",{children:_propTypes.default.node,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,shadow:_propTypes.default.number,radius:_propTypes.default.number,testID:_propTypes.default.string});var _default=(0,_withTheme.default)(Paper);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _index=require("../../index");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Paper/Paper.js";var Paper=function(_Component){(0,_inherits2.default)(Paper,_Component);function Paper(){(0,_classCallCheck2.default)(this,Paper);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Paper).apply(this,arguments));}(0,_createClass2.default)(Paper,[{key:"render",value:function render(){var _this$props=this.props,style=_this$props.style,theme=_this$props.theme,children=_this$props.children,userShadow=_this$props.shadow,radius=_this$props.radius,testID=_this$props.testID,props=(0,_objectWithoutProperties2.default)(_this$props,["style","theme","children","shadow","radius","testID"]);var shadows=(0,_index.shadow)(4);if(userShadow>-1&&userShadow<25){shadows=(0,_index.shadow)(userShadow);}var borderRadius=radius?radius:2;return _react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true,style:[theme.paper,shadows,{borderRadius:borderRadius},style],testID:testID},props,{__source:{fileName:_jsxFileName,lineNumber:35}}),children);}}]);return Paper;}(_react.Component);(0,_defineProperty2.default)(Paper,"propTypes",{children:_propTypes.default.node,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,shadow:_propTypes.default.number,radius:_propTypes.default.number,testID:_propTypes.default.string});var _default=(0,_withTheme.default)(Paper);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Progress/ProgressBar/ProgressBar.js b/dist/Components/Progress/ProgressBar/ProgressBar.js index 83083fc9..26a51a13 100644 --- a/dist/Components/Progress/ProgressBar/ProgressBar.js +++ b/dist/Components/Progress/ProgressBar/ProgressBar.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _propTypes=_interopRequireDefault(require("prop-types"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _ProgressBar=_interopRequireDefault(require("./ProgressBar.styles"));var _color=_interopRequireDefault(require("color"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Progress/ProgressBar/ProgressBar.js";var ProgressBar=function(_PureComponent){(0,_inherits2.default)(ProgressBar,_PureComponent);function ProgressBar(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,ProgressBar);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(ProgressBar)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{indicatorPosition:new _reactNative.Animated.Value(_this.props.indicatorStartPosition),indicatorScaleX:new _reactNative.Animated.Value(1),indicatorWidth:new _reactNative.Animated.Value(0),trackScaleY:new _reactNative.Animated.Value(0),trackOpacity:new _reactNative.Animated.Value(0),trackHeight:0,trackWidth:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onTrackLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({trackWidth:width,trackHeight:height});});return _this;}(0,_createClass2.default)(ProgressBar,[{key:"componentDidMount",value:function componentDidMount(){var _this$props=this.props,visible=_this$props.visible,determinate=_this$props.determinate;if(visible){this.animateTrackHeight();}if(determinate){this.startDeterminateAnimation();}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var _this$props2=this.props,value=_this$props2.value,visible=_this$props2.visible,determinate=_this$props2.determinate;if(value!=prevProps.value&&determinate){this.startDeterminateAnimation();}if(visible&&!prevProps.visible||!visible&&prevProps.visible){this.animateTrackHeight();}}},{key:"animateTrackHeight",value:function animateTrackHeight(){var _this2=this;var _this$state=this.state,trackScaleY=_this$state.trackScaleY,trackOpacity=_this$state.trackOpacity;var _this$props3=this.props,visible=_this$props3.visible,determinate=_this$props3.determinate;var scale=visible?1:0;var opacity=visible?1:0;_reactNative.Animated.parallel([_reactNative.Animated.timing(trackScaleY,{toValue:scale,duration:300}),_reactNative.Animated.timing(trackOpacity,{toValue:opacity,duration:300})]).start(function(){if(determinate){_this2.startDeterminateAnimation();}else{_this2.startIndeterminateAnimation();}});}},{key:"startDeterminateAnimation",value:function startDeterminateAnimation(){var _this3=this;var _this$state2=this.state,indicatorWidth=_this$state2.indicatorWidth,trackWidth=_this$state2.trackWidth;var _this$props4=this.props,animationDuration=_this$props4.animationDuration,value=_this$props4.value;if(trackWidth==0){setTimeout(function(){return _this3.startDeterminateAnimation();},100);}_reactNative.Animated.parallel([_reactNative.Animated.timing(indicatorWidth,{toValue:trackWidth*(value/100),duration:animationDuration})]).start();}},{key:"startIndeterminateAnimation",value:function startIndeterminateAnimation(){var _this4=this;var _this$state3=this.state,indicatorPosition=_this$state3.indicatorPosition,indicatorScaleX=_this$state3.indicatorScaleX,trackWidth=_this$state3.trackWidth;var _this$props5=this.props,animationDuration=_this$props5.animationDuration,animationEasing=_this$props5.animationEasing;if(trackWidth==0){setTimeout(function(){return _this4.startIndeterminateAnimation();},100);}_reactNative.Animated.loop(_reactNative.Animated.parallel([_reactNative.Animated.timing(indicatorPosition,{toValue:trackWidth,duration:animationDuration,animationEasing:animationEasing}),_reactNative.Animated.timing(indicatorScaleX,{toValue:2,duration:animationDuration/4,animationEasing:animationEasing})]),{iterations:-1}).start();}},{key:"render",value:function render(){var _this$props6=this.props,height=_this$props6.height,color=_this$props6.color,trackStyle=_this$props6.trackStyle,determinate=_this$props6.determinate,theme=_this$props6.theme,testID=_this$props6.testID;var _this$state4=this.state,indicatorPosition=_this$state4.indicatorPosition,indicatorScaleX=_this$state4.indicatorScaleX,indicatorWidth=_this$state4.indicatorWidth,trackScaleY=_this$state4.trackScaleY,trackOpacity=_this$state4.trackOpacity;var trackColor=color?(0,_color.default)(color).fade(0.4).string():(0,_color.default)(theme.primary.main).fade(0.4).string();var indicatorColor=color?color:theme.primary.main;return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,onLayout:this.onTrackLayout,style:[_ProgressBar.default.track,{backgroundColor:trackColor,height:height?height:4,opacity:trackOpacity,transform:[{scaleY:trackScaleY}]},trackStyle],testID:testID,__source:{fileName:_jsxFileName,lineNumber:162}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:[_ProgressBar.default.indicator,{backgroundColor:indicatorColor,height:height?height:4,width:determinate?indicatorWidth:112,transform:[{translateX:indicatorPosition},{scaleX:indicatorScaleX}]}],__source:{fileName:_jsxFileName,lineNumber:176}}));}}]);return ProgressBar;}(_react.PureComponent);(0,_defineProperty2.default)(ProgressBar,"propTypes",{color:_propTypes.default.string,height:_propTypes.default.number,trackStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),determinate:_propTypes.default.bool,indicatorStartPosition:_propTypes.default.number,animationEasing:_propTypes.default.func,animationDuration:_propTypes.default.number,value:_propTypes.default.number,visible:_propTypes.default.bool,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,testID:_propTypes.default.string});(0,_defineProperty2.default)(ProgressBar,"defaultProps",{animationDuration:1000,indicatorStartPosition:0,animationEasing:_reactNative.Easing.bezier(0.65,0.815,0.735,0.395)});var _default=(0,_withTheme.default)(ProgressBar);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _propTypes=_interopRequireDefault(require("prop-types"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _ProgressBar=_interopRequireDefault(require("./ProgressBar.styles"));var _color=_interopRequireDefault(require("color"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Progress/ProgressBar/ProgressBar.js";var ProgressBar=function(_PureComponent){(0,_inherits2.default)(ProgressBar,_PureComponent);function ProgressBar(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,ProgressBar);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(ProgressBar)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{indicatorPosition:new _reactNative.Animated.Value(_this.props.indicatorStartPosition),indicatorScaleX:new _reactNative.Animated.Value(1),indicatorWidth:new _reactNative.Animated.Value(0),trackScaleY:new _reactNative.Animated.Value(0),trackOpacity:new _reactNative.Animated.Value(0),trackHeight:0,trackWidth:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onTrackLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({trackWidth:width,trackHeight:height});});return _this;}(0,_createClass2.default)(ProgressBar,[{key:"componentDidMount",value:function componentDidMount(){var _this$props=this.props,visible=_this$props.visible,determinate=_this$props.determinate;if(visible){this.animateTrackHeight();}if(determinate){this.startDeterminateAnimation();}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var _this$props2=this.props,value=_this$props2.value,visible=_this$props2.visible,determinate=_this$props2.determinate;if(value!=prevProps.value&&determinate){this.startDeterminateAnimation();}if(visible&&!prevProps.visible||!visible&&prevProps.visible){this.animateTrackHeight();}}},{key:"animateTrackHeight",value:function animateTrackHeight(){var _this2=this;var _this$state=this.state,trackScaleY=_this$state.trackScaleY,trackOpacity=_this$state.trackOpacity;var _this$props3=this.props,visible=_this$props3.visible,determinate=_this$props3.determinate;var scale=visible?1:0;var opacity=visible?1:0;_reactNative.Animated.parallel([_reactNative.Animated.timing(trackScaleY,{toValue:scale,duration:300}),_reactNative.Animated.timing(trackOpacity,{toValue:opacity,duration:300})]).start(function(){if(determinate){_this2.startDeterminateAnimation();}else{_this2.startIndeterminateAnimation();}});}},{key:"startDeterminateAnimation",value:function startDeterminateAnimation(){var _this3=this;var _this$state2=this.state,indicatorWidth=_this$state2.indicatorWidth,trackWidth=_this$state2.trackWidth;var _this$props4=this.props,animationDuration=_this$props4.animationDuration,value=_this$props4.value;if(trackWidth==0){setTimeout(function(){return _this3.startDeterminateAnimation();},100);}_reactNative.Animated.parallel([_reactNative.Animated.timing(indicatorWidth,{toValue:trackWidth*(value/100),duration:animationDuration})]).start();}},{key:"startIndeterminateAnimation",value:function startIndeterminateAnimation(){var _this4=this;var _this$state3=this.state,indicatorPosition=_this$state3.indicatorPosition,indicatorScaleX=_this$state3.indicatorScaleX,trackWidth=_this$state3.trackWidth;var _this$props5=this.props,animationDuration=_this$props5.animationDuration,animationEasing=_this$props5.animationEasing;if(trackWidth==0){setTimeout(function(){return _this4.startIndeterminateAnimation();},100);}_reactNative.Animated.loop(_reactNative.Animated.parallel([_reactNative.Animated.timing(indicatorPosition,{toValue:trackWidth,duration:animationDuration,animationEasing:animationEasing,useNativeDriver:true}),_reactNative.Animated.timing(indicatorScaleX,{toValue:2,duration:animationDuration/4,animationEasing:animationEasing,useNativeDriver:true})]),{iterations:-1}).start();}},{key:"render",value:function render(){var _this$props6=this.props,height=_this$props6.height,color=_this$props6.color,trackStyle=_this$props6.trackStyle,determinate=_this$props6.determinate,theme=_this$props6.theme,testID=_this$props6.testID;var _this$state4=this.state,indicatorPosition=_this$state4.indicatorPosition,indicatorScaleX=_this$state4.indicatorScaleX,indicatorWidth=_this$state4.indicatorWidth,trackScaleY=_this$state4.trackScaleY,trackOpacity=_this$state4.trackOpacity;var trackColor=color?(0,_color.default)(color).fade(0.4).string():(0,_color.default)(theme.primary.main).fade(0.4).string();var indicatorColor=color?color:theme.primary.main;return _react.default.createElement(_reactNative.Animated.View,{onLayout:this.onTrackLayout,style:[_ProgressBar.default.track,{backgroundColor:trackColor,height:height?height:4,opacity:trackOpacity,transform:[{scaleY:trackScaleY}]},trackStyle],testID:testID,__source:{fileName:_jsxFileName,lineNumber:164}},_react.default.createElement(_reactNative.Animated.View,{style:[_ProgressBar.default.indicator,{backgroundColor:indicatorColor,height:height?height:4,width:determinate?indicatorWidth:112,transform:[{translateX:indicatorPosition},{scaleX:indicatorScaleX}]}],__source:{fileName:_jsxFileName,lineNumber:177}}));}}]);return ProgressBar;}(_react.PureComponent);(0,_defineProperty2.default)(ProgressBar,"propTypes",{color:_propTypes.default.string,height:_propTypes.default.number,trackStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),determinate:_propTypes.default.bool,indicatorStartPosition:_propTypes.default.number,animationEasing:_propTypes.default.func,animationDuration:_propTypes.default.number,value:_propTypes.default.number,visible:_propTypes.default.bool,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,testID:_propTypes.default.string});(0,_defineProperty2.default)(ProgressBar,"defaultProps",{animationDuration:1000,indicatorStartPosition:0,animationEasing:_reactNative.Easing.bezier(0.65,0.815,0.735,0.395)});var _default=(0,_withTheme.default)(ProgressBar);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Progress/ProgressCircle/ProgressCircle.js b/dist/Components/Progress/ProgressCircle/ProgressCircle.js index 8e32273d..e0d01c92 100644 --- a/dist/Components/Progress/ProgressCircle/ProgressCircle.js +++ b/dist/Components/Progress/ProgressCircle/ProgressCircle.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _propTypes=_interopRequireDefault(require("prop-types"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _ProgressCircleDeterminate=_interopRequireDefault(require("./ProgressCircleDeterminate"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Progress/ProgressCircle/ProgressCircle.js";var ProgressCircle=function(_PureComponent){(0,_inherits2.default)(ProgressCircle,_PureComponent);function ProgressCircle(props){var _this;(0,_classCallCheck2.default)(this,ProgressCircle);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(ProgressCircle).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{frames:60*_this.props.animationDuration/1000,progress:new _reactNative.Animated.Value(0)});return _this;}(0,_createClass2.default)(ProgressCircle,[{key:"componentDidMount",value:function componentDidMount(){var _this$props=this.props,visible=_this$props.visible,determinate=_this$props.determinate;if(visible&&!determinate){this.startIndeterminateAnimation();}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var _this$props2=this.props,visible=_this$props2.visible,determinate=_this$props2.determinate;if(visible&&!prevProps.visible||!visible&&prevProps.visible){if(determinate)this.startIndeterminateAnimation();}}},{key:"startIndeterminateAnimation",value:function startIndeterminateAnimation(){var progress=this.state.progress;var _this$props3=this.props,animationEasing=_this$props3.animationEasing,animationDuration=_this$props3.animationDuration;_reactNative.Animated.loop(_reactNative.Animated.timing(progress,{duration:animationDuration,easing:animationEasing,toValue:1,useNativeDriver:true}),{iterations:-1}).start();}},{key:"stopAnimation",value:function stopAnimation(){this.state.progress.stopAnimation();}},{key:"getLayerStyle",value:function getLayerStyle(){var size=this.props.size;var progress=this.state.progress;var inputRange=[0,1];var outputRange=[0+30+15+'deg',2*360+30+15+'deg'];var rotate={rotate:progress.interpolate({inputRange:inputRange,outputRange:outputRange})};return{width:size,height:size,transform:[rotate]};}},{key:"getViewportStyle",value:function getViewportStyle(){var size=this.props.size;var progress=this.state.progress;var rotate={rotate:progress.interpolate({inputRange:this.getInputRange(progress),outputRange:this.getOutputRange(progress)})};return{width:size,height:size,transform:[rotate]};}},{key:"getInputRange",value:function getInputRange(){var frames=this.state.frames;var inputRange=Array.from(new Array(frames),function(undefined,frameIndex){return frameIndex/(frames-1);});return inputRange;}},{key:"getOutputRange",value:function getOutputRange(){var easing=_reactNative.Easing.bezier(0.4,0.0,0.7,1.0);var frames=this.state.frames;var outputRange=Array.from(new Array(frames),function(undefined,frameIndex){var progress=2*frameIndex/(frames-1);var rotation=-(180-15);if(progress>1.0){progress=2.0-progress;}var direction=+1;return direction*(180-30)*easing(progress)+rotation+'deg';});return outputRange;}},{key:"render",value:function render(){var _this$props4=this.props,style=_this$props4.style,size=_this$props4.size,color=_this$props4.color,determinate=_this$props4.determinate,widthOfBorder=_this$props4.widthOfBorder,testID=_this$props4.testID;var layerStyle=this.getLayerStyle();var viewportStyle=this.getViewportStyle();var containerStyle={width:size,height:size/2,overflow:'hidden'};var lineStyle={width:size,height:size,borderColor:color,borderWidth:size/widthOfBorder,borderRadius:size/2};if(determinate)return _react.default.createElement(_ProgressCircleDeterminate.default,(0,_extends2.default)({},this.props,{__source:{fileName:_jsxFileName,lineNumber:177}}));return _react.default.createElement(_reactNative.View,{style:style,testID:testID,__source:{fileName:_jsxFileName,lineNumber:180}},_react.default.createElement(_reactNative.Animated.View,{style:layerStyle,useNativeDriver:false,__source:{fileName:_jsxFileName,lineNumber:181}},_react.default.createElement(_reactNative.Animated.View,{style:containerStyle,collapsable:false,useNativeDriver:false,__source:{fileName:_jsxFileName,lineNumber:182}},_react.default.createElement(_reactNative.Animated.View,{style:viewportStyle,useNativeDriver:false,__source:{fileName:_jsxFileName,lineNumber:186}},_react.default.createElement(_reactNative.Animated.View,{style:containerStyle,collapsable:false,useNativeDriver:false,__source:{fileName:_jsxFileName,lineNumber:187}},_react.default.createElement(_reactNative.Animated.View,{style:lineStyle,useNativeDriver:false,__source:{fileName:_jsxFileName,lineNumber:191}}))))));}}]);return ProgressCircle;}(_react.PureComponent);(0,_defineProperty2.default)(ProgressCircle,"propTypes",{color:_propTypes.default.string,size:_propTypes.default.number,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),animationDuration:_propTypes.default.number,animationEasing:_propTypes.default.func,visible:_propTypes.default.bool,determinate:_propTypes.default.bool,widthOfBorder:_propTypes.default.number,testID:_propTypes.default.string});(0,_defineProperty2.default)(ProgressCircle,"defaultProps",{color:'rgb(0, 0, 0)',size:48,animationEasing:_reactNative.Easing.linear,animationDuration:2400,visible:true,determinate:false,widthOfBorder:10});var _default=(0,_withTheme.default)(ProgressCircle);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _propTypes=_interopRequireDefault(require("prop-types"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _ProgressCircleDeterminate=_interopRequireDefault(require("./ProgressCircleDeterminate"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Progress/ProgressCircle/ProgressCircle.js";var ProgressCircle=function(_PureComponent){(0,_inherits2.default)(ProgressCircle,_PureComponent);function ProgressCircle(props){var _this;(0,_classCallCheck2.default)(this,ProgressCircle);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(ProgressCircle).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{frames:60*_this.props.animationDuration/1000,progress:new _reactNative.Animated.Value(0)});return _this;}(0,_createClass2.default)(ProgressCircle,[{key:"componentDidMount",value:function componentDidMount(){var _this$props=this.props,visible=_this$props.visible,determinate=_this$props.determinate;if(visible&&!determinate){this.startIndeterminateAnimation();}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var _this$props2=this.props,visible=_this$props2.visible,determinate=_this$props2.determinate;if(visible&&!prevProps.visible||!visible&&prevProps.visible){if(determinate)this.startIndeterminateAnimation();}}},{key:"startIndeterminateAnimation",value:function startIndeterminateAnimation(){var progress=this.state.progress;var _this$props3=this.props,animationEasing=_this$props3.animationEasing,animationDuration=_this$props3.animationDuration;_reactNative.Animated.loop(_reactNative.Animated.timing(progress,{duration:animationDuration,easing:animationEasing,toValue:1,useNativeDriver:true}),{iterations:-1}).start();}},{key:"stopAnimation",value:function stopAnimation(){this.state.progress.stopAnimation();}},{key:"getLayerStyle",value:function getLayerStyle(){var size=this.props.size;var progress=this.state.progress;var inputRange=[0,1];var outputRange=[0+30+15+'deg',2*360+30+15+'deg'];var rotate={rotate:progress.interpolate({inputRange:inputRange,outputRange:outputRange})};return{width:size,height:size,transform:[rotate]};}},{key:"getViewportStyle",value:function getViewportStyle(){var size=this.props.size;var progress=this.state.progress;var rotate={rotate:progress.interpolate({inputRange:this.getInputRange(progress),outputRange:this.getOutputRange(progress)})};return{width:size,height:size,transform:[rotate]};}},{key:"getInputRange",value:function getInputRange(){var frames=this.state.frames;var inputRange=Array.from(new Array(frames),function(undefined,frameIndex){return frameIndex/(frames-1);});return inputRange;}},{key:"getOutputRange",value:function getOutputRange(){var easing=_reactNative.Easing.bezier(0.4,0.0,0.7,1.0);var frames=this.state.frames;var outputRange=Array.from(new Array(frames),function(undefined,frameIndex){var progress=2*frameIndex/(frames-1);var rotation=-(180-15);if(progress>1.0){progress=2.0-progress;}var direction=+1;return direction*(180-30)*easing(progress)+rotation+'deg';});return outputRange;}},{key:"render",value:function render(){var _this$props4=this.props,style=_this$props4.style,size=_this$props4.size,color=_this$props4.color,determinate=_this$props4.determinate,widthOfBorder=_this$props4.widthOfBorder,testID=_this$props4.testID;var layerStyle=this.getLayerStyle();var viewportStyle=this.getViewportStyle();var containerStyle={width:size,height:size/2,overflow:'hidden'};var lineStyle={width:size,height:size,borderColor:color,borderWidth:size/widthOfBorder,borderRadius:size/2};if(determinate)return _react.default.createElement(_ProgressCircleDeterminate.default,(0,_extends2.default)({},this.props,{__source:{fileName:_jsxFileName,lineNumber:177}}));return _react.default.createElement(_reactNative.View,{style:style,testID:testID,__source:{fileName:_jsxFileName,lineNumber:180}},_react.default.createElement(_reactNative.Animated.View,{style:layerStyle,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:181}},_react.default.createElement(_reactNative.Animated.View,{style:containerStyle,collapsable:false,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:182}},_react.default.createElement(_reactNative.Animated.View,{style:viewportStyle,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:186}},_react.default.createElement(_reactNative.Animated.View,{style:containerStyle,collapsable:false,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:187}},_react.default.createElement(_reactNative.Animated.View,{style:lineStyle,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:191}}))))));}}]);return ProgressCircle;}(_react.PureComponent);(0,_defineProperty2.default)(ProgressCircle,"propTypes",{color:_propTypes.default.string,size:_propTypes.default.number,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),animationDuration:_propTypes.default.number,animationEasing:_propTypes.default.func,visible:_propTypes.default.bool,determinate:_propTypes.default.bool,widthOfBorder:_propTypes.default.number,testID:_propTypes.default.string});(0,_defineProperty2.default)(ProgressCircle,"defaultProps",{color:'rgb(0, 0, 0)',size:48,animationEasing:_reactNative.Easing.linear,animationDuration:2400,visible:true,determinate:false,widthOfBorder:10});var _default=(0,_withTheme.default)(ProgressCircle);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Progress/ProgressCircle/ProgressCircleDeterminate.js b/dist/Components/Progress/ProgressCircle/ProgressCircleDeterminate.js index 9e67f941..fe8856f6 100644 --- a/dist/Components/Progress/ProgressCircle/ProgressCircleDeterminate.js +++ b/dist/Components/Progress/ProgressCircle/ProgressCircleDeterminate.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Progress/ProgressCircle/ProgressCircleDeterminate.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0&&arguments[0]!==undefined?arguments[0]:_this.props.value;_this.props.onChange();if(value.constructor.name==='AnimatedValue'){return;}if(_this.getAnimationMethod()){_this.animateChange(value);}else{_this.state.animatedValue.setValue(value);}});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animateChange",function(value){return _reactNative.Animated[_this.getAnimationMethod()](_this.state.animatedValue,_objectSpread({toValue:value/100,useNativeDriver:true},_this.props.animationConfig)).start(_this.props.onChangeAnimationEnd);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"renderHalfCircle",function(){var _ref=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{},_ref$isFlipped=_ref.isFlipped,isFlipped=_ref$isFlipped===void 0?false:_ref$isFlipped;var _this$props=_this.props,size=_this$props.size,color=_this$props.color,thickness=_this$props.thickness,value=_this$props.value;var valueToInterpolate=value.constructor.name==='AnimatedValue'?value:_this.state.animatedValue;return _react.default.createElement(_reactNative.View,{pointerEvents:"none",style:[_this.getHalfCircleContainerStyle(),{transform:[{scaleX:isFlipped?-1:1}]}],__source:{fileName:_jsxFileName,lineNumber:114}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:{width:size,height:size,transform:[{rotate:valueToInterpolate.interpolate({inputRange:isFlipped?[0,0.5]:[0.5,1],outputRange:isFlipped?['180deg','0deg']:['-180deg','0deg'],extrapolate:'clamp'})}]},__source:{fileName:_jsxFileName,lineNumber:120}},_react.default.createElement(_reactNative.View,{style:_this.getHalfCircleContainerStyle(),__source:{fileName:_jsxFileName,lineNumber:137}},_react.default.createElement(_reactNative.View,{style:[_this.getFullCircleStyle(),{borderWidth:thickness,borderColor:color}],__source:{fileName:_jsxFileName,lineNumber:138}}))));});return _this;}(0,_createClass2.default)(ProgressCircleDeterminate,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,shouldAnimateFirstValue=_this$props2.shouldAnimateFirstValue,value=_this$props2.value;if(shouldAnimateFirstValue)this.animateChange(value);}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var value=this.props.value;if(value!=prevProps.value){this.handleChange(value);}}},{key:"getFullCircleStyle",value:function getFullCircleStyle(){return{width:this.props.size,height:this.props.size,borderRadius:this.props.size/2};}},{key:"getHalfCircleContainerStyle",value:function getHalfCircleContainerStyle(){return{width:this.props.size/2,height:this.props.size,overflow:'hidden'};}},{key:"getAnimationMethod",value:function getAnimationMethod(){return this.ANIMATION_TYPES.includes(this.props.animationMethod)?this.props.animationMethod:null;}},{key:"render",value:function render(){var _this$props3=this.props,thickness=_this$props3.thickness,unfilledColor=_this$props3.unfilledColor,children=_this$props3.children,style=_this$props3.style,noTrackColor=_this$props3.noTrackColor;return _react.default.createElement(_reactNative.View,{style:[this.getFullCircleStyle(),styles.mainContainer,style],__source:{fileName:_jsxFileName,lineNumber:160}},_react.default.createElement(_reactNative.View,{pointerEvents:"box-none",style:[this.getFullCircleStyle(),{borderWidth:noTrackColor?0:thickness,borderColor:unfilledColor},styles.innerCircleContainer],__source:{fileName:_jsxFileName,lineNumber:161}},children),this.renderHalfCircle(),this.renderHalfCircle({isFlipped:true}));}}]);return ProgressCircleDeterminate;}(_react.Component);(0,_defineProperty2.default)(ProgressCircleDeterminate,"propTypes",{value:_propTypes.default.number,size:_propTypes.default.number,thickness:_propTypes.default.number,color:_propTypes.default.string,unfilledColor:_propTypes.default.string,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),children:_propTypes.default.node,animationMethod:_propTypes.default.string,animationConfig:_propTypes.default.object,shouldAnimateFirstValue:_propTypes.default.bool,onChange:_propTypes.default.func,onChangeAnimationEnd:_propTypes.default.func,noTrackColor:_propTypes.default.bool});(0,_defineProperty2.default)(ProgressCircleDeterminate,"defaultProps",{value:0,size:64,thickness:4,color:'#4c90ff',unfilledColor:'transparent',noTrackColor:true,style:{},children:null,animationMethod:null,animationConfig:{duration:200},shouldAnimateFirstValue:false,onChange:function onChange(){},onChangeAnimationEnd:function onChangeAnimationEnd(){}});var styles=_reactNative.StyleSheet.create({mainContainer:{flexDirection:'row',borderColor:'transparent',backgroundColor:'transparent'},innerCircleContainer:{position:'absolute',justifyContent:'center',alignItems:'center'}});var _default=(0,_withTheme.default)(ProgressCircleDeterminate);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Progress/ProgressCircle/ProgressCircleDeterminate.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0&&arguments[0]!==undefined?arguments[0]:_this.props.value;_this.props.onChange();if(value.constructor.name==='AnimatedValue'){return;}if(_this.getAnimationMethod()){_this.animateChange(value);}else{_this.state.animatedValue.setValue(value);}});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"animateChange",function(value){return _reactNative.Animated[_this.getAnimationMethod()](_this.state.animatedValue,_objectSpread({toValue:value/100,useNativeDriver:true},_this.props.animationConfig)).start(_this.props.onChangeAnimationEnd);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"renderHalfCircle",function(){var _ref=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{},_ref$isFlipped=_ref.isFlipped,isFlipped=_ref$isFlipped===void 0?false:_ref$isFlipped;var _this$props=_this.props,size=_this$props.size,color=_this$props.color,thickness=_this$props.thickness,value=_this$props.value;var valueToInterpolate=value.constructor.name==='AnimatedValue'?value:_this.state.animatedValue;return _react.default.createElement(_reactNative.View,{pointerEvents:"none",style:[_this.getHalfCircleContainerStyle(),{transform:[{scaleX:isFlipped?-1:1}]}],__source:{fileName:_jsxFileName,lineNumber:114}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{width:size,height:size,transform:[{rotate:valueToInterpolate.interpolate({inputRange:isFlipped?[0,0.5]:[0.5,1],outputRange:isFlipped?['180deg','0deg']:['-180deg','0deg'],extrapolate:'clamp'})}]},__source:{fileName:_jsxFileName,lineNumber:120}},_react.default.createElement(_reactNative.View,{style:_this.getHalfCircleContainerStyle(),__source:{fileName:_jsxFileName,lineNumber:137}},_react.default.createElement(_reactNative.View,{style:[_this.getFullCircleStyle(),{borderWidth:thickness,borderColor:color}],__source:{fileName:_jsxFileName,lineNumber:138}}))));});return _this;}(0,_createClass2.default)(ProgressCircleDeterminate,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,shouldAnimateFirstValue=_this$props2.shouldAnimateFirstValue,value=_this$props2.value;if(shouldAnimateFirstValue)this.animateChange(value);}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var value=this.props.value;if(value!=prevProps.value){this.handleChange(value);}}},{key:"getFullCircleStyle",value:function getFullCircleStyle(){return{width:this.props.size,height:this.props.size,borderRadius:this.props.size/2};}},{key:"getHalfCircleContainerStyle",value:function getHalfCircleContainerStyle(){return{width:this.props.size/2,height:this.props.size,overflow:'hidden'};}},{key:"getAnimationMethod",value:function getAnimationMethod(){return this.ANIMATION_TYPES.includes(this.props.animationMethod)?this.props.animationMethod:null;}},{key:"render",value:function render(){var _this$props3=this.props,thickness=_this$props3.thickness,unfilledColor=_this$props3.unfilledColor,children=_this$props3.children,style=_this$props3.style,noTrackColor=_this$props3.noTrackColor;return _react.default.createElement(_reactNative.View,{style:[this.getFullCircleStyle(),styles.mainContainer,style],__source:{fileName:_jsxFileName,lineNumber:160}},_react.default.createElement(_reactNative.View,{pointerEvents:"box-none",style:[this.getFullCircleStyle(),{borderWidth:noTrackColor?0:thickness,borderColor:unfilledColor},styles.innerCircleContainer],__source:{fileName:_jsxFileName,lineNumber:161}},children),this.renderHalfCircle(),this.renderHalfCircle({isFlipped:true}));}}]);return ProgressCircleDeterminate;}(_react.Component);(0,_defineProperty2.default)(ProgressCircleDeterminate,"propTypes",{value:_propTypes.default.number,size:_propTypes.default.number,thickness:_propTypes.default.number,color:_propTypes.default.string,unfilledColor:_propTypes.default.string,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),children:_propTypes.default.node,animationMethod:_propTypes.default.string,animationConfig:_propTypes.default.object,shouldAnimateFirstValue:_propTypes.default.bool,onChange:_propTypes.default.func,onChangeAnimationEnd:_propTypes.default.func,noTrackColor:_propTypes.default.bool});(0,_defineProperty2.default)(ProgressCircleDeterminate,"defaultProps",{value:0,size:64,thickness:4,color:'#4c90ff',unfilledColor:'transparent',noTrackColor:true,style:{},children:null,animationMethod:null,animationConfig:{duration:200},shouldAnimateFirstValue:false,onChange:function onChange(){},onChangeAnimationEnd:function onChangeAnimationEnd(){}});var styles=_reactNative.StyleSheet.create({mainContainer:{flexDirection:'row',borderColor:'transparent',backgroundColor:'transparent'},innerCircleContainer:{position:'absolute',justifyContent:'center',alignItems:'center'}});var _default=(0,_withTheme.default)(ProgressCircleDeterminate);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/RadioButton/RadioButton.js b/dist/Components/RadioButton/RadioButton.js index 63533ee3..2681e30c 100644 --- a/dist/Components/RadioButton/RadioButton.js +++ b/dist/Components/RadioButton/RadioButton.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Ripple=_interopRequireDefault(require("../Ripple/Ripple"));var _RadioButton=_interopRequireDefault(require("./RadioButton.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/RadioButton/RadioButton.js";var RadioButton=function(_Component){(0,_inherits2.default)(RadioButton,_Component);function RadioButton(){(0,_classCallCheck2.default)(this,RadioButton);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(RadioButton).apply(this,arguments));}(0,_createClass2.default)(RadioButton,[{key:"_renderLabel",value:function _renderLabel(){var _this$props=this.props,label=_this$props.label,labelStyle=_this$props.labelStyle,onPress=_this$props.onPress;if(!label)return null;return _react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:35}},_react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:36}},_react.default.createElement(_reactNative.Text,{style:[_RadioButton.default.label,labelStyle],__source:{fileName:_jsxFileName,lineNumber:37}},label)));}},{key:"render",value:function render(){var _this$props2=this.props,checked=_this$props2.checked,disabled=_this$props2.disabled,onPress=_this$props2.onPress,rippleColor=_this$props2.rippleColor,radioButtonColor=_this$props2.radioButtonColor,uncheckedBorderColor=_this$props2.uncheckedBorderColor,style=_this$props2.style,labelPos=_this$props2.labelPos,error=_this$props2.error,theme=_this$props2.theme,testID=_this$props2.testID;var rippleColorApplied=rippleColor?rippleColor:'rgba(0,0,0,.8)';var radioButtonColorApplied=radioButtonColor?radioButtonColor:'rgba(33, 150, 243, 1)';var uncheckedBorderColorApplied=uncheckedBorderColor?uncheckedBorderColor:'rgba(0,0,0,.5)';if(error){radioButtonColorApplied=theme.error.main;uncheckedBorderColorApplied=theme.error.main;}if(disabled){radioButtonColorApplied='rgba(0,0,0,.5)';}return _react.default.createElement(_reactNative.View,{style:[_RadioButton.default.container,style],testID:testID,__source:{fileName:_jsxFileName,lineNumber:75}},labelPos==='left'?this._renderLabel():null,_react.default.createElement(_Ripple.default,{rippleColor:rippleColorApplied,rippleContainerBorderRadius:18,onPress:onPress,style:[_RadioButton.default.ripple],rippleCentered:true,disabled:disabled,__source:{fileName:_jsxFileName,lineNumber:77}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:[_RadioButton.default.radio,{borderColor:checked?radioButtonColorApplied:uncheckedBorderColorApplied}],__source:{fileName:_jsxFileName,lineNumber:84}},checked?_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:[_RadioButton.default.radioDot,{backgroundColor:radioButtonColorApplied}],__source:{fileName:_jsxFileName,lineNumber:95}}):null)),labelPos==='right'?this._renderLabel():null);}}]);return RadioButton;}(_react.Component);(0,_defineProperty2.default)(RadioButton,"propTypes",{checked:_propTypes.default.bool,disabled:_propTypes.default.bool,onPress:_propTypes.default.func,rippleColor:_propTypes.default.string,radioButtonColor:_propTypes.default.string,uncheckedBorderColor:_propTypes.default.string,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),label:_propTypes.default.string,labelStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),labelPos:_propTypes.default.string,error:_propTypes.default.bool,theme:_propTypes.default.object,testID:_propTypes.default.string});(0,_defineProperty2.default)(RadioButton,"defaultProps",{labelPos:'right'});var _default=(0,_withTheme.default)(RadioButton);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Ripple=_interopRequireDefault(require("../Ripple/Ripple"));var _RadioButton=_interopRequireDefault(require("./RadioButton.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/RadioButton/RadioButton.js";var RadioButton=function(_Component){(0,_inherits2.default)(RadioButton,_Component);function RadioButton(){(0,_classCallCheck2.default)(this,RadioButton);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(RadioButton).apply(this,arguments));}(0,_createClass2.default)(RadioButton,[{key:"_renderLabel",value:function _renderLabel(){var _this$props=this.props,label=_this$props.label,labelStyle=_this$props.labelStyle,onPress=_this$props.onPress;if(!label)return null;return _react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onPress,__source:{fileName:_jsxFileName,lineNumber:35}},_react.default.createElement(_reactNative.View,{__source:{fileName:_jsxFileName,lineNumber:36}},_react.default.createElement(_reactNative.Text,{style:[_RadioButton.default.label,labelStyle],__source:{fileName:_jsxFileName,lineNumber:37}},label)));}},{key:"render",value:function render(){var _this$props2=this.props,checked=_this$props2.checked,disabled=_this$props2.disabled,onPress=_this$props2.onPress,rippleColor=_this$props2.rippleColor,radioButtonColor=_this$props2.radioButtonColor,uncheckedBorderColor=_this$props2.uncheckedBorderColor,style=_this$props2.style,labelPos=_this$props2.labelPos,error=_this$props2.error,theme=_this$props2.theme,testID=_this$props2.testID;var rippleColorApplied=rippleColor?rippleColor:'rgba(0,0,0,.8)';var radioButtonColorApplied=radioButtonColor?radioButtonColor:'rgba(33, 150, 243, 1)';var uncheckedBorderColorApplied=uncheckedBorderColor?uncheckedBorderColor:'rgba(0,0,0,.5)';if(error){radioButtonColorApplied=theme.error.main;uncheckedBorderColorApplied=theme.error.main;}if(disabled){radioButtonColorApplied='rgba(0,0,0,.5)';}return _react.default.createElement(_reactNative.View,{style:[_RadioButton.default.container,style],testID:testID,__source:{fileName:_jsxFileName,lineNumber:75}},labelPos==='left'?this._renderLabel():null,_react.default.createElement(_Ripple.default,{rippleColor:rippleColorApplied,rippleContainerBorderRadius:18,onPress:onPress,style:[_RadioButton.default.ripple],rippleCentered:true,disabled:disabled,__source:{fileName:_jsxFileName,lineNumber:77}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_RadioButton.default.radio,{borderColor:checked?radioButtonColorApplied:uncheckedBorderColorApplied}],__source:{fileName:_jsxFileName,lineNumber:84}},checked?_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_RadioButton.default.radioDot,{backgroundColor:radioButtonColorApplied}],__source:{fileName:_jsxFileName,lineNumber:95}}):null)),labelPos==='right'?this._renderLabel():null);}}]);return RadioButton;}(_react.Component);(0,_defineProperty2.default)(RadioButton,"propTypes",{checked:_propTypes.default.bool,disabled:_propTypes.default.bool,onPress:_propTypes.default.func,rippleColor:_propTypes.default.string,radioButtonColor:_propTypes.default.string,uncheckedBorderColor:_propTypes.default.string,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),label:_propTypes.default.string,labelStyle:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),labelPos:_propTypes.default.string,error:_propTypes.default.bool,theme:_propTypes.default.object,testID:_propTypes.default.string});(0,_defineProperty2.default)(RadioButton,"defaultProps",{labelPos:'right'});var _default=(0,_withTheme.default)(RadioButton);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Ripple/Ripple.js b/dist/Components/Ripple/Ripple.js index 9999e8f6..6ff19daa 100644 --- a/dist/Components/Ripple/Ripple.js +++ b/dist/Components/Ripple/Ripple.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _propTypes=_interopRequireDefault(require("prop-types"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _Ripple=_interopRequireWildcard(require("./Ripple.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Ripple/Ripple.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0?0.5*rippleSize:Math.sqrt(Math.pow(w2+offsetX,2)+Math.pow(h2+offsetY,2));var ripple={unique:this.unique++,progress:new _reactNative.Animated.Value(0),locationX:locationX,locationY:locationY,R:R};var animation=_reactNative.Animated.timing(ripple.progress,{toValue:1,easing:_reactNative.Easing.out(_reactNative.Easing.ease),duration:rippleDuration,useNativeDriver:true});onRippleAnimation(animation,this.onAnimationEnd);this.setState(function(_ref2){var ripples=_ref2.ripples;return{ripples:ripples.concat(ripple)};});}},{key:"renderRipple",value:function renderRipple(_ref3){var unique=_ref3.unique,progress=_ref3.progress,locationX=_ref3.locationX,locationY=_ref3.locationY,R=_ref3.R;var _this$props4=this.props,rippleColor=_this$props4.rippleColor,rippleOpacity=_this$props4.rippleOpacity;var rippleFades=this.rippleFades;var rippleStyle={top:locationY-_Ripple.radius,left:locationX-_Ripple.radius,backgroundColor:rippleColor,transform:[{scale:progress.interpolate({inputRange:[0,1],outputRange:[0.5/_Ripple.radius,R/_Ripple.radius]})}],opacity:rippleFades?progress.interpolate({inputRange:[0,1],outputRange:[rippleOpacity,0]}):rippleOpacity};return _react.default.createElement(_reactNative.Animated.View,{style:[_Ripple.default.ripple,rippleStyle],key:unique,useNativeDriver:false,__source:{fileName:_jsxFileName,lineNumber:251}});}},{key:"render",value:function render(){var ripples=this.state.ripples;var onPress=this.onPress,onPressIn=this.onPressIn,onPressOut=this.onPressOut,onLongPress=this.onLongPress,onLayout=this.onLayout;var _this$props5=this.props,delayLongPress=_this$props5.delayLongPress,delayPressIn=_this$props5.delayPressIn,delayPressOut=_this$props5.delayPressOut,disabled=_this$props5.disabled,hitSlop=_this$props5.hitSlop,pressRetentionOffset=_this$props5.pressRetentionOffset,children=_this$props5.children,rippleContainerBorderRadius=_this$props5.rippleContainerBorderRadius,testID=_this$props5.testID,nativeID=_this$props5.nativeID,accessible=_this$props5.accessible,accessibilityLabel=_this$props5.accessibilityLabel,panResponder=_this$props5.panResponder,props=(0,_objectWithoutProperties2.default)(_this$props5,["delayLongPress","delayPressIn","delayPressOut","disabled","hitSlop","pressRetentionOffset","children","rippleContainerBorderRadius","testID","nativeID","accessible","accessibilityLabel","panResponder"]);var touchableProps={delayLongPress:delayLongPress,delayPressIn:delayPressIn,delayPressOut:delayPressOut,disabled:disabled,hitSlop:hitSlop,pressRetentionOffset:pressRetentionOffset,onPress:onPress,onPressIn:onPressIn,testID:testID,nativeID:nativeID,accessible:accessible,accessibilityLabel:accessibilityLabel,onPressOut:onPressOut,onLongPress:props.onLongPress?onLongPress:undefined,onLayout:onLayout};var containerStyle={borderRadius:rippleContainerBorderRadius};return _react.default.createElement(_reactNative.TouchableWithoutFeedback,(0,_extends2.default)({},touchableProps,panResponder,{testID:testID,__source:{fileName:_jsxFileName,lineNumber:302}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:false},props,{__source:{fileName:_jsxFileName,lineNumber:306}}),children,_react.default.createElement(_reactNative.View,{style:[_Ripple.default.container,containerStyle],pointerEvents:"none",__source:{fileName:_jsxFileName,lineNumber:308}},ripples.map(this.renderRipple))));}}]);return Ripple;}(_react.PureComponent);exports.default=Ripple;(0,_defineProperty2.default)(Ripple,"defaultProps",_objectSpread({},_reactNative.TouchableWithoutFeedback.defaultProps,{rippleColor:'rgba(0, 0, 0, .87)',rippleOpacity:0.3,rippleDuration:400,rippleSize:0,rippleContainerBorderRadius:0,rippleCentered:false,rippleSequential:false,rippleFades:true,disabled:false,displayUntilPressOut:true,onRippleAnimation:function onRippleAnimation(animation,callback){return animation.start(callback);},testID:'mb-ripple'}));(0,_defineProperty2.default)(Ripple,"propTypes",_objectSpread({},_reactNative.Animated.View.propTypes,{},_reactNative.TouchableWithoutFeedback.propTypes,{rippleColor:_propTypes.default.string,rippleOpacity:_propTypes.default.number,rippleDuration:_propTypes.default.number,rippleSize:_propTypes.default.number,rippleContainerBorderRadius:_propTypes.default.number,rippleCentered:_propTypes.default.bool,rippleSequential:_propTypes.default.bool,rippleFades:_propTypes.default.bool,disabled:_propTypes.default.bool,displayUntilPressOut:_propTypes.default.bool,onRippleAnimation:_propTypes.default.func,testID:_propTypes.default.string})); \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutProperties2=_interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _propTypes=_interopRequireDefault(require("prop-types"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _Ripple=_interopRequireWildcard(require("./Ripple.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Ripple/Ripple.js";function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);if(enumerableOnly)symbols=symbols.filter(function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable;});keys.push.apply(keys,symbols);}return keys;}function _objectSpread(target){for(var i=1;i0?0.5*rippleSize:Math.sqrt(Math.pow(w2+offsetX,2)+Math.pow(h2+offsetY,2));var ripple={unique:this.unique++,progress:new _reactNative.Animated.Value(0),locationX:locationX,locationY:locationY,R:R};var animation=_reactNative.Animated.timing(ripple.progress,{toValue:1,easing:_reactNative.Easing.out(_reactNative.Easing.ease),duration:rippleDuration,useNativeDriver:true});onRippleAnimation(animation,this.onAnimationEnd);this.setState(function(_ref2){var ripples=_ref2.ripples;return{ripples:ripples.concat(ripple)};});}},{key:"renderRipple",value:function renderRipple(_ref3){var unique=_ref3.unique,progress=_ref3.progress,locationX=_ref3.locationX,locationY=_ref3.locationY,R=_ref3.R;var _this$props4=this.props,rippleColor=_this$props4.rippleColor,rippleOpacity=_this$props4.rippleOpacity;var rippleFades=this.rippleFades;var rippleStyle={top:locationY-_Ripple.radius,left:locationX-_Ripple.radius,backgroundColor:rippleColor,transform:[{scale:progress.interpolate({inputRange:[0,1],outputRange:[0.5/_Ripple.radius,R/_Ripple.radius]})}],opacity:rippleFades?progress.interpolate({inputRange:[0,1],outputRange:[rippleOpacity,0]}):rippleOpacity};return _react.default.createElement(_reactNative.Animated.View,{style:[_Ripple.default.ripple,rippleStyle],key:unique,useNativeDriver:true,__source:{fileName:_jsxFileName,lineNumber:251}});}},{key:"render",value:function render(){var ripples=this.state.ripples;var onPress=this.onPress,onPressIn=this.onPressIn,onPressOut=this.onPressOut,onLongPress=this.onLongPress,onLayout=this.onLayout;var _this$props5=this.props,delayLongPress=_this$props5.delayLongPress,delayPressIn=_this$props5.delayPressIn,delayPressOut=_this$props5.delayPressOut,disabled=_this$props5.disabled,hitSlop=_this$props5.hitSlop,pressRetentionOffset=_this$props5.pressRetentionOffset,children=_this$props5.children,rippleContainerBorderRadius=_this$props5.rippleContainerBorderRadius,testID=_this$props5.testID,nativeID=_this$props5.nativeID,accessible=_this$props5.accessible,accessibilityLabel=_this$props5.accessibilityLabel,panResponder=_this$props5.panResponder,props=(0,_objectWithoutProperties2.default)(_this$props5,["delayLongPress","delayPressIn","delayPressOut","disabled","hitSlop","pressRetentionOffset","children","rippleContainerBorderRadius","testID","nativeID","accessible","accessibilityLabel","panResponder"]);var touchableProps={delayLongPress:delayLongPress,delayPressIn:delayPressIn,delayPressOut:delayPressOut,disabled:disabled,hitSlop:hitSlop,pressRetentionOffset:pressRetentionOffset,onPress:onPress,onPressIn:onPressIn,testID:testID,nativeID:nativeID,accessible:accessible,accessibilityLabel:accessibilityLabel,onPressOut:onPressOut,onLongPress:props.onLongPress?onLongPress:undefined,onLayout:onLayout};var containerStyle={borderRadius:rippleContainerBorderRadius};return _react.default.createElement(_reactNative.TouchableWithoutFeedback,(0,_extends2.default)({},touchableProps,panResponder,{testID:testID,__source:{fileName:_jsxFileName,lineNumber:302}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true},props,{__source:{fileName:_jsxFileName,lineNumber:306}}),children,_react.default.createElement(_reactNative.View,{style:[_Ripple.default.container,containerStyle],pointerEvents:"none",__source:{fileName:_jsxFileName,lineNumber:308}},ripples.map(this.renderRipple))));}}]);return Ripple;}(_react.PureComponent);exports.default=Ripple;(0,_defineProperty2.default)(Ripple,"defaultProps",_objectSpread({},_reactNative.TouchableWithoutFeedback.defaultProps,{rippleColor:'rgba(0, 0, 0, .87)',rippleOpacity:0.3,rippleDuration:400,rippleSize:0,rippleContainerBorderRadius:0,rippleCentered:false,rippleSequential:false,rippleFades:true,disabled:false,displayUntilPressOut:true,onRippleAnimation:function onRippleAnimation(animation,callback){return animation.start(callback);},testID:'mb-ripple'}));(0,_defineProperty2.default)(Ripple,"propTypes",_objectSpread({},_reactNative.Animated.View.propTypes,{},_reactNative.TouchableWithoutFeedback.propTypes,{rippleColor:_propTypes.default.string,rippleOpacity:_propTypes.default.number,rippleDuration:_propTypes.default.number,rippleSize:_propTypes.default.number,rippleContainerBorderRadius:_propTypes.default.number,rippleCentered:_propTypes.default.bool,rippleSequential:_propTypes.default.bool,rippleFades:_propTypes.default.bool,disabled:_propTypes.default.bool,displayUntilPressOut:_propTypes.default.bool,onRippleAnimation:_propTypes.default.func,testID:_propTypes.default.string})); \ No newline at end of file diff --git a/dist/Components/SheetBottom/SheetBottom.native.js b/dist/Components/SheetBottom/SheetBottom.native.js index d9391f6c..e05667a4 100644 --- a/dist/Components/SheetBottom/SheetBottom.native.js +++ b/dist/Components/SheetBottom/SheetBottom.native.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetBottom=_interopRequireDefault(require("./SheetBottom.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetBottom/SheetBottom.native.js";var SheetBottom=function(_Component){(0,_inherits2.default)(SheetBottom,_Component);function SheetBottom(props){var _this;(0,_classCallCheck2.default)(this,SheetBottom);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetBottom).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _this$state=_this.state,pan=_this$state.pan,initialHeight=_this$state.initialHeight;var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;if(height==0)return;if(height<=initialHeight)return;var windowHeight=_reactNative.Dimensions.get('window').height;_this.setState({initialWidth:width,initialHeight:height,fullHeight:windowHeight},function(){pan.setValue({x:0,y:windowHeight});_this.createPanResponder();});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeDown=_this$props.onSwipeDown,onSwipeUp=_this$props.onSwipeUp,cardVerticalPadding=_this$props.cardVerticalPadding;var _this$state2=_this.state,pan=_this$state2.pan,initialHeight=_this$state2.initialHeight,fullHeight=_this$state2.fullHeight;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderMove:function onPanResponderMove(e,gestureState){if(gestureState.dy<80&&gestureState.dy>-40){_reactNative.Animated.timing(pan,{toValue:{x:0,y:fullHeight-initialHeight-cardVerticalPadding+gestureState.dy},duration:0}).start();}},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(initialHeight/4-gestureState.dy<0){if(onSwipeDown)onSwipeDown();}else if(initialHeight/4+gestureState.dy>0){if(onSwipeUp)onSwipeUp();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);_this.setState({initialHeight:0});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder();return _this;}(0,_createClass2.default)(SheetBottom,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight;var pan=this.state.pan;if(visible){this._open();}this.createPanResponder();var fullHeight=pageHeight?pageHeight:_reactNative.Dimensions.get('window').height;pan.setValue({x:0,y:fullHeight});this.setState({fullHeight:fullHeight});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,cardVerticalPadding=_this$props3.cardVerticalPadding,duration=_this$props3.duration;var _this$state3=this.state,initialHeight=_this$state3.initialHeight,fullHeight=_this$state3.fullHeight,pan=_this$state3.pan;if(visible){this.setState({internalVisible:true},function(){if(initialHeight==0){setTimeout(function(){return _this2.animateSheet(true);},100);return;}_reactNative.Animated.spring(pan,{toValue:{x:0,y:fullHeight-initialHeight-cardVerticalPadding}}).start();});}else{_reactNative.Animated.timing(pan,{toValue:{x:0,y:fullHeight},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,supportedOrientations:['portrait','landscape'],__source:{fileName:_jsxFileName,lineNumber:173}},this._renderContent());}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,cardVerticalPadding=_this$props4.cardVerticalPadding,testID=_this$props4.testID;var _this$state4=this.state,pan=_this$state4.pan,fullHeight=_this$state4.fullHeight;return _react.default.createElement(_reactNative.View,{style:[_SheetBottom.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:195}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetBottom.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:196}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:false},this.panResponder.panHandlers,{style:[_SheetBottom.default.container,style,{height:fullHeight,paddingVertical:cardVerticalPadding,transform:[{translateY:pan.y}]}],__source:{fileName:_jsxFileName,lineNumber:202}}),_react.default.createElement(_reactNative.SafeAreaView,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:215}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetBottom;}(_react.Component);(0,_defineProperty2.default)(SheetBottom,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeDown:_propTypes.default.func,onSwipeUp:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,cardVerticalPadding:_propTypes.default.number,pageHeight:_propTypes.default.number,testID:_propTypes.default.string});(0,_defineProperty2.default)(SheetBottom,"defaultProps",{duration:200,cardVerticalPadding:20});var _default=SheetBottom;exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetBottom=_interopRequireDefault(require("./SheetBottom.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetBottom/SheetBottom.native.js";var SheetBottom=function(_Component){(0,_inherits2.default)(SheetBottom,_Component);function SheetBottom(props){var _this;(0,_classCallCheck2.default)(this,SheetBottom);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetBottom).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _this$state=_this.state,pan=_this$state.pan,initialHeight=_this$state.initialHeight;var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;if(height==0)return;if(height<=initialHeight)return;var windowHeight=_reactNative.Dimensions.get('window').height;_this.setState({initialWidth:width,initialHeight:height,fullHeight:windowHeight},function(){pan.setValue({x:0,y:windowHeight});_this.createPanResponder();});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeDown=_this$props.onSwipeDown,onSwipeUp=_this$props.onSwipeUp,cardVerticalPadding=_this$props.cardVerticalPadding;var _this$state2=_this.state,pan=_this$state2.pan,initialHeight=_this$state2.initialHeight,fullHeight=_this$state2.fullHeight;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderMove:function onPanResponderMove(e,gestureState){if(gestureState.dy<80&&gestureState.dy>-40){_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:0,y:fullHeight-initialHeight-cardVerticalPadding+gestureState.dy},duration:0}).start();}},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(initialHeight/4-gestureState.dy<0){if(onSwipeDown)onSwipeDown();}else if(initialHeight/4+gestureState.dy>0){if(onSwipeUp)onSwipeUp();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);_this.setState({initialHeight:0});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder();return _this;}(0,_createClass2.default)(SheetBottom,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight;var pan=this.state.pan;if(visible){this._open();}this.createPanResponder();var fullHeight=pageHeight?pageHeight:_reactNative.Dimensions.get('window').height;pan.setValue({x:0,y:fullHeight});this.setState({fullHeight:fullHeight});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,cardVerticalPadding=_this$props3.cardVerticalPadding,duration=_this$props3.duration;var _this$state3=this.state,initialHeight=_this$state3.initialHeight,fullHeight=_this$state3.fullHeight,pan=_this$state3.pan;if(visible){this.setState({internalVisible:true},function(){if(initialHeight==0){setTimeout(function(){return _this2.animateSheet(true);},100);return;}_reactNative.Animated.spring(pan,{useNativeDriver:true,toValue:{x:0,y:fullHeight-initialHeight-cardVerticalPadding}}).start();});}else{_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:0,y:fullHeight},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,supportedOrientations:['portrait','landscape'],__source:{fileName:_jsxFileName,lineNumber:176}},this._renderContent());}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,cardVerticalPadding=_this$props4.cardVerticalPadding,testID=_this$props4.testID;var _this$state4=this.state,pan=_this$state4.pan,fullHeight=_this$state4.fullHeight;return _react.default.createElement(_reactNative.View,{style:[_SheetBottom.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:198}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetBottom.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:199}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true},this.panResponder.panHandlers,{style:[_SheetBottom.default.container,style,{height:fullHeight,paddingVertical:cardVerticalPadding,transform:[{translateY:pan.y}]}],__source:{fileName:_jsxFileName,lineNumber:205}}),_react.default.createElement(_reactNative.SafeAreaView,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:218}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetBottom;}(_react.Component);(0,_defineProperty2.default)(SheetBottom,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeDown:_propTypes.default.func,onSwipeUp:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,cardVerticalPadding:_propTypes.default.number,pageHeight:_propTypes.default.number,testID:_propTypes.default.string});(0,_defineProperty2.default)(SheetBottom,"defaultProps",{duration:200,cardVerticalPadding:20});var _default=SheetBottom;exports.default=_default; \ No newline at end of file diff --git a/dist/Components/SheetBottom/SheetBottom.web.js b/dist/Components/SheetBottom/SheetBottom.web.js index 51da710b..d1bcec19 100644 --- a/dist/Components/SheetBottom/SheetBottom.web.js +++ b/dist/Components/SheetBottom/SheetBottom.web.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetBottom=_interopRequireDefault(require("./SheetBottom.styles"));var _modalEnhancedReactNativeWeb=_interopRequireDefault(require("modal-enhanced-react-native-web"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetBottom/SheetBottom.web.js";var SheetBottom=function(_Component){(0,_inherits2.default)(SheetBottom,_Component);function SheetBottom(props){var _this;(0,_classCallCheck2.default)(this,SheetBottom);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetBottom).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _this$state=_this.state,pan=_this$state.pan,initialHeight=_this$state.initialHeight,fullHeight=_this$state.fullHeight;var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;if(height==0)return;if(height<=initialHeight)return;_this.setState({initialWidth:width,initialHeight:height},function(){pan.setValue({x:0,y:fullHeight});_this.createPanResponder(_this.props);});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeDown=_this$props.onSwipeDown,onSwipeUp=_this$props.onSwipeUp,cardVerticalPadding=_this$props.cardVerticalPadding;var _this$state2=_this.state,pan=_this$state2.pan,initialHeight=_this$state2.initialHeight,fullHeight=_this$state2.fullHeight;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderMove:function onPanResponderMove(e,gestureState){if(gestureState.dy<80&&gestureState.dy>-40){_reactNative.Animated.timing(pan,{toValue:{x:0,y:fullHeight-initialHeight-cardVerticalPadding+gestureState.dy},duration:0}).start();}},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(initialHeight/4-gestureState.dy<0){if(onSwipeDown)onSwipeDown();}else if(initialHeight/4+gestureState.dy>0){if(onSwipeUp)onSwipeUp();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder(_this.props);return _this;}(0,_createClass2.default)(SheetBottom,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight;var pan=this.state.pan;if(visible){this._open();}var fullHeight=pageHeight?pageHeight:_reactNative.Dimensions.get('window').height;this.createPanResponder(this.props);pan.setValue({x:0,y:fullHeight});this.setState({fullHeight:fullHeight});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,cardVerticalPadding=_this$props3.cardVerticalPadding,duration=_this$props3.duration;var _this$state3=this.state,initialHeight=_this$state3.initialHeight,fullHeight=_this$state3.fullHeight,pan=_this$state3.pan;if(visible){this.setState({internalVisible:true},function(){if(initialHeight==0){setTimeout(function(){return _this2.animateSheet(true);},100);return;}_reactNative.Animated.spring(pan,{toValue:{x:0,y:fullHeight-initialHeight-cardVerticalPadding}}).start();});}else{_reactNative.Animated.timing(pan,{toValue:{x:0,y:fullHeight},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;if(_reactNative.Platform.OS=='web'){return _react.default.createElement(_modalEnhancedReactNativeWeb.default,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,style:{margin:0},__source:{fileName:_jsxFileName,lineNumber:171}},this._renderContent());}else{return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,__source:{fileName:_jsxFileName,lineNumber:182}},this._renderContent());}}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,cardVerticalPadding=_this$props4.cardVerticalPadding,testID=_this$props4.testID;var _this$state4=this.state,pan=_this$state4.pan,fullHeight=_this$state4.fullHeight;return _react.default.createElement(_reactNative.View,{style:[_SheetBottom.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:204}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetBottom.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:205}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:false},this.panResponder.panHandlers,{style:[_SheetBottom.default.container,style,{position:'absolute',bottom:0,height:fullHeight,paddingVertical:cardVerticalPadding,transform:[{translateY:pan.y}]}],__source:{fileName:_jsxFileName,lineNumber:211}}),_react.default.createElement(_reactNative.View,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:226}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetBottom;}(_react.Component);(0,_defineProperty2.default)(SheetBottom,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeDown:_propTypes.default.func,onSwipeUp:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,cardVerticalPadding:_propTypes.default.number,pageHeight:_propTypes.default.number,testID:_propTypes.default.string});(0,_defineProperty2.default)(SheetBottom,"defaultProps",{duration:200,cardVerticalPadding:20});var _default=SheetBottom;exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetBottom=_interopRequireDefault(require("./SheetBottom.styles"));var _modalEnhancedReactNativeWeb=_interopRequireDefault(require("modal-enhanced-react-native-web"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetBottom/SheetBottom.web.js";var SheetBottom=function(_Component){(0,_inherits2.default)(SheetBottom,_Component);function SheetBottom(props){var _this;(0,_classCallCheck2.default)(this,SheetBottom);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetBottom).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _this$state=_this.state,pan=_this$state.pan,initialHeight=_this$state.initialHeight,fullHeight=_this$state.fullHeight;var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;if(height==0)return;if(height<=initialHeight)return;_this.setState({initialWidth:width,initialHeight:height},function(){pan.setValue({x:0,y:fullHeight});_this.createPanResponder(_this.props);});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeDown=_this$props.onSwipeDown,onSwipeUp=_this$props.onSwipeUp,cardVerticalPadding=_this$props.cardVerticalPadding;var _this$state2=_this.state,pan=_this$state2.pan,initialHeight=_this$state2.initialHeight,fullHeight=_this$state2.fullHeight;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderMove:function onPanResponderMove(e,gestureState){if(gestureState.dy<80&&gestureState.dy>-40){_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:0,y:fullHeight-initialHeight-cardVerticalPadding+gestureState.dy},duration:0}).start();}},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(initialHeight/4-gestureState.dy<0){if(onSwipeDown)onSwipeDown();}else if(initialHeight/4+gestureState.dy>0){if(onSwipeUp)onSwipeUp();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder(_this.props);return _this;}(0,_createClass2.default)(SheetBottom,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight;var pan=this.state.pan;if(visible){this._open();}var fullHeight=pageHeight?pageHeight:_reactNative.Dimensions.get('window').height;this.createPanResponder(this.props);pan.setValue({x:0,y:fullHeight});this.setState({fullHeight:fullHeight});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,cardVerticalPadding=_this$props3.cardVerticalPadding,duration=_this$props3.duration;var _this$state3=this.state,initialHeight=_this$state3.initialHeight,fullHeight=_this$state3.fullHeight,pan=_this$state3.pan;if(visible){this.setState({internalVisible:true},function(){if(initialHeight==0){setTimeout(function(){return _this2.animateSheet(true);},100);return;}_reactNative.Animated.spring(pan,{useNativeDriver:true,toValue:{x:0,y:fullHeight-initialHeight-cardVerticalPadding}}).start();});}else{_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:0,y:fullHeight},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;if(_reactNative.Platform.OS=='web'){return _react.default.createElement(_modalEnhancedReactNativeWeb.default,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,style:{margin:0},__source:{fileName:_jsxFileName,lineNumber:174}},this._renderContent());}else{return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,__source:{fileName:_jsxFileName,lineNumber:185}},this._renderContent());}}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,cardVerticalPadding=_this$props4.cardVerticalPadding,testID=_this$props4.testID;var _this$state4=this.state,pan=_this$state4.pan,fullHeight=_this$state4.fullHeight;return _react.default.createElement(_reactNative.View,{style:[_SheetBottom.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:207}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetBottom.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:208}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true},this.panResponder.panHandlers,{style:[_SheetBottom.default.container,style,{position:'absolute',bottom:0,height:fullHeight,paddingVertical:cardVerticalPadding,transform:[{translateY:pan.y}]}],__source:{fileName:_jsxFileName,lineNumber:214}}),_react.default.createElement(_reactNative.View,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:229}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetBottom;}(_react.Component);(0,_defineProperty2.default)(SheetBottom,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeDown:_propTypes.default.func,onSwipeUp:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,cardVerticalPadding:_propTypes.default.number,pageHeight:_propTypes.default.number,testID:_propTypes.default.string});(0,_defineProperty2.default)(SheetBottom,"defaultProps",{duration:200,cardVerticalPadding:20});var _default=SheetBottom;exports.default=_default; \ No newline at end of file diff --git a/dist/Components/SheetSide/SheetSide.android.js b/dist/Components/SheetSide/SheetSide.android.js index 81080360..6c0604a1 100644 --- a/dist/Components/SheetSide/SheetSide.android.js +++ b/dist/Components/SheetSide/SheetSide.android.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetSide=_interopRequireDefault(require("./SheetSide.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetSide/SheetSide.android.js";var needsSafeArea=_reactNative.Platform.OS==='ios'&&parseInt(_reactNative.Platform.Version,10);var SheetSide=function(_Component){(0,_inherits2.default)(SheetSide,_Component);function SheetSide(props){var _this;(0,_classCallCheck2.default)(this,SheetSide);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetSide).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,animatedPosition:new _reactNative.Animated.Value(0),pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0,fullWidth:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({initialWidth:width,initialHeight:height},function(){_this.createPanResponder(_this.props);});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeLeft=_this$props.onSwipeLeft,onSwipeRight=_this$props.onSwipeRight,widthPercentage=_this$props.widthPercentage,sheetWidth=_this$props.sheetWidth;var fullWidth=_this.state.fullWidth;var sheetWidthCalculated=_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(sheetWidthCalculated/4-gestureState.dy<0){if(onSwipeLeft)onSwipeLeft();}else if(sheetWidthCalculated/4+gestureState.dy>0){if(onSwipeRight)onSwipeRight();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder(_this.props);return _this;}(0,_createClass2.default)(SheetSide,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight,pageWidth=_this$props2.pageWidth,side=_this$props2.side;var pan=this.state.pan;if(visible){this._open();}this.createPanResponder(this.props);var width=_reactNative.Dimensions.get('window').width;pan.setValue({x:side=='left'?-width:width,y:0});this.setState({fullHeight:pageHeight?pageHeight:_reactNative.Dimensions.get('window').height,fullWidth:pageWidth?pageWidth:width});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,duration=_this$props3.duration,widthPercentage=_this$props3.widthPercentage,side=_this$props3.side,sheetWidth=_this$props3.sheetWidth;var _this$state=this.state,fullWidth=_this$state.fullWidth,pan=_this$state.pan;var openValue=_reactNative.Platform.OS=='web'?fullWidth-sheetWidth:fullWidth*(1-widthPercentage);var closeValue=fullWidth;if(side=='left'){openValue=0;closeValue=-closeValue;}if(visible){this.setState({internalVisible:true},function(){_reactNative.Animated.timing(pan,{toValue:{x:openValue,y:0},duration:duration}).start();});}else{_reactNative.Animated.timing(pan,{toValue:{x:closeValue,y:0},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,__source:{fileName:_jsxFileName,lineNumber:181}},this._handleSafeView());}},{key:"_handleSafeView",value:function _handleSafeView(){var fullWidth=this.state.fullWidth;if(needsSafeArea){return _react.default.createElement(_reactNative.SafeAreaView,{style:[_SheetSide.default.safeAreaView,{backgroundColor:'transparent',width:fullWidth,height:'100%'}],__source:{fileName:_jsxFileName,lineNumber:195}},this._renderContent());}else{return this._renderContent();}}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,widthPercentage=_this$props4.widthPercentage,testID=_this$props4.testID,sheetWidth=_this$props4.sheetWidth;var _this$state2=this.state,pan=_this$state2.pan,fullWidth=_this$state2.fullWidth;return _react.default.createElement(_reactNative.View,{style:[_SheetSide.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:224}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetSide.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:225}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:false},this.panResponder.panHandlers,{style:[_SheetSide.default.container,style,{height:'100%',width:_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage,transform:[{translateX:pan.x}]}],__source:{fileName:_jsxFileName,lineNumber:231}}),_react.default.createElement(_reactNative.View,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:245}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetSide;}(_react.Component);(0,_defineProperty2.default)(SheetSide,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeLeft:_propTypes.default.func,onSwipeRight:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,pageWidth:_propTypes.default.number,pageHeight:_propTypes.default.number,widthPercentage:_propTypes.default.number,side:_propTypes.default.string,testID:_propTypes.default.string,sheetWidth:_propTypes.default.number});(0,_defineProperty2.default)(SheetSide,"defaultProps",{duration:200,widthPercentage:0.8,side:'right',sheetWidth:300});var _default=SheetSide;exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetSide=_interopRequireDefault(require("./SheetSide.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetSide/SheetSide.android.js";var needsSafeArea=_reactNative.Platform.OS==='ios'&&parseInt(_reactNative.Platform.Version,10);var SheetSide=function(_Component){(0,_inherits2.default)(SheetSide,_Component);function SheetSide(props){var _this;(0,_classCallCheck2.default)(this,SheetSide);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetSide).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,animatedPosition:new _reactNative.Animated.Value(0),pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0,fullWidth:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({initialWidth:width,initialHeight:height},function(){_this.createPanResponder(_this.props);});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeLeft=_this$props.onSwipeLeft,onSwipeRight=_this$props.onSwipeRight,widthPercentage=_this$props.widthPercentage,sheetWidth=_this$props.sheetWidth;var fullWidth=_this.state.fullWidth;var sheetWidthCalculated=_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(sheetWidthCalculated/4-gestureState.dy<0){if(onSwipeLeft)onSwipeLeft();}else if(sheetWidthCalculated/4+gestureState.dy>0){if(onSwipeRight)onSwipeRight();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder(_this.props);return _this;}(0,_createClass2.default)(SheetSide,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight,pageWidth=_this$props2.pageWidth,side=_this$props2.side;var pan=this.state.pan;if(visible){this._open();}this.createPanResponder(this.props);var width=_reactNative.Dimensions.get('window').width;pan.setValue({x:side=='left'?-width:width,y:0});this.setState({fullHeight:pageHeight?pageHeight:_reactNative.Dimensions.get('window').height,fullWidth:pageWidth?pageWidth:width});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,duration=_this$props3.duration,widthPercentage=_this$props3.widthPercentage,side=_this$props3.side,sheetWidth=_this$props3.sheetWidth;var _this$state=this.state,fullWidth=_this$state.fullWidth,pan=_this$state.pan;var openValue=_reactNative.Platform.OS=='web'?fullWidth-sheetWidth:fullWidth*(1-widthPercentage);var closeValue=fullWidth;if(side=='left'){openValue=0;closeValue=-closeValue;}if(visible){this.setState({internalVisible:true},function(){_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:openValue,y:0},duration:duration}).start();});}else{_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:closeValue,y:0},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,__source:{fileName:_jsxFileName,lineNumber:183}},this._handleSafeView());}},{key:"_handleSafeView",value:function _handleSafeView(){var fullWidth=this.state.fullWidth;if(needsSafeArea){return _react.default.createElement(_reactNative.SafeAreaView,{style:[_SheetSide.default.safeAreaView,{backgroundColor:'transparent',width:fullWidth,height:'100%'}],__source:{fileName:_jsxFileName,lineNumber:197}},this._renderContent());}else{return this._renderContent();}}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,widthPercentage=_this$props4.widthPercentage,testID=_this$props4.testID,sheetWidth=_this$props4.sheetWidth;var _this$state2=this.state,pan=_this$state2.pan,fullWidth=_this$state2.fullWidth;return _react.default.createElement(_reactNative.View,{style:[_SheetSide.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:226}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetSide.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:227}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true},this.panResponder.panHandlers,{style:[_SheetSide.default.container,style,{height:'100%',width:_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage,transform:[{translateX:pan.x}]}],__source:{fileName:_jsxFileName,lineNumber:233}}),_react.default.createElement(_reactNative.View,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:247}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetSide;}(_react.Component);(0,_defineProperty2.default)(SheetSide,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeLeft:_propTypes.default.func,onSwipeRight:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,pageWidth:_propTypes.default.number,pageHeight:_propTypes.default.number,widthPercentage:_propTypes.default.number,side:_propTypes.default.string,testID:_propTypes.default.string,sheetWidth:_propTypes.default.number});(0,_defineProperty2.default)(SheetSide,"defaultProps",{duration:200,widthPercentage:0.8,side:'right',sheetWidth:300});var _default=SheetSide;exports.default=_default; \ No newline at end of file diff --git a/dist/Components/SheetSide/SheetSide.ios.js b/dist/Components/SheetSide/SheetSide.ios.js index 2d347bcc..7a5a5d0e 100644 --- a/dist/Components/SheetSide/SheetSide.ios.js +++ b/dist/Components/SheetSide/SheetSide.ios.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetSide=_interopRequireDefault(require("./SheetSide.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetSide/SheetSide.ios.js";var needsSafeArea=_reactNative.Platform.OS==='ios'&&parseInt(_reactNative.Platform.Version,10);var SheetSide=function(_Component){(0,_inherits2.default)(SheetSide,_Component);function SheetSide(props){var _this;(0,_classCallCheck2.default)(this,SheetSide);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetSide).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,animatedPosition:new _reactNative.Animated.Value(0),pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0,fullWidth:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({initialWidth:width,initialHeight:height},function(){_this.createPanResponder(_this.props);});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeLeft=_this$props.onSwipeLeft,onSwipeRight=_this$props.onSwipeRight,widthPercentage=_this$props.widthPercentage,sheetWidth=_this$props.sheetWidth;var fullWidth=_this.state.fullWidth;var sheetWidthCalculated=_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(sheetWidthCalculated/4-gestureState.dy<0){if(onSwipeLeft)onSwipeLeft();}else if(sheetWidthCalculated/4+gestureState.dy>0){if(onSwipeRight)onSwipeRight();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder(_this.props);return _this;}(0,_createClass2.default)(SheetSide,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight,pageWidth=_this$props2.pageWidth,side=_this$props2.side;var pan=this.state.pan;if(visible){this._open();}this.createPanResponder(this.props);var width=_reactNative.Dimensions.get('window').width;pan.setValue({x:side=='left'?-width:width,y:0});this.setState({fullHeight:pageHeight?pageHeight:_reactNative.Dimensions.get('window').height,fullWidth:pageWidth?pageWidth:width});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,duration=_this$props3.duration,widthPercentage=_this$props3.widthPercentage,side=_this$props3.side,sheetWidth=_this$props3.sheetWidth;var _this$state=this.state,fullWidth=_this$state.fullWidth,pan=_this$state.pan;var openValue=_reactNative.Platform.OS=='web'?fullWidth-sheetWidth:fullWidth*(1-widthPercentage);var closeValue=fullWidth;if(side=='left'){openValue=0;closeValue=-closeValue;}if(visible){this.setState({internalVisible:true},function(){_reactNative.Animated.timing(pan,{toValue:{x:openValue,y:0},duration:duration}).start();});}else{_reactNative.Animated.timing(pan,{toValue:{x:closeValue,y:0},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,__source:{fileName:_jsxFileName,lineNumber:181}},this._handleSafeView());}},{key:"_handleSafeView",value:function _handleSafeView(){var fullWidth=this.state.fullWidth;if(needsSafeArea){return _react.default.createElement(_reactNative.SafeAreaView,{style:[_SheetSide.default.safeAreaView,{backgroundColor:'transparent',width:fullWidth,height:'100%'}],__source:{fileName:_jsxFileName,lineNumber:195}},this._renderContent());}else{return this._renderContent();}}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,widthPercentage=_this$props4.widthPercentage,testID=_this$props4.testID,sheetWidth=_this$props4.sheetWidth;var _this$state2=this.state,pan=_this$state2.pan,fullWidth=_this$state2.fullWidth;return _react.default.createElement(_reactNative.View,{style:[_SheetSide.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:224}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetSide.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:225}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:false},this.panResponder.panHandlers,{style:[_SheetSide.default.container,style,{height:'100%',width:_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage,transform:[{translateX:pan.x}]}],__source:{fileName:_jsxFileName,lineNumber:231}}),_react.default.createElement(_reactNative.View,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:245}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetSide;}(_react.Component);(0,_defineProperty2.default)(SheetSide,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeLeft:_propTypes.default.func,onSwipeRight:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,pageWidth:_propTypes.default.number,pageHeight:_propTypes.default.number,widthPercentage:_propTypes.default.number,side:_propTypes.default.string,testID:_propTypes.default.string,sheetWidth:_propTypes.default.number});(0,_defineProperty2.default)(SheetSide,"defaultProps",{duration:200,widthPercentage:0.8,side:'right',sheetWidth:300});var _default=SheetSide;exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetSide=_interopRequireDefault(require("./SheetSide.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetSide/SheetSide.ios.js";var needsSafeArea=_reactNative.Platform.OS==='ios'&&parseInt(_reactNative.Platform.Version,10);var SheetSide=function(_Component){(0,_inherits2.default)(SheetSide,_Component);function SheetSide(props){var _this;(0,_classCallCheck2.default)(this,SheetSide);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetSide).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,animatedPosition:new _reactNative.Animated.Value(0),pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0,fullWidth:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({initialWidth:width,initialHeight:height},function(){_this.createPanResponder(_this.props);});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeLeft=_this$props.onSwipeLeft,onSwipeRight=_this$props.onSwipeRight,widthPercentage=_this$props.widthPercentage,sheetWidth=_this$props.sheetWidth;var fullWidth=_this.state.fullWidth;var sheetWidthCalculated=_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(sheetWidthCalculated/4-gestureState.dy<0){if(onSwipeLeft)onSwipeLeft();}else if(sheetWidthCalculated/4+gestureState.dy>0){if(onSwipeRight)onSwipeRight();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder(_this.props);return _this;}(0,_createClass2.default)(SheetSide,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight,pageWidth=_this$props2.pageWidth,side=_this$props2.side;var pan=this.state.pan;if(visible){this._open();}this.createPanResponder(this.props);var width=_reactNative.Dimensions.get('window').width;pan.setValue({x:side=='left'?-width:width,y:0});this.setState({fullHeight:pageHeight?pageHeight:_reactNative.Dimensions.get('window').height,fullWidth:pageWidth?pageWidth:width});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,duration=_this$props3.duration,widthPercentage=_this$props3.widthPercentage,side=_this$props3.side,sheetWidth=_this$props3.sheetWidth;var _this$state=this.state,fullWidth=_this$state.fullWidth,pan=_this$state.pan;var openValue=_reactNative.Platform.OS=='web'?fullWidth-sheetWidth:fullWidth*(1-widthPercentage);var closeValue=fullWidth;if(side=='left'){openValue=0;closeValue=-closeValue;}if(visible){this.setState({internalVisible:true},function(){_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:openValue,y:0},duration:duration}).start();});}else{_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:closeValue,y:0},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,__source:{fileName:_jsxFileName,lineNumber:183}},this._handleSafeView());}},{key:"_handleSafeView",value:function _handleSafeView(){var fullWidth=this.state.fullWidth;if(needsSafeArea){return _react.default.createElement(_reactNative.SafeAreaView,{style:[_SheetSide.default.safeAreaView,{backgroundColor:'transparent',width:fullWidth,height:'100%'}],__source:{fileName:_jsxFileName,lineNumber:197}},this._renderContent());}else{return this._renderContent();}}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,widthPercentage=_this$props4.widthPercentage,testID=_this$props4.testID,sheetWidth=_this$props4.sheetWidth;var _this$state2=this.state,pan=_this$state2.pan,fullWidth=_this$state2.fullWidth;return _react.default.createElement(_reactNative.View,{style:[_SheetSide.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:226}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetSide.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:227}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true},this.panResponder.panHandlers,{style:[_SheetSide.default.container,style,{height:'100%',width:_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage,transform:[{translateX:pan.x}]}],__source:{fileName:_jsxFileName,lineNumber:233}}),_react.default.createElement(_reactNative.View,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:247}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetSide;}(_react.Component);(0,_defineProperty2.default)(SheetSide,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeLeft:_propTypes.default.func,onSwipeRight:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,pageWidth:_propTypes.default.number,pageHeight:_propTypes.default.number,widthPercentage:_propTypes.default.number,side:_propTypes.default.string,testID:_propTypes.default.string,sheetWidth:_propTypes.default.number});(0,_defineProperty2.default)(SheetSide,"defaultProps",{duration:200,widthPercentage:0.8,side:'right',sheetWidth:300});var _default=SheetSide;exports.default=_default; \ No newline at end of file diff --git a/dist/Components/SheetSide/SheetSide.web.js b/dist/Components/SheetSide/SheetSide.web.js index 9aa579ce..97c66ad8 100644 --- a/dist/Components/SheetSide/SheetSide.web.js +++ b/dist/Components/SheetSide/SheetSide.web.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetSide=_interopRequireDefault(require("./SheetSide.styles"));var _modalEnhancedReactNativeWeb=_interopRequireDefault(require("modal-enhanced-react-native-web"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetSide/SheetSide.web.js";var needsSafeArea=_reactNative.Platform.OS==='ios'&&parseInt(_reactNative.Platform.Version,10);var SheetSide=function(_Component){(0,_inherits2.default)(SheetSide,_Component);function SheetSide(props){var _this;(0,_classCallCheck2.default)(this,SheetSide);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetSide).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,animatedPosition:new _reactNative.Animated.Value(0),pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0,fullWidth:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({initialWidth:width,initialHeight:height},function(){_this.createPanResponder(_this.props);});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeLeft=_this$props.onSwipeLeft,onSwipeRight=_this$props.onSwipeRight,widthPercentage=_this$props.widthPercentage,sheetWidth=_this$props.sheetWidth;var fullWidth=_this.state.fullWidth;var sheetWidthCalculated=_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(sheetWidthCalculated/4-gestureState.dy<0){if(onSwipeLeft)onSwipeLeft();}else if(sheetWidthCalculated/4+gestureState.dy>0){if(onSwipeRight)onSwipeRight();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder(_this.props);return _this;}(0,_createClass2.default)(SheetSide,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight,pageWidth=_this$props2.pageWidth,side=_this$props2.side;var pan=this.state.pan;if(visible){this._open();}this.createPanResponder(this.props);var width=_reactNative.Dimensions.get('window').width;pan.setValue({x:side=='left'?-width:width,y:0});this.setState({fullHeight:pageHeight?pageHeight:_reactNative.Dimensions.get('window').height,fullWidth:pageWidth?pageWidth:width});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,duration=_this$props3.duration,side=_this$props3.side;var _this$state=this.state,fullWidth=_this$state.fullWidth,pan=_this$state.pan;var openValue=0;var closeValue=fullWidth;if(side=='left'){openValue=0;closeValue=-closeValue;}if(visible){this.setState({internalVisible:true},function(){_reactNative.Animated.timing(pan,{toValue:{x:openValue,y:0},duration:duration}).start();});}else{_reactNative.Animated.timing(pan,{toValue:{x:closeValue,y:0},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;if(_reactNative.Platform.OS=='web'){return _react.default.createElement(_modalEnhancedReactNativeWeb.default,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,style:{margin:0},__source:{fileName:_jsxFileName,lineNumber:179}},this._handleSafeView());}else{return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,__source:{fileName:_jsxFileName,lineNumber:190}},this._handleSafeView());}}},{key:"_handleSafeView",value:function _handleSafeView(){var fullWidth=this.state.fullWidth;if(needsSafeArea){return _react.default.createElement(_reactNative.SafeAreaView,{style:[_SheetSide.default.safeAreaView,{backgroundColor:'transparent',width:fullWidth,height:'100%'}],__source:{fileName:_jsxFileName,lineNumber:205}},this._renderContent());}else{return this._renderContent();}}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,widthPercentage=_this$props4.widthPercentage,testID=_this$props4.testID,sheetWidth=_this$props4.sheetWidth,side=_this$props4.side;var _this$state2=this.state,pan=_this$state2.pan,fullWidth=_this$state2.fullWidth;return _react.default.createElement(_reactNative.View,{style:[_SheetSide.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:235}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetSide.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:236}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:false},this.panResponder.panHandlers,{style:[_SheetSide.default.container,style,{height:'100%',position:'absolute',right:side=='right'?0:'auto',width:_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage,transform:[{translateX:pan.x}]}],__source:{fileName:_jsxFileName,lineNumber:242}}),_react.default.createElement(_reactNative.View,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:258}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetSide;}(_react.Component);(0,_defineProperty2.default)(SheetSide,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeLeft:_propTypes.default.func,onSwipeRight:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,pageWidth:_propTypes.default.number,pageHeight:_propTypes.default.number,widthPercentage:_propTypes.default.number,side:_propTypes.default.string,testID:_propTypes.default.string,sheetWidth:_propTypes.default.number});(0,_defineProperty2.default)(SheetSide,"defaultProps",{duration:200,widthPercentage:0.8,side:'right',sheetWidth:300});var _default=SheetSide;exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SheetSide=_interopRequireDefault(require("./SheetSide.styles"));var _modalEnhancedReactNativeWeb=_interopRequireDefault(require("modal-enhanced-react-native-web"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SheetSide/SheetSide.web.js";var needsSafeArea=_reactNative.Platform.OS==='ios'&&parseInt(_reactNative.Platform.Version,10);var SheetSide=function(_Component){(0,_inherits2.default)(SheetSide,_Component);function SheetSide(props){var _this;(0,_classCallCheck2.default)(this,SheetSide);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(SheetSide).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{internalVisible:false,animatedPosition:new _reactNative.Animated.Value(0),pan:new _reactNative.Animated.ValueXY(),initialHeight:0,initialWidth:0,fullHeight:0,fullWidth:0});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onMenuLayout",function(e){var _e$nativeEvent$layout=e.nativeEvent.layout,width=_e$nativeEvent$layout.width,height=_e$nativeEvent$layout.height;_this.setState({initialWidth:width,initialHeight:height},function(){_this.createPanResponder(_this.props);});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"createPanResponder",function(){var _this$props=_this.props,onSwipeLeft=_this$props.onSwipeLeft,onSwipeRight=_this$props.onSwipeRight,widthPercentage=_this$props.widthPercentage,sheetWidth=_this$props.sheetWidth;var fullWidth=_this.state.fullWidth;var sheetWidthCalculated=_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage;_this.panResponder=_reactNative.PanResponder.create({onStartShouldSetPanResponder:function onStartShouldSetPanResponder(){return true;},onPanResponderRelease:function onPanResponderRelease(e,gestureState){if(sheetWidthCalculated/4-gestureState.dy<0){if(onSwipeLeft)onSwipeLeft();}else if(sheetWidthCalculated/4+gestureState.dy>0){if(onSwipeRight)onSwipeRight();}}});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_close",function(){_this.animateSheet(false);});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"_onBackdropPress",function(){var onBackdropPress=_this.props.onBackdropPress;if(onBackdropPress)onBackdropPress();});_this.createPanResponder(_this.props);return _this;}(0,_createClass2.default)(SheetSide,[{key:"componentDidMount",value:function componentDidMount(){var _this$props2=this.props,visible=_this$props2.visible,pageHeight=_this$props2.pageHeight,pageWidth=_this$props2.pageWidth,side=_this$props2.side;var pan=this.state.pan;if(visible){this._open();}this.createPanResponder(this.props);var width=_reactNative.Dimensions.get('window').width;pan.setValue({x:side=='left'?-width:width,y:0});this.setState({fullHeight:pageHeight?pageHeight:_reactNative.Dimensions.get('window').height,fullWidth:pageWidth?pageWidth:width});}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible!=prevProps.visible){if(visible){this._open();}else{this._close();}}}},{key:"animateSheet",value:function animateSheet(visible){var _this2=this;var _this$props3=this.props,duration=_this$props3.duration,side=_this$props3.side;var _this$state=this.state,fullWidth=_this$state.fullWidth,pan=_this$state.pan;var openValue=0;var closeValue=fullWidth;if(side=='left'){openValue=0;closeValue=-closeValue;}if(visible){this.setState({internalVisible:true},function(){_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:openValue,y:0},duration:duration}).start();});}else{_reactNative.Animated.timing(pan,{useNativeDriver:true,toValue:{x:closeValue,y:0},duration:duration}).start(function(){_this2.setState({internalVisible:false});});}}},{key:"_open",value:function _open(){this.animateSheet(true);}},{key:"_handlePlatform",value:function _handlePlatform(){var internalVisible=this.state.internalVisible;if(_reactNative.Platform.OS=='web'){return _react.default.createElement(_modalEnhancedReactNativeWeb.default,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,style:{margin:0},__source:{fileName:_jsxFileName,lineNumber:181}},this._handleSafeView());}else{return _react.default.createElement(_reactNative.Modal,{transparent:true,animationType:'none',visible:internalVisible,onRequestClose:this._close,__source:{fileName:_jsxFileName,lineNumber:192}},this._handleSafeView());}}},{key:"_handleSafeView",value:function _handleSafeView(){var fullWidth=this.state.fullWidth;if(needsSafeArea){return _react.default.createElement(_reactNative.SafeAreaView,{style:[_SheetSide.default.safeAreaView,{backgroundColor:'transparent',width:fullWidth,height:'100%'}],__source:{fileName:_jsxFileName,lineNumber:207}},this._renderContent());}else{return this._renderContent();}}},{key:"_renderContent",value:function _renderContent(){var _this$props4=this.props,children=_this$props4.children,wrapperStyles=_this$props4.wrapperStyles,style=_this$props4.style,widthPercentage=_this$props4.widthPercentage,testID=_this$props4.testID,sheetWidth=_this$props4.sheetWidth,side=_this$props4.side;var _this$state2=this.state,pan=_this$state2.pan,fullWidth=_this$state2.fullWidth;return _react.default.createElement(_reactNative.View,{style:[_SheetSide.default.wrapper,wrapperStyles],testID:testID,__source:{fileName:_jsxFileName,lineNumber:237}},_react.default.createElement(_reactNative.TouchableOpacity,{style:_SheetSide.default.mask,activeOpacity:1,onPress:this._onBackdropPress,__source:{fileName:_jsxFileName,lineNumber:238}}),_react.default.createElement(_reactNative.Animated.View,(0,_extends2.default)({useNativeDriver:true},this.panResponder.panHandlers,{style:[_SheetSide.default.container,style,{height:'100%',position:'absolute',right:side=='right'?0:'auto',width:_reactNative.Platform.OS=='web'?sheetWidth:fullWidth*widthPercentage,transform:[{translateX:pan.x}]}],__source:{fileName:_jsxFileName,lineNumber:244}}),_react.default.createElement(_reactNative.View,{onLayout:this.onMenuLayout,__source:{fileName:_jsxFileName,lineNumber:260}},children)));}},{key:"render",value:function render(){return this._handlePlatform();}}]);return SheetSide;}(_react.Component);(0,_defineProperty2.default)(SheetSide,"propTypes",{duration:_propTypes.default.number,onBackdropPress:_propTypes.default.func,onSwipeLeft:_propTypes.default.func,onSwipeRight:_propTypes.default.func,children:_propTypes.default.node,wrapperStyles:_propTypes.default.object,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),visible:_propTypes.default.bool,pageWidth:_propTypes.default.number,pageHeight:_propTypes.default.number,widthPercentage:_propTypes.default.number,side:_propTypes.default.string,testID:_propTypes.default.string,sheetWidth:_propTypes.default.number});(0,_defineProperty2.default)(SheetSide,"defaultProps",{duration:200,widthPercentage:0.8,side:'right',sheetWidth:300});var _default=SheetSide;exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Snackbar/Snackbar.js b/dist/Components/Snackbar/Snackbar.js index ec6ae91d..dc740812 100644 --- a/dist/Components/Snackbar/Snackbar.js +++ b/dist/Components/Snackbar/Snackbar.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _Paper=_interopRequireDefault(require("../Paper/Paper"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Snackbar=_interopRequireDefault(require("./Snackbar.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Snackbar/Snackbar.js";var Snackbar=function(_Component){(0,_inherits2.default)(Snackbar,_Component);function Snackbar(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Snackbar);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Snackbar)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{scaleAnimation:new _reactNative.Animated.Value(0.8),opacity:new _reactNative.Animated.Value(0)});return _this;}(0,_createClass2.default)(Snackbar,[{key:"componentDidMount",value:function componentDidMount(){var visible=this.props.visible;if(visible)this.show();}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible&&!prevProps.visible){this.show();}else if(!visible&&prevProps.visible){this.hide();}}},{key:"show",value:function show(){var _this$state=this.state,opacity=_this$state.opacity,scaleAnimation=_this$state.scaleAnimation;var animationDuration=this.props.animationDuration;this.setState({show:false});_reactNative.Animated.parallel([_reactNative.Animated.timing(scaleAnimation,{toValue:1,duration:animationDuration}),_reactNative.Animated.timing(opacity,{toValue:1,duration:animationDuration})]).start();}},{key:"hide",value:function hide(){var _this$state2=this.state,opacity=_this$state2.opacity,scaleAnimation=_this$state2.scaleAnimation;var animationDuration=this.props.animationDuration;_reactNative.Animated.parallel([_reactNative.Animated.timing(scaleAnimation,{toValue:0.8,duration:animationDuration}),_reactNative.Animated.timing(opacity,{toValue:0,duration:animationDuration})]).start();}},{key:"_renderAction",value:function _renderAction(){var action=this.props.action;if(!action)return null;return _react.default.createElement(_reactNative.View,{style:_Snackbar.default.actions,__source:{fileName:_jsxFileName,lineNumber:84}},action);}},{key:"render",value:function render(){var _this$props=this.props,children=_this$props.children,style=_this$props.style,visible=_this$props.visible,testID=_this$props.testID,action=_this$props.action;var _this$state3=this.state,opacity=_this$state3.opacity,scaleAnimation=_this$state3.scaleAnimation;return _react.default.createElement(_reactNative.View,{style:[_Snackbar.default.container,{zIndex:visible?10:-1}],testID:testID,__source:{fileName:_jsxFileName,lineNumber:92}},_react.default.createElement(_Paper.default,{style:[_Snackbar.default.card,{opacity:opacity,transform:[{scale:scaleAnimation}]},style],__source:{fileName:_jsxFileName,lineNumber:95}},_react.default.createElement(_reactNative.Text,{style:[_Snackbar.default.text,{marginRight:action?0:8}],__source:{fileName:_jsxFileName,lineNumber:108}},children),this._renderAction()));}}]);return Snackbar;}(_react.Component);(0,_defineProperty2.default)(Snackbar,"propTypes",{visible:_propTypes.default.bool,animationDuration:_propTypes.default.number,children:_propTypes.default.node,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),action:_propTypes.default.node,testID:_propTypes.default.string});(0,_defineProperty2.default)(Snackbar,"defaultProps",{animationDuration:200});var _default=(0,_withTheme.default)(Snackbar);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _Paper=_interopRequireDefault(require("../Paper/Paper"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Snackbar=_interopRequireDefault(require("./Snackbar.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Snackbar/Snackbar.js";var Snackbar=function(_Component){(0,_inherits2.default)(Snackbar,_Component);function Snackbar(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Snackbar);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Snackbar)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{scaleAnimation:new _reactNative.Animated.Value(0.8),opacity:new _reactNative.Animated.Value(0)});return _this;}(0,_createClass2.default)(Snackbar,[{key:"componentDidMount",value:function componentDidMount(){var visible=this.props.visible;if(visible)this.show();}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var visible=this.props.visible;if(visible&&!prevProps.visible){this.show();}else if(!visible&&prevProps.visible){this.hide();}}},{key:"show",value:function show(){var _this$state=this.state,opacity=_this$state.opacity,scaleAnimation=_this$state.scaleAnimation;var animationDuration=this.props.animationDuration;this.setState({show:false});_reactNative.Animated.parallel([_reactNative.Animated.timing(scaleAnimation,{toValue:1,duration:animationDuration,useNativeDriver:true}),_reactNative.Animated.timing(opacity,{toValue:1,duration:animationDuration,useNativeDriver:true})]).start();}},{key:"hide",value:function hide(){var _this$state2=this.state,opacity=_this$state2.opacity,scaleAnimation=_this$state2.scaleAnimation;var animationDuration=this.props.animationDuration;_reactNative.Animated.parallel([_reactNative.Animated.timing(scaleAnimation,{toValue:0.8,duration:animationDuration,useNativeDriver:true}),_reactNative.Animated.timing(opacity,{toValue:0,duration:animationDuration,useNativeDriver:true})]).start();}},{key:"_renderAction",value:function _renderAction(){var action=this.props.action;if(!action)return null;return _react.default.createElement(_reactNative.View,{style:_Snackbar.default.actions,__source:{fileName:_jsxFileName,lineNumber:88}},action);}},{key:"render",value:function render(){var _this$props=this.props,children=_this$props.children,style=_this$props.style,visible=_this$props.visible,testID=_this$props.testID,action=_this$props.action;var _this$state3=this.state,opacity=_this$state3.opacity,scaleAnimation=_this$state3.scaleAnimation;return _react.default.createElement(_reactNative.View,{style:[_Snackbar.default.container,{zIndex:visible?10:-1}],testID:testID,__source:{fileName:_jsxFileName,lineNumber:96}},_react.default.createElement(_Paper.default,{style:[_Snackbar.default.card,{opacity:opacity,transform:[{scale:scaleAnimation}]},style],__source:{fileName:_jsxFileName,lineNumber:99}},_react.default.createElement(_reactNative.Text,{style:[_Snackbar.default.text,{marginRight:action?0:8}],__source:{fileName:_jsxFileName,lineNumber:112}},children),this._renderAction()));}}]);return Snackbar;}(_react.Component);(0,_defineProperty2.default)(Snackbar,"propTypes",{visible:_propTypes.default.bool,animationDuration:_propTypes.default.number,children:_propTypes.default.node,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),action:_propTypes.default.node,testID:_propTypes.default.string});(0,_defineProperty2.default)(Snackbar,"defaultProps",{animationDuration:200});var _default=(0,_withTheme.default)(Snackbar);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/SwipeNav/SwipeNav.js b/dist/Components/SwipeNav/SwipeNav.js index 9096bd4f..7c79dfed 100644 --- a/dist/Components/SwipeNav/SwipeNav.js +++ b/dist/Components/SwipeNav/SwipeNav.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _SwipeNav=_interopRequireDefault(require("./SwipeNav.styles"));var _statusBarHeight=_interopRequireDefault(require("../../helpers/statusBarHeight"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/SwipeNav/SwipeNav.js";var SwipeNav=function(_Component){(0,_inherits2.default)(SwipeNav,_Component);function SwipeNav(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,SwipeNav);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(SwipeNav)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{headerHeight:56,footerHeight:100,offsetY:0,headerOffsetY:new _reactNative.Animated.Value(0),scrollPaddingTop:new _reactNative.Animated.Value(56),footerOffsetY:new _reactNative.Animated.Value(0),scrollPaddingBottom:new _reactNative.Animated.Value(100)});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onHeaderLayout",function(e){_this.setState({headerHeight:e.nativeEvent.layout.height});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onFooterLayout",function(e){_this.setState({footeerHeight:e.nativeEvent.layout.height});});(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"onScroll",function(e){var _this$props=_this.props,header=_this$props.header,footer=_this$props.footer;var offsetY=e.nativeEvent.contentOffset.y;var lastOffsetY=_this.state.offsetY;_this.setState({offsetY:offsetY});if(header&&offsetY-lastOffsetY>20||offsetY-lastOffsetY<-20){if(offsetY>lastOffsetY){_this.animateHeader(true);}else{_this.animateHeader(false);}}if(footer&&offsetY-lastOffsetY<-20||offsetY-lastOffsetY>20){if(offsetY20||offsetY-lastOffsetY<-20){if(offsetY>lastOffsetY){_this.animateHeader(true);}else{_this.animateHeader(false);}}if(footer&&offsetY-lastOffsetY<-20||offsetY-lastOffsetY>20){if(offsetY=0;}},{key:"getAnimateValues",value:function getAnimateValues(){var _this$props=this.props,selectedIndex=_this$props.selectedIndex,scrollEnabled=_this$props.scrollEnabled,actionItems=_this$props.actionItems;var _this$state=this.state,tabWidth=_this$state.tabWidth,barWidth=_this$state.barWidth;var index=selectedIndex;var scrollValue=!scrollEnabled?tabWidth:barWidth*0.4;if(scrollValue<90)scrollValue=90;if(!scrollEnabled&&scrollValue>90){return{indicatorPosition:index===0?0:index*scrollValue,scrollPosition:0};}switch(index){case 0:return{indicatorPosition:0,scrollPosition:0};case 1:return{indicatorPosition:barWidth*0.5-scrollValue/4,scrollPosition:scrollValue*0.25};case actionItems.length-1:return{indicatorPosition:scrollValue*(index-1)+(barWidth*0.5-scrollValue/4),scrollPosition:scrollValue*(index-2)+scrollValue*0.5};default:return{indicatorPosition:scrollValue*(index-1)+(barWidth*0.5-scrollValue/4),scrollPosition:scrollValue*0.25+scrollValue*(index-1)};}}},{key:"selectTab",value:function selectTab(){_reactNative.Animated.spring(this.state.indicatorPosition,{toValue:this.getAnimateValues().indicatorPosition,tension:300,friction:20,useNativeDriver:true}).start();if(this.scrollView){this.scrollView.scrollTo({x:this.getAnimateValues().scrollPosition});}}},{key:"getTabWidth",value:function getTabWidth(width){var _this$props2=this.props,scrollEnabled=_this$props2.scrollEnabled,actionItems=_this$props2.actionItems;if(!scrollEnabled){var tabWidth=width/actionItems.length;this.setState({tabWidth:tabWidth});}this.setState({barWidth:width});}},{key:"getColor",value:function getColor(){var _this$props3=this.props,backgroundColor=_this$props3.backgroundColor,theme=_this$props3.theme;var implementedColor=backgroundColor?backgroundColor:theme.primary.main;return implementedColor;}},{key:"_renderTabs",value:function _renderTabs(){var _this$props4=this.props,scrollEnabled=_this$props4.scrollEnabled,actionItems=_this$props4.actionItems,handleChange=_this$props4.handleChange,selectedIndex=_this$props4.selectedIndex;var _this$state2=this.state,tabWidth=_this$state2.tabWidth,barWidth=_this$state2.barWidth;var tabWidthImplemented=!scrollEnabled?tabWidth:barWidth*0.4;if(tabWidthImplemented<90)tabWidthImplemented=90;return actionItems.map(function(item,index){if(!item.props){return _react.default.createElement(_Tab.default,{key:index,label:item.label,icon:item.icon,onPress:function onPress(){handleChange(index);if(item.onPress)item.onPress();},active:index===selectedIndex,tabWidth:tabWidthImplemented,__source:{fileName:_jsxFileName,lineNumber:156}});}else{return _react.default.cloneElement(item,{key:index,active:index===selectedIndex,tabWidth:tabWidthImplemented,onPress:function onPress(){handleChange(index);if(item.props.onPress)item.onPress();}});}});}},{key:"_renderContent",value:function _renderContent(){var _this$props5=this.props,scrollEnabled=_this$props5.scrollEnabled,underlineColor=_this$props5.underlineColor;var _this$state3=this.state,tabWidth=_this$state3.tabWidth,indicatorPosition=_this$state3.indicatorPosition,barWidth=_this$state3.barWidth;var tabWidthImplemented=!scrollEnabled?tabWidth:barWidth*0.4;if(tabWidthImplemented<90)tabWidthImplemented=90;return _react.default.createElement(_react.Fragment,{__source:{fileName:_jsxFileName,lineNumber:190}},_react.default.createElement(_reactNative.View,{style:_Tabs.default.tabsWrapper,__source:{fileName:_jsxFileName,lineNumber:191}},this._renderTabs()),_react.default.createElement(_Underline.default,{color:underlineColor,value:indicatorPosition,tabWidth:tabWidthImplemented,__source:{fileName:_jsxFileName,lineNumber:193}}));}},{key:"_renderScrollView",value:function _renderScrollView(){var _this3=this;var scrollEnabled=this.props.scrollEnabled;var _this$state4=this.state,tabWidth=_this$state4.tabWidth,barWidth=_this$state4.barWidth;var tabWidthImplemented=!scrollEnabled?tabWidth:barWidth*0.4;if(scrollEnabled||tabWidthImplemented<90){return _react.default.createElement(_reactNative.ScrollView,{horizontal:true,ref:function ref(_ref){_this3.scrollView=_ref;},showsHorizontalScrollIndicator:false,keyboardShouldPersistTaps:'never',scrollEnabled:scrollEnabled||tabWidthImplemented<90,__source:{fileName:_jsxFileName,lineNumber:210}},this._renderContent());}else{return this._renderContent();}}},{key:"render",value:function render(){var _this4=this;var _this$props6=this.props,style=_this$props6.style,testID=_this$props6.testID;return _react.default.createElement(TabsContext.Provider,{__source:{fileName:_jsxFileName,lineNumber:230}},_react.default.createElement(_reactNative.View,{style:[_Tabs.default.container,{backgroundColor:this.getColor()},style],testID:testID,ref:function ref(_ref2){_this4.container=_ref2;},onLayout:function onLayout(event){return _this4.getTabWidth(event.nativeEvent.layout.width);},__source:{fileName:_jsxFileName,lineNumber:231}},this._renderScrollView()));}}]);return Tabs;}(_react.Component);(0,_defineProperty2.default)(Tabs,"propTypes",{actionItems:_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.element])),selectedIndex:_propTypes.default.number,backgroundColor:_propTypes.default.string,underlineColor:_propTypes.default.string,scrollEnabled:_propTypes.default.bool,handleChange:_propTypes.default.func,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,testID:_propTypes.default.string});(0,_defineProperty2.default)(Tabs,"defaultProps",{selectedIndex:0,underlineColor:'#fff',scrollEnabled:false});var _default=(0,_withTheme.default)(Tabs);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=exports.TabsContext=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf3=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _Tab=_interopRequireDefault(require("./Tab/Tab"));var _Underline=_interopRequireDefault(require("./Underline/Underline"));var _withTheme=_interopRequireDefault(require("../../Theme/withTheme"));var _Tabs=_interopRequireDefault(require("./Tabs.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Tabs/Tabs.js";var TabsContext=_react.default.createContext();exports.TabsContext=TabsContext;var Tabs=function(_Component){(0,_inherits2.default)(Tabs,_Component);function Tabs(){var _getPrototypeOf2;var _this;(0,_classCallCheck2.default)(this,Tabs);for(var _len=arguments.length,args=new Array(_len),_key=0;_key<_len;_key++){args[_key]=arguments[_key];}_this=(0,_possibleConstructorReturn2.default)(this,(_getPrototypeOf2=(0,_getPrototypeOf3.default)(Tabs)).call.apply(_getPrototypeOf2,[this].concat(args)));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{tabWidth:0,barWidth:0,indicatorPosition:new _reactNative.Animated.Value(0)});return _this;}(0,_createClass2.default)(Tabs,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var _this2=this;var actionItems=this.props.actionItems;if(actionItems.length!==prevProps.actionItems.length&&this.container){this.container.measure(function(_,b,width){_this2.getTabWidth(width);});}this.selectTab();}},{key:"shouldComponentUpdate",value:function shouldComponentUpdate(nextProps){var actionItems=this.props.actionItems;return actionItems.length!==nextProps.actionItems.length||nextProps.selectedIndex=0;}},{key:"getAnimateValues",value:function getAnimateValues(){var _this$props=this.props,selectedIndex=_this$props.selectedIndex,scrollEnabled=_this$props.scrollEnabled,actionItems=_this$props.actionItems;var _this$state=this.state,tabWidth=_this$state.tabWidth,barWidth=_this$state.barWidth;var index=selectedIndex;var scrollValue=!scrollEnabled?tabWidth:barWidth*0.4;if(scrollValue<90)scrollValue=90;if(!scrollEnabled&&scrollValue>90){return{indicatorPosition:index===0?0:index*scrollValue,scrollPosition:0};}switch(index){case 0:return{indicatorPosition:0,scrollPosition:0};case 1:return{indicatorPosition:barWidth*0.5-scrollValue/4,scrollPosition:scrollValue*0.25};case actionItems.length-1:return{indicatorPosition:scrollValue*(index-1)+(barWidth*0.5-scrollValue/4),scrollPosition:scrollValue*(index-2)+scrollValue*0.5};default:return{indicatorPosition:scrollValue*(index-1)+(barWidth*0.5-scrollValue/4),scrollPosition:scrollValue*0.25+scrollValue*(index-1)};}}},{key:"selectTab",value:function selectTab(){var _this$getAnimateValue=this.getAnimateValues(),indicatorPosition=_this$getAnimateValue.indicatorPosition,scrollPosition=_this$getAnimateValue.scrollPosition;_reactNative.Animated.spring(this.state.indicatorPosition,{toValue:_reactNative.I18nManager.isRTL?-indicatorPosition:indicatorPosition,tension:300,friction:20,useNativeDriver:true}).start();if(this.scrollView){this.scrollView.scrollTo({x:scrollPosition});}}},{key:"getTabWidth",value:function getTabWidth(width){var _this$props2=this.props,scrollEnabled=_this$props2.scrollEnabled,actionItems=_this$props2.actionItems;if(!scrollEnabled){var tabWidth=width/actionItems.length;this.setState({tabWidth:tabWidth});}this.setState({barWidth:width});}},{key:"getColor",value:function getColor(){var _this$props3=this.props,backgroundColor=_this$props3.backgroundColor,theme=_this$props3.theme;var implementedColor=backgroundColor?backgroundColor:theme.primary.main;return implementedColor;}},{key:"_renderTabs",value:function _renderTabs(){var _this$props4=this.props,scrollEnabled=_this$props4.scrollEnabled,actionItems=_this$props4.actionItems,handleChange=_this$props4.handleChange,selectedIndex=_this$props4.selectedIndex;var _this$state2=this.state,tabWidth=_this$state2.tabWidth,barWidth=_this$state2.barWidth;var tabWidthImplemented=!scrollEnabled?tabWidth:barWidth*0.4;if(tabWidthImplemented<90)tabWidthImplemented=90;return actionItems.map(function(item,index){if(!item.props){return _react.default.createElement(_Tab.default,{key:index,label:item.label,icon:item.icon,onPress:function onPress(){handleChange(index);if(item.onPress)item.onPress();},active:index===selectedIndex,tabWidth:tabWidthImplemented,__source:{fileName:_jsxFileName,lineNumber:157}});}else{return _react.default.cloneElement(item,{key:index,active:index===selectedIndex,tabWidth:tabWidthImplemented,onPress:function onPress(){handleChange(index);if(item.props.onPress)item.onPress();}});}});}},{key:"_renderContent",value:function _renderContent(){var _this$props5=this.props,scrollEnabled=_this$props5.scrollEnabled,underlineColor=_this$props5.underlineColor,underlineHeight=_this$props5.underlineHeight;var _this$state3=this.state,tabWidth=_this$state3.tabWidth,indicatorPosition=_this$state3.indicatorPosition,barWidth=_this$state3.barWidth;var tabWidthImplemented=!scrollEnabled?tabWidth:barWidth*0.4;if(tabWidthImplemented<90)tabWidthImplemented=90;return _react.default.createElement(_react.Fragment,{__source:{fileName:_jsxFileName,lineNumber:191}},_react.default.createElement(_reactNative.View,{style:_Tabs.default.tabsWrapper,__source:{fileName:_jsxFileName,lineNumber:192}},this._renderTabs()),_react.default.createElement(_Underline.default,{underlineHeight:underlineHeight,color:underlineColor,value:indicatorPosition,tabWidth:tabWidthImplemented,__source:{fileName:_jsxFileName,lineNumber:194}}));}},{key:"_renderScrollView",value:function _renderScrollView(){var _this3=this;var scrollEnabled=this.props.scrollEnabled;var _this$state4=this.state,tabWidth=_this$state4.tabWidth,barWidth=_this$state4.barWidth;var tabWidthImplemented=!scrollEnabled?tabWidth:barWidth*0.4;if(scrollEnabled||tabWidthImplemented<90){return _react.default.createElement(_reactNative.ScrollView,{horizontal:true,ref:function ref(_ref){_this3.scrollView=_ref;},showsHorizontalScrollIndicator:false,keyboardShouldPersistTaps:'never',scrollEnabled:scrollEnabled||tabWidthImplemented<90,__source:{fileName:_jsxFileName,lineNumber:212}},this._renderContent());}else{return this._renderContent();}}},{key:"render",value:function render(){var _this4=this;var _this$props6=this.props,style=_this$props6.style,testID=_this$props6.testID;return _react.default.createElement(TabsContext.Provider,{__source:{fileName:_jsxFileName,lineNumber:232}},_react.default.createElement(_reactNative.View,{style:[_Tabs.default.container,{backgroundColor:this.getColor()},style],testID:testID,ref:function ref(_ref2){_this4.container=_ref2;},onLayout:function onLayout(event){return _this4.getTabWidth(event.nativeEvent.layout.width);},__source:{fileName:_jsxFileName,lineNumber:233}},this._renderScrollView()));}}]);return Tabs;}(_react.Component);(0,_defineProperty2.default)(Tabs,"propTypes",{actionItems:_propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.element])),selectedIndex:_propTypes.default.number,backgroundColor:_propTypes.default.string,underlineColor:_propTypes.default.string,underlineHeight:_propTypes.default.number,scrollEnabled:_propTypes.default.bool,handleChange:_propTypes.default.func,style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),theme:_propTypes.default.object,testID:_propTypes.default.string});(0,_defineProperty2.default)(Tabs,"defaultProps",{selectedIndex:0,underlineColor:'#fff',scrollEnabled:false});var _default=(0,_withTheme.default)(Tabs);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/Tabs/Underline/Underline.js b/dist/Components/Tabs/Underline/Underline.js index d4776c45..b95532f9 100644 --- a/dist/Components/Tabs/Underline/Underline.js +++ b/dist/Components/Tabs/Underline/Underline.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _Undrline=_interopRequireDefault(require("./Undrline.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Tabs/Underline/Underline.js";var Underline=function(_Component){(0,_inherits2.default)(Underline,_Component);function Underline(){(0,_classCallCheck2.default)(this,Underline);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Underline).apply(this,arguments));}(0,_createClass2.default)(Underline,[{key:"render",value:function render(){var _this$props=this.props,tabWidth=_this$props.tabWidth,color=_this$props.color,value=_this$props.value;return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:[_Undrline.default.underline,{width:tabWidth,backgroundColor:color,transform:[{translateX:value}]}],__source:{fileName:_jsxFileName,lineNumber:22}});}}]);return Underline;}(_react.Component);(0,_defineProperty2.default)(Underline,"propTypes",{color:_propTypes.default.string,value:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.instanceOf(_reactNative.Animated.Value)]),tabWidth:_propTypes.default.number});var _default=(0,_withTheme.default)(Underline);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _Undrline=_interopRequireDefault(require("./Undrline.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/Tabs/Underline/Underline.js";var Underline=function(_Component){(0,_inherits2.default)(Underline,_Component);function Underline(){(0,_classCallCheck2.default)(this,Underline);return(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(Underline).apply(this,arguments));}(0,_createClass2.default)(Underline,[{key:"render",value:function render(){var _this$props=this.props,tabWidth=_this$props.tabWidth,color=_this$props.color,value=_this$props.value,underlineHeight=_this$props.underlineHeight;return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_Undrline.default.underline,{width:tabWidth,backgroundColor:color,transform:[{translateX:value}],height:underlineHeight}],__source:{fileName:_jsxFileName,lineNumber:27}});}}]);return Underline;}(_react.Component);(0,_defineProperty2.default)(Underline,"propTypes",{color:_propTypes.default.string,value:_propTypes.default.oneOfType([_propTypes.default.string,_propTypes.default.instanceOf(_reactNative.Animated.Value)]),tabWidth:_propTypes.default.number,underlineHeight:_propTypes.default.number});(0,_defineProperty2.default)(Underline,"defaultProps",{underlineHeight:2});var _default=(0,_withTheme.default)(Underline);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/TextField/TextFieldLabel/TextFieldLabel.js b/dist/Components/TextField/TextFieldLabel/TextFieldLabel.js index 0de196a9..22dae2e6 100644 --- a/dist/Components/TextField/TextFieldLabel/TextFieldLabel.js +++ b/dist/Components/TextField/TextFieldLabel/TextFieldLabel.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _TextFieldLabel=_interopRequireDefault(require("./TextFieldLabel.styles"));var _TextFieldLabel2=require("./TextFieldLabel.constants");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/TextField/TextFieldLabel/TextFieldLabel.js";var TextFieldLabel=function(_Component){(0,_inherits2.default)(TextFieldLabel,_Component);function TextFieldLabel(props){var _this;(0,_classCallCheck2.default)(this,TextFieldLabel);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(TextFieldLabel).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{translateYAnimation:new _reactNative.Animated.Value(_this.props.type==='outlined'?_TextFieldLabel2.outlinedStops.initial:_TextFieldLabel2.nonOutlinedStops.initial),fontSizeAnimation:new _reactNative.Animated.Value(_this.props.value||_this.props.focused?1:0),animationDuration:200,animationEasing:_reactNative.Easing.ease,canAnimate:true});return _this;}(0,_createClass2.default)(TextFieldLabel,[{key:"componentDidMount",value:function componentDidMount(){var _this$props=this.props,type=_this$props.type,dense=_this$props.dense,prefix=_this$props.prefix,value=_this$props.value;if(type=='outlined'&&dense){this.setState({translateYAnimation:new _reactNative.Animated.Value(_TextFieldLabel2.outlinedStopsDense.initial)});}if(prefix)this._handlePrefix();if(value){if(type=='outlined'){this._handleLabelOutlinedAnimation();}else{this._handleLabelAnimation();}}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var _this$props2=this.props,focused=_this$props2.focused,type=_this$props2.type,value=_this$props2.value;if(focused!==prevProps.focused||value!==prevProps.value){if(type=='outlined'){this._handleLabelOutlinedAnimation();}else{this._handleLabelAnimation();}}}},{key:"_handlePrefix",value:function _handlePrefix(){var _this$props3=this.props,type=_this$props3.type,dense=_this$props3.dense;var translateYAnimation=_TextFieldLabel2.nonOutlinedStops.active;if(type=='outlined'){translateYAnimation=dense?_TextFieldLabel2.outlinedStopsDense.active:_TextFieldLabel2.outlinedStops.active;}this.setState({canAnimate:false,translateYAnimation:new _reactNative.Animated.Value(translateYAnimation),fontSizeAnimation:new _reactNative.Animated.Value(1)});}},{key:"_handleLabelAnimation",value:function _handleLabelAnimation(){var _this$props4=this.props,focused=_this$props4.focused,value=_this$props4.value;var _this$state=this.state,translateYAnimation=_this$state.translateYAnimation,animationEasing=_this$state.animationEasing,animationDuration=_this$state.animationDuration,canAnimate=_this$state.canAnimate,fontSizeAnimation=_this$state.fontSizeAnimation;if(!canAnimate)return;var position=focused||value?_TextFieldLabel2.nonOutlinedStops.active:_TextFieldLabel2.nonOutlinedStops.initial;var fontVal=focused||value?1:0;_reactNative.Animated.parallel([_reactNative.Animated.timing(translateYAnimation,{toValue:position,duration:animationDuration,easing:animationEasing}),_reactNative.Animated.timing(fontSizeAnimation,{toValue:fontVal,duration:animationDuration,easing:animationEasing})]).start();}},{key:"_handleLabelOutlinedAnimation",value:function _handleLabelOutlinedAnimation(){var _this$props5=this.props,focused=_this$props5.focused,value=_this$props5.value,dense=_this$props5.dense;var _this$state2=this.state,translateYAnimation=_this$state2.translateYAnimation,animationEasing=_this$state2.animationEasing,animationDuration=_this$state2.animationDuration,fontSizeAnimation=_this$state2.fontSizeAnimation,canAnimate=_this$state2.canAnimate;if(!canAnimate)return;var position=focused||value?_TextFieldLabel2.outlinedStops.active:_TextFieldLabel2.outlinedStops.initial;var fontVal=focused||value?1:0;if(dense)position=focused||value?_TextFieldLabel2.outlinedStopsDense.active:_TextFieldLabel2.outlinedStopsDense.initial;_reactNative.Animated.parallel([_reactNative.Animated.timing(translateYAnimation,{toValue:position,duration:animationDuration,easing:animationEasing}),_reactNative.Animated.timing(fontSizeAnimation,{toValue:fontVal,duration:animationDuration,easing:animationEasing})]).start();}},{key:"render",value:function render(){var _this$props6=this.props,error=_this$props6.error,labelColor=_this$props6.labelColor,label=_this$props6.label,focused=_this$props6.focused,type=_this$props6.type,leadingIcon=_this$props6.leadingIcon,prefix=_this$props6.prefix,theme=_this$props6.theme,style=_this$props6.style,dense=_this$props6.dense,focusedLabelColor=_this$props6.focusedLabelColor,_onLayout=_this$props6.onLayout;var _this$state3=this.state,translateYAnimation=_this$state3.translateYAnimation,fontSizeAnimation=_this$state3.fontSizeAnimation;var translateX=12;if(type==='flat'){translateX=-1;}else if(type==='outlined'){translateX=10;}if(!labelColor)labelColor='rgba(0, 0, 0, 0.54)';if(focused)labelColor=focusedLabelColor||theme.primary.main;if(error){labelColor='red';label='Error';}var marginLeft=leadingIcon?32:0;if(type=='flat'&&leadingIcon){marginLeft=42;}else if(type=='filled'&&prefix){marginLeft=6;}var baseFontSize=(_reactNative.StyleSheet.flatten(style)||{}).fontSize||theme.subtitleOne.fontSize||16;var fontStyle={fontSize:fontSizeAnimation.interpolate({inputRange:[0,1],outputRange:[baseFontSize,baseFontSize*(dense?0.65:0.75)]})};return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:[_TextFieldLabel.default.container,{marginLeft:marginLeft}],onLayout:function onLayout(e){return _onLayout&&_onLayout(e);},pointerEvents:"none",__source:{fileName:_jsxFileName,lineNumber:212}},_react.default.createElement(_reactNative.Animated.Text,{useNativeDriver:false,style:[_TextFieldLabel.default.label,{color:labelColor,backgroundColor:type=='outlined'?'white':'transparent',paddingHorizontal:type=='outlined'?4:0,transform:[{translateY:translateYAnimation},{translateX:_reactNative.I18nManager.isRTL?-translateX:translateX}]},style,fontStyle],__source:{fileName:_jsxFileName,lineNumber:222}},label));}}]);return TextFieldLabel;}(_react.Component);(0,_defineProperty2.default)(TextFieldLabel,"propTypes",{style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),error:_propTypes.default.bool,labelColor:_propTypes.default.string,focused:_propTypes.default.bool,label:_propTypes.default.string,type:_propTypes.default.string,value:_propTypes.default.string,leadingIcon:_propTypes.default.bool,dense:_propTypes.default.bool,prefix:_propTypes.default.bool,theme:_propTypes.default.object,focusedLabelColor:_propTypes.default.string,onLayout:_propTypes.default.func});var _default=(0,_withTheme.default)(TextFieldLabel);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _TextFieldLabel=_interopRequireDefault(require("./TextFieldLabel.styles"));var _TextFieldLabel2=require("./TextFieldLabel.constants");var _jsxFileName="/Users/cody/projects/material-bread/src/Components/TextField/TextFieldLabel/TextFieldLabel.js";var TextFieldLabel=function(_Component){(0,_inherits2.default)(TextFieldLabel,_Component);function TextFieldLabel(props){var _this;(0,_classCallCheck2.default)(this,TextFieldLabel);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(TextFieldLabel).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{translateYAnimation:new _reactNative.Animated.Value(_this.props.type==='outlined'?_TextFieldLabel2.outlinedStops.initial:_TextFieldLabel2.nonOutlinedStops.initial),fontSizeAnimation:new _reactNative.Animated.Value(_this.props.value||_this.props.focused?1:0),animationDuration:200,animationEasing:_reactNative.Easing.ease,canAnimate:true});return _this;}(0,_createClass2.default)(TextFieldLabel,[{key:"componentDidMount",value:function componentDidMount(){var _this$props=this.props,type=_this$props.type,dense=_this$props.dense,prefix=_this$props.prefix,value=_this$props.value;if(type=='outlined'&&dense){this.setState({translateYAnimation:new _reactNative.Animated.Value(_TextFieldLabel2.outlinedStopsDense.initial)});}if(prefix)this._handlePrefix();if(value){if(type=='outlined'){this._handleLabelOutlinedAnimation();}else{this._handleLabelAnimation();}}}},{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var _this$props2=this.props,focused=_this$props2.focused,type=_this$props2.type,value=_this$props2.value;if(focused!==prevProps.focused||value!==prevProps.value){if(type=='outlined'){this._handleLabelOutlinedAnimation();}else{this._handleLabelAnimation();}}}},{key:"_handlePrefix",value:function _handlePrefix(){var _this$props3=this.props,type=_this$props3.type,dense=_this$props3.dense;var translateYAnimation=_TextFieldLabel2.nonOutlinedStops.active;if(type=='outlined'){translateYAnimation=dense?_TextFieldLabel2.outlinedStopsDense.active:_TextFieldLabel2.outlinedStops.active;}this.setState({canAnimate:false,translateYAnimation:new _reactNative.Animated.Value(translateYAnimation),fontSizeAnimation:new _reactNative.Animated.Value(1)});}},{key:"_handleLabelAnimation",value:function _handleLabelAnimation(){var _this$props4=this.props,focused=_this$props4.focused,value=_this$props4.value;var _this$state=this.state,translateYAnimation=_this$state.translateYAnimation,animationEasing=_this$state.animationEasing,animationDuration=_this$state.animationDuration,canAnimate=_this$state.canAnimate,fontSizeAnimation=_this$state.fontSizeAnimation;if(!canAnimate)return;var position=focused||value?_TextFieldLabel2.nonOutlinedStops.active:_TextFieldLabel2.nonOutlinedStops.initial;var fontVal=focused||value?1:0;_reactNative.Animated.parallel([_reactNative.Animated.timing(translateYAnimation,{toValue:position,duration:animationDuration,easing:animationEasing,useNativeDriver:true}),_reactNative.Animated.timing(fontSizeAnimation,{toValue:fontVal,duration:animationDuration,easing:animationEasing,useNativeDriver:true})]).start();}},{key:"_handleLabelOutlinedAnimation",value:function _handleLabelOutlinedAnimation(){var _this$props5=this.props,focused=_this$props5.focused,value=_this$props5.value,dense=_this$props5.dense;var _this$state2=this.state,translateYAnimation=_this$state2.translateYAnimation,animationEasing=_this$state2.animationEasing,animationDuration=_this$state2.animationDuration,fontSizeAnimation=_this$state2.fontSizeAnimation,canAnimate=_this$state2.canAnimate;if(!canAnimate)return;var position=focused||value?_TextFieldLabel2.outlinedStops.active:_TextFieldLabel2.outlinedStops.initial;var fontVal=focused||value?1:0;if(dense)position=focused||value?_TextFieldLabel2.outlinedStopsDense.active:_TextFieldLabel2.outlinedStopsDense.initial;_reactNative.Animated.parallel([_reactNative.Animated.timing(translateYAnimation,{toValue:position,duration:animationDuration,easing:animationEasing,useNativeDriver:true}),_reactNative.Animated.timing(fontSizeAnimation,{toValue:fontVal,duration:animationDuration,easing:animationEasing,useNativeDriver:true})]).start();}},{key:"render",value:function render(){var _this$props6=this.props,error=_this$props6.error,labelColor=_this$props6.labelColor,label=_this$props6.label,focused=_this$props6.focused,type=_this$props6.type,leadingIcon=_this$props6.leadingIcon,prefix=_this$props6.prefix,theme=_this$props6.theme,style=_this$props6.style,dense=_this$props6.dense,focusedLabelColor=_this$props6.focusedLabelColor,_onLayout=_this$props6.onLayout;var _this$state3=this.state,translateYAnimation=_this$state3.translateYAnimation,fontSizeAnimation=_this$state3.fontSizeAnimation;var translateX=12;if(type==='flat'){translateX=-1;}else if(type==='outlined'){translateX=10;}if(!labelColor)labelColor='rgba(0, 0, 0, 0.54)';if(focused)labelColor=focusedLabelColor||theme.primary.main;if(error){labelColor='red';label='Error';}var marginLeft=leadingIcon?32:0;if(type=='flat'&&leadingIcon){marginLeft=42;}else if(type=='filled'&&prefix){marginLeft=6;}var baseFontSize=(_reactNative.StyleSheet.flatten(style)||{}).fontSize||theme.subtitleOne.fontSize||16;var fontStyle={fontSize:fontSizeAnimation.interpolate({inputRange:[0,1],outputRange:[baseFontSize,baseFontSize*(dense?0.65:0.75)]})};return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_TextFieldLabel.default.container,{marginLeft:marginLeft}],onLayout:function onLayout(e){return _onLayout&&_onLayout(e);},pointerEvents:"none",__source:{fileName:_jsxFileName,lineNumber:216}},_react.default.createElement(_reactNative.Animated.Text,{useNativeDriver:true,style:[_TextFieldLabel.default.label,{color:labelColor,backgroundColor:type=='outlined'?'white':'transparent',paddingHorizontal:type=='outlined'?4:0,transform:[{translateY:translateYAnimation},{translateX:_reactNative.I18nManager.isRTL?-translateX:translateX}]},style,fontStyle],__source:{fileName:_jsxFileName,lineNumber:226}},label));}}]);return TextFieldLabel;}(_react.Component);(0,_defineProperty2.default)(TextFieldLabel,"propTypes",{style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),error:_propTypes.default.bool,labelColor:_propTypes.default.string,focused:_propTypes.default.bool,label:_propTypes.default.string,type:_propTypes.default.string,value:_propTypes.default.string,leadingIcon:_propTypes.default.bool,dense:_propTypes.default.bool,prefix:_propTypes.default.bool,theme:_propTypes.default.object,focusedLabelColor:_propTypes.default.string,onLayout:_propTypes.default.func});var _default=(0,_withTheme.default)(TextFieldLabel);exports.default=_default; \ No newline at end of file diff --git a/dist/Components/TextField/TextFieldUnderline/TextFieldUnderline.js b/dist/Components/TextField/TextFieldUnderline/TextFieldUnderline.js index 09a141ce..d5c8366b 100644 --- a/dist/Components/TextField/TextFieldUnderline/TextFieldUnderline.js +++ b/dist/Components/TextField/TextFieldUnderline/TextFieldUnderline.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _TextFieldUnderline=_interopRequireDefault(require("./TextFieldUnderline.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/TextField/TextFieldUnderline/TextFieldUnderline.js";var TextFieldUnderline=function(_Component){(0,_inherits2.default)(TextFieldUnderline,_Component);function TextFieldUnderline(props){var _this;(0,_classCallCheck2.default)(this,TextFieldUnderline);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(TextFieldUnderline).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{underLineXAnimation:new _reactNative.Animated.Value(0),animationDuration:200,animationEasing:_reactNative.Easing.bounce});return _this;}(0,_createClass2.default)(TextFieldUnderline,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var _this$props=this.props,focused=_this$props.focused,error=_this$props.error;if(focused!==prevProps.focused&&!error){this._handleUnderlineAnimation();}}},{key:"_handleUnderlineAnimation",value:function _handleUnderlineAnimation(){var focused=this.props.focused;var _this$state=this.state,underLineXAnimation=_this$state.underLineXAnimation,animationEasing=_this$state.animationEasing,animationDuration=_this$state.animationDuration;var value=focused?1:0;_reactNative.Animated.timing(underLineXAnimation,{toValue:value,duration:animationDuration,easing:animationEasing}).start();}},{key:"render",value:function render(){var _this$props2=this.props,error=_this$props2.error,underlineColor=_this$props2.underlineColor,underlineActiveColor=_this$props2.underlineActiveColor,focused=_this$props2.focused;var underLineXAnimation=this.state.underLineXAnimation;var baseUnderlineScale=0.5;if(!underlineColor)underlineColor='rgba(0, 0, 0, 0.42)';if(!underlineActiveColor)underlineActiveColor='rgba(33, 150, 243, 1)';if(error){underlineColor='red';baseUnderlineScale=1;}return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:[_TextFieldUnderline.default.underline,{backgroundColor:underlineColor,transform:[{scaleY:baseUnderlineScale}]}],__source:{fileName:_jsxFileName,lineNumber:65}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:[_TextFieldUnderline.default.underline,{backgroundColor:underlineActiveColor,opacity:focused&&!error?1:0,transform:[{scaleX:underLineXAnimation},{scaleY:focused?2:0}]}],__source:{fileName:_jsxFileName,lineNumber:74}}));}}]);return TextFieldUnderline;}(_react.Component);(0,_defineProperty2.default)(TextFieldUnderline,"propTypes",{style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),error:_propTypes.default.bool,underlineColor:_propTypes.default.string,underlineActiveColor:_propTypes.default.string,focused:_propTypes.default.bool});var _default=(0,_withTheme.default)(TextFieldUnderline);exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _classCallCheck2=_interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));var _createClass2=_interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _possibleConstructorReturn2=_interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));var _getPrototypeOf2=_interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));var _assertThisInitialized2=_interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inherits2=_interopRequireDefault(require("@babel/runtime/helpers/inherits"));var _defineProperty2=_interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));var _react=_interopRequireWildcard(require("react"));var _propTypes=_interopRequireDefault(require("prop-types"));var _reactNative=require("react-native");var _withTheme=_interopRequireDefault(require("../../../Theme/withTheme"));var _TextFieldUnderline=_interopRequireDefault(require("./TextFieldUnderline.styles"));var _jsxFileName="/Users/cody/projects/material-bread/src/Components/TextField/TextFieldUnderline/TextFieldUnderline.js";var TextFieldUnderline=function(_Component){(0,_inherits2.default)(TextFieldUnderline,_Component);function TextFieldUnderline(props){var _this;(0,_classCallCheck2.default)(this,TextFieldUnderline);_this=(0,_possibleConstructorReturn2.default)(this,(0,_getPrototypeOf2.default)(TextFieldUnderline).call(this,props));(0,_defineProperty2.default)((0,_assertThisInitialized2.default)(_this),"state",{underLineXAnimation:new _reactNative.Animated.Value(0),animationDuration:200,animationEasing:_reactNative.Easing.bounce});return _this;}(0,_createClass2.default)(TextFieldUnderline,[{key:"componentDidUpdate",value:function componentDidUpdate(prevProps){var _this$props=this.props,focused=_this$props.focused,error=_this$props.error;if(focused!==prevProps.focused&&!error){this._handleUnderlineAnimation();}}},{key:"_handleUnderlineAnimation",value:function _handleUnderlineAnimation(){var focused=this.props.focused;var _this$state=this.state,underLineXAnimation=_this$state.underLineXAnimation,animationEasing=_this$state.animationEasing,animationDuration=_this$state.animationDuration;var value=focused?1:0;_reactNative.Animated.timing(underLineXAnimation,{toValue:value,duration:animationDuration,easing:animationEasing,useNativeDriver:true}).start();}},{key:"render",value:function render(){var _this$props2=this.props,error=_this$props2.error,underlineColor=_this$props2.underlineColor,underlineActiveColor=_this$props2.underlineActiveColor,focused=_this$props2.focused;var underLineXAnimation=this.state.underLineXAnimation;var baseUnderlineScale=0.5;if(!underlineColor)underlineColor='rgba(0, 0, 0, 0.42)';if(!underlineActiveColor)underlineActiveColor='rgba(33, 150, 243, 1)';if(error){underlineColor='red';baseUnderlineScale=1;}return _react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_TextFieldUnderline.default.underline,{backgroundColor:underlineColor,transform:[{scaleY:baseUnderlineScale}]}],__source:{fileName:_jsxFileName,lineNumber:66}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:[_TextFieldUnderline.default.underline,{backgroundColor:underlineActiveColor,opacity:focused&&!error?1:0,transform:[{scaleX:underLineXAnimation},{scaleY:focused?2:0}]}],__source:{fileName:_jsxFileName,lineNumber:75}}));}}]);return TextFieldUnderline;}(_react.Component);(0,_defineProperty2.default)(TextFieldUnderline,"propTypes",{style:_propTypes.default.oneOfType([_propTypes.default.object,_propTypes.default.array]),error:_propTypes.default.bool,underlineColor:_propTypes.default.string,underlineActiveColor:_propTypes.default.string,focused:_propTypes.default.bool});var _default=(0,_withTheme.default)(TextFieldUnderline);exports.default=_default; \ No newline at end of file diff --git a/dist/Utils/Hoverable/Hoverable.stories.js b/dist/Utils/Hoverable/Hoverable.stories.js index 94dc49ca..04286148 100644 --- a/dist/Utils/Hoverable/Hoverable.stories.js +++ b/dist/Utils/Hoverable/Hoverable.stories.js @@ -1 +1 @@ -var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _storybookState=require("@sambego/storybook-state");var _jsxFileName="/Users/cody/projects/material-bread/src/Utils/Hoverable/Hoverable.stories.js";var store=new _storybookState.Store({color:'#00BCD4',left:new _reactNative.Animated.Value(0)});var _default=(0,_storiesOf.storiesOf)('Utils|Hoverable',module).addParameters({jest:['Hoverable']}).add('Simple',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:18}},_react.default.createElement(_Header.default,{title:'Hoverable',subtitle:'Cross Platform Hover Component',__source:{fileName:_jsxFileName,lineNumber:19}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:20}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'row'},__source:{fileName:_jsxFileName,lineNumber:22}},_react.default.createElement(_.Hoverable,{onHoverIn:function onHoverIn(){return store.set({color:'#009688'});},onHoverOut:function onHoverOut(){return store.set({color:'#00BCD4'});},__source:{fileName:_jsxFileName,lineNumber:23}},_react.default.createElement(_reactNative.View,{style:{width:200,height:125,backgroundColor:state.color},__source:{fileName:_jsxFileName,lineNumber:26}})));}));}).add('Animation',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:40}},_react.default.createElement(_Header.default,{title:'Hoverable',subtitle:'Cross Platform Hover Component',__source:{fileName:_jsxFileName,lineNumber:41}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:42}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'row'},__source:{fileName:_jsxFileName,lineNumber:44}},_react.default.createElement(_.Hoverable,{onHoverIn:function onHoverIn(){_reactNative.Animated.timing(state.left,{toValue:1,duration:500}).start();},onHoverOut:function onHoverOut(){_reactNative.Animated.timing(state.left,{toValue:0,duration:500}).start();},__source:{fileName:_jsxFileName,lineNumber:45}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:false,style:{width:200,height:125,backgroundColor:state.color,transform:[{rotate:state.left.interpolate({inputRange:[0,1],outputRange:['0deg','360deg']})}]},__source:{fileName:_jsxFileName,lineNumber:58}})));}));});exports.default=_default; \ No newline at end of file +var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _=require("../../");var _Header=_interopRequireDefault(require("../../storybook/components/Header"));var _Container=_interopRequireDefault(require("../../storybook/components/Container"));var _storiesOf=require("../../storybook/helpers/storiesOf");var _storybookState=require("@sambego/storybook-state");var _jsxFileName="/Users/cody/projects/material-bread/src/Utils/Hoverable/Hoverable.stories.js";var store=new _storybookState.Store({color:'#00BCD4',left:new _reactNative.Animated.Value(0)});var _default=(0,_storiesOf.storiesOf)('Utils|Hoverable',module).addParameters({jest:['Hoverable']}).add('Simple',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:18}},_react.default.createElement(_Header.default,{title:'Hoverable',subtitle:'Cross Platform Hover Component',__source:{fileName:_jsxFileName,lineNumber:19}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:20}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'row'},__source:{fileName:_jsxFileName,lineNumber:22}},_react.default.createElement(_.Hoverable,{onHoverIn:function onHoverIn(){return store.set({color:'#009688'});},onHoverOut:function onHoverOut(){return store.set({color:'#00BCD4'});},__source:{fileName:_jsxFileName,lineNumber:23}},_react.default.createElement(_reactNative.View,{style:{width:200,height:125,backgroundColor:state.color},__source:{fileName:_jsxFileName,lineNumber:26}})));}));}).add('Animation',function(){return _react.default.createElement(_Container.default,{__source:{fileName:_jsxFileName,lineNumber:40}},_react.default.createElement(_Header.default,{title:'Hoverable',subtitle:'Cross Platform Hover Component',__source:{fileName:_jsxFileName,lineNumber:41}}),_react.default.createElement(_storybookState.State,{store:store,style:{flex:1},__source:{fileName:_jsxFileName,lineNumber:42}},function(state){return _react.default.createElement(_reactNative.View,{style:{flexDirection:'row'},__source:{fileName:_jsxFileName,lineNumber:44}},_react.default.createElement(_.Hoverable,{onHoverIn:function onHoverIn(){_reactNative.Animated.timing(state.left,{toValue:1,duration:500,useNativeDriver:true}).start();},onHoverOut:function onHoverOut(){_reactNative.Animated.timing(state.left,{toValue:0,duration:500,useNativeDriver:true}).start();},__source:{fileName:_jsxFileName,lineNumber:45}},_react.default.createElement(_reactNative.Animated.View,{useNativeDriver:true,style:{width:200,height:125,backgroundColor:state.color,transform:[{rotate:state.left.interpolate({inputRange:[0,1],outputRange:['0deg','360deg']})}]},__source:{fileName:_jsxFileName,lineNumber:60}})));}));});exports.default=_default; \ No newline at end of file diff --git a/docs/src/components/Drawer/DrawerHeader.js b/docs/src/components/Drawer/DrawerHeader.js index e1efc7de..55877ade 100644 --- a/docs/src/components/Drawer/DrawerHeader.js +++ b/docs/src/components/Drawer/DrawerHeader.js @@ -9,7 +9,7 @@ export default class DrawerContent extends React.PureComponent {
Material Bread - v0.2.9 + v0.2.10
); } diff --git a/package.json b/package.json index fa0e5761..f9fbc05d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "material-bread", - "version": "0.2.9", + "version": "0.2.10", "scripts": { "start": "node node_modules/react-native/local-cli/cli.js start", "test": "jest -w 1 --forceExit",