From b67766bacb96220688ffbf0a7a260720495de12f Mon Sep 17 00:00:00 2001 From: maximkudriavtsev Date: Wed, 29 Apr 2020 10:51:04 +0300 Subject: [PATCH 1/2] Extract common props from widget component --- js/renovation/button.tsx | 5 +++-- js/renovation/utils/base-props.tsx | 23 +++++++++++++++++++++++ js/renovation/widget.tsx | 19 ++----------------- package.json | 2 +- 4 files changed, 29 insertions(+), 20 deletions(-) create mode 100644 js/renovation/utils/base-props.tsx diff --git a/js/renovation/button.tsx b/js/renovation/button.tsx index 8eb30f2395f7..6be133a3b53f 100644 --- a/js/renovation/button.tsx +++ b/js/renovation/button.tsx @@ -17,7 +17,8 @@ import { } from 'devextreme-generator/component_declaration/common'; import Icon from './icon'; import InkRipple from './ink-ripple'; -import Widget, { WidgetProps } from './widget'; +import Widget from './widget'; +import { BaseProps } from './utils/base-props'; const stylingModes = ['outlined', 'text', 'contained']; @@ -111,7 +112,7 @@ export const viewFunction = (viewModel: Button) => { }; @ComponentBindings() -export class ButtonProps extends WidgetProps { +export class ButtonProps extends BaseProps { @OneWay() activeStateEnabled?: boolean = true; @OneWay() hoverStateEnabled?: boolean = true; @OneWay() icon?: string = ''; diff --git a/js/renovation/utils/base-props.tsx b/js/renovation/utils/base-props.tsx new file mode 100644 index 000000000000..0c45b29685ed --- /dev/null +++ b/js/renovation/utils/base-props.tsx @@ -0,0 +1,23 @@ +import { + Event, OneWay, ComponentBindings, +} from 'devextreme-generator/component_declaration/common'; +import config from '../../core/config'; + +@ComponentBindings() +export class BaseProps { + @OneWay() accessKey?: string | null = null; + @OneWay() activeStateEnabled?: boolean = false; + @OneWay() disabled?: boolean = false; + @OneWay() elementAttr?: { [name: string]: any }; + @OneWay() focusStateEnabled?: boolean = false; + @OneWay() height?: string | number | null = null; + @OneWay() hint?: string; + @OneWay() hoverStateEnabled?: boolean = false; + @Event() onClick?: (e: any) => any; + @Event() onContentReady?: (e: any) => any = (() => {}); + @Event() onKeyDown?: (e: any, options: any) => any; + @OneWay() rtlEnabled?: boolean = config().rtlEnabled; + @OneWay() tabIndex?: number = 0; + @OneWay() visible?: boolean = true; + @OneWay() width?: string | number | null = null; +} diff --git a/js/renovation/widget.tsx b/js/renovation/widget.tsx index bfed0bb89daa..b83645789f6a 100644 --- a/js/renovation/widget.tsx +++ b/js/renovation/widget.tsx @@ -1,4 +1,3 @@ -import config from '../core/config'; import { Component, ComponentBindings, @@ -20,6 +19,7 @@ import { each } from '../core/utils/iterator'; import { extend } from '../core/utils/extend'; import { focusable } from '../ui/widget/selectors'; import { isFakeClickEvent } from '../events/utils'; +import { BaseProps } from './utils/base-props'; const getStyles = ({ width, height, style }) => { const computedWidth = typeof width === 'function' ? width() : width; @@ -97,37 +97,22 @@ export const viewFunction = (viewModel: Widget) => { }; @ComponentBindings() -export class WidgetProps { +export class WidgetProps extends BaseProps { @OneWay() _feedbackHideTimeout?: number = 400; @OneWay() _feedbackShowTimeout?: number = 30; - @OneWay() accessKey?: string | null = null; - @OneWay() activeStateEnabled?: boolean = false; @OneWay() activeStateUnit?: string; @OneWay() aria?: any = {}; @Slot() children?: any; @OneWay() classes?: string | undefined = ''; @OneWay() className?: string = ''; @OneWay() clickArgs?: any = {}; - @OneWay() disabled?: boolean = false; - @OneWay() elementAttr?: { [name: string]: any }; - @OneWay() focusStateEnabled?: boolean = false; - @OneWay() height?: string | number | null = null; - @OneWay() hint?: string; - @OneWay() hoverStateEnabled?: boolean = false; @OneWay() name?: string = ''; @Event() onActive?: (e: any) => any; - @Event() onClick?: (e: any) => void; - @Event() onContentReady?: (e: any) => any = (() => {}); @Event() onDimensionChanged?: () => any; @Event() onInactive?: (e: any) => any; @Event() onKeyboardHandled?: (args: any) => any | undefined; - @Event() onKeyDown?: (e: any, options: any) => any; @Event() onVisibilityChange?: (args: boolean) => undefined; - @OneWay() rtlEnabled?: boolean = config().rtlEnabled; @OneWay() style?: { [name: string]: any }; - @OneWay() tabIndex?: number = 0; - @OneWay() visible?: boolean = true; - @OneWay() width?: string | number | null = null; } // tslint:disable-next-line: max-classes-per-file diff --git a/package.json b/package.json index 3abe63df9f23..06890fb59ced 100644 --- a/package.json +++ b/package.json @@ -59,7 +59,7 @@ "cldrjs": "^0.5.0", "cssom": "^0.4.4", "del": "^2.2.2", - "devextreme-generator": "^1.0.49", + "devextreme-generator": "^1.0.56", "devextreme-cldr-data": "^1.0.2", "devextreme-internal-tools": "~1.2.24", "enzyme": "^3.11.0", From ccfe3b3bb735f260a0a8696b9ae562c1cd7e5f9d Mon Sep 17 00:00:00 2001 From: maximkudriavtsev Date: Wed, 29 Apr 2020 10:55:36 +0300 Subject: [PATCH 2/2] Rename class --- js/renovation/button.tsx | 4 ++-- js/renovation/utils/base-props.tsx | 2 +- js/renovation/widget.tsx | 4 ++-- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/js/renovation/button.tsx b/js/renovation/button.tsx index 6be133a3b53f..e512181e77b1 100644 --- a/js/renovation/button.tsx +++ b/js/renovation/button.tsx @@ -18,7 +18,7 @@ import { import Icon from './icon'; import InkRipple from './ink-ripple'; import Widget from './widget'; -import { BaseProps } from './utils/base-props'; +import { BaseWidgetProps } from './utils/base-props'; const stylingModes = ['outlined', 'text', 'contained']; @@ -112,7 +112,7 @@ export const viewFunction = (viewModel: Button) => { }; @ComponentBindings() -export class ButtonProps extends BaseProps { +export class ButtonProps extends BaseWidgetProps { @OneWay() activeStateEnabled?: boolean = true; @OneWay() hoverStateEnabled?: boolean = true; @OneWay() icon?: string = ''; diff --git a/js/renovation/utils/base-props.tsx b/js/renovation/utils/base-props.tsx index 0c45b29685ed..0b74097d5a6a 100644 --- a/js/renovation/utils/base-props.tsx +++ b/js/renovation/utils/base-props.tsx @@ -4,7 +4,7 @@ import { import config from '../../core/config'; @ComponentBindings() -export class BaseProps { +export class BaseWidgetProps { @OneWay() accessKey?: string | null = null; @OneWay() activeStateEnabled?: boolean = false; @OneWay() disabled?: boolean = false; diff --git a/js/renovation/widget.tsx b/js/renovation/widget.tsx index b83645789f6a..4422abbcbcd1 100644 --- a/js/renovation/widget.tsx +++ b/js/renovation/widget.tsx @@ -19,7 +19,7 @@ import { each } from '../core/utils/iterator'; import { extend } from '../core/utils/extend'; import { focusable } from '../ui/widget/selectors'; import { isFakeClickEvent } from '../events/utils'; -import { BaseProps } from './utils/base-props'; +import { BaseWidgetProps } from './utils/base-props'; const getStyles = ({ width, height, style }) => { const computedWidth = typeof width === 'function' ? width() : width; @@ -97,7 +97,7 @@ export const viewFunction = (viewModel: Widget) => { }; @ComponentBindings() -export class WidgetProps extends BaseProps { +export class WidgetProps extends BaseWidgetProps { @OneWay() _feedbackHideTimeout?: number = 400; @OneWay() _feedbackShowTimeout?: number = 30; @OneWay() activeStateUnit?: string;