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

🌈 React Native UI library

"use strict";

import isBoolean from 'lodash/isBoolean';
import isNil from 'lodash/isNil';
import React, { memo } from 'react';
import { View, TouchableWithoutFeedback } from 'react-native';
import Divider from "../divider/index.js";
import { renderTextLikeJSX } from "../helpers/index.js";
import Skeleton from "../skeleton/index.js";
import Theme from "../theme/index.js";
import CardBody from "./card-body.js";
import { varCreator, styleCreator } from "./style.js";
import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
const Card = ({
  children,
  theme,
  title,
  titleLeftExtra,
  extra,
  footer,
  headerStyle,
  titleStyle,
  titleTextStyle,
  bodyStyle,
  footerStyle,
  footerTextStyle,
  size = 'm',
  square = false,
  loading = false,
  headerDivider = true,
  footerDivider = true,
  bodyPadding = true,
  onPressHeader,
  onLayoutHeader,
  onLayoutBody,
  style,
  ...restProps
}) => {
  const isS = size === 's';
  const [CV, STYLES] = Theme.useStyle({
    varCreator,
    styleCreator,
    theme
  });
  const hasTitleLeftExtra = !isNil(titleLeftExtra);
  const titleJSX = renderTextLikeJSX(title, [STYLES.title_text, isS ? STYLES.title_text_s : null, titleTextStyle, hasTitleLeftExtra ? STYLES.title_text_margin_left : null], {
    numberOfLines: 1
  });
  const footerJSX = renderTextLikeJSX(footer, [STYLES.footer_text, footerTextStyle]);
  const showHeader = !isNil(titleJSX) || hasTitleLeftExtra || !isNil(extra);
  const headerJSX = /*#__PURE__*/_jsxs(_Fragment, {
    children: [/*#__PURE__*/_jsxs(View, {
      style: [STYLES.header, isS ? STYLES.header_s : null, headerStyle],
      onLayout: onLayoutHeader,
      children: [/*#__PURE__*/_jsxs(View, {
        style: [STYLES.title, titleStyle],
        children: [titleLeftExtra, titleJSX]
      }), extra]
    }), headerDivider ? /*#__PURE__*/_jsx(Divider, {}) : null]
  });
  return /*#__PURE__*/_jsxs(View, {
    ...restProps,
    style: [STYLES.card, square ? null : STYLES[`card_radius_${size}`], style],
    children: [showHeader ? onPressHeader ? /*#__PURE__*/_jsx(TouchableWithoutFeedback, {
      onPress: onPressHeader,
      children: /*#__PURE__*/_jsx(View, {
        collapsable: false,
        children: headerJSX
      })
    }) : headerJSX : null, /*#__PURE__*/_jsx(CardBody, {
      style: bodyStyle,
      padding: isBoolean(bodyPadding) && bodyPadding ? CV.card_padding : bodyPadding,
      onLayout: onLayoutBody,
      children: loading ? /*#__PURE__*/_jsx(Skeleton, {
        loading: true
      }) : children
    }), !isNil(footerJSX) ? /*#__PURE__*/_jsxs(_Fragment, {
      children: [footerDivider ? /*#__PURE__*/_jsx(Divider, {}) : null, /*#__PURE__*/_jsx(View, {
        style: [STYLES.footer, footerStyle],
        children: footerJSX
      })]
    }) : null]
  });
};
export default /*#__PURE__*/memo(Card);
//# sourceMappingURL=card.js.map