@steroidsjs/bootstrap 3.0.42 → 3.0.44

package/form/TextField/TextFieldView.js

@@ -37,17 +37,40 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 exports.__esModule = true;
-var React = __importStar(require("react"));
+var react_1 = __importStar(require("react"));
 var hooks_1 = require("@steroidsjs/core/hooks");
 var Icon_1 = __importDefault(require("@steroidsjs/core/ui/content/Icon"));
 function TextFieldView(props) {
     var bem = (0, hooks_1.useBem)('TextFieldView');
-    return (React.createElement("div", { className: bem(bem.block({
+    /*
+    В хуке устанавливается высота текстового поля, равная высоте введенного текста
+    */
+    (0, react_1.useEffect)(function () {
+        if (props.autoHeight) {
+            var inputElement = props.inputProps.ref.current;
+            if (!inputElement) {
+                return;
+            }
+            var inputElementComputedStyles = window.getComputedStyle(inputElement);
+            // Получаем числовое значение ширины верхней и нижней границ
+            var borderTopWidth = parseInt(inputElementComputedStyles.borderTopWidth, 10);
+            var borderBottomWidth = parseInt(inputElementComputedStyles.borderBottomWidth, 10);
+            /**
+             * Сброс высоты до значения по умолчанию.
+             * Необходимо для корректного расчета текущей высоты содержимого:
+             * - если текст из поля убирают, высота поля уменьшится до минимально установленного значения
+             * - если текст добавляют, высота подстроится под высоту текущего контента
+             */
+            inputElement.style.height = 'auto';
+            inputElement.style.height = "".concat(inputElement.scrollHeight + borderTopWidth + borderBottomWidth, "px");
+        }
+    }, [props.inputProps.ref, props.inputProps.value, props.autoHeight]);
+    return (react_1["default"].createElement("div", { className: bem(bem.block({
             hasErrors: !!props.errors,
             filled: !!props.inputProps.value,
             size: props.size
         }), props.className) },
-        React.createElement("textarea", __assign({ className: bem.element('textarea'), id: props.id }, props.inputProps)),
-        props.showClear && (React.createElement(Icon_1["default"], { className: bem.element('clear'), name: "cross_8x8", onClick: props.onClear }))));
+        react_1["default"].createElement("textarea", __assign({ className: bem.element('textarea'), id: props.id }, props.inputProps)),
+        props.showClear && (react_1["default"].createElement(Icon_1["default"], { className: bem.element('clear'), name: "cross_8x8", onClick: props.onClear }))));
 }
 exports["default"] = TextFieldView;

package/icons/svgs/burger.svg

@@ -1,5 +1,7 @@
-<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M5 7.44922H19" stroke="#323232" stroke-linecap="round"/>
-<path d="M5 12.4492H15" stroke="#323232" stroke-linecap="round"/>
-<path d="M5 17.4492H11" stroke="#323232" stroke-linecap="round"/>
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g id="Icons/Icons24&#209;&#133;24/Black/burger &amp; menu/Menu">
+        <path id="Vector 7" d="M5 7H19" stroke="#323232" stroke-linecap="round"/>
+        <path id="Vector 8" d="M5 12H19" stroke="#323232" stroke-linecap="round"/>
+        <path id="Vector 9" d="M5 17H19" stroke="#323232" stroke-linecap="round"/>
+    </g>
 </svg>

package/list/List/ListView.js

@@ -25,8 +25,11 @@ var __importStar = (this && this.__importStar) || function (mod) {
 exports.__esModule = true;
 var React = __importStar(require("react"));
 var hooks_1 = require("@steroidsjs/core/hooks");
+var react_1 = require("react");
 function ListView(props) {
     var bem = (0, hooks_1.useBem)('ListView');
+    var infiniteScroll = (0, react_1.useMemo)(function () { return props.renderInfiniteScroll(); }, [props]);
+    var loading = (0, react_1.useMemo)(function () { return props.renderLoading(); }, [props]);
     if (!props.list) {
         return null;
     }
@@ -44,6 +47,8 @@ function ListView(props) {
         renderPagination(['top', 'both'].includes(props.paginationPosition) && props.renderPagination(), ['top', 'both'].includes(props.paginationSizePosition) && props.renderPaginationSize(), ['top', 'both'].includes(props.layoutNamesPosition) && props.renderLayoutNames()),
         React.createElement("div", { className: bem(bem.element('content'), props.contentClassName) }, props.content),
         renderPagination(['bottom', 'both'].includes(props.paginationPosition) && props.renderPagination(), ['bottom', 'both'].includes(props.paginationSizePosition) && props.renderPaginationSize(), ['bottom', 'both'].includes(props.layoutNamesPosition) && props.renderLayoutNames()),
-        props.renderLoading() || props.renderEmpty()));
+        props.renderLoading() || props.renderEmpty(),
+        !loading && infiniteScroll && (React.createElement("tr", { className: bem.element('infinite-scroll') },
+            React.createElement("td", null, infiniteScroll)))));
 }
 exports["default"] = ListView;

package/list/List/ListView.scss

@@ -7,6 +7,10 @@
         margin-bottom: 10px;
     }
 
+    &__infinite-scroll {
+        width: 100%;
+    }
+
     &__pagination {
         display: flex;
         justify-content: space-between;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@steroidsjs/bootstrap",
-    "version": "3.0.42",
+    "version": "3.0.44",
     "description": "",
     "main": "index.js",
     "author": "Vladimir Kozhin <hello@kozhindev.com>",
@@ -35,7 +35,7 @@
         "react-use": "^17.4.0"
     },
     "devDependencies": {
-        "@steroidsjs/core": "3.0.83",
+        "@steroidsjs/core": "3.0.89",
         "@steroidsjs/eslint-config": "^2.1.6",
         "@types/enzyme": "^3.10.8",
         "@types/googlemaps": "^3.43.3",