@wibetter/json-editor 5.0.29 → 5.1.1

package/sdk/index.js

@@ -1,8 +1,8 @@
 /*!
- * @wibetter/json-editor v5.0.28
+ * @wibetter/json-editor v5.1.1
  * author: wibetter
  * build tool: AKFun
- * build time: Tue Jan 07 2025 14:49:38 GMT+0800 (中国标准时间)
+ * build time: Thu Jan 09 2025 11:34:04 GMT+0800 (中国标准时间)
  * build tool info: https://github.com/wibetter/akfun
  */
 (function webpackUniversalModuleDefinition(root, factory) {
@@ -66857,26 +66857,27 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var $renderers_EventSchema_index__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! $renderers/EventSchema/index */ "./src/renderers/EventSchema/index.js");
 /* harmony import */ var $renderers_QuantitySchema_index__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! $renderers/QuantitySchema/index */ "./src/renderers/QuantitySchema/index.js");
 /* harmony import */ var $renderers_BoxStyleSchema_index__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! $renderers/BoxStyleSchema/index */ "./src/renderers/BoxStyleSchema/index.js");
-/* harmony import */ var $renderers_RadioSchema_index__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! $renderers/RadioSchema/index */ "./src/renderers/RadioSchema/index.js");
-/* harmony import */ var $renderers_CheckboxSchema_index__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! $renderers/CheckboxSchema/index */ "./src/renderers/CheckboxSchema/index.js");
-/* harmony import */ var $renderers_InputFormSchema_index__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! $renderers/InputFormSchema/index */ "./src/renderers/InputFormSchema/index.js");
-/* harmony import */ var $renderers_TextAreaFormSchema_index__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! $renderers/TextAreaFormSchema/index */ "./src/renderers/TextAreaFormSchema/index.js");
-/* harmony import */ var $renderers_TextEditorSchema_index__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! $renderers/TextEditorSchema/index */ "./src/renderers/TextEditorSchema/index.js");
-/* harmony import */ var $renderers_NumberFormSchema_index__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! $renderers/NumberFormSchema/index */ "./src/renderers/NumberFormSchema/index.js");
-/* harmony import */ var $renderers_BooleanFormSchema_index__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! $renderers/BooleanFormSchema/index */ "./src/renderers/BooleanFormSchema/index.js");
-/* harmony import */ var $renderers_SelectSchema_index__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! $renderers/SelectSchema/index */ "./src/renderers/SelectSchema/index.js");
-/* harmony import */ var $renderers_CascaderSchema_index__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! $renderers/CascaderSchema/index */ "./src/renderers/CascaderSchema/index.js");
-/* harmony import */ var $renderers_InputImageSchema_index__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! $renderers/InputImageSchema/index */ "./src/renderers/InputImageSchema/index.js");
-/* harmony import */ var $renderers_DateTimeFormSchema_index__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! $renderers/DateTimeFormSchema/index */ "./src/renderers/DateTimeFormSchema/index.js");
-/* harmony import */ var $renderers_TimeFormSchema_index__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! $renderers/TimeFormSchema/index */ "./src/renderers/TimeFormSchema/index.js");
-/* harmony import */ var $renderers_URLFormSchema_index__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! $renderers/URLFormSchema/index */ "./src/renderers/URLFormSchema/index.js");
-/* harmony import */ var $renderers_ColorFormSchemaV3_index__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! $renderers/ColorFormSchemaV3/index */ "./src/renderers/ColorFormSchemaV3/index.js");
-/* harmony import */ var $renderers_JsonFormSchema_index__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! $renderers/JsonFormSchema/index */ "./src/renderers/JsonFormSchema/index.js");
-/* harmony import */ var $renderers_CodeAreaFormSchema_index__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! $renderers/CodeAreaFormSchema/index */ "./src/renderers/CodeAreaFormSchema/index.js");
-/* harmony import */ var $renderers_HtmlAreaFormSchema_index__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! $renderers/HtmlAreaFormSchema/index */ "./src/renderers/HtmlAreaFormSchema/index.js");
-/* harmony import */ var $renderers_DynamicConfigSchema_index__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! $renderers/DynamicConfigSchema/index */ "./src/renderers/DynamicConfigSchema/index.js");
-/* harmony import */ var $renderers_SohuDataSourceSchema_index__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! $renderers/SohuDataSourceSchema/index */ "./src/renderers/SohuDataSourceSchema/index.js");
-/* harmony import */ var $renderers_SohuEventSchema_index__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! $renderers/SohuEventSchema/index */ "./src/renderers/SohuEventSchema/index.js");
+/* harmony import */ var $renderers_PaddingAndMarginSchema_index__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! $renderers/PaddingAndMarginSchema/index */ "./src/renderers/PaddingAndMarginSchema/index.js");
+/* harmony import */ var $renderers_RadioSchema_index__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! $renderers/RadioSchema/index */ "./src/renderers/RadioSchema/index.js");
+/* harmony import */ var $renderers_CheckboxSchema_index__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! $renderers/CheckboxSchema/index */ "./src/renderers/CheckboxSchema/index.js");
+/* harmony import */ var $renderers_InputFormSchema_index__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! $renderers/InputFormSchema/index */ "./src/renderers/InputFormSchema/index.js");
+/* harmony import */ var $renderers_TextAreaFormSchema_index__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! $renderers/TextAreaFormSchema/index */ "./src/renderers/TextAreaFormSchema/index.js");
+/* harmony import */ var $renderers_TextEditorSchema_index__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__(/*! $renderers/TextEditorSchema/index */ "./src/renderers/TextEditorSchema/index.js");
+/* harmony import */ var $renderers_NumberFormSchema_index__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__(/*! $renderers/NumberFormSchema/index */ "./src/renderers/NumberFormSchema/index.js");
+/* harmony import */ var $renderers_BooleanFormSchema_index__WEBPACK_IMPORTED_MODULE_18__ = __webpack_require__(/*! $renderers/BooleanFormSchema/index */ "./src/renderers/BooleanFormSchema/index.js");
+/* harmony import */ var $renderers_SelectSchema_index__WEBPACK_IMPORTED_MODULE_19__ = __webpack_require__(/*! $renderers/SelectSchema/index */ "./src/renderers/SelectSchema/index.js");
+/* harmony import */ var $renderers_CascaderSchema_index__WEBPACK_IMPORTED_MODULE_20__ = __webpack_require__(/*! $renderers/CascaderSchema/index */ "./src/renderers/CascaderSchema/index.js");
+/* harmony import */ var $renderers_InputImageSchema_index__WEBPACK_IMPORTED_MODULE_21__ = __webpack_require__(/*! $renderers/InputImageSchema/index */ "./src/renderers/InputImageSchema/index.js");
+/* harmony import */ var $renderers_DateTimeFormSchema_index__WEBPACK_IMPORTED_MODULE_22__ = __webpack_require__(/*! $renderers/DateTimeFormSchema/index */ "./src/renderers/DateTimeFormSchema/index.js");
+/* harmony import */ var $renderers_TimeFormSchema_index__WEBPACK_IMPORTED_MODULE_23__ = __webpack_require__(/*! $renderers/TimeFormSchema/index */ "./src/renderers/TimeFormSchema/index.js");
+/* harmony import */ var $renderers_URLFormSchema_index__WEBPACK_IMPORTED_MODULE_24__ = __webpack_require__(/*! $renderers/URLFormSchema/index */ "./src/renderers/URLFormSchema/index.js");
+/* harmony import */ var $renderers_ColorFormSchemaV3_index__WEBPACK_IMPORTED_MODULE_25__ = __webpack_require__(/*! $renderers/ColorFormSchemaV3/index */ "./src/renderers/ColorFormSchemaV3/index.js");
+/* harmony import */ var $renderers_JsonFormSchema_index__WEBPACK_IMPORTED_MODULE_26__ = __webpack_require__(/*! $renderers/JsonFormSchema/index */ "./src/renderers/JsonFormSchema/index.js");
+/* harmony import */ var $renderers_CodeAreaFormSchema_index__WEBPACK_IMPORTED_MODULE_27__ = __webpack_require__(/*! $renderers/CodeAreaFormSchema/index */ "./src/renderers/CodeAreaFormSchema/index.js");
+/* harmony import */ var $renderers_HtmlAreaFormSchema_index__WEBPACK_IMPORTED_MODULE_28__ = __webpack_require__(/*! $renderers/HtmlAreaFormSchema/index */ "./src/renderers/HtmlAreaFormSchema/index.js");
+/* harmony import */ var $renderers_DynamicConfigSchema_index__WEBPACK_IMPORTED_MODULE_29__ = __webpack_require__(/*! $renderers/DynamicConfigSchema/index */ "./src/renderers/DynamicConfigSchema/index.js");
+/* harmony import */ var $renderers_SohuDataSourceSchema_index__WEBPACK_IMPORTED_MODULE_30__ = __webpack_require__(/*! $renderers/SohuDataSourceSchema/index */ "./src/renderers/SohuDataSourceSchema/index.js");
+/* harmony import */ var $renderers_SohuEventSchema_index__WEBPACK_IMPORTED_MODULE_31__ = __webpack_require__(/*! $renderers/SohuEventSchema/index */ "./src/renderers/SohuEventSchema/index.js");
 
 
 
