\n {value.map((item, index) => {\n return (\n \n
\n {index + 1}\n
\n
{renderField(index)}
\n
\n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n
\n {toArr(value).map((item, index) => {\n return (\n
\n {index + 1}. {title || schema.title}\n \n }\n className='card-list'\n key={index}\n contentHeight='auto'\n extra={this.renderOperations(item, index)}\n >\n {renderField(index)}\n \n )\n })}\n {value.length === 0 && this.renderEmpty(title)}\n \n {value.length > 0 && this.renderAddition()}\n
\n \n {isFn(col.cell)\n ? col.cell(\n record ? record[col.dataIndex] : undefined,\n rowIndex,\n record\n )\n : record\n ? record[col.dataIndex]\n : undefined}\n
\n )\n }\n\n renderTable(columns, dataSource) {\n return (\n \n
\n \n {columns.map((col, index) => {\n return \n })}\n \n \n \n {columns.map((col, index) => {\n return (\n | \n {col.title} \n | \n )\n })}\n
\n \n \n {dataSource.map((record, rowIndex) => {\n return (\n \n {columns.map((col, colIndex) => {\n return (\n | \n {this.renderCell({\n record,\n col,\n rowIndex,\n colIndex\n })}\n | \n )\n })}\n
\n )\n })}\n {this.renderPlacehodler(dataSource, columns)}\n \n
\n
\n | \n \n | \n
\n )\n }\n }\n\n getColumns(children) {\n const columns = []\n React.Children.forEach(children, child => {\n if (React.isValidElement(child)) {\n if (\n child.type === Column ||\n child.type.displayName === '@schema-table-column'\n ) {\n columns.push(child.props)\n }\n }\n })\n\n return columns\n }\n\n render() {\n const columns = this.getColumns(this.props.children)\n const dataSource = toArr(this.props.dataSource)\n return (\n \n
\n
\n {this.renderTable(columns, dataSource)}\n
\n
\n
\n
\n {Object.keys(\n (schema.items && schema.items.properties) || {}\n ).reduce((buf, key) => {\n const itemSchema = schema.items.properties[key]\n const filter = this.createFilter(key, itemSchema)\n const res = filter(\n () => {\n return buf.concat(\n {\n return renderField([index, key])\n }}\n />\n )\n },\n () => {\n return buf\n }\n )\n return res\n }, [])}\n {additionFilter(() => {\n return (\n {\n return (\n \n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n )\n }}\n />\n )\n })}\n
\n {this.renderAddition()}\n
\n \n {checkStrength && this.renderStrength()}\n
\n )\n }\n }\n)`\n .next-input {\n width: 100%;\n position: relative;\n &.input-password input {\n font-size: 16px;\n letter-spacing: 2px;\n }\n input {\n padding-right: 25px;\n }\n .eye {\n position: absolute;\n height: 20px;\n right: 5px;\n top: 50%;\n transform: translate(0, -50%);\n opacity: 0.3;\n cursor: pointer;\n transition: all 0.15s ease-in-out;\n &:hover {\n opacity: 0.6;\n }\n }\n }\n .password-strength-wrapper {\n background: #e0e0e0;\n margin-bottom: 3px;\n position: relative;\n .div {\n position: absolute;\n z-index: 1;\n height: 8px;\n top: 0;\n background: #fff;\n width: 1px;\n transform: translate(-50%, 0);\n }\n .div-1 {\n left: 20%;\n }\n .div-2 {\n left: 40%;\n }\n .div-3 {\n left: 60%;\n }\n .div-4 {\n left: 80%;\n }\n .password-strength-bar {\n position: relative;\n background-image: -webkit-linear-gradient(left, #ff5500, #ff9300);\n transition: all 0.35s ease-in-out;\n height: 8px;\n width: 100%;\n margin-top: 5px;\n }\n }\n`\n\nregisterFormField('password', connect()(Password))\n","import React, { Component } from 'react'\nimport ReactDOM from 'react-dom'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport { FormConsumer } from '../form'\nimport Sticky from 'react-stikky'\nimport cls from 'classnames'\nimport styled from 'styled-components'\n\nconst getAlign = align => {\n if (align === 'start' || align === 'end') return align\n if (align === 'left' || align === 'top') return 'flex-start'\n if (align === 'right' || align === 'bottom') return 'flex-end'\n return align\n}\n\nconst isElementInViewport = (rect, { offset = 0, threshold = 0 } = {}) => {\n const { top, right, bottom, left, width, height } = rect\n const intersection = {\n t: bottom,\n r: window.innerWidth - left,\n b: window.innerHeight - top,\n l: right\n }\n\n const elementThreshold = {\n x: threshold * width,\n y: threshold * height\n }\n\n return (\n intersection.t >= (offset.top || offset + elementThreshold.y) &&\n intersection.r >= (offset.right || offset + elementThreshold.x) &&\n intersection.b >= (offset.bottom || offset + elementThreshold.y) &&\n intersection.l >= (offset.left || offset + elementThreshold.x)\n )\n}\n\nexport const FormButtonGroup = styled(\n class FormButtonGroup extends Component {\n static defaultProps = {\n span: 24,\n zIndex: 100\n }\n\n renderChildren() {\n const { children, itemStyle, offset, span } = this.props\n return (\n \n
\n \n \n \n {children}\n
\n \n \n
\n
\n
\n {({ inline, FormRef } = {}) => {\n if (!FormRef) return\n return (\n \n \n {content}\n
\n \n )\n }}\n \n
\n {children.reduce((buf, child, key) => {\n return child\n ? buf.concat(\n \n {child}\n \n )\n : buf\n }, [])}\n
\n )\n }\n\n render() {\n const { title } = this.props\n if (title) {\n return this.renderFormItem(this.renderGrid())\n } else {\n return this.renderGrid()\n }\n }\n }\n)\n\nexport const FormCard = createVirtualBox(\n 'card',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 30px;\n .next-card-body {\n padding-top: 30px;\n padding-bottom: 0 !important;\n }\n `\n)\n\nexport const FormBlock = createVirtualBox(\n 'block',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 0px;\n .next-card-body {\n padding-top: 20px;\n padding-bottom: 0 !important;\n }\n &.next-card {\n border: none;\n padding: 0 15px;\n padding-bottom: 15px;\n }\n `\n)\n","import './form'\nimport './fields/string'\nimport './fields/number'\nimport './fields/boolean'\nimport './fields/date'\nimport './fields/time'\nimport './fields/range'\nimport './fields/upload'\nimport './fields/checkbox'\nimport './fields/radio'\nimport './fields/rating'\nimport './fields/transfer'\nimport './fields/array'\nimport './fields/cards'\nimport './fields/table'\nimport './fields/password'\nimport { mapStyledProps, mapTextComponent } from './utils'\nimport { SchemaForm } from '@uform/react'\nexport * from '@uform/react'\nexport * from './components/formButtonGroup'\nexport * from './components/button'\nexport * from './components/layout'\nexport { mapStyledProps, mapTextComponent }\nexport default SchemaForm\n","/*! *****************************************************************************\r\nCopyright (c) Microsoft Corporation. All rights reserved.\r\nLicensed under the Apache License, Version 2.0 (the \"License\"); you may not use\r\nthis file except in compliance with the License. You may obtain a copy of the\r\nLicense at http://www.apache.org/licenses/LICENSE-2.0\r\n\r\nTHIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\nKIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED\r\nWARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,\r\nMERCHANTABLITY OR NON-INFRINGEMENT.\r\n\r\nSee the Apache Version 2.0 License for specific language governing permissions\r\nand limitations under the License.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)\r\n t[p[i]] = s[p[i]];\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (_) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport function __exportStar(m, exports) {\r\n for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];\r\n}\r\n\r\nexport function __values(o) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator], i = 0;\r\n if (m) return m.call(o);\r\n return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];\r\n result.default = mod;\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n","/*!\n * MoveTo - A lightweight scroll animation javascript library without any dependency.\n * Version 1.8.0 (14-01-2019 13:15)\n * Licensed under MIT\n * Copyright 2019 Hasan Aydoğdu \n */\n\n'use strict';\nvar MoveTo = function () {\n /**\n * Defaults\n * @type {object}\n */\n var defaults = {\n tolerance: 0,\n duration: 800,\n easing: 'easeOutQuart',\n container: window,\n callback: function callback() {} };\n\n\n /**\n * easeOutQuart Easing Function\n * @param {number} t - current time\n * @param {number} b - start value\n * @param {number} c - change in value\n * @param {number} d - duration\n * @return {number} - calculated value\n */\n function easeOutQuart(t, b, c, d) {\n t /= d;\n t--;\n return -c * (t * t * t * t - 1) + b;\n }\n\n /**\n * Merge two object\n *\n * @param {object} obj1\n * @param {object} obj2\n * @return {object} merged object\n */\n function mergeObject(obj1, obj2) {\n var obj3 = {};\n Object.keys(obj1).forEach(function (propertyName) {\n obj3[propertyName] = obj1[propertyName];\n });\n\n Object.keys(obj2).forEach(function (propertyName) {\n obj3[propertyName] = obj2[propertyName];\n });\n return obj3;\n };\n\n /**\n * Converts camel case to kebab case\n * @param {string} val the value to be converted\n * @return {string} the converted value\n */\n function kebabCase(val) {\n return val.replace(/([A-Z])/g, function ($1) {\n return '-' + $1.toLowerCase();\n });\n };\n\n /**\n * Count a number of item scrolled top\n * @param {Window|HTMLElement} container\n * @return {number}\n */\n function countScrollTop(container) {\n if (container instanceof HTMLElement) {\n return container.scrollTop;\n }\n return container.pageYOffset;\n };\n\n /**\n * MoveTo Constructor\n * @param {object} options Options\n * @param {object} easeFunctions Custom ease functions\n */\n function MoveTo() {var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};var easeFunctions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n this.options = mergeObject(defaults, options);\n this.easeFunctions = mergeObject({ easeOutQuart: easeOutQuart }, easeFunctions);\n }\n\n /**\n * Register a dom element as trigger\n * @param {HTMLElement} dom Dom trigger element\n * @param {function} callback Callback function\n * @return {function|void} unregister function\n */\n MoveTo.prototype.registerTrigger = function (dom, callback) {var _this = this;\n if (!dom) {\n return;\n }\n\n var href = dom.getAttribute('href') || dom.getAttribute('data-target');\n // The element to be scrolled\n var target = href && href !== '#' ?\n document.getElementById(href.substring(1)) :\n document.body;\n var options = mergeObject(this.options, _getOptionsFromTriggerDom(dom, this.options));\n\n if (typeof callback === 'function') {\n options.callback = callback;\n }\n\n var listener = function listener(e) {\n e.preventDefault();\n _this.move(target, options);\n };\n\n dom.addEventListener('click', listener, false);\n\n return function () {return dom.removeEventListener('click', listener, false);};\n };\n\n /**\n * Move\n * Scrolls to given element by using easeOutQuart function\n * @param {HTMLElement|number} target Target element to be scrolled or target position\n * @param {object} options Custom options\n */\n MoveTo.prototype.move = function (target) {var _this2 = this;var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n if (target !== 0 && !target) {\n return;\n }\n\n options = mergeObject(this.options, options);\n\n var distance = typeof target === 'number' ? target : target.getBoundingClientRect().top;\n var from = countScrollTop(options.container);\n var startTime = null;\n var lastYOffset = void 0;\n distance -= options.tolerance;\n\n // rAF loop\n var loop = function loop(currentTime) {\n var currentYOffset = countScrollTop(_this2.options.container);\n\n if (!startTime) {\n // To starts time from 1, we subtracted 1 from current time\n // If time starts from 1 The first loop will not do anything,\n // because easing value will be zero\n startTime = currentTime - 1;\n }\n\n var timeElapsed = currentTime - startTime;\n\n if (lastYOffset) {\n if (\n distance > 0 && lastYOffset > currentYOffset ||\n distance < 0 && lastYOffset < currentYOffset)\n {\n return options.callback(target);\n }\n }\n lastYOffset = currentYOffset;\n\n var val = _this2.easeFunctions[options.easing](timeElapsed, from, distance, options.duration);\n\n options.container.scroll(0, val);\n\n if (timeElapsed < options.duration) {\n window.requestAnimationFrame(loop);\n } else {\n options.container.scroll(0, distance + from);\n options.callback(target);\n }\n };\n\n window.requestAnimationFrame(loop);\n };\n\n /**\n * Adds custom ease function\n * @param {string} name Ease function name\n * @param {function} fn Ease function\n */\n MoveTo.prototype.addEaseFunction = function (name, fn) {\n this.easeFunctions[name] = fn;\n };\n\n /**\n * Returns options which created from trigger dom element\n * @param {HTMLElement} dom Trigger dom element\n * @param {object} options The instance's options\n * @return {object} The options which created from trigger dom element\n */\n function _getOptionsFromTriggerDom(dom, options) {\n var domOptions = {};\n\n Object.keys(options).forEach(function (key) {\n var value = dom.getAttribute('data-mt-' + kebabCase(key));\n if (value) {\n domOptions[key] = isNaN(value) ? value : parseInt(value, 10);\n }\n });\n return domOptions;\n }\n\n return MoveTo;\n}();\n\nif (typeof module !== 'undefined') {\n module.exports = MoveTo;\n} else {\n window.MoveTo = MoveTo;\n}"],"mappings":"AAEA;;;;;;;;;;;ACKA;;;;;;;;;;;;;;;;;;;;;;;;ACqEA;;;;;;;;;;;;;;AChCA;;;;;;;;;;;;;;;;;;;;;AC6KA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA;ACjQA;;AAMA;AACA;;;;;;;AAOA;;;;;;;;;AAeA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC0DA;;;;;;;;;;;;;;;;;;;;;;;;ACtNA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuTA;ACjMA;;;;;;;;;;;;;;;;;;;;ACvHA;;;;;;AC4JA;;;;;;;;;;;AChKA;;;;;;;;;;;;;;;ACgBA;;;;;;ACRA","sourceRoot":""}
\ No newline at end of file
+{"version":3,"file":"bundle.13.js","sources":["webpack:///./docs/Examples/next/Relations.md","webpack:///./packages/next/node_modules/classnames/index.js","webpack:///./packages/printer/src/index.js","webpack:///./packages/next/src/utils.js","webpack:///./packages/next/src/form.js","webpack:///./packages/next/src/fields/array.js","webpack:///./packages/next/src/fields/cards.js","webpack:///./packages/next/src/fields/table.js","webpack:///./packages/next/src/fields/password.js","webpack:///./packages/next/src/components/formButtonGroup.js","webpack:///./packages/next/src/components/button.js","webpack:///./packages/next/src/components/layout.js","webpack:///./packages/next/src/index.js","webpack:///./node_modules/_tslib@1.9.3@tslib/tslib.es6.js","webpack:///./packages/next/node_modules/moveto/dist/moveTo.js"],"sourcesContent":["\"use strict\";\n\nvar React = require('/Users/wangzhili/uform/node_modules/_react@16.8.6@react/index.js');\n\nvar ReactDOM = require('/Users/wangzhili/uform/node_modules/_react-dom@16.8.6@react-dom/index.js');\n\nvar ReactCodeSnippet = require('/Users/wangzhili/uform/node_modules/_react-code-snippet@0.6.13@react-code-snippet/lib/index.js');\n\nvar ReactPropsTable = require('/Users/wangzhili/uform/node_modules/_react-props-table@0.1.3@react-props-table/lib/index.js');\n\nvar __DEFINE__ = function __DEFINE__(fn) {\n var module = {\n exports: {}\n };\n fn(module, module.exports);\n var component = module.exports.__esModule && module.exports['default'] || module.exports;\n return typeof component === 'function' ? component : function () {\n return React.createElement('div', {}, 'Code snippet should export a component!');\n };\n};\n\nvar Demo_aewan_0 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n var _interopRequireWildcard = require(\"@babel/runtime/helpers/interopRequireWildcard\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireWildcard(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _operators = require(\"rxjs/operators\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n var _useState = (0, _react.useState)({\n visible: false\n }),\n state = _useState[0],\n setState = _useState[1];\n\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n effects: function effects($, _ref) {\n var setFieldState = _ref.setFieldState,\n getFieldState = _ref.getFieldState;\n $('onFormInit').subscribe(function () {\n setFieldState(_next.FormPath.match('*(gg,hh)'), function (state) {\n state.props['x-props'] = state.props['x-props'] || {};\n state.props['x-props'].style = {\n width: 200\n };\n\n if (state.name == 'hh') {\n state.visible = false;\n }\n });\n });\n $('onFieldChange', 'aa').subscribe(function (fieldState) {\n setFieldState('bb', function (state) {\n state.visible = !fieldState.value;\n });\n });\n $('onFieldChange', 'cc').subscribe(function (fieldState) {\n setFieldState('dd', function (state) {\n state.visible = !fieldState.value;\n });\n setFieldState('gg', function (state) {\n if (fieldState.value) {\n state.value = 'aaaa';\n state.props[\"enum\"] = [{\n label: 'aaaa',\n value: 'aaaa',\n extra: ['x1', 'x2', 'x3']\n }, {\n label: 'bbbb',\n value: 'bbbb',\n extra: ['x4', 'x5', 'x6']\n }, {\n label: 'cccc',\n value: 'cccc',\n extra: ['x7', 'x8', 'x9']\n }];\n } else {\n state.value = '123333';\n state.props[\"enum\"] = ['123333', '333333'];\n }\n });\n });\n $('onFieldChange', 'gg').pipe((0, _operators.withLatestFrom)($('onChangeOption')), (0, _operators.map)(function (_ref2) {\n var fieldState = _ref2[0],\n option = _ref2[1].payload;\n return {\n state: fieldState,\n option: option\n };\n })).subscribe(function (_ref3) {\n var state = _ref3.state,\n option = _ref3.option;\n setFieldState('hh', function (state) {\n if (option && option.extra && option.extra.length) {\n state.visible = true;\n state.props[\"enum\"] = option.extra;\n } else {\n state.visible = false;\n }\n });\n });\n $('onSearch', 'gg').pipe((0, _operators.map)(function (fieldState) {\n setFieldState('gg', function (state) {\n state.loading = true;\n });\n return fieldState;\n }), (0, _operators.debounceTime)(400)).subscribe(function (_ref4) {\n var payload = _ref4.payload;\n fetch('//dip.taobao.net/api/v2/services/schema/mock/94047').then(function (res) {\n return res.json();\n }).then(function (data) {\n setFieldState('gg', function (state) {\n state.loading = false;\n state.props[\"enum\"] = data;\n });\n });\n });\n },\n labelCol: 6,\n wrapperCol: 4,\n onSubmit: function onSubmit(v) {\n return console.log(v);\n }\n }, _react[\"default\"].createElement(_next.FormBlock, {\n title: \"Block1\"\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aa\",\n type: \"boolean\",\n \"x-component\": \"radio\",\n \"default\": true,\n \"enum\": [{\n label: '是',\n value: true\n }, {\n label: '否',\n value: false\n }],\n title: \"\\u662F\\u5426\\u9690\\u85CFAA\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"bb\",\n type: \"string\",\n title: \"AA\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"cc\",\n type: \"boolean\",\n title: \"\\u662F\\u5426\\u9690\\u85CFDD\",\n \"default\": true,\n \"x-component\": \"radio\",\n \"enum\": [{\n label: '是',\n value: true\n }, {\n label: '否',\n value: false\n }]\n })), _react[\"default\"].createElement(_next.FormBlock, {\n name: \"dd\",\n title: \"Block2\"\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"ee\",\n type: \"date\",\n title: \"EE\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"ff\",\n type: \"number\",\n title: \"FF\"\n })), _react[\"default\"].createElement(_next.FormBlock, {\n name: \"kk\",\n title: \"Block3\"\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"gg\",\n type: \"string\",\n \"x-effect\": function xEffect(dispatch) {\n return {\n onChange: function onChange(value, type, option) {\n dispatch('onChangeOption', option);\n },\n onSearch: function onSearch(value) {\n dispatch('onSearch', value);\n }\n };\n },\n title: \"GG\",\n \"x-props\": {\n showSearch: true,\n filterLocal: false\n }\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"hh\",\n type: \"string\",\n title: \"HH\",\n \"enum\": []\n }), state.visible && _react[\"default\"].createElement(_next.Field, {\n name: \"mm\",\n type: \"string\",\n title: \"MM\"\n })), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 6\n }, _react[\"default\"].createElement(_next.Submit, null), _react[\"default\"].createElement(_next.Reset, null), _react[\"default\"].createElement(_next2.Button, {\n onClick: function onClick() {\n return setState({\n visible: !state.visible\n });\n }\n }, !state.visible ? '显示MM' : '隐藏MM'))));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_kktfi_1 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _operators = require(\"rxjs/operators\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n effects: function effects($, _ref) {\n var setFieldState = _ref.setFieldState,\n getFieldState = _ref.getFieldState;\n\n var loading = function loading(name) {\n setFieldState(name, function (state) {\n state.loading = true;\n });\n };\n\n var loaded = function loaded(name) {\n setFieldState(name, function (state) {\n state.loading = false;\n });\n };\n\n var hide = function hide(name) {\n setFieldState(name, function (state) {\n state.visible = false;\n });\n };\n\n var show = function show(name) {\n setFieldState(name, function (state) {\n state.visible = true;\n });\n };\n\n var setEnum = function setEnum(name, value) {\n setFieldState(name, function (state) {\n state.props[\"enum\"] = value;\n });\n };\n\n var setValue = function setValue(name, value) {\n setFieldState(name, function (state) {\n state.value = value;\n });\n };\n\n $('onFormInit').subscribe(function () {\n hide('bb');\n });\n $('onFieldChange', 'aa').subscribe(function (fieldState) {\n if (!fieldState.value) return;\n show('bb');\n loading('bb');\n setTimeout(function () {\n loaded('bb');\n setEnum('bb', ['1111', '2222']);\n setValue('bb', '1111');\n }, 1000);\n });\n $('onFieldChange', 'bb').subscribe(function (fieldState) {\n console.log(fieldState.loading);\n if (!fieldState.value) return hide('cc');\n show('cc');\n });\n },\n onChange: function onChange(v) {\n return console.log(v);\n },\n labelCol: 6,\n wrapperCol: 4,\n onSubmit: function onSubmit(v) {\n return console.log(v);\n }\n }, _react[\"default\"].createElement(_next.FormBlock, {\n title: \"Block1\"\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aa\",\n type: \"string\",\n \"enum\": ['aaaaa', 'bbbbb', 'ccccc', 'ddddd', 'eeeee'],\n title: \"AA\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"bb\",\n title: \"BB\",\n \"enum\": []\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"cc\",\n title: \"CC\"\n })), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 6\n }, _react[\"default\"].createElement(_next.Submit, null), _react[\"default\"].createElement(_next.Reset, null))));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_kkjus_2 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _operators = require(\"rxjs/operators\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n effects: function effects($, _ref) {\n var setFieldState = _ref.setFieldState;\n $('onFieldChange', 'bb').subscribe(function (state) {\n if (state.value) {\n setFieldState('aa', function (state) {\n state.value = '123';\n });\n }\n });\n },\n onChange: function onChange(v) {\n return console.log(v);\n },\n labelCol: 6,\n wrapperCol: 4,\n onSubmit: function onSubmit(v) {\n return console.log(v);\n }\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aa\",\n type: \"string\",\n required: true,\n title: \"AA\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"bb\",\n title: \"BB\",\n \"enum\": ['111', '222']\n }), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 6\n }, _react[\"default\"].createElement(_next.Submit, null), _react[\"default\"].createElement(_next.Reset, null))));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_dahns_3 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n var _interopRequireWildcard = require(\"@babel/runtime/helpers/interopRequireWildcard\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireWildcard(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _operators = require(\"rxjs/operators\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n var _useState = (0, _react.useState)({}),\n values = _useState[0],\n setValues = _useState[1];\n\n (0, _react.useEffect)(function () {\n setTimeout(function () {\n setValues({\n aa: [{\n bb: 'aaaaa',\n dd: [{\n ee: '是',\n ff: '是'\n }]\n }, {\n bb: 'ccccc',\n dd: [{\n ee: '否',\n ff: '是'\n }]\n }]\n });\n }, 1000);\n }, []);\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n effects: function effects($, _ref) {\n var setFieldState = _ref.setFieldState,\n getFieldState = _ref.getFieldState;\n\n var loading = function loading(name) {\n setFieldState(name, function (state) {\n state.loading = true;\n });\n };\n\n var loaded = function loaded(name) {\n setFieldState(name, function (state) {\n state.loading = false;\n });\n };\n\n var hide = function hide(name) {\n setFieldState(name, function (state) {\n state.visible = false;\n });\n };\n\n var show = function show(name) {\n setFieldState(name, function (state) {\n state.visible = true;\n });\n };\n\n var setEnum = function setEnum(name, value) {\n setFieldState(name, function (state) {\n state.props[\"enum\"] = value;\n });\n };\n\n var setValue = function setValue(name, value) {\n setFieldState(name, function (state) {\n state.value = value;\n });\n };\n\n $('onFormInit').subscribe(function () {\n hide(_next.FormPath.match('aa.*.*(cc,gg,dd.*.ee)'));\n });\n $('onFieldChange', 'aa.*.bb').subscribe(function (fieldState) {\n var cc = _next.FormPath.transform(fieldState.name, /\\d+/, function (i) {\n return \"aa.\" + i + \".cc\";\n });\n\n if (!fieldState.value) {\n hide(cc);\n return;\n }\n\n show(cc);\n loading(cc);\n setTimeout(function () {\n loaded(cc);\n setEnum(cc, ['1111', '2222']);\n setValue(cc, '1111');\n }, 1000);\n });\n $('onFieldChange', 'aa.*.dd.*.ee').subscribe(function (fieldState) {\n var gg = _next.FormPath.transform(fieldState.name, /\\d+/, function (i, j) {\n return \"aa.\" + i + \".gg\";\n });\n\n setFieldState(gg, function (state) {\n if (fieldState.value) {\n state.visible = fieldState.value == '是';\n }\n });\n });\n $('onFieldChange', 'aa.*.dd.*.ff').subscribe(function (fieldState) {\n var ee = _next.FormPath.transform(fieldState.name, /\\d+/, function (i, j) {\n return \"aa.\" + i + \".dd.\" + j + \".ee\";\n });\n\n setFieldState(ee, function (state) {\n state.visible = fieldState.value == '是';\n });\n });\n },\n onSubmit: function onSubmit(v) {\n return console.log(v);\n },\n initialValues: values\n }, _react[\"default\"].createElement(_next.FormBlock, {\n title: \"Block1\"\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"array\",\n name: \"aa\"\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"object\"\n }, _react[\"default\"].createElement(_next.FormBlock, {\n title: \"\\u57FA\\u672C\\u4FE1\\u606F\"\n }, _react[\"default\"].createElement(_next.FormLayout, {\n inline: true\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"bb\",\n \"enum\": ['aaaaa', 'bbbbb', 'ccccc', 'ddddd', 'eeeee'],\n title: \"BB\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"cc\",\n \"enum\": [],\n title: \"CC\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"gg\",\n title: \"GG\",\n \"x-props\": {\n style: {\n width: 200\n }\n }\n }))), _react[\"default\"].createElement(_next.FormBlock, {\n title: \"\\u5D4C\\u5957Array\"\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"array\",\n name: \"dd\",\n \"x-component\": \"cards\"\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"object\"\n }, _react[\"default\"].createElement(_next.FormLayout, {\n inline: true,\n style: {\n marginLeft: 20\n }\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"ee\",\n \"enum\": ['是', '否'],\n title: \"EE\",\n description: \"\\u662F\\u5426\\u663E\\u793AGG\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"ff\",\n \"default\": \"\\u662F\",\n \"enum\": ['是', '否'],\n title: \"FF\",\n description: \"\\u662F\\u5426\\u663E\\u793AEE\"\n })))))))), _react[\"default\"].createElement(_next.FormButtonGroup, {\n style: {\n marginLeft: 15\n }\n }, _react[\"default\"].createElement(_next.Submit, null), _react[\"default\"].createElement(_next.Reset, null))));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar __MARKDOWN__ = function __MARKDOWN__() {\n return React.createElement(React.Fragment, {}, React.createElement(\"h1\", {\n id: \"联动场景\",\n className: \"react-demo-h1\"\n }, \"联动场景\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"数据联动，归根结底是字段间的相互依赖关系，同时附加了依赖动作，同时依赖动作的执\\n行是存在时序的，所以，为了管理好字段间的依赖关系与依赖动作，\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"我们引入 \", React.createElement(\"a\", {\n href: \"http://reactivex.io/rxjs\",\n className: \"react-demo-a\"\n }, \"rxjs\"), \"，可以轻松的解决各种时序型联动，\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"同时，我们也借鉴了 \", React.createElement(\"a\", {\n href: \"https://github.com/reduxjs/redux\",\n className: \"react-demo-a\"\n }, \"redux\"), \" 的思路，将 Form\\n内部的\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"action 汇总起来(onInit/onMount/onChange/onSubmit/onChangeEvent)，最终在一个统\\n一的 effects 回调函数内做 reducer 处理，但是，为了提升 reducer 体验，我们还在\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"内部借鉴了 \", React.createElement(\"a\", {\n href: \"https://github.com/mweststrate/immer\",\n className: \"react-demo-a\"\n }, \"immer.js\"), \"的数据编辑模式，最终达到真正\\n通用化的表单联动解决方案\")), React.createElement(\"h3\", {\n id: \"简单数据联动\",\n className: \"react-demo-h3\"\n }, \"简单数据联动\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"h4\", {\n id: \"当前例子集合了几种联动场景\",\n className: \"react-demo-h4\"\n }, \"当前例子集合了几种联动场景\"), React.createElement(\"ul\", {\n className: \"react-demo-ul\"\n }, React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, React.createElement(\"ol\", {\n className: \"react-demo-ol\"\n }, React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, \"联动控制显示隐藏元素\"))), React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, React.createElement(\"ol\", {\n start: 2,\n className: \"react-demo-ol\"\n }, React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, \"批量控制元素属性\"))), React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, React.createElement(\"ol\", {\n start: 3,\n className: \"react-demo-ol\"\n }, React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, \"从组件原始事件中获取额外信息做联动，比如 Select 数据的内部联动\"))), React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, React.createElement(\"ol\", {\n start: 4,\n className: \"react-demo-ol\"\n }, React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, \"外部通过全局状态控制表单元素的显示隐藏，当然，这种方式并不是推荐的方式，\\n因为会导致全量表单的渲染\"))))), React.createElement(\"h4\", {\n id: \"demo-示例\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React, { useState } from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormPath,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { filter, withLatestFrom, map, debounceTime } from 'rxjs/operators'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => {\\n const [state, setState] = useState({ visible: false })\\n return (\\n \\n {\\n $('onFormInit').subscribe(() => {\\n setFieldState(FormPath.match('*(gg,hh)'), state => {\\n state.props['x-props'] = state.props['x-props'] || {}\\n state.props['x-props'].style = {\\n width: 200\\n }\\n if (state.name == 'hh') {\\n state.visible = false\\n }\\n })\\n })\\n $('onFieldChange', 'aa').subscribe(fieldState => {\\n setFieldState('bb', state => {\\n state.visible = !fieldState.value\\n })\\n })\\n $('onFieldChange', 'cc').subscribe(fieldState => {\\n setFieldState('dd', state => {\\n state.visible = !fieldState.value\\n })\\n setFieldState('gg', state => {\\n if (fieldState.value) {\\n state.value = 'aaaa'\\n state.props.enum = [\\n { label: 'aaaa', value: 'aaaa', extra: ['x1', 'x2', 'x3'] },\\n { label: 'bbbb', value: 'bbbb', extra: ['x4', 'x5', 'x6'] },\\n { label: 'cccc', value: 'cccc', extra: ['x7', 'x8', 'x9'] }\\n ]\\n } else {\\n state.value = '123333'\\n state.props.enum = ['123333', '333333']\\n }\\n })\\n })\\n $('onFieldChange', 'gg')\\n .pipe(\\n withLatestFrom($('onChangeOption')),\\n map(([fieldState, { payload: option }]) => {\\n return {\\n state: fieldState,\\n option\\n }\\n })\\n )\\n .subscribe(({ state, option }) => {\\n setFieldState('hh', state => {\\n if (option && option.extra && option.extra.length) {\\n state.visible = true\\n state.props.enum = option.extra\\n } else {\\n state.visible = false\\n }\\n })\\n })\\n $('onSearch', 'gg')\\n .pipe(\\n map(fieldState => {\\n setFieldState('gg', state => {\\n state.loading = true\\n })\\n return fieldState\\n }),\\n debounceTime(400)\\n )\\n .subscribe(({ payload }) => {\\n fetch('//dip.taobao.net/api/v2/services/schema/mock/94047')\\n .then(res => res.json())\\n .then(data => {\\n setFieldState('gg', state => {\\n state.loading = false\\n state.props.enum = data\\n })\\n })\\n })\\n }}\\n labelCol={6}\\n wrapperCol={4}\\n onSubmit={v => console.log(v)}\\n >\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n ({\\n onChange(value,type, option) {\\n dispatch('onChangeOption', option)\\n },\\n onSearch(value) {\\n dispatch('onSearch', value)\\n }\\n })}\\n title=\\\"GG\\\"\\n x-props={{ showSearch: true, filterLocal: false }}\\n />\\n \\n {state.visible && }\\n \\n \\n \\n \\n \\n \\n \\n \\n )\\n}\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_aewan_0, {})), React.createElement(\"h3\", {\n id: \"异步数据联动\",\n className: \"react-demo-h3\"\n }, \"异步数据联动\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"当前例子主要演示了从某个字段的变化，引起某些异步操作，然后再去更新某些字段的状\\n态，同时还存在一个间接联动控制\")), React.createElement(\"h4\", {\n id: \"demo-示例-1\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormPath,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { filter, withLatestFrom, map, debounceTime } from 'rxjs/operators'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n {\\n const loading = name => {\\n setFieldState(name, state => {\\n state.loading = true\\n })\\n }\\n const loaded = name => {\\n setFieldState(name, state => {\\n state.loading = false\\n })\\n }\\n const hide = name => {\\n setFieldState(name, state => {\\n state.visible = false\\n })\\n }\\n const show = name => {\\n setFieldState(name, state => {\\n state.visible = true\\n })\\n }\\n const setEnum = (name, value) => {\\n setFieldState(name, state => {\\n state.props.enum = value\\n })\\n }\\n const setValue = (name, value) => {\\n setFieldState(name, state => {\\n state.value = value\\n })\\n }\\n $('onFormInit').subscribe(() => {\\n hide('bb')\\n })\\n $('onFieldChange', 'aa').subscribe(fieldState => {\\n if (!fieldState.value) return\\n show('bb')\\n loading('bb')\\n setTimeout(() => {\\n loaded('bb')\\n setEnum('bb', ['1111', '2222'])\\n setValue('bb', '1111')\\n }, 1000)\\n })\\n $('onFieldChange', 'bb').subscribe(fieldState => {\\n console.log(fieldState.loading)\\n if (!fieldState.value) return hide('cc')\\n show('cc')\\n })\\n }}\\n onChange={v => console.log(v)}\\n labelCol={6}\\n wrapperCol={4}\\n onSubmit={v => console.log(v)}\\n >\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_kktfi_1, {})), React.createElement(\"h3\", {\n id: \"联动触发重新校验\",\n className: \"react-demo-h3\"\n }, \"联动触发重新校验\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"如果 AA 校验失败存在必填错误消息，选择 BB 任意一项可以给 AA 设置值，同时重新触\\n发校验\")), React.createElement(\"h4\", {\n id: \"demo-示例-2\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormPath,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { filter, withLatestFrom, map, debounceTime } from 'rxjs/operators'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n {\\n $('onFieldChange', 'bb').subscribe(state => {\\n if (state.value) {\\n setFieldState('aa', state => {\\n state.value = '123'\\n })\\n }\\n })\\n }}\\n onChange={v => console.log(v)}\\n labelCol={6}\\n wrapperCol={4}\\n onSubmit={v => console.log(v)}\\n >\\n \\n \\n \\n \\n \\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_kkjus_2, {})), React.createElement(\"h3\", {\n id: \"多维数据异步联动\",\n className: \"react-demo-h3\"\n }, \"多维数据(异步)联动\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"多维数据联动场景主要是在 Array 数组场景，在动态添加的表单内容中存在各种联动关\\n系，我们可以结合一下上面异步联动的场景，在数组内实现\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"目前这个例子可以说是非常非常复杂了，它同时涉及到了相邻元素之间的异步联动，也涉\\n及到了子到父，父到子之间的多维联动，同时在数组重排序的时候还会涉及间接联动\")), React.createElement(\"h4\", {\n id: \"demo-示例-3\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React,{useState,useEffect} from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormPath,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { filter, withLatestFrom, map, debounceTime } from 'rxjs/operators'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => {\\n const [values,setValues] = useState({})\\n useEffect(()=>{\\n setTimeout(()=>{\\n setValues({\\n aa: [\\n {\\n bb: 'aaaaa',\\n dd: [{ ee: '是', ff: '是' }]\\n },\\n {\\n bb: 'ccccc',\\n dd: [{ ee: '否', ff: '是' }]\\n }\\n ]\\n })\\n },1000)\\n },[])\\n return (\\n \\n {\\n const loading = name => {\\n setFieldState(name, state => {\\n state.loading = true\\n })\\n }\\n const loaded = name => {\\n setFieldState(name, state => {\\n state.loading = false\\n })\\n }\\n const hide = name => {\\n setFieldState(name, state => {\\n state.visible = false\\n })\\n }\\n const show = name => {\\n setFieldState(name, state => {\\n state.visible = true\\n })\\n }\\n const setEnum = (name, value) => {\\n setFieldState(name, state => {\\n state.props.enum = value\\n })\\n }\\n const setValue = (name, value) => {\\n setFieldState(name, state => {\\n state.value = value\\n })\\n }\\n $('onFormInit').subscribe(() => {\\n hide(FormPath.match('aa.*.*(cc,gg,dd.*.ee)'))\\n })\\n $('onFieldChange', 'aa.*.bb').subscribe(fieldState => {\\n const cc = FormPath.transform(\\n fieldState.name,\\n /\\\\d+/,\\n i => `aa.${i}.cc`\\n )\\n if (!fieldState.value) {\\n hide(cc)\\n return\\n }\\n show(cc)\\n loading(cc)\\n setTimeout(() => {\\n loaded(cc)\\n setEnum(cc, ['1111', '2222'])\\n setValue(cc, '1111')\\n }, 1000)\\n })\\n $('onFieldChange', 'aa.*.dd.*.ee').subscribe(fieldState => {\\n const gg = FormPath.transform(\\n fieldState.name,\\n /\\\\d+/,\\n (i, j) => `aa.${i}.gg`\\n )\\n setFieldState(gg, state => {\\n if (fieldState.value) {\\n state.visible = fieldState.value == '是'\\n }\\n })\\n })\\n $('onFieldChange', 'aa.*.dd.*.ff').subscribe(fieldState => {\\n const ee = FormPath.transform(\\n fieldState.name,\\n /\\\\d+/,\\n (i, j) => `aa.${i}.dd.${j}.ee`\\n )\\n setFieldState(ee, state => {\\n state.visible = fieldState.value == '是'\\n })\\n })\\n }}\\n onSubmit={v => console.log(v)}\\n initialValues={values}\\n >\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n)\\n}\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_dahns_3, {})));\n};\n\n__MARKDOWN__.meta = {\n \"username\": \"zhili.wzl\",\n \"email\": \"wangzhili56@126.com\"\n};\nmodule.exports = __MARKDOWN__;","/*!\n Copyright (c) 2017 Jed Watson.\n Licensed under the MIT License (MIT), see\n http://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = [];\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (!arg) continue;\n\n\t\t\tvar argType = typeof arg;\n\n\t\t\tif (argType === 'string' || argType === 'number') {\n\t\t\t\tclasses.push(arg);\n\t\t\t} else if (Array.isArray(arg) && arg.length) {\n\t\t\t\tvar inner = classNames.apply(null, arg);\n\t\t\t\tif (inner) {\n\t\t\t\t\tclasses.push(inner);\n\t\t\t\t}\n\t\t\t} else if (argType === 'object') {\n\t\t\t\tfor (var key in arg) {\n\t\t\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\t\t\tclasses.push(key);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn classes.join(' ');\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n","import React, { useState } from 'react'\nimport ReactDOM from 'react-dom'\nimport { createFormActions } from '@uform/react'\nimport styled from 'styled-components'\nimport Modal from 'react-modal'\n\nconst Dialog = styled(props => {\n const [visible, setVisible] = useState(true)\n return (\n {\n setVisible(false)\n }}\n >\n {\n setVisible(false)\n }}\n >\n 
\n \n \n {props.children}\n
\n \n )\n})`\n position: relative;\n margin: 100px;\n padding: 30px;\n height: calc(100% - 200px);\n overflow: auto;\n border: 1px solid #eee;\n background: #fff;\n outline: none;\n .close-btn {\n position: absolute;\n top: 15px;\n right: 10px;\n width: 25px;\n height: 25px;\n cursor: pointer;\n img {\n width: 100%;\n }\n }\n .dialog-content {\n overflow: auto;\n height: 100%;\n }\n`\n\nconst createAlert = (config = {}) => {\n const container = document.createElement('div')\n const unMount = () => {\n ReactDOM.unmountComponentAtNode(container)\n container.parentNode.removeChild(container)\n }\n if (typeof config === 'string' || React.isValidElement(config)) {\n config = {\n content: config\n }\n }\n document.body.appendChild(container)\n ReactDOM.render(\n ,\n container\n )\n}\n\nconst cleanSchema = schema => {\n if (!schema) return\n return {\n type: schema.type,\n 'x-props': schema['x-props'],\n 'x-component': schema['x-component'],\n 'x-index': schema['x-index'],\n 'x-rules': schema['x-rules'],\n maxItems: schema.maxItems,\n minItems: schema.minItems,\n default: schema.default,\n enum: schema.enum,\n title: schema.title,\n required: schema.required,\n\n properties: Object.keys(schema.properties || {}).reduce((buf, key) => {\n buf[key] = cleanSchema(schema.properties[key])\n return buf\n }, {}),\n items: cleanSchema(schema.items)\n }\n}\n\nconst printSchema = schema => {\n return JSON.stringify(cleanSchema(schema), null, 2)\n}\n\nexport default class extends React.Component {\n actions = createFormActions()\n\n onClickHandler = async e => {\n e.preventDefault()\n const schema = await this.actions.getSchema('')\n createAlert(\n \n {printSchema(schema)}\n
\n )\n }\n\n render() {\n const { children, className } = this.props\n if (children && children.props && children.props.actions) {\n this.actions = children.props.actions\n }\n return (\n \n {React.cloneElement(children, {\n actions: this.actions\n })}\n
\n Print JSON Schema\n \n \n {!value ? 'N/A' : value}\n {props.addonTextAfter ? ' ' + props.addonTextAfter : ''}\n {props.addonAfter ? ' ' + props.addonAfter : ''}\n
\n )\n})`\n height: 28px;\n line-height: 28px;\n vertical-align: middle;\n font-size: 13px;\n color: #333;\n &.small {\n height: 20px;\n line-height: 20px;\n }\n &.large {\n height: 40px;\n line-height: 40px;\n }\n`\n\nexport const acceptEnum = component => {\n return ({ dataSource, ...others }) => {\n if (dataSource) {\n return React.createElement(Select, { dataSource, ...others })\n } else {\n return React.createElement(component, others)\n }\n }\n}\n\nexport const mapStyledProps = (props, { loading, size }) => {\n if (loading) {\n props.state = props.state || 'loading'\n }\n if (size) {\n props.size = size\n }\n}\n\nexport const mapTextComponent = (Target, props, { editable, name }) => {\n if (editable !== undefined) {\n if (isFn(editable)) {\n if (!editable(name)) {\n return Text\n }\n } else if (editable === false) {\n return Text\n }\n }\n return Target\n}\n\nexport const compose = (...args) => {\n return (payload, ...extra) => {\n return args.reduce((buf, fn) => {\n return buf !== undefined ? fn(buf, ...extra) : fn(payload, ...extra)\n }, payload)\n }\n}\n\nexport const moveTo = element => {\n if (!element) return\n if (element.scrollIntoView) {\n element.scrollIntoView({\n behavior: 'smooth',\n inline: 'start',\n block: 'start'\n })\n } else {\n new MoveTo().move(element.getBoundingClientRect().top)\n }\n}\n","import React from 'react'\nimport { registerFormWrapper, registerFieldMiddleware } from '@uform/react'\nimport classNames from 'classnames'\nimport { ConfigProvider, Balloon, Icon } from '@alifd/next'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport LOCALE from './locale'\nimport styled from 'styled-components'\nimport { isFn, moveTo } from './utils'\n/**\n * 轻量级Next Form，不包含任何数据管理能力\n *\n */\n\nexport const {\n Provider: FormProvider,\n Consumer: FormConsumer\n} = React.createContext()\n\nconst normalizeCol = col => {\n return typeof col === 'object' ? col : { span: col }\n}\n\nconst getParentNode = (node, selector) => {\n if (!node || (node && !node.matches)) return\n if (node.matches(selector)) return node\n else {\n return getParentNode(node.parentNode || node.parentElement, selector)\n }\n}\n\nexport const FormItem = styled(\n class FormItem extends React.Component {\n static defaultProps = {\n prefix: 'next-'\n }\n\n getItemLabel() {\n const {\n id,\n required,\n label,\n labelCol,\n wrapperCol,\n prefix,\n extra,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n isTableColItem\n } = this.props\n\n if (!label || isTableColItem) {\n return null\n }\n\n const ele = (\n \n )\n\n const cls = classNames({\n [`${prefix}form-item-label`]: true,\n [`${prefix}left`]: labelTextAlign === 'left'\n })\n\n if ((wrapperCol || labelCol) && labelAlign !== 'top') {\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n \n )\n }\n\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n
\n )\n }\n\n getItemWrapper() {\n const {\n labelCol,\n wrapperCol,\n children,\n extra,\n label,\n labelAlign,\n help,\n size,\n prefix,\n noMinHeight,\n isTableColItem\n } = this.props\n\n const message = (\n \n {help && {help}
}\n {!help && extra && extra.length <= 20 && (\n {extra}
\n )}\n \n )\n if (\n (wrapperCol || labelCol) &&\n labelAlign !== 'top' &&\n !isTableColItem &&\n label\n ) {\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n \n )\n }\n\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n
\n )\n }\n\n renderHelper() {\n return (\n }\n >\n {this.props.extra}\n \n )\n }\n\n render() {\n const {\n className,\n labelAlign,\n labelTextAlign,\n style,\n prefix,\n wrapperCol,\n labelCol,\n size,\n help,\n extra,\n noMinHeight,\n isTableColItem,\n validateState,\n autoAddColon,\n required,\n type,\n schema,\n ...others\n } = this.props\n\n const itemClassName = classNames({\n [`${prefix}form-item`]: true,\n [`${prefix}${labelAlign}`]: labelAlign,\n [`has-${validateState}`]: !!validateState,\n [`${prefix}${size}`]: !!size,\n [`${className}`]: !!className,\n [`field-${type}`]: !!type\n })\n\n // 垂直模式并且左对齐才用到\n const Tag = (wrapperCol || labelCol) && labelAlign !== 'top' ? Row : 'div'\n const label = labelAlign === 'inset' ? null : this.getItemLabel()\n\n return (\n \n {label}\n {this.getItemWrapper()}\n \n )\n }\n }\n)`\n margin-bottom: 4px !important;\n &.field-table {\n .next-form-item-control {\n overflow: auto;\n }\n }\n .next-form-item-msg {\n &.next-form-item-space {\n min-height: 20px;\n .next-form-item-help,\n .next-form-item-extra {\n margin-top: 0;\n }\n }\n }\n .next-form-item-extra {\n color: #888;\n font-size: 12px;\n line-height: 1.7;\n }\n`\n\nconst toArr = val => (Array.isArray(val) ? val : val ? [val] : [])\n\nregisterFormWrapper(OriginForm => {\n OriginForm = styled(OriginForm)`\n &.next-inline {\n display: flex;\n .rs-uform-content {\n margin-right: 15px;\n }\n }\n .next-radio-group,\n .next-checkbox-group {\n line-height: 28px;\n & > label {\n margin-right: 8px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 20px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 40px;\n }\n }\n .next-card-head {\n background: none;\n }\n .next-rating-medium {\n min-height: 28px;\n line-height: 28px;\n }\n .next-rating-small {\n min-height: 20px;\n line-height: 20px;\n }\n .next-rating-large {\n min-height: 40px;\n line-height: 40px;\n }\n `\n\n return ConfigProvider.config(\n class Form extends React.Component {\n static defaultProps = {\n component: 'form',\n prefix: 'next-',\n size: 'medium',\n labelAlign: 'left',\n locale: LOCALE,\n autoAddColon: true\n }\n\n static displayName = 'SchemaForm'\n\n FormRef = React.createRef()\n\n validateFailedHandler(onValidateFailed) {\n return (...args) => {\n if (isFn(onValidateFailed)) {\n onValidateFailed(...args)\n }\n const container = this.FormRef.current\n if (container) {\n const errors = container.querySelectorAll('.next-form-item-help')\n if (errors && errors.length) {\n const node = getParentNode(errors[0], '.next-form-item')\n if (node) {\n moveTo(node)\n }\n }\n }\n }\n }\n\n render() {\n const {\n className,\n inline,\n size,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n children,\n component,\n labelCol,\n wrapperCol,\n getErrorScrollOffset,\n errorScrollToElement,\n style,\n prefix,\n ...others\n } = this.props\n const formClassName = classNames({\n [`${prefix}form`]: true,\n [`${prefix}inline`]: inline, // 内联\n [`${prefix}${size}`]: size,\n [className]: !!className\n })\n return (\n \n \n {children}\n \n \n )\n }\n }\n )\n})\n\nconst isTableColItem = (path, getSchema) => {\n const schema = getSchema(path)\n return schema && schema.type === 'array' && schema['x-component'] === 'table'\n}\n\nregisterFieldMiddleware(Field => {\n return props => {\n const { name, editable, errors, path, schema, getSchema, required } = props\n if (path.length === 0) return React.createElement(Field, props) // 根节点是不需要包FormItem的\n return React.createElement(\n FormConsumer,\n {},\n ({\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n size,\n autoAddColon\n }) => {\n return React.createElement(\n FormItem,\n {\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n autoAddColon,\n size,\n ...schema['x-item-props'],\n label: schema.title,\n noMinHeight: schema.type === 'object' && !schema['x-component'],\n isTableColItem: isTableColItem(\n path.slice(0, path.length - 2),\n getSchema\n ),\n type: schema['x-component'] || schema['type'],\n id: name,\n validateState: toArr(errors).length ? 'error' : undefined,\n required: editable === false ? false : required,\n extra: schema.description,\n help:\n toArr(errors).join(' , ') ||\n (schema['x-item-props'] && schema['x-item-props'].help)\n },\n React.createElement(Field, props)\n )\n }\n )\n }\n})\n","import React from 'react'\nimport { registerFormField, createArrayField } from '@uform/react'\nimport { Button, Icon } from '@alifd/next'\nimport styled from 'styled-components'\n\nexport const CircleButton = styled.div.attrs({ className: 'cricle-btn' })`\n ${props =>\n !props.hasText\n ? `width:30px;\n height:30px;`\n : ''}\n margin-right:10px;\n border-radius: ${props => (!props.hasText ? '100px' : 'none')};\n border: ${props => (!props.hasText ? '1px solid #eee' : 'none')};\n margin-bottom:20px;\n cursor:pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 1.3;\n ${props =>\n !props.hasText\n ? `&:hover{\n background:#f7f4f4;\n }`\n : ''}\n .next-icon{\n display:flex;\n align-items:'center'\n }\n .op-name{\n margin-left:3px;\n }\n}\n`\nexport const ArrayField = createArrayField({\n CircleButton,\n TextButton: props => (\n \n ),\n AddIcon: () => ,\n RemoveIcon: () => (\n \n ),\n MoveDownIcon: () => (\n \n ),\n MoveUpIcon: () => (\n \n )\n})\n\nregisterFormField(\n 'array',\n styled(\n class extends ArrayField {\n render() {\n const { className, name, schema, value, renderField } = this.props\n const style = (schema['x-props'] && schema['x-props'].style) || {}\n return (\n \n {value.map((item, index) => {\n return (\n \n
\n {index + 1}\n
\n
{renderField(index)}
\n
\n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n
\n {toArr(value).map((item, index) => {\n return (\n
\n {index + 1}. {title || schema.title}\n \n }\n className='card-list'\n key={index}\n contentHeight='auto'\n extra={this.renderOperations(item, index)}\n >\n {renderField(index)}\n \n )\n })}\n {value.length === 0 && this.renderEmpty(title)}\n \n {value.length > 0 && this.renderAddition()}\n
\n \n {isFn(col.cell)\n ? col.cell(\n record ? record[col.dataIndex] : undefined,\n rowIndex,\n record\n )\n : record\n ? record[col.dataIndex]\n : undefined}\n
\n )\n }\n\n renderTable(columns, dataSource) {\n return (\n \n
\n \n {columns.map((col, index) => {\n return \n })}\n \n \n \n {columns.map((col, index) => {\n return (\n | \n {col.title} \n | \n )\n })}\n
\n \n \n {dataSource.map((record, rowIndex) => {\n return (\n \n {columns.map((col, colIndex) => {\n return (\n | \n {this.renderCell({\n record,\n col,\n rowIndex,\n colIndex\n })}\n | \n )\n })}\n
\n )\n })}\n {this.renderPlacehodler(dataSource, columns)}\n \n
\n
\n | \n \n | \n
\n )\n }\n }\n\n getColumns(children) {\n const columns = []\n React.Children.forEach(children, child => {\n if (React.isValidElement(child)) {\n if (\n child.type === Column ||\n child.type.displayName === '@schema-table-column'\n ) {\n columns.push(child.props)\n }\n }\n })\n\n return columns\n }\n\n render() {\n const columns = this.getColumns(this.props.children)\n const dataSource = toArr(this.props.dataSource)\n return (\n \n
\n
\n {this.renderTable(columns, dataSource)}\n
\n
\n
\n
\n {Object.keys(\n (schema.items && schema.items.properties) || {}\n ).reduce((buf, key) => {\n const itemSchema = schema.items.properties[key]\n const filter = this.createFilter(key, itemSchema)\n const res = filter(\n () => {\n return buf.concat(\n {\n return renderField([index, key])\n }}\n />\n )\n },\n () => {\n return buf\n }\n )\n return res\n }, [])}\n {additionFilter(() => {\n return (\n {\n return (\n \n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n )\n }}\n />\n )\n })}\n
\n {this.renderAddition()}\n
\n \n {checkStrength && this.renderStrength()}\n
\n )\n }\n }\n)`\n .next-input {\n width: 100%;\n position: relative;\n &.input-password input {\n font-size: 16px;\n letter-spacing: 2px;\n }\n input {\n padding-right: 25px;\n }\n .eye {\n position: absolute;\n height: 20px;\n right: 5px;\n top: 50%;\n transform: translate(0, -50%);\n opacity: 0.3;\n cursor: pointer;\n transition: all 0.15s ease-in-out;\n &:hover {\n opacity: 0.6;\n }\n }\n }\n .password-strength-wrapper {\n background: #e0e0e0;\n margin-bottom: 3px;\n position: relative;\n .div {\n position: absolute;\n z-index: 1;\n height: 8px;\n top: 0;\n background: #fff;\n width: 1px;\n transform: translate(-50%, 0);\n }\n .div-1 {\n left: 20%;\n }\n .div-2 {\n left: 40%;\n }\n .div-3 {\n left: 60%;\n }\n .div-4 {\n left: 80%;\n }\n .password-strength-bar {\n position: relative;\n background-image: -webkit-linear-gradient(left, #ff5500, #ff9300);\n transition: all 0.35s ease-in-out;\n height: 8px;\n width: 100%;\n margin-top: 5px;\n }\n }\n`\n\nregisterFormField('password', connect()(Password))\n","import React, { Component } from 'react'\nimport ReactDOM from 'react-dom'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport { FormConsumer } from '../form'\nimport Sticky from 'react-stikky'\nimport cls from 'classnames'\nimport styled from 'styled-components'\n\nconst getAlign = align => {\n if (align === 'start' || align === 'end') return align\n if (align === 'left' || align === 'top') return 'flex-start'\n if (align === 'right' || align === 'bottom') return 'flex-end'\n return align\n}\n\nconst isElementInViewport = (rect, { offset = 0, threshold = 0 } = {}) => {\n const { top, right, bottom, left, width, height } = rect\n const intersection = {\n t: bottom,\n r: window.innerWidth - left,\n b: window.innerHeight - top,\n l: right\n }\n\n const elementThreshold = {\n x: threshold * width,\n y: threshold * height\n }\n\n return (\n intersection.t >= (offset.top || offset + elementThreshold.y) &&\n intersection.r >= (offset.right || offset + elementThreshold.x) &&\n intersection.b >= (offset.bottom || offset + elementThreshold.y) &&\n intersection.l >= (offset.left || offset + elementThreshold.x)\n )\n}\n\nexport const FormButtonGroup = styled(\n class FormButtonGroup extends Component {\n static defaultProps = {\n span: 24,\n zIndex: 100\n }\n\n renderChildren() {\n const { children, itemStyle, offset, span } = this.props\n return (\n \n
\n \n \n \n {children}\n
\n \n \n
\n
\n
\n {({ inline, FormRef } = {}) => {\n if (!FormRef) return\n return (\n \n \n {content}\n
\n \n )\n }}\n \n
\n {children.reduce((buf, child, key) => {\n return child\n ? buf.concat(\n \n {child}\n \n )\n : buf\n }, [])}\n
\n )\n }\n\n render() {\n const { title } = this.props\n if (title) {\n return this.renderFormItem(this.renderGrid())\n } else {\n return this.renderGrid()\n }\n }\n }\n)\n\nexport const FormCard = createVirtualBox(\n 'card',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 30px;\n .next-card-body {\n padding-top: 30px;\n padding-bottom: 0 !important;\n }\n `\n)\n\nexport const FormBlock = createVirtualBox(\n 'block',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 0px;\n .next-card-body {\n padding-top: 20px;\n padding-bottom: 0 !important;\n }\n &.next-card {\n border: none;\n padding: 0 15px;\n padding-bottom: 15px;\n }\n `\n)\n","import './form'\nimport './fields/string'\nimport './fields/number'\nimport './fields/boolean'\nimport './fields/date'\nimport './fields/time'\nimport './fields/range'\nimport './fields/upload'\nimport './fields/checkbox'\nimport './fields/radio'\nimport './fields/rating'\nimport './fields/transfer'\nimport './fields/array'\nimport './fields/cards'\nimport './fields/table'\nimport './fields/password'\nimport { mapStyledProps, mapTextComponent } from './utils'\nimport { SchemaForm } from '@uform/react'\nexport * from '@uform/react'\nexport * from './components/formButtonGroup'\nexport * from './components/button'\nexport * from './components/layout'\nexport { mapStyledProps, mapTextComponent }\nexport default SchemaForm\n","/*! *****************************************************************************\r\nCopyright (c) Microsoft Corporation. All rights reserved.\r\nLicensed under the Apache License, Version 2.0 (the \"License\"); you may not use\r\nthis file except in compliance with the License. You may obtain a copy of the\r\nLicense at http://www.apache.org/licenses/LICENSE-2.0\r\n\r\nTHIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\nKIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED\r\nWARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,\r\nMERCHANTABLITY OR NON-INFRINGEMENT.\r\n\r\nSee the Apache Version 2.0 License for specific language governing permissions\r\nand limitations under the License.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)\r\n t[p[i]] = s[p[i]];\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (_) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport function __exportStar(m, exports) {\r\n for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];\r\n}\r\n\r\nexport function __values(o) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator], i = 0;\r\n if (m) return m.call(o);\r\n return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];\r\n result.default = mod;\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n","/*!\n * MoveTo - A lightweight scroll animation javascript library without any dependency.\n * Version 1.8.0 (14-01-2019 13:15)\n * Licensed under MIT\n * Copyright 2019 Hasan Aydoğdu \n */\n\n'use strict';\nvar MoveTo = function () {\n /**\n * Defaults\n * @type {object}\n */\n var defaults = {\n tolerance: 0,\n duration: 800,\n easing: 'easeOutQuart',\n container: window,\n callback: function callback() {} };\n\n\n /**\n * easeOutQuart Easing Function\n * @param {number} t - current time\n * @param {number} b - start value\n * @param {number} c - change in value\n * @param {number} d - duration\n * @return {number} - calculated value\n */\n function easeOutQuart(t, b, c, d) {\n t /= d;\n t--;\n return -c * (t * t * t * t - 1) + b;\n }\n\n /**\n * Merge two object\n *\n * @param {object} obj1\n * @param {object} obj2\n * @return {object} merged object\n */\n function mergeObject(obj1, obj2) {\n var obj3 = {};\n Object.keys(obj1).forEach(function (propertyName) {\n obj3[propertyName] = obj1[propertyName];\n });\n\n Object.keys(obj2).forEach(function (propertyName) {\n obj3[propertyName] = obj2[propertyName];\n });\n return obj3;\n };\n\n /**\n * Converts camel case to kebab case\n * @param {string} val the value to be converted\n * @return {string} the converted value\n */\n function kebabCase(val) {\n return val.replace(/([A-Z])/g, function ($1) {\n return '-' + $1.toLowerCase();\n });\n };\n\n /**\n * Count a number of item scrolled top\n * @param {Window|HTMLElement} container\n * @return {number}\n */\n function countScrollTop(container) {\n if (container instanceof HTMLElement) {\n return container.scrollTop;\n }\n return container.pageYOffset;\n };\n\n /**\n * MoveTo Constructor\n * @param {object} options Options\n * @param {object} easeFunctions Custom ease functions\n */\n function MoveTo() {var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};var easeFunctions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n this.options = mergeObject(defaults, options);\n this.easeFunctions = mergeObject({ easeOutQuart: easeOutQuart }, easeFunctions);\n }\n\n /**\n * Register a dom element as trigger\n * @param {HTMLElement} dom Dom trigger element\n * @param {function} callback Callback function\n * @return {function|void} unregister function\n */\n MoveTo.prototype.registerTrigger = function (dom, callback) {var _this = this;\n if (!dom) {\n return;\n }\n\n var href = dom.getAttribute('href') || dom.getAttribute('data-target');\n // The element to be scrolled\n var target = href && href !== '#' ?\n document.getElementById(href.substring(1)) :\n document.body;\n var options = mergeObject(this.options, _getOptionsFromTriggerDom(dom, this.options));\n\n if (typeof callback === 'function') {\n options.callback = callback;\n }\n\n var listener = function listener(e) {\n e.preventDefault();\n _this.move(target, options);\n };\n\n dom.addEventListener('click', listener, false);\n\n return function () {return dom.removeEventListener('click', listener, false);};\n };\n\n /**\n * Move\n * Scrolls to given element by using easeOutQuart function\n * @param {HTMLElement|number} target Target element to be scrolled or target position\n * @param {object} options Custom options\n */\n MoveTo.prototype.move = function (target) {var _this2 = this;var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n if (target !== 0 && !target) {\n return;\n }\n\n options = mergeObject(this.options, options);\n\n var distance = typeof target === 'number' ? target : target.getBoundingClientRect().top;\n var from = countScrollTop(options.container);\n var startTime = null;\n var lastYOffset = void 0;\n distance -= options.tolerance;\n\n // rAF loop\n var loop = function loop(currentTime) {\n var currentYOffset = countScrollTop(_this2.options.container);\n\n if (!startTime) {\n // To starts time from 1, we subtracted 1 from current time\n // If time starts from 1 The first loop will not do anything,\n // because easing value will be zero\n startTime = currentTime - 1;\n }\n\n var timeElapsed = currentTime - startTime;\n\n if (lastYOffset) {\n if (\n distance > 0 && lastYOffset > currentYOffset ||\n distance < 0 && lastYOffset < currentYOffset)\n {\n return options.callback(target);\n }\n }\n lastYOffset = currentYOffset;\n\n var val = _this2.easeFunctions[options.easing](timeElapsed, from, distance, options.duration);\n\n options.container.scroll(0, val);\n\n if (timeElapsed < options.duration) {\n window.requestAnimationFrame(loop);\n } else {\n options.container.scroll(0, distance + from);\n options.callback(target);\n }\n };\n\n window.requestAnimationFrame(loop);\n };\n\n /**\n * Adds custom ease function\n * @param {string} name Ease function name\n * @param {function} fn Ease function\n */\n MoveTo.prototype.addEaseFunction = function (name, fn) {\n this.easeFunctions[name] = fn;\n };\n\n /**\n * Returns options which created from trigger dom element\n * @param {HTMLElement} dom Trigger dom element\n * @param {object} options The instance's options\n * @return {object} The options which created from trigger dom element\n */\n function _getOptionsFromTriggerDom(dom, options) {\n var domOptions = {};\n\n Object.keys(options).forEach(function (key) {\n var value = dom.getAttribute('data-mt-' + kebabCase(key));\n if (value) {\n domOptions[key] = isNaN(value) ? value : parseInt(value, 10);\n }\n });\n return domOptions;\n }\n\n return MoveTo;\n}();\n\nif (typeof module !== 'undefined') {\n module.exports = MoveTo;\n} else {\n window.MoveTo = MoveTo;\n}"],"mappings":"AAEA;;;;;;;;;;;ACKA;;;;;;;;;;;;;;;;;;;;;;;;ACqEA;;;;;;;;;;;;;;AChCA;;;;;;;;;;;;;;;;;;;;;AC6KA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA;ACjQA;;AAMA;AACA;;;;;;;AAOA;;;;;;;;;AAeA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC0DA;;;;;;;;;;;;;;;;;;;;;;;;ACtNA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuTA;ACjMA;;;;;;;;;;;;;;;;;;;;ACvHA;;;;;;AC4JA;;;;;;;;;;;AChKA;;;;;;;;;;;;;;;ACgBA;;;;;;ACRA","sourceRoot":""}
\ No newline at end of file
diff --git a/packages/docs/bundle.16.js.map b/packages/docs/bundle.16.js.map
index b7c7df2c71b..a9c7686bed5 100644
--- a/packages/docs/bundle.16.js.map
+++ b/packages/docs/bundle.16.js.map
@@ -1 +1 @@
-{"version":3,"file":"bundle.16.js","sources":["webpack:///./docs/Examples/next/Actions.md","webpack:///./packages/next/node_modules/classnames/index.js","webpack:///./packages/printer/src/index.js","webpack:///./packages/next/src/utils.js","webpack:///./packages/next/src/form.js","webpack:///./packages/next/src/fields/array.js","webpack:///./packages/next/src/fields/cards.js","webpack:///./packages/next/src/fields/table.js","webpack:///./packages/next/src/fields/password.js","webpack:///./packages/next/src/components/formButtonGroup.js","webpack:///./packages/next/src/components/button.js","webpack:///./packages/next/src/components/layout.js","webpack:///./packages/next/src/index.js","webpack:///./node_modules/_tslib@1.9.3@tslib/tslib.es6.js","webpack:///./packages/next/node_modules/moveto/dist/moveTo.js"],"sourcesContent":["\"use strict\";\n\nvar React = require('/Users/wangzhili/uform/node_modules/_react@16.8.6@react/index.js');\n\nvar ReactDOM = require('/Users/wangzhili/uform/node_modules/_react-dom@16.8.6@react-dom/index.js');\n\nvar ReactCodeSnippet = require('/Users/wangzhili/uform/node_modules/_react-code-snippet@0.6.13@react-code-snippet/lib/index.js');\n\nvar ReactPropsTable = require('/Users/wangzhili/uform/node_modules/_react-props-table@0.1.3@react-props-table/lib/index.js');\n\nvar __DEFINE__ = function __DEFINE__(fn) {\n var module = {\n exports: {}\n };\n fn(module, module.exports);\n var component = module.exports.__esModule && module.exports['default'] || module.exports;\n return typeof component === 'function' ? component : function () {\n return React.createElement('div', {}, 'Code snippet should export a component!');\n };\n};\n\nvar Demo_fycos_0 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _operators = require(\"rxjs/operators\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var actions = (0, _next.createFormActions)();\n actions.setFieldState('aa', function (state) {\n //同步调用会出错\n state.value = '123';\n });\n actions.submit(); //同步调用会出错\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n actions: actions,\n labelCol: 6,\n wrapperCol: 4,\n onSubmit: function onSubmit(v) {\n return alert(JSON.stringify(v));\n }\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aa\",\n type: \"string\",\n required: true,\n title: \"AA\"\n }), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 6\n }, _react[\"default\"].createElement(_next2.Button, {\n onClick: function onClick() {\n //异步调用没问题\n actions.setFieldState('aa', function (state) {\n state.value = 'hello world';\n });\n actions.submit();\n }\n }, \"\\u4FEE\\u6539AA\\u7684\\u503C\\u5E76\\u63D0\\u4EA4\\u8868\\u5355\"))));\n };\n\n console.log(_react[\"default\"].unstable_ConcurrentMode);\n\n function _default() {\n return _react[\"default\"].createElement(_react[\"default\"].unstable_ConcurrentMode, null, _react[\"default\"].createElement(App, null));\n }\n});\n\nvar Demo_dtabv_1 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _operators = require(\"rxjs/operators\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var actions = (0, _next.createAsyncFormActions)();\n actions.setFieldState('aa', function (state) {\n //同步调用没问题\n state.value = '123';\n });\n actions.submit(); //同步调用没问题\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n actions: actions,\n labelCol: 6,\n wrapperCol: 4,\n onSubmit: function onSubmit(v) {\n return alert(JSON.stringify(v));\n }\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aa\",\n type: \"string\",\n required: true,\n title: \"AA\"\n }), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 6\n }, _react[\"default\"].createElement(_next2.Button, {\n onClick: function onClick() {\n //异步调用没问题\n actions.setFieldState('aa', function (state) {\n state.value = 'hello world';\n });\n actions.submit();\n }\n }, \"\\u4FEE\\u6539AA\\u7684\\u503C\\u5E76\\u63D0\\u4EA4\\u8868\\u5355\"))));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar __MARKDOWN__ = function __MARKDOWN__() {\n return React.createElement(React.Fragment, {}, React.createElement(\"h1\", {\n id: \"内外通讯联动\",\n className: \"react-demo-h1\"\n }, \"内外通讯联动\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"是指 Form 外部想要与 Form 进行通讯的场景，比如调用 Form 的 submit 方法\\n/validate 方法，或者直接设置 Form 某个字段状态的场景\")), React.createElement(\"h3\", {\n id: \"使用-createformactions-做通讯\",\n className: \"react-demo-h3\"\n }, \"使用 createFormActions 做通讯\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"使用 createFormActions 所创建出来的所有表单操作方法都是同步调用的方式，但是它\\n是必须等待组件初始化完成之后才能调用，否则会报错不过通常我们调用它的方法都是在\\n某个异步事件里调用，所以恰好错开了组件渲染过程的时机，在异步事件内调用就不会报\\n错\")), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormPath,\\n FormBlock,\\n FormLayout,\\n createFormActions\\n} from '@uform/next'\\nimport { filter, withLatestFrom, map, debounceTime } from 'rxjs/operators'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst actions = createFormActions()\\n\\nactions.setFieldState('aa', state => { //同步调用会出错\\n state.value = '123'\\n})\\nactions.submit() //同步调用会出错\\n\\nconst App = () => (\\n \\n alert(JSON.stringify(v))}\\n >\\n \\n \\n \\n \\n \\n \\n)\\nconsole.log(React.unstable_ConcurrentMode)\\nReactDOM.render(\\n \\n \\n ,\\n document.getElementById('root')\\n)\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_fycos_0, {})), React.createElement(\"h3\", {\n id: \"使用-createasyncformactions-做通讯\",\n className: \"react-demo-h3\"\n }, \"使用 createAsyncFormActions 做通讯\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"如果用户不想关心 actions 与组件初始化时机的问题，那么可以使用\\ncreateAsyncFormActions，每个被创建出来的方法都将返回一个 Promise 对象这样可以\\n保证方法一定是会在组件初始化完成之后才会调用，也不会报错\")), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormPath,\\n FormBlock,\\n FormLayout,\\n createAsyncFormActions\\n} from '@uform/next'\\nimport { filter, withLatestFrom, map, debounceTime } from 'rxjs/operators'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst actions = createAsyncFormActions()\\n\\nactions.setFieldState('aa', state => {\\n //同步调用没问题\\n state.value = '123'\\n})\\nactions.submit() //同步调用没问题\\n\\nconst App = () => (\\n \\n alert(JSON.stringify(v))}\\n >\\n \\n \\n {\\n //异步调用没问题\\n actions.setFieldState('aa', state => {\\n state.value = 'hello world'\\n })\\n actions.submit()\\n }}\\n >\\n 修改AA的值并提交表单\\n \\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_dtabv_1, {})));\n};\n\n__MARKDOWN__.meta = {\n \"username\": \"zhili.wzl\",\n \"email\": \"wangzhili56@126.com\"\n};\nmodule.exports = __MARKDOWN__;","/*!\n Copyright (c) 2017 Jed Watson.\n Licensed under the MIT License (MIT), see\n http://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = [];\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (!arg) continue;\n\n\t\t\tvar argType = typeof arg;\n\n\t\t\tif (argType === 'string' || argType === 'number') {\n\t\t\t\tclasses.push(arg);\n\t\t\t} else if (Array.isArray(arg) && arg.length) {\n\t\t\t\tvar inner = classNames.apply(null, arg);\n\t\t\t\tif (inner) {\n\t\t\t\t\tclasses.push(inner);\n\t\t\t\t}\n\t\t\t} else if (argType === 'object') {\n\t\t\t\tfor (var key in arg) {\n\t\t\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\t\t\tclasses.push(key);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn classes.join(' ');\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n","import React, { useState } from 'react'\nimport ReactDOM from 'react-dom'\nimport { createFormActions } from '@uform/react'\nimport styled from 'styled-components'\nimport Modal from 'react-modal'\n\nconst Dialog = styled(props => {\n const [visible, setVisible] = useState(true)\n return (\n {\n setVisible(false)\n }}\n >\n {\n setVisible(false)\n }}\n >\n \n \n \n {props.children}\n
\n \n )\n})`\n position: relative;\n margin: 100px;\n padding: 30px;\n height: calc(100% - 200px);\n overflow: auto;\n border: 1px solid #eee;\n background: #fff;\n outline: none;\n .close-btn {\n position: absolute;\n top: 15px;\n right: 10px;\n width: 25px;\n height: 25px;\n cursor: pointer;\n img {\n width: 100%;\n }\n }\n .dialog-content {\n overflow: auto;\n height: 100%;\n }\n`\n\nconst createAlert = (config = {}) => {\n const container = document.createElement('div')\n const unMount = () => {\n ReactDOM.unmountComponentAtNode(container)\n container.parentNode.removeChild(container)\n }\n if (typeof config === 'string' || React.isValidElement(config)) {\n config = {\n content: config\n }\n }\n document.body.appendChild(container)\n ReactDOM.render(\n ,\n container\n )\n}\n\nconst cleanSchema = schema => {\n if (!schema) return\n return {\n type: schema.type,\n 'x-props': schema['x-props'],\n 'x-component': schema['x-component'],\n 'x-index': schema['x-index'],\n 'x-rules': schema['x-rules'],\n maxItems: schema.maxItems,\n minItems: schema.minItems,\n default: schema.default,\n enum: schema.enum,\n title: schema.title,\n required: schema.required,\n\n properties: Object.keys(schema.properties || {}).reduce((buf, key) => {\n buf[key] = cleanSchema(schema.properties[key])\n return buf\n }, {}),\n items: cleanSchema(schema.items)\n }\n}\n\nconst printSchema = schema => {\n return JSON.stringify(cleanSchema(schema), null, 2)\n}\n\nexport default class extends React.Component {\n actions = createFormActions()\n\n onClickHandler = async e => {\n e.preventDefault()\n const schema = await this.actions.getSchema('')\n createAlert(\n \n {printSchema(schema)}\n
\n )\n }\n\n render() {\n const { children, className } = this.props\n if (children && children.props && children.props.actions) {\n this.actions = children.props.actions\n }\n return (\n \n {React.cloneElement(children, {\n actions: this.actions\n })}\n
\n Print JSON Schema\n \n \n {!value ? 'N/A' : value}\n {props.addonTextAfter ? ' ' + props.addonTextAfter : ''}\n {props.addonAfter ? ' ' + props.addonAfter : ''}\n
\n )\n})`\n height: 28px;\n line-height: 28px;\n vertical-align: middle;\n font-size: 13px;\n color: #333;\n &.small {\n height: 20px;\n line-height: 20px;\n }\n &.large {\n height: 40px;\n line-height: 40px;\n }\n`\n\nexport const acceptEnum = component => {\n return ({ dataSource, ...others }) => {\n if (dataSource) {\n return React.createElement(Select, { dataSource, ...others })\n } else {\n return React.createElement(component, others)\n }\n }\n}\n\nexport const mapStyledProps = (props, { loading, size }) => {\n if (loading) {\n props.state = props.state || 'loading'\n }\n if (size) {\n props.size = size\n }\n}\n\nexport const mapTextComponent = (Target, props, { editable, name }) => {\n if (editable !== undefined) {\n if (isFn(editable)) {\n if (!editable(name)) {\n return Text\n }\n } else if (editable === false) {\n return Text\n }\n }\n return Target\n}\n\nexport const compose = (...args) => {\n return (payload, ...extra) => {\n return args.reduce((buf, fn) => {\n return buf !== undefined ? fn(buf, ...extra) : fn(payload, ...extra)\n }, payload)\n }\n}\n\nexport const moveTo = element => {\n if (!element) return\n if (element.scrollIntoView) {\n element.scrollIntoView({\n behavior: 'smooth',\n inline: 'start',\n block: 'start'\n })\n } else {\n new MoveTo().move(element.getBoundingClientRect().top)\n }\n}\n","import React from 'react'\nimport { registerFormWrapper, registerFieldMiddleware } from '@uform/react'\nimport classNames from 'classnames'\nimport { ConfigProvider, Balloon, Icon } from '@alifd/next'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport LOCALE from './locale'\nimport styled from 'styled-components'\nimport { isFn, moveTo } from './utils'\n/**\n * 轻量级Next Form，不包含任何数据管理能力\n *\n */\n\nexport const {\n Provider: FormProvider,\n Consumer: FormConsumer\n} = React.createContext()\n\nconst normalizeCol = col => {\n return typeof col === 'object' ? col : { span: col }\n}\n\nconst getParentNode = (node, selector) => {\n if (!node || (node && !node.matches)) return\n if (node.matches(selector)) return node\n else {\n return getParentNode(node.parentNode || node.parentElement, selector)\n }\n}\n\nexport const FormItem = styled(\n class FormItem extends React.Component {\n static defaultProps = {\n prefix: 'next-'\n }\n\n getItemLabel() {\n const {\n id,\n required,\n label,\n labelCol,\n wrapperCol,\n prefix,\n extra,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n isTableColItem\n } = this.props\n\n if (!label || isTableColItem) {\n return null\n }\n\n const ele = (\n \n )\n\n const cls = classNames({\n [`${prefix}form-item-label`]: true,\n [`${prefix}left`]: labelTextAlign === 'left'\n })\n\n if ((wrapperCol || labelCol) && labelAlign !== 'top') {\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n \n )\n }\n\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n
\n )\n }\n\n getItemWrapper() {\n const {\n labelCol,\n wrapperCol,\n children,\n extra,\n label,\n labelAlign,\n help,\n size,\n prefix,\n noMinHeight,\n isTableColItem\n } = this.props\n\n const message = (\n \n {help && {help}
}\n {!help && extra && extra.length <= 20 && (\n {extra}
\n )}\n \n )\n if (\n (wrapperCol || labelCol) &&\n labelAlign !== 'top' &&\n !isTableColItem &&\n label\n ) {\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n \n )\n }\n\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n
\n )\n }\n\n renderHelper() {\n return (\n }\n >\n {this.props.extra}\n \n )\n }\n\n render() {\n const {\n className,\n labelAlign,\n labelTextAlign,\n style,\n prefix,\n wrapperCol,\n labelCol,\n size,\n help,\n extra,\n noMinHeight,\n isTableColItem,\n validateState,\n autoAddColon,\n required,\n type,\n schema,\n ...others\n } = this.props\n\n const itemClassName = classNames({\n [`${prefix}form-item`]: true,\n [`${prefix}${labelAlign}`]: labelAlign,\n [`has-${validateState}`]: !!validateState,\n [`${prefix}${size}`]: !!size,\n [`${className}`]: !!className,\n [`field-${type}`]: !!type\n })\n\n // 垂直模式并且左对齐才用到\n const Tag = (wrapperCol || labelCol) && labelAlign !== 'top' ? Row : 'div'\n const label = labelAlign === 'inset' ? null : this.getItemLabel()\n\n return (\n \n {label}\n {this.getItemWrapper()}\n \n )\n }\n }\n)`\n margin-bottom: 4px !important;\n &.field-table {\n .next-form-item-control {\n overflow: auto;\n }\n }\n .next-form-item-msg {\n &.next-form-item-space {\n min-height: 20px;\n .next-form-item-help,\n .next-form-item-extra {\n margin-top: 0;\n }\n }\n }\n .next-form-item-extra {\n color: #888;\n font-size: 12px;\n line-height: 1.7;\n }\n`\n\nconst toArr = val => (Array.isArray(val) ? val : val ? [val] : [])\n\nregisterFormWrapper(OriginForm => {\n OriginForm = styled(OriginForm)`\n &.next-inline {\n display: flex;\n .rs-uform-content {\n margin-right: 15px;\n }\n }\n .next-radio-group,\n .next-checkbox-group {\n line-height: 28px;\n & > label {\n margin-right: 8px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 20px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 40px;\n }\n }\n .next-card-head {\n background: none;\n }\n .next-rating-medium {\n min-height: 28px;\n line-height: 28px;\n }\n .next-rating-small {\n min-height: 20px;\n line-height: 20px;\n }\n .next-rating-large {\n min-height: 40px;\n line-height: 40px;\n }\n `\n\n return ConfigProvider.config(\n class Form extends React.Component {\n static defaultProps = {\n component: 'form',\n prefix: 'next-',\n size: 'medium',\n labelAlign: 'left',\n locale: LOCALE,\n autoAddColon: true\n }\n\n static displayName = 'SchemaForm'\n\n FormRef = React.createRef()\n\n validateFailedHandler(onValidateFailed) {\n return (...args) => {\n if (isFn(onValidateFailed)) {\n onValidateFailed(...args)\n }\n const container = this.FormRef.current\n if (container) {\n const errors = container.querySelectorAll('.next-form-item-help')\n if (errors && errors.length) {\n const node = getParentNode(errors[0], '.next-form-item')\n if (node) {\n moveTo(node)\n }\n }\n }\n }\n }\n\n render() {\n const {\n className,\n inline,\n size,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n children,\n component,\n labelCol,\n wrapperCol,\n getErrorScrollOffset,\n errorScrollToElement,\n style,\n prefix,\n ...others\n } = this.props\n const formClassName = classNames({\n [`${prefix}form`]: true,\n [`${prefix}inline`]: inline, // 内联\n [`${prefix}${size}`]: size,\n [className]: !!className\n })\n return (\n \n \n {children}\n \n \n )\n }\n }\n )\n})\n\nconst isTableColItem = (path, getSchema) => {\n const schema = getSchema(path)\n return schema && schema.type === 'array' && schema['x-component'] === 'table'\n}\n\nregisterFieldMiddleware(Field => {\n return props => {\n const { name, editable, errors, path, schema, getSchema, required } = props\n if (path.length === 0) return React.createElement(Field, props) // 根节点是不需要包FormItem的\n return React.createElement(\n FormConsumer,\n {},\n ({\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n size,\n autoAddColon\n }) => {\n return React.createElement(\n FormItem,\n {\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n autoAddColon,\n size,\n ...schema['x-item-props'],\n label: schema.title,\n noMinHeight: schema.type === 'object' && !schema['x-component'],\n isTableColItem: isTableColItem(\n path.slice(0, path.length - 2),\n getSchema\n ),\n type: schema['x-component'] || schema['type'],\n id: name,\n validateState: toArr(errors).length ? 'error' : undefined,\n required: editable === false ? false : required,\n extra: schema.description,\n help:\n toArr(errors).join(' , ') ||\n (schema['x-item-props'] && schema['x-item-props'].help)\n },\n React.createElement(Field, props)\n )\n }\n )\n }\n})\n","import React from 'react'\nimport { registerFormField, createArrayField } from '@uform/react'\nimport { Button, Icon } from '@alifd/next'\nimport styled from 'styled-components'\n\nexport const CircleButton = styled.div.attrs({ className: 'cricle-btn' })`\n ${props =>\n !props.hasText\n ? `width:30px;\n height:30px;`\n : ''}\n margin-right:10px;\n border-radius: ${props => (!props.hasText ? '100px' : 'none')};\n border: ${props => (!props.hasText ? '1px solid #eee' : 'none')};\n margin-bottom:20px;\n cursor:pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 1.3;\n ${props =>\n !props.hasText\n ? `&:hover{\n background:#f7f4f4;\n }`\n : ''}\n .next-icon{\n display:flex;\n align-items:'center'\n }\n .op-name{\n margin-left:3px;\n }\n}\n`\nexport const ArrayField = createArrayField({\n CircleButton,\n TextButton: props => (\n \n ),\n AddIcon: () => ,\n RemoveIcon: () => (\n \n ),\n MoveDownIcon: () => (\n \n ),\n MoveUpIcon: () => (\n \n )\n})\n\nregisterFormField(\n 'array',\n styled(\n class extends ArrayField {\n render() {\n const { className, name, schema, value, renderField } = this.props\n const style = (schema['x-props'] && schema['x-props'].style) || {}\n return (\n \n {value.map((item, index) => {\n return (\n \n
\n {index + 1}\n
\n
{renderField(index)}
\n
\n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n
\n {toArr(value).map((item, index) => {\n return (\n
\n {index + 1}. {title || schema.title}\n \n }\n className='card-list'\n key={index}\n contentHeight='auto'\n extra={this.renderOperations(item, index)}\n >\n {renderField(index)}\n \n )\n })}\n {value.length === 0 && this.renderEmpty(title)}\n \n {value.length > 0 && this.renderAddition()}\n
\n \n {isFn(col.cell)\n ? col.cell(\n record ? record[col.dataIndex] : undefined,\n rowIndex,\n record\n )\n : record\n ? record[col.dataIndex]\n : undefined}\n
\n )\n }\n\n renderTable(columns, dataSource) {\n return (\n \n
\n \n {columns.map((col, index) => {\n return \n })}\n \n \n \n {columns.map((col, index) => {\n return (\n | \n {col.title} \n | \n )\n })}\n
\n \n \n {dataSource.map((record, rowIndex) => {\n return (\n \n {columns.map((col, colIndex) => {\n return (\n | \n {this.renderCell({\n record,\n col,\n rowIndex,\n colIndex\n })}\n | \n )\n })}\n
\n )\n })}\n {this.renderPlacehodler(dataSource, columns)}\n \n
\n
\n | \n \n | \n
\n )\n }\n }\n\n getColumns(children) {\n const columns = []\n React.Children.forEach(children, child => {\n if (React.isValidElement(child)) {\n if (\n child.type === Column ||\n child.type.displayName === '@schema-table-column'\n ) {\n columns.push(child.props)\n }\n }\n })\n\n return columns\n }\n\n render() {\n const columns = this.getColumns(this.props.children)\n const dataSource = toArr(this.props.dataSource)\n return (\n \n
\n
\n {this.renderTable(columns, dataSource)}\n
\n
\n
\n
\n {Object.keys(\n (schema.items && schema.items.properties) || {}\n ).reduce((buf, key) => {\n const itemSchema = schema.items.properties[key]\n const filter = this.createFilter(key, itemSchema)\n const res = filter(\n () => {\n return buf.concat(\n {\n return renderField([index, key])\n }}\n />\n )\n },\n () => {\n return buf\n }\n )\n return res\n }, [])}\n {additionFilter(() => {\n return (\n {\n return (\n \n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n )\n }}\n />\n )\n })}\n
\n {this.renderAddition()}\n
\n \n {checkStrength && this.renderStrength()}\n
\n )\n }\n }\n)`\n .next-input {\n width: 100%;\n position: relative;\n &.input-password input {\n font-size: 16px;\n letter-spacing: 2px;\n }\n input {\n padding-right: 25px;\n }\n .eye {\n position: absolute;\n height: 20px;\n right: 5px;\n top: 50%;\n transform: translate(0, -50%);\n opacity: 0.3;\n cursor: pointer;\n transition: all 0.15s ease-in-out;\n &:hover {\n opacity: 0.6;\n }\n }\n }\n .password-strength-wrapper {\n background: #e0e0e0;\n margin-bottom: 3px;\n position: relative;\n .div {\n position: absolute;\n z-index: 1;\n height: 8px;\n top: 0;\n background: #fff;\n width: 1px;\n transform: translate(-50%, 0);\n }\n .div-1 {\n left: 20%;\n }\n .div-2 {\n left: 40%;\n }\n .div-3 {\n left: 60%;\n }\n .div-4 {\n left: 80%;\n }\n .password-strength-bar {\n position: relative;\n background-image: -webkit-linear-gradient(left, #ff5500, #ff9300);\n transition: all 0.35s ease-in-out;\n height: 8px;\n width: 100%;\n margin-top: 5px;\n }\n }\n`\n\nregisterFormField('password', connect()(Password))\n","import React, { Component } from 'react'\nimport ReactDOM from 'react-dom'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport { FormConsumer } from '../form'\nimport Sticky from 'react-stikky'\nimport cls from 'classnames'\nimport styled from 'styled-components'\n\nconst getAlign = align => {\n if (align === 'start' || align === 'end') return align\n if (align === 'left' || align === 'top') return 'flex-start'\n if (align === 'right' || align === 'bottom') return 'flex-end'\n return align\n}\n\nconst isElementInViewport = (rect, { offset = 0, threshold = 0 } = {}) => {\n const { top, right, bottom, left, width, height } = rect\n const intersection = {\n t: bottom,\n r: window.innerWidth - left,\n b: window.innerHeight - top,\n l: right\n }\n\n const elementThreshold = {\n x: threshold * width,\n y: threshold * height\n }\n\n return (\n intersection.t >= (offset.top || offset + elementThreshold.y) &&\n intersection.r >= (offset.right || offset + elementThreshold.x) &&\n intersection.b >= (offset.bottom || offset + elementThreshold.y) &&\n intersection.l >= (offset.left || offset + elementThreshold.x)\n )\n}\n\nexport const FormButtonGroup = styled(\n class FormButtonGroup extends Component {\n static defaultProps = {\n span: 24,\n zIndex: 100\n }\n\n renderChildren() {\n const { children, itemStyle, offset, span } = this.props\n return (\n \n
\n \n \n \n {children}\n
\n \n \n
\n
\n
\n {({ inline, FormRef } = {}) => {\n if (!FormRef) return\n return (\n \n \n {content}\n
\n \n )\n }}\n \n
\n {children.reduce((buf, child, key) => {\n return child\n ? buf.concat(\n \n {child}\n \n )\n : buf\n }, [])}\n
\n )\n }\n\n render() {\n const { title } = this.props\n if (title) {\n return this.renderFormItem(this.renderGrid())\n } else {\n return this.renderGrid()\n }\n }\n }\n)\n\nexport const FormCard = createVirtualBox(\n 'card',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 30px;\n .next-card-body {\n padding-top: 30px;\n padding-bottom: 0 !important;\n }\n `\n)\n\nexport const FormBlock = createVirtualBox(\n 'block',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 0px;\n .next-card-body {\n padding-top: 20px;\n padding-bottom: 0 !important;\n }\n &.next-card {\n border: none;\n padding: 0 15px;\n padding-bottom: 15px;\n }\n `\n)\n","import './form'\nimport './fields/string'\nimport './fields/number'\nimport './fields/boolean'\nimport './fields/date'\nimport './fields/time'\nimport './fields/range'\nimport './fields/upload'\nimport './fields/checkbox'\nimport './fields/radio'\nimport './fields/rating'\nimport './fields/transfer'\nimport './fields/array'\nimport './fields/cards'\nimport './fields/table'\nimport './fields/password'\nimport { mapStyledProps, mapTextComponent } from './utils'\nimport { SchemaForm } from '@uform/react'\nexport * from '@uform/react'\nexport * from './components/formButtonGroup'\nexport * from './components/button'\nexport * from './components/layout'\nexport { mapStyledProps, mapTextComponent }\nexport default SchemaForm\n","/*! *****************************************************************************\r\nCopyright (c) Microsoft Corporation. All rights reserved.\r\nLicensed under the Apache License, Version 2.0 (the \"License\"); you may not use\r\nthis file except in compliance with the License. You may obtain a copy of the\r\nLicense at http://www.apache.org/licenses/LICENSE-2.0\r\n\r\nTHIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\nKIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED\r\nWARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,\r\nMERCHANTABLITY OR NON-INFRINGEMENT.\r\n\r\nSee the Apache Version 2.0 License for specific language governing permissions\r\nand limitations under the License.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)\r\n t[p[i]] = s[p[i]];\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (_) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport function __exportStar(m, exports) {\r\n for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];\r\n}\r\n\r\nexport function __values(o) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator], i = 0;\r\n if (m) return m.call(o);\r\n return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];\r\n result.default = mod;\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n","/*!\n * MoveTo - A lightweight scroll animation javascript library without any dependency.\n * Version 1.8.0 (14-01-2019 13:15)\n * Licensed under MIT\n * Copyright 2019 Hasan Aydoğdu \n */\n\n'use strict';\nvar MoveTo = function () {\n /**\n * Defaults\n * @type {object}\n */\n var defaults = {\n tolerance: 0,\n duration: 800,\n easing: 'easeOutQuart',\n container: window,\n callback: function callback() {} };\n\n\n /**\n * easeOutQuart Easing Function\n * @param {number} t - current time\n * @param {number} b - start value\n * @param {number} c - change in value\n * @param {number} d - duration\n * @return {number} - calculated value\n */\n function easeOutQuart(t, b, c, d) {\n t /= d;\n t--;\n return -c * (t * t * t * t - 1) + b;\n }\n\n /**\n * Merge two object\n *\n * @param {object} obj1\n * @param {object} obj2\n * @return {object} merged object\n */\n function mergeObject(obj1, obj2) {\n var obj3 = {};\n Object.keys(obj1).forEach(function (propertyName) {\n obj3[propertyName] = obj1[propertyName];\n });\n\n Object.keys(obj2).forEach(function (propertyName) {\n obj3[propertyName] = obj2[propertyName];\n });\n return obj3;\n };\n\n /**\n * Converts camel case to kebab case\n * @param {string} val the value to be converted\n * @return {string} the converted value\n */\n function kebabCase(val) {\n return val.replace(/([A-Z])/g, function ($1) {\n return '-' + $1.toLowerCase();\n });\n };\n\n /**\n * Count a number of item scrolled top\n * @param {Window|HTMLElement} container\n * @return {number}\n */\n function countScrollTop(container) {\n if (container instanceof HTMLElement) {\n return container.scrollTop;\n }\n return container.pageYOffset;\n };\n\n /**\n * MoveTo Constructor\n * @param {object} options Options\n * @param {object} easeFunctions Custom ease functions\n */\n function MoveTo() {var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};var easeFunctions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n this.options = mergeObject(defaults, options);\n this.easeFunctions = mergeObject({ easeOutQuart: easeOutQuart }, easeFunctions);\n }\n\n /**\n * Register a dom element as trigger\n * @param {HTMLElement} dom Dom trigger element\n * @param {function} callback Callback function\n * @return {function|void} unregister function\n */\n MoveTo.prototype.registerTrigger = function (dom, callback) {var _this = this;\n if (!dom) {\n return;\n }\n\n var href = dom.getAttribute('href') || dom.getAttribute('data-target');\n // The element to be scrolled\n var target = href && href !== '#' ?\n document.getElementById(href.substring(1)) :\n document.body;\n var options = mergeObject(this.options, _getOptionsFromTriggerDom(dom, this.options));\n\n if (typeof callback === 'function') {\n options.callback = callback;\n }\n\n var listener = function listener(e) {\n e.preventDefault();\n _this.move(target, options);\n };\n\n dom.addEventListener('click', listener, false);\n\n return function () {return dom.removeEventListener('click', listener, false);};\n };\n\n /**\n * Move\n * Scrolls to given element by using easeOutQuart function\n * @param {HTMLElement|number} target Target element to be scrolled or target position\n * @param {object} options Custom options\n */\n MoveTo.prototype.move = function (target) {var _this2 = this;var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n if (target !== 0 && !target) {\n return;\n }\n\n options = mergeObject(this.options, options);\n\n var distance = typeof target === 'number' ? target : target.getBoundingClientRect().top;\n var from = countScrollTop(options.container);\n var startTime = null;\n var lastYOffset = void 0;\n distance -= options.tolerance;\n\n // rAF loop\n var loop = function loop(currentTime) {\n var currentYOffset = countScrollTop(_this2.options.container);\n\n if (!startTime) {\n // To starts time from 1, we subtracted 1 from current time\n // If time starts from 1 The first loop will not do anything,\n // because easing value will be zero\n startTime = currentTime - 1;\n }\n\n var timeElapsed = currentTime - startTime;\n\n if (lastYOffset) {\n if (\n distance > 0 && lastYOffset > currentYOffset ||\n distance < 0 && lastYOffset < currentYOffset)\n {\n return options.callback(target);\n }\n }\n lastYOffset = currentYOffset;\n\n var val = _this2.easeFunctions[options.easing](timeElapsed, from, distance, options.duration);\n\n options.container.scroll(0, val);\n\n if (timeElapsed < options.duration) {\n window.requestAnimationFrame(loop);\n } else {\n options.container.scroll(0, distance + from);\n options.callback(target);\n }\n };\n\n window.requestAnimationFrame(loop);\n };\n\n /**\n * Adds custom ease function\n * @param {string} name Ease function name\n * @param {function} fn Ease function\n */\n MoveTo.prototype.addEaseFunction = function (name, fn) {\n this.easeFunctions[name] = fn;\n };\n\n /**\n * Returns options which created from trigger dom element\n * @param {HTMLElement} dom Trigger dom element\n * @param {object} options The instance's options\n * @return {object} The options which created from trigger dom element\n */\n function _getOptionsFromTriggerDom(dom, options) {\n var domOptions = {};\n\n Object.keys(options).forEach(function (key) {\n var value = dom.getAttribute('data-mt-' + kebabCase(key));\n if (value) {\n domOptions[key] = isNaN(value) ? value : parseInt(value, 10);\n }\n });\n return domOptions;\n }\n\n return MoveTo;\n}();\n\nif (typeof module !== 'undefined') {\n module.exports = MoveTo;\n} else {\n window.MoveTo = MoveTo;\n}"],"mappings":"AAEA;;;;;;;;;;;ACKA;;;;;;;;;;;;;;;;;;;;;;;;ACqEA;;;;;;;;;;;;;;AChCA;;;;;;;;;;;;;;;;;;;;;AC6KA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA;ACjQA;;AAMA;AACA;;;;;;;AAOA;;;;;;;;;AAeA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC0DA;;;;;;;;;;;;;;;;;;;;;;;;ACtNA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuTA;ACjMA;;;;;;;;;;;;;;;;;;;;ACvHA;;;;;;AC4JA;;;;;;;;;;;AChKA;;;;;;;;;;;;;;;ACgBA;;;;;;ACRA","sourceRoot":""}
\ No newline at end of file
+{"version":3,"file":"bundle.16.js","sources":["webpack:///./docs/Examples/next/Actions.md","webpack:///./packages/next/node_modules/classnames/index.js","webpack:///./packages/printer/src/index.js","webpack:///./packages/next/src/utils.js","webpack:///./packages/next/src/form.js","webpack:///./packages/next/src/fields/array.js","webpack:///./packages/next/src/fields/cards.js","webpack:///./packages/next/src/fields/table.js","webpack:///./packages/next/src/fields/password.js","webpack:///./packages/next/src/components/formButtonGroup.js","webpack:///./packages/next/src/components/button.js","webpack:///./packages/next/src/components/layout.js","webpack:///./packages/next/src/index.js","webpack:///./node_modules/_tslib@1.9.3@tslib/tslib.es6.js","webpack:///./packages/next/node_modules/moveto/dist/moveTo.js"],"sourcesContent":["\"use strict\";\n\nvar React = require('/Users/wangzhili/uform/node_modules/_react@16.8.6@react/index.js');\n\nvar ReactDOM = require('/Users/wangzhili/uform/node_modules/_react-dom@16.8.6@react-dom/index.js');\n\nvar ReactCodeSnippet = require('/Users/wangzhili/uform/node_modules/_react-code-snippet@0.6.13@react-code-snippet/lib/index.js');\n\nvar ReactPropsTable = require('/Users/wangzhili/uform/node_modules/_react-props-table@0.1.3@react-props-table/lib/index.js');\n\nvar __DEFINE__ = function __DEFINE__(fn) {\n var module = {\n exports: {}\n };\n fn(module, module.exports);\n var component = module.exports.__esModule && module.exports['default'] || module.exports;\n return typeof component === 'function' ? component : function () {\n return React.createElement('div', {}, 'Code snippet should export a component!');\n };\n};\n\nvar Demo_qachl_0 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _operators = require(\"rxjs/operators\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var actions = (0, _next.createFormActions)();\n actions.setFieldState('aa', function (state) {\n //同步调用会出错\n state.value = '123';\n });\n actions.submit(); //同步调用会出错\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n actions: actions,\n labelCol: 6,\n wrapperCol: 4,\n onSubmit: function onSubmit(v) {\n return alert(JSON.stringify(v));\n }\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aa\",\n type: \"string\",\n required: true,\n title: \"AA\"\n }), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 6\n }, _react[\"default\"].createElement(_next2.Button, {\n onClick: function onClick() {\n //异步调用没问题\n actions.setFieldState('aa', function (state) {\n state.value = 'hello world';\n });\n actions.submit();\n }\n }, \"\\u4FEE\\u6539AA\\u7684\\u503C\\u5E76\\u63D0\\u4EA4\\u8868\\u5355\"))));\n };\n\n console.log(_react[\"default\"].unstable_ConcurrentMode);\n\n function _default() {\n return _react[\"default\"].createElement(_react[\"default\"].unstable_ConcurrentMode, null, _react[\"default\"].createElement(App, null));\n }\n});\n\nvar Demo_qnztf_1 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _operators = require(\"rxjs/operators\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var actions = (0, _next.createAsyncFormActions)();\n actions.setFieldState('aa', function (state) {\n //同步调用没问题\n state.value = '123';\n });\n actions.submit(); //同步调用没问题\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n actions: actions,\n labelCol: 6,\n wrapperCol: 4,\n onSubmit: function onSubmit(v) {\n return alert(JSON.stringify(v));\n }\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aa\",\n type: \"string\",\n required: true,\n title: \"AA\"\n }), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 6\n }, _react[\"default\"].createElement(_next2.Button, {\n onClick: function onClick() {\n //异步调用没问题\n actions.setFieldState('aa', function (state) {\n state.value = 'hello world';\n });\n actions.submit();\n }\n }, \"\\u4FEE\\u6539AA\\u7684\\u503C\\u5E76\\u63D0\\u4EA4\\u8868\\u5355\"))));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar __MARKDOWN__ = function __MARKDOWN__() {\n return React.createElement(React.Fragment, {}, React.createElement(\"h1\", {\n id: \"内外通讯联动\",\n className: \"react-demo-h1\"\n }, \"内外通讯联动\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"是指 Form 外部想要与 Form 进行通讯的场景，比如调用 Form 的 submit 方法\\n/validate 方法，或者直接设置 Form 某个字段状态的场景\")), React.createElement(\"h3\", {\n id: \"使用-createformactions-做通讯\",\n className: \"react-demo-h3\"\n }, \"使用 createFormActions 做通讯\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"使用 createFormActions 所创建出来的所有表单操作方法都是同步调用的方式，但是它\\n是必须等待组件初始化完成之后才能调用，否则会报错不过通常我们调用它的方法都是在\\n某个异步事件里调用，所以恰好错开了组件渲染过程的时机，在异步事件内调用就不会报\\n错\")), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormPath,\\n FormBlock,\\n FormLayout,\\n createFormActions\\n} from '@uform/next'\\nimport { filter, withLatestFrom, map, debounceTime } from 'rxjs/operators'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst actions = createFormActions()\\n\\nactions.setFieldState('aa', state => { //同步调用会出错\\n state.value = '123'\\n})\\nactions.submit() //同步调用会出错\\n\\nconst App = () => (\\n \\n alert(JSON.stringify(v))}\\n >\\n \\n \\n \\n \\n \\n \\n)\\nconsole.log(React.unstable_ConcurrentMode)\\nReactDOM.render(\\n \\n \\n ,\\n document.getElementById('root')\\n)\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_qachl_0, {})), React.createElement(\"h3\", {\n id: \"使用-createasyncformactions-做通讯\",\n className: \"react-demo-h3\"\n }, \"使用 createAsyncFormActions 做通讯\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"如果用户不想关心 actions 与组件初始化时机的问题，那么可以使用\\ncreateAsyncFormActions，每个被创建出来的方法都将返回一个 Promise 对象这样可以\\n保证方法一定是会在组件初始化完成之后才会调用，也不会报错\")), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormPath,\\n FormBlock,\\n FormLayout,\\n createAsyncFormActions\\n} from '@uform/next'\\nimport { filter, withLatestFrom, map, debounceTime } from 'rxjs/operators'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst actions = createAsyncFormActions()\\n\\nactions.setFieldState('aa', state => {\\n //同步调用没问题\\n state.value = '123'\\n})\\nactions.submit() //同步调用没问题\\n\\nconst App = () => (\\n \\n alert(JSON.stringify(v))}\\n >\\n \\n \\n {\\n //异步调用没问题\\n actions.setFieldState('aa', state => {\\n state.value = 'hello world'\\n })\\n actions.submit()\\n }}\\n >\\n 修改AA的值并提交表单\\n \\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_qnztf_1, {})));\n};\n\n__MARKDOWN__.meta = {\n \"username\": \"zhili.wzl\",\n \"email\": \"wangzhili56@126.com\"\n};\nmodule.exports = __MARKDOWN__;","/*!\n Copyright (c) 2017 Jed Watson.\n Licensed under the MIT License (MIT), see\n http://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = [];\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (!arg) continue;\n\n\t\t\tvar argType = typeof arg;\n\n\t\t\tif (argType === 'string' || argType === 'number') {\n\t\t\t\tclasses.push(arg);\n\t\t\t} else if (Array.isArray(arg) && arg.length) {\n\t\t\t\tvar inner = classNames.apply(null, arg);\n\t\t\t\tif (inner) {\n\t\t\t\t\tclasses.push(inner);\n\t\t\t\t}\n\t\t\t} else if (argType === 'object') {\n\t\t\t\tfor (var key in arg) {\n\t\t\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\t\t\tclasses.push(key);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn classes.join(' ');\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n","import React, { useState } from 'react'\nimport ReactDOM from 'react-dom'\nimport { createFormActions } from '@uform/react'\nimport styled from 'styled-components'\nimport Modal from 'react-modal'\n\nconst Dialog = styled(props => {\n const [visible, setVisible] = useState(true)\n return (\n {\n setVisible(false)\n }}\n >\n {\n setVisible(false)\n }}\n >\n \n \n \n {props.children}\n
\n \n )\n})`\n position: relative;\n margin: 100px;\n padding: 30px;\n height: calc(100% - 200px);\n overflow: auto;\n border: 1px solid #eee;\n background: #fff;\n outline: none;\n .close-btn {\n position: absolute;\n top: 15px;\n right: 10px;\n width: 25px;\n height: 25px;\n cursor: pointer;\n img {\n width: 100%;\n }\n }\n .dialog-content {\n overflow: auto;\n height: 100%;\n }\n`\n\nconst createAlert = (config = {}) => {\n const container = document.createElement('div')\n const unMount = () => {\n ReactDOM.unmountComponentAtNode(container)\n container.parentNode.removeChild(container)\n }\n if (typeof config === 'string' || React.isValidElement(config)) {\n config = {\n content: config\n }\n }\n document.body.appendChild(container)\n ReactDOM.render(\n ,\n container\n )\n}\n\nconst cleanSchema = schema => {\n if (!schema) return\n return {\n type: schema.type,\n 'x-props': schema['x-props'],\n 'x-component': schema['x-component'],\n 'x-index': schema['x-index'],\n 'x-rules': schema['x-rules'],\n maxItems: schema.maxItems,\n minItems: schema.minItems,\n default: schema.default,\n enum: schema.enum,\n title: schema.title,\n required: schema.required,\n\n properties: Object.keys(schema.properties || {}).reduce((buf, key) => {\n buf[key] = cleanSchema(schema.properties[key])\n return buf\n }, {}),\n items: cleanSchema(schema.items)\n }\n}\n\nconst printSchema = schema => {\n return JSON.stringify(cleanSchema(schema), null, 2)\n}\n\nexport default class extends React.Component {\n actions = createFormActions()\n\n onClickHandler = async e => {\n e.preventDefault()\n const schema = await this.actions.getSchema('')\n createAlert(\n \n {printSchema(schema)}\n
\n )\n }\n\n render() {\n const { children, className } = this.props\n if (children && children.props && children.props.actions) {\n this.actions = children.props.actions\n }\n return (\n \n {React.cloneElement(children, {\n actions: this.actions\n })}\n
\n Print JSON Schema\n \n \n {!value ? 'N/A' : value}\n {props.addonTextAfter ? ' ' + props.addonTextAfter : ''}\n {props.addonAfter ? ' ' + props.addonAfter : ''}\n
\n )\n})`\n height: 28px;\n line-height: 28px;\n vertical-align: middle;\n font-size: 13px;\n color: #333;\n &.small {\n height: 20px;\n line-height: 20px;\n }\n &.large {\n height: 40px;\n line-height: 40px;\n }\n`\n\nexport const acceptEnum = component => {\n return ({ dataSource, ...others }) => {\n if (dataSource) {\n return React.createElement(Select, { dataSource, ...others })\n } else {\n return React.createElement(component, others)\n }\n }\n}\n\nexport const mapStyledProps = (props, { loading, size }) => {\n if (loading) {\n props.state = props.state || 'loading'\n }\n if (size) {\n props.size = size\n }\n}\n\nexport const mapTextComponent = (Target, props, { editable, name }) => {\n if (editable !== undefined) {\n if (isFn(editable)) {\n if (!editable(name)) {\n return Text\n }\n } else if (editable === false) {\n return Text\n }\n }\n return Target\n}\n\nexport const compose = (...args) => {\n return (payload, ...extra) => {\n return args.reduce((buf, fn) => {\n return buf !== undefined ? fn(buf, ...extra) : fn(payload, ...extra)\n }, payload)\n }\n}\n\nexport const moveTo = element => {\n if (!element) return\n if (element.scrollIntoView) {\n element.scrollIntoView({\n behavior: 'smooth',\n inline: 'start',\n block: 'start'\n })\n } else {\n new MoveTo().move(element.getBoundingClientRect().top)\n }\n}\n","import React from 'react'\nimport { registerFormWrapper, registerFieldMiddleware } from '@uform/react'\nimport classNames from 'classnames'\nimport { ConfigProvider, Balloon, Icon } from '@alifd/next'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport LOCALE from './locale'\nimport styled from 'styled-components'\nimport { isFn, moveTo } from './utils'\n/**\n * 轻量级Next Form，不包含任何数据管理能力\n *\n */\n\nexport const {\n Provider: FormProvider,\n Consumer: FormConsumer\n} = React.createContext()\n\nconst normalizeCol = col => {\n return typeof col === 'object' ? col : { span: col }\n}\n\nconst getParentNode = (node, selector) => {\n if (!node || (node && !node.matches)) return\n if (node.matches(selector)) return node\n else {\n return getParentNode(node.parentNode || node.parentElement, selector)\n }\n}\n\nexport const FormItem = styled(\n class FormItem extends React.Component {\n static defaultProps = {\n prefix: 'next-'\n }\n\n getItemLabel() {\n const {\n id,\n required,\n label,\n labelCol,\n wrapperCol,\n prefix,\n extra,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n isTableColItem\n } = this.props\n\n if (!label || isTableColItem) {\n return null\n }\n\n const ele = (\n \n )\n\n const cls = classNames({\n [`${prefix}form-item-label`]: true,\n [`${prefix}left`]: labelTextAlign === 'left'\n })\n\n if ((wrapperCol || labelCol) && labelAlign !== 'top') {\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n \n )\n }\n\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n
\n )\n }\n\n getItemWrapper() {\n const {\n labelCol,\n wrapperCol,\n children,\n extra,\n label,\n labelAlign,\n help,\n size,\n prefix,\n noMinHeight,\n isTableColItem\n } = this.props\n\n const message = (\n \n {help && {help}
}\n {!help && extra && extra.length <= 20 && (\n {extra}
\n )}\n \n )\n if (\n (wrapperCol || labelCol) &&\n labelAlign !== 'top' &&\n !isTableColItem &&\n label\n ) {\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n \n )\n }\n\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n
\n )\n }\n\n renderHelper() {\n return (\n }\n >\n {this.props.extra}\n \n )\n }\n\n render() {\n const {\n className,\n labelAlign,\n labelTextAlign,\n style,\n prefix,\n wrapperCol,\n labelCol,\n size,\n help,\n extra,\n noMinHeight,\n isTableColItem,\n validateState,\n autoAddColon,\n required,\n type,\n schema,\n ...others\n } = this.props\n\n const itemClassName = classNames({\n [`${prefix}form-item`]: true,\n [`${prefix}${labelAlign}`]: labelAlign,\n [`has-${validateState}`]: !!validateState,\n [`${prefix}${size}`]: !!size,\n [`${className}`]: !!className,\n [`field-${type}`]: !!type\n })\n\n // 垂直模式并且左对齐才用到\n const Tag = (wrapperCol || labelCol) && labelAlign !== 'top' ? Row : 'div'\n const label = labelAlign === 'inset' ? null : this.getItemLabel()\n\n return (\n \n {label}\n {this.getItemWrapper()}\n \n )\n }\n }\n)`\n margin-bottom: 4px !important;\n &.field-table {\n .next-form-item-control {\n overflow: auto;\n }\n }\n .next-form-item-msg {\n &.next-form-item-space {\n min-height: 20px;\n .next-form-item-help,\n .next-form-item-extra {\n margin-top: 0;\n }\n }\n }\n .next-form-item-extra {\n color: #888;\n font-size: 12px;\n line-height: 1.7;\n }\n`\n\nconst toArr = val => (Array.isArray(val) ? val : val ? [val] : [])\n\nregisterFormWrapper(OriginForm => {\n OriginForm = styled(OriginForm)`\n &.next-inline {\n display: flex;\n .rs-uform-content {\n margin-right: 15px;\n }\n }\n .next-radio-group,\n .next-checkbox-group {\n line-height: 28px;\n & > label {\n margin-right: 8px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 20px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 40px;\n }\n }\n .next-card-head {\n background: none;\n }\n .next-rating-medium {\n min-height: 28px;\n line-height: 28px;\n }\n .next-rating-small {\n min-height: 20px;\n line-height: 20px;\n }\n .next-rating-large {\n min-height: 40px;\n line-height: 40px;\n }\n `\n\n return ConfigProvider.config(\n class Form extends React.Component {\n static defaultProps = {\n component: 'form',\n prefix: 'next-',\n size: 'medium',\n labelAlign: 'left',\n locale: LOCALE,\n autoAddColon: true\n }\n\n static displayName = 'SchemaForm'\n\n FormRef = React.createRef()\n\n validateFailedHandler(onValidateFailed) {\n return (...args) => {\n if (isFn(onValidateFailed)) {\n onValidateFailed(...args)\n }\n const container = this.FormRef.current\n if (container) {\n const errors = container.querySelectorAll('.next-form-item-help')\n if (errors && errors.length) {\n const node = getParentNode(errors[0], '.next-form-item')\n if (node) {\n moveTo(node)\n }\n }\n }\n }\n }\n\n render() {\n const {\n className,\n inline,\n size,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n children,\n component,\n labelCol,\n wrapperCol,\n getErrorScrollOffset,\n errorScrollToElement,\n style,\n prefix,\n ...others\n } = this.props\n const formClassName = classNames({\n [`${prefix}form`]: true,\n [`${prefix}inline`]: inline, // 内联\n [`${prefix}${size}`]: size,\n [className]: !!className\n })\n return (\n \n \n {children}\n \n \n )\n }\n }\n )\n})\n\nconst isTableColItem = (path, getSchema) => {\n const schema = getSchema(path)\n return schema && schema.type === 'array' && schema['x-component'] === 'table'\n}\n\nregisterFieldMiddleware(Field => {\n return props => {\n const { name, editable, errors, path, schema, getSchema, required } = props\n if (path.length === 0) return React.createElement(Field, props) // 根节点是不需要包FormItem的\n return React.createElement(\n FormConsumer,\n {},\n ({\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n size,\n autoAddColon\n }) => {\n return React.createElement(\n FormItem,\n {\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n autoAddColon,\n size,\n ...schema['x-item-props'],\n label: schema.title,\n noMinHeight: schema.type === 'object' && !schema['x-component'],\n isTableColItem: isTableColItem(\n path.slice(0, path.length - 2),\n getSchema\n ),\n type: schema['x-component'] || schema['type'],\n id: name,\n validateState: toArr(errors).length ? 'error' : undefined,\n required: editable === false ? false : required,\n extra: schema.description,\n help:\n toArr(errors).join(' , ') ||\n (schema['x-item-props'] && schema['x-item-props'].help)\n },\n React.createElement(Field, props)\n )\n }\n )\n }\n})\n","import React from 'react'\nimport { registerFormField, createArrayField } from '@uform/react'\nimport { Button, Icon } from '@alifd/next'\nimport styled from 'styled-components'\n\nexport const CircleButton = styled.div.attrs({ className: 'cricle-btn' })`\n ${props =>\n !props.hasText\n ? `width:30px;\n height:30px;`\n : ''}\n margin-right:10px;\n border-radius: ${props => (!props.hasText ? '100px' : 'none')};\n border: ${props => (!props.hasText ? '1px solid #eee' : 'none')};\n margin-bottom:20px;\n cursor:pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 1.3;\n ${props =>\n !props.hasText\n ? `&:hover{\n background:#f7f4f4;\n }`\n : ''}\n .next-icon{\n display:flex;\n align-items:'center'\n }\n .op-name{\n margin-left:3px;\n }\n}\n`\nexport const ArrayField = createArrayField({\n CircleButton,\n TextButton: props => (\n \n ),\n AddIcon: () => ,\n RemoveIcon: () => (\n \n ),\n MoveDownIcon: () => (\n \n ),\n MoveUpIcon: () => (\n \n )\n})\n\nregisterFormField(\n 'array',\n styled(\n class extends ArrayField {\n render() {\n const { className, name, schema, value, renderField } = this.props\n const style = (schema['x-props'] && schema['x-props'].style) || {}\n return (\n \n {value.map((item, index) => {\n return (\n \n
\n {index + 1}\n
\n
{renderField(index)}
\n
\n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n
\n {toArr(value).map((item, index) => {\n return (\n
\n {index + 1}. {title || schema.title}\n \n }\n className='card-list'\n key={index}\n contentHeight='auto'\n extra={this.renderOperations(item, index)}\n >\n {renderField(index)}\n \n )\n })}\n {value.length === 0 && this.renderEmpty(title)}\n \n {value.length > 0 && this.renderAddition()}\n
\n \n {isFn(col.cell)\n ? col.cell(\n record ? record[col.dataIndex] : undefined,\n rowIndex,\n record\n )\n : record\n ? record[col.dataIndex]\n : undefined}\n
\n )\n }\n\n renderTable(columns, dataSource) {\n return (\n \n
\n \n {columns.map((col, index) => {\n return \n })}\n \n \n \n {columns.map((col, index) => {\n return (\n | \n {col.title} \n | \n )\n })}\n
\n \n \n {dataSource.map((record, rowIndex) => {\n return (\n \n {columns.map((col, colIndex) => {\n return (\n | \n {this.renderCell({\n record,\n col,\n rowIndex,\n colIndex\n })}\n | \n )\n })}\n
\n )\n })}\n {this.renderPlacehodler(dataSource, columns)}\n \n
\n
\n | \n \n | \n
\n )\n }\n }\n\n getColumns(children) {\n const columns = []\n React.Children.forEach(children, child => {\n if (React.isValidElement(child)) {\n if (\n child.type === Column ||\n child.type.displayName === '@schema-table-column'\n ) {\n columns.push(child.props)\n }\n }\n })\n\n return columns\n }\n\n render() {\n const columns = this.getColumns(this.props.children)\n const dataSource = toArr(this.props.dataSource)\n return (\n \n
\n
\n {this.renderTable(columns, dataSource)}\n
\n
\n
\n
\n {Object.keys(\n (schema.items && schema.items.properties) || {}\n ).reduce((buf, key) => {\n const itemSchema = schema.items.properties[key]\n const filter = this.createFilter(key, itemSchema)\n const res = filter(\n () => {\n return buf.concat(\n {\n return renderField([index, key])\n }}\n />\n )\n },\n () => {\n return buf\n }\n )\n return res\n }, [])}\n {additionFilter(() => {\n return (\n {\n return (\n \n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n )\n }}\n />\n )\n })}\n
\n {this.renderAddition()}\n
\n \n {checkStrength && this.renderStrength()}\n
\n )\n }\n }\n)`\n .next-input {\n width: 100%;\n position: relative;\n &.input-password input {\n font-size: 16px;\n letter-spacing: 2px;\n }\n input {\n padding-right: 25px;\n }\n .eye {\n position: absolute;\n height: 20px;\n right: 5px;\n top: 50%;\n transform: translate(0, -50%);\n opacity: 0.3;\n cursor: pointer;\n transition: all 0.15s ease-in-out;\n &:hover {\n opacity: 0.6;\n }\n }\n }\n .password-strength-wrapper {\n background: #e0e0e0;\n margin-bottom: 3px;\n position: relative;\n .div {\n position: absolute;\n z-index: 1;\n height: 8px;\n top: 0;\n background: #fff;\n width: 1px;\n transform: translate(-50%, 0);\n }\n .div-1 {\n left: 20%;\n }\n .div-2 {\n left: 40%;\n }\n .div-3 {\n left: 60%;\n }\n .div-4 {\n left: 80%;\n }\n .password-strength-bar {\n position: relative;\n background-image: -webkit-linear-gradient(left, #ff5500, #ff9300);\n transition: all 0.35s ease-in-out;\n height: 8px;\n width: 100%;\n margin-top: 5px;\n }\n }\n`\n\nregisterFormField('password', connect()(Password))\n","import React, { Component } from 'react'\nimport ReactDOM from 'react-dom'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport { FormConsumer } from '../form'\nimport Sticky from 'react-stikky'\nimport cls from 'classnames'\nimport styled from 'styled-components'\n\nconst getAlign = align => {\n if (align === 'start' || align === 'end') return align\n if (align === 'left' || align === 'top') return 'flex-start'\n if (align === 'right' || align === 'bottom') return 'flex-end'\n return align\n}\n\nconst isElementInViewport = (rect, { offset = 0, threshold = 0 } = {}) => {\n const { top, right, bottom, left, width, height } = rect\n const intersection = {\n t: bottom,\n r: window.innerWidth - left,\n b: window.innerHeight - top,\n l: right\n }\n\n const elementThreshold = {\n x: threshold * width,\n y: threshold * height\n }\n\n return (\n intersection.t >= (offset.top || offset + elementThreshold.y) &&\n intersection.r >= (offset.right || offset + elementThreshold.x) &&\n intersection.b >= (offset.bottom || offset + elementThreshold.y) &&\n intersection.l >= (offset.left || offset + elementThreshold.x)\n )\n}\n\nexport const FormButtonGroup = styled(\n class FormButtonGroup extends Component {\n static defaultProps = {\n span: 24,\n zIndex: 100\n }\n\n renderChildren() {\n const { children, itemStyle, offset, span } = this.props\n return (\n \n
\n \n \n \n {children}\n
\n \n \n
\n
\n
\n {({ inline, FormRef } = {}) => {\n if (!FormRef) return\n return (\n \n \n {content}\n
\n \n )\n }}\n \n
\n {children.reduce((buf, child, key) => {\n return child\n ? buf.concat(\n \n {child}\n \n )\n : buf\n }, [])}\n
\n )\n }\n\n render() {\n const { title } = this.props\n if (title) {\n return this.renderFormItem(this.renderGrid())\n } else {\n return this.renderGrid()\n }\n }\n }\n)\n\nexport const FormCard = createVirtualBox(\n 'card',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 30px;\n .next-card-body {\n padding-top: 30px;\n padding-bottom: 0 !important;\n }\n `\n)\n\nexport const FormBlock = createVirtualBox(\n 'block',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 0px;\n .next-card-body {\n padding-top: 20px;\n padding-bottom: 0 !important;\n }\n &.next-card {\n border: none;\n padding: 0 15px;\n padding-bottom: 15px;\n }\n `\n)\n","import './form'\nimport './fields/string'\nimport './fields/number'\nimport './fields/boolean'\nimport './fields/date'\nimport './fields/time'\nimport './fields/range'\nimport './fields/upload'\nimport './fields/checkbox'\nimport './fields/radio'\nimport './fields/rating'\nimport './fields/transfer'\nimport './fields/array'\nimport './fields/cards'\nimport './fields/table'\nimport './fields/password'\nimport { mapStyledProps, mapTextComponent } from './utils'\nimport { SchemaForm } from '@uform/react'\nexport * from '@uform/react'\nexport * from './components/formButtonGroup'\nexport * from './components/button'\nexport * from './components/layout'\nexport { mapStyledProps, mapTextComponent }\nexport default SchemaForm\n","/*! *****************************************************************************\r\nCopyright (c) Microsoft Corporation. All rights reserved.\r\nLicensed under the Apache License, Version 2.0 (the \"License\"); you may not use\r\nthis file except in compliance with the License. You may obtain a copy of the\r\nLicense at http://www.apache.org/licenses/LICENSE-2.0\r\n\r\nTHIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\nKIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED\r\nWARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,\r\nMERCHANTABLITY OR NON-INFRINGEMENT.\r\n\r\nSee the Apache Version 2.0 License for specific language governing permissions\r\nand limitations under the License.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)\r\n t[p[i]] = s[p[i]];\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (_) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport function __exportStar(m, exports) {\r\n for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];\r\n}\r\n\r\nexport function __values(o) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator], i = 0;\r\n if (m) return m.call(o);\r\n return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];\r\n result.default = mod;\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n","/*!\n * MoveTo - A lightweight scroll animation javascript library without any dependency.\n * Version 1.8.0 (14-01-2019 13:15)\n * Licensed under MIT\n * Copyright 2019 Hasan Aydoğdu \n */\n\n'use strict';\nvar MoveTo = function () {\n /**\n * Defaults\n * @type {object}\n */\n var defaults = {\n tolerance: 0,\n duration: 800,\n easing: 'easeOutQuart',\n container: window,\n callback: function callback() {} };\n\n\n /**\n * easeOutQuart Easing Function\n * @param {number} t - current time\n * @param {number} b - start value\n * @param {number} c - change in value\n * @param {number} d - duration\n * @return {number} - calculated value\n */\n function easeOutQuart(t, b, c, d) {\n t /= d;\n t--;\n return -c * (t * t * t * t - 1) + b;\n }\n\n /**\n * Merge two object\n *\n * @param {object} obj1\n * @param {object} obj2\n * @return {object} merged object\n */\n function mergeObject(obj1, obj2) {\n var obj3 = {};\n Object.keys(obj1).forEach(function (propertyName) {\n obj3[propertyName] = obj1[propertyName];\n });\n\n Object.keys(obj2).forEach(function (propertyName) {\n obj3[propertyName] = obj2[propertyName];\n });\n return obj3;\n };\n\n /**\n * Converts camel case to kebab case\n * @param {string} val the value to be converted\n * @return {string} the converted value\n */\n function kebabCase(val) {\n return val.replace(/([A-Z])/g, function ($1) {\n return '-' + $1.toLowerCase();\n });\n };\n\n /**\n * Count a number of item scrolled top\n * @param {Window|HTMLElement} container\n * @return {number}\n */\n function countScrollTop(container) {\n if (container instanceof HTMLElement) {\n return container.scrollTop;\n }\n return container.pageYOffset;\n };\n\n /**\n * MoveTo Constructor\n * @param {object} options Options\n * @param {object} easeFunctions Custom ease functions\n */\n function MoveTo() {var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};var easeFunctions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n this.options = mergeObject(defaults, options);\n this.easeFunctions = mergeObject({ easeOutQuart: easeOutQuart }, easeFunctions);\n }\n\n /**\n * Register a dom element as trigger\n * @param {HTMLElement} dom Dom trigger element\n * @param {function} callback Callback function\n * @return {function|void} unregister function\n */\n MoveTo.prototype.registerTrigger = function (dom, callback) {var _this = this;\n if (!dom) {\n return;\n }\n\n var href = dom.getAttribute('href') || dom.getAttribute('data-target');\n // The element to be scrolled\n var target = href && href !== '#' ?\n document.getElementById(href.substring(1)) :\n document.body;\n var options = mergeObject(this.options, _getOptionsFromTriggerDom(dom, this.options));\n\n if (typeof callback === 'function') {\n options.callback = callback;\n }\n\n var listener = function listener(e) {\n e.preventDefault();\n _this.move(target, options);\n };\n\n dom.addEventListener('click', listener, false);\n\n return function () {return dom.removeEventListener('click', listener, false);};\n };\n\n /**\n * Move\n * Scrolls to given element by using easeOutQuart function\n * @param {HTMLElement|number} target Target element to be scrolled or target position\n * @param {object} options Custom options\n */\n MoveTo.prototype.move = function (target) {var _this2 = this;var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n if (target !== 0 && !target) {\n return;\n }\n\n options = mergeObject(this.options, options);\n\n var distance = typeof target === 'number' ? target : target.getBoundingClientRect().top;\n var from = countScrollTop(options.container);\n var startTime = null;\n var lastYOffset = void 0;\n distance -= options.tolerance;\n\n // rAF loop\n var loop = function loop(currentTime) {\n var currentYOffset = countScrollTop(_this2.options.container);\n\n if (!startTime) {\n // To starts time from 1, we subtracted 1 from current time\n // If time starts from 1 The first loop will not do anything,\n // because easing value will be zero\n startTime = currentTime - 1;\n }\n\n var timeElapsed = currentTime - startTime;\n\n if (lastYOffset) {\n if (\n distance > 0 && lastYOffset > currentYOffset ||\n distance < 0 && lastYOffset < currentYOffset)\n {\n return options.callback(target);\n }\n }\n lastYOffset = currentYOffset;\n\n var val = _this2.easeFunctions[options.easing](timeElapsed, from, distance, options.duration);\n\n options.container.scroll(0, val);\n\n if (timeElapsed < options.duration) {\n window.requestAnimationFrame(loop);\n } else {\n options.container.scroll(0, distance + from);\n options.callback(target);\n }\n };\n\n window.requestAnimationFrame(loop);\n };\n\n /**\n * Adds custom ease function\n * @param {string} name Ease function name\n * @param {function} fn Ease function\n */\n MoveTo.prototype.addEaseFunction = function (name, fn) {\n this.easeFunctions[name] = fn;\n };\n\n /**\n * Returns options which created from trigger dom element\n * @param {HTMLElement} dom Trigger dom element\n * @param {object} options The instance's options\n * @return {object} The options which created from trigger dom element\n */\n function _getOptionsFromTriggerDom(dom, options) {\n var domOptions = {};\n\n Object.keys(options).forEach(function (key) {\n var value = dom.getAttribute('data-mt-' + kebabCase(key));\n if (value) {\n domOptions[key] = isNaN(value) ? value : parseInt(value, 10);\n }\n });\n return domOptions;\n }\n\n return MoveTo;\n}();\n\nif (typeof module !== 'undefined') {\n module.exports = MoveTo;\n} else {\n window.MoveTo = MoveTo;\n}"],"mappings":"AAEA;;;;;;;;;;;ACKA;;;;;;;;;;;;;;;;;;;;;;;;ACqEA;;;;;;;;;;;;;;AChCA;;;;;;;;;;;;;;;;;;;;;AC6KA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA;ACjQA;;AAMA;AACA;;;;;;;AAOA;;;;;;;;;AAeA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC0DA;;;;;;;;;;;;;;;;;;;;;;;;ACtNA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuTA;ACjMA;;;;;;;;;;;;;;;;;;;;ACvHA;;;;;;AC4JA;;;;;;;;;;;AChKA;;;;;;;;;;;;;;;ACgBA;;;;;;ACRA","sourceRoot":""}
\ No newline at end of file
diff --git a/packages/docs/bundle.17.js.map b/packages/docs/bundle.17.js.map
index 4cc7c035305..e7d727f1d64 100644
--- a/packages/docs/bundle.17.js.map
+++ b/packages/docs/bundle.17.js.map
@@ -1 +1 @@
-{"version":3,"file":"bundle.17.js","sources":["webpack:///./docs/Examples/next/Validation.md","webpack:///./packages/next/node_modules/classnames/index.js","webpack:///./packages/printer/src/index.js","webpack:///./packages/next/src/utils.js","webpack:///./packages/next/src/form.js","webpack:///./packages/next/src/fields/array.js","webpack:///./packages/next/src/fields/cards.js","webpack:///./packages/next/src/fields/table.js","webpack:///./packages/next/src/fields/password.js","webpack:///./packages/next/src/components/formButtonGroup.js","webpack:///./packages/next/src/components/button.js","webpack:///./packages/next/src/components/layout.js","webpack:///./packages/next/src/index.js","webpack:///./node_modules/_tslib@1.9.3@tslib/tslib.es6.js","webpack:///./packages/next/node_modules/moveto/dist/moveTo.js"],"sourcesContent":["\"use strict\";\n\nvar React = require('/Users/wangzhili/uform/node_modules/_react@16.8.6@react/index.js');\n\nvar ReactDOM = require('/Users/wangzhili/uform/node_modules/_react-dom@16.8.6@react-dom/index.js');\n\nvar ReactCodeSnippet = require('/Users/wangzhili/uform/node_modules/_react-code-snippet@0.6.13@react-code-snippet/lib/index.js');\n\nvar ReactPropsTable = require('/Users/wangzhili/uform/node_modules/_react-props-table@0.1.3@react-props-table/lib/index.js');\n\nvar __DEFINE__ = function __DEFINE__(fn) {\n var module = {\n exports: {}\n };\n fn(module, module.exports);\n var component = module.exports.__esModule && module.exports['default'] || module.exports;\n return typeof component === 'function' ? component : function () {\n return React.createElement('div', {}, 'Code snippet should export a component!');\n };\n};\n\nvar Demo_zppxf_0 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _operators = require(\"rxjs/operators\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n labelCol: 6,\n wrapperCol: 6\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"name\",\n title: \"\\u59D3\\u540D\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"nickname\",\n title: \"\\u6635\\u79F0\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"date\",\n name: \"birthday\",\n title: \"\\u751F\\u65E5\",\n description: \"\\u8BD5\\u8BD5\\u9009\\u62E92018-11-30\",\n \"x-rules\": [function (val) {\n return new Promise(function (resolve) {\n setTimeout(function () {\n if (val === '2018-11-30') {\n resolve('不允许输入2018-11-30');\n } else {\n resolve();\n }\n }, 1000);\n });\n }],\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"phone\",\n \"x-rules\": \"phone\",\n title: \"\\u624B\\u673A\\u53F7\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"qq\",\n \"x-rules\": \"qq\",\n title: \"QQ\\u53F7\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"email\",\n \"x-rules\": \"email\",\n title: \"\\u90AE\\u7BB1\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"home\",\n \"x-rules\": \"url\",\n title: \"\\u4E2A\\u4EBA\\u4E3B\\u9875\\u5730\\u5740\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"money\",\n \"x-rules\": \"money\",\n title: \"\\u6708\\u85AA\",\n \"x-props\": {\n placeholder: '¥100,000',\n addonTextAfter: '元'\n },\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"idcard\",\n \"x-rules\": \"idcard\",\n title: \"\\u8EAB\\u4EFD\\u8BC1\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"zip\",\n \"x-rules\": \"zip\",\n title: \"\\u90AE\\u653F\\u7F16\\u7801\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"custom\",\n \"x-rules\": function xRules(val) {\n return new Promise(function (resolve) {\n setTimeout(function () {\n if (val === '123') {\n resolve('不允许输入123');\n } else {\n resolve();\n }\n }, 1000);\n });\n },\n title: \"\\u81EA\\u5B9A\\u4E49\\u6821\\u9A8C\\u89C4\\u5219\",\n required: true\n }), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 6\n }, _react[\"default\"].createElement(_next.Submit, null), _react[\"default\"].createElement(_next.Reset, null))));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_xpqen_1 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _operators = require(\"rxjs/operators\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n labelCol: 6,\n wrapperCol: 6,\n effects: function effects($, _ref) {\n var setFieldState = _ref.setFieldState,\n getFieldState = _ref.getFieldState;\n $('onFieldChange', '*(password,confirm)').subscribe(function (fieldState) {\n var selfName = fieldState.name;\n var selfValue = fieldState.value;\n var otherName = selfName == 'password' ? 'confirm' : 'password';\n var otherValue = getFieldState(otherName, function (state) {\n return state.value;\n });\n setFieldState(otherName, function (state) {\n if (selfValue && otherValue && selfValue !== otherValue) {\n state.errors = '两次密码输入不一致';\n } else {\n state.errors = '';\n }\n });\n setFieldState(selfName, function (state) {\n if (selfValue && otherValue && selfValue !== otherValue) {\n state.errors = '两次密码输入不一致';\n } else {\n state.errors = '';\n }\n });\n });\n }\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"username\",\n title: \"\\u7528\\u6237\\u540D\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"password\",\n name: \"password\",\n title: \"\\u5BC6\\u7801\",\n \"x-props\": {\n checkStrength: true\n },\n description: _react[\"default\"].createElement(\"ul\", null, _react[\"default\"].createElement(\"li\", null, \"1. \\u957F\\u5EA6\\u4E0D\\u5C0F\\u4E8E8\\u4E2A\"), _react[\"default\"].createElement(\"li\", null, \"2. \\u5FC5\\u987B\\u5305\\u542B\\u5927\\u5C0F\\u5199\\u6570\\u5B57\\u7B26\\u53F7\")),\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"password\",\n name: \"confirm\",\n title: \"\\u786E\\u8BA4\\u5BC6\\u7801\",\n \"x-props\": {\n checkStrength: true\n },\n required: true\n }), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 6\n }, _react[\"default\"].createElement(_next.Submit, null), _react[\"default\"].createElement(_next.Reset, null))));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar __MARKDOWN__ = function __MARKDOWN__() {\n return React.createElement(React.Fragment, {}, React.createElement(\"h1\", {\n id: \"校验\",\n className: \"react-demo-h1\"\n }, \"校验\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"校验和联动往往是相辅相成的，联动负责提升用户体验，引导用户一步步的完成数据输入\\n，校验则是阻止用户输入任何非法数据\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"所以，联动规则和校验规则的复杂度都会根据业务场景的复杂度而线性提升，所以，我们\\n需要一个完备的联动校验方案来解决这一个又一个不可避免的业务逻辑呢？\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"同样，还是借助 effects，我们可以方便的来处理各种场景的校验逻辑\")), React.createElement(\"h3\", {\n id: \"简单数据校验\",\n className: \"react-demo-h3\"\n }, \"简单数据校验\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"当前例子涉及基本的字符格式校验与自定义校验\")), React.createElement(\"h4\", {\n id: \"demo-示例\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormPath,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { filter, withLatestFrom, map } from 'rxjs/operators'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n \\n \\n \\n \\n new Promise(resolve => {\\n setTimeout(() => {\\n if (val === '2018-11-30') {\\n resolve('不允许输入2018-11-30')\\n } else {\\n resolve()\\n }\\n }, 1000)\\n })\\n ]}\\n required\\n />\\n \\n \\n \\n \\n \\n \\n \\n \\n new Promise(resolve => {\\n setTimeout(() => {\\n if (val === '123') {\\n resolve('不允许输入123')\\n } else {\\n resolve()\\n }\\n }, 1000)\\n })\\n }\\n title=\\\"自定义校验规则\\\"\\n required\\n />\\n \\n \\n \\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_zppxf_0, {})), React.createElement(\"h3\", {\n id: \"联动数据校验\",\n className: \"react-demo-h3\"\n }, \"联动数据校验\"), React.createElement(\"h4\", {\n id: \"demo-示例-1\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormPath,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { filter, withLatestFrom, map } from 'rxjs/operators'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n {\\n $('onFieldChange', '*(password,confirm)').subscribe(fieldState => {\\n const selfName = fieldState.name\\n const selfValue = fieldState.value\\n const otherName = selfName == 'password' ? 'confirm' : 'password'\\n const otherValue = getFieldState(otherName, state => state.value)\\n setFieldState(otherName, state => {\\n if (selfValue && otherValue && selfValue !== otherValue) {\\n state.errors = '两次密码输入不一致'\\n } else {\\n state.errors = ''\\n }\\n })\\n setFieldState(selfName, state => {\\n if (selfValue && otherValue && selfValue !== otherValue) {\\n state.errors = '两次密码输入不一致'\\n } else {\\n state.errors = ''\\n }\\n })\\n })\\n }}\\n >\\n \\n \\n 1. 长度不小于8个\\n 2. 必须包含大小写数字符号\\n \\n }\\n required\\n />\\n \\n \\n \\n \\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_xpqen_1, {})));\n};\n\n__MARKDOWN__.meta = {\n \"username\": \"zhili.wzl\",\n \"email\": \"wangzhili56@126.com\"\n};\nmodule.exports = __MARKDOWN__;","/*!\n Copyright (c) 2017 Jed Watson.\n Licensed under the MIT License (MIT), see\n http://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = [];\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (!arg) continue;\n\n\t\t\tvar argType = typeof arg;\n\n\t\t\tif (argType === 'string' || argType === 'number') {\n\t\t\t\tclasses.push(arg);\n\t\t\t} else if (Array.isArray(arg) && arg.length) {\n\t\t\t\tvar inner = classNames.apply(null, arg);\n\t\t\t\tif (inner) {\n\t\t\t\t\tclasses.push(inner);\n\t\t\t\t}\n\t\t\t} else if (argType === 'object') {\n\t\t\t\tfor (var key in arg) {\n\t\t\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\t\t\tclasses.push(key);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn classes.join(' ');\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n","import React, { useState } from 'react'\nimport ReactDOM from 'react-dom'\nimport { createFormActions } from '@uform/react'\nimport styled from 'styled-components'\nimport Modal from 'react-modal'\n\nconst Dialog = styled(props => {\n const [visible, setVisible] = useState(true)\n return (\n {\n setVisible(false)\n }}\n >\n {\n setVisible(false)\n }}\n >\n \n \n \n {props.children}\n
\n \n )\n})`\n position: relative;\n margin: 100px;\n padding: 30px;\n height: calc(100% - 200px);\n overflow: auto;\n border: 1px solid #eee;\n background: #fff;\n outline: none;\n .close-btn {\n position: absolute;\n top: 15px;\n right: 10px;\n width: 25px;\n height: 25px;\n cursor: pointer;\n img {\n width: 100%;\n }\n }\n .dialog-content {\n overflow: auto;\n height: 100%;\n }\n`\n\nconst createAlert = (config = {}) => {\n const container = document.createElement('div')\n const unMount = () => {\n ReactDOM.unmountComponentAtNode(container)\n container.parentNode.removeChild(container)\n }\n if (typeof config === 'string' || React.isValidElement(config)) {\n config = {\n content: config\n }\n }\n document.body.appendChild(container)\n ReactDOM.render(\n ,\n container\n )\n}\n\nconst cleanSchema = schema => {\n if (!schema) return\n return {\n type: schema.type,\n 'x-props': schema['x-props'],\n 'x-component': schema['x-component'],\n 'x-index': schema['x-index'],\n 'x-rules': schema['x-rules'],\n maxItems: schema.maxItems,\n minItems: schema.minItems,\n default: schema.default,\n enum: schema.enum,\n title: schema.title,\n required: schema.required,\n\n properties: Object.keys(schema.properties || {}).reduce((buf, key) => {\n buf[key] = cleanSchema(schema.properties[key])\n return buf\n }, {}),\n items: cleanSchema(schema.items)\n }\n}\n\nconst printSchema = schema => {\n return JSON.stringify(cleanSchema(schema), null, 2)\n}\n\nexport default class extends React.Component {\n actions = createFormActions()\n\n onClickHandler = async e => {\n e.preventDefault()\n const schema = await this.actions.getSchema('')\n createAlert(\n \n {printSchema(schema)}\n
\n )\n }\n\n render() {\n const { children, className } = this.props\n if (children && children.props && children.props.actions) {\n this.actions = children.props.actions\n }\n return (\n \n {React.cloneElement(children, {\n actions: this.actions\n })}\n
\n Print JSON Schema\n \n \n {!value ? 'N/A' : value}\n {props.addonTextAfter ? ' ' + props.addonTextAfter : ''}\n {props.addonAfter ? ' ' + props.addonAfter : ''}\n
\n )\n})`\n height: 28px;\n line-height: 28px;\n vertical-align: middle;\n font-size: 13px;\n color: #333;\n &.small {\n height: 20px;\n line-height: 20px;\n }\n &.large {\n height: 40px;\n line-height: 40px;\n }\n`\n\nexport const acceptEnum = component => {\n return ({ dataSource, ...others }) => {\n if (dataSource) {\n return React.createElement(Select, { dataSource, ...others })\n } else {\n return React.createElement(component, others)\n }\n }\n}\n\nexport const mapStyledProps = (props, { loading, size }) => {\n if (loading) {\n props.state = props.state || 'loading'\n }\n if (size) {\n props.size = size\n }\n}\n\nexport const mapTextComponent = (Target, props, { editable, name }) => {\n if (editable !== undefined) {\n if (isFn(editable)) {\n if (!editable(name)) {\n return Text\n }\n } else if (editable === false) {\n return Text\n }\n }\n return Target\n}\n\nexport const compose = (...args) => {\n return (payload, ...extra) => {\n return args.reduce((buf, fn) => {\n return buf !== undefined ? fn(buf, ...extra) : fn(payload, ...extra)\n }, payload)\n }\n}\n\nexport const moveTo = element => {\n if (!element) return\n if (element.scrollIntoView) {\n element.scrollIntoView({\n behavior: 'smooth',\n inline: 'start',\n block: 'start'\n })\n } else {\n new MoveTo().move(element.getBoundingClientRect().top)\n }\n}\n","import React from 'react'\nimport { registerFormWrapper, registerFieldMiddleware } from '@uform/react'\nimport classNames from 'classnames'\nimport { ConfigProvider, Balloon, Icon } from '@alifd/next'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport LOCALE from './locale'\nimport styled from 'styled-components'\nimport { isFn, moveTo } from './utils'\n/**\n * 轻量级Next Form，不包含任何数据管理能力\n *\n */\n\nexport const {\n Provider: FormProvider,\n Consumer: FormConsumer\n} = React.createContext()\n\nconst normalizeCol = col => {\n return typeof col === 'object' ? col : { span: col }\n}\n\nconst getParentNode = (node, selector) => {\n if (!node || (node && !node.matches)) return\n if (node.matches(selector)) return node\n else {\n return getParentNode(node.parentNode || node.parentElement, selector)\n }\n}\n\nexport const FormItem = styled(\n class FormItem extends React.Component {\n static defaultProps = {\n prefix: 'next-'\n }\n\n getItemLabel() {\n const {\n id,\n required,\n label,\n labelCol,\n wrapperCol,\n prefix,\n extra,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n isTableColItem\n } = this.props\n\n if (!label || isTableColItem) {\n return null\n }\n\n const ele = (\n \n )\n\n const cls = classNames({\n [`${prefix}form-item-label`]: true,\n [`${prefix}left`]: labelTextAlign === 'left'\n })\n\n if ((wrapperCol || labelCol) && labelAlign !== 'top') {\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n \n )\n }\n\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n
\n )\n }\n\n getItemWrapper() {\n const {\n labelCol,\n wrapperCol,\n children,\n extra,\n label,\n labelAlign,\n help,\n size,\n prefix,\n noMinHeight,\n isTableColItem\n } = this.props\n\n const message = (\n \n {help && {help}
}\n {!help && extra && extra.length <= 20 && (\n {extra}
\n )}\n \n )\n if (\n (wrapperCol || labelCol) &&\n labelAlign !== 'top' &&\n !isTableColItem &&\n label\n ) {\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n \n )\n }\n\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n
\n )\n }\n\n renderHelper() {\n return (\n }\n >\n {this.props.extra}\n \n )\n }\n\n render() {\n const {\n className,\n labelAlign,\n labelTextAlign,\n style,\n prefix,\n wrapperCol,\n labelCol,\n size,\n help,\n extra,\n noMinHeight,\n isTableColItem,\n validateState,\n autoAddColon,\n required,\n type,\n schema,\n ...others\n } = this.props\n\n const itemClassName = classNames({\n [`${prefix}form-item`]: true,\n [`${prefix}${labelAlign}`]: labelAlign,\n [`has-${validateState}`]: !!validateState,\n [`${prefix}${size}`]: !!size,\n [`${className}`]: !!className,\n [`field-${type}`]: !!type\n })\n\n // 垂直模式并且左对齐才用到\n const Tag = (wrapperCol || labelCol) && labelAlign !== 'top' ? Row : 'div'\n const label = labelAlign === 'inset' ? null : this.getItemLabel()\n\n return (\n \n {label}\n {this.getItemWrapper()}\n \n )\n }\n }\n)`\n margin-bottom: 4px !important;\n &.field-table {\n .next-form-item-control {\n overflow: auto;\n }\n }\n .next-form-item-msg {\n &.next-form-item-space {\n min-height: 20px;\n .next-form-item-help,\n .next-form-item-extra {\n margin-top: 0;\n }\n }\n }\n .next-form-item-extra {\n color: #888;\n font-size: 12px;\n line-height: 1.7;\n }\n`\n\nconst toArr = val => (Array.isArray(val) ? val : val ? [val] : [])\n\nregisterFormWrapper(OriginForm => {\n OriginForm = styled(OriginForm)`\n &.next-inline {\n display: flex;\n .rs-uform-content {\n margin-right: 15px;\n }\n }\n .next-radio-group,\n .next-checkbox-group {\n line-height: 28px;\n & > label {\n margin-right: 8px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 20px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 40px;\n }\n }\n .next-card-head {\n background: none;\n }\n .next-rating-medium {\n min-height: 28px;\n line-height: 28px;\n }\n .next-rating-small {\n min-height: 20px;\n line-height: 20px;\n }\n .next-rating-large {\n min-height: 40px;\n line-height: 40px;\n }\n `\n\n return ConfigProvider.config(\n class Form extends React.Component {\n static defaultProps = {\n component: 'form',\n prefix: 'next-',\n size: 'medium',\n labelAlign: 'left',\n locale: LOCALE,\n autoAddColon: true\n }\n\n static displayName = 'SchemaForm'\n\n FormRef = React.createRef()\n\n validateFailedHandler(onValidateFailed) {\n return (...args) => {\n if (isFn(onValidateFailed)) {\n onValidateFailed(...args)\n }\n const container = this.FormRef.current\n if (container) {\n const errors = container.querySelectorAll('.next-form-item-help')\n if (errors && errors.length) {\n const node = getParentNode(errors[0], '.next-form-item')\n if (node) {\n moveTo(node)\n }\n }\n }\n }\n }\n\n render() {\n const {\n className,\n inline,\n size,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n children,\n component,\n labelCol,\n wrapperCol,\n getErrorScrollOffset,\n errorScrollToElement,\n style,\n prefix,\n ...others\n } = this.props\n const formClassName = classNames({\n [`${prefix}form`]: true,\n [`${prefix}inline`]: inline, // 内联\n [`${prefix}${size}`]: size,\n [className]: !!className\n })\n return (\n \n \n {children}\n \n \n )\n }\n }\n )\n})\n\nconst isTableColItem = (path, getSchema) => {\n const schema = getSchema(path)\n return schema && schema.type === 'array' && schema['x-component'] === 'table'\n}\n\nregisterFieldMiddleware(Field => {\n return props => {\n const { name, editable, errors, path, schema, getSchema, required } = props\n if (path.length === 0) return React.createElement(Field, props) // 根节点是不需要包FormItem的\n return React.createElement(\n FormConsumer,\n {},\n ({\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n size,\n autoAddColon\n }) => {\n return React.createElement(\n FormItem,\n {\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n autoAddColon,\n size,\n ...schema['x-item-props'],\n label: schema.title,\n noMinHeight: schema.type === 'object' && !schema['x-component'],\n isTableColItem: isTableColItem(\n path.slice(0, path.length - 2),\n getSchema\n ),\n type: schema['x-component'] || schema['type'],\n id: name,\n validateState: toArr(errors).length ? 'error' : undefined,\n required: editable === false ? false : required,\n extra: schema.description,\n help:\n toArr(errors).join(' , ') ||\n (schema['x-item-props'] && schema['x-item-props'].help)\n },\n React.createElement(Field, props)\n )\n }\n )\n }\n})\n","import React from 'react'\nimport { registerFormField, createArrayField } from '@uform/react'\nimport { Button, Icon } from '@alifd/next'\nimport styled from 'styled-components'\n\nexport const CircleButton = styled.div.attrs({ className: 'cricle-btn' })`\n ${props =>\n !props.hasText\n ? `width:30px;\n height:30px;`\n : ''}\n margin-right:10px;\n border-radius: ${props => (!props.hasText ? '100px' : 'none')};\n border: ${props => (!props.hasText ? '1px solid #eee' : 'none')};\n margin-bottom:20px;\n cursor:pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 1.3;\n ${props =>\n !props.hasText\n ? `&:hover{\n background:#f7f4f4;\n }`\n : ''}\n .next-icon{\n display:flex;\n align-items:'center'\n }\n .op-name{\n margin-left:3px;\n }\n}\n`\nexport const ArrayField = createArrayField({\n CircleButton,\n TextButton: props => (\n \n ),\n AddIcon: () => ,\n RemoveIcon: () => (\n \n ),\n MoveDownIcon: () => (\n \n ),\n MoveUpIcon: () => (\n \n )\n})\n\nregisterFormField(\n 'array',\n styled(\n class extends ArrayField {\n render() {\n const { className, name, schema, value, renderField } = this.props\n const style = (schema['x-props'] && schema['x-props'].style) || {}\n return (\n \n {value.map((item, index) => {\n return (\n \n
\n {index + 1}\n
\n
{renderField(index)}
\n
\n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n
\n {toArr(value).map((item, index) => {\n return (\n
\n {index + 1}. {title || schema.title}\n \n }\n className='card-list'\n key={index}\n contentHeight='auto'\n extra={this.renderOperations(item, index)}\n >\n {renderField(index)}\n \n )\n })}\n {value.length === 0 && this.renderEmpty(title)}\n \n {value.length > 0 && this.renderAddition()}\n
\n \n {isFn(col.cell)\n ? col.cell(\n record ? record[col.dataIndex] : undefined,\n rowIndex,\n record\n )\n : record\n ? record[col.dataIndex]\n : undefined}\n
\n )\n }\n\n renderTable(columns, dataSource) {\n return (\n \n
\n \n {columns.map((col, index) => {\n return \n })}\n \n \n \n {columns.map((col, index) => {\n return (\n | \n {col.title} \n | \n )\n })}\n
\n \n \n {dataSource.map((record, rowIndex) => {\n return (\n \n {columns.map((col, colIndex) => {\n return (\n | \n {this.renderCell({\n record,\n col,\n rowIndex,\n colIndex\n })}\n | \n )\n })}\n
\n )\n })}\n {this.renderPlacehodler(dataSource, columns)}\n \n
\n
\n | \n \n | \n
\n )\n }\n }\n\n getColumns(children) {\n const columns = []\n React.Children.forEach(children, child => {\n if (React.isValidElement(child)) {\n if (\n child.type === Column ||\n child.type.displayName === '@schema-table-column'\n ) {\n columns.push(child.props)\n }\n }\n })\n\n return columns\n }\n\n render() {\n const columns = this.getColumns(this.props.children)\n const dataSource = toArr(this.props.dataSource)\n return (\n \n
\n
\n {this.renderTable(columns, dataSource)}\n
\n
\n
\n
\n {Object.keys(\n (schema.items && schema.items.properties) || {}\n ).reduce((buf, key) => {\n const itemSchema = schema.items.properties[key]\n const filter = this.createFilter(key, itemSchema)\n const res = filter(\n () => {\n return buf.concat(\n {\n return renderField([index, key])\n }}\n />\n )\n },\n () => {\n return buf\n }\n )\n return res\n }, [])}\n {additionFilter(() => {\n return (\n {\n return (\n \n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n )\n }}\n />\n )\n })}\n
\n {this.renderAddition()}\n
\n \n {checkStrength && this.renderStrength()}\n
\n )\n }\n }\n)`\n .next-input {\n width: 100%;\n position: relative;\n &.input-password input {\n font-size: 16px;\n letter-spacing: 2px;\n }\n input {\n padding-right: 25px;\n }\n .eye {\n position: absolute;\n height: 20px;\n right: 5px;\n top: 50%;\n transform: translate(0, -50%);\n opacity: 0.3;\n cursor: pointer;\n transition: all 0.15s ease-in-out;\n &:hover {\n opacity: 0.6;\n }\n }\n }\n .password-strength-wrapper {\n background: #e0e0e0;\n margin-bottom: 3px;\n position: relative;\n .div {\n position: absolute;\n z-index: 1;\n height: 8px;\n top: 0;\n background: #fff;\n width: 1px;\n transform: translate(-50%, 0);\n }\n .div-1 {\n left: 20%;\n }\n .div-2 {\n left: 40%;\n }\n .div-3 {\n left: 60%;\n }\n .div-4 {\n left: 80%;\n }\n .password-strength-bar {\n position: relative;\n background-image: -webkit-linear-gradient(left, #ff5500, #ff9300);\n transition: all 0.35s ease-in-out;\n height: 8px;\n width: 100%;\n margin-top: 5px;\n }\n }\n`\n\nregisterFormField('password', connect()(Password))\n","import React, { Component } from 'react'\nimport ReactDOM from 'react-dom'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport { FormConsumer } from '../form'\nimport Sticky from 'react-stikky'\nimport cls from 'classnames'\nimport styled from 'styled-components'\n\nconst getAlign = align => {\n if (align === 'start' || align === 'end') return align\n if (align === 'left' || align === 'top') return 'flex-start'\n if (align === 'right' || align === 'bottom') return 'flex-end'\n return align\n}\n\nconst isElementInViewport = (rect, { offset = 0, threshold = 0 } = {}) => {\n const { top, right, bottom, left, width, height } = rect\n const intersection = {\n t: bottom,\n r: window.innerWidth - left,\n b: window.innerHeight - top,\n l: right\n }\n\n const elementThreshold = {\n x: threshold * width,\n y: threshold * height\n }\n\n return (\n intersection.t >= (offset.top || offset + elementThreshold.y) &&\n intersection.r >= (offset.right || offset + elementThreshold.x) &&\n intersection.b >= (offset.bottom || offset + elementThreshold.y) &&\n intersection.l >= (offset.left || offset + elementThreshold.x)\n )\n}\n\nexport const FormButtonGroup = styled(\n class FormButtonGroup extends Component {\n static defaultProps = {\n span: 24,\n zIndex: 100\n }\n\n renderChildren() {\n const { children, itemStyle, offset, span } = this.props\n return (\n \n
\n \n \n \n {children}\n
\n \n \n
\n
\n
\n {({ inline, FormRef } = {}) => {\n if (!FormRef) return\n return (\n \n \n {content}\n
\n \n )\n }}\n \n
\n {children.reduce((buf, child, key) => {\n return child\n ? buf.concat(\n \n {child}\n \n )\n : buf\n }, [])}\n
\n )\n }\n\n render() {\n const { title } = this.props\n if (title) {\n return this.renderFormItem(this.renderGrid())\n } else {\n return this.renderGrid()\n }\n }\n }\n)\n\nexport const FormCard = createVirtualBox(\n 'card',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 30px;\n .next-card-body {\n padding-top: 30px;\n padding-bottom: 0 !important;\n }\n `\n)\n\nexport const FormBlock = createVirtualBox(\n 'block',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 0px;\n .next-card-body {\n padding-top: 20px;\n padding-bottom: 0 !important;\n }\n &.next-card {\n border: none;\n padding: 0 15px;\n padding-bottom: 15px;\n }\n `\n)\n","import './form'\nimport './fields/string'\nimport './fields/number'\nimport './fields/boolean'\nimport './fields/date'\nimport './fields/time'\nimport './fields/range'\nimport './fields/upload'\nimport './fields/checkbox'\nimport './fields/radio'\nimport './fields/rating'\nimport './fields/transfer'\nimport './fields/array'\nimport './fields/cards'\nimport './fields/table'\nimport './fields/password'\nimport { mapStyledProps, mapTextComponent } from './utils'\nimport { SchemaForm } from '@uform/react'\nexport * from '@uform/react'\nexport * from './components/formButtonGroup'\nexport * from './components/button'\nexport * from './components/layout'\nexport { mapStyledProps, mapTextComponent }\nexport default SchemaForm\n","/*! *****************************************************************************\r\nCopyright (c) Microsoft Corporation. All rights reserved.\r\nLicensed under the Apache License, Version 2.0 (the \"License\"); you may not use\r\nthis file except in compliance with the License. You may obtain a copy of the\r\nLicense at http://www.apache.org/licenses/LICENSE-2.0\r\n\r\nTHIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\nKIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED\r\nWARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,\r\nMERCHANTABLITY OR NON-INFRINGEMENT.\r\n\r\nSee the Apache Version 2.0 License for specific language governing permissions\r\nand limitations under the License.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)\r\n t[p[i]] = s[p[i]];\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (_) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport function __exportStar(m, exports) {\r\n for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];\r\n}\r\n\r\nexport function __values(o) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator], i = 0;\r\n if (m) return m.call(o);\r\n return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];\r\n result.default = mod;\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n","/*!\n * MoveTo - A lightweight scroll animation javascript library without any dependency.\n * Version 1.8.0 (14-01-2019 13:15)\n * Licensed under MIT\n * Copyright 2019 Hasan Aydoğdu \n */\n\n'use strict';\nvar MoveTo = function () {\n /**\n * Defaults\n * @type {object}\n */\n var defaults = {\n tolerance: 0,\n duration: 800,\n easing: 'easeOutQuart',\n container: window,\n callback: function callback() {} };\n\n\n /**\n * easeOutQuart Easing Function\n * @param {number} t - current time\n * @param {number} b - start value\n * @param {number} c - change in value\n * @param {number} d - duration\n * @return {number} - calculated value\n */\n function easeOutQuart(t, b, c, d) {\n t /= d;\n t--;\n return -c * (t * t * t * t - 1) + b;\n }\n\n /**\n * Merge two object\n *\n * @param {object} obj1\n * @param {object} obj2\n * @return {object} merged object\n */\n function mergeObject(obj1, obj2) {\n var obj3 = {};\n Object.keys(obj1).forEach(function (propertyName) {\n obj3[propertyName] = obj1[propertyName];\n });\n\n Object.keys(obj2).forEach(function (propertyName) {\n obj3[propertyName] = obj2[propertyName];\n });\n return obj3;\n };\n\n /**\n * Converts camel case to kebab case\n * @param {string} val the value to be converted\n * @return {string} the converted value\n */\n function kebabCase(val) {\n return val.replace(/([A-Z])/g, function ($1) {\n return '-' + $1.toLowerCase();\n });\n };\n\n /**\n * Count a number of item scrolled top\n * @param {Window|HTMLElement} container\n * @return {number}\n */\n function countScrollTop(container) {\n if (container instanceof HTMLElement) {\n return container.scrollTop;\n }\n return container.pageYOffset;\n };\n\n /**\n * MoveTo Constructor\n * @param {object} options Options\n * @param {object} easeFunctions Custom ease functions\n */\n function MoveTo() {var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};var easeFunctions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n this.options = mergeObject(defaults, options);\n this.easeFunctions = mergeObject({ easeOutQuart: easeOutQuart }, easeFunctions);\n }\n\n /**\n * Register a dom element as trigger\n * @param {HTMLElement} dom Dom trigger element\n * @param {function} callback Callback function\n * @return {function|void} unregister function\n */\n MoveTo.prototype.registerTrigger = function (dom, callback) {var _this = this;\n if (!dom) {\n return;\n }\n\n var href = dom.getAttribute('href') || dom.getAttribute('data-target');\n // The element to be scrolled\n var target = href && href !== '#' ?\n document.getElementById(href.substring(1)) :\n document.body;\n var options = mergeObject(this.options, _getOptionsFromTriggerDom(dom, this.options));\n\n if (typeof callback === 'function') {\n options.callback = callback;\n }\n\n var listener = function listener(e) {\n e.preventDefault();\n _this.move(target, options);\n };\n\n dom.addEventListener('click', listener, false);\n\n return function () {return dom.removeEventListener('click', listener, false);};\n };\n\n /**\n * Move\n * Scrolls to given element by using easeOutQuart function\n * @param {HTMLElement|number} target Target element to be scrolled or target position\n * @param {object} options Custom options\n */\n MoveTo.prototype.move = function (target) {var _this2 = this;var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n if (target !== 0 && !target) {\n return;\n }\n\n options = mergeObject(this.options, options);\n\n var distance = typeof target === 'number' ? target : target.getBoundingClientRect().top;\n var from = countScrollTop(options.container);\n var startTime = null;\n var lastYOffset = void 0;\n distance -= options.tolerance;\n\n // rAF loop\n var loop = function loop(currentTime) {\n var currentYOffset = countScrollTop(_this2.options.container);\n\n if (!startTime) {\n // To starts time from 1, we subtracted 1 from current time\n // If time starts from 1 The first loop will not do anything,\n // because easing value will be zero\n startTime = currentTime - 1;\n }\n\n var timeElapsed = currentTime - startTime;\n\n if (lastYOffset) {\n if (\n distance > 0 && lastYOffset > currentYOffset ||\n distance < 0 && lastYOffset < currentYOffset)\n {\n return options.callback(target);\n }\n }\n lastYOffset = currentYOffset;\n\n var val = _this2.easeFunctions[options.easing](timeElapsed, from, distance, options.duration);\n\n options.container.scroll(0, val);\n\n if (timeElapsed < options.duration) {\n window.requestAnimationFrame(loop);\n } else {\n options.container.scroll(0, distance + from);\n options.callback(target);\n }\n };\n\n window.requestAnimationFrame(loop);\n };\n\n /**\n * Adds custom ease function\n * @param {string} name Ease function name\n * @param {function} fn Ease function\n */\n MoveTo.prototype.addEaseFunction = function (name, fn) {\n this.easeFunctions[name] = fn;\n };\n\n /**\n * Returns options which created from trigger dom element\n * @param {HTMLElement} dom Trigger dom element\n * @param {object} options The instance's options\n * @return {object} The options which created from trigger dom element\n */\n function _getOptionsFromTriggerDom(dom, options) {\n var domOptions = {};\n\n Object.keys(options).forEach(function (key) {\n var value = dom.getAttribute('data-mt-' + kebabCase(key));\n if (value) {\n domOptions[key] = isNaN(value) ? value : parseInt(value, 10);\n }\n });\n return domOptions;\n }\n\n return MoveTo;\n}();\n\nif (typeof module !== 'undefined') {\n module.exports = MoveTo;\n} else {\n window.MoveTo = MoveTo;\n}"],"mappings":"AAEA;;;;;;;;;;;ACKA;;;;;;;;;;;;;;;;;;;;;;;;ACqEA;;;;;;;;;;;;;;AChCA;;;;;;;;;;;;;;;;;;;;;AC6KA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA;ACjQA;;AAMA;AACA;;;;;;;AAOA;;;;;;;;;AAeA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC0DA;;;;;;;;;;;;;;;;;;;;;;;;ACtNA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuTA;ACjMA;;;;;;;;;;;;;;;;;;;;ACvHA;;;;;;AC4JA;;;;;;;;;;;AChKA;;;;;;;;;;;;;;;ACgBA;;;;;;ACRA","sourceRoot":""}
\ No newline at end of file
+{"version":3,"file":"bundle.17.js","sources":["webpack:///./docs/Examples/next/Validation.md","webpack:///./packages/next/node_modules/classnames/index.js","webpack:///./packages/printer/src/index.js","webpack:///./packages/next/src/utils.js","webpack:///./packages/next/src/form.js","webpack:///./packages/next/src/fields/array.js","webpack:///./packages/next/src/fields/cards.js","webpack:///./packages/next/src/fields/table.js","webpack:///./packages/next/src/fields/password.js","webpack:///./packages/next/src/components/formButtonGroup.js","webpack:///./packages/next/src/components/button.js","webpack:///./packages/next/src/components/layout.js","webpack:///./packages/next/src/index.js","webpack:///./node_modules/_tslib@1.9.3@tslib/tslib.es6.js","webpack:///./packages/next/node_modules/moveto/dist/moveTo.js"],"sourcesContent":["\"use strict\";\n\nvar React = require('/Users/wangzhili/uform/node_modules/_react@16.8.6@react/index.js');\n\nvar ReactDOM = require('/Users/wangzhili/uform/node_modules/_react-dom@16.8.6@react-dom/index.js');\n\nvar ReactCodeSnippet = require('/Users/wangzhili/uform/node_modules/_react-code-snippet@0.6.13@react-code-snippet/lib/index.js');\n\nvar ReactPropsTable = require('/Users/wangzhili/uform/node_modules/_react-props-table@0.1.3@react-props-table/lib/index.js');\n\nvar __DEFINE__ = function __DEFINE__(fn) {\n var module = {\n exports: {}\n };\n fn(module, module.exports);\n var component = module.exports.__esModule && module.exports['default'] || module.exports;\n return typeof component === 'function' ? component : function () {\n return React.createElement('div', {}, 'Code snippet should export a component!');\n };\n};\n\nvar Demo_wpors_0 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _operators = require(\"rxjs/operators\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n labelCol: 6,\n wrapperCol: 6\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"name\",\n title: \"\\u59D3\\u540D\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"nickname\",\n title: \"\\u6635\\u79F0\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"date\",\n name: \"birthday\",\n title: \"\\u751F\\u65E5\",\n description: \"\\u8BD5\\u8BD5\\u9009\\u62E92018-11-30\",\n \"x-rules\": [function (val) {\n return new Promise(function (resolve) {\n setTimeout(function () {\n if (val === '2018-11-30') {\n resolve('不允许输入2018-11-30');\n } else {\n resolve();\n }\n }, 1000);\n });\n }],\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"phone\",\n \"x-rules\": \"phone\",\n title: \"\\u624B\\u673A\\u53F7\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"qq\",\n \"x-rules\": \"qq\",\n title: \"QQ\\u53F7\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"email\",\n \"x-rules\": \"email\",\n title: \"\\u90AE\\u7BB1\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"home\",\n \"x-rules\": \"url\",\n title: \"\\u4E2A\\u4EBA\\u4E3B\\u9875\\u5730\\u5740\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"money\",\n \"x-rules\": \"money\",\n title: \"\\u6708\\u85AA\",\n \"x-props\": {\n placeholder: '¥100,000',\n addonTextAfter: '元'\n },\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"idcard\",\n \"x-rules\": \"idcard\",\n title: \"\\u8EAB\\u4EFD\\u8BC1\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"zip\",\n \"x-rules\": \"zip\",\n title: \"\\u90AE\\u653F\\u7F16\\u7801\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"custom\",\n \"x-rules\": function xRules(val) {\n return new Promise(function (resolve) {\n setTimeout(function () {\n if (val === '123') {\n resolve('不允许输入123');\n } else {\n resolve();\n }\n }, 1000);\n });\n },\n title: \"\\u81EA\\u5B9A\\u4E49\\u6821\\u9A8C\\u89C4\\u5219\",\n required: true\n }), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 6\n }, _react[\"default\"].createElement(_next.Submit, null), _react[\"default\"].createElement(_next.Reset, null))));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_zzubs_1 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _operators = require(\"rxjs/operators\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n labelCol: 6,\n wrapperCol: 6,\n effects: function effects($, _ref) {\n var setFieldState = _ref.setFieldState,\n getFieldState = _ref.getFieldState;\n $('onFieldChange', '*(password,confirm)').subscribe(function (fieldState) {\n var selfName = fieldState.name;\n var selfValue = fieldState.value;\n var otherName = selfName == 'password' ? 'confirm' : 'password';\n var otherValue = getFieldState(otherName, function (state) {\n return state.value;\n });\n setFieldState(otherName, function (state) {\n if (selfValue && otherValue && selfValue !== otherValue) {\n state.errors = '两次密码输入不一致';\n } else {\n state.errors = '';\n }\n });\n setFieldState(selfName, function (state) {\n if (selfValue && otherValue && selfValue !== otherValue) {\n state.errors = '两次密码输入不一致';\n } else {\n state.errors = '';\n }\n });\n });\n }\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"username\",\n title: \"\\u7528\\u6237\\u540D\",\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"password\",\n name: \"password\",\n title: \"\\u5BC6\\u7801\",\n \"x-props\": {\n checkStrength: true\n },\n description: _react[\"default\"].createElement(\"ul\", null, _react[\"default\"].createElement(\"li\", null, \"1. \\u957F\\u5EA6\\u4E0D\\u5C0F\\u4E8E8\\u4E2A\"), _react[\"default\"].createElement(\"li\", null, \"2. \\u5FC5\\u987B\\u5305\\u542B\\u5927\\u5C0F\\u5199\\u6570\\u5B57\\u7B26\\u53F7\")),\n required: true\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"password\",\n name: \"confirm\",\n title: \"\\u786E\\u8BA4\\u5BC6\\u7801\",\n \"x-props\": {\n checkStrength: true\n },\n required: true\n }), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 6\n }, _react[\"default\"].createElement(_next.Submit, null), _react[\"default\"].createElement(_next.Reset, null))));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar __MARKDOWN__ = function __MARKDOWN__() {\n return React.createElement(React.Fragment, {}, React.createElement(\"h1\", {\n id: \"校验\",\n className: \"react-demo-h1\"\n }, \"校验\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"校验和联动往往是相辅相成的，联动负责提升用户体验，引导用户一步步的完成数据输入\\n，校验则是阻止用户输入任何非法数据\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"所以，联动规则和校验规则的复杂度都会根据业务场景的复杂度而线性提升，所以，我们\\n需要一个完备的联动校验方案来解决这一个又一个不可避免的业务逻辑呢？\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"同样，还是借助 effects，我们可以方便的来处理各种场景的校验逻辑\")), React.createElement(\"h3\", {\n id: \"简单数据校验\",\n className: \"react-demo-h3\"\n }, \"简单数据校验\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"当前例子涉及基本的字符格式校验与自定义校验\")), React.createElement(\"h4\", {\n id: \"demo-示例\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormPath,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { filter, withLatestFrom, map } from 'rxjs/operators'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n \\n \\n \\n \\n new Promise(resolve => {\\n setTimeout(() => {\\n if (val === '2018-11-30') {\\n resolve('不允许输入2018-11-30')\\n } else {\\n resolve()\\n }\\n }, 1000)\\n })\\n ]}\\n required\\n />\\n \\n \\n \\n \\n \\n \\n \\n \\n new Promise(resolve => {\\n setTimeout(() => {\\n if (val === '123') {\\n resolve('不允许输入123')\\n } else {\\n resolve()\\n }\\n }, 1000)\\n })\\n }\\n title=\\\"自定义校验规则\\\"\\n required\\n />\\n \\n \\n \\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_wpors_0, {})), React.createElement(\"h3\", {\n id: \"联动数据校验\",\n className: \"react-demo-h3\"\n }, \"联动数据校验\"), React.createElement(\"h4\", {\n id: \"demo-示例-1\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormPath,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { filter, withLatestFrom, map } from 'rxjs/operators'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n {\\n $('onFieldChange', '*(password,confirm)').subscribe(fieldState => {\\n const selfName = fieldState.name\\n const selfValue = fieldState.value\\n const otherName = selfName == 'password' ? 'confirm' : 'password'\\n const otherValue = getFieldState(otherName, state => state.value)\\n setFieldState(otherName, state => {\\n if (selfValue && otherValue && selfValue !== otherValue) {\\n state.errors = '两次密码输入不一致'\\n } else {\\n state.errors = ''\\n }\\n })\\n setFieldState(selfName, state => {\\n if (selfValue && otherValue && selfValue !== otherValue) {\\n state.errors = '两次密码输入不一致'\\n } else {\\n state.errors = ''\\n }\\n })\\n })\\n }}\\n >\\n \\n \\n 1. 长度不小于8个\\n 2. 必须包含大小写数字符号\\n \\n }\\n required\\n />\\n \\n \\n \\n \\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_zzubs_1, {})));\n};\n\n__MARKDOWN__.meta = {\n \"username\": \"zhili.wzl\",\n \"email\": \"wangzhili56@126.com\"\n};\nmodule.exports = __MARKDOWN__;","/*!\n Copyright (c) 2017 Jed Watson.\n Licensed under the MIT License (MIT), see\n http://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = [];\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (!arg) continue;\n\n\t\t\tvar argType = typeof arg;\n\n\t\t\tif (argType === 'string' || argType === 'number') {\n\t\t\t\tclasses.push(arg);\n\t\t\t} else if (Array.isArray(arg) && arg.length) {\n\t\t\t\tvar inner = classNames.apply(null, arg);\n\t\t\t\tif (inner) {\n\t\t\t\t\tclasses.push(inner);\n\t\t\t\t}\n\t\t\t} else if (argType === 'object') {\n\t\t\t\tfor (var key in arg) {\n\t\t\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\t\t\tclasses.push(key);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn classes.join(' ');\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n","import React, { useState } from 'react'\nimport ReactDOM from 'react-dom'\nimport { createFormActions } from '@uform/react'\nimport styled from 'styled-components'\nimport Modal from 'react-modal'\n\nconst Dialog = styled(props => {\n const [visible, setVisible] = useState(true)\n return (\n {\n setVisible(false)\n }}\n >\n {\n setVisible(false)\n }}\n >\n \n \n \n {props.children}\n
\n \n )\n})`\n position: relative;\n margin: 100px;\n padding: 30px;\n height: calc(100% - 200px);\n overflow: auto;\n border: 1px solid #eee;\n background: #fff;\n outline: none;\n .close-btn {\n position: absolute;\n top: 15px;\n right: 10px;\n width: 25px;\n height: 25px;\n cursor: pointer;\n img {\n width: 100%;\n }\n }\n .dialog-content {\n overflow: auto;\n height: 100%;\n }\n`\n\nconst createAlert = (config = {}) => {\n const container = document.createElement('div')\n const unMount = () => {\n ReactDOM.unmountComponentAtNode(container)\n container.parentNode.removeChild(container)\n }\n if (typeof config === 'string' || React.isValidElement(config)) {\n config = {\n content: config\n }\n }\n document.body.appendChild(container)\n ReactDOM.render(\n ,\n container\n )\n}\n\nconst cleanSchema = schema => {\n if (!schema) return\n return {\n type: schema.type,\n 'x-props': schema['x-props'],\n 'x-component': schema['x-component'],\n 'x-index': schema['x-index'],\n 'x-rules': schema['x-rules'],\n maxItems: schema.maxItems,\n minItems: schema.minItems,\n default: schema.default,\n enum: schema.enum,\n title: schema.title,\n required: schema.required,\n\n properties: Object.keys(schema.properties || {}).reduce((buf, key) => {\n buf[key] = cleanSchema(schema.properties[key])\n return buf\n }, {}),\n items: cleanSchema(schema.items)\n }\n}\n\nconst printSchema = schema => {\n return JSON.stringify(cleanSchema(schema), null, 2)\n}\n\nexport default class extends React.Component {\n actions = createFormActions()\n\n onClickHandler = async e => {\n e.preventDefault()\n const schema = await this.actions.getSchema('')\n createAlert(\n \n {printSchema(schema)}\n
\n )\n }\n\n render() {\n const { children, className } = this.props\n if (children && children.props && children.props.actions) {\n this.actions = children.props.actions\n }\n return (\n \n {React.cloneElement(children, {\n actions: this.actions\n })}\n
\n Print JSON Schema\n \n \n {!value ? 'N/A' : value}\n {props.addonTextAfter ? ' ' + props.addonTextAfter : ''}\n {props.addonAfter ? ' ' + props.addonAfter : ''}\n
\n )\n})`\n height: 28px;\n line-height: 28px;\n vertical-align: middle;\n font-size: 13px;\n color: #333;\n &.small {\n height: 20px;\n line-height: 20px;\n }\n &.large {\n height: 40px;\n line-height: 40px;\n }\n`\n\nexport const acceptEnum = component => {\n return ({ dataSource, ...others }) => {\n if (dataSource) {\n return React.createElement(Select, { dataSource, ...others })\n } else {\n return React.createElement(component, others)\n }\n }\n}\n\nexport const mapStyledProps = (props, { loading, size }) => {\n if (loading) {\n props.state = props.state || 'loading'\n }\n if (size) {\n props.size = size\n }\n}\n\nexport const mapTextComponent = (Target, props, { editable, name }) => {\n if (editable !== undefined) {\n if (isFn(editable)) {\n if (!editable(name)) {\n return Text\n }\n } else if (editable === false) {\n return Text\n }\n }\n return Target\n}\n\nexport const compose = (...args) => {\n return (payload, ...extra) => {\n return args.reduce((buf, fn) => {\n return buf !== undefined ? fn(buf, ...extra) : fn(payload, ...extra)\n }, payload)\n }\n}\n\nexport const moveTo = element => {\n if (!element) return\n if (element.scrollIntoView) {\n element.scrollIntoView({\n behavior: 'smooth',\n inline: 'start',\n block: 'start'\n })\n } else {\n new MoveTo().move(element.getBoundingClientRect().top)\n }\n}\n","import React from 'react'\nimport { registerFormWrapper, registerFieldMiddleware } from '@uform/react'\nimport classNames from 'classnames'\nimport { ConfigProvider, Balloon, Icon } from '@alifd/next'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport LOCALE from './locale'\nimport styled from 'styled-components'\nimport { isFn, moveTo } from './utils'\n/**\n * 轻量级Next Form，不包含任何数据管理能力\n *\n */\n\nexport const {\n Provider: FormProvider,\n Consumer: FormConsumer\n} = React.createContext()\n\nconst normalizeCol = col => {\n return typeof col === 'object' ? col : { span: col }\n}\n\nconst getParentNode = (node, selector) => {\n if (!node || (node && !node.matches)) return\n if (node.matches(selector)) return node\n else {\n return getParentNode(node.parentNode || node.parentElement, selector)\n }\n}\n\nexport const FormItem = styled(\n class FormItem extends React.Component {\n static defaultProps = {\n prefix: 'next-'\n }\n\n getItemLabel() {\n const {\n id,\n required,\n label,\n labelCol,\n wrapperCol,\n prefix,\n extra,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n isTableColItem\n } = this.props\n\n if (!label || isTableColItem) {\n return null\n }\n\n const ele = (\n \n )\n\n const cls = classNames({\n [`${prefix}form-item-label`]: true,\n [`${prefix}left`]: labelTextAlign === 'left'\n })\n\n if ((wrapperCol || labelCol) && labelAlign !== 'top') {\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n \n )\n }\n\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n
\n )\n }\n\n getItemWrapper() {\n const {\n labelCol,\n wrapperCol,\n children,\n extra,\n label,\n labelAlign,\n help,\n size,\n prefix,\n noMinHeight,\n isTableColItem\n } = this.props\n\n const message = (\n \n {help && {help}
}\n {!help && extra && extra.length <= 20 && (\n {extra}
\n )}\n \n )\n if (\n (wrapperCol || labelCol) &&\n labelAlign !== 'top' &&\n !isTableColItem &&\n label\n ) {\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n \n )\n }\n\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n
\n )\n }\n\n renderHelper() {\n return (\n }\n >\n {this.props.extra}\n \n )\n }\n\n render() {\n const {\n className,\n labelAlign,\n labelTextAlign,\n style,\n prefix,\n wrapperCol,\n labelCol,\n size,\n help,\n extra,\n noMinHeight,\n isTableColItem,\n validateState,\n autoAddColon,\n required,\n type,\n schema,\n ...others\n } = this.props\n\n const itemClassName = classNames({\n [`${prefix}form-item`]: true,\n [`${prefix}${labelAlign}`]: labelAlign,\n [`has-${validateState}`]: !!validateState,\n [`${prefix}${size}`]: !!size,\n [`${className}`]: !!className,\n [`field-${type}`]: !!type\n })\n\n // 垂直模式并且左对齐才用到\n const Tag = (wrapperCol || labelCol) && labelAlign !== 'top' ? Row : 'div'\n const label = labelAlign === 'inset' ? null : this.getItemLabel()\n\n return (\n \n {label}\n {this.getItemWrapper()}\n \n )\n }\n }\n)`\n margin-bottom: 4px !important;\n &.field-table {\n .next-form-item-control {\n overflow: auto;\n }\n }\n .next-form-item-msg {\n &.next-form-item-space {\n min-height: 20px;\n .next-form-item-help,\n .next-form-item-extra {\n margin-top: 0;\n }\n }\n }\n .next-form-item-extra {\n color: #888;\n font-size: 12px;\n line-height: 1.7;\n }\n`\n\nconst toArr = val => (Array.isArray(val) ? val : val ? [val] : [])\n\nregisterFormWrapper(OriginForm => {\n OriginForm = styled(OriginForm)`\n &.next-inline {\n display: flex;\n .rs-uform-content {\n margin-right: 15px;\n }\n }\n .next-radio-group,\n .next-checkbox-group {\n line-height: 28px;\n & > label {\n margin-right: 8px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 20px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 40px;\n }\n }\n .next-card-head {\n background: none;\n }\n .next-rating-medium {\n min-height: 28px;\n line-height: 28px;\n }\n .next-rating-small {\n min-height: 20px;\n line-height: 20px;\n }\n .next-rating-large {\n min-height: 40px;\n line-height: 40px;\n }\n `\n\n return ConfigProvider.config(\n class Form extends React.Component {\n static defaultProps = {\n component: 'form',\n prefix: 'next-',\n size: 'medium',\n labelAlign: 'left',\n locale: LOCALE,\n autoAddColon: true\n }\n\n static displayName = 'SchemaForm'\n\n FormRef = React.createRef()\n\n validateFailedHandler(onValidateFailed) {\n return (...args) => {\n if (isFn(onValidateFailed)) {\n onValidateFailed(...args)\n }\n const container = this.FormRef.current\n if (container) {\n const errors = container.querySelectorAll('.next-form-item-help')\n if (errors && errors.length) {\n const node = getParentNode(errors[0], '.next-form-item')\n if (node) {\n moveTo(node)\n }\n }\n }\n }\n }\n\n render() {\n const {\n className,\n inline,\n size,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n children,\n component,\n labelCol,\n wrapperCol,\n getErrorScrollOffset,\n errorScrollToElement,\n style,\n prefix,\n ...others\n } = this.props\n const formClassName = classNames({\n [`${prefix}form`]: true,\n [`${prefix}inline`]: inline, // 内联\n [`${prefix}${size}`]: size,\n [className]: !!className\n })\n return (\n \n \n {children}\n \n \n )\n }\n }\n )\n})\n\nconst isTableColItem = (path, getSchema) => {\n const schema = getSchema(path)\n return schema && schema.type === 'array' && schema['x-component'] === 'table'\n}\n\nregisterFieldMiddleware(Field => {\n return props => {\n const { name, editable, errors, path, schema, getSchema, required } = props\n if (path.length === 0) return React.createElement(Field, props) // 根节点是不需要包FormItem的\n return React.createElement(\n FormConsumer,\n {},\n ({\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n size,\n autoAddColon\n }) => {\n return React.createElement(\n FormItem,\n {\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n autoAddColon,\n size,\n ...schema['x-item-props'],\n label: schema.title,\n noMinHeight: schema.type === 'object' && !schema['x-component'],\n isTableColItem: isTableColItem(\n path.slice(0, path.length - 2),\n getSchema\n ),\n type: schema['x-component'] || schema['type'],\n id: name,\n validateState: toArr(errors).length ? 'error' : undefined,\n required: editable === false ? false : required,\n extra: schema.description,\n help:\n toArr(errors).join(' , ') ||\n (schema['x-item-props'] && schema['x-item-props'].help)\n },\n React.createElement(Field, props)\n )\n }\n )\n }\n})\n","import React from 'react'\nimport { registerFormField, createArrayField } from '@uform/react'\nimport { Button, Icon } from '@alifd/next'\nimport styled from 'styled-components'\n\nexport const CircleButton = styled.div.attrs({ className: 'cricle-btn' })`\n ${props =>\n !props.hasText\n ? `width:30px;\n height:30px;`\n : ''}\n margin-right:10px;\n border-radius: ${props => (!props.hasText ? '100px' : 'none')};\n border: ${props => (!props.hasText ? '1px solid #eee' : 'none')};\n margin-bottom:20px;\n cursor:pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 1.3;\n ${props =>\n !props.hasText\n ? `&:hover{\n background:#f7f4f4;\n }`\n : ''}\n .next-icon{\n display:flex;\n align-items:'center'\n }\n .op-name{\n margin-left:3px;\n }\n}\n`\nexport const ArrayField = createArrayField({\n CircleButton,\n TextButton: props => (\n \n ),\n AddIcon: () => ,\n RemoveIcon: () => (\n \n ),\n MoveDownIcon: () => (\n \n ),\n MoveUpIcon: () => (\n \n )\n})\n\nregisterFormField(\n 'array',\n styled(\n class extends ArrayField {\n render() {\n const { className, name, schema, value, renderField } = this.props\n const style = (schema['x-props'] && schema['x-props'].style) || {}\n return (\n \n {value.map((item, index) => {\n return (\n \n
\n {index + 1}\n
\n
{renderField(index)}
\n
\n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n
\n {toArr(value).map((item, index) => {\n return (\n
\n {index + 1}. {title || schema.title}\n \n }\n className='card-list'\n key={index}\n contentHeight='auto'\n extra={this.renderOperations(item, index)}\n >\n {renderField(index)}\n \n )\n })}\n {value.length === 0 && this.renderEmpty(title)}\n \n {value.length > 0 && this.renderAddition()}\n
\n \n {isFn(col.cell)\n ? col.cell(\n record ? record[col.dataIndex] : undefined,\n rowIndex,\n record\n )\n : record\n ? record[col.dataIndex]\n : undefined}\n
\n )\n }\n\n renderTable(columns, dataSource) {\n return (\n \n
\n \n {columns.map((col, index) => {\n return \n })}\n \n \n \n {columns.map((col, index) => {\n return (\n | \n {col.title} \n | \n )\n })}\n
\n \n \n {dataSource.map((record, rowIndex) => {\n return (\n \n {columns.map((col, colIndex) => {\n return (\n | \n {this.renderCell({\n record,\n col,\n rowIndex,\n colIndex\n })}\n | \n )\n })}\n
\n )\n })}\n {this.renderPlacehodler(dataSource, columns)}\n \n
\n
\n | \n \n | \n
\n )\n }\n }\n\n getColumns(children) {\n const columns = []\n React.Children.forEach(children, child => {\n if (React.isValidElement(child)) {\n if (\n child.type === Column ||\n child.type.displayName === '@schema-table-column'\n ) {\n columns.push(child.props)\n }\n }\n })\n\n return columns\n }\n\n render() {\n const columns = this.getColumns(this.props.children)\n const dataSource = toArr(this.props.dataSource)\n return (\n \n
\n
\n {this.renderTable(columns, dataSource)}\n
\n
\n
\n
\n {Object.keys(\n (schema.items && schema.items.properties) || {}\n ).reduce((buf, key) => {\n const itemSchema = schema.items.properties[key]\n const filter = this.createFilter(key, itemSchema)\n const res = filter(\n () => {\n return buf.concat(\n {\n return renderField([index, key])\n }}\n />\n )\n },\n () => {\n return buf\n }\n )\n return res\n }, [])}\n {additionFilter(() => {\n return (\n {\n return (\n \n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n )\n }}\n />\n )\n })}\n
\n {this.renderAddition()}\n
\n \n {checkStrength && this.renderStrength()}\n
\n )\n }\n }\n)`\n .next-input {\n width: 100%;\n position: relative;\n &.input-password input {\n font-size: 16px;\n letter-spacing: 2px;\n }\n input {\n padding-right: 25px;\n }\n .eye {\n position: absolute;\n height: 20px;\n right: 5px;\n top: 50%;\n transform: translate(0, -50%);\n opacity: 0.3;\n cursor: pointer;\n transition: all 0.15s ease-in-out;\n &:hover {\n opacity: 0.6;\n }\n }\n }\n .password-strength-wrapper {\n background: #e0e0e0;\n margin-bottom: 3px;\n position: relative;\n .div {\n position: absolute;\n z-index: 1;\n height: 8px;\n top: 0;\n background: #fff;\n width: 1px;\n transform: translate(-50%, 0);\n }\n .div-1 {\n left: 20%;\n }\n .div-2 {\n left: 40%;\n }\n .div-3 {\n left: 60%;\n }\n .div-4 {\n left: 80%;\n }\n .password-strength-bar {\n position: relative;\n background-image: -webkit-linear-gradient(left, #ff5500, #ff9300);\n transition: all 0.35s ease-in-out;\n height: 8px;\n width: 100%;\n margin-top: 5px;\n }\n }\n`\n\nregisterFormField('password', connect()(Password))\n","import React, { Component } from 'react'\nimport ReactDOM from 'react-dom'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport { FormConsumer } from '../form'\nimport Sticky from 'react-stikky'\nimport cls from 'classnames'\nimport styled from 'styled-components'\n\nconst getAlign = align => {\n if (align === 'start' || align === 'end') return align\n if (align === 'left' || align === 'top') return 'flex-start'\n if (align === 'right' || align === 'bottom') return 'flex-end'\n return align\n}\n\nconst isElementInViewport = (rect, { offset = 0, threshold = 0 } = {}) => {\n const { top, right, bottom, left, width, height } = rect\n const intersection = {\n t: bottom,\n r: window.innerWidth - left,\n b: window.innerHeight - top,\n l: right\n }\n\n const elementThreshold = {\n x: threshold * width,\n y: threshold * height\n }\n\n return (\n intersection.t >= (offset.top || offset + elementThreshold.y) &&\n intersection.r >= (offset.right || offset + elementThreshold.x) &&\n intersection.b >= (offset.bottom || offset + elementThreshold.y) &&\n intersection.l >= (offset.left || offset + elementThreshold.x)\n )\n}\n\nexport const FormButtonGroup = styled(\n class FormButtonGroup extends Component {\n static defaultProps = {\n span: 24,\n zIndex: 100\n }\n\n renderChildren() {\n const { children, itemStyle, offset, span } = this.props\n return (\n \n
\n \n \n \n {children}\n
\n \n \n
\n
\n
\n {({ inline, FormRef } = {}) => {\n if (!FormRef) return\n return (\n \n \n {content}\n
\n \n )\n }}\n \n
\n {children.reduce((buf, child, key) => {\n return child\n ? buf.concat(\n \n {child}\n \n )\n : buf\n }, [])}\n
\n )\n }\n\n render() {\n const { title } = this.props\n if (title) {\n return this.renderFormItem(this.renderGrid())\n } else {\n return this.renderGrid()\n }\n }\n }\n)\n\nexport const FormCard = createVirtualBox(\n 'card',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 30px;\n .next-card-body {\n padding-top: 30px;\n padding-bottom: 0 !important;\n }\n `\n)\n\nexport const FormBlock = createVirtualBox(\n 'block',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 0px;\n .next-card-body {\n padding-top: 20px;\n padding-bottom: 0 !important;\n }\n &.next-card {\n border: none;\n padding: 0 15px;\n padding-bottom: 15px;\n }\n `\n)\n","import './form'\nimport './fields/string'\nimport './fields/number'\nimport './fields/boolean'\nimport './fields/date'\nimport './fields/time'\nimport './fields/range'\nimport './fields/upload'\nimport './fields/checkbox'\nimport './fields/radio'\nimport './fields/rating'\nimport './fields/transfer'\nimport './fields/array'\nimport './fields/cards'\nimport './fields/table'\nimport './fields/password'\nimport { mapStyledProps, mapTextComponent } from './utils'\nimport { SchemaForm } from '@uform/react'\nexport * from '@uform/react'\nexport * from './components/formButtonGroup'\nexport * from './components/button'\nexport * from './components/layout'\nexport { mapStyledProps, mapTextComponent }\nexport default SchemaForm\n","/*! *****************************************************************************\r\nCopyright (c) Microsoft Corporation. All rights reserved.\r\nLicensed under the Apache License, Version 2.0 (the \"License\"); you may not use\r\nthis file except in compliance with the License. You may obtain a copy of the\r\nLicense at http://www.apache.org/licenses/LICENSE-2.0\r\n\r\nTHIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY\r\nKIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED\r\nWARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE,\r\nMERCHANTABLITY OR NON-INFRINGEMENT.\r\n\r\nSee the Apache Version 2.0 License for specific language governing permissions\r\nand limitations under the License.\r\n***************************************************************************** */\r\n/* global Reflect, Promise */\r\n\r\nvar extendStatics = function(d, b) {\r\n extendStatics = Object.setPrototypeOf ||\r\n ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||\r\n function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };\r\n return extendStatics(d, b);\r\n};\r\n\r\nexport function __extends(d, b) {\r\n extendStatics(d, b);\r\n function __() { this.constructor = d; }\r\n d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());\r\n}\r\n\r\nexport var __assign = function() {\r\n __assign = Object.assign || function __assign(t) {\r\n for (var s, i = 1, n = arguments.length; i < n; i++) {\r\n s = arguments[i];\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];\r\n }\r\n return t;\r\n }\r\n return __assign.apply(this, arguments);\r\n}\r\n\r\nexport function __rest(s, e) {\r\n var t = {};\r\n for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)\r\n t[p] = s[p];\r\n if (s != null && typeof Object.getOwnPropertySymbols === \"function\")\r\n for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) if (e.indexOf(p[i]) < 0)\r\n t[p[i]] = s[p[i]];\r\n return t;\r\n}\r\n\r\nexport function __decorate(decorators, target, key, desc) {\r\n var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;\r\n if (typeof Reflect === \"object\" && typeof Reflect.decorate === \"function\") r = Reflect.decorate(decorators, target, key, desc);\r\n else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;\r\n return c > 3 && r && Object.defineProperty(target, key, r), r;\r\n}\r\n\r\nexport function __param(paramIndex, decorator) {\r\n return function (target, key) { decorator(target, key, paramIndex); }\r\n}\r\n\r\nexport function __metadata(metadataKey, metadataValue) {\r\n if (typeof Reflect === \"object\" && typeof Reflect.metadata === \"function\") return Reflect.metadata(metadataKey, metadataValue);\r\n}\r\n\r\nexport function __awaiter(thisArg, _arguments, P, generator) {\r\n return new (P || (P = Promise))(function (resolve, reject) {\r\n function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }\r\n function rejected(value) { try { step(generator[\"throw\"](value)); } catch (e) { reject(e); } }\r\n function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }\r\n step((generator = generator.apply(thisArg, _arguments || [])).next());\r\n });\r\n}\r\n\r\nexport function __generator(thisArg, body) {\r\n var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;\r\n return g = { next: verb(0), \"throw\": verb(1), \"return\": verb(2) }, typeof Symbol === \"function\" && (g[Symbol.iterator] = function() { return this; }), g;\r\n function verb(n) { return function (v) { return step([n, v]); }; }\r\n function step(op) {\r\n if (f) throw new TypeError(\"Generator is already executing.\");\r\n while (_) try {\r\n if (f = 1, y && (t = op[0] & 2 ? y[\"return\"] : op[0] ? y[\"throw\"] || ((t = y[\"return\"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;\r\n if (y = 0, t) op = [op[0] & 2, t.value];\r\n switch (op[0]) {\r\n case 0: case 1: t = op; break;\r\n case 4: _.label++; return { value: op[1], done: false };\r\n case 5: _.label++; y = op[1]; op = [0]; continue;\r\n case 7: op = _.ops.pop(); _.trys.pop(); continue;\r\n default:\r\n if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }\r\n if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }\r\n if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }\r\n if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }\r\n if (t[2]) _.ops.pop();\r\n _.trys.pop(); continue;\r\n }\r\n op = body.call(thisArg, _);\r\n } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }\r\n if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };\r\n }\r\n}\r\n\r\nexport function __exportStar(m, exports) {\r\n for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];\r\n}\r\n\r\nexport function __values(o) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator], i = 0;\r\n if (m) return m.call(o);\r\n return {\r\n next: function () {\r\n if (o && i >= o.length) o = void 0;\r\n return { value: o && o[i++], done: !o };\r\n }\r\n };\r\n}\r\n\r\nexport function __read(o, n) {\r\n var m = typeof Symbol === \"function\" && o[Symbol.iterator];\r\n if (!m) return o;\r\n var i = m.call(o), r, ar = [], e;\r\n try {\r\n while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);\r\n }\r\n catch (error) { e = { error: error }; }\r\n finally {\r\n try {\r\n if (r && !r.done && (m = i[\"return\"])) m.call(i);\r\n }\r\n finally { if (e) throw e.error; }\r\n }\r\n return ar;\r\n}\r\n\r\nexport function __spread() {\r\n for (var ar = [], i = 0; i < arguments.length; i++)\r\n ar = ar.concat(__read(arguments[i]));\r\n return ar;\r\n}\r\n\r\nexport function __await(v) {\r\n return this instanceof __await ? (this.v = v, this) : new __await(v);\r\n}\r\n\r\nexport function __asyncGenerator(thisArg, _arguments, generator) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var g = generator.apply(thisArg, _arguments || []), i, q = [];\r\n return i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i;\r\n function verb(n) { if (g[n]) i[n] = function (v) { return new Promise(function (a, b) { q.push([n, v, a, b]) > 1 || resume(n, v); }); }; }\r\n function resume(n, v) { try { step(g[n](v)); } catch (e) { settle(q[0][3], e); } }\r\n function step(r) { r.value instanceof __await ? Promise.resolve(r.value.v).then(fulfill, reject) : settle(q[0][2], r); }\r\n function fulfill(value) { resume(\"next\", value); }\r\n function reject(value) { resume(\"throw\", value); }\r\n function settle(f, v) { if (f(v), q.shift(), q.length) resume(q[0][0], q[0][1]); }\r\n}\r\n\r\nexport function __asyncDelegator(o) {\r\n var i, p;\r\n return i = {}, verb(\"next\"), verb(\"throw\", function (e) { throw e; }), verb(\"return\"), i[Symbol.iterator] = function () { return this; }, i;\r\n function verb(n, f) { i[n] = o[n] ? function (v) { return (p = !p) ? { value: __await(o[n](v)), done: n === \"return\" } : f ? f(v) : v; } : f; }\r\n}\r\n\r\nexport function __asyncValues(o) {\r\n if (!Symbol.asyncIterator) throw new TypeError(\"Symbol.asyncIterator is not defined.\");\r\n var m = o[Symbol.asyncIterator], i;\r\n return m ? m.call(o) : (o = typeof __values === \"function\" ? __values(o) : o[Symbol.iterator](), i = {}, verb(\"next\"), verb(\"throw\"), verb(\"return\"), i[Symbol.asyncIterator] = function () { return this; }, i);\r\n function verb(n) { i[n] = o[n] && function (v) { return new Promise(function (resolve, reject) { v = o[n](v), settle(resolve, reject, v.done, v.value); }); }; }\r\n function settle(resolve, reject, d, v) { Promise.resolve(v).then(function(v) { resolve({ value: v, done: d }); }, reject); }\r\n}\r\n\r\nexport function __makeTemplateObject(cooked, raw) {\r\n if (Object.defineProperty) { Object.defineProperty(cooked, \"raw\", { value: raw }); } else { cooked.raw = raw; }\r\n return cooked;\r\n};\r\n\r\nexport function __importStar(mod) {\r\n if (mod && mod.__esModule) return mod;\r\n var result = {};\r\n if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];\r\n result.default = mod;\r\n return result;\r\n}\r\n\r\nexport function __importDefault(mod) {\r\n return (mod && mod.__esModule) ? mod : { default: mod };\r\n}\r\n","/*!\n * MoveTo - A lightweight scroll animation javascript library without any dependency.\n * Version 1.8.0 (14-01-2019 13:15)\n * Licensed under MIT\n * Copyright 2019 Hasan Aydoğdu \n */\n\n'use strict';\nvar MoveTo = function () {\n /**\n * Defaults\n * @type {object}\n */\n var defaults = {\n tolerance: 0,\n duration: 800,\n easing: 'easeOutQuart',\n container: window,\n callback: function callback() {} };\n\n\n /**\n * easeOutQuart Easing Function\n * @param {number} t - current time\n * @param {number} b - start value\n * @param {number} c - change in value\n * @param {number} d - duration\n * @return {number} - calculated value\n */\n function easeOutQuart(t, b, c, d) {\n t /= d;\n t--;\n return -c * (t * t * t * t - 1) + b;\n }\n\n /**\n * Merge two object\n *\n * @param {object} obj1\n * @param {object} obj2\n * @return {object} merged object\n */\n function mergeObject(obj1, obj2) {\n var obj3 = {};\n Object.keys(obj1).forEach(function (propertyName) {\n obj3[propertyName] = obj1[propertyName];\n });\n\n Object.keys(obj2).forEach(function (propertyName) {\n obj3[propertyName] = obj2[propertyName];\n });\n return obj3;\n };\n\n /**\n * Converts camel case to kebab case\n * @param {string} val the value to be converted\n * @return {string} the converted value\n */\n function kebabCase(val) {\n return val.replace(/([A-Z])/g, function ($1) {\n return '-' + $1.toLowerCase();\n });\n };\n\n /**\n * Count a number of item scrolled top\n * @param {Window|HTMLElement} container\n * @return {number}\n */\n function countScrollTop(container) {\n if (container instanceof HTMLElement) {\n return container.scrollTop;\n }\n return container.pageYOffset;\n };\n\n /**\n * MoveTo Constructor\n * @param {object} options Options\n * @param {object} easeFunctions Custom ease functions\n */\n function MoveTo() {var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};var easeFunctions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n this.options = mergeObject(defaults, options);\n this.easeFunctions = mergeObject({ easeOutQuart: easeOutQuart }, easeFunctions);\n }\n\n /**\n * Register a dom element as trigger\n * @param {HTMLElement} dom Dom trigger element\n * @param {function} callback Callback function\n * @return {function|void} unregister function\n */\n MoveTo.prototype.registerTrigger = function (dom, callback) {var _this = this;\n if (!dom) {\n return;\n }\n\n var href = dom.getAttribute('href') || dom.getAttribute('data-target');\n // The element to be scrolled\n var target = href && href !== '#' ?\n document.getElementById(href.substring(1)) :\n document.body;\n var options = mergeObject(this.options, _getOptionsFromTriggerDom(dom, this.options));\n\n if (typeof callback === 'function') {\n options.callback = callback;\n }\n\n var listener = function listener(e) {\n e.preventDefault();\n _this.move(target, options);\n };\n\n dom.addEventListener('click', listener, false);\n\n return function () {return dom.removeEventListener('click', listener, false);};\n };\n\n /**\n * Move\n * Scrolls to given element by using easeOutQuart function\n * @param {HTMLElement|number} target Target element to be scrolled or target position\n * @param {object} options Custom options\n */\n MoveTo.prototype.move = function (target) {var _this2 = this;var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n if (target !== 0 && !target) {\n return;\n }\n\n options = mergeObject(this.options, options);\n\n var distance = typeof target === 'number' ? target : target.getBoundingClientRect().top;\n var from = countScrollTop(options.container);\n var startTime = null;\n var lastYOffset = void 0;\n distance -= options.tolerance;\n\n // rAF loop\n var loop = function loop(currentTime) {\n var currentYOffset = countScrollTop(_this2.options.container);\n\n if (!startTime) {\n // To starts time from 1, we subtracted 1 from current time\n // If time starts from 1 The first loop will not do anything,\n // because easing value will be zero\n startTime = currentTime - 1;\n }\n\n var timeElapsed = currentTime - startTime;\n\n if (lastYOffset) {\n if (\n distance > 0 && lastYOffset > currentYOffset ||\n distance < 0 && lastYOffset < currentYOffset)\n {\n return options.callback(target);\n }\n }\n lastYOffset = currentYOffset;\n\n var val = _this2.easeFunctions[options.easing](timeElapsed, from, distance, options.duration);\n\n options.container.scroll(0, val);\n\n if (timeElapsed < options.duration) {\n window.requestAnimationFrame(loop);\n } else {\n options.container.scroll(0, distance + from);\n options.callback(target);\n }\n };\n\n window.requestAnimationFrame(loop);\n };\n\n /**\n * Adds custom ease function\n * @param {string} name Ease function name\n * @param {function} fn Ease function\n */\n MoveTo.prototype.addEaseFunction = function (name, fn) {\n this.easeFunctions[name] = fn;\n };\n\n /**\n * Returns options which created from trigger dom element\n * @param {HTMLElement} dom Trigger dom element\n * @param {object} options The instance's options\n * @return {object} The options which created from trigger dom element\n */\n function _getOptionsFromTriggerDom(dom, options) {\n var domOptions = {};\n\n Object.keys(options).forEach(function (key) {\n var value = dom.getAttribute('data-mt-' + kebabCase(key));\n if (value) {\n domOptions[key] = isNaN(value) ? value : parseInt(value, 10);\n }\n });\n return domOptions;\n }\n\n return MoveTo;\n}();\n\nif (typeof module !== 'undefined') {\n module.exports = MoveTo;\n} else {\n window.MoveTo = MoveTo;\n}"],"mappings":"AAEA;;;;;;;;;;;ACKA;;;;;;;;;;;;;;;;;;;;;;;;ACqEA;;;;;;;;;;;;;;AChCA;;;;;;;;;;;;;;;;;;;;;AC6KA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA;ACjQA;;AAMA;AACA;;;;;;;AAOA;;;;;;;;;AAeA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC0DA;;;;;;;;;;;;;;;;;;;;;;;;ACtNA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuTA;ACjMA;;;;;;;;;;;;;;;;;;;;ACvHA;;;;;;AC4JA;;;;;;;;;;;AChKA;;;;;;;;;;;;;;;ACgBA;;;;;;ACRA","sourceRoot":""}
\ No newline at end of file
diff --git a/packages/docs/bundle.18.js.map b/packages/docs/bundle.18.js.map
index f5e9bdc3850..b0f23cb0519 100644
--- a/packages/docs/bundle.18.js.map
+++ b/packages/docs/bundle.18.js.map
@@ -1 +1 @@
-{"version":3,"file":"bundle.18.js","sources":["webpack:///./docs/Examples/next/Layout.md","webpack:///./packages/next/node_modules/classnames/index.js","webpack:///./packages/printer/src/index.js","webpack:///./packages/next/src/utils.js","webpack:///./packages/next/src/form.js","webpack:///./packages/next/src/fields/array.js","webpack:///./packages/next/src/fields/cards.js","webpack:///./packages/next/src/fields/table.js","webpack:///./packages/next/src/fields/password.js","webpack:///./packages/next/src/components/formButtonGroup.js","webpack:///./packages/next/src/components/button.js","webpack:///./packages/next/src/components/layout.js","webpack:///./packages/next/src/index.js","webpack:///./packages/next/node_modules/moveto/dist/moveTo.js"],"sourcesContent":["\"use strict\";\n\nvar React = require('/Users/wangzhili/uform/node_modules/_react@16.8.6@react/index.js');\n\nvar ReactDOM = require('/Users/wangzhili/uform/node_modules/_react-dom@16.8.6@react-dom/index.js');\n\nvar ReactCodeSnippet = require('/Users/wangzhili/uform/node_modules/_react-code-snippet@0.6.13@react-code-snippet/lib/index.js');\n\nvar ReactPropsTable = require('/Users/wangzhili/uform/node_modules/_react-props-table@0.1.3@react-props-table/lib/index.js');\n\nvar __DEFINE__ = function __DEFINE__(fn) {\n var module = {\n exports: {}\n };\n fn(module, module.exports);\n var component = module.exports.__esModule && module.exports['default'] || module.exports;\n return typeof component === 'function' ? component : function () {\n return React.createElement('div', {}, 'Code snippet should export a component!');\n };\n};\n\nvar Demo_xlbgv_0 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, null, _react[\"default\"].createElement(_next.FormLayout, {\n labelCol: 8,\n wrapperCol: 6\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aaa\",\n type: \"string\",\n title: \"\\u5B57\\u6BB51\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"bbb\",\n type: \"number\",\n title: \"\\u5B57\\u6BB52\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"ccc\",\n type: \"date\",\n title: \"\\u5B57\\u6BB53\"\n })), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 8\n }, _react[\"default\"].createElement(_next.Submit, null, \"\\u63D0\\u4EA4\"), \"\\u200B \", _react[\"default\"].createElement(_next.Reset, null, \"\\u91CD\\u7F6E\"), \"\\u200B\")));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_hpgoo_1 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n inline: true\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aaa\",\n type: \"string\",\n title: \"\\u5B57\\u6BB51\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"bbb\",\n type: \"number\",\n title: \"\\u5B57\\u6BB52\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"ccc\",\n type: \"date\",\n title: \"\\u5B57\\u6BB53\"\n }), \"\\u200B\", _react[\"default\"].createElement(_next.FormButtonGroup, null, _react[\"default\"].createElement(_next.Submit, null, \"\\u63D0\\u4EA4\"), \"\\u200B \", _react[\"default\"].createElement(_next.Reset, null, \"\\u91CD\\u7F6E\"), \"\\u200B\")));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_ptiof_2 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n labelCol: 8,\n wrapperCol: 6\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aaa\",\n type: \"string\",\n title: \"\\u5B57\\u6BB51\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"bbb\",\n type: \"number\",\n title: \"\\u5B57\\u6BB52\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"ccc\",\n type: \"date\",\n title: \"\\u5B57\\u6BB53\"\n }), \"\\u200B\", _react[\"default\"].createElement(_next.FormButtonGroup, {\n sticky: true,\n offset: 8\n }, _react[\"default\"].createElement(_next.Submit, null, \"\\u63D0\\u4EA4\"), \"\\u200B \", _react[\"default\"].createElement(_next.Reset, null, \"\\u91CD\\u7F6E\"), \"\\u200B\")));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_nviip_3 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n labelCol: 8,\n wrapperCol: 6,\n onSubmit: function onSubmit(v) {\n return console.log(v);\n }\n }, _react[\"default\"].createElement(_next.FormCard, {\n title: \"\\u57FA\\u672C\\u4FE1\\u606F\"\n }, \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"aaa\",\n type: \"string\",\n title: \"\\u5B57\\u6BB51\"\n }), \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"bbb\",\n type: \"number\",\n title: \"\\u5B57\\u6BB52\"\n }), \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"ccc\",\n type: \"date\",\n title: \"\\u5B57\\u6BB53\"\n }), \"\\u200B\"), \"\\u200B \", _react[\"default\"].createElement(_next.FormCard, {\n title: \"\\u8BE6\\u7EC6\\u4FE1\\u606F\"\n }, _react[\"default\"].createElement(_next.FormItemGrid, {\n title: \"\\u5B57\\u6BB53\",\n gutter: 10,\n cols: [11, 15]\n }, \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"ddd\",\n type: \"number\"\n }), \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"eee\",\n type: \"date\"\n }), \"\\u200B\"), _react[\"default\"].createElement(_next.Field, {\n type: \"object\",\n name: \"mmm\",\n title: \"\\u5BF9\\u8C61\\u5B57\\u6BB5\"\n }, _react[\"default\"].createElement(_next.FormItemGrid, {\n gutter: 10,\n cols: [11, 15]\n }, \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"ddd1\",\n \"default\": 123,\n type: \"number\"\n }), \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"[startDate,endDate]\",\n type: \"daterange\"\n }), \"\\u200B\")), _react[\"default\"].createElement(_next.Field, {\n name: \"aas\",\n type: \"string\",\n title: \"\\u5B57\\u6BB54\"\n }), \"\\u200B\", _react[\"default\"].createElement(_next.FormBlock, {\n title: \"\\u533A\\u5757\"\n }, \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"ddd2\",\n type: \"string\",\n title: \"\\u5B57\\u6BB55\"\n }), \"\\u200B\", _react[\"default\"].createElement(_next.Field, {\n name: \"eee2\",\n type: \"string\",\n title: \"\\u5B57\\u6BB56\"\n }), \"\\u200B\")), \"\\u200B\", _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 8,\n sticky: true\n }, \"\\u200B \", _react[\"default\"].createElement(_next.Submit, null, \"\\u63D0\\u4EA4\"), \"\\u200B \", _react[\"default\"].createElement(_next.Reset, null, \"\\u91CD\\u7F6E\"), \"\\u200B\")));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_lozej_4 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n onSubmit: function onSubmit(v) {\n return console.log(v);\n }\n }, _react[\"default\"].createElement(_next.FormItemGrid, {\n gutter: 20\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"a1\",\n title: \"\\u67E5\\u8BE2\\u5B57\\u6BB51\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"a2\",\n title: \"\\u67E5\\u8BE2\\u5B57\\u6BB52\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"a3\",\n title: \"\\u67E5\\u8BE2\\u5B57\\u6BB53\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"a4\",\n title: \"\\u67E5\\u8BE2\\u5B57\\u6BB54\"\n })), _react[\"default\"].createElement(_next.FormItemGrid, {\n gutter: 20,\n cols: [6, 6]\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"a5\",\n title: \"\\u67E5\\u8BE2\\u5B57\\u6BB55\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"a6\",\n title: \"\\u67E5\\u8BE2\\u5B57\\u6BB56\"\n })), _react[\"default\"].createElement(_next.FormButtonGroup, {\n style: {\n minWidth: 150\n }\n }, \"\\u200B\", _react[\"default\"].createElement(_next.Submit, null, \"\\u63D0\\u4EA4\"), \"\\u200B\", _react[\"default\"].createElement(_next.Reset, null, \"\\u91CD\\u7F6E\"), \"\\u200B\")));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar __MARKDOWN__ = function __MARKDOWN__() {\n return React.createElement(React.Fragment, {}, React.createElement(\"h1\", {\n id: \"布局\",\n className: \"react-demo-h1\"\n }, \"布局\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"表单布局问题，为什么会存在表单布局问题？\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"主要还是因为数据的输入场景会随业务场景做结构上的优化\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"减少信息噪音，降低误操作概率，最大化提升表单输入效率，所以，表单布局是表单解决\\n方案中很重要的一部分\")), React.createElement(\"h2\", {\n id: \"normal\",\n className: \"react-demo-h2\"\n }, \"Normal\"), React.createElement(\"h4\", {\n id: \"demo-示例\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\nconst App = () => (\\n \\n \\n \\n \\n \\n \\n \\n \\n 提交 重置\\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_xlbgv_0, {})), React.createElement(\"h2\", {\n id: \"inline\",\n className: \"react-demo-h2\"\n }, \"Inline\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"内联布局\")), React.createElement(\"h4\", {\n id: \"demo-示例-1\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n \\n \\n \\n \\n \\n 提交 重置\\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_hpgoo_1, {})), React.createElement(\"h2\", {\n id: \"sticky\",\n className: \"react-demo-h2\"\n }, \"Sticky\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"操作按钮组吸底，主要用于长表单\")), React.createElement(\"h4\", {\n id: \"demo-示例-2\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n \\n \\n \\n \\n \\n 提交 重置\\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_ptiof_2, {})), React.createElement(\"h2\", {\n id: \"nested\",\n className: \"react-demo-h2\"\n }, \"Nested\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"嵌套布局\"), React.createElement(\"ol\", {\n className: \"react-demo-ol\"\n }, React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, \"使用 FormLayout 实现局部控制\\nlabelCol/wrapperCol/size/labelAlign/labelTextAlign\"), React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, \"使用 FormCard 实现卡片式分离表单模块\"), React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, \"使用 FormBlock 实现在卡片内部的区块化分割\"), React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, \"使用 FormItemGrid 实现表单字段的局部网格布局能力\"))), React.createElement(\"h4\", {\n id: \"demo-示例-3\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n console.log(v)}>\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n 提交 重置\\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_nviip_3, {})), React.createElement(\"h2\", {\n id: \"grid\",\n className: \"react-demo-h2\"\n }, \"Grid\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"网格布局，主要用于列表查询场景的筛选项表单布局方式同样，使用 FormItemGrid\")), React.createElement(\"h4\", {\n id: \"demo-示例-4\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n console.log(v)}>\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n 提交重置\\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_lozej_4, {})));\n};\n\n__MARKDOWN__.meta = {\n \"username\": \"zhili.wzl\",\n \"email\": \"wangzhili56@126.com\"\n};\nmodule.exports = __MARKDOWN__;","/*!\n Copyright (c) 2017 Jed Watson.\n Licensed under the MIT License (MIT), see\n http://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = [];\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (!arg) continue;\n\n\t\t\tvar argType = typeof arg;\n\n\t\t\tif (argType === 'string' || argType === 'number') {\n\t\t\t\tclasses.push(arg);\n\t\t\t} else if (Array.isArray(arg) && arg.length) {\n\t\t\t\tvar inner = classNames.apply(null, arg);\n\t\t\t\tif (inner) {\n\t\t\t\t\tclasses.push(inner);\n\t\t\t\t}\n\t\t\t} else if (argType === 'object') {\n\t\t\t\tfor (var key in arg) {\n\t\t\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\t\t\tclasses.push(key);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn classes.join(' ');\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n","import React, { useState } from 'react'\nimport ReactDOM from 'react-dom'\nimport { createFormActions } from '@uform/react'\nimport styled from 'styled-components'\nimport Modal from 'react-modal'\n\nconst Dialog = styled(props => {\n const [visible, setVisible] = useState(true)\n return (\n {\n setVisible(false)\n }}\n >\n {\n setVisible(false)\n }}\n >\n \n \n \n {props.children}\n
\n \n )\n})`\n position: relative;\n margin: 100px;\n padding: 30px;\n height: calc(100% - 200px);\n overflow: auto;\n border: 1px solid #eee;\n background: #fff;\n outline: none;\n .close-btn {\n position: absolute;\n top: 15px;\n right: 10px;\n width: 25px;\n height: 25px;\n cursor: pointer;\n img {\n width: 100%;\n }\n }\n .dialog-content {\n overflow: auto;\n height: 100%;\n }\n`\n\nconst createAlert = (config = {}) => {\n const container = document.createElement('div')\n const unMount = () => {\n ReactDOM.unmountComponentAtNode(container)\n container.parentNode.removeChild(container)\n }\n if (typeof config === 'string' || React.isValidElement(config)) {\n config = {\n content: config\n }\n }\n document.body.appendChild(container)\n ReactDOM.render(\n ,\n container\n )\n}\n\nconst cleanSchema = schema => {\n if (!schema) return\n return {\n type: schema.type,\n 'x-props': schema['x-props'],\n 'x-component': schema['x-component'],\n 'x-index': schema['x-index'],\n 'x-rules': schema['x-rules'],\n maxItems: schema.maxItems,\n minItems: schema.minItems,\n default: schema.default,\n enum: schema.enum,\n title: schema.title,\n required: schema.required,\n\n properties: Object.keys(schema.properties || {}).reduce((buf, key) => {\n buf[key] = cleanSchema(schema.properties[key])\n return buf\n }, {}),\n items: cleanSchema(schema.items)\n }\n}\n\nconst printSchema = schema => {\n return JSON.stringify(cleanSchema(schema), null, 2)\n}\n\nexport default class extends React.Component {\n actions = createFormActions()\n\n onClickHandler = async e => {\n e.preventDefault()\n const schema = await this.actions.getSchema('')\n createAlert(\n \n {printSchema(schema)}\n
\n )\n }\n\n render() {\n const { children, className } = this.props\n if (children && children.props && children.props.actions) {\n this.actions = children.props.actions\n }\n return (\n \n {React.cloneElement(children, {\n actions: this.actions\n })}\n
\n Print JSON Schema\n \n \n {!value ? 'N/A' : value}\n {props.addonTextAfter ? ' ' + props.addonTextAfter : ''}\n {props.addonAfter ? ' ' + props.addonAfter : ''}\n
\n )\n})`\n height: 28px;\n line-height: 28px;\n vertical-align: middle;\n font-size: 13px;\n color: #333;\n &.small {\n height: 20px;\n line-height: 20px;\n }\n &.large {\n height: 40px;\n line-height: 40px;\n }\n`\n\nexport const acceptEnum = component => {\n return ({ dataSource, ...others }) => {\n if (dataSource) {\n return React.createElement(Select, { dataSource, ...others })\n } else {\n return React.createElement(component, others)\n }\n }\n}\n\nexport const mapStyledProps = (props, { loading, size }) => {\n if (loading) {\n props.state = props.state || 'loading'\n }\n if (size) {\n props.size = size\n }\n}\n\nexport const mapTextComponent = (Target, props, { editable, name }) => {\n if (editable !== undefined) {\n if (isFn(editable)) {\n if (!editable(name)) {\n return Text\n }\n } else if (editable === false) {\n return Text\n }\n }\n return Target\n}\n\nexport const compose = (...args) => {\n return (payload, ...extra) => {\n return args.reduce((buf, fn) => {\n return buf !== undefined ? fn(buf, ...extra) : fn(payload, ...extra)\n }, payload)\n }\n}\n\nexport const moveTo = element => {\n if (!element) return\n if (element.scrollIntoView) {\n element.scrollIntoView({\n behavior: 'smooth',\n inline: 'start',\n block: 'start'\n })\n } else {\n new MoveTo().move(element.getBoundingClientRect().top)\n }\n}\n","import React from 'react'\nimport { registerFormWrapper, registerFieldMiddleware } from '@uform/react'\nimport classNames from 'classnames'\nimport { ConfigProvider, Balloon, Icon } from '@alifd/next'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport LOCALE from './locale'\nimport styled from 'styled-components'\nimport { isFn, moveTo } from './utils'\n/**\n * 轻量级Next Form，不包含任何数据管理能力\n *\n */\n\nexport const {\n Provider: FormProvider,\n Consumer: FormConsumer\n} = React.createContext()\n\nconst normalizeCol = col => {\n return typeof col === 'object' ? col : { span: col }\n}\n\nconst getParentNode = (node, selector) => {\n if (!node || (node && !node.matches)) return\n if (node.matches(selector)) return node\n else {\n return getParentNode(node.parentNode || node.parentElement, selector)\n }\n}\n\nexport const FormItem = styled(\n class FormItem extends React.Component {\n static defaultProps = {\n prefix: 'next-'\n }\n\n getItemLabel() {\n const {\n id,\n required,\n label,\n labelCol,\n wrapperCol,\n prefix,\n extra,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n isTableColItem\n } = this.props\n\n if (!label || isTableColItem) {\n return null\n }\n\n const ele = (\n \n )\n\n const cls = classNames({\n [`${prefix}form-item-label`]: true,\n [`${prefix}left`]: labelTextAlign === 'left'\n })\n\n if ((wrapperCol || labelCol) && labelAlign !== 'top') {\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n \n )\n }\n\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n
\n )\n }\n\n getItemWrapper() {\n const {\n labelCol,\n wrapperCol,\n children,\n extra,\n label,\n labelAlign,\n help,\n size,\n prefix,\n noMinHeight,\n isTableColItem\n } = this.props\n\n const message = (\n \n {help && {help}
}\n {!help && extra && extra.length <= 20 && (\n {extra}
\n )}\n \n )\n if (\n (wrapperCol || labelCol) &&\n labelAlign !== 'top' &&\n !isTableColItem &&\n label\n ) {\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n \n )\n }\n\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n
\n )\n }\n\n renderHelper() {\n return (\n }\n >\n {this.props.extra}\n \n )\n }\n\n render() {\n const {\n className,\n labelAlign,\n labelTextAlign,\n style,\n prefix,\n wrapperCol,\n labelCol,\n size,\n help,\n extra,\n noMinHeight,\n isTableColItem,\n validateState,\n autoAddColon,\n required,\n type,\n schema,\n ...others\n } = this.props\n\n const itemClassName = classNames({\n [`${prefix}form-item`]: true,\n [`${prefix}${labelAlign}`]: labelAlign,\n [`has-${validateState}`]: !!validateState,\n [`${prefix}${size}`]: !!size,\n [`${className}`]: !!className,\n [`field-${type}`]: !!type\n })\n\n // 垂直模式并且左对齐才用到\n const Tag = (wrapperCol || labelCol) && labelAlign !== 'top' ? Row : 'div'\n const label = labelAlign === 'inset' ? null : this.getItemLabel()\n\n return (\n \n {label}\n {this.getItemWrapper()}\n \n )\n }\n }\n)`\n margin-bottom: 4px !important;\n &.field-table {\n .next-form-item-control {\n overflow: auto;\n }\n }\n .next-form-item-msg {\n &.next-form-item-space {\n min-height: 20px;\n .next-form-item-help,\n .next-form-item-extra {\n margin-top: 0;\n }\n }\n }\n .next-form-item-extra {\n color: #888;\n font-size: 12px;\n line-height: 1.7;\n }\n`\n\nconst toArr = val => (Array.isArray(val) ? val : val ? [val] : [])\n\nregisterFormWrapper(OriginForm => {\n OriginForm = styled(OriginForm)`\n &.next-inline {\n display: flex;\n .rs-uform-content {\n margin-right: 15px;\n }\n }\n .next-radio-group,\n .next-checkbox-group {\n line-height: 28px;\n & > label {\n margin-right: 8px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 20px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 40px;\n }\n }\n .next-card-head {\n background: none;\n }\n .next-rating-medium {\n min-height: 28px;\n line-height: 28px;\n }\n .next-rating-small {\n min-height: 20px;\n line-height: 20px;\n }\n .next-rating-large {\n min-height: 40px;\n line-height: 40px;\n }\n `\n\n return ConfigProvider.config(\n class Form extends React.Component {\n static defaultProps = {\n component: 'form',\n prefix: 'next-',\n size: 'medium',\n labelAlign: 'left',\n locale: LOCALE,\n autoAddColon: true\n }\n\n static displayName = 'SchemaForm'\n\n FormRef = React.createRef()\n\n validateFailedHandler(onValidateFailed) {\n return (...args) => {\n if (isFn(onValidateFailed)) {\n onValidateFailed(...args)\n }\n const container = this.FormRef.current\n if (container) {\n const errors = container.querySelectorAll('.next-form-item-help')\n if (errors && errors.length) {\n const node = getParentNode(errors[0], '.next-form-item')\n if (node) {\n moveTo(node)\n }\n }\n }\n }\n }\n\n render() {\n const {\n className,\n inline,\n size,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n children,\n component,\n labelCol,\n wrapperCol,\n getErrorScrollOffset,\n errorScrollToElement,\n style,\n prefix,\n ...others\n } = this.props\n const formClassName = classNames({\n [`${prefix}form`]: true,\n [`${prefix}inline`]: inline, // 内联\n [`${prefix}${size}`]: size,\n [className]: !!className\n })\n return (\n \n \n {children}\n \n \n )\n }\n }\n )\n})\n\nconst isTableColItem = (path, getSchema) => {\n const schema = getSchema(path)\n return schema && schema.type === 'array' && schema['x-component'] === 'table'\n}\n\nregisterFieldMiddleware(Field => {\n return props => {\n const { name, editable, errors, path, schema, getSchema, required } = props\n if (path.length === 0) return React.createElement(Field, props) // 根节点是不需要包FormItem的\n return React.createElement(\n FormConsumer,\n {},\n ({\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n size,\n autoAddColon\n }) => {\n return React.createElement(\n FormItem,\n {\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n autoAddColon,\n size,\n ...schema['x-item-props'],\n label: schema.title,\n noMinHeight: schema.type === 'object' && !schema['x-component'],\n isTableColItem: isTableColItem(\n path.slice(0, path.length - 2),\n getSchema\n ),\n type: schema['x-component'] || schema['type'],\n id: name,\n validateState: toArr(errors).length ? 'error' : undefined,\n required: editable === false ? false : required,\n extra: schema.description,\n help:\n toArr(errors).join(' , ') ||\n (schema['x-item-props'] && schema['x-item-props'].help)\n },\n React.createElement(Field, props)\n )\n }\n )\n }\n})\n","import React from 'react'\nimport { registerFormField, createArrayField } from '@uform/react'\nimport { Button, Icon } from '@alifd/next'\nimport styled from 'styled-components'\n\nexport const CircleButton = styled.div.attrs({ className: 'cricle-btn' })`\n ${props =>\n !props.hasText\n ? `width:30px;\n height:30px;`\n : ''}\n margin-right:10px;\n border-radius: ${props => (!props.hasText ? '100px' : 'none')};\n border: ${props => (!props.hasText ? '1px solid #eee' : 'none')};\n margin-bottom:20px;\n cursor:pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 1.3;\n ${props =>\n !props.hasText\n ? `&:hover{\n background:#f7f4f4;\n }`\n : ''}\n .next-icon{\n display:flex;\n align-items:'center'\n }\n .op-name{\n margin-left:3px;\n }\n}\n`\nexport const ArrayField = createArrayField({\n CircleButton,\n TextButton: props => (\n \n ),\n AddIcon: () => ,\n RemoveIcon: () => (\n \n ),\n MoveDownIcon: () => (\n \n ),\n MoveUpIcon: () => (\n \n )\n})\n\nregisterFormField(\n 'array',\n styled(\n class extends ArrayField {\n render() {\n const { className, name, schema, value, renderField } = this.props\n const style = (schema['x-props'] && schema['x-props'].style) || {}\n return (\n \n {value.map((item, index) => {\n return (\n \n
\n {index + 1}\n
\n
{renderField(index)}
\n
\n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n
\n {toArr(value).map((item, index) => {\n return (\n
\n {index + 1}. {title || schema.title}\n \n }\n className='card-list'\n key={index}\n contentHeight='auto'\n extra={this.renderOperations(item, index)}\n >\n {renderField(index)}\n \n )\n })}\n {value.length === 0 && this.renderEmpty(title)}\n \n {value.length > 0 && this.renderAddition()}\n
\n \n {isFn(col.cell)\n ? col.cell(\n record ? record[col.dataIndex] : undefined,\n rowIndex,\n record\n )\n : record\n ? record[col.dataIndex]\n : undefined}\n
\n )\n }\n\n renderTable(columns, dataSource) {\n return (\n \n
\n \n {columns.map((col, index) => {\n return \n })}\n \n \n \n {columns.map((col, index) => {\n return (\n | \n {col.title} \n | \n )\n })}\n
\n \n \n {dataSource.map((record, rowIndex) => {\n return (\n \n {columns.map((col, colIndex) => {\n return (\n | \n {this.renderCell({\n record,\n col,\n rowIndex,\n colIndex\n })}\n | \n )\n })}\n
\n )\n })}\n {this.renderPlacehodler(dataSource, columns)}\n \n
\n
\n | \n \n | \n
\n )\n }\n }\n\n getColumns(children) {\n const columns = []\n React.Children.forEach(children, child => {\n if (React.isValidElement(child)) {\n if (\n child.type === Column ||\n child.type.displayName === '@schema-table-column'\n ) {\n columns.push(child.props)\n }\n }\n })\n\n return columns\n }\n\n render() {\n const columns = this.getColumns(this.props.children)\n const dataSource = toArr(this.props.dataSource)\n return (\n \n
\n
\n {this.renderTable(columns, dataSource)}\n
\n
\n
\n
\n {Object.keys(\n (schema.items && schema.items.properties) || {}\n ).reduce((buf, key) => {\n const itemSchema = schema.items.properties[key]\n const filter = this.createFilter(key, itemSchema)\n const res = filter(\n () => {\n return buf.concat(\n {\n return renderField([index, key])\n }}\n />\n )\n },\n () => {\n return buf\n }\n )\n return res\n }, [])}\n {additionFilter(() => {\n return (\n {\n return (\n \n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n )\n }}\n />\n )\n })}\n
\n {this.renderAddition()}\n
\n \n {checkStrength && this.renderStrength()}\n
\n )\n }\n }\n)`\n .next-input {\n width: 100%;\n position: relative;\n &.input-password input {\n font-size: 16px;\n letter-spacing: 2px;\n }\n input {\n padding-right: 25px;\n }\n .eye {\n position: absolute;\n height: 20px;\n right: 5px;\n top: 50%;\n transform: translate(0, -50%);\n opacity: 0.3;\n cursor: pointer;\n transition: all 0.15s ease-in-out;\n &:hover {\n opacity: 0.6;\n }\n }\n }\n .password-strength-wrapper {\n background: #e0e0e0;\n margin-bottom: 3px;\n position: relative;\n .div {\n position: absolute;\n z-index: 1;\n height: 8px;\n top: 0;\n background: #fff;\n width: 1px;\n transform: translate(-50%, 0);\n }\n .div-1 {\n left: 20%;\n }\n .div-2 {\n left: 40%;\n }\n .div-3 {\n left: 60%;\n }\n .div-4 {\n left: 80%;\n }\n .password-strength-bar {\n position: relative;\n background-image: -webkit-linear-gradient(left, #ff5500, #ff9300);\n transition: all 0.35s ease-in-out;\n height: 8px;\n width: 100%;\n margin-top: 5px;\n }\n }\n`\n\nregisterFormField('password', connect()(Password))\n","import React, { Component } from 'react'\nimport ReactDOM from 'react-dom'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport { FormConsumer } from '../form'\nimport Sticky from 'react-stikky'\nimport cls from 'classnames'\nimport styled from 'styled-components'\n\nconst getAlign = align => {\n if (align === 'start' || align === 'end') return align\n if (align === 'left' || align === 'top') return 'flex-start'\n if (align === 'right' || align === 'bottom') return 'flex-end'\n return align\n}\n\nconst isElementInViewport = (rect, { offset = 0, threshold = 0 } = {}) => {\n const { top, right, bottom, left, width, height } = rect\n const intersection = {\n t: bottom,\n r: window.innerWidth - left,\n b: window.innerHeight - top,\n l: right\n }\n\n const elementThreshold = {\n x: threshold * width,\n y: threshold * height\n }\n\n return (\n intersection.t >= (offset.top || offset + elementThreshold.y) &&\n intersection.r >= (offset.right || offset + elementThreshold.x) &&\n intersection.b >= (offset.bottom || offset + elementThreshold.y) &&\n intersection.l >= (offset.left || offset + elementThreshold.x)\n )\n}\n\nexport const FormButtonGroup = styled(\n class FormButtonGroup extends Component {\n static defaultProps = {\n span: 24,\n zIndex: 100\n }\n\n renderChildren() {\n const { children, itemStyle, offset, span } = this.props\n return (\n \n
\n \n \n \n {children}\n
\n \n \n
\n
\n
\n {({ inline, FormRef } = {}) => {\n if (!FormRef) return\n return (\n \n \n {content}\n
\n \n )\n }}\n \n
\n {children.reduce((buf, child, key) => {\n return child\n ? buf.concat(\n \n {child}\n \n )\n : buf\n }, [])}\n
\n )\n }\n\n render() {\n const { title } = this.props\n if (title) {\n return this.renderFormItem(this.renderGrid())\n } else {\n return this.renderGrid()\n }\n }\n }\n)\n\nexport const FormCard = createVirtualBox(\n 'card',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 30px;\n .next-card-body {\n padding-top: 30px;\n padding-bottom: 0 !important;\n }\n `\n)\n\nexport const FormBlock = createVirtualBox(\n 'block',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 0px;\n .next-card-body {\n padding-top: 20px;\n padding-bottom: 0 !important;\n }\n &.next-card {\n border: none;\n padding: 0 15px;\n padding-bottom: 15px;\n }\n `\n)\n","import './form'\nimport './fields/string'\nimport './fields/number'\nimport './fields/boolean'\nimport './fields/date'\nimport './fields/time'\nimport './fields/range'\nimport './fields/upload'\nimport './fields/checkbox'\nimport './fields/radio'\nimport './fields/rating'\nimport './fields/transfer'\nimport './fields/array'\nimport './fields/cards'\nimport './fields/table'\nimport './fields/password'\nimport { mapStyledProps, mapTextComponent } from './utils'\nimport { SchemaForm } from '@uform/react'\nexport * from '@uform/react'\nexport * from './components/formButtonGroup'\nexport * from './components/button'\nexport * from './components/layout'\nexport { mapStyledProps, mapTextComponent }\nexport default SchemaForm\n","/*!\n * MoveTo - A lightweight scroll animation javascript library without any dependency.\n * Version 1.8.0 (14-01-2019 13:15)\n * Licensed under MIT\n * Copyright 2019 Hasan Aydoğdu \n */\n\n'use strict';\nvar MoveTo = function () {\n /**\n * Defaults\n * @type {object}\n */\n var defaults = {\n tolerance: 0,\n duration: 800,\n easing: 'easeOutQuart',\n container: window,\n callback: function callback() {} };\n\n\n /**\n * easeOutQuart Easing Function\n * @param {number} t - current time\n * @param {number} b - start value\n * @param {number} c - change in value\n * @param {number} d - duration\n * @return {number} - calculated value\n */\n function easeOutQuart(t, b, c, d) {\n t /= d;\n t--;\n return -c * (t * t * t * t - 1) + b;\n }\n\n /**\n * Merge two object\n *\n * @param {object} obj1\n * @param {object} obj2\n * @return {object} merged object\n */\n function mergeObject(obj1, obj2) {\n var obj3 = {};\n Object.keys(obj1).forEach(function (propertyName) {\n obj3[propertyName] = obj1[propertyName];\n });\n\n Object.keys(obj2).forEach(function (propertyName) {\n obj3[propertyName] = obj2[propertyName];\n });\n return obj3;\n };\n\n /**\n * Converts camel case to kebab case\n * @param {string} val the value to be converted\n * @return {string} the converted value\n */\n function kebabCase(val) {\n return val.replace(/([A-Z])/g, function ($1) {\n return '-' + $1.toLowerCase();\n });\n };\n\n /**\n * Count a number of item scrolled top\n * @param {Window|HTMLElement} container\n * @return {number}\n */\n function countScrollTop(container) {\n if (container instanceof HTMLElement) {\n return container.scrollTop;\n }\n return container.pageYOffset;\n };\n\n /**\n * MoveTo Constructor\n * @param {object} options Options\n * @param {object} easeFunctions Custom ease functions\n */\n function MoveTo() {var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};var easeFunctions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n this.options = mergeObject(defaults, options);\n this.easeFunctions = mergeObject({ easeOutQuart: easeOutQuart }, easeFunctions);\n }\n\n /**\n * Register a dom element as trigger\n * @param {HTMLElement} dom Dom trigger element\n * @param {function} callback Callback function\n * @return {function|void} unregister function\n */\n MoveTo.prototype.registerTrigger = function (dom, callback) {var _this = this;\n if (!dom) {\n return;\n }\n\n var href = dom.getAttribute('href') || dom.getAttribute('data-target');\n // The element to be scrolled\n var target = href && href !== '#' ?\n document.getElementById(href.substring(1)) :\n document.body;\n var options = mergeObject(this.options, _getOptionsFromTriggerDom(dom, this.options));\n\n if (typeof callback === 'function') {\n options.callback = callback;\n }\n\n var listener = function listener(e) {\n e.preventDefault();\n _this.move(target, options);\n };\n\n dom.addEventListener('click', listener, false);\n\n return function () {return dom.removeEventListener('click', listener, false);};\n };\n\n /**\n * Move\n * Scrolls to given element by using easeOutQuart function\n * @param {HTMLElement|number} target Target element to be scrolled or target position\n * @param {object} options Custom options\n */\n MoveTo.prototype.move = function (target) {var _this2 = this;var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n if (target !== 0 && !target) {\n return;\n }\n\n options = mergeObject(this.options, options);\n\n var distance = typeof target === 'number' ? target : target.getBoundingClientRect().top;\n var from = countScrollTop(options.container);\n var startTime = null;\n var lastYOffset = void 0;\n distance -= options.tolerance;\n\n // rAF loop\n var loop = function loop(currentTime) {\n var currentYOffset = countScrollTop(_this2.options.container);\n\n if (!startTime) {\n // To starts time from 1, we subtracted 1 from current time\n // If time starts from 1 The first loop will not do anything,\n // because easing value will be zero\n startTime = currentTime - 1;\n }\n\n var timeElapsed = currentTime - startTime;\n\n if (lastYOffset) {\n if (\n distance > 0 && lastYOffset > currentYOffset ||\n distance < 0 && lastYOffset < currentYOffset)\n {\n return options.callback(target);\n }\n }\n lastYOffset = currentYOffset;\n\n var val = _this2.easeFunctions[options.easing](timeElapsed, from, distance, options.duration);\n\n options.container.scroll(0, val);\n\n if (timeElapsed < options.duration) {\n window.requestAnimationFrame(loop);\n } else {\n options.container.scroll(0, distance + from);\n options.callback(target);\n }\n };\n\n window.requestAnimationFrame(loop);\n };\n\n /**\n * Adds custom ease function\n * @param {string} name Ease function name\n * @param {function} fn Ease function\n */\n MoveTo.prototype.addEaseFunction = function (name, fn) {\n this.easeFunctions[name] = fn;\n };\n\n /**\n * Returns options which created from trigger dom element\n * @param {HTMLElement} dom Trigger dom element\n * @param {object} options The instance's options\n * @return {object} The options which created from trigger dom element\n */\n function _getOptionsFromTriggerDom(dom, options) {\n var domOptions = {};\n\n Object.keys(options).forEach(function (key) {\n var value = dom.getAttribute('data-mt-' + kebabCase(key));\n if (value) {\n domOptions[key] = isNaN(value) ? value : parseInt(value, 10);\n }\n });\n return domOptions;\n }\n\n return MoveTo;\n}();\n\nif (typeof module !== 'undefined') {\n module.exports = MoveTo;\n} else {\n window.MoveTo = MoveTo;\n}"],"mappings":"AAEA;;;;;;;;;;;ACKA;;;;;;;;;;;;;;;;;;;;;;;;ACqEA;;;;;;;;;;;;;;AChCA;;;;;;;;;;;;;;;;;;;;;AC6KA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA;ACjQA;;AAMA;AACA;;;;;;;AAOA;;;;;;;;;AAeA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC0DA;;;;;;;;;;;;;;;;;;;;;;;;ACtNA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuTA;ACjMA;;;;;;;;;;;;;;;;;;;;ACvHA;;;;;;AC4JA;;;;;;;;;;;AChKA;;;;;;ACQA","sourceRoot":""}
\ No newline at end of file
+{"version":3,"file":"bundle.18.js","sources":["webpack:///./docs/Examples/next/Layout.md","webpack:///./packages/next/node_modules/classnames/index.js","webpack:///./packages/printer/src/index.js","webpack:///./packages/next/src/utils.js","webpack:///./packages/next/src/form.js","webpack:///./packages/next/src/fields/array.js","webpack:///./packages/next/src/fields/cards.js","webpack:///./packages/next/src/fields/table.js","webpack:///./packages/next/src/fields/password.js","webpack:///./packages/next/src/components/formButtonGroup.js","webpack:///./packages/next/src/components/button.js","webpack:///./packages/next/src/components/layout.js","webpack:///./packages/next/src/index.js","webpack:///./packages/next/node_modules/moveto/dist/moveTo.js"],"sourcesContent":["\"use strict\";\n\nvar React = require('/Users/wangzhili/uform/node_modules/_react@16.8.6@react/index.js');\n\nvar ReactDOM = require('/Users/wangzhili/uform/node_modules/_react-dom@16.8.6@react-dom/index.js');\n\nvar ReactCodeSnippet = require('/Users/wangzhili/uform/node_modules/_react-code-snippet@0.6.13@react-code-snippet/lib/index.js');\n\nvar ReactPropsTable = require('/Users/wangzhili/uform/node_modules/_react-props-table@0.1.3@react-props-table/lib/index.js');\n\nvar __DEFINE__ = function __DEFINE__(fn) {\n var module = {\n exports: {}\n };\n fn(module, module.exports);\n var component = module.exports.__esModule && module.exports['default'] || module.exports;\n return typeof component === 'function' ? component : function () {\n return React.createElement('div', {}, 'Code snippet should export a component!');\n };\n};\n\nvar Demo_ugiuw_0 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, null, _react[\"default\"].createElement(_next.FormLayout, {\n labelCol: 8,\n wrapperCol: 6\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aaa\",\n type: \"string\",\n title: \"\\u5B57\\u6BB51\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"bbb\",\n type: \"number\",\n title: \"\\u5B57\\u6BB52\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"ccc\",\n type: \"date\",\n title: \"\\u5B57\\u6BB53\"\n })), _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 8\n }, _react[\"default\"].createElement(_next.Submit, null, \"\\u63D0\\u4EA4\"), \"\\u200B \", _react[\"default\"].createElement(_next.Reset, null, \"\\u91CD\\u7F6E\"), \"\\u200B\")));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_hblba_1 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n inline: true\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aaa\",\n type: \"string\",\n title: \"\\u5B57\\u6BB51\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"bbb\",\n type: \"number\",\n title: \"\\u5B57\\u6BB52\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"ccc\",\n type: \"date\",\n title: \"\\u5B57\\u6BB53\"\n }), \"\\u200B\", _react[\"default\"].createElement(_next.FormButtonGroup, null, _react[\"default\"].createElement(_next.Submit, null, \"\\u63D0\\u4EA4\"), \"\\u200B \", _react[\"default\"].createElement(_next.Reset, null, \"\\u91CD\\u7F6E\"), \"\\u200B\")));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_atwlk_2 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n labelCol: 8,\n wrapperCol: 6\n }, _react[\"default\"].createElement(_next.Field, {\n name: \"aaa\",\n type: \"string\",\n title: \"\\u5B57\\u6BB51\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"bbb\",\n type: \"number\",\n title: \"\\u5B57\\u6BB52\"\n }), _react[\"default\"].createElement(_next.Field, {\n name: \"ccc\",\n type: \"date\",\n title: \"\\u5B57\\u6BB53\"\n }), \"\\u200B\", _react[\"default\"].createElement(_next.FormButtonGroup, {\n sticky: true,\n offset: 8\n }, _react[\"default\"].createElement(_next.Submit, null, \"\\u63D0\\u4EA4\"), \"\\u200B \", _react[\"default\"].createElement(_next.Reset, null, \"\\u91CD\\u7F6E\"), \"\\u200B\")));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_wcvuv_3 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n labelCol: 8,\n wrapperCol: 6,\n onSubmit: function onSubmit(v) {\n return console.log(v);\n }\n }, _react[\"default\"].createElement(_next.FormCard, {\n title: \"\\u57FA\\u672C\\u4FE1\\u606F\"\n }, \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"aaa\",\n type: \"string\",\n title: \"\\u5B57\\u6BB51\"\n }), \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"bbb\",\n type: \"number\",\n title: \"\\u5B57\\u6BB52\"\n }), \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"ccc\",\n type: \"date\",\n title: \"\\u5B57\\u6BB53\"\n }), \"\\u200B\"), \"\\u200B \", _react[\"default\"].createElement(_next.FormCard, {\n title: \"\\u8BE6\\u7EC6\\u4FE1\\u606F\"\n }, _react[\"default\"].createElement(_next.FormItemGrid, {\n title: \"\\u5B57\\u6BB53\",\n gutter: 10,\n cols: [11, 15]\n }, \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"ddd\",\n type: \"number\"\n }), \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"eee\",\n type: \"date\"\n }), \"\\u200B\"), _react[\"default\"].createElement(_next.Field, {\n type: \"object\",\n name: \"mmm\",\n title: \"\\u5BF9\\u8C61\\u5B57\\u6BB5\"\n }, _react[\"default\"].createElement(_next.FormItemGrid, {\n gutter: 10,\n cols: [11, 15]\n }, \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"ddd1\",\n \"default\": 123,\n type: \"number\"\n }), \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"[startDate,endDate]\",\n type: \"daterange\"\n }), \"\\u200B\")), _react[\"default\"].createElement(_next.Field, {\n name: \"aas\",\n type: \"string\",\n title: \"\\u5B57\\u6BB54\"\n }), \"\\u200B\", _react[\"default\"].createElement(_next.FormBlock, {\n title: \"\\u533A\\u5757\"\n }, \"\\u200B \", _react[\"default\"].createElement(_next.Field, {\n name: \"ddd2\",\n type: \"string\",\n title: \"\\u5B57\\u6BB55\"\n }), \"\\u200B\", _react[\"default\"].createElement(_next.Field, {\n name: \"eee2\",\n type: \"string\",\n title: \"\\u5B57\\u6BB56\"\n }), \"\\u200B\")), \"\\u200B\", _react[\"default\"].createElement(_next.FormButtonGroup, {\n offset: 8,\n sticky: true\n }, \"\\u200B \", _react[\"default\"].createElement(_next.Submit, null, \"\\u63D0\\u4EA4\"), \"\\u200B \", _react[\"default\"].createElement(_next.Reset, null, \"\\u91CD\\u7F6E\"), \"\\u200B\")));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar Demo_rhoin_4 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n exports.__esModule = true;\n exports[\"default\"] = _default;\n\n var _react = _interopRequireDefault(require(\"react\"));\n\n var _reactDom = _interopRequireDefault(require(\"react-dom\"));\n\n var _next = require(\"@uform/next\");\n\n var _next2 = require(\"@alifd/next\");\n\n var _printer = _interopRequireDefault(require(\"@uform/printer\"));\n\n require(\"@alifd/next/dist/next.css\");\n\n var App = function App() {\n return _react[\"default\"].createElement(_printer[\"default\"], null, _react[\"default\"].createElement(_next.SchemaForm, {\n onSubmit: function onSubmit(v) {\n return console.log(v);\n }\n }, _react[\"default\"].createElement(_next.FormItemGrid, {\n gutter: 20\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"a1\",\n title: \"\\u67E5\\u8BE2\\u5B57\\u6BB51\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"a2\",\n title: \"\\u67E5\\u8BE2\\u5B57\\u6BB52\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"a3\",\n title: \"\\u67E5\\u8BE2\\u5B57\\u6BB53\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"a4\",\n title: \"\\u67E5\\u8BE2\\u5B57\\u6BB54\"\n })), _react[\"default\"].createElement(_next.FormItemGrid, {\n gutter: 20,\n cols: [6, 6]\n }, _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"a5\",\n title: \"\\u67E5\\u8BE2\\u5B57\\u6BB55\"\n }), _react[\"default\"].createElement(_next.Field, {\n type: \"string\",\n name: \"a6\",\n title: \"\\u67E5\\u8BE2\\u5B57\\u6BB56\"\n })), _react[\"default\"].createElement(_next.FormButtonGroup, {\n style: {\n minWidth: 150\n }\n }, \"\\u200B\", _react[\"default\"].createElement(_next.Submit, null, \"\\u63D0\\u4EA4\"), \"\\u200B\", _react[\"default\"].createElement(_next.Reset, null, \"\\u91CD\\u7F6E\"), \"\\u200B\")));\n };\n\n function _default() {\n return _react[\"default\"].createElement(App, null);\n }\n});\n\nvar __MARKDOWN__ = function __MARKDOWN__() {\n return React.createElement(React.Fragment, {}, React.createElement(\"h1\", {\n id: \"布局\",\n className: \"react-demo-h1\"\n }, \"布局\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"表单布局问题，为什么会存在表单布局问题？\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"主要还是因为数据的输入场景会随业务场景做结构上的优化\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"减少信息噪音，降低误操作概率，最大化提升表单输入效率，所以，表单布局是表单解决\\n方案中很重要的一部分\")), React.createElement(\"h2\", {\n id: \"normal\",\n className: \"react-demo-h2\"\n }, \"Normal\"), React.createElement(\"h4\", {\n id: \"demo-示例\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\nconst App = () => (\\n \\n \\n \\n \\n \\n \\n \\n \\n 提交 重置\\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_ugiuw_0, {})), React.createElement(\"h2\", {\n id: \"inline\",\n className: \"react-demo-h2\"\n }, \"Inline\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"内联布局\")), React.createElement(\"h4\", {\n id: \"demo-示例-1\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n \\n \\n \\n \\n \\n 提交 重置\\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_hblba_1, {})), React.createElement(\"h2\", {\n id: \"sticky\",\n className: \"react-demo-h2\"\n }, \"Sticky\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"操作按钮组吸底，主要用于长表单\")), React.createElement(\"h4\", {\n id: \"demo-示例-2\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n \\n \\n \\n \\n \\n 提交 重置\\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_atwlk_2, {})), React.createElement(\"h2\", {\n id: \"nested\",\n className: \"react-demo-h2\"\n }, \"Nested\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"嵌套布局\"), React.createElement(\"ol\", {\n className: \"react-demo-ol\"\n }, React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, \"使用 FormLayout 实现局部控制\\nlabelCol/wrapperCol/size/labelAlign/labelTextAlign\"), React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, \"使用 FormCard 实现卡片式分离表单模块\"), React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, \"使用 FormBlock 实现在卡片内部的区块化分割\"), React.createElement(\"li\", {\n className: \"react-demo-li\"\n }, \"使用 FormItemGrid 实现表单字段的局部网格布局能力\"))), React.createElement(\"h4\", {\n id: \"demo-示例-3\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n console.log(v)}>\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n 提交 重置\\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_wcvuv_3, {})), React.createElement(\"h2\", {\n id: \"grid\",\n className: \"react-demo-h2\"\n }, \"Grid\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"网格布局，主要用于列表查询场景的筛选项表单布局方式同样，使用 FormItemGrid\")), React.createElement(\"h4\", {\n id: \"demo-示例-4\",\n className: \"react-demo-h4\"\n }, \"Demo 示例\"), React.createElement(ReactCodeSnippet, {\n code: \"import React from 'react'\\nimport ReactDOM from 'react-dom'\\nimport {\\n SchemaForm,\\n Field,\\n FormButtonGroup,\\n Submit,\\n Reset,\\n FormItemGrid,\\n FormCard,\\n FormBlock,\\n FormLayout\\n} from '@uform/next'\\nimport { Button } from '@alifd/next'\\nimport Printer from '@uform/printer'\\nimport '@alifd/next/dist/next.css'\\n\\nconst App = () => (\\n \\n console.log(v)}>\\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n \\n 提交重置\\n \\n \\n \\n)\\nReactDOM.render(, document.getElementById('root'))\\n\",\n justCode: false,\n lang: \"jsx\"\n }, React.createElement(Demo_rhoin_4, {})));\n};\n\n__MARKDOWN__.meta = {\n \"username\": \"zhili.wzl\",\n \"email\": \"wangzhili56@126.com\"\n};\nmodule.exports = __MARKDOWN__;","/*!\n Copyright (c) 2017 Jed Watson.\n Licensed under the MIT License (MIT), see\n http://jedwatson.github.io/classnames\n*/\n/* global define */\n\n(function () {\n\t'use strict';\n\n\tvar hasOwn = {}.hasOwnProperty;\n\n\tfunction classNames () {\n\t\tvar classes = [];\n\n\t\tfor (var i = 0; i < arguments.length; i++) {\n\t\t\tvar arg = arguments[i];\n\t\t\tif (!arg) continue;\n\n\t\t\tvar argType = typeof arg;\n\n\t\t\tif (argType === 'string' || argType === 'number') {\n\t\t\t\tclasses.push(arg);\n\t\t\t} else if (Array.isArray(arg) && arg.length) {\n\t\t\t\tvar inner = classNames.apply(null, arg);\n\t\t\t\tif (inner) {\n\t\t\t\t\tclasses.push(inner);\n\t\t\t\t}\n\t\t\t} else if (argType === 'object') {\n\t\t\t\tfor (var key in arg) {\n\t\t\t\t\tif (hasOwn.call(arg, key) && arg[key]) {\n\t\t\t\t\t\tclasses.push(key);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn classes.join(' ');\n\t}\n\n\tif (typeof module !== 'undefined' && module.exports) {\n\t\tclassNames.default = classNames;\n\t\tmodule.exports = classNames;\n\t} else if (typeof define === 'function' && typeof define.amd === 'object' && define.amd) {\n\t\t// register as 'classnames', consistent with npm package name\n\t\tdefine('classnames', [], function () {\n\t\t\treturn classNames;\n\t\t});\n\t} else {\n\t\twindow.classNames = classNames;\n\t}\n}());\n","import React, { useState } from 'react'\nimport ReactDOM from 'react-dom'\nimport { createFormActions } from '@uform/react'\nimport styled from 'styled-components'\nimport Modal from 'react-modal'\n\nconst Dialog = styled(props => {\n const [visible, setVisible] = useState(true)\n return (\n {\n setVisible(false)\n }}\n >\n {\n setVisible(false)\n }}\n >\n \n \n \n {props.children}\n
\n \n )\n})`\n position: relative;\n margin: 100px;\n padding: 30px;\n height: calc(100% - 200px);\n overflow: auto;\n border: 1px solid #eee;\n background: #fff;\n outline: none;\n .close-btn {\n position: absolute;\n top: 15px;\n right: 10px;\n width: 25px;\n height: 25px;\n cursor: pointer;\n img {\n width: 100%;\n }\n }\n .dialog-content {\n overflow: auto;\n height: 100%;\n }\n`\n\nconst createAlert = (config = {}) => {\n const container = document.createElement('div')\n const unMount = () => {\n ReactDOM.unmountComponentAtNode(container)\n container.parentNode.removeChild(container)\n }\n if (typeof config === 'string' || React.isValidElement(config)) {\n config = {\n content: config\n }\n }\n document.body.appendChild(container)\n ReactDOM.render(\n ,\n container\n )\n}\n\nconst cleanSchema = schema => {\n if (!schema) return\n return {\n type: schema.type,\n 'x-props': schema['x-props'],\n 'x-component': schema['x-component'],\n 'x-index': schema['x-index'],\n 'x-rules': schema['x-rules'],\n maxItems: schema.maxItems,\n minItems: schema.minItems,\n default: schema.default,\n enum: schema.enum,\n title: schema.title,\n required: schema.required,\n\n properties: Object.keys(schema.properties || {}).reduce((buf, key) => {\n buf[key] = cleanSchema(schema.properties[key])\n return buf\n }, {}),\n items: cleanSchema(schema.items)\n }\n}\n\nconst printSchema = schema => {\n return JSON.stringify(cleanSchema(schema), null, 2)\n}\n\nexport default class extends React.Component {\n actions = createFormActions()\n\n onClickHandler = async e => {\n e.preventDefault()\n const schema = await this.actions.getSchema('')\n createAlert(\n \n {printSchema(schema)}\n
\n )\n }\n\n render() {\n const { children, className } = this.props\n if (children && children.props && children.props.actions) {\n this.actions = children.props.actions\n }\n return (\n \n {React.cloneElement(children, {\n actions: this.actions\n })}\n
\n Print JSON Schema\n \n \n {!value ? 'N/A' : value}\n {props.addonTextAfter ? ' ' + props.addonTextAfter : ''}\n {props.addonAfter ? ' ' + props.addonAfter : ''}\n
\n )\n})`\n height: 28px;\n line-height: 28px;\n vertical-align: middle;\n font-size: 13px;\n color: #333;\n &.small {\n height: 20px;\n line-height: 20px;\n }\n &.large {\n height: 40px;\n line-height: 40px;\n }\n`\n\nexport const acceptEnum = component => {\n return ({ dataSource, ...others }) => {\n if (dataSource) {\n return React.createElement(Select, { dataSource, ...others })\n } else {\n return React.createElement(component, others)\n }\n }\n}\n\nexport const mapStyledProps = (props, { loading, size }) => {\n if (loading) {\n props.state = props.state || 'loading'\n }\n if (size) {\n props.size = size\n }\n}\n\nexport const mapTextComponent = (Target, props, { editable, name }) => {\n if (editable !== undefined) {\n if (isFn(editable)) {\n if (!editable(name)) {\n return Text\n }\n } else if (editable === false) {\n return Text\n }\n }\n return Target\n}\n\nexport const compose = (...args) => {\n return (payload, ...extra) => {\n return args.reduce((buf, fn) => {\n return buf !== undefined ? fn(buf, ...extra) : fn(payload, ...extra)\n }, payload)\n }\n}\n\nexport const moveTo = element => {\n if (!element) return\n if (element.scrollIntoView) {\n element.scrollIntoView({\n behavior: 'smooth',\n inline: 'start',\n block: 'start'\n })\n } else {\n new MoveTo().move(element.getBoundingClientRect().top)\n }\n}\n","import React from 'react'\nimport { registerFormWrapper, registerFieldMiddleware } from '@uform/react'\nimport classNames from 'classnames'\nimport { ConfigProvider, Balloon, Icon } from '@alifd/next'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport LOCALE from './locale'\nimport styled from 'styled-components'\nimport { isFn, moveTo } from './utils'\n/**\n * 轻量级Next Form，不包含任何数据管理能力\n *\n */\n\nexport const {\n Provider: FormProvider,\n Consumer: FormConsumer\n} = React.createContext()\n\nconst normalizeCol = col => {\n return typeof col === 'object' ? col : { span: col }\n}\n\nconst getParentNode = (node, selector) => {\n if (!node || (node && !node.matches)) return\n if (node.matches(selector)) return node\n else {\n return getParentNode(node.parentNode || node.parentElement, selector)\n }\n}\n\nexport const FormItem = styled(\n class FormItem extends React.Component {\n static defaultProps = {\n prefix: 'next-'\n }\n\n getItemLabel() {\n const {\n id,\n required,\n label,\n labelCol,\n wrapperCol,\n prefix,\n extra,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n isTableColItem\n } = this.props\n\n if (!label || isTableColItem) {\n return null\n }\n\n const ele = (\n \n )\n\n const cls = classNames({\n [`${prefix}form-item-label`]: true,\n [`${prefix}left`]: labelTextAlign === 'left'\n })\n\n if ((wrapperCol || labelCol) && labelAlign !== 'top') {\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n \n )\n }\n\n return (\n \n {ele}\n {((extra && extra.length > 20) || React.isValidElement(extra)) &&\n this.renderHelper()}\n
\n )\n }\n\n getItemWrapper() {\n const {\n labelCol,\n wrapperCol,\n children,\n extra,\n label,\n labelAlign,\n help,\n size,\n prefix,\n noMinHeight,\n isTableColItem\n } = this.props\n\n const message = (\n \n {help && {help}
}\n {!help && extra && extra.length <= 20 && (\n {extra}
\n )}\n \n )\n if (\n (wrapperCol || labelCol) &&\n labelAlign !== 'top' &&\n !isTableColItem &&\n label\n ) {\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n \n )\n }\n\n return (\n \n {React.cloneElement(children, { size })}\n {message}\n
\n )\n }\n\n renderHelper() {\n return (\n }\n >\n {this.props.extra}\n \n )\n }\n\n render() {\n const {\n className,\n labelAlign,\n labelTextAlign,\n style,\n prefix,\n wrapperCol,\n labelCol,\n size,\n help,\n extra,\n noMinHeight,\n isTableColItem,\n validateState,\n autoAddColon,\n required,\n type,\n schema,\n ...others\n } = this.props\n\n const itemClassName = classNames({\n [`${prefix}form-item`]: true,\n [`${prefix}${labelAlign}`]: labelAlign,\n [`has-${validateState}`]: !!validateState,\n [`${prefix}${size}`]: !!size,\n [`${className}`]: !!className,\n [`field-${type}`]: !!type\n })\n\n // 垂直模式并且左对齐才用到\n const Tag = (wrapperCol || labelCol) && labelAlign !== 'top' ? Row : 'div'\n const label = labelAlign === 'inset' ? null : this.getItemLabel()\n\n return (\n \n {label}\n {this.getItemWrapper()}\n \n )\n }\n }\n)`\n margin-bottom: 4px !important;\n &.field-table {\n .next-form-item-control {\n overflow: auto;\n }\n }\n .next-form-item-msg {\n &.next-form-item-space {\n min-height: 20px;\n .next-form-item-help,\n .next-form-item-extra {\n margin-top: 0;\n }\n }\n }\n .next-form-item-extra {\n color: #888;\n font-size: 12px;\n line-height: 1.7;\n }\n`\n\nconst toArr = val => (Array.isArray(val) ? val : val ? [val] : [])\n\nregisterFormWrapper(OriginForm => {\n OriginForm = styled(OriginForm)`\n &.next-inline {\n display: flex;\n .rs-uform-content {\n margin-right: 15px;\n }\n }\n .next-radio-group,\n .next-checkbox-group {\n line-height: 28px;\n & > label {\n margin-right: 8px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 20px;\n }\n }\n .next-small {\n .next-radio-group,\n .next-checkbox-group {\n line-height: 40px;\n }\n }\n .next-card-head {\n background: none;\n }\n .next-rating-medium {\n min-height: 28px;\n line-height: 28px;\n }\n .next-rating-small {\n min-height: 20px;\n line-height: 20px;\n }\n .next-rating-large {\n min-height: 40px;\n line-height: 40px;\n }\n `\n\n return ConfigProvider.config(\n class Form extends React.Component {\n static defaultProps = {\n component: 'form',\n prefix: 'next-',\n size: 'medium',\n labelAlign: 'left',\n locale: LOCALE,\n autoAddColon: true\n }\n\n static displayName = 'SchemaForm'\n\n FormRef = React.createRef()\n\n validateFailedHandler(onValidateFailed) {\n return (...args) => {\n if (isFn(onValidateFailed)) {\n onValidateFailed(...args)\n }\n const container = this.FormRef.current\n if (container) {\n const errors = container.querySelectorAll('.next-form-item-help')\n if (errors && errors.length) {\n const node = getParentNode(errors[0], '.next-form-item')\n if (node) {\n moveTo(node)\n }\n }\n }\n }\n }\n\n render() {\n const {\n className,\n inline,\n size,\n labelAlign,\n labelTextAlign,\n autoAddColon,\n children,\n component,\n labelCol,\n wrapperCol,\n getErrorScrollOffset,\n errorScrollToElement,\n style,\n prefix,\n ...others\n } = this.props\n const formClassName = classNames({\n [`${prefix}form`]: true,\n [`${prefix}inline`]: inline, // 内联\n [`${prefix}${size}`]: size,\n [className]: !!className\n })\n return (\n \n \n {children}\n \n \n )\n }\n }\n )\n})\n\nconst isTableColItem = (path, getSchema) => {\n const schema = getSchema(path)\n return schema && schema.type === 'array' && schema['x-component'] === 'table'\n}\n\nregisterFieldMiddleware(Field => {\n return props => {\n const { name, editable, errors, path, schema, getSchema, required } = props\n if (path.length === 0) return React.createElement(Field, props) // 根节点是不需要包FormItem的\n return React.createElement(\n FormConsumer,\n {},\n ({\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n size,\n autoAddColon\n }) => {\n return React.createElement(\n FormItem,\n {\n labelAlign,\n labelTextAlign,\n labelCol,\n wrapperCol,\n autoAddColon,\n size,\n ...schema['x-item-props'],\n label: schema.title,\n noMinHeight: schema.type === 'object' && !schema['x-component'],\n isTableColItem: isTableColItem(\n path.slice(0, path.length - 2),\n getSchema\n ),\n type: schema['x-component'] || schema['type'],\n id: name,\n validateState: toArr(errors).length ? 'error' : undefined,\n required: editable === false ? false : required,\n extra: schema.description,\n help:\n toArr(errors).join(' , ') ||\n (schema['x-item-props'] && schema['x-item-props'].help)\n },\n React.createElement(Field, props)\n )\n }\n )\n }\n})\n","import React from 'react'\nimport { registerFormField, createArrayField } from '@uform/react'\nimport { Button, Icon } from '@alifd/next'\nimport styled from 'styled-components'\n\nexport const CircleButton = styled.div.attrs({ className: 'cricle-btn' })`\n ${props =>\n !props.hasText\n ? `width:30px;\n height:30px;`\n : ''}\n margin-right:10px;\n border-radius: ${props => (!props.hasText ? '100px' : 'none')};\n border: ${props => (!props.hasText ? '1px solid #eee' : 'none')};\n margin-bottom:20px;\n cursor:pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n line-height: 1.3;\n ${props =>\n !props.hasText\n ? `&:hover{\n background:#f7f4f4;\n }`\n : ''}\n .next-icon{\n display:flex;\n align-items:'center'\n }\n .op-name{\n margin-left:3px;\n }\n}\n`\nexport const ArrayField = createArrayField({\n CircleButton,\n TextButton: props => (\n \n ),\n AddIcon: () => ,\n RemoveIcon: () => (\n \n ),\n MoveDownIcon: () => (\n \n ),\n MoveUpIcon: () => (\n \n )\n})\n\nregisterFormField(\n 'array',\n styled(\n class extends ArrayField {\n render() {\n const { className, name, schema, value, renderField } = this.props\n const style = (schema['x-props'] && schema['x-props'].style) || {}\n return (\n \n {value.map((item, index) => {\n return (\n \n
\n {index + 1}\n
\n
{renderField(index)}
\n
\n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n
\n {toArr(value).map((item, index) => {\n return (\n
\n {index + 1}. {title || schema.title}\n \n }\n className='card-list'\n key={index}\n contentHeight='auto'\n extra={this.renderOperations(item, index)}\n >\n {renderField(index)}\n \n )\n })}\n {value.length === 0 && this.renderEmpty(title)}\n \n {value.length > 0 && this.renderAddition()}\n
\n \n {isFn(col.cell)\n ? col.cell(\n record ? record[col.dataIndex] : undefined,\n rowIndex,\n record\n )\n : record\n ? record[col.dataIndex]\n : undefined}\n
\n )\n }\n\n renderTable(columns, dataSource) {\n return (\n \n
\n \n {columns.map((col, index) => {\n return \n })}\n \n \n \n {columns.map((col, index) => {\n return (\n | \n {col.title} \n | \n )\n })}\n
\n \n \n {dataSource.map((record, rowIndex) => {\n return (\n \n {columns.map((col, colIndex) => {\n return (\n | \n {this.renderCell({\n record,\n col,\n rowIndex,\n colIndex\n })}\n | \n )\n })}\n
\n )\n })}\n {this.renderPlacehodler(dataSource, columns)}\n \n
\n
\n | \n \n | \n
\n )\n }\n }\n\n getColumns(children) {\n const columns = []\n React.Children.forEach(children, child => {\n if (React.isValidElement(child)) {\n if (\n child.type === Column ||\n child.type.displayName === '@schema-table-column'\n ) {\n columns.push(child.props)\n }\n }\n })\n\n return columns\n }\n\n render() {\n const columns = this.getColumns(this.props.children)\n const dataSource = toArr(this.props.dataSource)\n return (\n \n
\n
\n {this.renderTable(columns, dataSource)}\n
\n
\n
\n
\n {Object.keys(\n (schema.items && schema.items.properties) || {}\n ).reduce((buf, key) => {\n const itemSchema = schema.items.properties[key]\n const filter = this.createFilter(key, itemSchema)\n const res = filter(\n () => {\n return buf.concat(\n {\n return renderField([index, key])\n }}\n />\n )\n },\n () => {\n return buf\n }\n )\n return res\n }, [])}\n {additionFilter(() => {\n return (\n {\n return (\n \n {this.renderRemove(index, item)}\n {this.renderMoveDown(index, item)}\n {this.renderMoveUp(index, item)}\n
\n )\n }}\n />\n )\n })}\n
\n {this.renderAddition()}\n
\n \n {checkStrength && this.renderStrength()}\n
\n )\n }\n }\n)`\n .next-input {\n width: 100%;\n position: relative;\n &.input-password input {\n font-size: 16px;\n letter-spacing: 2px;\n }\n input {\n padding-right: 25px;\n }\n .eye {\n position: absolute;\n height: 20px;\n right: 5px;\n top: 50%;\n transform: translate(0, -50%);\n opacity: 0.3;\n cursor: pointer;\n transition: all 0.15s ease-in-out;\n &:hover {\n opacity: 0.6;\n }\n }\n }\n .password-strength-wrapper {\n background: #e0e0e0;\n margin-bottom: 3px;\n position: relative;\n .div {\n position: absolute;\n z-index: 1;\n height: 8px;\n top: 0;\n background: #fff;\n width: 1px;\n transform: translate(-50%, 0);\n }\n .div-1 {\n left: 20%;\n }\n .div-2 {\n left: 40%;\n }\n .div-3 {\n left: 60%;\n }\n .div-4 {\n left: 80%;\n }\n .password-strength-bar {\n position: relative;\n background-image: -webkit-linear-gradient(left, #ff5500, #ff9300);\n transition: all 0.35s ease-in-out;\n height: 8px;\n width: 100%;\n margin-top: 5px;\n }\n }\n`\n\nregisterFormField('password', connect()(Password))\n","import React, { Component } from 'react'\nimport ReactDOM from 'react-dom'\nimport { Row, Col } from '@alifd/next/lib/grid'\nimport { FormConsumer } from '../form'\nimport Sticky from 'react-stikky'\nimport cls from 'classnames'\nimport styled from 'styled-components'\n\nconst getAlign = align => {\n if (align === 'start' || align === 'end') return align\n if (align === 'left' || align === 'top') return 'flex-start'\n if (align === 'right' || align === 'bottom') return 'flex-end'\n return align\n}\n\nconst isElementInViewport = (rect, { offset = 0, threshold = 0 } = {}) => {\n const { top, right, bottom, left, width, height } = rect\n const intersection = {\n t: bottom,\n r: window.innerWidth - left,\n b: window.innerHeight - top,\n l: right\n }\n\n const elementThreshold = {\n x: threshold * width,\n y: threshold * height\n }\n\n return (\n intersection.t >= (offset.top || offset + elementThreshold.y) &&\n intersection.r >= (offset.right || offset + elementThreshold.x) &&\n intersection.b >= (offset.bottom || offset + elementThreshold.y) &&\n intersection.l >= (offset.left || offset + elementThreshold.x)\n )\n}\n\nexport const FormButtonGroup = styled(\n class FormButtonGroup extends Component {\n static defaultProps = {\n span: 24,\n zIndex: 100\n }\n\n renderChildren() {\n const { children, itemStyle, offset, span } = this.props\n return (\n \n
\n \n \n \n {children}\n
\n \n \n
\n
\n
\n {({ inline, FormRef } = {}) => {\n if (!FormRef) return\n return (\n \n \n {content}\n
\n \n )\n }}\n \n
\n {children.reduce((buf, child, key) => {\n return child\n ? buf.concat(\n \n {child}\n \n )\n : buf\n }, [])}\n
\n )\n }\n\n render() {\n const { title } = this.props\n if (title) {\n return this.renderFormItem(this.renderGrid())\n } else {\n return this.renderGrid()\n }\n }\n }\n)\n\nexport const FormCard = createVirtualBox(\n 'card',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 30px;\n .next-card-body {\n padding-top: 30px;\n padding-bottom: 0 !important;\n }\n `\n)\n\nexport const FormBlock = createVirtualBox(\n 'block',\n styled(\n class extends Component {\n static defaultProps = {\n contentHeight: 'auto'\n }\n render() {\n const { children, className, ...props } = this.props\n return (\n \n {children}\n \n )\n }\n }\n )`\n margin-bottom: 0px;\n .next-card-body {\n padding-top: 20px;\n padding-bottom: 0 !important;\n }\n &.next-card {\n border: none;\n padding: 0 15px;\n padding-bottom: 15px;\n }\n `\n)\n","import './form'\nimport './fields/string'\nimport './fields/number'\nimport './fields/boolean'\nimport './fields/date'\nimport './fields/time'\nimport './fields/range'\nimport './fields/upload'\nimport './fields/checkbox'\nimport './fields/radio'\nimport './fields/rating'\nimport './fields/transfer'\nimport './fields/array'\nimport './fields/cards'\nimport './fields/table'\nimport './fields/password'\nimport { mapStyledProps, mapTextComponent } from './utils'\nimport { SchemaForm } from '@uform/react'\nexport * from '@uform/react'\nexport * from './components/formButtonGroup'\nexport * from './components/button'\nexport * from './components/layout'\nexport { mapStyledProps, mapTextComponent }\nexport default SchemaForm\n","/*!\n * MoveTo - A lightweight scroll animation javascript library without any dependency.\n * Version 1.8.0 (14-01-2019 13:15)\n * Licensed under MIT\n * Copyright 2019 Hasan Aydoğdu \n */\n\n'use strict';\nvar MoveTo = function () {\n /**\n * Defaults\n * @type {object}\n */\n var defaults = {\n tolerance: 0,\n duration: 800,\n easing: 'easeOutQuart',\n container: window,\n callback: function callback() {} };\n\n\n /**\n * easeOutQuart Easing Function\n * @param {number} t - current time\n * @param {number} b - start value\n * @param {number} c - change in value\n * @param {number} d - duration\n * @return {number} - calculated value\n */\n function easeOutQuart(t, b, c, d) {\n t /= d;\n t--;\n return -c * (t * t * t * t - 1) + b;\n }\n\n /**\n * Merge two object\n *\n * @param {object} obj1\n * @param {object} obj2\n * @return {object} merged object\n */\n function mergeObject(obj1, obj2) {\n var obj3 = {};\n Object.keys(obj1).forEach(function (propertyName) {\n obj3[propertyName] = obj1[propertyName];\n });\n\n Object.keys(obj2).forEach(function (propertyName) {\n obj3[propertyName] = obj2[propertyName];\n });\n return obj3;\n };\n\n /**\n * Converts camel case to kebab case\n * @param {string} val the value to be converted\n * @return {string} the converted value\n */\n function kebabCase(val) {\n return val.replace(/([A-Z])/g, function ($1) {\n return '-' + $1.toLowerCase();\n });\n };\n\n /**\n * Count a number of item scrolled top\n * @param {Window|HTMLElement} container\n * @return {number}\n */\n function countScrollTop(container) {\n if (container instanceof HTMLElement) {\n return container.scrollTop;\n }\n return container.pageYOffset;\n };\n\n /**\n * MoveTo Constructor\n * @param {object} options Options\n * @param {object} easeFunctions Custom ease functions\n */\n function MoveTo() {var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};var easeFunctions = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n this.options = mergeObject(defaults, options);\n this.easeFunctions = mergeObject({ easeOutQuart: easeOutQuart }, easeFunctions);\n }\n\n /**\n * Register a dom element as trigger\n * @param {HTMLElement} dom Dom trigger element\n * @param {function} callback Callback function\n * @return {function|void} unregister function\n */\n MoveTo.prototype.registerTrigger = function (dom, callback) {var _this = this;\n if (!dom) {\n return;\n }\n\n var href = dom.getAttribute('href') || dom.getAttribute('data-target');\n // The element to be scrolled\n var target = href && href !== '#' ?\n document.getElementById(href.substring(1)) :\n document.body;\n var options = mergeObject(this.options, _getOptionsFromTriggerDom(dom, this.options));\n\n if (typeof callback === 'function') {\n options.callback = callback;\n }\n\n var listener = function listener(e) {\n e.preventDefault();\n _this.move(target, options);\n };\n\n dom.addEventListener('click', listener, false);\n\n return function () {return dom.removeEventListener('click', listener, false);};\n };\n\n /**\n * Move\n * Scrolls to given element by using easeOutQuart function\n * @param {HTMLElement|number} target Target element to be scrolled or target position\n * @param {object} options Custom options\n */\n MoveTo.prototype.move = function (target) {var _this2 = this;var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};\n if (target !== 0 && !target) {\n return;\n }\n\n options = mergeObject(this.options, options);\n\n var distance = typeof target === 'number' ? target : target.getBoundingClientRect().top;\n var from = countScrollTop(options.container);\n var startTime = null;\n var lastYOffset = void 0;\n distance -= options.tolerance;\n\n // rAF loop\n var loop = function loop(currentTime) {\n var currentYOffset = countScrollTop(_this2.options.container);\n\n if (!startTime) {\n // To starts time from 1, we subtracted 1 from current time\n // If time starts from 1 The first loop will not do anything,\n // because easing value will be zero\n startTime = currentTime - 1;\n }\n\n var timeElapsed = currentTime - startTime;\n\n if (lastYOffset) {\n if (\n distance > 0 && lastYOffset > currentYOffset ||\n distance < 0 && lastYOffset < currentYOffset)\n {\n return options.callback(target);\n }\n }\n lastYOffset = currentYOffset;\n\n var val = _this2.easeFunctions[options.easing](timeElapsed, from, distance, options.duration);\n\n options.container.scroll(0, val);\n\n if (timeElapsed < options.duration) {\n window.requestAnimationFrame(loop);\n } else {\n options.container.scroll(0, distance + from);\n options.callback(target);\n }\n };\n\n window.requestAnimationFrame(loop);\n };\n\n /**\n * Adds custom ease function\n * @param {string} name Ease function name\n * @param {function} fn Ease function\n */\n MoveTo.prototype.addEaseFunction = function (name, fn) {\n this.easeFunctions[name] = fn;\n };\n\n /**\n * Returns options which created from trigger dom element\n * @param {HTMLElement} dom Trigger dom element\n * @param {object} options The instance's options\n * @return {object} The options which created from trigger dom element\n */\n function _getOptionsFromTriggerDom(dom, options) {\n var domOptions = {};\n\n Object.keys(options).forEach(function (key) {\n var value = dom.getAttribute('data-mt-' + kebabCase(key));\n if (value) {\n domOptions[key] = isNaN(value) ? value : parseInt(value, 10);\n }\n });\n return domOptions;\n }\n\n return MoveTo;\n}();\n\nif (typeof module !== 'undefined') {\n module.exports = MoveTo;\n} else {\n window.MoveTo = MoveTo;\n}"],"mappings":"AAEA;;;;;;;;;;;ACKA;;;;;;;;;;;;;;;;;;;;;;;;ACqEA;;;;;;;;;;;;;;AChCA;;;;;;;;;;;;;;;;;;;;;AC6KA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8CA;ACjQA;;AAMA;AACA;;;;;;;AAOA;;;;;;;;;AAeA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC5BA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0JA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC0DA;;;;;;;;;;;;;;;;;;;;;;;;ACtNA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuTA;ACjMA;;;;;;;;;;;;;;;;;;;;ACvHA;;;;;;AC4JA;;;;;;;;;;;AChKA;;;;;;ACQA","sourceRoot":""}
\ No newline at end of file
diff --git a/packages/docs/bundle.49.js.map b/packages/docs/bundle.49.js.map
index f1c6cc7cb28..975e4fba968 100644
--- a/packages/docs/bundle.49.js.map
+++ b/packages/docs/bundle.49.js.map
@@ -1 +1 @@
-{"version":3,"file":"bundle.49.js","sources":["webpack:///./docs/API/registerFormFields.md"],"sourcesContent":["\"use strict\";\n\nvar React = require('/Users/wangzhili/uform/node_modules/_react@16.8.6@react/index.js');\n\nvar ReactDOM = require('/Users/wangzhili/uform/node_modules/_react-dom@16.8.6@react-dom/index.js');\n\nvar ReactCodeSnippet = require('/Users/wangzhili/uform/node_modules/_react-code-snippet@0.6.13@react-code-snippet/lib/index.js');\n\nvar ReactPropsTable = require('/Users/wangzhili/uform/node_modules/_react-props-table@0.1.3@react-props-table/lib/index.js');\n\nvar __DEFINE__ = function __DEFINE__(fn) {\n var module = {\n exports: {}\n };\n fn(module, module.exports);\n var component = module.exports.__esModule && module.exports['default'] || module.exports;\n return typeof component === 'function' ? component : function () {\n return React.createElement('div', {}, 'Code snippet should export a component!');\n };\n};\n\nvar Demo_gwawt_3 = __DEFINE__(function (module, exports) {\n var _interopRequireDefault = require(\"@babel/runtime/helpers/interopRequireDefault\");\n\n var _extends2 = _interopRequireDefault(require(\"@babel/runtime/helpers/extends\"));\n\n var _react = require(\"@uform/react\");\n\n (0, _react.registerFormFields)({\n string: (0, _react.connect)()(function (props) {\n return React.createElement(\"input\", (0, _extends2[\"default\"])({}, props, {\n value: props.value || ''\n }));\n })\n });\n});\n\nvar __MARKDOWN__ = function __MARKDOWN__() {\n return React.createElement(React.Fragment, {}, React.createElement(\"h1\", {\n id: \"registerformfields\",\n className: \"react-demo-h1\"\n }, \"registerFormFields\"), React.createElement(\"h2\", {\n id: \"介绍\",\n className: \"react-demo-h2\"\n }, \"介绍\"), React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"批量注册一个表单字段组件\"), React.createElement(\"h2\", {\n id: \"类型描述\",\n className: \"react-demo-h2\"\n }, \"类型描述\"), React.createElement(ReactCodeSnippet, {\n code: \"type registerFormField(\\n [name : String] : Function \\n)\\n\",\n justCode: true,\n lang: \"typescript\"\n }), React.createElement(\"h2\", {\n id: \"依赖\",\n className: \"react-demo-h2\"\n }, \"依赖\"), React.createElement(ReactCodeSnippet, {\n code: \"import {registerFormFields} from '@uform/react'\\n\",\n justCode: true,\n lang: \"javascript\"\n }), React.createElement(\"h2\", {\n id: \"api\",\n className: \"react-demo-h2\"\n }, \"API\"), React.createElement(\"blockquote\", {\n className: \"react-demo-blockquote\"\n }, React.createElement(\"p\", {\n className: \"react-demo-p\"\n }, \"注册的组件将会接收以下属性列表\")), React.createElement(ReactCodeSnippet, {\n code: \"type FieldRenderProps {\\n name : String,//字段数据路径\\n path : Array,//字段数组数据路径\\n value : any,//字段值\\n errors : Array,//字段错误消息集合\\n editable : Boolean | Function,//字段是否可编辑\\n locale : Object,//国际化文案对象\\n loading : Boolean,//是否处于加载态\\n schemaPath : Array,//schema path,考虑到有些schema其实是不占数据路径的，所以这个路径是真实路径\\n getSchema(path) : Object, //根据路径获取schema\\n renderField(childKey : String,reactKey : String | Number) : ReactElement,//根据childKey渲染当前字段的子字段\\n renderComponent(props : Object) : ReactElement,//渲染当前字段的组件，对于x-render来说，可以借助它快速实现渲染包装功能\\n getOrderProperties() : Array
\n \n