feat: add modal component

mnkmove · Mar 16, 2023 · 3ce97a3 · 3ce97a3
1 parent c949f79
commit 3ce97a3
Show file tree

Hide file tree

Showing 36 changed files with 24,992 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,5 @@
+
+
+/node_modules/
+
+/examples/node_modules/
diff --git a/babel.config.js b/babel.config.js
@@ -0,0 +1,9 @@
+
+
+
+module.exports = {
+ presets: [
+ '@babel/preset-env',
+ ['@babel/preset-react', { runtime: 'automatic' }],
+ ]
+}
diff --git a/dist/cjs/index.js b/dist/cjs/index.js
diff --git a/dist/cjs/index.js.map b/dist/cjs/index.js.map
diff --git a/dist/cjs/types/8d.d.ts b/dist/cjs/types/8d.d.ts
@@ -0,0 +1,6 @@
+/// <reference types="react" />
+interface props {
+ locale: string;
+}
+export default function _8d(config: props): (props: any) => JSX.Element;
+export {};
diff --git a/dist/cjs/types/_test.d.ts b/dist/cjs/types/_test.d.ts
@@ -0,0 +1 @@
+export {};
diff --git a/dist/cjs/types/components/index.d.ts b/dist/cjs/types/components/index.d.ts
@@ -0,0 +1,2 @@
+export { default as Upload } from './upload';
+export { default as Modal } from './modal/modal';
diff --git a/dist/cjs/types/components/modal/modal.d.ts b/dist/cjs/types/components/modal/modal.d.ts
@@ -0,0 +1,34 @@
+import { ReactElement } from 'react';
+type ModalProps = {
+ /**
+ * css class name
+ */
+ className?: string;
+ children: ReactElement;
+ /**
+ * visible control
+ */
+ visible?: boolean;
+ /**
+ * modal content width
+ */
+ width?: number;
+ /**
+ * callback of mask clicked
+ */
+ onClose?: Function;
+ /**
+ *
+ */
+ dontDestroyOnClose?: boolean;
+ /**
+ * inline style
+ */
+ style?: any;
+ /**
+ * framer-motion configaration please refer ## https://www.framer.com/motion/motion-config/
+ * */
+ motionConfig?: any;
+};
+export default function Modal(props: ModalProps): JSX.Element | null;
+export {};
diff --git a/dist/cjs/types/components/upload/index.d.ts b/dist/cjs/types/components/upload/index.d.ts
@@ -0,0 +1,8 @@
+/// <reference types="react" />
+interface IUploadProps {
+ url: string;
+ name: string;
+ onClick(): void;
+}
+export default function Upload(props: IUploadProps): JSX.Element;
+export {};
diff --git a/dist/cjs/types/index.d.ts b/dist/cjs/types/index.d.ts
@@ -0,0 +1 @@
+export * from './components';
diff --git a/dist/esm/index.js b/dist/esm/index.js
diff --git a/dist/esm/index.js.map b/dist/esm/index.js.map
diff --git a/dist/esm/types/8d.d.ts b/dist/esm/types/8d.d.ts
@@ -0,0 +1,6 @@
+/// <reference types="react" />
+interface props {
+ locale: string;
+}
+export default function _8d(config: props): (props: any) => JSX.Element;
+export {};
diff --git a/dist/esm/types/_test.d.ts b/dist/esm/types/_test.d.ts
@@ -0,0 +1 @@
+export {};
diff --git a/dist/esm/types/components/index.d.ts b/dist/esm/types/components/index.d.ts
@@ -0,0 +1,2 @@
+export { default as Upload } from './upload';
+export { default as Modal } from './modal/modal';
diff --git a/dist/esm/types/components/modal/modal.d.ts b/dist/esm/types/components/modal/modal.d.ts
@@ -0,0 +1,34 @@
+import { ReactElement } from 'react';
+type ModalProps = {
+ /**
+ * css class name
+ */
+ className?: string;
+ children: ReactElement;
+ /**
+ * visible control
+ */
+ visible?: boolean;
+ /**
+ * modal content width
+ */
+ width?: number;
+ /**
+ * callback of mask clicked
+ */
+ onClose?: Function;
+ /**
+ *
+ */
+ dontDestroyOnClose?: boolean;
+ /**
+ * inline style
+ */
+ style?: any;
+ /**
+ * framer-motion configaration please refer ## https://www.framer.com/motion/motion-config/
+ * */
+ motionConfig?: any;
+};
+export default function Modal(props: ModalProps): JSX.Element | null;
+export {};
diff --git a/dist/esm/types/components/upload/index.d.ts b/dist/esm/types/components/upload/index.d.ts
@@ -0,0 +1,8 @@
+/// <reference types="react" />
+interface IUploadProps {
+ url: string;
+ name: string;
+ onClick(): void;
+}
+export default function Upload(props: IUploadProps): JSX.Element;
+export {};
diff --git a/dist/esm/types/index.d.ts b/dist/esm/types/index.d.ts
@@ -0,0 +1 @@
+export * from './components';
diff --git a/dist/index.d.ts b/dist/index.d.ts
@@ -0,0 +1,44 @@
+/// <reference types="react" />
+import { ReactElement } from 'react';
+
+interface IUploadProps {
+ url: string;
+ name: string;
+ onClick(): void;
+}
+declare function Upload(props: IUploadProps): JSX.Element;
+
+type ModalProps = {
+ /**
+ * css class name
+ */
+ className?: string;
+ children: ReactElement;
+ /**
+ * visible control
+ */
+ visible?: boolean;
+ /**
+ * modal content width
+ */
+ width?: number;
+ /**
+ * callback of mask clicked
+ */
+ onClose?: Function;
+ /**
+ *
+ */
+ dontDestroyOnClose?: boolean;
+ /**
+ * inline style
+ */
+ style?: any;
+ /**
+ * framer-motion configaration please refer ## https://www.framer.com/motion/motion-config/
+ * */
+ motionConfig?: any;
+};
+declare function Modal(props: ModalProps): JSX.Element | null;
+
+export { Modal, Upload };
diff --git a/index.html b/index.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Document</title>
+</head>
+
+<body>
+ <div id="app"></div>
+</body>
+
+</html>
diff --git a/jest.config.js b/jest.config.js
@@ -0,0 +1,13 @@
+
+
+module.exports = {
+ preset: 'ts-jest',
+ testEnvironment: 'jsdom',
+ moduleNameMapper: {
+ // 模块名称映射，以便在测试代码中导入模块时使用
+ // 这里将 CSS、图片等静态资源的导入映射为 'mocks/fileMock.js'
+ '\\.(css|less|sass|scss)$': 'identity-obj-proxy',
+ '\\.(gif|ttf|eot|svg)$': '<rootDir>/mocks/fileMock.js',
+ },
+ // setupFilesAfterEnv: ['@testing-library/jest-dom/extend-expect'],
+};
diff --git a/mock/fileMock.js b/mock/fileMock.js
@@ -0,0 +1,2 @@
+
+module.exports = 'test-file-stub';