@@ -66908,6 +66909,7 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
+
 
 
 /** 根据当前类型选择对应的组件进行渲染 */
@@ -66951,15 +66953,15 @@ var MappingRender = function MappingRender(props) {
         key: curNodeKey
       }));
     case 'dynamic-config':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_DynamicConfigSchema_index__WEBPACK_IMPORTED_MODULE_28__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_DynamicConfigSchema_index__WEBPACK_IMPORTED_MODULE_29__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'sohu-source':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_SohuDataSourceSchema_index__WEBPACK_IMPORTED_MODULE_29__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_SohuDataSourceSchema_index__WEBPACK_IMPORTED_MODULE_30__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'sohu-event':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_SohuEventSchema_index__WEBPACK_IMPORTED_MODULE_30__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_SohuEventSchema_index__WEBPACK_IMPORTED_MODULE_31__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'array':
@@ -66986,78 +66988,82 @@ var MappingRender = function MappingRender(props) {
       return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_BoxStyleSchema_index__WEBPACK_IMPORTED_MODULE_10__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
+    case 'padding-margin':
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_PaddingAndMarginSchema_index__WEBPACK_IMPORTED_MODULE_11__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+        key: curNodeKey
+      }));
     case 'radio':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_RadioSchema_index__WEBPACK_IMPORTED_MODULE_11__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_RadioSchema_index__WEBPACK_IMPORTED_MODULE_12__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'select':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_SelectSchema_index__WEBPACK_IMPORTED_MODULE_18__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_SelectSchema_index__WEBPACK_IMPORTED_MODULE_19__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'cascader':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_CascaderSchema_index__WEBPACK_IMPORTED_MODULE_19__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_CascaderSchema_index__WEBPACK_IMPORTED_MODULE_20__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'checkboxes':
       // 多选
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_CheckboxSchema_index__WEBPACK_IMPORTED_MODULE_12__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_CheckboxSchema_index__WEBPACK_IMPORTED_MODULE_13__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'input':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_InputFormSchema_index__WEBPACK_IMPORTED_MODULE_13__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_InputFormSchema_index__WEBPACK_IMPORTED_MODULE_14__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'textarea':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_TextAreaFormSchema_index__WEBPACK_IMPORTED_MODULE_14__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_TextAreaFormSchema_index__WEBPACK_IMPORTED_MODULE_15__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'text-editor':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_TextEditorSchema_index__WEBPACK_IMPORTED_MODULE_15__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_TextEditorSchema_index__WEBPACK_IMPORTED_MODULE_16__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'number':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_NumberFormSchema_index__WEBPACK_IMPORTED_MODULE_16__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_NumberFormSchema_index__WEBPACK_IMPORTED_MODULE_17__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'boolean':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_BooleanFormSchema_index__WEBPACK_IMPORTED_MODULE_17__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_BooleanFormSchema_index__WEBPACK_IMPORTED_MODULE_18__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'date':
     case 'date-time':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_DateTimeFormSchema_index__WEBPACK_IMPORTED_MODULE_21__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_DateTimeFormSchema_index__WEBPACK_IMPORTED_MODULE_22__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'time':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_TimeFormSchema_index__WEBPACK_IMPORTED_MODULE_22__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_TimeFormSchema_index__WEBPACK_IMPORTED_MODULE_23__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'url':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_URLFormSchema_index__WEBPACK_IMPORTED_MODULE_23__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_URLFormSchema_index__WEBPACK_IMPORTED_MODULE_24__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'color':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_ColorFormSchemaV3_index__WEBPACK_IMPORTED_MODULE_24__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_ColorFormSchemaV3_index__WEBPACK_IMPORTED_MODULE_25__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'input-image':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_InputImageSchema_index__WEBPACK_IMPORTED_MODULE_20__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_InputImageSchema_index__WEBPACK_IMPORTED_MODULE_21__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'json':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_JsonFormSchema_index__WEBPACK_IMPORTED_MODULE_25__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_JsonFormSchema_index__WEBPACK_IMPORTED_MODULE_26__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'codearea':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_CodeAreaFormSchema_index__WEBPACK_IMPORTED_MODULE_26__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_CodeAreaFormSchema_index__WEBPACK_IMPORTED_MODULE_27__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     case 'htmlarea':
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_HtmlAreaFormSchema_index__WEBPACK_IMPORTED_MODULE_27__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_HtmlAreaFormSchema_index__WEBPACK_IMPORTED_MODULE_28__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
     default:
-      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_InputFormSchema_index__WEBPACK_IMPORTED_MODULE_13__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
+      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement($renderers_InputFormSchema_index__WEBPACK_IMPORTED_MODULE_14__["default"], (0,_babel_runtime_helpers_extends__WEBPACK_IMPORTED_MODULE_0__["default"])({}, newProps, {
         key: curNodeKey
       }));
   }
@@ -67697,9 +67703,7 @@ var BoxStyleSchema = /*#__PURE__*/function (_React$PureComponent) {
         targetJsonSchema = _this$props.targetJsonSchema;
       // 从jsonData中获取对应的数值
       var curJsonData = getJSONDataByKeyRoute(keyRoute);
-      /** 获取quantity中的数值对象（默认第一个就是数值对象） */
-      var unitJsonKey = targetJsonSchema.propertyOrder[0];
-      var unitJsonSchema = targetJsonSchema.properties[unitJsonKey];
+      var unitJsonSchema = targetJsonSchema.properties['unit'];
       var quantity = curJsonData.quantity; // 获取数值单位
       var unitStr = curJsonData.unit || unitJsonSchema.default; // 获取数值
       // 重置数值
@@ -67708,7 +67712,7 @@ var BoxStyleSchema = /*#__PURE__*/function (_React$PureComponent) {
         right: '',
         bottom: '',
         left: '',
-        quantity: quantity // 设置单位值
+        quantity: quantity
       };
       // 设置盒子模型数值
       if (unitStr) {
@@ -71104,6 +71108,490 @@ ObjectSchema.propTypes = {
 
 /***/ }),
 
+/***/ "./src/renderers/PaddingAndMarginSchema/index.js":
+/*!*******************************************************!*\
+  !*** ./src/renderers/PaddingAndMarginSchema/index.js ***!
+  \*******************************************************/
+/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony import */ var _babel_runtime_helpers_inheritsLoose__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @babel/runtime/helpers/inheritsLoose */ "../../node_modules/@babel/runtime/helpers/esm/inheritsLoose.js");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var mobx_react__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! mobx-react */ "../../node_modules/mobx-react/dist/mobxreact.esm.js");
+/* harmony import */ var mobx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! mobx */ "../../node_modules/mobx/lib/mobx.module.js");
+/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! prop-types */ "../../node_modules/prop-types/index.js");
+/* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_10___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_10__);
+/* harmony import */ var antd__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! antd */ "../../node_modules/antd/es/select/index.js");
+/* harmony import */ var antd__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! antd */ "../../node_modules/antd/es/tooltip/index.js");
+/* harmony import */ var antd__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! antd */ "../../node_modules/antd/es/input/index.js");
+/* harmony import */ var antd__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! antd */ "../../node_modules/antd/es/popover/index.js");
+/* harmony import */ var _wibetter_json_utils__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @wibetter/json-utils */ "../json-utils/dist/index.esm.js");
+/* harmony import */ var $utils_index__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! $utils/index */ "./src/utils/index.js");
+/* harmony import */ var _index_scss__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./index.scss */ "./src/renderers/PaddingAndMarginSchema/index.scss");
+/* harmony import */ var _index_scss__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(_index_scss__WEBPACK_IMPORTED_MODULE_6__);
+
+
+
+
+
+
+var Option = antd__WEBPACK_IMPORTED_MODULE_3__["default"].Option;
+
+
+
+var PaddingAndMarginSchema = /*#__PURE__*/function (_React$PureComponent) {
+  function PaddingAndMarginSchema(props) {
+    var _this;
+    _this = _React$PureComponent.call(this, props) || this;
+    // 记录box-style的数值（无需实时响应）
+    _this.boxStyle = {
+      margin: {
+        top: '',
+        right: '',
+        bottom: '',
+        left: ''
+      },
+      padding: {
+        top: '',
+        right: '',
+        bottom: '',
+        left: ''
+      },
+      quantity: 'px'
+    };
+    /** 初始化boxStyle的数值 */
+    _this.initBoxStyle = function () {
+      var jsonStore = _this.props.jsonStore;
+      var _ref = jsonStore || {},
+        getJSONDataByKeyRoute = _ref.getJSONDataByKeyRoute;
+      var _this$props = _this.props,
+        keyRoute = _this$props.keyRoute,
+        targetJsonSchema = _this$props.targetJsonSchema;
+      // 从jsonData中获取对应的数值
+      var curJsonData = getJSONDataByKeyRoute(keyRoute);
+      var marginSchema = targetJsonSchema.properties['margin'];
+      var paddingSchema = targetJsonSchema.properties['padding'];
+      var quantitySchema = targetJsonSchema.properties['quantity'];
+      var quantity = curJsonData.quantity || quantitySchema.default; // 获取数值单位
+      var marginValue = curJsonData.margin || marginSchema.default;
+      var paddingValue = curJsonData.padding || paddingSchema.default;
+      marginValue = (0,_wibetter_json_utils__WEBPACK_IMPORTED_MODULE_4__.isNumber)(marginValue) ? marginValue.toString() : marginValue || 'auto';
+      paddingValue = (0,_wibetter_json_utils__WEBPACK_IMPORTED_MODULE_4__.isNumber)(paddingValue) ? paddingValue.toString() : paddingValue || 'auto';
+
+      // 重置数值
+      _this.boxStyle.quantity = quantity;
+      var marginValueArr = marginValue.split(' ');
+      _this.boxStyle.margin.top = _this.getStyleValText(marginValueArr[0]);
+      _this.boxStyle.margin.right = _this.getStyleValText(marginValueArr[1], paddingValue);
+      _this.boxStyle.margin.bottom = _this.getStyleValText(marginValueArr[2] || marginValueArr[0]);
+      _this.boxStyle.margin.left = _this.getStyleValText(marginValueArr[3] || marginValueArr[1], paddingValue);
+      var paddingValueArr = paddingValue.split(' ');
+      _this.boxStyle.padding.top = _this.getStyleValText(paddingValueArr[0]);
+      _this.boxStyle.padding.right = _this.getStyleValText(paddingValueArr[1], paddingValue);
+      _this.boxStyle.padding.bottom = _this.getStyleValText(paddingValueArr[2] || paddingValueArr[0]);
+      _this.boxStyle.padding.left = _this.getStyleValText(paddingValueArr[3] || paddingValueArr[1], paddingValue);
+    };
+    _this.getStyleValText = function (valStr, defaultValue) {
+      var curValue = 'auto';
+      if (valStr === 'auto' || valStr === 0 || valStr === '' || valStr === '0') {
+        curValue = valStr;
+      } else if (/^\$/.test(valStr)) {
+        // 识别特殊字符串数值: 保留以 $ 开头的数值
+        curValue = valStr;
+      } else if (valStr) {
+        curValue = parseInt(valStr);
+        curValue = (0,_wibetter_json_utils__WEBPACK_IMPORTED_MODULE_4__.isNumber)(curValue) ? curValue : 'auto';
+      } else if (defaultValue !== undefined) {
+        curValue = defaultValue;
+      }
+      return curValue;
+    };
+    _this.getStyleVal = function (valStr) {
+      var curValue = '';
+      if (valStr === 'auto' || valStr === 0) {
+        curValue = valStr;
+      } else if (/^\$/.test(valStr)) {
+        // 识别特殊字符串数值: 保留以 $ 开头的数值
+        return valStr;
+      } else if (valStr === '') {
+        curValue = 'auto';
+      } else if (valStr) {
+        curValue = parseInt(valStr);
+        curValue = (0,_wibetter_json_utils__WEBPACK_IMPORTED_MODULE_4__.isNumber)(curValue) ? curValue : 'auto';
+      }
+      if (curValue === 'auto' || curValue === 0) {
+        return curValue;
+      }
+      return "" + curValue + _this.boxStyle.quantity;
+    };
+    /** 设置布局容器的盒子模型数值 */
+    _this.setLayoutBoxStyle = function (newVal, layoutStyleLock, styleKey, propKey) {
+      if (layoutStyleLock) {
+        _this.linkLayoutBoxStyle(newVal, styleKey);
+      } else {
+        var curValue = _this.getStyleValText(newVal);
+        if (curValue !== undefined) {
+          _this.boxStyle[styleKey][propKey] = curValue;
+        } else {
+          _this.boxStyle[styleKey][propKey] = '';
+        }
+        _this.updateBoxStyleState();
+      }
+    };
+    /** 布局容器的盒子模型数值联动设值 */
+    _this.linkLayoutBoxStyle = function (newVal, styleKey) {
+      var curValue = _this.getStyleValText(newVal);
+      if (curValue !== undefined) {
+        _this.boxStyle[styleKey]['top'] = curValue;
+        _this.boxStyle[styleKey]['right'] = curValue;
+        _this.boxStyle[styleKey]['bottom'] = curValue;
+        _this.boxStyle[styleKey]['left'] = curValue;
+      } else {
+        _this.boxStyle[styleKey]['top'] = '';
+        _this.boxStyle[styleKey]['right'] = '';
+        _this.boxStyle[styleKey]['bottom'] = '';
+        _this.boxStyle[styleKey]['left'] = '';
+      }
+      _this.updateBoxStyleState();
+    };
+    /** 数值变动事件处理器 */
+    _this.updateBoxStyleState = function () {
+      var _this$props2 = _this.props,
+        keyRoute = _this$props2.keyRoute,
+        jsonStore = _this$props2.jsonStore;
+      var _ref2 = jsonStore || {},
+        updateFormValueData = _ref2.updateFormValueData;
+      var renderAction = _this.state.renderAction;
+      /** 获取布局容器的盒子模型数值 */
+      var curBoxValue = {
+        margin: _this.getMarginValue(),
+        padding: _this.getPaddingValue(),
+        quantity: _this.boxStyle.quantity
+      };
+      updateFormValueData(keyRoute, curBoxValue); // 更新单位数值
+      _this.setState({
+        renderAction: !renderAction
+      });
+    };
+    _this.getSelectAfter = function (curJsonData) {
+      var targetJsonSchema = _this.props.targetJsonSchema;
+      var quantitySchema = targetJsonSchema.properties['quantity'];
+      var quantity = curJsonData.quantity || quantitySchema.default;
+
+      /*
+      // 暂时不支持单位切换
+      const selectAfter = (
+        <Select defaultValue={quantity} onChange={this.quantityChange}>
+          {quantitySchema.options &&
+            quantitySchema.options.length > 0 &&
+            quantitySchema.options.map((option) => (
+              <Option value={option.value}>{option.label}</Option>
+            ))}
+        </Select>
+      );
+      */
+      var selectAfter = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("span", null, quantity);
+      return selectAfter;
+    };
+    _this.quantityChange = function (newVal) {
+      var _this$props3 = _this.props,
+        keyRoute = _this$props3.keyRoute,
+        jsonStore = _this$props3.jsonStore;
+      var _ref3 = jsonStore || {},
+        updateFormValueData = _ref3.updateFormValueData;
+      var curBoxValue = {
+        margin: _this.getMarginValue(),
+        padding: _this.getPaddingValue(),
+        quantity: newVal
+      };
+      updateFormValueData(keyRoute, curBoxValue);
+    };
+    _this.setType = function (newVal) {
+      _this.setState({
+        type: newVal
+      });
+    };
+    _this.getMarginValue = function () {
+      return _this.getStyleVal(_this.boxStyle.margin.top) + " " + _this.getStyleVal(_this.boxStyle.margin.right) + " " + _this.getStyleVal(_this.boxStyle.margin.bottom) + " " + _this.getStyleVal(_this.boxStyle.margin.left);
+    };
+    _this.getPaddingValue = function () {
+      return _this.getStyleVal(_this.boxStyle.padding.top) + " " + _this.getStyleVal(_this.boxStyle.padding.right) + " " + _this.getStyleVal(_this.boxStyle.padding.bottom) + " " + _this.getStyleVal(_this.boxStyle.padding.left);
+    };
+    _this.state = {
+      type: 'all',
+      // 设置类型，支持 自定义设值（custom）、统一设值（all）
+      layoutStyleLock: false,
+      // 是否锁住容器数值值的设置，默认为false，设置为true后4个数值同时联动
+      renderAction: false // 用于主动触发render的临时变量
+    };
+    // 这边绑定是必要的，这样 `this` 才能在回调函数中使用
+    _this.updateBoxStyleState = _this.updateBoxStyleState.bind(_this);
+    _this.initBoxStyle = _this.initBoxStyle.bind(_this);
+    _this.getStyleValText = _this.getStyleValText.bind(_this);
+    _this.getSelectAfter = _this.getSelectAfter.bind(_this);
+    _this.setLayoutBoxStyle = _this.setLayoutBoxStyle.bind(_this);
+    _this.linkLayoutBoxStyle = _this.linkLayoutBoxStyle.bind(_this);
+    _this.getSelectAfter = _this.getSelectAfter.bind(_this);
+    _this.quantityChange = _this.quantityChange.bind(_this);
+    return _this;
+  }
+  (0,_babel_runtime_helpers_inheritsLoose__WEBPACK_IMPORTED_MODULE_0__["default"])(PaddingAndMarginSchema, _React$PureComponent);
+  var _proto = PaddingAndMarginSchema.prototype;
+  _proto.componentWillMount = function componentWillMount() {
+    this.initBoxStyle();
+  };
+  _proto.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
+    this.initBoxStyle();
+  };
+  _proto.render = function render() {
+    var _this2 = this;
+    var _this$props4 = this.props,
+      nodeKey = _this$props4.nodeKey,
+      jsonKey = _this$props4.jsonKey,
+      targetJsonSchema = _this$props4.targetJsonSchema,
+      keyRoute = _this$props4.keyRoute;
+    var _this$props5 = this.props,
+      schemaStore = _this$props5.schemaStore,
+      jsonStore = _this$props5.jsonStore;
+    var _ref4 = schemaStore || {},
+      pageScreen = _ref4.pageScreen;
+    var _ref5 = jsonStore || {},
+      getJSONDataByKeyRoute = _ref5.getJSONDataByKeyRoute;
+    var _this$state = this.state,
+      renderAction = _this$state.renderAction,
+      layoutStyleLock = _this$state.layoutStyleLock,
+      type = _this$state.type;
+    var readOnly = targetJsonSchema.readOnly || false; // 是否只读（默认可编辑）
+
+    // 从jsonData中获取对应的数值
+    var curJsonData = getJSONDataByKeyRoute(keyRoute) || {};
+    var style = targetJsonSchema.style ? (0,$utils_index__WEBPACK_IMPORTED_MODULE_5__.buildStyle)((0,mobx__WEBPACK_IMPORTED_MODULE_2__.toJS)(targetJsonSchema.style)) : {};
+    var titleStyle = targetJsonSchema.titleStyle ? (0,$utils_index__WEBPACK_IMPORTED_MODULE_5__.buildStyle)((0,mobx__WEBPACK_IMPORTED_MODULE_2__.toJS)(targetJsonSchema.titleStyle)) : {};
+    var contentStyle = targetJsonSchema.contentStyle ? (0,$utils_index__WEBPACK_IMPORTED_MODULE_5__.buildStyle)((0,mobx__WEBPACK_IMPORTED_MODULE_2__.toJS)(targetJsonSchema.contentStyle)) : {};
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: (pageScreen === 'wideScreen' ? 'wide-screen-element-warp' : "mobile-screen-element-warp") + " " + (renderAction ? 'render-mark' : ''),
+      id: nodeKey,
+      key: nodeKey,
+      style: style
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "element-title",
+      style: titleStyle
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("span", {
+      className: "title-text warning-text"
+    }, readOnly ? '[只读]' : ''), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_7__["default"], {
+      title: targetJsonSchema.description,
+      placement: "top"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("span", {
+      className: "title-text",
+      title: pageScreen === 'wideScreen' && targetJsonSchema.title.length > (readOnly ? 4 : 6) ? targetJsonSchema.title : ''
+    }, targetJsonSchema.title, targetJsonSchema.showKey && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("span", null, "\uFF08", (0,_wibetter_json_utils__WEBPACK_IMPORTED_MODULE_4__.truncate)(jsonKey, {
+      length: 15
+    }), "\uFF09")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "content-item Style-PaddingAndMargin",
+      style: contentStyle
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-inner"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-label Style-PaddingAndMargin-label--custom"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "\n                  Style-PaddingAndMargin-label-all\n                  " + (type === 'all' ? 'Style-PaddingAndMargin-label-all--active' : ''),
+      onClick: function onClick() {
+        return _this2.setType('all');
+      }
+    }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "\n                Style-PaddingAndMargin-label-custom\n                " + (type === 'custom' ? 'Style-PaddingAndMargin-label-custom--active' : ''),
+      onClick: function onClick() {
+        return _this2.setType('custom');
+      }
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", null))), type === 'all' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(react__WEBPACK_IMPORTED_MODULE_1__.Fragment, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-input"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_8__["default"], {
+      name: "layoutMargin",
+      addonAfter: this.getSelectAfter(curJsonData),
+      className: "layout-item-margin",
+      size: "small",
+      defaultValue: this.boxStyle['margin'].top,
+      onChange: function onChange(event) {
+        var newVal = event.target.value;
+        _this2.setLayoutBoxStyle(newVal, true, 'margin');
+      }
+    }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-input-label"
+    }, "\u5916\u8FB9\u8DDD")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-input"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_8__["default"], {
+      name: "layoutPadding",
+      addonAfter: this.getSelectAfter(curJsonData),
+      className: "layout-item-padding",
+      size: "small",
+      defaultValue: this.boxStyle['padding'].top,
+      onChange: function onChange(event) {
+        var newVal = event.target.value;
+        _this2.setLayoutBoxStyle(newVal, true, 'padding');
+      }
+    }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-input-label"
+    }, "\u5185\u8FB9\u8DDD")))), type !== 'all' && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-custom Style-PaddingAndMargin-custom--padding Style-PaddingAndMargin-custom--margin"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_9__["default"], {
+      content: function content() {
+        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_8__["default"], {
+          name: "layoutPaddingTop",
+          addonAfter: _this2.getSelectAfter(curJsonData),
+          className: "layout-item-padding",
+          size: "small",
+          defaultValue: _this2.boxStyle['padding'].top,
+          onChange: function onChange(event) {
+            var newVal = event.target.value;
+            _this2.setLayoutBoxStyle(newVal, false, 'padding', 'top');
+          }
+        });
+      },
+      title: ""
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-custom-paddingTop"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", null, this.getStyleVal(this.boxStyle['padding'].top) || '-'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_9__["default"], {
+      content: function content() {
+        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_8__["default"], {
+          name: "layoutPaddingTop",
+          addonAfter: _this2.getSelectAfter(curJsonData),
+          className: "layout-item-padding",
+          size: "small",
+          defaultValue: _this2.boxStyle['padding'].right,
+          onChange: function onChange(event) {
+            var newVal = event.target.value;
+            _this2.setLayoutBoxStyle(newVal, false, 'padding', 'right');
+          }
+        });
+      },
+      title: ""
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-custom-paddingRight"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", null, this.getStyleVal(this.boxStyle['padding'].right) || '-'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_9__["default"], {
+      content: function content() {
+        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_8__["default"], {
+          name: "layoutPaddingBottom",
+          addonAfter: _this2.getSelectAfter(curJsonData),
+          className: "layout-item-padding",
+          size: "small",
+          defaultValue: _this2.boxStyle['padding'].bottom,
+          onChange: function onChange(event) {
+            var newVal = event.target.value;
+            _this2.setLayoutBoxStyle(newVal, false, 'padding', 'bottom');
+          }
+        });
+      },
+      title: ""
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-custom-paddingBottom"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", null, this.getStyleVal(this.boxStyle['padding'].bottom) || '-'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_9__["default"], {
+      content: function content() {
+        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_8__["default"], {
+          name: "layoutPaddingLeft",
+          addonAfter: _this2.getSelectAfter(curJsonData),
+          className: "layout-item-padding",
+          size: "small",
+          defaultValue: _this2.boxStyle['padding'].left,
+          onChange: function onChange(event) {
+            var newVal = event.target.value;
+            _this2.setLayoutBoxStyle(newVal, false, 'padding', 'left');
+          }
+        });
+      },
+      title: ""
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-custom-paddingLeft"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", null, this.getStyleVal(this.boxStyle['padding'].left) || '-'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_9__["default"], {
+      content: function content() {
+        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_8__["default"], {
+          name: "layoutMarginTop",
+          addonAfter: _this2.getSelectAfter(curJsonData),
+          className: "layout-item-margin",
+          size: "small",
+          defaultValue: _this2.boxStyle['margin'].top,
+          onChange: function onChange(event) {
+            var newVal = event.target.value;
+            _this2.setLayoutBoxStyle(newVal, false, 'margin', 'top');
+          }
+        });
+      },
+      title: ""
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-custom-marginTop"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", null, this.getStyleVal(this.boxStyle['margin'].top) || '-'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_9__["default"], {
+      content: function content() {
+        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_8__["default"], {
+          name: "layoutMarginRight",
+          addonAfter: _this2.getSelectAfter(curJsonData),
+          className: "layout-item-margin",
+          size: "small",
+          defaultValue: _this2.boxStyle['margin'].right,
+          onChange: function onChange(event) {
+            var newVal = event.target.value;
+            _this2.setLayoutBoxStyle(newVal, false, 'margin', 'right');
+          }
+        });
+      },
+      title: ""
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-custom-marginRight"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", null, this.getStyleVal(this.boxStyle['margin'].right) || '-'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_9__["default"], {
+      content: function content() {
+        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_8__["default"], {
+          name: "layoutMarginBottom",
+          addonAfter: _this2.getSelectAfter(curJsonData),
+          className: "layout-item-margin",
+          size: "small",
+          defaultValue: _this2.boxStyle['margin'].bottom,
+          onChange: function onChange(event) {
+            var newVal = event.target.value;
+            _this2.setLayoutBoxStyle(newVal, false, 'margin', 'bottom');
+          }
+        });
+      },
+      title: ""
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-custom-marginBottom"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", null, this.getStyleVal(this.boxStyle['margin'].bottom) || '-'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_9__["default"], {
+      content: function content() {
+        return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement(antd__WEBPACK_IMPORTED_MODULE_8__["default"], {
+          name: "layoutMarginLeft",
+          addonAfter: _this2.getSelectAfter(curJsonData),
+          className: "layout-item-margin",
+          size: "small",
+          defaultValue: _this2.boxStyle['margin'].left,
+          onChange: function onChange(event) {
+            var newVal = event.target.value;
+            _this2.setLayoutBoxStyle(newVal, false, 'margin', 'left');
+          }
+        });
+      },
+      title: ""
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", {
+      className: "Style-PaddingAndMargin-custom-marginLeft"
+    }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.createElement("div", null, this.getStyleVal(this.boxStyle['margin'].left) || '-'))))));
+  };
+  return PaddingAndMarginSchema;
+}(react__WEBPACK_IMPORTED_MODULE_1__.PureComponent);
+PaddingAndMarginSchema.propTypes = {
+  parentType: (prop_types__WEBPACK_IMPORTED_MODULE_10___default().string),
+  jsonKey: (prop_types__WEBPACK_IMPORTED_MODULE_10___default().string),
+  indexRoute: (prop_types__WEBPACK_IMPORTED_MODULE_10___default().string),
+  keyRoute: (prop_types__WEBPACK_IMPORTED_MODULE_10___default().string),
+  nodeKey: (prop_types__WEBPACK_IMPORTED_MODULE_10___default().string),
+  targetJsonSchema: (prop_types__WEBPACK_IMPORTED_MODULE_10___default().any)
+};
+/* harmony default export */ __webpack_exports__["default"] = ((0,mobx_react__WEBPACK_IMPORTED_MODULE_11__.inject)(function (stores) {
+  return {
+    schemaStore: stores.JSONSchemaStore,
+    jsonStore: stores.JSONEditorStore
+  };
+})((0,mobx_react__WEBPACK_IMPORTED_MODULE_11__.observer)(PaddingAndMarginSchema)));
+
+/***/ }),
+
 /***/ "./src/renderers/QuantitySchema/index.js":
 /*!***********************************************!*\
   !*** ./src/renderers/QuantitySchema/index.js ***!
@@ -71844,19 +72332,24 @@ var SohuDataSourceSchema = /*#__PURE__*/function (_React$PureComponent) {
       jsonStore = _this$props.jsonStore;
     var _ref = schemaStore || {},
       pageScreen = _ref.pageScreen;
-    // const { getJSONDataByKeyRoute } = jsonStore || {};
+    var _ref2 = jsonStore || {},
+      getJSONDataByKeyRoute = _ref2.getJSONDataByKeyRoute,
+      JSONEditorObj = _ref2.JSONEditorObj;
     var _this$props2 = this.props,
       indexRoute = _this$props2.indexRoute,
       jsonKey = _this$props2.jsonKey,
       nodeKey = _this$props2.nodeKey,
       keyRoute = _this$props2.keyRoute,
       targetJsonSchema = _this$props2.targetJsonSchema;
+
     // 获取前端缓存中的折叠数据
     var collapseData = ['mainConfig'];
     var collapseCacheData = (0,$utils_webCache__WEBPACK_IMPORTED_MODULE_7__.getJSONEditorCache)(keyRoute);
     if (collapseCacheData && (0,_wibetter_json_utils__WEBPACK_IMPORTED_MODULE_4__.isArray)(collapseCacheData)) {
       collapseData = collapseCacheData;
     }
+    var curData = getJSONDataByKeyRoute(keyRoute) || {};
+    curData = Object.assign({}, JSONEditorObj, curData);
     var style = targetJsonSchema.style ? (0,$utils_index__WEBPACK_IMPORTED_MODULE_8__.buildStyle)((0,mobx__WEBPACK_IMPORTED_MODULE_2__.toJS)(targetJsonSchema.style)) : {};
     var titleStyle = targetJsonSchema.titleStyle ? (0,$utils_index__WEBPACK_IMPORTED_MODULE_8__.buildStyle)((0,mobx__WEBPACK_IMPORTED_MODULE_2__.toJS)(targetJsonSchema.titleStyle)) : {};
     var contentStyle = targetJsonSchema.contentStyle ? (0,$utils_index__WEBPACK_IMPORTED_MODULE_8__.buildStyle)((0,mobx__WEBPACK_IMPORTED_MODULE_2__.toJS)(targetJsonSchema.contentStyle)) : {};
@@ -71899,6 +72392,9 @@ var SohuDataSourceSchema = /*#__PURE__*/function (_React$PureComponent) {
       /** 5. 获取当前元素的id，用于做唯一标识 */
       var childNodeKey = nodeKey + "-" + curType + "-" + currentJsonKey;
       if (currentSchemaData.propertyOrder && currentSchemaData.propertyOrder.length > 0) {
+        if ((0,$utils_index__WEBPACK_IMPORTED_MODULE_8__.hasProperties)(currentSchemaData.onShow) && currentSchemaData.onShow !== '' && ((0,_wibetter_json_utils__WEBPACK_IMPORTED_MODULE_4__.isBoolean)(currentSchemaData.onShow) && !currentSchemaData.onShow || (0,_wibetter_json_utils__WEBPACK_IMPORTED_MODULE_4__.isString)(currentSchemaData.onShow) && !(0,_wibetter_json_utils__WEBPACK_IMPORTED_MODULE_4__.evalExpression)(currentSchemaData.onShow, curData))) {
+          return;
+        }
         return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(Panel, {
           header: currentSchemaData.title,
           key: currentJsonKey
@@ -156196,6 +156692,16 @@ module.exports = Math.pow;
 
 /***/ }),
 
+/***/ "../../node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-11.use[1]!../../node_modules/css-loader/dist/cjs.js??clonedRuleSet-11.use[2]!../../node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-11.use[3]!../../node_modules/sass-loader/dist/cjs.js??clonedRuleSet-11.use[4]!../../node_modules/sass-resources-loader/lib/loader.js??clonedRuleSet-11.use[5]!./src/renderers/PaddingAndMarginSchema/index.scss":
+/*!******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
+  !*** ../../node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-11.use[1]!../../node_modules/css-loader/dist/cjs.js??clonedRuleSet-11.use[2]!../../node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-11.use[3]!../../node_modules/sass-loader/dist/cjs.js??clonedRuleSet-11.use[4]!../../node_modules/sass-resources-loader/lib/loader.js??clonedRuleSet-11.use[5]!./src/renderers/PaddingAndMarginSchema/index.scss ***!
+  \******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
+/***/ (function() {
+
+// extracted by mini-css-extract-plugin
+
+/***/ }),
+
 /***/ "../../node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-11.use[1]!../../node_modules/css-loader/dist/cjs.js??clonedRuleSet-11.use[2]!../../node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-11.use[3]!../../node_modules/sass-loader/dist/cjs.js??clonedRuleSet-11.use[4]!../../node_modules/sass-resources-loader/lib/loader.js??clonedRuleSet-11.use[5]!./src/renderers/RemoteDynamicDataSchema/index.scss":
 /*!*******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
   !*** ../../node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-11.use[1]!../../node_modules/css-loader/dist/cjs.js??clonedRuleSet-11.use[2]!../../node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-11.use[3]!../../node_modules/sass-loader/dist/cjs.js??clonedRuleSet-11.use[4]!../../node_modules/sass-resources-loader/lib/loader.js??clonedRuleSet-11.use[5]!./src/renderers/RemoteDynamicDataSchema/index.scss ***!
@@ -266798,6 +267304,27 @@ if(false) {}
 
 /***/ }),
 
+/***/ "./src/renderers/PaddingAndMarginSchema/index.scss":
+/*!*********************************************************!*\
+  !*** ./src/renderers/PaddingAndMarginSchema/index.scss ***!
+  \*********************************************************/
+/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
+
+// style-loader: Adds some css to the DOM by adding a <style> tag
+
+// load the styles
+var content = __webpack_require__(/*! !!../../../../../node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-11.use[1]!../../../../../node_modules/css-loader/dist/cjs.js??clonedRuleSet-11.use[2]!../../../../../node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-11.use[3]!../../../../../node_modules/sass-loader/dist/cjs.js??clonedRuleSet-11.use[4]!../../../../../node_modules/sass-resources-loader/lib/loader.js??clonedRuleSet-11.use[5]!./index.scss */ "../../node_modules/mini-css-extract-plugin/dist/loader.js??clonedRuleSet-11.use[1]!../../node_modules/css-loader/dist/cjs.js??clonedRuleSet-11.use[2]!../../node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-11.use[3]!../../node_modules/sass-loader/dist/cjs.js??clonedRuleSet-11.use[4]!../../node_modules/sass-resources-loader/lib/loader.js??clonedRuleSet-11.use[5]!./src/renderers/PaddingAndMarginSchema/index.scss");
+if(content.__esModule) content = content.default;
+if(typeof content === 'string') content = [[module.id, content, '']];
+if(content.locals) module.exports = content.locals;
+// add the styles to the DOM
+var add = (__webpack_require__(/*! !../../../../../node_modules/vue-style-loader/lib/addStylesClient.js */ "../../node_modules/vue-style-loader/lib/addStylesClient.js")["default"])
+var update = add("6e510ca0", content, false, {"sourceMap":false});
+// Hot Module Replacement
+if(false) {}
+
+/***/ }),
+
 /***/ "./src/renderers/RemoteDynamicDataSchema/index.scss":
 /*!**********************************************************!*\
   !*** ./src/renderers/RemoteDynamicDataSchema/index.scss ***!
@@ -267574,7 +268101,6 @@ var initJSONSchemaData = {
     func: {
       type: 'object',
       title: '功能设置',
-      isContainer: false,
       properties: {
         a: {
           title: '单文本框',
@@ -267593,7 +268119,6 @@ var initJSONSchemaData = {
     style: {
       type: 'object',
       title: '样式设置',
-      isContainer: false,
       properties: {
         b: {
           title: '单文本框',
@@ -267610,7 +268135,6 @@ var initJSONSchemaData = {
     data: {
       type: 'data',
       title: '数据设置',
-      isContainer: false,
       properties: {
         c: {
           title: '单文本框',
@@ -268191,6 +268715,61 @@ var initBoxStyleData = {
   propertyOrder: ['unit', 'quantity'],
 };
 
+/** padding-margin 字段项
+ * 【字段属性说明】
+ *  title：字段项的label值
+ *  properties：存放所有的子字段数据内容
+ *  type：用于标识字段项的展示类型（input、date、data-time、url、textarea 等）
+ *  readOnly：字段项可设置是否可编辑
+ *  required：存放所有子字段的key值，用于验证子字段项是否存在，同时required可充当排序功能
+ *  propertyOrder：按序存放所有子字段的key值（排序功能）
+ * */
+var initPaddingMarginData = {
+  type: 'padding-margin',
+  title: '边距设置',
+  isContainer: false,
+  properties: {
+    margin: {
+      title: '外边距',
+      type: 'input',
+      default: '0',
+      // 默认值为'0'：'0px 0px 0px 0px'；为'5px': '5px 5px 5px 5px'
+      description: '',
+    },
+    padding: {
+      title: '内边距',
+      type: 'input',
+      default: '0',
+      description: '',
+    },
+    quantity: {
+      type: 'select',
+      // 选择列表
+      default: 'px',
+      options: [
+        {
+          label: 'px',
+          value: 'px',
+        },
+        {
+          label: 'rem',
+          value: 'rem',
+        },
+        {
+          label: 'em',
+          value: 'em',
+        },
+        {
+          label: '%',
+          value: '%',
+        },
+      ],
+      title: '单位类型',
+    },
+  },
+  propertyOrder: ['margin', 'padding', 'quantity'],
+};
+
 /* json类型字段
  * 【字段属性说明】
  *  title：字段项的label值
@@ -269652,6 +270231,7 @@ var TypeDataList = {
   time: initTimeData,
   quantity: initQuantityData,
   'box-style': initBoxStyleData,
+  'padding-margin': initPaddingMarginData,
   radio: initRadioData,
   select: initSelectData,
   cascader: initCascaderSchema,
@@ -274708,6 +275288,7 @@ var valExpectType =
     array: 'array',
     boolean: 'boolean',
     'box-style': 'object',
+    'padding-margin': 'object',
     codearea: 'string',
     color: 'string',
     datasource: 'object',