npm - @zzdadelu/schema-builder - Versions diffs - 1.0.0-alpha.1 - Mend

@zzdadelu/schema-builder 1.0.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (58) hide show

package/CHANGELOG.md +1 -0
package/LICENSE +21 -0
package/README.md +39 -0
package/es/createIframe.js +12 -0
package/es/index.js +2 -0
package/es/main.js +64 -0
package/es/settings/index.js +26 -0
package/es/settings/meta/card.js +108 -0
package/es/settings/meta/cardList.js +203 -0
package/es/settings/meta/checkbox.js +29 -0
package/es/settings/meta/checkboxes.js +66 -0
package/es/settings/meta/color.js +21 -0
package/es/settings/meta/date.js +28 -0
package/es/settings/meta/dateRange.js +37 -0
package/es/settings/meta/form.js +115 -0
package/es/settings/meta/imageInput.js +21 -0
package/es/settings/meta/input.js +62 -0
package/es/settings/meta/number.js +69 -0
package/es/settings/meta/radio.js +65 -0
package/es/settings/meta/rate.js +56 -0
package/es/settings/meta/select.js +58 -0
package/es/settings/meta/slider.js +40 -0
package/es/settings/meta/switch.js +48 -0
package/es/settings/meta/textarea.js +69 -0
package/es/settings/meta/time.js +29 -0
package/es/settings/meta/timeRange.js +37 -0
package/es/settings/meta/treeSelect.js +85 -0
package/es/settings/meta/urlInput.js +34 -0
package/es/settings/utils.js +251 -0
package/es/type.js +1 -0
package/lib/createIframe.js +18 -0
package/lib/index.js +9 -0
package/lib/main.js +72 -0
package/lib/settings/index.js +153 -0
package/lib/settings/meta/card.js +114 -0
package/lib/settings/meta/cardList.js +209 -0
package/lib/settings/meta/checkbox.js +35 -0
package/lib/settings/meta/checkboxes.js +72 -0
package/lib/settings/meta/color.js +27 -0
package/lib/settings/meta/date.js +34 -0
package/lib/settings/meta/dateRange.js +43 -0
package/lib/settings/meta/form.js +121 -0
package/lib/settings/meta/imageInput.js +27 -0
package/lib/settings/meta/input.js +68 -0
package/lib/settings/meta/number.js +75 -0
package/lib/settings/meta/radio.js +71 -0
package/lib/settings/meta/rate.js +62 -0
package/lib/settings/meta/select.js +64 -0
package/lib/settings/meta/slider.js +46 -0
package/lib/settings/meta/switch.js +54 -0
package/lib/settings/meta/textarea.js +75 -0
package/lib/settings/meta/time.js +35 -0
package/lib/settings/meta/timeRange.js +43 -0
package/lib/settings/meta/treeSelect.js +91 -0
package/lib/settings/meta/urlInput.js +40 -0
package/lib/settings/utils.js +258 -0
package/lib/type.js +1 -0
package/package.json +95 -0

package/CHANGELOG.md ADDED Viewed

	@@ -0,0 +1 @@
1	+ # Change Log

package/LICENSE ADDED Viewed

@@ -0,0 +1,21 @@
+MIT License
+Copyright (c) 2019-present XRender Team
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md ADDED Viewed

@@ -0,0 +1,39 @@
+## 如何使用
+### 安装
+```bash
+npm i @xrenders/schema-builder
+```
+### 代码演示
+```jsx
+/**
+ * transform: true
+ * defaultShowCode: true
+ */
+import React from 'react';
+import SchemaBuilder from '@xrenders/schema-builder';
+const defaultValue = {
+  type: 'object',
+  properties: {
+    inputName: {
+      title: '简单输入框',
+      type: 'string',
+    },
+  },
+};
+const Demo = () => {
+  return (
+    <div style={{ height: '80vh' }}>
+      <SchemaBuilder defaultValue={defaultValue} />
+    </div>
+  );
+};
+export default Demo;
+```

package/es/createIframe.js ADDED Viewed

