@steroidsjs/core 2.3.0-beta.6 → 2.3.0-beta.9

package/ui/form/FieldList/FieldList.d.ts

@@ -1,127 +1,127 @@
-import * as React from 'react';
-import { IFieldWrapperInputProps, IFieldWrapperOutputProps } from '../../form/Field/fieldWrapper';
-/**
- * FieldList
- * Создает список из сгруппированных полей формы
- */
-interface IFieldListItem extends IFieldWrapperInputProps {
-    /**
-     * Будет ли отображён item ?
-     * @example true
-     */
-    visible?: boolean;
-    /**
-     * Какой компонент для item использовать?
-     * @example NumberField
-     */
-    component?: any;
-    /**
-     * Placeholder подсказка
-     * @example Your text...
-     */
-    placeholder?: string;
-    /**
-     * Дополнительный CSS-класс для item
-     */
-    className?: CssClassName;
-    /**
-     * Дополнительный CSS-класс для заголовка
-     */
-    headerClassName?: CssClassName;
-    /**
-     * Переопределение view React компонента для кастомизации отображения item
-     * @example MyCustomView
-     */
-    view?: CustomView;
-    [key: string]: any;
-}
-export interface IFieldListProps extends IFieldWrapperInputProps {
-    /**
-     * Начальные значения в полях
-     * @example {name: 'Ivan', amount: 5}
-     */
-    initialValues?: {
-        [key: string]: any;
-    };
-    /**
-     * Список с полями формы
-     */
-    items?: IFieldListItem[];
-    /**
-     * Изначальное количество групп с полями
-     * @example 2
-     */
-    initialRowsCount?: number;
-    /**
-     * Отображение кнопки для добавления ещё одной группы с полями
-     * @example true
-     */
-    showAdd?: boolean;
-    /**
-     * Возможность удаления группы с полями (добавляет крестик справа от группы)
-     * @example true
-     */
-    showRemove?: boolean;
-    /**
-     * Дополнительный CSS-класс для списка с группами полей
-     */
-    className?: CssClassName;
-    /**
-     * Дополнительный CSS-класс для таблицы
-     */
-    tableClassName?: CssClassName;
-    /**
-     * Переопределение view React компонента для кастомизации отображения списка с группами полей
-     * @example MyCustomView
-     */
-    view?: any;
-    /**
-     * Пропсы для компонента отображения списка с группами полей - FieldListView
-     */
-    viewProps?: any;
-    /**
-     * Переопределение view React компонента для кастомизации отображения группы полей
-     * @example MyCustomView
-     */
-    itemView?: any;
-    /**
-     * Пропсы для компонента отображения группы полей - FieldListItemView
-     */
-    itemViewProps?: any;
-    /**
-     * При фокусировке на одном из элементов формы и нажатию на клавиши стрелок вверх/вниз + Shift
-     * происходит добавление группы полей сверху или снизу соответственно
-     * @example true
-     */
-    enableKeyboardNavigation?: boolean;
-    [key: string]: any;
-}
-export interface IFieldListViewProps {
-    items?: (IFieldListItem & {
-        disabled?: boolean;
-        size?: boolean;
-    })[];
-    onAdd?: () => void;
-    showRemove?: boolean;
-    showAdd?: boolean;
-    children?: React.ReactNode;
-    className?: string;
-    tableClassName?: string;
-    style?: any;
-    forwardedRef?: any;
-    disabled?: boolean;
-    size?: Size;
-}
-export interface IFieldListItemViewProps extends IFieldWrapperOutputProps {
-    items?: (IFieldListItem & {
-        disabled?: boolean;
-        size?: boolean;
-    })[];
-    onRemove?: (rowIndex: number) => void;
-    prefix: string;
-    required?: boolean;
-    rowIndex: number;
-    showRemove: boolean;
-}
-declare const _default: import("../../form/Field/fieldWrapper").FieldWrapperComponent<IFieldListProps>;
-export default _default;
+import * as React from 'react';
+import { IFieldWrapperInputProps, IFieldWrapperOutputProps } from '../../form/Field/fieldWrapper';
+/**
+ * FieldList
+ * Создает список из сгруппированных полей формы
+ */
+interface IFieldListItem extends IFieldWrapperInputProps {
+    /**
+     * Будет ли отображён item ?
+     * @example true
+     */
+    visible?: boolean;
+    /**
+     * Какой компонент для item использовать?
+     * @example NumberField
+     */
+    component?: any;
+    /**
+     * Placeholder подсказка
+     * @example Your text...
+     */
+    placeholder?: string;
+    /**
+     * Дополнительный CSS-класс для item
+     */
+    className?: CssClassName;
+    /**
+     * Дополнительный CSS-класс для заголовка
+     */
+    headerClassName?: CssClassName;
+    /**
+     * Переопределение view React компонента для кастомизации отображения item
+     * @example MyCustomView
+     */
+    view?: CustomView;
+    [key: string]: any;
+}
+export interface IFieldListProps extends IFieldWrapperInputProps {
+    /**
+     * Начальные значения в полях
+     * @example {name: 'Ivan', amount: 5}
+     */
+    initialValues?: {
+        [key: string]: any;
+    };
+    /**
+     * Список с полями формы
+     */
+    items?: IFieldListItem[];
+    /**
+     * Изначальное количество групп с полями
+     * @example 2
+     */
+    initialRowsCount?: number;
+    /**
+     * Отображение кнопки для добавления ещё одной группы с полями
+     * @example true
+     */
+    showAdd?: boolean;
+    /**
+     * Возможность удаления группы с полями (добавляет крестик справа от группы)
+     * @example true
+     */
+    showRemove?: boolean;
+    /**
+     * Дополнительный CSS-класс для списка с группами полей
+     */
+    className?: CssClassName;
+    /**
+     * Дополнительный CSS-класс для таблицы
+     */
+    tableClassName?: CssClassName;
+    /**
+     * Переопределение view React компонента для кастомизации отображения списка с группами полей
+     * @example MyCustomView
+     */
+    view?: any;
+    /**
+     * Пропсы для компонента отображения списка с группами полей - FieldListView
+     */
+    viewProps?: any;
+    /**
+     * Переопределение view React компонента для кастомизации отображения группы полей
+     * @example MyCustomView
+     */
+    itemView?: any;
+    /**
+     * Пропсы для компонента отображения группы полей - FieldListItemView
+     */
+    itemViewProps?: any;
+    /**
+     * При фокусировке на одном из элементов формы и нажатию на клавиши стрелок вверх/вниз + Shift
+     * происходит добавление группы полей сверху или снизу соответственно
+     * @example true
+     */
+    enableKeyboardNavigation?: boolean;
+    [key: string]: any;
+}
+export interface IFieldListViewProps {
+    items?: (IFieldListItem & {
+        disabled?: boolean;
+        size?: boolean;
+    })[];
+    onAdd?: () => void;
+    showRemove?: boolean;
+    showAdd?: boolean;
+    children?: React.ReactNode;
+    className?: string;
+    tableClassName?: string;
+    style?: any;
+    forwardedRef?: any;
+    disabled?: boolean;
+    size?: Size;
+}
+export interface IFieldListItemViewProps extends IFieldWrapperOutputProps {
+    items?: (IFieldListItem & {
+        disabled?: boolean;
+        size?: boolean;
+    })[];
+    onRemove?: (rowIndex: number) => void;
+    prefix: string;
+    required?: boolean;
+    rowIndex: number;
+    showRemove: boolean;
+}
+declare const _default: import("../../form/Field/fieldWrapper").FieldWrapperComponent<IFieldListProps>;
+export default _default;

