@gravity-ui/blog-constructor 6.7.0 → 6.7.2

package/build/cjs/components/FeedHeader/components/Controls/Controls.css

@@ -41,10 +41,6 @@ unpredictable css rules order in build */
   border-radius: 8px;
 }
 
-.bc-feed-controls__popup_isMobile.bc-feed-controls__popup_isMobile {
-  max-height: inherit;
-}
-
 .bc-feed-controls__popup_isMobile .bc-feed-controls__popup-filter {
   position: relative;
   border: none;
@@ -57,7 +53,7 @@ unpredictable css rules order in build */
   border-bottom: 2px solid var(--g-color-line-generic);
   border-bottom-right-radius: 0;
   border-bottom-left-radius: 0;
-  width: 100vw;
+  width: 100%;
   height: 2px;
   transform: translateX(-50%);
 }

package/build/cjs/components/FeedHeader/components/Controls/Controls.js

@@ -89,26 +89,28 @@ const Controls = ({ handleLoadData, tags = [], services = [], queryParams, }) =>
     };
     const tagsItems = (0, react_1.useMemo)(() => [{ value: 'empty', content: (0, i18n_1.i18n)(i18n_1.Keyset.AllTags) }, ...tags], [tags]);
     const servicesItems = (0, react_1.useMemo)(() => (servicesInitial ? [...servicesInitial.split(',')] : []), [servicesInitial]);