@@ -0,0 +1,12 @@
+var createIframeContent = function createIframeContent() {
+  var html = "\n    <html>\n      <head>\n        <meta charset=\"UTF-8\" />\n        <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\" />\n        <meta http-equiv=\"X-UA-Compatible\" content=\"ie=edge\" />\n        <title>XRender</title>\n        <link rel=\"icon\" href=\"https://img.alicdn.com/tfs/TB17UtINiLaK1RjSZFxXXamPFXa-606-643.png\">\n        <link href=\"https://alifd.alicdn.com/npm/@alifd/theme-lowcode-light@0.2.1/variables.css\" rel=\"stylesheet\" />\n        <link href=\"https://alifd.alicdn.com/npm/@alifd/theme-lowcode-light@0.2.1/dist/next.var.min.css\" rel=\"stylesheet\" />\n        <link rel=\"stylesheet\" href=\"https://uipaas-assets.com/prod/npm/@alilc/lowcode-engine/1.2.3/dist/css/engine-core.css\" />\n        <link rel=\"stylesheet\" href=\"https://uipaas-assets.com/prod/npm/@alilc/lowcode-engine-ext/1.0.6/dist/css/engine-ext.css\" />\n        <link rel=\"stylesheet\" href=\"https://g.alicdn.com/fone-lowcode/fr-generator/1.1.0/css/index.css\" />\n\n        <script>\n          window.React = window.parent.React;\n          window.ReactDOM = window.parent.ReactDOM;\n        </script>\n        \n        <script src=\"https://g.alicdn.com/code/lib/prop-types/15.7.2/prop-types.js\"></script>\n        <script src=\"https://g.alicdn.com/platform/c/react15-polyfill/0.0.1/dist/index.js\"></script>\n        <script src=\"https://g.alicdn.com/platform/c/lodash/4.6.1/lodash.min.js\"></script>\n        <script src=\"https://g.alicdn.com/mylib/moment/2.24.0/min/moment.min.js\"></script>\n        <script src=\"https://g.alicdn.com/code/lib/alifd__next/1.23.24/next.min.js\"></script>\n        <script crossorigin=\"anonymous\" src=\"https://uipaas-assets.com/prod/npm/@alilc/lowcode-engine/1.2.3/dist/js/engine-core.js\"></script>\n        <script crossorigin=\"anonymous\" src=\"https://uipaas-assets.com/prod/npm/@alilc/lowcode-engine-ext/1.0.6/dist/js/engine-ext.js\"></script>\n      </head>\n\n      <body>\n        <div id=\"lce-container\"></div>\n        <script type=\"text/javascript\" src=\"https://g.alicdn.com/fone-lowcode/fr-generator/1.1.0/js/index.js\"></script>\n      </body>\n    </html>\n  ";
+  return html;
+};
+export default (function () {
+  var iframe = document.createElement('iframe');
+  iframe.width = '100%';
+  iframe.height = '100%';
+  iframe.frameBorder = '0';
+  iframe.srcdoc = createIframeContent();
+  return iframe;
+});

package/es/index.js ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ import Main from './main';
2	+ export default Main;

package/es/main.js ADDED Viewed

