@gravity-ui/page-constructor 7.0.0-beta.1 → 7.0.0-beta.3

package/build/esm/blocks/Tabs/Tabs.css

@@ -36,76 +36,4 @@ unpredictable css rules order in build */
     padding-left: 24px;
     padding-right: 16px;
   }
-}
-.pc-tabs-block__row_reverse {
-  flex-direction: row-reverse;
-}
-.pc-tabs-block__image {
-  width: 100%;
-  height: auto;
-  object-fit: cover;
-  display: block;
-}
-.pc-tabs-block__image_border_shadow, .pc-tabs-block__media_border_shadow {
-  box-shadow: 0 2px 8px var(--pc-color-sfx-shadow), 0 4px 24px var(--pc-color-sfx-shadow);
-  overflow-x: hidden;
-  border-radius: var(--pc-border-radius);
-}
-.pc-tabs-block__image_border_line, .pc-tabs-block__media_border_line {
-  border-radius: var(--pc-border-radius);
-  border: 1px solid var(--g-color-line-generic);
-}
-.pc-tabs-block__image_border_none, .pc-tabs-block__media_border_none {
-  border-radius: var(--pc-border-radius);
-}
-.pc-tabs-block__caption {
-  font-size: var(--g-text-body-2-font-size);
-  line-height: var(--g-text-body-2-line-height);
-  margin: 12px 0 0;
-}
-.pc-tabs-block__caption.pc-tabs-block__caption .yfm,
-.pc-tabs-block__caption.pc-tabs-block__caption .yfm > * {
-  color: var(--g-color-text-secondary);
-}
-.pc-tabs-block__caption.pc-tabs-block__caption .yfm a {
-  color: var(--g-color-text-secondary);
-  text-decoration: underline;
-}
-.pc-tabs-block__caption.pc-tabs-block__caption .yfm a:hover {
-  color: var(--g-color-text-primary);
-}
-
-.pc-tabs-block__col_centered {
-  margin: 0 auto;
-}
-@media (max-width: 769px) {
-  .pc-tabs-block__row_reverse {
-    flex-direction: column-reverse;
-  }
-}
-@media (min-width: 769px) {
-  .pc-tabs-block.pc-AnimateBlock .pc-tabs-block__media, .pc-AnimateBlock .pc-tabs-block .pc-tabs-block__media {
-    position: relative;
-    top: 100px;
-    opacity: 0;
-  }
-  .pc-tabs-block.pc-AnimateBlock.animate .pc-tabs-block__media, .pc-AnimateBlock .pc-tabs-block.animate .pc-tabs-block__media {
-    top: 0;
-    opacity: 1;
-    transition: top 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
-    transition-delay: 0s;
-  }
-}
-@media (min-width: 769px) {
-  .pc-tabs-block.pc-AnimateBlock .pc-tabs-block__image, .pc-AnimateBlock .pc-tabs-block .pc-tabs-block__image {
-    position: relative;
-    top: 100px;
-    opacity: 0;
-  }
-  .pc-tabs-block.pc-AnimateBlock.animate .pc-tabs-block__image, .pc-AnimateBlock .pc-tabs-block.animate .pc-tabs-block__image {
-    top: 0;
-    opacity: 1;
-    transition: top 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
-    transition-delay: 0s;
-  }
 }

package/build/esm/blocks/Tabs/Tabs.js

@@ -1,80 +1,34 @@
-import { createElement as _createElement } from "react";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useUniqId } from '@gravity-ui/uikit';
 import * as React from 'react';
 import AnimateBlock from "../../components/AnimateBlock/AnimateBlock.js";
 import ButtonTabs from "../../components/ButtonTabs/ButtonTabs.js";
-import FullscreenImage from "../../components/FullscreenImage/FullscreenImage.js";
-import { getMediaImage } from "../../components/Media/Image/utils.js";
-import Media from "../../components/Media/Media.js";
 import Title from "../../components/Title/Title.js";
-import { getHeight } from "../../components/VideoBlock/VideoBlock.js";
-import YFMWrapper from "../../components/YFMWrapper/YFMWrapper.js";
-import { useTheme } from "../../context/theme/index.js";
-import { Col, GridColumnOrderClasses, GridJustifyContent, Row } from "../../grid/index.js";
-import { block, getThemedValue } from "../../utils/index.js";
-import { mergeVideoMicrodata } from "../../utils/microdata.js";
-import TabsTextContent from "./TabsTextContent/TabsTextContent.js";
+import { Col, GridJustifyContent, Row } from "../../grid/index.js";
+import { block } from "../../utils/index.js";
 import './Tabs.css';
+import { TabContent } from "./TabContent/TabContent.js";
+import { getUniqId } from '@gravity-ui/uikit';
 const b = block('tabs-block');
