@ant-design/react-native
Version:
基于蚂蚁金服移动设计规范的 React Native 组件库
1 lines • 5.48 kB
JavaScript
"use client";var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");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 _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _icon=_interopRequireDefault(require("../icon"));var _style=require("../style");var _index=_interopRequireDefault(require("./style/index"));function _callSuper(_this,derived,args){function isNativeReflectConstruct(){if(typeof Reflect==="undefined"||!Reflect.construct)return false;if(Reflect.construct.sham)return false;if(typeof Proxy==="function")return true;try{return!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){}));}catch(e){return false;}}derived=(0,_getPrototypeOf2.default)(derived);return(0,_possibleConstructorReturn2.default)(_this,isNativeReflectConstruct()?Reflect.construct(derived,args||[],(0,_getPrototypeOf2.default)(_this).constructor):derived.apply(_this,args));}var __rest=this&&this.__rest||function(s,e){var t={};for(var p in s){if(Object.prototype.hasOwnProperty.call(s,p)&&e.indexOf(p)<0)t[p]=s[p];}if(s!=null&&typeof Object.getOwnPropertySymbols==="function")for(var i=0,p=Object.getOwnPropertySymbols(s);i<p.length;i++){if(e.indexOf(p[i])<0&&Object.prototype.propertyIsEnumerable.call(s,p[i]))t[p[i]]=s[p[i]];}return t;};function fixControlledValue(value){if(typeof value==='undefined'||value===null){return'';}return value;}var TextAreaItem=function(_React$Component){function TextAreaItem(props){var _this2;(0,_classCallCheck2.default)(this,TextAreaItem);_this2=_callSuper(this,TextAreaItem,[props]);_this2.onChange=function(event){var text=event.nativeEvent.text;var onChange=_this2.props.onChange;_this2.setState({inputCount:text.length});if(onChange){onChange(text);}};_this2.onContentSizeChange=function(theme){return function(event){var height;var _this2$props=_this2.props,autoHeight=_this2$props.autoHeight,onContentSizeChange=_this2$props.onContentSizeChange;var rows=_this2.props.rows;if(autoHeight){height=event.nativeEvent.contentSize.height;}else if(rows>1){height=6*rows*4;}else{height=theme.list_item_height;}_this2.setState({height:height});if(onContentSizeChange){onContentSizeChange(event);}};};_this2.getHeight=function(theme){var rows=_this2.props.rows;if(_this2.state.height){return _this2.state.height;}return rows!==undefined&&rows>1?6*rows*4:theme.list_item_height;};_this2.state={inputCount:fixControlledValue(props.value||props.defaultValue).length};return _this2;}(0,_inherits2.default)(TextAreaItem,_React$Component);return(0,_createClass2.default)(TextAreaItem,[{key:"render",value:function render(){var _this3=this;var _a=this.props,rows=_a.rows,error=_a.error,clear=_a.clear,count=_a.count,autoHeight=_a.autoHeight,last=_a.last,onErrorClick=_a.onErrorClick,styles=_a.styles,style=_a.style,restProps=__rest(_a,["rows","error","clear","count","autoHeight","last","onErrorClick","styles","style"]);var value=restProps.value,defaultValue=restProps.defaultValue;var inputCount=this.state.inputCount;return _react.default.createElement(_style.WithTheme,{themeStyles:_index.default,styles:styles},function(s,theme){var valueProps;if('value'in _this3.props){valueProps={value:fixControlledValue(value)};}else{valueProps={defaultValue:defaultValue};}var containerStyle={borderBottomWidth:last?0:theme.border_width_sm};var textareaStyle={color:error?'#f50':theme.color_text_base,paddingRight:error?2*theme.h_spacing_lg:0};var maxLength=count>0?count:undefined;return _react.default.createElement(_reactNative.View,{style:[s.container,containerStyle,{position:'relative'}]},_react.default.createElement(_reactNative.TextInput,(0,_extends2.default)({clearButtonMode:clear?'while-editing':'never',underlineColorAndroid:"transparent",style:[s.input,textareaStyle,{height:Math.max(45,_this3.getHeight(theme))},style]},restProps,valueProps,{onChange:function onChange(event){return _this3.onChange(event);},onContentSizeChange:_this3.onContentSizeChange(theme),multiline:rows>1||autoHeight,numberOfLines:rows,maxLength:maxLength,ref:function ref(_ref){return _this3.textAreaRef=_ref;}})),error?_react.default.createElement(_reactNative.TouchableWithoutFeedback,{onPress:onErrorClick},_react.default.createElement(_reactNative.View,{style:[s.errorIcon]},_react.default.createElement(_icon.default,{name:"info-circle",style:{color:theme.brand_error}}))):null,rows>1&&count>0?_react.default.createElement(_reactNative.View,{style:[s.count]},_react.default.createElement(_reactNative.Text,{style:s.countText},inputCount," / ",count)):null);});}}]);}(_react.default.Component);TextAreaItem.defaultProps={onChange:function onChange(){},onFocus:function onFocus(){},onBlur:function onBlur(){},onErrorClick:function onErrorClick(){},clear:true,error:false,editable:true,rows:1,count:0,keyboardType:'default',autoHeight:false,last:false};var _default=TextAreaItem;exports.default=_default;