@@ -0,0 +1,64 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["widgets", "settings"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
+import React, { useEffect, useRef, useImperativeHandle, forwardRef } from 'react';
+import createIframe from './createIframe';
+import * as defaultSetting from './settings';
+var iframe;
+var Design = function Design(props, ref) {
+  var widgets = props.widgets,
+    settings = props.settings,
+    restProps = _objectWithoutProperties(props, _excluded);
+  var containerRef = useRef();
+  useImperativeHandle(ref, function () {
+    return {
+      getValue: function getValue() {
+        var _iframe, _iframe$contentWindow, _iframe$contentWindow2, _iframe$contentWindow3;
+        return (_iframe = iframe) === null || _iframe === void 0 ? void 0 : (_iframe$contentWindow = _iframe.contentWindow) === null || _iframe$contentWindow === void 0 ? void 0 : (_iframe$contentWindow2 = _iframe$contentWindow.__FR_ENGINE__) === null || _iframe$contentWindow2 === void 0 ? void 0 : (_iframe$contentWindow3 = _iframe$contentWindow2.exportSchema) === null || _iframe$contentWindow3 === void 0 ? void 0 : _iframe$contentWindow3.call(_iframe$contentWindow2);
+      },
+      setValue: function setValue(schema) {
+        var _iframe2, _iframe2$contentWindo, _iframe2$contentWindo2, _iframe2$contentWindo3;
+        return (_iframe2 = iframe) === null || _iframe2 === void 0 ? void 0 : (_iframe2$contentWindo = _iframe2.contentWindow) === null || _iframe2$contentWindo === void 0 ? void 0 : (_iframe2$contentWindo2 = _iframe2$contentWindo.__FR_ENGINE__) === null || _iframe2$contentWindo2 === void 0 ? void 0 : (_iframe2$contentWindo3 = _iframe2$contentWindo2.importSchema) === null || _iframe2$contentWindo3 === void 0 ? void 0 : _iframe2$contentWindo3.call(_iframe2$contentWindo2, schema);
+      }
+    };
+  });
+  useEffect(function () {
+    initIframe();
+    window.addEventListener('message', engineOnLoad);
+    return function () {
+      window.removeEventListener('message', engineOnLoad);
+    };
+  }, []);
+  var initIframe = function initIframe() {
+    iframe = createIframe();
+    containerRef.current.appendChild(iframe);
+  };
+  var engineOnLoad = function engineOnLoad(event) {
+    var _iframe3, _iframe3$contentWindo, _iframe3$contentWindo2;
+    if (event.data.type !== 'engine-load') {
+      return;
+    }
+    (_iframe3 = iframe) === null || _iframe3 === void 0 ? void 0 : (_iframe3$contentWindo = _iframe3.contentWindow) === null || _iframe3$contentWindo === void 0 ? void 0 : (_iframe3$contentWindo2 = _iframe3$contentWindo.__FR_ENGINE__) === null || _iframe3$contentWindo2 === void 0 ? void 0 : _iframe3$contentWindo2.init(_objectSpread({
+      settings: _objectSpread(_objectSpread({}, defaultSetting), settings),
+      widgets: widgets,
+      // recordEnable: true,
+      logo: {
+        title: 'XRender'
+      }
+    }, restProps));
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    ref: containerRef,
+    style: {
+      width: '100%',
+      height: '100%'
+    }
+  });
+};
+export default /*#__PURE__*/forwardRef(Design);

package/es/settings/index.js ADDED Viewed

@@ -0,0 +1,26 @@
+// 常用组件配置
+export { default as Input } from './meta/input';
+export { default as Number } from './meta/number';
+export { default as Select } from './meta/select';
+export { default as Radio } from './meta/radio';
+export { default as Checkbox } from './meta/checkbox';
+export { default as Checkboxes } from './meta/checkboxes';
+export { default as Textarea } from './meta/textarea';
+export { default as DatePicker } from './meta/date';
+export { default as DateRange } from './meta/dateRange';
+export { default as TimePicker } from './meta/time';
+export { default as TimeRange } from './meta/timeRange';
+export { default as Rate } from './meta/rate';
+export { default as Switch } from './meta/switch';
+export { default as Slider } from './meta/slider';
+// 其他组件配置
+export { default as Color } from './meta/color';
+export { default as ImageInput } from './meta/imageInput';
+export { default as UrlInput } from './meta/urlInput';
+export { default as TreeSelect } from './meta/treeSelect';
+// 容器组件配置
+export { default as Form } from './meta/form';
+export { default as card } from './meta/card';
+export { default as CardList } from './meta/cardList';

package/es/settings/meta/card.js ADDED Viewed

