npm - @gravity-ui/page-constructor - Versions diffs - 6.6.1 → 7.0.0-alpha.1 - Mend

@gravity-ui/page-constructor 6.6.1 → 7.0.0-alpha.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (367) hide show

package/README.md CHANGED Viewed

@@ -146,6 +146,10 @@ const post = {
 You can find more utilities in this [section](https://github.com/gravity-ui/page-constructor/tree/main/src/text-transform)
+### Detailed Documentation on Server Utilities and Transformers
+For a comprehensive guide on using server utilities, including detailed explanations and advanced use cases, visit the [additional chapter on server utils usage](./docs/data-preparation.md).
 ### Custom blocks
 The page constructor lets you use blocks that are user-defined in their app. Blocks are regular React components.
@@ -166,6 +170,12 @@ To use mixins and constructor style variables when creating custom blocks, add i
 @import '~@gravity-ui/page-constructor/styles/styles.scss';
 ```
+To use default font, add import in your file:
+```css
+@import '~@gravity-ui/page-constructor/styles/fonts.scss';
+```
 ### Loadable blocks
 It's sometimes necessary that a block renders itself based on data to be loaded. In this case, loadable blocks are used.

package/build/cjs/blocks/ExtendedFeatures/ExtendedFeatures.css CHANGED Viewed

@@ -1,4 +1,4 @@
-.pc-ExtendedFeaturesBlock__item-title {
+.pc-ExtendedFeaturesBlock__item-title.pc-ExtendedFeaturesBlock__item-title {
   margin: 0;
 }
@@ -16,28 +16,33 @@ unpredictable css rules order in build */
 .pc-ExtendedFeaturesBlock__item.col {
   padding-right: 32px;
 }
-.pc-ExtendedFeaturesBlock__item-title {
+.pc-ExtendedFeaturesBlock__item-title-container {
+  margin: inherit;
+  display: block;
+  margin-block: 0 8px;
+}
+.pc-ExtendedFeaturesBlock__item-title.pc-ExtendedFeaturesBlock__item-title {
   font-size: var(--g-text-header-1-font-size);
   line-height: var(--g-text-header-1-line-height);
   color: var(--pc-text-header-color);
   font-weight: var(--g-text-accent-font-weight);
-  display: block;
   position: relative;
   margin-bottom: 8px;
 }
-.pc-ExtendedFeaturesBlock__item-title a {
+.pc-ExtendedFeaturesBlock__item-title.pc-ExtendedFeaturesBlock__item-title a {
   outline: none;
   color: var(--g-color-text-link);
   text-decoration: none;
   cursor: pointer;
 }
-.utilityfocus .pc-ExtendedFeaturesBlock__item-title a:focus {
+.utilityfocus .pc-ExtendedFeaturesBlock__item-title.pc-ExtendedFeaturesBlock__item-title a:focus {
   outline: 2px solid #ffdb4d;
 }
-.pc-ExtendedFeaturesBlock__item-title a:hover, .pc-ExtendedFeaturesBlock__item-title a:active {
+.pc-ExtendedFeaturesBlock__item-title.pc-ExtendedFeaturesBlock__item-title a:hover, .pc-ExtendedFeaturesBlock__item-title.pc-ExtendedFeaturesBlock__item-title a:active {
   --pc-text-header-color: var(--g-color-text-link-hover);
   color: var(--g-color-text-link-hover);
 }
 .pc-ExtendedFeaturesBlock__item-label {
   font-size: var(--g-text-caption-2-font-size);
   line-height: var(--g-text-caption-2-line-height);

package/build/cjs/blocks/ExtendedFeatures/ExtendedFeatures.js CHANGED Viewed

@@ -3,7 +3,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.ExtendedFeaturesBlock = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
-const React = tslib_1.__importStar(require("react"));
 const components_1 = require("../../components/index.js");
 const Image_1 = tslib_1.__importDefault(require("../../components/Image/Image.js"));
 const utils_1 = require("../../components/Media/Image/utils.js");
@@ -27,10 +26,9 @@ const ExtendedFeaturesBlock = ({ title, description, items, colSizes = DEFAULT_S
                         if (link) {
                             itemLinks.push(link);
                         }
-                        return ((0, jsx_runtime_1.jsxs)(grid_1.Col, { className: b('item'), sizes: colSizes, children: [iconData && ((0, jsx_runtime_1.jsx)("div", { className: b('icon-wrap'), "aria-hidden": true, children: (0, jsx_runtime_1.jsx)(Image_1.default, { ...iconData, className: b('icon') }) })), (0, jsx_runtime_1.jsxs)("div", { className: b('container'), children: [itemTitle &&
-                                            React.createElement(itemTitleHeadingTag, {
-                                                className: b('item-title'),
-                                            }, (0, jsx_runtime_1.jsxs)(React.Fragment, { children: [(0, jsx_runtime_1.jsx)(components_1.HTML, { children: itemTitle }), label && ((0, jsx_runtime_1.jsx)("span", { className: b('item-label'), children: label }))] })), (0, jsx_runtime_1.jsx)(sub_blocks_1.Content, { text: text, links: itemLinks, size: "s", list: list, colSizes: { all: 12, md: 12 }, buttons: buttons, additionalInfo: additionalInfo })] })] }, text || itemTitle));
+                        return ((0, jsx_runtime_1.jsxs)(grid_1.Col, { className: b('item'), sizes: colSizes, children: [iconData && ((0, jsx_runtime_1.jsx)("div", { className: b('icon-wrap'), "aria-hidden": true, children: (0, jsx_runtime_1.jsx)(Image_1.default, { ...iconData, className: b('icon') }) })), (0, jsx_runtime_1.jsxs)("div", { className: b('container'), children: [itemTitle && ((0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { tagName: itemTitleHeadingTag, content: itemTitle, className: b('item-title-container'), contentClassName: b('item-title'), modifiers: {
+                                                constructor: true,
+                                            }, children: label && ((0, jsx_runtime_1.jsx)("span", { className: b('item-label'), children: label })) })), (0, jsx_runtime_1.jsx)(sub_blocks_1.Content, { text: text, links: itemLinks, size: "s", list: list, colSizes: { all: 12, md: 12 }, buttons: buttons, additionalInfo: additionalInfo })] })] }, text || itemTitle));
                     }) }) })] }));
 };
 exports.ExtendedFeaturesBlock = ExtendedFeaturesBlock;

package/build/cjs/blocks/ExtendedFeatures/ExtendedFeatures.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ExtendedFeatures.js","sourceRoot":"../../../../src","sources":["blocks/ExtendedFeatures/ExtendedFeatures.tsx"],"names":[],"mappings":";;;;;AAAA,~~qDAA+B~~;~~AAE/B~~,~~0DAA4D;AAC5D,~~oFAAiD;AACjD,iEAAiE;AACjE,wDAA6C;AAC7C,8CAAoC;AAEpC,0DAAyC;AACzC,gDAAkD;AAIlD,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,uBAAuB,CAAC,CAAC;AAEzC,MAAM,aAAa,GAAG;IAClB,GAAG,EAAE,EAAE;IACP,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;CACR,CAAC;AAEK,MAAM,qBAAqB,GAAG,CAAC,EAClC,KAAK,EACL,WAAW,EACX,KAAK,EACL,QAAQ,GAAG,aAAa,EACxB,QAAQ,GACY,EAAE,EAAE;IACxB,MAAM,KAAK,GAAG,IAAA,gBAAQ,GAAE,CAAC;IACzB,MAAM,mBAAmB,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;IAEhD,OAAO,CACH,wBAAC,yBAAY,IAAC,SAAS,EAAE,CAAC,EAAE,EAAE,OAAO,EAAE,QAAQ,aAC3C,uBAAC,kBAAK,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,GAAI,EACtE,gCAAK,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YACtB,uBAAC,UAAG,cACC,KAAK,CAAC,GAAG,CACN,CAAC,EACG,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,KAAK,EACL,IAAI,EACJ,OAAO,EACP,cAAc,GACjB,EAAE,EAAE;wBACD,MAAM,SAAS,GAAG,KAAK,IAAI,EAAE,CAAC;wBAE9B,MAAM,UAAU,GAAG,IAAI,IAAI,IAAA,sBAAc,EAAC,IAAI,EAAE,KAAK,CAAC,CAAC;wBACvD,MAAM,QAAQ,GAAG,UAAU,IAAI,IAAA,qBAAa,EAAC,UAAU,CAAC,CAAC;wBAEzD,IAAI,IAAI,EAAE,CAAC;4BACP,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;wBACzB,CAAC;wBAED,OAAO,CACH,wBAAC,UAAG,IAAC,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAA0B,KAAK,EAAE,QAAQ,aAC7D,QAAQ,IAAI,CACT,gCAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,iCAC1B,uBAAC,eAAK,OAAK,QAAQ,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,GAAI,GAC3C,CACT,EACD,iCAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,aACzB,SAAS~~;4CACN~~,~~KAAK~~,~~CAAC~~,~~aAAa~~,~~CACf~~,mBAAmB,~~EACnB;gDACI~~,SAAS,EAAE,CAAC,CAAC,~~YAAY~~,CAAC~~;6CAC7B~~,~~EACD~~,~~wBAAC~~,~~KAAK~~,CAAC,~~QAAQ~~,~~eACX~~,~~uBAAC~~,~~iBAAI~~,~~cAAE,~~SAAS,~~GAAQ~~,~~EACvB~~,KAAK,IAAI,CACN,iCAAM,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,~~YAC3B~~,KAAK,~~GACH~~,~~CACV~~,~~IACY~~,~~CACpB~~,~~EACL~~,uBAAC,oBAAO,IACJ,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,SAAS,EAChB,IAAI,EAAC,GAAG,EACR,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAC,EAC3B,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,GAChC,IACA,KA/BsB,IAAI,IAAI,SAAS,CAgC3C,CACT,CAAC;oBACN,CAAC,CACJ,GACC,GACJ,IACK,CAClB,CAAC;AACN,CAAC,CAAC;AA7EW,QAAA,qBAAqB,yBA6EhC;AAEF,kBAAe,6BAAqB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {AnimateBlock, ~~HTML~~, ~~Title~~} from '../../components/';\nimport Image from '../../components/Image/Image';\nimport {getMediaImage} from '../../components/Media/Image/utils';\nimport {useTheme} from '../../context/theme';\nimport {Col, Row} from '../../grid';\nimport {ExtendedFeaturesProps} from '../../models';\nimport {Content} from '../../sub-blocks';\nimport {block, getThemedValue} from '../../utils';\n\nimport './ExtendedFeatures.scss';\n\nconst b = block('ExtendedFeaturesBlock');\n\nconst DEFAULT_SIZES = {\n all: 12,\n sm: 6,\n md: 4,\n};\n\nexport const ExtendedFeaturesBlock = ({\n title,\n description,\n items,\n colSizes = DEFAULT_SIZES,\n animated,\n}: ExtendedFeaturesProps) => {\n const theme = useTheme();\n const itemTitleHeadingTag = title ? 'h3' : 'h2';\n\n return (\n <AnimateBlock className={b()} animate={animated}>\n <Title title={title} subtitle={description} className={b('header')} />\n <div className={b('items')}>\n <Row>\n {items.map(\n ({\n title: itemTitle,\n text,\n list,\n link,\n links,\n label,\n icon,\n buttons,\n additionalInfo,\n }) => {\n const itemLinks = links \|\| [];\n\n const iconThemed = icon && getThemedValue(icon, theme);\n const iconData = iconThemed && getMediaImage(iconThemed);\n\n if (link) {\n itemLinks.push(link);\n }\n\n return (\n <Col className={b('item')} key={text \|\| itemTitle} sizes={colSizes}>\n {iconData && (\n <div className={b('icon-wrap')} aria-hidden>\n <Image {...iconData} className={b('icon')} />\n </div>\n )}\n <div className={b('container')}>\n {itemTitle ~~&&\~~n ~~React.createElement(~~\n itemTitleHeadingTag,\n {\n className: b('item-title'),\n },\n ~~<React.Fragment>\~~n ~~<HTML>{itemTitle~~}~~</HTML~~>\n {label && (\n <span className={b('item-label')}~~>\n~~ {label}\n </span>\n )}\n </~~React.Fragment>,\~~n )}\n <Content\n text={text}\n links={itemLinks}\n size=\"s\"\n list={list}\n colSizes={{all: 12, md: 12}}\n buttons={buttons}\n additionalInfo={additionalInfo}\n />\n </div>\n </Col>\n );\n },\n )}\n </Row>\n </div>\n </AnimateBlock>\n );\n};\n\nexport default ExtendedFeaturesBlock;\n"]}
1	+ {"version":3,"file":"ExtendedFeatures.js","sourceRoot":"../../../../src","sources":["blocks/ExtendedFeatures/ExtendedFeatures.tsx"],"names":[],"mappings":";;;;;AAAA,0DAAkE;AAClE,oFAAiD;AACjD,iEAAiE;AACjE,wDAA6C;AAC7C,8CAAoC;AAEpC,0DAAyC;AACzC,gDAAkD;AAIlD,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,uBAAuB,CAAC,CAAC;AAEzC,MAAM,aAAa,GAAG;IAClB,GAAG,EAAE,EAAE;IACP,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,CAAC;CACR,CAAC;AAEK,MAAM,qBAAqB,GAAG,CAAC,EAClC,KAAK,EACL,WAAW,EACX,KAAK,EACL,QAAQ,GAAG,aAAa,EACxB,QAAQ,GACY,EAAE,EAAE;IACxB,MAAM,KAAK,GAAG,IAAA,gBAAQ,GAAE,CAAC;IACzB,MAAM,mBAAmB,GAAG,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;IAEhD,OAAO,CACH,wBAAC,yBAAY,IAAC,SAAS,EAAE,CAAC,EAAE,EAAE,OAAO,EAAE,QAAQ,aAC3C,uBAAC,kBAAK,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,WAAW,EAAE,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,GAAI,EACtE,gCAAK,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YACtB,uBAAC,UAAG,cACC,KAAK,CAAC,GAAG,CACN,CAAC,EACG,KAAK,EAAE,SAAS,EAChB,IAAI,EACJ,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,KAAK,EACL,IAAI,EACJ,OAAO,EACP,cAAc,GACjB,EAAE,EAAE;wBACD,MAAM,SAAS,GAAG,KAAK,IAAI,EAAE,CAAC;wBAE9B,MAAM,UAAU,GAAG,IAAI,IAAI,IAAA,sBAAc,EAAC,IAAI,EAAE,KAAK,CAAC,CAAC;wBACvD,MAAM,QAAQ,GAAG,UAAU,IAAI,IAAA,qBAAa,EAAC,UAAU,CAAC,CAAC;wBAEzD,IAAI,IAAI,EAAE,CAAC;4BACP,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;wBACzB,CAAC;wBAED,OAAO,CACH,wBAAC,UAAG,IAAC,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EAA0B,KAAK,EAAE,QAAQ,aAC7D,QAAQ,IAAI,CACT,gCAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,iCAC1B,uBAAC,eAAK,OAAK,QAAQ,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,GAAI,GAC3C,CACT,EACD,iCAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,aACzB,SAAS,IAAI,CACV,uBAAC,uBAAU,IACP,OAAO,EAAE,mBAAmB,EAC5B,OAAO,EAAE,SAAS,EAClB,SAAS,EAAE,CAAC,CAAC,sBAAsB,CAAC,EACpC,gBAAgB,EAAE,CAAC,CAAC,YAAY,CAAC,EACjC,SAAS,EAAE;gDACP,WAAW,EAAE,IAAI;6CACpB,YAEA,KAAK,IAAI,CACN,iCAAM,SAAS,EAAE,CAAC,CAAC,YAAY,CAAC,YAAG,KAAK,GAAQ,CACnD,GACQ,CAChB,EACD,uBAAC,oBAAO,IACJ,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,SAAS,EAChB,IAAI,EAAC,GAAG,EACR,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,EAAC,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAC,EAC3B,OAAO,EAAE,OAAO,EAChB,cAAc,EAAE,cAAc,GAChC,IACA,KA/BsB,IAAI,IAAI,SAAS,CAgC3C,CACT,CAAC;oBACN,CAAC,CACJ,GACC,GACJ,IACK,CAClB,CAAC;AACN,CAAC,CAAC;AA7EW,QAAA,qBAAqB,yBA6EhC;AAEF,kBAAe,6BAAqB,CAAC","sourcesContent":["import {AnimateBlock, Title, YFMWrapper} from '../../components/';\nimport Image from '../../components/Image/Image';\nimport {getMediaImage} from '../../components/Media/Image/utils';\nimport {useTheme} from '../../context/theme';\nimport {Col, Row} from '../../grid';\nimport {ExtendedFeaturesProps} from '../../models';\nimport {Content} from '../../sub-blocks';\nimport {block, getThemedValue} from '../../utils';\n\nimport './ExtendedFeatures.scss';\n\nconst b = block('ExtendedFeaturesBlock');\n\nconst DEFAULT_SIZES = {\n all: 12,\n sm: 6,\n md: 4,\n};\n\nexport const ExtendedFeaturesBlock = ({\n title,\n description,\n items,\n colSizes = DEFAULT_SIZES,\n animated,\n}: ExtendedFeaturesProps) => {\n const theme = useTheme();\n const itemTitleHeadingTag = title ? 'h3' : 'h2';\n\n return (\n <AnimateBlock className={b()} animate={animated}>\n <Title title={title} subtitle={description} className={b('header')} />\n <div className={b('items')}>\n <Row>\n {items.map(\n ({\n title: itemTitle,\n text,\n list,\n link,\n links,\n label,\n icon,\n buttons,\n additionalInfo,\n }) => {\n const itemLinks = links \|\| [];\n\n const iconThemed = icon && getThemedValue(icon, theme);\n const iconData = iconThemed && getMediaImage(iconThemed);\n\n if (link) {\n itemLinks.push(link);\n }\n\n return (\n <Col className={b('item')} key={text \|\| itemTitle} sizes={colSizes}>\n {iconData && (\n <div className={b('icon-wrap')} aria-hidden>\n <Image {...iconData} className={b('icon')} />\n </div>\n )}\n <div className={b('container')}>\n {itemTitle && (\n <YFMWrapper\n tagName={itemTitleHeadingTag}\n content={itemTitle}\n className={b('item-title-container')}\n contentClassName={b('item-title')}\n modifiers={{\n constructor: true,\n }}\n >\n {label && (\n <span className={b('item-label')}>{label}</span>\n )}\n </YFMWrapper>\n )}\n <Content\n text={text}\n links={itemLinks}\n size=\"s\"\n list={list}\n colSizes={{all: 12, md: 12}}\n buttons={buttons}\n additionalInfo={additionalInfo}\n />\n </div>\n </Col>\n );\n },\n )}\n </Row>\n </div>\n </AnimateBlock>\n );\n};\n\nexport default ExtendedFeaturesBlock;\n"]}

package/build/cjs/blocks/Header/Header.css CHANGED Viewed

@@ -1,4 +1,4 @@
-.pc-header-block__title {
+.pc-header-block__title.pc-header-block__title {
   margin: 0;
 }
@@ -20,16 +20,17 @@ unpredictable css rules order in build */
   position: relative;
   height: 100%;
 }
-.pc-header-block__content_theme_dark {
+.pc-header-block__content_theme_dark.pc-header-block__content_theme_dark {
   --g-color-line-focus: var(--pc-color-line-focus-dark);
 }
-.pc-header-block__content_theme_dark .pc-header-block__title,
-.pc-header-block__content_theme_dark .pc-header-block__overtitle {
+.pc-header-block__content_theme_dark.pc-header-block__content_theme_dark .pc-header-block__title,
+.pc-header-block__content_theme_dark.pc-header-block__content_theme_dark .pc-header-block__overtitle {
   color: var(--g-color-text-light-primary);
 }
-.pc-header-block__content_theme_dark .pc-header-block__description .yfm {
+.pc-header-block__content_theme_dark.pc-header-block__content_theme_dark .pc-header-block__description .yfm {
   color: var(--g-color-text-light-primary);
 }
 .pc-header-block__content_vertical-offset {
   margin: 16px 0;
 }
@@ -56,7 +57,7 @@ unpredictable css rules order in build */
   margin-inline: auto;
   text-align: center;
 }
-.pc-header-block__title {
+.pc-header-block__title.pc-header-block__title {
   font-size: var(--g-text-display-4-font-size);
   line-height: var(--g-text-display-4-line-height);
   color: var(--pc-text-header-color);
@@ -64,24 +65,28 @@ unpredictable css rules order in build */
   position: relative;
 }
 @media (max-width: 577px) {
-  .pc-header-block__title {
+  .pc-header-block__title.pc-header-block__title {
     font-size: var(--g-text-display-2-font-size);
     line-height: var(--g-text-display-2-line-height);
   }
 }
-.pc-header-block__title a {
+.pc-header-block__title.pc-header-block__title a {
   outline: none;
   color: var(--g-color-text-link);
   text-decoration: none;
   cursor: pointer;
 }
-.utilityfocus .pc-header-block__title a:focus {
+.utilityfocus .pc-header-block__title.pc-header-block__title a:focus {
   outline: 2px solid #ffdb4d;
 }
-.pc-header-block__title a:hover, .pc-header-block__title a:active {
+.pc-header-block__title.pc-header-block__title a:hover, .pc-header-block__title.pc-header-block__title a:active {
   --pc-text-header-color: var(--g-color-text-link-hover);
   color: var(--g-color-text-link-hover);
 }
+.pc-header-block__title-container {
+  margin: 0;
+}
 .pc-header-block__description {
   margin-top: 16px;
 }

package/build/cjs/blocks/Header/Header.js CHANGED Viewed

@@ -53,7 +53,12 @@ const HeaderBlock = (props) => {
                                             offset,
                                             theme: textTheme,
                                             'vertical-offset': curVerticalOffset,
-                                        }), children: (0, jsx_runtime_1.jsxs)(grid_1.Col, { sizes: titleSizes, className: b('content-inner', { centered }), children: [overtitle && ((0, jsx_runtime_1.jsx)("div", { className: b('overtitle'), children: typeof overtitle === 'string' ? ((0, jsx_runtime_1.jsx)(components_1.HTML, { children: overtitle })) : (overtitle) })), (0, jsx_runtime_1.jsxs)("h1", { className: b('title'), id: titleId, children: [status, renderTitle ? renderTitle(title) : (0, jsx_runtime_1.jsx)(components_1.HTML, { children: title })] }), description && ((0, jsx_runtime_1.jsx)("div", { className: b('description', { theme: textTheme }), children: (0, jsx_runtime_1.jsx)(YFMWrapper_1.default, { content: description, modifiers: {
+                                        }), children: (0, jsx_runtime_1.jsxs)(grid_1.Col, { sizes: titleSizes, className: b('content-inner', { centered }), children: [overtitle && ((0, jsx_runtime_1.jsx)("div", { className: b('overtitle'), children: typeof overtitle === 'string' ? ((0, jsx_runtime_1.jsx)(YFMWrapper_1.default, { tagName: "div", className: b('overtitle'), content: overtitle, modifiers: {
+                                                            constructor: true,
+                                                        } })) : (overtitle) })), (0, jsx_runtime_1.jsxs)(YFMWrapper_1.default, { content: title, contentClassName: b('title'), className: b('title-container'), modifiers: {
+                                                        constructor: true,
+                                                        constructorTheme: textTheme,
+                                                    }, tagName: "h1", contentPosition: "end", children: [status, renderTitle ? renderTitle(title) : null] }), description && ((0, jsx_runtime_1.jsx)("div", { className: b('description', { theme: textTheme }), children: (0, jsx_runtime_1.jsx)(YFMWrapper_1.default, { content: description, modifiers: {
                                                             constructor: true,
                                                             constructorTheme: textTheme,
                                                         } }) })), buttons && ((0, jsx_runtime_1.jsx)("div", { className: b('buttons'), "data-qa": "header-buttons", children: buttons.map((button, index) => ((0, jsx_runtime_1.jsx)(components_1.RouterLink, { href: button.url, children: (0, jsx_runtime_1.jsx)(components_1.Button, { className: b('button'), size: "xl", extraProps: {

package/build/cjs/blocks/Header/Header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Header.js","sourceRoot":"../../../../src","sources":["blocks/Header/Header.tsx"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable complexity /\nimport {useUniqId} from '@gravity-ui/uikit';\nimport as React from 'react';\n\nimport {Button, HTML, Media, RouterLink} from '../../components';\nimport HeaderBreadcrumbs from '../../components/HeaderBreadcrumbs/HeaderBreadcrumbs';\nimport {getMediaImage} from '../../components/Media/Image/utils';\nimport YFMWrapper from '../../components/YFMWrapper/YFMWrapper';\nimport {MobileContext} from '../../context/mobileContext';\nimport {useTheme} from '../../context/theme';\nimport {Col, Grid, Row} from '../../grid';\nimport {ClassNameProps, HeaderBlockBackground, HeaderBlockProps} from '../../models';\nimport {block, getThemedValue} from '../../utils';\nimport {mergeVideoMicrodata} from '../../utils/microdata';\n\nimport {getImageSize, getTitleSizes, titleWithImageSizes} from './utils';\nimport './Header.scss';\n\nconst b = block('header-block');\n\ntype HeaderBlockFullProps = HeaderBlockProps & ClassNameProps;\n\ninterface BackgroundProps {\n background: HeaderBlockBackground;\n isMobile: boolean;\n}\n\nconst Background = ({background, isMobile}: BackgroundProps) => {\n const {url, image, fullWidthMedia, video, color} = background;\n const imageObject = url ? getMediaImage(url) : image;\n const renderMedia = !isMobile \|\| (typeof image === 'object' && 'mobile' in image);\n\n return (\n <div\n className={b('background', {media: true, 'full-width-media': fullWidthMedia})}\n style={{backgroundColor: color}}\n >\n {renderMedia && (\n <Media\n {...background}\n className={b('background-media')}\n imageClassName={b('image')}\n videoClassName={b('video')}\n isBackground={true}\n parallax={false}\n video={isMobile ? undefined : video}\n image={imageObject}\n />\n )}\n </div>\n );\n};\n\ninterface FullWidthBackgroundProps {\n background: HeaderBlockBackground;\n}\n\nconst FullWidthBackground = ({background}: FullWidthBackgroundProps) => (\n <div\n className={b('background', {['full-width']: true})}\n style={{backgroundColor: background?.color}}\n />\n);\n\nexport const HeaderBlock = (props: React.PropsWithChildren<HeaderBlockFullProps>) => {\n const {\n title,\n overtitle,\n description,\n buttons,\n image,\n video,\n width = 'm',\n imageSize,\n offset = 'default',\n background,\n theme: textTheme = 'light',\n verticalOffset = 'm',\n className,\n breadcrumbs,\n status,\n renderTitle,\n children,\n mediaView = 'full',\n centered,\n } = props;\n const isMobile = React.useContext(MobileContext);\n const theme = useTheme();\n const hasRightSideImage = Boolean((image \|\| video) && !centered);\n const curImageSize = imageSize \|\| getImageSize(width);\n const titleSizes = hasRightSideImage ? titleWithImageSizes(curImageSize) : getTitleSizes(width);\n let curVerticalOffset = verticalOffset;\n\n if (hasRightSideImage && !verticalOffset) {\n curVerticalOffset = 'm';\n }\n\n const backgroundThemed = background && getThemedValue(background, theme);\n const imageThemed = image && getThemedValue(image, theme);\n const videoThemed = video && getThemedValue(video, theme);\n const mediaWithMicrodata = mergeVideoMicrodata(\n {video: videoThemed, image: imageThemed},\n {\n name: title,\n description,\n },\n );\n const fullWidth = backgroundThemed?.fullWidth \|\| backgroundThemed?.fullWidthMedia;\n const titleId = useUniqId();\n\n return (\n <header\n className={b(\n {\n ['has-media']: hasRightSideImage,\n ['full-width']: fullWidth,\n ['media-view']: mediaView,\n ['controls-view']: textTheme,\n },\n className,\n )}\n >\n {backgroundThemed && fullWidth && <FullWidthBackground background={backgroundThemed} />}\n {backgroundThemed && <Background background={backgroundThemed} isMobile={isMobile} />}\n <Grid containerClass={b('container-fluid')}>\n {breadcrumbs && (\n <Row className={b('breadcrumbs')}>\n <Col>\n <HeaderBreadcrumbs {...breadcrumbs} theme={textTheme} />\n </Col>\n </Row>\n )}\n <Row>\n <Col reset className={b('content-wrapper')}>\n <Row>\n <Col\n className={b('content', {\n offset,\n theme: textTheme,\n 'vertical-offset': curVerticalOffset,\n })}\n >\n <Col sizes={titleSizes} className={b('content-inner', {centered})}>\n {overtitle && (\n <div className={b('overtitle')}>\n {typeof overtitle === 'string' ? (\n <HTML>{overtitle}</HTML>\n ) : (\n overtitle\n )}\n </div>\n )}\n <h1 className={b('title')} id={titleId}>\n {status}\n {renderTitle ? renderTitle(title) : <HTML>{title}</HTML>}\n </h1>\n {description && (\n <div className={b('description', {theme: textTheme})}>\n <YFMWrapper\n content={description}\n modifiers={{\n constructor: true,\n constructorTheme: textTheme,\n }}\n />\n </div>\n )}\n {buttons && (\n <div className={b('buttons')} data-qa=\"header-buttons\">\n {buttons.map((button, index) => (\n <RouterLink href={button.url} key={index}>\n <Button\n key={index}\n className={b('button')}\n size=\"xl\"\n extraProps={{\n 'aria-describedby': titleId,\n ...button.extraProps,\n }}\n {...button}\n />\n </RouterLink>\n ))}\n </div>\n )}\n {children}\n </Col>\n </Col>\n </Row>\n {hasRightSideImage && (\n <Media\n className={b('media', {[curImageSize]: true})}\n videoClassName={b('video')}\n imageClassName={b('image')}\n {...mediaWithMicrodata}\n />\n )}\n </Col>\n </Row>\n </Grid>\n </header>\n );\n};\n\nexport default HeaderBlock;\n"]}
1	+ {"version":3,"file":"Header.js","sourceRoot":"../../../../src","sources":["blocks/Header/Header.tsx"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable complexity /\nimport {useUniqId} from '@gravity-ui/uikit';\nimport as React from 'react';\n\nimport {Button, Media, RouterLink} from '../../components';\nimport HeaderBreadcrumbs from '../../components/HeaderBreadcrumbs/HeaderBreadcrumbs';\nimport {getMediaImage} from '../../components/Media/Image/utils';\nimport YFMWrapper from '../../components/YFMWrapper/YFMWrapper';\nimport {MobileContext} from '../../context/mobileContext';\nimport {useTheme} from '../../context/theme';\nimport {Col, Grid, Row} from '../../grid';\nimport {ClassNameProps, HeaderBlockBackground, HeaderBlockProps} from '../../models';\nimport {block, getThemedValue} from '../../utils';\nimport {mergeVideoMicrodata} from '../../utils/microdata';\n\nimport {getImageSize, getTitleSizes, titleWithImageSizes} from './utils';\nimport './Header.scss';\n\nconst b = block('header-block');\n\ntype HeaderBlockFullProps = HeaderBlockProps & ClassNameProps;\n\ninterface BackgroundProps {\n background: HeaderBlockBackground;\n isMobile: boolean;\n}\n\nconst Background = ({background, isMobile}: BackgroundProps) => {\n const {url, image, fullWidthMedia, video, color} = background;\n const imageObject = url ? getMediaImage(url) : image;\n const renderMedia = !isMobile \|\| (typeof image === 'object' && 'mobile' in image);\n\n return (\n <div\n className={b('background', {media: true, 'full-width-media': fullWidthMedia})}\n style={{backgroundColor: color}}\n >\n {renderMedia && (\n <Media\n {...background}\n className={b('background-media')}\n imageClassName={b('image')}\n videoClassName={b('video')}\n isBackground={true}\n parallax={false}\n video={isMobile ? undefined : video}\n image={imageObject}\n />\n )}\n </div>\n );\n};\n\ninterface FullWidthBackgroundProps {\n background: HeaderBlockBackground;\n}\n\nconst FullWidthBackground = ({background}: FullWidthBackgroundProps) => (\n <div\n className={b('background', {['full-width']: true})}\n style={{backgroundColor: background?.color}}\n />\n);\n\nexport const HeaderBlock = (props: React.PropsWithChildren<HeaderBlockFullProps>) => {\n const {\n title,\n overtitle,\n description,\n buttons,\n image,\n video,\n width = 'm',\n imageSize,\n offset = 'default',\n background,\n theme: textTheme = 'light',\n verticalOffset = 'm',\n className,\n breadcrumbs,\n status,\n renderTitle,\n children,\n mediaView = 'full',\n centered,\n } = props;\n const isMobile = React.useContext(MobileContext);\n const theme = useTheme();\n const hasRightSideImage = Boolean((image \|\| video) && !centered);\n const curImageSize = imageSize \|\| getImageSize(width);\n const titleSizes = hasRightSideImage ? titleWithImageSizes(curImageSize) : getTitleSizes(width);\n let curVerticalOffset = verticalOffset;\n\n if (hasRightSideImage && !verticalOffset) {\n curVerticalOffset = 'm';\n }\n\n const backgroundThemed = background && getThemedValue(background, theme);\n const imageThemed = image && getThemedValue(image, theme);\n const videoThemed = video && getThemedValue(video, theme);\n const mediaWithMicrodata = mergeVideoMicrodata(\n {video: videoThemed, image: imageThemed},\n {\n name: title,\n description,\n },\n );\n const fullWidth = backgroundThemed?.fullWidth \|\| backgroundThemed?.fullWidthMedia;\n const titleId = useUniqId();\n\n return (\n <header\n className={b(\n {\n ['has-media']: hasRightSideImage,\n ['full-width']: fullWidth,\n ['media-view']: mediaView,\n ['controls-view']: textTheme,\n },\n className,\n )}\n >\n {backgroundThemed && fullWidth && <FullWidthBackground background={backgroundThemed} />}\n {backgroundThemed && <Background background={backgroundThemed} isMobile={isMobile} />}\n <Grid containerClass={b('container-fluid')}>\n {breadcrumbs && (\n <Row className={b('breadcrumbs')}>\n <Col>\n <HeaderBreadcrumbs {...breadcrumbs} theme={textTheme} />\n </Col>\n </Row>\n )}\n <Row>\n <Col reset className={b('content-wrapper')}>\n <Row>\n <Col\n className={b('content', {\n offset,\n theme: textTheme,\n 'vertical-offset': curVerticalOffset,\n })}\n >\n <Col sizes={titleSizes} className={b('content-inner', {centered})}>\n {overtitle && (\n <div className={b('overtitle')}>\n {typeof overtitle === 'string' ? (\n <YFMWrapper\n tagName=\"div\"\n className={b('overtitle')}\n content={overtitle}\n modifiers={{\n constructor: true,\n }}\n />\n ) : (\n overtitle\n )}\n </div>\n )}\n <YFMWrapper\n content={title}\n contentClassName={b('title')}\n className={b('title-container')}\n modifiers={{\n constructor: true,\n constructorTheme: textTheme,\n }}\n tagName=\"h1\"\n contentPosition=\"end\"\n >\n {status}\n {renderTitle ? renderTitle(title) : null}\n </YFMWrapper>\n {description && (\n <div className={b('description', {theme: textTheme})}>\n <YFMWrapper\n content={description}\n modifiers={{\n constructor: true,\n constructorTheme: textTheme,\n }}\n />\n </div>\n )}\n {buttons && (\n <div className={b('buttons')} data-qa=\"header-buttons\">\n {buttons.map((button, index) => (\n <RouterLink href={button.url} key={index}>\n <Button\n key={index}\n className={b('button')}\n size=\"xl\"\n extraProps={{\n 'aria-describedby': titleId,\n ...button.extraProps,\n }}\n {...button}\n />\n </RouterLink>\n ))}\n </div>\n )}\n {children}\n </Col>\n </Col>\n </Row>\n {hasRightSideImage && (\n <Media\n className={b('media', {[curImageSize]: true})}\n videoClassName={b('video')}\n imageClassName={b('image')}\n {...mediaWithMicrodata}\n />\n )}\n </Col>\n </Row>\n </Grid>\n </header>\n );\n};\n\nexport default HeaderBlock;\n"]}

package/build/cjs/blocks/HeaderSlider/HeaderSlider.css CHANGED Viewed

@@ -34,13 +34,6 @@ unpredictable css rules order in build */
     padding-right: 32px;
   }
 }
-@media (max-width: 769px) {
-  .pc-header-slider-block.pc-SliderBlock {
-    margin-left: -8px;
-    padding-left: 0;
-    width: calc(100% + 8px);
-  }
-}
 @media (max-width: 577px) {
   .pc-header-slider-block__item-content .pc-header-block__content {
     padding-left: 0;
@@ -49,7 +42,4 @@ unpredictable css rules order in build */
   .pc-header-slider-block__item-content .pc-header-block__container-fluid {
     padding-left: 24px;
   }
-  .pc-header-slider-block .slick-track .slick-slide {
-    max-width: 100%;
-  }
 }

package/build/cjs/blocks/HeaderSlider/HeaderSlider.js CHANGED Viewed

@@ -4,16 +4,16 @@ exports.HeaderSliderBlock = void 0;
 const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
+const blocks_1 = require("../index.js");
 const mobileContext_1 = require("../../context/mobileContext/index.js");
 const models_1 = require("../../models/index.js");
 const utils_1 = require("../../utils/index.js");
 const Header_1 = tslib_1.__importDefault(require("../Header/Header.js"));
-const index_1 = require("../index.js");
 const b = (0, utils_1.block)('header-slider-block');
 const HeaderSliderBlock = ({ items, arrows, ...props }) => {
     const isMobile = React.useContext(mobileContext_1.MobileContext);
     const showArrows = isMobile ? false : arrows;
-    return ((0, jsx_runtime_1.jsx)("div", { className: b('wrapper'), "data-qa": "header-slider", children: (0, jsx_runtime_1.jsx)(index_1.SliderBlock, { ...props, arrows: showArrows, slidesToShow: 1, type: models_1.SliderType.HeaderCard, animated: false, blockClassName: b(), arrowSize: 20, children: items.map((item, index) => ((0, jsx_runtime_1.jsx)("div", { className: b('item'), "data-qa": `header-slider-item-${index + 1}`, children: (0, jsx_runtime_1.jsx)(Header_1.default, { ...item, className: b('item-content') }) }, index))) }) }));
+    return ((0, jsx_runtime_1.jsx)("div", { className: b('wrapper'), "data-qa": "header-slider", children: (0, jsx_runtime_1.jsx)(blocks_1.SliderBlock, { ...props, arrows: showArrows, slidesToShow: 1, type: models_1.SliderType.HeaderCard, animated: false, blockClassName: b(), arrowSize: 20, children: items.map((item, index) => ((0, jsx_runtime_1.jsx)("div", { className: b('item'), "data-qa": `header-slider-item-${index + 1}`, children: (0, jsx_runtime_1.jsx)(Header_1.default, { ...item, className: b('item-content') }) }, index))) }) }));
 };
 exports.HeaderSliderBlock = HeaderSliderBlock;
 exports.default = exports.HeaderSliderBlock;

package/build/cjs/blocks/HeaderSlider/HeaderSlider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"HeaderSlider.js","sourceRoot":"../../../../src","sources":["blocks/HeaderSlider/HeaderSlider.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,wEAA0D;AAC1D,kDAAgE;AAChE,gDAAkC;AAClC,yEAAsC;~~AACtC~~,~~uCAAqC;AAIrC,~~MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,qBAAqB,CAAC,CAAC;AAEhC,MAAM,iBAAiB,GAAG,CAAC,EAAC,KAAK,EAAE,MAAM,EAAE,GAAG,KAAK,EAAyB,EAAE,EAAE;IACnF,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,6BAAa,CAAC,CAAC;IACjD,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC;IAE7C,OAAO,CACH,gCAAK,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,aAAU,eAAe,YACjD,uBAAC,~~mBAAW~~,OACJ,KAAK,EACT,MAAM,EAAE,UAAU,EAClB,YAAY,EAAE,CAAC,EACf,IAAI,EAAE,mBAAU,CAAC,UAAU,EAC3B,QAAQ,EAAE,KAAK,EACf,cAAc,EAAE,CAAC,EAAE,EACnB,SAAS,EAAE,EAAE,YAEZ,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CACxB,gCAEI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,aACX,sBAAsB,KAAK,GAAG,CAAC,EAAE,YAE1C,uBAAC,gBAAM,OAAK,IAAI,EAAE,SAAS,EAAE,CAAC,CAAC,cAAc,CAAC,GAAI,IAJ7C,KAAK,CAKR,CACT,CAAC,GACQ,GACZ,CACT,CAAC;AACN,CAAC,CAAC;AA3BW,QAAA,iBAAiB,qBA2B5B;AAEF,kBAAe,yBAAiB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {MobileContext} from '../../context/mobileContext';\nimport {HeaderSliderBlockProps, SliderType} from '../../models';\nimport {block} from '../../utils';\nimport Header from '../Header/Header';\~~nimport {SliderBlock} from '../index';\~~n\nimport './HeaderSlider.scss';\n\nconst b = block('header-slider-block');\n\nexport const HeaderSliderBlock = ({items, arrows, ...props}: HeaderSliderBlockProps) => {\n const isMobile = React.useContext(MobileContext);\n const showArrows = isMobile ? false : arrows;\n\n return (\n <div className={b('wrapper')} data-qa=\"header-slider\">\n <SliderBlock\n {...props}\n arrows={showArrows}\n slidesToShow={1}\n type={SliderType.HeaderCard}\n animated={false}\n blockClassName={b()}\n arrowSize={20}\n >\n {items.map((item, index) => (\n <div\n key={index}\n className={b('item')}\n data-qa={`header-slider-item-${index + 1}`}\n >\n <Header {...item} className={b('item-content')} />\n </div>\n ))}\n </SliderBlock>\n </div>\n );\n};\n\nexport default HeaderSliderBlock;\n"]}
1	+ {"version":3,"file":"HeaderSlider.js","sourceRoot":"../../../../src","sources":["blocks/HeaderSlider/HeaderSlider.tsx"],"names":[],"mappings":";;;;;AAAA,qDAA+B;AAE/B,wCAAyC;AACzC,wEAA0D;AAC1D,kDAAgE;AAChE,gDAAkC;AAClC,yEAAsC;AAItC,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,qBAAqB,CAAC,CAAC;AAEhC,MAAM,iBAAiB,GAAG,CAAC,EAAC,KAAK,EAAE,MAAM,EAAE,GAAG,KAAK,EAAyB,EAAE,EAAE;IACnF,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,6BAAa,CAAC,CAAC;IACjD,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC;IAE7C,OAAO,CACH,gCAAK,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,aAAU,eAAe,YACjD,uBAAC,oBAAW,OACJ,KAAK,EACT,MAAM,EAAE,UAAU,EAClB,YAAY,EAAE,CAAC,EACf,IAAI,EAAE,mBAAU,CAAC,UAAU,EAC3B,QAAQ,EAAE,KAAK,EACf,cAAc,EAAE,CAAC,EAAE,EACnB,SAAS,EAAE,EAAE,YAEZ,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CACxB,gCAEI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,aACX,sBAAsB,KAAK,GAAG,CAAC,EAAE,YAE1C,uBAAC,gBAAM,OAAK,IAAI,EAAE,SAAS,EAAE,CAAC,CAAC,cAAc,CAAC,GAAI,IAJ7C,KAAK,CAKR,CACT,CAAC,GACQ,GACZ,CACT,CAAC;AACN,CAAC,CAAC;AA3BW,QAAA,iBAAiB,qBA2B5B;AAEF,kBAAe,yBAAiB,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {SliderBlock} from '../../blocks';\nimport {MobileContext} from '../../context/mobileContext';\nimport {HeaderSliderBlockProps, SliderType} from '../../models';\nimport {block} from '../../utils';\nimport Header from '../Header/Header';\n\nimport './HeaderSlider.scss';\n\nconst b = block('header-slider-block');\n\nexport const HeaderSliderBlock = ({items, arrows, ...props}: HeaderSliderBlockProps) => {\n const isMobile = React.useContext(MobileContext);\n const showArrows = isMobile ? false : arrows;\n\n return (\n <div className={b('wrapper')} data-qa=\"header-slider\">\n <SliderBlock\n {...props}\n arrows={showArrows}\n slidesToShow={1}\n type={SliderType.HeaderCard}\n animated={false}\n blockClassName={b()}\n arrowSize={20}\n >\n {items.map((item, index) => (\n <div\n key={index}\n className={b('item')}\n data-qa={`header-slider-item-${index + 1}`}\n >\n <Header {...item} className={b('item-content')} />\n </div>\n ))}\n </SliderBlock>\n </div>\n );\n};\n\nexport default HeaderSliderBlock;\n"]}

package/build/cjs/blocks/HeaderSlider/schema.d.ts CHANGED Viewed

@@ -574,6 +574,9 @@ export declare const HeaderSliderBlock: {
                     };
                 };
             };
+            type: {
+                type: string;
+            };
             dots: {
                 type: string;
             };
@@ -613,11 +616,17 @@ export declare const HeaderSliderBlock: {
             randomOrder: {
                 type: string;
             };
+            adaptive: {
+                type: string;
+            };
             animated: {
                 animated: {
                     type: string;
                 };
             };
+            arrowSize: {
+                type: string;
+            };
             anchor: {
                 type: string;
                 additionalProperties: boolean;
@@ -657,7 +666,6 @@ export declare const HeaderSliderBlock: {
                     };
                 };
             };
-            type: {};
             when: {
                 type: string;
             };

package/build/cjs/blocks/Questions/QuestionBlockItem/QuestionBlockItem.css CHANGED Viewed

@@ -1,4 +1,4 @@
-.pc-QuestionsBlockItem__title {
+.pc-QuestionsBlockItem__title.pc-QuestionsBlockItem__title {
   margin: 0;
 }
@@ -11,45 +11,55 @@ unpredictable css rules order in build */
 .pc-QuestionsBlockItem + .pc-QuestionsBlockItem {
   padding-top: 32px;
 }
-.pc-QuestionsBlockItem__title {
-  display: inline-block;
-  margin: 0;
-  padding: 0;
-  font: inherit;
-  border: none;
-  outline: none;
-  color: inherit;
-  background: none;
-  cursor: pointer;
+.pc-QuestionsBlockItem__title.pc-QuestionsBlockItem__title {
   font-size: var(--g-text-header-1-font-size);
   line-height: var(--g-text-header-1-line-height);
   color: var(--pc-text-header-color);
   font-weight: var(--g-text-accent-font-weight);
-  position: relative;
-  display: block;
-  width: 100%;
-  padding-right: 24px;
-  text-align: start;
   cursor: pointer;
   border-radius: var(--g-focus-border-radius);
 }
-.pc-QuestionsBlockItem__title:focus {
+.pc-QuestionsBlockItem__title.pc-QuestionsBlockItem__title:focus {
   outline: 2px solid var(--g-color-line-focus);
   outline-offset: 0;
 }
-.pc-QuestionsBlockItem__title:focus:not(:focus-visible) {
+.pc-QuestionsBlockItem__title.pc-QuestionsBlockItem__title:focus:not(:focus-visible) {
   outline: 0;
 }
-.pc-QuestionsBlockItem__title a {
+.pc-QuestionsBlockItem__title.pc-QuestionsBlockItem__title a {
   outline: none;
   color: var(--g-color-text-link);
   text-decoration: none;
   cursor: pointer;
 }
-.utilityfocus .pc-QuestionsBlockItem__title a:focus {
+.utilityfocus .pc-QuestionsBlockItem__title.pc-QuestionsBlockItem__title a:focus {
   outline: 2px solid #ffdb4d;
 }
-.pc-QuestionsBlockItem__title a:hover, .pc-QuestionsBlockItem__title a:active {
+.pc-QuestionsBlockItem__title.pc-QuestionsBlockItem__title a:hover, .pc-QuestionsBlockItem__title.pc-QuestionsBlockItem__title a:active {
+  --pc-text-header-color: var(--g-color-text-link-hover);
+  color: var(--g-color-text-link-hover);
+}
+.pc-QuestionsBlockItem__title-container {
+  margin: 0;
+  position: relative;
+  display: block;
+  width: 100%;
+  padding-right: 24px;
+  text-align: start;
+  cursor: pointer;
+  border-radius: var(--g-focus-border-radius);
+}
+.pc-QuestionsBlockItem__title-container a {
+  outline: none;
+  color: var(--g-color-text-link);
+  text-decoration: none;
+  cursor: pointer;
+}
+.utilityfocus .pc-QuestionsBlockItem__title-container a:focus {
+  outline: 2px solid #ffdb4d;
+}
+.pc-QuestionsBlockItem__title-container a:hover, .pc-QuestionsBlockItem__title-container a:active {
   --pc-text-header-color: var(--g-color-text-link-hover);
   color: var(--g-color-text-link-hover);
 }
@@ -75,4 +85,16 @@ unpredictable css rules order in build */
   font-size: var(--g-text-body-2-font-size);
   line-height: var(--g-text-body-2-line-height);
   margin-top: 12px;
+}
+.pc-QuestionsBlockItem__button {
+  display: inline-block;
+  margin: 0;
+  padding: 0;
+  font: inherit;
+  border: none;
+  outline: none;
+  color: inherit;
+  background: none;
+  cursor: pointer;
+  width: 100%;
 }

package/build/cjs/blocks/Questions/QuestionBlockItem/QuestionBlockItem.js CHANGED Viewed

@@ -11,7 +11,9 @@ const models_1 = require("../models.js");
 const b = (0, utils_1.block)('QuestionsBlockItem');
 const QuestionBlockItem = ({ title: itemTitle, text: itemText, link, listStyle = 'dash', isOpened, onClick, }) => {
     const { onKeyDown } = (0, uikit_1.useActionHandlers)(onClick);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), itemScope: true, itemProp: models_1.FaqMicrodataValues.QuestionProp, itemType: models_1.FaqMicrodataValues.QuestionType, role: 'listitem', children: [(0, jsx_runtime_1.jsxs)("button", { className: b('title'), onClick: onClick, "aria-expanded": isOpened, onKeyDown: onKeyDown, children: [(0, jsx_runtime_1.jsx)(components_1.HTML, { itemProp: models_1.FaqMicrodataValues.QuestionNameProp, children: itemTitle }), (0, jsx_runtime_1.jsx)(components_1.ToggleArrow, { open: isOpened, size: 16, type: 'vertical', iconType: "navigation", className: b('arrow') })] }), (0, jsx_runtime_1.jsx)(components_1.Foldable, { isOpened: isOpened, children: (0, jsx_runtime_1.jsxs)("div", { className: b('text'), itemScope: true, itemProp: models_1.FaqMicrodataValues.AnswerProp, itemType: models_1.FaqMicrodataValues.AnswerType, "aria-hidden": !isOpened, children: [(0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { content: itemText, modifiers: {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), itemScope: true, itemProp: models_1.FaqMicrodataValues.QuestionProp, itemType: models_1.FaqMicrodataValues.QuestionType, role: 'listitem', children: [(0, jsx_runtime_1.jsx)("button", { className: b('button'), onClick: onClick, "aria-expanded": isOpened, onKeyDown: onKeyDown, children: (0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { tagName: "h3", className: b('title-container'), contentClassName: b('title'), itemProp: models_1.FaqMicrodataValues.QuestionNameProp, content: itemTitle, modifiers: {
+                        constructor: true,
+                    }, onClick: onClick, tabIndex: 0, children: (0, jsx_runtime_1.jsx)(components_1.ToggleArrow, { open: isOpened, size: 16, type: 'vertical', iconType: "navigation", className: b('arrow') }) }) }), (0, jsx_runtime_1.jsx)(components_1.Foldable, { isOpened: isOpened, children: (0, jsx_runtime_1.jsxs)("div", { className: b('text'), itemScope: true, itemProp: models_1.FaqMicrodataValues.AnswerProp, itemType: models_1.FaqMicrodataValues.AnswerType, "aria-hidden": !isOpened, children: [(0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { content: itemText, modifiers: {
                                 constructor: true,
                                 constructorListStyle: true,
                                 constructorListStyleDash: listStyle === 'dash',

package/build/cjs/blocks/Questions/QuestionBlockItem/QuestionBlockItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"QuestionBlockItem.js","sourceRoot":"../../../../../src","sources":["blocks/Questions/QuestionBlockItem/QuestionBlockItem.tsx"],"names":[],"mappings":";;;;;AAAA,6CAAoD;AAEpD,~~6DAA4E~~;~~AAC5E~~,oFAAiD;AAEjD,mDAAqC;AACrC,yCAA6C;AAI7C,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,oBAAoB,CAAC,CAAC;AAE/B,MAAM,iBAAiB,GAAG,CAAC,EAC9B,KAAK,EAAE,SAAS,EAChB,IAAI,EAAE,QAAQ,EACd,IAAI,EACJ,SAAS,GAAG,MAAM,EAClB,QAAQ,EACR,OAAO,GACc,EAAE,EAAE;IACzB,MAAM,EAAC,SAAS,EAAC,GAAG,IAAA,yBAAiB,EAAC,OAAO,CAAC,CAAC;IAE/C,OAAO,CACH,iCACI,SAAS,EAAE,CAAC,EAAE,EACd,SAAS,QACT,QAAQ,EAAE,2BAAkB,CAAC,YAAY,EACzC,QAAQ,EAAE,2BAAkB,CAAC,YAAY,EACzC,IAAI,EAAE,UAAU,aAEhB,~~oCACI~~,SAAS,EAAE,CAAC,CAAC,~~OAAO~~,CAAC,~~EACrB~~,OAAO,EAAE,OAAO,mBACD,QAAQ,EACvB,SAAS,EAAE,SAAS,~~aAEpB~~,uBAAC,~~iBAAI~~,~~IAAC~~,QAAQ,EAAE,2BAAkB,CAAC,gBAAgB,~~YAAG~~,SAAS,~~GAAQ~~,~~EACvE~~,uBAAC,wBAAW,IACR,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,EAAE,EACR,IAAI,EAAE,UAAU,EAChB,QAAQ,EAAC,YAAY,EACrB,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,GACvB,~~IACG~~,EACT,uBAAC,qBAAQ,IAAC,QAAQ,EAAE,QAAQ,YACxB,iCACI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,SAAS,QACT,QAAQ,EAAE,2BAAkB,CAAC,UAAU,EACvC,QAAQ,EAAE,2BAAkB,CAAC,UAAU,iBAC1B,CAAC,QAAQ,aAEtB,uBAAC,uBAAU,IACP,OAAO,EAAE,QAAQ,EACjB,SAAS,EAAE;gCACP,WAAW,EAAE,IAAI;gCACjB,oBAAoB,EAAE,IAAI;gCAC1B,wBAAwB,EAAE,SAAS,KAAK,MAAM;6BACjD,EACD,QAAQ,EAAE,2BAAkB,CAAC,gBAAgB,GAC/C,EACD,IAAI,IAAI,uBAAC,cAAI,OAAK,IAAI,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,GAAI,IAC5E,GACC,IACT,CACT,CAAC;AACN,CAAC,CAAC;~~AAvDW~~,QAAA,iBAAiB,~~qBAuD5B~~","sourcesContent":["import {useActionHandlers} from '@gravity-ui/uikit';\n\nimport {Foldable, ~~HTML,~~ ToggleArrow, YFMWrapper} from '../../../components';\nimport Link from '../../../components/Link/Link';\nimport {QuestionBlockItemProps} from '../../../models';\nimport {block} from '../../../utils';\nimport {FaqMicrodataValues} from '../models';\n\nimport './QuestionBlockItem.scss';\n\nconst b = block('QuestionsBlockItem');\n\nexport const QuestionBlockItem = ({\n title: itemTitle,\n text: itemText,\n link,\n listStyle = 'dash',\n isOpened,\n onClick,\n}: QuestionBlockItemProps) => {\n const {onKeyDown} = useActionHandlers(onClick);\n\n return (\n <div\n className={b()}\n itemScope\n itemProp={FaqMicrodataValues.QuestionProp}\n itemType={FaqMicrodataValues.QuestionType}\n role={'listitem'}\n >\n <button\n className={b('~~title~~')}\n onClick={onClick}\n aria-expanded={isOpened}\n onKeyDown={onKeyDown}\n >\n <~~HTML~~ itemProp={FaqMicrodataValues.QuestionNameProp}>{itemTitle}~~</HTML~~>\n <ToggleArrow\n open={isOpened}\n size={16}\n type={'vertical'}\n iconType=\"navigation\"\n className={b('arrow')}\n />\n </button>\n <Foldable isOpened={isOpened}>\n <div\n className={b('text')}\n itemScope\n itemProp={FaqMicrodataValues.AnswerProp}\n itemType={FaqMicrodataValues.AnswerType}\n aria-hidden={!isOpened}\n >\n <YFMWrapper\n content={itemText}\n modifiers={{\n constructor: true,\n constructorListStyle: true,\n constructorListStyleDash: listStyle === 'dash',\n }}\n itemProp={FaqMicrodataValues.QuestionTextProp}\n />\n {link && <Link {...link} tabIndex={isOpened ? 0 : -1} className={b('link')} />}\n </div>\n </Foldable>\n </div>\n );\n};\n"]}
1	+ {"version":3,"file":"QuestionBlockItem.js","sourceRoot":"../../../../../src","sources":["blocks/Questions/QuestionBlockItem/QuestionBlockItem.tsx"],"names":[],"mappings":";;;;;AAAA,6CAAoD;AAEpD,6DAAsE;AACtE,oFAAiD;AAEjD,mDAAqC;AACrC,yCAA6C;AAI7C,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,oBAAoB,CAAC,CAAC;AAE/B,MAAM,iBAAiB,GAAG,CAAC,EAC9B,KAAK,EAAE,SAAS,EAChB,IAAI,EAAE,QAAQ,EACd,IAAI,EACJ,SAAS,GAAG,MAAM,EAClB,QAAQ,EACR,OAAO,GACc,EAAE,EAAE;IACzB,MAAM,EAAC,SAAS,EAAC,GAAG,IAAA,yBAAiB,EAAC,OAAO,CAAC,CAAC;IAE/C,OAAO,CACH,iCACI,SAAS,EAAE,CAAC,EAAE,EACd,SAAS,QACT,QAAQ,EAAE,2BAAkB,CAAC,YAAY,EACzC,QAAQ,EAAE,2BAAkB,CAAC,YAAY,EACzC,IAAI,EAAE,UAAU,aAEhB,mCACI,SAAS,EAAE,CAAC,CAAC,QAAQ,CAAC,EACtB,OAAO,EAAE,OAAO,mBACD,QAAQ,EACvB,SAAS,EAAE,SAAS,YAEpB,uBAAC,uBAAU,IACP,OAAO,EAAC,IAAI,EACZ,SAAS,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAC/B,gBAAgB,EAAE,CAAC,CAAC,OAAO,CAAC,EAC5B,QAAQ,EAAE,2BAAkB,CAAC,gBAAgB,EAC7C,OAAO,EAAE,SAAS,EAClB,SAAS,EAAE;wBACP,WAAW,EAAE,IAAI;qBACpB,EACD,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,YAEX,uBAAC,wBAAW,IACR,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,EAAE,EACR,IAAI,EAAE,UAAU,EAChB,QAAQ,EAAC,YAAY,EACrB,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,GACvB,GACO,GACR,EACT,uBAAC,qBAAQ,IAAC,QAAQ,EAAE,QAAQ,YACxB,iCACI,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,EACpB,SAAS,QACT,QAAQ,EAAE,2BAAkB,CAAC,UAAU,EACvC,QAAQ,EAAE,2BAAkB,CAAC,UAAU,iBAC1B,CAAC,QAAQ,aAEtB,uBAAC,uBAAU,IACP,OAAO,EAAE,QAAQ,EACjB,SAAS,EAAE;gCACP,WAAW,EAAE,IAAI;gCACjB,oBAAoB,EAAE,IAAI;gCAC1B,wBAAwB,EAAE,SAAS,KAAK,MAAM;6BACjD,EACD,QAAQ,EAAE,2BAAkB,CAAC,gBAAgB,GAC/C,EACD,IAAI,IAAI,uBAAC,cAAI,OAAK,IAAI,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,GAAI,IAC5E,GACC,IACT,CACT,CAAC;AACN,CAAC,CAAC;AAnEW,QAAA,iBAAiB,qBAmE5B","sourcesContent":["import {useActionHandlers} from '@gravity-ui/uikit';\n\nimport {Foldable, ToggleArrow, YFMWrapper} from '../../../components';\nimport Link from '../../../components/Link/Link';\nimport {QuestionBlockItemProps} from '../../../models';\nimport {block} from '../../../utils';\nimport {FaqMicrodataValues} from '../models';\n\nimport './QuestionBlockItem.scss';\n\nconst b = block('QuestionsBlockItem');\n\nexport const QuestionBlockItem = ({\n title: itemTitle,\n text: itemText,\n link,\n listStyle = 'dash',\n isOpened,\n onClick,\n}: QuestionBlockItemProps) => {\n const {onKeyDown} = useActionHandlers(onClick);\n\n return (\n <div\n className={b()}\n itemScope\n itemProp={FaqMicrodataValues.QuestionProp}\n itemType={FaqMicrodataValues.QuestionType}\n role={'listitem'}\n >\n <button\n className={b('button')}\n onClick={onClick}\n aria-expanded={isOpened}\n onKeyDown={onKeyDown}\n >\n <YFMWrapper\n tagName=\"h3\"\n className={b('title-container')}\n contentClassName={b('title')}\n itemProp={FaqMicrodataValues.QuestionNameProp}\n content={itemTitle}\n modifiers={{\n constructor: true,\n }}\n onClick={onClick}\n tabIndex={0}\n >\n <ToggleArrow\n open={isOpened}\n size={16}\n type={'vertical'}\n iconType=\"navigation\"\n className={b('arrow')}\n />\n </YFMWrapper>\n </button>\n <Foldable isOpened={isOpened}>\n <div\n className={b('text')}\n itemScope\n itemProp={FaqMicrodataValues.AnswerProp}\n itemType={FaqMicrodataValues.AnswerType}\n aria-hidden={!isOpened}\n >\n <YFMWrapper\n content={itemText}\n modifiers={{\n constructor: true,\n constructorListStyle: true,\n constructorListStyleDash: listStyle === 'dash',\n }}\n itemProp={FaqMicrodataValues.QuestionTextProp}\n />\n {link && <Link {...link} tabIndex={isOpened ? 0 : -1} className={b('link')} />}\n </div>\n </Foldable>\n </div>\n );\n};\n"]}

package/build/cjs/blocks/Share/Share.css CHANGED Viewed

@@ -1,10 +1,10 @@
-.pc-share-block__title {
+.pc-share-block__title.pc-share-block__title {
   margin: 0;
 }
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
-.pc-share-block__title {
+.pc-share-block__title.pc-share-block__title {
   font-size: var(--g-text-body-3-font-size);
   line-height: var(--g-text-body-3-line-height);
   color: var(--pc-text-header-color);
@@ -12,6 +12,7 @@ unpredictable css rules order in build */
   text-align: center;
   font-weight: normal;
 }
 .pc-share-block__items {
   display: flex;
   justify-content: center;

package/build/cjs/blocks/Share/Share.js CHANGED Viewed

@@ -4,6 +4,7 @@ const tslib_1 = require("tslib");
 const jsx_runtime_1 = require("react/jsx-runtime");
 const React = tslib_1.__importStar(require("react"));
 const uikit_1 = require("@gravity-ui/uikit");
+const components_1 = require("../../components/index.js");
 const locationContext_1 = require("../../context/locationContext/index.js");
 const hooks_1 = require("../../hooks/index.js");
 const Facebook_1 = require("../../icons/Facebook.js");
@@ -26,7 +27,10 @@ const Share = ({ items, title }) => {
     const { pathname, hostname } = React.useContext(locationContext_1.LocationContext);
     const handleAnalytics = (0, hooks_1.useAnalytics)(models_1.DefaultEventNames.ShareButton);
     const handleButtonClick = React.useCallback(() => handleAnalytics(), [handleAnalytics]);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), children: [(0, jsx_runtime_1.jsx)("h5", { className: b('title'), children: title || (0, i18n_1.i18n)('constructor-share') }), (0, jsx_runtime_1.jsx)("div", { className: b('items'), children: items.map((type) => {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: b(), children: [title ? ((0, jsx_runtime_1.jsx)(components_1.YFMWrapper, { content: title, modifiers: {
+                    constructor: true,
+                    // constructorTheme: textTheme,
+                }, contentClassName: b('title'), tagName: "h5" })) : ((0, jsx_runtime_1.jsx)("h5", { className: b('title'), children: (0, i18n_1.i18n)('constructor-share') })), (0, jsx_runtime_1.jsx)("div", { className: b('items'), children: items.map((type) => {
                     const url = (0, utils_1.getAbsolutePath)(hostname, pathname);
                     const socialUrl = (0, utils_1.getShareLink)(url, type);
                     const icon = icons[type];

package/build/cjs/blocks/Share/Share.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Share.js","sourceRoot":"../../../../src","sources":["blocks/Share/Share.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,6CAA+C;AAE/C,4EAA8D;AAC9D,gDAAyC;AACzC,sDAA8C;AAC9C,sDAA8C;AAC9C,sDAA8C;AAC9C,oDAA4C;AAC5C,0CAAkC;AAClC,kDAAgE;AAChE,gDAAiE;AAEjE,0CAA4B;AAQ5B,MAAM,KAAK,GAAe;IACtB,QAAQ,EAAE,mBAAQ;IAClB,OAAO,EAAE,iBAAO;IAChB,QAAQ,EAAE,mBAAQ;IAClB,EAAE,EAAE,OAAE;IACN,QAAQ,EAAE,mBAAQ;CACrB,CAAC;AAEF,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,aAAa,CAAC,CAAC;AAE/B,MAAM,KAAK,GAAG,CAAC,EAAC,KAAK,EAAE,KAAK,EAAkB,EAAE,EAAE;IAC9C,MAAM,EAAC,QAAQ,EAAE,QAAQ,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,iCAAe,CAAC,CAAC;IAC/D,MAAM,eAAe,GAAG,IAAA,oBAAY,EAAC,0BAAiB,CAAC,WAAW,CAAC,CAAC;IAEpE,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE,CAAC,eAAe,EAAE,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAExF,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,EAAE,~~aACf~~,+BAAI,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YAAG,~~KAAK,IAAI,~~IAAA,WAAI,EAAC,mBAAmB,CAAC,GAAM,~~EACpE~~,gCAAK,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YACrB,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;oBAChB,MAAM,GAAG,GAAG,IAAA,uBAAe,EAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;oBAChD,MAAM,SAAS,GAAG,IAAA,oBAAY,EAAC,GAAG,EAAE,IAAI,CAAC,CAAC;oBAC1C,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC;oBACzB,MAAM,QAAQ,GAAG,IAAA,WAAI,EAAC,GAAG,IAAI,QAAQ,CAAC,CAAC;oBACvC,MAAM,WAAW,GAAG,IAAA,WAAI,EAAC,GAAG,IAAI,QAAQ,CAAC,CAAC;oBAE1C,OAAO,CACH,uBAAC,cAAM,IAEH,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,GAAG,EACR,MAAM,EAAC,QAAQ,EACf,IAAI,EAAE,SAAS,EACf,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,IAAI,EAAE,IAAI,CAAC,WAAW,EAAE,EAAC,CAAC,EAChD,OAAO,EAAE,iBAAiB,EAC1B,KAAK,EAAE,QAAQ,EACf,UAAU,EAAE;4BACR,YAAY,EAAE,WAAW;yBAC5B,YAEA,IAAI,IAAI,uBAAC,YAAI,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,IAAI,EAAC,CAAC,GAAI,IAZhE,IAAI,CAaJ,CACZ,CAAC;gBACN,CAAC,CAAC,GACA,IACJ,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,KAAK,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {Button, Icon} from '@gravity-ui/uikit';\n\nimport {LocationContext} from '../../context/locationContext';\nimport {useAnalytics} from '../../hooks';\nimport {Facebook} from '../../icons/Facebook';\nimport {Linkedin} from '../../icons/Linkedin';\nimport {Telegram} from '../../icons/Telegram';\nimport {Twitter} from '../../icons/Twitter';\nimport {Vk} from '../../icons/Vk';\nimport {DefaultEventNames, ShareBlockProps} from '../../models';\nimport {block, getAbsolutePath, getShareLink} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './Share.scss';\n\ninterface IconsProps {\n [key: string]: React.FC<React.SVGProps<SVGSVGElement>>;\n}\n\nconst icons: IconsProps = {\n facebook: Facebook,\n twitter: Twitter,\n linkedin: Linkedin,\n vk: Vk,\n telegram: Telegram,\n};\n\nconst b = block('share-block');\n\nconst Share = ({items, title}: ShareBlockProps) => {\n const {pathname, hostname} = React.useContext(LocationContext);\n const handleAnalytics = useAnalytics(DefaultEventNames.ShareButton);\n\n const handleButtonClick = React.useCallback(() => handleAnalytics(), [handleAnalytics]);\n\n return (\n <div className={b()}>\n <h5 className={b('title')}>{~~title \|\|~~ i18n('constructor-share')}</h5>\n <div className={b('items')}>\n {items.map((type) => {\n const url = getAbsolutePath(hostname, pathname);\n const socialUrl = getShareLink(url, type);\n const icon = icons[type];\n const urlTitle = i18n(`${type}-title`);\n const buttonLabel = i18n(`${type}-label`);\n\n return (\n <Button\n key={type}\n view=\"flat\"\n size=\"l\"\n target=\"_blank\"\n href={socialUrl}\n className={b('item', {type: type.toLowerCase()})}\n onClick={handleButtonClick}\n title={urlTitle}\n extraProps={{\n 'aria-label': buttonLabel,\n }}\n >\n {icon && <Icon data={icon} size={24} className={b('icon', {type})} />}\n </Button>\n );\n })}\n </div>\n </div>\n );\n};\n\nexport default Share;\n"]}
1	+ {"version":3,"file":"Share.js","sourceRoot":"../../../../src","sources":["blocks/Share/Share.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,6CAA+C;AAE/C,0DAA4C;AAC5C,4EAA8D;AAC9D,gDAAyC;AACzC,sDAA8C;AAC9C,sDAA8C;AAC9C,sDAA8C;AAC9C,oDAA4C;AAC5C,0CAAkC;AAClC,kDAAgE;AAChE,gDAAiE;AAEjE,0CAA4B;AAQ5B,MAAM,KAAK,GAAe;IACtB,QAAQ,EAAE,mBAAQ;IAClB,OAAO,EAAE,iBAAO;IAChB,QAAQ,EAAE,mBAAQ;IAClB,EAAE,EAAE,OAAE;IACN,QAAQ,EAAE,mBAAQ;CACrB,CAAC;AAEF,MAAM,CAAC,GAAG,IAAA,aAAK,EAAC,aAAa,CAAC,CAAC;AAE/B,MAAM,KAAK,GAAG,CAAC,EAAC,KAAK,EAAE,KAAK,EAAkB,EAAE,EAAE;IAC9C,MAAM,EAAC,QAAQ,EAAE,QAAQ,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,iCAAe,CAAC,CAAC;IAC/D,MAAM,eAAe,GAAG,IAAA,oBAAY,EAAC,0BAAiB,CAAC,WAAW,CAAC,CAAC;IAEpE,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE,CAAC,eAAe,EAAE,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC;IAExF,OAAO,CACH,iCAAK,SAAS,EAAE,CAAC,EAAE,aACd,KAAK,CAAC,CAAC,CAAC,CACL,uBAAC,uBAAU,IACP,OAAO,EAAE,KAAK,EACd,SAAS,EAAE;oBACP,WAAW,EAAE,IAAI;oBACjB,+BAA+B;iBAClC,EACD,gBAAgB,EAAE,CAAC,CAAC,OAAO,CAAC,EAC5B,OAAO,EAAC,IAAI,GACd,CACL,CAAC,CAAC,CAAC,CACA,+BAAI,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YAAG,IAAA,WAAI,EAAC,mBAAmB,CAAC,GAAM,CAC9D,EACD,gCAAK,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,YACrB,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;oBAChB,MAAM,GAAG,GAAG,IAAA,uBAAe,EAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC;oBAChD,MAAM,SAAS,GAAG,IAAA,oBAAY,EAAC,GAAG,EAAE,IAAI,CAAC,CAAC;oBAC1C,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC;oBACzB,MAAM,QAAQ,GAAG,IAAA,WAAI,EAAC,GAAG,IAAI,QAAQ,CAAC,CAAC;oBACvC,MAAM,WAAW,GAAG,IAAA,WAAI,EAAC,GAAG,IAAI,QAAQ,CAAC,CAAC;oBAE1C,OAAO,CACH,uBAAC,cAAM,IAEH,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,GAAG,EACR,MAAM,EAAC,QAAQ,EACf,IAAI,EAAE,SAAS,EACf,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,IAAI,EAAE,IAAI,CAAC,WAAW,EAAE,EAAC,CAAC,EAChD,OAAO,EAAE,iBAAiB,EAC1B,KAAK,EAAE,QAAQ,EACf,UAAU,EAAE;4BACR,YAAY,EAAE,WAAW;yBAC5B,YAEA,IAAI,IAAI,uBAAC,YAAI,IAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,EAAE,SAAS,EAAE,CAAC,CAAC,MAAM,EAAE,EAAC,IAAI,EAAC,CAAC,GAAI,IAZhE,IAAI,CAaJ,CACZ,CAAC;gBACN,CAAC,CAAC,GACA,IACJ,CACT,CAAC;AACN,CAAC,CAAC;AAEF,kBAAe,KAAK,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {Button, Icon} from '@gravity-ui/uikit';\n\nimport {YFMWrapper} from '../../components';\nimport {LocationContext} from '../../context/locationContext';\nimport {useAnalytics} from '../../hooks';\nimport {Facebook} from '../../icons/Facebook';\nimport {Linkedin} from '../../icons/Linkedin';\nimport {Telegram} from '../../icons/Telegram';\nimport {Twitter} from '../../icons/Twitter';\nimport {Vk} from '../../icons/Vk';\nimport {DefaultEventNames, ShareBlockProps} from '../../models';\nimport {block, getAbsolutePath, getShareLink} from '../../utils';\n\nimport {i18n} from './i18n';\n\nimport './Share.scss';\n\ninterface IconsProps {\n [key: string]: React.FC<React.SVGProps<SVGSVGElement>>;\n}\n\nconst icons: IconsProps = {\n facebook: Facebook,\n twitter: Twitter,\n linkedin: Linkedin,\n vk: Vk,\n telegram: Telegram,\n};\n\nconst b = block('share-block');\n\nconst Share = ({items, title}: ShareBlockProps) => {\n const {pathname, hostname} = React.useContext(LocationContext);\n const handleAnalytics = useAnalytics(DefaultEventNames.ShareButton);\n\n const handleButtonClick = React.useCallback(() => handleAnalytics(), [handleAnalytics]);\n\n return (\n <div className={b()}>\n {title ? (\n <YFMWrapper\n content={title}\n modifiers={{\n constructor: true,\n // constructorTheme: textTheme,\n }}\n contentClassName={b('title')}\n tagName=\"h5\"\n />\n ) : (\n <h5 className={b('title')}>{i18n('constructor-share')}</h5>\n )}\n <div className={b('items')}>\n {items.map((type) => {\n const url = getAbsolutePath(hostname, pathname);\n const socialUrl = getShareLink(url, type);\n const icon = icons[type];\n const urlTitle = i18n(`${type}-title`);\n const buttonLabel = i18n(`${type}-label`);\n\n return (\n <Button\n key={type}\n view=\"flat\"\n size=\"l\"\n target=\"_blank\"\n href={socialUrl}\n className={b('item', {type: type.toLowerCase()})}\n onClick={handleButtonClick}\n title={urlTitle}\n extraProps={{\n 'aria-label': buttonLabel,\n }}\n >\n {icon && <Icon data={icon} size={24} className={b('icon', {type})} />}\n </Button>\n );\n })}\n </div>\n </div>\n );\n};\n\nexport default Share;\n"]}