tf-checkout-react-native 1.0.47 → 2.0.0-beta.10

package/src/packages/rn-material-ui-textfield/components/field-filled/index.js

@@ -1,21 +0,0 @@
-import TextField from '../field'
-import styles from './styles'
-
-export default class FilledTextField extends TextField {
-  static contentInset = {
-    ...TextField.contentInset,
-
-    top: 8,
-    left: 12,
-    right: 12,
-  }
-
-  static labelOffset = {
-    ...TextField.labelOffset,
-
-    y0: -10,
-    y1: -2,
-  }
-
-  static inputContainerStyle = [TextField.inputContainerStyle, styles.inputContainer]
-}

package/src/packages/rn-material-ui-textfield/components/field-filled/styles.js

@@ -1,10 +0,0 @@
-import { StyleSheet } from 'react-native'
-
-export default StyleSheet.create({
-  inputContainer: {
-    borderTopLeftRadius: 4,
-    borderTopRightRadius: 4,
-
-    backgroundColor: 'rgb(204, 204, 204)',
-  },
-})

package/src/packages/rn-material-ui-textfield/components/field-outlined/index.js

@@ -1,59 +0,0 @@
-import React from 'react'
-import { Animated, StyleSheet } from 'react-native'
-
-import TextField from '../field'
-import Outline from '../outline'
-
-export default class OutlinedTextField extends TextField {
-  static contentInset = {
-    ...TextField.contentInset,
-
-    input: 16,
-
-    top: 0,
-    left: 12,
-    right: 12,
-  }
-
-  static labelOffset = {
-    ...TextField.labelOffset,
-
-    y0: 0,
-    y1: -10,
-  }
-
-  static defaultProps = {
-    ...TextField.defaultProps,
-
-    lineWidth: 1,
-    disabledLineWidth: StyleSheet.hairlineWidth,
-  }
-
-  constructor(props) {
-    super(props)
-
-    this.onTextLayout = this.onTextLayout.bind(this)
-    this.state.labelWidth = new Animated.Value(0)
-  }
-
-  onTextLayout({ nativeEvent: { lines } }) {
-    const { fontSize, labelFontSize } = this.props
-    const { labelWidth } = this.state
-
-    const scale = labelFontSize / fontSize
-
-    labelWidth.setValue(lines[0].width * scale)
-  }
-
-  renderLabel(props) {
-    const { onTextLayout } = this
-
-    return super.renderLabel({ ...props, onTextLayout })
-  }
-
-  renderLine(props) {
-    const { labelWidth } = this.state
-
-    return <Outline {...props} labelWidth={labelWidth} />
-  }
-}

package/src/packages/rn-material-ui-textfield/components/helper/index.js

@@ -1,78 +0,0 @@
-import PropTypes from 'prop-types'
-import React, { PureComponent } from 'react'
-import { Animated } from 'react-native'
-import { TextPropTypes } from 'deprecated-react-native-prop-types'
-
-import styles from './styles'
-
-export default class Helper extends PureComponent {
-  static propTypes = {
-    title: PropTypes.string,
-    error: PropTypes.string,
-    disabled: PropTypes.bool,
-    style: TextPropTypes.style,
-    baseColor: PropTypes.string,
-    errorColor: PropTypes.string,
-    focusAnimation: PropTypes.instanceOf(Animated.Value),
-  }
-
-  constructor(props) {
-    super(props)
-
-    const { error, focusAnimation } = this.props
-
-    const opacity = focusAnimation.interpolate({
-      inputRange: [-1, -0.5, 0],
-      outputRange: [1, 0, 1],
-      extrapolate: 'clamp',
-    })
-
-    this.state = {
-      errored: !!error,
-      opacity,
-    }
-  }
-
-  componentDidMount() {
-    const { focusAnimation } = this.props
-
-    this.listener = focusAnimation.addListener(this.onAnimation.bind(this))
-  }
-
-  componentWillUnmount() {
-    const { focusAnimation } = this.props
-
-    focusAnimation.removeListener(this.listener)
-  }
-
-  onAnimation({ value }) {
-    if (this.animationValue > -0.5 && value <= -0.5) {
-      this.setState({ errored: true })
-    }
-
-    if (this.animationValue < -0.5 && value >= -0.5) {
-      this.setState({ errored: false })
-    }
-
-    this.animationValue = value
-  }
-
-  render() {
-    const { errored, opacity } = this.state
-    const { style, title, error, disabled, baseColor, errorColor } = this.props
-
-    const text = errored ? error : title
-
-    if (text == null) {
-      return null
-    }
-
-    const textStyle = {
-      opacity,
-
-      color: !disabled && errored ? errorColor : baseColor,
-    }
-
-    return <Animated.Text style={[styles.text, style, textStyle]}>{text}</Animated.Text>
-  }
-}

