doui-react 1.0.0

package/lib/input/style/index.js

@@ -0,0 +1,18 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = require("@emotion/react");
+var _templateObject, _templateObject2, _templateObject3;
+var style = {
+  wrapper: (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)([""]))),
+  number: (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n    width: 100%;\n  "]))),
+  textArea: function textArea(resize) {
+    return (0, _react.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n    resize: ", ";\n  "])), !resize && 'none');
+  }
+};
+var _default = exports.default = style;

package/lib/input/type/index.d.ts

@@ -0,0 +1,41 @@
+import { BaseComponentProps } from "../../api";
+import { inputMap } from "../component";
+import { validateTypeMap } from "../component/utils";
+import { InputProps as AntdInputProps } from 'antd';
+import { InputNumberProps } from 'antd/lib/input-number';
+import { PasswordProps } from 'antd/lib/input/Password';
+import { TextAreaProps } from 'antd/lib/input/TextArea';
+type UnionType = BaseComponentProps & AntdInputProps & TextAreaProps & InputNumberProps & PasswordProps;
+export interface InputProps extends Omit<UnionType, 'form' | 'onChange'> {
+    /**
+     * @description 输入框类型
+     * @default input
+     */
+    type?: keyof typeof inputMap;
+    /**
+     * @description 校验规则，可以支持正则表达式或函数
+     * @default default
+     */
+    validate?: keyof typeof validateTypeMap | RegExp | ((value: string) => boolean);
+    /**
+     * @description 是否允许输入框拉伸（当 `type` 为 `textarea` 时生效）
+     * @default true
+     */
+    resize?: boolean;
+    /**
+     * @description 是否允许输入换行（当 `type` 为 `textarea` 时生效）
+     * @default true
+     */
+    allowEnter?: boolean;
+    /**
+     * @description 当值为空时，是否重置输入框
+     * @default false
+     */
+    allowResetOnEmpty?: boolean;
+    /**
+     * @description 输入框值改变的回调
+     */
+    onChange?(value?: string | number): void;
+    name?: string;
+}
+export {};

package/lib/input/type/index.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/modal-prompt/component/index.d.ts

@@ -0,0 +1,5 @@
+import { ConfirmModalProps, ModalFuncProps } from '../type';
+export * from './open-loading';
+export declare function openConfirm({ showCancel, ...props }: ConfirmModalProps): Promise<boolean>;
+export declare function openSuccess(props: ModalFuncProps): Promise<void>;
+export declare function openError(props: ModalFuncProps): Promise<void>;

package/lib/modal-prompt/component/index.js

@@ -0,0 +1,85 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  openConfirm: true,
+  openSuccess: true,
+  openError: true
+};
+exports.openConfirm = openConfirm;
+exports.openError = openError;
+exports.openSuccess = openSuccess;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _icons = require("@ant-design/icons");
+var _antd = require("antd");
+var _utils = require("./utils");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+var _openLoading = require("./open-loading");
+Object.keys(_openLoading).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _openLoading[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _openLoading[key];
+    }
+  });
+});
+var _excluded = ["showCancel"];
+function openConfirm(_ref) {
+  var _ref$showCancel = _ref.showCancel,
+    showCancel = _ref$showCancel === void 0 ? true : _ref$showCancel,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var mergedProps = (0, _objectSpread2.default)({
+    icon: (0, _jsxRuntime.jsx)(_icons.ExclamationCircleFilled, {
+      style: {
+        fontSize: 18
+      }
+    }),
+    style: {
+      top: '30vh'
+    },
+    keyboard: false,
+    autoFocusButton: null,
+    cancelButtonProps: {
+      style: {
+        display: showCancel ? 'unset' : 'none'
+      }
+    }
+  }, props);
+  return new Promise(function (resolve) {
+    _antd.Modal.confirm((0, _objectSpread2.default)((0, _objectSpread2.default)({}, mergedProps), {}, {
+      onOk: function onOk() {
+        return resolve(true);
+      },
+      onCancel: function onCancel() {
+        return resolve(false);
+      }
+    }));
+  });
+}
+function openSuccess(props) {
+  return (0, _utils.openModalFunction)((0, _objectSpread2.default)({
+    type: 'success',
+    icon: (0, _jsxRuntime.jsx)(_icons.CheckCircleFilled, {
+      style: {
+        fontSize: 20
+      }
+    })
+  }, props));
+}
+function openError(props) {
+  return (0, _utils.openModalFunction)((0, _objectSpread2.default)({
+    type: 'error',
+    icon: (0, _jsxRuntime.jsx)(_icons.CloseCircleFilled, {
+      style: {
+        fontSize: 20
+      }
+    })
+  }, props));
+}

