linkmore-design 1.1.20 → 1.1.22-beta.1

package/es/Form/FormItem/ItemHolder.js

@@ -0,0 +1,152 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+import CheckCircleFilled from '@ant-design/icons/CheckCircleFilled';
+import CloseCircleFilled from '@ant-design/icons/CloseCircleFilled';
+import ExclamationCircleFilled from '@ant-design/icons/ExclamationCircleFilled';
+import LoadingOutlined from '@ant-design/icons/LoadingOutlined';
+import useLayoutEffect from 'rc-util/lib/hooks/useLayoutEffect';
+import classNames from 'classnames';
+import * as React from 'react';
+import omit from 'rc-util/lib/omit';
+import { Row } from '../../Grid';
+import FormItemLabel from '../FormItemLabel';
+import FormItemInput from '../FormItemInput';
+import { FormContext, FormItemInputContext, NoStyleItemContext } from '../context';
+import useDebounce from '../hooks/useDebounce';
+var iconMap = {
+  success: CheckCircleFilled,
+  warning: ExclamationCircleFilled,
+  error: CloseCircleFilled,
+  validating: LoadingOutlined
+};
+export default function ItemHolder(props) {
+  var _itemClassName;
+
+  var prefixCls = props.prefixCls,
+      className = props.className,
+      style = props.style,
+      help = props.help,
+      errors = props.errors,
+      warnings = props.warnings,
+      validateStatus = props.validateStatus,
+      meta = props.meta,
+      hasFeedback = props.hasFeedback,
+      hidden = props.hidden,
+      children = props.children,
+      fieldId = props.fieldId,
+      isRequired = props.isRequired,
+      responsive = props.responsive,
+      _props$errorPlacement = props.errorPlacement,
+      errorPlacement = _props$errorPlacement === void 0 ? 'default' : _props$errorPlacement,
+      onSubItemMetaChange = props.onSubItemMetaChange,
+      restProps = __rest(props, ["prefixCls", "className", "style", "help", "errors", "warnings", "validateStatus", "meta", "hasFeedback", "hidden", "children", "fieldId", "isRequired", "responsive", "errorPlacement", "onSubItemMetaChange"]);
+
+  var itemPrefixCls = "".concat(prefixCls, "-item");
+
+  var _React$useContext = React.useContext(FormContext),
+      requiredMark = _React$useContext.requiredMark; // ======================== Margin ========================
+
+
+  var itemRef = React.useRef(null);
+  var debounceErrors = useDebounce(errors);
+  var debounceWarnings = useDebounce(warnings);
+  var hasHelp = help !== undefined && help !== null;
+  var hasError = !!(hasHelp || errors.length || warnings.length);
+
+  var _React$useState = React.useState(null),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      marginBottom = _React$useState2[0],
+      setMarginBottom = _React$useState2[1];
+
+  useLayoutEffect(function () {
+    if (hasError && itemRef.current) {
+      var itemStyle = getComputedStyle(itemRef.current);
+      setMarginBottom(parseInt(itemStyle.marginBottom, 10));
+    }
+  }, [hasError]);
+
+  var onErrorVisibleChanged = function onErrorVisibleChanged(nextVisible) {
+    if (!nextVisible) {
+      setMarginBottom(null);
+    }
+  }; // ======================== Status ========================
+
+
+  var mergedValidateStatus = '';
+
+  if (validateStatus !== undefined) {
+    mergedValidateStatus = validateStatus;
+  } else if (meta.validating) {
+    mergedValidateStatus = 'validating';
+  } else if (debounceErrors.length) {
+    mergedValidateStatus = 'error';
+  } else if (debounceWarnings.length) {
+    mergedValidateStatus = 'warning';
+  } else if (meta.touched) {
+    mergedValidateStatus = 'success';
+  }
+
+  var formItemStatusContext = React.useMemo(function () {
+    var feedbackIcon;
+
+    if (hasFeedback) {
+      var IconNode = mergedValidateStatus && iconMap[mergedValidateStatus];
+      feedbackIcon = IconNode ? /*#__PURE__*/React.createElement("span", {
+        className: classNames("".concat(itemPrefixCls, "-feedback-icon"), "".concat(itemPrefixCls, "-feedback-icon-").concat(mergedValidateStatus))
+      }, /*#__PURE__*/React.createElement(IconNode, null)) : null;
+    }
+
+    return {
+      status: mergedValidateStatus,
+      hasFeedback: hasFeedback,
+      feedbackIcon: feedbackIcon,
+      isFormItemInput: true
+    };
+  }, [mergedValidateStatus, hasFeedback]); // ======================== Render ========================
+
+  var itemClassName = (_itemClassName = {}, _defineProperty(_itemClassName, itemPrefixCls, true), _defineProperty(_itemClassName, "".concat(itemPrefixCls, "-with-help"), hasHelp || debounceErrors.length || debounceWarnings.length), _defineProperty(_itemClassName, "".concat(className), !!className), _defineProperty(_itemClassName, "".concat(itemPrefixCls, "-has-feedback"), mergedValidateStatus && hasFeedback), _defineProperty(_itemClassName, "".concat(itemPrefixCls, "-has-success"), mergedValidateStatus === 'success'), _defineProperty(_itemClassName, "".concat(itemPrefixCls, "-has-warning"), mergedValidateStatus === 'warning'), _defineProperty(_itemClassName, "".concat(itemPrefixCls, "-has-error"), mergedValidateStatus === 'error'), _defineProperty(_itemClassName, "".concat(itemPrefixCls, "-is-validating"), mergedValidateStatus === 'validating'), _defineProperty(_itemClassName, "".concat(itemPrefixCls, "-hidden"), hidden), _defineProperty(_itemClassName, 'lm_form-item-tip-error lm_form-item-tip-error-top', errorPlacement === 'top'), _defineProperty(_itemClassName, 'lm_form-item-tip-error lm_form-item-tip-error-left', errorPlacement === 'left'), _defineProperty(_itemClassName, 'lm_form-item-tip-error lm_form-item-tip-error-right', errorPlacement === 'right'), _defineProperty(_itemClassName, 'lm_form-item-tip-error lm_form-item-tip-error-bottom', errorPlacement === 'bottom'), _defineProperty(_itemClassName, 'ant-form-item-responsive', responsive), _itemClassName);
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(itemClassName),
+    style: style,
+    ref: itemRef
+  }, /*#__PURE__*/React.createElement(Row, Object.assign({
+    className: "".concat(itemPrefixCls, "-row")
+  }, omit(restProps, ['_internalItemRender', 'colon', 'dependencies', 'extra', 'fieldKey', 'getValueFromEvent', 'getValueProps', 'htmlFor', 'id', 'initialValue', 'isListField', 'label', 'labelAlign', 'labelCol', 'labelWrap', 'messageVariables', 'name', 'normalize', 'noStyle', 'preserve', 'required', 'requiredMark', 'rules', 'shouldUpdate', 'trigger', 'tooltip', 'validateFirst', 'validateTrigger', 'valuePropName', 'wrapperCol'])), /*#__PURE__*/React.createElement(FormItemLabel, Object.assign({
+    htmlFor: fieldId,
+    required: isRequired,
+    requiredMark: requiredMark
+  }, props, {
+    prefixCls: prefixCls
+  })), /*#__PURE__*/React.createElement(FormItemInput, Object.assign({}, props, meta, {
+    errors: debounceErrors,
+    warnings: debounceWarnings,
+    prefixCls: prefixCls,
+    status: mergedValidateStatus,
+    help: help,
+    marginBottom: marginBottom,
+    onErrorVisibleChanged: onErrorVisibleChanged
+  }), /*#__PURE__*/React.createElement(NoStyleItemContext.Provider, {
+    value: onSubItemMetaChange
+  }, /*#__PURE__*/React.createElement(FormItemInputContext.Provider, {
+    value: formItemStatusContext
+  }, children)))), !!marginBottom && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(itemPrefixCls, "-margin-offset"),
+    style: {
+      marginBottom: -marginBottom
+    }
+  }));
+}

