@consta/uikit 3.9.0 → 3.10.0

package/__internal__/src/components/Table/Header/TableHeader.js

@@ -58,6 +58,12 @@ export var TableHeader = function (_a) {
         };
         return column.filterable ? (React.createElement(TableFilterTooltip, { field: column.accessor, isOpened: visibleFilter === column.accessor, options: getOptionsForFilters(filters, column.accessor), values: selectedFilters[column.accessor].selected || [], onChange: handleTooltipSave, onToggle: handleFilterTogglerClick(column.accessor), className: cnTableHeader('Icon', { type: 'filter' }) }, FilterComponent && (React.createElement(FilterComponent, __assign({}, filterComponentProps, { onConfirm: handleFilterSave, filterValue: (_d = selectedFilters[column.accessor]) === null || _d === void 0 ? void 0 : _d.value, onCancel: handleFilterTogglerClick(column.accessor) }))))) : null;
     };
+    var control = function (column) {
+        if (column.control) {
+            return React.createElement("div", { className: cnTableHeader('Сontrol') }, column.control({ column: column }));
+        }
+        return null;
+    };
     return (React.createElement(React.Fragment, null,
         React.createElement("div", { className: cnTableHeader('Row', { withVerticalBorder: borderBetweenColumns }) }, headersWithMetaData.map(function (column, columnIdx) {
             var _a, _b, _c;
@@ -91,7 +97,8 @@ export var TableHeader = function (_a) {
                         verticalAlign: headerVerticalAlign
                     }) },
                     column.sortable && (React.createElement(Button, { size: "xs", iconSize: "s", view: "clear", onlyIcon: true, onClick: function () { return handleSortClick(column); }, iconLeft: getSortIcon(column), className: cnTableHeader('Icon', { type: 'sort' }) })),
-                    getFilterPopover(column))));
+                    getFilterPopover(column),
+                    control(column))));
         })),
         React.createElement("div", { className: cnTableHeader('ShadowWrapper'), style: tableHeaderStyle },
             React.createElement("div", { className: cnTableHeader('Shadow', { show: showHorizontalCellShadow && isStickyHeader }) }))));

package/__internal__/src/components/Table/Table.d.ts

@@ -3,7 +3,7 @@ import React from 'react';
 import { HorizontalAlign, VerticalAlign } from './Cell/TableCell';
 import { GetTagLabel } from './SelectedOptionsList/TableSelectedOptionsList';
 import { Filters, onSortBy, SelectedFilters } from './filtering';
-import { OrderType, Position } from './helpers';
+import { Header, OrderType, Position } from './helpers';
 export { TableTextFilter } from './TextFilter/TableTextFilter';
 export { TableFilterContainer } from './FilterContainer/TableFilterContainer';
 export { TableNumberFilter } from './NumberFilter/TableNumberFilter';
@@ -69,6 +69,9 @@ declare type GroupColumnAddition<T extends TableRow> = {
 } & {
     [K in keyof ColumnBase<T>]?: never;
 };