-// eslint-disable-next-line complexity
 export const TabsBlock = ({ items, title, description, animated, tabsColSizes, centered, direction = 'media-content', contentSize = 's', }) => {
-    var _a, _b;
     const [activeTab, setActiveTab] = React.useState(items[0].tabName);
     const [play, setPlay] = React.useState(false);
-    const theme = useTheme();
     const tabs = items.map(({ tabName }) => ({ title: tabName, id: tabName }));
-    const activeTabData = items.find(({ tabName }) => tabName === activeTab);
     const isReverse = direction === 'content-media';
-    const ref = React.useRef(null);
-    const mediaWidth = (_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.offsetWidth;
-    const captionId = useUniqId();
-    const themedMedia = getThemedValue(activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media, theme);
-    const hasNoImage = !(themedMedia === null || themedMedia === void 0 ? void 0 : themedMedia.image) && !(activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.image);
-    const mediaVideoHeight = hasNoImage && mediaWidth && getHeight(mediaWidth);
-    const [minImageHeight, setMinImageHeight] = React.useState((_b = ref === null || ref === void 0 ? void 0 : ref.current) === null || _b === void 0 ? void 0 : _b.offsetHeight);
-    // TODO remove property support activeTabData?.image. Use only activeTabData?.media?.image
-    let imageProps;
-    const handleImageHeight = React.useCallback(() => {
-        var _a, _b;
-        if (minImageHeight !== ((_a = ref === null || ref === void 0 ? void 0 : ref.current) === null || _a === void 0 ? void 0 : _a.offsetHeight)) {
-            setMinImageHeight((_b = ref === null || ref === void 0 ? void 0 : ref.current) === null || _b === void 0 ? void 0 : _b.offsetHeight);
-        }
-    }, [minImageHeight]);
-    const onSelectTab = React.useCallback((id, e) => {
-        setActiveTab(id);
+    const tabIds = React.useMemo(() => items.reduce((acc, { tabName }) => Object.assign(acc, { [tabName]: getUniqId() }), {}), [items]);
+    const getTabElementId = (tabId) => `${tabIds[tabId]}`;
+    const getTabContentElementId = (tabId) => `${tabIds[tabId]}-content`;
+    const onSelectTab = React.useCallback((tabId, e) => {
+        setActiveTab(tabId);
         e.currentTarget.scrollIntoView({
             inline: 'center',
             behavior: 'smooth',
             block: 'nearest',
         });
     }, []);
-    React.useEffect(() => {
-        handleImageHeight();
-    }, [activeTab, handleImageHeight]);
-    if (activeTabData) {
-        const themedImage = getThemedValue(activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.image, theme);
-        imageProps = themedImage && getMediaImage(themedImage);
-        if (activeTabData.caption && imageProps) {
-            Object.assign(imageProps, {
-                'aria-describedby': captionId,
-            });
-        }
-    }
-    const showMedia = Boolean((activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media) || imageProps);
-    const showText = Boolean(activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.text);
-    const border = (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.border) || 'shadow';
-    const textContent = showText && (_jsx(TabsTextContent, { showMedia: showMedia, data: activeTabData, imageProps: imageProps ? imageProps : undefined, isReverse: isReverse, contentSize: contentSize, centered: centered }));
-    const mediaContent = showMedia && (_jsxs(Col, { sizes: { all: 12, md: 8 }, orders: {
-            all: GridColumnOrderClasses.Last,
-            md: GridColumnOrderClasses.First,
-        }, className: b('col', { centered: centered }), children: [(activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.media) && (_jsx("div", { style: { minHeight: mediaVideoHeight || minImageHeight }, children: _jsx("div", { ref: ref, children: _createElement(Media, Object.assign({}, mergeVideoMicrodata(getThemedValue(activeTabData.media, theme), {
-                        name: activeTabData.tabName,
-                        description: activeTabData.caption
-                            ? activeTabData.caption
-                            : undefined,
-                    }), { key: activeTab, className: b('media', { border }), playVideo: play, height: mediaVideoHeight || undefined, onImageLoad: handleImageHeight })) }) })), imageProps && (_jsx(React.Fragment, { children: _jsx(FullscreenImage, Object.assign({}, imageProps, { imageClassName: b('image', { border }) })) })), (activeTabData === null || activeTabData === void 0 ? void 0 : activeTabData.caption) && (_jsx("p", { className: b('caption'), id: captionId, children: _jsx(YFMWrapper, { content: activeTabData.caption, modifiers: { constructor: true }, id: captionId }) }))] }));
-    return (_jsxs(AnimateBlock, { className: b(), onScroll: () => setPlay(true), animate: animated, children: [_jsx(Title, { title: title, subtitle: description, className: b('title', { centered: centered }) }), _jsx(Row, { justifyContent: centered ? GridJustifyContent.Center : undefined, children: _jsx(Col, { sizes: tabsColSizes, children: _jsx(ButtonTabs, { items: tabs, onSelectTab: onSelectTab, activeTab: activeTab, className: b('tabs', { centered: centered }) }) }) }), activeTabData && (_jsxs(Row, { className: b('row', { reverse: isReverse }), children: [mediaContent, textContent] }))] }));
+    return (_jsxs(AnimateBlock, { className: b(), onScroll: () => setPlay(true), animate: animated, children: [_jsx(Title, { title: title, subtitle: description, className: b('title', { centered: centered }) }), _jsx(Row, { justifyContent: centered ? GridJustifyContent.Center : undefined, children: _jsx(Col, { sizes: tabsColSizes, children: _jsx(ButtonTabs, { items: tabs, onSelectTab: onSelectTab, activeTab: activeTab, className: b('tabs', { centered: centered }), getTabElementId: getTabElementId, getTabContentElementId: getTabContentElementId }) }) }), items.map((tabData) => {
+                const { tabName } = tabData;
+                return (_jsx(TabContent, { tabData: tabData, isActive: tabName === activeTab, isReverse: isReverse, contentSize: contentSize, centered: centered, play: play, getTabElementId: getTabElementId, getTabContentElementId: getTabContentElementId }, tabName));
+            })] }));
 };
 export default TabsBlock;
 //# sourceMappingURL=Tabs.js.map

package/build/esm/blocks/Tabs/Tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sourceRoot":"../../../../src","sources":["blocks/Tabs/Tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import {useUniqId} from '@gravity-ui/uikit';\nimport * as React from 'react';\n\nimport AnimateBlock from '../../components/AnimateBlock/AnimateBlock';\nimport ButtonTabs, {ButtonTabsItemProps} from '../../components/ButtonTabs/ButtonTabs';\nimport FullscreenImage from '../../components/FullscreenImage/FullscreenImage';\nimport {getMediaImage} from '../../components/Media/Image/utils';\nimport Media from '../../components/Media/Media';\nimport Title from '../../components/Title/Title';\nimport {getHeight} from '../../components/VideoBlock/VideoBlock';\nimport YFMWrapper from '../../components/YFMWrapper/YFMWrapper';\nimport {useTheme} from '../../context/theme';\nimport {Col, GridColumnOrderClasses, GridJustifyContent, Row} from '../../grid';\nimport {TabsBlockProps} from '../../models';\nimport {block, getThemedValue} from '../../utils';\nimport {mergeVideoMicrodata} from '../../utils/microdata';\n\nimport TabsTextContent from './TabsTextContent/TabsTextContent';\nimport './Tabs.scss';\n\nconst b = block('tabs-block');\n\n// eslint-disable-next-line complexity\nexport const TabsBlock = ({\n    items,\n    title,\n    description,\n    animated,\n    tabsColSizes,\n    centered,\n    direction = 'media-content',\n    contentSize = 's',\n}: TabsBlockProps) => {\n    const [activeTab, setActiveTab] = React.useState<string | null>(items[0].tabName);\n    const [play, setPlay] = React.useState<boolean>(false);\n    const theme = useTheme();\n    const tabs: ButtonTabsItemProps[] = items.map(({tabName}) => ({title: tabName, id: tabName}));\n    const activeTabData = items.find(({tabName}) => tabName === activeTab);\n    const isReverse = direction === 'content-media';\n    const ref = React.useRef<HTMLDivElement>(null);\n    const mediaWidth = ref?.current?.offsetWidth;\n    const captionId = useUniqId();\n    const themedMedia = getThemedValue(activeTabData?.media, theme);\n    const hasNoImage = !themedMedia?.image && !activeTabData?.image;\n    const mediaVideoHeight = hasNoImage && mediaWidth && getHeight(mediaWidth);\n    const [minImageHeight, setMinImageHeight] = React.useState(ref?.current?.offsetHeight);\n    // TODO remove property support activeTabData?.image. Use only activeTabData?.media?.image\n    let imageProps;\n\n    const handleImageHeight = React.useCallback(() => {\n        if (minImageHeight !== ref?.current?.offsetHeight) {\n            setMinImageHeight(ref?.current?.offsetHeight);\n        }\n    }, [minImageHeight]);\n\n    const onSelectTab = React.useCallback(\n        (id: string | null, e: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n            setActiveTab(id);\n            e.currentTarget.scrollIntoView({\n                inline: 'center',\n                behavior: 'smooth',\n                block: 'nearest',\n            });\n        },\n        [],\n    );\n\n    React.useEffect(() => {\n        handleImageHeight();\n    }, [activeTab, handleImageHeight]);\n\n    if (activeTabData) {\n        const themedImage = getThemedValue(activeTabData?.image, theme);\n\n        imageProps = themedImage && getMediaImage(themedImage);\n\n        if (activeTabData.caption && imageProps) {\n            Object.assign(imageProps, {\n                'aria-describedby': captionId,\n            });\n        }\n    }\n\n    const showMedia = Boolean(activeTabData?.media || imageProps);\n    const showText = Boolean(activeTabData?.text);\n    const border = activeTabData?.border || 'shadow';\n\n    const textContent = showText && (\n        <TabsTextContent\n            showMedia={showMedia}\n            data={activeTabData}\n            imageProps={imageProps ? imageProps : undefined}\n            isReverse={isReverse}\n            contentSize={contentSize}\n            centered={centered}\n        />\n    );\n\n    const mediaContent = showMedia && (\n        <Col\n            sizes={{all: 12, md: 8}}\n            orders={{\n                all: GridColumnOrderClasses.Last,\n                md: GridColumnOrderClasses.First,\n            }}\n            className={b('col', {centered: centered})}\n        >\n            {activeTabData?.media && (\n                <div style={{minHeight: mediaVideoHeight || minImageHeight}}>\n                    <div ref={ref}>\n                        <Media\n                            {...mergeVideoMicrodata(getThemedValue(activeTabData.media, theme), {\n                                name: activeTabData.tabName,\n                                description: activeTabData.caption\n                                    ? activeTabData.caption\n                                    : undefined,\n                            })}\n                            key={activeTab}\n                            className={b('media', {border})}\n                            playVideo={play}\n                            height={mediaVideoHeight || undefined}\n                            onImageLoad={handleImageHeight}\n                        />\n                    </div>\n                </div>\n            )}\n            {imageProps && (\n                <React.Fragment>\n                    <FullscreenImage {...imageProps} imageClassName={b('image', {border})} />\n                </React.Fragment>\n            )}\n            {activeTabData?.caption && (\n                <p className={b('caption')} id={captionId}>\n                    <YFMWrapper\n                        content={activeTabData.caption}\n                        modifiers={{constructor: true}}\n                        id={captionId}\n                    />\n                </p>\n            )}\n        </Col>\n    );\n\n    return (\n        <AnimateBlock className={b()} onScroll={() => setPlay(true)} animate={animated}>\n            <Title\n                title={title}\n                subtitle={description}\n                className={b('title', {centered: centered})}\n            />\n            <Row justifyContent={centered ? GridJustifyContent.Center : undefined}>\n                <Col sizes={tabsColSizes}>\n                    <ButtonTabs\n                        items={tabs}\n                        onSelectTab={onSelectTab}\n                        activeTab={activeTab}\n                        className={b('tabs', {centered: centered})}\n                    />\n                </Col>\n            </Row>\n            {activeTabData && (\n                <Row className={b('row', {reverse: isReverse})}>\n                    {mediaContent}\n                    {textContent}\n                </Row>\n            )}\n        </AnimateBlock>\n    );\n};\n\nexport default TabsBlock;\n"]}
+{"version":3,"file":"Tabs.js","sourceRoot":"../../../../src","sources":["blocks/Tabs/Tabs.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport AnimateBlock from '../../components/AnimateBlock/AnimateBlock';\nimport ButtonTabs, {ButtonTabsItemProps} from '../../components/ButtonTabs/ButtonTabs';\nimport Title from '../../components/Title/Title';\nimport {Col, GridJustifyContent, Row} from '../../grid';\nimport {TabsBlockProps} from '../../models';\nimport {block} from '../../utils';\nimport './Tabs.scss';\nimport {TabContent} from './TabContent/TabContent';\nimport {getUniqId} from '@gravity-ui/uikit';\n\nconst b = block('tabs-block');\n\nexport const TabsBlock = ({\n    items,\n    title,\n    description,\n    animated,\n    tabsColSizes,\n    centered,\n    direction = 'media-content',\n    contentSize = 's',\n}: TabsBlockProps) => {\n    const [activeTab, setActiveTab] = React.useState<string | null>(items[0].tabName);\n    const [play, setPlay] = React.useState<boolean>(false);\n\n    const tabs: ButtonTabsItemProps[] = items.map(({tabName}) => ({title: tabName, id: tabName}));\n    const isReverse = direction === 'content-media';\n\n    const tabIds = React.useMemo(\n        () =>\n            items.reduce(\n                (acc, {tabName}) => Object.assign(acc, {[tabName]: getUniqId()}),\n                {} as Record<string, string>,\n            ),\n        [items],\n    );\n\n    const getTabElementId = (tabId: string) => `${tabIds[tabId]}`;\n    const getTabContentElementId = (tabId: string) => `${tabIds[tabId]}-content`;\n\n    const onSelectTab = React.useCallback(\n        (tabId: string | null, e: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => {\n            setActiveTab(tabId);\n            e.currentTarget.scrollIntoView({\n                inline: 'center',\n                behavior: 'smooth',\n                block: 'nearest',\n            });\n        },\n        [],\n    );\n\n    return (\n        <AnimateBlock className={b()} onScroll={() => setPlay(true)} animate={animated}>\n            <Title\n                title={title}\n                subtitle={description}\n                className={b('title', {centered: centered})}\n            />\n            <Row justifyContent={centered ? GridJustifyContent.Center : undefined}>\n                <Col sizes={tabsColSizes}>\n                    <ButtonTabs\n                        items={tabs}\n                        onSelectTab={onSelectTab}\n                        activeTab={activeTab}\n                        className={b('tabs', {centered: centered})}\n                        getTabElementId={getTabElementId}\n                        getTabContentElementId={getTabContentElementId}\n                    />\n                </Col>\n            </Row>\n            {items.map((tabData) => {\n                const {tabName} = tabData;\n\n                return (\n                    <TabContent\n                        key={tabName}\n                        tabData={tabData}\n                        isActive={tabName === activeTab}\n                        isReverse={isReverse}\n                        contentSize={contentSize}\n                        centered={centered}\n                        play={play}\n                        getTabElementId={getTabElementId}\n                        getTabContentElementId={getTabContentElementId}\n                    />\n                );\n            })}\n        </AnimateBlock>\n    );\n};\n\nexport default TabsBlock;\n"]}

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

@@ -8,32 +8,47 @@ export const tabsItem = {
     type: 'object',
     additionalProperties: false,
     required: ['tabName'],
-    properties: Object.assign(Object.assign({}, TabsItemContentProps), { tabName: {
+    properties: {
+        ...TabsItemContentProps,
+        tabName: {
             type: 'string',
-        }, caption: {
+        },
+        caption: {
             type: 'string',
             contentType: 'text',
-        }, media: withTheme({
+        },
+        media: withTheme({
             type: 'object',
             properties: MediaProps,
-        }), 
+        }),
         //TODO deprecated
-        link: LinkProps, image: withTheme(ImageProps), border: {
+        link: LinkProps,
+        image: withTheme(ImageProps),
+        border: {
             type: 'string',
             enum: ['shadow', 'line', 'none'],
-        } }),
+        },
+    },
 };
 export const TabsBlock = {
     'tabs-block': {
         additionalProperties: false,
         required: ['title', 'items'],
-        properties: Object.assign(Object.assign(Object.assign({}, BlockBaseProps), BlockHeaderProps), { tabsColSizes: containerSizesArray.reduce((acc, size) => (Object.assign(Object.assign({}, acc), { [size]: sizeNumber })), {}), direction: {
+        properties: {
+            ...BlockBaseProps,
+            ...BlockHeaderProps,
+            tabsColSizes: containerSizesArray.reduce((acc, size) => ({ ...acc, [size]: sizeNumber }), {}),
+            direction: {
                 type: 'string',
                 enum: mediaDirection,
-            }, centered: { type: 'boolean' }, items: filteredArray(tabsItem), contentSize: {
+            },
+            centered: { type: 'boolean' },
+            items: filteredArray(tabsItem),
+            contentSize: {
                 type: 'string',
                 enum: contentSizes,
-            } }),
+            },
+        },
     },
 };
 //# sourceMappingURL=schema.js.map

package/build/esm/blocks/Tabs/schema.js.map

@@ -1 +1 @@
-{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["blocks/Tabs/schema.ts"],"names":[],"mappings":"AAAA,OAAO,IAAI,uBAAoB;AAE/B,OAAO,EAAC,UAAU,EAAC,yCAAsC;AACzD,OAAO,EACH,cAAc,EACd,gBAAgB,EAChB,SAAS,EACT,UAAU,EACV,mBAAmB,EACnB,YAAY,EACZ,cAAc,EACd,UAAU,EACV,SAAS,GACZ,0CAAuC;AACxC,OAAO,EAAC,aAAa,EAAC,yCAAsC;AAC5D,OAAO,EAAC,WAAW,EAAC,2CAAwC;AAE5D,MAAM,oBAAoB,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;AAE1F,MAAM,CAAC,MAAM,QAAQ,GAAG;IACpB,IAAI,EAAE,QAAQ;IACd,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,SAAS,CAAC;IACrB,UAAU,kCACH,oBAAoB,KACvB,OAAO,EAAE;YACL,IAAI,EAAE,QAAQ;SACjB,EACD,OAAO,EAAE;YACL,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,MAAM;SACtB,EACD,KAAK,EAAE,SAAS,CAAC;YACb,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE,UAAU;SACzB,CAAC;QACF,iBAAiB;QACjB,IAAI,EAAE,SAAS,EACf,KAAK,EAAE,SAAS,CAAC,UAAU,CAAC,EAC5B,MAAM,EAAE;YACJ,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC;SACnC,GACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG;IACrB,YAAY,EAAE;QACV,oBAAoB,EAAE,KAAK;QAC3B,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC;QAC5B,UAAU,gDACH,cAAc,GACd,gBAAgB,KACnB,YAAY,EAAE,mBAAmB,CAAC,MAAM,CACpC,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE,CAAC,iCAAK,GAAG,KAAE,CAAC,IAAI,CAAC,EAAE,UAAU,IAAE,EAC7C,EAAE,CACL,EACD,SAAS,EAAE;gBACP,IAAI,EAAE,QAAQ;gBACd,IAAI,EAAE,cAAc;aACvB,EACD,QAAQ,EAAE,EAAC,IAAI,EAAE,SAAS,EAAC,EAC3B,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC,EAC9B,WAAW,EAAE;gBACT,IAAI,EAAE,QAAQ;gBACd,IAAI,EAAE,YAAY;aACrB,GACJ;KACJ;CACJ,CAAC","sourcesContent":["import omit from 'lodash/omit';\n\nimport {ImageProps} from '../../components/Image/schema';\nimport {\n    BlockBaseProps,\n    BlockHeaderProps,\n    LinkProps,\n    MediaProps,\n    containerSizesArray,\n    contentSizes,\n    mediaDirection,\n    sizeNumber,\n    withTheme,\n} from '../../schema/validators/common';\nimport {filteredArray} from '../../schema/validators/utils';\nimport {ContentBase} from '../../sub-blocks/Content/schema';\n\nconst TabsItemContentProps = omit(ContentBase, ['size', 'colSizes', 'centered', 'theme']);\n\nexport const tabsItem = {\n    type: 'object',\n    additionalProperties: false,\n    required: ['tabName'],\n    properties: {\n        ...TabsItemContentProps,\n        tabName: {\n            type: 'string',\n        },\n        caption: {\n            type: 'string',\n            contentType: 'text',\n        },\n        media: withTheme({\n            type: 'object',\n            properties: MediaProps,\n        }),\n        //TODO deprecated\n        link: LinkProps,\n        image: withTheme(ImageProps),\n        border: {\n            type: 'string',\n            enum: ['shadow', 'line', 'none'],\n        },\n    },\n};\n\nexport const TabsBlock = {\n    'tabs-block': {\n        additionalProperties: false,\n        required: ['title', 'items'],\n        properties: {\n            ...BlockBaseProps,\n            ...BlockHeaderProps,\n            tabsColSizes: containerSizesArray.reduce(\n                (acc, size) => ({...acc, [size]: sizeNumber}),\n                {},\n            ),\n            direction: {\n                type: 'string',\n                enum: mediaDirection,\n            },\n            centered: {type: 'boolean'},\n            items: filteredArray(tabsItem),\n            contentSize: {\n                type: 'string',\n                enum: contentSizes,\n            },\n        },\n    },\n};\n"]}
+{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["blocks/Tabs/schema.ts"],"names":[],"mappings":"AAAA,OAAO,IAAI,uBAAoB;AAE/B,OAAO,EAAC,UAAU,EAAC,yCAAsC;AACzD,OAAO,EACH,cAAc,EACd,gBAAgB,EAChB,SAAS,EACT,UAAU,EACV,mBAAmB,EACnB,YAAY,EACZ,cAAc,EACd,UAAU,EACV,SAAS,GACZ,0CAAuC;AACxC,OAAO,EAAC,aAAa,EAAC,yCAAsC;AAC5D,OAAO,EAAC,WAAW,EAAC,2CAAwC;AAE5D,MAAM,oBAAoB,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;AAE1F,MAAM,CAAC,MAAM,QAAQ,GAAG;IACpB,IAAI,EAAE,QAAQ;IACd,oBAAoB,EAAE,KAAK;IAC3B,QAAQ,EAAE,CAAC,SAAS,CAAC;IACrB,UAAU,EAAE;QACR,GAAG,oBAAoB;QACvB,OAAO,EAAE;YACL,IAAI,EAAE,QAAQ;SACjB;QACD,OAAO,EAAE;YACL,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,MAAM;SACtB;QACD,KAAK,EAAE,SAAS,CAAC;YACb,IAAI,EAAE,QAAQ;YACd,UAAU,EAAE,UAAU;SACzB,CAAC;QACF,iBAAiB;QACjB,IAAI,EAAE,SAAS;QACf,KAAK,EAAE,SAAS,CAAC,UAAU,CAAC;QAC5B,MAAM,EAAE;YACJ,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,MAAM,CAAC;SACnC;KACJ;CACJ,CAAC;AAEF,MAAM,CAAC,MAAM,SAAS,GAAG;IACrB,YAAY,EAAE;QACV,oBAAoB,EAAE,KAAK;QAC3B,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,CAAC;QAC5B,UAAU,EAAE;YACR,GAAG,cAAc;YACjB,GAAG,gBAAgB;YACnB,YAAY,EAAE,mBAAmB,CAAC,MAAM,CACpC,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE,CAAC,CAAC,EAAC,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,EAAE,UAAU,EAAC,CAAC,EAC7C,EAAE,CACL;YACD,SAAS,EAAE;gBACP,IAAI,EAAE,QAAQ;gBACd,IAAI,EAAE,cAAc;aACvB;YACD,QAAQ,EAAE,EAAC,IAAI,EAAE,SAAS,EAAC;YAC3B,KAAK,EAAE,aAAa,CAAC,QAAQ,CAAC;YAC9B,WAAW,EAAE;gBACT,IAAI,EAAE,QAAQ;gBACd,IAAI,EAAE,YAAY;aACrB;SACJ;KACJ;CACJ,CAAC","sourcesContent":["import omit from 'lodash/omit';\n\nimport {ImageProps} from '../../components/Image/schema';\nimport {\n    BlockBaseProps,\n    BlockHeaderProps,\n    LinkProps,\n    MediaProps,\n    containerSizesArray,\n    contentSizes,\n    mediaDirection,\n    sizeNumber,\n    withTheme,\n} from '../../schema/validators/common';\nimport {filteredArray} from '../../schema/validators/utils';\nimport {ContentBase} from '../../sub-blocks/Content/schema';\n\nconst TabsItemContentProps = omit(ContentBase, ['size', 'colSizes', 'centered', 'theme']);\n\nexport const tabsItem = {\n    type: 'object',\n    additionalProperties: false,\n    required: ['tabName'],\n    properties: {\n        ...TabsItemContentProps,\n        tabName: {\n            type: 'string',\n        },\n        caption: {\n            type: 'string',\n            contentType: 'text',\n        },\n        media: withTheme({\n            type: 'object',\n            properties: MediaProps,\n        }),\n        //TODO deprecated\n        link: LinkProps,\n        image: withTheme(ImageProps),\n        border: {\n            type: 'string',\n            enum: ['shadow', 'line', 'none'],\n        },\n    },\n};\n\nexport const TabsBlock = {\n    'tabs-block': {\n        additionalProperties: false,\n        required: ['title', 'items'],\n        properties: {\n            ...BlockBaseProps,\n            ...BlockHeaderProps,\n            tabsColSizes: containerSizesArray.reduce(\n                (acc, size) => ({...acc, [size]: sizeNumber}),\n                {},\n            ),\n            direction: {\n                type: 'string',\n                enum: mediaDirection,\n            },\n            centered: {type: 'boolean'},\n            items: filteredArray(tabsItem),\n            contentSize: {\n                type: 'string',\n                enum: contentSizes,\n            },\n        },\n    },\n};\n"]}

package/build/esm/blocks/index.d.ts

@@ -9,6 +9,7 @@ export type { Swiper, SwiperOptions } from "./Slider/Slider.js";
 export { default as ExtendedFeaturesBlock } from "./ExtendedFeatures/ExtendedFeatures.js";
 export { default as PromoFeaturesBlock } from "./PromoFeaturesBlock/PromoFeaturesBlock.js";
 export { default as QuestionsBlock } from "./Questions/Questions.js";
+export { default as FoldableListBlock } from "./FoldableList/FoldableList.js";
 export { default as TableBlock } from "./Table/Table.js";
 export { default as TabsBlock } from "./Tabs/Tabs.js";
 export { default as HeaderBlock } from "./Header/Header.js";

package/build/esm/blocks/index.js

@@ -8,6 +8,7 @@ export { default as SliderBlock } from "./Slider/Slider.js";
 export { default as ExtendedFeaturesBlock } from "./ExtendedFeatures/ExtendedFeatures.js";
 export { default as PromoFeaturesBlock } from "./PromoFeaturesBlock/PromoFeaturesBlock.js";
 export { default as QuestionsBlock } from "./Questions/Questions.js";
+export { default as FoldableListBlock } from "./FoldableList/FoldableList.js";
 export { default as TableBlock } from "./Table/Table.js";
 export { default as TabsBlock } from "./Tabs/Tabs.js";
 export { default as HeaderBlock } from "./Header/Header.js";

package/build/esm/blocks/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../../../src","sources":["blocks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,IAAI,WAAW,EAAC,2BAAwB;AACvD,OAAO,EAAC,OAAO,IAAI,cAAc,EAAC,iCAA8B;AAChE,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,uBAAoB;AACjD,OAAO,EAAC,OAAO,IAAI,UAAU,EAAC,yBAAsB;AACpD,OAAO,EAAC,OAAO,IAAI,QAAQ,EAAC,qBAAkB;AAC9C,OAAO,EAAC,OAAO,IAAI,cAAc,EAAC,iCAA8B;AAChE,OAAO,EAAC,OAAO,IAAI,WAAW,EAAC,2BAAwB;AAEvD,OAAO,EAAC,OAAO,IAAI,qBAAqB,EAAC,+CAA4C;AACrF,OAAO,EAAC,OAAO,IAAI,kBAAkB,EAAC,mDAAgD;AACtF,OAAO,EAAC,OAAO,IAAI,cAAc,EAAC,iCAA8B;AAChE,OAAO,EAAC,OAAO,IAAI,UAAU,EAAC,yBAAsB;AACpD,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,uBAAoB;AACjD,OAAO,EAAC,OAAO,IAAI,WAAW,EAAC,2BAAwB;AACvD,OAAO,EAAC,OAAO,IAAI,UAAU,EAAC,yBAAsB;AACpD,OAAO,EAAC,OAAO,IAAI,iBAAiB,EAAC,uCAAoC;AACzE,OAAO,EAAC,OAAO,IAAI,eAAe,EAAC,mCAAgC;AACnE,OAAO,EAAC,OAAO,IAAI,kBAAkB,EAAC,yCAAsC;AAC5E,OAAO,EAAC,OAAO,IAAI,UAAU,EAAC,yBAAsB;AACpD,OAAO,EAAC,OAAO,IAAI,WAAW,EAAC,qCAAkC;AACjE,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,uBAAoB","sourcesContent":["export {default as BannerBlock} from './Banner/Banner';\nexport {default as CompaniesBlock} from './Companies/Companies';\nexport {default as InfoBlock} from './Info/Info';\nexport {default as MediaBlock} from './Media/Media';\nexport {default as MapBlock} from './Map/Map';\nexport {default as SliderOldBlock} from './SliderOld/SliderOld';\nexport {default as SliderBlock} from './Slider/Slider';\nexport type {Swiper, SwiperOptions} from './Slider/Slider';\nexport {default as ExtendedFeaturesBlock} from './ExtendedFeatures/ExtendedFeatures';\nexport {default as PromoFeaturesBlock} from './PromoFeaturesBlock/PromoFeaturesBlock';\nexport {default as QuestionsBlock} from './Questions/Questions';\nexport {default as TableBlock} from './Table/Table';\nexport {default as TabsBlock} from './Tabs/Tabs';\nexport {default as HeaderBlock} from './Header/Header';\nexport {default as IconsBlock} from './Icons/Icons';\nexport {default as HeaderSliderBlock} from './HeaderSlider/HeaderSlider';\nexport {default as CardLayoutBlock} from './CardLayout/CardLayout';\nexport {default as ContentLayoutBlock} from './ContentLayout/ContentLayout';\nexport {default as ShareBlock} from './Share/Share';\nexport {default as FilterBlock} from './FilterBlock/FilterBlock';\nexport {default as FormBlock} from './Form/Form';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"../../../src","sources":["blocks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,OAAO,IAAI,WAAW,EAAC,2BAAwB;AACvD,OAAO,EAAC,OAAO,IAAI,cAAc,EAAC,iCAA8B;AAChE,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,uBAAoB;AACjD,OAAO,EAAC,OAAO,IAAI,UAAU,EAAC,yBAAsB;AACpD,OAAO,EAAC,OAAO,IAAI,QAAQ,EAAC,qBAAkB;AAC9C,OAAO,EAAC,OAAO,IAAI,cAAc,EAAC,iCAA8B;AAChE,OAAO,EAAC,OAAO,IAAI,WAAW,EAAC,2BAAwB;AAEvD,OAAO,EAAC,OAAO,IAAI,qBAAqB,EAAC,+CAA4C;AACrF,OAAO,EAAC,OAAO,IAAI,kBAAkB,EAAC,mDAAgD;AACtF,OAAO,EAAC,OAAO,IAAI,cAAc,EAAC,iCAA8B;AAChE,OAAO,EAAC,OAAO,IAAI,iBAAiB,EAAC,uCAAoC;AACzE,OAAO,EAAC,OAAO,IAAI,UAAU,EAAC,yBAAsB;AACpD,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,uBAAoB;AACjD,OAAO,EAAC,OAAO,IAAI,WAAW,EAAC,2BAAwB;AACvD,OAAO,EAAC,OAAO,IAAI,UAAU,EAAC,yBAAsB;AACpD,OAAO,EAAC,OAAO,IAAI,iBAAiB,EAAC,uCAAoC;AACzE,OAAO,EAAC,OAAO,IAAI,eAAe,EAAC,mCAAgC;AACnE,OAAO,EAAC,OAAO,IAAI,kBAAkB,EAAC,yCAAsC;AAC5E,OAAO,EAAC,OAAO,IAAI,UAAU,EAAC,yBAAsB;AACpD,OAAO,EAAC,OAAO,IAAI,WAAW,EAAC,qCAAkC;AACjE,OAAO,EAAC,OAAO,IAAI,SAAS,EAAC,uBAAoB","sourcesContent":["export {default as BannerBlock} from './Banner/Banner';\nexport {default as CompaniesBlock} from './Companies/Companies';\nexport {default as InfoBlock} from './Info/Info';\nexport {default as MediaBlock} from './Media/Media';\nexport {default as MapBlock} from './Map/Map';\nexport {default as SliderOldBlock} from './SliderOld/SliderOld';\nexport {default as SliderBlock} from './Slider/Slider';\nexport type {Swiper, SwiperOptions} from './Slider/Slider';\nexport {default as ExtendedFeaturesBlock} from './ExtendedFeatures/ExtendedFeatures';\nexport {default as PromoFeaturesBlock} from './PromoFeaturesBlock/PromoFeaturesBlock';\nexport {default as QuestionsBlock} from './Questions/Questions';\nexport {default as FoldableListBlock} from './FoldableList/FoldableList';\nexport {default as TableBlock} from './Table/Table';\nexport {default as TabsBlock} from './Tabs/Tabs';\nexport {default as HeaderBlock} from './Header/Header';\nexport {default as IconsBlock} from './Icons/Icons';\nexport {default as HeaderSliderBlock} from './HeaderSlider/HeaderSlider';\nexport {default as CardLayoutBlock} from './CardLayout/CardLayout';\nexport {default as ContentLayoutBlock} from './ContentLayout/ContentLayout';\nexport {default as ShareBlock} from './Share/Share';\nexport {default as FilterBlock} from './FilterBlock/FilterBlock';\nexport {default as FormBlock} from './Form/Form';\n"]}

package/build/esm/components/Author/Author.js

@@ -15,7 +15,7 @@ const Author = (props) => {
     if (!isAvatarJSX && avatar) {
         avatarProps = getMediaImage(avatar);
     }
-    return (_jsxs("div", { className: b({ type, theme }, className), "data-qa": qa, children: [avatar && (_jsx("div", { className: b('avatar', authorContainerClassName), children: isAvatarJSX ? avatar : _jsx(Image, Object.assign({}, avatarProps)) })), _jsxs("div", { className: b('label'), children: [_jsx("div", { className: b('name'), children: name }), description && _jsx("div", { className: b('description'), children: description })] })] }));
+    return (_jsxs("div", { className: b({ type, theme }, className), "data-qa": qa, children: [avatar && (_jsx("div", { className: b('avatar', authorContainerClassName), children: isAvatarJSX ? avatar : _jsx(Image, { ...avatarProps }) })), _jsxs("div", { className: b('label'), children: [_jsx("div", { className: b('name'), children: name }), description && _jsx("div", { className: b('description'), children: description })] })] }));
 };
 export default Author;
 //# sourceMappingURL=Author.js.map

package/build/esm/components/Author/Author.js.map

@@ -1 +1 @@
-{"version":3,"file":"Author.js","sourceRoot":"../../../../src","sources":["components/Author/Author.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAc,UAAU,EAAa,8BAAqB;AACjE,OAAO,EAAC,KAAK,EAAC,6BAAoB;AAClC,OAAO,EAAC,aAAa,EAAC,gCAA6B;AACnD,OAAO,EAAC,KAAK,EAAC,oBAAiB;AAE/B,OAAO,cAAc,CAAC;AAEtB,MAAM,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC;AAE1B,MAAM,MAAM,GAAG,CAAC,KAA2C,EAAE,EAAE;IAC3D,MAAM,EACF,MAAM,EACN,SAAS,EACT,wBAAwB,EACxB,IAAI,GAAG,UAAU,CAAC,MAAM,EACxB,EAAE,EACF,KAAK,GACR,GAAG,KAAK,CAAC;IACV,MAAM,EAAC,SAAS,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,EAAC,GAAG,MAAM,CAAC;IAE5D,MAAM,IAAI,GAAG,UAAU,CAAC,CAAC,CAAC,GAAG,SAAS,IAAI,UAAU,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;IACnE,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;IACjD,IAAI,WAAW,GAAG,EAAE,CAAC;IACrB,IAAI,CAAC,WAAW,IAAI,MAAM,EAAE,CAAC;QACzB,WAAW,GAAG,aAAa,CAAC,MAAoB,CAAC,CAAC;IACtD,CAAC;IAED,OAAO,CACH,eAAK,SAAS,EAAE,CAAC,CAAC,EAAC,IAAI,EAAE,KAAK,EAAC,EAAE,SAAS,CAAC,aAAW,EAAE,aACnD,MAAM,IAAI,CACP,cAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,EAAE,wBAAwB,CAAC,YAChD,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAC,KAAK,oBAAK,WAAW,EAAI,GAChD,CACT,EACD,eAAK,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,aACtB,cAAK,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAAG,IAAI,GAAO,EACtC,WAAW,IAAI,cAAK,SAAS,EAAE,CAAC,CAAC,aAAa,CAAC,YAAG,WAAW,GAAO,IACnE,IACJ,CACT,CAAC;AACN,CAAC,CAAC;AACF,eAAe,MAAM,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {AuthorProps, AuthorType, ImageProps} from '../../models';\nimport {block} from '../../utils';\nimport {getMediaImage} from '../Media/Image/utils';\nimport {Image} from '../index';\n\nimport './Author.scss';\n\nconst b = block('author');\n\nconst Author = (props: React.PropsWithChildren<AuthorProps>) => {\n    const {\n        author,\n        className,\n        authorContainerClassName,\n        type = AuthorType.Column,\n        qa,\n        theme,\n    } = props;\n    const {firstName, secondName, description, avatar} = author;\n\n    const name = secondName ? `${firstName} ${secondName}` : firstName;\n    const isAvatarJSX = React.isValidElement(avatar);\n    let avatarProps = {};\n    if (!isAvatarJSX && avatar) {\n        avatarProps = getMediaImage(avatar as ImageProps);\n    }\n\n    return (\n        <div className={b({type, theme}, className)} data-qa={qa}>\n            {avatar && (\n                <div className={b('avatar', authorContainerClassName)}>\n                    {isAvatarJSX ? avatar : <Image {...avatarProps} />}\n                </div>\n            )}\n            <div className={b('label')}>\n                <div className={b('name')}>{name}</div>\n                {description && <div className={b('description')}>{description}</div>}\n            </div>\n        </div>\n    );\n};\nexport default Author;\n"]}
+{"version":3,"file":"Author.js","sourceRoot":"../../../../src","sources":["components/Author/Author.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAc,UAAU,EAAa,8BAAqB;AACjE,OAAO,EAAC,KAAK,EAAC,6BAAoB;AAClC,OAAO,EAAC,aAAa,EAAC,gCAA6B;AACnD,OAAO,EAAC,KAAK,EAAC,oBAAiB;AAE/B,OAAO,cAAc,CAAC;AAEtB,MAAM,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC;AAE1B,MAAM,MAAM,GAAG,CAAC,KAA2C,EAAE,EAAE;IAC3D,MAAM,EACF,MAAM,EACN,SAAS,EACT,wBAAwB,EACxB,IAAI,GAAG,UAAU,CAAC,MAAM,EACxB,EAAE,EACF,KAAK,GACR,GAAG,KAAK,CAAC;IACV,MAAM,EAAC,SAAS,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,EAAC,GAAG,MAAM,CAAC;IAE5D,MAAM,IAAI,GAAG,UAAU,CAAC,CAAC,CAAC,GAAG,SAAS,IAAI,UAAU,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;IACnE,MAAM,WAAW,GAAG,KAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;IACjD,IAAI,WAAW,GAAG,EAAE,CAAC;IACrB,IAAI,CAAC,WAAW,IAAI,MAAM,EAAE,CAAC;QACzB,WAAW,GAAG,aAAa,CAAC,MAAoB,CAAC,CAAC;IACtD,CAAC;IAED,OAAO,CACH,eAAK,SAAS,EAAE,CAAC,CAAC,EAAC,IAAI,EAAE,KAAK,EAAC,EAAE,SAAS,CAAC,aAAW,EAAE,aACnD,MAAM,IAAI,CACP,cAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,EAAE,wBAAwB,CAAC,YAChD,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,KAAC,KAAK,OAAK,WAAW,GAAI,GAChD,CACT,EACD,eAAK,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,aACtB,cAAK,SAAS,EAAE,CAAC,CAAC,MAAM,CAAC,YAAG,IAAI,GAAO,EACtC,WAAW,IAAI,cAAK,SAAS,EAAE,CAAC,CAAC,aAAa,CAAC,YAAG,WAAW,GAAO,IACnE,IACJ,CACT,CAAC;AACN,CAAC,CAAC;AACF,eAAe,MAAM,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {AuthorProps, AuthorType, ImageProps} from '../../models';\nimport {block} from '../../utils';\nimport {getMediaImage} from '../Media/Image/utils';\nimport {Image} from '../index';\n\nimport './Author.scss';\n\nconst b = block('author');\n\nconst Author = (props: React.PropsWithChildren<AuthorProps>) => {\n    const {\n        author,\n        className,\n        authorContainerClassName,\n        type = AuthorType.Column,\n        qa,\n        theme,\n    } = props;\n    const {firstName, secondName, description, avatar} = author;\n\n    const name = secondName ? `${firstName} ${secondName}` : firstName;\n    const isAvatarJSX = React.isValidElement(avatar);\n    let avatarProps = {};\n    if (!isAvatarJSX && avatar) {\n        avatarProps = getMediaImage(avatar as ImageProps);\n    }\n\n    return (\n        <div className={b({type, theme}, className)} data-qa={qa}>\n            {avatar && (\n                <div className={b('avatar', authorContainerClassName)}>\n                    {isAvatarJSX ? avatar : <Image {...avatarProps} />}\n                </div>\n            )}\n            <div className={b('label')}>\n                <div className={b('name')}>{name}</div>\n                {description && <div className={b('description')}>{description}</div>}\n            </div>\n        </div>\n    );\n};\nexport default Author;\n"]}

package/build/esm/components/Author/schema.js

@@ -3,7 +3,11 @@ export const author = {
     author: {
         additionalProperties: false,
         required: ['author'],
-        properties: Object.assign(Object.assign({}, BaseProps), { asides: {}, author: authorItem }),
+        properties: {
+            ...BaseProps,
+            asides: {},
+            author: authorItem,
+        },
     },
 };
 //# sourceMappingURL=schema.js.map

package/build/esm/components/Author/schema.js.map

@@ -1 +1 @@
-{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["components/Author/schema.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,UAAU,EAAC,0CAAuC;AAErE,MAAM,CAAC,MAAM,MAAM,GAAG;IAClB,MAAM,EAAE;QACJ,oBAAoB,EAAE,KAAK;QAC3B,QAAQ,EAAE,CAAC,QAAQ,CAAC;QACpB,UAAU,kCACH,SAAS,KACZ,MAAM,EAAE,EAAE,EACV,MAAM,EAAE,UAAU,GACrB;KACJ;CACJ,CAAC","sourcesContent":["import {BaseProps, authorItem} from '../../schema/validators/common';\n\nexport const author = {\n    author: {\n        additionalProperties: false,\n        required: ['author'],\n        properties: {\n            ...BaseProps,\n            asides: {},\n            author: authorItem,\n        },\n    },\n};\n"]}
+{"version":3,"file":"schema.js","sourceRoot":"../../../../src","sources":["components/Author/schema.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,UAAU,EAAC,0CAAuC;AAErE,MAAM,CAAC,MAAM,MAAM,GAAG;IAClB,MAAM,EAAE;QACJ,oBAAoB,EAAE,KAAK;QAC3B,QAAQ,EAAE,CAAC,QAAQ,CAAC;QACpB,UAAU,EAAE;YACR,GAAG,SAAS;YACZ,MAAM,EAAE,EAAE;YACV,MAAM,EAAE,UAAU;SACrB;KACJ;CACJ,CAAC","sourcesContent":["import {BaseProps, authorItem} from '../../schema/validators/common';\n\nexport const author = {\n    author: {\n        additionalProperties: false,\n        required: ['author'],\n        properties: {\n            ...BaseProps,\n            asides: {},\n            author: authorItem,\n        },\n    },\n};\n"]}

package/build/esm/components/BackLink/BackLink.js

@@ -28,6 +28,6 @@ export default function BackLink(props) {
         href: shouldHandleBackAction ? undefined : url,
         extraProps,
     };
-    return (_jsxs(Button, Object.assign({ className: className, view: theme === 'special' ? 'flat-contrast' : 'flat-secondary', size: size, onClick: shouldHandleBackAction ? backActionHandler : undefined, tabIndex: tabIndex }, buttonProps, { children: [_jsx(Icon, { data: ArrowLeft, size: 20 }), _jsx("span", { children: title })] })));
+    return (_jsxs(Button, { className: className, view: theme === 'special' ? 'flat-contrast' : 'flat-secondary', size: size, onClick: shouldHandleBackAction ? backActionHandler : undefined, tabIndex: tabIndex, ...buttonProps, children: [_jsx(Icon, { data: ArrowLeft, size: 20 }), _jsx("span", { children: title })] }));
 }
 //# sourceMappingURL=BackLink.js.map

package/build/esm/components/BackLink/BackLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"BackLink.js","sourceRoot":"../../../../src","sources":["components/BackLink/BackLink.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,SAAS,EAAC,MAAM,mBAAmB,CAAC;AAC5C,OAAO,EAAC,MAAM,EAAc,IAAI,EAAkC,MAAM,mBAAmB,CAAC;AAE5F,OAAO,EAAC,eAAe,EAAC,+CAAsC;AAC9D,OAAO,EAAC,YAAY,EAAC,6BAAoB;AACzC,OAAO,EAAC,iBAAiB,EAAW,8BAAqB;AAezD,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAoB;IACjD,MAAM,EAAC,OAAO,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,eAAe,CAAC,CAAC;IACpD,MAAM,EACF,GAAG,EACH,KAAK,EACL,KAAK,GAAG,SAAS,EACjB,IAAI,GAAG,GAAG,EACV,SAAS,EACT,sBAAsB,GAAG,KAAK,EAC9B,OAAO,EACP,QAAQ,EACR,UAAU,GACb,GAAG,KAAK,CAAC;IACV,MAAM,eAAe,GAAG,YAAY,CAAC,iBAAiB,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC;IAEzE,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,IAAI,EAAE;QACnD,eAAe,EAAE,CAAC;QAElB,IAAI,CAAC,OAAO,EAAE,CAAC;YACX,OAAO;QACX,CAAC;QAED,IAAI,OAAO,EAAE,CAAC;YACV,OAAO,EAAE,CAAC;QACd,CAAC;QAED,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACrB,OAAO,CAAC,MAAM,EAAE,CAAC;QACrB,CAAC;aAAM,CAAC;YACJ,OAAO,CAAC,IAAI,CAAC,EAAC,QAAQ,EAAE,GAAG,EAAC,CAAC,CAAC;QAClC,CAAC;IACL,CAAC,EAAE,CAAC,eAAe,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC;IAE7C,MAAM,WAAW,GAAG;QAChB,IAAI,EAAE,sBAAsB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG;QAC9C,UAAU;KACO,CAAC;IAEtB,OAAO,CACH,MAAC,MAAM,kBACH,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,gBAAgB,EAC9D,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,sBAAsB,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,EAC/D,QAAQ,EAAE,QAAQ,IACd,WAAW,eAEf,KAAC,IAAI,IAAC,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,GAAI,EACnC,yBAAO,KAAK,GAAQ,KACf,CACZ,CAAC;AACN,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {ArrowLeft} from '@gravity-ui/icons';\nimport {Button, ButtonSize, Icon, ButtonProps as UIKitButtonProps} from '@gravity-ui/uikit';\n\nimport {LocationContext} from '../../context/locationContext';\nimport {useAnalytics} from '../../hooks';\nimport {DefaultEventNames, Tabbable} from '../../models';\n\nexport type Theme = 'default' | 'special';\n\nexport interface BackLinkProps<T = HTMLElement> extends Tabbable {\n    url: string;\n    title: React.ReactNode;\n    theme?: Theme;\n    size?: ButtonSize;\n    className?: string;\n    shouldHandleBackAction?: boolean;\n    onClick?: () => void;\n    extraProps?: React.HTMLProps<T>;\n}\n\nexport default function BackLink(props: BackLinkProps) {\n    const {history} = React.useContext(LocationContext);\n    const {\n        url,\n        title,\n        theme = 'default',\n        size = 'l',\n        className,\n        shouldHandleBackAction = false,\n        onClick,\n        tabIndex,\n        extraProps,\n    } = props;\n    const handleAnalytics = useAnalytics(DefaultEventNames.ShareButton, url);\n\n    const backActionHandler = React.useCallback(async () => {\n        handleAnalytics();\n\n        if (!history) {\n            return;\n        }\n\n        if (onClick) {\n            onClick();\n        }\n\n        if (history.length > 1) {\n            history.goBack();\n        } else {\n            history.push({pathname: url});\n        }\n    }, [handleAnalytics, history, onClick, url]);\n\n    const buttonProps = {\n        href: shouldHandleBackAction ? undefined : url,\n        extraProps,\n    } as UIKitButtonProps;\n\n    return (\n        <Button\n            className={className}\n            view={theme === 'special' ? 'flat-contrast' : 'flat-secondary'}\n            size={size}\n            onClick={shouldHandleBackAction ? backActionHandler : undefined}\n            tabIndex={tabIndex}\n            {...buttonProps}\n        >\n            <Icon data={ArrowLeft} size={20} />\n            <span>{title}</span>\n        </Button>\n    );\n}\n"]}
+{"version":3,"file":"BackLink.js","sourceRoot":"../../../../src","sources":["components/BackLink/BackLink.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,SAAS,EAAC,MAAM,mBAAmB,CAAC;AAC5C,OAAO,EAAC,MAAM,EAAc,IAAI,EAAkC,MAAM,mBAAmB,CAAC;AAE5F,OAAO,EAAC,eAAe,EAAC,+CAAsC;AAC9D,OAAO,EAAC,YAAY,EAAC,6BAAoB;AACzC,OAAO,EAAC,iBAAiB,EAAW,8BAAqB;AAezD,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,KAAoB;IACjD,MAAM,EAAC,OAAO,EAAC,GAAG,KAAK,CAAC,UAAU,CAAC,eAAe,CAAC,CAAC;IACpD,MAAM,EACF,GAAG,EACH,KAAK,EACL,KAAK,GAAG,SAAS,EACjB,IAAI,GAAG,GAAG,EACV,SAAS,EACT,sBAAsB,GAAG,KAAK,EAC9B,OAAO,EACP,QAAQ,EACR,UAAU,GACb,GAAG,KAAK,CAAC;IACV,MAAM,eAAe,GAAG,YAAY,CAAC,iBAAiB,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC;IAEzE,MAAM,iBAAiB,GAAG,KAAK,CAAC,WAAW,CAAC,KAAK,IAAI,EAAE;QACnD,eAAe,EAAE,CAAC;QAElB,IAAI,CAAC,OAAO,EAAE,CAAC;YACX,OAAO;QACX,CAAC;QAED,IAAI,OAAO,EAAE,CAAC;YACV,OAAO,EAAE,CAAC;QACd,CAAC;QAED,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACrB,OAAO,CAAC,MAAM,EAAE,CAAC;QACrB,CAAC;aAAM,CAAC;YACJ,OAAO,CAAC,IAAI,CAAC,EAAC,QAAQ,EAAE,GAAG,EAAC,CAAC,CAAC;QAClC,CAAC;IACL,CAAC,EAAE,CAAC,eAAe,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC;IAE7C,MAAM,WAAW,GAAG;QAChB,IAAI,EAAE,sBAAsB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG;QAC9C,UAAU;KACO,CAAC;IAEtB,OAAO,CACH,MAAC,MAAM,IACH,SAAS,EAAE,SAAS,EACpB,IAAI,EAAE,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,gBAAgB,EAC9D,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,sBAAsB,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,EAC/D,QAAQ,EAAE,QAAQ,KACd,WAAW,aAEf,KAAC,IAAI,IAAC,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,EAAE,GAAI,EACnC,yBAAO,KAAK,GAAQ,IACf,CACZ,CAAC;AACN,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {ArrowLeft} from '@gravity-ui/icons';\nimport {Button, ButtonSize, Icon, ButtonProps as UIKitButtonProps} from '@gravity-ui/uikit';\n\nimport {LocationContext} from '../../context/locationContext';\nimport {useAnalytics} from '../../hooks';\nimport {DefaultEventNames, Tabbable} from '../../models';\n\nexport type Theme = 'default' | 'special';\n\nexport interface BackLinkProps<T = HTMLElement> extends Tabbable {\n    url: string;\n    title: React.ReactNode;\n    theme?: Theme;\n    size?: ButtonSize;\n    className?: string;\n    shouldHandleBackAction?: boolean;\n    onClick?: () => void;\n    extraProps?: React.HTMLProps<T>;\n}\n\nexport default function BackLink(props: BackLinkProps) {\n    const {history} = React.useContext(LocationContext);\n    const {\n        url,\n        title,\n        theme = 'default',\n        size = 'l',\n        className,\n        shouldHandleBackAction = false,\n        onClick,\n        tabIndex,\n        extraProps,\n    } = props;\n    const handleAnalytics = useAnalytics(DefaultEventNames.ShareButton, url);\n\n    const backActionHandler = React.useCallback(async () => {\n        handleAnalytics();\n\n        if (!history) {\n            return;\n        }\n\n        if (onClick) {\n            onClick();\n        }\n\n        if (history.length > 1) {\n            history.goBack();\n        } else {\n            history.push({pathname: url});\n        }\n    }, [handleAnalytics, history, onClick, url]);\n\n    const buttonProps = {\n        href: shouldHandleBackAction ? undefined : url,\n        extraProps,\n    } as UIKitButtonProps;\n\n    return (\n        <Button\n            className={className}\n            view={theme === 'special' ? 'flat-contrast' : 'flat-secondary'}\n            size={size}\n            onClick={shouldHandleBackAction ? backActionHandler : undefined}\n            tabIndex={tabIndex}\n            {...buttonProps}\n        >\n            <Icon data={ArrowLeft} size={20} />\n            <span>{title}</span>\n        </Button>\n    );\n}\n"]}

package/build/esm/components/BackgroundImage/BackgroundImage.js

@@ -5,9 +5,9 @@ import './BackgroundImage.css';
 export const qaIdByDefault = 'background-image';
 const b = block('storage-background-image');
 const BackgroundImage = (props) => {
-    const { children, src, desktop, className, imageClassName, style, hide, qa } = props;
+    const { children, src, desktop, className, imageClassName, style, qa } = props;
     const qaAttributes = getQaAttrubutes(qa || qaIdByDefault);
-    return (_jsxs("div", { className: b(null, className), style: style, "data-qa": qa || qaIdByDefault, children: [(src || desktop) && !hide && (_jsx(Image, Object.assign({}, props, { className: b('img', imageClassName), qa: qaAttributes.image }))), children && _jsx("div", { className: b('container'), children: children })] }));
+    return (_jsxs("div", { className: b(null, className), style: style, "data-qa": qa || qaIdByDefault, children: [(src || desktop) && (_jsx(Image, { ...props, className: b('img', imageClassName), qa: qaAttributes.image })), children && _jsx("div", { className: b('container'), children: children })] }));
 };
 export default BackgroundImage;
 //# sourceMappingURL=BackgroundImage.js.map

package/build/esm/components/BackgroundImage/BackgroundImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"BackgroundImage.js","sourceRoot":"../../../../src","sources":["components/BackgroundImage/BackgroundImage.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAC,KAAK,EAAE,eAAe,EAAC,6BAAoB;AACnD,OAAO,KAAK,0BAAuB;AAEnC,OAAO,uBAAuB,CAAC;AAE/B,MAAM,CAAC,MAAM,aAAa,GAAG,kBAAkB,CAAC;AAEhD,MAAM,CAAC,GAAG,KAAK,CAAC,0BAA0B,CAAC,CAAC;AAE5C,MAAM,eAAe,GAAG,CAAC,KAAoD,EAAE,EAAE;IAC7E,MAAM,EAAC,QAAQ,EAAE,GAAG,EAAE,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAC,GAAG,KAAK,CAAC;IACnF,MAAM,YAAY,GAAG,eAAe,CAAC,EAAE,IAAI,aAAa,CAAC,CAAC;IAE1D,OAAO,CACH,eAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,aAAW,EAAE,IAAI,aAAa,aACzE,CAAC,GAAG,IAAI,OAAO,CAAC,IAAI,CAAC,IAAI,IAAI,CAC1B,KAAC,KAAK,oBAAK,KAAK,IAAE,SAAS,EAAE,CAAC,CAAC,KAAK,EAAE,cAAc,CAAC,EAAE,EAAE,EAAE,YAAY,CAAC,KAAK,IAAI,CACpF,EACA,QAAQ,IAAI,cAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,YAAG,QAAQ,GAAO,IAC3D,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {BackgroundImageProps} from '../../models';\nimport {block, getQaAttrubutes} from '../../utils';\nimport Image from '../Image/Image';\n\nimport './BackgroundImage.scss';\n\nexport const qaIdByDefault = 'background-image';\n\nconst b = block('storage-background-image');\n\nconst BackgroundImage = (props: React.PropsWithChildren<BackgroundImageProps>) => {\n    const {children, src, desktop, className, imageClassName, style, hide, qa} = props;\n    const qaAttributes = getQaAttrubutes(qa || qaIdByDefault);\n\n    return (\n        <div className={b(null, className)} style={style} data-qa={qa || qaIdByDefault}>\n            {(src || desktop) && !hide && (\n                <Image {...props} className={b('img', imageClassName)} qa={qaAttributes.image} />\n            )}\n            {children && <div className={b('container')}>{children}</div>}\n        </div>\n    );\n};\n\nexport default BackgroundImage;\n"]}
+{"version":3,"file":"BackgroundImage.js","sourceRoot":"../../../../src","sources":["components/BackgroundImage/BackgroundImage.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAC,KAAK,EAAE,eAAe,EAAC,6BAAoB;AACnD,OAAO,KAAK,0BAAuB;AAEnC,OAAO,uBAAuB,CAAC;AAE/B,MAAM,CAAC,MAAM,aAAa,GAAG,kBAAkB,CAAC;AAEhD,MAAM,CAAC,GAAG,KAAK,CAAC,0BAA0B,CAAC,CAAC;AAE5C,MAAM,eAAe,GAAG,CAAC,KAAoD,EAAE,EAAE;IAC7E,MAAM,EAAC,QAAQ,EAAE,GAAG,EAAE,OAAO,EAAE,SAAS,EAAE,cAAc,EAAE,KAAK,EAAE,EAAE,EAAC,GAAG,KAAK,CAAC;IAC7E,MAAM,YAAY,GAAG,eAAe,CAAC,EAAE,IAAI,aAAa,CAAC,CAAC;IAE1D,OAAO,CACH,eAAK,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,aAAW,EAAE,IAAI,aAAa,aACzE,CAAC,GAAG,IAAI,OAAO,CAAC,IAAI,CACjB,KAAC,KAAK,OAAK,KAAK,EAAE,SAAS,EAAE,CAAC,CAAC,KAAK,EAAE,cAAc,CAAC,EAAE,EAAE,EAAE,YAAY,CAAC,KAAK,GAAI,CACpF,EACA,QAAQ,IAAI,cAAK,SAAS,EAAE,CAAC,CAAC,WAAW,CAAC,YAAG,QAAQ,GAAO,IAC3D,CACT,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {BackgroundImageProps} from '../../models';\nimport {block, getQaAttrubutes} from '../../utils';\nimport Image from '../Image/Image';\n\nimport './BackgroundImage.scss';\n\nexport const qaIdByDefault = 'background-image';\n\nconst b = block('storage-background-image');\n\nconst BackgroundImage = (props: React.PropsWithChildren<BackgroundImageProps>) => {\n    const {children, src, desktop, className, imageClassName, style, qa} = props;\n    const qaAttributes = getQaAttrubutes(qa || qaIdByDefault);\n\n    return (\n        <div className={b(null, className)} style={style} data-qa={qa || qaIdByDefault}>\n            {(src || desktop) && (\n                <Image {...props} className={b('img', imageClassName)} qa={qaAttributes.image} />\n            )}\n            {children && <div className={b('container')}>{children}</div>}\n        </div>\n    );\n};\n\nexport default BackgroundImage;\n"]}

package/build/esm/components/BackgroundMedia/BackgroundMedia.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 import { jsx as _jsx } from "react/jsx-runtime";
 import * as React from 'react';
 import { MobileContext } from "../../context/mobileContext/index.js";
@@ -7,14 +6,14 @@ import AnimateBlock from "../AnimateBlock/AnimateBlock.js";
 import Media from "../Media/Media.js";
 import './BackgroundMedia.css';
 const b = block('BackgroundMedia');
-const BackgroundMedia = (_a) => {
-    var { className, color, animated, parallax = true, video, mediaClassName, fullWidthMedia, qa } = _a, props = __rest(_a, ["className", "color", "animated", "parallax", "video", "mediaClassName", "fullWidthMedia", "qa"]);
+const BackgroundMedia = ({ className, color, animated, parallax = true, video, mediaClassName, fullWidthMedia, qa, ...props }) => {
     const isMobile = React.useContext(MobileContext);
     const qaAttributes = getQaAttrubutes(qa, 'media');
-    return (_jsx(AnimateBlock, { className: b(null, className), style: { backgroundColor: color }, animate: animated, qa: qaAttributes.animate, children: _jsx(Media, Object.assign({ className: b('media', { 'full-width-media': fullWidthMedia }, mediaClassName), imageClassName: b('image'), videoClassName: b('video'), isBackground: true, qa: qaAttributes.media, height: 720,
+    return (_jsx(AnimateBlock, { className: b(null, className), style: { backgroundColor: color }, animate: animated, qa: qaAttributes.animate, children: _jsx(Media, { className: b('media', { 'full-width-media': fullWidthMedia }, mediaClassName), imageClassName: b('image'), videoClassName: b('video'), isBackground: true, qa: qaAttributes.media, height: 720,
             color,
             parallax,
-            video: isMobile ? undefined : video }, props)) }));
+            video: isMobile ? undefined : video,
+            ...props }) }));
 };
 export default BackgroundMedia;
 //# sourceMappingURL=BackgroundMedia.js.map

package/build/esm/components/BackgroundMedia/BackgroundMedia.js.map

@@ -1 +1 @@
-{"version":3,"file":"BackgroundMedia.js","sourceRoot":"../../../../src","sources":["components/BackgroundMedia/BackgroundMedia.tsx"],"names":[],"mappings":";;AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,aAAa,EAAC,6CAAoC;AAE1D,OAAO,EAAC,KAAK,EAAE,eAAe,EAAC,6BAAoB;AACnD,OAAO,YAAY,wCAAqC;AACxD,OAAO,KAAK,0BAAuB;AAEnC,OAAO,uBAAuB,CAAC;AAE/B,MAAM,CAAC,GAAG,KAAK,CAAC,iBAAiB,CAAC,CAAC;AAEnC,MAAM,eAAe,GAAG,CAAC,EAUF,EAAE,EAAE;QAVF,EACrB,SAAS,EACT,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,IAAI,EACf,KAAK,EACL,cAAc,EACd,cAAc,EACd,EAAE,OAEiB,EADhB,KAAK,cATa,iGAUxB,CADW;IAER,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;IACjD,MAAM,YAAY,GAAG,eAAe,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC;IAElD,OAAO,CACH,KAAC,YAAY,IACT,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAC7B,KAAK,EAAE,EAAC,eAAe,EAAE,KAAK,EAAC,EAC/B,OAAO,EAAE,QAAQ,EACjB,EAAE,EAAE,YAAY,CAAC,OAAO,YAExB,KAAC,KAAK,kBACF,SAAS,EAAE,CAAC,CAAC,OAAO,EAAE,EAAC,kBAAkB,EAAE,cAAc,EAAC,EAAE,cAAc,CAAC,EAC3E,cAAc,EAAE,CAAC,CAAC,OAAO,CAAC,EAC1B,cAAc,EAAE,CAAC,CAAC,OAAO,CAAC,EAC1B,YAAY,EAAE,IAAI,EAClB,EAAE,EAAE,YAAY,CAAC,KAAK,EAElB,MAAM,EAAE,GAAG;YACX,KAAK;YACL,QAAQ;YACR,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,IAChC,KAAK,EAEd,GACS,CAClB,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {MobileContext} from '../../context/mobileContext';\nimport {BackgroundMediaProps} from '../../models';\nimport {block, getQaAttrubutes} from '../../utils';\nimport AnimateBlock from '../AnimateBlock/AnimateBlock';\nimport Media from '../Media/Media';\n\nimport './BackgroundMedia.scss';\n\nconst b = block('BackgroundMedia');\n\nconst BackgroundMedia = ({\n    className,\n    color,\n    animated,\n    parallax = true,\n    video,\n    mediaClassName,\n    fullWidthMedia,\n    qa,\n    ...props\n}: BackgroundMediaProps) => {\n    const isMobile = React.useContext(MobileContext);\n    const qaAttributes = getQaAttrubutes(qa, 'media');\n\n    return (\n        <AnimateBlock\n            className={b(null, className)}\n            style={{backgroundColor: color}}\n            animate={animated}\n            qa={qaAttributes.animate}\n        >\n            <Media\n                className={b('media', {'full-width-media': fullWidthMedia}, mediaClassName)}\n                imageClassName={b('image')}\n                videoClassName={b('video')}\n                isBackground={true}\n                qa={qaAttributes.media}\n                {...{\n                    height: 720,\n                    color,\n                    parallax,\n                    video: isMobile ? undefined : video,\n                    ...props,\n                }}\n            />\n        </AnimateBlock>\n    );\n};\n\nexport default BackgroundMedia;\n"]}
+{"version":3,"file":"BackgroundMedia.js","sourceRoot":"../../../../src","sources":["components/BackgroundMedia/BackgroundMedia.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAC,aAAa,EAAC,6CAAoC;AAE1D,OAAO,EAAC,KAAK,EAAE,eAAe,EAAC,6BAAoB;AACnD,OAAO,YAAY,wCAAqC;AACxD,OAAO,KAAK,0BAAuB;AAEnC,OAAO,uBAAuB,CAAC;AAE/B,MAAM,CAAC,GAAG,KAAK,CAAC,iBAAiB,CAAC,CAAC;AAEnC,MAAM,eAAe,GAAG,CAAC,EACrB,SAAS,EACT,KAAK,EACL,QAAQ,EACR,QAAQ,GAAG,IAAI,EACf,KAAK,EACL,cAAc,EACd,cAAc,EACd,EAAE,EACF,GAAG,KAAK,EACW,EAAE,EAAE;IACvB,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,CAAC;IACjD,MAAM,YAAY,GAAG,eAAe,CAAC,EAAE,EAAE,OAAO,CAAC,CAAC;IAElD,OAAO,CACH,KAAC,YAAY,IACT,SAAS,EAAE,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,EAC7B,KAAK,EAAE,EAAC,eAAe,EAAE,KAAK,EAAC,EAC/B,OAAO,EAAE,QAAQ,EACjB,EAAE,EAAE,YAAY,CAAC,OAAO,YAExB,KAAC,KAAK,IACF,SAAS,EAAE,CAAC,CAAC,OAAO,EAAE,EAAC,kBAAkB,EAAE,cAAc,EAAC,EAAE,cAAc,CAAC,EAC3E,cAAc,EAAE,CAAC,CAAC,OAAO,CAAC,EAC1B,cAAc,EAAE,CAAC,CAAC,OAAO,CAAC,EAC1B,YAAY,EAAE,IAAI,EAClB,EAAE,EAAE,YAAY,CAAC,KAAK,EAElB,MAAM,EAAE,GAAG;YACX,KAAK;YACL,QAAQ;YACR,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK;YACnC,GAAG,KAAK,GAEd,GACS,CAClB,CAAC;AACN,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC","sourcesContent":["import * as React from 'react';\n\nimport {MobileContext} from '../../context/mobileContext';\nimport {BackgroundMediaProps} from '../../models';\nimport {block, getQaAttrubutes} from '../../utils';\nimport AnimateBlock from '../AnimateBlock/AnimateBlock';\nimport Media from '../Media/Media';\n\nimport './BackgroundMedia.scss';\n\nconst b = block('BackgroundMedia');\n\nconst BackgroundMedia = ({\n    className,\n    color,\n    animated,\n    parallax = true,\n    video,\n    mediaClassName,\n    fullWidthMedia,\n    qa,\n    ...props\n}: BackgroundMediaProps) => {\n    const isMobile = React.useContext(MobileContext);\n    const qaAttributes = getQaAttrubutes(qa, 'media');\n\n    return (\n        <AnimateBlock\n            className={b(null, className)}\n            style={{backgroundColor: color}}\n            animate={animated}\n            qa={qaAttributes.animate}\n        >\n            <Media\n                className={b('media', {'full-width-media': fullWidthMedia}, mediaClassName)}\n                imageClassName={b('image')}\n                videoClassName={b('video')}\n                isBackground={true}\n                qa={qaAttributes.media}\n                {...{\n                    height: 720,\n                    color,\n                    parallax,\n                    video: isMobile ? undefined : video,\n                    ...props,\n                }}\n            />\n        </AnimateBlock>\n    );\n};\n\nexport default BackgroundMedia;\n"]}

package/build/esm/components/BalancedMasonry/BalancedMasonry.js

@@ -22,7 +22,7 @@ const BalancedMasonry = (props) => {
         }
         for (const [rawWidth, columnCount] of breakpoints) {
             const width = Number(rawWidth);
-            if ((document === null || document === void 0 ? void 0 : document.body.clientWidth) <= width) {
+            if (document?.body.clientWidth <= width) {
                 result = columnCount;
             }
         }

package/build/esm/components/BalancedMasonry/BalancedMasonry.js.map

@@ -1 +1 @@
-{"version":3,"file":"BalancedMasonry.js","sourceRoot":"../../../../src","sources":["components/BalancedMasonry/BalancedMasonry.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport debounce from 'lodash/debounce';\nimport first from 'lodash/first';\nimport minBy from 'lodash/minBy';\n\nimport {SSRContext} from '../../context/ssrContext';\nimport {QAProps} from '../../models';\nimport {block, getQaAttrubutes} from '../../utils';\n\nimport './BalancedMasonry.scss';\n\nconst b = block('BalancedMasonry');\n\nexport interface BalancedMasonryProps extends QAProps {\n    className: string;\n    columnClassName: string;\n    children: React.ReactNode[];\n    breakpointCols: {\n        [key: number]: number;\n    };\n}\n\nconst BalancedMasonry = (props: React.PropsWithChildren<BalancedMasonryProps>) => {\n    const {className, columnClassName, children = [], breakpointCols, qa} = props;\n    const qaAttributes = getQaAttrubutes(qa, 'column');\n    const {isServer} = React.useContext(SSRContext);\n    const getCurrentColumnsCount = React.useCallback(() => {\n        const breakpoints = Object.entries(breakpointCols).sort(\n            ([firstBreakpoint], [secondBreakpoint]) => {\n                return Number(secondBreakpoint) - Number(firstBreakpoint);\n            },\n        );\n\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        let [, result] = first(breakpoints)!;\n\n        if (isServer) {\n            return result;\n        }\n\n        for (const [rawWidth, columnCount] of breakpoints) {\n            const width = Number(rawWidth);\n\n            if (document?.body.clientWidth <= width) {\n                result = columnCount;\n            }\n        }\n\n        return result;\n    }, [breakpointCols, isServer]);\n\n    const [columnCount, setColumnCount] = React.useState(getCurrentColumnsCount());\n    const [columns, setColumns] = React.useState<React.ReactNode[][]>([]);\n    const containerRef = React.useRef<HTMLDivElement>(null);\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    const balanceColumns = React.useCallback(\n        debounce(() => {\n            if (!containerRef.current) {\n                return;\n            }\n\n            const localColumns: React.ReactNode[][] = [];\n            const columnsMeta = [];\n\n            for (let i = 0; i < columnCount; i++) {\n                columnsMeta.push({id: i, height: 0});\n                localColumns.push([]);\n            }\n\n            for (let i = 0; i < containerRef.current.children.length; i++) {\n                const node = containerRef.current.children.item(i) as HTMLElement | null;\n\n                if (!node) {\n                    continue;\n                }\n\n                const minColumn = minBy(columnsMeta, 'height') || {id: 0, height: 0};\n                const {id: columnId} = minColumn;\n\n                localColumns[columnId].push(children[i]);\n\n                minColumn.height += node.offsetHeight;\n            }\n\n            setColumns(localColumns);\n        }, 300),\n        [children, columnCount],\n    );\n\n    React.useEffect(() => {\n        balanceColumns();\n    }, [balanceColumns, children, columnCount]);\n\n    React.useEffect(() => {\n        const updateColumnCounter = () => setColumnCount(getCurrentColumnsCount());\n\n        window.addEventListener('resize', updateColumnCounter, {passive: true});\n        return () => window.removeEventListener('resize', updateColumnCounter);\n    }, [setColumnCount, columns, getCurrentColumnsCount]);\n\n    React.useEffect(() => {\n        const currentRef = containerRef.current;\n        const isResizeEventsSupported = 'ResizeObserver' in window;\n\n        if (!currentRef || !isResizeEventsSupported) {\n            return () => {};\n        }\n\n        const observer = new ResizeObserver(balanceColumns);\n\n        for (let i = 0; i < currentRef.children.length; i++) {\n            const node = currentRef.children.item(i) as HTMLElement | null;\n\n            if (!node) {\n                continue;\n            }\n\n            observer.observe(node);\n        }\n\n        return () => observer.disconnect();\n    }, [balanceColumns, children]);\n\n    return (\n        <div className={b(null, className)} data-qa={qa}>\n            <div className={b('hidden-container')} style={{width: `${100 / columnCount}%`}}>\n                <div ref={containerRef} className={b('hidden-list')}>\n                    {children}\n                </div>\n            </div>\n\n            {columns.map((columnElements, index) => (\n                <div\n                    key={index}\n                    className={columnClassName}\n                    style={{width: `${100 / columnCount}%`}}\n                    data-qa={qaAttributes.column}\n                >\n                    {columnElements}\n                </div>\n            ))}\n        </div>\n    );\n};\n\nexport default BalancedMasonry;\n"]}
+{"version":3,"file":"BalancedMasonry.js","sourceRoot":"../../../../src","sources":["components/BalancedMasonry/BalancedMasonry.tsx"],"names":[],"mappings":"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","sourcesContent":["import * as React from 'react';\n\nimport debounce from 'lodash/debounce';\nimport first from 'lodash/first';\nimport minBy from 'lodash/minBy';\n\nimport {SSRContext} from '../../context/ssrContext';\nimport {QAProps} from '../../models';\nimport {block, getQaAttrubutes} from '../../utils';\n\nimport './BalancedMasonry.scss';\n\nconst b = block('BalancedMasonry');\n\nexport interface BalancedMasonryProps extends QAProps {\n    className: string;\n    columnClassName: string;\n    children: React.ReactNode[];\n    breakpointCols: {\n        [key: number]: number;\n    };\n}\n\nconst BalancedMasonry = (props: React.PropsWithChildren<BalancedMasonryProps>) => {\n    const {className, columnClassName, children = [], breakpointCols, qa} = props;\n    const qaAttributes = getQaAttrubutes(qa, 'column');\n    const {isServer} = React.useContext(SSRContext);\n    const getCurrentColumnsCount = React.useCallback(() => {\n        const breakpoints = Object.entries(breakpointCols).sort(\n            ([firstBreakpoint], [secondBreakpoint]) => {\n                return Number(secondBreakpoint) - Number(firstBreakpoint);\n            },\n        );\n\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion\n        let [, result] = first(breakpoints)!;\n\n        if (isServer) {\n            return result;\n        }\n\n        for (const [rawWidth, columnCount] of breakpoints) {\n            const width = Number(rawWidth);\n\n            if (document?.body.clientWidth <= width) {\n                result = columnCount;\n            }\n        }\n\n        return result;\n    }, [breakpointCols, isServer]);\n\n    const [columnCount, setColumnCount] = React.useState(getCurrentColumnsCount());\n    const [columns, setColumns] = React.useState<React.ReactNode[][]>([]);\n    const containerRef = React.useRef<HTMLDivElement>(null);\n\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    const balanceColumns = React.useCallback(\n        debounce(() => {\n            if (!containerRef.current) {\n                return;\n            }\n\n            const localColumns: React.ReactNode[][] = [];\n            const columnsMeta = [];\n\n            for (let i = 0; i < columnCount; i++) {\n                columnsMeta.push({id: i, height: 0});\n                localColumns.push([]);\n            }\n\n            for (let i = 0; i < containerRef.current.children.length; i++) {\n                const node = containerRef.current.children.item(i) as HTMLElement | null;\n\n                if (!node) {\n                    continue;\n                }\n\n                const minColumn = minBy(columnsMeta, 'height') || {id: 0, height: 0};\n                const {id: columnId} = minColumn;\n\n                localColumns[columnId].push(children[i]);\n\n                minColumn.height += node.offsetHeight;\n            }\n\n            setColumns(localColumns);\n        }, 300),\n        [children, columnCount],\n    );\n\n    React.useEffect(() => {\n        balanceColumns();\n    }, [balanceColumns, children, columnCount]);\n\n    React.useEffect(() => {\n        const updateColumnCounter = () => setColumnCount(getCurrentColumnsCount());\n\n        window.addEventListener('resize', updateColumnCounter, {passive: true});\n        return () => window.removeEventListener('resize', updateColumnCounter);\n    }, [setColumnCount, columns, getCurrentColumnsCount]);\n\n    React.useEffect(() => {\n        const currentRef = containerRef.current;\n        const isResizeEventsSupported = 'ResizeObserver' in window;\n\n        if (!currentRef || !isResizeEventsSupported) {\n            return () => {};\n        }\n\n        const observer = new ResizeObserver(balanceColumns);\n\n        for (let i = 0; i < currentRef.children.length; i++) {\n            const node = currentRef.children.item(i) as HTMLElement | null;\n\n            if (!node) {\n                continue;\n            }\n\n            observer.observe(node);\n        }\n\n        return () => observer.disconnect();\n    }, [balanceColumns, children]);\n\n    return (\n        <div className={b(null, className)} data-qa={qa}>\n            <div className={b('hidden-container')} style={{width: `${100 / columnCount}%`}}>\n                <div ref={containerRef} className={b('hidden-list')}>\n                    {children}\n                </div>\n            </div>\n\n            {columns.map((columnElements, index) => (\n                <div\n                    key={index}\n                    className={columnClassName}\n                    style={{width: `${100 / columnCount}%`}}\n                    data-qa={qaAttributes.column}\n                >\n                    {columnElements}\n                </div>\n            ))}\n        </div>\n    );\n};\n\nexport default BalancedMasonry;\n"]}

package/build/esm/components/Button/Button.d.ts

@@ -3,6 +3,7 @@ import { ButtonProps as ButtonParams, QAProps } from "../../models/index.js";
 import './Button.css';
 export interface ButtonProps extends Omit<ButtonParams, 'url'>, QAProps {
     className?: string;
+    id?: string;
     url?: string;
     onClick?: React.MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>;
 }

package/build/esm/components/Button/Button.js

@@ -1,4 +1,3 @@
-import { __rest } from "tslib";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from 'react';
 import { StoreBadge } from '@gravity-ui/components';
@@ -15,7 +14,7 @@ const b = block('button-block');
 // eslint-disable-next-line complexity
 const Button = (props) => {
     const { tld } = React.useContext(LocaleContext);
-    const { className, analyticsEvents, size = 'l', theme = 'normal', url, urlTitle, img, onClick: onClickOrigin, text, width } = props, rest = __rest(props, ["className", "analyticsEvents", "size", "theme", "url", "urlTitle", "img", "onClick", "text", "width"]);
+    const { className, analyticsEvents, size = 'l', theme = 'normal', url, urlTitle, img, onClick: onClickOrigin, text, width, ...rest } = props;
     const defaultImgPosition = 'left';
     const handleAnalytics = useAnalytics(DefaultEventNames.Button, url);
     const onClick = React.useCallback((e) => {
@@ -29,9 +28,13 @@ const Button = (props) => {
         ? { url: img.url, position: img.position || defaultImgPosition, alt: img.alt }
         : { url: img, position: defaultImgPosition };
     const buttonClass = img
-        ? b(Object.assign({ position: buttonImg.position }, buttonModifiers), className)
-        : b(Object.assign({}, buttonModifiers), className);
-    const buttonProps = Object.assign(Object.assign({}, rest), { href: url ? setUrlTld(url, tld) : undefined, onClick });
+        ? b({ position: buttonImg.position, ...buttonModifiers }, className)
+        : b({ ...buttonModifiers }, className);
+    const buttonProps = {
+        ...rest,
+        href: url ? setUrlTld(url, tld) : undefined,
+        onClick,
+    };
     if (theme === 'app-store' || theme === 'google-play') {
         const platform = theme === 'app-store' ? Platform.IOS : Platform.ANDROID;
         return _jsx(StoreBadge, { className: buttonClass, platform: platform, href: url });
@@ -43,7 +46,7 @@ const Button = (props) => {
         image = undefined;
     }
     const buttonTheme = theme === 'scale' ? 'accent' : theme;
-    return (_jsxs(CommonButton, Object.assign({ className: buttonClass, view: toCommonView(buttonTheme), size: toCommonSize(size), title: urlTitle, width: width }, buttonProps, { children: [icon && buttonImg.position === 'left' ? icon : null, _jsxs("span", { className: b('content'), children: [image && buttonImg.position === 'left' ? image : null, _jsx("span", { className: b('text'), children: text }), image && buttonImg.position === 'right' ? image : null] }), icon && buttonImg.position === 'right' ? icon : null] })));
+    return (_jsxs(CommonButton, { className: buttonClass, view: toCommonView(buttonTheme), size: toCommonSize(size), title: urlTitle, width: width, ...buttonProps, children: [icon && buttonImg.position === 'left' ? icon : null, _jsxs("span", { className: b('content'), children: [image && buttonImg.position === 'left' ? image : null, _jsx("span", { className: b('text'), children: text }), image && buttonImg.position === 'right' ? image : null] }), icon && buttonImg.position === 'right' ? icon : null] }));
 };
 export default Button;
 //# sourceMappingURL=Button.js.map