package/es/Form/FormItem/index.d.ts

@@ -0,0 +1,43 @@
+import type { FormInstance } from 'rc-field-form';
+import type { FieldProps } from 'rc-field-form/lib/Field';
+import type { Rule } from 'rc-field-form/lib/interface';
+import * as React from 'react';
+import useFormItemStatus from '../hooks/useFormItemStatus';
+import type { FormItemInputProps } from '../FormItemInput';
+import type { FormItemLabelProps, LabelTooltipType } from '../FormItemLabel';
+declare const ValidateStatuses: ["success", "warning", "error", "validating", ""];
+export declare type ValidateStatus = typeof ValidateStatuses[number];
+declare type RenderChildren<Values = any> = (form: FormInstance<Values>) => React.ReactNode;
+declare type RcFieldProps<Values = any> = Omit<FieldProps<Values>, 'children'>;
+declare type ChildrenType<Values = any> = RenderChildren<Values> | React.ReactNode;
+export declare type LmRule = Rule & {
+    time?: number;
+};
+export interface FormItemProps<Values = any> extends FormItemLabelProps, FormItemInputProps, Omit<RcFieldProps<Values>, 'rules'> {
+    prefixCls?: string;
+    noStyle?: boolean;
+    style?: React.CSSProperties;
+    className?: string;
+    children?: ChildrenType<Values>;
+    id?: string;
+    hasFeedback?: boolean;
+    validateStatus?: ValidateStatus;
+    required?: boolean;
+    hidden?: boolean;
+    initialValue?: any;
+    messageVariables?: Record<string, string>;
+    tooltip?: LabelTooltipType;
+    /** @deprecated No need anymore */
+    fieldKey?: React.Key | React.Key[];
+    /** 变更 */
+    rules?: LmRule[];
+    errorPlacement?: string;
+    responsive?: boolean;
+}
+declare function InternalFormItem<Values = any>(props: FormItemProps<Values>): React.ReactElement;
+declare type InternalFormItemType = typeof InternalFormItem;
+interface FormItemInterface extends InternalFormItemType {
+    useStatus: typeof useFormItemStatus;
+}
+declare const FormItem: FormItemInterface;
+export default FormItem;