package/src/packages/rn-material-ui-textfield/components/helper/styles.js

@@ -1,12 +0,0 @@
-import { StyleSheet } from 'react-native'
-
-export default StyleSheet.create({
-  text: {
-    flex: 1,
-    fontSize: 12,
-    lineHeight: 16,
-    backgroundColor: 'transparent',
-    paddingVertical: 2,
-    textAlign: 'left',
-  },
-})

package/src/packages/rn-material-ui-textfield/components/label/index.js

@@ -1,123 +0,0 @@
-import PropTypes from 'prop-types'
-import React, { PureComponent } from 'react'
-import { Animated } from 'react-native'
-import { TextPropTypes } from 'deprecated-react-native-prop-types'
-
-import styles from './styles'
-
-export default class Label extends PureComponent {
-  static defaultProps = {
-    numberOfLines: 1,
-    disabled: false,
-    restricted: false,
-  }
-
-  static propTypes = {
-    numberOfLines: PropTypes.number,
-
-    disabled: PropTypes.bool,
-    restricted: PropTypes.bool,
-
-    fontSize: PropTypes.number.isRequired,
-    activeFontSize: PropTypes.number.isRequired,
-
-    baseColor: PropTypes.string.isRequired,
-    tintColor: PropTypes.string.isRequired,
-    errorColor: PropTypes.string.isRequired,
-
-    focusAnimation: PropTypes.instanceOf(Animated.Value).isRequired,
-
-    labelAnimation: PropTypes.instanceOf(Animated.Value).isRequired,
-
-    contentInset: PropTypes.shape({
-      label: PropTypes.number,
-    }),
-
-    offset: PropTypes.shape({
-      x0: PropTypes.number,
-      y0: PropTypes.number,
-      x1: PropTypes.number,
-      y1: PropTypes.number,
-    }),
-
-    style: TextPropTypes.style,
-    label: PropTypes.string,
-  }
-
-  render() {
-    const {
-      label,
-      offset,
-      disabled,
-      restricted,
-      fontSize,
-      activeFontSize,
-      contentInset,
-      errorColor,
-      baseColor,
-      tintColor,
-      style,
-      focusAnimation,
-      labelAnimation,
-      ...props
-    } = this.props
-
-    if (label == null) {
-      return null
-    }
-
-    const color = disabled
-      ? baseColor
-      : restricted
-        ? errorColor
-        : focusAnimation.interpolate({
-            inputRange: [-1, 0, 1],
-            outputRange: [errorColor, baseColor, tintColor],
-          })
-
-    const textStyle = {
-      lineHeight: style?.lineHeight || fontSize,
-      fontSize,
-      color,
-    }
-
-    let { x0, y0, x1, y1 } = offset
-
-    y0 += activeFontSize
-    y0 += contentInset.label
-    y0 += fontSize * 0.25
-
-    const scale = labelAnimation.interpolate({
-      inputRange: [0, 1],
-      outputRange: [1, activeFontSize / fontSize],
-    })
-
-    const containerStyle = {
-      transform: [
-        {
-          translateX: labelAnimation.interpolate({
-            inputRange: [0, 1],
-            outputRange: [x0, x1],
-          }),
-        },
-        {
-          translateY: labelAnimation.interpolate({
-            inputRange: [0, 1],
-            outputRange: [y0, y1],
-          }),
-        },
-        {
-          scale,
-        },
-      ],
-    }
-
-    return (
-      <Animated.View style={[styles.container, containerStyle]}>
-        <Animated.Text style={[styles.text, style, textStyle]} {...props}>
-          {label}
-        </Animated.Text>
-      </Animated.View>
-    )
-  }
-}

package/src/packages/rn-material-ui-textfield/components/label/styles.js

@@ -1,16 +0,0 @@
-import { StyleSheet } from 'react-native'
-
-export default StyleSheet.create({
-  container: {
-    position: 'absolute',
-    top: 0,
-    transformOrigin: 'left',
-    transform: [{ translateX: '-50%' }],
-  },
-
-  text: {
-    textAlign: 'left',
-    includeFontPadding: false,
-    textAlignVertical: 'top',
-  },
-})

package/src/packages/rn-material-ui-textfield/components/line/index.js

