@devloops/react-native-variant/lib/commonjs/Components/FormControl/index.js

react-native material ui library

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 _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var Palette=_interopRequireWildcard(require("../../Helpers/palette"));var _Icon=_interopRequireDefault(require("../Core/Icon"));var _color=_interopRequireDefault(require("color"));var _Ripple=_interopRequireDefault(require("../Core/Ripple"));var _jsxFileName="/Users/devloops/Desktop/reactNative/reactNativeMUI/src/Components/FormControl/index.tsx";var FormControl=function FormControl(_ref){var _ref$type=_ref.type,type=_ref$type===void 0?'checkbox':_ref$type,_ref$color=_ref.color,color=_ref$color===void 0?Palette.blue500:_ref$color,_ref$size=_ref.size,size=_ref$size===void 0?16:_ref$size,_ref$disabled=_ref.disabled,disabled=_ref$disabled===void 0?false:_ref$disabled;var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2.default)(_useState,2),selected=_useState2[0],setSelected=_useState2[1];var selectAnimation=(0,_react.useRef)(new _reactNative.Animated.Value(selected?size:0)).current;(0,_react.useEffect)(function(){_reactNative.Animated.timing(selectAnimation,{toValue:selected?size:0,duration:100,easing:_reactNative.Easing.cubic}).start();},[selected]);return _react.default.createElement(_reactNative.View,{style:{alignSelf:'flex-start',borderRadius:30,overflow:'hidden'},__source:{fileName:_jsxFileName,lineNumber:29}},_react.default.createElement(_Ripple.default,{rippleSequential:true,rippleColor:disabled?'#111111':color,onPress:disabled===false?function(){return setSelected(!selected);}:undefined,style:{padding:10},__source:{fileName:_jsxFileName,lineNumber:36}},_react.default.createElement(_reactNative.Animated.View,{style:{overflow:'hidden',borderRadius:type==='radio'?30:2,width:size,height:size,backgroundColor:disabled?(0,_color.default)('#111111').fade(0.7).alpha(0.1).toString():'transparent',borderColor:disabled?(0,_color.default)('#111111').fade(0.4).alpha(0.2).toString():selectAnimation.interpolate({inputRange:[0,12],outputRange:['#111111',disabled?(0,_color.default)(color).darken(0.8).fade(0.5).toString():color]}),borderWidth:type==='radio'?1.5:1.5,alignItems:'center',justifyContent:'center'},__source:{fileName:_jsxFileName,lineNumber:41}},_react.default.createElement(_reactNative.Animated.View,{style:[{borderRadius:type==='radio'?30:0,width:selectAnimation,height:selectAnimation,alignItems:'center',alignContent:'center',justifyContent:'center',backgroundColor:disabled?(0,_color.default)(color).darken(0.8).fade(0.8).toString():color}],__source:{fileName:_jsxFileName,lineNumber:74}},type==='checkbox'&&selected&&_react.default.createElement(_Icon.default,{name:"check",size:size-4,style:{marginTop:1.5,marginLeft:1},color:disabled&&selected?(0,_color.default)(color).darken(0.8).fade(0.8).toString():(0,_color.default)(color).isDark()?'white':'black',__source:{fileName:_jsxFileName,lineNumber:92}})))));};var _default=FormControl;exports.default=_default;
//# sourceMappingURL=index.js.map