linkmore-design 1.1.15 → 1.1.16

package/dist/variables.css

@@ -1407,6 +1407,7 @@ p {
 }
 .lm_cascader.ant-select.ant-select {
   font-size: 12px;
+  width: 100%;
 }
 .lm_cascader_dropdown.ant-select-dropdown {
   font-size: 12px;
@@ -8951,57 +8952,22 @@ p {
 .lm_form.ant-form.ant-form-inline .ant-form-item-label {
   text-align: left;
 }
-.lm_container_wrapper {
-  overflow: auto;
-}
-.lm_container_wrapper .lm_container.responsive {
-  min-width: 990px;
-}
-.lm_container_wrapper .lm_container.responsive .lm_form.ant-form {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-}
-.lm_container_wrapper .lm_container.responsive .lm_form.ant-form .ant-form-item-responsive {
-  margin-right: 24px;
-}
-.lm_container_wrapper .lm_container.responsive .lm_form.ant-form .ant-form-item-responsive .ant-form-item-control {
-  width: 100%;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_3 .ant-form-item {
-  width: 100%;
-  margin-right: 0;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_3 .ant-form-item-responsive {
-  width: calc(33.3333% - 16px);
-  margin-right: 24px;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_3 .ant-form-item-responsive.nth-three {
-  margin-right: 0;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_4 .ant-form-item {
-  width: 100%;
-  margin-right: 0;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_4 .ant-form-item-responsive {
-  width: calc(25% - 18px);
-  margin-right: 24px;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_4 .ant-form-item-responsive.nth-four {
-  margin-right: 0;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_5 .ant-form-item {
-  width: 100%;
-  margin-right: 0;
+.lm_form_responsive_box .lm_form {
+  background: #f0f0f0;
 }
-.lm_container_wrapper .lm_container.responsive.lm_col_5 .ant-form-item-responsive {
-  width: calc(20% - 96px / 5);
-  margin-right: 24px;
+.lm_form_responsive_box .lm_form > .lm_container_wrapper {
+  padding: 16px;
+  background: #f0f0f0;
+  margin-bottom: 0;
+  border-radius: 0;
 }
-.lm_container_wrapper .lm_container.responsive.lm_col_5 .ant-form-item-responsive.nth-five {
-  margin-right: 0;
+.lm_container_wrapper {
+  overflow: auto;
+  background: #fff;
+  margin-bottom: 16px;
+  border-radius: 2px;
 }
-.lm_container_wrapper .lm_container.responsive .ant-cascader {
+.lm_container_wrapper .ant-cascader {
   width: 100%;
 }
 .lm_form-item-tip-error .ant-form-item-explain {
@@ -9510,8 +9476,12 @@ p {
 .ant-input-search-with-button .ant-input-affix-wrapper:not(.ant-input-affix-wrapper-disabled):hover {
   z-index: 2 !important;
 }
+.lm_input-number {
+  width: 100%;
+}
 .lm_input-number.ant-input-number {
   border: 1px solid var(--color-15);
+  width: 100%;
 }
 .lm_input-number .ant-input-number-handler-wrap {
   width: 28px;
@@ -10368,6 +10338,7 @@ p {
 }
 .lm_select.ant-select {
   font-size: 12px;
+  width: 100%;
 }
 .lm_select .ant-select-selection-overflow-item-rest .ant-select-selection-item {
   color: var(--primary-color);
@@ -11285,6 +11256,45 @@ p {
 #lm_protable_warp .lm_protable .ant-table-empty table .ant-table-cell {
   border-bottom: 0;
 }
+#lm_protable_warp .lm_protable .ant-table-summary {
+  height: 48px;
+}
+#lm_protable_warp .lm_protable .ant-table-summary > table {
+  height: 100%;
+}
+#lm_protable_warp .lm_protable .ant-table-summary td {
+  padding: 0 8px;
+  text-align: right;
+  background-color: var(--table-background-color);
+}
+#lm_protable_warp .lm_protable .ant-table-summary td:first-of-type {
+  padding: 0 0 0 8px;
+  text-align: left;
+}
+#lm_protable_warp .lm_protable .ant-table-summary td.number {
+  border-right: 1px solid #eee;
+  border-left: 1px solid #eee;
+}
+#lm_protable_warp .lm_protable .ant-table-summary td.money {
+  color: var(--error-color);
+  border-right: 1px solid #eee;
+  border-left: 1px solid #eee;
+}
+#lm_protable_warp .lm_protable .ant-table-summary td.money-color {
+  color: var(--error-color);
+}
+#lm_protable_warp .lm_protable .ant-table-summary td > div {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+#lm_protable_warp .lm_protable .ant-table-summary td > div:last-of-type {
+  font-weight: bold;
+}
+#lm_protable_warp .lm_protable .ant-table-summary .total_title {
+  position: relative;
+  white-space: nowrap;
+}
 #lm_protable_warp .ant-table-expand-icon-col {
   width: 32px;
 }
@@ -12330,6 +12340,7 @@ button.ant-table-row-expand-icon::after {
 }
 .lm_select.ant-select {
   font-size: 12px;
+  width: 100%;
 }
 .lm_select.ant-select-focused:not(.ant-select-disabled).ant-select:not(.ant-select-customize-input) .ant-select-selector {
   box-shadow: none;

package/es/Cascader/style/index.css

@@ -512,6 +512,7 @@ p {
 }
 .lm_cascader.ant-select.ant-select {
   font-size: 12px;
+  width: 100%;
 }
 .lm_cascader_dropdown.ant-select-dropdown {
   font-size: 12px;

package/es/Cascader/style/variables.css

@@ -1,5 +1,6 @@
 .lm_cascader.ant-select.ant-select {
   font-size: 12px;
+  width: 100%;
 }
 .lm_cascader_dropdown.ant-select-dropdown {
   font-size: 12px;

package/es/Form/Form.js

@@ -24,7 +24,7 @@ import DisabledContext, { DisabledContextProvider } from '../ConfigProvider/Disa
 import SizeContext, { SizeContextProvider } from '../ConfigProvider/SizeContext';
 import { FormContext } from './context';
 import useForm from './hooks/useForm';
-import Container from './container';
+import WrapperItem from './WrapperItem';
 
 var InternalForm = function InternalForm(props, ref) {
   var _classNames;
@@ -58,8 +58,10 @@ var InternalForm = function InternalForm(props, ref) {
       onFinishFailed = props.onFinishFailed,
       name = props.name,
       responsive = props.responsive,
-      restFormProps = __rest(props, ["prefixCls", "className", "size", "disabled", "form", "colon", "labelAlign", "labelWrap", "labelCol", "wrapperCol", "hideRequiredMark", "layout", "scrollToFirstError", "requiredMark", "onFinishFailed", "name", "responsive"]);
+      customizeChildren = props.children,
+      restFormProps = __rest(props, ["prefixCls", "className", "size", "disabled", "form", "colon", "labelAlign", "labelWrap", "labelCol", "wrapperCol", "hideRequiredMark", "layout", "scrollToFirstError", "requiredMark", "onFinishFailed", "name", "responsive", "children"]);
 
+  var children = customizeChildren;
   var mergedRequiredMark = useMemo(function () {
     if (requiredMark !== undefined) {
       return requiredMark;
@@ -118,6 +120,12 @@ var InternalForm = function InternalForm(props, ref) {
     }
   };
 
+  if (responsive) {
+    children = /*#__PURE__*/React.createElement(WrapperItem, {
+      children: children
+    });
+  }
+
   var formNode = /*#__PURE__*/React.createElement(DisabledContextProvider, {
     disabled: disabled
   }, /*#__PURE__*/React.createElement(SizeContextProvider, {
@@ -127,6 +135,7 @@ var InternalForm = function InternalForm(props, ref) {
   }, /*#__PURE__*/React.createElement(FieldForm, Object.assign({
     id: name
   }, restFormProps, {
+    children: children,
     name: name,
     onFinishFailed: onInternalFinishFailed,
     form: wrapForm,
@@ -134,8 +143,8 @@ var InternalForm = function InternalForm(props, ref) {
   })))));
 
   if (responsive) {
-    return /*#__PURE__*/React.createElement(Container, {
-      responsive: true
+    return /*#__PURE__*/React.createElement("div", {
+      className: "lm_form_responsive_box"
     }, formNode);
   }
 

package/es/Form/FormItem/ItemHolder.js

@@ -119,17 +119,8 @@ export default function ItemHolder(props) {
   }, [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);
-  var nthCls = '';
-
-  if (itemRef.current && itemRef.current.classList) {
-    var list = itemRef.current.classList;
-    if (list.contains('nth-three')) nthCls = 'nth-three';
-    if (list.contains('nth-four')) nthCls = 'nth-four';
-    if (list.contains('nth-five')) nthCls = 'nth-five';
-  }
-
   return /*#__PURE__*/React.createElement("div", {
-    className: classNames(itemClassName, nthCls),
+    className: classNames(itemClassName),
     style: style,
     ref: itemRef
   }, /*#__PURE__*/React.createElement(Row, Object.assign({

package/es/Form/FormWrapper.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const _default: React.FC<any>;
+export default _default;

package/es/Form/FormWrapper.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import WrapperItem from './WrapperItem';
+
+function withComponent(WrappedComponent) {
+  var WithComponent = function WithComponent(props) {
+    return /*#__PURE__*/React.createElement(WrappedComponent, Object.assign({}, props, {
+      with: true
+    }));
+  };
+
+  var wrappedComponentName = WrappedComponent.displayName || WrappedComponent.name || 'Component';
+  WithComponent.displayName = "withComponent(".concat(wrappedComponentName, ")");
+  return WithComponent;
+}
+
+var FormWrapper = function FormWrapper(props) {
+  var children = props.children;
+  return /*#__PURE__*/React.createElement(WrapperItem, {
+    children: children
+  });
+};
+
+export default withComponent(FormWrapper);

package/es/Form/WrapperItem.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IWrapper } from './interface';
+declare const WrapperItem: React.FC<IWrapper>;
+export default WrapperItem;

package/es/Form/WrapperItem.js

@@ -0,0 +1,149 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import React, { useEffect, useRef, useState } from 'react';
+import { throttle } from 'lodash';
+import Row from '../Row';
+import Col from '../Col'; // 行个数 => 在24份中占用的分数
+
+var rowMap = new Map([[5, [4, 1]], [4, [5, 1]], [3, [7, 1]]]);
+
+function getResult(children, countPerRow) {
+  var _a;
+
+  var _rowMap$get = rowMap.get(countPerRow),
+      _rowMap$get2 = _slicedToArray(_rowMap$get, 2),
+      colSpan = _rowMap$get2[0],
+      colSpace = _rowMap$get2[1]; // 收集(满了就重置)
+
+
+  var collection = []; // 最终的结果
+
+  var result = [];
+  children = Array.prototype.slice.call(children).flat();
+
+  function handle() {
+    var node = /*#__PURE__*/React.createElement(Row, null, collection.map(function (child, index) {
+      if (index !== collection.length - 1) {
+        return /*#__PURE__*/React.createElement(React.Fragment, {
+          key: index
+        }, /*#__PURE__*/React.createElement(Col, {
+          span: colSpan
+        }, child), /*#__PURE__*/React.createElement(Col, {
+          span: colSpace
+        }));
+      }
+
+      return /*#__PURE__*/React.createElement(Col, {
+        span: colSpan,
+        key: index
+      }, child);
+    }));
+    result.push(node);
+    collection.length = 0;
+  }
+
+  for (var i = 0; i < children.length; i += 1) {
+    var child = children[i]; // 过滤掉React.Fragment
+
+    while (child.type === Symbol.for('react.fragment')) {
+      if (Array.isArray(child.props.children)) {
+        var _children;
+
+        (_children = children).splice.apply(_children, [i, 1].concat(_toConsumableArray(child.props.children)));
+
+        child = children[i];
+      } else {
+        child = child.props.children;
+      }
+    }
+
+    if ((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.responsive) {
+      collection.push(child);
+
+      if (collection.length && collection.length === countPerRow) {
+        handle();
+      }
+    } else if (collection.length) {
+      handle();
+      result.push(child);
+    } else {
+      result.push(child);
+    }
+  }
+
+  if (collection.length) {
+    handle();
+  }
+
+  return result;
+}
+
+var WrapperItem = function WrapperItem(props) {
+  var children = props.children;
+  var targetRef = useRef(null);
+
+  var _useState = useState({
+    width: '100%',
+    height: '100%'
+  }),
+      _useState2 = _slicedToArray(_useState, 2),
+      containerSize = _useState2[0],
+      setContainerSize = _useState2[1]; // 每行的个数
+
+
+  var _useState3 = useState(5),
+      _useState4 = _slicedToArray(_useState3, 2),
+      countPerRow = _useState4[0],
+      setCountPerRow = _useState4[1];
+
+  var result = getResult(children, countPerRow);
+
+  var changeSize = function changeSize() {
+    var _a;
+
+    var maxWidth = 1824;
+
+    var _ref = ((_a = targetRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect()) || {},
+        _ref$width = _ref.width,
+        width = _ref$width === void 0 ? '100%' : _ref$width;
+
+    if (width < 990) {
+      setCountPerRow(3);
+    } else if (width < 1390) {
+      setCountPerRow(4);
+    } else {
+      setCountPerRow(5);
+    }
+
+    if (width !== '100%' && width > maxWidth) {
+      width = maxWidth;
+    }
+
+    setContainerSize({
+      width: width - 32
+    });
+  };
+
+  var handResize = throttle(changeSize, 600);
+  useEffect(function () {
+    changeSize();
+    window.addEventListener('resize', handResize);
+    return function () {
+      window.removeEventListener('resize', handResize);
+    };
+  }, []);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "lm_container_wrapper",
+    ref: targetRef
+  }, /*#__PURE__*/React.createElement("div", {
+    style: Object.assign(Object.assign({}, containerSize), {
+      margin: '0 auto'
+    })
+  }, result.map(function (child, index) {
+    return /*#__PURE__*/React.createElement(React.Fragment, {
+      key: index
+    }, child);
+  }))));
+};
+
+export default WrapperItem;

package/es/Form/container.js

@@ -38,19 +38,7 @@ var LMContainer = function LMContainer(props) {
     var width = containerSize.width,
         height = containerSize.height;
     var responsiveCls = responsive && width !== '100%' ? 'responsive' : '';
-    var lm_col = '';
-
-    if (responsiveCls) {
-      if (parseInt(width) < 990) {
-        lm_col = 'lm_col_3';
-      } else if (parseInt(width) < 1390) {
-        lm_col = 'lm_col_4';
-      } else {
-        lm_col = 'lm_col_5';
-      }
-    }
-
-    var classes = classNames(className, prefixCls, responsiveCls, lm_col);
+    var classes = classNames(className, prefixCls, responsiveCls);
     return /*#__PURE__*/React.createElement("div", Object.assign({
       className: classes
     }, others, {

package/es/Form/images/icon_collapse.svg

@@ -0,0 +1 @@
+<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='none' version='1.1' width='16' height='16' viewBox='0 0 16 16'><defs><clipPath id='master_svg0_sa1497_9860'><rect x='0' y='0' width='16' height='16' rx='0'/></clipPath></defs><g clipPath='url(#master_svg0_sa1497_9860)'><g style='mix-blend-mode:passthrough'><path d='M13.4609,5.384111L9.22915,10.462240000000001Q8.7494,11.03795,8,11.03795Q7.2506,11.03795,6.770849999999999,10.462240000000001L2.539067,5.384111L3.460933,4.615889L7.69271,9.69402Q7.81265,9.83795,8,9.83795Q8.18735,9.83795,8.30729,9.69402L12.53907,4.615889L13.4609,5.384111ZM13.6,5Q13.6,5.0590948000000004,13.5885,5.117054Q13.5769,5.175014,13.5543,5.22961Q13.5317,5.284207,13.4989,5.333342Q13.4661,5.382478,13.4243,5.424264Q13.3825,5.46605,13.3333,5.498882Q13.2842,5.531713,13.2296,5.554328Q13.175,5.576942,13.1171,5.588471Q13.0591,5.6,13,5.6Q12.94091,5.6,12.88295,5.588471Q12.82499,5.576942,12.77039,5.554328Q12.71579,5.531713,12.66666,5.498882Q12.61752,5.46605,12.57573,5.424264Q12.53395,5.382478,12.50112,5.333342Q12.46828,5.284207,12.44567,5.22961Q12.42306,5.175014,12.41153,5.117054Q12.4,5.0590948000000004,12.4,5Q12.4,4.9409051999999996,12.41153,4.882946Q12.42306,4.824986,12.44567,4.77039Q12.46828,4.715793,12.50112,4.666658Q12.53395,4.617522,12.57574,4.575736Q12.61752,4.53395,12.66666,4.501118Q12.71579,4.468287,12.77039,4.445672Q12.82499,4.423058,12.88295,4.411529Q12.94091,4.4,13,4.4Q13.0591,4.4,13.1171,4.411529Q13.175,4.423058,13.2296,4.445672Q13.2842,4.468287,13.3333,4.501118Q13.3825,4.53395,13.4243,4.575736Q13.4661,4.617522,13.4989,4.666658Q13.5317,4.715793,13.5543,4.77039Q13.5769,4.824986,13.5885,4.882946Q13.6,4.9409051999999996,13.6,5ZM3.6,5Q3.6,5.0590948000000004,3.588471,5.117054Q3.576942,5.175014,3.554328,5.22961Q3.531713,5.284207,3.498882,5.333342Q3.46605,5.382478,3.424264,5.424264Q3.382478,5.46605,3.333342,5.498882Q3.284207,5.531713,3.22961,5.554328Q3.175014,5.576942,3.117054,5.588471Q3.0590948,5.6,3,5.6Q2.9409052,5.6,2.882946,5.588471Q2.824986,5.576942,2.77039,5.554328Q2.715793,5.531713,2.666658,5.498882Q2.617522,5.46605,2.575736,5.424264Q2.53395,5.382478,2.501118,5.333342Q2.468287,5.284207,2.445672,5.22961Q2.423058,5.175014,2.411529,5.117054Q2.4,5.0590948000000004,2.4,5Q2.4,4.9409051999999996,2.411529,4.882946Q2.423058,4.824986,2.445672,4.77039Q2.468287,4.715793,2.501118,4.666658Q2.53395,4.617522,2.575736,4.575736Q2.617522,4.53395,2.666658,4.501118Q2.715793,4.468287,2.77039,4.445672Q2.824986,4.423058,2.882946,4.411529Q2.9409052,4.4,3,4.4Q3.0590948,4.4,3.117054,4.411529Q3.175014,4.423058,3.22961,4.445672Q3.284207,4.468287,3.333342,4.501118Q3.382478,4.53395,3.424264,4.575736Q3.46605,4.617522,3.498882,4.666658Q3.531713,4.715793,3.554328,4.77039Q3.576942,4.824986,3.588471,4.882946Q3.6,4.9409051999999996,3.6,5Z' fill='#262626' fillOpacity='1'/></g></g></svg>

package/es/Form/index.d.ts

@@ -9,6 +9,7 @@ import type { FormItemProps } from './FormItem';
 import List from './FormList';
 import type { FormListFieldData, FormListOperation, FormListProps } from './FormList';
 import useFormInstance from './hooks/useFormInstance';
+import Wrapper from './FormWrapper';
 declare type InternalFormType = typeof InternalForm;
 interface FormInterface extends InternalFormType {
     useForm: typeof useForm;
@@ -18,6 +19,7 @@ interface FormInterface extends InternalFormType {
     List: typeof List;
     ErrorList: typeof ErrorList;
     Provider: typeof FormProvider;
+    Wrapper: typeof Wrapper;
     /** @deprecated Only for warning usage. Do not use. */
     create: () => void;
 }

package/es/Form/index.js

@@ -5,6 +5,7 @@ import InternalForm, { useForm, useWatch } from './Form';
 import Item from './FormItem';
 import List from './FormList';
 import useFormInstance from './hooks/useFormInstance';
+import Wrapper from './FormWrapper';
 var Form = InternalForm;
 Form.Item = Item;
 Form.List = List;
@@ -18,4 +19,5 @@ Form.create = function () {
   warning(false, 'Form', 'antd v4 removed `Form.create`. Please remove or use `@ant-design/compatible` instead.');
 };
 
+Form.Wrapper = Wrapper;
 export default Form;

package/es/Form/interface.d.ts

@@ -1,3 +1,13 @@
+import { FormInstance, Store } from 'rc-field-form/lib/interface';
+import React from 'react';
 export { InternalNamePath, NamePath, Store, StoreValue } from 'rc-field-form/lib/interface';
 export { Options as ScrollOptions } from 'scroll-into-view-if-needed';
 export declare type FormLabelAlign = 'left' | 'right';
+export declare type RenderProps = (values: Store, form: FormInstance) => JSX.Element | React.ReactNode;
+export interface ISize {
+    width?: number;
+    height?: number;
+}
+export interface IWrapper {
+    children: React.ReactNode | RenderProps;
+}

package/es/Form/style/index.css

@@ -6613,57 +6613,22 @@ p {
 .lm_form.ant-form.ant-form-inline .ant-form-item-label {
   text-align: left;
 }
-.lm_container_wrapper {
-  overflow: auto;
-}
-.lm_container_wrapper .lm_container.responsive {
-  min-width: 990px;
-}
-.lm_container_wrapper .lm_container.responsive .lm_form.ant-form {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-}
-.lm_container_wrapper .lm_container.responsive .lm_form.ant-form .ant-form-item-responsive {
-  margin-right: 24px;
-}
-.lm_container_wrapper .lm_container.responsive .lm_form.ant-form .ant-form-item-responsive .ant-form-item-control {
-  width: 100%;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_3 .ant-form-item {
-  width: 100%;
-  margin-right: 0;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_3 .ant-form-item-responsive {
-  width: calc(33.3333% - 16px);
-  margin-right: 24px;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_3 .ant-form-item-responsive.nth-three {
-  margin-right: 0;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_4 .ant-form-item {
-  width: 100%;
-  margin-right: 0;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_4 .ant-form-item-responsive {
-  width: calc(25% - 18px);
-  margin-right: 24px;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_4 .ant-form-item-responsive.nth-four {
-  margin-right: 0;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_5 .ant-form-item {
-  width: 100%;
-  margin-right: 0;
+.lm_form_responsive_box .lm_form {
+  background: #f0f0f0;
 }
-.lm_container_wrapper .lm_container.responsive.lm_col_5 .ant-form-item-responsive {
-  width: calc(20% - 96px / 5);
-  margin-right: 24px;
+.lm_form_responsive_box .lm_form > .lm_container_wrapper {
+  padding: 16px;
+  background: #f0f0f0;
+  margin-bottom: 0;
+  border-radius: 0;
 }
-.lm_container_wrapper .lm_container.responsive.lm_col_5 .ant-form-item-responsive.nth-five {
-  margin-right: 0;
+.lm_container_wrapper {
+  overflow: auto;
+  background: #fff;
+  margin-bottom: 16px;
+  border-radius: 2px;
 }
-.lm_container_wrapper .lm_container.responsive .ant-cascader {
+.lm_container_wrapper .ant-cascader {
   width: 100%;
 }
 .lm_form-item-tip-error .ant-form-item-explain {

package/es/Form/style/variables.css

@@ -6101,57 +6101,22 @@
 .lm_form.ant-form.ant-form-inline .ant-form-item-label {
   text-align: left;
 }
-.lm_container_wrapper {
-  overflow: auto;
-}
-.lm_container_wrapper .lm_container.responsive {
-  min-width: 990px;
-}
-.lm_container_wrapper .lm_container.responsive .lm_form.ant-form {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-}
-.lm_container_wrapper .lm_container.responsive .lm_form.ant-form .ant-form-item-responsive {
-  margin-right: 24px;
-}
-.lm_container_wrapper .lm_container.responsive .lm_form.ant-form .ant-form-item-responsive .ant-form-item-control {
-  width: 100%;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_3 .ant-form-item {
-  width: 100%;
-  margin-right: 0;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_3 .ant-form-item-responsive {
-  width: calc(33.3333% - 16px);
-  margin-right: 24px;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_3 .ant-form-item-responsive.nth-three {
-  margin-right: 0;
+.lm_form_responsive_box .lm_form {
+  background: #f0f0f0;
 }
-.lm_container_wrapper .lm_container.responsive.lm_col_4 .ant-form-item {
-  width: 100%;
-  margin-right: 0;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_4 .ant-form-item-responsive {
-  width: calc(25% - 18px);
-  margin-right: 24px;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_4 .ant-form-item-responsive.nth-four {
-  margin-right: 0;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_5 .ant-form-item {
-  width: 100%;
-  margin-right: 0;
-}
-.lm_container_wrapper .lm_container.responsive.lm_col_5 .ant-form-item-responsive {
-  width: calc(20% - 96px / 5);
-  margin-right: 24px;
+.lm_form_responsive_box .lm_form > .lm_container_wrapper {
+  padding: 16px;
+  background: #f0f0f0;
+  margin-bottom: 0;
+  border-radius: 0;
 }
-.lm_container_wrapper .lm_container.responsive.lm_col_5 .ant-form-item-responsive.nth-five {
-  margin-right: 0;
+.lm_container_wrapper {
+  overflow: auto;
+  background: #fff;
+  margin-bottom: 16px;
+  border-radius: 2px;
 }
-.lm_container_wrapper .lm_container.responsive .ant-cascader {
+.lm_container_wrapper .ant-cascader {
   width: 100%;
 }
 .lm_form-item-tip-error .ant-form-item-explain {

package/es/InputNumber/style/index.css

@@ -510,8 +510,12 @@ html {
 p {
   margin-bottom: 0;
 }
+.lm_input-number {
+  width: 100%;
+}
 .lm_input-number.ant-input-number {
   border: 1px solid var(--color-15);
+  width: 100%;
 }
 .lm_input-number .ant-input-number-handler-wrap {
   width: 28px;

package/es/InputNumber/style/variables.css

@@ -1,5 +1,9 @@
+.lm_input-number {
+  width: 100%;
+}
 .lm_input-number.ant-input-number {
   border: 1px solid var(--color-15);
+  width: 100%;
 }
 .lm_input-number .ant-input-number-handler-wrap {
   width: 28px;