@steroidsjs/core 3.0.0-beta.102 → 3.0.0-beta.104

package/ui/layout/Skeleton/Skeleton.d.ts

@@ -8,7 +8,9 @@ export interface ISkeletonViewProps {
     width?: string | number;
 }
 /**
- * Компонент Skeleton представляет собой заглушку для отображения временных данных
+ * Skeleton
+ *
+ * Компонент `Skeleton` представляет собой заглушку для отображения временных данных
  * во время загрузки или ожидания загрузки реальных данных.
  **/
 export interface ISkeletonProps {

package/ui/list/ControlsColumn/ControlsColumn.d.ts

@@ -8,7 +8,7 @@ export interface IControlsColumnItem extends IButtonProps {
 /**
  * ControlsColumn
  *
- * Компонент ControlsColumn предоставляет колонку с контролами.
+ * Компонент `ControlsColumn` предоставляет колонку с контролами.
  **/
 export interface IControlsColumnProps {
     /**

package/ui/list/TreeTable/TreeTable.d.ts

@@ -24,6 +24,11 @@ export interface ITreeTableItem {
      */
     uniqueId?: string;
 }
+/**
+ * TreeTable
+ *
+ * Компонент для представления данных коллекции в виде иерархической структуры.
+ */
 export interface ITreeTableProps extends Omit<IGridProps, 'items'> {
     /**
      * Элементы коллекции
@@ -32,8 +37,4 @@ export interface ITreeTableProps extends Omit<IGridProps, 'items'> {
     items?: ITreeTableItem[];
 }
 export declare const addTreeColumnFieldsToFirstColumn: (columns: IGridColumn[]) => IGridColumn[];
-/**
- * TreeTable
- * Компонент для представления данных коллекции в виде иерархической структуры.
- */
 export default function TreeTable(props: ITreeTableProps): JSX.Element;

package/ui/list/TreeTable/TreeTable.js

@@ -62,10 +62,6 @@ var addTreeColumnFieldsToFirstColumn = function (columns) {
     return newColumns;
 };
 exports.addTreeColumnFieldsToFirstColumn = addTreeColumnFieldsToFirstColumn;
-/**
- * TreeTable
- * Компонент для представления данных коллекции в виде иерархической структуры.
- */
 function TreeTable(props) {
     var columns = (0, react_1.useMemo)(function () { return (0, exports.addTreeColumnFieldsToFirstColumn)(props.columns); }, [props.columns]);
     return (React.createElement(Grid_1["default"], __assign({}, props, { columns: columns, items: props.items, itemsIndexing: false, hasTreeItems: true })));

package/ui/nav/Link/Link.d.ts

@@ -3,7 +3,7 @@ import { IButtonProps, IButtonViewProps } from '../../form/Button/Button';
 /**
  * Link
  *
- * Ссылка
+ * С помощью компонента `Link` вы можете легко настраивать цветовую схему элементов ссылок.
  */
 export interface ILinkProps extends IButtonProps {
     [key: string]: any;

package/ui/nav/Nav/Nav.d.ts

@@ -56,7 +56,9 @@ export interface INavItem extends IButtonProps {
 }
 /**
  * Nav
- * Компонент навигации
+ *
+ * Компонент навигации позволяет переключаться между группами связанного контента.
+ *
  */
 export interface INavProps {
     /**

package/ui/nav/Router/Router.js

@@ -175,6 +175,9 @@ function Router(props) {
         });
         var result = renderComponent(routeItem, activePath, __assign(__assign({}, routeProps), { children: children }));
         if (!result) {
+            if (children) {
+                return children;
+            }
             // eslint-disable-next-line no-console
             console.error('Not found component for route:', routeItem);
         }

package/utils/calculateComponentAbsolutePosition.js

@@ -1,6 +1,19 @@
 "use strict";
 exports.__esModule = true;
+/* eslint-disable implicit-arrow-linebreak */
 var useAbsolutePositioning_1 = require("../hooks/useAbsolutePositioning");
+var isComponentBeyondTop = function (parentDimensions, componentSize, gap) {
+    return (parentDimensions.top - window.scrollY) <= Math.round(componentSize.height + gap);
+};
+var isComponentBeyondLeft = function (parentDimensions, componentSize, gap) {
+    return parentDimensions.left <= Math.round(componentSize.width + gap);
+};
+var isComponentBeyondRight = function (parentDimensions, componentSize, gap) {
+    return document.body.clientWidth - parentDimensions.right <= Math.round(componentSize.width + gap);
+};
+var isComponentBeyondBottom = function (parentDimensions, componentSize, gap) {
+    return (window.innerHeight - (parentDimensions.top + parentDimensions.height - window.scrollY)) <= Math.round(componentSize.height + gap);
+};
 function calculateComponentAbsolutePosition(gap, position, parentRef, componentSize, arrowSize, hasAutoPositioning) {
     if (arrowSize === void 0) { arrowSize = null; }
     if (hasAutoPositioning === void 0) { hasAutoPositioning = true; }
@@ -17,10 +30,9 @@ function calculateComponentAbsolutePosition(gap, position, parentRef, componentS
         case useAbsolutePositioning_1.Position.TOP:
         case useAbsolutePositioning_1.Position.TOP_LEFT:
         case useAbsolutePositioning_1.Position.TOP_RIGHT:
-            // Проверка - выходит ли tooltip за верхний край страницы?
+            // Проверка - выходит ли component за верхний край страницы?
             // Если да - меняем позицию на bottom
-            if (hasAutoPositioning
-                && ((parentDimensions.top - window.scrollY) <= Math.round(componentSize.height + gap))) {
+            if (hasAutoPositioning && isComponentBeyondTop(parentDimensions, componentSize, gap)) {
                 style.top = parentDimensions.top + parentDimensions.height;
                 position = position.replace(useAbsolutePositioning_1.Position.TOP, useAbsolutePositioning_1.Position.BOTTOM);
             }
@@ -31,11 +43,9 @@ function calculateComponentAbsolutePosition(gap, position, parentRef, componentS
         case useAbsolutePositioning_1.Position.BOTTOM:
         case useAbsolutePositioning_1.Position.BOTTOM_LEFT:
         case useAbsolutePositioning_1.Position.BOTTOM_RIGHT:
-            /// Проверка - выходит ли tooltip за нижний край страницы?
+            /// Проверка - выходит ли component за нижний край страницы?
             // Если да - меняем позицию на top
-            if (hasAutoPositioning
-                && ((window.innerHeight - (parentDimensions.top + parentDimensions.height - window.scrollY))
-                    <= Math.round(componentSize.height + gap))) {
+            if (hasAutoPositioning && isComponentBeyondBottom(parentDimensions, componentSize, gap)) {
                 style.top = parentDimensions.top - componentSize.height;
                 position = position.replace(useAbsolutePositioning_1.Position.BOTTOM, useAbsolutePositioning_1.Position.TOP);
             }
@@ -46,9 +56,9 @@ function calculateComponentAbsolutePosition(gap, position, parentRef, componentS
         case useAbsolutePositioning_1.Position.LEFT:
         case useAbsolutePositioning_1.Position.LEFT_TOP:
         case useAbsolutePositioning_1.Position.LEFT_BOTTOM:
-            // Проверка - выходит ли tooltip за левый край страницы?
+            // Проверка - выходит ли component за левый край страницы?
             // Если да - меняем позицию на right
-            if (hasAutoPositioning && (parentDimensions.left <= Math.round(componentSize.width + gap))) {
+            if (hasAutoPositioning && isComponentBeyondLeft(parentDimensions, componentSize, gap)) {
                 style.left = parentDimensions.right;
                 position = position.replace(useAbsolutePositioning_1.Position.LEFT, useAbsolutePositioning_1.Position.RIGHT);
             }
@@ -59,10 +69,9 @@ function calculateComponentAbsolutePosition(gap, position, parentRef, componentS
         case useAbsolutePositioning_1.Position.RIGHT:
         case useAbsolutePositioning_1.Position.RIGHT_TOP:
         case useAbsolutePositioning_1.Position.RIGHT_BOTTOM:
-            // Проверка - выходит ли tooltip за правый край страницы?
+            // Проверка - выходит ли component за правый край страницы?
             // Если да - меняем позицию на left
-            if (hasAutoPositioning
-                && (document.body.clientWidth - parentDimensions.right <= Math.round(componentSize.width + gap))) {
+            if (hasAutoPositioning && isComponentBeyondRight(parentDimensions, componentSize, gap)) {
                 style.left = parentDimensions.left - componentSize.width;
                 position = position.replace(useAbsolutePositioning_1.Position.RIGHT, useAbsolutePositioning_1.Position.LEFT);
             }
@@ -72,6 +81,31 @@ function calculateComponentAbsolutePosition(gap, position, parentRef, componentS
             break;
     }
     // eslint-disable-next-line default-case
+    switch (position) {
+        case useAbsolutePositioning_1.Position.LEFT:
+        case useAbsolutePositioning_1.Position.LEFT_TOP:
+        case useAbsolutePositioning_1.Position.LEFT_BOTTOM:
+            // Проверка - выходит ли component после изменения позиции на left за левый край страницы?
+            // Если да - меняем позицию на bottom
+            if (hasAutoPositioning && isComponentBeyondLeft(parentDimensions, componentSize, gap)) {
+                style.left = null;
+                style.top = parentDimensions.top + parentDimensions.height;
+                position = useAbsolutePositioning_1.Position.BOTTOM;
+            }
+            break;
+        case useAbsolutePositioning_1.Position.RIGHT:
+        case useAbsolutePositioning_1.Position.RIGHT_TOP:
+        case useAbsolutePositioning_1.Position.RIGHT_BOTTOM:
+            // Проверка - выходит ли component после изменения позиции на right за правый край страницы?
+            // Если да - меняем позицию на bottom
+            if (hasAutoPositioning && isComponentBeyondRight(parentDimensions, componentSize, gap)) {
+                style.left = null;
+                style.top = parentDimensions.top + parentDimensions.height;
+                position = useAbsolutePositioning_1.Position.BOTTOM;
+            }
+            break;
+    }
+    // eslint-disable-next-line default-case
     switch (position) {
         case useAbsolutePositioning_1.Position.TOP:
         case useAbsolutePositioning_1.Position.BOTTOM:
@@ -80,7 +114,7 @@ function calculateComponentAbsolutePosition(gap, position, parentRef, componentS
             break;
         case useAbsolutePositioning_1.Position.TOP_LEFT:
         case useAbsolutePositioning_1.Position.BOTTOM_LEFT:
-            // Ширина tooltip больше родителя - стрелка на середину родителя
+            // Ширина component больше родителя - стрелка на середину родителя
             style.left = parentDimensions.left;
             if (arrowSize && (parentDimensions.width < componentSize.width)) {
                 arrowPosition = { left: parentDimensions.width / 2 };
@@ -88,7 +122,7 @@ function calculateComponentAbsolutePosition(gap, position, parentRef, componentS
             break;
         case useAbsolutePositioning_1.Position.TOP_RIGHT:
         case useAbsolutePositioning_1.Position.BOTTOM_RIGHT:
-            // Ширина tooltip больше родителя - стрелка на середину родителя
+            // Ширина component больше родителя - стрелка на середину родителя
             style.left = parentDimensions.right - componentSize.width;
             if (arrowSize && (parentDimensions.width < componentSize.width)) {
                 arrowPosition = {
@@ -118,13 +152,13 @@ function calculateComponentAbsolutePosition(gap, position, parentRef, componentS
             }
             break;
     }
-    // Проверка - при позиционировании top/bottom tooltip не выходит за пределы страницы по горизонтали
+    //Проверка - при позиционировании top/bottom component не выходит за пределы страницы по горизонтали
     if (position.includes('top') || position.includes('bottom')) {
         if (!position.includes('Left')
-            && (style.left < 0 || parentDimensions.left <= Math.round((componentSize.width - parentDimensions.width) + gap))) {
+            && (parentDimensions.left <= Math.round((componentSize.width - parentDimensions.width) + gap))) {
             style.right = null;
             position = position.replace('Right', 'Left');
-            // Если ширина tooltip больше ширины родителя - выставить стрелку на середину родителя
+            // Если ширина component больше ширины родителя - выставить стрелку на середину родителя
             if (parentDimensions.left < componentSize.width) {
                 arrowPosition = { left: parentDimensions.width / 2 };
             }
@@ -144,15 +178,17 @@ function calculateComponentAbsolutePosition(gap, position, parentRef, componentS
             style.right = document.body.clientWidth - parentDimensions.right;
         }
     }
-    // Проверка - при позиционировании left/right tooltip не выходит за пределы страницы по вертикали
+    // Проверка - при позиционировании left/right component не выходит за пределы страницы по вертикали
     if (position.includes('left') || position.includes('right')) {
         if (!position.includes('Top')
             && parentDimensions.top - window.scrollY <= Math.round((componentSize.height - parentDimensions.height) + gap)) {
             position = position.replace('Bottom', 'Top');
-            if (parentDimensions.height < componentSize.height) {
-                arrowPosition = { top: parentDimensions.height / 2 };
-            }
             style.top = parentDimensions.top;
+            if (arrowSize && parentDimensions.height < componentSize.height) {
+                arrowPosition = {
+                    top: parentDimensions.height / 2
+                };
+            }
         }
         else if (!position.includes('Bottom')
             && (window.innerHeight - (parentDimensions.top + parentDimensions.height - window.scrollY)

package/utils/form.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 export declare const setInWithPath: (state: any, value: any, path: string[], pathIndex?: number) => any;
 export declare const cleanEmptyObject: (object: any) => any;
+export declare const clearErrors: (values: any, prevValues: any, errors: any, setErrors: any) => void;
 export declare const providers: {
     redux: {
         useForm: (formId: any, initialValues: any) => any;

package/utils/form.js

@@ -14,11 +14,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
-exports.providers = exports.cleanEmptyObject = exports.setInWithPath = void 0;
+exports.providers = exports.clearErrors = exports.cleanEmptyObject = exports.setInWithPath = void 0;
 var isPlainObject_1 = __importDefault(require("lodash-es/isPlainObject"));
 var isArray_1 = __importDefault(require("lodash-es/isArray"));
 var isEqual_1 = __importDefault(require("lodash-es/isEqual"));
 var get_1 = __importDefault(require("lodash-es/get"));
+var differenceWith_1 = __importDefault(require("lodash-es/differenceWith"));
+var toPairs_1 = __importDefault(require("lodash-es/toPairs"));
+var omit_1 = __importDefault(require("lodash-es/omit"));
+var isEmpty_1 = __importDefault(require("lodash-es/isEmpty"));
 var react_1 = require("react");
 var react_use_1 = require("react-use");
 var useDispatch_1 = __importDefault(require("../hooks/useDispatch"));
@@ -75,6 +79,17 @@ var cleanEmptyObject = function (object) {
     return object;
 };
 exports.cleanEmptyObject = cleanEmptyObject;
+var clearErrors = function (values, prevValues, errors, setErrors) {
+    if (!(0, isEmpty_1["default"])(errors) && !(0, isEqual_1["default"])(prevValues || {}, values)) {
+        // compare arrays of key-value pairs in previous and new field objects to identify the changed field
+        var changedField = (0, differenceWith_1["default"])((0, toPairs_1["default"])(values), (0, toPairs_1["default"])(prevValues), isEqual_1["default"]);
+        if (!(0, isEmpty_1["default"])(changedField)) {
+            var cleanedErrors = (0, omit_1["default"])(errors, changedField[0]);
+            setErrors((0, isEmpty_1["default"])(cleanedErrors) ? null : cleanedErrors);
+        }
+    }
+};
+exports.clearErrors = clearErrors;
 // Form state providers
 exports.providers = {
     // Redux