@steroidsjs/core 3.0.0-beta.53 → 3.0.0-beta.54

package/actions/list.d.ts

@@ -13,6 +13,11 @@ export interface IList {
     * Функция обратного вызова, вызываемая при получении списка.
     */
     onFetch?: (list: IList, query: Record<string, unknown>, components: any) => Promise<any>;
+    /**
+     * Обработчик события ошибки выполнения запроса
+     * @param args
+     */
+    onError?: (error: Record<string, any>) => void;
     /**
     * Функция условия, используемая для определения поведения списка на основе параметров запроса.
     */

package/actions/list.js

@@ -43,6 +43,7 @@ var createList = function (listId, props) { return ({
     action: props.action || props.action === '' ? props.action : null,
     actionMethod: props.actionMethod || 'get',
     onFetch: props.onFetch,
+    onError: props.onError,
     condition: props.condition,
     scope: props.scope,
     total: props.total || null,
@@ -74,7 +75,11 @@ var httpFetchHandler = function (list, query, _a) {
     }
     return http
         .send(list.actionMethod, url || window.location.pathname, query)
-        .then(function (response) { return response.data; });
+        .then(function (response) { return response.data; })["catch"](function (error) {
+        if (typeof list.onError === 'function') {
+            list.onError(error);
+        }
+    });
 };
 exports.httpFetchHandler = httpFetchHandler;
 var localFetchHandler = function (list, query) {

package/components/UiComponent.d.ts

@@ -1,10 +1,139 @@
+import * as React from 'react';
 import { ReactNode } from 'react';
 import { IComponents } from '../providers/ComponentsProvider';
 /**
  * Ui Component
  * Компонент для подгрузки и конфигурации UI компонентов приложения
  */
-export default class UiComponent {
+export interface IUiApplicationComponent {
+    /**
+    * Компоненты приложения.
+    */
+    components: IComponents;
+    /**
+    * Иконки для использования в приложении.
+    */
+    icons: {
+        [name: string]: string | number | ReactNode;
+    };
+    /**
+    * Компоненты полей формы для использования в приложении.
+    */
+    fields: any;
+    /**
+    * Компоненты форматтеры для использования в приложении.
+    */
+    formatters: any;
+    /**
+    * Зарегистрированные компоненты полей формы.
+    */
+    _registeredFields: any;
+    /**
+    * Элемент портала.
+    */
+    _portalElement: HTMLElement | null;
+    /**
+     * Добавляет компоненты представлений.
+     * @param {any} components - Компоненты представлений.
+     */
+    addViews(components: any): void;
+    /**
+     * Рендерит компонент представления.
+     * @param {any} Component - Компонент или путь к компоненту представления.
+     * @param {any} props - Свойства компонента.
+     * @param {boolean} [forceNode=false] - Флаг, указывающий на принудительное отображение компонента как узла.
+     * @returns {React.ReactElement<any>|null} Возвращает элемент React или null.
+     */
+    renderView(Component: any, props: any, forceNode?: boolean): React.ReactElement<any> | null;
+    /**
+     * Возвращает компонент представления по указанному пути.
+     * @param {string} path - Путь к компоненту представления.
+     * @returns {any} Компонент представления или undefined, если не найден.
+     */
+    getView(path: any): any;
+    /**
+     * Добавляет компоненты полей формы.
+     * @param {any} components - Компоненты полей формы.
+     */
+    addFields(components: any): void;
+    /**
+     * Возвращает компонент поля формы по указанному пути.
+     * @param {string} path - Путь к компоненту поля формы.
+     * @returns {React.ComponentType<any>|undefined} Компонент поля формы или undefined, если не найден.
+     */
+    getField(path: string): React.ComponentType<any> | undefined;
+    /**
+     * Возвращает свойства конфигурации компонента поля формы по указанному пути.
+     * @param {string} path - Путь к компоненту поля формы.
+     * @param {any} model - Модель.
+     * @param {any} attribute - Атрибут.
+     * @returns {any} Свойства конфигурации компонента поля формы.
+     */
+    getFieldProps(path: string, model?: any, attribute?: any): any;
+    /**
+     * Добавляет компоненты форматтеров.
+     * @param {any} components - Компоненты форматтеров.
+     */
+    addFormatters(components: any): void;
+    /**
+     * Возвращает компонент форматтера по указанному пути.
+     * @param {string} path - Путь к компоненту форматтера.
+     * @returns {React.ComponentType<any>|undefined} Компонент форматтера или undefined, если не найден.
+     */
+    getFormatter(path: string): React.ComponentType<any> | undefined;
+    /**
+     * Возвращает свойства конфигурации компонента форматтера по указанному пути.
+     * @param {string} path - Путь к компоненту форматтера.
+     * @returns {any} Свойства конфигурации компонента форматтера.
+     */
+    getFormatterProps(path: string): any;
+    /**
+     * Добавляет иконки.
+     * @param {{ [name: string]: string | ReactNode }} icons - Иконки.
+     */
+    addIcons(icons: {
+        [name: string]: string | ReactNode;
+    }): void;
+    /**
+     * Возвращает иконку по указанному имени.
+     * @param {string} name - Имя иконки.
+     * @returns {string | number | ReactNode | null} Иконка или null, если не найдена.
+     */
+    getIcon(name: string): string | number | ReactNode | null;
+    /**
+     * Добавляет модели.
+     * @param {any} models - Модели.
+     */
+    addModels(models: any): void;
+    /**
+     * Регистрирует поле формы.
+     * @param {string} formId - Идентификатор формы.
+     * @param {string} attribute - Атрибут.
+     * @param {any} type - Тип.
+     */
+    registerField(formId: string, attribute: string, type: any): void;
+    /**
+     * Возвращает зарегистрированные поля формы для указанного идентификатора формы.
+     * @param {string} formId - Идентификатор формы.
+     * @returns {any} Зарегистрированные поля формы.
+     */
+    getRegisteredFields(formId: string): any;
+    /**
+     * Задает элемент портала.
+     * @param {HTMLElement} element - Элемент портала.
+     */
+    setPortalElement(element: HTMLElement): void;
+    /**
+     * Возвращает элемент портала.
+     * @returns {HTMLElement | null} Элемент портала или null, если не задан.
+     */
+    getPortalElement(): HTMLElement | null;
+}
+/**
+ * Ui Component
+ * Компонент для подгрузки и конфигурации UI компонентов приложения
+ */
+export default class UiComponent implements IUiApplicationComponent {
     components: IComponents;
     _components: any;
     _models: any;

package/hooks/useList.d.ts

@@ -102,6 +102,11 @@ export interface IListConfig {
      * @return {Promise}
      */
     onFetch?: (list: IList, query: Record<string, unknown>, http: any) => Promise<any>;
+    /**
+     * Обработчик события ошибки выполнения запроса
+     * @param args
+     */
+    onError?: (error: Record<string, any>) => void;
     /**
      * Обработчик, который составляет список условий для локальной фильтрации элементов коллекции
      * @param {Object} query

package/hooks/useList.js

@@ -189,6 +189,7 @@ function useList(config) {
                     action: config.action || config.action === '' ? config.action : null,
                     actionMethod: config.actionMethod || exports.defaultConfig.actionMethod,
                     onFetch: config.onFetch,
+                    onError: config.onError,
                     condition: config.condition,
                     scope: config.scope,
                     items: null,

package/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@steroidsjs/core",
- "version": "3.0.0-beta.53",
+ "version": "3.0.0-beta.54",
  "description": "",
  "author": "Vladimir Kozhin <hello@kozhindev.com>",
  "repository": {
@@ -28,6 +28,7 @@
   "@maskito/core": "^0.12.1",
   "@maskito/kit": "^0.12.1",
   "@maskito/react": "^0.12.1",
+  "@splidejs/react-splide": "^0.7.12",
   "axios": "^0.21.1",
   "connected-react-router": "^6.9.3",
   "domready": "^1.0.8",

package/providers/ComponentsProvider.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { PropsWithChildren } from 'react';
+import { IUiApplicationComponent } from 'src/components/UiComponent';
 import { IResourceComponent } from '../components/ResourceComponent';
 declare global {
     interface Window {
@@ -13,7 +14,7 @@ export interface IComponents {
     http?: any;
     locale?: any;
     store?: any;
-    ui?: any;
+    ui?: IUiApplicationComponent;
     resource?: IResourceComponent;
     ws?: any;
     pushNotification?: any;

package/ui/content/Accordion/AccordionItem.d.ts

@@ -1,5 +1,6 @@
+/// <reference types="react" />
 import { IAccordionItemProps } from './Accordion';
-declare function AccordionItem(props: IAccordionItemProps): any;
+declare function AccordionItem(props: IAccordionItemProps): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
 declare namespace AccordionItem {
     var defaultProps: import("./Accordion").IAccordionViewProps;
 }

package/ui/content/Avatar/Avatar.d.ts

@@ -49,7 +49,7 @@ export interface IAvatarViewProps extends IAvatarProps {
     onError: () => void;
     formattedTitle: () => void;
 }
-declare function Avatar(props: IAvatarProps): any;
+declare function Avatar(props: IAvatarProps): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
 declare namespace Avatar {
     var defaultProps: {
         size: string;

package/ui/content/Calendar/Calendar.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { DayPickerProps } from 'react-day-picker';
 export interface ICalendarProps extends IUiComponent {
     /**
@@ -67,7 +68,7 @@ export interface ICalendarViewProps extends ICalendarProps {
      */
     toggleCaptionPanel: () => void;
 }
-declare function Calendar(props: ICalendarProps): any;
+declare function Calendar(props: ICalendarProps): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
 declare namespace Calendar {
     var defaultProps: {
         numberOfMonths: number;

package/ui/content/Card/Card.d.ts

@@ -90,5 +90,5 @@ export interface ICardProps extends IUiComponent {
     title?: string;
 }
 export type ICardViewProps = ICardProps;
-declare function Card(props: ICardProps): any;
+declare function Card(props: ICardProps): import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
 export default Card;

package/ui/content/CopyToClipboard/CopyToClipboard.d.ts

@@ -53,7 +53,7 @@ export interface ICopyToClipboardProps extends IUiComponent {
 export interface ICopyToClipboardViewProps extends ICopyToClipboardProps {
     onClick: () => void;
 }
-declare function CopyToClipboard(props: ICopyToClipboardProps): any;
+declare function CopyToClipboard(props: ICopyToClipboardProps): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
 declare namespace CopyToClipboard {
     var defaultProps: {
         showCopyIcon: boolean;

package/ui/content/Slider/Slider.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { Options, SplideProps } from '@splidejs/react-splide';
+/**
+ * Пропсы для компонента Slider.
+ */
+export interface ISliderProps extends IUiComponent, Omit<SplideProps, 'items'> {
+    /**
+     * Опции слайдера.
+     */
+    sliderOptions: Options;
+    /**
+     * Элементы слайдера.
+     */
+    items: Record<string, any>[];
+    /**
+     * Представление элемента слайдера.
+     */
+    itemView: CustomView | any;
+    /**
+     * Дополнительные свойства.
+     */
+    [key: string]: any;
+}
+export type ISliderViewProps = ISliderProps;
+export default function Slider(props: ISliderProps): React.ReactElement<any, string | React.JSXElementConstructor<any>>;

package/ui/content/Slider/Slider.js

@@ -0,0 +1,19 @@
+"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);
+};
+exports.__esModule = true;
+var hooks_1 = require("../../../hooks");
+function Slider(props) {
+    var components = (0, hooks_1.useComponents)();
+    return components.ui.renderView(props.view || 'content.SliderView', __assign({}, props));
+}
+exports["default"] = Slider;

package/ui/content/Slider/index.d.ts

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

package/ui/content/Slider/index.js

@@ -0,0 +1,7 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+exports.__esModule = true;
+var Slider_1 = __importDefault(require("./Slider"));
+exports["default"] = Slider_1["default"];

package/ui/content/index.d.ts

@@ -8,4 +8,5 @@ import { Detail, DetailItem } from './Detail';
 import Icon from './Icon';
 import Menu from './Menu';
 import CopyToClipboard from './CopyToClipboard';
-export { Avatar, AvatarGroup, Accordion, AccordionItem, Alert, Card, DropDown, Badge, Detail, DetailItem, Icon, Menu, CopyToClipboard, };
+import Slider from './Slider';
+export { Avatar, AvatarGroup, Accordion, AccordionItem, Alert, Card, DropDown, Badge, Detail, DetailItem, Icon, Menu, CopyToClipboard, Slider, };

package/ui/content/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
-exports.CopyToClipboard = exports.Menu = exports.Icon = exports.DetailItem = exports.Detail = exports.Badge = exports.DropDown = exports.Card = exports.Alert = exports.AccordionItem = exports.Accordion = exports.AvatarGroup = exports.Avatar = void 0;
+exports.Slider = exports.CopyToClipboard = exports.Menu = exports.Icon = exports.DetailItem = exports.Detail = exports.Badge = exports.DropDown = exports.Card = exports.Alert = exports.AccordionItem = exports.Accordion = exports.AvatarGroup = exports.Avatar = void 0;
 var Avatar_1 = require("./Avatar");
 exports.Avatar = Avatar_1.Avatar;
 exports.AvatarGroup = Avatar_1.AvatarGroup;
@@ -27,3 +27,5 @@ var Menu_1 = __importDefault(require("./Menu"));
 exports.Menu = Menu_1["default"];
 var CopyToClipboard_1 = __importDefault(require("./CopyToClipboard"));
 exports.CopyToClipboard = CopyToClipboard_1["default"];
+var Slider_1 = __importDefault(require("./Slider"));
+exports.Slider = Slider_1["default"];

package/ui/form/CheckboxField/CheckboxField.js

@@ -42,14 +42,19 @@ var react_1 = require("react");
 var fieldWrapper_1 = __importDefault(require("../Field/fieldWrapper"));
 var hooks_1 = require("../../../hooks");
 function CheckboxField(props) {
+    var _a, _b;
     var components = (0, hooks_1.useComponents)();
     var onChangeHandler = React.useCallback(function () {
-        props.input.onChange(!props.input.value);
+        var _a;
+        props.input.onChange(!((_a = props.input) === null || _a === void 0 ? void 0 : _a.value));
         if (props.onChange) {
             props.onChange();
         }
     }, [props]);
-    var inputProps = (0, react_1.useMemo)(function () { return (__assign({ name: props.input.name, type: 'checkbox', checked: !!props.input.value, onChange: onChangeHandler, disabled: props.disabled }, props.inputProps)); }, [onChangeHandler, props.disabled, props.input.name, props.input.value, props.inputProps]);
+    var inputProps = (0, react_1.useMemo)(function () {
+        var _a, _b;
+        return (__assign({ name: (_a = props.input) === null || _a === void 0 ? void 0 : _a.name, type: 'checkbox', checked: !!((_b = props.input) === null || _b === void 0 ? void 0 : _b.value), onChange: onChangeHandler, disabled: props.disabled }, props.inputProps));
+    }, [onChangeHandler, props.disabled, (_a = props.input) === null || _a === void 0 ? void 0 : _a.name, (_b = props.input) === null || _b === void 0 ? void 0 : _b.value, props.inputProps]);
     return components.ui.renderView(props.view || 'form.CheckboxFieldView', __assign(__assign({}, props), { inputProps: inputProps }));
 }
 CheckboxField.defaultProps = {

package/ui/form/Form/Form.js

@@ -274,8 +274,12 @@ function Form(props) {
                         requestError_1 = _c.sent();
                         console.error(requestError_1); // eslint-disable-line no-console
                         dispatch((0, form_2.formSetSubmitting)(props.formId, false));
-                        props.onError(requestError_1);
-                        reduxDispatch((0, notifications_1.showNotification)(props.submitErrorMessage || __('Ошибка сервера'), 'danger'));
+                        if (typeof props.onError === 'function') {
+                            props.onError(requestError_1);
+                        }
+                        else {
+                            reduxDispatch((0, notifications_1.showNotification)(props.submitErrorMessage || __('Ошибка сервера'), 'danger'));
+                        }
                         return [2 /*return*/, null];
                     case 12:
                         // Skip on 2fa

package/ui/list/CheckboxColumn/CheckboxColumn.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { IContentColumnViewProps } from '../Grid/Grid';
+import { IColumnViewProps } from '../Grid/Grid';
 /**
  * CheckboxColumn
  * Колонка с чекбоксом, которая позволяет выбирать одну или все записи в таблице.
@@ -24,7 +24,7 @@ export interface ICheckboxColumnProps {
     view?: CustomView;
     [key: string]: any;
 }
-export interface ICheckboxColumnViewProps extends IContentColumnViewProps {
+export interface ICheckboxColumnViewProps extends IColumnViewProps {
     fieldProps: Record<string, any>;
     input: {
         name: string;

package/ui/list/Grid/Grid.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { ILinkProps } from 'src/ui/nav/Link/Link';
 import { IListConfig, ListControlPosition } from '../../../hooks/useList';
 import { IControlItem } from '../../nav/Controls/Controls';
-export interface IContentColumnViewProps extends IGridColumn {
+export interface IColumnViewProps extends IGridColumn {
     item: Record<string, any>;
     size: Size;
     primaryKey: string;
@@ -97,6 +97,18 @@ export interface IGridColumn {
         attribute: string;
         isLeft?: boolean;
     };
+    /**
+    * Диаграмма.
+    * Цвет должен соответствовать success | warning | danger | secondary.
+    * Цвета можно расширить или изменить через стили (см. colors.scss в react-bootstrap)
+    */
+    diagram?: {
+        type: 'horizontal' | 'vertical' | 'circle';
+        items: {
+            color: 'success' | 'warning' | 'danger' | 'secondary' | string;
+            percentageAttribute: string;
+        }[];
+    };
 }
 /**
  * Grid

package/ui/list/List/List.js

@@ -55,6 +55,7 @@ function List(props) {
         searchForm: props.searchForm,
         autoDestroy: props.autoDestroy,
         onFetch: props.onFetch,
+        onError: props.onError,
         condition: props.condition,
         addressBar: props.addressBar,
         scope: props.scope,

package/ui/nav/Tree/Tree.d.ts

@@ -86,7 +86,7 @@ export interface ITreeViewProps extends ITreeProps {
     })[];
     levelPadding?: number;
 }
-declare function Tree(props: ITreeProps): any;
+declare function Tree(props: ITreeProps): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
 declare namespace Tree {
     var defaultProps: {
         itemsKey: string;