package/es/Form/FormItem/index.js

@@ -0,0 +1,321 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
+import { Field, FieldContext, ListContext } from 'rc-field-form';
+import useState from 'rc-util/lib/hooks/useState';
+import { supportRef } from 'rc-util/lib/ref';
+import * as React from 'react';
+import { useContext, useEffect, useRef } from 'react';
+import useFormItemStatus from '../hooks/useFormItemStatus';
+import { ConfigContext } from '../../ConfigProvider';
+import { cloneElement, isValidElement } from '../../_util/reactNode';
+import { tuple } from '../../_util/type';
+import warning from '../../_util/warning';
+import { FormContext, NoStyleItemContext } from '../context';
+import useFrameState from '../hooks/useFrameState';
+import useItemRef from '../hooks/useItemRef';
+import { getFieldId, toArray } from '../util';
+import ItemHolder from './ItemHolder';
+var NAME_SPLIT = '__SPLIT__';
+var ValidateStatuses = tuple('success', 'warning', 'error', 'validating', '');
+var MemoInput = /*#__PURE__*/React.memo(function (_ref) {
+  var children = _ref.children;
+  return children;
+}, function (prev, next) {
+  return prev.value === next.value && prev.update === next.update;
+});
+
+function hasValidName(name) {
+  if (name === null) {
+    warning(false, 'Form.Item', '`null` is passed as `name` property');
+  }
+
+  return !(name === undefined || name === null);
+}
+
+function genEmptyMeta() {
+  return {
+    errors: [],
+    warnings: [],
+    touched: false,
+    validating: false,
+    name: []
+  };
+}
+
+function getRuleTime(rules) {
+  if (!rules) {
+    return 0;
+  }
+
+  var _iterator = _createForOfIteratorHelper(rules),
+      _step;
+
+  try {
+    for (_iterator.s(); !(_step = _iterator.n()).done;) {
+      var rule = _step.value;
+
+      if (rule && _typeof(rule) === 'object' && rule.time) {
+        return rule.time;
+      }
+    }
+  } catch (err) {
+    _iterator.e(err);
+  } finally {
+    _iterator.f();
+  }
+
+  return 0;
+}
+
+function InternalFormItem(props) {
+  var name = props.name,
+      noStyle = props.noStyle,
+      dependencies = props.dependencies,
+      customizePrefixCls = props.prefixCls,
+      shouldUpdate = props.shouldUpdate,
+      rules = props.rules,
+      children = props.children,
+      required = props.required,
+      label = props.label,
+      messageVariables = props.messageVariables,
+      _props$trigger = props.trigger,
+      trigger = _props$trigger === void 0 ? 'onChange' : _props$trigger,
+      validateTrigger = props.validateTrigger,
+      hidden = props.hidden;
+  var timerRef = useRef(null);
+
+  var _useState = useState([]),
+      _useState2 = _slicedToArray(_useState, 2),
+      mergedErrors = _useState2[0],
+      setMergedErrors = _useState2[1];
+
+  var _useState3 = useState([]),
+      _useState4 = _slicedToArray(_useState3, 2),
+      mergedWarnings = _useState4[0],
+      setMergedWarnings = _useState4[1];
+
+  var _useContext = useContext(ConfigContext),
+      getPrefixCls = _useContext.getPrefixCls;
+
+  var _useContext2 = useContext(FormContext),
+      formName = _useContext2.name;
+
+  var isRenderProps = typeof children === 'function';
+  var notifyParentMetaChange = useContext(NoStyleItemContext);
+
+  var _useContext3 = useContext(FieldContext),
+      contextValidateTrigger = _useContext3.validateTrigger;
+
+  var mergedValidateTrigger = validateTrigger !== undefined ? validateTrigger : contextValidateTrigger;
+  var hasName = hasValidName(name);
+  var prefixCls = getPrefixCls('form', customizePrefixCls); // ========================= MISC =========================
+  // Get `noStyle` required info
+
+  var listContext = React.useContext(ListContext);
+  var fieldKeyPathRef = React.useRef(); // ======================== Errors ========================
+  // >>>>> Collect sub field errors
+
+  var _useFrameState = useFrameState({}),
+      _useFrameState2 = _slicedToArray(_useFrameState, 2),
+      subFieldErrors = _useFrameState2[0],
+      setSubFieldErrors = _useFrameState2[1]; // >>>>> Current field errors
+
+
+  var _useState5 = useState(function () {
+    return genEmptyMeta();
+  }),
+      _useState6 = _slicedToArray(_useState5, 2),
+      meta = _useState6[0],
+      setMeta = _useState6[1];
+
+  var onMetaChange = function onMetaChange(nextMeta) {
+    // This keyInfo is not correct when field is removed
+    // Since origin keyManager no longer keep the origin key anymore
+    // Which means we need cache origin one and reuse when removed
+    var keyInfo = listContext === null || listContext === void 0 ? void 0 : listContext.getKey(nextMeta.name); // Destroy will reset all the meta
+
+    setMeta(nextMeta.destroy ? genEmptyMeta() : nextMeta, true); // Bump to parent since noStyle
+
+    if (noStyle && notifyParentMetaChange) {
+      var namePath = nextMeta.name;
+
+      if (!nextMeta.destroy) {
+        if (keyInfo !== undefined) {
+          var _keyInfo = _slicedToArray(keyInfo, 2),
+              fieldKey = _keyInfo[0],
+              restPath = _keyInfo[1];
+
+          namePath = [fieldKey].concat(_toConsumableArray(restPath));
+          fieldKeyPathRef.current = namePath;
+        }
+      } else {
+        // Use origin cache data
+        namePath = fieldKeyPathRef.current || namePath;
+      }
+
+      notifyParentMetaChange(nextMeta, namePath);
+    }
+  }; // >>>>> Collect noStyle Field error to the top FormItem
+
+
+  var onSubItemMetaChange = function onSubItemMetaChange(subMeta, uniqueKeys) {
+    // Only `noStyle` sub item will trigger
+    setSubFieldErrors(function (prevSubFieldErrors) {
+      var clone = Object.assign({}, prevSubFieldErrors); // name: ['user', 1] + key: [4] = ['user', 4]
+
+      var mergedNamePath = [].concat(_toConsumableArray(subMeta.name.slice(0, -1)), _toConsumableArray(uniqueKeys));
+      var mergedNameKey = mergedNamePath.join(NAME_SPLIT);
+
+      if (subMeta.destroy) {
+        // Remove
+        delete clone[mergedNameKey];
+      } else {
+        // Update
+        clone[mergedNameKey] = subMeta;
+      }
+
+      return clone;
+    });
+  }; // >>>>> Get merged errors
+
+
+  useEffect(function () {
+    var errorList = _toConsumableArray(meta.errors);
+
+    var warningList = _toConsumableArray(meta.warnings);
+
+    Object.values(subFieldErrors).forEach(function (subFieldError) {
+      errorList.push.apply(errorList, _toConsumableArray(subFieldError.errors || []));
+      warningList.push.apply(warningList, _toConsumableArray(subFieldError.warnings || []));
+    });
+    setMergedErrors(errorList);
+    setMergedWarnings(warningList);
+    var time = getRuleTime(rules);
+
+    if (time) {
+      clearTimeout(timerRef.current);
+      timerRef.current = setTimeout(function () {
+        setMergedErrors([]);
+        setMergedWarnings([]);
+      }, time);
+    }
+  }, [subFieldErrors, meta.errors, meta.warnings]); // ===================== Children Ref =====================
+
+  var getItemRef = useItemRef(); // ======================== Render ========================
+
+  function renderLayout(baseChildren, fieldId, isRequired) {
+    if (noStyle && !hidden) {
+      return baseChildren;
+    }
+
+    return /*#__PURE__*/React.createElement(ItemHolder, Object.assign({
+      key: "row"
+    }, props, {
+      prefixCls: prefixCls,
+      fieldId: fieldId,
+      isRequired: isRequired,
+      errors: mergedErrors,
+      warnings: mergedWarnings,
+      meta: meta,
+      onSubItemMetaChange: onSubItemMetaChange
+    }), baseChildren);
+  }
+
+  if (!hasName && !isRenderProps && !dependencies) {
+    return renderLayout(children);
+  }
+
+  var variables = {};
+
+  if (typeof label === 'string') {
+    variables.label = label;
+  } else if (name) {
+    variables.label = String(name);
+  }
+
+  if (messageVariables) {
+    variables = Object.assign(Object.assign({}, variables), messageVariables);
+  } // >>>>> With Field
+
+
+  return /*#__PURE__*/React.createElement(Field, Object.assign({}, props, {
+    messageVariables: variables,
+    trigger: trigger,
+    validateTrigger: mergedValidateTrigger,
+    onMetaChange: onMetaChange
+  }), function (control, renderMeta, context) {
+    var mergedName = toArray(name).length && renderMeta ? renderMeta.name : [];
+    var fieldId = getFieldId(mergedName, formName);
+    var isRequired = required !== undefined ? required : !!(rules && rules.some(function (rule) {
+      if (rule && _typeof(rule) === 'object' && rule.required && !rule.warningOnly) {
+        return true;
+      }
+
+      if (typeof rule === 'function') {
+        var ruleEntity = rule(context);
+        return ruleEntity && ruleEntity.required && !ruleEntity.warningOnly;
+      }
+
+      return false;
+    })); // ======================= Children =======================
+
+    var mergedControl = Object.assign({}, control);
+    var childNode = null;
+    warning(!(shouldUpdate && dependencies), 'Form.Item', "`shouldUpdate` and `dependencies` shouldn't be used together. See https://ant.design/components/form/#dependencies.");
+
+    if (Array.isArray(children) && hasName) {
+      warning(false, 'Form.Item', '`children` is array of render props cannot have `name`.');
+      childNode = children;
+    } else if (isRenderProps && (!(shouldUpdate || dependencies) || hasName)) {
+      warning(!!(shouldUpdate || dependencies), 'Form.Item', '`children` of render props only work with `shouldUpdate` or `dependencies`.');
+      warning(!hasName, 'Form.Item', "Do not use `name` with `children` of render props since it's not a field.");
+    } else if (dependencies && !isRenderProps && !hasName) {
+      warning(false, 'Form.Item', 'Must set `name` or use render props when `dependencies` is set.');
+    } else if (isValidElement(children)) {
+      warning(children.props.defaultValue === undefined, 'Form.Item', '`defaultValue` will not work on controlled Field. You should use `initialValues` of Form instead.');
+      var childProps = Object.assign(Object.assign({}, children.props), mergedControl);
+
+      if (!childProps.id) {
+        childProps.id = fieldId;
+      }
+
+      if (supportRef(children)) {
+        childProps.ref = getItemRef(mergedName, children);
+      } // We should keep user origin event handler
+
+
+      var triggers = new Set([].concat(_toConsumableArray(toArray(trigger)), _toConsumableArray(toArray(mergedValidateTrigger))));
+      triggers.forEach(function (eventName) {
+        childProps[eventName] = function () {
+          var _a2, _c2;
+
+          var _a, _b, _c;
+
+          for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+            args[_key] = arguments[_key];
+          }
+
+          (_a = mergedControl[eventName]) === null || _a === void 0 ? void 0 : (_a2 = _a).call.apply(_a2, [mergedControl].concat(args));
+          (_c = (_b = children.props)[eventName]) === null || _c === void 0 ? void 0 : (_c2 = _c).call.apply(_c2, [_b].concat(args));
+        };
+      });
+      childNode = /*#__PURE__*/React.createElement(MemoInput, {
+        value: mergedControl[props.valuePropName || 'value'],
+        update: children
+      }, cloneElement(children, childProps));
+    } else if (isRenderProps && (shouldUpdate || dependencies) && !hasName) {
+      childNode = children(context);
+    } else {
+      warning(!mergedName.length, 'Form.Item', '`name` is only used for validate React element. If you are using Form.Item as layout display, please remove `name` instead.');
+      childNode = children;
+    }
+
+    return renderLayout(childNode, fieldId, isRequired);
+  });
+}
+
+var FormItem = InternalFormItem;
+FormItem.useStatus = useFormItemStatus;
+export default FormItem;

