[V1 UMBRELLA]

.eslintrc

@@ -12,5 +12,5 @@
     "ecmaFeatures": {
       "jsx": true
     }
-  }
+  },
 }

docs/Examples/antd/List.md

@@ -3,10 +3,11 @@
 > 数组场景，区块型数组，能解决大量字段的聚合输入，但是对于数据的对比化展示，区分
 > 度不够明显
 
-下面对于List场景我们主要封装了
-- Array类型组件
-- Table类型组件
-- Card类型组件
+下面对于 List 场景我们主要封装了
+
+- Array 类型组件
+- Table 类型组件
+- Card 类型组件
 
 这些组件你都可以对其做简单的定制来适应你当前的业务需求，比如
 
@@ -66,8 +67,8 @@ const App = () => {
           maxItems={3}
           type="array"
           x-props={{
-            renderAddition:'这是定制的添加文案',
-            renderRemove:'这是定制的删除文案'
+            renderAddition: '这是定制的添加文案',
+            renderRemove: '这是定制的删除文案'
           }}
         >
           <Field type="object">
@@ -82,11 +83,7 @@ const App = () => {
               </FormLayout>
             </FormBlock>
             <FormBlock title="嵌套数组">
-              <Field
-                name="array2"
-                maxItems={3}
-                type="array"
-              >
+              <Field name="array2" maxItems={3} type="array">
                 <Field type="object">
                   <FormLayout labelCol={9} wrapperCol={6}>
                     <Field name="aa" type="string" title="字段1" />
@@ -149,11 +146,23 @@ const App = () => (
         maxItems={3}
         type="array"
         x-component="table"
-         x-props={{
-          renderExtraOperations(){
-            return <div>Hello worldasdasdasdasd</div>
+        x-props={{
+          scroll: { x: '200%' },
+          renderExtraOperations() {
+            return (
+              <div
+                style={{
+                  whiteSpace: 'nowrap',
+                  textOverflow: 'ellipsis',
+                  overflow: 'hidden',
+                  lineHeight: '32px'
+                }}
+              >
+                Hello worldasdasdasdasd
+              </div>
+            )
           },
-          operationsWidth:400
+          operationsWidth: 400
         }}
       >
         <Field type="object">
@@ -169,7 +178,7 @@ const App = () => (
           <Field name="dd" type="string" title="字段5" />
           <Field name="ee" type="string" title="字段6" />
           <Field name="ff" type="string" title="字段7" />
-          <Field name="gg" type="daterange" title="字段8" width={400}  />
+          <Field name="gg" type="daterange" title="字段8" width={400} />
         </Field>
       </Field>
     </SchemaForm>
@@ -207,12 +216,17 @@ import 'antd/dist/antd.css'
 const App = () => (
   <Printer>
     <SchemaForm>
-      <Field name="array" maxItems={3} type="array" x-component="cards" 
-          x-props={{
-            title:'这是卡片标题',
-            renderAddition:'这是定制的添加文案',
-            renderRemove:'这是定制的删除文案'
-          }}>
+      <Field
+        name="array"
+        maxItems={3}
+        type="array"
+        x-component="cards"
+        x-props={{
+          title: '这是卡片标题',
+          renderAddition: '这是定制的添加文案',
+          renderRemove: '这是定制的删除文案'
+        }}
+      >
         <Field type="object">
           <FormLayout labelCol={6} wrapperCol={8}>
             <Field
@@ -227,9 +241,15 @@ const App = () => (
             <Field name="dd" type="string" title="字段5" />
             <Field name="ee" type="string" title="字段6" />
             <Field name="ff" type="string" title="字段7" />
-            <Field name="gg" type="daterange" title="字段8"/>
+            <Field name="gg" type="daterange" title="字段8" />
           </FormLayout>
-          <Field name="array" maxItems={3} type="array" x-component="cards" x-props={{title:'这是卡片标题'}}>
+          <Field
+            name="array"
+            maxItems={3}
+            type="array"
+            x-component="cards"
+            x-props={{ title: '这是卡片标题' }}
+          >
             <Field type="object">
               <FormLayout labelCol={6} wrapperCol={8}>
                 <Field

docs/Examples/antd/Relations.md

@@ -65,6 +65,7 @@ const App = () => {
             })
           })
           $('onFieldChange', 'aa').subscribe(fieldState => {
+            console.log(fieldState.value)
             setFieldState('bb', state => {
               state.visible = !fieldState.value
             })
@@ -135,7 +136,7 @@ const App = () => {
             })
         }}
         labelCol={6}
-        wrapperCol={4}
+        wrapperCol={12}
         onSubmit={v => console.log(v)}
       >
         <FormBlock title="Block1">

docs/Examples/antd/Sample.md

@@ -34,7 +34,6 @@ ReactDOM.render(
       actions={actions}
       labelCol={7}
       initialValues={{
-        date:'2019-08-01',
         upload3:[{
           downloadURL:
             "//img.alicdn.com/tfs/TB1n8jfr1uSBuNjy1XcXXcYjFXa-200-200.png",
@@ -82,7 +81,7 @@ ReactDOM.render(
       />
       <Field type="number" title="数字选择" name="number" />
       <Field type="boolean" title="开关选择" name="boolean" />
-      <Field type="date" title="日期选择" name="date" x-props={{disabled:true}} />
+      <Field type="date" title="日期选择" name="date" />
       <Field
         type="daterange"
         title="日期范围"

docs/Examples/next/List.md

@@ -157,7 +157,12 @@ const App = () => (
             <Field name="ee" type="string" title="字段5" />
             <Field name="ff" type="string" title="字段6" />
             <Field name="gg" type="string" title="字段7" />
-            <Field name="hh" type="daterange" title="字段8" />
+            <Field
+              name="hh"
+              type="daterange"
+              x-props={{ width: 400 }}
+              title="字段8"
+            />
           </Field>
         </Field>
       </FormLayout>

docs/Examples/next/Relations.md

@@ -51,6 +51,7 @@ const App = () => {
   return (
     <Printer>
       <SchemaForm
+        useDirty
         effects={($, { setFieldState, getFieldState }) => {
           $('onFormInit').subscribe(() => {
             setFieldState(FormPath.match('*(gg,hh)'), state => {
@@ -131,7 +132,7 @@ const App = () => {
         wrapperCol={4}
         onSubmit={v => console.log(v)}
       >
-        <FormBlock title="Block1">
+        <FormBlock name="block" title="Block1">
           <Field
             name="aa"
             type="boolean"
@@ -497,7 +498,7 @@ const App = () => {
               </FormLayout>
             </FormBlock>
             <FormBlock title="嵌套Array">
-              <Field type="array" name="dd" x-component="cards">
+              <Field type="array" name="dd">
                 <Field type="object">
                   <FormLayout inline style={{ marginLeft: 20 }}>
                     <Field

package.json

@@ -12,8 +12,11 @@
     "build:docs": "node ./scripts/docs.js build -i docs -o docs",
     "start": "node ./scripts/docs.js start -i docs",
     "sort-api": "node ./scripts/sort-api-table.js",
-    "test": "jest",
+    "test": "npm run lint && jest",
+    "test:core": "jest --watch packages/core/src/__tests__/index.spec.ts",
     "test:prod": "cross-env TEST_ENV=production npm run build && jest",
+    "doc:core": "doc-scripts start -i packages/core",
+    "doc:react": "doc-scripts start -i packages/react",
     "test:watch": "jest --watch",
     "coverage": "npm run test -- --coverage",
     "coverage:upload": "rm -rf ./coverage && npm run coverage && node ./scripts/mapCoverage.js && codecov",
@@ -48,6 +51,7 @@
     "@babel/register": "^7.0.0",
     "@babel/runtime-corejs3": "^7.2.0",
     "@testing-library/react": "^8.0.0",
+    "@types/jest": "^24.0.18",
     "@types/node": "^12.6.8",
     "@typescript-eslint/eslint-plugin": "^1.11.0",
     "@typescript-eslint/parser": "^1.11.0",
@@ -94,6 +98,7 @@
     "pretty-format": "^24.0.0",
     "react": "^16.8.3",
     "react-dom": "^16.8.3",
+    "react-eva": "^1.1.7",
     "remark-parse": "^6.0.3",
     "remark-stringify": "^6.0.4",
     "scheduler": "^0.15.0",
@@ -118,11 +123,11 @@
     }
   },
   "lint-staged": {
-    "packages/**": [
+    "packages/*/src/**.@(ts|tsx|js)": [
       "npm run lint",
       "git add"
     ],
-    "scripts/**": [
+    "scripts/**.@(ts|tsx|js)": [
       "npm run lint",
       "git add"
     ]

packages/.eslintrc

@@ -11,7 +11,12 @@
     "jest": true,
     "commonjs": true
   },
-  "plugins": ["@typescript-eslint", "react", "react-hooks", "prettier"],
+  "plugins": [
+    "@typescript-eslint",
+    "react",
+    "react-hooks",
+    "prettier"
+  ],
   "parserOptions": {
     "project": "./tsconfig.json",
     "sourceType": "module",
@@ -25,10 +30,8 @@
       "version": "detect",
     }
   },
-
   "rules": {
     "prettier/prettier": 2,
-
     // don't force es6 functions to include space before paren
     "space-before-function-paren": 0,
     "react/prop-types": 0,
@@ -40,13 +43,22 @@
     "react/no-did-update-set-state": 0,
     // maybe we should no-public
     "@typescript-eslint/explicit-member-accessibility": 0,
-
     "@typescript-eslint/interface-name-prefix": 0,
     "@typescript-eslint/no-explicit-any": 0,
     "@typescript-eslint/explicit-function-return-type": 0,
     "@typescript-eslint/no-parameter-properties": 0,
     "@typescript-eslint/array-type": 0,
     "@typescript-eslint/no-object-literal-type-assertion": 0,
-    "no-console": ["error", { "allow": ["warn", "error", "info"] }]
+    "@typescript-eslint/no-use-before-define": 0,
+    "no-console": [
+      "error",
+      {
+        "allow": [
+          "warn",
+          "error",
+          "info"
+        ]
+      }
+    ]
   }
-}
+}

packages/antd/build.ts

@@ -1,19 +1,19 @@
 import { compile, getCompileConfig } from '../../scripts/build'
 import ts from 'typescript'
-import tsImportPluginFactory from 'ts-import-plugin'
+//import tsImportPluginFactory from 'ts-import-plugin'
 import glob from 'glob'
 
-const transformer = tsImportPluginFactory({
-  libraryName: 'antd',
-  //style: 'css',
-})
+// const transformer = tsImportPluginFactory({
+//   libraryName: 'antd',
+//   style: 'css',
+// })
 
 function buildESM() {
   const { fileNames, options } = getCompileConfig(require.resolve('./tsconfig.json'), {
     outDir: './esm',
     module: ts.ModuleKind.ESNext
   })
-  compile(fileNames, options, { before: [transformer] })
+  compile(fileNames, options)
   console.log('esm build successfully')
 }
 

packages/antd/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uform/antd",
-  "version": "0.4.3",
+  "version": "0.4.0",
   "license": "MIT",
   "main": "lib",
   "module": "esm",
@@ -26,12 +26,14 @@
     "@babel/runtime": "^7.4.4",
     "antd": "^3.14.1",
     "react": ">=16.8.0",
-    "react-dom": ">=16.8.0"
+    "react-dom": ">=16.8.0",
+    "@types/styled-components": "^4.1.19"
   },
   "dependencies": {
-    "@uform/react": "^0.4.3",
-    "@uform/types": "^0.4.3",
-    "@uform/utils": "^0.4.3",
+    "@uform/react-schema-renderer": "^0.4.0",
+    "@uform/react-shared-components":"^0.4.0",
+    "@uform/types": "^0.4.0",
+    "@uform/shared": "^0.4.0",
     "classnames": "^2.2.6",
     "moveto": "^1.7.4",
     "react-stikky": "^0.1.15",

packages/antd/src/compat/Form.tsx

@@ -0,0 +1,22 @@
+import React from 'react'
+import { Form } from 'antd'
+import { FormProps } from 'antd/lib/form'
+import { IFormItemTopProps } from '../types'
+import { FormItemProvider } from './context'
+import { normalizeCol } from '../shared'
+
+export const CompatNextForm: React.FC<
+  FormProps & IFormItemTopProps
+> = props => {
+  return (
+    <FormItemProvider {...props}>
+      <Form
+        {...props}
+        labelCol={normalizeCol(props.labelCol)}
+        wrapperCol={normalizeCol(props.wrapperCol)}
+        layout={props.inline ? 'inline' : props.layout}
+        form={undefined}
+      />
+    </FormItemProvider>
+  )
+}