Merge branch 'context'

src/createModal/demos/RootContainer.tsx

@@ -0,0 +1,23 @@
+import React from 'react';
+import { ConfigProvider } from 'antd';
+import zhCN from 'antd/locale/zh_CN';
+
+const RootContainer: React.FC<React.PropsWithChildren> = ({ children }) => (
+  <ConfigProvider
+    locale={zhCN}
+    theme={{
+      token: {
+        // Seed Token，影响范围大
+        colorPrimary: '#00b96b',
+        borderRadius: 18,
+
+        // 派生变量，影响范围小
+        colorBgContainer: '#f6ffed',
+      },
+    }}
+  >
+    {children}
+  </ConfigProvider>
+);
+
+export default RootContainer;

src/createModal/demos/context.tsx

@@ -0,0 +1,22 @@
+import React from 'react';
+import { Button } from 'antd';
+import { createModal } from 'create-antd-modal';
+import RootContainer from './RootContainer';
+
+const Demo: React.FC = () => {
+  return (
+    <Button
+      onClick={() => {
+        createModal({
+          title: 'Some title',
+          content: 'You can see that the i18n and theme configuration works now',
+          container: RootContainer,
+        });
+      }}
+    >
+      Custom Container
+    </Button>
+  );
+};
+
+export default Demo;

src/createModal/index.md

@@ -39,6 +39,14 @@ group:
   desc="Custom Component is treated like a form."
 />
 
+### Custom Container
+
+<code
+  title="Custom Container"
+  src="./demos/context.tsx"
+  desc="Get Context through Custom Container"
+/>
+
 <API>Everything else is the same as [Modal](https://ant.design/components/modal/#header).
 
 Returns:

src/createModal/index.tsx

@@ -52,6 +52,11 @@ export type CreateModalProps<T, R = undefined> = Omit<
    * @description.zh-CN “拒绝”按钮（传入此字段才显示）事件，返回 promise 可以延迟关闭
    * */
   // onDeny?: (values?: T) => Promise<void> | void;
+  /**
+   * @description Container for Modal, usually various Context.Provider
+   * @description.zh-CN Modal 的容器，通常为各种 Context.Provider
+   */
+  container?: React.FC<React.PropsWithChildren>;
 };
 
 export type CreateModalReturn<T, R> = {
@@ -70,6 +75,7 @@ function App<T, R>({
   onOk,
   onCancel,
   onFailed,
+  container: Container,
   // onDeny,
   // denyText,
   // hideCancel = false,
@@ -141,7 +147,7 @@ function App<T, R>({
     });
   };
 
-  return (
+  const returnedElement = (
     // <LocaleReceiver componentName="Modal">
     //   {(contextLocale) => (
     <Modal
@@ -179,6 +185,7 @@ function App<T, R>({
     //   )}
     // </LocaleReceiver>
   );
+  return Container ? <Container>{returnedElement}</Container> : returnedElement;
 }
 
 /**
@@ -235,3 +242,7 @@ export default function createModal<T, R = void>(
   });
   return { destory, promise: defered };
 }
+
+// export function createFunction(render: (child: React)) {
+
+// }