package/ui/form/FieldList/FieldList.js

@@ -1,119 +1,119 @@
-"use strict";
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-var React = __importStar(require("react"));
-var isBoolean_1 = __importDefault(require("lodash-es/isBoolean"));
-var range_1 = __importDefault(require("lodash-es/range"));
-var react_use_1 = require("react-use");
-var react_1 = require("react");
-var hooks_1 = require("../../../hooks");
-var Form_1 = require("../../form/Form/Form");
-var form_1 = require("../../../actions/form");
-var tableNavigationHandler_1 = __importStar(require("./tableNavigationHandler"));
-var fieldWrapper_1 = __importDefault(require("../../form/Field/fieldWrapper"));
-function FieldList(props) {
-    var _a;
-    var components = hooks_1.useComponents();
-    var context = react_1.useContext(Form_1.FormContext);
-    // Resolve model
-    var modelAttributes = (_a = components.meta.getModel(props.model)) === null || _a === void 0 ? void 0 : _a.attributes;
-    var dispatch = context.provider.useDispatch();
-    // Add and Remove handlers
-    var onAdd = react_1.useCallback(function (rowsCount) {
-        if (rowsCount === void 0) { rowsCount = 1; }
-        dispatch(form_1.formArrayAdd(context.formId, props.input.name, rowsCount, props.initialValues));
-    }, [context.formId, dispatch, props.initialValues, props.input.name]);
-    var onRemove = react_1.useCallback(function (rowIndex) {
-        dispatch(form_1.formArrayRemove(context.formId, props.input.name, rowIndex));
-    }, [context.formId, dispatch, props.input.name]);
-    // Add initial rows
-    react_use_1.useMount(function () {
-        if (!props.input.value) {
-            onAdd(props.initialRowsCount);
-        }
-    });
-    // Keyboard navigation
-    var nodeRef = react_1.useRef();
-    var onKeyDown = react_1.useCallback(function (event) {
-        if (props.enableKeyboardNavigation && tableNavigationHandler_1.isDescendant(nodeRef.current, event.target)) {
-            tableNavigationHandler_1["default"](event, function () { return onAdd(); });
-        }
-    }, [onAdd, props.enableKeyboardNavigation]);
-    react_use_1.useEvent('keydown', onKeyDown);
-    // Rows items
-    var items = react_1.useMemo(function () { return (props.items || [])
-        .filter(function (field) { return field.visible !== false; })
-        .map(function (field) {
-        if (typeof field === 'string') {
-            field = { attribute: field };
-        }
-        return __assign(__assign(__assign({}, (modelAttributes || []).find(function (attributeItem) { return attributeItem.attribute === field.attribute; })), field), { disabled: isBoolean_1["default"](field.disabled) ? field.disabled : props.disabled, size: field.size || props.size });
-    }); }, [modelAttributes, props.disabled, props.items, props.size]);
-    var contextValue = react_1.useMemo(function () { return ({
-        formId: props.formId,
-        model: props.model,
-        prefix: props.prefix,
-        size: props.size,
-        layout: props.layout,
-        provider: context.provider,
-        reducer: context.reducer
-    }); }, [context.provider, context.reducer, props.formId, props.layout, props.model, props.prefix, props.size]);
-    var commonProps = {
-        showAdd: props.showAdd,
-        showRemove: props.showRemove,
-        size: props.size,
-        disabled: props.disabled,
-        required: props.required,
-        className: props.className,
-        tableClassName: props.tableClassName,
-        items: items
-    };
-    var FieldListView = props.view || components.ui.getView('form.FieldListView');
-    var FieldListItemView = props.itemView || components.ui.getView('form.FieldListItemView');
-    return (React.createElement(Form_1.FormContext.Provider, { value: contextValue },
-        React.createElement(FieldListView, __assign({}, props.viewProps, commonProps, { forwardedRef: nodeRef, onAdd: onAdd }), range_1["default"](props.input.value || 0)
-            .map(function (index) { return (React.createElement(FieldListItemView, __assign({}, props.itemViewProps, commonProps, { key: index, onRemove: onRemove, prefix: props.input.name + '.' + index, rowIndex: index }))); }))));
-}
-FieldList.defaultProps = {
-    initialValues: null,
-    disabled: false,
-    required: false,
-    showAdd: true,
-    showRemove: true,
-    className: '',
-    initialRowsCount: 1,
-    enableKeyboardNavigation: true
-};
-exports["default"] = fieldWrapper_1["default"]('FieldList', FieldList, { list: true });
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var React = __importStar(require("react"));
+var isBoolean_1 = __importDefault(require("lodash-es/isBoolean"));
+var range_1 = __importDefault(require("lodash-es/range"));
+var react_use_1 = require("react-use");
+var react_1 = require("react");
+var hooks_1 = require("../../../hooks");
+var Form_1 = require("../../form/Form/Form");
+var form_1 = require("../../../actions/form");
+var tableNavigationHandler_1 = __importStar(require("./tableNavigationHandler"));
+var fieldWrapper_1 = __importDefault(require("../../form/Field/fieldWrapper"));
+function FieldList(props) {
+    var _a;
+    var components = hooks_1.useComponents();
+    var context = react_1.useContext(Form_1.FormContext);
+    // Resolve model
+    var modelAttributes = (_a = components.meta.getModel(props.model)) === null || _a === void 0 ? void 0 : _a.attributes;
+    var dispatch = context.provider.useDispatch();
+    // Add and Remove handlers
+    var onAdd = react_1.useCallback(function (rowsCount) {
+        if (rowsCount === void 0) { rowsCount = 1; }
+        dispatch(form_1.formArrayAdd(context.formId, props.input.name, rowsCount, props.initialValues));
+    }, [context.formId, dispatch, props.initialValues, props.input.name]);
+    var onRemove = react_1.useCallback(function (rowIndex) {
+        dispatch(form_1.formArrayRemove(context.formId, props.input.name, rowIndex));
+    }, [context.formId, dispatch, props.input.name]);
+    // Add initial rows
+    react_use_1.useMount(function () {
+        if (!props.input.value) {
+            onAdd(props.initialRowsCount);
+        }
+    });
+    // Keyboard navigation
+    var nodeRef = react_1.useRef();
+    var onKeyDown = react_1.useCallback(function (event) {
+        if (props.enableKeyboardNavigation && tableNavigationHandler_1.isDescendant(nodeRef.current, event.target)) {
+            tableNavigationHandler_1["default"](event, function () { return onAdd(); });
+        }
+    }, [onAdd, props.enableKeyboardNavigation]);
+    react_use_1.useEvent('keydown', onKeyDown);
+    // Rows items
+    var items = react_1.useMemo(function () { return (props.items || [])
+        .filter(function (field) { return field.visible !== false; })
+        .map(function (field) {
+        if (typeof field === 'string') {
+            field = { attribute: field };
+        }
+        return __assign(__assign(__assign({}, (modelAttributes || []).find(function (attributeItem) { return attributeItem.attribute === field.attribute; })), field), { disabled: isBoolean_1["default"](field.disabled) ? field.disabled : props.disabled, size: field.size || props.size });
+    }); }, [modelAttributes, props.disabled, props.items, props.size]);
+    var contextValue = react_1.useMemo(function () { return ({
+        formId: props.formId,
+        model: props.model,
+        prefix: props.prefix,
+        size: props.size,
+        layout: props.layout,
+        provider: context.provider,
+        reducer: context.reducer
+    }); }, [context.provider, context.reducer, props.formId, props.layout, props.model, props.prefix, props.size]);
+    var commonProps = {
+        showAdd: props.showAdd,
+        showRemove: props.showRemove,
+        size: props.size,
+        disabled: props.disabled,
+        required: props.required,
+        className: props.className,
+        tableClassName: props.tableClassName,
+        items: items
+    };
+    var FieldListView = props.view || components.ui.getView('form.FieldListView');
+    var FieldListItemView = props.itemView || components.ui.getView('form.FieldListItemView');
+    return (React.createElement(Form_1.FormContext.Provider, { value: contextValue },
+        React.createElement(FieldListView, __assign({}, props.viewProps, commonProps, { forwardedRef: nodeRef, onAdd: onAdd }), range_1["default"](props.input.value || 0)
+            .map(function (index) { return (React.createElement(FieldListItemView, __assign({}, props.itemViewProps, commonProps, { key: index, onRemove: onRemove, prefix: props.input.name + '.' + index, rowIndex: index }))); }))));
+}
+FieldList.defaultProps = {
+    initialValues: null,
+    disabled: false,
+    required: false,
+    showAdd: true,
+    showRemove: true,
+    className: '',
+    initialRowsCount: 1,
+    enableKeyboardNavigation: true
+};
+exports["default"] = fieldWrapper_1["default"]('FieldList', FieldList, { list: true });

