@steroidsjs/core 2.0.1-beta.112 → 2.0.1-beta.113

package/ui/form/FieldLayout/FieldLayout.tsx

@@ -1,73 +1,73 @@
-import * as React from 'react';
-import {components} from '../../../hoc';
-import {IComponentsHocOutput} from '../../../hoc/components';
-import {mergeLayoutProp} from '../../../hoc/form';
-
-export interface IFieldLayoutProps {
-
-    /**
-     * Название поля либо отмена отображение поля (false)
-     * @example Visible
-     */
-    label?: string | boolean | any;
-    hint?: string | boolean;
-
-    /**
-     * Обязательное ли поле? Если true,
-     * то к названию будет добавлен модификатор 'required' - красная звездочка (по умолчанию)
-     * @example true
-     */
-    required?: boolean;
-    layout?: FormLayout;
-    errors?: string | string[];
-    layoutView?: CustomView;
-    [key: string]: any;
-}
-
-export interface IFieldLayoutViewProps {
-    label: string | boolean | any,
-    required: boolean,
-    hint: string | boolean,
-    errors: string | string[],
-    layout?: {
-        layout: FormLayoutName | boolean,
-        className: string,
-        label: boolean,
-        cols: number[],
-        [key: string]: any,
-    };
-}
-
-interface IFieldLayoutPrivateProps extends IComponentsHocOutput {
-
-}
-
-const defaultProps = {
-    layout: {
-        layout: 'default',
-        cols: [3, 6]
-    },
-    required: false,
-    className: ''
-};
-
-@components('ui')
-export default class FieldLayout extends React.PureComponent<IFieldLayoutProps & IFieldLayoutPrivateProps> {
-    static defaultProps = defaultProps;
-
-    render() {
-        if (this.props.layout === false) {
-            return this.props.children;
-        }
-        const FieldLayoutView = this.props.layoutView || this.props.ui.getView('form.FieldLayoutView');
-        const layout = mergeLayoutProp(defaultProps.layout, this.props.layout);
-        return (
-            <FieldLayoutView
-                {...this.props}
-                layout={typeof layout === 'object' ? layout : {layout}}
-            >
-                {this.props.children}
-            </FieldLayoutView>
-        );
-    }
-}
+import * as React from 'react';
+import {components} from '../../../hoc';
+import {IComponentsHocOutput} from '../../../hoc/components';
+import {mergeLayoutProp} from '../../../hoc/form';
+
+export interface IFieldLayoutProps {
+
+    /**
+     * Название поля либо отмена отображение поля (false)
+     * @example Visible
+     */
+    label?: string | boolean | any;
+    hint?: string | boolean;
+
+    /**
+     * Обязательное ли поле? Если true,
+     * то к названию будет добавлен модификатор 'required' - красная звездочка (по умолчанию)
+     * @example true
+     */
+    required?: boolean;
+    layout?: FormLayout;
+    errors?: string | string[];
+    layoutView?: CustomView;
+    [key: string]: any;
+}
+
+export interface IFieldLayoutViewProps {
+    label: string | boolean | any,
+    required: boolean,
+    hint: string | boolean,
+    errors: string | string[],
+    layout?: {
+        layout: FormLayoutName | boolean,
+        className: string,
+        label: boolean,
+        cols: number[],
+        [key: string]: any,
+    };
+}
+
+interface IFieldLayoutPrivateProps extends IComponentsHocOutput {
+
+}
+
+const defaultProps = {
+    layout: {
+        layout: 'default',
+        cols: [3, 6]
+    },
+    required: false,
+    className: ''
+};
+
+@components('ui')
+export default class FieldLayout extends React.PureComponent<IFieldLayoutProps & IFieldLayoutPrivateProps> {
+    static defaultProps = defaultProps;
+
+    render() {
+        if (this.props.layout === false) {
+            return this.props.children;
+        }
+        const FieldLayoutView = this.props.layoutView || this.props.ui.getView('form.FieldLayoutView');
+        const layout = mergeLayoutProp(defaultProps.layout, this.props.layout);
+        return (
+            <FieldLayoutView
+                {...this.props}
+                layout={typeof layout === 'object' ? layout : {layout}}
+            >
+                {this.props.children}
+            </FieldLayoutView>
+        );
+    }
+}

package/ui/form/FieldLayout/demo/default.tsx