package/lib/modal-prompt/component/open-loading.d.ts

@@ -0,0 +1,2 @@
+import { OpenLoadingProps } from '../type';
+export declare function openLoading(props?: OpenLoadingProps): () => void;

package/lib/modal-prompt/component/open-loading.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.openLoading = openLoading;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _api = require("../../api");
+var _stack = require("../../stack");
+var _antd = require("antd");
+var _style = _interopRequireDefault(require("../style"));
+var _utils = require("./utils");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+var _excluded = ["maskStyle"];
+function LoadingContainer(props) {
+  var _generateSpinProps = (0, _utils.generateSpinProps)(props),
+    maskStyle = _generateSpinProps.maskStyle,
+    spinProps = (0, _objectWithoutProperties2.default)(_generateSpinProps, _excluded);
+  return (0, _jsxRuntime.jsx)(_stack.CenterStack, {
+    css: _style.default.wrapper(maskStyle),
+    children: (0, _jsxRuntime.jsx)(_antd.Spin, (0, _objectSpread2.default)({}, spinProps))
+  });
+}
+function openLoading(props) {
+  return (0, _api.mountComponent)(LoadingContainer, props);
+}

package/lib/modal-prompt/component/utils.d.ts

@@ -0,0 +1,4 @@
+import _ from 'lodash';
+import { ModalFuncProps } from '../type';
+export declare function openModalFunction(props: ModalFuncProps): Promise<void>;
+export declare function generateSpinProps(props: any): _.Omit<any, "unmount" | "getContainer">;

package/lib/modal-prompt/component/utils.js

@@ -0,0 +1,57 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.generateSpinProps = generateSpinProps;
+exports.openModalFunction = openModalFunction;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _antd = require("antd");
+var _lodash = _interopRequireDefault(require("lodash"));
+var _excluded = ["showOk", "duration"],
+  _excluded2 = ["type", "duration"];
+function mergeProps(props) {
+  var showOk = props.showOk,
+    _props$duration = props.duration,
+    duration = _props$duration === void 0 ? 3000 : _props$duration,
+    restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
+  return _lodash.default.merge({
+    style: {
+      top: '56px'
+    },
+    keyboard: false,
+    closable: true,
+    className: showOk ? '' : '',
+    okButtonProps: {
+      style: {
+        display: showOk ? 'unset' : 'none'
+      }
+    },
+    duration: showOk ? 0 : duration
+  }, restProps);
+}
+function openModalFunction(props) {
+  var _mergeProps = mergeProps(props),
+    _mergeProps$type = _mergeProps.type,
+    type = _mergeProps$type === void 0 ? 'info' : _mergeProps$type,
+    duration = _mergeProps.duration,
+    restProps = (0, _objectWithoutProperties2.default)(_mergeProps, _excluded2);
+  return new Promise(function (resolve) {
+    var modal = _antd.Modal[type]((0, _objectSpread2.default)((0, _objectSpread2.default)({}, restProps), {}, {
+      onOk: function onOk() {
+        return resolve();
+      }
+    }));
+    if (duration) {
+      setTimeout(function () {
+        modal.destroy();
+        resolve();
+      }, duration);
+    }
+  });
+}
+function generateSpinProps(props) {
+  return _lodash.default.omit(props, ['unmount', 'getContainer']);
+}

package/lib/modal-prompt/index.d.ts

@@ -0,0 +1,2 @@
+export * from './component';
+export * from './type';