-    return (react_1.default.createElement("div", { className: b('header') },
-        react_1.default.createElement("h1", { className: b('header-item', { title: true }) }, (0, i18n_1.i18n)(i18n_1.Keyset.Title)),
-        react_1.default.createElement("div", { className: b('header-item', { filters: true }) },
-            react_1.default.createElement("div", { className: b('filter-item') },
-                react_1.default.createElement(Search_1.Search, { className: b('search'), placeholder: (0, i18n_1.i18n)(i18n_1.Keyset.Search), initialValue: search && typeof search === 'string' ? search : '', onSubmit: handleSearch })),
-            react_1.default.createElement("div", { className: b('filter-item') },
-                react_1.default.createElement(uikit_1.Select, { className: b('select'), size: "xl", options: tagsItems, defaultValue: [tagInitial], onUpdate: handleTagSelect, placeholder: (0, i18n_1.i18n)(i18n_1.Keyset.AllTags), popupClassName: b('popup', { isMobile }), renderControl: (0, customRenders_1.renderSwitcher)({
-                        initial: [tagInitial],
-                        list: tagsItems,
-                        defaultLabel: (0, i18n_1.i18n)(i18n_1.Keyset.AllTags),
-                    }), disablePortal: true, virtualizationThreshold: VIRTUALIZATION_THRESHOLD, renderOption: customRenders_1.renderOption })),
-            services.length > 0 ? (react_1.default.createElement("div", { className: b('filter-item') },
-                react_1.default.createElement(uikit_1.Select, { className: b('select'), size: "xl", multiple: true, filterable: true, hasClear: true, disablePortal: true, options: services, defaultValue: servicesItems, popupClassName: b('popup', { isMobile }), onUpdate: handleServicesSelect, placeholder: (0, i18n_1.i18n)(i18n_1.Keyset.AllServices), renderControl: (0, customRenders_1.renderSwitcher)({
-                        initial: servicesItems,
-                        list: services,
-                        defaultLabel: (0, i18n_1.i18n)(i18n_1.Keyset.AllServices),
-                    }), virtualizationThreshold: VIRTUALIZATION_THRESHOLD, renderOption: customRenders_1.renderOption, renderFilter: customRenders_1.renderFilter }))) : null,
-            hasLikes ? (react_1.default.createElement("div", { className: b('filter-item', { 'width-auto': true }) },
-                react_1.default.createElement(uikit_1.Button, { view: 'outlined', className: b('saved-only-button', { savedOnly }), size: "xl", onClick: handleSavedOnly, selected: savedOnly },
-                    react_1.default.createElement(uikit_1.Icon, { data: Save_1.Save, size: ICON_SIZE, className: b('icon', { savedOnly }) }),
-                    (0, i18n_1.i18n)(i18n_1.Keyset.ActionSavedOnly)))) : null)));
+    return (react_1.default.createElement(uikit_1.MobileProvider, { mobile: false },
+        react_1.default.createElement("div", { className: b('header') },
+            react_1.default.createElement("h1", { className: b('header-item', { title: true }) }, (0, i18n_1.i18n)(i18n_1.Keyset.Title)),
+            react_1.default.createElement("div", { className: b('header-item', { filters: true }) },
+                react_1.default.createElement("div", { className: b('filter-item') },
+                    react_1.default.createElement(Search_1.Search, { className: b('search'), placeholder: (0, i18n_1.i18n)(i18n_1.Keyset.Search), initialValue: search && typeof search === 'string' ? search : '', onSubmit: handleSearch })),
+                react_1.default.createElement("div", { className: b('filter-item') },
+                    react_1.default.createElement(uikit_1.Select, { className: b('select'), size: "xl", options: tagsItems, defaultValue: [tagInitial], onUpdate: handleTagSelect, placeholder: (0, i18n_1.i18n)(i18n_1.Keyset.AllTags), popupClassName: b('popup', { isMobile }), renderControl: (0, customRenders_1.renderSwitcher)({
+                            initial: [tagInitial],
+                            list: tagsItems,
+                            defaultLabel: (0, i18n_1.i18n)(i18n_1.Keyset.AllTags),
+                        }), disablePortal: true, virtualizationThreshold: VIRTUALIZATION_THRESHOLD, renderOption: customRenders_1.renderOption })),
+                services.length > 0 ? (react_1.default.createElement("div", { className: b('filter-item') },
+                    react_1.default.createElement(uikit_1.Select, { className: b('select'), size: "xl", multiple: true, filterable: true, hasClear: true, disablePortal: true, options: services, defaultValue: servicesItems, popupClassName: b('popup', { isMobile }), onUpdate: handleServicesSelect, placeholder: (0, i18n_1.i18n)(i18n_1.Keyset.AllServices), renderControl: (0, customRenders_1.renderSwitcher)({
+                            initial: servicesItems,
+                            list: services,
+                            defaultLabel: (0, i18n_1.i18n)(i18n_1.Keyset.AllServices),
+                            qa: 'service-select',
+                        }), virtualizationThreshold: VIRTUALIZATION_THRESHOLD, renderOption: customRenders_1.renderOption, renderFilter: customRenders_1.renderFilter }))) : null,
+                hasLikes ? (react_1.default.createElement("div", { className: b('filter-item', { 'width-auto': true }) },
+                    react_1.default.createElement(uikit_1.Button, { view: 'outlined', className: b('saved-only-button', { savedOnly }), size: "xl", onClick: handleSavedOnly, selected: savedOnly },
+                        react_1.default.createElement(uikit_1.Icon, { data: Save_1.Save, size: ICON_SIZE, className: b('icon', { savedOnly }) }),
+                        (0, i18n_1.i18n)(i18n_1.Keyset.ActionSavedOnly)))) : null))));
 };
 exports.Controls = Controls;

package/build/cjs/components/FeedHeader/components/Controls/customRenders.d.ts

@@ -5,6 +5,7 @@ type RenderSwitcherType = ({ initial, list, defaultLabel, }: {
     initial: CustomSwitcherProps['initial'];
     list: CustomSwitcherProps['list'];
     defaultLabel: string;
+    qa?: string;
 }) => SelectProps['renderControl'];
 type RenderFilterType = SelectProps['renderFilter'];
 export declare const renderSwitcher: RenderSwitcherType;

package/build/cjs/components/FeedHeader/components/Controls/customRenders.js