@@ -0,0 +1,108 @@
+import { createMeta } from '../utils';
+var props = [{
+  name: 'title',
+  title: {
+    label: '标题',
+    tip: 'title | 卡片主题'
+  },
+  setter: 'StringSetter'
+}, {
+  name: 'code',
+  title: {
+    label: '字段名',
+    tip: 'key | 字段名'
+  },
+  setter: 'StringSetter'
+}, {
+  name: 'description',
+  title: {
+    label: '描述',
+    tip: 'description ｜ 卡片的描述'
+  },
+  setter: 'StringSetter'
+}, {
+  name: 'column',
+  title: {
+    label: '一行多列',
+    tip: 'column ｜ 表单内容分成几列展示'
+  },
+  defaultValue: 1,
+  setter: {
+    componentName: 'RadioGroupSetter',
+    props: {
+      options: [{
+        title: '一列',
+        value: 1
+      }, {
+        title: '两列',
+        value: 2
+      }, {
+        title: '三列',
+        value: 3
+      }, {
+        title: '四列',
+        value: 4
+      }]
+    }
+  }
+}, {
+  name: 'widget',
+  title: {
+    label: '类型',
+    tip: 'widget ｜ 类型'
+  },
+  defaultValue: 1,
+  setter: {
+    componentName: 'RadioGroupSetter',
+    props: {
+      options: [{
+        title: '卡片',
+        value: 'card'
+      }, {
+        title: '折叠面板',
+        value: 'collapse'
+      }, {
+        title: '标题线',
+        value: 'lineTitle'
+      }, {
+        title: '内联',
+        value: 'subInline'
+      }]
+    }
+  }
+}];
+var snippets = [{
+  title: '对象',
+  screenshot: 'icon-object',
+  schema: {
+    componentName: 'Card',
+    props: {
+      title: '卡片主题',
+      description: '这是一个对象类型',
+      column: 3,
+      type: 'object',
+      widget: 'collapse'
+    }
+  }
+}];
+export default createMeta('Card', {
+  title: '对象',
+  category: '布局',
+  group: '基础组件',
+  priority: 1,
+  props: props,
+  snippets: snippets,
+  configure: {
+    supports: {
+      loop: false,
+      condition: false
+    },
+    component: {
+      isContainer: true,
+      isModal: false,
+      nestingRule: {
+        parentWhitelist: ['FormRender', 'Card', 'CardList']
+      }
+    }
+  }
+});

package/es/settings/meta/cardList.js ADDED Viewed

