@meduza/ui-kit-2 0.9.9 → 0.9.401

package/README.md

@@ -2,12 +2,12 @@
 
 ## Разработка
 
-- `pnpm start` - запускает development сборку с hot reload, пишет все в папку dist
-- `cd example && pnpm start` - запускает сборку тестового проекта с hot reload,
+- `yarn start` - запускает development сборку с hot reload, пишет все в папку dist
+- `cd example && yarn start` - запускает сборку тестового проекта с hot reload,
   в который можно импортировать компоненты из кита
-- `pnpm storybook` - запускает storybook
+- `yarn storybook` - запускает storybook
 
-`pnpm generate` - генератор компонентов. Вводим название компонента, получаем все файлы и импорты
+`yarn generate` - генератор компонентов. Вводим название компонента, получаем все файлы и импорты
 
 ## Использование
 
@@ -18,8 +18,8 @@
 
 ### Режимы сборки
 
-- `pnpm build --mode development` - сборка стилей с переменными сайта
-- `pnpm build --mode production` - сборка стилей без переменных
+- `yarn build --mode development` - сборка стилей с переменными сайта
+- `yarn build --mode production` - сборка стилей без переменных
 
 ### Особенности production сборки
 
@@ -28,47 +28,3 @@
 - После сборки запускается `build.sh`:
   1. Создает `ui-kit-game.css` с игровыми переменными
   2. Перезаписывает `ui-kit.css` с переменными сайта
-
-## Как опубликовать новую версию
-
-1. Меняем номер версии в package.json.
-2. Прописываем команду `pnpm build` для создания файла со стилями.
-3. Прописываем команду `pnpm publish` для создания и публикации новой версии.
-
-## Локальное подключение UI-KIT к проекту
-
-Для локального подключения UI-KIT можно воспользоваться одним из 2 следующих способов. Важно соблюдать правильный порядок действий для корректного подключения.
-
-### Подключение через link:
-
-- **как создать локальное подключение:**
-
-1. В проекте website3 в package.json прописываем `"@meduza/ui-kit-2": "link:../ui-kit-2"`.
-
-- **как создать файл с изменениями в UI-KIT:**
-
-1. В данном проекте ui-kit-2 мы прописываем команду `pnpm build` - этой командой мы создаем новый css-файл.
-
-- **как отключить локальное подключение:**
-
-1. В проекте website3 в package.json прописываем опубликованную версию, например `"@meduza/ui-kit-2": "0.9.6"`.
-
-### Подключение через yalc:
-
-yalc - это инструмент, который позволяет локально публиковать и подключать npm-пакеты.
-
-- **как подключиться:**
-
-1. Если yalc не установлен, то можно его установить глобально командой `npm install -g yalc`. Если yalc установлен, то можно перейти к шагу 2.
-2. В данном проекте ui-kit-2 мы прописываем команду `yalc publish` - этой командой мы создаем линк.
-3. В проекте website3 мы прописываем команду `yalc add @meduza/ui-kit-2` - этой командой мы подписываемся на линк из шага 2.
-
-- **как создать файл с изменениями в UI-KIT:**
-
-1. В данном проекте ui-kit-2 мы прописываем команду `pnpm build` - этой командой мы создаем новый css-файл.
-2. В данном проекте ui-kit-2 мы прописываем команду `yalc publish` - этой командой мы создаем новый линк.
-3. В проекте website3 мы прописываем команду `yalc update` - это командой мы обновляем подписку на линк из шага 2.
-
-- **как отключить локальное подключение:**
-
-1. В проекте website3 мы прописываем команду `yalc remove @meduza/ui-kit-2` - этой командой мы удаляем подписку на линк.

package/dist/Button/Button.types.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 export type ButtonThemes = 'sand' | 'gold' | 'light' | 'gray' | 'ghost' | 'dark' | 'black' | 'red';
 export type ButtonStates = 'isLoading' | 'isDefault';
 export type ButtonSizes = 'auto' | 'default';