package/es/Form/FormItemInput.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+import type { ColProps } from '../Grid/col';
+import type { ValidateStatus } from './FormItem';
+interface FormItemInputMiscProps {
+    prefixCls: string;
+    children: React.ReactNode;
+    errors: React.ReactNode[];
+    warnings: React.ReactNode[];
+    marginBottom?: number | null;
+    onErrorVisibleChanged?: (visible: boolean) => void;
+    /** @private Internal Usage, do not use in any of your production. */
+    _internalItemRender?: {
+        mark: string;
+        render: (props: FormItemInputProps & FormItemInputMiscProps, domList: {
+            input: JSX.Element;
+            errorList: JSX.Element | null;
+            extra: JSX.Element | null;
+        }) => React.ReactNode;
+    };
+}
+export interface FormItemInputProps {
+    wrapperCol?: ColProps;
+    extra?: React.ReactNode;
+    status?: ValidateStatus;
+    help?: React.ReactNode;
+}
+declare const FormItemInput: React.FC<FormItemInputProps & FormItemInputMiscProps>;
+export default FormItemInput;

package/es/Form/FormItemInput.js

@@ -0,0 +1,77 @@
+import classNames from 'classnames';
+import * as React from 'react';
+import Col from '../Grid/col';
+import { FormContext, FormItemPrefixContext } from './context';
+import ErrorList from './ErrorList';
+
+var FormItemInput = function FormItemInput(props) {
+  var prefixCls = props.prefixCls,
+      status = props.status,
+      wrapperCol = props.wrapperCol,
+      children = props.children,
+      errors = props.errors,
+      warnings = props.warnings,
+      formItemRender = props._internalItemRender,
+      extra = props.extra,
+      help = props.help,
+      marginBottom = props.marginBottom,
+      onErrorVisibleChanged = props.onErrorVisibleChanged;
+  var baseClassName = "".concat(prefixCls, "-item");
+  var formContext = React.useContext(FormContext);
+  var mergedWrapperCol = wrapperCol || formContext.wrapperCol || {};
+  var className = classNames("".concat(baseClassName, "-control"), mergedWrapperCol.className); // Pass to sub FormItem should not with col info
+
+  var subFormContext = React.useMemo(function () {
+    return Object.assign({}, formContext);
+  }, [formContext]);
+  delete subFormContext.labelCol;
+  delete subFormContext.wrapperCol;
+  var inputDom = /*#__PURE__*/React.createElement("div", {
+    className: "".concat(baseClassName, "-control-input")
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(baseClassName, "-control-input-content")
+  }, children));
+  var formItemContext = React.useMemo(function () {
+    return {
+      prefixCls: prefixCls,
+      status: status
+    };
+  }, [prefixCls, status]);
+  var errorListDom = marginBottom !== null || errors.length || warnings.length ? /*#__PURE__*/React.createElement("div", {
+    style: {
+      display: 'flex',
+      flexWrap: 'nowrap'
+    }
+  }, /*#__PURE__*/React.createElement(FormItemPrefixContext.Provider, {
+    value: formItemContext
+  }, /*#__PURE__*/React.createElement(ErrorList, {
+    errors: errors,
+    warnings: warnings,
+    help: help,
+    helpStatus: status,
+    className: "".concat(baseClassName, "-explain-connected"),
+    onVisibleChanged: onErrorVisibleChanged
+  })), !!marginBottom && /*#__PURE__*/React.createElement("div", {
+    style: {
+      width: 0,
+      height: marginBottom
+    }
+  })) : null; // If extra = 0, && will goes wrong
+  // 0&&error -> 0
+
+  var extraDom = extra ? /*#__PURE__*/React.createElement("div", {
+    className: "".concat(baseClassName, "-extra")
+  }, extra) : null;
+  var dom = formItemRender && formItemRender.mark === 'pro_table_render' && formItemRender.render ? formItemRender.render(props, {
+    input: inputDom,
+    errorList: errorListDom,
+    extra: extraDom
+  }) : /*#__PURE__*/React.createElement(React.Fragment, null, inputDom, errorListDom, extraDom);
+  return /*#__PURE__*/React.createElement(FormContext.Provider, {
+    value: subFormContext
+  }, /*#__PURE__*/React.createElement(Col, Object.assign({}, mergedWrapperCol, {
+    className: className
+  }), dom));
+};
+
+export default FormItemInput;

package/es/Form/FormItemLabel.d.ts

@@ -0,0 +1,23 @@
+import * as React from 'react';
+import type { ColProps } from '../Grid/col';
+import type { TooltipProps } from '../Tooltip';
+import type { RequiredMark } from './Form';
+import type { FormLabelAlign } from './interface';
+export declare type WrapperTooltipProps = TooltipProps & {
+    icon?: React.ReactElement;
+};
+export declare type LabelTooltipType = WrapperTooltipProps | React.ReactNode;
+export interface FormItemLabelProps {
+    colon?: boolean;
+    htmlFor?: string;
+    label?: React.ReactNode;
+    labelAlign?: FormLabelAlign;
+    labelCol?: ColProps;
+    requiredMark?: RequiredMark;
+    tooltip?: LabelTooltipType;
+}
+declare const FormItemLabel: React.FC<FormItemLabelProps & {
+    required?: boolean;
+    prefixCls: string;
+}>;
+export default FormItemLabel;