@td-design/react-native/lib/module/avatar/Accessory/index.js

react-native UI组件库

import React, { memo } from 'react';
import { Image, StyleSheet } from 'react-native';
import Box from '../../box';
import helpers from '../../helpers';
const {
  px
} = helpers;
const Accessory = _ref => {
  let {
    size = px(14),
    url,
    component,
    top = false,
    left = false
  } = _ref;
  return /*#__PURE__*/React.createElement(Box, {
    position: 'absolute',
    alignItems: 'center',
    justifyContent: 'center',
    width: size,
    height: size,
    style: StyleSheet.flatten([{
      borderRadius: size / 2
    }, top ? styles.top : styles.bottom, left ? styles.left : styles.right])
  }, /*#__PURE__*/React.createElement(Icon, {
    url,
    size,
    component
  }));
};
Accessory.displayName = 'Accessory';

/** 挂件的位置 */
const styles = StyleSheet.create({
  top: {
    top: 0
  },
  bottom: {
    bottom: 0
  },
  left: {
    left: 0
  },
  right: {
    right: 0
  }
});
export default Accessory;
const Icon = /*#__PURE__*/memo(_ref2 => {
  let {
    url,
    size,
    component
  } = _ref2;
  if (url) {
    const source = typeof url === 'string' ? {
      uri: url
    } : url;
    return /*#__PURE__*/React.createElement(Image, {
      style: {
        width: size,
        height: size,
        borderRadius: size / 2
      },
      source: source,
      resizeMode: "cover"
    });
  }
  if (component) {
    return component;
  }
  return null;
});
//# sourceMappingURL=index.js.map