@@ -1,8 +1,8 @@
-import * as React from 'react';
-import InputField from '../../InputField';
-
-export default () => (
-    <>
-        <InputField label='Default' layout='default'/>
-    </>
+import * as React from 'react';
+import InputField from '../../InputField';
+
+export default () => (
+    <>
+        <InputField label='Default' layout='default'/>
+    </>
 );

package/ui/form/FieldLayout/demo/horizontal.tsx

@@ -1,8 +1,8 @@
-import * as React from 'react';
-import InputField from '../../InputField';
-
-export default () => (
-    <>
-        <InputField label='Horizontal' layout='horizontal'/>
-    </>
+import * as React from 'react';
+import InputField from '../../InputField';
+
+export default () => (
+    <>
+        <InputField label='Horizontal' layout='horizontal'/>
+    </>
 );

package/ui/form/FieldLayout/demo/inline.tsx

@@ -1,9 +1,9 @@
-import * as React from 'react';
-import InputField from '../../InputField';
-
-export default () => (
-    <>
-        <div className='mb-2'>Inline (label is hide)</div>
-        <InputField label='Inline' layout='inline'/>
-    </>
+import * as React from 'react';
+import InputField from '../../InputField';
+
+export default () => (
+    <>
+        <div className='mb-2'>Inline (label is hide)</div>
+        <InputField label='Inline' layout='inline'/>
+    </>
 );

package/ui/form/FieldLayout/index.ts

@@ -1,2 +1,2 @@
-import FieldLayout from './FieldLayout';
-export default FieldLayout;
+import FieldLayout from './FieldLayout';
+export default FieldLayout;

package/ui/form/FieldList/FieldList.story.js

@@ -1,9 +1,9 @@
-import basic from './demo/basic';
-
-export default {
-  title: 'form.FieldList',
-};
-
-export {
-    basic,
+import basic from './demo/basic';
+
+export default {
+  title: 'form.FieldList',
+};
+
+export {
+    basic,
 }

package/ui/form/FieldList/FieldList.tsx

@@ -1,204 +1,204 @@
-import * as React from 'react';
-import {connect} from 'react-redux';
-import {arrayPush} from 'redux-form';
-import {findDOMNode} from 'react-dom';
-import {components, field} from '../../../hoc';
-import {getFieldPropsFromModel, IFieldHocInput, IFieldHocOutput} from '../../../hoc/field';
-import Field from '../Field';
-import tableNavigationHandler from './tableNavigationHandler';
-import {getModel} from '../../../reducers/fields';
-import {FormContext} from '../../../hoc/form';
-import {IConnectHocOutput} from '../../../hoc/connect';
-import {IComponentsHocOutput} from '../../../hoc/components';
-
-interface IFieldListItem extends IFieldHocInput {
-
-    /**
-     * Будет ли отображён item ?
-     * @example true
-     */
-    visible?: boolean,
-    component?: any,
-
-    /**
-     * Placeholder подсказка
-     * @example Your text...
-     */
-    placeholder?: string,
-    className?: CssClassName,
-    headerClassName?: CssClassName,
-    view?: CustomView,
-    [key: string]: any,
-}
-
-export interface IFieldListProps extends IFieldHocInput {
-    /**
-     * Начальные значения в полях
-     * @example {name: 'Ivan', amount: 5}
-     */
-    initialValues?: {[key: string]: any}
-    items?: IFieldListItem[];
-    fields?: any;
-    initialRowsCount?: number;
-    showAdd?: boolean;
-    showRemove?: boolean;
-    className?: CssClassName;
-    view?: any;
-    viewProps?: any;
-    itemView?: any;
-    itemViewProps?: any;
-    enableKeyboardNavigation?: boolean;
-    [key: string]: any;
-}
-
-export interface IFieldListViewProps extends IFieldHocOutput {
-    items?: (IFieldListItem & {
-        disabled?: boolean,
-        size?: boolean,
-    })[];
-    renderField?: (field: object, prefix: string) => any,
-    onAdd?: (e: any) => void,
-    showRemove?: boolean,
-    showAdd?: boolean,
-}
-
-export interface IFieldListItemViewProps extends IFieldHocOutput {
-    items?: (IFieldListItem & {
-        disabled?: boolean,
-        size?: boolean,
-    })[];
-    renderField?: (field: object, prefix: string) => any,
-    onRemove?: (rowIndex: number) => void,
-    prefix: string,
-    rowIndex: number,
-    showRemove: boolean,
-}
-
-interface IFieldListPrivateProps extends IFieldHocOutput, IConnectHocOutput, IComponentsHocOutput {
-
-}
-
-const defaultProps = {
-    disabled: false,
-    required: false,
-    showAdd: true,
-    showRemove: true,
-    className: '',
-    initialRowsCount: 1,
-    enableKeyboardNavigation: true,
-};
-
-@field({
-    componentId: 'form.FieldList',
-    list: true,
-})
-@connect((state, props) => ({
-    model: getModel(state, props.model),
-}))
-@components('ui')
-export default class FieldList extends React.PureComponent<IFieldListProps & IFieldListPrivateProps> {
-
-    static defaultProps = defaultProps;
-
-    constructor(props) {
-        super(props);
-        this._onAdd = this._onAdd.bind(this);
-        this._onRemove = this._onRemove.bind(this);
-        this._renderField = this._renderField.bind(this);
-        this._onKeyDown = this._onKeyDown.bind(this);
-    }
-
-    componentDidMount() {
-        if (this.props.fields.length === 0) {
-            for (let i = 0; i < this.props.initialRowsCount; i++) {
-                this._onAdd();
-            }
-        }
-        if (this.props.enableKeyboardNavigation && process.env.IS_WEB) {
-            document.addEventListener('keydown', this._onKeyDown, false);
-        }
-    }
-
-    componentWillUnmount() {
-        if (this.props.enableKeyboardNavigation && process.env.IS_WEB) {
-            document.removeEventListener('keydown', this._onKeyDown, false);
-        }
-    }
-
-    _onKeyDown(e) {
-        const isDescendant = (parent, child) => {
-            let node = child.parentNode;
-            while (node !== null) {
-                if (node === parent) {
-                    return true;
-                }
-                node = node.parentNode;
-            }
-            return false;
-        };
-        if (!isDescendant(findDOMNode(this), e.target)) {
-            return;
-        }
-        tableNavigationHandler(e, () =>
-            this.props.dispatch(arrayPush(this.props.formId, this.props.attribute))
-        );
-    }
-
-    render() {
-        const FieldListView =
-            this.props.view || this.props.ui.getView('form.FieldListView');
-        const FieldListItemView =
-            this.props.itemView || this.props.ui.getView('form.FieldListItemView');
-        const items = (this.props.items || [])
-            .filter(field => field.visible !== false)
-            .map(field => ({
-                ...getFieldPropsFromModel(this.props.model, field.attribute),
-                ...field,
-                disabled: field.disabled || this.props.disabled,
-                size: field.size || this.props.size
-            }));
-        return (
-            <FormContext.Provider
-                value={{
-                    formId: this.props.formId,
-                    model: this.props.model,
-                    prefix: this.props.prefix,
-                    layout: this.props.layout,
-                }}
-            >
-                <FieldListView
-                    {...this.props}
-                    {...this.props.view}
-                    items={items}
-                    renderField={this._renderField}
-                    onAdd={this._onAdd}
-                >
-                    {this.props.fields.map((prefix, rowIndex) => (
-                        <FieldListItemView
-                            {...this.props}
-                            {...this.props.itemViewProps}
-                            items={items}
-                            renderField={this._renderField}
-                            onRemove={this._onRemove}
-                            key={rowIndex}
-                            prefix={prefix}
-                            rowIndex={rowIndex}
-                        />
-                    ))}
-                </FieldListView>
-            </FormContext.Provider>
-        );
-    }
-
-    _renderField(field, prefix) {
-        return <Field layout='inline' {...field} prefix={prefix}/>;
-    }
-
-    _onAdd() {
-        this.props.fields.push(this.props.initialValues);
-    }
-
-    _onRemove(rowIndex) {
-        this.props.fields.remove(rowIndex);
-    }
-}
+import * as React from 'react';
+import {connect} from 'react-redux';
+import {arrayPush} from 'redux-form';
+import {findDOMNode} from 'react-dom';
+import {components, field} from '../../../hoc';
+import {getFieldPropsFromModel, IFieldHocInput, IFieldHocOutput} from '../../../hoc/field';
+import Field from '../Field';
+import tableNavigationHandler from './tableNavigationHandler';
+import {getModel} from '../../../reducers/fields';
+import {FormContext} from '../../../hoc/form';
+import {IConnectHocOutput} from '../../../hoc/connect';
+import {IComponentsHocOutput} from '../../../hoc/components';
+
+interface IFieldListItem extends IFieldHocInput {
+
+    /**
+     * Будет ли отображён item ?
+     * @example true
+     */
+    visible?: boolean,
+    component?: any,
+
+    /**
+     * Placeholder подсказка
+     * @example Your text...
+     */
+    placeholder?: string,
+    className?: CssClassName,
+    headerClassName?: CssClassName,
+    view?: CustomView,
+    [key: string]: any,
+}
+
+export interface IFieldListProps extends IFieldHocInput {
+    /**
+     * Начальные значения в полях
+     * @example {name: 'Ivan', amount: 5}
+     */
+    initialValues?: {[key: string]: any}
+    items?: IFieldListItem[];
+    fields?: any;
+    initialRowsCount?: number;
+    showAdd?: boolean;
+    showRemove?: boolean;
+    className?: CssClassName;
+    view?: any;
+    viewProps?: any;
+    itemView?: any;
+    itemViewProps?: any;
+    enableKeyboardNavigation?: boolean;
+    [key: string]: any;
+}
+
+export interface IFieldListViewProps extends IFieldHocOutput {
+    items?: (IFieldListItem & {
+        disabled?: boolean,
+        size?: boolean,
+    })[];
+    renderField?: (field: object, prefix: string) => any,
+    onAdd?: (e: any) => void,
+    showRemove?: boolean,
+    showAdd?: boolean,
+}
+
+export interface IFieldListItemViewProps extends IFieldHocOutput {
+    items?: (IFieldListItem & {
+        disabled?: boolean,
+        size?: boolean,
+    })[];
+    renderField?: (field: object, prefix: string) => any,
+    onRemove?: (rowIndex: number) => void,
+    prefix: string,
+    rowIndex: number,
+    showRemove: boolean,
+}
+
+interface IFieldListPrivateProps extends IFieldHocOutput, IConnectHocOutput, IComponentsHocOutput {
+
+}
+
+const defaultProps = {
+    disabled: false,
+    required: false,
+    showAdd: true,
+    showRemove: true,
+    className: '',
+    initialRowsCount: 1,
+    enableKeyboardNavigation: true,
+};
+
+@field({
+    componentId: 'form.FieldList',
+    list: true,
+})
+@connect((state, props) => ({
+    model: getModel(state, props.model),
+}))
+@components('ui')
+export default class FieldList extends React.PureComponent<IFieldListProps & IFieldListPrivateProps> {
+
+    static defaultProps = defaultProps;
+
+    constructor(props) {
+        super(props);
+        this._onAdd = this._onAdd.bind(this);
+        this._onRemove = this._onRemove.bind(this);
+        this._renderField = this._renderField.bind(this);
+        this._onKeyDown = this._onKeyDown.bind(this);
+    }
+
+    componentDidMount() {
+        if (this.props.fields.length === 0) {
+            for (let i = 0; i < this.props.initialRowsCount; i++) {
+                this._onAdd();
+            }
+        }
+        if (this.props.enableKeyboardNavigation && process.env.IS_WEB) {
+            document.addEventListener('keydown', this._onKeyDown, false);
+        }
+    }
+
+    componentWillUnmount() {
+        if (this.props.enableKeyboardNavigation && process.env.IS_WEB) {
+            document.removeEventListener('keydown', this._onKeyDown, false);
+        }
+    }
+
+    _onKeyDown(e) {
+        const isDescendant = (parent, child) => {
+            let node = child.parentNode;
+            while (node !== null) {
+                if (node === parent) {
+                    return true;
+                }
+                node = node.parentNode;
+            }
+            return false;
+        };
+        if (!isDescendant(findDOMNode(this), e.target)) {
+            return;
+        }
+        tableNavigationHandler(e, () =>
+            this.props.dispatch(arrayPush(this.props.formId, this.props.attribute))
+        );
+    }
+
+    render() {
+        const FieldListView =
+            this.props.view || this.props.ui.getView('form.FieldListView');
+        const FieldListItemView =
+            this.props.itemView || this.props.ui.getView('form.FieldListItemView');
+        const items = (this.props.items || [])
+            .filter(field => field.visible !== false)
+            .map(field => ({
+                ...getFieldPropsFromModel(this.props.model, field.attribute),
+                ...field,
+                disabled: field.disabled || this.props.disabled,
+                size: field.size || this.props.size
+            }));
+        return (
+            <FormContext.Provider
+                value={{
+                    formId: this.props.formId,
+                    model: this.props.model,
+                    prefix: this.props.prefix,
+                    layout: this.props.layout,
+                }}
+            >
+                <FieldListView
+                    {...this.props}
+                    {...this.props.view}
+                    items={items}
+                    renderField={this._renderField}
+                    onAdd={this._onAdd}
+                >
+                    {this.props.fields.map((prefix, rowIndex) => (
+                        <FieldListItemView
+                            {...this.props}
+                            {...this.props.itemViewProps}
+                            items={items}
+                            renderField={this._renderField}
+                            onRemove={this._onRemove}
+                            key={rowIndex}
+                            prefix={prefix}
+                            rowIndex={rowIndex}
+                        />
+                    ))}
+                </FieldListView>
+            </FormContext.Provider>
+        );
+    }
+
+    _renderField(field, prefix) {
+        return <Field layout='inline' {...field} prefix={prefix}/>;
+    }
+
+    _onAdd() {
+        this.props.fields.push(this.props.initialValues);
+    }
+
+    _onRemove(rowIndex) {
+        this.props.fields.remove(rowIndex);
+    }
+}