@lobehub/charts/es/common/NoData.js

React modern charts components built on recharts

import { Empty } from 'antd';
import { useTheme } from 'antd-style';
import { isValidElement, memo } from 'react';
import { Center, Flexbox } from 'react-layout-kit';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var NoData = /*#__PURE__*/memo(function (_ref) {
  var _ref$noDataText = _ref.noDataText,
    noDataText = _ref$noDataText === void 0 ? {
      desc: "There's no data available for your selection.",
      title: 'No Data'
    } : _ref$noDataText,
    className = _ref.className;
  var theme = useTheme();
  var isReactNodeText = /*#__PURE__*/isValidElement(noDataText);
  return /*#__PURE__*/_jsx(Center, {
    height: '100%',
    width: '100%',
    children: /*#__PURE__*/_jsx(Empty, {
      className: className,
      description: isReactNodeText ? noDataText : /*#__PURE__*/_jsxs(Flexbox, {
        padding: 8,
        children: [/*#__PURE__*/_jsx("div", {
          style: {
            color: theme.colorText,
            fontSize: 14,
            fontWeight: 'bold'
          },
          children: noDataText === null || noDataText === void 0 ? void 0 : noDataText.title
        }), /*#__PURE__*/_jsx("div", {
          style: {
            color: theme.colorTextDescription,
            fontSize: 12
          },
          children: noDataText === null || noDataText === void 0 ? void 0 : noDataText.desc
        })]
      }),
      image: Empty.PRESENTED_IMAGE_SIMPLE
    })
  });
});
export default NoData;