change value editor onChange parameter

src/editor/property/Property.less

@@ -5,6 +5,7 @@
 .ticl-property-list {
   overflow-x: hidden;
   overflow-y: auto;
+  flex-grow: 1;
 }
 .ticl-property-group {
   width: 100%;

src/editor/property/value/ColorEditor.tsx

@@ -6,12 +6,12 @@ import {Popup} from '../../component/ClickPopup';
 
 export class ColorEditor extends React.PureComponent<ValueEditorProps, any> {
   onValueChange = (value: ColorResult) => {
-    let {onChange} = this.props;
+    let {onChange, name} = this.props;
     let color = tinycolor(value.rgb);
     if (color.getAlpha() === 1) {
-      onChange(value.hex);
+      onChange(value.hex, name);
     } else {
-      onChange(color.toHex8String());
+      onChange(color.toHex8String(), name);
     }
   };
 

src/editor/property/value/ComboEditor.tsx

@@ -8,8 +8,8 @@ const {Option} = AutoComplete;
 
 export class ComboEditor extends React.PureComponent<ValueEditorProps, any> {
   onValueChange = (value: string | number) => {
-    let {onChange} = this.props;
-    onChange(value);
+    let {onChange, name} = this.props;
+    onChange(value, name);
   };
 
   getOptions() {

src/editor/property/value/DateEditor.tsx

@@ -12,8 +12,8 @@ const defaultTime = {defaultValue: DateTime.fromFormat('00:00:00.000', 'HH:mm:ss
 
 export class DateEditor extends React.PureComponent<ValueEditorProps, any> {
   onValueChange = (day: DateTime) => {
-    let {desc, onChange} = this.props;
-    onChange(day);
+    let {name, onChange} = this.props;
+    onChange(day, name);
   };
 
   render() {

src/editor/property/value/DateRangeEditor.tsx

@@ -18,8 +18,8 @@ const defaultTimes = {
 
 export class DateRangeEditor extends React.PureComponent<ValueEditorProps, any> {
   onValueChange = (range: [DateTime, DateTime]) => {
-    let {desc, onChange} = this.props;
-    onChange(range);
+    let {name, onChange} = this.props;
+    onChange(range, name);
   };
 
   render() {

src/editor/property/value/DynamicEditor.tsx

@@ -59,7 +59,7 @@ interface State {
 export class DynamicEditor extends React.PureComponent<ValueEditorProps, State> {
   state: State = {};
 
-  static getTypeFromValue(value: any, options?: (string | number)[]): ValueType {
+  static getTypeFromValue(value: any, options?: readonly (string | number)[]): ValueType {
     if (value == null) {
       return null;
     }
@@ -96,13 +96,13 @@ export class DynamicEditor extends React.PureComponent<ValueEditorProps, State>
   }
 
   onValueChange = (value: any) => {
-    let {onChange} = this.props;
+    let {onChange, name} = this.props;
     let {currentType} = this.state;
     // automatically set the currentType when there is a value change
     if (!currentType) {
       this.setState({currentType: this.getCurrentType()});
     }
-    onChange(value);
+    onChange(value, name);
   };
 
   onMenuClick = (param: {key: React.Key}) => {

src/editor/property/value/NumberEditor.tsx

@@ -63,7 +63,8 @@ export class NumberEditor extends React.PureComponent<ValueEditorProps, any> {
       if (value === this.props.value) {
         this.forceUpdate();
       }
-      this.props.onChange(value);
+      const {onChange, name} = this.props;
+      onChange(value, name);
     } else {
       this.forceUpdate();
     }

src/editor/property/value/RadioButtonEditor.tsx

@@ -9,8 +9,8 @@ const RadioGroup = Radio.Group;
 
 export class RadioButtonEditor extends React.PureComponent<ValueEditorProps, any> {
   onValueChange = (e: RadioChangeEvent) => {
-    let {onChange} = this.props;
-    onChange(e.target.value);
+    let {onChange, name} = this.props;
+    onChange(e.target.value, name);
   };
 
   render() {

src/editor/property/value/SelectEditor.tsx

@@ -7,8 +7,8 @@ const {Option} = Select;
 
 export class SelectEditor extends React.PureComponent<ValueEditorProps, any> {
   onValueChange = (value: string | number) => {
-    let {onChange} = this.props;
-    onChange(value);
+    let {onChange, name} = this.props;
+    onChange(value, name);
   };
 
   getOptions() {
@@ -40,8 +40,8 @@ export class SelectEditor extends React.PureComponent<ValueEditorProps, any> {
 
 export class MultiSelectEditor extends SelectEditor {
   onValuesChange = (value: string | number[]) => {
-    let {onChange} = this.props;
-    onChange(value);
+    let {onChange, name} = this.props;
+    onChange(value, name);
   };
 
   render() {

src/editor/property/value/StringEditorBase.ts

@@ -9,8 +9,9 @@ export abstract class StringEditorBase extends React.PureComponent<ValueEditorPr
   _pendingValue: any = null;
 
   commitChange(value: string) {
+    const {onChange, name} = this.props;
     this._pendingValue = null;
-    this.props.onChange(value);
+    onChange(value, name);
   }
 
   onInputChange = (e: React.SyntheticEvent) => {

src/editor/property/value/ToggleEditor.tsx

@@ -5,13 +5,13 @@ import {LocalizedEnumOption} from '../../component/LocalizedLabel';
 
 export class ToggleEditor extends React.PureComponent<ValueEditorProps, any> {
   onValueChange = (checked: boolean) => {
-    let {desc, onChange} = this.props;
+    let {desc, onChange, name} = this.props;
     let {options} = desc;
     if (options && options.length >= 2) {
       // convert string to boolean
-      onChange(checked ? options[1] : options[0]);
+      onChange(checked ? options[1] : options[0], name);
     } else {
-      onChange(checked);
+      onChange(checked, name);
     }
   };
 

src/editor/property/value/ValueEditorBase.ts

@@ -11,6 +11,6 @@ export interface ValueEditorProps {
   funcDesc: FunctionDesc;
   desc: PropDesc;
   locked?: boolean;
-  onChange?: (value: any) => void;
+  onChange?: (value: any, field: string) => void;
   addSubBlock?: (id: string, desc?: FunctionDesc, data?: any) => void;
 }