@steroidsjs/core 3.0.0-beta.110 → 3.0.0-beta.111

package/hooks/useDataSelect.js

@@ -16,6 +16,9 @@ exports.getFlattenedItems = void 0;
 var isEqual_1 = __importDefault(require("lodash-es/isEqual"));
 var isArray_1 = __importDefault(require("lodash-es/isArray"));
 var isNil_1 = __importDefault(require("lodash-es/isNil"));
+var difference_1 = __importDefault(require("lodash-es/difference"));
+var intersection_1 = __importDefault(require("lodash-es/intersection"));
+var pullAll_1 = __importDefault(require("lodash-es/pullAll"));
 var react_1 = require("react");
 var react_use_1 = require("react-use");
 var defaultProps = {
@@ -77,11 +80,25 @@ function useDataSelect(config) {
             if (!config.multiple && ids.length > 1) {
                 ids = [ids[0]];
             }
-            if (selectedItems.length === ids.length) {
-                setSelectedIds([]);
+            // If all elements of selectedIds are equal to ids, remove all elements
+            if ((0, isEqual_1["default"])(selectedIds, ids)) {
+                setSelectedIdsInternal([]);
+                return;
+            }
+            // Check if all elements from ids are contained in selectedIds
+            var intersection = (0, intersection_1["default"])(selectedIds, ids);
+            // If all elements are contained, remove them from sourceArray
+            if ((0, isEqual_1["default"])(intersection, ids)) {
+                var prevSelectedIds = __spreadArray([], selectedIds, true);
+                (0, pullAll_1["default"])(prevSelectedIds, ids);
+                setSelectedIdsInternal((prevSelectedIds || []).sort());
                 return;
             }
-            setSelectedIdsInternal(ids.sort());
+            // If not all elements are contained, add new ids
+            if (!(0, isEqual_1["default"])(intersection, ids)) {
+                var difference = (0, difference_1["default"])(ids, selectedIds);
+                setSelectedIdsInternal(__spreadArray(__spreadArray([], selectedIds, true), difference, true).sort());
+            }
         }
         else {
             var id_1 = ids;
@@ -108,7 +125,7 @@ function useDataSelect(config) {
                 setIsOpened(false);
             }
         }
-    }, [config.multiple, selectedIds, selectedItems.length]);
+    }, [config.multiple, selectedIds]);
     var setSelectedAll = (0, react_1.useCallback)(function () {
         var itemsIds = flattenedItems.map(function (item) { return item.id; });
         setSelectedIds(itemsIds);

package/hooks/useTree.d.ts

@@ -4,7 +4,7 @@ export interface ITreeItem extends IButtonProps {
     /**
      * Идентификатор узла
      */
-    id?: string | number;
+    id: string | number | boolean;
     /**
      * Вложенные элементы
      * @example

package/package.json

@@ -1,6 +1,6 @@
 {
  "name": "@steroidsjs/core",
- "version": "3.0.0-beta.110",
+ "version": "3.0.0-beta.111",
  "description": "",
  "author": "Vladimir Kozhin <hello@kozhindev.com>",
  "repository": {

package/ui/content/Kanban/Kanban.d.ts

@@ -22,7 +22,7 @@ export interface ITaskPriority {
     type: string;
 }
 export interface IKanbanTask {
-    id: string;
+    id: number;
     title: string;
     description?: string;
     fullDescription?: string;
@@ -46,7 +46,7 @@ export interface IDragEndResult {
     combine: null;
 }
 export interface IKanbanColumn {
-    id: string;
+    id: number;
     title: string;
     tasks: IKanbanTask[];
 }
@@ -111,8 +111,8 @@ export interface IKanbanColumnViewProps {
     droppableComponent: any;
     draggableComponent: any;
     task?: IKanbanTask;
-    renderTask: (task: IKanbanTask, columnId: string, index: number) => JSX.Element;
-    onOpenCreateTaskModal: (columnId: string) => void;
+    renderTask: (task: IKanbanTask, columnId: number, index: number) => JSX.Element;
+    onOpenCreateTaskModal: (columnId: number) => void;
 }
 export type IKanbanViewProps = IKanbanProps;
 export default function Kanban(props: IKanbanProps): JSX.Element;

package/ui/form/AutoCompleteField/AutoCompleteField.js

@@ -94,7 +94,7 @@ function AutoCompleteField(props) {
     }, [onClose, props.inputProps, props.isOpened]);
     var inputProps = (0, react_1.useMemo)(function () {
         var _a;
-        return (__assign(__assign({}, props.inputProps), { type: 'text', name: props.input.name, defaultValue: (_a = props.input.value) !== null && _a !== void 0 ? _a : '', placeholder: props.placeholder, disabled: props.disabled, onChange: onChange, onBlur: onBlur }));
+        return (__assign(__assign({}, props.inputProps), { type: 'text', name: props.input.name, value: (_a = props.input.value) !== null && _a !== void 0 ? _a : '', placeholder: props.placeholder, disabled: props.disabled, onChange: onChange, onBlur: onBlur }));
     }, [onBlur, onChange, props.disabled, props.input.name, props.input.value, props.inputProps, props.placeholder]);
     //Sync with form
     (0, react_1.useEffect)(function () {

package/ui/form/CheckboxField/CheckboxField.d.ts

@@ -29,6 +29,7 @@ export interface ICheckboxFieldViewProps extends ICheckboxFieldProps, IFieldWrap
         checked: boolean;
         onChange: (value: string | React.ChangeEvent) => void;
         disabled: boolean;
+        required?: boolean;
     };
 }
 declare const _default: import("../Field/fieldWrapper").FieldWrapperComponent<ICheckboxFieldProps>;

package/ui/form/CheckboxField/CheckboxField.js

@@ -53,8 +53,8 @@ function CheckboxField(props) {
     }, [props]);
     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 (__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, required: props.required }, 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, props.required]);
     return components.ui.renderView(props.view || 'form.CheckboxFieldView', __assign(__assign({}, props), { inputProps: inputProps }));
 }
 CheckboxField.defaultProps = {

package/ui/form/CheckboxTreeField/CheckboxTreeField.d.ts

@@ -0,0 +1,68 @@
+/// <reference types="react" />
+import { IPreparedTreeItem } from '../../../hooks/useTree';
+import Enum from '../../../base/Enum';
+import { IFieldWrapperInputProps, IFieldWrapperOutputProps } from '../../../ui/form/Field/fieldWrapper';
+import { IDataProviderConfig } from '../../../hooks/useDataProvider';
+import { IDataSelectConfig } from '../../../hooks/useDataSelect';
+import { ICheckboxFieldViewProps } from '../CheckboxField/CheckboxField';
+import { ITreeProps } from '../../nav/Tree/Tree';
+type CheckboxTreeItems = string | ({
+    new (): Enum;
+}) | (string | number | {
+    id: string | number | boolean;
+    label: string;
+    color?: string;
+    [key: string]: any;
+})[];
+/**
+ * CheckboxTreeField
+ *
+ * Список с вложенными чекбоксами. Используется в формах для создания иерархической структуры и выбора нескольких значений.
+ */
+export interface ICheckboxTreeFieldProps extends IFieldWrapperInputProps, Omit<IDataProviderConfig, 'items'>, Omit<IDataSelectConfig, 'items'>, IUiComponent, Pick<ITreeProps, 'levelPadding' | 'alwaysOpened'> {
+    /**
+     * Свойства для элемента input
+     * @example { onKeyDown: ... }
+     */
+    inputProps?: any;
+    /**
+     * Коллекция элементов
+     * @example
+     * [
+     *  {
+     *      id: 1,
+     *      label: 'Krasnoyarsk',
+     *      color: 'red'
+     *  },
+     *  {
+     *      id: 2,
+     *      label: 'Moscow',
+     *      color: 'purple'
+     *  }
+     * ]
+     */
+    items: CheckboxTreeItems;
+    /**
+     * Первичный ключ для доступа к вложенным элементам
+     */
+    primaryKey?: string;
+    [key: string]: any;
+}
+export interface ICheckboxTreeFieldViewProps extends IFieldWrapperOutputProps {
+    items: {
+        id: number | string | boolean;
+        label?: string;
+        isHovered: boolean;
+        color?: string;
+        disabled?: boolean;
+        required?: boolean;
+    } & IPreparedTreeItem[];
+    selectedIds: (PrimaryKey | any)[];
+    onItemSelect: (checkbox: IPreparedTreeItem) => void;
+    renderCheckbox: (checkboxProps: ICheckboxFieldViewProps) => JSX.Element;
+    size?: Size;
+    levelPadding: number;
+}
+export declare const getNestedItemsIds: (item: any, groupAttribute: any) => any[];
+declare const _default: import("../../../ui/form/Field/fieldWrapper").FieldWrapperComponent<ICheckboxTreeFieldProps>;
+export default _default;

package/ui/form/CheckboxTreeField/CheckboxTreeField.js

@@ -0,0 +1,127 @@
+"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;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (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;
+exports.getNestedItemsIds = void 0;
+var React = __importStar(require("react"));
+var react_1 = require("react");
+var react_use_1 = require("react-use");
+var isArray_1 = __importDefault(require("lodash-es/isArray"));
+var hooks_1 = require("../../../hooks");
+var fieldWrapper_1 = __importDefault(require("../../../ui/form/Field/fieldWrapper"));
+var getNestedItemsIds = function (item, groupAttribute) {
+    if (item.disabled) {
+        return [];
+    }
+    var _a = item, _b = groupAttribute, _c = _a[_b], nestedItems = _c === void 0 ? [] : _c;
+    var result = [item.id];
+    if (groupAttribute && (0, isArray_1["default"])(nestedItems)) {
+        nestedItems.reduce(function (acc, nestedItem) {
+            if ((0, isArray_1["default"])(nestedItem[groupAttribute])) {
+                acc.push.apply(acc, (0, exports.getNestedItemsIds)(nestedItem, groupAttribute));
+            }
+            else if (!nestedItem.disabled) {
+                acc.push(nestedItem.id);
+            }
+            return acc;
+        }, result);
+    }
+    return result.sort();
+};
+exports.getNestedItemsIds = getNestedItemsIds;
+function CheckboxTreeField(props) {
+    var components = (0, hooks_1.useComponents)();
+    var inputSelectedIds = (0, react_1.useMemo)(function () { return props.selectedIds || [].concat(props.input.value || []); }, [props.input.value, props.selectedIds]);
+    // Data Provider
+    var items = (0, hooks_1.useDataProvider)({
+        items: props.items
+    }).items;
+    // Tree items
+    var treeItems = (0, hooks_1.useTree)({
+        items: items,
+        autoOpenLevels: 0,
+        alwaysOpened: props.alwaysOpened
+    }).treeItems;
+    // Data select
+    var _a = (0, hooks_1.useDataSelect)({
+        selectedIds: inputSelectedIds,
+        multiple: true,
+        primaryKey: props.primaryKey,
+        items: treeItems,
+        inputValue: props.input.value
+    }), selectedIds = _a.selectedIds, setSelectedIds = _a.setSelectedIds;
+    var onItemSelect = (0, react_1.useCallback)(function (checkbox) {
+        if (checkbox.hasItems) {
+            var selectedItemIds = (0, exports.getNestedItemsIds)(checkbox, props.primaryKey);
+            setSelectedIds(selectedItemIds);
+        }
+        else {
+            setSelectedIds(checkbox.id);
+        }
+    }, [props.primaryKey, setSelectedIds]);
+    // Sync with form
+    (0, react_1.useEffect)(function () {
+        props.input.onChange.call(null, selectedIds);
+        if (props.onChange) {
+            props.onChange(selectedIds);
+        }
+    }, [props, props.input.onChange, selectedIds]);
+    var onReset = (0, react_1.useCallback)(function () {
+        setSelectedIds([]);
+    }, [setSelectedIds]);
+    // Reset selected ids on form reset
+    var prevInputValue = (0, react_use_1.usePrevious)(props.input.value);
+    (0, react_use_1.useUpdateEffect)(function () {
+        // if form reset
+        if (prevInputValue && props.input.value === undefined && selectedIds.length > 0) {
+            onReset();
+        }
+    }, [onReset, prevInputValue, props.input.value, selectedIds.length]);
+    var CheckboxFieldView = components.ui.getView('form.CheckboxFieldView');
+    var renderCheckbox = function (checkboxProps) { return (React.createElement(CheckboxFieldView, __assign({}, checkboxProps))); };
+    return components.ui.renderView(props.view || 'form.CheckboxTreeFieldView', __assign(__assign({}, props), { items: treeItems, onItemSelect: onItemSelect, selectedIds: selectedIds, levelPadding: props.levelPadding, renderCheckbox: renderCheckbox }));
+}
+CheckboxTreeField.defaultProps = {
+    disabled: false,
+    required: false,
+    className: '',
+    levelPadding: 32,
+    alwaysOpened: false,
+    primaryKey: 'items'
+};
+exports["default"] = (0, fieldWrapper_1["default"])('CheckboxTreeField', CheckboxTreeField);

package/ui/form/CheckboxTreeField/index.d.ts

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

package/ui/form/CheckboxTreeField/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 CheckboxTreeField_1 = __importDefault(require("./CheckboxTreeField"));
+exports["default"] = CheckboxTreeField_1["default"];

package/ui/form/DateField/useDateRange.js

@@ -16,6 +16,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 exports.__esModule = true;
 var react_1 = require("react");
 var react_use_1 = require("react-use");
+var isNil_1 = __importDefault(require("lodash-es/isNil"));
 var dayjs_1 = __importDefault(require("dayjs"));
 var calendar_1 = require("@steroidsjs/core/utils/calendar");
 function useDateRange(props) {
@@ -61,6 +62,9 @@ function useDateRange(props) {
         if (!props.hasInitialFocus && isFirstMount) {
             return;
         }
+        if ((0, isNil_1["default"])(props.inputFrom.value) && (0, isNil_1["default"])(props.inputTo.value)) {
+            return;
+        }
         if (props.useSmartFocus) {
             if (focus === 'from' && !valueToRef.current && prevValueFrom !== props.inputFrom.value) {
                 valueFromRef.current = props.inputFrom.value;

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

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { IFieldWrapperInputProps, IFieldWrapperOutputProps } from '../../form/Field/fieldWrapper';
 export interface IFieldListItem extends IFieldWrapperInputProps, IUiComponent {
     /**
-     * Будет ли отображён item ?
+     * Будет ли отображён item?
      * @example true
      */
     visible?: boolean;
@@ -21,7 +21,7 @@ export interface IFieldListItem extends IFieldWrapperInputProps, IUiComponent {
      */
     headerClassName?: CssClassName;
     /**
-     * Заголовок для колонки таблицы.
+     * Заголовок для колонки таблицы
      */
     title?: string;
     [key: string]: any;
@@ -30,6 +30,7 @@ export interface IFieldListItem extends IFieldWrapperInputProps, IUiComponent {
  * FieldList
  *
  * Создает список из сгруппированных полей формы.
+ * Для загрузки файлов с помощью `FileField` внутри строк `FieldList`, нужно использовать форму с флагом `useRedux`.
  */
 export interface IFieldListProps extends IFieldWrapperInputProps, IUiComponent {
     /**

package/ui/form/FieldList/FieldList.js

@@ -69,7 +69,7 @@ function FieldList(props) {
     var isWithReduxForm = (0, hooks_1.useSelector)(function (state) { return (0, get_1["default"])(state, ['form', context.formId]) || null; });
     var dispatch = context.provider.useDispatch();
     // Mapper for preserving the correct sequence of rows on the UI
-    var _b = (0, react_1.useState)([]), storeToRowIndexMap = _b[0], setStoreToRowIndexMap = _b[1];
+    var _b = (0, react_1.useState)((0, range_1["default"])(props.input.value) || []), storeToRowIndexMap = _b[0], setStoreToRowIndexMap = _b[1];
     var addRowIndexes = (0, react_1.useCallback)(function (rowsCount) {
         setStoreToRowIndexMap(function (prevMap) {
             var lastIndex = !(0, isEmpty_1["default"])(prevMap) ? (0, last_1["default"])(prevMap) + 1 : 0;

package/ui/form/index.d.ts

@@ -4,6 +4,7 @@ import BlankField from './BlankField';
 import Button from './Button';
 import CheckboxField from './CheckboxField';
 import CheckboxListField from './CheckboxListField';
+import CheckboxTreeField from './CheckboxTreeField';
 import DateField from './DateField';
 import DateRangeField from './DateRangeField';
 import DateTimeField from './DateTimeField';
@@ -30,13 +31,14 @@ import TimeField from './TimeField';
 import RateField from './RateField';
 import MaskField from './MaskField';
 import EmailField from './EmailField';
-export { AutoCompleteField, BlankField, Button, CheckboxField, CheckboxListField, DateField, DateRangeField, DateTimeField, DateTimeRangeField, DropDownField, Field, FieldLayout, FieldList, FieldSet, FileField, Form, HtmlField, InputField, NavField, NumberField, PasswordField, RadioField, RadioListField, ReCaptchaField, SliderField, SwitcherField, TextField, TimeField, RateField, MaskField, EmailField, };
+export { AutoCompleteField, BlankField, Button, CheckboxField, CheckboxListField, CheckboxTreeField, DateField, DateRangeField, DateTimeField, DateTimeRangeField, DropDownField, Field, FieldLayout, FieldList, FieldSet, FileField, Form, HtmlField, InputField, NavField, NumberField, PasswordField, RadioField, RadioListField, ReCaptchaField, SliderField, SwitcherField, TextField, TimeField, RateField, MaskField, EmailField, };
 declare const _default: {
     AutoCompleteField: import("./Field/fieldWrapper").FieldWrapperComponent<import("./AutoCompleteField/AutoCompleteField").IAutoCompleteFieldProps>;
     BlankField: import("./Field/fieldWrapper").FieldWrapperComponent<import("./BlankField/BlankField").IBlankFieldProps>;
     Button: typeof Button;
     CheckboxField: import("./Field/fieldWrapper").FieldWrapperComponent<import("./CheckboxField/CheckboxField").ICheckboxFieldProps>;
     CheckboxListField: import("./Field/fieldWrapper").FieldWrapperComponent<import("./CheckboxListField/CheckboxListField").ICheckboxListFieldProps>;
+    CheckboxTreeField: import("./Field/fieldWrapper").FieldWrapperComponent<import("./CheckboxTreeField/CheckboxTreeField").ICheckboxTreeFieldProps>;
     DateField: import("./Field/fieldWrapper").FieldWrapperComponent<import("./DateField/DateField").IDateFieldProps>;
     DateRangeField: import("./Field/fieldWrapper").FieldWrapperComponent<import("./DateRangeField/DateRangeField").IDateRangeFieldProps>;
     DateTimeField: import("./Field/fieldWrapper").FieldWrapperComponent<import("./DateTimeField/DateTimeField").IDateTimeFieldProps>;

package/ui/form/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
-exports.EmailField = exports.MaskField = exports.RateField = exports.TimeField = exports.TextField = exports.SwitcherField = exports.SliderField = exports.ReCaptchaField = exports.RadioListField = exports.RadioField = exports.PasswordField = exports.NumberField = exports.NavField = exports.InputField = exports.HtmlField = exports.Form = exports.FileField = exports.FieldSet = exports.FieldList = exports.FieldLayout = exports.Field = exports.DropDownField = exports.DateTimeRangeField = exports.DateTimeField = exports.DateRangeField = exports.DateField = exports.CheckboxListField = exports.CheckboxField = exports.Button = exports.BlankField = exports.AutoCompleteField = void 0;
+exports.EmailField = exports.MaskField = exports.RateField = exports.TimeField = exports.TextField = exports.SwitcherField = exports.SliderField = exports.ReCaptchaField = exports.RadioListField = exports.RadioField = exports.PasswordField = exports.NumberField = exports.NavField = exports.InputField = exports.HtmlField = exports.Form = exports.FileField = exports.FieldSet = exports.FieldList = exports.FieldLayout = exports.Field = exports.DropDownField = exports.DateTimeRangeField = exports.DateTimeField = exports.DateRangeField = exports.DateField = exports.CheckboxTreeField = exports.CheckboxListField = exports.CheckboxField = exports.Button = exports.BlankField = exports.AutoCompleteField = void 0;
 var AutoCompleteField_1 = __importDefault(require("./AutoCompleteField"));
 exports.AutoCompleteField = AutoCompleteField_1["default"];
 var BlankField_1 = __importDefault(require("./BlankField"));
@@ -14,6 +14,8 @@ var CheckboxField_1 = __importDefault(require("./CheckboxField"));
 exports.CheckboxField = CheckboxField_1["default"];
 var CheckboxListField_1 = __importDefault(require("./CheckboxListField"));
 exports.CheckboxListField = CheckboxListField_1["default"];
+var CheckboxTreeField_1 = __importDefault(require("./CheckboxTreeField"));
+exports.CheckboxTreeField = CheckboxTreeField_1["default"];
 var DateField_1 = __importDefault(require("./DateField"));
 exports.DateField = DateField_1["default"];
 var DateRangeField_1 = __importDefault(require("./DateRangeField"));
@@ -72,6 +74,7 @@ exports["default"] = {
     Button: Button_1["default"],
     CheckboxField: CheckboxField_1["default"],
     CheckboxListField: CheckboxListField_1["default"],
+    CheckboxTreeField: CheckboxTreeField_1["default"],
     DateField: DateField_1["default"],
     DateRangeField: DateRangeField_1["default"],
     DateTimeField: DateTimeField_1["default"],

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

@@ -41,6 +41,11 @@ export interface ITreeProps extends Omit<ITreeConfig, 'currentPage' | 'itemsOnPa
      * @example 32
      */
     levelPadding?: number;
+    /**
+     * Флаг, определяющий раскрывать вложенные элементы по клику на весь элемент или только на иконку
+     * @example false
+     */
+    hasIconExpandOnly?: boolean;
     [key: string]: any;
 }
 declare function Tree(props: ITreeProps): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
@@ -51,6 +56,7 @@ declare namespace Tree {
         autoSave: boolean;
         level: number;
         levelPadding: number;
+        hasIconExpandOnly: boolean;
     };
 }
 export default Tree;

package/ui/nav/Tree/Tree.js

@@ -32,5 +32,6 @@ Tree.defaultProps = {
     autoOpenLevels: 1,
     autoSave: false,
     level: 0,
-    levelPadding: 32
+    levelPadding: 32,
+    hasIconExpandOnly: false
 };