1 | "use client";
|
2 |
|
3 | import * as React from 'react';
|
4 | import classNames from 'classnames';
|
5 | import Col from '../grid/col';
|
6 | import { FormContext, FormItemPrefixContext } from './context';
|
7 | import ErrorList from './ErrorList';
|
8 | import FallbackCmp from './style/fallbackCmp';
|
9 | const FormItemInput = props => {
|
10 | const {
|
11 | prefixCls,
|
12 | status,
|
13 | wrapperCol,
|
14 | children,
|
15 | errors,
|
16 | warnings,
|
17 | _internalItemRender: formItemRender,
|
18 | extra,
|
19 | help,
|
20 | fieldId,
|
21 | marginBottom,
|
22 | onErrorVisibleChanged
|
23 | } = props;
|
24 | const baseClassName = `${prefixCls}-item`;
|
25 | const formContext = React.useContext(FormContext);
|
26 | const mergedWrapperCol = wrapperCol || formContext.wrapperCol || {};
|
27 | const className = classNames(`${baseClassName}-control`, mergedWrapperCol.className);
|
28 |
|
29 | const subFormContext = React.useMemo(() => Object.assign({}, formContext), [formContext]);
|
30 | delete subFormContext.labelCol;
|
31 | delete subFormContext.wrapperCol;
|
32 | const inputDom = React.createElement("div", {
|
33 | className: `${baseClassName}-control-input`
|
34 | }, React.createElement("div", {
|
35 | className: `${baseClassName}-control-input-content`
|
36 | }, children));
|
37 | const formItemContext = React.useMemo(() => ({
|
38 | prefixCls,
|
39 | status
|
40 | }), [prefixCls, status]);
|
41 | const errorListDom = marginBottom !== null || errors.length || warnings.length ? ( React.createElement("div", {
|
42 | style: {
|
43 | display: 'flex',
|
44 | flexWrap: 'nowrap'
|
45 | }
|
46 | }, React.createElement(FormItemPrefixContext.Provider, {
|
47 | value: formItemContext
|
48 | }, React.createElement(ErrorList, {
|
49 | fieldId: fieldId,
|
50 | errors: errors,
|
51 | warnings: warnings,
|
52 | help: help,
|
53 | helpStatus: status,
|
54 | className: `${baseClassName}-explain-connected`,
|
55 | onVisibleChanged: onErrorVisibleChanged
|
56 | })), !!marginBottom && React.createElement("div", {
|
57 | style: {
|
58 | width: 0,
|
59 | height: marginBottom
|
60 | }
|
61 | }))) : null;
|
62 | const extraProps = {};
|
63 | if (fieldId) {
|
64 | extraProps.id = `${fieldId}_extra`;
|
65 | }
|
66 |
|
67 |
|
68 | const extraDom = extra ? ( React.createElement("div", Object.assign({}, extraProps, {
|
69 | className: `${baseClassName}-extra`
|
70 | }), extra)) : null;
|
71 | const dom = formItemRender && formItemRender.mark === 'pro_table_render' && formItemRender.render ? formItemRender.render(props, {
|
72 | input: inputDom,
|
73 | errorList: errorListDom,
|
74 | extra: extraDom
|
75 | }) : ( React.createElement(React.Fragment, null, inputDom, errorListDom, extraDom));
|
76 | return React.createElement(FormContext.Provider, {
|
77 | value: subFormContext
|
78 | }, React.createElement(Col, Object.assign({}, mergedWrapperCol, {
|
79 | className: className
|
80 | }), dom), React.createElement(FallbackCmp, {
|
81 | prefixCls: prefixCls
|
82 | }));
|
83 | };
|
84 | export default FormItemInput; |
\ | No newline at end of file |