@steroidsjs/core 3.0.0-beta.10 → 3.0.0-beta.101

package/README.md

@@ -1,9 +1,26 @@
-# Steroids for React
+# Steroids
 
-Find documentation [here](docs/index.md)
+<p align="center">
+    <img src="https://i.ibb.co/Q9XvtNc/Group-338025.png" alt="Steroids logo" height="120px">
+</p>
 
-## Use package from source in project
+<p align="center">
+    <a href="https://steroids.kozhindev.com/">Steroids site</a> •
+    <a href="https://github.com/steroids/react/issues/new">Submit an Issue</a> •
+    <a href="https://t.me/+R0N4XzKbVSYzOTUy">Contact Us</a>
+</p>
+
+Our Open-Source **Steroids** framework is an ecosystem based on React and Redux with a large set of ready-made components, unique architecture, UI Kit and SSR
+
+## Why Steroids
+
+- **Steroids** contains ready-made project architecture
+
+- **Steroids** provides the ability to customize components, thanks to the separation of core and view parts
+
+- An extensive library of ready-made components with detailed documentation that simplifies integration into the project
+
+- Intuitive design layout of UI components in Figma for quick visualization and adaptation to unique needs
+
+Explore and immerse yourself in the world of rapid development through documentation [Documentation](https://steroids.kozhin.dev/ru/docs/getting-started).
 
-1. Copy `tsconfig-debug.json.sample` to `tsconfig-debug.json`
-2. Replace `outDir` path to node_modules nest path in project
-3. Run from this directory `yarn run watch`

package/actions/list.d.ts

@@ -1,25 +1,93 @@
-import { IApiMethod } from '../components/ApiComponent';
 export interface IList {
-    action?: string | IApiMethod;
+    /**
+    * Url, который вернет коллекцию элементов.
+    * @example api/v1/articles
+    */
+    action?: string;
+    /**
+    * Тип HTTP запроса (GET | POST | PUT | DELETE)
+    */
     actionMethod?: string;
+    /**
+    * Функция обратного вызова, вызываемая при получении списка.
+    */
     onFetch?: (list: IList, query: Record<string, unknown>, components: any) => Promise<any>;
+    /**
+     * Обработчик события ошибки выполнения запроса
+     * @param args
+     */
+    onError?: (error: Record<string, any>) => void;
+    /**
+    * Функция условия, используемая для определения поведения списка на основе параметров запроса.
+    */
     condition?: (query: Record<string, unknown>) => any;
+    /**
+    * Массив строк, представляющих область списка.
+    */
     scope?: string[];
+    /**
+    * Общее количество элементов в списке.
+    */
     total?: number;
+    /**
+    * Массив элементов списка.
+    */
     items?: Array<any>;
+    /**
+    * Массив исходных элементов списка.
+    */
     sourceItems?: Array<any>;
+    /**
+    * Логическое значение, указывающее, является ли список удаленным или нет.
+    */
     isRemote?: boolean;
+    /**
+    * Логическое значение, указывающее, можно ли загрузить еще элементы для списка.
+    */
     loadMore?: boolean;
+    /**
+    * Первичный ключ для списка.
+    */
     primaryKey?: string;
+    /**
+    * Идентификатор списка.
+    */
     listId?: string;
+    /**
+    * Идентификатор формы, связанной с данным списком.
+    */
     formId?: string;
+    /**
+    * Атрибут страницы для списка.
+    */
     pageAttribute?: string;
+    /**
+    * Атрибут размера страницы для списка.
+    */
     pageSizeAttribute?: string;
+    /**
+    * Атрибут сортировки для списка.
+    */
     sortAttribute?: string;
+    /**
+    * Атрибут макета для списка.
+    */
     layoutAttribute?: string;
+    /**
+    * Дополнительные метаданные для списка.
+    */
     meta?: any;
+    /**
+    * Логическое значение, указывающее, был ли список получен или нет.
+    */
     isFetched?: boolean;
+    /**
+    * Логическое значение, указывающее, находится ли список в процессе загрузки или нет.
+    */
     isLoading?: boolean;
+    /**
+    * Название макета, связанного с данным списком.
+    */
     layoutName?: null;
 }
 export declare const LIST_INIT = "@list/init";
@@ -33,8 +101,7 @@ export declare const LIST_DESTROY = "@list/destroy";
 export declare const LIST_TOGGLE_ITEM = "@list/toggle_item";
 export declare const LIST_TOGGLE_ALL = "@list/toggle_all";
 export declare const LIST_SET_LAYOUT = "@list/set_layout";
-export declare const httpFetchHandler: (list: IList, query: any, { api, http }: {
-    api: any;
+export declare const httpFetchHandler: (list: IList, query: any, { http }: {
     http: any;
 }) => any;
 export declare const localFetchHandler: (list: IList, query: Record<string, unknown>) => {

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,
@@ -59,14 +60,7 @@ var createList = function (listId, props) { return ({
     layoutAttribute: (0, get_1["default"])(props, '_layout.attribute') || null
 }); };
 var httpFetchHandler = function (list, query, _a) {
-    var api = _a.api, http = _a.http;
-    if (typeof list.action === 'function') {
-        var params = __assign({}, query);
-        if (list.scope) {
-            params.scope = list.scope.join(',');
-        }
-        return list.action(api, params).then(function (response) { return response.data; });
-    }
+    var http = _a.http;
     var url = list.action;
     if (list.scope) {
         url
@@ -74,7 +68,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/base/Enum.d.ts

@@ -1,11 +1,11 @@
 export default class Enum {
-    static getLabels(): {};
+    static getLabels(): Record<string, string>;
     static getKeys(): string[];
-    static getLabel(id: any): any;
+    static getLabel(id: any): string;
     static getCssClasses(): {};
     static getCssClass(id: any): any;
     static getDropdownItems(): {
-        label: unknown;
+        label: string;
         id: string;
     }[];
 }

package/components/ClientStorageComponent.d.ts

@@ -1,8 +1,44 @@
+export interface IClientStorageComponentConfig {
+    /**
+     * Кастомный домен
+     */
+    domain?: string;
+    /**
+     * Куки для режима ssr
+     */
+    ssrCookie?: any;
+}
+/**
+ * Интерфейс для ClientStorageComponent
+ */
+export interface IClientStorageComponent extends IClientStorageComponentConfig {
+    /**
+     * Получить значение из хранилища.
+     * @param name Имя записи.
+     * @param storageName (Необязательный) Имя хранилища (local, session, или cookie).
+     * @returns Значение записи.
+     */
+    get(name: string, storageName?: 'local' | 'session' | 'cookie'): string | null;
+    /**
+     * Установить значение в хранилище.
+     * @param name Имя записи.
+     * @param value Значение записи.
+     * @param storageName (Необязательный) Имя хранилища (local, session, или cookie).
+     * @param expires (Необязательный) Срок действия записи в днях.
+     */
+    set(name: string, value: string, storageName?: 'local' | 'session' | 'cookie', expires?: number | null): void;
+    /**
+     * Удалить значение из хранилища.
+     * @param name Имя записи.
+     * @param storageName (Необязательный) Имя хранилища (local, session, или cookie).
+     */
+    remove(name: string, storageName?: 'local' | 'session' | 'cookie'): void;
+}
 /**
  * Client Storage Component
  * Слой хранения данных в браузере (cookie, local/session storage) или ReactNative
  */
-export default class ClientStorageComponent {
+export default class ClientStorageComponent implements IClientStorageComponent {
     STORAGE_COOKIE: string;
     STORAGE_LOCAL: any;
     STORAGE_SESSION: any;
@@ -11,24 +47,8 @@ export default class ClientStorageComponent {
     domain?: string;
     private _ssrCookie;
     constructor(components: any, config: any);
-    /**
-     * @param {string} name
-     * @param {string} [storageName]
-     * @returns {*}
-     */
     get(name: any, storageName: any): any;
-    /**
-     * @param {string} name
-     * @param {*} value
-     * @param {string} [storageName]
-     * @param {number|null} [expires]
-     */
     set(name: any, value: any, storageName: any, expires?: any): void;
-    /**
-     *
-     * @param {string} name
-     * @param {string} [storageName]
-     */
     remove(name: any, storageName: any): void;
     _getDomain(): string;
 }

package/components/ClientStorageComponent.js

@@ -26,9 +26,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
+/* eslint-disable import/no-extraneous-dependencies */
 /* eslint-disable no-unused-expressions */
 var cookie = __importStar(require("js-cookie"));
-var moment_1 = __importDefault(require("moment"));
+var dayjs_1 = __importDefault(require("dayjs"));
 /**
  * Client Storage Component
  * Слой хранения данных в браузере (cookie, local/session storage) или ReactNative
@@ -53,7 +54,7 @@ var ClientStorageComponent = /** @class */ (function () {
         if (this.sessionStorageAvailable) {
             try {
                 window.sessionStorage.setItem('sessionStorageAvailable', '1');
-                this.sessionStorageAvailable = window.localStorage.getItem('sessionStorageAvailable') === '1';
+                this.sessionStorageAvailable = window.sessionStorage.getItem('sessionStorageAvailable') === '1';
                 window.sessionStorage.removeItem('sessionStorageAvailable');
             }
             catch (e) {
@@ -63,11 +64,6 @@ var ClientStorageComponent = /** @class */ (function () {
         this.domain = (config === null || config === void 0 ? void 0 : config.domain) || null;
         this._ssrCookie = config === null || config === void 0 ? void 0 : config.ssrCookie;
     }
-    /**
-     * @param {string} name
-     * @param {string} [storageName]
-     * @returns {*}
-     */
     ClientStorageComponent.prototype.get = function (name, storageName) {
         storageName = storageName || this.STORAGE_LOCAL;
         if (this.localStorageAvailable && storageName === this.STORAGE_LOCAL) {
@@ -79,12 +75,6 @@ var ClientStorageComponent = /** @class */ (function () {
         }
         return process.env.IS_SSR ? this._ssrCookie.get(name) : cookie.get(name);
     };
-    /**
-     * @param {string} name
-     * @param {*} value
-     * @param {string} [storageName]
-     * @param {number|null} [expires]
-     */
     ClientStorageComponent.prototype.set = function (name, value, storageName, expires) {
         if (expires === void 0) { expires = null; }
         storageName = storageName || this.STORAGE_LOCAL;
@@ -101,16 +91,11 @@ var ClientStorageComponent = /** @class */ (function () {
                 domain: this._getDomain()
             };
             if (expires && process.env.IS_SSR) {
-                options.expires = (0, moment_1["default"])().add(options.expires).utc().toDate();
+                options.expires = (0, dayjs_1["default"])().add(options.expires, 'days').utc().toDate();
             }
             process.env.IS_SSR ? this._ssrCookie.set(name, value, options) : cookie.set(name, value, options);
         }
     };
-    /**
-     *
-     * @param {string} name
-     * @param {string} [storageName]
-     */
     ClientStorageComponent.prototype.remove = function (name, storageName) {
         storageName = storageName || this.STORAGE_LOCAL;
         if (this.localStorageAvailable && storageName === this.STORAGE_LOCAL) {

package/components/HtmlComponent.d.ts

@@ -1,8 +1,32 @@
+/// <reference types="react" />
+export interface IHtmlComponent {
+    /**
+     * Утилита для создания css-классов по БЭМ
+     */
+    bem(blockName: string): any;
+    /**
+     * Метод для соединения нескольких classNames
+     */
+    classNames(...names: string[]): string;
+    /**
+     * Метод для добавления css-класса к элементу
+     * @param node Элемент, к которому нужно добавить класс
+     * @param className Название класса
+     */
+    addClass(node: React.ReactNode, className: string): void;
+    /**
+     * Метод для удаления css-класса у элемента
+     * @param node Элемент, у которого нужно удалить класс
+     * @param className Название класса
+     */
+    removeClass(node: React.ReactNode, className: string): void;
+    closest(element: any, className: string): any;
+}
 /**
  * Html Component
  * Хелпер для работы с БЭМ классами и DOM элементами
  */
-export default class HtmlComponent {
+export default class HtmlComponent implements IHtmlComponent {
     _instances: any;
     namespace: string;
     constructor(components: any);
@@ -11,5 +35,5 @@ export default class HtmlComponent {
     addClass(node: any, className: any): void;
     removeClass(node: any, className: any): void;
     closest(element: any, className: any): any;
-    _applyModifiers(entity: any, modifiers: any): string;
+    private _applyModifiers;
 }

package/components/HttpComponent.d.ts

@@ -4,11 +4,102 @@ interface IHttpRequestOptions {
     onTwoFactor?: (providerName: string) => Promise<any>;
     responseType?: string;
 }
+export interface IHttpComponentConfig {
+    /**
+     * Url для http запросов
+     */
+    apiUrl?: string;
+    /**
+     * Ключ для хранения токена в куках
+     */
+    accessTokenKey?: string;
+    /**
+     * Имя хранилища для токена (local, session, или cookie)
+     */
+    clientStorageName?: string;
+    /**
+     * Срок хранения токена в хранилище в днях
+     */
+    clientStorageExpiresIn?: number;
+}
+export interface IHttpComponent extends IHttpComponentConfig {
+    /**
+     * Получение конфига для axios
+     * @returns Конфиг для axios
+     */
+    getAxiosConfig(): Promise<any>;
+    /**
+     * Изменение csrf токена
+     * @param {string} value
+     */
+    setCsrfToken(value: string): void;
+    /**
+     * Удаление токена
+     */
+    removeAccessToken(): void;
+    /**
+     * Изменение токена
+     * @param {string} value
+     */
+    setAccessToken(value: string): any;
+    /**
+     * Получение токена
+     * @returns {string}
+     */
+    getAccessToken(): Promise<any>;
+    /**
+     * Сбросить конфиг
+     */
+    resetConfig(): void;
+    /**
+     * Метод, который можно вызвать при logout
+     */
+    onLogout(): void;
+    /**
+     * Метод, который можно вызвать при login
+     * @param {{accessToken: string}} params
+     */
+    onLogin(params: {
+        accessToken: string;
+    }): void;
+    /**
+     * Получение url по методу
+     * @param {string} method
+     * @returns {string} url
+     */
+    getUrl(method: string): string;
+    /**
+     * Получение экземпляра axios
+     * @returns Экземпляр axios
+     */
+    getAxiosInstance(): Promise<any>;
+    /**
+     * Вызов метода get
+     */
+    get(url: string, params?: Record<string, any>, options?: IHttpRequestOptions): any;
+    /**
+     * Вызов метода post
+     */
+    post(url: string, params?: Record<string, any>, options?: IHttpRequestOptions): any;
+    /**
+     * Вызов метода delete
+     */
+    delete(url: string, params?: Record<string, any>, options?: IHttpRequestOptions): any;
+    /**
+     * Вызов http-метода
+     */
+    send(method: string, url: string, params?: Record<string, any>, options?: IHttpRequestOptions): any;
+    /**
+     * Метод, который вызывается после запроса
+     */
+    afterRequest(response: any, config: Record<string, any>, options: IHttpRequestOptions): Promise<any>;
+    [key: string]: any;
+}
 /**
  * Http Component
  * Обертка над Axios для запросов на бекенд. Поддерживает токен авторизации, CSRF и обработку ошибок.
  */
-export default class HttpComponent {
+export default class HttpComponent implements IHttpComponent {
     accessTokenKey: string;
     apiUrl: string;
     clientStorageName: string;
@@ -19,23 +110,15 @@ export default class HttpComponent {
     _csrfToken: any;
     _lazyRequests: any;
     _promises: any;
+    _isWindowAvailable: boolean;
     constructor(components: any, config?: any);
     getAxiosConfig(): Promise<{
         withCredentials: boolean;
         headers: any;
     }>;
-    /**
-     * @param {string} value
-     */
-    setCsrfToken(value: any): void;
+    setCsrfToken(value: string): void;
     removeAccessToken(): void;
-    /**
-     * @param {string} value
-     */
-    setAccessToken(value: any): void;
-    /**
-     * @returns {string}
-     */
+    setAccessToken(value: string): void;
     getAccessToken(): Promise<any>;
     resetConfig(): void;
     onLogout(): void;
@@ -43,14 +126,14 @@ export default class HttpComponent {
         accessToken: string;
     }): void;
     getAxiosInstance(): Promise<any>;
-    getUrl(method: any): any;
+    getUrl(method: string): string;
     get(url: any, params?: {}, options?: IHttpRequestOptions): any;
     post(url: any, params?: {}, options?: IHttpRequestOptions): any;
     delete(url: any, params?: {}, options?: IHttpRequestOptions): any;
     send(method: any, url: any, params?: {}, options?: IHttpRequestOptions): any;
-    _send(method: any, config: any, options: IHttpRequestOptions): any;
-    _sendAxios(config: any, options: IHttpRequestOptions): any;
+    protected _send(method: any, config: any, options: IHttpRequestOptions): any;
+    protected _sendAxios(config: any, options: IHttpRequestOptions): any;
     afterRequest(response: any, config: any, options: IHttpRequestOptions): any;
-    _onTwoFactor(providerName: any): Promise<unknown>;
+    protected _onTwoFactor(providerName: any): Promise<unknown>;
 }
 export {};

package/components/HttpComponent.js

@@ -65,9 +65,10 @@ var HttpComponent = /** @class */ (function () {
         if (config === void 0) { config = {}; }
         this.accessTokenKey = 'accessToken';
         this._components = components;
+        this._isWindowAvailable = !process.env.IS_SSR && process.env.PLATFORM !== 'mobile';
         this.apiUrl = config.apiUrl
             //|| process.env.APP_BACKEND_URL
-            || (!process.env.IS_SSR ? window.location.protocol + '//' + window.location.host : '');
+            || (this._isWindowAvailable ? window.location.protocol + '//' + window.location.host : '');
         this.accessTokenKey = config.accessTokenKey || 'accessToken';
         this.clientStorageName = config.clientStorageName || this._components.clientStorage.STORAGE_COOKIE;
         this.clientStorageExpiresIn = config.clientStorageExpiresIn || 180;
@@ -132,9 +133,6 @@ var HttpComponent = /** @class */ (function () {
             });
         });
     };
-    /**
-     * @param {string} value
-     */
     HttpComponent.prototype.setCsrfToken = function (value) {
         this._csrfToken = value;
         this.resetConfig();
@@ -144,17 +142,11 @@ var HttpComponent = /** @class */ (function () {
         this.resetConfig();
         this._components.clientStorage.remove(this.accessTokenKey, this.clientStorageName);
     };
-    /**
-     * @param {string} value
-     */
     HttpComponent.prototype.setAccessToken = function (value) {
         this._accessToken = value;
         this.resetConfig();
         this._components.clientStorage.set(this.accessTokenKey, value, this.clientStorageName, this.clientStorageExpiresIn);
     };
-    /**
-     * @returns {string}
-     */
     HttpComponent.prototype.getAccessToken = function () {
         return __awaiter(this, void 0, void 0, function () {
             var _a;
@@ -200,7 +192,7 @@ var HttpComponent = /** @class */ (function () {
         });
     };
     HttpComponent.prototype.getUrl = function (method) {
-        if (method === null && !process.env.IS_SSR) {
+        if (method === null && this._isWindowAvailable) {
             method = window.location.pathname;
         }
         if (method.indexOf('://') === -1) {
@@ -310,7 +302,7 @@ var HttpComponent = /** @class */ (function () {
                             store.dispatch((0, notifications_1.setFlashes)(response.data.flashes));
                         }
                         // Ajax redirect
-                        if (response.data.redirectUrl && !process.env.IS_SSR) {
+                        if (response.data.redirectUrl && this._isWindowAvailable) {
                             if (window.location.href === response.data.redirectUrl.split('#')[0]) {
                                 window.location.href = response.data.redirectUrl;
                                 window.location.reload();

package/components/JwtHttpComponent.d.ts

@@ -1,9 +1,24 @@
 import BaseHttpComponent from '@steroidsjs/core/components/HttpComponent';
-export default class JwtHttpComponent extends BaseHttpComponent {
-    refreshTokenRequest: {
-        url: string;
-        method: string;
-    };
+export interface IRefreshTokenRequest {
+    url: string;
+    method: string;
+}
+export interface IJwtHttpComponentConfig {
+    /**
+     * Запрос на обновление токена авторизации
+     */
+    refreshTokenRequest?: IRefreshTokenRequest;
+    /**
+     * Ключ токена авторизации для локального хранилища
+     */
+    refreshTokenKey?: string;
+}
+/**
+ * JwtHttpComponent
+ * Вариация HttpComponent с функционалом обновления токена авторизации
+ */
+export default class JwtHttpComponent extends BaseHttpComponent implements IJwtHttpComponentConfig {
+    refreshTokenRequest: IRefreshTokenRequest;
     refreshTokenKey: string;
     _refreshToken: any;
     constructor(components: any, config?: any);

package/components/JwtHttpComponent.js

@@ -57,6 +57,10 @@ exports.__esModule = true;
 var axios_1 = __importDefault(require("axios"));
 var HttpComponent_1 = __importDefault(require("@steroidsjs/core/components/HttpComponent"));
 var auth_1 = require("@steroidsjs/core/actions/auth");
+/**
+ * JwtHttpComponent
+ * Вариация HttpComponent с функционалом обновления токена авторизации
+ */
 var JwtHttpComponent = /** @class */ (function (_super) {
     __extends(JwtHttpComponent, _super);
     function JwtHttpComponent(components, config) {