@td-design/react-native-picker/lib/module/picker-item/index.js

基于 @td-design/react-native 的 picker 组件

function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
import React from 'react';
import { StyleSheet } from 'react-native';
import { Box, Pressable, SvgIcon, Text, useTheme } from '@td-design/react-native';
import CascaderPicker from '../cascade-picker';
import NormalPicker from '../normal-picker';
import usePicker from '../usePicker';
function PickerItem(_ref) {
  let {
    placeholder = '请选择',
    disabled = false,
    cascade,
    value,
    data,
    onChange,
    style,
    allowClear = true,
    hyphen = ',',
    activeOpacity = 0.6,
    inForm,
    ...restProps
  } = _ref;
  const theme = useTheme();
  const {
    state,
    currentText,
    handlePress,
    handleChange,
    handleInputClear,
    pickerRef
  } = usePicker({
    data,
    cascade,
    value,
    onChange,
    placeholder,
    hyphen
  });
  const styles = StyleSheet.create({
    content: {
      flexGrow: 1,
      justifyContent: 'flex-end',
      alignItems: 'center',
      flexDirection: 'row',
      paddingHorizontal: theme.spacing[inForm ? 'x0' : 'x1']
    },
    icon: {
      alignItems: 'flex-end'
    }
  });
  const Content = /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Text, {
    variant: "p1",
    color: disabled ? 'disabled' : currentText === placeholder ? 'gray300' : 'text',
    numberOfLines: 1,
    textAlign: 'right',
    style: {
      flex: 1
    }
  }, currentText), !disabled && allowClear && !!currentText && currentText !== placeholder && /*#__PURE__*/React.createElement(Pressable, {
    activeOpacity: 1,
    onPress: handleInputClear,
    hitOffset: 10,
    style: styles.icon
  }, /*#__PURE__*/React.createElement(SvgIcon, {
    name: "closecircleo",
    color: theme.colors.icon
  })));
  if (!disabled) return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Pressable, {
    onPress: handlePress,
    activeOpacity: activeOpacity,
    style: [styles.content, style]
  }, Content), cascade ? /*#__PURE__*/React.createElement(CascaderPicker, _extends({
    data: data,
    onChange: handleChange,
    value: state,
    ref: pickerRef
  }, restProps)) : /*#__PURE__*/React.createElement(NormalPicker, _extends({
    data: data,
    onChange: handleChange,
    value: state,
    ref: pickerRef
  }, restProps)));
  return /*#__PURE__*/React.createElement(Box, {
    style: [styles.content, style]
  }, Content);
}
export default PickerItem;
//# sourceMappingURL=index.js.map