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

🌈 React Native UI library

"use strict";

import React, { useMemo, memo } from 'react';
import { PlaceholderLine } from 'rn-placeholder';
import Space from "../space/index.js";
import Theme from "../theme/index.js";
import SkeletonActive from "./skeleton-active.js";
import { varCreator } from "./style.js";
import { jsx as _jsx } from "react/jsx-runtime";
const SkeletonParagraph = ({
  theme,
  active = true,
  rows,
  widths,
  testID
}) => {
  const [CV] = Theme.useStyle({
    varCreator,
    theme
  });
  const style = useMemo(() => ({
    backgroundColor: CV.skeleton_color
  }), [CV.skeleton_color]);
  const paragraphs = useMemo(() => new Array(rows).fill(0).map((_, i) => i), [rows]);
  const nodeJSX = /*#__PURE__*/_jsx(Space, {
    testID: testID,
    children: paragraphs.map(n => {
      return /*#__PURE__*/_jsx(PlaceholderLine, {
        width: widths?.[n],
        style: style,
        noMargin: true
      }, n);
    })
  });
  if (active) {
    return /*#__PURE__*/_jsx(SkeletonActive, {
      children: nodeJSX
    });
  }

  // eslint-disable-next-line react/jsx-no-useless-fragment
  return nodeJSX;
};
export default /*#__PURE__*/memo(SkeletonParagraph);
//# sourceMappingURL=skeleton-paragraph.js.map