@doyourjob/gravity-ui-page-constructor 5.31.252 → 5.31.254

package/build/cjs/blocks/LogoRotator/LogoRotator.js

@@ -6,12 +6,32 @@ const react_1 = tslib_1.__importStar(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
 const components_1 = require("../../components");
 const AnimateBlock_1 = tslib_1.__importDefault(require("../../components/AnimateBlock/AnimateBlock"));
+const constants_1 = require("../../constants");
 const grid_1 = require("../../grid");
+const useWindowBreakpoint_1 = tslib_1.__importDefault(require("../../hooks/useWindowBreakpoint"));
 const utils_1 = require("../../utils");
 const Item_1 = tslib_1.__importDefault(require("./Item"));
 const b = (0, utils_1.block)('logo-rotator-block');
 const DEFAULT_MIN_ROTATE_COUNT = 2;
 const DEFAULT_MAX_ROTATE_COUNT = 4;
+const getInitialSlots = (items, count) => {
+    var _a;
+    const staticIdxList = items.map((item, i) => (item.isStatic ? i : -1)).filter((i) => i !== -1);
+    const rotatableIdxList = items
+        .map((item, i) => (item.isStatic ? -1 : i))
+        .filter((i) => i !== -1);
+    const initial = [];
+    let rotatablePointer = 0;
+    for (let slot = 0; slot < count; slot++) {
+        if (slot < staticIdxList.length) {
+            initial.push(staticIdxList[slot]);
+        }
+        else {
+            initial.push((_a = rotatableIdxList[rotatablePointer++]) !== null && _a !== void 0 ? _a : 0);
+        }
+    }
+    return initial;
+};
 const pickRandomSlots = (slotIndices, count) => {
     const shuffled = [...slotIndices];
     for (let i = shuffled.length - 1; i > 0; i--) {
@@ -21,38 +41,26 @@ const pickRandomSlots = (slotIndices, count) => {
     return shuffled.slice(0, count);
 };
 const LogoRotatorBlock = (props) => {
-    const { animated, title, theme, items, count, minRotateCount = DEFAULT_MIN_ROTATE_COUNT, maxRotateCount = DEFAULT_MAX_ROTATE_COUNT, colSizes, rowMode, } = props;
+    const { animated, title, theme, items, count, desktopCount, minRotateCount = DEFAULT_MIN_ROTATE_COUNT, maxRotateCount = DEFAULT_MAX_ROTATE_COUNT, colSizes, rowMode, } = props;
+    const breakpoint = (0, useWindowBreakpoint_1.default)();
+    const activeCount = desktopCount !== undefined && breakpoint >= constants_1.BREAKPOINTS.md ? desktopCount : count;
     // Индексы логотипов, которые участвуют в ротации (не статичные)
     const rotatableIndices = (0, react_1.useMemo)(() => items.map((item, i) => (item.isStatic ? -1 : i)).filter((i) => i !== -1), [items]);
     // Инициализация слотов: статичные вставляются в начало, остальные по порядку
-    const [slots, setSlots] = (0, react_1.useState)(() => {
-        var _a;
-        const staticIdxList = items
-            .map((item, i) => (item.isStatic ? i : -1))
-            .filter((i) => i !== -1);
-        const rotatableIdxList = items
-            .map((item, i) => (item.isStatic ? -1 : i))
-            .filter((i) => i !== -1);
-        const initial = [];
-        let rotatablePointer = 0;
-        for (let slot = 0; slot < count; slot++) {
-            if (slot < staticIdxList.length) {
-                initial.push(staticIdxList[slot]);
-            }
-            else {
-                initial.push((_a = rotatableIdxList[rotatablePointer++]) !== null && _a !== void 0 ? _a : 0);
-            }
-        }
-        return initial;
-    });
-    const [hidden, setHidden] = (0, react_1.useState)(() => Array(count).fill(false));
-    const nextIndexRef = (0, react_1.useRef)(count - 1);
+    const [slots, setSlots] = (0, react_1.useState)(() => getInitialSlots(items, activeCount));
+    const [hidden, setHidden] = (0, react_1.useState)(() => Array(activeCount).fill(false));
+    const nextIndexRef = (0, react_1.useRef)(activeCount - 1);
     const isHoveredRef = (0, react_1.useRef)(false);
     // Держим актуальные slots в ref, чтобы не пересоздавать интервал при каждом изменении
     const slotsRef = (0, react_1.useRef)(slots);
     (0, react_1.useEffect)(() => {
         slotsRef.current = slots;
     }, [slots]);
+    (0, react_1.useEffect)(() => {
+        setSlots(getInitialSlots(items, activeCount));
+        setHidden(Array(activeCount).fill(false));
+        nextIndexRef.current = activeCount - 1;
+    }, [activeCount, items]);
     (0, react_1.useEffect)(() => {
         let timeout = null;
         const interval = setInterval(() => {
@@ -104,7 +112,7 @@ const LogoRotatorBlock = (props) => {
                 clearTimeout(timeout);
             }
         };
-    }, [count, items, maxRotateCount, minRotateCount, rotatableIndices]);
+    }, [activeCount, items, maxRotateCount, minRotateCount, rotatableIndices]);
     const renderItems = (0, react_1.useMemo)(() => slots.map((slot, index) => (react_1.default.createElement(Item_1.default, { key: index, colSizes: colSizes, url: items[slot].url, src: items[slot].src, hidden: hidden[index] }))), [colSizes, hidden, items, slots]);
     const titleProps = !title || typeof title === 'string'
         ? { text: title, textSize: 'l' }

package/build/cjs/blocks/LogoRotator/schema.d.ts

@@ -185,6 +185,9 @@ export declare const LogoRotatorBlock: {
             count: {
                 type: string;
             };
+            desktopCount: {
+                type: string;
+            };
             minRotateCount: {
                 type: string;
             };

package/build/cjs/blocks/LogoRotator/schema.js

@@ -29,6 +29,8 @@ exports.LogoRotatorBlock = {
                 },
             }, count: {
                 type: 'number',
+            }, desktopCount: {
+                type: 'number',
             }, minRotateCount: {
                 type: 'number',
             }, maxRotateCount: {

package/build/cjs/models/constructor-items/blocks.d.ts

@@ -303,6 +303,7 @@ export interface LogoRotatorBlockProps extends Animatable {
         isStatic?: boolean;
     }[];
     count: number;
+    desktopCount?: number;
     minRotateCount?: number;
     maxRotateCount?: number;
     colSizes?: Partial<Record<GridColumnSize, number>>;

package/build/cjs/sub-blocks/MiniCaseCard/MiniCaseCard.js

@@ -12,9 +12,10 @@ const MiniCaseCardAuthor = ({ showQuote, avatar, author, position, }) => {
     return (react_1.default.createElement("div", { className: b('author') },
         avatar && react_1.default.createElement(components_1.Image, { src: avatar, className: b('author-avatar') }),
         (author || position) && (react_1.default.createElement("div", { className: b('author-text') },
-            author && react_1.default.createElement("span", { className: b('author-name') }, author),
-            author && position && react_1.default.createElement("br", null),
-            position && react_1.default.createElement("span", { className: b('author-position') }, position)))));
+            author && (react_1.default.createElement("span", { className: b('author-name') },
+                react_1.default.createElement(components_1.HTML, null, author))),
+            position && (react_1.default.createElement("span", { className: b('author-position') },
+                react_1.default.createElement(components_1.HTML, null, position)))))));
 };
 const MiniCaseCardTags = ({ tagUsecase, tagIndustry }) => {
     if (!(tagUsecase === null || tagUsecase === void 0 ? void 0 : tagUsecase.length) && !(tagIndustry === null || tagIndustry === void 0 ? void 0 : tagIndustry.length)) {

package/build/esm/blocks/LogoRotator/LogoRotator.js

@@ -2,13 +2,33 @@ import React, { useEffect, useMemo, useRef, useState } from 'react';
 import { Link } from '@gravity-ui/uikit';
 import { ImageBase, Title } from '../../components';
 import AnimateBlock from '../../components/AnimateBlock/AnimateBlock';
+import { BREAKPOINTS } from '../../constants';
 import { Grid, Row } from '../../grid';
+import useWindowBreakpoint from '../../hooks/useWindowBreakpoint';
 import { block } from '../../utils';
 import Item from './Item';
 import './LogoRotator.css';
 const b = block('logo-rotator-block');
 const DEFAULT_MIN_ROTATE_COUNT = 2;
 const DEFAULT_MAX_ROTATE_COUNT = 4;
+const getInitialSlots = (items, count) => {
+    var _a;
+    const staticIdxList = items.map((item, i) => (item.isStatic ? i : -1)).filter((i) => i !== -1);
+    const rotatableIdxList = items
+        .map((item, i) => (item.isStatic ? -1 : i))
+        .filter((i) => i !== -1);
+    const initial = [];
+    let rotatablePointer = 0;
+    for (let slot = 0; slot < count; slot++) {
+        if (slot < staticIdxList.length) {
+            initial.push(staticIdxList[slot]);
+        }
+        else {
+            initial.push((_a = rotatableIdxList[rotatablePointer++]) !== null && _a !== void 0 ? _a : 0);
+        }
+    }
+    return initial;
+};
 const pickRandomSlots = (slotIndices, count) => {
     const shuffled = [...slotIndices];
     for (let i = shuffled.length - 1; i > 0; i--) {
@@ -18,38 +38,26 @@ const pickRandomSlots = (slotIndices, count) => {
     return shuffled.slice(0, count);
 };
 export const LogoRotatorBlock = (props) => {
-    const { animated, title, theme, items, count, minRotateCount = DEFAULT_MIN_ROTATE_COUNT, maxRotateCount = DEFAULT_MAX_ROTATE_COUNT, colSizes, rowMode, } = props;
+    const { animated, title, theme, items, count, desktopCount, minRotateCount = DEFAULT_MIN_ROTATE_COUNT, maxRotateCount = DEFAULT_MAX_ROTATE_COUNT, colSizes, rowMode, } = props;
+    const breakpoint = useWindowBreakpoint();
+    const activeCount = desktopCount !== undefined && breakpoint >= BREAKPOINTS.md ? desktopCount : count;
     // Индексы логотипов, которые участвуют в ротации (не статичные)
     const rotatableIndices = useMemo(() => items.map((item, i) => (item.isStatic ? -1 : i)).filter((i) => i !== -1), [items]);
     // Инициализация слотов: статичные вставляются в начало, остальные по порядку
-    const [slots, setSlots] = useState(() => {
-        var _a;
-        const staticIdxList = items
-            .map((item, i) => (item.isStatic ? i : -1))
-            .filter((i) => i !== -1);
-        const rotatableIdxList = items
-            .map((item, i) => (item.isStatic ? -1 : i))
-            .filter((i) => i !== -1);
-        const initial = [];
-        let rotatablePointer = 0;
-        for (let slot = 0; slot < count; slot++) {
-            if (slot < staticIdxList.length) {
-                initial.push(staticIdxList[slot]);
-            }
-            else {
-                initial.push((_a = rotatableIdxList[rotatablePointer++]) !== null && _a !== void 0 ? _a : 0);
-            }
-        }
-        return initial;
-    });
-    const [hidden, setHidden] = useState(() => Array(count).fill(false));
-    const nextIndexRef = useRef(count - 1);
+    const [slots, setSlots] = useState(() => getInitialSlots(items, activeCount));
+    const [hidden, setHidden] = useState(() => Array(activeCount).fill(false));
+    const nextIndexRef = useRef(activeCount - 1);
     const isHoveredRef = useRef(false);
     // Держим актуальные slots в ref, чтобы не пересоздавать интервал при каждом изменении
     const slotsRef = useRef(slots);
     useEffect(() => {
         slotsRef.current = slots;
     }, [slots]);
+    useEffect(() => {
+        setSlots(getInitialSlots(items, activeCount));
+        setHidden(Array(activeCount).fill(false));
+        nextIndexRef.current = activeCount - 1;
+    }, [activeCount, items]);
     useEffect(() => {
         let timeout = null;
         const interval = setInterval(() => {
@@ -101,7 +109,7 @@ export const LogoRotatorBlock = (props) => {
                 clearTimeout(timeout);
             }
         };
-    }, [count, items, maxRotateCount, minRotateCount, rotatableIndices]);
+    }, [activeCount, items, maxRotateCount, minRotateCount, rotatableIndices]);
     const renderItems = useMemo(() => slots.map((slot, index) => (React.createElement(Item, { key: index, colSizes: colSizes, url: items[slot].url, src: items[slot].src, hidden: hidden[index] }))), [colSizes, hidden, items, slots]);
     const titleProps = !title || typeof title === 'string'
         ? { text: title, textSize: 'l' }

package/build/esm/blocks/LogoRotator/schema.d.ts

@@ -185,6 +185,9 @@ export declare const LogoRotatorBlock: {
             count: {
                 type: string;
             };
+            desktopCount: {
+                type: string;
+            };
             minRotateCount: {
                 type: string;
             };

package/build/esm/blocks/LogoRotator/schema.js

@@ -26,6 +26,8 @@ export const LogoRotatorBlock = {
                 },
             }, count: {
                 type: 'number',
+            }, desktopCount: {
+                type: 'number',
             }, minRotateCount: {
                 type: 'number',
             }, maxRotateCount: {

package/build/esm/models/constructor-items/blocks.d.ts

@@ -303,6 +303,7 @@ export interface LogoRotatorBlockProps extends Animatable {
         isStatic?: boolean;
     }[];
     count: number;
+    desktopCount?: number;
     minRotateCount?: number;
     maxRotateCount?: number;
     colSizes?: Partial<Record<GridColumnSize, number>>;

package/build/esm/sub-blocks/MiniCaseCard/MiniCaseCard.js

@@ -10,9 +10,10 @@ const MiniCaseCardAuthor = ({ showQuote, avatar, author, position, }) => {
     return (React.createElement("div", { className: b('author') },
         avatar && React.createElement(Image, { src: avatar, className: b('author-avatar') }),
         (author || position) && (React.createElement("div", { className: b('author-text') },
-            author && React.createElement("span", { className: b('author-name') }, author),
-            author && position && React.createElement("br", null),
-            position && React.createElement("span", { className: b('author-position') }, position)))));
+            author && (React.createElement("span", { className: b('author-name') },
+                React.createElement(HTML, null, author))),
+            position && (React.createElement("span", { className: b('author-position') },
+                React.createElement(HTML, null, position)))))));
 };
 const MiniCaseCardTags = ({ tagUsecase, tagIndustry }) => {
     if (!(tagUsecase === null || tagUsecase === void 0 ? void 0 : tagUsecase.length) && !(tagIndustry === null || tagIndustry === void 0 ? void 0 : tagIndustry.length)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@doyourjob/gravity-ui-page-constructor",
-  "version": "5.31.252",
+  "version": "5.31.254",
   "description": "Gravity UI Page Constructor",
   "license": "MIT",
   "repository": {