package/lib/modal-prompt/index.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _component = require("./component");
+Object.keys(_component).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _component[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _component[key];
+    }
+  });
+});
+var _type = require("./type");
+Object.keys(_type).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _type[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _type[key];
+    }
+  });
+});

package/lib/modal-prompt/style/index.d.ts

@@ -0,0 +1,5 @@
+import { Records } from "../../api";
+declare const style: {
+    wrapper: (maskStyle?: Records) => import("@emotion/react").SerializedStyles;
+};
+export default style;

package/lib/modal-prompt/style/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = require("@emotion/react");
+var _templateObject;
+var style = {
+  wrapper: function wrapper(maskStyle) {
+    return (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    position: fixed;\n    z-index: 99999;\n    inset: 0;\n\n    ", ";\n  "])), maskStyle);
+  }
+};
+var _default = exports.default = style;

package/lib/modal-prompt/type/index.d.ts

@@ -0,0 +1,36 @@
+import { ModalFuncProps as AntdModalFuncProps } from 'antd/lib/modal/Modal';
+import { SpinProps } from 'antd/lib/spin';
+import { CSSProperties, ReactNode } from 'react';
+export interface ConfirmModalProps extends AntdModalFuncProps {
+    /**
+     * @description 弹窗标题
+     */
+    title: ReactNode;
+    /**
+     * @description 是否显示取消按钮
+     * @default true
+     */
+    showCancel?: boolean;
+}
+export interface ModalFuncProps extends AntdModalFuncProps {
+    /**
+     * @description 弹窗标题
+     */
+    title: ReactNode;
+    /**
+     * @description 是否显示确定按钮，当 `showOk` 为 `true` 时，弹框不会自动关闭
+     * @default false
+     */
+    showOk?: boolean;
+    /**
+     * @description 显示时长，单位为毫秒，超时后自动关闭，设置为 `0` 或 `false` 则不会自动关闭
+     * @default 3000
+     */
+    duration?: number | false;
+}
+export interface OpenLoadingProps extends SpinProps {
+    /**
+     * @description 遮罩样式
+     */
+    maskStyle?: CSSProperties;
+}

package/lib/modal-prompt/type/index.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/open-modal/component/constant.d.ts

@@ -0,0 +1 @@
+export declare const formPropsKeys: string[];

package/lib/open-modal/component/constant.js

@@ -0,0 +1,10 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.formPropsKeys = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _constant = require("../../form/component/constant");
+var formPropsKeys = exports.formPropsKeys = [].concat((0, _toConsumableArray2.default)(_constant.antdFormPropsKeys), ['children', 'content', 'footer', 'onValidate', 'onMount', 'validateOnMount', 'focusFirstOnMount', 'initialContext', 'formItemMarginBottom', 'loading', 'debug']);

package/lib/open-modal/component/footer.d.ts

@@ -0,0 +1,2 @@
+import { HStackProps } from "../../stack";
+export declare function Footer({ className, children: Children, ...props }: HStackProps): import("@emotion/react/jsx-runtime").JSX.Element;

package/lib/open-modal/component/footer.js

@@ -0,0 +1,41 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Footer = Footer;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _form = require("../../form");
+var _portal = require("../../portal");
+var _stack = require("../../stack");
+var _css = require("@emotion/css");
+var _lodash = _interopRequireDefault(require("lodash"));
+var _reactUse = require("react-use");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+var _excluded = ["className", "children"];
+function Footer(_ref) {
+  var className = _ref.className,
+    Children = _ref.children,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  var _useFormContext = (0, _form.useFormContext)(),
+    setModalProps = _useFormContext.setModalProps;
+  (0, _reactUse.useMount)(function () {
+    setModalProps({
+      footer: null
+    });
+  });
+  var component = _lodash.default.isFunction(Children) ? (0, _jsxRuntime.jsx)(Children, {}) : Children;
+  return (0, _jsxRuntime.jsx)(_portal.Portal, {
+    container: function container(current) {
+      return current.closest('.ant-modal-content');
+    },
+    children: (0, _jsxRuntime.jsx)(_stack.HStack, (0, _objectSpread2.default)((0, _objectSpread2.default)({
+      className: (0, _css.cx)('ant-modal-footer', className),
+      justify: "right"
+    }, props), {}, {
+      children: component
+    }))
+  });
+}

package/lib/open-modal/component/index.d.ts

@@ -0,0 +1,4 @@
+import { OpenModalProps } from '../type';
+export * from './modal';
+export declare function openModal(props: OpenModalProps): () => void;
+export declare function closeModal(): void;

package/lib/open-modal/component/index.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {
+  openModal: true,
+  closeModal: true
+};
+exports.closeModal = closeModal;
+exports.openModal = openModal;
+var _api = require("../../api");
+var _modal = require("./modal");
+Object.keys(_modal).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _modal[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _modal[key];
+    }
+  });
+});
+function openModal(props) {
+  return (0, _api.mountComponent)(_modal.Modal, props);
+}
+function closeModal() {
+  (0, _api.unmountComponent)();
+}

