@fruits-chain/react-native-xiaoshu/lib/module/skeleton/index.js

🌈 React Native UI library

function _extends() { _extends = Object.assign || 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 isNil from 'lodash/isNil';
import React, { memo } from 'react';
import { View, StyleSheet } from 'react-native';
import { isObject } from '../helpers';
import Space from '../space';
import SkeletonAvatar from './skeleton-avatar';
import SkeletonParagraph from './skeleton-paragraph';
const defaultTitleWidths = [38];
const defaultParagraphOption = {
  rows: 3,
  widths: [100, 100, 61]
};
const STYLES = StyleSheet.create({
  skeleton: {
    flexDirection: 'row'
  },
  avatar: {
    marginRight: 8
  },
  ctx: {
    flex: 1
  }
});

const Skeleton = _ref => {
  let {
    children,
    active = true,
    loading,
    title = true,
    paragraph = true,
    avatar = false
  } = _ref;
  const showTitle = !!title;
  const titleWidths = isObject(title) ? [title.width] : defaultTitleWidths;
  const showParagraph = !!paragraph;
  const paragraphOption = isObject(paragraph) ? paragraph : defaultParagraphOption;
  const paragraphActive = !isNil(paragraphOption.active) ? paragraphOption.active : active;
  const showAvatar = !!avatar;
  const avatarOption = isObject(avatar) ? avatar : {};
  const ctxJSX = showParagraph || showTitle ? /*#__PURE__*/React.createElement(Space, null, showTitle ? /*#__PURE__*/React.createElement(SkeletonParagraph, {
    active: active,
    rows: 1,
    widths: titleWidths
  }) : null, showParagraph ? /*#__PURE__*/React.createElement(SkeletonParagraph, _extends({}, paragraphOption, {
    active: paragraphActive
  })) : null) : null;
  const nodeJSX = showAvatar ? /*#__PURE__*/React.createElement(View, {
    style: STYLES.skeleton
  }, /*#__PURE__*/React.createElement(View, {
    style: STYLES.avatar
  }, /*#__PURE__*/React.createElement(SkeletonAvatar, _extends({}, avatarOption, {
    active: !isNil(avatarOption.active) ? avatarOption.active : active
  }))), !isNil(ctxJSX) ? /*#__PURE__*/React.createElement(View, {
    style: STYLES.ctx
  }, ctxJSX) : null) : ctxJSX;
  return loading ? nodeJSX :
  /*#__PURE__*/
  // eslint-disable-next-line react/jsx-no-useless-fragment
  React.createElement(React.Fragment, null, children);
};

export default /*#__PURE__*/memo(Skeleton);
//# sourceMappingURL=index.js.map