@@ -1,117 +0,0 @@
-import PropTypes from 'prop-types'
-import React, { PureComponent } from 'react'
-import { View, Animated } from 'react-native'
-
-import styles from './styles'
-
-const lineTypes = PropTypes.oneOf(['solid', 'dotted', 'dashed', 'none'])
-
-export default class Line extends PureComponent {
-  static defaultProps = {
-    lineType: 'solid',
-    disabledLineType: 'dotted',
-
-    disabled: false,
-    restricted: false,
-  }
-
-  static propTypes = {
-    lineType: lineTypes,
-    disabledLineType: lineTypes,
-
-    disabled: PropTypes.bool,
-    restricted: PropTypes.bool,
-
-    tintColor: PropTypes.string,
-    baseColor: PropTypes.string,
-    errorColor: PropTypes.string,
-
-    lineWidth: PropTypes.number,
-    activeLineWidth: PropTypes.number,
-    disabledLineWidth: PropTypes.number,
-
-    focusAnimation: PropTypes.instanceOf(Animated.Value),
-  }
-
-  static getDerivedStateFromProps(props, state) {
-    const { lineWidth, activeLineWidth, disabledLineWidth } = props
-
-    const maxLineWidth = Math.max(lineWidth, activeLineWidth, disabledLineWidth, 1)
-
-    if (maxLineWidth !== state.maxLineWidth) {
-      return { maxLineWidth }
-    }
-
-    return null
-  }
-
-  state = { maxLineWidth: 1 }
-
-  borderProps() {
-    const {
-      disabled,
-      restricted,
-      lineWidth,
-      activeLineWidth,
-      disabledLineWidth,
-      baseColor,
-      tintColor,
-      errorColor,
-      focusAnimation,
-    } = this.props
-
-    if (disabled) {
-      return {
-        borderColor: baseColor,
-        borderWidth: disabledLineWidth,
-      }
-    }
-
-    if (restricted) {
-      return {
-        borderColor: errorColor,
-        borderWidth: activeLineWidth,
-      }
-    }
-
-    return {
-      borderColor: focusAnimation.interpolate({
-        inputRange: [-1, 0, 1],
-        outputRange: [errorColor, baseColor, tintColor],
-      }),
-
-      borderWidth: focusAnimation.interpolate({
-        inputRange: [-1, 0, 1],
-        outputRange: [activeLineWidth, lineWidth, activeLineWidth],
-      }),
-    }
-  }
-
-  render() {
-    const { maxLineWidth } = this.state
-    const { disabled, lineType, disabledLineType } = this.props
-
-    const borderStyle = disabled ? disabledLineType : lineType
-
-    if (borderStyle === 'none') {
-      return null
-    }
-
-    const [top, right, left] = Array.from(new Array(3), () => -1.5 * maxLineWidth)
-
-    const lineStyle = {
-      ...this.borderProps(),
-
-      borderStyle,
-      top,
-      right,
-      left,
-    }
-
-    return (
-      <View style={styles.container} pointerEvents="none">
-        <Animated.View style={[styles.line, lineStyle]} />
-      </View>
-    )
-  }
-}

package/src/packages/rn-material-ui-textfield/components/line/styles.js

@@ -1,18 +0,0 @@
-import { StyleSheet, Platform } from 'react-native'
-
-export default StyleSheet.create({
-  line: {
-    position: 'absolute',
-    bottom: 0,
-
-    ...Platform.select({
-      android: { borderRadius: Number.EPSILON },
-    }),
-  },
-
-  container: {
-    ...StyleSheet.absoluteFillObject,
-
-    overflow: 'hidden',
-  },
-})

package/src/packages/rn-material-ui-textfield/components/outline/index.js

