FormItemInput.js 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. "use strict";
  2. "use client";
  3. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
  4. var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
  5. Object.defineProperty(exports, "__esModule", {
  6. value: true
  7. });
  8. exports.default = void 0;
  9. var React = _interopRequireWildcard(require("react"));
  10. var _classnames = _interopRequireDefault(require("classnames"));
  11. var _rcUtil = require("rc-util");
  12. var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
  13. var _col = _interopRequireDefault(require("../grid/col"));
  14. var _context = require("./context");
  15. var _ErrorList = _interopRequireDefault(require("./ErrorList"));
  16. var _fallbackCmp = _interopRequireDefault(require("./style/fallbackCmp"));
  17. var __rest = void 0 && (void 0).__rest || function (s, e) {
  18. var t = {};
  19. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
  20. if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  21. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
  22. }
  23. return t;
  24. };
  25. const GRID_MAX = 24;
  26. const FormItemInput = props => {
  27. const {
  28. prefixCls,
  29. status,
  30. labelCol,
  31. wrapperCol,
  32. children,
  33. errors,
  34. warnings,
  35. _internalItemRender: formItemRender,
  36. extra,
  37. help,
  38. fieldId,
  39. marginBottom,
  40. onErrorVisibleChanged,
  41. label
  42. } = props;
  43. const baseClassName = `${prefixCls}-item`;
  44. const formContext = React.useContext(_context.FormContext);
  45. const mergedWrapperCol = React.useMemo(() => {
  46. let mergedWrapper = Object.assign({}, wrapperCol || formContext.wrapperCol || {});
  47. if (label === null && !labelCol && !wrapperCol && formContext.labelCol) {
  48. const list = [undefined, 'xs', 'sm', 'md', 'lg', 'xl', 'xxl'];
  49. list.forEach(size => {
  50. const _size = size ? [size] : [];
  51. const formLabel = (0, _rcUtil.get)(formContext.labelCol, _size);
  52. const formLabelObj = typeof formLabel === 'object' ? formLabel : {};
  53. const wrapper = (0, _rcUtil.get)(mergedWrapper, _size);
  54. const wrapperObj = typeof wrapper === 'object' ? wrapper : {};
  55. if ('span' in formLabelObj && !('offset' in wrapperObj) && formLabelObj.span < GRID_MAX) {
  56. mergedWrapper = (0, _rcUtil.set)(mergedWrapper, [].concat(_size, ['offset']), formLabelObj.span);
  57. }
  58. });
  59. }
  60. return mergedWrapper;
  61. }, [wrapperCol, formContext]);
  62. const className = (0, _classnames.default)(`${baseClassName}-control`, mergedWrapperCol.className);
  63. // Pass to sub FormItem should not with col info
  64. const subFormContext = React.useMemo(() => {
  65. const {
  66. labelCol,
  67. wrapperCol
  68. } = formContext,
  69. rest = __rest(formContext, ["labelCol", "wrapperCol"]);
  70. return rest;
  71. }, [formContext]);
  72. const extraRef = React.useRef(null);
  73. const [extraHeight, setExtraHeight] = React.useState(0);
  74. (0, _useLayoutEffect.default)(() => {
  75. if (extra && extraRef.current) {
  76. setExtraHeight(extraRef.current.clientHeight);
  77. } else {
  78. setExtraHeight(0);
  79. }
  80. }, [extra]);
  81. const inputDom = /*#__PURE__*/React.createElement("div", {
  82. className: `${baseClassName}-control-input`
  83. }, /*#__PURE__*/React.createElement("div", {
  84. className: `${baseClassName}-control-input-content`
  85. }, children));
  86. const formItemContext = React.useMemo(() => ({
  87. prefixCls,
  88. status
  89. }), [prefixCls, status]);
  90. const errorListDom = marginBottom !== null || errors.length || warnings.length ? (/*#__PURE__*/React.createElement(_context.FormItemPrefixContext.Provider, {
  91. value: formItemContext
  92. }, /*#__PURE__*/React.createElement(_ErrorList.default, {
  93. fieldId: fieldId,
  94. errors: errors,
  95. warnings: warnings,
  96. help: help,
  97. helpStatus: status,
  98. className: `${baseClassName}-explain-connected`,
  99. onVisibleChanged: onErrorVisibleChanged
  100. }))) : null;
  101. const extraProps = {};
  102. if (fieldId) {
  103. extraProps.id = `${fieldId}_extra`;
  104. }
  105. // If extra = 0, && will goes wrong
  106. // 0&&error -> 0
  107. const extraDom = extra ? (/*#__PURE__*/React.createElement("div", Object.assign({}, extraProps, {
  108. className: `${baseClassName}-extra`,
  109. ref: extraRef
  110. }), extra)) : null;
  111. const additionalDom = errorListDom || extraDom ? (/*#__PURE__*/React.createElement("div", {
  112. className: `${baseClassName}-additional`,
  113. style: marginBottom ? {
  114. minHeight: marginBottom + extraHeight
  115. } : {}
  116. }, errorListDom, extraDom)) : null;
  117. const dom = formItemRender && formItemRender.mark === 'pro_table_render' && formItemRender.render ? formItemRender.render(props, {
  118. input: inputDom,
  119. errorList: errorListDom,
  120. extra: extraDom
  121. }) : (/*#__PURE__*/React.createElement(React.Fragment, null, inputDom, additionalDom));
  122. return /*#__PURE__*/React.createElement(_context.FormContext.Provider, {
  123. value: subFormContext
  124. }, /*#__PURE__*/React.createElement(_col.default, Object.assign({}, mergedWrapperCol, {
  125. className: className
  126. }), dom), /*#__PURE__*/React.createElement(_fallbackCmp.default, {
  127. prefixCls: prefixCls
  128. }));
  129. };
  130. var _default = exports.default = FormItemInput;