+export interface TableControl<T extends TableRow> {
+    column: Header<T> & ColumnMetaData;
+}
 export declare type TableColumn<T extends TableRow> = {
     title: React.ReactNode;
     align?: HorizontalAlign;
@@ -76,6 +79,8 @@ export declare type TableColumn<T extends TableRow> = {
     width?: ColumnWidth;
     mergeCells?: boolean;
     position?: Position;
+    hidden?: boolean;
+    control?: ({ column }: TableControl<T>) => React.ReactNode;
 } & (GroupColumnAddition<T> | SingleColumnAddition<T>);
 export declare type TableProps<T extends TableRow> = {
     columns: TableColumn<T>[];
@@ -85,6 +90,7 @@ export declare type TableProps<T extends TableRow> = {
     size?: Size;
     stickyHeader?: boolean;
     stickyColumns?: number;
+    minColumnWidth?: number;
     isResizable?: boolean;
     activeRow?: ActiveRow;
     verticalAlign?: VerticalAlign;

package/__internal__/src/components/Table/Table.js

@@ -52,26 +52,26 @@ var sortingData = function (rows, sorting, onSortBy) {
 var defaultEmptyRowsPlaceholder = (React.createElement(Text, { as: "span", view: "primary", size: "s", lineHeight: "s" }, "\u041D\u0435\u0442 \u0434\u0430\u043D\u043D\u044B\u0445"));
 var InternalTable = function (props, ref) {
     var _a, _b, _c, _d;
-    var columns = props.columns, rows = props.rows, _e = props.size, size = _e === void 0 ? 'l' : _e, rawFilters = props.filters, _f = props.isResizable, isResizable = _f === void 0 ? false : _f, _g = props.stickyHeader, stickyHeader = _g === void 0 ? false : _g, _h = props.stickyColumns, stickyColumns = _h === void 0 ? 0 : _h, activeRow = props.activeRow, _j = props.verticalAlign, verticalAlign = _j === void 0 ? 'top' : _j, _k = props.headerVerticalAlign, headerVerticalAlign = _k === void 0 ? 'center' : _k, zebraStriped = props.zebraStriped, _l = props.borderBetweenRows, borderBetweenRows = _l === void 0 ? false : _l, _m = props.borderBetweenColumns, borderBetweenColumns = _m === void 0 ? false : _m, _o = props.emptyRowsPlaceholder, emptyRowsPlaceholder = _o === void 0 ? defaultEmptyRowsPlaceholder : _o, className = props.className, onRowHover = props.onRowHover, onRowClick = props.onRowClick, onRowCreate = props.onRowCreate, _p = props.rowCreateText, rowCreateText = _p === void 0 ? '+ Добавить строку' : _p, lazyLoad = props.lazyLoad, onSortBy = props.onSortBy, onFiltersUpdated = props.onFiltersUpdated, getTagLabel = props.getTagLabel, _q = props.isExpandedRowsByDefault, isExpandedRowsByDefault = _q === void 0 ? false : _q;
-    var _r = useHeaderData(columns), headers = _r.headers, flattenedHeaders = _r.flattenedHeaders, lowHeaders = _r.lowHeaders, headerRowsRefs = _r.headerRowsRefs, headerRowsHeights = _r.headerRowsHeights, resizerTopOffsets = _r.resizerTopOffsets;
+    var columns = props.columns, rows = props.rows, _e = props.size, size = _e === void 0 ? 'l' : _e, rawFilters = props.filters, _f = props.isResizable, isResizable = _f === void 0 ? false : _f, _g = props.stickyHeader, stickyHeader = _g === void 0 ? false : _g, _h = props.stickyColumns, stickyColumns = _h === void 0 ? 0 : _h, _j = props.minColumnWidth, minColumnWidth = _j === void 0 ? 150 : _j, activeRow = props.activeRow, _k = props.verticalAlign, verticalAlign = _k === void 0 ? 'top' : _k, _l = props.headerVerticalAlign, headerVerticalAlign = _l === void 0 ? 'center' : _l, zebraStriped = props.zebraStriped, _m = props.borderBetweenRows, borderBetweenRows = _m === void 0 ? false : _m, _o = props.borderBetweenColumns, borderBetweenColumns = _o === void 0 ? false : _o, _p = props.emptyRowsPlaceholder, emptyRowsPlaceholder = _p === void 0 ? defaultEmptyRowsPlaceholder : _p, className = props.className, onRowHover = props.onRowHover, onRowClick = props.onRowClick, onRowCreate = props.onRowCreate, _q = props.rowCreateText, rowCreateText = _q === void 0 ? '+ Добавить строку' : _q, lazyLoad = props.lazyLoad, onSortBy = props.onSortBy, onFiltersUpdated = props.onFiltersUpdated, getTagLabel = props.getTagLabel, _r = props.isExpandedRowsByDefault, isExpandedRowsByDefault = _r === void 0 ? false : _r;
+    var _s = useHeaderData(columns), headers = _s.headers, flattenedHeaders = _s.flattenedHeaders, lowHeaders = _s.lowHeaders, headerRowsRefs = _s.headerRowsRefs, headerRowsHeights = _s.headerRowsHeights, resizerTopOffsets = _s.resizerTopOffsets;
     var stickyColumnsGrid = ((_a = headers[0][stickyColumns - 1]) === null || _a === void 0 ? void 0 : _a.position.gridIndex) +
         (((_b = headers[0][stickyColumns - 1]) === null || _b === void 0 ? void 0 : _b.position.colSpan) || 1);
     var getColumnsWidth = function () { return lowHeaders.map(function (column) { return column.width; }); };
-    var _s = __read(React.useState(getColumnsWidth()), 2), resizedColumnWidths = _s[0], setResizedColumnWidths = _s[1];
+    var _t = __read(React.useState(getColumnsWidth()), 2), resizedColumnWidths = _t[0], setResizedColumnWidths = _t[1];
     var filters = React.useMemo(function () {
         return rawFilters && rawFilters.filter(function (filter) { return filter.id && filter.field; });
     }, [rawFilters]);
     React.useEffect(function () {
         setResizedColumnWidths(getColumnsWidth());
     }, [lowHeaders.length]);
-    var _t = __read(React.useState([]), 2), initialColumnWidths = _t[0], setInitialColumnWidths = _t[1];
-    var _u = __read(React.useState(null), 2), sorting = _u[0], setSorting = _u[1];
-    var _v = __read(React.useState(null), 2), visibleFilter = _v[0], setVisibleFilter = _v[1];
-    var _w = __read(React.useState({ top: 0, left: 0 }), 2), tableScroll = _w[0], setTableScroll = _w[1];
+    var _u = __read(React.useState([]), 2), initialColumnWidths = _u[0], setInitialColumnWidths = _u[1];
+    var _v = __read(React.useState(null), 2), sorting = _v[0], setSorting = _v[1];
+    var _w = __read(React.useState(null), 2), visibleFilter = _w[0], setVisibleFilter = _w[1];
+    var _x = __read(React.useState({ top: 0, left: 0 }), 2), tableScroll = _x[0], setTableScroll = _x[1];
     var tableRef = React.useRef(null);
     var columnsRefs = React.useRef({});
-    var _x = useSelectedFilters(filters, onFiltersUpdated), selectedFilters = _x.selectedFilters, updateSelectedFilters = _x.updateSelectedFilters, removeOneSelectedFilter = _x.removeOneSelectedFilter, removeAllSelectedFilters = _x.removeAllSelectedFilters;
-    var _y = __read(React.useState([]), 2), expandedRowIds = _y[0], setExpandedRowIds = _y[1];
+    var _y = useSelectedFilters(filters, onFiltersUpdated), selectedFilters = _y.selectedFilters, updateSelectedFilters = _y.updateSelectedFilters, removeOneSelectedFilter = _y.removeOneSelectedFilter, removeAllSelectedFilters = _y.removeAllSelectedFilters;
+    var _z = __read(React.useState([]), 2), expandedRowIds = _z[0], setExpandedRowIds = _z[1];
     // установка сортировки по умолчанию
     React.useEffect(function () {
         var sortingColumn = columns.find(function (col) { return isString(col.order) && Object.prototype.hasOwnProperty.call(Order, col.order); });
@@ -177,7 +177,7 @@ var InternalTable = function (props, ref) {
         return onRowCreate && onRowCreate({ e: e, id: id, index: index });
     }; };
     var handleColumnResize = function (idx, delta) {
-        var columnMinWidth = Math.min(150, initialColumnWidths[idx]);
+        var columnMinWidth = Math.min(minColumnWidth, initialColumnWidths[idx]);
         var prevColumnWidth = resizedColumnWidths[idx] || initialColumnWidths[idx];
         var newColumnWidth = Math.max(columnMinWidth, prevColumnWidth + delta);
         updateColumnWidth(idx, newColumnWidth);
@@ -227,8 +227,8 @@ var InternalTable = function (props, ref) {
             selectedFilters: selectedFilters
         })
         : sortedTableData;
-    var _z = lazyLoad || {}, _0 = _z.maxVisibleRows, maxVisibleRows = _0 === void 0 ? 210 : _0, _1 = _z.scrollableEl, scrollableEl = _1 === void 0 ? tableRef.current : _1;
-    var _2 = useLazyLoadData(maxVisibleRows, scrollableEl, !!lazyLoad), getSlicedRows = _2.getSlicedRows, setBoundaryRef = _2.setBoundaryRef;
+    var _0 = lazyLoad || {}, _1 = _0.maxVisibleRows, maxVisibleRows = _1 === void 0 ? 210 : _1, _2 = _0.scrollableEl, scrollableEl = _2 === void 0 ? tableRef.current : _2;
+    var _3 = useLazyLoadData(maxVisibleRows, scrollableEl, !!lazyLoad), getSlicedRows = _3.getSlicedRows, setBoundaryRef = _3.setBoundaryRef;
     var flatRowsData = transformRows(filteredData, expandedRowIds, isExpandedRowsByDefault);
     var rowsData = getSlicedRows(flatRowsData);
     var tableStyle = {

package/__internal__/src/components/Table/helpers.d.ts

@@ -44,6 +44,8 @@ export declare const transformColumns: <T extends TableRow>(columns: TableColumn
     width?: number | undefined;
     mergeCells?: boolean | undefined;
     position?: Position | undefined;
+    hidden?: boolean | undefined;
+    control?: (({ column }: import("./Table").TableControl<T>) => React.ReactNode) | undefined;
 } & {
     columns: TableColumn<T>[];
 } & { [K_1 in keyof import("./Table").ValueOf<{ [K in keyof T]: {
@@ -63,6 +65,8 @@ export declare const transformColumns: <T extends TableRow>(columns: TableColumn
     width?: number | undefined;
     mergeCells?: boolean | undefined;
     position?: Position | undefined;
+    hidden?: boolean | undefined;
+    control?: (({ column }: import("./Table").TableControl<T>) => React.ReactNode) | undefined;
 } & import("./Table").ValueOf<{ [K in keyof T]: {
     accessor: K extends string ? K : never;
     sortable?: boolean | undefined;

package/__internal__/src/components/Table/helpers.js

@@ -132,7 +132,10 @@ export var useHeaderData = function (columns) {
     var headerColumnsHeights = Object.values(headerRowsRefs.current)
         .filter(isNotNil)
         .map(function (ref) { return ref.getBoundingClientRect().height; });
-    var flattenedHeaders = headers.flat().map(function (column, index) { return (__assign(__assign({}, column), { position: __assign(__assign({}, column.position), { smallTextSize: headers.length > 1 && column.position.level === headers.length - 1, height: headerColumnsHeights[index] || 0 }) })); });
+    var flattenedHeaders = headers
+        .flat()
+        .filter(function (column) { return !column.hidden; })
+        .map(function (column, index) { return (__assign(__assign({}, column), { position: __assign(__assign({}, column.position), { smallTextSize: headers.length > 1 && column.position.level === headers.length - 1, height: headerColumnsHeights[index] || 0 }) })); });
     var headerRowsHeights = headers.map(function (arr, index) {
         return Math.min.apply(null, flattenedHeaders
             .filter(function (col) { return col.position.level === index; })

package/__internal__/src/components/Tabs/Tab/TabsTab.js

@@ -2,7 +2,7 @@ import './TabsTab.css';
 import React, { forwardRef } from 'react';
 import { cnMixFocus } from '../../../mixs/MixFocus/MixFocus';
 import { cn } from '../../../utils/bem';
-import { getSizeByMap } from '../../../utils/getSizeByMap';
+import { getByMap } from '../../../utils/getByMap';
 export var cnTabsTab = cn('TabsTab');
 var sizeMap = {
     s: 'xs',
@@ -10,7 +10,7 @@ var sizeMap = {
 };
 export var TabsTab = forwardRef(function (props, ref) {
     var label = props.label, onChange = props.onChange, checked = props.checked, size = props.size, onlyIcon = props.onlyIcon, Icon = props.icon, iconSizeProp = props.iconSize, className = props.className;
-    var iconSize = getSizeByMap(sizeMap, size, iconSizeProp);
+    var iconSize = getByMap(sizeMap, size, iconSizeProp);
     return (React.createElement("button", { className: cnTabsTab({ size: size, checked: checked, onlyIcon: onlyIcon }, [cnMixFocus({ before: true }), className]), onClick: checked ? undefined : onChange, ref: ref, role: "tab", type: "button", title: onlyIcon ? label : undefined },
         Icon && React.createElement(Icon, { className: cnTabsTab('Icon'), size: iconSize }),
         !onlyIcon && label));

package/__internal__/src/components/TagBase/TagBase.js

@@ -3,7 +3,7 @@ import './TagBase.css';
 import React from 'react';
 import { IconClose } from '../../icons/IconClose/IconClose';
 import { cn } from '../../utils/bem';
-import { getSizeByMap } from '../../utils/getSizeByMap';
+import { getByMap } from '../../utils/getByMap';
 import { forwardRefWithAs } from '../../utils/types/PropsWithAsAttributes';
 export var tagBasePropSize = ['m', 'xs', 's', 'l'];
 export var tagBasePropSizeDefault = tagBasePropSize[0];
@@ -24,8 +24,8 @@ export var TagBase = forwardRefWithAs(function (props, ref) {
     var Tag = as;
     var withCancel = typeof onCancel === 'function';
     var withIcon = !!Icon;
-    var IconCloseSize = getSizeByMap(sizeMap, size);
-    var IconSize = getSizeByMap(sizeMap, size, iconSize);
+    var IconCloseSize = getByMap(sizeMap, size);
+    var IconSize = getByMap(sizeMap, size, iconSize);
     return (React.createElement(Tag, __assign({}, otherProps, { className: cnTagBase({
             size: size,
             view: view,

package/__internal__/src/components/TextField/TextField.js

@@ -7,7 +7,7 @@ import { IconClose } from '../../icons/IconClose/IconClose';
 import { IconSelect } from '../../icons/IconSelect/IconSelect';
 import { IconSelectOpen } from '../../icons/IconSelectOpen/IconSelectOpen';
 import { cn } from '../../utils/bem';
-import { getSizeByMap } from '../../utils/getSizeByMap';
+import { getByMap } from '../../utils/getByMap';
 import { usePropsHandler } from '../EventInterceptor/usePropsHandler';
 import { FieldCaption } from '../FieldCaption/FieldCaption';
 import { FieldLabel } from '../FieldLabel/FieldLabel';
@@ -17,14 +17,14 @@ export var cnTextField = cn(COMPONENT_NAME);
 export function TextFieldRender(props, ref) {
     var textFieldRef = React.useRef(null);
     var inputRef = React.useRef(null);
-    var _a = usePropsHandler(COMPONENT_NAME, props, textFieldRef), className = _a.className, _b = _a.type, type = _b === void 0 ? 'text' : _b, value = _a.value, onChange = _a.onChange, id = _a.id, name = _a.name, rows = _a.rows, cols = _a.cols, minRows = _a.minRows, maxRows = _a.maxRows, inputRefProp = _a.inputRef, maxLength = _a.maxLength, disabled = _a.disabled, _c = _a.size, size = _c === void 0 ? textFieldPropSizeDefault : _c, _d = _a.view, view = _d === void 0 ? textFieldPropViewDefault : _d, _e = _a.form, form = _e === void 0 ? textFieldPropFormDefault : _e, state = _a.state, status = _a.status, _f = _a.width, width = _f === void 0 ? textFieldPropWidthDefault : _f, onBlur = _a.onBlur, onFocus = _a.onFocus, _g = _a.autoFocus, autoFocus = _g === void 0 ? false : _g, placeholder = _a.placeholder, leftSide = _a.leftSide, rightSide = _a.rightSide, autoComplete = _a.autoComplete, withClearButton = _a.withClearButton, max = _a.max, min = _a.min, readOnly = _a.readOnly, required = _a.required, _h = _a.step, step = _h === void 0 ? 1 : _h, tabIndex = _a.tabIndex, ariaLabel = _a.ariaLabel, label = _a.label, _j = _a.labelPosition, labelPosition = _j === void 0 ? 'top' : _j, caption = _a.caption, iconSizeProp = _a.iconSize, focused = _a.focused, otherProps = __rest(_a, ["className", "type", "value", "onChange", "id", "name", "rows", "cols", "minRows", "maxRows", "inputRef", "maxLength", "disabled", "size", "view", "form", "state", "status", "width", "onBlur", "onFocus", "autoFocus", "placeholder", "leftSide", "rightSide", "autoComplete", "withClearButton", "max", "min", "readOnly", "required", "step", "tabIndex", "ariaLabel", "label", "labelPosition", "caption", "iconSize", "focused"]);
+    var _a = usePropsHandler(COMPONENT_NAME, props, textFieldRef), className = _a.className, _b = _a.type, type = _b === void 0 ? 'text' : _b, value = _a.value, onChange = _a.onChange, id = _a.id, name = _a.name, rows = _a.rows, cols = _a.cols, minRows = _a.minRows, maxRows = _a.maxRows, inputRefProp = _a.inputRef, maxLength = _a.maxLength, disabled = _a.disabled, _c = _a.size, size = _c === void 0 ? textFieldPropSizeDefault : _c, _d = _a.view, view = _d === void 0 ? textFieldPropViewDefault : _d, _e = _a.form, form = _e === void 0 ? textFieldPropFormDefault : _e, state = _a.state, status = _a.status, _f = _a.width, width = _f === void 0 ? textFieldPropWidthDefault : _f, onBlur = _a.onBlur, onFocus = _a.onFocus, _g = _a.autoFocus, autoFocus = _g === void 0 ? false : _g, placeholder = _a.placeholder, leftSide = _a.leftSide, rightSide = _a.rightSide, autoComplete = _a.autoComplete, withClearButton = _a.withClearButton, max = _a.max, min = _a.min, readOnly = _a.readOnly, required = _a.required, _h = _a.step, step = _h === void 0 ? 1 : _h, tabIndex = _a.tabIndex, ariaLabel = _a.ariaLabel, label = _a.label, _j = _a.labelPosition, labelPosition = _j === void 0 ? 'top' : _j, caption = _a.caption, iconSizeProp = _a.iconSize, focused = _a.focused, onClick = _a.onClick, otherProps = __rest(_a, ["className", "type", "value", "onChange", "id", "name", "rows", "cols", "minRows", "maxRows", "inputRef", "maxLength", "disabled", "size", "view", "form", "state", "status", "width", "onBlur", "onFocus", "autoFocus", "placeholder", "leftSide", "rightSide", "autoComplete", "withClearButton", "max", "min", "readOnly", "required", "step", "tabIndex", "ariaLabel", "label", "labelPosition", "caption", "iconSize", "focused", "onClick"]);
     var _k = __read(useState(autoFocus), 2), focus = _k[0], setFocus = _k[1];
     var textarea = type === 'textarea';
     var LeftIcon = leftSide;
     var RightIcon = rightSide;
     var leftSideIsString = typeof leftSide === 'string';
     var rightSideIsString = typeof rightSide === 'string';
-    var iconSize = getSizeByMap(sizeMap, size, iconSizeProp);
+    var iconSize = getByMap(sizeMap, size, iconSizeProp);
     var handleChange = function (e) {
         var value = e.target.value;
         !disabled && (onChange === null || onChange === void 0 ? void 0 : onChange({ e: e, id: id, name: name, value: value || null }));
@@ -70,12 +70,10 @@ export function TextFieldRender(props, ref) {
         ref: useForkRef([inputRef, inputRefProp])
     };
     var handleClear = function (e) {
-        var _a;
         onChange === null || onChange === void 0 ? void 0 : onChange({
             e: e,
             value: ''
         });
-        (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
     };
     var changeNumberValue = function (e, isIncrement) {
         var _a;
@@ -87,7 +85,7 @@ export function TextFieldRender(props, ref) {
         onChange === null || onChange === void 0 ? void 0 : onChange({
             e: e,
             value: currentValue.toFixed(Number((_a = 
-            /* Необходимо для того чтобы избежать ситуации, когда по нажатию
+            /* Необходимо для того, чтобы избежать ситуации, когда по нажатию
             на кнопку прибавляется число с погрешностью.
             Здесь мы берем разрядность дробной части шага и ограничиваем
             результирующее число этой разрядностью */
@@ -96,7 +94,15 @@ export function TextFieldRender(props, ref) {
                 .split('.')[1]) === null || _a === void 0 ? void 0 : _a.length) || 0)
         });
     };
-    return (React.createElement("div", __assign({ className: cnTextField({ labelPosition: labelPosition, size: size, view: view, width: width }, [className]) }, otherProps),
+    var rootProps = {
+        // для того чтобы любые клики во внутренним элементам фокусили инпут
+        onClick: function (e) {
+            var _a;
+            (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+            onClick === null || onClick === void 0 ? void 0 : onClick(e);
+        }
+    };
+    return (React.createElement("div", __assign({ className: cnTextField({ labelPosition: labelPosition, size: size, view: view, width: width }, [className]), ref: useForkRef([ref, textFieldRef]) }, rootProps, otherProps),
         label && (React.createElement(FieldLabel, { required: required, className: cnTextField('Label', { labelPosition: labelPosition }), size: size }, label)),
         React.createElement("div", { className: cnTextField('Body') },
             React.createElement("div", { className: cnTextField('InputContainer', {
@@ -107,7 +113,7 @@ export function TextFieldRender(props, ref) {
                     type: type,
                     focus: focus || focused,
                     withValue: !!value
-                }), ref: useForkRef([ref, textFieldRef]) },
+                }) },
                 LeftIcon && (React.createElement("div", { className: cnTextField('Side', {
                         position: 'left',
                         type: leftSideIsString ? 'string' : 'icon'

package/__internal__/src/components/TextField/helpers.d.ts

@@ -44,7 +44,7 @@ export declare type TextFieldPropRightSide<TYPE> = TYPE extends 'number' ? {
 } : {
     rightSide?: string | React.FC<IconProps>;
 };
-export declare type Props<TYPE extends string> = {
+export declare type TextFieldProps<TYPE extends string> = PropsWithHTMLAttributes<{
     className?: string;
     value?: TextFieldPropValue;
     cols?: number;
@@ -82,7 +82,6 @@ export declare type Props<TYPE extends string> = {
     caption?: string;
     labelPosition?: 'top' | 'left';
     focused?: boolean;
-} & TextFieldPropsTextareaType<TYPE> & TextFieldPropRightSide<TYPE>;
-export declare type TextFieldProps<TYPE extends string> = PropsWithHTMLAttributes<Props<TYPE>, HTMLDivElement>;
+}, HTMLDivElement> & TextFieldPropsTextareaType<TYPE> & TextFieldPropRightSide<TYPE>;
 export declare type TextFieldComponent = <TYPE extends string>(props: TextFieldProps<TYPE> & React.RefAttributes<HTMLElement>) => React.ReactElement | null;
 export declare const sizeMap: Record<TextFieldPropSize, IconPropSize>;

package/__internal__/src/components/Theme/_color/Theme_color_gpnDark.css

@@ -14,7 +14,7 @@
   --color-bg-ghost: rgba(246, 251, 253, 0.1); /* Цвет затенения */
   --color-bg-tone: rgba(6, 20, 25, 0.85); /* Цвет паранджи */
   --color-bg-soft: rgba(255, 255, 255, 0.9); /* Цвет молока */
-  --color-bg-system: rgb(75, 89, 99); /* Цвет фона системнный */
+  --color-bg-system: rgb(77, 82, 91); /* Цвет фона системнный */
   --color-bg-normal: rgb(10, 165, 255); /* Цвет фона нейтральный */
   --color-bg-success: rgb(34, 195, 142); /* Цвет фона успеха */
   --color-bg-caution: rgb(242, 201, 76); /* Цвет фона осторожности */
@@ -28,7 +28,8 @@
   --color-typo-secondary: rgba(255, 255, 255, 0.6); /* Цвет второстепенного текста */
   --color-typo-ghost: rgba(255, 255, 255, 0.3); /* Цвет дополнительного текста */
   --color-typo-brand: rgb(0, 113, 178); /* Цвет брендового текста */
-  --color-typo-system: rgb(94, 121, 141); /* Цвет фона системнный */
+  --color-typo-system: rgb(99, 110, 131); /* Цвет фона системнный */
+
   --color-typo-normal: rgb(0, 155, 245); /* Цвет фона нейтральный */
   --color-typo-success: rgb(15, 174, 121); /* Цвет текста успеха */
   --color-typo-caution: rgb(248, 199, 53); /* Цвет текста осторожности */

package/__internal__/src/components/Theme/_color/Theme_color_gpnDefault.css

@@ -14,7 +14,8 @@
   --color-bg-ghost: rgba(0, 32, 51, 0.08); /* Цвет затенения */
   --color-bg-tone: rgba(0, 32, 51, 0.85); /* Цвет паранджи */
   --color-bg-soft: rgba(255, 255, 255, 0.9); /* Цвет молока */
-  --color-bg-system: rgb(206, 216, 222); /* Цвет фона системнный */
+  --color-bg-system: rgb(222, 228, 232); /* Цвет фона системнный */
+
   --color-bg-normal: rgb(86, 185, 242); /* Цвет фона нейтральный */
   --color-bg-success: rgb(34, 195, 142); /* Цвет фона успеха */
   --color-bg-caution: rgb(242, 201, 76); /* Цвет фона осторожности */
@@ -28,7 +29,8 @@
   --color-typo-secondary: rgba(0, 32, 51, 0.6); /* Цвет второстепенного текста */
   --color-typo-ghost: rgba(0, 32, 51, 0.3); /* Цвет дополнительного текста */
   --color-typo-brand: rgb(0, 113, 178); /* Цвет брендового текста */
-  --color-typo-system: rgb(132, 167, 189); /* Цвет фона системнный */
+  --color-typo-system: rgb(151, 178, 196); /* Цвет фона системнный */
+
   --color-typo-normal: rgb(51, 180, 255); /* Цвет фона нейтральный */
   --color-typo-success: rgb(9, 179, 123); /* Цвет текста успеха */
   --color-typo-caution: rgb(255, 161, 10); /* Цвет текста осторожности */

package/__internal__/src/components/Theme/_color/Theme_color_gpnDisplay.css

@@ -14,7 +14,8 @@
   --color-bg-ghost: rgba(246, 251, 253, 0.08); /* Цвет затенения */
   --color-bg-tone: rgba(0, 22, 31, 0.85); /* Цвет паранджи */
   --color-bg-soft: rgba(255, 255, 255, 0.9); /* Цвет молока */
-  --color-bg-system: rgb(75, 98, 114); /* Цвет фона системнный */
+  --color-bg-system: rgb(49, 85, 129); /* Цвет фона системнный */
+
   --color-bg-normal: rgb(10, 165, 255); /* Цвет фона нейтральный */
   --color-bg-success: rgb(34, 195, 142); /* Цвет фона успеха */
   --color-bg-caution: rgb(242, 201, 76); /* Цвет фона осторожности */
@@ -28,7 +29,8 @@
   --color-typo-secondary: rgba(246, 251, 253, 0.6); /* Цвет второстепенного текста */
   --color-typo-ghost: rgba(246, 251, 253, 0.3); /* Цвет дополнительного текста */
   --color-typo-brand: rgb(0, 113, 178); /* Цвет брендового текста */
-  --color-typo-system: rgb(96, 130, 154); /* Цвет фона системнный */
+  --color-typo-system: rgb(64, 114, 176); /* Цвет фона системнный */
+
   --color-typo-normal: rgb(0, 155, 245); /* Цвет фона нейтральный */
   --color-typo-success: rgb(15, 174, 121); /* Цвет текста успеха */
   --color-typo-caution: rgb(248, 199, 53); /* Цвет текста осторожности */

package/__internal__/src/components/ThemeToggler/ThemeToggler.js

@@ -2,7 +2,7 @@ import { __assign, __read, __rest } from "tslib";
 import React, { useEffect, useRef, useState } from 'react';
 import { useChoiceGroup } from '../../hooks/useChoiceGroup/useChoiceGroup';
 import { IconCheck } from '../../icons/IconCheck/IconCheck';
-import { getSizeByMap } from '../../utils/getSizeByMap';
+import { getByMap } from '../../utils/getByMap';
 import { setRef } from '../../utils/setRef';
 import { Button } from '../Button/Button';
 import { ContextMenu } from '../ContextMenu/ContextMenu';
@@ -35,8 +35,8 @@ export var ThemeToggler = React.forwardRef(function (props, componentRef) {
         callBack: onChange,
         multiple: false
     }), getOnChange = _c.getOnChange, getChecked = _c.getChecked;
-    var iconSize = getSizeByMap(iconSizeMap, size);
-    var contextMenuSize = getSizeByMap(contextMenuSizeMap, size);
+    var iconSize = getByMap(iconSizeMap, size);
+    var contextMenuSize = getByMap(contextMenuSizeMap, size);
     var getButtonIcon = function () { return getItemIcon(items.find(function (theme) { return getChecked(theme); })); };
     var onButtonClick = function (e) {
         if (items.length > 2) {
@@ -59,5 +59,5 @@ export var ThemeToggler = React.forwardRef(function (props, componentRef) {
     }
     return (React.createElement(React.Fragment, null,
         React.createElement(Button, __assign({}, otherProps, { ref: ref, iconLeft: getButtonIcon(), onClick: onButtonClick, onlyIcon: true, size: size, view: "clear" })),
-        items.length > 2 && isOpen && (React.createElement(ContextMenu, { offset: 8, items: items, getLabel: getItemLabel, anchorRef: ref, direction: direction, possibleDirections: possibleDirections, getLeftSideBar: renderIcons, getRightSideBar: renderChecks, onClickOutside: function () { return setIsOpen(false); }, getOnClick: getOnChange, size: contextMenuSize }))));
+        items.length > 2 && isOpen && (React.createElement(ContextMenu, { offset: 8, items: items, getLabel: getItemLabel, anchorRef: ref, direction: direction, possibleDirections: possibleDirections, getLeftSideBar: renderIcons, getRightSideBar: renderChecks, onClickOutside: function () { return setIsOpen(false); }, getItemOnClick: getOnChange, size: contextMenuSize }))));
 });

package/__internal__/src/components/User/User.js

@@ -3,7 +3,7 @@ import './User.css';
 import React from 'react';
 import { IconSelect } from '../../icons/IconSelect/IconSelect';
 import { cn } from '../../utils/bem';
-import { getSizeByMap } from '../../utils/getSizeByMap';
+import { getByMap } from '../../utils/getByMap';
 import { forwardRefWithAs } from '../../utils/types/PropsWithAsAttributes';
 import { Avatar } from '../Avatar/Avatar';
 import { Button } from '../Button/Button';
@@ -43,11 +43,11 @@ export var User = forwardRefWithAs(function (props, ref) {
     var IconRight = iconRight;
     return (React.createElement(Tag, __assign({}, otherProps, { className: cnUser({ size: size, view: view, width: width, withArrow: withArrow, minified: onlyAvatar }, [className]), ref: ref }),
         React.createElement("div", { className: cnUser('AvatarWrapper', { status: status }) },
-            React.createElement(Avatar, { size: getSizeByMap(avatarSizeMap, size), url: avatarUrl, name: name })),
+            React.createElement(Avatar, { size: getByMap(avatarSizeMap, size), url: avatarUrl, name: name })),
         !onlyAvatar && (name || info) && (React.createElement("div", { className: cnUser('Block') },
             name && (React.createElement(Text, { className: cnUser('Name'), size: size, view: "primary", lineHeight: "2xs" }, name)),
-            info && size !== 's' && (React.createElement(Text, { className: cnUser('Info'), size: getSizeByMap(infoSizeMap, size), view: "secondary", lineHeight: "2xs" }, info)))),
-        withArrow && (React.createElement(IconSelect, { className: cnUser('Icon'), size: getSizeByMap(iconSizeMap, size), view: "secondary" })),
-        IconRight && !onIconRightClick && (React.createElement(IconRight, { className: cnUser('Icon'), size: getSizeByMap(iconSizeMap, size), view: "secondary" })),
-        IconRight && onIconRightClick && (React.createElement(Button, { className: cnUser('IconRightButton'), onClick: onIconRightClick, iconRight: IconRight, onlyIcon: true, view: "clear", size: getSizeByMap(buttonSizeMap, size), form: "round" }))));
+            info && size !== 's' && (React.createElement(Text, { className: cnUser('Info'), size: getByMap(infoSizeMap, size), view: "secondary", lineHeight: "2xs" }, info)))),
+        withArrow && (React.createElement(IconSelect, { className: cnUser('Icon'), size: getByMap(iconSizeMap, size), view: "secondary" })),
+        IconRight && !onIconRightClick && (React.createElement(IconRight, { className: cnUser('Icon'), size: getByMap(iconSizeMap, size), view: "secondary" })),
+        IconRight && onIconRightClick && (React.createElement(Button, { className: cnUser('IconRightButton'), onClick: onIconRightClick, iconRight: IconRight, onlyIcon: true, view: "clear", size: getByMap(buttonSizeMap, size), form: "round" }))));
 });

package/__internal__/src/hooks/useSelect/useSelect.js

@@ -66,13 +66,10 @@ export function useSelect(params) {
         return optionForCreate ? __spread([optionForCreate], resultGroups) : resultGroups;
     }, [filteredOptions, groups, getItemGroupKey, getGroupKey, sortGroups, optionForCreate]);
     var notFound = useMemo(function () {
-        var flag = !params.onCreate;
+        var flag = false;
         if (searchValue.length > 0) {
-            visibleItems.forEach(function (group) {
-                if (isOptionForCreate(group) || group.items.length > 0 || group.group) {
-                    flag = false;
-                }
-            });
+            flag =
+                visibleItems.filter(function (group) { return isOptionForCreate(group) || group.items.length > 0 || group.group; }).length === 0 && !params.onCreate;
         }
         return flag;
     }, [visibleItems]);