package/lib/open-modal/component/modal.d.ts

@@ -0,0 +1,10 @@
+import { FC } from 'react';
+import { OpenModalProps } from '../type';
+import { Footer } from './footer';
+import { Title } from './title';
+export declare const Modal: ModalType;
+type ModalType = FC<OpenModalProps> & {
+    Footer: typeof Footer;
+    Title: typeof Title;
+};
+export {};

package/lib/open-modal/component/modal.js

@@ -0,0 +1,44 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Modal = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _form = require("../../form");
+var _text = require("../../text");
+var _antd = require("antd");
+var _hook = require("../hook");
+var _footer = require("./footer");
+var _title = require("./title");
+var _useModal2 = require("./use-modal");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+var Modal = exports.Modal = function Modal(props) {
+  var _useModal = (0, _useModal2.useModal)(props),
+    context = _useModal.context,
+    open = _useModal.open,
+    modalProps = _useModal.modalProps,
+    formProps = _useModal.formProps;
+  var confirmLoading = context.confirmLoading,
+    ok = context.ok,
+    close = context.close;
+  return (0, _jsxRuntime.jsx)(_hook.ModalProvider, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, context), {}, {
+    children: (0, _jsxRuntime.jsx)(_antd.Modal, (0, _objectSpread2.default)((0, _objectSpread2.default)({
+      open: open,
+      destroyOnClose: true
+    }, modalProps), {}, {
+      title: (0, _jsxRuntime.jsx)(_text.Text, {
+        children: modalProps.title
+      }),
+      confirmLoading: confirmLoading,
+      onCancel: close,
+      onOk: ok,
+      children: (0, _jsxRuntime.jsx)(_form.Form, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, formProps), {}, {
+        context: context
+      }))
+    }))
+  }));
+};
+Modal.Footer = _footer.Footer;
+Modal.Title = _title.Title;

package/lib/open-modal/component/title.d.ts

@@ -0,0 +1,6 @@
+import { ReactNode } from 'react';
+interface TitleProps {
+    children: ReactNode;
+}
+export declare function Title({ children }: TitleProps): import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/lib/open-modal/component/title.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Title = Title;
+var _portal = require("../../portal");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+function Title(_ref) {
+  var children = _ref.children;
+  return (0, _jsxRuntime.jsx)(_portal.Portal, {
+    container: function container(current) {
+      var _current$closest;
+      return (_current$closest = current.closest('.ant-modal-content')) === null || _current$closest === void 0 ? void 0 : _current$closest.querySelector('.ant-modal-title');
+    },
+    children: children
+  });
+}

package/lib/open-modal/component/use-modal.d.ts

@@ -0,0 +1,14 @@
+import { OpenModalProps } from "..";
+export declare function useModal({ context: outerContext, ...props }: OpenModalProps): {
+    open: boolean;
+    context: {
+        form: any;
+        confirmLoading: boolean;
+        isValidForm: boolean;
+        setModalProps: (parameter: Partial<OpenModalProps>) => void;
+        close: () => Promise<void>;
+        ok: () => Promise<void>;
+    };
+    modalProps: any;
+    formProps: any;
+};