@@ -1,139 +0,0 @@
-import PropTypes from 'prop-types'
-import React, { Fragment, PureComponent } from 'react'
-import { View, Animated, I18nManager } from 'react-native'
-
-import styles, { borderRadius } from './styles'
-
-export default class Line extends PureComponent {
-  static defaultProps = {
-    lineType: 'solid',
-    disabled: false,
-    restricted: false,
-  }
-
-  static propTypes = {
-    lineType: PropTypes.oneOf(['solid', 'none']),
-
-    disabled: PropTypes.bool,
-    restricted: PropTypes.bool,
-
-    tintColor: PropTypes.string,
-    baseColor: PropTypes.string,
-    errorColor: PropTypes.string,
-
-    lineWidth: PropTypes.number,
-    activeLineWidth: PropTypes.number,
-    disabledLineWidth: PropTypes.number,
-
-    focusAnimation: PropTypes.instanceOf(Animated.Value),
-    labelAnimation: PropTypes.instanceOf(Animated.Value),
-    labelWidth: PropTypes.instanceOf(Animated.Value),
-
-    contentInset: PropTypes.shape({
-      left: PropTypes.number,
-      right: PropTypes.number,
-    }),
-  }
-
-  borderProps() {
-    const {
-      disabled,
-      restricted,
-      lineType,
-      lineWidth,
-      activeLineWidth,
-      disabledLineWidth,
-      baseColor,
-      tintColor,
-      errorColor,
-      focusAnimation,
-    } = this.props
-
-    if (disabled) {
-      return {
-        borderColor: baseColor,
-        borderWidth: disabledLineWidth,
-      }
-    }
-
-    if (restricted) {
-      return {
-        borderColor: errorColor,
-        borderWidth: activeLineWidth,
-      }
-    }
-
-    return {
-      borderColor: focusAnimation.interpolate({
-        inputRange: [-1, 0, 1],
-        outputRange: [errorColor, baseColor, tintColor],
-      }),
-
-      borderWidth: focusAnimation.interpolate({
-        inputRange: [-1, 0, 1],
-        outputRange: [activeLineWidth, lineWidth, activeLineWidth],
-      }),
-
-      borderStyle: lineType,
-    }
-  }
-
-  render() {
-    const { lineType, labelWidth, labelAnimation, contentInset } = this.props
-
-    if (lineType === 'none') {
-      return null
-    }
-
-    const labelOffset = 2 * (contentInset.left - 2 * borderRadius)
-    const lineOffset = Animated.add(labelWidth, labelOffset)
-
-    const topLineContainerStyle = {
-      transform: [
-        {
-          scaleX: I18nManager.isRTL ? -1 : 1,
-        },
-        {
-          translateX: Animated.multiply(labelAnimation, lineOffset),
-        },
-      ],
-    }
-
-    const leftContainerStyle = {
-      width: contentInset.left - borderRadius,
-    }
-
-    const rightContainerStyle = {
-      width: contentInset.right - borderRadius,
-    }
-
-    const topContainerStyle = {
-      left: leftContainerStyle.width,
-      right: rightContainerStyle.width,
-    }
-
-    const lineStyle = this.borderProps()
-
-    return (
-      <Fragment>
-        <View style={[styles.topContainer, topContainerStyle]} pointerEvents="none">
-          <Animated.View style={[styles.topLineContainer, topLineContainerStyle]}>
-            <Animated.View style={[styles.borderTop, lineStyle]} />
-          </Animated.View>
-        </View>
-
-        <View style={[styles.rightContainer, rightContainerStyle]} pointerEvents="none">
-          <Animated.View style={[styles.borderRight, lineStyle]} />
-        </View>
-
-        <View style={styles.bottomContainer} pointerEvents="none">
-          <Animated.View style={[styles.borderBottom, lineStyle]} />
-        </View>
-
-        <View style={[styles.leftContainer, leftContainerStyle]} pointerEvents="none">
-          <Animated.View style={[styles.borderLeft, lineStyle]} />
-        </View>
-      </Fragment>
-    )
-  }
-}

package/src/packages/rn-material-ui-textfield/components/outline/styles.js

@@ -1,83 +0,0 @@
-import { StyleSheet, Platform } from 'react-native'
-
-export const borderRadius = 4
-
-const containerStyle = {
-  position: 'absolute',
-  overflow: 'hidden',
-}
-
-export default StyleSheet.create({
-  borderLeft: {
-    ...StyleSheet.absoluteFillObject,
-    borderRadius,
-
-    right: -borderRadius,
-    bottom: -borderRadius,
-  },
-
-  borderRight: {
-    ...StyleSheet.absoluteFillObject,
-    borderRadius,
-
-    left: -borderRadius,
-    bottom: -borderRadius,
-  },
-
-  borderBottom: {
-    ...StyleSheet.absoluteFillObject,
-    borderRadius,
-
-    top: -borderRadius,
-
-    /* XXX: Android positioning error workaround */
-    bottom: StyleSheet.hairlineWidth,
-  },
-
-  borderTop: {
-    ...StyleSheet.absoluteFillObject,
-    borderRadius,
-
-    left: -borderRadius,
-    right: -borderRadius,
-    bottom: -borderRadius,
-  },
-
-  leftContainer: {
-    ...containerStyle,
-
-    top: 0,
-    left: 0,
-    width: borderRadius,
-    height: borderRadius,
-  },
-
-  rightContainer: {
-    ...containerStyle,
-
-    top: 0,
-    right: 0,
-    height: borderRadius,
-  },
-
-  bottomContainer: {
-    ...containerStyle,
-
-    top: borderRadius - (Platform.OS === 'android' ? 0.25 : 0),
-    left: 0,
-    right: 0,
-    bottom: 0,
-  },
-
-  topContainer: {
-    ...containerStyle,
-
-    top: 0,
-    height: borderRadius,
-  },
-
-  topLineContainer: {
-    ...StyleSheet.absoluteFillObject,
-    overflow: 'hidden',
-  },
-})