@@ -0,0 +1,203 @@
+import { createMeta } from '../utils';
+var props = [{
+  name: 'title',
+  title: {
+    label: '标题',
+    tip: 'title | 卡片主题'
+  },
+  setter: 'StringSetter'
+}, {
+  name: 'code',
+  title: {
+    label: '字段名',
+    tip: 'key | 字段名'
+  },
+  setter: 'StringSetter'
+}, {
+  name: 'description',
+  title: {
+    label: '描述',
+    tip: 'description ｜ 卡片的描述'
+  },
+  setter: 'StringSetter'
+}, {
+  title: '模版配置',
+  display: 'block',
+  type: 'group',
+  items: [{
+    name: 'widget',
+    title: {
+      label: '类型',
+      tip: 'widget ｜ 类型'
+    },
+    setter: {
+      componentName: 'SelectSetter',
+      props: {
+        options: [{
+          title: 'SimpleList',
+          value: 'simpleList'
+        }, {
+          title: 'CardList',
+          value: 'cardList'
+        }, {
+          title: 'DrawerList',
+          value: 'drawerList'
+        }, {
+          title: 'TableList',
+          value: 'tableList'
+        }, {
+          title: 'VirtualList',
+          value: 'virtualList'
+        }, {
+          title: 'TabList',
+          value: 'tabList'
+        }]
+      }
+    },
+    extraProps: {
+      setValue: function setValue(target, value) {
+        var node = target.getNode();
+        if (value !== 'cardList') {
+          node.setPropValue('items.widget', undefined);
+          node.setPropValue('items.title', undefined);
+          node.setPropValue('items.description', undefined);
+          node.setPropValue('items.column', undefined);
+        }
+      }
+    }
+  }, {
+    name: 'items.widget',
+    title: {
+      label: '样式类型',
+      tip: '样式类型'
+    },
+    setter: {
+      componentName: 'RadioGroupSetter',
+      props: {
+        options: [{
+          title: '卡片',
+          value: 'card'
+        }, {
+          title: '折叠面板',
+          value: 'collapse'
+        }, {
+          title: '标题线',
+          value: 'lineTitle'
+        }, {
+          title: '内联',
+          value: 'subInline'
+        }]
+      }
+    },
+    condition: function condition(target) {
+      return target.getProps().getPropValue('widget') === 'cardList';
+    }
+  }, {
+    name: 'items.title',
+    title: {
+      label: '标题',
+      tip: 'title | 卡片主题'
+    },
+    setter: 'StringSetter',
+    condition: function condition(target) {
+      return target.getProps().getPropValue('widget') === 'cardList';
+    }
+  }, {
+    name: 'items.description',
+    title: {
+      label: '描述',
+      tip: 'description ｜ 卡片的描述'
+    },
+    setter: 'StringSetter',
+    condition: function condition(target) {
+      return target.getProps().getPropValue('widget') === 'cardList';
+    }
+  }, {
+    name: 'items.column',
+    title: {
+      label: '一行多列',
+      tip: 'column ｜ 表单内容分成几列展示'
+    },
+    defaultValue: 1,
+    setter: {
+      componentName: 'RadioGroupSetter',
+      props: {
+        options: [{
+          title: '一列',
+          value: 1
+        }, {
+          title: '两列',
+          value: 2
+        }, {
+          title: '三列',
+          value: 3
+        }, {
+          title: '四列',
+          value: 4
+        }]
+      }
+    },
+    condition: function condition(target) {
+      return target.getProps().getPropValue('widget') === 'cardList';
+    },
+    extraProps: {
+      setValue: function setValue(target, value) {
+        var node = target.getNode();
+        var labelSpan = 8;
+        var wrapperColSpan = 16;
+        if (value === 1) {
+          labelSpan = 4;
+          wrapperColSpan = 6;
+        } else if (value === 2) {
+          wrapperColSpan = 10;
+        }
+        node.setPropValue('labelCol.span', labelSpan);
+        node.setPropValue('wrapperCol.span', wrapperColSpan);
+        node.mergeChildren(function (child) {
+          var span = 24 / value;
+          child.setPropValue('span', span);
+          return false;
+        }, function () {}, function () {});
+      }
+    }
+  }]
+}];
+var snippets = [{
+  title: '列表',
+  screenshot: 'icon-list',
+  schema: {
+    componentName: 'CardList',
+    props: {
+      title: '列表',
+      description: '这是一个列表',
+      type: 'array',
+      items: {
+        title: '卡片主题',
+        description: '这是一个对象类型',
+        column: 3,
+        type: 'object'
+      }
+    }
+  }
+}];
+export default createMeta('CardList', {
+  title: '列表',
+  category: '布局',
+  group: '基础组件',
+  priority: 1,
+  props: props,
+  snippets: snippets,
+  configure: {
+    supports: {
+      loop: false,
+      condition: false
+    },
+    component: {
+      isContainer: true,
+      isModal: false,
+      nestingRule: {
+        parentWhitelist: ['FormRender', 'Card']
+      }
+    }
+  }
+});

package/es/settings/meta/checkbox.js ADDED Viewed

@@ -0,0 +1,29 @@
+import { createMeta, getNotInputPropsBasic } from '../utils';
+export default createMeta('Checkbox', {
+  title: '是否选择',
+  priority: 994,
+  props: [{
+    title: '基础配置',
+    type: 'group',
+    display: 'accordion',
+    items: getNotInputPropsBasic({
+      name: 'defaultValue',
+      title: {
+        label: '默认值',
+        tip: 'defaultValue | 默认值'
+      },
+      setter: 'BoolSetter'
+    })
+  }],
+  snippets: [{
+    title: '是否选择',
+    screenshot: 'icon-isNot',
+    schema: {
+      componentName: 'Checkbox',
+      props: {
+        title: '是否选择',
+        type: 'boolean'
+      }
+    }
+  }]
+});

package/es/settings/meta/checkboxes.js ADDED Viewed