@@ -9,11 +9,11 @@ const cn_1 = require("../../../../utils/cn");
 const CustomSelectOption_1 = require("../CustomSelectOption/CustomSelectOption");
 const CustomSwitcher_1 = require("../CustomSwitcher/CustomSwitcher");
 const b = (0, cn_1.block)('feed-controls');
-const renderSwitcher = ({ initial, list, defaultLabel }) => 
+const renderSwitcher = ({ initial, list, defaultLabel, qa }) => 
 // eslint-disable-next-line react/display-name
 (_a) => {
     var { ref, renderClear } = _a, _b = _a.triggerProps, { id, disabled, type, onClick, onKeyDown } = _b, a11yProps = tslib_1.__rest(_b, ["id", "disabled", "type", "onClick", "onKeyDown"]);
-    return (react_1.default.createElement(CustomSwitcher_1.CustomSwitcher, { id: id, disabled: disabled, type: type, initial: initial, defaultLabel: defaultLabel, list: list, controlRef: ref, onClick: onClick, onKeyDown: onKeyDown, renderClear: renderClear, a11yProps: a11yProps }));
+    return (react_1.default.createElement(CustomSwitcher_1.CustomSwitcher, { id: id, disabled: disabled, type: type, initial: initial, defaultLabel: defaultLabel, list: list, controlRef: ref, onClick: onClick, onKeyDown: onKeyDown, renderClear: renderClear, a11yProps: a11yProps, qa: qa }));
 };
 exports.renderSwitcher = renderSwitcher;
 const renderFilter = (_a) => {

package/build/cjs/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.d.ts

@@ -13,6 +13,7 @@ export type CustomSwitcherProps = {
     list: SelectItem[];
     controlRef: RenderControlParameters['ref'];
     a11yProps: RenderControlA11yProps;
+    qa?: string;
 } & Omit<RenderControlParameters, 'ref'> & Pick<TriggerProps, 'id' | 'disabled' | 'type'>;
-export declare const CustomSwitcher: ({ id, disabled, type, initial, defaultLabel, list, onClick, controlRef, onKeyDown, renderClear, a11yProps, }: CustomSwitcherProps) => React.JSX.Element;
+export declare const CustomSwitcher: ({ id, disabled, type, initial, defaultLabel, list, onClick, controlRef, onKeyDown, renderClear, a11yProps, qa, }: CustomSwitcherProps) => React.JSX.Element;
 export {};

package/build/cjs/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.js

@@ -10,7 +10,7 @@ const cn_1 = require("../../../../utils/cn");
 const b = (0, cn_1.block)('feed-custom-switcher');
 const ICON_SIZE = 12;
 const CLEAR_ICON_SIZE = 11;
-const CustomSwitcher = ({ id, disabled, type, initial, defaultLabel, list, onClick, controlRef, onKeyDown, renderClear, a11yProps, }) => {
+const CustomSwitcher = ({ id, disabled, type, initial, defaultLabel, list, onClick, controlRef, onKeyDown, renderClear, a11yProps, qa, }) => {
     const itemsNames = (0, react_1.useMemo)(() => {
         const items = list
             .filter((item) => initial.includes(item.value))
@@ -20,7 +20,7 @@ const CustomSwitcher = ({ id, disabled, type, initial, defaultLabel, list, onCli
     const hasCounter = itemsNames.length > 1;
     const contentElementId = (0, uikit_1.useUniqId)();
     return (react_1.default.createElement("div", { className: b('custom-switcher'), ref: controlRef },
-        react_1.default.createElement("button", Object.assign({ id: id, disabled: disabled, type: type, onClick: onClick, className: b('custom-switcher-element', { overlay: true }), onKeyDown: onKeyDown }, a11yProps, { "aria-labelledby": contentElementId })),
+        react_1.default.createElement("button", Object.assign({ "data-qa": qa, id: id, disabled: disabled, type: type, onClick: onClick, className: b('custom-switcher-element', { overlay: true }), onKeyDown: onKeyDown }, a11yProps, { "aria-labelledby": contentElementId })),
         react_1.default.createElement("div", { id: contentElementId, className: b('custom-switcher-element', { content: true }), "aria-hidden": true }, itemsNames === null || itemsNames === void 0 ? void 0 : itemsNames.join(', ')),
         renderClear &&
             renderClear({

package/build/esm/components/FeedHeader/components/Controls/Controls.css

@@ -41,10 +41,6 @@ unpredictable css rules order in build */
   border-radius: 8px;
 }
 
-.bc-feed-controls__popup_isMobile.bc-feed-controls__popup_isMobile {
-  max-height: inherit;
-}
-
 .bc-feed-controls__popup_isMobile .bc-feed-controls__popup-filter {
   position: relative;
   border: none;
@@ -57,7 +53,7 @@ unpredictable css rules order in build */
   border-bottom: 2px solid var(--g-color-line-generic);
   border-bottom-right-radius: 0;
   border-bottom-left-radius: 0;
-  width: 100vw;
+  width: 100%;
   height: 2px;
   transform: translateX(-50%);
 }

package/build/esm/components/FeedHeader/components/Controls/Controls.js

@@ -1,6 +1,6 @@
 import React, { useContext, useMemo, useState } from 'react';
 import { useAnalytics } from '@gravity-ui/page-constructor';
-import { Button, Icon, Select } from '@gravity-ui/uikit';
+import { Button, Icon, MobileProvider, Select } from '@gravity-ui/uikit';
 import { DefaultGoalIds } from '../../../../constants';
 import { LikesContext } from '../../../../contexts/LikesContext';
 import { MobileContext } from '../../../../contexts/MobileContext';
@@ -86,25 +86,27 @@ export const Controls = ({ handleLoadData, tags = [], services = [], queryParams
     };
     const tagsItems = useMemo(() => [{ value: 'empty', content: i18n(Keyset.AllTags) }, ...tags], [tags]);
     const servicesItems = useMemo(() => (servicesInitial ? [...servicesInitial.split(',')] : []), [servicesInitial]);
-    return (React.createElement("div", { className: b('header') },
-        React.createElement("h1", { className: b('header-item', { title: true }) }, i18n(Keyset.Title)),
-        React.createElement("div", { className: b('header-item', { filters: true }) },
-            React.createElement("div", { className: b('filter-item') },
-                React.createElement(Search, { className: b('search'), placeholder: i18n(Keyset.Search), initialValue: search && typeof search === 'string' ? search : '', onSubmit: handleSearch })),
-            React.createElement("div", { className: b('filter-item') },
-                React.createElement(Select, { className: b('select'), size: "xl", options: tagsItems, defaultValue: [tagInitial], onUpdate: handleTagSelect, placeholder: i18n(Keyset.AllTags), popupClassName: b('popup', { isMobile }), renderControl: renderSwitcher({
-                        initial: [tagInitial],
-                        list: tagsItems,
-                        defaultLabel: i18n(Keyset.AllTags),
-                    }), disablePortal: true, virtualizationThreshold: VIRTUALIZATION_THRESHOLD, renderOption: renderOption })),
-            services.length > 0 ? (React.createElement("div", { className: b('filter-item') },
-                React.createElement(Select, { className: b('select'), size: "xl", multiple: true, filterable: true, hasClear: true, disablePortal: true, options: services, defaultValue: servicesItems, popupClassName: b('popup', { isMobile }), onUpdate: handleServicesSelect, placeholder: i18n(Keyset.AllServices), renderControl: renderSwitcher({
-                        initial: servicesItems,
-                        list: services,
-                        defaultLabel: i18n(Keyset.AllServices),
-                    }), virtualizationThreshold: VIRTUALIZATION_THRESHOLD, renderOption: renderOption, renderFilter: renderFilter }))) : null,
-            hasLikes ? (React.createElement("div", { className: b('filter-item', { 'width-auto': true }) },
-                React.createElement(Button, { view: 'outlined', className: b('saved-only-button', { savedOnly }), size: "xl", onClick: handleSavedOnly, selected: savedOnly },
-                    React.createElement(Icon, { data: Save, size: ICON_SIZE, className: b('icon', { savedOnly }) }),
-                    i18n(Keyset.ActionSavedOnly)))) : null)));
+    return (React.createElement(MobileProvider, { mobile: false },
+        React.createElement("div", { className: b('header') },
+            React.createElement("h1", { className: b('header-item', { title: true }) }, i18n(Keyset.Title)),
+            React.createElement("div", { className: b('header-item', { filters: true }) },
+                React.createElement("div", { className: b('filter-item') },
+                    React.createElement(Search, { className: b('search'), placeholder: i18n(Keyset.Search), initialValue: search && typeof search === 'string' ? search : '', onSubmit: handleSearch })),
+                React.createElement("div", { className: b('filter-item') },
+                    React.createElement(Select, { className: b('select'), size: "xl", options: tagsItems, defaultValue: [tagInitial], onUpdate: handleTagSelect, placeholder: i18n(Keyset.AllTags), popupClassName: b('popup', { isMobile }), renderControl: renderSwitcher({
+                            initial: [tagInitial],
+                            list: tagsItems,
+                            defaultLabel: i18n(Keyset.AllTags),
+                        }), disablePortal: true, virtualizationThreshold: VIRTUALIZATION_THRESHOLD, renderOption: renderOption })),
+                services.length > 0 ? (React.createElement("div", { className: b('filter-item') },
+                    React.createElement(Select, { className: b('select'), size: "xl", multiple: true, filterable: true, hasClear: true, disablePortal: true, options: services, defaultValue: servicesItems, popupClassName: b('popup', { isMobile }), onUpdate: handleServicesSelect, placeholder: i18n(Keyset.AllServices), renderControl: renderSwitcher({
+                            initial: servicesItems,
+                            list: services,
+                            defaultLabel: i18n(Keyset.AllServices),
+                            qa: 'service-select',
+                        }), virtualizationThreshold: VIRTUALIZATION_THRESHOLD, renderOption: renderOption, renderFilter: renderFilter }))) : null,
+                hasLikes ? (React.createElement("div", { className: b('filter-item', { 'width-auto': true }) },
+                    React.createElement(Button, { view: 'outlined', className: b('saved-only-button', { savedOnly }), size: "xl", onClick: handleSavedOnly, selected: savedOnly },
+                        React.createElement(Icon, { data: Save, size: ICON_SIZE, className: b('icon', { savedOnly }) }),
+                        i18n(Keyset.ActionSavedOnly)))) : null))));
 };

package/build/esm/components/FeedHeader/components/Controls/customRenders.d.ts

@@ -6,6 +6,7 @@ type RenderSwitcherType = ({ initial, list, defaultLabel, }: {
     initial: CustomSwitcherProps['initial'];
     list: CustomSwitcherProps['list'];
     defaultLabel: string;
+    qa?: string;
 }) => SelectProps['renderControl'];
 type RenderFilterType = SelectProps['renderFilter'];
 export declare const renderSwitcher: RenderSwitcherType;

package/build/esm/components/FeedHeader/components/Controls/customRenders.js

@@ -7,11 +7,11 @@ import { CustomSelectOption, } from '../CustomSelectOption/CustomSelectOption';
 import { CustomSwitcher } from '../CustomSwitcher/CustomSwitcher';
 import './Controls.css';
 const b = block('feed-controls');
-export const renderSwitcher = ({ initial, list, defaultLabel }) => 
+export const renderSwitcher = ({ initial, list, defaultLabel, qa }) => 
 // eslint-disable-next-line react/display-name
 (_a) => {
     var { ref, renderClear } = _a, _b = _a.triggerProps, { id, disabled, type, onClick, onKeyDown } = _b, a11yProps = __rest(_b, ["id", "disabled", "type", "onClick", "onKeyDown"]);
-    return (React.createElement(CustomSwitcher, { id: id, disabled: disabled, type: type, initial: initial, defaultLabel: defaultLabel, list: list, controlRef: ref, onClick: onClick, onKeyDown: onKeyDown, renderClear: renderClear, a11yProps: a11yProps }));
+    return (React.createElement(CustomSwitcher, { id: id, disabled: disabled, type: type, initial: initial, defaultLabel: defaultLabel, list: list, controlRef: ref, onClick: onClick, onKeyDown: onKeyDown, renderClear: renderClear, a11yProps: a11yProps, qa: qa }));
 };
 export const renderFilter = (_a) => {
     var { ref, onChange } = _a, _b = _a.inputProps, { value, onKeyDown, onChange: _, size: __, placeholder: ___ } = _b, a11yProps = __rest(_b, ["value", "onKeyDown", "onChange", "size", "placeholder"]);

package/build/esm/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.d.ts

@@ -14,6 +14,7 @@ export type CustomSwitcherProps = {
     list: SelectItem[];
     controlRef: RenderControlParameters['ref'];
     a11yProps: RenderControlA11yProps;
+    qa?: string;
 } & Omit<RenderControlParameters, 'ref'> & Pick<TriggerProps, 'id' | 'disabled' | 'type'>;
-export declare const CustomSwitcher: ({ id, disabled, type, initial, defaultLabel, list, onClick, controlRef, onKeyDown, renderClear, a11yProps, }: CustomSwitcherProps) => React.JSX.Element;
+export declare const CustomSwitcher: ({ id, disabled, type, initial, defaultLabel, list, onClick, controlRef, onKeyDown, renderClear, a11yProps, qa, }: CustomSwitcherProps) => React.JSX.Element;
 export {};

package/build/esm/components/FeedHeader/components/CustomSwitcher/CustomSwitcher.js

@@ -7,7 +7,7 @@ import './CustomSwitcher.css';
 const b = block('feed-custom-switcher');
 const ICON_SIZE = 12;
 const CLEAR_ICON_SIZE = 11;
-export const CustomSwitcher = ({ id, disabled, type, initial, defaultLabel, list, onClick, controlRef, onKeyDown, renderClear, a11yProps, }) => {
+export const CustomSwitcher = ({ id, disabled, type, initial, defaultLabel, list, onClick, controlRef, onKeyDown, renderClear, a11yProps, qa, }) => {
     const itemsNames = useMemo(() => {
         const items = list
             .filter((item) => initial.includes(item.value))
@@ -17,7 +17,7 @@ export const CustomSwitcher = ({ id, disabled, type, initial, defaultLabel, list
     const hasCounter = itemsNames.length > 1;
     const contentElementId = useUniqId();
     return (React.createElement("div", { className: b('custom-switcher'), ref: controlRef },
-        React.createElement("button", Object.assign({ id: id, disabled: disabled, type: type, onClick: onClick, className: b('custom-switcher-element', { overlay: true }), onKeyDown: onKeyDown }, a11yProps, { "aria-labelledby": contentElementId })),
+        React.createElement("button", Object.assign({ "data-qa": qa, id: id, disabled: disabled, type: type, onClick: onClick, className: b('custom-switcher-element', { overlay: true }), onKeyDown: onKeyDown }, a11yProps, { "aria-labelledby": contentElementId })),
         React.createElement("div", { id: contentElementId, className: b('custom-switcher-element', { content: true }), "aria-hidden": true }, itemsNames === null || itemsNames === void 0 ? void 0 : itemsNames.join(', ')),
         renderClear &&
             renderClear({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravity-ui/blog-constructor",
-  "version": "6.7.0",
+  "version": "6.7.2",
   "description": "Gravity UI Blog Constructor",
   "license": "MIT",
   "repository": {