easy-antd-modal/es/modal/index.js

二次开发, 简化 Ant Design Modal 的使用方式

import { useModalEnhanced } from '@wuxh/use-modal-enhanced';
import { Modal as AntdModal } from 'antd';
import { useMergeOpen, usePrefixCls } from "../hooks";
import { INNER_STATE } from "../hooks/useMergeOpen";

/** @internal */

/**
 * @description 方便用户自定义 `Modal` 的 `props`
 * @see [easy-antd-modal/typescript](https://wxh16144.github.io/easy-antd-modal/typescript)
 * @example
 * ```tsx
 * // 这段可以直接添加到你的任何 `.ts` 文件中，例如 `antd-modal.ts`
 * // 也可以添加到一个 `.d.ts` 文件中。确保这个文件包含在项目的 `tsconfig.json` 中的 "file" 字段内。
 * import 'easy-antd-modal'
 *
 * declare module 'easy-antd-modal' {
 *  interface ModalProps {
 *    // `antd` 的 `Modal` 组件的 `visible` 属性
 *    visible?: boolean
 *  }
 * }
 *
 * // 为了确保这个文件被当作一个模块，添加至少一个 `export` 声明
 * export {}
 * ```
 */

/**
 * @description 方便用户自定义 `Modal` 的 `props`
 * @since 1.6.0
 */
import { jsx as _jsx } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
/** @see [easy-antd-modal#Modal](https://github.com/Wxh16144/easy-antd-modal/blob/master/src/modal/index.tsx) */
const Modal = props => {
  const prefixCls = usePrefixCls('modal', props.prefixCls);
  const [visible, {
    close
  }, {
    trigger,
    content
  }, restProps] = useModalEnhanced(props);
  const handleModalOk = event => {
    props.onOk?.(event);
    close();
  };
  const handleModalCancel = event => {
    close('onCancel', event);
  };
  const openProp = useMergeOpen({
    [INNER_STATE]: visible,
    ...props
  });
  return /*#__PURE__*/_jsxs(_Fragment, {
    children: [trigger, /*#__PURE__*/_jsx(AntdModal, {
      ...restProps,
      ...openProp,
      prefixCls: prefixCls,
      onOk: handleModalOk,
      onCancel: handleModalCancel,
      children: content
    })]
  });
};

/**
 * Antd 的一些静态方法（不推荐使用，为什么：https://ant.design/docs/blog/why-not-static-cn)
 */

let initialized = false;
if (!initialized) {
  for (const key in AntdModal) {
    if (Object.prototype.hasOwnProperty.call(AntdModal, key)) {
      Modal[key] = AntdModal[key];
    }
  }
  initialized = true;
}

// fixme: 类型体操太累了
export default Modal;