-export type ButtonStyleContexts = 'isInToolbar' | 'isInSpoiler' | 'isInDropdown' | 'isInPodcast';
+export type ButtonStyleContexts = 'isInToolbar' | 'isInSpoiler' | 'isInDropdown';
 export type ButtonAppearance = 'isFancy' | 'isClassic';
 export interface ButtonProps {
     theme?: ButtonThemes;

package/dist/DotsOnImage/DotsOnImage.types.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { OptimizedImageItem } from '../types';
 export interface PopoverData {
     title?: string;

package/dist/MetaItem/MetaItem.types.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface MetaItemProps {
     bullets?: boolean;
     hasSource?: boolean;

package/dist/Tooltip/Tooltip.types.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface TooltipProps {
     children: React.ReactNode;
     position: ['left' | 'center', 'top' | 'bottom'];

package/dist/ui-kit-2.cjs.development.js

@@ -13,7 +13,7 @@ const makeClassName = list => {
   return list.filter(([, active]) => active).map(([className]) => className).join(' ');
 };
 
-const ButtonLoader = () => (/*#__PURE__*/React.createElement("svg", {
+const ButtonLoader = () => ( /*#__PURE__*/React.createElement("svg", {
   width: "30px",
   height: "30px",
   viewBox: "0 0 30 30",
@@ -34,7 +34,7 @@ const ButtonLoader = () => (/*#__PURE__*/React.createElement("svg", {
   d: "M15 0c8.18 0 14.83 6.547 14.997 14.686L30 15h-2c0-7.077-5.655-12.833-12.693-12.996L15 2V0z"
 }))));
 
-var styles$J = {"root":"Button-module_root__9OQ5b","gold":"Button-module_gold__q-XBP","isLoading":"Button-module_isLoading__Z53G4","gray":"Button-module_gray__fypDq","sand":"Button-module_sand__e5v-k","dark":"Button-module_dark__qv4NQ","light":"Button-module_light__TLYLT","black":"Button-module_black__GIsbk","red":"Button-module_red__kybni","default":"Button-module_default__utLb-","isInToolbar":"Button-module_isInToolbar__84SG-","isInPodcast":"Button-module_isInPodcast__SNSpl","isInSpoiler":"Button-module_isInSpoiler__pGp-w","ghost":"Button-module_ghost__1s5-r","isInDropdown":"Button-module_isInDropdown__gN7TI","loader":"Button-module_loader__r0Mjs","isFancy":"Button-module_isFancy__gTRmu"};
+var styles$J = {"root":"Button-module_root__9OQ5b","gold":"Button-module_gold__q-XBP","isLoading":"Button-module_isLoading__Z53G4","gray":"Button-module_gray__fypDq","sand":"Button-module_sand__e5v-k","dark":"Button-module_dark__qv4NQ","light":"Button-module_light__TLYLT","black":"Button-module_black__GIsbk","red":"Button-module_red__kybni","default":"Button-module_default__utLb-","isInToolbar":"Button-module_isInToolbar__84SG-","isInSpoiler":"Button-module_isInSpoiler__pGp-w","ghost":"Button-module_ghost__1s5-r","isInDropdown":"Button-module_isInDropdown__gN7TI","loader":"Button-module_loader__r0Mjs","isFancy":"Button-module_isFancy__gTRmu"};
 
 const Button = ({
   theme = 'gold',
@@ -58,7 +58,7 @@ const Button = ({
     disabled: disabled,
     onClick: handleClick,
     type: "button"
-  }, state === 'isLoading' ? (/*#__PURE__*/React.createElement("span", {
+  }, state === 'isLoading' ? ( /*#__PURE__*/React.createElement("span", {
     className: styles$J.loader
   }, /*#__PURE__*/React.createElement(ButtonLoader, null))) : children);
 };
@@ -125,9 +125,11 @@ const icons = {
     content: '<g opacity="0.4"><circle cx="15" cy="15" r="10.5" stroke="white" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/><path d="M15 19.5L15 10.5M15 19.5L18.5 17.2257M15 19.5L11.5 17.2257" stroke="white" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"/></g>'
   },
   play: {
-    width: 32,
-    height: 32,
-    content: '<path fill-rule="nonzero" clip-rule="evenodd" d="M11.9665 22.877C11.4713 23.1557 10.8594 22.7978 10.8594 22.2296V9.7704C10.8594 9.20219 11.4713 8.84435 11.9665 9.12299L23.0374 15.3526C23.5422 15.6366 23.5422 16.3634 23.0374 16.6474L11.9665 22.877Z" stroke-width="0.371429" stroke-linecap="round" stroke-linejoin="round"/>'
+    width: 62,
+    height: 62,
+    content:
+    // '<path d="M24.35 41.772a.5.5 0 0 1-.739-.439V20.667a.5.5 0 0 1 .74-.44l18.944 10.334a.5.5 0 0 1 0 .878L24.351 41.772z" fill-rule="nonzero"/>'
+    '<path fill-rule="nonzero" clip-rule="evenodd" d="M11.9665 22.877C11.4713 23.1557 10.8594 22.7978 10.8594 22.2296V9.7704C10.8594 9.20219 11.4713 8.84435 11.9665 9.12299L23.0374 15.3526C23.5422 15.6366 23.5422 16.3634 23.0374 16.6474L11.9665 22.877Z" stroke-width="0.371429" stroke-linecap="round" stroke-linejoin="round"/>'
   },
   pause: {
     width: 22,
@@ -278,7 +280,7 @@ const icons = {
   }
 };
 
-var styles$I = {"root":"SvgSymbol-module_root__WctNR","small":"SvgSymbol-module_small__h9V-w","normal":"SvgSymbol-module_normal__gFAVe","medium":"SvgSymbol-module_medium__QaYjY","large":"SvgSymbol-module_large__o6A4o","adaptive":"SvgSymbol-module_adaptive__gL9qn","fb":"SvgSymbol-module_fb__HZqcB","vk":"SvgSymbol-module_vk__XctB2","ok":"SvgSymbol-module_ok__IM6Z9","tw":"SvgSymbol-module_tw__fio-Q","tg":"SvgSymbol-module_tg__GRhd-","magic":"SvgSymbol-module_magic__N-jKk","reaction":"SvgSymbol-module_reaction__xSbgo","card":"SvgSymbol-module_card__2nVFu","podcast":"SvgSymbol-module_podcast__Yp05r","read":"SvgSymbol-module_read__Bu653","listened":"SvgSymbol-module_listened__AOn7j","menu":"SvgSymbol-module_menu__z-dLm","cross":"SvgSymbol-module_cross__3Xej1","isInFeature":"SvgSymbol-module_isInFeature__BmyI-","isInCard":"SvgSymbol-module_isInCard__USxBS","isInTopicBlockItem":"SvgSymbol-module_isInTopicBlockItem__cnCgw","isInPageStatic":"SvgSymbol-module_isInPageStatic__7kMP-","isInMaterialMeta":"SvgSymbol-module_isInMaterialMeta__lIKJO","isInAudioPlayer":"SvgSymbol-module_isInAudioPlayer__mamWa","isInEpisodeBlock":"SvgSymbol-module_isInEpisodeBlock__oZ6JG","isInButtonPlaybackRate":"SvgSymbol-module_isInButtonPlaybackRate__NnADm","isInButtonBackward":"SvgSymbol-module_isInButtonBackward__x8L9a","isInButtonForward":"SvgSymbol-module_isInButtonForward__TtixK","isInToolbar":"SvgSymbol-module_isInToolbar__RzbaX","play":"SvgSymbol-module_play__dAES0","speedHalf":"SvgSymbol-module_speedHalf__mvVYC","speedThreeQuarters":"SvgSymbol-module_speedThreeQuarters__9N7uH","speedOne":"SvgSymbol-module_speedOne__sRNph","speedOneQuarter":"SvgSymbol-module_speedOneQuarter__fKIT7","speedOneHalf":"SvgSymbol-module_speedOneHalf__7yXsa","speedTwo":"SvgSymbol-module_speedTwo__Bv8-b","meduzaLogo":"SvgSymbol-module_meduzaLogo__aVKzZ","arrow":"SvgSymbol-module_arrow__lWTSJ","oil":"SvgSymbol-module_oil__VFGTp","search":"SvgSymbol-module_search__h06cc","user":"SvgSymbol-module_user__ORMm-","bookmark":"SvgSymbol-module_bookmark__JPKyG","shareBookmark":"SvgSymbol-module_shareBookmark__7w9X9","receipt":"SvgSymbol-module_receipt__o3V8u","isInHeader":"SvgSymbol-module_isInHeader__M5Tzw"};
+var styles$I = {"root":"SvgSymbol-module_root__WctNR","small":"SvgSymbol-module_small__h9V-w","normal":"SvgSymbol-module_normal__gFAVe","medium":"SvgSymbol-module_medium__QaYjY","large":"SvgSymbol-module_large__o6A4o","adaptive":"SvgSymbol-module_adaptive__gL9qn","fb":"SvgSymbol-module_fb__HZqcB","vk":"SvgSymbol-module_vk__XctB2","ok":"SvgSymbol-module_ok__IM6Z9","tw":"SvgSymbol-module_tw__fio-Q","tg":"SvgSymbol-module_tg__GRhd-","magic":"SvgSymbol-module_magic__N-jKk","reaction":"SvgSymbol-module_reaction__xSbgo","card":"SvgSymbol-module_card__2nVFu","podcast":"SvgSymbol-module_podcast__Yp05r","read":"SvgSymbol-module_read__Bu653","listened":"SvgSymbol-module_listened__AOn7j","menu":"SvgSymbol-module_menu__z-dLm","cross":"SvgSymbol-module_cross__3Xej1","isInFeature":"SvgSymbol-module_isInFeature__BmyI-","isInCard":"SvgSymbol-module_isInCard__USxBS","isInTopicBlockItem":"SvgSymbol-module_isInTopicBlockItem__cnCgw","isInPageStatic":"SvgSymbol-module_isInPageStatic__7kMP-","isInMaterialMeta":"SvgSymbol-module_isInMaterialMeta__lIKJO","isInAudioPlayer":"SvgSymbol-module_isInAudioPlayer__mamWa","isInEpisodeBlock":"SvgSymbol-module_isInEpisodeBlock__oZ6JG","isInButtonPlaybackRate":"SvgSymbol-module_isInButtonPlaybackRate__NnADm","isInButtonBackward":"SvgSymbol-module_isInButtonBackward__x8L9a","isInButtonForward":"SvgSymbol-module_isInButtonForward__TtixK","isInToolbar":"SvgSymbol-module_isInToolbar__RzbaX","play":"SvgSymbol-module_play__dAES0","meduzaLogo":"SvgSymbol-module_meduzaLogo__aVKzZ","arrow":"SvgSymbol-module_arrow__lWTSJ","oil":"SvgSymbol-module_oil__VFGTp","search":"SvgSymbol-module_search__h06cc","user":"SvgSymbol-module_user__ORMm-","bookmark":"SvgSymbol-module_bookmark__JPKyG","shareBookmark":"SvgSymbol-module_shareBookmark__7w9X9","receipt":"SvgSymbol-module_receipt__o3V8u","isInHeader":"SvgSymbol-module_isInHeader__M5Tzw"};
 
 const SvgSymbol = ({
   icon,
@@ -309,10 +311,10 @@ const Switcher = ({
   theme = 'light',
   childrenLeft,
   childrenRight
-}) => (/*#__PURE__*/React.createElement("label", {
+}) => ( /*#__PURE__*/React.createElement("label", {
   "data-testid": "switcher",
   className: makeClassName([[styles$H.root, true], [styles$H[theme], !!styles$H[theme]], [styles$H[styleContext], !!styles$H[styleContext]]])
-}, childrenLeft && (/*#__PURE__*/React.createElement("div", {
+}, childrenLeft && ( /*#__PURE__*/React.createElement("div", {
   className: makeClassName([[styles$H.children, true], [styles$H.left, true]])
 }, childrenLeft)), /*#__PURE__*/React.createElement("input", {
   className: styles$H.input,
@@ -323,7 +325,7 @@ const Switcher = ({
   className: styles$H.control
 }, /*#__PURE__*/React.createElement("span", {
   className: styles$H.knob
-})), childrenRight && (/*#__PURE__*/React.createElement("div", {
+})), childrenRight && ( /*#__PURE__*/React.createElement("div", {
   className: makeClassName([[styles$H.children, true], [styles$H.right, true]])
 }, childrenRight))));
 
@@ -435,10 +437,10 @@ const RenderPicture = ({
     setFallback(!window.HTMLPictureElement);
   }, []);
   const keys = imageConditionalKeys[toCamel(display)] || imageConditionalKeys.default;
-  return /*#__PURE__*/React.createElement("picture", null, source && (/*#__PURE__*/React.createElement("source", {
+  return /*#__PURE__*/React.createElement("picture", null, source && ( /*#__PURE__*/React.createElement("source", {
     media: "(min-width: 325px)",
     srcSet: `${source[1]} 2x`
-  })), optimized && !optimized.w325 && (/*#__PURE__*/React.createElement("source", {
+  })), optimized && !optimized.w325 && ( /*#__PURE__*/React.createElement("source", {
     media: "(min-width: 0)",
     srcSet: `${optimized.original}`
   })), optimized && keys.map(key => {
@@ -512,7 +514,7 @@ const Image = ({
     onKeyPress: () => handleClick(),
     role: "button",
     tabIndex: 0
-  }, lazy ? (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Lazy, {
+  }, lazy ? ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Lazy, {
     threshold: 0.25
   }, /*#__PURE__*/React.createElement(RenderPicture, {
     fallbackSource: fallbackSource,
@@ -524,7 +526,7 @@ const Image = ({
   })), /*#__PURE__*/React.createElement("noscript", null, /*#__PURE__*/React.createElement("img", {
     src: fallbackSource,
     alt: alt
-  })))) : (/*#__PURE__*/React.createElement(RenderPicture, {
+  })))) : ( /*#__PURE__*/React.createElement(RenderPicture, {
     fallbackSource: fallbackSource,
     source: source,
     optimized: optimized,
@@ -732,7 +734,7 @@ const DotsOnImage = ({
     display: display
   }), /*#__PURE__*/React.createElement("div", {
     ref: container
-  }, dots.map(dot => (/*#__PURE__*/React.createElement("div", {
+  }, dots.map(dot => ( /*#__PURE__*/React.createElement("div", {
     className: styles$C.dot,
     key: dot.id,
     style: {
@@ -747,11 +749,11 @@ const DotsOnImage = ({
       backgroundColor: dot.icon.color
     },
     onClick: () => handleDotClick(dot)
-  }, dot.icon.type === 'svg' && (/*#__PURE__*/React.createElement("div", {
+  }, dot.icon.type === 'svg' && ( /*#__PURE__*/React.createElement("div", {
     dangerouslySetInnerHTML: {
       __html: dot.icon.svg_string
     }
-  })), dot.icon.type === 'number' && dot.icon.number)))), popover.show && (/*#__PURE__*/React.createElement(React.Fragment, null, viewportSize().width >= MediaQuerySizes.LANDSCAPE_TABLET ? (/*#__PURE__*/React.createElement("div", {
+  })), dot.icon.type === 'number' && dot.icon.number)))), popover.show && ( /*#__PURE__*/React.createElement(React.Fragment, null, viewportSize().width >= MediaQuerySizes.LANDSCAPE_TABLET ? ( /*#__PURE__*/React.createElement("div", {
     className: makeClassName([[styles$C.popover, true], [styles$C[popover.side], !!popover.side], [styles$C[popover.align], !!popover.align]]),
     style: popover.style
   }, /*#__PURE__*/React.createElement(Footnote, {
@@ -764,7 +766,7 @@ const DotsOnImage = ({
     dangerouslySetInnerHTML: {
       __html: popover.body
     }
-  })))) : (/*#__PURE__*/React.createElement(Popover, {
+  })))) : ( /*#__PURE__*/React.createElement(Popover, {
     onClose: () => {
       setPopover({
         show: false
@@ -811,12 +813,12 @@ const MediaCaption = ({
   return /*#__PURE__*/React.createElement("div", {
     "data-testid": "media-caption",
     className: makeClassName(classNames)
-  }, caption && (/*#__PURE__*/React.createElement("div", {
+  }, caption && ( /*#__PURE__*/React.createElement("div", {
     className: styles$A.caption,
     dangerouslySetInnerHTML: {
       __html: caption
     }
-  })), credit && (/*#__PURE__*/React.createElement("div", {
+  })), credit && ( /*#__PURE__*/React.createElement("div", {
     className: styles$A.credit,
     dangerouslySetInnerHTML: {
       __html: credit
@@ -863,14 +865,14 @@ const Table = ({
     return /*#__PURE__*/React.createElement("div", {
       key: row.key,
       className: styles$z.row
-    }, row.cells.map((cell, j) => (/*#__PURE__*/React.createElement("div", {
+    }, row.cells.map((cell, j) => ( /*#__PURE__*/React.createElement("div", {
       key: cell.key,
       className: makeClassName([[styles$z.cell, true], [styles$z.header, options.header && i === 0], [styles$z[colors[cell.color]], true], [styles$z[columnsWidth[j]], true], [styles$z.fixedColumn, options.fixed_first_column && j === 0]]),
       dangerouslySetInnerHTML: {
         __html: cell.val
       }
     }))));
-  })))), tableCredit && (/*#__PURE__*/React.createElement(MediaCaption, {
+  })))), tableCredit && ( /*#__PURE__*/React.createElement(MediaCaption, {
     credit: tableCredit,
     styleContext: styleContext
   })));
@@ -891,7 +893,7 @@ const MaterialNote = ({
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     "data-testid": "material-note",
     className: makeClassName(classNames)
-  }, data && data.map(item => (/*#__PURE__*/React.createElement("p", {
+  }, data && data.map(item => ( /*#__PURE__*/React.createElement("p", {
     className: styles$y[item.type],
     key: item.id,
     dangerouslySetInnerHTML: {
@@ -975,7 +977,7 @@ const Dropdown = ({
   }, children);
 };
 
-var styles$u = {"root":"Toolbar-module_root__RnmlI","list":"Toolbar-module_list__-IhdP","item":"Toolbar-module_item__CWmGM","isInTopbar":"Toolbar-module_isInTopbar__WEDi8","center":"Toolbar-module_center__pvdiJ","game":"Toolbar-module_game__etwIA","gameSurvey":"Toolbar-module_gameSurvey__v4D31","slide":"Toolbar-module_slide__PtB3l","card":"Toolbar-module_card__Lutyq","isDark":"Toolbar-module_isDark__MG6Ar","dark":"Toolbar-module_dark__a9sgz","podcast":"Toolbar-module_podcast__ahY4M"};
+var styles$u = {"root":"Toolbar-module_root__RnmlI","list":"Toolbar-module_list__-IhdP","item":"Toolbar-module_item__CWmGM","isInTopbar":"Toolbar-module_isInTopbar__WEDi8","center":"Toolbar-module_center__pvdiJ","game":"Toolbar-module_game__etwIA","gameSurvey":"Toolbar-module_gameSurvey__v4D31","slide":"Toolbar-module_slide__PtB3l","card":"Toolbar-module_card__Lutyq","isDark":"Toolbar-module_isDark__MG6Ar","dark":"Toolbar-module_dark__a9sgz"};
 
 const ToolbarItem = ({
   children
@@ -1186,7 +1188,7 @@ const EmbedBlock = ({
   const isProportional = block.data.height && block.data.width;
   const fullWidthProviders = ['youtube', 'vimeo', 'onetv', 'coub', 'meduza', 'facebook_video'];
   const mobileFullwidth = fullWidthProviders.indexOf(provider) > -1 || block.type === 'dots_on_image';
-  const renderCC = context => (/*#__PURE__*/React.createElement(MediaCaption, {
+  const renderCC = context => ( /*#__PURE__*/React.createElement(MediaCaption, {
     credit: data.credit,
     caption: data.caption,
     styleContext: context || styleContext
@@ -1264,21 +1266,21 @@ const EmbedBlock = ({
   }
   return /*#__PURE__*/React.createElement("figure", {
     className: makeClassName(classNames)
-  }, children && (/*#__PURE__*/React.createElement("div", {
+  }, children && ( /*#__PURE__*/React.createElement("div", {
     className: styles$r.object
   }, /*#__PURE__*/React.createElement("div", {
     className: makeClassName([[styles$r.wrapper, true], [styles$r.isProportional, isProportional]]),
     style: style
   }, /*#__PURE__*/React.createElement("div", {
     className: styles$r.objectWrap
-  }, children)))), !children && renderEmbed(style), cc === 'default' && /*#__PURE__*/React.createElement("figcaption", null, renderCC()), cc === 'button' && (/*#__PURE__*/React.createElement("button", {
+  }, children)))), !children && renderEmbed(style), cc === 'default' && /*#__PURE__*/React.createElement("figcaption", null, renderCC()), cc === 'button' && ( /*#__PURE__*/React.createElement("button", {
     className: styles$r.control,
     type: "button",
     "aria-label": "Open",
     onClick: () => {
       setIsPopoverShown(!isPopoverShown);
     }
-  })), cc === 'button' && isPopoverShown && (/*#__PURE__*/React.createElement(Popover, {
+  })), cc === 'button' && isPopoverShown && ( /*#__PURE__*/React.createElement(Popover, {
     onClose: () => {
       setIsPopoverShown(false);
     }
@@ -1562,7 +1564,7 @@ const ListBlock = ({
   return /*#__PURE__*/React.createElement(TagName, {
     className: makeClassName(classNames),
     "data-testid": "list-block"
-  }, data.map((item, index) => (/*#__PURE__*/React.createElement("li", {
+  }, data.map((item, index) => ( /*#__PURE__*/React.createElement("li", {
     key: index,
     dangerouslySetInnerHTML: {
       __html: item
@@ -1593,7 +1595,7 @@ const RelatedBlock = ({
     className: styles$j.header
   }, title), /*#__PURE__*/React.createElement("ul", {
     className: styles$j.items
-  }, related.map((item, index) => (/*#__PURE__*/React.createElement("li", {
+  }, related.map((item, index) => ( /*#__PURE__*/React.createElement("li", {
     key: item.id || index,
     className: styles$j[item.layout]
   }, /*#__PURE__*/React.createElement(reactRouterDom.Link, {
@@ -1629,7 +1631,7 @@ const SourceBlock = ({
     href: url,
     target: "_blank",
     rel: "noopener noreferrer"
-  }, quote.map((item, index) => (/*#__PURE__*/React.createElement("p", {
+  }, quote.map((item, index) => ( /*#__PURE__*/React.createElement("p", {
     key: index,
     dangerouslySetInnerHTML: {
       __html: item.data
@@ -1694,7 +1696,7 @@ const SensitiveBlock = ({
   }, /*#__PURE__*/React.createElement(EmbedBlockContainer, {
     block: block.item,
     styleContext: context
-  }))), cc && (/*#__PURE__*/React.createElement("figcaption", {
+  }))), cc && ( /*#__PURE__*/React.createElement("figcaption", {
     className: styles$h.figcaption
   }, /*#__PURE__*/React.createElement(MediaCaption, {
     credit: credit,
@@ -1736,14 +1738,14 @@ const GroupedBlock = ({
       style: {
         width: `${percentWidth}%`
       }
-    }, item.type === 'sensitive' ? (/*#__PURE__*/React.createElement(SensitiveBlock, {
+    }, item.type === 'sensitive' ? ( /*#__PURE__*/React.createElement(SensitiveBlock, {
       block: item,
       styleContext: ['isInGroupedBlock']
-    })) : (/*#__PURE__*/React.createElement(EmbedBlockContainer, {
+    })) : ( /*#__PURE__*/React.createElement(EmbedBlockContainer, {
       block: item,
       styleContext: ['isInGroupedBlock']
     })));
-  })), block.cc && (/*#__PURE__*/React.createElement("figcaption", {
+  })), block.cc && ( /*#__PURE__*/React.createElement("figcaption", {
     className: styles$g.figcaption
   }, /*#__PURE__*/React.createElement(MediaCaption, {
     credit: block.credit,
@@ -1879,7 +1881,7 @@ const MetaContainer = ({
             hasSource: hasSource,
             bullets: true,
             key: component.id
-          }, /*#__PURE__*/React.createElement(React.Fragment, null, lang === 'ru' ? 'Источник: ' : 'Source: ', component.url && (/*#__PURE__*/React.createElement("a", {
+          }, /*#__PURE__*/React.createElement(React.Fragment, null, lang === 'ru' ? 'Источник: ' : 'Source: ', component.url && ( /*#__PURE__*/React.createElement("a", {
             href: component.url,
             rel: "noopener noreferrer",
             target: "_blank"
@@ -1891,7 +1893,7 @@ const MetaContainer = ({
             hasSource: hasSource,
             bullets: true,
             key: component.id
-          }, /*#__PURE__*/React.createElement(React.Fragment, null, styleContext !== 'isInDynamicBlock' && (/*#__PURE__*/React.createElement(SvgSymbol, {
+          }, /*#__PURE__*/React.createElement(React.Fragment, null, styleContext !== 'isInDynamicBlock' && ( /*#__PURE__*/React.createElement(SvgSymbol, {
             icon: "podcast",
             size: "small"
           })), component.text));
@@ -1954,14 +1956,14 @@ const MetaContainer = ({
           return null;
         }
     }
-  }), (isRead || isListened) && (/*#__PURE__*/React.createElement(MetaItem, {
+  }), (isRead || isListened) && ( /*#__PURE__*/React.createElement(MetaItem, {
     hasSource: hasSource,
     bullets: true,
     type: isListened ? 'listened' : 'read'
   }, /*#__PURE__*/React.createElement(SvgSymbol, {
     icon: isListened ? 'listened' : 'read',
     size: "unset"
-  }))), isSlides && lang === 'ru' && (/*#__PURE__*/React.createElement("div", {
+  }))), isSlides && lang === 'ru' && ( /*#__PURE__*/React.createElement("div", {
     className: styles$t.bookmark
   }, /*#__PURE__*/React.createElement(BookmarkButton, {
     isInBookmarks: isInBookmarks,
@@ -2086,7 +2088,7 @@ const VersesBlock = ({
   return /*#__PURE__*/React.createElement("ul", {
     className: makeClassName(classNames),
     "data-testid": "verses-block"
-  }, data.map((item, index) => (/*#__PURE__*/React.createElement("li", {
+  }, data.map((item, index) => ( /*#__PURE__*/React.createElement("li", {
     key: index,
     dangerouslySetInnerHTML: {
       __html: item
@@ -2287,7 +2289,7 @@ const Cover = ({
     classNames = makeStyleContext(classNames, theme, styles$9);
     style.backgroundImage = generateGradient(gradients.bg_rgb, 'mediaBlockBottom');
   }
-  const renderCC = context => (/*#__PURE__*/React.createElement(MediaCaption, {
+  const renderCC = context => ( /*#__PURE__*/React.createElement(MediaCaption, {
     credit: credit,
     caption: caption,
     styleContext: context || styleContext
@@ -2304,18 +2306,18 @@ const Cover = ({
   })), /*#__PURE__*/React.createElement("div", {
     className: styles$9.body,
     style: style
-  }, blocks.map(item => (/*#__PURE__*/React.createElement(RenderBlocks, {
+  }, blocks.map(item => ( /*#__PURE__*/React.createElement(RenderBlocks, {
     key: item.id,
     block: item,
     styleContext: styleContext
-  })))), cc === 'button' && (/*#__PURE__*/React.createElement("button", {
+  })))), cc === 'button' && ( /*#__PURE__*/React.createElement("button", {
     className: styles$9.control,
     type: "button",
     "aria-label": "Open",
     onClick: () => {
       setIsPopoverShown(!isPopoverShown);
     }
-  })), cc === 'button' && isPopoverShown && (/*#__PURE__*/React.createElement(Popover, {
+  })), cc === 'button' && isPopoverShown && ( /*#__PURE__*/React.createElement(Popover, {
     onClose: () => {
       setIsPopoverShown(false);
     }
@@ -2356,7 +2358,7 @@ const HalfBlock = ({
     display: "super_full"
   })), /*#__PURE__*/React.createElement("div", {
     className: styles$8.body
-  }, data.blocks.map(item => (/*#__PURE__*/React.createElement(RenderBlocks, {
+  }, data.blocks.map(item => ( /*#__PURE__*/React.createElement(RenderBlocks, {
     key: item.id,
     block: item,
     styleContext: ['rich']
@@ -2385,7 +2387,7 @@ const ImportantLead = ({
   return /*#__PURE__*/React.createElement("div", {
     "data-testid": "important-lead",
     className: makeClassName(classNames)
-  }, data.map(item => (/*#__PURE__*/React.createElement(RenderBlocks, {
+  }, data.map(item => ( /*#__PURE__*/React.createElement(RenderBlocks, {
     key: item.id,
     block: item,
     styleContext: "isInImportantLead"
@@ -2437,7 +2439,7 @@ const Spoiler = ({
     className: styles$6.header
   }, title && /*#__PURE__*/React.createElement("h3", null, title)), /*#__PURE__*/React.createElement("div", {
     className: styles$6.body
-  }, blocks.map(item => (/*#__PURE__*/React.createElement(RenderBlocks, {
+  }, blocks.map(item => ( /*#__PURE__*/React.createElement(RenderBlocks, {
     key: item.id,
     block: item,
     styleContext: context
@@ -2510,7 +2512,7 @@ const RelatedRichBlock = ({
     to: `/${url}`,
     onClick: () => handleClick(),
     ref: ref
-  }, layout === 'rich' && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+  }, layout === 'rich' && ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: styles$5.overlay,
     style: style
   }), /*#__PURE__*/React.createElement("div", {
@@ -2532,7 +2534,7 @@ const RelatedRichBlock = ({
     display: "narrow"
   }))), /*#__PURE__*/React.createElement("div", {
     className: styles$5.body
-  }, blocks.map(item => (/*#__PURE__*/React.createElement(RenderBlocks, {
+  }, blocks.map(item => ( /*#__PURE__*/React.createElement(RenderBlocks, {
     key: item.id,
     block: item,
     styleContext: context
@@ -2595,7 +2597,7 @@ const ShopRelatedBlock = ({
     target: "_blank",
     onClick: () => handleClick(),
     ref: ref
-  }, layout === 'rich' && (/*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+  }, layout === 'rich' && ( /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: styles$4.overlay,
     style: style
   }), /*#__PURE__*/React.createElement("div", {
@@ -2660,7 +2662,7 @@ const RelatedBook = ({
     className: styles$3.contentWrap
   }, /*#__PURE__*/React.createElement("div", {
     className: styles$3.content
-  }, block.data.blocks.map(item => (/*#__PURE__*/React.createElement(RenderBlocks, {
+  }, block.data.blocks.map(item => ( /*#__PURE__*/React.createElement(RenderBlocks, {
     key: item.id,
     block: item,
     styleContext: ['isInMediaBlock', 'isInBookRelated', 'isCustom']
@@ -2751,12 +2753,11 @@ const RawHtmlBlock = ({
 
 var styles$2 = {"root":"ListViewSwitcher-module_root__pBsR5","input":"ListViewSwitcher-module_input__vtDVD","knob":"ListViewSwitcher-module_knob__g-OZ2","sm":"ListViewSwitcher-module_sm__y1teD","md":"ListViewSwitcher-module_md__0M8KR","grid":"ListViewSwitcher-module_grid__qBmnM","list":"ListViewSwitcher-module_list__NORMp"};
 
-/* eslint-disable jsx-a11y/label-has-associated-control */
 const ListViewSwitcher = ({
   enabled,
   onChange,
   size = 'md'
-}) => (/*#__PURE__*/React.createElement("label", {
+}) => ( /*#__PURE__*/React.createElement("label", {
   "data-testid": "listViewSwitcher",
   className: makeClassName([[styles$2.root, true], [styles$2[size], true]])
 }, /*#__PURE__*/React.createElement("input", {
@@ -2790,7 +2791,7 @@ const ToolbarButton = ({
     className: makeClassName(classNames),
     type: "button",
     onClick: event => onClick(event, type)
-  }, icon && (/*#__PURE__*/React.createElement("div", {
+  }, icon && ( /*#__PURE__*/React.createElement("div", {
     className: styles$1.icon
   }, /*#__PURE__*/React.createElement(SvgSymbol, {
     size: "medium",