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

🌈 React Native UI library

"use strict";

import isNil from 'lodash/isNil';
import React, { isValidElement, memo } from 'react';
import { View, Text, TouchableWithoutFeedback } from 'react-native';
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import Popup from "../popup/popup.js";
import Theme from "../theme/index.js";
import { varCreator, styleCreator } from "./style.js";

/**
 * Notify 消息提示
 * @description 在页面顶部展示消息提示，支持函数调用和组件调用两种方式。
 * @description 原计划 Notify 的 Props 继承 TouchableWithoutFeedbackProps，更贴近 React Native 提供的组件，这里需要把 Popup 中通用的属性提取出来，如果以后涉及到改动，有点麻烦，等大部分组件完整后看看怎么优化。
 */
import { jsx as _jsx } from "react/jsx-runtime";
const Notify = ({
  children,
  theme,
  style,
  textStyle,
  type = 'primary',
  message,
  color,
  backgroundColor,
  onPress,
  ...restProps
}) => {
  const insets = useSafeAreaInsets();
  const [CV, STYLES] = Theme.useStyle({
    varCreator,
    styleCreator,
    theme
  });
  const messageJSX = !isNil(message) ? /*#__PURE__*/isValidElement(message) ? message : /*#__PURE__*/_jsx(Text, {
    style: [STYLES.text, {
      color: !isNil(color) ? color : CV.notify_text_color
    }, textStyle],
    numberOfLines: 1,
    children: message
  }) : children;
  return /*#__PURE__*/_jsx(Popup, {
    ...restProps,
    overlay: false,
    position: "top",
    children: /*#__PURE__*/_jsx(TouchableWithoutFeedback, {
      onPress: onPress,
      children: /*#__PURE__*/_jsx(View, {
        style: [STYLES.notify, {
          backgroundColor: !isNil(backgroundColor) ? backgroundColor : CV[`notify_${type}_background_color`] || CV.notify_primary_background_color,
          paddingTop: insets.top > CV.notify_padding_vertical ? insets.top : CV.notify_padding_vertical
        }, style],
        children: messageJSX
      })
    })
  });
};
export default /*#__PURE__*/memo(Notify);
//# sourceMappingURL=notify.js.map