package/ui/form/FieldList/demo/basic.d.ts

@@ -1,8 +1,8 @@
-/// <reference types="react" />
-declare const _default: () => JSX.Element;
-/**
- * Обычный пример использования FieldList.
- * @order 1
- * @col 12
- */
-export default _default;
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+/**
+ * Обычный пример использования FieldList.
+ * @order 1
+ * @col 12
+ */
+export default _default;

package/ui/form/FieldList/demo/basic.js

@@ -1,58 +1,58 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-exports.__esModule = true;
-var React = __importStar(require("react"));
-var FieldList_1 = __importDefault(require("../FieldList"));
-var Form_1 = __importDefault(require("../../Form"));
-var InputField_1 = __importDefault(require("../../InputField"));
-var NumberField_1 = __importDefault(require("../../NumberField"));
-/**
- * Обычный пример использования FieldList.
- * @order 1
- * @col 12
- */
-exports["default"] = (function () { return (React.createElement(React.Fragment, null,
-    React.createElement(Form_1["default"], { formId: 'FieldListForm' },
-        React.createElement(FieldList_1["default"], { attribute: 'items', label: 'Items', initialRowsCount: 2, items: [
-                {
-                    attribute: 'id',
-                    type: 'hidden',
-                    component: InputField_1["default"]
-                },
-                {
-                    label: 'Name',
-                    attribute: 'name',
-                    component: InputField_1["default"]
-                },
-                {
-                    label: 'Description',
-                    attribute: 'description',
-                    component: InputField_1["default"]
-                },
-                {
-                    label: 'Amount',
-                    attribute: 'amount',
-                    component: NumberField_1["default"]
-                },
-            ] })))); });
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var React = __importStar(require("react"));
+var FieldList_1 = __importDefault(require("../FieldList"));
+var Form_1 = __importDefault(require("../../Form"));
+var InputField_1 = __importDefault(require("../../InputField"));
+var NumberField_1 = __importDefault(require("../../NumberField"));
+/**
+ * Обычный пример использования FieldList.
+ * @order 1
+ * @col 12
+ */
+exports["default"] = (function () { return (React.createElement(React.Fragment, null,
+    React.createElement(Form_1["default"], { formId: 'FieldListForm' },
+        React.createElement(FieldList_1["default"], { attribute: 'items', label: 'Items', initialRowsCount: 2, items: [
+                {
+                    attribute: 'id',
+                    type: 'hidden',
+                    component: InputField_1["default"]
+                },
+                {
+                    label: 'Name',
+                    attribute: 'name',
+                    component: InputField_1["default"]
+                },
+                {
+                    label: 'Description',
+                    attribute: 'description',
+                    component: InputField_1["default"]
+                },
+                {
+                    label: 'Amount',
+                    attribute: 'amount',
+                    component: NumberField_1["default"]
+                },
+            ] })))); });

package/ui/form/FieldList/demo/disabled.d.ts

@@ -1,8 +1,8 @@
-/// <reference types="react" />
-declare const _default: () => JSX.Element;
-/**
- * Выключенный или недоступный для использования.
- * @order 2
- * @col 12
- */
-export default _default;
+/// <reference types="react" />
+declare const _default: () => JSX.Element;
+/**
+ * Выключенный или недоступный для использования.
+ * @order 2
+ * @col 12
+ */
+export default _default;