@@ -0,0 +1,66 @@
+import { createMeta, optionsProp, getNotInputPropsBasic } from '../utils';
+export default createMeta('Checkboxes', {
+  title: '点击多选框',
+  // priority: 996,
+  props: [{
+    title: '基础配置',
+    type: 'group',
+    display: 'accordion',
+    items: getNotInputPropsBasic({
+      name: 'defaultValue',
+      title: {
+        label: '默认值',
+        tip: 'defaultValue | 默认值'
+      },
+      setter: 'JsonSetter'
+    })
+  }, optionsProp, {
+    title: '其他配置',
+    display: 'accordion',
+    type: 'group',
+    items: [{
+      name: 'props.direction',
+      title: {
+        label: '排列方向',
+        tip: '选项的排列方向'
+      },
+      defaultValue: 'row',
+      setter: {
+        componentName: 'RadioGroupSetter',
+        props: {
+          options: [{
+            title: '水平',
+            value: 'row'
+          }, {
+            title: '垂直',
+            value: 'column'
+          }]
+        }
+      }
+    }]
+  }],
+  snippets: [{
+    title: '点击多选',
+    screenshot: 'icon-checkbox',
+    schema: {
+      componentName: 'Checkboxes',
+      props: {
+        title: '点击多选',
+        type: 'array',
+        props: {
+          options: [{
+            label: 'A',
+            value: 'A'
+          }, {
+            label: 'B',
+            value: 'B'
+          }, {
+            label: 'C',
+            value: 'C'
+          }],
+          direction: 'row'
+        }
+      }
+    }
+  }]
+});

package/es/settings/meta/color.js ADDED Viewed

@@ -0,0 +1,21 @@
+import { createMeta, notInputPropsBasic } from '../utils';
+export default createMeta('Color', {
+  title: '颜色选择',
+  category: '其他',
+  props: [{
+    title: '基础配置',
+    type: 'group',
+    display: 'accordion',
+    items: notInputPropsBasic
+  }],
+  snippets: [{
+    title: '颜色选择',
+    screenshot: 'icon-color',
+    schema: {
+      componentName: 'Color',
+      props: {
+        title: '颜色选择'
+      }
+    }
+  }]
+});

package/es/settings/meta/date.js ADDED Viewed

@@ -0,0 +1,28 @@
+import { createMeta, getInputPropsBasic } from '../utils';
+export default createMeta('DatePicker', {
+  title: '日期选择',
+  props: [{
+    title: '基础配置',
+    type: 'group',
+    display: 'accordion',
+    items: getInputPropsBasic({
+      name: 'defaultValue',
+      title: {
+        label: '默认值',
+        tip: 'defaultValue | 默认值'
+      },
+      setter: 'CustomDateSetter'
+    })
+  }],
+  snippets: [{
+    title: '日期选择',
+    screenshot: 'icon-date',
+    schema: {
+      componentName: 'DatePicker',
+      props: {
+        title: '日期选择',
+        type: 'string'
+      }
+    }
+  }]
+});

package/es/settings/meta/dateRange.js ADDED Viewed

@@ -0,0 +1,37 @@
+import { createMeta, getInputPropsBasic } from '../utils';
+export default createMeta('DateRange', {
+  title: '日期选择区间',
+  props: [{
+    title: '基础配置',
+    type: 'group',
+    display: 'accordion',
+    items: getInputPropsBasic({
+      name: 'defaultValue',
+      title: {
+        label: '默认值',
+        tip: 'defaultValue | 默认值'
+      },
+      setter: 'CustomDateRangeSetter'
+    }, {
+      name: 'props.placeholder',
+      title: {
+        label: '提示文字',
+        tip: 'placeholder | 输入框提示文字'
+      },
+      setter: 'JsonSetter',
+      defaultValue: ['开始时间', '结束时间']
+    })
+  }],
+  snippets: [{
+    title: '日期区间选择',
+    screenshot: 'icon-date',
+    schema: {
+      componentName: 'DateRange',
+      props: {
+        title: '日期区间选择',
+        type: 'range',
+        format: 'date'
+      }
+    }
+  }]
+});