From 6e8392ea714e43bb86cc76aceb729929a009bf53 Mon Sep 17 00:00:00 2001 From: 2betop <2betop.cn@gmail.com> Date: Wed, 3 Jun 2020 17:19:14 +0800 Subject: [PATCH] =?UTF-8?q?=E5=8D=87=E7=BA=A7=E5=88=B0=E6=9C=80=E6=96=B0?= =?UTF-8?q?=E7=9A=84=20uncontrollable?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- scss/components/_input-box.scss | 10 ++++++++++ src/components/AssociatedCheckboxes.tsx | 2 +- src/components/ChainedCheckboxes.tsx | 2 +- src/components/Checkboxes.tsx | 2 +- src/components/ColorPicker.tsx | 2 +- src/components/InputBox.tsx | 5 ++++- src/components/ListCheckboxes.tsx | 2 +- src/components/ListRadios.tsx | 2 +- src/components/Radios.tsx | 2 +- src/components/Range.tsx | 2 +- src/components/ResultBox.tsx | 2 +- src/components/SearchBox.tsx | 2 +- src/components/Select.tsx | 2 +- src/components/TableCheckboxes.tsx | 2 +- src/components/Tabs.tsx | 2 +- src/components/TooltipWrapper.tsx | 2 +- src/components/Transfer.tsx | 2 +- src/components/TreeCheckboxes.tsx | 2 +- src/components/TreeRadios.tsx | 2 +- src/factory.tsx | 4 +++- src/renderers/Form/index.tsx | 2 +- types/uncontrollable/index.d.ts | 4 +--- 23 files changed, 37 insertions(+), 24 deletions(-) diff --git a/package.json b/package.json index 8cce53e1..f7b86436 100644 --- a/package.json +++ b/package.json @@ -73,7 +73,7 @@ "sortablejs": "1.10.0", "tinymce": "5.2.2", "tslib": "^1.10.0", - "uncontrollable": "4.1.0", + "uncontrollable": "7.0.2", "video-react": "0.9.4" }, "devDependencies": { diff --git a/scss/components/_input-box.scss b/scss/components/_input-box.scss index 6ea20528..52942e70 100644 --- a/scss/components/_input-box.scss +++ b/scss/components/_input-box.scss @@ -1,6 +1,10 @@ .#{$ns}InputBox { @include input-input(); + > input[readonly] { + cursor: inherit; + } + &.is-error { border-color: $Form-input-onError-borderColor; background-color: $Form-input-onError-bg; @@ -15,6 +19,12 @@ } } + &.is-clickable:hover { + border-color: $Form-input-onFocused-borderColor; + box-shadow: $Form-input-boxShadow; + cursor: pointer; + } + &.is-error.is-focused { border-color: $Form-input-onError-borderColor; } diff --git a/src/components/AssociatedCheckboxes.tsx b/src/components/AssociatedCheckboxes.tsx index df336a87..2616c71e 100644 --- a/src/components/AssociatedCheckboxes.tsx +++ b/src/components/AssociatedCheckboxes.tsx @@ -11,7 +11,7 @@ import ListMenu from './ListMenu'; import {autobind} from '../utils/helper'; import ListRadios from './ListRadios'; import {themeable} from '../theme'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import ListCheckboxes from './ListCheckboxes'; import TableCheckboxes from './TableCheckboxes'; import TreeCheckboxes from './TreeCheckboxes'; diff --git a/src/components/ChainedCheckboxes.tsx b/src/components/ChainedCheckboxes.tsx index 0e4b3c7e..15a02089 100644 --- a/src/components/ChainedCheckboxes.tsx +++ b/src/components/ChainedCheckboxes.tsx @@ -4,7 +4,7 @@ import {BaseCheckboxes, BaseCheckboxesProps} from './Checkboxes'; import {themeable} from '../theme'; import React from 'react'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import Checkbox from './Checkbox'; import {Option} from './Select'; import {getTreeDepth} from '../utils/helper'; diff --git a/src/components/Checkboxes.tsx b/src/components/Checkboxes.tsx index d4c03912..651962c4 100644 --- a/src/components/Checkboxes.tsx +++ b/src/components/Checkboxes.tsx @@ -5,7 +5,7 @@ */ import React from 'react'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import Checkbox from './Checkbox'; import chunk from 'lodash/chunk'; import {ClassNamesFn, themeable, ThemeProps} from '../theme'; diff --git a/src/components/ColorPicker.tsx b/src/components/ColorPicker.tsx index b36c31da..d6a07ba2 100644 --- a/src/components/ColorPicker.tsx +++ b/src/components/ColorPicker.tsx @@ -10,7 +10,7 @@ import {findDOMNode} from 'react-dom'; import {SketchPicker, GithubPicker, ColorState} from 'react-color'; import {Icon} from './icons'; import Overlay from './Overlay'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import PopOver from './PopOver'; import {ClassNamesFn, themeable, ThemeProps} from '../theme'; import {autobind} from '../utils/helper'; diff --git a/src/components/InputBox.tsx b/src/components/InputBox.tsx index 93aaa8bb..36e48a03 100644 --- a/src/components/InputBox.tsx +++ b/src/components/InputBox.tsx @@ -34,6 +34,8 @@ export class InputBox extends React.Component { @autobind clearValue(e: any) { + e.preventDefault(); + const onClear = this.props.onChange; const onChange = this.props.onChange; onClear?.(e); @@ -87,7 +89,8 @@ export class InputBox extends React.Component { className, isFocused ? 'is-focused' : '', disabled ? 'is-disabled' : '', - hasError ? 'is-error' : '' + hasError ? 'is-error' : '', + rest.onClick ? 'is-clickable' : '' )} > {result} diff --git a/src/components/ListCheckboxes.tsx b/src/components/ListCheckboxes.tsx index e933ad69..d43c7e1a 100644 --- a/src/components/ListCheckboxes.tsx +++ b/src/components/ListCheckboxes.tsx @@ -1,7 +1,7 @@ import {BaseCheckboxes} from './Checkboxes'; import {themeable} from '../theme'; import React from 'react'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import Checkbox from './Checkbox'; import {Option} from './Select'; import {localeable} from '../locale'; diff --git a/src/components/ListRadios.tsx b/src/components/ListRadios.tsx index 09f67d9e..fcc802dd 100644 --- a/src/components/ListRadios.tsx +++ b/src/components/ListRadios.tsx @@ -1,7 +1,7 @@ import {BaseCheckboxes} from './Checkboxes'; import {themeable, ThemeProps} from '../theme'; import React from 'react'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import Checkbox from './Checkbox'; import {Option, Options} from './Select'; import {findTree, autobind} from '../utils/helper'; diff --git a/src/components/Radios.tsx b/src/components/Radios.tsx index b3a9e19b..621f0b4b 100644 --- a/src/components/Radios.tsx +++ b/src/components/Radios.tsx @@ -14,7 +14,7 @@ */ import React from 'react'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import Checkbox from './Checkbox'; import {value2array, OptionProps, Option} from './Select'; import chunk from 'lodash/chunk'; diff --git a/src/components/Range.tsx b/src/components/Range.tsx index 3338df00..bed79fad 100644 --- a/src/components/Range.tsx +++ b/src/components/Range.tsx @@ -6,7 +6,7 @@ import React from 'react'; import InputRange from 'react-input-range'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import cx from 'classnames'; import {RendererProps} from '../factory'; import {ClassNamesFn, themeable} from '../theme'; diff --git a/src/components/ResultBox.tsx b/src/components/ResultBox.tsx index 06b227c3..a12e7be8 100644 --- a/src/components/ResultBox.tsx +++ b/src/components/ResultBox.tsx @@ -1,7 +1,7 @@ import {ThemeProps, themeable} from '../theme'; import React from 'react'; import {InputBoxProps} from './InputBox'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import {Icon} from './icons'; import Input from './Input'; import {autobind} from '../utils/helper'; diff --git a/src/components/SearchBox.tsx b/src/components/SearchBox.tsx index c8f84967..9fa72132 100644 --- a/src/components/SearchBox.tsx +++ b/src/components/SearchBox.tsx @@ -1,7 +1,7 @@ import React from 'react'; import {ThemeProps, themeable} from '../theme'; import {Icon} from './icons'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import {autobind} from '../utils/helper'; import {LocaleProps, localeable} from '../locale'; diff --git a/src/components/Select.tsx b/src/components/Select.tsx index cb8a67da..898b1bd0 100644 --- a/src/components/Select.tsx +++ b/src/components/Select.tsx @@ -5,7 +5,7 @@ * @date 2017-11-07 */ -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import React from 'react'; import Overlay from './Overlay'; import PopOver from './PopOver'; diff --git a/src/components/TableCheckboxes.tsx b/src/components/TableCheckboxes.tsx index 6a0a0ef3..709e096c 100644 --- a/src/components/TableCheckboxes.tsx +++ b/src/components/TableCheckboxes.tsx @@ -1,7 +1,7 @@ import {BaseCheckboxes, BaseCheckboxesProps} from './Checkboxes'; import {themeable} from '../theme'; import React from 'react'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import Checkbox from './Checkbox'; import {Option} from './Select'; import {resolveVariable} from '../utils/tpl-builtin'; diff --git a/src/components/Tabs.tsx b/src/components/Tabs.tsx index 864e3304..4a00e549 100644 --- a/src/components/Tabs.tsx +++ b/src/components/Tabs.tsx @@ -8,7 +8,7 @@ import React from 'react'; import {Schema} from '../types'; import Transition, {ENTERED, ENTERING} from 'react-transition-group/Transition'; import {themeable, ThemeProps} from '../theme'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; const transitionStyles: { [propName: string]: string; diff --git a/src/components/TooltipWrapper.tsx b/src/components/TooltipWrapper.tsx index 185f8436..7637a07f 100644 --- a/src/components/TooltipWrapper.tsx +++ b/src/components/TooltipWrapper.tsx @@ -6,7 +6,7 @@ import React from 'react'; import Html from './Html'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import {findDOMNode} from 'react-dom'; import Tooltip from './Tooltip'; import {ClassNamesFn, themeable} from '../theme'; diff --git a/src/components/Transfer.tsx b/src/components/Transfer.tsx index 4448a0d0..e1961f79 100644 --- a/src/components/Transfer.tsx +++ b/src/components/Transfer.tsx @@ -2,7 +2,7 @@ import React from 'react'; import {ThemeProps, themeable} from '../theme'; import {BaseCheckboxesProps, BaseCheckboxes} from './Checkboxes'; import {Options, Option} from './Select'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import ResultList from './ResultList'; import TableCheckboxes from './TableCheckboxes'; import ListCheckboxes from './ListCheckboxes'; diff --git a/src/components/TreeCheckboxes.tsx b/src/components/TreeCheckboxes.tsx index 2d195208..6351bce1 100644 --- a/src/components/TreeCheckboxes.tsx +++ b/src/components/TreeCheckboxes.tsx @@ -1,7 +1,7 @@ import {BaseCheckboxes, BaseCheckboxesProps} from './Checkboxes'; import {themeable} from '../theme'; import React from 'react'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import Checkbox from './Checkbox'; import {Option} from './Select'; import {autobind, eachTree, everyTree} from '../utils/helper'; diff --git a/src/components/TreeRadios.tsx b/src/components/TreeRadios.tsx index 550196fd..961d560a 100644 --- a/src/components/TreeRadios.tsx +++ b/src/components/TreeRadios.tsx @@ -1,6 +1,6 @@ import {themeable} from '../theme'; import React from 'react'; -import uncontrollable from 'uncontrollable'; +import {uncontrollable} from 'uncontrollable'; import Checkbox from './Checkbox'; import {Option} from './Select'; import {autobind, eachTree, everyTree} from '../utils/helper'; diff --git a/src/factory.tsx b/src/factory.tsx index 11c4060b..7cce0908 100644 --- a/src/factory.tsx +++ b/src/factory.tsx @@ -593,7 +593,8 @@ class SchemaRenderer extends React.Component { : (schema.children as Function)({ ...rest, $path: $path, - render: this.renderChild + render: this.renderChild, + forwardedRef: this.refFn }); } else if (typeof schema.component === 'function') { const isSFC = !(schema.component.prototype instanceof React.Component); @@ -602,6 +603,7 @@ class SchemaRenderer extends React.Component { ...schema, $path: $path, ref: isSFC ? undefined : this.refFn, + forwardedRef: isSFC ? this.refFn : undefined, render: this.renderChild }); } else if (!this.renderer) { diff --git a/src/renderers/Form/index.tsx b/src/renderers/Form/index.tsx index 802fddbd..573128a6 100644 --- a/src/renderers/Form/index.tsx +++ b/src/renderers/Form/index.tsx @@ -1019,7 +1019,7 @@ export default class Form extends React.Component { // 自定义组件如果在节点设置了 label name 什么的,就用 formItem 包一层 // 至少自动支持了 valdiations, label, description 等逻辑。 - if (control.component && control.label && control.name) { + if (control.component && control.label !== undefined && control.name) { const cache = this.componentCache.get(control.component); if (cache) { diff --git a/types/uncontrollable/index.d.ts b/types/uncontrollable/index.d.ts index ee4b35a9..a3decad6 100644 --- a/types/uncontrollable/index.d.ts +++ b/types/uncontrollable/index.d.ts @@ -1,10 +1,8 @@ declare module 'uncontrollable' { - function uncontrollable< + export function uncontrollable< T extends Raect.ComponentType, P extends { [propName: string]: any; } >(arg: T, config: P): T; - - export = uncontrollable; }